/* ==========================================================================
   Theme Definitions
   ========================================================================== */
:root {
  --color-bg-primary: #0b1221;
  --color-bg-secondary: #111b2e;
  --color-bg-tertiary: #162036;
  --color-bg-overlay: #1a2742;

  --color-text-primary: #e8ecf1;
  --color-text-secondary: #8b9bb4;
  --color-text-tertiary: #5a6d87;

  --color-accent: #00b4d8;
  --color-accent-hover: #00cfee;
  --color-accent-muted: rgba(0, 180, 216, 0.12);

  --color-success: #22c55e;
  --color-success-muted: rgba(34, 197, 94, 0.12);

  --color-warning: #eab308;
  --color-warning-muted: rgba(234, 179, 8, 0.12);

  --color-error: #ef4444;
  --color-error-muted: rgba(239, 68, 68, 0.12);

  --color-border: #1e2d45;
  --color-border-hover: #2a3f5f;

  --color-focus: #00b4d8;

  --header-bg: rgba(11, 18, 33, 0.88);
  --mobile-menu-bg: #111b2e;

  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-card-hover: 0 8px 24px rgba(0, 0, 0, 0.4);

  --grid-color: rgba(30, 45, 69, 0.4);
  --grid-size: 40px;
}

[data-theme="light"] {
  --color-bg-primary: #f4f6f9;
  --color-bg-secondary: #ffffff;
  --color-bg-tertiary: #e8ecf1;
  --color-bg-overlay: #ffffff;

  --color-text-primary: #0f172a;
  --color-text-secondary: #475569;
  --color-text-tertiary: #94a3b8;

  --color-accent: #0077b6;
  --color-accent-hover: #005f8a;
  --color-accent-muted: rgba(0, 119, 182, 0.08);

  --color-success: #16a34a;
  --color-success-muted: rgba(22, 163, 74, 0.08);

  --color-warning: #ca8a04;
  --color-warning-muted: rgba(202, 138, 4, 0.08);

  --color-error: #dc2626;
  --color-error-muted: rgba(220, 38, 38, 0.08);

  --color-border: #d1d9e6;
  --color-border-hover: #b0bdd0;

  --color-focus: #0077b6;

  --header-bg: rgba(244, 246, 249, 0.88);
  --mobile-menu-bg: #ffffff;

  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-card-hover: 0 8px 24px rgba(0, 0, 0, 0.12);

  --grid-color: rgba(148, 163, 184, 0.15);
  --grid-size: 40px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0ms;
    --transition-base: 0ms;
    --transition-slow: 0ms;
  }
}