/* tokens.css
   Unico arquivo com hex do projeto (vault: Sistema_de_Estilos, DESIGN).
   Familia de cor escolhida na Fase 0: --accent (LASTRO). Toda nota que
   escreve --cor-primaria, --cor-primaria-suave, --cor-primaria-escura le-se
   aqui --accent, --accent-suave, --accent-escura. Tema claro do DESIGN.md. */
:root {
  /* Marca: rampa derivada pelo paleta.py (contraste 4.87 do texto sobre o accent) */
  --accent: #8C6963;
  --accent-hover: #745752;
  --accent-escura: #56413D;
  --accent-suave: #F2EEED;
  --accent-soft: rgba(140, 105, 99, 0.12);
  --accent-sombra: rgba(140, 105, 99, 0.15);
  --accent-texto: #8C6963;
  --texto-sobre-accent: #FFFFFF;

  /* Neutros do tema claro (DESIGN.md secao 2) */
  --branco: #FFFFFF;
  --fundo: #F8F9FA;
  --borda: #E5E7EB;
  --texto: #1a1a2e;
  --texto-secundario: #6b7280;
  --texto-suave: #4a5568;
  --texto-fraco: #9ca3af;
  --grafite: #1E293B;

  /* Estados */
  --verde: #22c55e;
  --verde-suave: #f0fdf4;
  --verde-texto: #15803d;
  --verde-toggle: #16a34a;   /* liga/desliga ligado (vault: Padrao_Toggle_OnOff) */
  --grupo-dev: #475569;      /* cor do grupo Desenvolvedor (Painel_Desenvolvedor) */
  --vermelho: #ef4444;
  --vermelho-suave: #fef2f2;
  --vermelho-texto: #b91c1c;
  --ambar: #f59e0b;
  --ambar-suave: #fffbeb;
  --ambar-texto: #b45309;
  --azul-info: #3b82f6;
  --azul-suave: #eff6ff;
  --azul-texto: #1d4ed8;

  /* KPI (vault: Padrao_KPI_Dashboard): faixa de 3px, icone pastel e borda do card pos/neg */
  --kpi-faixa-base: #cbd5e1;
  --kpi-fat-1: #22c55e;
  --kpi-fat-2: #16a34a;
  --kpi-traf-1: #475569;
  --kpi-traf-2: #334155;
  --kpi-imp-1: #94a3b8;
  --kpi-imp-2: #64748b;
  --kpi-fin-1: #fbbf24;
  --kpi-fin-2: #a16207;
  --kpi-neg-1: #f87171;
  --kpi-neg-2: #dc2626;
  --kpi-ico-base: var(--accent-suave);
  --kpi-ico-fat: #dcfce7;
  --kpi-ico-traf: #e2e8f0;
  --kpi-ico-imp: #f1f5f9;
  --kpi-ico-fin: #fef3c7;
  --kpi-borda-pos: #bbf7d0;
  --kpi-borda-neg: #fecaca;

  /* Transparencias (camadas flutuantes e barra de selecao escura) */
  --branco-vidro: rgba(255, 255, 255, 0.85);
  --branco-borda: rgba(255, 255, 255, 0.3);
  --branco-hover: rgba(255, 255, 255, 0.1);
  --hover-neutro: rgba(15, 23, 42, 0.04);
  --backdrop: rgba(15, 23, 42, 0.55);
  --blur: blur(12px);

  /* IA (vault: Padrao_Marca_IA): roxo exclusivo, nunca a cor da marca */
  --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;
  --roxo-borda-suave: #ddd6fe;   /* borda da .tag-ia (Padrao_Marca_IA) */

  /* Pista de sombra na borda da tabela com rolagem horizontal (Responsividade_Sempre) */
  --branco-zero: rgba(255, 255, 255, 0);
  --sombra-pista: rgba(15, 23, 42, .08);
  --sombra-pista-zero: rgba(15, 23, 42, 0);

  /* Tipografia: Inter no corpo, Sora so em titulo (Sistema_de_Estilos) */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-titulo: "Sora", "Inter", sans-serif;
  --fs-2xs: 11.5px;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 28px;

  /* Espacos (Padrao_Espacamento_e_Respiro) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;

  /* Raios (DESIGN: 6 | 10 | 12 | 16 | 18 | 9999) */
  --raio-sm: 6px;
  --raio: 10px;
  --raio-md: 12px;
  --raio-lg: 16px;
  --raio-xl: 18px;
  --raio-full: 9999px;

  /* Sombras (flat-first: so camadas flutuantes) */
  --sombra-sm: 0 1px 3px rgba(15, 23, 42, 0.10);
  --sombra-md: 0 8px 24px rgba(15, 23, 42, 0.10);
  --sombra-lg: 0 16px 48px rgba(15, 23, 42, 0.18);

  --transicao: .18s ease;

  /* Layout */
  --sidebar-width: 248px;
  --topbar-altura: 58px;
}
