/* ═══════════════════════════════════════════════════════════════
 *  arke-tokens.css — FONTE ÚNICA DA VERDADE (arkeCORE)
 *  ---------------------------------------------------------------
 *  Editar tokens de marca SÓ aqui. Consumido por:
 *    • app/globals.css  (via @import — produto arkeCORE)
 *    • páginas /site     (via <link> — produto site)
 *  Default = arkeCORE. Temas por produto ficam em arke-themes.css.
 * ═══════════════════════════════════════════════════════════════ */

:root {
  /* ─── Tema escuro (default) ─────────────────────────────── */
  --bg:            #000000;
  --surface:       #141414;
  --surface2:      #1E1E1E;
  --surface-hi:    #2A2A2A;
  --border:        #2A2A2A;
  --border-strong: #3A3A3A;
  --text:          #F5F2ED;
  --text-muted:    #9A9590;
  --text-subtle:   #6B6560;
  --sidebar-bg:    #141414;
  --nav-bg:        rgba(20, 20, 20, 0.78);
  --shadow:        0 4px 18px rgba(0, 0, 0, 0.55);

  /* ─── Accent — Ouro filosófico (arkeCORE) ───────────────── */
  --accent:        #C4973A;
  --accent-hover:  #D4A94A;
  --accent-active: #B08832;
  --accent-muted:  #8B7355;
  --accent-soft:   rgba(196, 151, 58, 0.16);
  --accent-softer: rgba(196, 151, 58, 0.08);
  --accent-ring:   rgba(196, 151, 58, 0.32);
  --accent-text:   #D4A94A;
  --accent-rgb:    196, 151, 58;   /* p/ radial tingido do fundo */

  /* ─── Semânticos (valores do modo ESCURO — este :root é escuro) ──
   * 🔴 UM NOME POR CONCEITO (CET, 16/08: *"unifique"*). Antes existiam DOIS
   * vocabulários pra mesma ideia — `--danger` aqui e `--color-error` mais
   * abaixo — com valores DIFERENTES (#8B3A3A × #B84A3A). Quem escrevia
   * `var(--danger)` e quem escrevia `var(--color-error)` pintava vermelhos
   * distintos na mesma tela, e nenhum dos dois estava errado.
   *
   * Canônico = o nome CURTO. É o que o código usa (~850 chamadas contra 222) e
   * é dele que o Tailwind deriva as classes em `globals.css`. `--color-*`
   * continua funcionando, mas como APELIDO — nunca mais como valor.
   *
   * Os valores vêm da medição de 10/08 (o mesmo par claro/escuro que o tema
   * base guarda): ocre sobre creme dava 2.30 de contraste, contra 4.5 do AA.
   *
   * O `-soft` é VÉU e agora DERIVA da própria cor. Antes era um segundo número
   * escrito à mão — trocar o tom e esquecer o véu era questão de tempo. */
  --success:      #508660;  --success-soft: color-mix(in srgb, var(--success) 16%, transparent);
  --warning:      #D79A2B;  --warning-soft: color-mix(in srgb, var(--warning) 16%, transparent);
  --danger:       #CD5341;  --danger-soft:  color-mix(in srgb, var(--danger)  18%, transparent);
  --info:         #42839C;  --info-soft:    color-mix(in srgb, var(--info)    16%, transparent);

  /* ─── Fontes ────────────────────────────────────────────── */
  --font-display: var(--font-playfair), 'Playfair Display', 'Georgia', serif;
  --font-body:    'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen, Ubuntu, Cantarell, sans-serif;
  --font-mono:    var(--font-jetbrains), 'Consolas', monospace;

  /* ─── Controles de atmosfera (editáveis no Design System) ── */
  /* Fundo: composição de até 3 camadas (sólido + radial + linear) */
  --bg-radial-intensity: 0.22;     /* 0 = sem brilho radial · 1 = brilho intenso */
  --bg-radial-pos:       55% 75% at 4% 50%;
  --bg-radial-spread:    72%;      /* até onde o brilho radial alcança */
  --bg-linear-intensity: 0;        /* 0 = sem ornamento linear · 1 = forte */
  --bg-linear-angle:     135deg;

  /* Bordas e cantos */
  --radius-multiplier:   1;        /* 0.5 = quase quadrado · 1 = padrão · 1.5 = arredondado */
  --shadow-intensity:    1;        /* 0 = sem sombra · 1 = padrão · 2 = forte */
}

