/**
 * Flatpickr Dark Theme Customization
 * Overrides for MeeTang dark mode
 */

/* Dark theme - calendar popup */
body:not(.light-mode) .flatpickr-calendar {
    background: #16213e !important;
    border-color: #2d3748 !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5) !important;
}

body:not(.light-mode) .flatpickr-calendar.open {
    z-index: 99999 !important;
}

/* Header */
body:not(.light-mode) .flatpickr-calendar .flatpickr-months {
    background: #16213e !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-month,
body:not(.light-mode) .flatpickr-calendar .flatpickr-current-month {
    color: #e4e4e7 !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-months .flatpickr-month,
body:not(.light-mode) .flatpickr-calendar .flatpickr-months .flatpickr-next-month,
body:not(.light-mode) .flatpickr-calendar .flatpickr-months .flatpickr-prev-month {
    color: #e4e4e7 !important;
    fill: #e4e4e7 !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-months .flatpickr-next-month:hover,
body:not(.light-mode) .flatpickr-calendar .flatpickr-months .flatpickr-prev-month:hover {
    color: #6366f1 !important;
    fill: #6366f1 !important;
}

/* Weekdays */
body:not(.light-mode) .flatpickr-calendar .flatpickr-weekday {
    color: #9ca3af !important;
}

/* Days */
body:not(.light-mode) .flatpickr-calendar .day {
    color: #e4e4e7 !important;
    border-color: #2d3748 !important;
}

body:not(.light-mode) .flatpickr-calendar .day:hover {
    background: rgba(99, 102, 241, 0.15) !important;
    border-color: #6366f1 !important;
}

body:not(.light-mode) .flatpickr-calendar .day.selected,
body:not(.light-mode) .flatpickr-calendar .day.startRange,
body:not(.light-mode) .flatpickr-calendar .day.endRange,
body:not(.light-mode) .flatpickr-calendar .day.selected.inRange,
body:not(.light-mode) .flatpickr-calendar .day.startRange.inRange,
body:not(.light-mode) .flatpickr-calendar .day.endRange.inRange,
body:not(.light-mode) .flatpickr-calendar .day.selected:focus,
body:not(.light-mode) .flatpickr-calendar .day.startRange:focus,
body:not(.light-mode) .flatpickr-calendar .day.endRange:focus,
body:not(.light-mode) .flatpickr-calendar .day.selected:hover,
body:not(.light-mode) .flatpickr-calendar .day.startRange:hover,
body:not(.light-mode) .flatpickr-calendar .day.endRange:hover,
body:not(.light-mode) .flatpickr-calendar .day.selected.prevMonthDay,
body:not(.light-mode) .flatpickr-calendar .day.startRange.prevMonthDay,
body:not(.light-mode) .flatpickr-calendar .day.endRange.prevMonthDay,
body:not(.light-mode) .flatpickr-calendar .day.selected.nextMonthDay,
body:not(.light-mode) .flatpickr-calendar .day.startRange.nextMonthDay,
body:not(.light-mode) .flatpickr-calendar .day.endRange.nextMonthDay {
    background: #6366f1 !important;
    border-color: #6366f1 !important;
    color: #ffffff !important;
}

body:not(.light-mode) .flatpickr-calendar .day.inRange,
body:not(.light-mode) .flatpickr-calendar .day.prevMonthDay.inRange,
body:not(.light-mode) .flatpickr-calendar .day.nextMonthDay.inRange,
body:not(.light-mode) .flatpickr-calendar .day.today.inRange,
body:not(.light-mode) .flatpickr-calendar .day.prevMonthDay.today.inRange,
body:not(.light-mode) .flatpickr-calendar .day.nextMonthDay.today.inRange,
body:not(.light-mode) .flatpickr-calendar .day:hover,
body:not(.light-mode) .flatpickr-calendar .day.prevMonthDay:hover,
body:not(.light-mode) .flatpickr-calendar .day.nextMonthDay:hover,
body:not(.light-mode) .flatpickr-calendar .day:focus,
body:not(.light-mode) .flatpickr-calendar .day.prevMonthDay:focus,
body:not(.light-mode) .flatpickr-calendar .day.nextMonthDay:focus {
    background: rgba(99, 102, 241, 0.2) !important;
    border-color: rgba(99, 102, 241, 0.3) !important;
}

body:not(.light-mode) .flatpickr-calendar .day.today {
    border-color: #6366f1 !important;
}

body:not(.light-mode) .flatpickr-calendar .day.disabled,
body:not(.light-mode) .flatpickr-calendar .day.disabled:hover,
body:not(.light-mode) .flatpickr-calendar .day.prevMonthDay.disabled,
body:not(.light-mode) .flatpickr-calendar .day.nextMonthDay.disabled {
    color: #4b5563 !important;
    background: transparent !important;
    border-color: transparent !important;
}

/* Time picker */
body:not(.light-mode) .flatpickr-calendar .flatpickr-time {
    background: #16213e !important;
    border-top-color: #2d3748 !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-time .numInput,
body:not(.light-mode) .flatpickr-calendar .flatpickr-time .flatpickr-am-pm {
    background: #1e293b !important;
    color: #e4e4e7 !important;
    border: 1px solid #2d3748 !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-time .numInput:hover,
body:not(.light-mode) .flatpickr-calendar .flatpickr-time .flatpickr-am-pm:hover {
    background: #2d3748 !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-time .numInput:focus {
    background: #2d3748 !important;
    border-color: #6366f1 !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-time .flatpickr-time-separator,
body:not(.light-mode) .flatpickr-calendar .flatpickr-time .flatpickr-am-pm {
    color: #9ca3af !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-time .arrowUp,
body:not(.light-mode) .flatpickr-calendar .flatpickr-time .arrowDown {
    border-color: #9ca3af !important;
}

body:not(.light-mode) .flatpickr-calendar .flatpickr-time .arrowUp:hover,
body:not(.light-mode) .flatpickr-calendar .flatpickr-time .arrowDown:hover {
    border-color: #6366f1 !important;
}

/* Alt input (display input) */
body:not(.light-mode) .flatpickr-alt-input {
    background: var(--card-background) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

body:not(.light-mode) .flatpickr-alt-input:focus {
    border-color: var(--accent-primary) !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1) !important;
}

/* Ensure calendar appears on top */
.flatpickr-calendar {
    z-index: 99999 !important;
}

.flatpickr-calendar.open {
    z-index: 99999 !important;
}