/* ════════════════════════════════════════════════════════════════════
 * KYVEN · ONBOARDING-V2 · DUAL THEME TOKENS
 *
 * Sistema dual activado por el flag EXISTENTE `data-geneva-mode="on"`
 * (lo pone bootstrapGenevaCream desde ?geneva=on / localStorage):
 *   - kyven.health/            → tema INTERMEDIO dark (#050E0B)  [:root default]
 *   - kyven.health/?geneva=on  → tema GENEVA CREAM (#EBE7DD)     [:root[data-geneva-mode="on"]]
 *
 * Prefijo `--obv2-*` · NO colisiona con --kvn-* ni --forest-* existentes.
 * Solo consumido por clases `.obv2-*` (onboarding V2).
 * ════════════════════════════════════════════════════════════════════ */

/* === DEFAULT · TEMA INTERMEDIO (kyven.health/) === */
:root {
  --obv2-bg: #050E0B;
  --obv2-bg-soft: #0A1612;
  --obv2-card: rgba(245, 241, 232, 0.04);
  --obv2-card-strong: rgba(245, 241, 232, 0.06);
  --obv2-patek: #1A2823;
  --obv2-patek-deep: #0F1B17;
  --obv2-text: #F5F1E8;
  --obv2-text-sec: rgba(245, 241, 232, 0.72);
  --obv2-text-tri: rgba(245, 241, 232, 0.45);
  --obv2-gold: #C8A45A;
  --obv2-gold-mate: #A88857;
  --obv2-gold-dim: #8A6E45;
  --obv2-sage: #5E8472;
  --obv2-sage-deep: #3F5249;
  --obv2-border: rgba(201, 169, 97, 0.34);
  --obv2-border-soft: rgba(201, 169, 97, 0.18);
  --obv2-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.18);
  --obv2-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.28);
  --obv2-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.36);
}

/* === TEMA GENEVA CREAM (kyven.health/?geneva=on) === */
:root[data-geneva-mode="on"] {
  --obv2-bg: #EBE7DD;
  --obv2-bg-soft: #F0EDE3;
  --obv2-card: #F5F1E8;
  --obv2-card-strong: #FFFCF5;
  --obv2-patek: #3F5249;
  --obv2-patek-deep: #2D4337;
  --obv2-text: #2A3B33;
  --obv2-text-sec: #6B7A72;
  --obv2-text-tri: #94A199;
  --obv2-gold: #C8A45A;
  --obv2-gold-mate: #A88857;
  --obv2-gold-dim: #8A6E45;
  --obv2-sage: #A8C9B6;
  --obv2-sage-deep: #5E8472;
  --obv2-border: rgba(168, 136, 87, 0.28);
  --obv2-border-soft: rgba(168, 136, 87, 0.14);
  --obv2-shadow-sm: 0 1px 2px rgba(42, 59, 51, 0.04);
  --obv2-shadow-md: 0 4px 12px rgba(42, 59, 51, 0.06);
  --obv2-shadow-lg: 0 8px 24px rgba(42, 59, 51, 0.08);
}

/* === DESIGN SYSTEM TOKENS (idénticos en ambos temas) === */
:root {
  /* Spacing · 8px grid */
  --obv2-space-1: 4px;
  --obv2-space-2: 8px;
  --obv2-space-3: 12px;
  --obv2-space-4: 16px;
  --obv2-space-5: 20px;
  --obv2-space-6: 24px;
  --obv2-space-8: 32px;
  --obv2-space-10: 40px;
  --obv2-space-12: 48px;

  /* Border radius (5 únicos) */
  --obv2-radius-sm: 4px;
  --obv2-radius-md: 8px;
  --obv2-radius-lg: 12px;
  --obv2-radius-xl: 16px;
  --obv2-radius-pill: 9999px;

  /* Z-index (4 layers) */
  --obv2-z-base: 0;
  --obv2-z-sticky: 100;
  --obv2-z-modal: 200;
  --obv2-z-toast: 900;

  /* Typography scale */
  --obv2-text-xs: 9px;
  --obv2-text-sm: 10px;
  --obv2-text-base: 13px;
  --obv2-text-md: 14.5px;
  --obv2-text-lg: 16px;
  --obv2-text-xl: 19px;
  --obv2-text-2xl: 22px;
  --obv2-text-3xl: 28px;
  --obv2-text-4xl: 38px;
  --obv2-text-hero: 42px;

  /* Font families */
  --obv2-font-display: 'Playfair Display', Georgia, serif;
  --obv2-font-body: 'Inter', -apple-system, sans-serif;
  --obv2-font-mono: 'JetBrains Mono', monospace;

  /* Transitions */
  --obv2-ease-out: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --obv2-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --obv2-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
}
