/* ========================================
   Dark Mode Specific Overrides

   Most dark mode styling is handled by CSS
   variables in style.css. This file contains
   additional overrides for specific elements.
   ======================================== */

/* ========================================
   Map Kadence Global Palette to Dark Mode
   This ensures Kadence Blocks inherit dark mode colors
   ======================================== */
[data-theme="dark"] {
  /* Override Kadence palette variables */
  --global-palette1: var(--accent-secondary);
  --global-palette2: var(--accent-primary);
  --global-palette3: var(--text-primary);
  --global-palette4: var(--text-secondary);
  --global-palette5: var(--text-secondary);
  --global-palette6: var(--border);
  --global-palette7: var(--bg-surface);
  --global-palette8: var(--bg-sidebar);
  --global-palette9: var(--bg-primary);
}

/* Images - slightly reduced brightness in dark mode */
[data-theme="dark"] img:not(.sidebar-photo) {
  filter: brightness(0.9);
}

/* Box shadows - more subtle in dark mode */
[data-theme="dark"] .card:hover {
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .hero-photo {
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

/* Timeline dot border matches background */
[data-theme="dark"] .timeline-item::before {
  border-color: var(--bg-primary);
}

/* Button hover states in dark mode */
[data-theme="dark"] .btn-primary:hover {
  background-color: #6b8ef6;
}

[data-theme="dark"] .btn-secondary:hover {
  background-color: #5a8ac0;
}

/* Mobile menu overlay */
[data-theme="dark"] .mobile-menu-overlay {
  background-color: rgba(0, 0, 0, 0.7);
}

/* Selection color */
[data-theme="dark"] ::selection {
  background-color: var(--accent-primary);
  color: white;
}

/* Scrollbar styling for dark mode */
[data-theme="dark"] ::-webkit-scrollbar {
  width: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
  background: var(--bg-sidebar);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: var(--text-secondary);
}