/* Styles Flatpickr optimisés pour mobile */

/* Input du datepicker */
.form-input.flatpickr-input {
    cursor: pointer;
    width: 100%;
    padding: 0.75rem 1rem;
    border: 2px solid #fed7aa;
    border-radius: 20px;
    font-size: 1rem;
    background: white;
}

.form-input.flatpickr-input:focus {
    outline: none;
    border-color: #ea580c;
}

/* Conteneur du calendrier */
.flatpickr-calendar {
    width: 90vw !important;
    max-width: 100% !important;
    font-size: 16px !important;
}

/* Sur mobile, augmenter la taille du calendrier */
@media (max-width: 768px) {
    .flatpickr-calendar {
        width: 95vw !important;
        left: 2.5vw !important;
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3) !important;
    }

    /* Augmenter la taille des boutons */
    .flatpickr-days .flatpickr-day {
        padding: 12px !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
        height: auto !important;
        width: auto !important;
        flex: 1 1 calc(14.28% - 4px) !important;
    }

    /* Augmenter la taille des jours de la semaine */
    .flatpickr-weekdays {
        font-size: 14px !important;
        padding: 12px 0 !important;
    }

    .flatpickr-weekday {
        font-size: 14px !important;
        font-weight: 600 !important;
    }

    /* Augmenter la taille des contrôles du mois/année */
    .flatpickr-month {
        font-size: 18px !important;
    }

    .flatpickr-prev-month,
    .flatpickr-next-month {
        height: 34px !important;
        width: 34px !important;
        padding: 4px !important;
    }

    .flatpickr-prev-month svg,
    .flatpickr-next-month svg {
        width: 20px !important;
        height: 20px !important;
    }

    /* Couleurs cohérentes avec le site */
    .flatpickr-day.selected,
    .flatpickr-day.prevMonthDay.selected,
    .flatpickr-day.nextMonthDay.selected,
    .flatpickr-day.today.selected,
    .flatpickr-day.today.prevMonthDay.selected,
    .flatpickr-day.today.nextMonthDay.selected {
        background: #ea580c !important;
        border-color: #ea580c !important;
    }

    .flatpickr-day.inRange {
        background: rgba(234, 88, 12, 0.1) !important;
    }

    .flatpickr-day:hover,
    .flatpickr-day:focus {
        background: rgba(234, 88, 12, 0.2) !important;
    }

    .flatpickr-day.today {
        border-color: #c2410c !important;
    }

    .flatpickr-day.disabled {
        color: #ccc !important;
        background: #f5f5f5 !important;
        cursor: not-allowed !important;
    }
}

/* Affichage au survol */
.flatpickr-calendar.open {
    z-index: 99999 !important;
}

/* Réduction du padding sur mobile */
@media (max-width: 480px) {
    .flatpickr-calendar {
        width: 98vw !important;
        left: 1vw !important;
    }

    .flatpickr-days .flatpickr-day {
        padding: 10px !important;
    }

    .flatpickr-prev-month,
    .flatpickr-next-month {
        height: 30px !important;
        width: 30px !important;
    }
}
