/* Light Theme (Default) */
.theme-light {
  /* Already uses default Tailwind classes */
}

/* Dark Theme */
.theme-dark {
  background-color: #1a202c;
  color: #e2e8f0;
}

.theme-dark .bg-gray-50 {
  background-color: #2d3748 !important;
}

.theme-dark .bg-white {
  background-color: #1a202c !important;
  color: #e2e8f0 !important;
}

.theme-dark .bg-gray-100 {
  background-color: #2d3748 !important;
}

.theme-dark .bg-gray-800 {
  background-color: #0f1419 !important;
}

.theme-dark .text-gray-900 {
  color: #f7fafc !important;
}

.theme-dark .text-gray-700 {
  color: #cbd5e0 !important;
}

.theme-dark .text-gray-600 {
  color: #a0aec0 !important;
}

.theme-dark .text-gray-500 {
  color: #718096 !important;
}

.theme-dark .border-gray-200,
.theme-dark .border-gray-300 {
  border-color: #4a5568 !important;
}

.theme-dark input,
.theme-dark textarea,
.theme-dark select {
  background-color: #2d3748 !important;
  color: #e2e8f0 !important;
  border-color: #4a5568 !important;
}

.theme-dark input:focus,
.theme-dark textarea:focus,
.theme-dark select:focus {
  border-color: #667eea !important;
  background-color: #374151 !important;
}

/* Midnight Theme - Deep Blues */
.theme-midnight {
  background-color: #0a1929;
  color: #b0c4de;
}

.theme-midnight .bg-gray-50 {
  background-color: #132f4c !important;
}

.theme-midnight .bg-white {
  background-color: #0a1929 !important;
  color: #b0c4de !important;
}

.theme-midnight .bg-gray-100 {
  background-color: #1a2332 !important;
}

.theme-midnight .bg-gray-800 {
  background-color: #05101c !important;
}

.theme-midnight .text-gray-900 {
  color: #e3f2fd !important;
}

.theme-midnight .text-gray-700 {
  color: #90caf9 !important;
}

.theme-midnight .text-gray-600 {
  color: #64b5f6 !important;
}

.theme-midnight .text-gray-500 {
  color: #42a5f5 !important;
}

.theme-midnight .border-gray-200,
.theme-midnight .border-gray-300 {
  border-color: #1e3a5f !important;
}

.theme-midnight input,
.theme-midnight textarea,
.theme-midnight select {
  background-color: #132f4c !important;
  color: #b0c4de !important;
  border-color: #1e3a5f !important;
}

/* Retro Theme - Classic Gaming */
.theme-retro {
  background-color: #2b1b17;
  color: #f4e8c1;
}

.theme-retro .bg-gray-50 {
  background-color: #3d2c24 !important;
}

.theme-retro .bg-white {
  background-color: #2b1b17 !important;
  color: #f4e8c1 !important;
}

.theme-retro .bg-gray-100 {
  background-color: #4a3428 !important;
}

.theme-retro .bg-gray-800 {
  background-color: #1a0f0c !important;
}

.theme-retro .bg-indigo-600 {
  background-color: #d4af37 !important;
}

.theme-retro .bg-indigo-100 {
  background-color: #5a4a2f !important;
}

.theme-retro .text-indigo-600,
.theme-retro .text-indigo-700 {
  color: #ffd700 !important;
}

.theme-retro .text-gray-900 {
  color: #f4e8c1 !important;
}

.theme-retro .text-gray-700 {
  color: #e8d7a8 !important;
}

.theme-retro .text-gray-600 {
  color: #d4c18f !important;
}

.theme-retro .border-gray-200,
.theme-retro .border-gray-300 {
  border-color: #5a4a2f !important;
}

.theme-retro input,
.theme-retro textarea,
.theme-retro select {
  background-color: #3d2c24 !important;
  color: #f4e8c1 !important;
  border-color: #5a4a2f !important;
}

/* Ocean Theme - Blue/Teal */
.theme-ocean {
  background-color: #0d2d3d;
  color: #d4f4ff;
}

.theme-ocean .bg-gray-50 {
  background-color: #164e63 !important;
}

.theme-ocean .bg-white {
  background-color: #0d2d3d !important;
  color: #d4f4ff !important;
}

.theme-ocean .bg-gray-100 {
  background-color: #1a4150 !important;
}

.theme-ocean .bg-gray-800 {
  background-color: #051c28 !important;
}

.theme-ocean .bg-indigo-600 {
  background-color: #06b6d4 !important;
}

.theme-ocean .bg-indigo-100 {
  background-color: #1e4a5a !important;
}

.theme-ocean .text-indigo-600,
.theme-ocean .text-indigo-700 {
  color: #22d3ee !important;
}

.theme-ocean .text-gray-900 {
  color: #e0f2fe !important;
}

