/**
 * tokens.css — Single Source of Truth for Portal VIP Kiara Brandão v2
 * Squad: landing-page-nirvana
 * Spec: Tailwind v4 @theme + CSS Custom Properties
 * Aesthetic: Sequel Dark Minimalist (#0b0b0e) + Slash Metallic Copper (#cc9166) & Champagne (#d9be96)
 * Verified: WCAG 2.2 AA Contrast
 */

@theme {
  --color-bg-base: #0b0b0e;
  --color-bg-deep: #000000;
  --color-surface-card: #161619;
  --color-surface-elevated: #1f1f24;
  --color-surface-glass: rgba(22, 22, 25, 0.75);
  --color-surface-modal: #18181c;

  --color-text-primary: #f4eee6;
  --color-text-secondary: #c4bdb5;
  --color-text-tertiary: #9e9790;

  --color-copper: #cc9166;
  --color-copper-light: #e2b48f;
  --color-copper-dark: #8a5a38;

  --color-champagne: #d9be96;
  --color-champagne-light: #faeccf;
  --color-champagne-dark: #b59669;

  --color-cta-primary-bg: #d9be96;
  --color-cta-primary-text: #171310;
  --color-cta-primary-hover: #faeccf;

  --color-border-subtle: rgba(255, 255, 255, 0.08);
  --color-border-copper: rgba(204, 145, 102, 0.32);
  --color-border-copper-active: rgba(204, 145, 102, 0.70);
  --color-border-copper-glow: rgba(204, 145, 102, 0.50);

  --color-semantic-success: #22c55e;
  --color-semantic-warning: #f59e0b;
  --color-semantic-info: #94a3b8;

  --font-display: 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', sans-serif;

  --radius-pill: 9999px;
  --radius-card: 16px;
  --radius-thumb: 12px;
  --radius-modal: 22px;
}

:root {
  /* Color Primitives & Semantics (Dark Theme - Canonical Sequel) */
  --color-bg-base: #0b0b0e;
  --color-bg-deep: #000000;
  --color-surface-card: #161619;
  --color-surface-elevated: #1f1f24;
  --color-surface-glass: rgba(22, 22, 25, 0.75);
  --color-surface-modal: #18181c;

  --color-text-primary: #f4eee6;
  --color-text-secondary: #c4bdb5;
  --color-text-tertiary: #9e9790;

  --color-copper: #cc9166;
  --color-copper-light: #e2b48f;
  --color-copper-dark: #8a5a38;

  --color-champagne: #d9be96;
  --color-champagne-light: #faeccf;
  --color-champagne-dark: #b59669;

  --color-cta-primary-bg: #d9be96;
  --color-cta-primary-text: #171310;
  --color-cta-primary-hover: #faeccf;

  --color-border-subtle: rgba(255, 255, 255, 0.08);
  --color-border-copper: rgba(204, 145, 102, 0.32);
  --color-border-copper-active: rgba(204, 145, 102, 0.70);
  --color-border-copper-glow: rgba(204, 145, 102, 0.50);

  --color-semantic-success: #22c55e;
  --color-semantic-warning: #f59e0b;
  --color-semantic-info: #94a3b8;

  /* Typography */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', sans-serif;

  --text-hero: 26px;
  --text-h2: 20px;
  --text-h3: 16px;
  --text-price-large: 26px;
  --text-price-medium: 22px;
  --text-cta: 15px;
  --text-body: 14px;
  --text-card: 13px;
  --text-caption: 11px;

  /* Shapes & Geometry */
  --radius-pill: 9999px;
  --radius-card: 16px;
  --radius-thumb: 12px;
  --radius-modal: 22px;

  /* Spacing Scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;

  /* Elevation & Shadows */
  --shadow-card: 0 8px 24px -4px rgba(0, 0, 0, 0.70), 0 2px 6px -1px rgba(0, 0, 0, 0.45);
  --shadow-featured: 0 12px 32px -4px rgba(204, 145, 102, 0.22), 0 4px 12px -2px rgba(0, 0, 0, 0.65);
  --shadow-cta: 0 10px 26px -4px rgba(217, 190, 150, 0.35), 0 4px 10px -2px rgba(204, 145, 102, 0.25);
  --shadow-modal: 0 24px 48px -12px rgba(0, 0, 0, 0.92), 0 0 0 1px rgba(204, 145, 102, 0.30);
  --glow-copper: 0 0 20px -2px rgba(204, 145, 102, 0.35);

  /* Motion & Transitions */
  --duration-fast: 150ms;
  --duration-normal: 250ms;
  --duration-slow: 400ms;
  --ease-standard: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Light Theme Support (WCAG 2.2 AA Verified) */
[data-theme="light"] {
  --color-bg-base: #f8f7f4;
  --color-bg-deep: #eae8e3;
  --color-surface-card: #ffffff;
  --color-surface-elevated: #f0eee9;
  --color-surface-glass: rgba(255, 255, 255, 0.88);
  --color-surface-modal: #ffffff;

  --color-text-primary: #171310;
  --color-text-secondary: #524c46;
  --color-text-tertiary: #7d756d;

  --color-cta-primary-bg: #171310;
  --color-cta-primary-text: #faeccf;
  --color-cta-primary-hover: #2b241e;

  --color-border-subtle: rgba(0, 0, 0, 0.08);
  --color-border-copper: rgba(138, 90, 56, 0.35);
  --color-border-copper-active: rgba(138, 90, 56, 0.70);
  --color-border-copper-glow: rgba(138, 90, 56, 0.40);

  --shadow-card: 0 8px 24px -4px rgba(0, 0, 0, 0.08), 0 2px 6px -1px rgba(0, 0, 0, 0.04);
  --shadow-featured: 0 12px 32px -4px rgba(138, 90, 56, 0.15);
  --shadow-cta: 0 10px 24px -4px rgba(0, 0, 0, 0.20);
  --shadow-modal: 0 24px 48px -12px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(0, 0, 0, 0.08);
}
