@tailwind base;
@tailwind components;
@tailwind utilities;

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  background-color: #ffffff;
  color: #000000;
}

/* Scrollbar */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* ============ DARK MODE OVERRIDES ============ */

.dark ::-webkit-scrollbar-track {
  background: #1f2937;
}
.dark ::-webkit-scrollbar-thumb {
  background: #4b5563;
}
.dark ::-webkit-scrollbar-thumb:hover {
  background: #6b7280;
}

.dark body {
  background-color: #030712;
  color: #f9fafb;
}

/* Background overrides */
.dark .bg-white { background-color: #111827 !important; }
.dark .bg-gray-50 { background-color: #030712 !important; }
.dark .bg-gray-100 { background-color: #1f2937 !important; }
.dark .bg-gray-200 { background-color: #374151 !important; }

/* Text overrides */
.dark .text-black { color: #f9fafb !important; }
.dark .text-gray-950 { color: #f9fafb !important; }
.dark .text-gray-900 { color: #f3f4f6 !important; }
.dark .text-gray-800 { color: #e5e7eb !important; }
.dark .text-gray-700 { color: #d1d5db !important; }
.dark .text-gray-600 { color: #9ca3af !important; }
.dark .text-gray-500 { color: #9ca3af !important; }
.dark .text-gray-400 { color: #6b7280 !important; }

/* Border overrides */
.dark .border-gray-100 { border-color: #1f2937 !important; }
.dark .border-gray-200 { border-color: #374151 !important; }
.dark .border-gray-300 { border-color: #4b5563 !important; }

/* Divider overrides */
.dark .divide-gray-50 > :not([hidden]) ~ :not([hidden]) { border-color: #1f2937 !important; }
.dark .divide-gray-100 > :not([hidden]) ~ :not([hidden]) { border-color: #1f2937 !important; }

/* Hover background overrides */
.dark .hover\:bg-gray-50:hover { background-color: #1f2937 !important; }
.dark .hover\:bg-gray-100:hover { background-color: #1f2937 !important; }
.dark .hover\:bg-gray-200:hover { background-color: #374151 !important; }

/* Hover text overrides */
.dark .hover\:text-black:hover { color: #f9fafb !important; }
.dark .hover\:text-gray-900:hover { color: #f3f4f6 !important; }

/* Shadow */
.dark .shadow-sm { box-shadow: 0 1px 2px 0 rgba(0,0,0,0.3) !important; }
.dark .shadow-md { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.4) !important; }

/* bg-black buttons in dark mode -> light */
.dark .bg-black { background-color: #f9fafb !important; }
.dark .bg-black + span,
.dark button.bg-black { color: #111827 !important; }
.dark button.bg-black span { color: #111827 !important; }

/* Fix for CTA buttons (bg-black text-white) */
.dark button.bg-black,
.dark a.bg-black {
  background-color: #f9fafb !important;
  color: #111827 !important;
}

/* Fix nested text-white inside bg-black in dark mode */
.dark .bg-black .text-white,
.dark .bg-black.text-white {
  color: #111827 !important;
}

/* Invert sidebar active state */
.dark button.bg-black.text-white,
.dark button.bg-black > span {
  color: #111827 !important;
}
.dark button.bg-black svg {
  color: #111827 !important;
}

/* Hover: bg-gray-800 in dark mode */
.dark .hover\:bg-gray-800:hover { background-color: #e5e7eb !important; color: #111827 !important; }

/* Status badge backgrounds */
.dark .bg-green-50 { background-color: #064e3b !important; }
.dark .bg-red-50 { background-color: #450a0a !important; }
.dark .bg-amber-50 { background-color: #451a03 !important; }
.dark .bg-emerald-50 { background-color: #064e3b !important; }
.dark .bg-amber-100 { background-color: #78350f !important; }

/* Status badge text */
.dark .text-green-700 { color: #6ee7b7 !important; }
.dark .text-red-600 { color: #fca5a5 !important; }
.dark .text-red-700 { color: #fca5a5 !important; }
.dark .text-amber-600 { color: #fcd34d !important; }
.dark .text-amber-700 { color: #fcd34d !important; }
.dark .text-emerald-700 { color: #6ee7b7 !important; }

/* Focus ring */
.dark .focus\:ring-black:focus { --tw-ring-color: #f9fafb !important; }
.dark .focus\:border-black:focus { border-color: #f9fafb !important; }

/* Accent */
.dark .accent-black { accent-color: #f9fafb !important; }

/* Spinner */
.dark .border-black { border-color: #f9fafb !important; }
.dark .border-b-black { border-bottom-color: #f9fafb !important; }
.dark .border-t-black { border-top-color: #f9fafb !important; }
.dark .animate-spin.rounded-full { border-color: #f9fafb !important; border-bottom-color: transparent !important; }

/* Placeholder */
.dark .placeholder-gray-400::placeholder { color: #6b7280 !important; }

/* Success/Error text standalone */
.dark .text-green-600 { color: #6ee7b7 !important; }

/* Modal backdrop */
.dark .bg-black\/50 { background-color: rgba(0,0,0,0.7) !important; }

/* Toggle / switch */
.dark .bg-gray-300 { background-color: #4b5563 !important; }
.dark .peer-checked\:bg-black:checked ~ * { background-color: #f9fafb !important; }
.dark .peer-checked\:bg-black:checked + *,
.dark input.peer:checked + .peer-checked\:bg-black { background-color: #f9fafb !important; }

