/* ==========================================================================
   VARIABLES.CSS - Design Tokens
   ========================================================================== */

:root {
  /* Core Colours */
  --color-primary:      #1A395B;  /* Navy - brand anchor */
  --color-primary-light: #2A5080;  /* Light Navy */
  --color-accent:       #C79639;  /* Gold - action colour */
  --color-accent-light: #E0B860;  /* Light Gold */
  --color-accent-dark:  #9D7326;  /* Deep Gold */
  --color-white:        #FFFFFF;  /* White - base surface */

  /* Derived Colours */
  --color-bg:           #F8FAFC;  /* Ice (derived) */
  --color-bg-alt:       #F1F5F9;  /* Alternative background */
  --color-surface:      #FFFFFF;  /* Card surface */
  --color-surface-alt:  #F9FAFB;  /* Alternative surface */
  --color-text:         #1E293B;  /* Near-black (derived) */
  --color-text-muted:   #64748B;  /* Muted (derived) */
  --color-text-secondary: #475569;
  --color-text-light:   #94A3B8;  /* Light text */
  --color-border:       #E2E8F0;  /* Border (derived) */
  --color-border-light: #F1F5F9;  /* Light border */
  --color-background-light: #F8FAFC;
  
  /* Premium Gradients */
  --gradient-primary:   linear-gradient(135deg, #1A395B 0%, #2A5080 100%);
  --gradient-accent:    linear-gradient(135deg, #C79639 0%, #E0B860 100%);
  --gradient-surface:   linear-gradient(135deg, #FFFFFF 0%, #F9FAFB 100%);
  --gradient-hero:      linear-gradient(135deg, #1A395B 0%, #2A5080 50%, #C79639 100%);
  
  /* Status Colours */
  --color-success:      #10B981;  /* Emerald Green */
  --color-success-light: #D1FAE5;  /* Light Emerald */
  --color-danger:       #EF4444;  /* Red */
  --color-danger-light: #FEE2E2;  /* Light Red */
  --color-warning:      #F59E0B;  /* Amber */
  --color-warning-light: #FEF3C7;  /* Light Amber */
  --color-info:         #3B82F6;  /* Blue */
  --color-info-light:   #DBEAFE;  /* Light Blue */

  /* Typography */
  --font-heading: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display: Georgia, 'Times New Roman', serif;
  --font-body:    'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:    'JetBrains Mono', 'Courier New', Courier, monospace;
  
  /* Font Weights */
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;

  /* Spacing Scale */
  --space-xs:  0.25rem;  /* 4px */
  --space-sm:  0.5rem;   /* 8px */
  --space-md:  1rem;     /* 16px */
  --space-lg:  1.5rem;   /* 24px */
  --space-xl:  2rem;     /* 32px */
  --space-2xl: 3rem;     /* 48px */
  --space-3xl: 4rem;     /* 64px */
  --space-4xl: 6rem;     /* 96px */
  --space-5xl: 8rem;     /* 128px */

  /* Layout */
  --max-width:  1200px;
  --nav-height: 70px;
  --container-padding: 1.5rem;

  /* Premium Shadows */
  --shadow-xs:     0 1px 2px rgba(26, 57, 91, 0.05);
  --shadow-sm:     0 1px 3px rgba(26, 57, 91, 0.1), 0 1px 2px rgba(26, 57, 91, 0.06);
  --shadow-md:     0 4px 6px rgba(26, 57, 91, 0.07), 0 2px 4px rgba(26, 57, 91, 0.06);
  --shadow-lg:     0 10px 15px rgba(26, 57, 91, 0.1), 0 4px 6px rgba(26, 57, 91, 0.05);
  --shadow-xl:     0 20px 25px rgba(26, 57, 91, 0.1), 0 10px 10px rgba(26, 57, 91, 0.04);
  --shadow-2xl:    0 25px 50px rgba(26, 57, 91, 0.15);
  --shadow-accent: 0 4px 20px rgba(199, 150, 57, 0.3);
  --shadow-inner:  inset 0 2px 4px rgba(26, 57, 91, 0.06);

  /* Premium Transitions */
  --transition-fast:     150ms ease;
  --transition-base:     250ms ease;
  --transition-slow:      350ms ease;
  --transition-spring:   500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  
  /* Border Radius */
  --radius-xs:   0.125rem;  /* 2px */
  --radius-sm:   0.25rem;   /* 4px */
  --radius-md:   0.375rem;  /* 6px */
  --radius-lg:   0.5rem;    /* 8px */
  --radius-xl:   0.75rem;   /* 12px */
  --radius-2xl:  1rem;      /* 16px */
  --radius-full: 9999px;
}

[data-theme="dark"] {
  --color-primary: #DCE7F7;
  --color-primary-light: #8CB4E6;
  --color-accent: #D8A84A;
  --color-accent-light: #F2C979;
  --color-accent-dark: #A57824;
  --color-white: #FFFFFF;

  --color-bg: #08111f;
  --color-bg-alt: #101b2f;
  --color-surface: #0f172a;
  --color-surface-alt: #162238;
  --color-text: #E2E8F0;
  --color-text-muted: #94A3B8;
  --color-text-secondary: #CBD5E1;
  --color-text-light: #64748B;
  --color-border: #22324c;
  --color-border-light: #172338;
  --color-background-light: #111B2D;

  --gradient-primary: linear-gradient(135deg, #0f172a 0%, #1e3a5f 100%);
  --gradient-accent: linear-gradient(135deg, #C79639 0%, #E6BC66 100%);
  --gradient-surface: linear-gradient(135deg, #0f172a 0%, #162238 100%);
  --gradient-hero: linear-gradient(135deg, #08111f 0%, #132746 58%, #9D7326 100%);

  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.38), 0 1px 2px rgba(0, 0, 0, 0.24);
  --shadow-md: 0 8px 18px rgba(0, 0, 0, 0.28);
  --shadow-lg: 0 14px 28px rgba(0, 0, 0, 0.3);
  --shadow-xl: 0 18px 36px rgba(0, 0, 0, 0.34);
  --shadow-2xl: 0 26px 56px rgba(0, 0, 0, 0.4);
  --shadow-accent: 0 6px 22px rgba(216, 168, 74, 0.22);
}