/**
 * Thrust Wealth — Design System Tokens v2
 * Institutional FinTech & Wealth Management — Premium Edition
 * Zero external dependencies. Full dark/light system.
 */

:root {
  /* ─── Brand Core ─────────────────────────────────────────────── */
  --brand-primary:        #19A492;
  --brand-primary-hover:  #148374;
  --brand-light:          #2DD4BF;
  --brand-dark:           #0D7A6A;
  --brand-gold:           #C9A227;
  --brand-gold-light:     #E8C040;
  --brand-gold-muted:     rgba(201, 162, 39, 0.18);
  --brand-navy:           #0C152C;
  --brand-navy-mid:       #111D3E;

  /* ─── Brand Gradients ────────────────────────────────────────── */
  --grad-brand:           linear-gradient(135deg, #2DD4BF 0%, #19A492 50%, #0D7A6A 100%);
  --grad-gold:            linear-gradient(135deg, #F1C40F 0%, #C9A227 50%, #9A7A10 100%);
  --grad-hero-mesh:       radial-gradient(ellipse 85% 65% at 55% 35%, rgba(25, 164, 146, 0.22) 0%, transparent 68%),
                          radial-gradient(ellipse 60% 85% at 10% 80%, rgba(241, 196, 15, 0.12) 0%, transparent 58%),
                          radial-gradient(ellipse 70% 50% at 90% 20%, rgba(45, 212, 191, 0.16) 0%, transparent 52%);
  --grad-dark-mesh:       radial-gradient(ellipse at 50% 0%, rgba(25, 164, 146, 0.22) 0%, rgba(12, 21, 44, 0) 65%);
  --grad-premium:         linear-gradient(160deg, rgba(22, 36, 76, 0.95) 0%, rgba(12, 21, 44, 0.98) 100%);
  --grad-glass-shine:     linear-gradient(135deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.02) 50%, rgba(255,255,255,0.06) 100%);
  --grad-card-hover:      linear-gradient(135deg, rgba(45, 212, 191, 0.10) 0%, rgba(25, 164, 146, 0.05) 100%);

  /* ─── Glow Effects ───────────────────────────────────────────── */
  --glow-brand-sm:        0 0 16px rgba(45, 212, 191, 0.25);
  --glow-brand-md:        0 0 32px rgba(25, 164, 146, 0.30);
  --glow-brand-lg:        0 0 64px rgba(25, 164, 146, 0.20);
  --glow-gold-sm:         0 0 16px rgba(201, 162, 39, 0.30);

  /* ─── Layout & Container ─────────────────────────────────────── */
  --container-max:        1280px;
  --container-narrow:     900px;
  --header-height:        80px;

  /* ─── Spacing System (8px base) ─────────────────────────────── */
  --space-3xs: 2px;
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 128px;
  --space-6xl: 160px;

  /* ─── Corner Radii ───────────────────────────────────────────── */
  --radius-xs:   3px;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --radius-2xl:  28px;
  --radius-3xl:  40px;
  --radius-pill: 9999px;

  /* ─── Touch Targets ──────────────────────────────────────────── */
  --min-touch-target: 44px;

  /* ─── Animation Timings ──────────────────────────────────────── */
  --ease-spring:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-smooth:    cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-bounce:    cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-quart:  cubic-bezier(0.5, 0, 0.75, 0);

  --transition-fast:   150ms var(--ease-smooth);
  --transition-normal: 240ms var(--ease-smooth);
  --transition-slow:   380ms var(--ease-spring);
  --transition-reveal: 600ms var(--ease-out-expo);

  /* ─── Font Size Scale ────────────────────────────────────────── */
  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  2rem;
  --text-4xl:  2.5rem;
  --text-5xl:  3.25rem;
  --text-6xl:  4rem;
  --text-7xl:  5.5rem;
}

/* ─── Institutional Financial Dark Palette (Exclusive) ──────── */
:root,
[data-theme="dark"] {
  --bg-app:              #040711;
  --bg-surface:          rgba(15, 23, 44, 0.60);
  --bg-surface-alt:      rgba(20, 31, 58, 0.65);
  --bg-surface-elevated: rgba(26, 40, 75, 0.75);
  --bg-surface-hover:    rgba(34, 52, 96, 0.85);
  --bg-glass:            rgba(8, 13, 26, 0.75);
  --bg-glass-strong:     rgba(8, 13, 26, 0.92);
  --bg-glass-card:       rgba(14, 22, 42, 0.60);
  --bg-input:            rgba(10, 16, 32, 0.85);
  --bg-input-focus:      rgba(15, 24, 48, 0.95);

  --text-primary:        #F8FAFC;
  --text-secondary:      #94A3B8;
  --text-tertiary:       #64748B;
  --text-muted:          #475569;
  --text-inverse:        #040711;
  --text-brand:          #2DD4BF;
  --text-gold:           #F1C40F;

  --border-subtle:       rgba(255, 255, 255, 0.07);
  --border-medium:       rgba(255, 255, 255, 0.12);
  --border-strong:       rgba(255, 255, 255, 0.20);
  --border-brand:        rgba(45, 212, 191, 0.35);
  --border-brand-glow:   rgba(45, 212, 191, 0.60);
  --border-gold:         rgba(241, 196, 15, 0.45);
  --border-glass:        rgba(255, 255, 255, 0.08);

  --shadow-sm:           0 2px 4px rgba(0, 0, 0, 0.30);
  --shadow-md:           0 6px 18px rgba(0, 0, 0, 0.38);
  --shadow-lg:           0 14px 40px rgba(0, 0, 0, 0.45);
  --shadow-xl:           0 26px 70px rgba(0, 0, 0, 0.55);
  --shadow-2xl:          0 38px 100px rgba(0, 0, 0, 0.65);
  --shadow-brand:        0 8px 32px rgba(45, 212, 191, 0.22);
  --shadow-card:         0 1px 0px rgba(255, 255, 255, 0.06) inset, 0 16px 48px rgba(0, 0, 0, 0.40);

  --card-bg-gradient:    linear-gradient(145deg, rgba(18, 28, 54, 0.70) 0%, rgba(9, 14, 28, 0.82) 100%);
  --card-border-gradient: linear-gradient(135deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.03) 50%, rgba(45, 212, 191, 0.18) 100%);
}
