/* ========================================
   Crystal Lux — Premium Dark Design System
   ======================================== */

:root {
  /* Background colors — crystal-lux purple-dark */
  --bg-primary: #071742;
  --bg-secondary: #0d1f52;
  --bg-elevated: #152a63;
  --bg-input: rgba(255, 255, 255, 0.06);

  /* Gradient backgrounds */
  --bg-gradient-dark: linear-gradient(180deg, #15153b 0%, #110624 100%);

  /* Accent colors — crystal-lux gold */
  --accent-gold: #B58D3D;
  --accent-gold-hover: #C6AE72;
  --accent-gold-light: #FBE6B1;
  --accent-gold-subtle: rgba(181, 141, 61, 0.12);
  --accent-gold-gradient: linear-gradient(140.51deg, #B58D3D 11.1%, #C6AE72 50.03%, #FBE6B1 93.46%);

  /* Text colors */
  --text-primary: #FEFDFB;
  --text-secondary: rgba(255, 255, 255, 0.7);
  --text-muted: rgba(255, 255, 255, 0.45);

  /* Semantic colors */
  --border: rgba(255, 255, 255, 0.1);
  --border-light: rgba(255, 255, 255, 0.18);
  --destructive: #EF4444;
  --destructive-hover: #DC2626;
  --success: #22C55E;
  --info: #3B82F6;
  --warning: #F59E0B;

  /* Light surface (for auth forms) */
  --surface-light: #FEFDFB;
  --text-on-light: #071742;
  --text-on-light-secondary: #4B5563;

  /* Layout */
  --sidebar-width: 280px;
  --sidebar-collapsed: 76px;
  --header-height: 64px;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -4px rgba(0, 0, 0, 0.4);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.6), 0 8px 10px -6px rgba(0, 0, 0, 0.5);

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-3xl: 40px;
  --radius-full: 9999px;

  /* Transitions */
  --transition-fast: 150ms ease-out;
  --transition-base: 200ms ease-out;
  --transition-slow: 300ms ease-out;

  /* Glassmorphism */
  --glass-bg: rgba(255, 255, 255, 0.05);
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-blur: 12px;

  /* Shadows — accent glow */
  --shadow-gold: 0 4px 14px rgba(181, 141, 61, 0.25);
  --shadow-gold-strong: 0 6px 20px rgba(181, 141, 61, 0.35);
}