:root {
  /* Dark theme color palette */
  --color-primary: #4f46e5;
  --color-secondary: #7c3aed;
  --color-accent: #8b5cf6;
  --color-background: #0f0f23;
  --color-surface: #1a1a2e;
  --color-muted: #16213e;
  --color-border: #333344;
  --color-text: #ffffff;
  --color-text_muted: #a0a0a0;
  --color-error: #ef4444;
  --color-warning: #f59e0b;
  --color-info: #3b82f6;
  --color-success: #22c55e;
  --font-primary: 'Inter, system-ui, sans-serif';
  --font-secondary: 'Inter, system-ui, sans-serif';
  --max-width: 1200px;
  --container-padding: 2rem;

  /* Dark theme specific additions */
  --color-dark-elevated: #252540;
  --color-dark-text-secondary: #a0a0a0;
  --color-dark-text-tertiary: #6b7280;

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

  /* Transitions */
  --transition-fast: 0.15s ease-in-out;
  --transition-normal: 0.3s ease-in-out;
}

/* Dark theme specific overrides */
body {
  color-scheme: dark;
}

/* Scrollbar styling for dark theme */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--color-background);
}

::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-text_muted);
}

/* Selection colors for dark theme */
::selection {
  background-color: var(--color-primary);
  color: var(--color-text);
}

::-moz-selection {
  background-color: var(--color-primary);
  color: var(--color-text);
}