/* ─── WPForms Hide Booked Slots — Styles ─────────────────────────────────── */

/* Fully-booked day: red background + strikethrough */
.flatpickr-day.whbs-fully-booked,
.flatpickr-day.whbs-fully-booked:hover {
    background-color : #fcebeb !important;
    color            : #a32d2d !important;
    border-color     : #f09595 !important;
    text-decoration  : line-through;
    pointer-events   : none;
    cursor           : not-allowed;
    opacity          : 1 !important;
}

/* Partially-booked day: amber dot below date number */
.flatpickr-day.whbs-partial-booked {
    position : relative;
}
.flatpickr-day.whbs-partial-booked::after {
    content          : '';
    position         : absolute;
    bottom           : 3px;
    left             : 50%;
    transform        : translateX(-50%);
    width            : 5px;
    height           : 5px;
    border-radius    : 50%;
    background-color : #ba7517;
    pointer-events   : none;
}

/* Booked hour option inside time dropdown */
select option.whbs-hour-booked {
    color            : #a32d2d;
    background-color : #fcebeb;
    font-style       : italic;
}

/* Legend strip shown below the flatpickr calendar */
.whbs-legend {
    display          : flex;
    gap              : 16px;
    padding          : 6px 10px 8px;
    font-size        : 11px;
    color            : #888;
    border-top       : 1px solid #f0ede8;
    margin-top       : 2px;
}
.whbs-legend span {
    display          : flex;
    align-items      : center;
    gap              : 5px;
}
.whbs-legend .dot {
    display          : inline-block;
    width            : 9px;
    height           : 9px;
    border-radius    : 50%;
    flex-shrink      : 0;
}
.whbs-legend .dot-full    { background-color: #f09595; }
.whbs-legend .dot-partial { background-color: #ef9f27; }

/* Booked-time warning message */
.whbs-time-warning {
    display          : flex;
    align-items      : center;
    gap              : 8px;
    margin-top       : 8px;
    padding          : 8px 12px;
    background-color : #fcebeb;
    color            : #a32d2d;
    border           : 1px solid #f09595;
    border-radius    : 6px;
    font-size        : 13px;
    animation        : whbs-fade-in 0.2s ease;
}
@keyframes whbs-fade-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}