/* ─── CIDI · tema escuro ──────────────────────────────────────────────────
   Arquivo separado de propósito: o app.css tem 123 KB com muita cor fixa no
   meio das regras. Aqui ficam só as sobreposições do modo escuro — dá para
   conferir tudo num lugar, e para desligar basta remover o <link>.

   Um bloco só, sem @media: quem decide o tema é o script no <head>, que
   sempre marca data-theme="dark" ou "light" no <html> — vindo da escolha
   salva ou, na falta dela, da preferência do sistema. Assim o CSS não
   precisa repetir cada regra em duas variantes.
   ------------------------------------------------------------------------ */

:root[data-theme="dark"] {
  color-scheme: dark;

  /* Superfícies em camadas — fundo < card < elemento elevado. Preto puro
     cansa a vista e apaga a hierarquia. */
  --bg:#0f171e;
  --surface:#16212b;
  --surface-2:#1d2b36;
  --surface-3:#22323e;

  /* O #002B49 original vira ilegível no escuro; os títulos sobem para um
     azul claro que mantém a identidade com contraste suficiente. */
  --primary:#8fd3ee;
  --primary-2:#b3e2f5;
  --soft:#15242e;

  /* O app.css define --heading/--heading-soft depois de --primary, e são
     eles que valem nos títulos. Esqueci na primeira versão e o "Central de
     Demandas" saiu azul-escuro sobre fundo escuro. */
  --heading:#a8dcf2;
  --heading-soft:#87c3dc;

  --text:#dbe6ed;
  --muted:#94a6b2;
  --border:#27363f;
  --white:#16212b;
  --accent:#35BFEA;
  --button:#FFD43B;

  /* Faróis de SLA e avisos: mesma cor de significado, fundo rebaixado. */
  --ok-bg:#102c1e;   --ok-fg:#63cf93;
  --warn-bg:#312608; --warn-fg:#f0bf52;
  --err-bg:#361a19;  --err-fg:#ff9a92;

  /* Cores nomeadas usadas em texto: as originais são escuras demais aqui. */
  --green:#63cf93;
  --yellow:#f0bf52;
  --red:#ff9a92;

  --shadow:0 10px 26px rgba(0,0,0,.38);
}

/* ── superfícies ─────────────────────────────────────────────────────── */
:root[data-theme="dark"] body { background:var(--bg); color:var(--text); }
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .stat,
:root[data-theme="dark"] .login-card,
:root[data-theme="dark"] .dropdown-menu,
:root[data-theme="dark"] .kanban-card,
:root[data-theme="dark"] .nfe-resumo,
:root[data-theme="dark"] .ajuda-item,
:root[data-theme="dark"] .tour-balao,
:root[data-theme="dark"] .membro-chip,
:root[data-theme="dark"] .cbx-list { background:var(--surface); border-color:var(--border); }

