/* ============================================
   DARK MODE / LIGHT MODE
   ============================================ */

/* Dark Mode (Default) */
:root {
  --bg-primary: #0a0a0a;
  --bg-secondary: #161616;
  --bg-tertiary: #1f1f1f;
  
  --text-primary: #f5f5f5;
  --text-secondary: #a3a3a3;
  --text-tertiary: #737373;
  
  --accent-primary: #3b82f6;
  --accent-hover: #2563eb;
  --accent-secondary: #8b5cf6;
  
  --border-color: #262626;
  --border-hover: #404040;
  
  --success: #22c55e;
  --error: #ef4444;
  --warning: #f59e0b;
  --info: #3b82f6;
  
  /* Gradient Accents */
  --gradient-primary: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
  --gradient-secondary: linear-gradient(135deg, #22c55e 0%, #3b82f6 100%);
  --gradient-glow: radial-gradient(circle at 50% 0%, rgba(59, 130, 246, 0.15), transparent 50%);
}

/* Light Mode */
body.light-mode {
  --bg-primary: #ffffff;
  --bg-secondary: #f5f5f5;
  --bg-tertiary: #e5e5e5;
  
  --text-primary: #171717;
  --text-secondary: #525252;
  --text-tertiary: #737373;
  
  --accent-primary: #2563eb;
  --accent-hover: #1d4ed8;
  --accent-secondary: #7c3aed;
  
  --border-color: #e5e5e5;
  --border-hover: #d4d4d4;
  
  --success: #16a34a;
  --error: #dc2626;
  --warning: #d97706;
  --info: #2563eb;
  
  /* Gradient Accents */
  --gradient-primary: linear-gradient(135deg, #2563eb 0%, #7c3aed 100%);
  --gradient-secondary: linear-gradient(135deg, #16a34a 0%, #2563eb 100%);
  --gradient-glow: radial-gradient(circle at 50% 0%, rgba(37, 99, 235, 0.1), transparent 50%);
}

/* Smooth Transitions for Theme Switch */
body {
  transition: background-color 0.3s ease, color 0.3s ease;
}

* {
  transition: border-color 0.3s ease, background-color 0.3s ease;
}