/*
 * Tema COREX (24/10/2026) — pedido do usuário: "tirar a cara do sistema legado" em TODAS as telas.
 * As telas herdadas do SIGEMP são desenhadas a partir do DFM com posição, tamanho e cores fixos no style de cada componente
 * (fundos cinza #C0C0C0/#D7D7D7/#E9E9E9…, bordas em relevo, texto #3c0080). Este tema troca SÓ a aparência — cor, borda, canto,
 * sombra — e nunca posição ou tamanho, para nada sair do lugar. Vale com a classe cx-tema no <html> (partials/head.ejs);
 * ?tema=classico na URL mostra a cara antiga. As cores fixas do DFM são trocadas pelo atributo style (por isso o !important).
 */
:root {
  --cx-bg: #f5f3fa;
  --cx-card: #ffffff;
  --cx-linha: #e6e0f1;
  --cx-linha2: #d6cde8;
  --cx-tinta: #261c3a;
  --cx-suave: #6b6480;
  --cx-roxo: #6d28d9;
  --cx-roxo-esc: #5b21b6;
  --cx-lilas: #f3effd;
  --cx-sel: #ede9fe;
}

/* ---------------------------------------------------------------- moldura: fundo, menu, topo e título da tela */
html.cx-tema .erp { background: var(--cx-bg); color: var(--cx-tinta); font-family: "Segoe UI", system-ui, -apple-system, Arial, sans-serif; }
html.cx-tema .erp-menu { background: #fff; border-bottom: 1px solid var(--cx-linha); }
html.cx-tema .erp-menu .mi:hover, html.cx-tema .erp-menu .mi-wrap:hover > .mi { background: var(--cx-lilas); color: var(--cx-roxo-esc); border-radius: 6px; }
html.cx-tema .cx-topo { background: #fff; border-bottom: 1px solid var(--cx-linha); }
html.cx-tema .cx-user { background: var(--cx-lilas); }
html.cx-tema .cx-user:hover, html.cx-tema .cx-user[aria-expanded="true"] { background: var(--cx-sel); }
html.cx-tema .erp-modtab { background: transparent; padding: 4px 14px 0; } /* mesma altura da aba antiga: a tela não perde espaço */
html.cx-tema .modtab, html.cx-tema .modtab.active { background: none; border: 0; padding: 0; border-radius: 0;
  font: 700 17px/23px "Segoe UI", system-ui, Arial, sans-serif; color: var(--cx-tinta); letter-spacing: -.01em; }

/* ---------------------------------------------------------------- formulário (DFM) */
html.cx-tema .pe-form { background: transparent !important; }
html.cx-tema .pe-form :is([style*="color:#3c0080"], [style*="color: rgb(60, 0, 128)"]) { color: var(--cx-tinta) !important; }

/* painéis cinza → cartões brancos; o relevo do Windows vira borda fina */
html.cx-tema .pe-panel:is(:is([style*="background:#C0C0C0"], [style*="background: rgb(192, 192, 192)"]), :is([style*="background:#D7D7D7"], [style*="background: rgb(215, 215, 215)"]), :is([style*="background:#E9E9E9"], [style*="background: rgb(233, 233, 233)"]), :is([style*="background:#F0F0F0"], [style*="background: rgb(240, 240, 240)"]),
  :is([style*="background:#DFDFDF"], [style*="background: rgb(223, 223, 223)"]), :is([style*="background:#D6D6D6"], [style*="background: rgb(214, 214, 214)"]), :is([style*="background:#E2E2E2"], [style*="background: rgb(226, 226, 226)"]), :is([style*="background:#D5D5D5"], [style*="background: rgb(213, 213, 213)"]), :is([style*="background:#CFCFCF"], [style*="background: rgb(207, 207, 207)"]),
  :is([style*="background:#F5F5F5"], [style*="background: rgb(245, 245, 245)"]), :is([style*="background:#F7F7F7"], [style*="background: rgb(247, 247, 247)"]), :is([style*="background:#DDDDDD"], [style*="background: rgb(221, 221, 221)"]), :is([style*="background:#E1E1E1"], [style*="background: rgb(225, 225, 225)"]), :is([style*="background:#DBDBDB"], [style*="background: rgb(219, 219, 219)"]),
  :is([style*="background:#EBEBEB"], [style*="background: rgb(235, 235, 235)"]), :is([style*="background:#808080"], [style*="background: rgb(128, 128, 128)"]), :is([style*="background:#A2A2A2"], [style*="background: rgb(162, 162, 162)"]), :is([style*="background:#FFFFFF"], [style*="background: rgb(255, 255, 255)"])) {
  background: var(--cx-card) !important;
}
html.cx-tema .pe-panel { border: 1px solid var(--cx-linha); border-radius: 10px; }
html.cx-tema .pe-panel[data-bevel="bvLowered"] { border-color: var(--cx-linha); }
html.cx-tema .pe-panel[data-bevel="bvNone"] { border: 0; }
/* painel escuro (totais em destaque) */
html.cx-tema .pe-panel:is([style*="background:#000000"], [style*="background: rgb(0, 0, 0)"]) { background: #241640 !important; border-color: #241640; }
/* faixas de título roxas (ex.: "Itens do Pedido") → faixa lilás com texto roxo */
html.cx-tema .pe-form :is(.pe-panel, .pe-label):is(:is([style*="background:#5A00C0"], [style*="background: rgb(90, 0, 192)"]), :is([style*="background:#5b21b6"], [style*="background: rgb(91, 33, 182)"])) {
  background: var(--cx-lilas) !important; color: var(--cx-roxo-esc) !important; border-color: var(--cx-linha) !important; }
html.cx-tema .pe-form :is(:is([style*="background:#5A00C0"], [style*="background: rgb(90, 0, 192)"]), :is([style*="background:#5b21b6"], [style*="background: rgb(91, 33, 182)"])) * { color: var(--cx-roxo-esc) !important; }
html.cx-tema .pe-form :is([style*="background:#b9a3ec"], [style*="background: rgb(185, 163, 236)"]) { background: #efeafc !important; }
/* rótulos, caixas de marcar e opções com fundo cinza → sem fundo (ficam sobre o cartão) */
html.cx-tema .pe-form :is(.pe-label, .pe-checkbox, .pe-radiobutton, .pe-image):is(:is([style*="background:#C0C0C0"], [style*="background: rgb(192, 192, 192)"]), :is([style*="background:#D7D7D7"], [style*="background: rgb(215, 215, 215)"]),
  :is([style*="background:#E9E9E9"], [style*="background: rgb(233, 233, 233)"]), :is([style*="background:#F0F0F0"], [style*="background: rgb(240, 240, 240)"]), :is([style*="background:#DFDFDF"], [style*="background: rgb(223, 223, 223)"]), :is([style*="background:#D6D6D6"], [style*="background: rgb(214, 214, 214)"]), :is([style*="background:#E2E2E2"], [style*="background: rgb(226, 226, 226)"]),
  :is([style*="background:#D5D5D5"], [style*="background: rgb(213, 213, 213)"]), :is([style*="background:#CFCFCF"], [style*="background: rgb(207, 207, 207)"]), :is([style*="background:#F5F5F5"], [style*="background: rgb(245, 245, 245)"]), :is([style*="background:#F7F7F7"], [style*="background: rgb(247, 247, 247)"]), :is([style*="background:#DDDDDD"], [style*="background: rgb(221, 221, 221)"]),
  :is([style*="background:#E1E1E1"], [style*="background: rgb(225, 225, 225)"]), :is([style*="background:#DBDBDB"], [style*="background: rgb(219, 219, 219)"]), :is([style*="background:#EBEBEB"], [style*="background: rgb(235, 235, 235)"])) {
  background: transparent !important;
}
html.cx-tema .pe-form :is(.pe-checkbox, .pe-radiobutton) input { accent-color: var(--cx-roxo); }

/* grupos e abas */
html.cx-tema .pe-groupbox { border: 1px solid var(--cx-linha); border-radius: 10px; background: var(--cx-card) !important; }
html.cx-tema .pe-leg { background: var(--cx-card) !important; color: var(--cx-roxo-esc) !important; font-weight: 600; padding: 0 5px; }
html.cx-tema .pe-pagecontrol { background: var(--cx-card) !important; border: 0; box-shadow: 0 0 0 1px var(--cx-linha); border-radius: 10px; } /* contorno sem ocupar espaço: o conteúdo não anda */
html.cx-tema .pe-aba { border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--cx-suave); border-radius: 6px 6px 0 0;
  font-family: "Segoe UI", system-ui, Arial, sans-serif; font-weight: 600; }
html.cx-tema .pe-aba:hover { color: var(--cx-roxo-esc); background: var(--cx-lilas); }
html.cx-tema .pe-aba.on { background: transparent; color: var(--cx-roxo-esc); border-bottom-color: var(--cx-roxo); }
html.cx-tema .pe-tabsheet { background: transparent !important; }

/* campos */
html.cx-tema :is(.pe-maskedit, .pe-edit, .pe-datetimepicker, .pe-combobox, .pe-memo, .pe-listbox, .pe-dbtext) {
  border: 1px solid var(--cx-linha2) !important; border-radius: 6px; background-color: #fff; }
html.cx-tema :is(.pe-maskedit, .pe-edit, .pe-datetimepicker, .pe-combobox, .pe-memo):focus { border-color: var(--cx-roxo) !important; box-shadow: 0 0 0 3px rgba(124, 58, 237, .16); outline: 0; }
/* campo só de leitura (o SIGEMP pintava de cinza) */
html.cx-tema :is(.pe-maskedit, .pe-edit, .pe-dbtext, .pe-combobox):is([style*="background:#C0C0C0"], [style*="background: rgb(192, 192, 192)"]) { background: #f6f3fb !important; color: var(--cx-tinta) !important; }
html.cx-tema .pe-listbox > div.sel { background: var(--cx-sel); color: var(--cx-tinta); }

/* botões */
html.cx-tema .pe-bitbtn { background: #fff !important; border: 1px solid var(--cx-linha2); border-radius: 8px; color: var(--cx-roxo-esc) !important; font-weight: 600;
  box-shadow: 0 1px 2px rgba(40, 10, 90, .06); transition: background .12s, border-color .12s; }
html.cx-tema .pe-bitbtn:hover:not([disabled]) { background: var(--cx-lilas) !important; border-color: #c4b5fd; }
html.cx-tema .pe-bitbtn[disabled] { color: #b1aac0 !important; background: #faf9fc !important; box-shadow: none; }
html.cx-tema .pe-speedbutton { background: #fff !important; border: 1px solid var(--cx-linha2); border-radius: 6px; color: var(--cx-roxo-esc) !important; }
html.cx-tema .pe-speedbutton:hover { background: var(--cx-lilas) !important; }

/* grades */
html.cx-tema :is(.pe-dbgrid, .pe-stringgrid) { border: 1px solid var(--cx-linha); border-radius: 10px; background: #fff !important; }
html.cx-tema .pe-grid th { background: #f7f5fc; color: var(--cx-roxo-esc); font-weight: 600; border: 0; border-bottom: 1px solid var(--cx-linha); border-right: 1px solid #efeaf7; }
html.cx-tema .pe-grid td { border: 0; border-bottom: 1px solid #f0ecf6; border-right: 1px solid #f5f2fa; }
html.cx-tema .pe-grid tbody tr.sel td { background: var(--cx-sel); color: var(--cx-tinta); box-shadow: inset 0 0 0 9999px rgba(124, 58, 237, .06); }

/* mensagens e janelas */
html.cx-tema .pe-dlg-ov, html.cx-tema .pe-modal-ov { background: rgba(28, 12, 58, .35); }
html.cx-tema .pe-dlg { background: #fff; border: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 22px 60px rgba(28, 12, 58, .35); }
html.cx-tema .pe-dlg-t { background: linear-gradient(90deg, #6d28d9, #8b5cf6); padding: 10px 16px; font: 600 13.5px "Segoe UI", system-ui, Arial, sans-serif; }
html.cx-tema .pe-dlg-b { color: var(--cx-tinta); }
html.cx-tema .pe-dlg-f { padding: 10px 16px 14px; }
html.cx-tema .pe-dlg-f button { height: 34px; padding: 0 16px; border: 1px solid var(--cx-linha2); border-radius: 9px; background: #fff; color: var(--cx-roxo-esc);
  font: 600 13px "Segoe UI", system-ui, Arial, sans-serif; cursor: pointer; }
html.cx-tema .pe-dlg-f button:first-child { background: var(--cx-roxo); border-color: var(--cx-roxo); color: #fff; }
html.cx-tema .pe-dlg-f button:hover { filter: brightness(.97); }
html.cx-tema .pe-modal { background: #fff; border: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 22px 60px rgba(28, 12, 58, .35); }
html.cx-tema .pe-modal-t { background: linear-gradient(90deg, #6d28d9, #8b5cf6); color: #fff; border-bottom: 0; font-weight: 600; }
html.cx-tema .pe-modal-x { border-radius: 6px; }
html.cx-tema .pe-pop { background: #fff; border: 1px solid var(--cx-linha); border-radius: 10px; padding: 4px; box-shadow: 0 14px 34px rgba(42, 15, 107, .2); }
html.cx-tema .pe-pop div { border-radius: 6px; }
html.cx-tema .pe-pop div:hover { background: var(--cx-lilas); }

/* ---------------------------------------------------------------- telas de lista (motor genérico) */
html.cx-tema :is(.erp-filtros, .erp-pesq) { background: #fff; border-color: var(--cx-linha); }
html.cx-tema .erp-filtros { border-radius: 10px 10px 0 0; }
html.cx-tema .erp-pesq { border-radius: 0 0 10px 10px; }
html.cx-tema :is(.erp-pesq input[type=text], .erp-pesq .erp-mini) { border: 1px solid var(--cx-linha2); border-radius: 6px; }
html.cx-tema .erp-btn { background: #fff; border: 1px solid var(--cx-linha2); border-radius: 8px; color: var(--cx-roxo-esc); }
html.cx-tema .erp-btn:hover { background: var(--cx-lilas); border-color: #c4b5fd; }
html.cx-tema .erp-subtabs { border-bottom-color: var(--cx-linha); }
html.cx-tema .erp-subtabs .st { background: transparent; border: 0; border-bottom: 2px solid transparent; color: var(--cx-suave); font-weight: 600; }
html.cx-tema .erp-subtabs .st.active { background: transparent; color: var(--cx-roxo-esc); border-bottom-color: var(--cx-roxo); top: 0; }
html.cx-tema .erp-grid-wrap { border-color: var(--cx-linha); border-radius: 10px; }
html.cx-tema .erp-grid th { background: #f7f5fc; color: var(--cx-roxo-esc); border-color: var(--cx-linha); font-weight: 600; }
html.cx-tema .erp-grid td { border-color: #f0ecf6; }
html.cx-tema .erp-grid tbody tr:nth-child(even) { background: #fcfbfe; }
html.cx-tema .erp-grid tbody tr:hover { background: #f8f5fe; }
html.cx-tema .erp-grid tbody tr.sel, html.cx-tema .erp-grid tbody tr.sel:hover { background: var(--cx-sel); color: var(--cx-tinta); }
html.cx-tema .erp-grid tbody tr.sel td { color: var(--cx-tinta); border-color: #e4dcf8; }
html.cx-tema .erp-actions { background: transparent; }
html.cx-tema .erp-emconstr code { background: var(--cx-lilas); }

/* texto branco que ficaria sobre fundo branco */
html.cx-tema .pe-form :is(.pe-label, .pe-checkbox, .pe-radiobutton):is([style*="background:#808080"], [style*="background: rgb(128, 128, 128)"], [style*="background:#A2A2A2"], [style*="background: rgb(162, 162, 162)"]) {
  background: var(--cx-lilas) !important; color: var(--cx-roxo-esc) !important; border-radius: 6px; }
html.cx-tema .pe-panel:is([style*="background:#808080"], [style*="background: rgb(128, 128, 128)"], [style*="background:#A2A2A2"], [style*="background: rgb(162, 162, 162)"],
  [style*="background:#C0C0C0"], [style*="background: rgb(192, 192, 192)"], [style*="background:#D7D7D7"], [style*="background: rgb(215, 215, 215)"], [style*="background:#E9E9E9"], [style*="background: rgb(233, 233, 233)"])
  :is(.pe-label, .pe-checkbox, .pe-radiobutton):is([style*="color:#FFFFFF"], [style*="color: rgb(255, 255, 255)"]):not([style*="background:#"]):not([style*="background: rgb"]) {
  color: var(--cx-roxo-esc) !important; }

/* ---------------------------------------------------------------- telas feitas à mão (CSS próprio com as cores do SIGEMP) */
/* painéis cinza → cartões; barras de botões e faixas de título → lilás */
html.cx-tema :is(.pr-p1, .cp-p1, .cp-p3, .cp-p5, .cn-p1, .cn-p2, .cn-p3, .cn-p5) { background: var(--cx-card) !important; border: 1px solid var(--cx-linha) !important; border-radius: 10px; }
html.cx-tema :is(.pr-p2, .cp-p2) { background: var(--cx-lilas) !important; border-radius: 10px; }
html.cx-tema :is(.pr-p3) { background: var(--cx-card) !important; border: 1px solid var(--cx-linha); border-radius: 8px; }
html.cx-tema :is(.pr-h, .cp-p9, .cp-p6, .cn-leg-t, .cn-t6.ttl, .tfp-dlg-t, .cp-dlg-t) { background: var(--cx-lilas) !important; color: var(--cx-roxo-esc) !important; font-weight: 700; }
html.cx-tema .cp-p6 .cp-tl { color: var(--cx-roxo-esc) !important; }
html.cx-tema :is(.pr-v, .cp-ck) { background: transparent !important; }
html.cx-tema .pr-ck { background: transparent !important; color: var(--cx-tinta) !important; }
html.cx-tema :is(.pr-ck, .cp-ck) input { accent-color: var(--cx-roxo); }
html.cx-tema :is(.pr-ed, .cp-ed, .cp-tv) { border: 1px solid var(--cx-linha2) !important; border-radius: 6px; color: var(--cx-tinta); }
html.cx-tema .cp-ed.ro, html.cx-tema .pe-modal .pe-form :is(input[readonly], .ro) { background: #f6f3fb !important; }
/* botões */
html.cx-tema :is(.pr-bt, .cp-bt, .pr-big, .pr-sb, .cp-sp, .cp-f2) { background: #fff !important; border: 1px solid var(--cx-linha2) !important; border-radius: 8px;
  color: var(--cx-roxo-esc) !important; font-weight: 600; cursor: pointer; }
html.cx-tema :is(.pr-bt, .cp-bt, .pr-big, .pr-sb, .cp-sp, .cp-f2):hover { background: var(--cx-lilas) !important; }
/* botão "afundado" (filtro ligado) do SIGEMP → lilás com borda roxa */
html.cx-tema :is(.pr-sb.down, .pr-big.down, .cp-sp.down, .pe-speedbutton.down) { background: var(--cx-sel) !important; border: 1px solid #a78bfa !important; border-style: solid !important;
  color: var(--cx-roxo-esc) !important; font-weight: 700; }
/* abas */
html.cx-tema .pr-tabs { background: transparent !important; border-bottom: 1px solid var(--cx-linha) !important; }
html.cx-tema .pr-tab { background: transparent !important; border: 0 !important; border-bottom: 2px solid transparent !important; color: var(--cx-suave); font-weight: 600; border-radius: 6px 6px 0 0; }
html.cx-tema .pr-tab:hover { background: var(--cx-lilas) !important; color: var(--cx-roxo-esc); }
html.cx-tema .pr-tab.on { color: var(--cx-roxo-esc); border-bottom-color: var(--cx-roxo) !important; top: 0; }
/* cabeçalhos das grades (as que o filtro estilo Excel não marca) e a coluna do indicador ▶ */
html.cx-tema th.cxf-th { background: #f7f5fc !important; color: var(--cx-roxo-esc) !important; border-color: var(--cx-linha) !important; font-weight: 600; }
html.cx-tema th.cxf-th:hover { background: var(--cx-sel) !important; color: var(--cx-roxo-esc) !important; }
html.cx-tema th.cxf-th:hover * { color: var(--cx-roxo-esc) !important; }
html.cx-tema :is(.pr-grid, .cp-grid, .pe-dbgrid, .pe-stringgrid, .tfp-modal, .tfpp-ov) th:not(.cxf-th) { background: #f7f5fc !important; color: var(--cx-roxo-esc) !important; border-color: var(--cx-linha) !important; }
html.cx-tema :is(td.ind, th.ind) { background: #f3effd !important; color: var(--cx-roxo) !important; border-color: var(--cx-linha) !important; }
html.cx-tema .pr-grid-wrap { background: #fff !important; border: 1px solid var(--cx-linha); border-radius: 10px; }
html.cx-tema .pr-grid tbody tr:nth-child(odd) td { background: #faf8fe; }
html.cx-tema .pr-grid td { border-color: #f0ecf6; }
/* menus de contexto, janelas e pesquisas (F2) */
html.cx-tema :is(.pr-pop, .cp-pop) { background: #fff !important; border: 1px solid var(--cx-linha) !important; border-radius: 10px; padding: 4px; box-shadow: 0 14px 34px rgba(42, 15, 107, .2); }
html.cx-tema :is(.cp-dlg, .tfp-dlg, .tfp-modal, .tfpp-ov .pe-modal) { background: #fff !important; border: 0 !important; border-radius: 14px; overflow: hidden; box-shadow: 0 22px 60px rgba(28, 12, 58, .35); }
html.cx-tema .tfpp-ov :is(.pe-bitbtn, .pe-speedbutton) { background: #fff !important; border: 1px solid var(--cx-linha2); border-radius: 8px; }
html.cx-tema .pe-rg-cap { background: var(--cx-card) !important; color: var(--cx-roxo-esc); }
html.cx-tema .pe-radiogroup { border-color: var(--cx-linha) !important; border-radius: 10px; }
/* painéis do DFM com fundo cinza-escuro (#808080/#A2A2A2: barras de botões e cabeçalhos com texto branco) → lilás com texto roxo */
html.cx-tema .pe-panel:is([style*="background:#808080"], [style*="background: rgb(128, 128, 128)"], [style*="background:#A2A2A2"], [style*="background: rgb(162, 162, 162)"]) {
  background: var(--cx-lilas) !important; color: var(--cx-roxo-esc) !important; }
html.cx-tema .pe-panel:is([style*="background:#808080"], [style*="background: rgb(128, 128, 128)"], [style*="background:#A2A2A2"], [style*="background: rgb(162, 162, 162)"]) > .pe-cap { color: var(--cx-roxo-esc) !important; font-weight: 700; }