/**
 * Events Module - Tailwind Dark Mode Overrides v1.0
 * Forces dark theme over Tailwind utility classes
 *
 * Include AFTER Tailwind CSS and events-theme.css
 */

/* ========================================
   TAILWIND BACKGROUND OVERRIDES
   ======================================== */
[data-theme="dark"] .bg-white {
    background-color: var(--bg-secondary) !important;
}

[data-theme="dark"] .bg-gray-50 {
    background-color: var(--bg-primary) !important;
}

[data-theme="dark"] .bg-gray-100 {
    background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .bg-gray-200 {
    background-color: var(--border-light) !important;
}

[data-theme="dark"] .bg-gray-800 {
    background-color: #0f172a !important;
}

/* ========================================
   TAILWIND TEXT COLOR OVERRIDES
   ======================================== */
[data-theme="dark"] .text-gray-900 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .text-gray-800 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .text-gray-700 {
    color: #e2e8f0 !important;
}

[data-theme="dark"] .text-gray-600 {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .text-gray-500 {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .text-gray-400 {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .text-gray-300 {
    color: var(--text-muted) !important;
}

/* ========================================
   TAILWIND BORDER OVERRIDES
   ======================================== */
[data-theme="dark"] .border-gray-200 {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .border-gray-300 {
    border-color: var(--border-light) !important;
}

[data-theme="dark"] .border-gray-700 {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .divide-gray-200 > * {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .border {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .border-t {
    border-top-color: var(--border-color) !important;
}

[data-theme="dark"] .border-b {
    border-bottom-color: var(--border-color) !important;
}

/* ========================================
   SHADOW OVERRIDES
   ======================================== */
[data-theme="dark"] .shadow-lg {
    box-shadow: var(--shadow-lg) !important;
}

[data-theme="dark"] .shadow-md {
    box-shadow: var(--shadow-md) !important;
}

[data-theme="dark"] .shadow-sm {
    box-shadow: var(--shadow-sm) !important;
}

[data-theme="dark"] .shadow-2xl {
    box-shadow: var(--shadow-xl) !important;
}

/* ========================================
   FORM ELEMENT OVERRIDES
   ======================================== */
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: var(--text-muted) !important;
}

[data-theme="dark"] select option {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
    border-color: var(--accent-primary) !important;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.2) !important;
}

/* ========================================
   NAVIGATION OVERRIDES
   ======================================== */
[data-theme="dark"] nav {
    background-color: var(--bg-secondary) !important;
    border-bottom-color: var(--border-color) !important;
}

[data-theme="dark"] nav a {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] nav a:hover {
    color: var(--text-primary) !important;
}

/* ========================================
   HERO SECTION
   ======================================== */
[data-theme="dark"] .hero-gradient {
    background: linear-gradient(135deg, #4c1d95 0%, #1e1b4b 100%) !important;
}

[data-theme="dark"] .glass-effect {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* ========================================
   FILTER SECTION
   ======================================== */
[data-theme="dark"] .filter-card {
    background-color: var(--bg-secondary) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] #filters-container {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

/* ========================================
   EVENT CARDS
   ======================================== */
[data-theme="dark"] .event-card {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .list-view-card {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
}

/* ========================================
   VIEW TOGGLE
   ======================================== */
[data-theme="dark"] .view-toggle {
    background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .view-toggle button.active {
    background-color: var(--bg-secondary) !important;
    color: var(--accent-primary) !important;
}

/* ========================================
   PAGINATION
   ======================================== */
[data-theme="dark"] .pagination-btn {
    background-color: var(--bg-secondary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .pagination-btn:hover {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
}

/* ========================================
   FOOTER
   ======================================== */
[data-theme="dark"] footer {
    background-color: #0f172a !important;
    border-top-color: var(--border-color) !important;
}

[data-theme="dark"] footer a {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] footer a:hover {
    color: var(--text-primary) !important;
}

/* ========================================
   MOBILE MENU
   ======================================== */
[data-theme="dark"] #mobile-menu {
    background-color: var(--bg-secondary) !important;
    border-top-color: var(--border-color) !important;
}

/* ========================================
   MOBILE FILTER OVERLAY
   ======================================== */
[data-theme="dark"] #mobile-filter-overlay .bg-white {
    background-color: var(--bg-secondary) !important;
}

/* ========================================
   HOVER STATES
   ======================================== */
[data-theme="dark"] .hover\:bg-gray-50:hover {
    background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .hover\:bg-gray-100:hover {
    background-color: var(--bg-tertiary) !important;
}

/* ========================================
   ROUNDED ELEMENTS (often cards/modals)
   ======================================== */
[data-theme="dark"] .rounded-xl,
[data-theme="dark"] .rounded-2xl,
[data-theme="dark"] .rounded-lg {
    border-color: var(--border-color) !important;
}

/* ========================================
   LIGHT MODE - RESET OVERRIDES
   ======================================== */
[data-theme="light"] .bg-white {
    background-color: #ffffff !important;
}

[data-theme="light"] .bg-gray-50 {
    background-color: #f9fafb !important;
}

[data-theme="light"] .bg-gray-100 {
    background-color: #f3f4f6 !important;
}

[data-theme="light"] .bg-gray-800 {
    background-color: #1f2937 !important;
}

[data-theme="light"] .text-gray-900 {
    color: #111827 !important;
}

[data-theme="light"] .text-gray-800 {
    color: #1f2937 !important;
}

[data-theme="light"] .text-gray-700 {
    color: #374151 !important;
}

[data-theme="light"] .text-gray-600 {
    color: #4b5563 !important;
}

[data-theme="light"] .text-gray-500 {
    color: #6b7280 !important;
}

[data-theme="light"] .text-gray-400 {
    color: #9ca3af !important;
}

[data-theme="light"] .border-gray-200 {
    border-color: #e5e7eb !important;
}

[data-theme="light"] .border-gray-300 {
    border-color: #d1d5db !important;
}

[data-theme="light"] .shadow-lg {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .shadow-md {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
    color: #1f2937 !important;
}

[data-theme="light"] .hero-gradient {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

[data-theme="light"] .glass-effect {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

[data-theme="light"] nav {
    background-color: #ffffff !important;
}

[data-theme="light"] .filter-card,
[data-theme="light"] #filters-container {
    background-color: #ffffff !important;
}

[data-theme="light"] .event-card,
[data-theme="light"] .list-view-card {
    background-color: #ffffff !important;
}

[data-theme="light"] #mobile-menu {
    background-color: #ffffff !important;
    border-top-color: #e5e7eb !important;
}

[data-theme="light"] .hover\:bg-gray-50:hover {
    background-color: #f9fafb !important;
}

[data-theme="light"] .hover\:bg-gray-100:hover {
    background-color: #f3f4f6 !important;
}