/* Tokens de design: a paleta e as medidas que o resto do CSS consome.
   Mudar a cara do app é mudar aqui — nunca no meio de um componente.

   O <html> carrega sempre data-tema="escuro" ou "claro"; quem decide é o
   js/nucleo/tema.js, lendo a escolha guardada ou a preferência do sistema.
   Por isso não há @media (prefers-color-scheme) neste arquivo: se houvesse,
   a preferência do sistema brigaria com o botão do Perfil. */

:root[data-tema="escuro"]{
  color-scheme: dark;

  --fundo:#0b0f14;
  --superficie:#141b23;
  --superficie2:#1b242e;
  --linha:#26313d;
  --txt:#e9eef4;
  --txt-fraco:#8fa1b3;

  /* --acento-txt é o que se escreve EM CIMA do verde. Existe porque a página
     tinha duas convenções para isso (#04210f em uns lugares, #fff noutros). */
  --acento:#22c55e;
  --acento-txt:#04210f;
  --acento-suave:#22c55e33;
  --acento-fundo:#0f2f1c;
  --acento-borda:#1c5133;

  --info:#38bdf8;
  --roxo:#a78bfa;
  --sucesso-txt:#4ade80;

  --aviso:#f59e0b;
  --aviso-fundo:#3a2a08;
  --aviso-borda:#6b4c0d;
  /* #ef4444 dava 4,45:1 no selo de dor sobre o fundo escuro — logo abaixo
     do mínimo de 4,5 do WCAG AA. Este clareia para 6,05:1 sem deixar de
     ser o vermelho de alerta. */
  --perigo:#f87171;
  --perigo-fundo:#3a0f0f;
  --perigo-borda:#6b1c1c;
  --atencao-borda:#c2410c;

  /* O dourado da borda do brasão (amostrado do próprio arquivo). É o fio
     que liga a tela de entrada ao logo sem repintar o app inteiro. */
  --dourado:#caa96e;
  --sombra-cartao:0 1px 2px #0006, 0 8px 24px #0000004d;

  --nav-fundo:#0e141bee;
  --sombra-modal:#000a;
  --legenda-fundo:#000000b3;
  --moldura-foto:#000;

  /* O véu que escurece a foto de fundo do atleta. */
  --veu:linear-gradient(180deg,rgba(11,15,20,.55) 0%,rgba(11,15,20,.82) 40%,rgba(11,15,20,.96) 100%);
  --cartao-translucido:rgba(20,27,35,.84);
  --cartao2-translucido:rgba(27,36,46,.72);
  --foto-fundo-opacidade:.15;
}

:root[data-tema="claro"]{
  color-scheme: light;

  --fundo:#f4f6f9;
  --superficie:#ffffff;
  --superficie2:#eef2f7;
  --linha:#d7dfe8;
  --txt:#0f172a;
  --txt-fraco:#59697c;

  /* No claro o verde precisa escurecer para o texto branco ter contraste —
     é o mesmo #15803d que o relatório em PDF já usa (report_service.py). */
  --acento:#15803d;
  --acento-txt:#ffffff;
  --acento-suave:#15803d22;
  --acento-fundo:#dcfce7;
  --acento-borda:#86efac;

  --info:#0369a1;
  --roxo:#6d28d9;
  --sucesso-txt:#15803d;

  --aviso:#b45309;
  --aviso-fundo:#fef3c7;
  --aviso-borda:#fcd34d;
  --perigo:#b91c1c;
  --perigo-fundo:#fee2e2;
  --perigo-borda:#fca5a5;
  --atencao-borda:#ea580c;

  /* Mesmo dourado, escurecido: sobre fundo claro o tom do brasão sumia. */
  --dourado:#a1793a;
  --sombra-cartao:0 1px 2px #0f172a0f, 0 8px 24px #0f172a14;

  --nav-fundo:#ffffffee;
  --sombra-modal:#0f172a66;
  --legenda-fundo:#0f172ab3;
  --moldura-foto:#e2e8f0;

  --veu:linear-gradient(180deg,rgba(244,246,249,.55) 0%,rgba(244,246,249,.85) 40%,rgba(244,246,249,.97) 100%);
  --cartao-translucido:rgba(255,255,255,.86);
  --cartao2-translucido:rgba(238,242,247,.78);
  --foto-fundo-opacidade:.10;
}

/* Medidas: iguais nos dois temas. */
:root{
  --raio:14px;
  --raio-sm:10px;
  --raio-md:12px;
  --raio-xl:18px;
  --raio-pill:999px;

  /* Largura da barra lateral no desktop (≥1024px). Mora aqui porque o
     body precisa do mesmo valor como padding-left. */
  --nav-largura:210px;

  /* Família de títulos. Hoje só a tela de entrada usa — o resto do app
     segue na stack do sistema. Archivo é servido pelo próprio domínio
     (static/fontes/): a página lida com dado de saúde de menores e um
     pedido a fonts.gstatic.com entregaria IP e referrer a terceiro. */
  --fonte-titulo:"Archivo","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}