/*
 * Padrão visual CLPT — tokens (cores, forma, fonte).
 * Fonte da verdade: _padrao-clpt/PADRAO_VISUAL.md
 * Seguro para qualquer projeto: só declara variáveis, não estiliza elementos.
 * Copie para o projeto sem alterar; ajustes específicos vão no CSS do projeto.
 */
:root {
  color-scheme: light;

  /* Marca */
  --vermelho: #e2231a;
  --vermelho-escuro: #b81913;
  --vermelho-claro: #fdecea;
  --vermelho-halo: rgba(226, 35, 26, .10);

  /* Neutros */
  --texto: #2b2b2b;
  --texto-titulo: #202124;
  --texto-suave: #6b6b6b;
  --texto-fraco: #8a8a8a;
  --borda: #e2e2e2;
  --borda-input: #d8d8d8;
  --linha: #eeeeee;
  --fundo: #f4f5f7;
  --fundo-claro: #fafafa;
  --hover-linha: #fafbfc;
  --branco: #ffffff;

  /* Status (texto/número) */
  --verde: #1e8e3e;
  --azul: #2563eb;
  --amarelo: #b7791f;
  --roxo: #7459c8;
  --cinza: #667085;

  /* Status (badge: fundo + texto) */
  --badge-neutro-bg: #ececec;   --badge-neutro: #555555;
  --badge-azul-bg: #e8f1fb;     --badge-azul: #24538a;
  --badge-verde-bg: #e4f4ea;    --badge-verde: #17653b;
  --badge-amarelo-bg: #fff3df;  --badge-amarelo: #8a5810;
  --badge-roxo-bg: #f0edff;     --badge-roxo: #5d4aa8;
  --badge-vermelho-bg: #fdecea; --badge-vermelho: #e2231a;

  /* Gráficos */
  --grafico-barra: #98a2b3;
  --grafico-destaque: #e2231a;
  --grafico-eixo: #d7d7d7;
  --grafico-trilha: #ececec;
  --grafico-valor: #475467;
  --grafico-rotulo: #667085;

  /* Forma */
  --raio-sm: 8px;    /* inputs, botões */
  --raio: 10px;      /* cards, painéis, tabelas */
  --raio-lg: 12px;   /* modais, login, cards do app mobile */
  --sombra-painel: 0 4px 14px rgba(25, 30, 36, .025);
  --sombra-flutuante: 0 10px 28px rgba(0, 0, 0, .14);
  --sombra-modal: 0 24px 70px rgba(0, 0, 0, .25);

  /* Movimento (ver seção Movimento do PADRAO_VISUAL) */
  --dur-rapida: 120ms;  /* hover, foco, troca de conteúdo */
  --dur-media: 170ms;   /* abrir modal, lista, seção */
  --dur-painel: 200ms;  /* menu lateral, gaveta */
  --curva: ease;
  --curva-entrada: ease-out;
  --fundo-modal: rgba(22, 24, 28, .56);
  --desfoque-fundo: blur(2px);

  /* Layout */
  --menu-largura: 230px;
  --page-gutter: clamp(14px, 2.1vw, 30px);
  --page-top: clamp(16px, 1.8vw, 26px);
  --gap: 14px;
  --alvo-toque: 48px; /* altura mínima de botões no app mobile */

  --fonte: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}
