/* PATH: /home1/andr8930/public_html/assets/css/00-tokens.css
   DESC: Tokens globais (padrão do sistema).
         Regras:
         - 1 font base (texto geral)
         - 1 escala fixa de fontes (xs/sm/md/lg/xl/2xl)
         - 1 padrão de tabelas
         - 1 padrão de forms
         - Cores e raios únicos (componentes e páginas usam somente variáveis)

   ATUALIZADO: 2026-01-21
   FIX (2026-01-21): tokens não sobrescrevem mais a cor dinâmica da revenda
                    quando /css/theme.php é carregado antes deste arquivo.
*/

:root{
  /* Fontes */
  --font-sans: Arial, system-ui, -apple-system, "Segoe UI", Roboto, ui-sans-serif, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;

  /* Accent
     IMPORTANTE: este arquivo NÃO deve sobrescrever a cor dinâmica da revenda.
     O /css/theme.php define (ou deve definir) --accent-r / --accent-g / --accent-b.
     Aqui a gente só cria variáveis derivadas com fallback, funcionando mesmo
     se o theme.php vier antes OU depois na ordem dos <link>.
  */
  --accent-rv: var(--accent-r, 34);
  --accent-gv: var(--accent-g, 197);
  --accent-bv: var(--accent-b, 143);
  --accent-rgb: var(--accent-rv), var(--accent-gv), var(--accent-bv);
  --accent: rgb(var(--accent-rgb));
  --accent-08: rgba(var(--accent-rgb), .08);
  --accent-12: rgba(var(--accent-rgb), .12);
  --accent-15: rgba(var(--accent-rgb), .15);
  --accent-16: rgba(var(--accent-rgb), .16);
  --accent-55: rgba(var(--accent-rgb), .55);

  /* Cores base */
  --text: #111827;
  --text-2: #374151;
  --muted: #6b7280;
  --muted-2: #4b5563;

  --bg: #f3f4f6;
  --bg-soft: rgba(0,0,0,.03);
  --card: #ffffff;

  /* Bordas (1 = suave; 3 = mais forte) */
  --border: rgba(17,24,39,.12);
  --border-2: rgba(17,24,39,.18);
  --border-3: rgba(17,24,39,.24);

  /* Links */
  --link: var(--accent);
  --link-hover: rgba(var(--accent-rgb), .75);

  /* Tipografia (escala unica) */
  --fs-2xs: 10px;  /* micro-texto (badges/meta) — Fase 3b */
  --fs-xs: 12px;   /* observacoes/descricao */
  --fs-sm: 13px;   /* inputs/tabela */
  --fs-md: 14px;   /* base */
  --fs-lg: 16px;   /* subtitulo/menus compactos */
  --fs-xl: 18px;   /* menu/topbar */
  --fs-2xl: 22px;  /* titulo */
  --fs-3xl: 28px;  /* display/seção grande — Fase 3b */

  --lh-base: 1.4;

  /* Raios */
  --radius-xs: 4px;   /* raio sutil — Fase 3b */
  --radius-sm: 10px;
  --radius: 12px;
  --radius-lg: 14px;
  --radius-xl: 18px;

  /* Tabelas */
  --table-head-bg: rgba(0,0,0,.02);
  --table-row-hover: rgba(0,0,0,.015);

  /* Forms */
  --field-bg: #ffffff;
  --field-text: rgba(15,23,42,.92);
  --field-placeholder: rgba(15,23,42,.35);

  /* Status */
  --status-criado: #999999;
  --status-enviado: #5892CC;
  --status-aberto: #FF6600;
  --status-pendente: #ED3B3B;
  --status-aprovado: #38CF38;
  --status-expirado: #ED3B3B;
  --status-aprov-cliente: #15803d;

  /* Sombras */
  --shadow-sm: 0 6px 18px rgba(0,0,0,.10);
  --shadow: var(--shadow-sm);

  /* Spacing (escala completa) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;

  /* ===== Padronização (auditoria 2026-07, Fase 1 — aditivo) =====
     Tokens novos habilitados para uso; nada é redefinido aqui, portanto
     não há mudança visual até que sejam referenciados (Fases 2+). */

  /* Raio de pílula (botões/chips) — hoje escrito como 999px cru em ~200 lugares */
  --radius-pill: 999px;

  /* Escala de elevação (sombra) — go-forward. --shadow/--shadow-sm acima ficam intactos */
  --shadow-1: 0 2px 8px rgba(0,0,0,.06);      /* card em repouso */
  --shadow-2: 0 8px 18px rgba(15,23,42,.08);  /* card elevado / hover */
  --shadow-3: 0 20px 60px rgba(0,0,0,.30);    /* modal / overlay */

  /* Anel de foco único (campos, botões, elementos interativos) */
  --focus-ring: 0 0 0 3px rgba(var(--accent-rgb), .15);

  /* Movimento (1 tempo rápido + 1 padrão, 1 curva) */
  --transition-fast: .12s ease;
  --transition: .15s ease;

  /* Camadas (z-index) — escala nomeada; proíbe 9999/2147483647 */
  --z-base: 0;
  --z-dropdown: 1000;
  --z-sticky: 1100;   /* header/topbar fixos */
  --z-overlay: 1200;  /* backdrop de modal */
  --z-modal: 1300;
  --z-toast: 1400;    /* alertas / ps-alerts */
}