/*
 * Lalamove Plugin: Flatpickr UI Fix (v5)
 *
 * This version is more specific and aggressive.
 * We are targeting the 'hasTime' class that Flatpickr adds
 * and forcing the time section to have a display and height.
 */

/*
 * Give the calendar a set width.
 * Flatpickr's default is too small.
 * 350px should be wide enough for 7 days.
 */
div.flatpickr-calendar {
    width: 310px !important;
    /* Set a fixed, wider width */
    max-width: 350px !important;
    box-sizing: border-box;
}

/*
 * +++ THIS IS THE MAIN FIX +++
 *
 * This forces the time picker to be visible.
 * Your theme is likely setting 'display: none' on this.
 */
div.flatpickr-calendar.hasTime .flatpickr-time {
    display: block !important;
    /* Force it to display */
    visibility: visible !important;
    /* Force it to be visible */
    height: auto !important;
    /* Force it to have a height */
    opacity: 1 !important;
    /* Force it to be opaque */
}

/* --- The rest is for the calendar day layout (v3) --- */

/* Ensure the day/weekday containers fill the calendar */
div.flatpickr-calendar .flatpickr-rContainer,
div.flatpickr-calendar .flatpickr-days,
div.flatpickr-calendar .flatpickr-weekdays {
    width: 100% !important;
    box-sizing: border-box;
}

/* Ensure the weekday *container* uses flex */
div.flatpickr-calendar .flatpickr-weekdaycontainer {
    display: flex;
    width: 100%;
    box-sizing: border-box;
}

/*
 * Fix for the 7-day layout
 */
div.flatpickr-calendar span.flatpickr-weekday,
div.flatpickr-calendar span.flatpickr-day {
    flex-grow: 1;
    flex-basis: 14.2857143%;
    /* 100% / 7 */
    max-width: 14.2857143%;

    box-sizing: border-box;
    /* Critical */

    padding: 0.25em;
    /* Simplified padding */
    text-align: center;
    margin: 0;
}

/* Target the day container itself */
div.flatpickr-calendar .dayContainer {
    width: 100%;
    box-sizing: border-box;
}

div.flatpickr-calendar .flatpickr-clear {
    display: inline-block !important;
    /* Force it to display */
    visibility: visible !important;
    opacity: 1 !important;
}