@import url("https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap");
/* =====================================================================
   TEMA "moderno" do painel admin (05/11/2026) - identidade aprovada pelo dono no prototipo docs/design/prototipo-uservoz-2026.html.
   Carregado SO quando o servidor define PANEL_THEME=moderno (Hostinger). Tudo e escopado em body.theme-moderno e so muda aparencia:
   cores (azul-marinho, petroleo, branco e ciano), fonte Geist, menu por modulos, tabelas densas, modo claro e escuro.
   Para voltar ao visual anterior: PANEL_THEME= (vazio) em /etc/anigw/anigw.env e reiniciar so o painel.
   ===================================================================== */
body.theme-moderno {
  --bg: #EEF2F6; --surface: #FFFFFF; --surface-2: #F6F8FA; --border: #DCE3EA; --border-strong: #C3CFDB;
  --text: #0C1A2B; --text-2: #56697E; --muted: #56697E; --icon: #6B7F94;
  --primary: #0E7C92; --primary-ink: #0B5E6F; --primary-soft: #E2EFF1;
  --accent: #0B5E6F; --accent2: #0B5E6F;
  --cyan: #13A9C9; --cyan-soft: #DDF4F9; --petrol: #0B5E6F; --petrol-hover: #094F5D;
  --ok: #1F9466; --ok-ink: #11683F; --ok-soft: #E1F2EA;
  --bad: #C9473D; --bad-ink: #A52A22; --bad-soft: #FAE4E2;
  --warn: #D4940F; --warn-ink: #855500; --warn-soft: #FAEFD7;
  --info: #3B78B0; --info-ink: #24598A; --info-soft: #E4EEF7;
  --series-allowed: #1593B0; --series-blocked: #C9473D; --series-rejected: #8C9DB0;
  --panel: var(--surface); --panel2: var(--surface-2); --bg2: var(--surface);
  --font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --radius: 8px; --radius-sm: 6px; --radius-xs: 4px; --radius-pill: 999px;
  --shadow: none; --shadow-lg: 0 16px 40px -12px rgba(8, 20, 36, .35);
  --focus: 0 0 0 2px var(--surface), 0 0 0 4px var(--cyan);
  --rail: #0D2138; --rail-2: #16304F; --rail-line: #1B3554; --rail-ink: #C2D0DE; --rail-muted: #7F97AF;
  --chart-grid: #E6ECF1; --hover-row: #F3F6F9;
  --t26-top-h: 52px;
  color-scheme: light;
  font-feature-settings: "ss01";
}
html.t26[data-theme="dark"] body.theme-moderno {
  --bg: #07111C; --surface: #0D1A29; --surface-2: #112236; --border: #1B2E43; --border-strong: #2A4460;
  --text: #E3EBF3; --text-2: #93A6BA; --muted: #93A6BA; --icon: #7F93A8;
  --primary: #35C3E2; --primary-ink: #5CC8E0; --primary-soft: #10303A;
  --accent: #5CC8E0; --accent2: #1D7F93;
  --cyan: #35C3E2; --cyan-soft: #0F3341; --petrol: #1D7F93; --petrol-hover: #2590A6;
  --ok: #3DBA85; --ok-ink: #5ACB98; --ok-soft: #0F2C22;
  --bad: #EE6A5F; --bad-ink: #F28C83; --bad-soft: #3A1714;
  --warn: #E3A93C; --warn-ink: #EBBD62; --warn-soft: #33270E;
  --info: #6EA6D9; --info-ink: #8DBBE6; --info-soft: #10263B;
  --series-allowed: #35C3E2; --series-blocked: #EE6A5F; --series-rejected: #6F8399;
  --rail: #050D16; --rail-2: #0F2033; --rail-line: #12243A; --rail-ink: #C2D0DE; --rail-muted: #6F879F;
  --chart-grid: #16283B; --hover-row: #112236;
  color-scheme: dark;
}
html.t26 { background: #EEF2F6; }
html.t26[data-theme="dark"] { background: #07111C; }

/* ---------------------------------------------------------------- base */
body.theme-moderno { font-size: 13.5px; line-height: 1.45; letter-spacing: -0.003em; }
body.theme-moderno h1 { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; margin-bottom: 14px; text-wrap: balance; }
body.theme-moderno h2 { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; margin-bottom: 10px; }
body.theme-moderno h3 { font-size: 13.5px; font-weight: 600; }
body.theme-moderno .mono, body.theme-moderno code, body.theme-moderno pre { font-family: var(--mono); letter-spacing: -0.01em; }
body.theme-moderno .mono { font-size: 12.5px; }
body.theme-moderno code { background: var(--surface-2); border: 1px solid var(--border); padding: 1px 5px; border-radius: 4px; }
body.theme-moderno pre { background: var(--surface-2); }
body.theme-moderno a { color: var(--primary-ink); }
body.theme-moderno .right, body.theme-moderno td.right { font-variant-numeric: tabular-nums; }
body.theme-moderno ::selection { background: var(--cyan-soft); }

/* ---------------------------------------------------------------- estrutura: menu lateral + barra do topo */
body.theme-moderno .layout { min-height: 100vh; }
body.theme-moderno .t26-col { flex: 1; min-width: 0; display: flex; flex-direction: column; }
body.theme-moderno .main { padding: 18px 24px 40px; }
body.theme-moderno .sidebar { width: 236px; background: var(--rail); border-right: 1px solid var(--rail-line); padding: 0 8px; color: var(--rail-ink);
  scrollbar-width: thin; scrollbar-color: var(--rail-2) transparent; transition: width .16s ease; }
body.theme-moderno .brand { color: #FFFFFF; font-weight: 600; font-size: 15px; letter-spacing: -0.01em; padding: 12px 10px; margin: 0 -8px 4px; border-bottom: 1px solid var(--rail-line);
  min-height: var(--t26-top-h); flex: none; display: flex; flex-direction: column; justify-content: center; }
body.theme-moderno .brand small { color: var(--rail-muted); font-weight: 500; font-size: 11.5px; letter-spacing: 0; }
/* logo da empresa no menu escuro: sem caixa branca; o PNG transparente com letras escuras e invertido para ficar claro
   (invert + hue-rotate mantem o tom turquesa/ciano do desenho). Para um logo ja claro, basta marcar body.t26-logo-claro. */
body.theme-moderno .brand-logo { background: transparent; border-radius: 0; padding: 2px 0; margin-bottom: 6px; }
body.theme-moderno .brand-logo img { max-height: 44px; filter: invert(1) hue-rotate(180deg) brightness(1.08); }
body.theme-moderno.t26-logo-claro .brand-logo img { filter: none; }
body.theme-moderno .nav { padding: 4px 0 12px; }
body.theme-moderno .nav .sec { margin: 14px 10px 4px; font-size: 11.5px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--rail-muted); white-space: nowrap; }
body.theme-moderno .nav .sec:first-child { margin-top: 6px; }
body.theme-moderno .nav a { color: var(--rail-ink); padding: 0 10px; height: 32px; gap: 10px; border-radius: 6px; font-size: 13px; font-weight: 450; margin-bottom: 1px;
  position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.theme-moderno .nav a .ic { color: var(--rail-muted); width: 18px; min-width: 18px; }
body.theme-moderno .nav a .ic svg { width: 17px; height: 17px; stroke-width: 1.7; }
body.theme-moderno .nav a:hover { background: var(--rail-2); color: #FFFFFF; }
body.theme-moderno .nav a:hover .ic { color: var(--cyan); }
body.theme-moderno .nav a.active { background: var(--rail-2); color: #FFFFFF; font-weight: 550; }
body.theme-moderno .nav a.active .ic { color: #35C3E2; }
body.theme-moderno .nav a.active::before { content: ""; position: absolute; left: 0; top: 7px; bottom: 7px; width: 3px; border-radius: 0 3px 3px 0; background: #35C3E2; }
body.theme-moderno .nav a:focus-visible { box-shadow: inset 0 0 0 2px #35C3E2; }
body.theme-moderno .sidefoot { background: var(--rail); border-top: 1px solid var(--rail-line); box-shadow: none; color: var(--rail-ink); margin: 12px -8px 0; padding: 10px 12px 12px; }
body.theme-moderno .sidefoot #who { color: var(--rail-muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.theme-moderno .sidefoot button { background: transparent; color: #FFFFFF; border: 1px solid var(--rail-2); font-weight: 500; }
body.theme-moderno .sidefoot button:hover { background: var(--rail-2); border-color: var(--rail-muted); }

/* barra do topo (criada pelo theme-moderno.js): recolher menu, onde estou, pesquisa de telas, Kamailio, modo claro/escuro */
body.theme-moderno .t26-top { position: sticky; top: 0; z-index: 20; height: var(--t26-top-h); display: flex; align-items: center; gap: 10px; padding: 0 20px 0 12px;
  background: var(--surface); border-bottom: 1px solid var(--border); }
body.theme-moderno .t26-ibtn { width: 34px; height: 34px; padding: 0; display: inline-grid; place-items: center; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--text-2); flex: none; }
body.theme-moderno .t26-ibtn:hover { background: var(--surface-2); border-color: var(--border); color: var(--text); }
body.theme-moderno .t26-ibtn svg { width: 18px; height: 18px; }
body.theme-moderno .t26-crumb { display: flex; align-items: baseline; gap: 8px; min-width: 0; flex: none; }
body.theme-moderno .t26-crumb .g { color: var(--text-2); font-size: 12.5px; white-space: nowrap; }
body.theme-moderno .t26-crumb .w { font-weight: 600; font-size: 14.5px; white-space: nowrap; }
body.theme-moderno .t26-search { position: relative; margin-left: auto; width: min(400px, 34vw); }
body.theme-moderno .t26-search input { width: 100%; height: 34px; padding: 0 36px 0 34px; background: var(--surface-2); border-color: var(--border); border-radius: 6px; }
body.theme-moderno .t26-search input:focus { background: var(--surface); border-color: var(--cyan); box-shadow: 0 0 0 3px var(--cyan-soft); }
body.theme-moderno .t26-search .s-ico { position: absolute; left: 10px; top: 9px; width: 16px; height: 16px; color: var(--text-2); pointer-events: none; }
body.theme-moderno .t26-search kbd { position: absolute; right: 8px; top: 7px; font: 500 11px/18px var(--font); color: var(--text-2); border: 1px solid var(--border); border-radius: 4px; padding: 0 5px; background: var(--surface); }
body.theme-moderno .t26-results { position: absolute; top: 40px; left: 0; right: 0; background: var(--surface); border: 1px solid var(--border-strong); border-radius: 8px;
  box-shadow: var(--shadow-lg); padding: 6px; display: none; max-height: 380px; overflow: auto; z-index: 40; }
body.theme-moderno .t26-results.open { display: block; }
body.theme-moderno .t26-results .rg { font-size: 11.5px; color: var(--text-2); padding: 6px 8px 4px; }
body.theme-moderno .t26-results button { display: flex; width: 100%; justify-content: flex-start; gap: 10px; text-align: left; padding: 7px 8px; border: 0; background: transparent; border-radius: 4px; font-weight: 500; color: var(--text); }
body.theme-moderno .t26-results button:hover, body.theme-moderno .t26-results button.sel { background: var(--surface-2); }
body.theme-moderno .t26-results .rs { color: var(--text-2); font-size: 12px; margin-left: auto; font-weight: 400; }
body.theme-moderno .t26-pill { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--text-2); border: 1px solid var(--border); border-radius: 16px; padding: 4px 11px 4px 9px; white-space: nowrap; text-decoration: none; }
body.theme-moderno .t26-pill:hover { text-decoration: none; border-color: var(--border-strong); }
body.theme-moderno .t26-pill b { color: var(--text); font-weight: 600; }
body.theme-moderno .t26-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--icon); flex: none; }
body.theme-moderno .t26-dot.ok { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-soft); }
body.theme-moderno .t26-dot.bad { background: var(--bad); box-shadow: 0 0 0 3px var(--bad-soft); }

/* menu recolhido: so os icones; o nome aparece ao passar o mouse (title) */
body.theme-moderno.t26-collapsed .sidebar { width: 60px; }
body.theme-moderno.t26-collapsed .brand small, body.theme-moderno.t26-collapsed #brand_name { display: none !important; }
body.theme-moderno.t26-collapsed .brand-logo { padding: 2px 0; }
body.theme-moderno.t26-collapsed .brand-logo img { max-height: 30px; }
body.theme-moderno.t26-collapsed .nav .sec { font-size: 0; margin: 8px 6px; height: 1px; background: var(--rail-line); }
body.theme-moderno.t26-collapsed .nav a { font-size: 0; justify-content: center; padding: 0; }
body.theme-moderno.t26-collapsed .sidefoot #who { display: none; }
body.theme-moderno.t26-collapsed .sidefoot button { padding: 5px 0; font-size: 11px; }

/* ---------------------------------------------------------------- titulo da pagina */
body.theme-moderno .page-head { margin-bottom: 14px; gap: 12px; }
body.theme-moderno .page-head h1 { font-size: 22px; }
body.theme-moderno .page-head .sub { font-size: 12.5px; color: var(--text-2); margin-top: 2px; }
body.theme-moderno .pill { padding: 4px 11px; font-size: 12.5px; font-weight: 500; border-color: var(--border); background: var(--surface); color: var(--text); }
body.theme-moderno .pill .dot { width: 7px; height: 7px; box-shadow: 0 0 0 3px var(--ok-soft); }

/* ---------------------------------------------------------------- superficies: caixas e cartoes sem sombra, raio menor */
body.theme-moderno .box { padding: 14px 16px; border-radius: 8px; border-color: var(--border); margin-bottom: 14px; }
body.theme-moderno .box > h2:first-child { padding-bottom: 10px; margin: -2px -16px 12px; padding-left: 16px; padding-right: 16px; border-bottom: 1px solid var(--border); }
body.theme-moderno .card { padding: 12px 16px; border-radius: 8px; }
body.theme-moderno .card .label { font-size: 12.5px; font-weight: 500; }
body.theme-moderno .card .value { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
body.theme-moderno .card .sub { font-size: 11.5px; }
body.theme-moderno .card.clickable:hover { border-color: var(--border-strong); background: var(--surface-2); }
body.theme-moderno .cards { gap: 12px; }
body.theme-moderno .hint { font-size: 12.5px; margin: -4px 0 12px; }
body.theme-moderno .howto { border-left-color: var(--cyan); background: var(--surface-2); }
body.theme-moderno .warnbox { border-color: color-mix(in srgb, var(--warn) 45%, transparent); background: var(--warn-soft); color: var(--warn-ink); }

/* banda de indicadores: uma superficie dividida (nao cartoes soltos) */
body.theme-moderno .kpis { gap: 0; margin-bottom: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
body.theme-moderno .kpis .card { border: 0; border-left: 1px solid var(--border); border-radius: 0; padding: 12px 16px 13px; }
body.theme-moderno .kpis .card:first-child { border-left: 0; }
body.theme-moderno .kpi .label { font-size: 12.5px; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--text-2); }
body.theme-moderno .kpi .value { font-size: 24px; font-weight: 600; letter-spacing: -0.025em; margin-top: 2px; }
body.theme-moderno .kpi .foot { font-size: 11.5px; }
body.theme-moderno .ico { width: 24px; height: 24px; border-radius: 5px; background: transparent; color: var(--icon); }
body.theme-moderno .ico svg { width: 17px; height: 17px; stroke-width: 1.7; }
body.theme-moderno .ico.ok { background: transparent; color: var(--ok); }
body.theme-moderno .ico.bad { background: transparent; color: var(--bad); }
body.theme-moderno .ico.warn { background: transparent; color: var(--warn); }
body.theme-moderno .ico.info { background: transparent; color: var(--info); }
body.theme-moderno .delta { padding: 0; background: transparent !important; font-weight: 600; }
body.theme-moderno .delta.flat { color: var(--text-2); }
body.theme-moderno .dash-grid { gap: 14px; margin-bottom: 14px; }
body.theme-moderno #dash_fin { gap: 0; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; margin-bottom: 14px; }
body.theme-moderno #dash_fin:empty { display: none; }
body.theme-moderno #dash_fin .card { border: 0; border-left: 1px solid var(--border); border-radius: 0; }
body.theme-moderno #dash_fin .card:first-child { border-left: 0; }
body.theme-moderno #mfa_box { padding: 9px 14px; border-left: 3px solid var(--cyan); }
body.theme-moderno #mfa_box h2 { font-size: 13px; border: 0; padding: 0; margin: 0; }

/* graficos e barras */
body.theme-moderno .stackbar { height: 10px; border-radius: 3px; gap: 1px; background: var(--chart-grid); }
body.theme-moderno .bar-track, body.theme-moderno .diskbar { background: var(--chart-grid); border-radius: 3px; }
body.theme-moderno .bar-track span { border-radius: 3px; background: var(--petrol); }
body.theme-moderno .chart-tip { background: #0C1A2B; color: #FFFFFF; border: 1px solid #27405A; border-radius: 6px; }
body.theme-moderno .dist-row { padding: 7px 0; }
body.theme-moderno .dist-row .n { font-weight: 600; }
body.theme-moderno .dist-row i { border-radius: 2px; }
body.theme-moderno .mini b { font-weight: 600; font-variant-numeric: tabular-nums; }
body.theme-moderno .legend i { border-radius: 2px; }
body.theme-moderno .chart .bar div { border-radius: 2px; }
body.theme-moderno .bar { border-radius: 2px 2px 0 0; }
body.theme-moderno .svgchart text, body.theme-moderno svg text { font-family: var(--font); }

/* ---------------------------------------------------------------- tabelas densas */
body.theme-moderno table { font-size: 13px; }
body.theme-moderno th { text-transform: none; letter-spacing: 0; font-size: 12px; font-weight: 500; color: var(--text-2); background: var(--surface-2); padding: 8px 12px; }
body.theme-moderno td { padding: 7px 12px; }
body.theme-moderno th, body.theme-moderno td { border-bottom-color: var(--border); }
body.theme-moderno tbody tr:hover td { background: var(--hover-row); }
body.theme-moderno tr.clickable:hover td, body.theme-moderno tr.sel-row td { background: var(--primary-soft); }
body.theme-moderno th.actions, body.theme-moderno td.actions { background: var(--surface); box-shadow: -8px 0 10px -8px rgba(0, 0, 0, .22); }
body.theme-moderno tbody tr:hover td.actions { background: var(--hover-row); }
body.theme-moderno tr.total td { background: var(--surface-2); font-weight: 600; }
body.theme-moderno tr.loss td, body.theme-moderno tr.row-off td { background: var(--bad-soft); }
body.theme-moderno .filterbar { background: var(--surface); border-color: var(--border); border-radius: 8px; padding: 10px 12px; }
body.theme-moderno .pager { font-size: 12.5px; }
body.theme-moderno .empty { padding: 24px 12px; }
body.theme-moderno .empty b { font-weight: 600; }

/* ---------------------------------------------------------------- etiquetas: ponto + cor (a forma tambem informa) */
body.theme-moderno .badge { padding: 2px 8px 2px 7px; font-size: 11.5px; font-weight: 600; line-height: 16px; gap: 6px; border-radius: 10px; }
body.theme-moderno .badge.ALLOWED, body.theme-moderno .badge.on, body.theme-moderno .badge.allow, body.theme-moderno .badge.ctype-both, body.theme-moderno .badge.disk-normal { background: var(--ok-soft); color: var(--ok-ink); }
body.theme-moderno .badge.BLOCKED, body.theme-moderno .badge.block, body.theme-moderno .badge.disk-critico { background: var(--bad-soft); color: var(--bad-ink); }
body.theme-moderno .badge.REJECTED, body.theme-moderno .badge.warnc, body.theme-moderno .badge.disk-atencao { background: var(--warn-soft); color: var(--warn-ink); }
body.theme-moderno .badge.disk-alerta { background: color-mix(in srgb, var(--warn) 22%, var(--bad-soft)); color: var(--bad-ink); }
body.theme-moderno .badge.ERROR, body.theme-moderno .badge.info, body.theme-moderno .badge.ctype-mobile { background: var(--info-soft); color: var(--info-ink); }
body.theme-moderno .badge.ctype-fixed { background: var(--primary-soft); color: var(--primary-ink); }
body.theme-moderno .badge.off { background: var(--surface-2); color: var(--text-2); border: 1px solid var(--border); }
body.theme-moderno .chip { border-color: var(--border); background: var(--surface-2); border-radius: 4px; padding: 1px 7px; }
body.theme-moderno .status-dot.ok, body.theme-moderno .live-dot { background: var(--ok); }
body.theme-moderno .status-dot.bad { background: var(--bad); }
body.theme-moderno .live-dot { box-shadow: 0 0 0 3px var(--ok-soft); }

/* ---------------------------------------------------------------- botoes e formularios */
body.theme-moderno button, body.theme-moderno .btn { height: 32px; padding: 0 12px; border-radius: 6px; font-size: 12.5px; font-weight: 500; background: var(--surface); color: var(--text); border-color: var(--border-strong); }
body.theme-moderno button:hover, body.theme-moderno .btn:hover { border-color: var(--icon); background: var(--surface-2); }
body.theme-moderno button.primary { background: var(--petrol); border-color: var(--petrol); color: #FFFFFF; }
body.theme-moderno button.primary:hover { background: var(--petrol-hover); border-color: var(--petrol-hover); filter: none; }
body.theme-moderno button.danger { background: var(--bad-soft); border-color: color-mix(in srgb, var(--bad) 40%, transparent); color: var(--bad-ink); }
body.theme-moderno button.danger:hover { background: var(--bad-soft); border-color: var(--bad); }
body.theme-moderno button.small { height: 26px; padding: 0 9px; font-size: 12px; line-height: 1; }
body.theme-moderno .icon-btn { color: var(--primary-ink); }
body.theme-moderno .t26-results button, body.theme-moderno .t26-ibtn { height: auto; }
body.theme-moderno .t26-ibtn { height: 34px; }
body.theme-moderno input, body.theme-moderno select, body.theme-moderno textarea { border-radius: 6px; padding: 7px 10px; font-size: 13px; border-color: var(--border-strong); background: var(--surface); color: var(--text); }
body.theme-moderno input:not([type=checkbox]):not([type=radio]):not([type=file]), body.theme-moderno select { min-height: 32px; }
body.theme-moderno input:focus, body.theme-moderno select:focus, body.theme-moderno textarea:focus { border-color: var(--cyan); box-shadow: 0 0 0 3px var(--cyan-soft); }
body.theme-moderno input::placeholder, body.theme-moderno textarea::placeholder { color: var(--icon); }
body.theme-moderno input[type=checkbox], body.theme-moderno input[type=radio] { accent-color: var(--petrol); }
body.theme-moderno .field label, body.theme-moderno .lbl { font-weight: 500; font-size: 12px; }
body.theme-moderno .switch input:checked + span { background: var(--petrol); }
body.theme-moderno details.adv { border-style: solid; border-color: var(--border); border-radius: 6px; }

/* abas: sublinhado, sem fundo */
body.theme-moderno .tabs { gap: 2px; }
body.theme-moderno .tabs .tab, body.theme-moderno .tabs > button { height: 36px; padding: 0 12px; font-weight: 500; color: var(--text-2); border-radius: 0; background: none; border: 0; border-bottom: 2px solid transparent; }
body.theme-moderno .tabs .tab.active, body.theme-moderno .tabs > button.active, body.theme-moderno .tabs > button.primary { color: var(--text); border-bottom-color: var(--cyan); background: none; font-weight: 600; border-radius: 0; }

/* etapas e listas ordenadas (Classe 4) */
body.theme-moderno .step { border-radius: 6px; }
body.theme-moderno .step.cur { border-color: var(--cyan); background: var(--primary-soft); }
body.theme-moderno .step.cur b { background: var(--petrol); }
body.theme-moderno .ord-n { background: var(--primary-soft); color: var(--primary-ink); border-radius: 4px; }
body.theme-moderno .policy { border-style: solid; border-color: var(--border); }
body.theme-moderno .fin-hl > div { border-radius: 6px; }
body.theme-moderno .fin-hl .label { text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 12px; }
body.theme-moderno .fin-hl > div > b { font-weight: 600; }
body.theme-moderno .disk-pct { font-weight: 600; }
body.theme-moderno .alert { border-radius: 6px; border-left-width: 3px; }

/* avisos e modais */
body.theme-moderno .toast { border-radius: 6px; border-left-width: 3px; border-left-color: var(--cyan); }
body.theme-moderno .toast.err { border-left-color: var(--bad); } body.theme-moderno .toast.ok { border-left-color: var(--ok); }
body.theme-moderno .modal-bg { background: rgba(5, 13, 22, .45); }
body.theme-moderno .modal { border-radius: 10px; border-color: var(--border-strong); padding: 20px 22px; }
body.theme-moderno .modal h3 { font-size: 17px; font-weight: 600; }
body.theme-moderno .modal.drawer { border-radius: 0; }
body.theme-moderno .standby-banner { background: var(--warn-soft); color: var(--warn-ink); border-color: color-mix(in srgb, var(--warn) 45%, transparent); }
body.theme-moderno .cad-filled { background: var(--ok-soft); }
body.theme-moderno .mfa-codes span { background: var(--surface-2); }

/* ---------------------------------------------------------------- telas menores */
@media (max-width: 1440px) { body.theme-moderno .main { padding: 16px 20px 32px; } body.theme-moderno th, body.theme-moderno td { padding: 7px 9px; } }
@media (max-width: 1200px) {
  body.theme-moderno .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.theme-moderno .kpis .card:nth-child(odd) { border-left: 0; }
  body.theme-moderno .kpis .card:nth-child(n+3) { border-top: 1px solid var(--border); }
  body.theme-moderno .t26-search { width: min(300px, 30vw); }
  body.theme-moderno .t26-pill .since { display: none; }
}
@media (max-width: 860px) {
  body.theme-moderno .mobilebar { display: none; }
  body.theme-moderno .t26-col { display: block; }
  body.theme-moderno.t26-collapsed .sidebar, body.theme-moderno .sidebar { width: 272px; }
  body.theme-moderno.t26-collapsed .nav a { font-size: 13px; justify-content: flex-start; padding: 0 10px; }
  body.theme-moderno.t26-collapsed .nav .sec { font-size: 11.5px; height: auto; background: none; margin: 14px 10px 4px; }
  body.theme-moderno .t26-collapse { display: none; }
  body.theme-moderno .t26-menu { display: inline-grid; }
  body.theme-moderno .t26-top { padding: 0 12px; }
  body.theme-moderno .t26-crumb .g, body.theme-moderno .t26-pill { display: none; }
  body.theme-moderno .t26-search { width: auto; flex: 1; min-width: 0; }
  body.theme-moderno .t26-search kbd { display: none; }
  body.theme-moderno .main { padding: 14px 16px 28px; }
}
@media (min-width: 861px) { body.theme-moderno .t26-menu { display: none; } }
@media (max-width: 520px) {
  body.theme-moderno .kpis { grid-template-columns: minmax(0, 1fr); }
  body.theme-moderno .kpis .card { border-left: 0; border-top: 1px solid var(--border); }
  body.theme-moderno .kpis .card:first-child { border-top: 0; }
  body.theme-moderno .t26-crumb { display: none; }
}

/* ajustes conferidos no teste local (05/11/2026) */
body.theme-moderno .svgchart line[stroke="#E5EDF5"] { stroke: var(--chart-grid); }
body.theme-moderno .svgchart text[fill="#7183A0"] { fill: var(--icon); }
body.theme-moderno thead th.actions { background: var(--surface-2); box-shadow: none; }
/* selos do Risco regulatorio com cor fixa na tela (Atencao/Alerta): mesma cor do tema nos dois modos */
body.theme-moderno .badge[style*="#fff4d6"] { background: var(--warn-soft) !important; color: var(--warn-ink) !important; }
body.theme-moderno .badge[style*="#ffe4cc"] { background: color-mix(in srgb, var(--warn) 22%, var(--bad-soft)) !important; color: var(--bad-ink) !important; }
body.theme-moderno input[type=file] { padding: 4px; max-width: 100%; min-height: 0; }

/* ---------------------------------------------------------------- edicao em tela cheia (05/11/2026, pedido do dono)
   Janelas "Editar ..." e "Novo/Nova ..." ocupam toda a area de conteudo; so o menu lateral fica de fora.
   O theme-moderno.js marca a janela (.t26-full) pelo titulo; o resto (avisos, extratos, Pix, importar) segue como janela. */
body.theme-moderno .modal-bg.t26-full { inset: 0 0 0 236px; padding: 0; background: var(--surface); align-items: stretch; justify-content: flex-start; transition: left .16s ease; z-index: 28; }
body.theme-moderno.t26-collapsed .modal-bg.t26-full { left: 60px; }
body.theme-moderno .modal-bg.t26-full > .modal { width: 100%; max-width: none; height: 100%; max-height: none; border: 0; border-radius: 0; box-shadow: none;
  padding: 0 28px; overflow: auto; display: flex; flex-direction: column; background: var(--surface); }
body.theme-moderno .modal-bg.t26-full > .modal > * { flex: none; }
/* cabecalho fixo: recolher menu, titulo, fechar */
body.theme-moderno .modal-bg.t26-full > .modal > h3:first-child { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; gap: 10px; min-height: var(--t26-top-h);
  margin: 0 -28px 18px; padding: 8px 20px 8px 12px; background: var(--surface); border-bottom: 1px solid var(--border); font-size: 17px; }
body.theme-moderno .modal-bg.t26-full > .modal > h3:first-child:has(+ .tabs) { margin-bottom: 0; border-bottom: 0; }
body.theme-moderno .modal-bg.t26-full .t26-edit-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.theme-moderno .modal-bg.t26-full > .modal > .tabs { position: sticky; top: var(--t26-top-h); z-index: 3; margin: 0 -28px 20px; padding: 0 28px; background: var(--surface); }
/* campos distribuidos na largura: 4 colunas em tela larga, menos conforme estreita */
body.theme-moderno .modal-bg.t26-full .form { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 20px; }
body.theme-moderno .modal-bg.t26-full .form > .wide, body.theme-moderno .modal-bg.t26-full .form > .row.end, body.theme-moderno .modal-bg.t26-full .form > details, body.theme-moderno .modal-bg.t26-full .form > .howto { grid-column: 1 / -1; }
body.theme-moderno .modal-bg.t26-full .field { min-width: 0; }
body.theme-moderno .modal-bg.t26-full .field > input, body.theme-moderno .modal-bg.t26-full .field > select, body.theme-moderno .modal-bg.t26-full .field > textarea { width: 100%; }
/* rodape fixo: Cancelar e Salvar sempre a vista */
body.theme-moderno .modal-bg.t26-full > .modal > .row.end:last-child { position: sticky; bottom: 0; z-index: 3; margin: auto -28px 0 !important; padding: 12px 28px; background: var(--surface); border-top: 1px solid var(--border); }
body.theme-moderno .modal-bg.t26-full > .modal > .row.end:last-child::before { content: ""; }
body.theme-moderno .modal-bg.t26-full > .modal > :last-child > .row.end:last-child { position: sticky; bottom: 0; z-index: 3; margin: 8px -28px 0 !important; padding: 12px 28px; background: var(--surface); border-top: 1px solid var(--border); }
body.theme-moderno .modal-bg.t26-full > .modal > .row.end:last-child > button, body.theme-moderno .modal-bg.t26-full > .modal > :last-child > .row.end:last-child > button { height: 36px; padding: 0 18px; font-size: 13.5px; }
body.theme-moderno .modal-bg.t26-full > .modal > :last-child:not(.row) { padding-bottom: 20px; }
@media (max-width: 1500px) { body.theme-moderno .modal-bg.t26-full .form { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { body.theme-moderno .modal-bg.t26-full .form { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  body.theme-moderno .modal-bg.t26-full, body.theme-moderno.t26-collapsed .modal-bg.t26-full { left: 0; z-index: 28; }
  body.theme-moderno .modal-bg.t26-full > .modal { padding: 0 16px; }
  body.theme-moderno .modal-bg.t26-full > .modal > h3:first-child, body.theme-moderno .modal-bg.t26-full > .modal > .tabs, body.theme-moderno .modal-bg.t26-full > .modal > .row.end:last-child { margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 640px) { body.theme-moderno .modal-bg.t26-full .form { grid-template-columns: minmax(0, 1fr); } }
body.theme-moderno .field button.small, body.theme-moderno .field button { white-space: nowrap; flex: none; }

/* ---------------------------------------------------------------- 07/11/2026: identidade "lista + painel" e tipografia regular
   Peso 400 em TODO o painel (titulos, menu, nomes, campos, valores, botoes, indicadores); hierarquia por tamanho, cor e espaco. */
body.theme-moderno, body.theme-moderno * { font-weight: 400 !important; }
body.theme-moderno b, body.theme-moderno strong { color: var(--text); }
body.theme-moderno h1 { font-size: 26px; letter-spacing: -0.015em; }
body.theme-moderno h2 { font-size: 17px; }
body.theme-moderno .badge { letter-spacing: .01em; font-size: 11.5px; padding: 3px 10px; border-radius: 999px; }
body.theme-moderno .badge.on { background: #2EAE3E; color: #FFFFFF; border-color: #2EAE3E; }
body.theme-moderno .badge.off { background: var(--surface-2); color: var(--text-2); }
body.theme-moderno button, body.theme-moderno .btn { border-radius: 9px; }
body.theme-moderno button.primary { background: var(--petrol); border-color: var(--petrol); color: #FFFFFF; }
body.theme-moderno button.primary:hover { background: var(--petrol-hover); }
body.theme-moderno button.danger { background: var(--surface); color: var(--bad-ink); border: 1px solid var(--bad); }
body.theme-moderno button.danger:hover { background: var(--bad-soft); }
body.theme-moderno .ld-card.sel { background: #E3F3F0; border-color: #0E7C92; }
body.theme-moderno .ld-sec-head { background: #F3F6F9; }
body.theme-moderno .ld-list, body.theme-moderno .ld-detail { border-radius: 14px; }
body.theme-moderno .box { border-radius: 12px; }
body.theme-moderno .brand { font-size: 17px; }
html.t26[data-theme="dark"] body.theme-moderno .ld-card.sel { background: var(--primary-soft); border-color: var(--primary); }
html.t26[data-theme="dark"] body.theme-moderno .ld-sec-head { background: var(--surface-2); }
html.t26[data-theme="dark"] body.theme-moderno .badge.on { background: #1F7A2E; border-color: #1F7A2E; }
body.theme-moderno .ld-search input { padding-left: 38px; height: 42px; }
body.theme-moderno .ld-filter select { height: 42px; }
body.theme-moderno .ld-sec-head { font-size: 15.5px; padding: 12px 14px; }
body.theme-moderno .ld-card { padding: 12px 12px 12px 14px; }
body.theme-moderno .ld-card .ld-name { font-size: 15px; }
body.theme-moderno .ld-title { font-size: 24px; }
body.theme-moderno .ld-kv dt, body.theme-moderno .ld-kv dd { font-size: 14px; }
body.theme-moderno .ld-close { font-size: 26px; }
/* cartoes da lista sao <button>: nao herdam a altura fixa dos botoes do tema */
body.theme-moderno .ld-card { height: auto; min-height: 60px; white-space: normal; line-height: 1.3; padding: 12px 12px 12px 14px; }
body.theme-moderno .ld-card .ld-name, body.theme-moderno .ld-card .ld-sub, body.theme-moderno .ld-card .ld-meta { white-space: normal; }
body.theme-moderno .ld-sec-head { height: auto; }
/* refinamento 07/11/2026: alturas e espacos consistentes no tema */
body.theme-moderno .ld-card { display: grid; height: auto; min-height: 76px; padding: 14px 12px 14px 16px; border-radius: 12px; }
body.theme-moderno .ld-card .ld-name { font-size: 15.5px; } body.theme-moderno .ld-card .ld-sub { font-size: 13.5px; } body.theme-moderno .ld-card .ld-meta { font-size: 13px; }
body.theme-moderno .ld-filters .ld-search input, body.theme-moderno .ld-filters .ld-filter select { height: 40px; min-height: 40px; font-size: 13.5px; border-radius: 10px; }
body.theme-moderno .ld-actions-top button, body.theme-moderno .ld-foot button { height: 40px; min-height: 40px; padding: 0 18px; font-size: 13.5px; border-radius: 10px; }
body.theme-moderno .ld-actions-top .ld-filter select { height: 40px; }
body.theme-moderno .ld-sec-head { height: auto; min-height: 46px; font-size: 15px; }
body.theme-moderno .ld-close { height: auto; min-height: 0; }
body.theme-moderno .ld-back { height: 36px; }
body.theme-moderno .kpis .card { padding: 14px 18px 15px; }
body.theme-moderno .kpi .value { font-size: 26px; }
body.theme-moderno .page-head { align-items: flex-start; margin-bottom: 16px; }
body.theme-moderno .page-head .sub { font-size: 13px; margin-top: 4px; max-width: 70ch; }
body.theme-moderno .ld-list, body.theme-moderno .ld-detail { box-shadow: 0 1px 2px rgba(12, 26, 43, .04); }
body.theme-moderno .badge { font-size: 11.5px; padding: 3px 10px; line-height: 16px; }
body.theme-moderno .modal h3 { font-size: 18px; }
body.theme-moderno .field label { font-size: 12.5px; color: var(--text-2); }
body.theme-moderno button, body.theme-moderno .btn { height: 34px; font-size: 13px; }
body.theme-moderno button.small { height: 28px; }
body.theme-moderno input:not([type=checkbox]):not([type=radio]):not([type=file]), body.theme-moderno select { min-height: 34px; }
body.theme-moderno .ord-row { padding: 10px 0; }

/* ---------------------------------------------------------------- painel da revenda e portal do cliente no mesmo padrao (07/11/2026)
   Mesmo menu lateral azul-escuro, cartoes e tipografia regular. A marca e a da propria revenda (logo colorido): fundo branco
   atras do logo, sem o filtro de inversao usado para o logo da plataforma. */
body.theme-moderno.rv-portal .brand-logo { background: #FFFFFF; border-radius: 10px; padding: 6px 10px; display: inline-block; margin-bottom: 6px; }
body.theme-moderno.rv-portal .brand-logo img { filter: none; max-height: 40px; }
body.theme-moderno.rv-portal .brand span#tb_name { display: block; color: #FFFFFF; font-size: 16px; margin-bottom: 2px; }
body.theme-moderno.rv-portal .sidefoot #p_who { color: var(--rail-ink); font-size: 12.5px; line-height: 1.35; margin-bottom: 8px; overflow-wrap: anywhere; }
body.theme-moderno.rv-portal .sidefoot #p_who .muted { color: var(--rail-muted); }
body.theme-moderno.rv-portal .main { padding: 18px 24px 40px; }
body.theme-moderno.rv-portal .login-wrap { background: var(--bg); }
body.theme-moderno.rv-portal .login { border-radius: 14px; }
body.theme-moderno.rv-portal .mobilebar { background: var(--rail); color: #FFFFFF; border-bottom-color: var(--rail-line); }
body.theme-moderno.rv-portal .mobilebar button { background: transparent; color: #FFFFFF; border-color: var(--rail-2); }
@media (max-width: 860px) { body.theme-moderno.rv-portal .main { padding: 14px 16px 32px; } }
body.theme-moderno.rv-portal .sidefoot #p_who b { color: #FFFFFF; font-weight: 500; }
@media (max-width: 860px) { body.theme-moderno.rv-portal .mobilebar { display: flex; } }