:root[data-theme="dark"] .topbar { background:var(--surface); border-bottom-color:var(--border); }
:root[data-theme="dark"] .sidebar { background:#101a22; }
:root[data-theme="dark"] .hero-card { background:var(--soft); border-color:var(--border); }
:root[data-theme="dark"] .kanban-col,
:root[data-theme="dark"] .kpis div,
:root[data-theme="dark"] .ajuda-dica,
:root[data-theme="dark"] .membros-painel,
:root[data-theme="dark"] .ajuda-embreve { background:var(--soft); border-color:var(--border); }

:root[data-theme="dark"] .comment { background:var(--surface-2); border-left-color:var(--accent); }
:root[data-theme="dark"] .comment.internal { background:#2a2410; border-left-color:var(--warn-fg); }
:root[data-theme="dark"] .login-page { background:linear-gradient(135deg,#101c25,var(--bg)); }

/* ── texto ───────────────────────────────────────────────────────────── */
:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] .topbar h1,
:root[data-theme="dark"] .topbar-title h1,
:root[data-theme="dark"] .hero-card h2,
:root[data-theme="dark"] .card h2,
:root[data-theme="dark"] .report-hero h2,
:root[data-theme="dark"] .executive-section-head h2,
:root[data-theme="dark"] .kanban-col h3,
:root[data-theme="dark"] .login-brand h1,
:root[data-theme="dark"] .form label,
:root[data-theme="dark"] .stat strong,
:root[data-theme="dark"] .kpis strong,
:root[data-theme="dark"] .hero-card span { color:var(--primary); }

:root[data-theme="dark"] .muted,
:root[data-theme="dark"] .stat span,
:root[data-theme="dark"] .kpis span,
:root[data-theme="dark"] th,
:root[data-theme="dark"] .kanban-card small,
:root[data-theme="dark"] .timeline span,
:root[data-theme="dark"] .dropdown-menu span,
:root[data-theme="dark"] .login-brand p { color:var(--muted); }

/* ── campos ──────────────────────────────────────────────────────────── */
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] .cbx-input,
:root[data-theme="dark"] .list-search { background:var(--surface-2); color:var(--text); border-color:var(--border); }
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder,
:root[data-theme="dark"] .cbx-input::placeholder { color:var(--muted); }
:root[data-theme="dark"] option { background:var(--surface-2); color:var(--text); }

/* ── botões e pílulas ────────────────────────────────────────────────── */
:root[data-theme="dark"] .btn,
:root[data-theme="dark"] .btn-light,
:root[data-theme="dark"] .icon-btn,
:root[data-theme="dark"] .pill,
:root[data-theme="dark"] code,
:root[data-theme="dark"] .anexo-mini,
:root[data-theme="dark"] .anexo-remover,
:root[data-theme="dark"] .tour-sair,
:root[data-theme="dark"] .membro-chip-remover { background:var(--surface-3); color:var(--primary); }
:root[data-theme="dark"] .btn-primary { background:var(--button); color:#10202b; }
:root[data-theme="dark"] .pill-muted { background:var(--surface-3); color:var(--muted); }
:root[data-theme="dark"] .btn-danger { background:var(--err-bg); color:var(--err-fg); }
:root[data-theme="dark"] .btn-success,
:root[data-theme="dark"] .pill-success { background:var(--ok-bg); color:var(--ok-fg); }

/* ── tabelas e divisores ─────────────────────────────────────────────── */
:root[data-theme="dark"] th,
:root[data-theme="dark"] td { border-bottom-color:var(--border); }
:root[data-theme="dark"] .import-form { border-color:var(--border); }

/* ── avisos e faróis de SLA ──────────────────────────────────────────── */
:root[data-theme="dark"] .alert-success,
:root[data-theme="dark"] .sla.green { background:var(--ok-bg); color:var(--ok-fg); }
:root[data-theme="dark"] .alert-warning,
:root[data-theme="dark"] .sla.yellow,
:root[data-theme="dark"] .nfe-alerta,
:root[data-theme="dark"] .membros-aviso { background:var(--warn-bg); color:var(--warn-fg); }
:root[data-theme="dark"] .alert-danger,
:root[data-theme="dark"] .sla.red { background:var(--err-bg); color:var(--err-fg); }
:root[data-theme="dark"] .warning-list li { color:var(--warn-fg); }
:root[data-theme="dark"] .error-list li { color:var(--err-fg); }

/* ── listas de busca e rail ──────────────────────────────────────────── */
:root[data-theme="dark"] .cbx-item:hover,
:root[data-theme="dark"] .cbx-item[aria-selected="true"],
:root[data-theme="dark"] .dropdown-menu a:hover { background:var(--surface-3); }
:root[data-theme="dark"] .rail-panel-link { background:var(--surface-2); color:var(--text); border-color:var(--border); }

/* O anel decorativo do hero fica agressivo sobre fundo escuro. */
:root[data-theme="dark"] .hero-card:after { opacity:.18; }

/* ── painel lateral (rail.css) ───────────────────────────────────────────
   O rail.css usa !important em quase tudo, então as sobreposições daqui
   precisam usar também — não é preferência, é o único jeito de vencer. */
:root[data-theme="dark"] .rail-panel {
  background:var(--surface) !important;
  border-right-color:var(--border) !important;
}
:root[data-theme="dark"] .rail-panel-link { color:var(--text) !important; }
:root[data-theme="dark"] .rail-panel-link:hover {
  background:var(--surface-3) !important;
  color:var(--primary) !important;
}
:root[data-theme="dark"] .rail-panel-link.active {
  background:var(--accent) !important;
  color:#0f171e !important;
}
:root[data-theme="dark"] .rail-panel-section-label { color:var(--muted) !important; }


/* ── varredura automática ────────────────────────────────────────────────
   Gerado a partir do app.css/cbx.css/rail.css: toda regra que pintava
   fundo claro ou texto escuro ganha aqui o equivalente do tema escuro.
   Feito por varredura, e não à mão, porque o projeto tem muitos
   componentes próprios — na primeira versão eu cobri os principais e
   sobraram o painel lateral e as linhas do catálogo.
   ---------------------------------------------------------------------- */
:root[data-theme="dark"] .admin-form-section { background:var(--surface); }
:root[data-theme="dark"] .admin-service-row { background:var(--surface); }
:root[data-theme="dark"] .admin-user-card { background:var(--surface); }
:root[data-theme="dark"] .ajuda-item { background:var(--surface); }
:root[data-theme="dark"] .alert-danger { color:var(--err-fg); }
:root[data-theme="dark"] .alert-success { color:var(--ok-fg); }
:root[data-theme="dark"] .alert-warning { color:var(--warn-fg); }
:root[data-theme="dark"] .anexo-chip { background:var(--surface); }
:root[data-theme="dark"] .anexo-mini { background:var(--surface-3); }
:root[data-theme="dark"] .anexo-remover { background:var(--surface-3); }
:root[data-theme="dark"] .anexo-remover:hover { color:var(--err-fg); }
:root[data-theme="dark"] .anexos-total.is-excedido { color:var(--err-fg); }
:root[data-theme="dark"] .brand-logo { background:var(--surface); }
:root[data-theme="dark"] .brand-mark { background:var(--surface); }
:root[data-theme="dark"] .btn { background:var(--surface-3); }
:root[data-theme="dark"] .btn-danger { color:var(--err-fg); }
:root[data-theme="dark"] .btn-light { background:var(--surface-3); }
:root[data-theme="dark"] .btn-success { color:var(--ok-fg); }
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .stat,
:root[data-theme="dark"] .hero-card { background:var(--surface); }
:root[data-theme="dark"] .cbx-input { background:var(--surface); }
:root[data-theme="dark"] .cbx-list { background:var(--surface); }
:root[data-theme="dark"] .comment { background:var(--surface-2); }
:root[data-theme="dark"] .contract-adjustment-list a { background:var(--surface); color:var(--primary); }
:root[data-theme="dark"] .contract-bar-row { color:var(--primary); }
:root[data-theme="dark"] .contract-dl dd { color:var(--text); }
:root[data-theme="dark"] .contract-doc-list>div { background:var(--surface); }
:root[data-theme="dark"] .contract-pending-list b { color:var(--primary); }
:root[data-theme="dark"] .contract-pending-list span { color:var(--text); }
:root[data-theme="dark"] .contract-risk-card { color:var(--primary); }
:root[data-theme="dark"] .contract-status-grid a { background:var(--surface); color:var(--primary); }
:root[data-theme="dark"] .contracts-chart-card h2,
:root[data-theme="dark"] .contracts-dashboard-grid .card h2 { color:var(--primary); }
:root[data-theme="dark"] .contracts-detail-grid .card h2 { color:var(--primary); }
:root[data-theme="dark"] .contracts-exec-table .link-strong { color:var(--primary); }
:root[data-theme="dark"] .contracts-executive-hero h2 { color:var(--primary); }
:root[data-theme="dark"] .contracts-executive-hero p { color:var(--muted); }
:root[data-theme="dark"] .contracts-form label,
:root[data-theme="dark"] .form-grid label { color:var(--text); }
:root[data-theme="dark"] .contracts-kpis strong { color:var(--primary); }
:root[data-theme="dark"] .contracts-kpis>div { background:var(--surface); }
:root[data-theme="dark"] .dropdown-menu { background:var(--surface); }
:root[data-theme="dark"] .dynamic-fieldset { background:var(--surface); }
:root[data-theme="dark"] .empty-state { background:var(--surface); }
:root[data-theme="dark"] .error-list li { color:var(--err-fg); }
:root[data-theme="dark"] .executive-dashboard-filters { background:var(--surface); }
:root[data-theme="dark"] .executive-report-section { background:var(--surface); }
:root[data-theme="dark"] .external-sign-card { background:var(--surface); }
:root[data-theme="dark"] .external-sign-card h1 { color:var(--primary); }
:root[data-theme="dark"] .external-sign-page { background:var(--soft); }
:root[data-theme="dark"] .file-input-button { background:var(--surface-3); }
:root[data-theme="dark"] .file-input-pt { background:var(--surface); }
:root[data-theme="dark"] .icon-btn { background:var(--surface-3); }
:root[data-theme="dark"] .inline-upload { background:var(--surface-2); }
:root[data-theme="dark"] .kanban-card { background:var(--surface); }
:root[data-theme="dark"] .kanban-col { background:var(--surface-3); }
:root[data-theme="dark"] .kanban-col h3 strong { background:var(--surface); }
:root[data-theme="dark"] .kb-file-card { background:var(--surface); }
:root[data-theme="dark"] .kb-file-card h3 { color:var(--primary); }
:root[data-theme="dark"] .kb-file-card p { color:var(--muted); }
:root[data-theme="dark"] .kb-file-kind { background:var(--surface-3); color:var(--primary); }
:root[data-theme="dark"] .kb-image-preview { background:var(--surface); }
:root[data-theme="dark"] .kb-inactive-note { background:var(--surface-3); }
:root[data-theme="dark"] .kb-perm-badge.inactive { background:var(--surface-3); }
:root[data-theme="dark"] .kb-perm-badge.success { color:var(--ok-fg); }
:root[data-theme="dark"] .kb-perm-badge.warning { color:var(--warn-fg); }
:root[data-theme="dark"] .kb-preview-unavailable { color:var(--muted); }
:root[data-theme="dark"] .kb-view-meta span { background:var(--surface-3); color:var(--muted); }
:root[data-theme="dark"] .link-strong { color:var(--primary); }
:root[data-theme="dark"] .list-search input { background:var(--surface); }
:root[data-theme="dark"] .login-card { background:var(--surface); }
:root[data-theme="dark"] .login-page { background:var(--surface); }
:root[data-theme="dark"] .member-check-row { background:var(--surface); }
:root[data-theme="dark"] .member-list { background:var(--surface-2); }
:root[data-theme="dark"] .membro-chip { background:var(--surface); }
:root[data-theme="dark"] .membro-chip-remover { background:var(--surface-3); }
:root[data-theme="dark"] .membro-chip-remover:hover { color:var(--err-fg); }
:root[data-theme="dark"] .membros-aviso { color:var(--warn-fg); }
:root[data-theme="dark"] .mobile-menu-button { background:var(--surface-3); }
:root[data-theme="dark"] .nfe-alerta { color:var(--warn-fg); }
:root[data-theme="dark"] .nfe-bloco { background:var(--surface); }
:root[data-theme="dark"] .nfe-resumo { background:var(--surface); }
:root[data-theme="dark"] .pill { background:var(--surface-3); }
:root[data-theme="dark"] .pill-muted { background:var(--surface-3); }
:root[data-theme="dark"] .pill.risk-baixo { color:var(--ok-fg); }
:root[data-theme="dark"] .pill.risk-crítico,
:root[data-theme="dark"] .pill.risk-critico { color:var(--err-fg); }
:root[data-theme="dark"] .pill.risk-médio,
:root[data-theme="dark"] .pill.risk-medio { color:var(--warn-fg); }
:root[data-theme="dark"] .pwa-os-badge { background:var(--surface-3); }
:root[data-theme="dark"] .rail-logo { background:transparent; }
:root[data-theme="dark"] .rail-mark { background:var(--surface); color:var(--primary); }
:root[data-theme="dark"] .rail-panel { background:var(--surface) !important; }
:root[data-theme="dark"] .rail-panel-link { color:var(--text) !important; }
:root[data-theme="dark"] .rail-panel-link:hover { background:var(--surface-3) !important; color:var(--primary) !important; }
:root[data-theme="dark"] .rail-panel-section-label { color:var(--muted) !important; }
:root[data-theme="dark"] .report-bar-row div { background:var(--surface-3); }
:root[data-theme="dark"] .report-card,
:root[data-theme="dark"] .report-panel { background:var(--surface); }
:root[data-theme="dark"] .report-donut:after { background:var(--surface); }
:root[data-theme="dark"] .report-filters { background:var(--surface); }
:root[data-theme="dark"] .report-filters input,
:root[data-theme="dark"] .report-filters select { background:var(--surface); }
:root[data-theme="dark"] .report-gauge-card { background:var(--surface); }
:root[data-theme="dark"] .report-gauge-icon { background:var(--surface-3); }
:root[data-theme="dark"] .report-gauge:after { background:var(--surface); }
:root[data-theme="dark"] .report-hero { background:var(--surface); }
:root[data-theme="dark"] .report-kpi { background:var(--surface); }
:root[data-theme="dark"] .report-risk-row div { background:var(--surface-3); }
:root[data-theme="dark"] .request-steps span { background:var(--surface); }
:root[data-theme="dark"] .requester-panel input[readonly] { background:var(--surface); }
:root[data-theme="dark"] .requester-panel,
:root[data-theme="dark"] .smart-finance-panel,
:root[data-theme="dark"] .user-master-box { background:var(--surface-2); }
:root[data-theme="dark"] .service-code { background:var(--surface-3); }
:root[data-theme="dark"] .service-info .service-code { background:var(--surface); }
:root[data-theme="dark"] .settings-card h3 { color:var(--primary); }
:root[data-theme="dark"] .settings-form label { color:var(--text); }
:root[data-theme="dark"] .settings-tabs a { background:var(--surface-3); color:var(--primary); }
:root[data-theme="dark"] .sla.yellow { color:var(--warn-fg); }
:root[data-theme="dark"] .smtp-status-grid strong { color:var(--primary); }
:root[data-theme="dark"] .tabs a { background:var(--surface); }
:root[data-theme="dark"] .ticket-sla-badge.yellow { color:var(--warn-fg); }
:root[data-theme="dark"] .topbar { background:var(--surface); }
:root[data-theme="dark"] .tour-balao { background:var(--surface); }
:root[data-theme="dark"] .tour-sair:hover { background:var(--surface-3); }
:root[data-theme="dark"] .warning-list li { color:var(--warn-fg); }
:root[data-theme="dark"] .wfd-autosave-badge { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-back { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-canvas { background:var(--surface-2); }
:root[data-theme="dark"] .wfd-canvas-wrap { background:var(--surface); }
:root[data-theme="dark"] .wfd-ctrl-edit { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-edge-chip { background:var(--surface); }
:root[data-theme="dark"] .wfd-edge-chip-edit:hover { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-edge-route { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-field input,
:root[data-theme="dark"] .wfd-field select,
:root[data-theme="dark"] .wfd-field textarea { background:var(--surface); }
:root[data-theme="dark"] .wfd-guide-card { background:var(--surface); }
:root[data-theme="dark"] .wfd-guide-kbd { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-guide-section { background:var(--surface); }
:root[data-theme="dark"] .wfd-lane-item { background:var(--surface); }
:root[data-theme="dark"] .wfd-modal { background:var(--surface); }
:root[data-theme="dark"] .wfd-modal-close { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-node { background:var(--surface); }
:root[data-theme="dark"] .wfd-node-sla { color:var(--warn-fg); }
:root[data-theme="dark"] .wfd-node-type-badge { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-palette { background:var(--surface); }
:root[data-theme="dark"] .wfd-palette-item { background:var(--surface); }
:root[data-theme="dark"] .wfd-palette-item:hover { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-palette-lane-btn:hover { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-panel-close { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-panel-empty { background:var(--surface); }
:root[data-theme="dark"] .wfd-panel-node { background:var(--surface); }
:root[data-theme="dark"] .wfd-panel-node-badge { background:var(--surface-3); }
:root[data-theme="dark"] .wfd-panel-node-badge[data-type="approval"] { color:var(--warn-fg); }
:root[data-theme="dark"] .wfd-panel-node-badge[data-type="end"] { color:var(--err-fg); }
:root[data-theme="dark"] .wfd-panel-node-badge[data-type="start"] { color:var(--ok-fg); }
:root[data-theme="dark"] .wfd-panel-section { background:var(--surface); }
:root[data-theme="dark"] .wfd-statusbar { background:var(--surface-2); }
:root[data-theme="dark"] .workflow-legend span { background:var(--surface-3); }
:root[data-theme="dark"] body { background:var(--bg); }
:root[data-theme="dark"] code { background:var(--surface-3); }
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea { background:var(--surface); }
:root[data-theme="dark"] media(max-width:980px) { background:var(--bg); }

/* ── correções depois da varredura ───────────────────────────────────────
   Vêm por último de propósito: a varredura é ampla e passou por cima de
   coisas que precisam ficar como estavam. Conferido no navegador, medindo
   contraste de verdade, não a olho. */

/* O botão de ação principal é amarelo — a varredura o pintou de cinza
   escuro com texto quase preto, sumindo da tela. */
:root[data-theme="dark"] .btn-primary,
:root[data-theme="dark"] .tour-gatilho--novo {
  background:var(--button) !important;
  color:#10202b !important;
}

/* Etiquetas de regra do catálogo ("Anexo", "Classificação"): o fundo claro
   ficou com texto azul-claro por cima, ilegível. */
:root[data-theme="dark"] .soft-tag {
  background:var(--surface-3) !important;
  color:var(--primary) !important;
  border-color:var(--border) !important;
}

:root[data-theme="dark"] .check-row {
  background:var(--surface-2) !important;
  color:var(--text) !important;
}

/* Contador de notificações: fundo salmão claro pedia texto escuro. */
:root[data-theme="dark"] .badge { background:var(--err-fg); color:#3a1412; }

/* Botão flutuante de ajuda: amarelo com texto azul-claro não se lê. */
:root[data-theme="dark"] .ajuda-icone,
:root[data-theme="dark"] .ajuda-flutuante { color:#10202b !important; }

/* Carregamento: no escuro o fundo vira escuro e o logo é a versão branca (o logo normal some no escuro) */
:root[data-theme="dark"] .cidi-loading-overlay { background: rgba(9, 14, 22, .72); }
:root[data-theme="dark"] .cidi-loading-logo--claro { display: none; }
:root[data-theme="dark"] .cidi-loading-logo--escuro { display: block; }