.theme-ocean .text-gray-700 {
  color: #bae6fd !important;
}

.theme-ocean .text-gray-600 {
  color: #7dd3fc !important;
}

.theme-ocean .border-gray-200,
.theme-ocean .border-gray-300 {
  border-color: #1e4a5a !important;
}

.theme-ocean input,
.theme-ocean textarea,
.theme-ocean select {
  background-color: #164e63 !important;
  color: #d4f4ff !important;
  border-color: #1e4a5a !important;
}

/* Common overrides for all dark themes */
.theme-dark input::placeholder,
.theme-midnight input::placeholder,
.theme-retro input::placeholder,
.theme-ocean input::placeholder,
.theme-dark textarea::placeholder,
.theme-midnight textarea::placeholder,
.theme-retro textarea::placeholder,
.theme-ocean textarea::placeholder {
  color: #718096;
  opacity: 0.6;
}

/* Ensure hover states work on dark themes */
.theme-dark a:hover,
.theme-midnight a:hover,
.theme-retro a:hover,
.theme-ocean a:hover {
  opacity: 0.8;
}

/* Navigation fixes for all dark themes */
.theme-dark nav,
.theme-midnight nav,
.theme-retro nav,
.theme-ocean nav {
  background-color: rgba(0, 0, 0, 0.3) !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

.theme-dark nav a,
.theme-midnight nav a,
.theme-retro nav a,
.theme-ocean nav a {
  color: #cbd5e0 !important;
}

.theme-dark nav a:hover,
.theme-midnight nav a:hover,
.theme-retro nav a:hover,
.theme-ocean nav a:hover {
  color: #fff !important;
}

/* Logo/brand text - keep it vibrant */
.theme-dark nav .text-indigo-600,
.theme-midnight nav .text-indigo-600,
.theme-ocean nav .text-indigo-600 {
  color: #818cf8 !important;
}

.theme-retro nav .text-indigo-600 {
  color: #ffd700 !important;
}

/* Navigation button (logout) */
.theme-dark nav button,
.theme-midnight nav button,
.theme-retro nav button,
.theme-ocean nav button {
  background-color: #4a5568 !important;
  color: #e2e8f0 !important;
}

.theme-dark nav button:hover,
.theme-midnight nav button:hover,
.theme-retro nav button:hover,
.theme-ocean nav button:hover {
  background-color: #718096 !important;
}

/* Button overrides for dark themes */
.theme-dark button,
.theme-midnight button,
.theme-retro button,
.theme-ocean button {
  color: inherit;
}

.theme-dark .bg-gray-200,
.theme-midnight .bg-gray-200,
.theme-retro .bg-gray-200,
.theme-ocean .bg-gray-200 {
  background-color: #4a5568 !important;
  color: #e2e8f0 !important;
}

.theme-dark .bg-gray-200:hover,
.theme-midnight .bg-gray-200:hover,
.theme-retro .bg-gray-200:hover,
.theme-ocean .bg-gray-200:hover {
  background-color: #718096 !important;
}

/* Specific button text colors to ensure readability */
.theme-dark .bg-gray-200 button,
.theme-midnight .bg-gray-200 button,
.theme-retro .bg-gray-200 button,
.theme-ocean .bg-gray-200 button,
.theme-dark button.bg-gray-200,
.theme-midnight button.bg-gray-200,
.theme-retro button.bg-gray-200,
.theme-ocean button.bg-gray-200 {
  color: #e2e8f0 !important;
}

/* Ensure all colored buttons have white text */
.theme-dark .bg-yellow-100,
.theme-midnight .bg-yellow-100,
.theme-retro .bg-yellow-100,
.theme-ocean .bg-yellow-100 {
  background-color: #78350f !important;
  color: #fef3c7 !important;
}

.theme-dark .text-red-600,
.theme-midnight .text-red-600,
.theme-retro .text-red-600,
.theme-ocean .text-red-600 {
  color: #f87171 !important;
}

.theme-dark .text-green-600,
.theme-midnight .text-green-600,
.theme-retro .text-green-600,
.theme-ocean .text-green-600 {
  color: #4ade80 !important;
}

.theme-dark .text-blue-600,
.theme-midnight .text-blue-600,
.theme-retro .text-blue-600,
.theme-ocean .text-blue-600 {
  color: #60a5fa !important;
}

/* Ensure buttons with explicit colors stay readable */
.theme-dark .bg-indigo-600,
.theme-midnight .bg-indigo-600,
.theme-retro .bg-indigo-600,
.theme-ocean .bg-indigo-600,
.theme-dark .bg-green-600,
.theme-midnight .bg-green-600,
.theme-retro .bg-green-600,
.theme-ocean .bg-green-600,
.theme-dark .bg-red-600,
.theme-midnight .bg-red-600,
.theme-retro .bg-red-600,
.theme-ocean .bg-red-600,
.theme-dark .bg-blue-600,
.theme-midnight .bg-blue-600,
.theme-retro .bg-blue-600,
.theme-ocean .bg-blue-600 {
  color: #ffffff !important;
}

/* Text color overrides for important elements */
.theme-dark .text-gray-700,
.theme-midnight .text-gray-700,
.theme-retro .text-gray-700,
.theme-ocean .text-gray-700 {
  color: #cbd5e0 !important;
}

/* Badge/notification overrides */
.theme-dark .bg-red-500,
.theme-midnight .bg-red-500,
.theme-retro .bg-red-500,
.theme-ocean .bg-red-500 {
  background-color: #ef4444 !important;
  color: #ffffff !important;
}

/* Footer overrides */
.theme-dark footer,
.theme-midnight footer,
.theme-retro footer,
.theme-ocean footer {
  background-color: #111827 !important;
  color: #9ca3af !important;
}

.theme-dark footer a,
.theme-midnight footer a,
.theme-retro footer a,
.theme-ocean footer a {
  color: #9ca3af !important;
}

.theme-dark footer a:hover,
.theme-midnight footer a:hover,
.theme-retro footer a:hover,
.theme-ocean footer a:hover {
  color: #fff !important;
}

/* Shadow improvements for dark themes */
.theme-dark .shadow,
.theme-dark .shadow-lg,
.theme-midnight .shadow,
.theme-midnight .shadow-lg,
.theme-retro .shadow,
.theme-retro .shadow-lg,
.theme-ocean .shadow,
.theme-ocean .shadow-lg {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -1px rgba(0, 0, 0, 0.3) !important;
}

/* Card hover effects for dark themes */
.theme-dark .hover\:shadow-md:hover,
.theme-midnight .hover\:shadow-md:hover,
.theme-retro .hover\:shadow-md:hover,
.theme-ocean .hover\:shadow-md:hover {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5), 0 2px 4px -1px rgba(0, 0, 0, 0.4) !important;
}

