/* === Dark Mode Theme === */
[data-theme="dark"] {
  --color-primary: #D4A0C0;
  --color-primary-light: #B880A0;
  --color-primary-dark: #E8B8D0;
  --color-primary-bg: rgba(212, 160, 192, 0.12);

  --color-accent: #FFD700;
  --color-accent-light: rgba(255, 215, 0, 0.15);

  --bg-body: #1A1025;
  --bg-gradient: linear-gradient(135deg, #1A1025 0%, #2D1F3D 50%, #231535 100%);
  --bg-card: #2D1F3D;
  --bg-card-hover: #352545;
  --bg-surface: #231535;
  --bg-overlay: rgba(0, 0, 0, 0.7);

  --text-primary: #E8D8E0;
  --text-secondary: #B8A0B0;
  --text-muted: #887080;
  --text-heading: #F0E0E8;
  --text-inverse: #1A1025;

  --border-light: rgba(212, 160, 192, 0.12);
  --border-medium: rgba(212, 160, 192, 0.2);

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.35);
  --shadow-xl: 0 16px 50px rgba(0, 0, 0, 0.45);
}

/* Dark mode header */
[data-theme="dark"] .site-header {
  background: rgba(35, 21, 53, 0.92);
}

[data-theme="dark"] .search-section {
  background: rgba(26, 16, 37, 0.85);
}

/* Dark mode specific overrides */
[data-theme="dark"] .filter-pill.active {
  background: var(--color-primary);
  color: var(--text-inverse);
}

[data-theme="dark"] .modal-content {
  background: var(--bg-card);
}

[data-theme="dark"] .modal-close {
  background: rgba(45, 31, 61, 0.9);
  color: var(--text-primary);
}

[data-theme="dark"] .modal-close:hover {
  background: var(--color-primary);
  color: var(--text-inverse);
}

[data-theme="dark"] .modal-image-nav {
  background: rgba(45, 31, 61, 0.9);
  color: var(--text-primary);
}

[data-theme="dark"] .modal-image-nav:hover {
  background: var(--color-primary);
  color: var(--text-inverse);
}

[data-theme="dark"] .theme-toggle:hover {
  background: rgba(212, 160, 192, 0.15);
}

[data-theme="dark"] .search-bar input {
  background: var(--bg-card);
  border-color: var(--border-medium);
}

[data-theme="dark"] .search-bar input:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 4px rgba(212, 160, 192, 0.1);
}

[data-theme="dark"] .card-code {
  background: rgba(212, 160, 192, 0.08);
}

[data-theme="dark"] .card-code .copy-btn:hover {
  background: var(--color-primary);
  color: var(--text-inverse);
}

[data-theme="dark"] .stats-badge {
  background: var(--bg-card);
  border-color: var(--border-medium);
}

[data-theme="dark"] .toast {
  background: var(--color-primary);
  color: var(--text-inverse);
}

[data-theme="dark"] .modal-code-block {
  background: rgba(212, 160, 192, 0.08);
  border-color: var(--color-primary-light);
}

/* === Category Color Overrides for Dark Mode === */
[data-theme="dark"] .card-category,
[data-theme="dark"] .modal-category {
  opacity: 0.9;
}