/* ============================================================================
   ÁgiliOne — VOCABULÁRIO ÚNICO DE MARCA
   Fonte de verdade dos tokens visuais das duas áreas: Colaborador (painel.html)
   e Cliente (cliente.html).

   Decisão da Dani em 28/09/2026: *"sobre a marca, seguimos a do ÁgiliOne. Se não
   estão iguais, quero o do cliente com o mesmo branding da área do colaborador."*
   ⇒ a referência é a ÁREA DO COLABORADOR, não o brandbook.

   Por que o painel e não o manual: o `brandbook.html` tem 16 tokens e descreve a
   MARCA; o painel tem 31 e inclui o que uma tela de trabalho precisa para dizer
   "deu certo", "atenção" e "erro" (--ok/--warn/--bad e os tons claros de cada),
   além dos fundos e das variações de menta e coral. O manual sozinho não cobre
   uma tela de operação.

   🔑 COMO ESTE ARQUIVO EVITA MEXER EM 17 MIL LINHAS
   Cada conceito é declarado com o nome do MANUAL (`--ground`, `--panel`, `--mut`,
   `--mark`) e o nome usado no painel entra como ALIAS dele (`--bg:var(--ground)`).
   Assim o vocabulário do manual passa a existir de verdade, sem reescrever
   nenhuma das ~17.800 linhas que já usam `var(--bg)`. Tela nova deve preferir os
   nomes canônicos.

   🔴 NÃO declarar aqui nada que dependa de TEMA automático. O brandbook tem um
   bloco `@media (prefers-color-scheme:dark)` que troca `--ground`, `--panel`,
   `--ink`, `--mut`, `--line` e `--mark`. Trazê-lo para cá mudaria a cara do
   painel de todo mundo que usa o sistema em modo escuro, sem ninguém pedir — é o
   modo de falhar CALADO deste conserto. O tema escuro vive só sob
   `[data-theme="dark"]`, que hoje nenhuma tela aplica.
   ============================================================================ */

:root {
  /* ---- marca (iguais no manual, no painel e no cliente) ---- */
  --teal: #0e4f6d;          /* institucional */
  --teal-d: #0a3a50;        /* teal profundo: fundos */
  --teal-l: #1a6b91;        /* teal claro */
  --mint-l: #7fe3d4;        /* menta clara: o "One" e o ponto sobre fundo escuro */
  --coral: #ff7a66;         /* acento QUENTE — de leve, não substitui a menta */
  --coral-l: #ffe1da;

  /* 🔴 MENTA: valor da ÁREA DO COLABORADOR, por decisão de 28/09.
     Medido: #1aa892 sobre branco dá 2,97:1 e fica ABAIXO do mínimo de 3:1 do WCAG
     para elemento gráfico; o #2a9d8f do manual e do cliente dá 3,32:1 e passa.
     Mantido o valor do painel para não mudar pixel nesta entrega — a troca está
     relatada à Dani como decisão dela, e é o único token em que seguir o painel
     piora a acessibilidade. */
  --mint: #1aa892;
  --mint-2: #38c9b4;
  --coral-d: #e8543d;

  /* ---- superfícies: nome do MANUAL, alias do PAINEL logo abaixo ---- */
  --ground: #f3f6f8;        /* fundo da página (manual chama assim) */
  --panel: #ffffff;         /* superfície/cartão */
  --ink: #0e2531;           /* texto principal */
  --mut: #5b7280;           /* texto secundário */
  --line: #dbe6ec;          /* divisória */
  --mark: #0e4f6d;          /* cor de marca aplicada a elemento gráfico */

  --bg: var(--ground);      /* alias histórico do painel — não remover */
  --card: var(--panel);     /* alias histórico do painel — não remover */

  /* ---- tintas (fundo de rótulo/pílula) ---- */
  --tint: #eaf6f4;
  --mint-t: #dff6f1;
  --teal-t: #e2eef4;
  --coral-t: #ffe7e1;
  --accent-soft: rgba(14, 79, 109, .12);

  /* ---- ESTADO: o que o manual não tem e a tela de trabalho exige ---- */
  --ok: #0f7f6f;   --ok-t: #e6f4f1;
  --warn: #b26a00; --warn-t: #fbf0e0;
  --bad: #b4233a;  --bad-t: #fbe9ec;

  /* ---- forma ---- */
  --radius: 12px;
  --shadow: 0 1px 2px rgba(7, 21, 41, .04), 0 18px 38px -28px rgba(7, 21, 41, .42);
  --shadow-lg: 0 26px 60px -26px rgba(7, 21, 41, .5);

  /* ---- tipografia: Manrope no corpo, Sora nos títulos, mono nos dados.
     As fontes vêm de /marca/fonts/*.woff2 (same-origin: o CSP é font-src 'self',
     e @import do Google Fonts NÃO carrega). ---- */
  --font: 'Manrope', 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --display: 'Sora', 'Manrope', 'Segoe UI', sans-serif;
  --mono: 'IBM Plex Mono', Consolas, 'Cascadia Mono', 'Courier New', monospace;
  --sans: var(--font);      /* nome do manual */
}

/* Tema escuro do manual — DESLIGADO por padrão, e de propósito.
   Só vale quando alguém marcar explicitamente o documento. Nenhuma tela faz isso
   hoje; sem este cuidado, o painel mudaria de cara sozinho no modo escuro do
   sistema operacional. */
:root[data-theme="dark"] {
  --ground: #0a1820;
  --panel: #11242d;
  --ink: #e9f2f5;
  --mut: #8ea6b1;
  --line: #1e3d47;
  --mark: #63c6de;
  --shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 16px 44px rgba(0, 0, 0, .55);
}