/* ==========================================================================
   TAGJÁ — tokens do design system (fonte única de cores, raios, sombras,
   espaçamentos e fontes da web). Servido em /marca/tagja-tokens.css e
   carregado ANTES de /admin/admin.css em todas as páginas.

   Regras (ver server/docs/design-system.md):
   - Nenhuma cor literal (hex/rgb) fora DESTE arquivo nas folhas de estilo e
     nos scripts da interface. Novos componentes usam var(--tj-*).
   - Os valores abaixo são os MESMOS que as telas aprovadas já usavam:
     a introdução dos tokens não muda nenhum pixel.
   - Marca: marinho #142B4F + dourado #FFD700 (gradiente metálico),
     gelo #EEF2F7 de fundo. Verde/vermelho do guia (#1D9E75/#E24B4A) ficam
     em --tj-verde-marca/--tj-vermelho-marca, reservados a ícones/pontos
     até a decisão de acessibilidade (DS-W14) — texto usa --tj-ok/--tj-erro.
   ========================================================================== */
:root {
  /* ---- Marca ---- */
  --tj-marinho: #142B4F;
  --tj-marinho-700: #0F2240;          /* hover de botões marinho */
  --tj-dourado: #FFD700;
  --tj-dourado-700: #C79A00;          /* fim do gradiente metálico */
  --tj-dourado-texto: #9A7700;        /* dourado legível sobre claro (pílula de cota dos planos) */
  --tj-dourado-50: #FFFDF2;           /* fundo "branco dourado" de avisos e destaques */
  --tj-ouro-gradiente: linear-gradient(180deg, #FFF3B0 0%, #FFD700 35%, #E6B800 60%, #FFE766 78%, #C79A00 100%);
  --tj-gelo: #EEF2F7;
  --tj-branco: #FFFFFF;

  /* ---- Superfícies e texto ---- */
  --tj-pagina: #F8F9FC;               /* fundo das páginas */
  --tj-superficie: #F7F9FC;           /* caixas internas (colunas do Kanban, info-linha) */
  --tj-superficie-2: #EEF0F6;         /* código inline, pílula de cota */
  --tj-card: #FFFFFF;
  --tj-texto: #1B1F2A;
  --tj-muted: #697386;
  --tj-borda: #E3E6EE;
  --tj-borda-forte: #CBD1DC;          /* contorno do botão pílula secundário */

  /* ---- Texto/realce sobre o marinho ---- */
  --tj-sobre-marinho: rgba(255, 255, 255, .85);
  --tj-sobre-marinho-suave: rgba(255, 255, 255, .72);
  --tj-overlay: rgba(12, 20, 38, .55); /* fundo escurecido dos modais */

  /* ---- Status (texto escuro sobre fundo claro: contraste AA) ---- */
  --tj-ok: #237A45;        --tj-ok-bg: #E7F3EC;
  --tj-erro: #B3261E;      --tj-erro-bg: #FBEAE9;
  --tj-atencao: #8A6D00;   --tj-atencao-bg: #FFF6D6;
  --tj-neutro: #5B6472;    --tj-neutro-bg: #EEF0F3;
  --tj-info: #2A4FB4;      --tj-info-bg: #E7EEFC;
  --tj-erro-anel: rgba(179, 38, 30, .18);  /* realce de campo com erro */
  --tj-foco-anel: rgba(20, 43, 79, .25);   /* foco visível de cards/radios */
  /* Cores do guia de marca: só ícones, pontos, bordas e preenchimentos (DS-W14). */
  --tj-verde-marca: #1D9E75;
  --tj-vermelho-marca: #E24B4A;

  /* ---- Raios ---- */
  --tj-raio-sm: 8px;
  --tj-raio-md: 10px;
  --tj-raio: 12px;
  --tj-raio-lg: 14px;
  --tj-raio-xl: 16px;
  --tj-raio-pill: 999px;

  /* ---- Sombras ---- */
  --tj-sombra-card: 0 8px 24px rgba(20, 43, 79, .12);
  --tj-sombra-menu: 0 12px 30px rgba(20, 43, 79, .14);
  --tj-sombra-cta: 0 6px 18px rgba(20, 43, 79, .15);
  --tj-sombra-modal: 0 20px 50px rgba(12, 20, 38, .3);

  /* ---- Espaçamentos (escala de 4px) ---- */
  --tj-esp-1: 4px;
  --tj-esp-2: 8px;
  --tj-esp-3: 12px;
  --tj-esp-4: 16px;
  --tj-esp-5: 20px;
  --tj-esp-6: 24px;
  --tj-esp-8: 32px;

  /* ---- Fontes ----
     Interface: pilha de sistema aprovada (Inter/Manrope do guia exigiriam webfont;
     decisão pendente — trocar aqui muda todas as telas de uma vez).
     Título/logo: Poppins/Montserrat SemiBold (com fallback do sistema). */
  --tj-fonte-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --tj-fonte-titulo: "Poppins", "Montserrat", "Segoe UI", Arial, sans-serif;
  --tj-fonte-mono: monospace;
}