/* ============================================================
   TEMA — alternador claro/escuro
   O modo escuro segue a direção "dark premium corporativo":
   superfícies em níveis, bordas translúcidas, azul da marca em
   doses pequenas e cor semântica só quando ela informa algo.
   ============================================================ */

/* Alternador de tema: o botão fica visível no topo em desktop e mobile. */
.theme-toggle{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:68px;height:42px;padding:4px;border-radius:999px;
  background:transparent;cursor:pointer;
}
.theme-toggle-track{
  position:relative;display:block;width:58px;height:32px;border-radius:999px;
  background:linear-gradient(120deg,#DDEEFF,#A8D5FA);
  box-shadow:inset 0 1px 4px rgba(20,60,110,.16);
  transition:background .35s ease,box-shadow .35s ease;
}
.theme-toggle-thumb{
  position:absolute;top:3px;left:3px;display:grid;place-items:center;
  width:26px;height:26px;border-radius:50%;background:#FFF;color:#E6A52A;
  box-shadow:0 2px 7px rgba(20,42,70,.2);
  transition:transform .36s cubic-bezier(.2,.8,.2,1.12),background .3s ease,color .3s ease;
}
.theme-toggle-thumb i{grid-area:1/1;font-size:14px;line-height:1;transition:opacity .2s ease,transform .36s ease}
.theme-toggle-moon{opacity:0;transform:rotate(-70deg) scale(.45)}
.theme-toggle:hover .theme-toggle-thumb{box-shadow:0 3px 10px rgba(20,42,70,.3)}
.theme-toggle:focus-visible{outline:2px solid #1E6FD9;outline-offset:2px}
html[data-theme="dark"] .theme-toggle-track{background:linear-gradient(120deg,#1A1F27,#2A313C);box-shadow:inset 0 1px 5px rgba(0,0,0,.5)}
html[data-theme="dark"] .theme-toggle-thumb{transform:translateX(26px);background:#E8ECF3;color:#3487E3}
html[data-theme="dark"] .theme-toggle-sun{opacity:0;transform:rotate(70deg) scale(.45)}
html[data-theme="dark"] .theme-toggle-moon{opacity:1;transform:rotate(0) scale(1)}

/* A logo tem duas versões: a colorida e a branca. Trocar o src por JS faria a
   imagem piscar na troca de tema, então as duas ficam no HTML e o CSS escolhe. */
.logo-escura{display:none}
html[data-theme="dark"] .logo-clara{display:none}
html[data-theme="dark"] .logo-escura{display:block}

/* As superfícies mudam juntas; somente o botão mantém a animação. */
html[data-theme="light"] .sidebar{background:#0F2A4F;border-right:0}

/* ============================================================
   1. TOKENS DO MODO ESCURO
   ============================================================ */
html[data-theme="dark"]{
  color-scheme:dark;

  /* Superfícies, do fundo da aplicação ao elemento elevado. */
  --d-bg:#0B0D10;
  --d-sidebar:#0D1014;
  --d-header:#0F1216;
  --d-surface-1:#13161B;   /* cards e blocos principais */
  --d-surface-2:#191D23;   /* cards elevados, filtros, dropdowns */
  --d-surface-3:#1E232B;   /* hover e seleção */

  /* Identidade. */
  --d-primary:#3487E3;
  --d-primary-strong:#4395ED;
  --d-highlight:#52A8FF;
  --d-cyan:#52D3E8;
  --d-violet:#9B7CF8;

  /* Semânticas. */
  --d-success:#48D597;
  --d-warning:#F5B942;
  --d-danger:#EF6672;

  /* Texto. */
  --d-title:#F7F9FC;
  --d-text:#D8DEE9;
  --d-muted:#8993A4;
  --d-disabled:#596273;

  /* Bordas. */
  --d-border:rgba(255,255,255,.07);
  --d-border-hover:rgba(255,255,255,.14);
  --d-border-active:rgba(52,135,227,.45);

  /* Sombra, glow e movimento. */
  --d-shadow-1:0 8px 30px rgba(0,0,0,.20);
  --d-shadow-2:0 12px 38px rgba(0,0,0,.30);
  --d-glow:0 0 20px rgba(52,135,227,.08);
  --d-ease:.2s ease;
  --d-radius:14px;

  /* Nomes antigos mantidos como apelidos: há regras espalhadas que os usam. */
  --dark-bg:var(--d-bg);
  --dark-surface:var(--d-surface-1);
  --dark-surface-raised:var(--d-surface-3);
  --dark-surface-soft:var(--d-surface-2);
  --dark-line:var(--d-border);
  --dark-text:var(--d-text);
  --dark-muted:var(--d-muted);
  --dark-heading:var(--d-title);
  --dark-accent:var(--d-highlight);
}

html[data-theme="dark"] body{background:var(--d-bg);color:var(--d-text)}

/* ============================================================
   2. SCROLLBAR
   ============================================================ */
html[data-theme="dark"] ::-webkit-scrollbar{width:10px;height:10px}
html[data-theme="dark"] ::-webkit-scrollbar-track,
html[data-theme="dark"] .table-scroll::-webkit-scrollbar-track{background:transparent}
html[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#2A3039;border-radius:999px;border:2px solid transparent;background-clip:padding-box}
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover{background:#39414D;background-clip:padding-box}
html[data-theme="dark"]{scrollbar-width:thin;scrollbar-color:#2A3039 transparent}

/* ============================================================
   3. SIDEBAR
   ============================================================ */
html[data-theme="dark"] .sidebar{background:var(--d-sidebar);border-right:1px solid rgba(255,255,255,.06)}
html[data-theme="dark"] .nav-section{color:var(--d-muted)}
html[data-theme="dark"] .nav-item{
  position:relative;color:var(--d-text);
  transition:background var(--d-ease),color var(--d-ease);
}
html[data-theme="dark"] .nav-item:hover{background:rgba(255,255,255,.04);color:#FFF}
html[data-theme="dark"] .nav-item.active{
  background:rgba(52,135,227,.12);color:#FFF;
  box-shadow:0 0 14px rgba(52,135,227,.15);
}
/* Indicador lateral do item ativo, em vez do bloco azul sólido. */
html[data-theme="dark"] .nav-item.active:before{
  content:'';position:absolute;left:0;top:8px;bottom:8px;width:3px;
  background:var(--d-primary);border-radius:0 4px 4px 0;
  box-shadow:0 0 10px rgba(52,135,227,.45);
}
html[data-theme="dark"] .nav-group-toggle:hover{background:rgba(255,255,255,.04)}
html[data-theme="dark"] .sidebar-footer{border-top-color:rgba(255,255,255,.06)}
html[data-theme="dark"] .user-card{background:var(--d-surface-2);border-color:var(--d-border)}
html[data-theme="dark"] .user-name{color:var(--d-title)}
html[data-theme="dark"] .user-role{color:var(--d-muted)}
html[data-theme="dark"] .btn-icon{color:var(--d-muted)}
html[data-theme="dark"] .btn-icon:hover{background:rgba(255,255,255,.06);color:#FFF}

/* ============================================================
   4. HEADER
   ============================================================ */
html[data-theme="dark"] .topbar{background:var(--d-header);border-bottom:1px solid rgba(255,255,255,.06)}
html[data-theme="dark"] .page-title{color:var(--d-title)}
html[data-theme="dark"] .page-subtitle{color:var(--d-muted)}
html[data-theme="dark"] .menu-toggle{background:var(--d-surface-2);color:var(--d-text);border:1px solid var(--d-border)}
html[data-theme="dark"] .menu-toggle:hover{background:var(--d-surface-3);border-color:var(--d-border-hover)}
html[data-theme="dark"] .sidebar-overlay.active{background:rgba(0,0,0,.72)}
html[data-theme="dark"] .page-switch-loading{background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text)}
html[data-theme="dark"] .page-switch-spinner{border-color:rgba(255,255,255,.12);border-top-color:var(--d-highlight)}

/* ============================================================
   5. SUPERFÍCIES — cards, painéis e blocos
   ============================================================ */
html[data-theme="dark"] :is(.panel,.kpi-card,.filter-bar,.table-scroll,.toast,.login-card,.birthday-today-card,.approval-card,.custo-ranking-item,.custo-skeleton,.custo-skeleton-chart,.bi-skeleton-card,.bi-skeleton-chart,.bic-story-card,.bi-data-note,.bi-chart-empty){
  background:var(--d-surface-1);border-color:var(--d-border);color:var(--d-text);
  box-shadow:var(--d-shadow-1);
  transition:background var(--d-ease),border-color var(--d-ease),box-shadow var(--d-ease),transform var(--d-ease);
}
html[data-theme="dark"] :is(.panel,.kpi-card){border-radius:var(--d-radius)}
html[data-theme="dark"] .panel:hover{border-color:var(--d-border-hover)}

/* O card de indicador ganha elevação no hover; os painéis de tabela, não,
   para a leitura não "pular" enquanto o olho percorre as linhas. */
html[data-theme="dark"] .kpi-card:hover{
  transform:translateY(-2px);
  background:var(--d-surface-2);
  border-color:var(--d-border-hover);
  box-shadow:var(--d-shadow-2);
}

/* ============================================================
   6. CARDS DE KPI — identidade por indicador
   A cor entra só no ícone e numa linha de 2px no topo.
   ============================================================ */
html[data-theme="dark"] .kpi-card{border-top:2px solid var(--d-primary)}
html[data-theme="dark"] .kpi-card:has(.kpi-icon.green){border-top-color:var(--d-success)}
html[data-theme="dark"] .kpi-card:has(.kpi-icon.orange){border-top-color:var(--d-warning)}
html[data-theme="dark"] .kpi-card:has(.kpi-icon.red){border-top-color:var(--d-danger)}
html[data-theme="dark"] .kpi-card:has(.kpi-icon.purple){border-top-color:var(--d-violet)}
html[data-theme="dark"] .kpi-card:has(.kpi-icon.blue){border-top-color:var(--d-highlight)}

html[data-theme="dark"] .kpi-icon{
  width:36px;height:36px;border-radius:9px;
  background:rgba(52,135,227,.10);color:var(--d-highlight);
  box-shadow:var(--d-glow);
  transition:background var(--d-ease),box-shadow var(--d-ease);
}
html[data-theme="dark"] .kpi-icon.green{background:rgba(72,213,151,.10);color:var(--d-success);box-shadow:0 0 20px rgba(72,213,151,.08)}
html[data-theme="dark"] .kpi-icon.orange{background:rgba(245,185,66,.10);color:var(--d-warning);box-shadow:0 0 20px rgba(245,185,66,.08)}
html[data-theme="dark"] .kpi-icon.red{background:rgba(239,102,114,.10);color:var(--d-danger);box-shadow:0 0 20px rgba(239,102,114,.08)}
html[data-theme="dark"] .kpi-icon.purple{background:rgba(155,124,248,.10);color:var(--d-violet);box-shadow:0 0 20px rgba(155,124,248,.08)}
html[data-theme="dark"] .kpi-icon.blue{background:rgba(82,211,232,.10);color:var(--d-cyan);box-shadow:0 0 20px rgba(82,211,232,.08)}
html[data-theme="dark"] .kpi-value{color:#FFF}
html[data-theme="dark"] .kpi-label{color:var(--d-muted);letter-spacing:.3px}

/* ============================================================
   7. TIPOGRAFIA
   ============================================================ */
html[data-theme="dark"] :is(.panel-title,.kpi-value,.emp-detail-value,.stat-val,.upload-text,.file-item-name,.bday-name,.bday-today-name,.approval-info strong,.custo-dashboard-heading h1,.custo-kpi-card .kpi-value,.custo-results .panel-title,.custo-insight-card strong,.custo-ranking-line,.bi-insight strong,.bic-story-card strong,.bic-row-strong,.bic-product-name strong,.bi-nav-title,.bi-empty-panel strong,.custo-pessoa-dados-title,.custo-pessoa-kpi strong,.dashboard-filter-heading strong,.user-access-section-title,.access-choice-copy strong,.module-permission-copy strong,.access-summary strong){color:var(--d-title)}
html[data-theme="dark"] :is(.panel-subtitle,.kpi-label,.emp-detail-label,.field-hint,.subtitle,.stat-label,.upload-hint,.bday-extra,.bday-today-sub,.custo-dashboard-heading p,.custo-results .panel-subtitle,.custo-insight-card p,.bi-insight p,.bic-story-card small,.bi-kpi-card small,.bi-empty,.bi-data-note,.custo-pessoa-search-hint,.custo-pessoa-kpi-label,.dashboard-filter-heading span,.access-choice-copy small,.module-permission-copy small,.user-access-section-help){color:var(--d-muted)}
html[data-theme="dark"] :is(.form-group label,.field label,.custo-pessoa-search-label,.custo-pessoa-competencia-select label,.fat-empresa-filter-head strong,.cc-access-heading,.custo-pessoa-no-data strong){color:var(--d-text)}
html[data-theme="dark"] :is([disabled],.is-disabled,.text-disabled){color:var(--d-disabled)}

/* ============================================================
   8. INPUTS E FILTROS
   ============================================================ */
html[data-theme="dark"] .app :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea),
html[data-theme="dark"] .login-card :is(input,select,textarea){
  background:var(--d-header);color:var(--d-text);
  border:1px solid rgba(255,255,255,.09);border-radius:8px;
  transition:border-color var(--d-ease),box-shadow var(--d-ease),background var(--d-ease);
}
html[data-theme="dark"] :is(input,select,textarea)::placeholder{color:var(--d-disabled)}
html[data-theme="dark"] .app :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea):hover{border-color:var(--d-border-hover)}
html[data-theme="dark"] :is(input,select,textarea):focus{
  border-color:rgba(52,135,227,.65);
  box-shadow:0 0 0 3px rgba(52,135,227,.10);
  outline:none;
}

/* ============================================================
   9. BOTÕES
   ============================================================ */
html[data-theme="dark"] .btn-primary{
  background:var(--d-primary);color:#FFF;border:1px solid rgba(255,255,255,.06);
  transition:background var(--d-ease),box-shadow var(--d-ease),transform var(--d-ease);
}
html[data-theme="dark"] .btn-primary:hover{background:var(--d-primary-strong);box-shadow:0 6px 20px rgba(52,135,227,.20)}
html[data-theme="dark"] .btn-primary:active{transform:translateY(1px)}
html[data-theme="dark"] :is(.btn-secondary,.period-mode-btn,.period-quick-actions button,.row-actions button,.cc-permission-chip,.custo-segment){
  background:var(--d-surface-2);color:var(--d-text);border-color:var(--d-border);
  transition:background var(--d-ease),border-color var(--d-ease),color var(--d-ease);
}
html[data-theme="dark"] :is(.btn-secondary,.period-mode-btn,.period-quick-actions button,.row-actions button):hover{
  background:var(--d-surface-3);color:#FFF;border-color:var(--d-border-hover);
}
html[data-theme="dark"] .period-mode-btn.is-active{
  background:rgba(52,135,227,.16);color:#FFF;border-color:var(--d-border-active);
  box-shadow:0 0 14px rgba(52,135,227,.18);
}
html[data-theme="dark"] :is(.btn-danger,.row-actions button.del){background:rgba(239,102,114,.12);color:#FFA8B1;border-color:rgba(239,102,114,.35)}
html[data-theme="dark"] :is(.btn-danger,.row-actions button.del):hover{background:rgba(239,102,114,.22);color:#FFF;border-color:rgba(239,102,114,.5)}

/* ============================================================
   10. TABELAS
   ============================================================ */
html[data-theme="dark"] :is(thead,.bic-table-panel thead,.custo-results thead th){background:var(--d-surface-2);color:var(--d-muted)}
html[data-theme="dark"] :is(th,.bic-table-panel th,.custo-results thead th){color:var(--d-muted);letter-spacing:.3px}
html[data-theme="dark"] :is(th,td){border-bottom-color:rgba(255,255,255,.06)}
html[data-theme="dark"] :is(tbody tr,.bic-table-panel tbody tr,.custo-results tbody tr){transition:background var(--d-ease)}
html[data-theme="dark"] :is(tbody tr:hover,.bic-table-panel tbody tr:hover,.custo-results tbody tr:hover){background:var(--d-surface-2)}
html[data-theme="dark"] .custo-results td:first-child{color:var(--d-text)}
html[data-theme="dark"] .bic-table-panel td{color:var(--d-text)}
html[data-theme="dark"] .custo-matriz-total{background:rgba(52,135,227,.10)!important;color:#BBD9FF!important}
html[data-theme="dark"] .custo-pessoa-total-row td{background:rgba(52,135,227,.10);color:#BBD9FF}
html[data-theme="dark"] .custo-pessoa-valor-cell{color:var(--d-title)}
html[data-theme="dark"] .custo-pessoa-formula-cell{color:var(--d-muted)}
html[data-theme="dark"] .row-highlight,html[data-theme="dark"] .row-highlight:hover{background:rgba(245,185,66,.10)!important}

/* ============================================================
   11. BLOCOS SECUNDÁRIOS — filtros, seleções e avisos
   ============================================================ */
html[data-theme="dark"] :is(.dashboard-period-filter,.dashboard-filter-side,.period-editor,.modules-check-list,.emp-detail-item,.custo-pessoa-info-grid .emp-detail-item,.custo-pessoa-kpi,.upload-area,.ben-drop,.file-item,.birthday-chip,.custo-insight-card,.bi-insight,.bic-filter-panel,.bi-filter-panel,.custo-filter-bar .dashboard-period-filter,.custo-filter-bar .dashboard-filter-side,.custo-insights,.custo-kpi-card-primary,.faturamento-manual-panel,.custo-pessoa-search-panel){
  background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text);
}
html[data-theme="dark"] :is(.access-choice-card,.module-permission-card,.fat-empresa-option){
  background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text);
  transition:background var(--d-ease),border-color var(--d-ease);
}
html[data-theme="dark"] :is(.access-choice-card,.module-permission-card,.fat-empresa-option):hover{background:var(--d-surface-3);border-color:var(--d-border-hover)}
html[data-theme="dark"] :is(.access-choice-card.is-selected,.module-permission-card.is-selected,.fat-empresa-option:has(input:checked),.cc-permission-chip.is-selected){
  background:rgba(52,135,227,.12);border-color:var(--d-border-active);color:var(--d-title);
}
html[data-theme="dark"] :is(.user-access-section,.user-access-actions,.fat-empresa-filter-wrap,.dashboard-extra-filters,.custo-more-filters){border-color:var(--d-border)}
html[data-theme="dark"] :is(.custo-access-section,.cc-access-area,.access-summary,.orcamento-note,.rateio-note){background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text)}
html[data-theme="dark"] :is(.cc-access-area p,.access-summary span,.manual-fat-note,.custo-more-filters summary,.fat-empresa-filter-head){color:var(--d-muted)}
html[data-theme="dark"] :is(.custo-pessoa-kpi.is-total,.bi-safe-state,.custo-dashboard-meta .custo-updated){background:rgba(72,213,151,.10);border-color:rgba(72,213,151,.30);color:#9FE8C8}
html[data-theme="dark"] :is(.custo-dashboard-meta span,.custo-filter-chip,.custo-ranking-label,.custo-segmented,.bi-tabs){background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text)}
html[data-theme="dark"] :is(.custo-filter-chip-period,.custo-ranking-position,.bi-rank,.bic-story-icon,.bi-skeleton-banner){background:rgba(52,135,227,.12);color:var(--d-highlight)}
html[data-theme="dark"] :is(.custo-ranking-item:hover,.custo-insight-card:hover){background:var(--d-surface-3);border-color:var(--d-border-hover)}
html[data-theme="dark"] .custo-segment.is-active{background:rgba(52,135,227,.16);color:#FFF}
html[data-theme="dark"] .bi-page{--bi-ink:var(--d-title);--bi-line:var(--d-border);--bi-soft:var(--d-surface-2)}
html[data-theme="dark"] .bi-tab{color:var(--d-muted);transition:background var(--d-ease),color var(--d-ease)}
html[data-theme="dark"] .bi-tab:hover{background:rgba(255,255,255,.04);color:#FFF}
html[data-theme="dark"] .bi-tab.is-active{background:rgba(52,135,227,.14);color:#FFF}

/* ============================================================
   12. HERO — o bloco de abertura de cada módulo
   Gradiente discreto e um desenho geométrico de baixa opacidade
   no canto direito, para dar personalidade sem disputar leitura.
   ============================================================ */
html[data-theme="dark"] :is(.welcome-panel,.user-access-hero,.custo-pessoa-hero,.bi-hero,.bi-page .bi-hero,.bic-hero){
  position:relative;overflow:hidden;
  background:linear-gradient(110deg,#171A20 0%,#12151A 55%,rgba(31,111,235,.10) 100%)!important;
  border:1px solid var(--d-border);box-shadow:var(--d-shadow-1);
}
html[data-theme="dark"] :is(.welcome-panel,.user-access-hero,.custo-pessoa-hero,.bi-hero,.bic-hero):after{
  content:'';position:absolute;right:-70px;top:-90px;width:280px;height:280px;border-radius:50%;
  border:1px solid rgba(82,168,255,.14);
  box-shadow:0 0 0 34px rgba(82,168,255,.03),inset 0 0 60px rgba(52,135,227,.06);
  pointer-events:none;
}
html[data-theme="dark"] .bi-page :is(.kpi-card,.panel):hover{border-color:var(--d-border-hover);box-shadow:var(--d-shadow-2)}
html[data-theme="dark"] :is(.bi-chart-empty,.bic-product-photo){background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-muted)}
html[data-theme="dark"] :is(.bi-skeleton-line,.custo-shimmer,.bi-progress-track,.bic-share-track,.bic-goal-track,.custo-ranking-bar){background:rgba(255,255,255,.06)}
html[data-theme="dark"] .bi-skeleton-line:after,html[data-theme="dark"] .bi-skeleton-chart:after,html[data-theme="dark"] .custo-shimmer:after{background:linear-gradient(90deg,transparent,rgba(82,168,255,.10),transparent)}
html[data-theme="dark"] .bi-skeleton-chart{background:linear-gradient(180deg,var(--d-surface-1),var(--d-surface-2))}
html[data-theme="dark"] .bi-results.bi-updating:before{background:rgba(11,13,16,.62)}
html[data-theme="dark"] :is(.bi-update-status,.custo-results.is-loading:after){background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text)}

/* Cascata do mês e painel de orçamento do B.I. */
html[data-theme="dark"] :is(.bi-cascata-linha,.bi-orc-item){background:var(--d-surface-2);border-color:var(--d-border)}
html[data-theme="dark"] .bi-cascata-rotulo strong{color:var(--d-title)}
html[data-theme="dark"] :is(.bi-cascata-rotulo small,.bi-cascata-valor small,.bi-orc-item small,.bi-orc-label){color:var(--d-muted)}
html[data-theme="dark"] .bi-cascata-valor strong{color:var(--d-title)}
html[data-theme="dark"] .bi-cascata-barra{background:rgba(255,255,255,.06)}
html[data-theme="dark"] .bi-cascata-entrada{background:rgba(52,135,227,.10);border-color:var(--d-border-active)}
html[data-theme="dark"] .bi-cascata-saida .bi-cascata-valor strong{color:var(--d-warning)}
html[data-theme="dark"] .bi-cascata-saida .bi-cascata-barra span{background:var(--d-warning)}
html[data-theme="dark"] .bi-cascata-subtotal{background:rgba(72,213,151,.10);border-color:rgba(72,213,151,.30)}
html[data-theme="dark"] .bi-cascata-subtotal .bi-cascata-barra span{background:var(--d-success)}
html[data-theme="dark"] .bi-cascata-total{background:linear-gradient(110deg,#171A20,#12151A 60%,rgba(31,111,235,.14));border-color:var(--d-border-active)}
html[data-theme="dark"] .bi-cascata-total .bi-cascata-barra span{background:var(--d-cyan)}
html[data-theme="dark"] .bi-cascata-aviso{background:rgba(245,185,66,.10);color:#FBD68E}
html[data-theme="dark"] .bi-orc-item strong{color:var(--d-title)}
html[data-theme="dark"] .bi-orc-item.is-ok{background:rgba(72,213,151,.10);border-color:rgba(72,213,151,.30)}
html[data-theme="dark"] .bi-orc-item.is-alerta{background:rgba(245,185,66,.10);border-color:rgba(245,185,66,.30)}
html[data-theme="dark"] .bi-orc-item.is-alerta strong{color:var(--d-warning)}

/* ============================================================
   13. LISTAS SUSPENSAS E RESULTADOS DE BUSCA
   ============================================================ */
html[data-theme="dark"] .custo-pessoa-suggestions{background:var(--d-surface-2);border-color:var(--d-border);box-shadow:var(--d-shadow-2)}
html[data-theme="dark"] .custo-pessoa-result-item{background:transparent;border-color:var(--d-border);color:var(--d-muted);transition:background var(--d-ease),color var(--d-ease)}
html[data-theme="dark"] .custo-pessoa-result-item:hover{background:var(--d-surface-3);color:#FFF}
html[data-theme="dark"] .custo-pessoa-result-copy strong{color:var(--d-title)}
html[data-theme="dark"] .custo-pessoa-result-copy small{color:var(--d-muted)}
html[data-theme="dark"] .custo-pessoa-no-data{color:var(--d-muted)}
html[data-theme="dark"] :is(.upload-area:hover,.ben-drop:hover,.ben-drop.drag-over){background:var(--d-surface-3);border-color:var(--d-border-active)}
html[data-theme="dark"] .ben-drop.carregado{background:rgba(72,213,151,.10);border-color:rgba(72,213,151,.35)}
html[data-theme="dark"] .ben-drop-titulo{color:var(--d-title)}

/* ============================================================
   14. CORES SEMÂNTICAS — avisos, alertas e etiquetas
   ============================================================ */
html[data-theme="dark"] .panel-birthday-today{background:linear-gradient(135deg,rgba(72,213,151,.10),var(--d-surface-1));border-color:rgba(72,213,151,.30)}
html[data-theme="dark"] .birthday-chip.today{background:rgba(72,213,151,.10);border-color:rgba(72,213,151,.30)}
html[data-theme="dark"] .panel-warn{background:rgba(245,185,66,.10);border-left-color:var(--d-warning)}
html[data-theme="dark"] :is(.alert.danger,.user-form-alert,.bi-error){background:rgba(239,102,114,.10);border-color:rgba(239,102,114,.32);color:#FFB3BA}
html[data-theme="dark"] .alert.warn{background:rgba(245,185,66,.10);border-color:rgba(245,185,66,.30)}
html[data-theme="dark"] :is(.alert.success,.import-stat.green){background:rgba(72,213,151,.10);border-color:rgba(72,213,151,.30)}
html[data-theme="dark"] .import-stat.red{background:rgba(239,102,114,.10)}
html[data-theme="dark"] :is(.alert-content strong,.toast strong){color:var(--d-title)}
html[data-theme="dark"] :is(.alert-content p,.toast p){color:var(--d-muted)}
html[data-theme="dark"] .badge-gray{background:rgba(255,255,255,.07);color:var(--d-text)}
html[data-theme="dark"] .badge-blue{background:rgba(52,135,227,.14);color:#AFD4FF}
html[data-theme="dark"] .badge-green{background:rgba(72,213,151,.14);color:#96E7C6}
html[data-theme="dark"] .badge-orange{background:rgba(245,185,66,.14);color:#FBD68E}
html[data-theme="dark"] .badge-red{background:rgba(239,102,114,.14);color:#FFB3BA}
html[data-theme="dark"] .badge-purple{background:rgba(155,124,248,.14);color:#CDBBFF}
html[data-theme="dark"] :is(.custo-trend-favorable){color:var(--d-success)}
html[data-theme="dark"] :is(.custo-trend-unfavorable){color:var(--d-danger)}
html[data-theme="dark"] :is(.custo-trend-neutral){color:var(--d-muted)}

/* ============================================================
   15. LOGIN
   ============================================================ */
html[data-theme="dark"] .login-screen{background:radial-gradient(1200px 600px at 20% -10%,rgba(52,135,227,.10),transparent 60%),linear-gradient(135deg,#0B0D10,#141820)}
html[data-theme="dark"] .login-card{box-shadow:var(--d-shadow-2)}
html[data-theme="dark"] .login-card h1{color:var(--d-title)}
html[data-theme="dark"] .pw-toggle:hover{background:var(--d-surface-3);color:#FFF}
html[data-theme="dark"] .text-muted{color:var(--d-muted)}

/* ============================================================
   16. AJUSTES PARA CORES ESCRITAS DIRETO NO JAVASCRIPT
   Vários blocos são montados com style inline; aqui essas cores
   são traduzidas para os tokens do tema.
   ============================================================ */
html[data-theme="dark"] .app :is([style*="color:#0F2A4F" i],[style*="color:#1E3A5F" i],[style*="color:#374151" i]){color:var(--d-title)!important}
html[data-theme="dark"] .app :is([style*="color:#6B7280" i],[style*="color:#64748B" i],[style*="color:#9CA3AF" i],[style*="color:#52657A" i]){color:var(--d-muted)!important}
html[data-theme="dark"] .app :is([style*="color:#1E6FD9" i],[style*="color:#1565C0" i]){color:var(--d-highlight)!important}
html[data-theme="dark"] .app :is([style*="color:#92400E" i],[style*="color:#78350F" i],[style*="color:#B45309" i],[style*="color:#D97706" i]){color:var(--d-warning)!important}
html[data-theme="dark"] .app :is([style*="color:#DC2626" i],[style*="color:#991B1B" i],[style*="color:#EF4444" i]){color:var(--d-danger)!important}
html[data-theme="dark"] .app [style*="color:#059669" i]{color:var(--d-success)!important}
html[data-theme="dark"] .app :is([style*="background:#fff" i],[style*="background:#F9FAFB" i],[style*="background:#F3F4F6" i]){background:var(--d-surface-2)!important}
html[data-theme="dark"] .app :is([style*="background:#DBEAFE" i],[style*="background:#EBF3FF" i],[style*="background:#EFF6FF" i]){background:rgba(52,135,227,.12)!important}
html[data-theme="dark"] .app :is([style*="background:#FEF3C7" i],[style*="background:#FFFBEB" i]){background:rgba(245,185,66,.10)!important}
html[data-theme="dark"] .app :is([style*="background:#FEE2E2" i],[style*="background:#FEF2F2" i]){background:rgba(239,102,114,.10)!important}
html[data-theme="dark"] .app [style*="background:#0F2A4F" i]{background:var(--d-surface-2)!important;border:1px solid var(--d-border)}

/* ============================================================
   17. RESPONSIVO E ACESSIBILIDADE
   ============================================================ */
@media(max-width:768px){
  html[data-theme="dark"] .app tbody tr{background:var(--d-surface-1);border-color:var(--d-border)}
  html[data-theme="dark"] .app tbody tr:hover{background:var(--d-surface-2)}
  html[data-theme="dark"] .app td{border-bottom-color:var(--d-border)}
  html[data-theme="dark"] .app td::before{color:var(--d-muted)}
  html[data-theme="dark"] .app td:first-child{border-bottom-color:var(--d-border-hover)}
}
@media(prefers-reduced-motion:reduce){
  .theme-toggle-track,.theme-toggle-thumb,.theme-toggle-thumb i{transition:none!important}
  html[data-theme="dark"] :is(.panel,.kpi-card,.nav-item,.btn-primary,.btn-secondary,tbody tr){transition:none!important}
  html[data-theme="dark"] .kpi-card:hover{transform:none}
}

/* PWA e "ficar conectado" no modo escuro. */
html[data-theme="dark"] .login-lembrar{color:var(--d-muted)}
html[data-theme="dark"] .pwa-instalar{background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-highlight)}
html[data-theme="dark"] .pwa-instalar:hover{background:var(--d-surface-3);border-color:var(--d-border-hover)}
html[data-theme="dark"] .pwa-ajuda{background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text);box-shadow:var(--d-shadow-2)}
html[data-theme="dark"] .pwa-ajuda strong{color:var(--d-title)}
html[data-theme="dark"] .pwa-ajuda-fechar{background:var(--d-primary)}

/* Convite de instalação e "ficar conectado" no modo escuro. */
html[data-theme="dark"] .login-lembrar{color:var(--d-muted)}
html[data-theme="dark"] .pwa-card{background:var(--d-surface-2);border-color:var(--d-border);box-shadow:var(--d-shadow-2)}
html[data-theme="dark"] .pwa-card-icone{background:rgba(52,135,227,.12);color:var(--d-highlight)}
html[data-theme="dark"] .pwa-card-texto strong{color:var(--d-title)}
html[data-theme="dark"] .pwa-card-texto p{color:var(--d-muted)}
html[data-theme="dark"] .pwa-card-depois{color:var(--d-muted)}
html[data-theme="dark"] .pwa-card-depois:hover{background:rgba(255,255,255,.06);color:#FFF}
html[data-theme="dark"] .user-app-badge{background:rgba(72,213,151,.14);color:#96E7C6}

/* B.I de gestão no modo escuro: as cores de identidade sobem um degrau de
   claridade para manter o contraste sobre a superfície escura. */
html[data-theme="dark"] .bg-cor-blue{color:#5B9BFF}html[data-theme="dark"] .bg-cor-green{color:#48D597}
html[data-theme="dark"] .bg-cor-purple{color:#9B7CF8}html[data-theme="dark"] .bg-cor-orange{color:#F5B942}
html[data-theme="dark"] .bg-cor-gray{color:#8993A4}html[data-theme="dark"] .bg-cor-teal{color:#52D3E8}
html[data-theme="dark"] .bg-cor-red{color:#EF6672}
html[data-theme="dark"] .bg-fundo-blue{background:#4E8FF0}html[data-theme="dark"] .bg-fundo-green{background:#3CC48A}
html[data-theme="dark"] .bg-fundo-purple{background:#9B7CF8}html[data-theme="dark"] .bg-fundo-orange{background:#F0A93A}
html[data-theme="dark"] .bg-fundo-gray{background:#6B7586}html[data-theme="dark"] .bg-fundo-teal{background:#45C3D8}
html[data-theme="dark"] .bg-fundo-red{background:#EF6672}
html[data-theme="dark"] :is(.bg-bom,.bg-var.is-bom){color:var(--d-success)}
html[data-theme="dark"] :is(.bg-ruim,.bg-var.is-ruim){color:var(--d-danger)}
html[data-theme="dark"] :is(.bg-muted,.bg-var.is-neutro,.bg-kpi-var,.bg-kpi-sub,.bg-painel-sub,.bg-barra-sub,.bg-subtitulo,.bg-filtro-nota,.bg-vazio,.bg-nome small,.bg-atencao-texto small,.bg-dialog-texto,.bg-abc-item small){color:var(--d-muted)}
html[data-theme="dark"] :is(.bg-kpi-valor,.bg-painel-titulo,.bg-periodo-rotulo,.bg-barra-topo strong,.bg-nome strong,.bg-atencao-texto strong,.bg-dialog h2){color:var(--d-title)}
html[data-theme="dark"] :is(.bg-kpi-rotulo,.bg-barra-topo span,.bg-data,.bg-abc-item span,.bg-dialog-linha.is-cabecalho){color:var(--d-text)}
html[data-theme="dark"] .bg-kpi{background:var(--d-surface-1);border-color:var(--d-border);box-shadow:none}
html[data-theme="dark"] .bg-kpi.is-laranja{border-left-color:var(--d-warning)}html[data-theme="dark"] .bg-kpi.is-vermelho{border-left-color:var(--d-danger)}
html[data-theme="dark"] .bg-painel{border-color:var(--d-border)}
html[data-theme="dark"] .bg-painel-titulo i{color:var(--d-highlight)}
html[data-theme="dark"] :is(.bg-acao,.bg-chip,.bg-nav-btn,.bg-ver-todos){background:var(--d-surface-2);border-color:var(--d-border);color:var(--d-text)}
html[data-theme="dark"] :is(.bg-acao,.bg-chip,.bg-nav-btn,.bg-ver-todos):hover{background:var(--d-surface-3);border-color:var(--d-border-hover);color:#FFF}
html[data-theme="dark"] .bg-chip.is-ativo{background:rgba(52,135,227,.16);border-color:var(--d-border-active);color:#FFF}
html[data-theme="dark"] .bg-chip.is-ativo .bg-chip-dot{background:var(--d-highlight)}
html[data-theme="dark"] .bg-chip-dot{background:#4A5361}
html[data-theme="dark"] .bg-seg{background:var(--d-surface-2);border-color:var(--d-border)}
html[data-theme="dark"] .bg-seg-btn{color:var(--d-muted)}
html[data-theme="dark"] .bg-seg-btn:hover{color:#FFF}
html[data-theme="dark"] .bg-seg-btn.is-ativo{background:rgba(52,135,227,.18);color:#FFF;box-shadow:none}
html[data-theme="dark"] .bg-link{color:var(--d-highlight)}
html[data-theme="dark"] .bg-barra-trilho{background:rgba(255,255,255,.07)}
html[data-theme="dark"] .bg-barra-marca{background:#F7F9FC}
html[data-theme="dark"] .bg-tabela{border-color:var(--d-border)}
html[data-theme="dark"] .bg-tabela thead{background:var(--d-surface-2)}
html[data-theme="dark"] .bg-tabela th{color:var(--d-muted)}
html[data-theme="dark"] .bg-tabela td{color:var(--d-text)}
html[data-theme="dark"] .bg-tabela tbody tr:hover{background:var(--d-surface-3)}
html[data-theme="dark"] .bg-atencao-item{background:var(--d-surface-2);border-color:var(--d-border)}
html[data-theme="dark"] .bg-atencao-item:hover{background:var(--d-surface-3)}
html[data-theme="dark"] .bg-atencao-item.is-alerta{border-left-color:var(--d-danger)}
html[data-theme="dark"] .bg-atencao-item.is-atencao{border-left-color:var(--d-warning)}
html[data-theme="dark"] .bg-atencao-item.is-info{border-left-color:var(--d-highlight)}
html[data-theme="dark"] .is-alerta .bg-atencao-icone{background:rgba(239,102,114,.14);color:var(--d-danger)}
html[data-theme="dark"] .is-atencao .bg-atencao-icone{background:rgba(245,185,66,.14);color:var(--d-warning)}
html[data-theme="dark"] .is-info .bg-atencao-icone{background:rgba(82,168,255,.14);color:var(--d-highlight)}
html[data-theme="dark"] .bg-selo.is-ok{background:rgba(72,213,151,.14);color:#96E7C6}
html[data-theme="dark"] .bg-selo.is-aviso{background:rgba(245,185,66,.14);color:#F5CF7A}
html[data-theme="dark"] .bg-selo.is-velho{background:rgba(239,102,114,.14);color:#F49AA2}
html[data-theme="dark"] .bg-abc-item{border-color:var(--d-border);background:var(--d-surface-2)}
html[data-theme="dark"] .bg-abc-a strong{color:var(--d-success)}html[data-theme="dark"] .bg-abc-b strong{color:var(--d-warning)}html[data-theme="dark"] .bg-abc-c strong{color:var(--d-muted)}
html[data-theme="dark"] .bg-abc-tag.bg-abc-a{background:rgba(72,213,151,.14);color:var(--d-success)}
html[data-theme="dark"] .bg-abc-tag.bg-abc-b{background:rgba(245,185,66,.14);color:var(--d-warning)}
html[data-theme="dark"] .bg-abc-tag.bg-abc-c{background:rgba(255,255,255,.06);color:var(--d-muted)}
html[data-theme="dark"] .bg-dialog{background:var(--d-surface-2);color:var(--d-text);box-shadow:var(--d-shadow-2)}
html[data-theme="dark"] .bg-dialog::backdrop{background:rgba(0,0,0,.6)}
html[data-theme="dark"] .bg-dialog-erro{background:rgba(239,102,114,.14);color:#F49AA2}
html[data-theme="dark"] .bg-tv-sair{background:rgba(25,29,35,.9)}
