/* Theme Colors */
:root {
  /* Primary Colors */
  --color-primary-black: #0a192f;
  --color-primary-white: #ffffff;

  /* Accent Colors */
  --color-accent-gray: #64ffda;
  --color-accent-gray-hover: #4db6ac;
  --color-accent-gray-light: rgba(100, 255, 218, 0.1);

  /* Text Colors */
  --color-text-primary: #ffffff;
  --color-text-secondary: #f0f0f0;
  --color-text-muted: #cccccc;
  --color-text-accent: #64ffda;

  /* Background Colors */
  --color-bg-primary: #0a192f;
  --color-bg-secondary: #112240;
  --color-bg-card: #0a192f;
  --color-bg-overlay: rgba(10, 25, 47, 0.9);

  /* Border Colors */
  --color-border-light: #233554;
  --color-border-medium: #495670;
  --color-border-accent: #64ffda;

  /* Interactive States */
  --color-hover-light: #f0f0f0;
  --color-active-accent: #64ffda;
  --color-focus-outline: #64ffda;

  /* Shadows */
  --shadow-accent: 0 8px 32px rgba(100, 255, 218, 0.1);
  --shadow-accent-strong: 0 8px 32px rgba(100, 255, 218, 0.3);

  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.3s ease;
  --transition-slow: 0.5s ease;

  /* Z-Index */
  --z-index-dropdown: 100;
  --z-index-navigation: 1000;
}

/* Light Theme */
[data-theme="light"] {
  --color-primary-black: #ffffff;
  --color-primary-white: #000000;
  --color-text-primary: #000000;
  --color-text-secondary: #333333;
  --color-text-muted: #666666;
  --color-bg-primary: #ffffff;
  --color-bg-secondary: #f8f9fa;
  --color-bg-card: #ffffff;
  --color-border-light: #e1e5e9;
  --color-border-medium: #ced4da;
}