/* ─── Tema claro (arkeCORE warm cream) ────────────────────── */
/* Suporta DUAS sintaxes: .light-mode (legado) e :root[data-theme="light"] (v2). */
.light-mode,
:root[data-theme="light"] {
  --bg:            #F5F2ED;
  --surface:       #FFFFFF;
  --surface2:      #FAFAF8;
  --surface-hi:    #F1EEE8;
  --border:        #E5E0D8;
  --border-strong: #D0C8BE;
  --text:          #1A1A1A;
  --text-muted:    #6B6560;
  --text-subtle:   #9A9590;
  --sidebar-bg:    #FFFFFF;
  --nav-bg:        rgba(255, 252, 247, 0.85);
  --shadow:        0 2px 12px rgba(26, 26, 26, 0.06);

  /* ─── DS v2: tokens semânticos pro tema claro ─────────── */
  --fg-1:          #26332E;
  --fg-2:          #6E7470;
  --fg-3:          #9aa09c;
  --fg-on-dark:    #FAF7EF;
  --fg-on-brand:   #FFFFFF;
  --fg-link:       #aa2d00;
  --bg-page:       #F5F2ED;
  --bg-page-warm:  #F4E8D0;
  --bg-surface:    #FFFFFF;
  --bg-soft:       #F2EEE3;
  --bg-brand:      #C4973A;
  --bg-dark:       #26332E;
  --border-soft:   #E8E1D0;
  --border-hair:   rgba(38, 51, 46, 0.10);

  /* Semânticos do modo CLARO — faltavam, e a falta era um bug de leitura:
     o claro herdava os tons do escuro e `--warning` ficava em 2.30 sobre o
     creme. Os `-soft` não repetem aqui porque derivam destes valores. */
  --success:       #4A7C59;
  --warning:       #946A1E;
  --danger:        #B84A3A;
  --info:          #3C7990;
}

/* ─── Tema escuro (data-theme explícito — v2) ─────────────── */
:root[data-theme="dark"] {
  --bg:            #000000;
  --surface:       #141414;
  --surface2:      #1E1E1E;
  --surface-hi:    #2A2A2A;
  --border:        #2A2A2A;
  --border-strong: #3A3A3A;
  --text:          #F5F2ED;
  --text-muted:    #9A9590;
  --text-subtle:   #6B6560;

  --fg-1:          #F0EDE3;
  --fg-2:          #A5A39A;
  --fg-3:          #6F6C63;
  --fg-on-dark:    #F0EDE3;
  --fg-on-brand:   #1A1A1A;
  --fg-link:       #FF7A50;
  --bg-page:       #0F1310;
  --bg-page-warm:  #1A1814;
  --bg-surface:    #181C18;
  --bg-soft:       #22271F;
  --bg-brand:      #C4973A;
  --bg-dark:       #0A0C0A;
  --border-soft:   #2A2F26;
  --border-hair:   rgba(240, 237, 227, 0.08);

  /* Repetem o :root de propósito: se alguém combinar `.light-mode` com
     `data-theme="dark"`, o explícito precisa vencer o herdado. */
  --success:       #508660;
  --warning:       #D79A2B;
  --danger:        #CD5341;
  --info:          #42839C;
}

/* ─── DS v2: tokens "neutros" (não mudam com tema) ────────── */
:root {
  /* Cores brand fixas */
  --brand-primary:     #C4973A;
  --brand-primary-rgb: 196 151 58;
  --brand-secondary:   #aa2d00;
  --brand-secondary-rgb: 170 45 0;
  --brand-tertiary:    #4A7C59;

  /* ⚠️ As "functional colors" (`--color-success/warning/error/info`) MORARAM
     aqui até 16/08, com valor próprio e sem par claro/escuro. Saíram: viraram
     apelido de `--success/--warning/--danger/--info`, declarado uma vez só em
     `app/globals.css`. Não redeclare aqui — dois valores voltam a divergir. */

  /* Tipografia */
  --font-sans:       'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-editorial:  'Fraunces', 'Playfair Display', Georgia, serif;
  /* font-mono já vem do arke-themes.css, font-display + font-body também */

  --text-display:  3.5rem;
  --text-h1:       2.5rem;
  --text-h2:       1.875rem;
  --text-h3:       1.375rem;
  --text-h4:       1.125rem;
  --text-body:     1.0625rem;
  --text-small:    0.875rem;
  --text-tiny:     0.75rem;

  /* Spacing 4px base */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* Radii (não conflita com radius-card/radius-panel já existentes) */
  --radius-md:    12px;
  --radius-lg:    16px;
  --radius-xl:    20px;

  /* Shadows tintadas */
  --shadow-sm:    0 1px 2px rgba(38, 51, 46, 0.06);
  --shadow-md:    0 12px 32px rgba(38, 51, 46, 0.10);
  --shadow-lg:    0 20px 48px rgba(38, 51, 46, 0.14);
  --shadow-xl:    0 28px 64px rgba(38, 51, 46, 0.18);

  /* Iconset stroke-width (thin=1.25 / medium=1.5 / bold=2.25) */
  --icon-stroke-width: 1.5;
}
