/**
 * tema.css — os tokens de MARCA do Vertix, e o único lugar onde eles moram.
 *
 * POR QUE ESTE ARQUIVO EXISTE. As telas já usavam variáveis CSS (671 usos no
 * painel, 240 no app do aluno), mas cada uma declarava o próprio vocabulário e
 * os três divergiam: `--accent` era azul no painel e azul-marinho no app do
 * aluno, e o mesmo tom escuro se chamava `--accent-dark` num arquivo e
 * `--accent-d` no outro. Trocar a cor da marca exigia caçar o sinônimo certo
 * em cada tela. Agora existe um vocabulário só, aqui, e cada tela apenas diz
 * qual token ela usa.
 *
 * O QUE ENTRA AQUI. Só identidade: as cores que mudam quando a marca muda.
 *
 * O QUE NÃO ENTRA, e não é esquecimento:
 *
 *   - Cor com SIGNIFICADO. Verde é "deu certo", vermelho é "erro", âmbar é
 *     "atenção", #25D366 é o verde do WhatsApp e é dele. Um treinador de marca
 *     vermelha não pode fazer o "salvo com sucesso" virar vermelho.
 *   - SUPERFÍCIE. Fundo, cartão, borda e a barra lateral escura do painel
 *     seguem neutros. Deixar pintar o fundo é o caminho mais curto para uma
 *     tela ilegível, e identidade visual não é isso.
 *
 * OS `_RGB`. Existem porque o mesmo tom aparece com transparências diferentes
 * (0.10 no item de menu, 0.28 no pulso de destaque, 0.12 no foco do campo).
 * `rgba(var(--brand-primary-rgb), .28)` resolve isso sem uma variável por
 * alfa, e funciona em qualquer navegador que o projeto já atende.
 *
 * OS VALORES ABAIXO SÃO O PADRÃO VERTIX. Quem não configurar marca nenhuma
 * fica exatamente com eles. A troca por treinador acontece em tempo de
 * execução, sobrescrevendo estas mesmas variáveis no elemento raiz -- por isso
 * o que estiver aqui é o fallback, e não um valor a ser copiado tela adentro.
 */
:root {
  /* Primária — a cor de ação: botão, link, item de menu ativo, foco. */
  --brand-primary: #0A84FF;
  --brand-primary-rgb: 10,132,255;
  --brand-primary-dark: #0066CC;

  /* Secundária — o tom escuro da marca: barra do topo do app do aluno,
     botões de peso, etiquetas. No app do aluno ela é a cor de ação do tema
     claro, e é por isso que `--accent` aponta para cá lá, e para a primária
     aqui no painel. */
  --brand-secondary: #0D1B2A;
  --brand-secondary-rgb: 13,27,42;

  /* Destaque — usada hoje na home mobile do painel. Fica no vocabulário
     porque é identidade, mas ainda não é configurável: a marca do treinador
     tem duas cores, e a terceira será derivada delas. */
  --brand-accent: #10B981;
  --brand-accent-rgb: 16,185,129;
  --brand-accent-dark: #0E9F6E;
  --brand-accent-soft: #E7F7F1;
}