/* =============================================================================
   dark-overrides.css — Correções de MODO ESCURO (data-theme="dark") do painel.

   REGRA DE OURO: TODAS as regras deste arquivo estão sob [data-theme="dark"].
   O modo claro (light) NUNCA é tocado por este arquivo → zero risco de regressão.

   Carregado por ÚLTIMO no shell (index.tpl), depois de main.css, para vencer por
   ordem de cascata. Onde há cor fixa/inline com !important no CSS legado, usamos
   !important aqui (apenas dentro do escopo dark).

   Motivo raiz do problema: o sistema de tokens (fw.css/theme.css) inverte
   --color-bg / --color-contrast-* no dark, MAS mantém --color-primary /
   --color-primary-darker escuros (verde 8%/20% de luminância). Telas que usam esses
   tokens como COR DE TEXTO, ou que usam cores hexadecimais fixas claras/escuras,
   ficam ilegíveis no escuro. Aqui remapeamos só o que quebra.

   Gráficos (Chart.js): tratados por chart-theme.js (hook global de defaults).
   Cores SEMÂNTICAS (verde=positivo, vermelho=negativo, laranja=alerta) são
   preservadas/clareadas, nunca neutralizadas.
   ============================================================================= */

/* Tokens auxiliares locais — só existem no dark, reaproveitados abaixo */
[data-theme="dark"] {
    --dk-text:        var(--color-contrast-high, #c7ced6);   /* texto principal claro */
    --dk-text-muted:  var(--color-contrast-medium, #9aa1ab); /* texto secundário */
    --dk-surface:     var(--color-bg-light, #1f2023);        /* card / ilha */
    --dk-surface-2:   var(--color-bg-lighter, #26272b);      /* header de card / faixa */
    --dk-border:      var(--color-contrast-lower, #33343a);  /* bordas */
    --dk-accent:      #4fd07a;                               /* verde claro legível */
    --dk-pos:         #3fb950;                               /* positivo (verde) */
    --dk-neg:         #f85149;                               /* negativo (vermelho) */
    --dk-warn:        #f0a232;                               /* alerta (laranja) */
}

/* =============================================================================
   1) PAINEL COMERCIAL  (#painel-comercial)
   Bug: valores/títulos/percentuais usam --color-primary-darker / --color-primary
   (verde muito escuro) como cor de texto → somem no fundo escuro.
   ============================================================================= */

/* Valor grande dos KPIs (era verde-escuro → some) */
[data-theme="dark"] #painel-comercial .pc-card-valor {
    color: var(--dk-text) !important;
}

/* Borda dos cards (primary-darker fica invisível no escuro) */
[data-theme="dark"] #painel-comercial .pc-card {
    border-color: var(--dk-border) !important;
}

/* Cabeçalho do card: fundo verde-escuro + texto branco — legível, mas destacamos a faixa */
[data-theme="dark"] #painel-comercial .pc-card-titulo {
    background-color: var(--color-primary-dark, #0e4f12) !important;
    color: #ffffff !important;
}

/* Títulos de bloco de gráfico (eram verde-escuro) */
[data-theme="dark"] #painel-comercial .pc-bloco-titulo {
    color: var(--dk-accent) !important;
    border-bottom-color: var(--dk-accent) !important;
}

/* Percentual do mix (era --color-primary, verde-escuro) */
[data-theme="dark"] #painel-comercial .pc-mix-pct {
    color: var(--dk-accent) !important;
}

/* Deltas semânticos — clareia p/ contraste no escuro (mantém verde/vermelho) */
[data-theme="dark"] #painel-comercial .pc-delta--pos { color: var(--dk-pos) !important; }
[data-theme="dark"] #painel-comercial .pc-delta--neg { color: var(--dk-neg) !important; }

/* =============================================================================
   2) EMPRESA (admin/empresa.tpl) — 100% estilos INLINE, sem id/classe.
   Sobrescrevemos casando a string literal do atributo style (só no dark).
   O header verde (#034405) + texto branco já é legível → mantido.
   ============================================================================= */

/* Fundos claros fixos → superfícies escuras */
[data-theme="dark"] [style*="background: #ffffff"] { background: var(--dk-surface) !important; }
[data-theme="dark"] [style*="background: #f8f9fa"] { background: var(--color-bg, #16171a) !important; }
[data-theme="dark"] [style*="background: #e2e8f0"] { background: var(--dk-surface-2) !important; }

/* Textos escuros fixos → claros */
[data-theme="dark"] [style*="color: #333"] { color: var(--dk-text) !important; }
[data-theme="dark"] [style*="color: #555"] { color: var(--dk-text-muted) !important; }
[data-theme="dark"] [style*="color: #777"] { color: var(--dk-text-muted) !important; }

/* Verde-escuro fixo em links/heading (#1a3d1a) → verde claro legível */
[data-theme="dark"] [style*="color: #1a3d1a"] { color: var(--dk-accent) !important; }

/* =============================================================================
   3) LOGS (admin/logs.tpl) — filtro com fundo/borda/texto claros fixos
   ============================================================================= */
[data-theme="dark"] .logs-filtro {
    background: var(--dk-surface) !important;
    border-color: var(--dk-border) !important;
}
[data-theme="dark"] .logs-filtro label {
    color: var(--dk-text) !important;
}

/* =============================================================================
   4) DETALHES DE PAGAMENTO (admin/detalhes_pag.tpl) — classes de cacique.css
   .value(color:#333) / .block(bg:#fff) / .block-title(bg:#e0e0e0)
   ============================================================================= */
[data-theme="dark"] .value {
    color: var(--dk-text) !important;
}
[data-theme="dark"] .block {
    background-color: var(--dk-surface) !important;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.4) !important;
}
[data-theme="dark"] .block-title {
    background-color: var(--dk-surface-2) !important;
    color: var(--dk-text) !important;
}

/* =============================================================================
   5) HOME / cards de info (home.css) — .infoTitulo/.infoConteudo com cor fixa escura
   ============================================================================= */
[data-theme="dark"] .infoTitulo   { color: var(--dk-text) !important; }
[data-theme="dark"] .infoConteudo { color: var(--dk-text-muted) !important; }
[data-theme="dark"] .linha        { border-bottom-color: var(--dk-border) !important; }

/* =============================================================================
   6) RESÍDUOS DO FRAMEWORK LEGADO (main.css / form.css) com cor fixa clara
   Aparecem em diálogos, painel de config da geraTabela, tabelas legadas.
   ============================================================================= */

/* Painel branco das abas (main.css: .ui-tabs-panel { background:#fff !important }) */
[data-theme="dark"] .ui-tabs-panel {
    background: var(--dk-surface) !important;
    border-color: var(--dk-border) !important;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5) !important;
    color: var(--dk-text) !important;
}

/* Coluna "apagada" no config da geraTabela (fundo/texto claros) */
[data-theme="dark"] .ui-state-default.ui-state-erased {
    background: var(--dk-surface-2) !important;
    color: var(--dk-text-muted) !important;
}

/* Título de diálogo jQuery UI: usava --color-primary (verde-escuro) → clareia */
[data-theme="dark"] .ui-widget-header {
    color: var(--dk-accent) !important;
}

/* Tabelas legadas .lista_pagadores/.lista_coletas/.lista_ocorrencia/.log_usuarios
   (thead #ddd, odd #ccc, tfoot #ddd, bordas #777) */
[data-theme="dark"] .lista_pagadores thead,
[data-theme="dark"] .lista_coletas thead,
[data-theme="dark"] .lista_ocorrencia thead,
[data-theme="dark"] .log_usuarios thead,
[data-theme="dark"] .lista_pagadores tfoot,
[data-theme="dark"] .lista_coletas tfoot {
    background: var(--dk-surface-2) !important;
    border-color: var(--dk-border) !important;
    color: var(--dk-text) !important;
}
[data-theme="dark"] .lista_pagadores .odd,
[data-theme="dark"] .lista_coletas .odd {
    background: var(--dk-surface) !important;
}

/* form.css: chip de legenda claro + textos cinza-escuro fixos */
[data-theme="dark"] .fieldSet-group > legend {
    background: var(--dk-surface-2) !important;
    color: var(--dk-text) !important;
}
[data-theme="dark"] .fieldSet-group {
    border-color: var(--dk-border) !important;
}
[data-theme="dark"] .geraFormInfo { color: var(--dk-text-muted) !important; }
[data-theme="dark"] .linhaTR .ro  { color: var(--dk-text-muted) !important; }