/*
  DocTrak — Design Tokens
  Fonte: doc/design/DESIGN-SYSTEM.md
  Uso: substituir/estender doctrak-web/tailwind.config.ts (token único `brand` provisório).
*/

:root {
  color-scheme: light;

  /* ===== Cor — papéis-base ===== */
  --ink: #12151C;
  --ink-muted: #565D6B;
  --surface: #F6F7F9;
  --surface-raised: #FFFFFF;
  --border: #E2E5EA;
  --border-strong: #8B93A3; /* usar apenas sobre --surface-raised (3.09:1). Sobre --surface cai a 2.88:1 */

  /* ===== Cor — escala de marca ===== */
  --brand-50: #F2EEFE;
  --brand-100: #E5DEFC;
  --brand-300: #B7A3F7;
  --brand-500: #6D3DF0;
  --brand-600: #5B2FE0;
  --brand-700: #4B24B8;
  --brand-900: #241159;

  /* ===== Gradiente-assinatura (uso restrito — ver DESIGN-SYSTEM.md §6) ===== */
  --gradient-signature: linear-gradient(90deg, #22D3EE 0%, #6D3DF0 100%);

  /* ===== Status de prazo (semáforo — nunca reusar para confiança) ===== */
  --ok-100: #DCF3E3;
  --ok-700: #157347;
  --info-100: #DDEBFB;
  --info-700: #1A5A9E;
  --warn-100: #FBEAC7;
  --warn-700: #8A5A05;
  --danger-100: #FAE1DF;
  --danger-700: #B3261E;

  /* ===== Confiança de extração por IA (família violeta — nunca reusar para status) ===== */
  --conf-alta-100: #E5DEFC;
  --conf-alta-700: #4B24B8;
  --conf-media-100: #D2F4FA;
  --conf-media-700: #0E6E85;
  --conf-baixa-100: #FBE3F1;
  --conf-baixa-700: #9C1F72;

  /* ===== Categoria/classificação de documento — 3º sistema, neutro (nunca reusar status/confiança) ===== */
  --tag-neutral-bg: var(--surface);
  --tag-neutral-fg: var(--ink-muted);
  --tag-neutral-border: var(--border);

  /* ===== Paleta de identidade das ENTIDADES gerenciadas (categoria/centro/tag) =====
     10 slugs sorteáveis pelo backend, escolhíveis no cadastro. Pares fundo/texto com contraste
     AA (>=4.5:1) e SATURAÇÃO CONTIDA (§2.3.1): identidade sem competir com o semáforo de status
     nem a família violeta de confiança. Não é um 4º sistema semântico — é rótulo de organização. */
  --palette-violet-bg: #ECE7FD;  --palette-violet-fg: #5B34B0;
  --palette-teal-bg: #D4EFEA;    --palette-teal-fg: #0F6E68;
  --palette-amber-bg: #F7EBCB;   --palette-amber-fg: #8A5A05;
  --palette-rose-bg: #FADCE4;    --palette-rose-fg: #A32651;
  --palette-sky-bg: #DBE9F8;     --palette-sky-fg: #1E5F9C;
  --palette-lime-bg: #E7F0CF;    --palette-lime-fg: #4F7513;
  --palette-indigo-bg: #E1E3F7;  --palette-indigo-fg: #3B3B95;
  --palette-coral-bg: #FBE1D8;   --palette-coral-fg: #A83C22;
  --palette-slate-bg: #E4E7ED;   --palette-slate-fg: #47505F;
  --palette-emerald-bg: #D7EFDE; --palette-emerald-fg: #12723F;

  /* ===== Tipografia ===== */
  --font-display: 'Manrope', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.563rem;
  --text-3xl: 1.953rem;
  --text-4xl: 2.441rem;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ===== Espaço (base 4px) ===== */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* ===== Radius (nunca 0) ===== */
  --radius-field: 8px;
  --radius-card: 12px;
  --radius-panel: 16px;
  --radius-pill: 999px;

  /* ===== Elevação (tingida de ink, não preto puro) ===== */
  --elev-sm: 0 1px 2px rgba(18, 21, 28, .06);
  --elev-md: 0 6px 16px rgba(18, 21, 28, .10);
  --elev-lg: 0 20px 40px rgba(18, 21, 28, .16);

  /* ===== Movimento ===== */
  --motion-micro: 120ms;
  --motion-standard: 200ms;
  --motion-panel: 280ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);

  /* ===== Touch / foco ===== */
  --touch-min: 44px;
  --focus-ring: 0 0 0 3px rgba(109, 61, 240, .35);

  /* ===== Shell escuro (topbar) — DESIGN-SYSTEM.md §5.5 =====
     Variante escura do cabeçalho fixo, pedida pelo fundador a partir da V1 (bg-brand-900 antigo).
     Azul-profundo da família Wego dark, não o brand-900 violeta institucional antigo. Usar SÓ na
     topbar (.app-header) — o corpo da tela permanece na superfície clara (§0: uso prolongado). */
  --shell-dark-bg: #10193A;                 /* 17.2:1 com branco — muito acima de AA */
  --shell-dark-ink: rgba(255,255,255,.96);  /* texto principal / item ativo */
  --shell-dark-ink-muted: rgba(255,255,255,.68); /* item inativo — 8.4:1, nunca abaixo disso p/ nav */
  --shell-dark-ink-quiet: rgba(255,255,255,.55); /* metadado secundário (ex.: nome da org) — 6.0:1 */
  --shell-dark-hover-bg: rgba(255,255,255,.08);
  --shell-dark-active-bg: rgba(255,255,255,.06);
  --shell-dark-border: rgba(255,255,255,.10); /* divisores sutis dentro da topbar, se precisar */
  --shell-dark-avatar-bg: rgba(255,255,255,.14);
  --shell-dark-avatar-fg: #FFFFFF;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-micro: 1ms;
    --motion-standard: 1ms;
    --motion-panel: 1ms;
  }
}