/*
  tokens.css
  Fonte unica de variaveis do projeto: cor, tipografia, espaco, raio, sombra, z-index.
  Nao declarar cor, raio, sombra ou z-index solto em nenhum outro arquivo: tudo nasce aqui.
  Tema: claro (light) apenas. Sem par de tokens de tema escuro.
*/

:root {
  /* Cor da marca (decisao cravada do projeto: familia --cor-primaria) */
  --cor-primaria: #FF7500;
  --cor-primaria-suave: rgba(255, 117, 0, .12);
  --cor-primaria-escura: #CC5C00;

  /* Neutros e superficies (tema claro) */
  --branco: #FFFFFF;
  --fundo: #F5F6F8;
  --fundo-alt: #EEF0F3;
  --texto: #1F2430;
  --texto-suave: #5B6472;
  --texto-fraco: #9AA0A8;
  --borda: #E5E7EB;
  --borda-forte: #C9CDD3;

  /* Estados */
  --verde: #2ECC71;
  --verde-suave: rgba(46, 204, 113, .12);
  --ambar: #F1C40F;
  --ambar-suave: rgba(241, 196, 15, .12);
  --vermelho: #E74C3C;
  --vermelho-suave: rgba(231, 76, 60, .12);
  --azul-info: #3387E9;
  --azul-info-suave: rgba(51, 135, 233, .12);

  /* Tipografia: Inter (base) + Sora (destaque), ver static/fonts/fonts.css */
  --font: "Inter", -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-titulo: "Sora", "Inter", sans-serif;

  --fs-xs: 11.5px;
  --fs-grupo-label: 10.5px;
  --fs-sm: 13px;
  --fs-md: 14px;
  --fs-base: 15px;
  --fs-lg: 16px;
  --fs-xl: 18px;
  --fs-2xl: 20px;
  --fs-3xl: 28px;

  /* Espacamento */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;

  /* Raio (nunca valor solto, ver Padrao_Box_Card) */
  --raio-sm: 8px;
  --raio: 12px;
  --raio-lg: 18px;
  --raio-full: 9999px;

  /* Sombra (nunca valor solto) */
  --sombra-sm: 0 1px 2px rgba(15, 23, 42, .06), 0 1px 3px rgba(15, 23, 42, .08);
  --sombra: 0 4px 10px rgba(15, 23, 42, .10);
  --sombra-md: 0 8px 20px rgba(15, 23, 42, .12);
  --sombra-lg: 0 16px 40px rgba(15, 23, 42, .16);

  /* Transicao padrao */
  --transicao: all .15s ease;

  /* Anel de foco de campo de formulario (nao e sombra de elevacao) */
  --anel-foco: 0 0 0 3px var(--cor-primaria-suave);

  /* Verde do estado LIGADO do toggle tipo 3. Valor literal exigido por
     Padrao_Toggle_OnOff.md:76 e por Padrao_Toggle_Tipos.md:29 (verde diz
     "esta ativo", laranja diz "esta escolhido"). Nao e o --verde de status,
     que e outro tom e tem outra funcao. */
  --verde-ligado: #16a34a;
  --verde-ligado-texto: #15803D;
  --verde-ligado-fundo: #F0FDF4;

  /* Paleta EXCLUSIVA de IA (Padrao_Marca_IA.md:21-31). Roxa em qualquer
     cliente, inclusive neste, cuja marca e laranja: Sempre_Marcar_IA.md:24
     e literal, "Mesmo que a cor primaria do cliente seja laranja, verde, azul
     ou qualquer outra: IA e sempre roxa". Nao usar --cor-primaria em botao,
     bloco ou badge de IA. */
  --roxo: #7C3AED;
  --roxo-escuro: #6D28D9;
  --roxo-claro: #A78BFA;
  --roxo-texto: #5B21B6;
  --roxo-borda: #C4B5FD;
  --roxo-pastel-1: #FAF5FF;
  --roxo-pastel-2: #EDE9FE;
  --roxo-suave: #F3EEFF;

  /* Layout.
     A topbar tem 58px por Padrao_Acao_Primaria_na_Topbar.md:67 ("altura fixa
     58px"), e nao os 60px do bloco de identidade de Sistema_de_Estilos.md:123.
     As duas notas divergem; vale a mais nova e a que rege o componente. */
  --sidebar-width: 248px;
  --topbar-altura: 58px;
  /* Altura unica dos controles da barra de filtros (Padrao_Barra_de_Filtros.md:14) */
  --fu-h: 38px;
  /* Altura unica dos controles da barra de formulario (Padrao_Formulario.md:109) */
  --form-h: 40px;

  /* Escala de elevacao / z-index (ver Padrao_Elevacao_Zindex, ordem fixa) */
  --z-base: 0;
  --z-sidebar: 100;
  --z-sticky: 200;
  --z-dropdown: 300;
  --z-overlay: 400;
  --z-modal: 500;
  --z-toast: 600;
  --z-tooltip: 700;
}
