/* Dark mode custom properties */
html.dark {
  --bg-primary: #111827;
  --bg-secondary: #1f2937;
  --bg-tertiary: #374151;
  --text-primary: #f9fafb;
  --text-secondary: #d1d5db;
  --text-muted: #9ca3af;
  --border-color: #374151;
  --brand: #ea580c;
  --brand-hover: #c2410c;
  --brand-light: #431407;
  --brand-subtle: #7c2d12;
}

html.dark body {
  background-color: var(--bg-primary);
  color: var(--text-primary);
}

html.dark .bg-white {
  background-color: var(--bg-secondary) !important;
}

html.dark .bg-gray-50 {
  background-color: var(--bg-primary) !important;
}

html.dark .bg-gray-100 {
  background-color: var(--bg-tertiary) !important;
}

html.dark .text-gray-900 {
  color: var(--text-primary) !important;
}

html.dark .text-gray-700,
html.dark .text-gray-600 {
  color: var(--text-secondary) !important;
}

html.dark .text-gray-500,
html.dark .text-gray-400 {
  color: var(--text-muted) !important;
}

html.dark .border-gray-200,
html.dark .border-gray-100 {
  border-color: var(--border-color) !important;
}

html.dark .divide-gray-200 > * + * {
  border-color: var(--border-color) !important;
}

/* Dark mode sidebar */
html.dark #sidebar {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Dark mode topbar */
html.dark header {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Dark mode cards */
html.dark .rounded-xl,
html.dark .rounded-lg {
  border-color: var(--border-color);
}

/* Dark mode inputs */
html.dark input,
html.dark select,
html.dark textarea {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* Dark mode tables */
html.dark th {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
}

html.dark tr:hover {
  background-color: var(--bg-tertiary) !important;
}

/* Dark mode dropdown */
html.dark #user-dropdown-menu {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Dark mode stat cards - preserve brand colors */
html.dark .bg-orange-50 {
  background-color: var(--brand-light) !important;
}

html.dark .bg-green-50,
html.dark .bg-blue-50,
html.dark .bg-purple-50 {
  background-color: var(--bg-tertiary) !important;
}

/* Dark mode flash messages */
html.dark .bg-green-50 { background-color: #052e16 !important; }
html.dark .bg-red-50 { background-color: #450a0a !important; }
html.dark .bg-yellow-50 { background-color: #422006 !important; }

/* Transition for smooth toggle */
html.dark * {
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}