/* ============================================================
 * style-tokens.css
 *
 * Fase V1 do plano de port visual (executivos → jurídico).
 *
 * INTRODUZ APENAS DEFINIÇÕES DE CUSTOM PROPERTIES — não aplica
 * a nenhum elemento. Visualmente o sistema é IDÊNTICO ao antes
 * deste arquivo. As próximas fases (V2 tipografia, V3 paleta, etc.)
 * vão consumir estas variáveis via `var(--token-name)`.
 *
 * Tokens espelham os defaults do Tailwind v4 + Geist do app
 * executivos.francoeadvogados.com.br. Ver docs/visual-audit-executivos.md
 * para mapeamento detalhado.
 * ============================================================ */

:root {
  /* ─────────────────── Paleta neutra (zinc scale) ─────────────────── */
  --c-zinc-50:  #fafafa;
  --c-zinc-100: #f4f4f5;
  --c-zinc-200: #e4e4e7;
  --c-zinc-300: #d4d4d8;
  --c-zinc-400: #a1a1aa;
  --c-zinc-500: #71717a;
  --c-zinc-600: #52525b;
  --c-zinc-700: #3f3f46;
  --c-zinc-800: #27272a;
  --c-zinc-900: #18181b;
  --c-zinc-950: #09090b;

  /* ─────────────────── Acento (indigo) ─────────────────── */
  --c-indigo-400: #818cf8;
  --c-indigo-600: #4f46e5;

  /* ─────────────────── Destrutivo (red) ─────────────────── */
  --c-red-50:  #fef2f2;
  --c-red-300: #fca5a5;
  --c-red-500: #ef4444;
  --c-red-700: #b91c1c;
  --c-red-950: #450a0a;

  /* ─────────────────── Tokens semânticos (light = default) ─────────────────── */
  --bg-page:        var(--c-zinc-50);
  --bg-card:        #ffffff;
  --bg-input:       #ffffff;
  --bg-header:      rgba(255, 255, 255, 0.95);

  --fg-primary:     var(--c-zinc-900);
  --fg-secondary:   var(--c-zinc-600);
  --fg-label:       var(--c-zinc-700);
  --fg-muted:       var(--c-zinc-500);
  --fg-on-primary:  #ffffff;

  --border-default: var(--c-zinc-200);
  --border-input:   var(--c-zinc-300);
  --ring-focus:     var(--c-zinc-500);

  --accent:         var(--c-indigo-600);
  --accent-hover:   #4338ca;

  --btn-primary-bg:        var(--c-zinc-900);
  --btn-primary-bg-hover:  var(--c-zinc-800);
  --btn-primary-fg:        #ffffff;

  --error-bg: var(--c-red-50);
  --error-fg: var(--c-red-700);

  /* ─────────────────── Tipografia ─────────────────── */
  --font-sans: "Geist", "Geist Sans", -apple-system, BlinkMacSystemFont,
               "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", "Cascadia Mono",
               "Roboto Mono", Menlo, Monaco, "Courier New", monospace;

  /* Escala (rem em base 16px) */
  --ts-xs:    0.75rem;   /* 12 */
  --ts-sm:    0.875rem;  /* 14 */
  --ts-base:  1rem;      /* 16 */
  --ts-lg:    1.125rem;  /* 18 */
  --ts-xl:    1.25rem;   /* 20 */
  --ts-2xl:   1.5rem;    /* 24 */
  --ts-3xl:   1.875rem;  /* 30 */
  --ts-4xl:   2.25rem;   /* 36 */

  --fw-normal:   400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;

  --tracking-tight: -0.025em;
  --tracking-wide:   0.025em;

  /* ─────────────────── Radius ─────────────────── */
  --r-sm: 4px;
  --r-md: 6px;   /* botões, inputs, alerts */
  --r-lg: 8px;
  --r-xl: 12px;  /* cards */
  --r-full: 9999px;

  /* ─────────────────── Sombras ─────────────────── */
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);

  /* ─────────────────── Espaçamento ─────────────────── */
  --space-1:  0.25rem;   /* 4  */
  --space-2:  0.5rem;    /* 8  */
  --space-3:  0.75rem;   /* 12 */
  --space-4:  1rem;      /* 16 */
  --space-6:  1.5rem;    /* 24 */
  --space-8:  2rem;      /* 32 */
  --space-12: 3rem;      /* 48 */
  --space-16: 4rem;      /* 64 */

  /* ─────────────────── Container widths ─────────────────── */
  --container-sm:  24rem;    /* 384px — login */
  --container-md:  42rem;    /* 672px — home */
  --container-lg:  72rem;    /* 1152px — header/main */
}

/* ─────────────────── Dark mode (system preference) ─────────────────── */
@media (prefers-color-scheme: dark) {
  :root {
    --bg-page:        var(--c-zinc-950);
    --bg-card:        var(--c-zinc-900);
    --bg-input:       var(--c-zinc-800);
    --bg-header:      rgba(9, 9, 11, 0.95);

    --fg-primary:     var(--c-zinc-50);
    --fg-secondary:   var(--c-zinc-400);
    --fg-label:       var(--c-zinc-300);
    --fg-muted:       var(--c-zinc-400);

    --border-default: var(--c-zinc-800);
    --border-input:   var(--c-zinc-700);

    --accent:         var(--c-indigo-400);
    --accent-hover:   #6366f1;

    --btn-primary-bg:        var(--c-zinc-50);
    --btn-primary-bg-hover:  var(--c-zinc-200);
    --btn-primary-fg:        var(--c-zinc-900);

    --error-bg: var(--c-red-950);
    --error-fg: var(--c-red-300);
  }
}