/* ==========================================================================
   DS v3 — Tokens de Cor OKLCH
   Issue: #205 · Parent: #188 (FASE-0)
   ==========================================================================

   Espaço de cor OKLCH-first para uniformidade perceptual:
   - Aumentar L de 60→80 sempre parece "50% mais claro" independente do hue
   - Interpolação de gradientes sem tons indesejados no meio
   - Acesso nativo ao gamut P3
   - Tints de vidro consistentes entre todos os componentes

   Nenhuma tela existente v2 é afetada por este arquivo.
   O DS v2 continua funcionando normalmente.
   ========================================================================== */

@layer ds-tokens {

  :root {

    /* ─────────────────────────────────────────────────────────────────────
       ESCALA CROMÁTICA — Cyan Aether (primário)
       Hue 210 · Equivalente OKLCH de #00D4FF (L≈62%, C≈0.22)
       ───────────────────────────────────────────────────────────────────── */

    --ds-cyan-50:  oklch(97% 0.04 210);   /* quase branco com tint cyan */
    --ds-cyan-100: oklch(93% 0.08 210);
    --ds-cyan-200: oklch(86% 0.12 210);
    --ds-cyan-300: oklch(78% 0.16 210);
    --ds-cyan-400: oklch(70% 0.19 210);   /* hover state */
    --ds-cyan-500: oklch(62% 0.22 210);   /* canonical primary — #00D4FF aprox. */
    --ds-cyan-600: oklch(54% 0.20 210);
    --ds-cyan-700: oklch(44% 0.17 210);
    --ds-cyan-800: oklch(33% 0.13 210);
    --ds-cyan-900: oklch(22% 0.08 210);   /* quase preto com tint cyan */

    /* ─────────────────────────────────────────────────────────────────────
       ESCALA CROMÁTICA — Slate (superfícies escuras)
       Hue 260 · Base para dark glass, sidebars, backgrounds escuros
       ───────────────────────────────────────────────────────────────────── */

    --ds-slate-50:  oklch(98% 0.005 260); /* quase branco */
    --ds-slate-100: oklch(95% 0.008 260);
    --ds-slate-200: oklch(90% 0.010 260);
    --ds-slate-300: oklch(82% 0.013 260);
    --ds-slate-400: oklch(70% 0.016 260);
    --ds-slate-500: oklch(57% 0.018 260); /* meio-tom */
    --ds-slate-600: oklch(44% 0.018 260);
    --ds-slate-700: oklch(33% 0.015 260);
    --ds-slate-800: oklch(22% 0.012 260);
    --ds-slate-900: oklch(13% 0.008 260);
    --ds-slate-950: oklch(8%  0.005 260); /* quase preto — dark glass base */

    /* ─────────────────────────────────────────────────────────────────────
       ALIASES SEMÂNTICOS
       Mapeiam nomes DS v2 para os novos tokens OKLCH.
       Compatibilidade total: código v2 continua funcionando.
       ───────────────────────────────────────────────────────────────────── */

    /* Primário */
    --ds-primary:         var(--ds-cyan-500);
    --ds-primary-hover:   var(--ds-cyan-400);
    --ds-primary-active:  var(--ds-cyan-600);
    --ds-primary-subtle:  var(--ds-cyan-100);
    --ds-primary-muted:   var(--ds-cyan-200);

    /* Neutros */
    --ds-neutral-50:  var(--ds-slate-50);
    --ds-neutral-100: var(--ds-slate-100);
    --ds-neutral-200: var(--ds-slate-200);
    --ds-neutral-300: var(--ds-slate-300);
    --ds-neutral-400: var(--ds-slate-400);
    --ds-neutral-500: var(--ds-slate-500);
    --ds-neutral-600: var(--ds-slate-600);
    --ds-neutral-700: var(--ds-slate-700);
    --ds-neutral-800: var(--ds-slate-800);
    --ds-neutral-900: var(--ds-slate-900);
    --ds-neutral-950: var(--ds-slate-950);   /* dark glass base — gap fechado */

    /* Superfícies de página — necessário para depth.css (--ds-depth-0-bg) */
    --ds-bg-primary:         var(--ds-slate-50);    /* fundo light theme */
    --ds-bg-primary-dark:    var(--ds-slate-950);   /* fundo dark theme */
    --ds-surface-base:       var(--ds-slate-100);   /* superfície mais elevada que bg */
    --ds-surface:            var(--ds-slate-100);   /* alias compat DS v2/v3 */
    --ds-surface-default:    var(--ds-surface);     /* evita fallback claro em variant=module */
    --ds-surface-elevated:   var(--ds-slate-50);    /* para ds-card solid variant */
    --ds-surface-sunken:     var(--ds-slate-200);
    --ds-surface-hover:      var(--ds-slate-100);

    /* ─────────────────────────────────────────────────────────────────────
       BRIDGE HEX v2
       Preserva tokens HEX para componentes v2 ainda não migrados.
       Remover progressivamente à medida que cada componente for migrado.
       ───────────────────────────────────────────────────────────────────── */

    --ds-primary-hex:       #00D4FF;   /* cyan-500 em HEX */
    --ds-primary-hover-hex: #00BFFF;   /* cyan-400 — oklch(70% 0.19 210) em sRGB */
    --ds-slate-950-hex:     #0A0B0F;   /* slate-950 em HEX */

  }

  /* Dark theme compatibility aliases for pages that import DS v3 color tokens */
  [data-theme="dark"],
  :root[data-theme-effective="dark"] {
    --ds-bg-primary:       var(--ds-slate-950);
    --ds-surface-base:     var(--ds-slate-900);
    --ds-surface:          color-mix(in srgb, var(--ds-slate-900) 82%, var(--ds-slate-800));
    --ds-surface-default:  var(--ds-surface);
    --ds-surface-elevated: color-mix(in srgb, var(--ds-slate-800) 88%, var(--ds-slate-700));
    --ds-surface-sunken:   color-mix(in srgb, var(--ds-slate-950) 80%, var(--ds-slate-900));
    --ds-surface-hover:    color-mix(in srgb, var(--ds-slate-700) 80%, var(--ds-slate-600));
  }

}