/* 
 * Eventistics - Dark Mode Optimization
 * Ensures all elements look great in dark mode
 */

/* Base Dark Mode Styles */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #111827 !important;
        color: #f3f4f6 !important;
    }

    /* Cards & Containers */
    .stat-card,
    .bg-white {
        background-color: #1f2937 !important;
        border-color: #374151 !important;
    }

    /* Text Colors */
    .text-gray-900 {
        color: #f3f4f6 !important;
    }

    .text-gray-700,
    .text-gray-600 {
        color: #d1d5db !important;
    }

    .text-gray-500 {
        color: #9ca3af !important;
    }

    /* Borders */
    .border-gray-200 {
        border-color: #374151 !important;
    }

    .border-gray-300 {
        border-color: #4b5563 !important;
    }

    /* Inputs & Forms */
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="search"],
    select,
    textarea {
        background-color: #374151 !important;
        border-color: #4b5563 !important;
        color: #f3f4f6 !important;
    }

    input[type="text"]:focus,
    input[type="email"]:focus,
    input[type="password"]:focus,
    input[type="search"]:focus,
    select:focus,
    textarea:focus {
        background-color: #374151 !important;
        border-color: #6366f1 !important;
    }

    input::placeholder {
        color: #9ca3af !important;
    }

    /* Tables */
    table thead {
        background-color: #1f2937 !important;
    }

    table tbody {
        background-color: #111827 !important;
    }

    table tbody tr {
        border-color: #374151 !important;
    }

    table tbody tr:hover {
        background-color: #1f2937 !important;
    }

    /* Buttons (preserve colors but adjust hover states) */
    .bg-white.hover\:bg-gray-50:hover {
        background-color: #374151 !important;
    }

    /* Navigation */
    nav.bg-white {
        background-color: #1f2937 !important;
        border-bottom-color: #374151 !important;
    }

    /* Modals */
    .fixed .bg-white {
        background-color: #1f2937 !important;
    }

    /* Alerts & Info Boxes */
    .bg-blue-50 {
        background-color: #1e3a5f !important;
    }

    .bg-green-50 {
        background-color: #1e3d2f !important;
    }

    .bg-yellow-50 {
        background-color: #3d3517 !important;
    }

    .bg-red-50 {
        background-color: #3d1e1e !important;
    }

    .bg-gray-50 {
        background-color: #111827 !important;
    }

    .bg-gray-100 {
        background-color: #1f2937 !important;
    }

    /* Text in colored backgrounds */
    .bg-blue-50 .text-blue-700 {
        color: #93c5fd !important;
    }

    .bg-green-50 .text-green-700 {
        color: #86efac !important;
    }

    .bg-yellow-50 .text-yellow-700 {
        color: #fde047 !important;
    }

    .bg-red-50 .text-red-700 {
        color: #fca5a5 !important;
    }

    /* Loading Spinner */
    .loading-spinner {
        border-color: #374151 !important;
        border-top-color: #6366f1 !important;
    }

    /* Charts remain as-is for visibility */
    canvas {
        /* Charts are already optimized */
    }

    /* Dropdown menus */
    .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
        border-color: #374151 !important;
    }

    /* Shadows in dark mode should be darker */
    .shadow,
    .shadow-sm,
    .shadow-md,
    .shadow-lg,
    .shadow-xl {
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.5), 0 1px 2px 0 rgba(0, 0, 0, 0.3) !important;
    }

    /* Status badges - keep their colors but adjust brightness */
    .bg-green-100 {
        background-color: #14532d !important;
    }

    .text-green-800 {
        color: #86efac !important;
    }

    .bg-gray-100.text-gray-800 {
        background-color: #374151 !important;
        color: #d1d5db !important;
    }

    /* Icon backgrounds in stat cards */
    .stat-card-icon {
        opacity: 0.9;
    }

    /* Preserve gradient backgrounds */
    .gradient-bg,
    .bg-gradient-to-r {
        /* Keep gradients as-is, they work well in dark mode */
    }

    /* Glass effect for landing page */
    .glass {
        background: rgba(31, 41, 55, 0.5) !important;
        border-color: rgba(75, 85, 99, 0.5) !important;
    }

    /* Checkboxes & Radio buttons */
    input[type="checkbox"],
    input[type="radio"] {
        background-color: #374151 !important;
        border-color: #4b5563 !important;
    }

    input[type="checkbox"]:checked,
    input[type="radio"]:checked {
        background-color: #6366f1 !important;
    }

    /* Code blocks */
    pre,
    code {
        background-color: #1f2937 !important;
        color: #f3f4f6 !important;
    }

    /* Links - ensure good contrast */
    a:not(.btn):not([class*="bg-"]) {
        color: #93c5fd !important;
    }

    a:not(.btn):not([class*="bg-"]):hover {
        color: #60a5fa !important;
    }

    /* Progress bars */
    .bg-gray-200 {
        background-color: #374151 !important;
    }

    /* Disabled states */
    button:disabled,
    input:disabled,
    select:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

    /* Scrollbars */
    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    ::-webkit-scrollbar-track {
        background: #1f2937;
    }

    ::-webkit-scrollbar-thumb {
        background: #4b5563;
        border-radius: 5px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: #6b7280;
    }

    /* Select dropdowns */
    select option {
        background-color: #1f2937 !important;
        color: #f3f4f6 !important;
    }

    /* File inputs */
    input[type="file"] {
        color: #f3f4f6 !important;
    }

    /* Date inputs */
    input[type="date"],
    input[type="time"],
    input[type="datetime-local"] {
        background-color: #374151 !important;
        color: #f3f4f6 !important;
        color-scheme: dark;
    }
}