/**
 * tokens.css — Design Tokens (Azure Human Interface)
 *
 * Fonte única compartilhada, servida em /includes/tokens.css nos DOIS
 * containers (admin e público) — vive em shared/, que o Docker build
 * (publico/Dockerfile e admin/Dockerfile) copia para
 * /var/www/html/includes em cada imagem, e que o docker-compose monta
 * como volume nos dois serviços em dev local. Deixou de ser cópia
 * exclusiva do admin: qualquer alteração aqui reflete nos dois portais.
 *
 * Cópia do bloco :root canônico de
 * template-php/html/includes/tokens.inc.php + camada de compat específica
 * do transparencia-php (ver seção "Compat local" abaixo).
 *
 * Diverge de propósito do padrão .inc.php do template-php: lá o bloco é
 * PHP incluído dentro de uma tag <style> já aberta (menu.inc.php/login.php
 * do template têm <style> inline). Aqui o CSS é servido como arquivo
 * estático via <link rel="stylesheet"> (não passa pelo interpretador
 * PHP), então este arquivo é CSS puro — sem tag <style>, sem PHP —
 * carregado com seu próprio <link>. Ganha cache do navegador e dispensa
 * include()/__DIR__/guarda de file_exists. Resultado visual é idêntico
 * ao padrão do template.
 *
 * NUNCA divergir os valores canônicos abaixo do que está em
 * template-php/html/includes/tokens.inc.php. Ver _claude-base (TOKENS.md).
 */
