/* ==========================================================================
   tokens.css — A PALETA DO SISTEMA. Fonte única.
   ==========================================================================

   Antes deste arquivo, o MESMO bloco de tokens estava copiado em 13 arquivos
   (12 telas + a folha da Agenda), com pequenas divergências entre as cópias.
   Trocar uma cor era achar as 13. Agora é aqui, e só aqui.

   --------------------------------------------------------------------------
   TRÊS CAMADAS, E A DEPENDÊNCIA NÃO SE INVERTE
   --------------------------------------------------------------------------
     PRIMITIVA    --c-azul-500      a cor, sem significado nenhum
        ↓         (só esta folha lê)
     SEMÂNTICA    --surface, --text, --primary      o PAPEL da cor
        ↓         (é a única camada que um componente enxerga)
     COMPONENTE   .card{background:var(--surface)}

   ⭐ Trocar de tema é trocar o mapeamento primitiva → semântica. Nenhum
   componente muda, porque nenhum componente conhece uma cor.

   ⭐ Crescer é acrescentar semântica. Cor principal configurável, densidade,
   tamanho de fonte: cada um vira token semântico alimentado pela mesma fonte de
   estado (js/tema.js), sem tocar em componente nenhum. É o motivo desta folha
   existir antes de existir tema claro.

   --------------------------------------------------------------------------
   POR QUE OS NOMES SÃO OS DE SEMPRE
   --------------------------------------------------------------------------
   `--surface`, `--text-dim`, `--border` já são PAPÉIS, e já somam ~1.700 usos
   no repositório. Renomear para `--color-surface` seria 1.700 pontos de risco em
   telas que funcionam, em troca de sinônimos. O que faltava não era nome novo:
   era um lugar só.

   O que muda de fato: `--blue`, `--green`, `--red`, `--amber`, `--violet`,
   `--brass` DESCEM para primitivas. Componente não deve pedir "azul" — deve
   pedir "primária". Os aliases continuam vivos enquanto a varredura acontece,
   e a bancada cobra a remoção deles no fim.

   --------------------------------------------------------------------------
   O QUE **NÃO** ESTÁ AQUI
   --------------------------------------------------------------------------
   Medida que é de UMA tela (--col-desc da DRE, --h-cab1, --body-max) continua
   na tela. Token global é o que mais de uma tela usa; o resto é layout local, e
   subir isso para cá só criaria um arquivo que ninguém entende.
   ========================================================================== */

/* ---------- PRIMITIVAS — a paleta crua ---------- */
:root{
  /* neutros (escuro) */
  --c-preto-900:#0A0D12; --c-preto-850:#0D1117; --c-preto-800:#12161E;
  --c-preto-750:#161B24; --c-preto-700:#1B212C; --c-preto-650:#1E2532;
  --c-cinza-800:#181E29; --c-cinza-700:#212836;
  --c-cinza-300:#8A93A6; --c-cinza-400:#5B6478; --c-cinza-050:#EDEFF3;

  /* neutros (claro) */
  --c-branco:#ffffff; --c-neve-050:#f8f9fa; --c-neve-100:#f6f7f9;
  --c-neve-200:#f1f3f4; --c-neve-300:#e8eaed; --c-neve-400:#dadce0;
  --c-grafite-700:#3c4043; --c-grafite-500:#5f6368; --c-grafite-400:#80868b;

  /* matizes */
  --c-azul-400:#4C8DFF;    --c-azul-600:#1a73e8;
  --c-verde-400:#33D69F;   --c-verde-600:#188038;
  --c-vermelho-400:#FF6B6B;--c-vermelho-600:#d93025;
  --c-ambar-400:#F2B84B;   --c-ambar-600:#e37400;
  --c-violeta-400:#9C8CFF; --c-violeta-600:#8430ce;
  --c-latao-400:#D4AF5A;   --c-latao-600:#8a6d1f;

  /* forma e elevação — não mudam com o tema */
  --radius-sm:9px; --radius-md:14px; --radius-lg:18px;

  /* métricas de shell compartilhadas por mais de uma tela */
  --sidebar-w:248px;
}

/* ==========================================================================
   TEMA ESCURO — o padrão histórico do sistema, e a referência visual.
   Os valores são EXATAMENTE os que estavam nas 13 cópias: a unificação não
   pode mudar um pixel do que já está no ar.
   ========================================================================== */
