/* Emergency dark mode fixes */
html[data-theme='dark'] .card,
html[data-theme='dark'] .dark-card,
html[data-theme='dark'] [class*="bg-white"],
html[data-theme='dark'] .bg-white {
  background-color: #1f2937 !important;
  border-color: #374151 !important;
  color: #e5e7eb !important;
}

html[data-theme='dark'] .grid [class*="bg-white"] {
  background-color: #1f2937 !important;
}

/* Target specific dashboard grids */
html[data-theme='dark'] .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-4.gap-4.mb-8 > div,
html[data-theme='dark'] .grid.grid-cols-1.lg\:grid-cols-2.gap-6.mb-6 > div {
  background-color: #1f2937 !important;
  border-color: #374151 !important;
}

/* Force dark text colors */
html[data-theme='dark'] .text-gray-700,
html[data-theme='dark'] .text-gray-800,
html[data-theme='dark'] .text-gray-900 {
  color: #e5e7eb !important;
}

/* Settings page specific fixes */
html[data-theme='dark'] .card {
  background-color: #111827 !important;
}

html[data-theme='dark'] .input-field,
html[data-theme='dark'] select,
html[data-theme='dark'] input[type="text"],
html[data-theme='dark'] input[type="number"],
html[data-theme='dark'] input[type="date"] {
  background-color: #374151 !important;
  color: #e5e7eb !important;
  border-color: #4b5563 !important;
}

html[data-theme='dark'] label,
html[data-theme='dark'] .text-gray-500,
html[data-theme='dark'] .text-gray-600 {
  color: #9ca3af !important;
}

html[data-theme='dark'] h1, 
html[data-theme='dark'] h2, 
html[data-theme='dark'] h3, 
html[data-theme='dark'] h4,
html[data-theme='dark'] .text-2xl,
html[data-theme='dark'] .text-xl,
html[data-theme='dark'] .text-lg,
html[data-theme='dark'] .font-bold,
html[data-theme='dark'] .font-semibold {
  color: #f3f4f6 !important;
}

html[data-theme='dark'] button.rounded-md,
html[data-theme='dark'] .btn-secondary {
  background-color: #374151 !important;
  color: #e5e7eb !important;
  border-color: #4b5563 !important;
}

html[data-theme='dark'] button.rounded-md.bg-blue-100,
html[data-theme='dark'] button.rounded-md[class*="bg-blue-"] {
  background-color: rgba(37, 99, 235, 0.2) !important;
  color: #93c5fd !important;
}

/* Header dark mode toggle fixes */
html[data-theme='dark'] header button {
  color: #e5e7eb !important;
}

html[data-theme='dark'] header .text-yellow-400 {
  color: #fbbf24 !important;
}

html[data-theme='dark'] header .text-gray-700 {
  color: #e5e7eb !important;
}

html[data-theme='dark'] header .hover\:bg-gray-100:hover {
  background-color: #374151 !important;
}