/*
  tokens.css - As "peças básicas" do visual do SGE: cores, tamanhos, espaços e sombras.
  Para mudar o visual do sistema inteiro, mude AQUI. Nenhuma outra folha de estilo
  deve ter cor ou medida "solta": todas usam estas variáveis.

  Cores da marca tiradas da logo da escola: verde escuro, verde vivo e laranja.
  Todos os pares de texto/fundo abaixo foram conferidos para contraste mínimo de 4,5:1
  (padrão de acessibilidade WCAG AA).
*/
:root {
  /* Marca */
  --verde-escuro:   #354d36;   /* menu, botão principal, títulos */
  --verde-escuro-2: #2a3e2b;   /* ao passar o mouse */
  --verde-escuro-3: #46634a;   /* item ativo do menu */
  --verde-vivo:     #23b258;   /* destaques, bordas, foco (não usar como cor de texto) */
  --laranja:        #f36638;   /* botão de destaque e marcadores (texto sobre ele: escuro) */
  --laranja-escuro: #b33f0e;   /* laranja para TEXTO sobre fundo claro */
  --laranja-fundo:  #fff1ea;

  /* Neutros (levemente esverdeados) */
  --fundo:        #f4f7f3;
  --superficie:   #ffffff;
  --borda:        #dfe6dc;
  --borda-forte:  #c3cfc0;
  --texto:        #1c261d;
  --texto-suave:  #556256;

  /* Estados */
  --sucesso:        #1d7a3f;  --sucesso-fundo: #e6f6ec;
  --perigo:         #b42318;  --perigo-fundo:  #fdeceb;
  --aviso:          #8a5300;  --aviso-fundo:   #fff4d6;
  --info:           #1d5fa8;  --info-fundo:    #e8f1fb;

  /* Texto */
  --fonte: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --t-xs: .8125rem;  --t-sm: .875rem;  --t-base: 1rem;
  --t-lg: 1.125rem;  --t-xl: 1.375rem; --t-2xl: 1.75rem;

  /* Espaços */
  --e-1: .25rem; --e-2: .5rem; --e-3: .75rem; --e-4: 1rem;
  --e-5: 1.5rem; --e-6: 2rem;  --e-7: 3rem;

  /* Formas e sombras */
  --raio: .625rem;  --raio-sm: .375rem;  --raio-pilula: 999px;
  --sombra-1: 0 1px 2px rgb(28 38 29 / .06), 0 1px 3px rgb(28 38 29 / .08);
  --sombra-2: 0 4px 12px rgb(28 38 29 / .10);
  --sombra-3: 0 12px 32px rgb(28 38 29 / .20);
  --foco: 0 0 0 3px rgb(35 178 88 / .45);

  /* Medidas do esqueleto */
  --menu-largura: 16rem;
  --topo-altura: 3.75rem;
}