/* Paleta das 6 telas de exibição (painel de KPIs, mapas do Piauí e de
   Teresina, evolução, relatos, painel rotativo). Único lugar das cores:
   o CSS inline dos templates e o JS de Leaflet/Chart.js (via KiwiTema.cor)
   leem estes tokens.

   `:root` tem os valores do tema claro (o visual público de sempre);
   `[data-tema="telao"]` (ligado só por ?telao=1) sobrescreve para o fundo
   escuro do mosaico de telas. Os dois seletores têm a mesma especificidade:
   nenhum `:root` inline pode redefinir estes tokens depois deste arquivo,
   senão venceria o override escuro. */
:root {
  --navy-900:#0f1e52; --navy-800:#1c2d6b; --navy-600:#2a4299;
  --yellow:#f5c200; --red:#b91c1c; --gray-700:#374151; --gray-500:#6b7280;
  --gray-300:#d1d5db; --gray-200:#e5e7eb; --gray-100:#f3f4f6;
  --white:#fff; --radius:12px;

  --bg:#eaf1fb;
  --surface:#fff;
  --surface-2:#f3f4f6;
  --texto:#1c2d6b;
  --texto-corpo:#374151;
  --texto-sec:#6b7280;
  --link:#2a4299;
  --borda:#e5e7eb;
  --borda-forte:#d1d5db;
  --shadow:0 2px 12px rgba(15,30,82,.10);
  --pulso:#fef3c7;

  /* Índice/fila crescente — a ordem é o significado, nos dois temas. */
  --status-sem-dado:#9ca3af;
  --status-1:#15803d;
  --status-2:#a16207;
  --status-3:#c2410c;
  --status-4:#b91c1c;
  --status-teresina-1:#22c55e;
  --status-teresina-2:#facc15;
  --status-teresina-3:#ef4444;

  --mapa-contorno:#0f1e52;
  --mapa-contorno-teresina:#1c2d6b;
  --marcador-borda:#ffffff;
  --balao-fundo:rgba(255,255,255,.94);

  --grafico-linha:#2a4299;
  --grafico-linha-rgb:42,66,153;
  --grafico-hover:#1c2d6b;
  --grafico-texto:#374151;
  --grafico-texto-sec:#6b7280;
  --grafico-grade:rgba(15,30,82,.06);
  --grafico-base:#d1d5db;
  --grafico-destaque:#b91c1c;
  --tooltip-bg:#0f1e52;
}

[data-tema="telao"] {
  --bg:#0b1220;
  --surface:#111a2e;
  --surface-2:#1a2540;
  --texto:#f1f5f9;
  --texto-corpo:#e2e8f0;
  --texto-sec:#94a3b8;
  --link:#93c5fd;
  --borda:#1f2a44;
  --borda-forte:#334155;
  --shadow:0 2px 12px rgba(0,0,0,.5);
  --pulso:#4a3b0b;

  --status-sem-dado:#64748b;
  --status-1:#22c55e;
  --status-2:#facc15;
  --status-3:#fb923c;
  --status-4:#f87171;

  --mapa-contorno:#cbd5e1;
  --mapa-contorno-teresina:#cbd5e1;
  --marcador-borda:#0b1220;
  --balao-fundo:rgba(17,26,46,.94);

  --grafico-linha:#60a5fa;
  --grafico-linha-rgb:96,165,250;
  --grafico-hover:#93c5fd;
  --grafico-texto:#e2e8f0;
  --grafico-texto-sec:#94a3b8;
  --grafico-grade:rgba(148,163,184,.15);
  --grafico-base:#334155;
  --grafico-destaque:#f87171;
  --tooltip-bg:#1e293b;
}

[data-tema="telao"] body { background:var(--bg); }
[data-tema="telao"] .leaflet-container { background:var(--surface-2); }
/* O texto do logo do TRE-PI é quase preto (#1d1d1b) e sumia no cabeçalho
   escuro: no telão usa a versão monocromática clara. */
[data-tema="telao"] .header-inner img { filter:brightness(0) invert(1); }
/* Controles e popups do Leaflet vêm brancos do leaflet.css. */
[data-tema="telao"] .leaflet-bar a,
[data-tema="telao"] .leaflet-popup-content-wrapper,
[data-tema="telao"] .leaflet-popup-tip,
[data-tema="telao"] .leaflet-tooltip {
  background:var(--surface); color:var(--texto); border-color:var(--borda-forte);
}
[data-tema="telao"] .leaflet-bar a:hover { background:var(--surface-2); }
[data-tema="telao"] .leaflet-tooltip-top::before { border-top-color:var(--surface); }
[data-tema="telao"] .leaflet-tooltip-bottom::before { border-bottom-color:var(--surface); }
[data-tema="telao"] .leaflet-tooltip-left::before { border-left-color:var(--surface); }
[data-tema="telao"] .leaflet-tooltip-right::before { border-right-color:var(--surface); }