/* ============================================
   SeninSınavın — CSS Design Tokens & Theme Variables
   ============================================ */

:root {
  /* ── Typography ── */
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-heading: 'Outfit', 'Inter', sans-serif;

  /* ── Spacing Scale ── */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;

  /* ── Border Radius ── */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 14px rgba(0,0,0,0.1);
  --shadow-lg: 0 10px 40px rgba(0,0,0,0.12);
  --shadow-xl: 0 20px 60px rgba(0,0,0,0.15);
  --shadow-glow-primary: 0 0 30px rgba(108,92,231,0.3);
  --shadow-glow-secondary: 0 0 30px rgba(0,184,148,0.3);

  /* ── Transitions ── */
  --transition-fast: 0.2s ease;
  --transition-base: 0.35s ease;
  --transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-theme: 0.5s ease;

  /* ── Brand Colors (constant) ── */
  --color-primary: #6C5CE7;
  --color-primary-light: #A29BFE;
  --color-primary-dark: #5A4BD1;
  --color-secondary: #00B894;
  --color-secondary-light: #55EFC4;
  --color-secondary-dark: #00A381;
  --color-accent: #FDCB6E;
  --color-accent-dark: #F0B63A;
  --color-danger: #FF6B6B;
  --color-danger-dark: #EE5A5A;
  --color-info: #74B9FF;
  --color-warning: #FFEAA7;

  /* ── Gradients ── */
  --gradient-primary: linear-gradient(135deg, #6C5CE7 0%, #A29BFE 100%);
  --gradient-secondary: linear-gradient(135deg, #00B894 0%, #55EFC4 100%);
  --gradient-accent: linear-gradient(135deg, #FDCB6E 0%, #F0B63A 100%);
  --gradient-hero: linear-gradient(135deg, #6C5CE7 0%, #00B894 50%, #A29BFE 100%);
  --gradient-dark: linear-gradient(135deg, #0D1117 0%, #161B22 50%, #1C2333 100%);
  --gradient-cta: linear-gradient(135deg, #6C5CE7 0%, #00B894 100%);

  /* ── Z-Index Scale ── */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-modal-backdrop: 300;
  --z-modal: 400;
  --z-tooltip: 500;
  --z-toast: 600;

  /* ── Container ── */
  --container-max: 1200px;
  --container-padding: 1.5rem;

  /* ── Navbar ── */
  --navbar-height: 72px;
}

/* ============================================
   LIGHT THEME (Default)
   ============================================ */
[data-theme="light"] {
  --bg-primary: #F8F9FA;
  --bg-secondary: #FFFFFF;
  --bg-tertiary: #F1F3F5;
  --bg-card: #FFFFFF;
  --bg-card-hover: #F8F9FA;
  --bg-navbar: rgba(255, 255, 255, 0.85);
  --bg-footer: #1A1D23;
  --bg-input: #F1F3F5;
  --bg-input-focus: #FFFFFF;
  --bg-code: #F1F3F5;

  --text-primary: #1A1D23;
  --text-secondary: #4A5568;
  --text-tertiary: #718096;
  --text-muted: #A0AEC0;
  --text-inverse: #FFFFFF;
  --text-link: #6C5CE7;
  --text-link-hover: #5A4BD1;

  --border-color: rgba(0, 0, 0, 0.08);
  --border-color-strong: rgba(0, 0, 0, 0.15);
  --border-input: #E2E8F0;
  --border-input-focus: #6C5CE7;

  --glass-bg: rgba(255, 255, 255, 0.7);
  --glass-border: rgba(255, 255, 255, 0.3);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);

  --overlay: rgba(0, 0, 0, 0.5);
  --scrollbar-track: #F1F3F5;
  --scrollbar-thumb: #CBD5E0;
  --selection-bg: rgba(108, 92, 231, 0.2);
  --selection-text: #1A1D23;

  --hero-bg: linear-gradient(135deg, #F8F9FA 0%, #EDF2F7 100%);
  --stats-bg: linear-gradient(135deg, #6C5CE7 0%, #5A4BD1 100%);
  --cta-bg: linear-gradient(135deg, #6C5CE7 0%, #00B894 100%);
}

/* ============================================
   DARK THEME
   ============================================ */
[data-theme="dark"] {
  --bg-primary: #0D1117;
  --bg-secondary: #161B22;
  --bg-tertiary: #1C2333;
  --bg-card: #161B22;
  --bg-card-hover: #1C2333;
  --bg-navbar: rgba(13, 17, 23, 0.88);
  --bg-footer: #0A0D12;
  --bg-input: #1C2333;
  --bg-input-focus: #232B3B;
  --bg-code: #1C2333;

  --text-primary: #E6EDF3;
  --text-secondary: #A8B9CF;
  --text-tertiary: #7B8FA8;
  --text-muted: #4A5A6E;
  --text-inverse: #0D1117;
  --text-link: #A29BFE;
  --text-link-hover: #C4BFFF;

  --border-color: rgba(255, 255, 255, 0.06);
  --border-color-strong: rgba(255, 255, 255, 0.12);
  --border-input: #2A3444;
  --border-input-focus: #6C5CE7;

  --glass-bg: rgba(22, 27, 34, 0.7);
  --glass-border: rgba(255, 255, 255, 0.06);
  --glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);

  --overlay: rgba(0, 0, 0, 0.7);
  --scrollbar-track: #161B22;
  --scrollbar-thumb: #2A3444;
  --selection-bg: rgba(108, 92, 231, 0.35);
  --selection-text: #E6EDF3;

  --hero-bg: linear-gradient(135deg, #0D1117 0%, #161B22 100%);
  --stats-bg: linear-gradient(135deg, #1C2333 0%, #161B22 100%);
  --cta-bg: linear-gradient(135deg, #6C5CE7 0%, #00B894 100%);
}