/* ⚠️ `:root` PURO, e não `:root[data-theme="dark"]`.
   O seletor com atributo tem especificidade MAIOR (0,1,1) que o `:root` (0,1,0)
   de uma tela — e engoliria qualquer override local, mesmo o declarado depois.
   Foi o que aconteceu com a sombra mais profunda do login na primeira versão
   desta folha. Com `:root` puro vale a cascata: quem vem depois vence, e o tema
   claro continua vencendo do escuro porque É mais específico. */
:root{
  color-scheme:dark;

  /* superfícies */
  --bg:var(--c-preto-900);
  --bg-soft:var(--c-preto-850);
  --surface:var(--c-preto-800);
  --surface-2:var(--c-preto-750);
  --surface-hover:var(--c-preto-700);

  /* traços */
  --border:var(--c-cinza-700);
  --border-soft:var(--c-cinza-800);
  --linha:var(--c-preto-650);

  /* texto */
  --text:var(--c-cinza-050);
  --text-dim:var(--c-cinza-300);
  --text-faint:var(--c-cinza-400);
  --text-on-primary:#08111F;

  /* PAPÉIS — é o que componente novo deve usar */
  --primary:var(--c-azul-400);       --primary-dim:rgba(76,141,255,.13);
  --success:var(--c-verde-400);      --success-dim:rgba(51,214,159,.13);
  --danger:var(--c-vermelho-400);    --danger-dim:rgba(255,107,107,.13);
  --warning:var(--c-ambar-400);      --warning-dim:rgba(242,184,75,.13);
  --info:var(--c-violeta-400);       --info-dim:rgba(156,140,255,.13);
  --accent:var(--c-latao-400);       --accent-dim:rgba(212,175,90,.14);

  /* a régua dupla que corta a árvore da DRE nos totalizadores */
  --dre-regua:3px double rgba(255,255,255,.34);

  /* elevação */
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 12px 28px -14px rgba(0,0,0,.55);
  --shadow-card:var(--shadow-sm), var(--shadow-md);

  /* ⚠️ ALIASES DE TRANSIÇÃO — o nome antigo, apontando para o papel.
     Existem para que a unificação não exija reescrever ~1.700 usos de uma vez.
     Somem quando a varredura terminar; a bancada cobra. */
  --blue:var(--primary);       --blue-dim:var(--primary-dim);
  --green:var(--success);      --green-dim:var(--success-dim);
  --red:var(--danger);         --red-dim:var(--danger-dim);
  --amber:var(--warning);      --amber-dim:var(--warning-dim);
  --violet:var(--info);        --violet-dim:var(--info-dim);
  --brass:var(--accent);       --brass-dim:var(--accent-dim);
}

/* ==========================================================================
   TEMA CLARO — os MESMOS nomes, outros valores. É a arquitetura inteira: não
   existe uma segunda folha de componentes, e nenhum componente sabe que o tema
   mudou.

   Os valores vêm do tema claro que a Agenda já usava em produção — a única
   parte do sistema que tinha claro antes desta entrega.
   ========================================================================== */
:root[data-theme="light"]{
  color-scheme:light;

  --bg:var(--c-neve-100);
  --bg-soft:var(--c-neve-050);
  --surface:var(--c-branco);
  --surface-2:var(--c-neve-200);
  --surface-hover:var(--c-neve-300);

  --border:var(--c-neve-400);
  --border-soft:var(--c-neve-300);
  --linha:var(--c-neve-300);

  --text:var(--c-grafite-700);
  --text-dim:var(--c-grafite-500);
  --text-faint:var(--c-grafite-400);
  --text-on-primary:var(--c-branco);

  /* ⚠️ Matiz mais ESCURO no claro: o mesmo #4C8DFF que brilha sobre preto não
     alcança 4,5:1 sobre branco. Papel é contraste, não pigmento. */
  --primary:var(--c-azul-600);       --primary-dim:rgba(26,115,232,.10);
  --success:var(--c-verde-600);      --success-dim:rgba(24,128,56,.10);
  --danger:var(--c-vermelho-600);    --danger-dim:rgba(217,48,37,.10);
  --warning:var(--c-ambar-600);      --warning-dim:rgba(227,116,0,.10);
  --info:var(--c-violeta-600);       --info-dim:rgba(132,48,206,.10);
  --accent:var(--c-latao-600);       --accent-dim:rgba(138,109,31,.12);

  --shadow-sm:0 1px 2px rgba(60,64,67,.15);
  --shadow-md:0 1px 3px rgba(60,64,67,.10);
  --shadow-card:var(--shadow-sm), var(--shadow-md);
}

/* A régua do totalizador é branca translúcida — invisível sobre papel branco. */
:root[data-theme="light"]{ --dre-regua:3px double rgba(0,0,0,.30); }
