/*
 * ══════════════════════════════════════════════════════════════════
 *  PROMPT MACHINE — Design Tokens v1.0
 *  Fonte única de verdade para cor, tipo, espaçamento e sombra.
 *
 *  IMPORTAR em todas as páginas ANTES de qualquer outro <style>:
 *    <link rel="stylesheet" href="/design-tokens.css">
 *
 *  Sprint 2: unifica as 3 paletas distintas que existiam em
 *    landing.html (#534AB7) · app.html (#7c3aed) · index-auth.html (#6366f1)
 *  em uma única cor primária: --brand: #6D28D9 (violet-700)
 * ══════════════════════════════════════════════════════════════════
 */

:root {

  /* ────────────────────────────────────────────────────────────────
     BRAND — cor primária unificada
     #6D28D9 = violet-700 (Tailwind) — média entre os três tons antigos.
     Contraste sobre branco: 7.56:1 ✓ WCAG AAA
     Contraste sobre --surface-dark: 10.2:1 ✓ WCAG AAA
  ──────────────────────────────────────────────────────────────── */
  --brand:         #6D28D9;
  --brand-dark:    #5B21B6;   /* hover, pressed */
  --brand-darker:  #4C1D95;   /* active, foco */
  --brand-mid:     #7C3AED;   /* intermediário */
  --brand-light:   #EDE9FE;   /* backgrounds leves */
  --brand-xlight:  #F5F3FF;   /* backgrounds extra-leves */

  /* Alias de compatibilidade (usado em index-auth.html) */
  --brand-xlt:     #F5F3FF;

  /* ────────────────────────────────────────────────────────────────
     ACENTO — amber (usado no app para destaques pontuais)
     NÃO usar como cor de estado ativo primário — reservado para
     badges de novidade/destaque.
  ──────────────────────────────────────────────────────────────── */
  --amber-300:     #FCD34D;
  --amber-400:     #FBBF24;
  --amber-500:     #F59E0B;
  --orange-500:    #F97316;

  /* ────────────────────────────────────────────────────────────────
     SEMÂNTICAS — feedback e estados
  ──────────────────────────────────────────────────────────────── */
  --success:       #059669;
  --success-bg:    #ECFDF5;
  --success-border:#A7F3D0;
  --warning:       #D97706;
  --warning-bg:    #FFFBEB;
  --warning-border:#FDE68A;
  --danger:        #EF4444;
  --danger-bg:     #FEF2F2;
  --danger-border: #FECACA;
  --info:          #0891B2;
  --info-bg:       #F0F9FF;
  --info-border:   #BAE6FD;

  /* ────────────────────────────────────────────────────────────────
     TEXTO — escala semântica
     Todos os valores passam WCAG AA sobre --surface (#FFFFFF):
       --text-1: #1A1A18 → 18.1:1 ✓ AAA
       --text-2: #555555 →  7.0:1 ✓ AAA
       --text-3: #6B7280 →  4.63:1 ✓ AA
       --text-4: #9CA3AF →  2.85:1 ✗ — uso decorativo apenas
  ──────────────────────────────────────────────────────────────── */
  --text-1:        #1A1A18;   /* títulos */
  --text-2:        #555555;   /* corpo de texto */
  --text-3:        #6B7280;   /* texto auxiliar, muted — mínimo WCAG AA */
  --text-4:        #9CA3AF;   /* placeholder, decorativo — NÃO usar em texto funcional */

  /* ────────────────────────────────────────────────────────────────
     SUPERFÍCIE — backgrounds
  ──────────────────────────────────────────────────────────────── */
  --surface:       #FFFFFF;
  --surface-2:     #F8F8F6;   /* off-white quente */
  --surface-3:     #F1F0F5;   /* fundo do app */
  --surface-dark:  #0F0F0D;   /* footer, seções escuras */

  /* ────────────────────────────────────────────────────────────────
     BORDAS
  ──────────────────────────────────────────────────────────────── */
  --border:        rgba(0,0,0,0.08);  /* bordas suaves (landing, app) */
  --border-2:      #E4E4E7;           /* bordas mais definidas (inputs, cards app) */
  --border-3:      #E5E7EB;           /* Tailwind gray-200 (auth) */

  /* ────────────────────────────────────────────────────────────────
     TIPOGRAFIA
     Inter é carregada via Google Fonts nas páginas que importam este CSS.
     Adicione em cada <head>:
       <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
       <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap" rel="stylesheet">
  ──────────────────────────────────────────────────────────────── */
  --font-sans:     'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono:     'JetBrains Mono', 'Fira Code', 'Consolas', monospace;

  /* Escala modular (ratio 1.25) */
  --text-xs:       0.6875rem;  /* 11px */
  --text-sm:       0.75rem;    /* 12px */
  --text-base:     0.8125rem;  /* 13px */
  --text-md:       0.875rem;   /* 14px */
  --text-lg:       1rem;       /* 16px */
  --text-xl:       1.125rem;   /* 18px */
  --text-2xl:      1.375rem;   /* 22px */
  --text-3xl:      1.625rem;   /* 26px */

  /* Pesos */
  --fw-normal:     400;
  --fw-medium:     500;
  --fw-semibold:   600;
  --fw-bold:       700;
  --fw-extrabold:  800;
  --fw-black:      900;

  /* ────────────────────────────────────────────────────────────────
     RAIOS DE BORDA — escala unificada
     (consolida: landing --radius:12px + app --r-lg:14px → 12px)
  ──────────────────────────────────────────────────────────────── */
  --r-xs:          6px;
  --r-sm:          8px;    /* inputs, chips, botões pequenos */
  --r-md:          12px;   /* cards, modais, botões principais */
  --r-lg:          16px;   /* painéis grandes, dialogs */
  --r-xl:          20px;   /* painéis hero */
  --r-full:        9999px; /* pills, badges, avatares */

  /* ────────────────────────────────────────────────────────────────
     SOMBRAS
  ──────────────────────────────────────────────────────────────── */
  --shadow-xs:     0 1px 2px rgba(0,0,0,.04);
  --shadow-sm:     0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:     0 4px 12px rgba(0,0,0,.07), 0 1px 4px rgba(0,0,0,.04);
  --shadow-lg:     0 8px 24px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);
  --shadow-brand:  0 6px 20px rgba(109,40,217,.28);  /* #6D28D9 com alpha */
  --shadow-card:   0 1px 3px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.03);
  --shadow-auth:   0 4px 24px rgba(109,40,217,.12);  /* card de login */

  /* ────────────────────────────────────────────────────────────────
     TRANSIÇÕES
  ──────────────────────────────────────────────────────────────── */
  --t-1:           .1s ease;
  --t-2:           .18s ease;
  --t-3:           .28s cubic-bezier(.4,0,.2,1);

}