/* Statistic cards text colors */
.theme-dark .text-blue-600,
.theme-midnight .text-blue-600 {
  color: #60a5fa !important;
}

.theme-ocean .text-blue-600 {
  color: #06b6d4 !important;
}

.theme-dark .text-green-600,
.theme-midnight .text-green-600,
.theme-ocean .text-green-600 {
  color: #4ade80 !important;
}

.theme-dark .text-purple-600,
.theme-midnight .text-purple-600,
.theme-ocean .text-purple-600 {
  color: #c084fc !important;
}

.theme-retro .text-blue-600,
.theme-retro .text-green-600,
.theme-retro .text-purple-600 {
  color: #ffd700 !important;
}

/* Badge colors for dark themes */
.theme-dark .bg-blue-100,
.theme-midnight .bg-blue-100,
.theme-retro .bg-blue-100,
.theme-ocean .bg-blue-100 {
  background-color: #1e3a8a !important;
  color: #dbeafe !important;
}

.theme-dark .bg-green-100,
.theme-midnight .bg-green-100,
.theme-retro .bg-green-100,
.theme-ocean .bg-green-100 {
  background-color: #14532d !important;
  color: #dcfce7 !important;
}

.theme-dark .text-blue-800,
.theme-midnight .text-blue-800,
.theme-retro .text-blue-800,
.theme-ocean .text-blue-800 {
  color: #dbeafe !important;
}

.theme-dark .text-green-800,
.theme-midnight .text-green-800,
.theme-retro .text-green-800,
.theme-ocean .text-green-800 {
  color: #dcfce7 !important;
}

/* Red badges/alerts */
.theme-dark .bg-red-100,
.theme-midnight .bg-red-100,
.theme-retro .bg-red-100,
.theme-ocean .bg-red-100 {
  background-color: #7f1d1d !important;
  color: #fee2e2 !important;
}

.theme-dark .text-red-800,
.theme-midnight .text-red-800,
.theme-retro .text-red-800,
.theme-ocean .text-red-800 {
  color: #fee2e2 !important;
}

/* Indigo badges */
.theme-dark .bg-indigo-100,
.theme-midnight .bg-indigo-100,
.theme-retro .bg-indigo-100,
.theme-ocean .bg-indigo-100 {
  background-color: #312e81 !important;
  color: #e0e7ff !important;
}

.theme-dark .text-indigo-700,
.theme-midnight .text-indigo-700,
.theme-retro .text-indigo-700,
.theme-ocean .text-indigo-700 {
  color: #c7d2fe !important;
}

.theme-dark .text-indigo-800,
.theme-midnight .text-indigo-800,
.theme-retro .text-indigo-800,
.theme-ocean .text-indigo-800 {
  color: #e0e7ff !important;
}