:root {
    /* ---------- Água / primária (Azure Human Interface) ---------- */
    --water:      #005880;  /* primary */
    --water-d:    #004c6e;  /* on-primary-fixed-variant — hover/pressed */
    --water-c:    #0072a3;  /* primary-container — "Primary Water" */
    --water-on-c: #deefff;  /* on-primary-container */
    --water-fix:  #c8e6ff;  /* primary-fixed — chip/ícone tint */
    --water-dim:  #89ceff;  /* primary-fixed-dim */

    /* ---------- Secundária / aqua ---------- */
    --aqua:      #006685;  /* secondary */
    --aqua-c:    #6fd2fd;  /* secondary-container */
    --aqua-on-c: #005975;  /* on-secondary-container */
    --aqua-fix:  #bfe9ff;  /* secondary-fixed */
    --aqua-l:    #e0eff6;  /* Mist Blue — wash de fundo */

    /* ---------- Terciária / navy ---------- */
    --navy:    #375578;  /* tertiary */
    --navy-2:  #506d91;  /* tertiary-container */
    --navy-c:  #d2e4ff;  /* tertiary-fixed */
    --navy-on: #2a486b;  /* on-tertiary-fixed-variant */
    --navy-core: #0B2E4F; /* Navy Core — tint de sombra, NUNCA cor de texto/fundo visível */

    /* ---------- Semânticas ---------- */
    --ok:      #0b6b4a;
    --ok-bg:   #dcf3ea;
    --warn:    #8a5200;
    --warn-bg: #ffeccc;
    --bad:     #ba1a1a;  /* error */
    --bad-bg:  #ffdad6;  /* error-container */
    --bad-on:  #93000a;  /* on-error-container */
    --neutral: #40484f;

    /* ---------- Superfícies (tonal layering) ---------- */
    --bg:        #f7fafc;  /* surface / background */
    --surface:   #ffffff;  /* container-lowest — cards nível 1 */
    --surface-2: #f1f4f6;  /* container-low */
    --surface-3: #ebeef0;  /* container */
    --surface-4: #e5e9eb;  /* container-high */
    --surface-5: #e0e3e5;  /* container-highest / surface-variant */
    --surface-dim: #d7dadc;
    --inverse-surface: #2d3133;
    --inverse-on-surface: #eef1f3;

    /* ---------- Texto ---------- */
    --ink:       #181c1e;  /* on-surface */
    --ink-soft:  #40484f;  /* on-surface-variant */
    --ink-faint: #636b73;  /* outline #707880 do DESIGN.md escurecido p/ AA (contraste texto real) */

    /* ---------- Linhas ---------- */
    --line:      #bfc7d0;  /* outline-variant */
    --line-soft: #e0e3e5;  /* surface-variant */

    /* ---------- Elevação — ambient, sempre tingida de navy ---------- */
    --elev-1: 0 4px 20px rgba(11,46,79,.05);
    --elev-2: 0 8px 28px rgba(11,46,79,.09);
    --elev-3: 0 12px 32px rgba(11,46,79,.12);
    --elev-inset: inset 0 1px 2px rgba(11,46,79,.05);

    /* ---------- Tipografia — família única Nunito (sem monoespaçada) ---------- */
    --ff:   "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;
    --mono: var(--ff);   /* números usam Nunito + font-variant-numeric: tabular-nums */

    --fs-display: 48px; --lh-display: 1.2;  --fw-display: 800; --ls-display: -.02em;
    --fs-h1:      32px; --lh-h1:      40px; --fw-h1:      700; --ls-h1:      -.01em;
    --fs-h2:      24px; --lh-h2:      32px; --fw-h2:      700;
    --fs-title:   20px; --lh-title:   28px; --fw-title:   600;
    --fs-body:    16px; --lh-body:    24px; --fw-body:    400;
    --fs-body-sm: 14px; --lh-body-sm: 20px;
    --fs-label:   12px; --lh-label:   16px; --fw-label:   700; --ls-label: .05em;

    /* ---------- Espaçamento — escala linear 8px ---------- */
    --sp-xs:   4px;
    --sp-base: 8px;
    --sp-sm:   12px;
    --sp-md:   24px;
    --sp-lg:   40px;
    --sp-xl:   64px;

    /* ---------- Raio — soft shape language ---------- */
    --radius-sm: 8px;
    --radius:    12px;   /* botões, inputs, tags, nav item */
    --radius-md: 12px;
    --radius-lg: 16px;   /* cards, containers */
    --radius-xl: 24px;
    --radius-full: 9999px;

    /* ---------- Layout ---------- */
    --header-height:   64px;
    --sidebar-width:   216px;  /* fallback pré-JS — sobrescrito em runtime pelo ResizeObserver */
    --content-padding: 16px;          /* margin-mobile */
    --content-padding-desktop: 32px;  /* margin-desktop */

    /* ---------- Compat retroativa (NÃO remover — usados em ~40 regras) ---------- */
    --water-pale:   var(--aqua);
    --text-hi:      var(--ink);
    --text-mid:     var(--ink-soft);
    --text-lo:      var(--ink-faint);
    --fog:          rgba(11,46,79,.04);
    --fog-strong:   rgba(11,46,79,.12);
    --surface-body: var(--bg);
    --border:       var(--line);
    --success:      var(--ok);      --success-bg: var(--ok-bg);
    --danger:       var(--bad);     --danger-bg:  var(--bad-bg);
    --warning:      var(--warn);    --warning-bg: var(--warn-bg);
    --font-brand:   var(--ff);
    --font-display: var(--ff);
    --font-table:   var(--ff);
    --font-mono:    var(--mono);

    /* ---------- Compat local transparencia-php ---------- */
    /* Tokens usados pelo admin (admin.css + dashboard.css) que não existem
       no canônico. Sem eles o layout colapsa (--header-h) e as flash
       messages ficam invisíveis (--error-bg/--error-text/--success-text/
       --warning-text/--info-bg/--info-text). */
    --header-h:      var(--header-height);
    --bg-page:       var(--bg);
    --error-bg:      var(--bad-bg);
    --error-text:    var(--bad-on);
    --success-text:  var(--ok);
    --warning-text:  var(--warn);
    --info-bg:       var(--water-fix);
    --info-text:     var(--water-d);

    /* --water-dim — OVERRIDE INTENCIONAL do canônico (colisão semântica).
       O canônico define --water-dim: #89ceff (azul claro OPACO,
       "primary-fixed-dim"). O admin usa este token como véu TRANSLÚCIDO de
       10% em 5 pontos (admin.css: linhas 347, 511, 620, 752 — .badge-action
       — e 1008 — .paginacao li a:hover). Herdar o valor canônico faria
       esses 5 pontos virarem azul sólido saturado onde deveria haver um véu
       sutil — falha silenciosa, sem erro, visualmente errada. */
    --water-dim: color-mix(in srgb, var(--water) 10%, transparent);

    /* --water-pale — OVERRIDE INTENCIONAL (mudança de linguagem de
       interação). O admin usa --water-pale (#0099C8, ciano claro) em
       a:hover e .radio-cell:hover — hoje o hover CLAREIA. O canônico marca
       --water-d como "hover/pressed": no Azure Human Interface o hover
       ESCURECE (state layer adiciona tinta, não remove). O bloco de compat
       retroativa acima mapeia --water-pale para var(--aqua) — mais escuro
       que o ciano atual, mas não é o token de hover correto. Esta linha,
       por vir depois, prevalece e fixa --water-pale como var(--water-d),
       intencionalmente: a linguagem de hover do sistema passa de
       "clarear" para "escurecer". */
    --water-pale: var(--water-d);
}