/* ===========================================================
   Room Booking Module — CSS matching the ib-* mockup design
   Calendar/time-fields/price/button are native WooCommerce
   Bookings markup — styled here to visually match .ib-cal etc.
=========================================================== */

.room_booking_module .section_heading {
    margin-bottom: 24px;
}

.ib-booking__panel {
    position: relative;
    background: #fff;
    ackground: var(--ib-surface);
    border: 1px solid rgba(0, 21, 52, 0.1);
    border-radius: var(--ib-radius-lg);
    padding: 38px 40px;
}

/* --- Loading overlay: shown while page assets / calendar are still loading --- */
.ib-booking__loading {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.88);
    border-radius: var(--ib-radius-lg);
    z-index: 10;
    opacity: 1;
    transition: opacity 0.25s ease;
}

.ib-booking__loading[hidden] {
    display: none;
}

.ib-booking__loading.is-fading {
    opacity: 0;
}

.ib-booking__spinner {
    width: 34px;
    height: 34px;
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-top-color: var(--ib-primary, #2f5233);
    border-radius: 50%;
    animation: ib-booking-spin 0.7s linear infinite;
}

@keyframes ib-booking-spin {
    to { transform: rotate(360deg); }
}

/* --- Divider between room dropdown and calendar --- */
.ib-booking__rule {
    border: none;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    margin: 28px 0;
}

/* --- Generic field style (dropdown, native selects) --- */
.ib-field,
.room_booking_module__product select {
    display: block;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid rgba(0, 0, 0, 0.14);
    border-radius: 4px;
    font-size: 14px;
    background: #fff;
    color: #1a1a1a;
    appearance: none;
    -webkit-appearance: none;
}

.ib-field:focus,
.room_booking_module__product select:focus {
    outline: none;
    border-color: var(--ib-primary, #2f5233);
}

/* --- Helper / note text --- */
.ib-note {
    font-size: 12.5px;
    color: var(--ib-muted-green, #5b6b5e);
    line-height: 1.5;
}

/* --- Error box --- */
.room_booking_module__error,
#err {
    margin-top: 18px;
    font-size: 13px;
    color: #a23b2b;
    background: #f7e4df;
    border: 1px solid #e2b9af;
    border-radius: 2px;
    padding: 12px 16px;
}

.room_booking_module__empty {
    padding: 24px;
    text-align: center;
    color: var(--ib-muted-green, #5b6b5e);
}

/* --- Non-blocking duration notice (e.g. "booking more than 1 day? contact us") --- */
.ib-booking__duration-notice {
    margin-top: 18px;
    padding: 12px 16px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ib-muted-green, #5b6b5e);
    background: rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-left: 3px solid var(--ib-primary, #2f5233);
    border-radius: 2px;
}

.ib-booking__duration-notice a {
    color: var(--ib-primary, #2f5233);
    font-weight: 600;
    text-decoration: underline;
}


/* ===========================================================
   Native calendar (jQuery UI Datepicker) — skinned to match
   the .ib-cal design from the mockup
=========================================================== */



/* Header: prev/next + month label */
.room_booking_module__product .ui-datepicker-header {
  display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    background: var(--ib-surface);
}

.room_booking_module__product .ui-datepicker-prev,
.room_booking_module__product .ui-datepicker-next {
    font-family: inherit;
    
    width: 32px !important;
    height: 32px !important;
    cursor: pointer !important;
    background: var(--ib-secondary) !important;
    border-radius: 2px !important;
    margin: 10px !important;
    opacity: unset !important;
}

.room_booking_module__product .ui-datepicker-title {
    font-family: var(--ib-heading-font);
    font-size: 19px;
    color: var(--ib-secondary);
}

.wc-bookings-date-picker .ui-datepicker td {
    border-top: none !important;
    border-right: none !important;
}
.wc-bookings-date-picker .ui-datepicker td.bookable a.ui-state-default {
            background-color:var(--ib-surface) !important;
       color: var(--ib-text) !important;
 font-family: inherit;
    cursor: pointer;
     box-sizing: border-box;
     border: 1px solid var(--ib-surface) !important;
}
.wc-bookings-date-picker .ui-datepicker td.bookable a.ui-state-default:hover {
  border-color: var(--ib-accent-gold) !important;
    color: var(--ib-primary) !important;
}

.wc-bookings-date-picker .ui-datepicker td.bookable-range a.ui-state-default.ui-state-active {
    opacity: 1 !important;
    color: #fff !important;
    width: 100%;
    font-weight: bold !important;
      background-color: var(--ib-secondary) !important;
}

/* ===========================================================
   Time selects + computed price (native Bookings form fields)
=========================================================== */

.room_booking_module__product .wc-bookings-booking-form {
    margin-top: 20px;
}

.room_booking_module__product .wc-bookings-booking-form select {
    margin-top: 10px;
}

.room_booking_module__product .wc-bookings-booking-form label {
    display: block;
    font-size: 12px;
    color: var(--ib-muted-green, #5b6b5e);
    font-weight: 600;
    margin-top: 16px;
    margin-bottom: 6px;
}

.room_booking_module__product .wc-bookings-booking-cost {
    font-size: 13px;
    font-weight: 700;
    color: var(--ib-primary, #2f5233);
    margin-top: 14px;
}


/* ===========================================================
   Submit button (native "Book Now" / add to cart)
=========================================================== */
.woocommerce div.product form.cart .button.wc-bookings-booking-form-button.single_add_to_cart_button {
    margin-left: 1em;
    margin: 0 auto;
    font-weight: 700;
    padding: 0.5em 1.5em;
    font-family: var(--ib-font);
    font-weight: 700;
    padding: 15px 28px;
    border-radius: 2px;
    border: 1.5px solid transparent;
    transition: opacity var(--ib-transition);
    background: var(--ib-primary);
    color: var(--ib-cream);
    width: 100%;
}

.wc-bookings-date-picker .ui-datepicker td.fully_booked span {
    color: #454242 !important;
    cursor: not-allowed;
    background-color: unset !important;
}

.wc-bookings-date-picker .ui-datepicker td.fully_booked {
    background: repeating-linear-gradient(135deg, #f5f5f5 0 4px, #ebebeb 4px 8px);
}

.wc-bookings-date-picker .ui-datepicker td.bookable-range .ui-state-default {
    background: var(--ib-secondary) !important;
}

#wc-bookings-booking-form .partial_booked a:before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width: 0;
    height: 0;
    border-top: 20px solid red;
    border-right: 20px solid transparent;

}