/* ============================================================================
   tokens.css — app-financeiro ("Prumo")
   FONTE DA VERDADE: docs/design-system.md (Seções 2.3, 3.2, 5.1–5.4, 7)
   Nenhum valor aqui é inventado. Cada token abaixo tem origem rastreável.
   Proibido usar valor literal de cor/espaço/raio fora desta escala.
   ========================================================================== */

:root {
  /* ---- Tipografia (design-system.md 2.1/2.2) ------------------------------
     Produção: IBM Plex Sans/Mono AUTO-HOSPEDADAS em /fonts/*.woff2
     (architecture.md 3.4 — sem CDN: LGPD + determinismo).
     Fase 0 usa <link> do Google Fonts só para aprovação visual. */
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  /* Escala tipográfica — base 16px (design-system.md 2.3) */
  --fs-kpi: 30px;         --lh-kpi: 36px;
  --fs-page-title: 26px;  --lh-page-title: 32px;
  --fs-section: 20px;     --lh-section: 28px;
  --fs-card-title: 16px;  --lh-card-title: 24px;
  --fs-body: 16px;        --lh-body: 24px;
  --fs-table: 14px;       --lh-table: 20px;
  --fs-label: 13px;       --lh-label: 18px;
  --fs-caption: 13px;     --lh-caption: 18px;
  --fs-badge: 12px;       --lh-badge: 16px;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  /* ---- Estrutura: tinta e papel (neutros quentes) — 3.2 ------------------ */
  --ink-900: #1A1D23;
  --ink-600: #4A515E;
  --ink-400: #5F6673;
  --surface-page: #F7F5F2;
  --surface-card: #FFFFFF;
  --surface-sunken: #EFEBE6;
  --border-subtle: #E4E0DA;   /* divisória DECORATIVA */
  --border-strong: #8A8578;   /* limite ESSENCIAL (campo, checkbox) ≥3:1 */

  /* ---- Marca: Ameixa — 3.2 ---------------------------------------------- */
  --brand-800: #4A1C42;
  --brand-700: #5A2350;
  --brand-600: #6B2D5C;
  --brand-subtle: #F3E9F1;
  --nav-bg: #241E28;
  --nav-bg-hover: #3A2F3C;
  --nav-text-idle: #B9A8B5;
  --nav-text-active: #FFFFFF;

  /* ---- Semântica financeira (significado FIXO, nunca decoração) — 3.2 ---- */
  --pos-700: #12715A;   --pos-subtle: #E8F4EF;
  --neg-700: #A62B22;   --neg-subtle: #FBEAE8;
  --warn-700: #8A5A00;  --warn-subtle: #FDF3D9;

  /* Séries de gráfico — ordem FIXA, nunca aleatória (3.2) */
  --chart-1: var(--pos-700);
  --chart-2: var(--neg-700);
  --chart-3: var(--brand-600);
  --chart-4: var(--warn-700);
  --chart-5: var(--ink-400);

  /* ---- Espaçamento — base 4px (5.1). Fora da escala não existe. --------- */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 20px;  --space-6: 24px;  --space-8: 32px;  --space-10: 40px;
  --space-12: 48px; --space-16: 64px;

  /* ---- Raio — deliberadamente pequeno (5.2) ----------------------------- */
  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 8px;
  --radius-full: 999px;

  /* ---- Elevação — borda primeiro, sombra só em sobreposição real (5.3) -- */
  --elev-1: 0 1px 2px rgba(26, 29, 35, .06), 0 4px 12px rgba(26, 29, 35, .08);
  --elev-2: 0 8px 32px rgba(26, 29, 35, .16);

  /* ---- Layout (5.4) ------------------------------------------------------ */
  --nav-width: 248px;
  --nav-width-collapsed: 64px;
  --topbar-height: 56px;
  --content-max: 1440px;
  --row-height: 48px;          /* densidade padrão (11.1 item 4) */
  --row-height-compact: 40px;
  --control-height: 40px;
  --touch-target: 44px;

  /* ---- Movimento — o produto opera em Repouso (Seção 7) ------------------
     Só existem 4 microfeedbacks nomeados. Nada de animação de entrada/scroll. */
  --motion-conferencia: 150ms;  /* hover/foco */
  --motion-baixa: 100ms;        /* acionamento */
  --motion-lancamento: 200ms;   /* entrada causada pelo usuário */
  --motion-apuracao: 1200ms;    /* pulso de esqueleto */
  --ease-out: cubic-bezier(.2, .6, .3, 1);
  --ease-in-out: cubic-bezier(.4, 0, .2, 1);
}

/* prefers-reduced-motion: Conferência/Baixa/Lançamento viram troca instantânea
   e Apuração para de pulsar (design-system.md 7). */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-conferencia: 0ms;
    --motion-baixa: 0ms;
    --motion-lancamento: 0ms;
  }
}
