/* ═══════════════════════════════════════════════════════════════════════
   Tema escuro. So a camada semantica muda, nunca a primitiva nem o
   componente. E exatamente pra isto que a camada 2 do design system
   existe: nenhum componente referencia --pl-800 direto, so var(--superficie),
   entao a troca de tema nao precisa tocar em estilo.css nem em efeitos.css.

   Fica em arquivo proprio, fora de tokens.css, de proposito: o verificador
   tools/contraste.mjs le tokens.css como fonte da verdade do tema claro,
   e um bloco [data-theme="dark"] misturado ali faria a ultima declaracao
   (a escura) vencer na leitura ingenua do script.

   Pares medidos a mao com a mesma formula do verificador antes de entrar:
     texto (nt-50) x fundo (pl-900)........... 13.80:1
     texto (nt-50) x superficie (pl-800)....... 10.32:1
     texto-suave (pl-200) x fundo.............. 9.59:1
     texto-suave (pl-200) x superficie......... 7.17:1
     destaque (ar-300) x fundo................. 7.61:1
     destaque (ar-300) x superficie............ 5.69:1
     positivo/negativo/atencao, novos tons claros, x fundo e x superficie:
       vd-400  7.31:1 / 5.47:1
       tj-400  6.57:1 / 4.92:1
       am-400  8.17:1 / 6.11:1
   Todos acima do minimo de 4,5:1 pra texto.

   --acento (pl-600) e --destaque-inverso (ar-300) NAO mudam: sao cores de
   botao com texto de contraste fixo (branco ou pl-900 escrito direto no
   componente), entao o par ja e correto em qualquer fundo de pagina.
   ═══════════════════════════════════════════════════════════════════════ */

:root[data-theme="dark"]{
  --fundo:var(--pl-900);
  --fundo-alt:var(--pl-800);
  --superficie:var(--pl-800);
  --superficie-2:var(--pl-700);

  --texto:var(--nt-50);
  --texto-suave:var(--pl-200);

  --borda:rgba(255,255,255,.10);
  --borda-forte:rgba(255,255,255,.24);

  --destaque:var(--ar-300);
  /* mesmo par ja verificado pro --destaque (ar-300 sobre pl-800/pl-900):
     5,69:1 e 7,61:1. --acento continua pl-600 nos dois temas porque so
     e usado como fundo de botao com texto branco fixo. */
  --acento-texto:var(--ar-300);

  --positivo:var(--vd-400);
  --negativo:var(--tj-400);
  --atencao:var(--am-400);

  /* sombra mais preta, menos tingida: contra fundo ja escuro, sombra de
     ameixa clara demais fica esbranquicada em vez de dar profundidade */
  --el-1:0 1px 2px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.28);
  --el-2:0 8px 24px -8px rgba(0,0,0,.5);
  --el-3:0 24px 60px -20px rgba(0,0,0,.6);
}