/* Tokens compartilhados por TODAS as páginas (index/app.css, admin.css, login.css,
   reset-password.css). Precisa estar linkado ANTES do CSS de cada página — o CSS
   da página só usa var(--...), nunca redeclara essas variáveis. */
:root {
    /* --- Paleta "auth" (admin/login/reset-password) --- */
    --azul: #1f4e96;
    --azul-escuro: #143a73;
    --azul-forte: #143a73;
    --azul-nevoa: #e9f1ff;
    --nevoa-texto: #29406a;
    --borda: #cfdcf1;
    --texto: #1b2230;
    --muted: #5f6f87;
    --label: #334763;
    --erro: #b42318;
    --erro-bg: #fdecea;
    --erro-borda: #f5c6c6;
    --ok: #1f7a3f;
    --ok-bg: #d4edda;
    --alerta-bg: #fff3cd;
    --alerta-texto: #856404;
    --link-hover-bg: #dbe8ff;

    /* Texto/ícone POR CIMA de um fundo --azul chapado (botão primário, aba ativa,
       chip selecionado). No tema escuro --azul é claro, então branco sobre ele
       fica ilegível — este token inverte junto. */
    --sobre-azul: #ffffff;
    /* Faixa superior das páginas: no claro acompanha o azul da marca; no escuro
       precisa de um azul PROFUNDO próprio, senão o branco do título cai sobre o
       --azul clareado do tema e perde contraste. */
    --topo-grad-1: #1f4e96;
    --topo-grad-2: #143a73;
    /* Realce sutil de hover sobre superfícies (linhas de lista, cabeçalhos
       clicáveis): escurece no claro, clareia no escuro. */
    --hover-sutil: rgba(31, 78, 150, 0.06);

    --fundo: #f0f4fb;
    --fundo-gradiente:
        radial-gradient(circle at 10% 20%, #ffffff 0%, #eef4ff 25%, #dce8ff 60%, #cadcff 100%),
        linear-gradient(140deg, #f9fbff 0%, #e7f0ff 100%);
    --superficie: #ffffff;
    --superficie-2: #f7faff;
    --superficie-glass: rgba(255, 255, 255, 0.94);
    --overlay: rgba(15, 23, 42, 0.52);
    --sombra-1: 0 1px 2px rgba(20, 58, 115, 0.06), 0 1px 0 rgba(20, 58, 115, 0.04);
    --sombra-2: 0 8px 24px rgba(15, 23, 42, 0.14);

    /* --- Paleta própria de app.css (cronograma principal) --- */
    --azul2: #2E5BA6;
    --azul-claro: #D9E1F2;
    --azul-bg: #EAF0F8;
    --cinza: #667;
    --erro-hover: #f8d7d3;
    --ok-borda: #b9e6c4;
    --alerta-borda: #f3dbb8;
    --info-bg: #eaf1ff;
    --item-feito-bg: #f3fcf5;
    --destaque-borda: #92a9d6;
    --sombra-3: 0 18px 42px rgba(11, 25, 49, 0.2);

    /* --- Paleta categórica (gráficos com múltiplas séries, ex.: comparar
       usuários) — só usar nas 3 primeiras posições nessa ordem; validada
       para diferenciação sob daltonismo nesse recorte. --- */
    --serie-1: #2a78d6;
    --serie-2: #eb6834;
    --serie-3: #1baf7a;

    /* --- Tipografia --- */
    --fonte: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    --fs-xs: 11px;
    --fs-sm: 12px;
    --fs-base: 14px;
    --fs-md: 15px;
    --fs-lg: 16px;
    --fs-xl: 19px;
    --fs-2xl: 24px;
    --fs-3xl: 30px;
}

:root[data-theme="dark"] {
    --azul: #5b8fdc;
    --azul-escuro: #2c4a7a;
    --azul-forte: #a4c6f5;
    --azul-nevoa: #1c2c47;
    --nevoa-texto: #bcd3f7;
    --borda: #2d3b56;
    --texto: #e7ecf6;
    --muted: #9aa8c2;
    --label: #c6d1e7;
    --erro: #ff8a80;
    --erro-bg: #3c2226;
    --erro-borda: #5c2f33;
    --ok: #6fd99a;
    --ok-bg: #17351f;
    --alerta-bg: #423711;
    --alerta-texto: #ffd873;
    --link-hover-bg: #26385c;

    --sobre-azul: #0c1524;
    --topo-grad-1: #1b2c4a;
    --topo-grad-2: #101a2c;
    --hover-sutil: rgba(255, 255, 255, 0.07);

    --fundo: #0e1420;
    --fundo-gradiente:
        radial-gradient(circle at 10% 20%, #182338 0%, #131b2c 35%, #0e1420 70%, #0a0f18 100%),
        linear-gradient(140deg, #10182a 0%, #0b111c 100%);
    --superficie: #171f30;
    --superficie-2: #1d2740;
    --superficie-glass: rgba(23, 31, 48, 0.88);
    --overlay: rgba(0, 0, 0, 0.6);
    --sombra-1: 0 1px 2px rgba(0, 0, 0, 0.35), 0 1px 0 rgba(0, 0, 0, 0.25);
    --sombra-2: 0 8px 24px rgba(0, 0, 0, 0.45);

    --azul2: #6fa1e6;
    --azul-claro: #26385c;
    --azul-bg: #17233a;
    --cinza: #98a6c0;
    --erro-hover: #4c2a2e;
    --ok-borda: #2c5a3a;
    --alerta-borda: #5c4a1a;
    --info-bg: #1c2c47;
    --item-feito-bg: #142a1c;
    --destaque-borda: #3d5580;
    --sombra-3: 0 18px 42px rgba(0, 0, 0, 0.55);

    --serie-1: #3987e5;
    --serie-2: #d95926;
    --serie-3: #199e70;
}