/* Event Form Enhancements Styles */

/* Flatpickr Calendar Widget Customization - Override CDN styles */
.flatpickr-calendar.flatpickr-calendar {
    border-radius: 0.5rem !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
    border: 1px solid var(--color-gevent-300) !important;
    font-family: 'Poppins', sans-serif !important;
    background: var(--color-gevent-50) !important;
    padding: 0.5rem !important;
}

.flatpickr-calendar.flatpickr-calendar.dark {
    border-color: var(--color-gevent-400) !important;
    background: var(--color-gevent-700) !important;
}

.flatpickr-calendar .flatpickr-months {
    background: var(--color-gevent-100) !important;
    border-radius: 0.5rem 0.5rem 0 0 !important;
    padding: 0.75rem !important;
    margin-bottom: 0.5rem !important;
}

.flatpickr-calendar.dark .flatpickr-months {
    background: var(--color-gevent-600) !important;
}

.flatpickr-calendar .flatpickr-current-month {
    color: var(--color-gevent-700) !important;
    font-weight: 600 !important;
    padding: 0.25rem 0.5rem !important;
}

.flatpickr-calendar.dark .flatpickr-current-month {
    color: var(--color-gevent-50) !important;
}

.flatpickr-calendar .flatpickr-weekdays {
    background: var(--color-gevent-200) !important;
    font-weight: 500 !important;
    padding: 0.5rem 0 !important;
    margin-bottom: 0.25rem !important;
}

.flatpickr-calendar.dark .flatpickr-weekdays {
    background: var(--color-gevent-600) !important;
}

.flatpickr-calendar .flatpickr-weekday {
    color: var(--color-gevent-600) !important;
    font-weight: 500 !important;
    padding: 0.5rem !important;
}

.flatpickr-calendar.dark .flatpickr-weekday {
    color: var(--color-gevent-200) !important;
}

.flatpickr-calendar .flatpickr-day {
    color: var(--color-gevent-700) !important;
    border-radius: 0.375rem !important;
    margin: 2px !important;
    padding: 0.5rem !important;
    min-height: 2.5rem !important;
    min-width: 2.5rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.flatpickr-calendar.dark .flatpickr-day {
    color: var(--color-gevent-100) !important;
}

.flatpickr-calendar .flatpickr-day:hover {
    background: var(--color-gevent-200) !important;
    border-color: var(--color-gevent-400) !important;
}

.flatpickr-calendar.dark .flatpickr-day:hover {
    background: var(--color-gevent-600) !important;
    border-color: var(--color-gevent-400) !important;
}

.flatpickr-calendar .flatpickr-day.selected {
    background: var(--color-gevent-500) !important; /* Your primary green */
    border-color: var(--color-gevent-500) !important;
    color: var(--color-gevent-50) !important;
}

.flatpickr-calendar .flatpickr-day.selected:hover {
    background: var(--color-gevent-600) !important; /* Darker green for hover */
    border-color: var(--color-gevent-600) !important;
}

.flatpickr-calendar .flatpickr-day.today {
    border-color: var(--color-yevent-500) !important; /* Your yellow accent */
    color: var(--color-gevent-500) !important;
    font-weight: 600 !important;
}

.flatpickr-calendar.dark .flatpickr-day.today {
    border-color: var(--color-yevent-500) !important;
    color: var(--color-yevent-500) !important;
}

.flatpickr-calendar .flatpickr-day.disabled {
    color: var(--color-gevent-300) !important;
}

.flatpickr-calendar.dark .flatpickr-day.disabled {
    color: var(--color-gevent-400) !important;
}

/* Month navigation arrows */
.flatpickr-calendar .flatpickr-prev-month, 
.flatpickr-calendar .flatpickr-next-month {
    color: var(--color-gevent-500) !important;
    padding: 0.5rem !important;
    border-radius: 0.375rem !important;
    transition: all 0.2s ease !important;
}

.flatpickr-calendar .flatpickr-prev-month:hover, 
.flatpickr-calendar .flatpickr-next-month:hover {
    color: var(--color-gevent-600) !important;
    background: var(--color-gevent-100) !important;
}

.flatpickr-calendar.dark .flatpickr-prev-month,
.flatpickr-calendar.dark .flatpickr-next-month {
    color: var(--color-yevent-500) !important;
}

.flatpickr-calendar.dark .flatpickr-prev-month:hover,
.flatpickr-calendar.dark .flatpickr-next-month:hover {
    color: var(--color-yevent-400) !important;
}

/* Input field enhancements */
.flatpickr-input {
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.flatpickr-input:focus {
    border-color: var(--color-gevent-500) !important;
    box-shadow: 0 0 0 3px rgba(3, 66, 42, 0.1) !important;
}

/* Address Autocomplete Suggestions */
.address-suggestions {
    border-radius: 0 0 0.5rem 0.5rem !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
    font-family: 'Poppins', sans-serif !important;
}

.address-suggestion-item {
    transition: background-color 0.15s ease-in-out !important;
}

.address-suggestion-item:hover {
    background-color: #f3f4f6 !important;
}

.dark .address-suggestion-item:hover {
    background-color: #4b5563 !important;
}

/* Location field with icon styling */
.location-input-wrapper {
    position: relative !important;
}

.location-input-wrapper .location-icon {
    pointer-events: none !important;
    z-index: 10 !important;
}

/* Enhanced input focus states */
.enhanced-input:focus-within {
    border-color: var(--color-gevent-500) !important;
    box-shadow: 0 0 0 3px rgba(3, 66, 42, 0.1) !important;
}

.dark .enhanced-input:focus-within {
    border-color: var(--color-yevent-500) !important;
    box-shadow: 0 0 0 3px rgba(255, 189, 89, 0.1) !important;
}

/* Loading states */
.address-loading {
    position: relative !important;
}

.address-loading::after {
    content: '';
    position: absolute;
    right: 2.5rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1rem;
    height: 1rem;
    border: 2px solid var(--color-gevent-300);
    border-top-color: var(--color-gevent-500);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: translateY(-50%) rotate(360deg);
    }
}

/* Calendar days container spacing */
.flatpickr-calendar .flatpickr-days {
    padding: 0.25rem !important;
}

.flatpickr-calendar .flatpickr-innerContainer {
    padding: 0.5rem !important;
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .flatpickr-calendar {
        font-size: 0.875rem !important;
        padding: 0.25rem !important;
    }
    
    .flatpickr-day {
        min-height: 2rem !important;
        min-width: 2rem !important;
        padding: 0.25rem !important;
    }
    
    .flatpickr-months {
        padding: 0.5rem !important;
    }
    
    .address-suggestions {
        max-height: 200px !important;
        overflow-y: auto !important;
    }
}

/* Dark mode specific adjustments */
.dark .flatpickr-calendar {
    background: #374151 !important;
    border-color: #4b5563 !important;
}

.dark .flatpickr-months {
    background: #4b5563 !important;
}

.dark .flatpickr-weekdays {
    background: #374151 !important;
}

/* Animation for smooth transitions */
.flatpickr-calendar {
    animation: fadeInScale 0.2s ease-out;
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Address suggestions animation */
.address-suggestions {
    animation: slideDown 0.2s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}