/* tokens.css — sistema de cores e formas unificado do Jornada.
   Fonte única de verdade da paleta para web e mobile. Antes deste arquivo,
   o projeto tinha 5 sistemas de azul conflitantes (--blue definido
   diferente em styles.css e mobile.css, mais um terceiro hardcoded em
   acesso.html/conta.html, mais o cyan --jn-accent do tema mobile, mais uma
   paleta isolada só nos cards de relatório). Carregado ANTES de qualquer
   outro CSS em index.html, mobile.html, acesso.html e conta.html — os
   arquivos que já existiam continuam definindo --blue/--jn-accent/etc.,
   mas agora apontando pra cá via var(), em vez de duplicar valores.
   Ver ESTADO-ATUAL.md item 39 para o histórico da consolidação. */

:root {
  /* Azul de ação — usado em texto, botões e links. Direção de design do
     usuário (2026-07-28, item 49): trocado de #1a7aa8 pro azul dos filtros
     rápidos de período (#416eec), pra unificar num só azul em vez de dois
     tons de "primary" convivendo no admin. #416eec mede exatamente
     **4.50:1 contra branco** (fórmula WCAG oficial) — passa o limiar de
     4.5:1 pro texto normal, mas na margem mínima possível; qualquer
     re-cálculo com arredondamento diferente pode cair pra 4.49. Usado como
     está porque foi um valor explícito do usuário, não uma sugestão minha
     — se algum dia isso incomodar visualmente (parecer "meio claro" em
     texto pequeno), a correção é escurecer 1-2% de luminosidade no HSL,
     não trocar de matiz. --color-primary-hover/-soft/--color-focus abaixo
     foram recalculados do zero (matiz 224° do #416eec, não o antigo
     matiz 197°) — não são só a versão escura do valor antigo. */
  --color-primary: #416eec;
  --color-primary-hover: #1445cc; /* pressed/hover — 7.63:1 contra branco */
  --color-primary-soft: #e9eefb; /* fundo de seleção suave */
  --color-focus: rgba(65, 110, 236, 0.35); /* anel de foco translúcido */

  /* Azul "puro" de referência (o #229ED9 original) — reservado a usos que
     só exigem contraste 3:1: trilho de toggle ligado, borda de item
     selecionado, ícone ativo. Não usar como cor de texto/botão. */
  --color-accent: #229ed9;
  --color-accent-soft: rgba(34, 158, 217, 0.14);

  /* Superfícies — mesmos valores que --bg/--nav de styles.css já usavam,
     só com o nome semântico novo (não renomeia --bg/--nav, só aponta pra cá). */
  --color-surface: #ffffff;
  --color-surface-glass: rgba(255, 255, 255, 0.08);
  --color-bg: #f7f9fc;
  --color-nav: #10233d;

  /* Texto e bordas — mesmos valores que --ink/--muted/--line já usavam. */
  --color-text: #162337;
  --color-text-secondary: #758196;
  --color-border: #e8edf3;

  /* Semânticas. Cada uma tem uma variante "-text": a cor "normal" (badge,
     ícone, borda) só passa no limiar de contraste 3:1, insuficiente para
     texto de tamanho normal (4.5:1) — checado com a mesma fórmula WCAG
     acima. A variante -text é o mesmo matiz/saturação, mais escura,
     calculada para passar 4.5:1; use-a em mensagens de erro/sucesso/aviso
     em texto, não nos badges/ícones (esses continuam com a cor normal). */
  --color-success: #00a779;
  --color-success-text: #00805c; /* 4.95:1 */
  --color-success-soft: #e6f8f1;
  --color-danger: #ed5d68;
  --color-danger-text: #cf1725; /* 5.52:1 */
  --color-danger-soft: #ffeaec;
  --color-warning: #ee8d28;
  --color-warning-text: #aa5d0d; /* 4.91:1 */
  --color-warning-soft: #fff2e4;
  --color-edit: #ff6b00; /* anel laranja vivo dos pontos ajustados */
  --color-disabled: #b7c0cc;

  /* Formas — cantos e sombra de card/controle, consistentes entre web e mobile */
  --radius-card: 14px;
  --radius-control: 10px;
  --radius-pill: 999px; /* texto pequeno/controles curtos (abas, chips, nav) — cápsula total */
  --shadow-card: 0 2px 10px rgba(16, 35, 61, 0.08);
}