/*
 * ================================================================
 * YITH WooCommerce Booking Form — Modern Theme
 * Drop this into WordPress → Appearance → Customise → Additional CSS
 * (or enqueue from your child theme / snippet plugin)
 *
 * Inspired by: Airbnb, Eventbrite & Calendly
 * Primary colour: #2563eb default (Tailwind blue-600) — overridden by --wcbk-primary
 * ================================================================
 */


/* ----------------------------------------------------------------
   1. PLUGIN CSS-VARIABLE OVERRIDES
   Overrides YITH's defaults in assets/css/global.css so any rule
   that still references --yith-wcbk-* variables uses our palette.
   ---------------------------------------------------------------- */
/* ── Admin-editable CSS variables (Booking and Appointment → Appearance) ── */
:root {
    /* These are set by YITH_WCBK_Appearance::output_css_vars() in wp_head.
       The values below are the fallback defaults used when no admin override
       has been saved. */
    --wcbk-primary:       #2563eb;
    --wcbk-primary-hover: #1d4ed8;
    --wcbk-btn-text:      #ffffff;
    --wcbk-field-bg:      #ffffff;
    --wcbk-field-border:  #e5e7eb;
    --wcbk-field-focus:   #2563eb;
    --wcbk-label:         #6b7280;
    --wcbk-text:          #111827;
    --wcbk-focus-shadow:  0 0 0 3px rgba(37,99,235,0.15);
    --wcbk-btn-shadow:    0 2px 8px rgba(37,99,235,0.30);
    --wcbk-btn-hover-shadow: 0 4px 14px rgba(37,99,235,0.30);

    /* YITH plugin variable overrides — point YITH's own vars at ours */
    --yith-wcbk-primary:              var(--wcbk-primary);
    --yith-wcbk-primary-light:        var(--wcbk-primary-hover);
    --yith-wcbk-primary-contrast:     var(--wcbk-btn-text);
    --yith-wcbk-border-color:         var(--wcbk-field-border);
    --yith-wcbk-border-color-focus:   var(--wcbk-field-focus);
    --yith-wcbk-shadow-color-focus:   rgba(37, 99, 235, 0.15);
    --yith-wcbk-shadow-focus:         var(--wcbk-focus-shadow);
    --yith-wcbk-shadow:               0 4px 6px -1px rgba(0,0,0,.10), 0 2px 4px -1px rgba(0,0,0,.06);
    --yith-wcbk-underlined-bg:        color-mix(in srgb, var(--wcbk-primary) 8%, #ffffff);
    --yith-wcbk-underlined-text:      var(--wcbk-primary-hover);
    --yith-wcbk-success:              #059669;
    --yith-wcbk-discount:             #059669;
    --yith-wcbk-error:                #dc2626;
}


/* ----------------------------------------------------------------
   2. FORM BASE
   ---------------------------------------------------------------- */
.price { display: none !important; }

.yith-wcbk-booking-form {
    max-width: 700px;
    margin-bottom: 2rem;
    box-sizing: border-box;
    font-family: inherit;
    color: #111827;
    font-size: 15px;
    line-height: 1.5;
}

.yith-wcbk-booking-form * {
    box-sizing: border-box;
}


/* ----------------------------------------------------------------
   3. SECTION LABELS
   ---------------------------------------------------------------- */
.yith-wcbk-booking-form label.yith-wcbk-booking-form__label,
.yith-wcbk-booking-form label.yith-wcbk-form-section__label {
    display: block;
    font-weight: 600;
    font-size: 0.8125rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--wcbk-label, #6b7280);
    margin: 0 0 0.5rem;
    padding: 0;
}

.yith-wcbk-form-section {
    padding: 0;
    margin-bottom: 1.25rem;
    position: relative;
}


/* ----------------------------------------------------------------
   4. GENERIC INPUT / SELECT / TEXTAREA
   The range-picker inputs are handled separately in section 6.
   ---------------------------------------------------------------- */
.yith-wcbk-booking-form input:not([type='checkbox']):not(.yith-wcbk-date-picker):not(.yith-wcbk-number-minifield),
.yith-wcbk-booking-form input.yith-wcbk-date-picker--formatted,
.yith-wcbk-booking-form select,
.yith-wcbk-booking-form textarea {
    width: 100% !important;
    height: auto;
    min-height: 52px;
    display: block;
    outline: none;
    background: var(--wcbk-field-bg, #ffffff);
    border: 1.5px solid var(--wcbk-field-border, #e5e7eb);
    border-radius: 10px;
    color: var(--wcbk-text, #111827);
    padding: 0 16px;
    font-size: 0.9375rem;
    line-height: 1.5;
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.yith-wcbk-booking-form input:not([type='checkbox']):not(.yith-wcbk-date-picker):not(.yith-wcbk-number-minifield):hover,
.yith-wcbk-booking-form select:hover {
    border-color: #d1d5db;
}

.yith-wcbk-booking-form input:not([type='checkbox']):not(.yith-wcbk-date-picker):not(.yith-wcbk-number-minifield):focus,
.yith-wcbk-booking-form input.yith-wcbk-date-picker--formatted:focus,
.yith-wcbk-booking-form select:focus,
.yith-wcbk-booking-form textarea:focus {
    border-color: var(--wcbk-field-focus, var(--wcbk-primary, #2563eb));
    box-shadow: var(--wcbk-focus-shadow, 0 0 0 3px rgba(37,99,235,0.15));
}

.yith-wcbk-booking-form input:not([type='checkbox']):disabled,
.yith-wcbk-booking-form select:disabled,
.yith-wcbk-booking-form textarea:disabled {
    opacity: 0.55;
    background: #f9fafb;
    cursor: not-allowed;
}

.yith-wcbk-booking-form input::placeholder {
    color: #9ca3af;
}

/* Custom select arrow */
.yith-wcbk-booking-form select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5l5 5 5-5' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 44px;
    cursor: pointer;
}

/* Duration inline input */
.yith-wcbk-booking-form input:not([type='checkbox']).yith-wcbk-booking-real-duration {
    width: 80px !important;
    display: inline-block;
    margin-right: 8px;
    min-width: 0;
    text-align: center;
    padding: 0 12px;
    min-height: 48px;
}

/* Service quantity */
.yith-wcbk-booking-form input.yith-wcbk-booking-service-quantity {
    width: 70px !important;
    display: inline-block;
}


/* ----------------------------------------------------------------
   5. SINGLE DATE PICKER (with wrapper)
   ---------------------------------------------------------------- */
.yith-wcbk-date-picker-wrapper {
    position: relative;
    width: 100%;
}

/* The hidden real input */
input.yith-wcbk-date-picker {
    opacity: 0;
    position: absolute;
    z-index: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    font-size: inherit;
}

.yith-wcbk-date-picker-wrapper input.yith-wcbk-date-picker--formatted {
    width: 100% !important;
    min-height: 52px;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    color: #111827;
    padding: 0 48px 0 16px;
    font-size: 0.9375rem;
    display: block;
    transition: border-color .2s ease, box-shadow .2s ease;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

.yith-wcbk-date-picker-wrapper input.yith-wcbk-date-picker--formatted:hover {
    border-color: #d1d5db;
}

.yith-wcbk-date-picker-wrapper input.yith-wcbk-date-picker:focus + .yith-wcbk-date-picker--formatted {
    border-color: var(--wcbk-primary, #2563eb);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.yith-wcbk-date-picker-wrapper .yith-wcbk-booking-date-icon {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    z-index: 5;
    pointer-events: none;
    opacity: 0.75;
    transition: color .2s ease, opacity .2s ease;
}

.yith-wcbk-date-picker-wrapper input.yith-wcbk-date-picker:focus + .yith-wcbk-date-picker--formatted + .yith-wcbk-booking-date-icon {
    color: var(--wcbk-primary, #2563eb);
    opacity: 1;
}


/* ----------------------------------------------------------------
   6. DATE RANGE PICKER — Airbnb-style unified container
   The plugin floats inputs at 50% inside this container.
   We preserve that layout and just modernise the appearance.
   ---------------------------------------------------------------- */
.yith-wcbk-date-range-picker {
    width: 100%;
    position: relative;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    color: #111827;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.yith-wcbk-date-range-picker::after {
    /* clearfix */
    content: "";
    display: table;
    clear: both;
}

/* Both actual + formatted inputs — respect plugin's float: left; width: 50% */
.yith-wcbk-date-range-picker input.yith-wcbk-date-picker,
.yith-wcbk-booking-form .yith-wcbk-date-range-picker input.yith-wcbk-date-picker {
    opacity: 0;
    position: absolute;
    z-index: 0;
    background: transparent;
    border: none !important;
    box-shadow: none !important;
    padding: 0;
    height: 100%;
    float: left;
}

.yith-wcbk-date-range-picker input.yith-wcbk-date-picker--formatted,
.yith-wcbk-booking-form .yith-wcbk-date-range-picker input.yith-wcbk-date-picker--formatted {
    /* Override the 100% width from generic rule — 50% is set by plugin with higher specificity,
       but we reinforce it here and strip the borders applied by the generic rule */
    width: 50% !important;
    float: left;
    min-height: 52px;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 16px !important;
    font-size: 0.9375rem;
    color: #111827;
    cursor: pointer;
    line-height: 52px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background-color .15s ease;
}

.yith-wcbk-date-range-picker input.yith-wcbk-date-picker--formatted::placeholder {
    color: #9ca3af;
    font-size: 0.875rem;
}

.yith-wcbk-date-range-picker input.yith-wcbk-date-picker--formatted:not(:placeholder-shown) {
    font-weight: 600;
}

.yith-wcbk-date-range-picker input.yith-wcbk-date-picker--formatted:hover {
    background-color: #f9fafb !important;
}

/* Replace the arrow with a clean vertical divider line */
.yith-wcbk-date-range-picker .yith-wcbk-date-range-picker__arrow {
    position: absolute;
    left: 50%;
    top: 20%;
    height: 60%;
    width: 1px;
    background: #e5e7eb;
    transform: translateX(-50%);
    z-index: 5;
    font-size: 0;
    color: transparent;
    pointer-events: none;
}

/* Hide any icon glyph rendered inside the arrow element */
.yith-wcbk-date-range-picker .yith-wcbk-date-range-picker__arrow::before {
    display: none !important;
}

/* Opened / focus state */
.yith-wcbk-date-range-picker--opened,
.yith-wcbk-date-range-picker:focus-within {
    border-color: var(--wcbk-primary, #2563eb);
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

/* Highlight the active half */
.yith-wcbk-date-range-picker.yith-wcbk-date-range-picker--opened-from
  input.yith-wcbk-date-picker--formatted.yith-wcbk-booking-start-date,
.yith-wcbk-date-range-picker.yith-wcbk-date-range-picker--opened-to
  input.yith-wcbk-date-picker--formatted.yith-wcbk-booking-end-date {
    background-color: color-mix(in srgb, var(--wcbk-primary, #2563eb) 8%, #ffffff) !important;
    color: color-mix(in srgb, var(--wcbk-primary, #2563eb) 75%, #000000) !important;
    /* Undo plugin's rounded pill highlight */
    border-radius: 0 !important;
    border: none !important;
    padding: 0 16px !important;
}

.yith-wcbk-date-range-picker.yith-wcbk-date-range-picker--opened-from
  input.yith-wcbk-date-picker--formatted.yith-wcbk-booking-start-date::placeholder,
.yith-wcbk-date-range-picker.yith-wcbk-date-range-picker--opened-to
  input.yith-wcbk-date-picker--formatted.yith-wcbk-booking-end-date::placeholder {
    color: var(--wcbk-primary, #2563eb);
    opacity: 0.8;
}


/* ----------------------------------------------------------------
   7. DATE PICKER CALENDAR
   ---------------------------------------------------------------- */
#ui-datepicker-div.yith-wcbk-datepicker.ui-widget-content,
.yith-wcbk-date-picker--inline .ui-widget.ui-widget-content {
    font-family: inherit;
    background: #fff;
    border: 1px solid #e5e7eb !important;
    border-radius: 16px;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,.10),
                0 8px 10px -6px rgba(0,0,0,.06) !important;
    width: 340px;
    padding: 20px;
    z-index: 9999 !important;
}

.yith-wcbk-date-picker--inline .ui-widget.ui-widget-content {
    width: 100%;
    box-shadow: none !important;
    border-radius: 12px;
}

/* Header */
.yith-wcbk-datepicker .ui-datepicker-header,
.yith-wcbk-date-picker--inline .ui-datepicker-header {
    border: none;
    background: transparent;
    border-radius: 0;
    padding-bottom: 12px;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-title,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-title {
    font-size: 15px;
    font-weight: 700;
    color: #111827;
    line-height: 36px;
}

/* Prev / next buttons */
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-prev,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-prev,
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-next,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-next {
    border: none;
    background: transparent;
    cursor: pointer;
    top: 8px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    transition: background .2s ease;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-prev:hover,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-prev:hover,
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-next:hover,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-next:hover {
    background: #f3f4f6;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-prev { left: 0; }
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-next { right: 0; }
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-prev { left: 0; }
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-next { right: 0; }

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-prev span,
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-next span,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-prev span,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-next span {
    position: static;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-prev span::after,
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-next span::after,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-prev span::after,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-next span::after {
    font-family: Dashicons;
    text-indent: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    speak: none;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    line-height: 2.25;
    text-align: center;
    font-weight: 400;
    color: #374151;
    font-size: 16px;
    margin: 0;
    transition: color .2s ease;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-prev:hover span::after,
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-next:hover span::after,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-prev:hover span::after,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-next:hover span::after {
    color: var(--wcbk-primary, #2563eb);
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-prev span::after,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-prev span::after {
    content: "\f341";
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-next span::after,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-next span::after {
    content: "\f345";
}

/* Calendar table */
.yith-wcbk-datepicker.ui-datepicker table,
.yith-wcbk-date-picker--inline .ui-datepicker table {
    width: 100%;
    margin: 8px 0 0;
    border: none;
    font-size: 13px;
}

.yith-wcbk-datepicker.ui-datepicker tr,
.yith-wcbk-date-picker--inline .ui-datepicker tr {
    border: 0;
}

.yith-wcbk-datepicker.ui-datepicker th,
.yith-wcbk-date-picker--inline .ui-datepicker th {
    padding: 6px 0;
    font-weight: 700;
    font-size: 10px;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    text-align: center;
}

.yith-wcbk-datepicker.ui-datepicker td,
.yith-wcbk-date-picker--inline .ui-datepicker td {
    padding: 2px !important;
    border: none;
    background: transparent;
    text-align: center;
    width: auto;
}

.yith-wcbk-datepicker.ui-datepicker td span,
.yith-wcbk-datepicker.ui-datepicker td a,
.yith-wcbk-date-picker--inline .ui-datepicker td span,
.yith-wcbk-date-picker--inline .ui-datepicker td a {
    text-align: center;
    display: block;
    padding: 7px 4px;
    border-radius: 8px;
    transition: all .15s ease;
}

.yith-wcbk-datepicker .ui-state-default,
.yith-wcbk-datepicker.ui-widget-content .ui-state-default,
.yith-wcbk-date-picker--inline .ui-state-default,
.yith-wcbk-date-picker--inline .ui-widget-content .ui-state-default {
    border: none;
    background: transparent;
    font-weight: 500;
    color: #374151;
    border-radius: 8px;
}

.yith-wcbk-datepicker.ui-datepicker td:not(.ui-state-disabled):hover a,
.yith-wcbk-date-picker--inline .ui-datepicker td:not(.ui-state-disabled):hover a {
    background: color-mix(in srgb, var(--wcbk-primary, #2563eb) 20%, #ffffff) !important; /* blue-100 — clearly interactive */
    color: color-mix(in srgb, var(--wcbk-primary, #2563eb) 75%, #000000) !important;      /* blue-800 — dark enough to read on any bg */
    border-color: transparent !important;
}

.yith-wcbk-datepicker.ui-datepicker td.ui-datepicker-current-day a,
.yith-wcbk-date-picker--inline .ui-datepicker td.ui-datepicker-current-day a,
.yith-wcbk-datepicker.ui-datepicker td a.ui-state-active,
.yith-wcbk-date-picker--inline .ui-datepicker td a.ui-state-active {
    background: var(--wcbk-primary, #2563eb);
    color: #fff;
    font-weight: 600;
}

.yith-wcbk-datepicker.ui-datepicker td a.ui-state-active::before,
.yith-wcbk-date-picker--inline .ui-datepicker td a.ui-state-active::before {
    display: none;
}

.yith-wcbk-datepicker.ui-datepicker td.ui-datepicker-other-month,
.yith-wcbk-date-picker--inline .ui-datepicker td.ui-datepicker-other-month {
    opacity: 0.25;
    border: none;
}

.yith-wcbk-datepicker .ui-datepicker-calendar tbody td.ui-state-disabled {
    opacity: 0.3;
}

.yith-wcbk-datepicker.ui-widget-content .ui-datepicker-unselectable:not(.ui-datepicker-other-month),
.yith-wcbk-date-picker--inline .ui-widget-content .ui-datepicker-unselectable:not(.ui-datepicker-other-month) {
    text-decoration: line-through;
    text-decoration-color: #d1d5db;
}

/* Button pane */
.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-buttonpane {
    border: none;
    background: transparent;
    text-align: center;
    margin: 8px 0 0;
    padding: 0;
    line-height: normal;
    height: auto;
}

.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-buttonpane {
    display: none;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-current,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-current {
    display: none !important;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-close,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-close {
    text-transform: none;
    border: none;
    background: transparent;
    font-weight: 600;
    color: var(--wcbk-primary, #2563eb);
    font-size: 13px;
    float: none;
    margin: 0;
    cursor: pointer;
    transition: color .2s ease;
}

.yith-wcbk-datepicker.ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-close:hover,
.yith-wcbk-date-picker--inline .ui-datepicker .ui-datepicker-buttonpane .ui-datepicker-close:hover {
    color: var(--wcbk-primary-hover, #1d4ed8);
    text-decoration: underline;
}

/* Inline / full-width calendar */
.yith-wcbk-form-section__content .yith-wcbk-date-picker--inline,
.yith-wcbk-date-picker-inline-wrapper,
.yith-wcbk-date-picker--inline .ui-datepicker-inline,
.yith-wcbk-date-picker--inline .ui-datepicker {
    width: 100% !important;
    max-width: 100% !important;
}

.yith-wcbk-date-picker--inline .ui-datepicker table {
    width: 100% !important;
}

.yith-wcbk-date-picker--inline .ui-datepicker td {
    width: auto !important;
}

/* Static datepicker positioning */
.yith-wcbk-datepicker--static {
    position: absolute !important;
    top: auto !important;
    left: auto !important;
    max-width: 100% !important;
}

.yith_wcbk_booking_product_form_widget .yith-wcbk-datepicker--static {
    min-width: max(280px, 100%) !important;
}

/* Neutralise jQuery UI hover/focus interference on non-date elements.
   We DO NOT reset color here so our td a:hover rule above can own it. */
.yith-wcbk-datepicker .ui-widget-content .ui-state-hover,
.yith-wcbk-datepicker .ui-widget-content .ui-state-focus,
.yith-wcbk-date-picker--inline .ui-widget-content .ui-state-hover,
.yith-wcbk-date-picker--inline .ui-widget-content .ui-state-focus,
.yith-wcbk-datepicker .ui-state-hover,
.yith-wcbk-datepicker .ui-widget-header .ui-state-hover,
.yith-wcbk-datepicker .ui-state-focus,
.yith-wcbk-datepicker .ui-widget-header .ui-state-focus,
.yith-wcbk-date-picker--inline .ui-state-hover,
.yith-wcbk-date-picker--inline .ui-widget-header .ui-state-hover,
.yith-wcbk-date-picker--inline .ui-state-focus,
.yith-wcbk-date-picker--inline .ui-widget-header .ui-state-focus {
    background: transparent !important;
    border: none !important;
    color: inherit !important;
}

.yith-wcbk-datepicker .ui-widget-header .ui-icon,
.yith-wcbk-date-picker--inline .ui-widget-header .ui-icon {
    background: transparent;
}


/* Legacy .person-stepper elements (from old Code Snippet implementations)
   are now hidden by booking-form-steppers.js — no CSS needed here.        */
.person-stepper { display: none !important; }

/* Persons section layout */
.yith-wcbk-form-section-persons-wrapper,
.yith-wcbk-form-section-person-types {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    gap: 1.5rem !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
}

.yith-wcbk-form-section-person-types {
    flex: 0 0 auto !important;
    width: auto !important;
}


/* ----------------------------------------------------------------
   9. PEOPLE SELECTOR (modern dropdown)
   ---------------------------------------------------------------- */
.yith-wcbk-people-selector {
    position: relative;
    user-select: none;
    width: 100%;
    font-size: 0.9375rem;
    color: #111827;
}

.yith-wcbk-people-selector__toggle-handler {
    position: relative;
    min-height: 52px;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    padding: 8px 44px 8px 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.yith-wcbk-people-selector__toggle-handler:hover {
    border-color: #d1d5db;
}

.yith-wcbk-people-selector--opened .yith-wcbk-people-selector__toggle-handler {
    border-color: var(--wcbk-primary, #2563eb);
    border-radius: 10px 10px 0 0;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

/* Replace glyph arrow with a CSS chevron */
.yith-wcbk-people-selector__toggle-handler::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5l5 5 5-5' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    transition: transform .2s ease;
    font-size: 0;
    font-family: inherit;
}

.yith-wcbk-people-selector--opened .yith-wcbk-people-selector__toggle-handler::after {
    transform: translateY(-50%) rotate(180deg);
}

.yith-wcbk-people-selector__totals {
    font-weight: 500;
    color: #111827;
    display: inline-block;
    padding: 0;
    border-radius: 0;
    line-height: 1.4;
    background: transparent !important;
}

.yith-wcbk-people-selector--opened .yith-wcbk-people-selector__totals {
    background: transparent;
    color: #111827;
}

/* Dropdown container */
.yith-wcbk-people-selector__fields-container {
    display: none;
    position: absolute;
    width: 100%;
    right: 0;
    background: #fff;
    border: 1.5px solid var(--wcbk-primary, #2563eb);
    border-top: none;
    border-radius: 0 0 10px 10px;
    z-index: 9999;
    margin-top: 0;
    min-width: 280px;
    box-shadow: 0 8px 16px -4px rgba(0,0,0,.12);
    padding: 0;
}

/* Remove triangle arrows */
.yith-wcbk-people-selector__fields-container::before,
.yith-wcbk-people-selector__fields-container::after {
    display: none !important;
}

.yith-wcbk-people-selector__field {
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f3f4f6;
}

.yith-wcbk-people-selector__field:last-of-type {
    border-bottom: none;
}

.yith-wcbk-people-selector__field__title {
    float: none;
    font-weight: 500;
    font-size: 0.9375rem;
    color: #111827;
    line-height: 1.4;
}

.yith-wcbk-people-selector__field__totals {
    float: none;
    display: flex;
    align-items: center;
    gap: 0;
}

.yith-wcbk-people-selector__field__plus,
.yith-wcbk-people-selector__field__minus,
.yith-wcbk-people-selector__field__total {
    display: flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

.yith-wcbk-people-selector__field__plus,
.yith-wcbk-people-selector__field__minus {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1.5px solid var(--wcbk-primary, #2563eb);
    background: transparent;
    cursor: pointer;
    color: var(--wcbk-primary, #2563eb);
    font-size: 1.125rem;
    transition: background .15s ease, color .15s ease;
    position: relative;
}

.yith-wcbk-people-selector__field__plus:hover,
.yith-wcbk-people-selector__field__minus:hover {
    background: var(--wcbk-primary, #2563eb);
    color: #fff;
}

.yith-wcbk-people-selector__field__button--disabled {
    opacity: 0.25;
    pointer-events: none;
}

.yith-wcbk-people-selector__field__plus-wrap,
.yith-wcbk-people-selector__field__minus-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 16px;
    line-height: 1;
    color: inherit;
}

.yith-wcbk-people-selector__field__total {
    width: 46px;
    text-align: center;
    font-weight: 600;
    font-size: 1rem;
    color: #111827;
    line-height: 34px;
}

.yith-wcbk-people-selector__fields-container__footer {
    padding: 12px 20px;
    border-top: 1px solid #f3f4f6;
    text-align: right;
}

.yith-wcbk-people-selector__close-handler {
    display: inline-block;
    padding: 8px 20px;
    background: var(--wcbk-primary, #2563eb);
    color: #fff;
    font-weight: 600;
    font-size: 0.875rem;
    border-radius: 8px;
    cursor: pointer;
    transition: background .2s ease;
    text-decoration: none !important;
}

.yith-wcbk-people-selector__close-handler:hover {
    background: var(--wcbk-primary-hover, #1d4ed8);
    color: #fff;
}


/* ----------------------------------------------------------------
   10. SERVICES
   ---------------------------------------------------------------- */
.yith-wcbk-form-section-services-wrapper {
    margin: 0.25rem 0 0;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
}

.yith-wcbk-booking-form .yith-wcbk-form-section-service {
    padding: 14px 16px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    margin-bottom: 10px;
    background: #fff;
    font-size: 0.9375rem;
    transition: border-color .2s ease, background .2s ease;
    cursor: pointer;
}

.yith-wcbk-booking-form .yith-wcbk-form-section-service:hover {
    border-color: var(--wcbk-primary, #2563eb);
    background: #fafcff;
}

.yith-wcbk-booking-form .yith-wcbk-form-section-service:has(input:checked) {
    border-color: var(--wcbk-primary, #2563eb);
    background: color-mix(in srgb, var(--wcbk-primary, #2563eb) 8%, #ffffff);
}

/* The <label> wraps input + custom checkbox span + label text */
.yith-wcbk-booking-form .yith-wcbk-form-section-service .yith-wcbk-checkbox {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    flex: 1 !important;
    cursor: pointer !important;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 500 !important;
    color: #111827 !important;
    font-size: inherit !important;
}

/* Hide the native input — the __checkbox span handles the visual */
.yith-wcbk-booking-form input[type="checkbox"].yith-wcbk-booking-service {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    pointer-events: none !important;
}

/* Custom checkbox square */
.yith-wcbk-booking-form .yith-wcbk-form-section-service .yith-wcbk-checkbox__checkbox {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    flex-shrink: 0 !important;
    border: 2px solid #d1d5db !important;
    border-radius: 5px !important;
    background: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: border-color 0.2s ease, background 0.2s ease !important;
    position: relative !important;
}

/* Checked state — border + fill */
.yith-wcbk-booking-form .yith-wcbk-form-section-service:has(input:checked) .yith-wcbk-checkbox__checkbox {
    background: var(--wcbk-primary, #2563eb) !important;
    border-color: var(--wcbk-primary, #2563eb) !important;
}

/* Checkmark via ::after */
.yith-wcbk-booking-form .yith-wcbk-form-section-service:has(input:checked) .yith-wcbk-checkbox__checkbox::after {
    content: '' !important;
    display: block !important;
    width: 5px !important;
    height: 9px !important;
    border: 2px solid #fff !important;
    border-top: none !important;
    border-left: none !important;
    transform: rotate(45deg) translateY(-1px) !important;
}

/* Label text next to checkbox */
.yith-wcbk-booking-form .yith-wcbk-form-section-service .yith-wcbk-checkbox__label {
    flex: 1 !important;
    line-height: 1.4 !important;
    font-size: inherit !important;
    color: inherit !important;
}

.yith-wcbk-booking-form .yith-wcbk-booking-service__pricing--inline {
    margin-left: auto;
    padding-left: 12px;
    font-weight: 600;
    color: #059669;
    font-size: 0.9375rem;
}

.yith-wcbk-booking-form .yith-wcbk-booking-service__description {
    flex: 0 0 100%;
    margin-top: 6px;
    padding-left: 32px;
    font-size: 0.8125rem;
    color: #6b7280;
    line-height: 1.5;
}

.yith-wcbk-booking-form .yith-wcbk-booking-service__description p {
    margin: 0;
}

.yith-wcbk-booking-form .yith-wcbk-booking-service-quantity__container {
    margin-left: auto;
}

/* Services selector dropdown */
.yith-wcbk-services-selector .yith-wcbk-services-selector__toggle-handler {
    min-height: 52px;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    padding: 8px 44px 8px 16px;
    font-size: 0.9375rem;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.yith-wcbk-services-selector .yith-wcbk-services-selector__toggle-handler:hover {
    border-color: #d1d5db;
}

.yith-wcbk-services-selector.yith-wcbk-services-selector--opened
  .yith-wcbk-services-selector__toggle-handler {
    border-color: var(--wcbk-primary, #2563eb);
    border-radius: 10px 10px 0 0;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.yith-wcbk-services-selector .yith-wcbk-services-selector__content {
    border: 1.5px solid var(--wcbk-primary, #2563eb);
    border-top: none;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 8px 16px -4px rgba(0,0,0,.12);
}

.yith-wcbk-services-selector.yith-wcbk-services-selector--opened
  .yith-wcbk-services-selector__content {
    z-index: 9999;
}

.yith-wcbk-services-selector .yith-wcbk-services-selector__close {
    background: var(--wcbk-primary, #2563eb);
    border-radius: 8px;
    padding: 8px 20px;
    font-weight: 600;
    font-size: 0.875rem;
    color: #fff;
    transition: background .2s ease;
}

.yith-wcbk-services-selector .yith-wcbk-services-selector__close:hover {
    background: var(--wcbk-primary-hover, #1d4ed8);
    color: #fff;
}


/* ----------------------------------------------------------------
   11. TIME SLOTS
   ---------------------------------------------------------------- */
.yith-wcbk-booking-form .yith-wcbk-booking-time-select-list .yith-wcbk-select-list__options {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 8px;
    margin-top: 0.5rem;
}

.yith-wcbk-booking-form .yith-wcbk-booking-time-select-list .yith-wcbk-select-list__option {
    text-align: center;
    padding: 10px 8px;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    cursor: pointer;
    transition: all .15s ease;
    font-weight: 500;
    font-size: 0.875rem;
    color: #374151;
    background: #fff;
}

.yith-wcbk-booking-form .yith-wcbk-booking-time-select-list .yith-wcbk-select-list__option:hover {
    border-color: var(--wcbk-primary, #2563eb);
    color: var(--wcbk-primary, #2563eb);
    background: color-mix(in srgb, var(--wcbk-primary, #2563eb) 8%, #ffffff);
}

.yith-wcbk-booking-form .yith-wcbk-booking-time-select-list
  .yith-wcbk-select-list__option.selected,
.yith-wcbk-booking-form .yith-wcbk-booking-time-select-list
  .yith-wcbk-select-list__option.yith-wcbk-select-list__option--selected {
    border-color: var(--wcbk-primary, #2563eb);
    background: var(--wcbk-primary, #2563eb);
    color: #fff;
    font-weight: 600;
}


/* ----------------------------------------------------------------
   12. RESOURCES / GENERIC SELECT-LIST
   ---------------------------------------------------------------- */
.yith-wcbk-booking-form .yith-wcbk-select-list__option {
    border: 1.5px solid #e5e7eb !important;
    border-radius: 10px !important;
    transition: all .15s ease !important;
    font-size: 0.9375rem;
}

.yith-wcbk-booking-form .yith-wcbk-select-list__option:hover {
    border-color: var(--wcbk-primary, #2563eb) !important;
    background: #fafcff;
}

.yith-wcbk-booking-form .yith-wcbk-select-list__option.selected,
.yith-wcbk-booking-form .yith-wcbk-select-list__option.yith-wcbk-select-list__option--selected {
    border-color: var(--wcbk-primary, #2563eb) !important;
    background: color-mix(in srgb, var(--wcbk-primary, #2563eb) 8%, #ffffff) !important;
    color: var(--wcbk-primary-hover, #1d4ed8) !important;
}

.yith-wcbk-booking-form .yith-wcbk-select-list__option.selected
  .yith-wcbk-select-list__option-check,
.yith-wcbk-booking-form .yith-wcbk-select-list__option.yith-wcbk-select-list__option--selected
  .yith-wcbk-select-list__option-check {
    background-color: var(--wcbk-primary, #2563eb) !important;
    border-color: var(--wcbk-primary, #2563eb) !important;
}


/* ----------------------------------------------------------------
   13. GENERAL YITH SELECTOR (resources dropdown)
   ---------------------------------------------------------------- */
.yith-wcbk-selector .yith-wcbk-selector__head {
    min-height: 52px;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.yith-wcbk-selector .yith-wcbk-selector__head:hover {
    border-color: #d1d5db;
}

.yith-wcbk-selector.yith-wcbk-selector--opened .yith-wcbk-selector__head {
    border-color: var(--wcbk-primary, #2563eb);
    border-radius: 10px 10px 0 0;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.yith-wcbk-selector .yith-wcbk-selector__dropdown {
    border: 1.5px solid var(--wcbk-primary, #2563eb);
    border-top: none;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 8px 16px -4px rgba(0,0,0,.12);
}

.yith-wcbk-selector .yith-wcbk-selector__item:hover,
.yith-wcbk-selector .yith-wcbk-selector__item--selected {
    background: color-mix(in srgb, var(--wcbk-primary, #2563eb) 8%, #ffffff);
    color: var(--wcbk-primary-hover, #1d4ed8);
}

.yith-wcbk-selector .yith-wcbk-selector__button {
    background: var(--wcbk-primary, #2563eb);
    border-radius: 8px;
    transition: background .2s ease;
}

.yith-wcbk-selector .yith-wcbk-selector__button:hover {
    background: var(--wcbk-primary-hover, #1d4ed8);
}

.yith-wcbk-selector.yith-wcbk-selector--list-layout:not(.yith-wcbk-selector--multiple)
  .yith-wcbk-selector__item {
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    transition: border-color .15s ease, background .15s ease;
}

.yith-wcbk-selector.yith-wcbk-selector--list-layout:not(.yith-wcbk-selector--multiple)
  .yith-wcbk-selector__item:hover {
    border-color: var(--wcbk-primary, #2563eb);
    background: #fafcff;
}

.yith-wcbk-selector.yith-wcbk-selector--list-layout:not(.yith-wcbk-selector--multiple)
  .yith-wcbk-selector__item.yith-wcbk-selector__item--selected {
    border-color: var(--wcbk-primary, #2563eb);
    background: color-mix(in srgb, var(--wcbk-primary, #2563eb) 8%, #ffffff);
}


/* ----------------------------------------------------------------
   14. DURATION — fixed display
   ---------------------------------------------------------------- */
.yith-wcbk-booking-form .yith-wcbk-form-section-duration--no-field .yith-wcbk-form-section__content {
    padding: 12px 16px;
    background: #f9fafb;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    min-height: 52px;
    display: flex;
    align-items: center;
}

.yith-wcbk-booking-form .yith-wcbk-form-section-duration--no-field .yith-wcbk-booking-duration__label {
    font-size: 0.9375rem;
    font-weight: 500;
    color: #374151;
}


/* ----------------------------------------------------------------
   15. TOTALS / PRICE SUMMARY
   ---------------------------------------------------------------- */
.yith-wcbk-form-section-totals {
    margin-top: 1rem;
}

.yith-wcbk-booking-form-totals__list {
    display: table;
    width: 100%;
    background: #fff;
    border: 1.5px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    margin: 0;
}

.yith-wcbk-booking-form-total {
    display: table-row;
}

.yith-wcbk-booking-form-total__label,
.yith-wcbk-booking-form-total__value {
    display: table-cell;
    padding: 12px 16px;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.9375rem;
    color: #374151;
    vertical-align: middle;
}

.yith-wcbk-booking-form-total__value {
    text-align: right;
    font-weight: 500;
}

.yith-wcbk-booking-form-total--discount .yith-wcbk-booking-form-total__label,
.yith-wcbk-booking-form-total--discount .yith-wcbk-booking-form-total__value {
    color: #059669;
}

.yith-wcbk-booking-form-total--total-price .yith-wcbk-booking-form-total__label,
.yith-wcbk-booking-form-total--total-price .yith-wcbk-booking-form-total__value {
    border-bottom: none;
    font-weight: 700;
    font-size: 1.0625rem;
    color: #111827;
    background: #f9fafb;
    padding: 14px 16px;
}


/* ----------------------------------------------------------------
   16. CHECK-IN / CHECK-OUT META BAR
   ---------------------------------------------------------------- */
.yith-booking-meta {
    display: flex;
    gap: 1px;
    background: #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    border: 1.5px solid #e5e7eb;
    margin: 0.75rem 0;
}

.yith-booking-meta .yith-booking-checkin,
.yith-booking-meta .yith-booking-checkout {
    flex: 1;
    text-align: center;
    padding: 12px 16px;
    background: #fff;
    font-size: 0.875rem;
}

.yith-booking-meta__label {
    display: block;
    font-weight: 700;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #6b7280;
    margin-bottom: 3px;
}

/* Remove the plugin's default colon after the label */
.yith-booking-meta__label::after {
    content: '';
}

.yith-booking-meta__value {
    font-weight: 600;
    color: #111827;
    font-size: 0.9375rem;
    display: block;
}


/* ----------------------------------------------------------------
   17. ERROR & SUCCESS STATES
   ---------------------------------------------------------------- */
.yith-wcbk-booking-form-error {
    color: #dc2626;
    font-size: 0.8125rem;
    font-weight: 500;
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.yith-wcbk-form-section__content--with-error
  > .yith-wcbk-date-picker-wrapper
  > .yith-wcbk-date-picker--formatted,
.yith-wcbk-form-section__content--with-error
  > .yith-wcbk-booking-persons,
.yith-wcbk-form-section__content--with-error > select {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.10) !important;
}

.yith-wcbk-form-section__content--with-error > .yith-wcbk-date-range-picker {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.10) !important;
}

.yith-wcbk-form-section__content--with-error
  > .yith-wcbk-date-picker--inline .ui-widget-content {
    border-color: #dc2626 !important;
    box-shadow: none !important;
}

.yith-wcbk-booking-form-message .yith-wcbk-bookable.bookable {
    color: #059669;
    background: #ecfdf5;
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid #a7f3d0;
    margin: 0.75rem 0;
    font-size: 0.875rem;
    font-weight: 500;
}

.yith-wcbk-booking-form-message .yith-wcbk-bookable.not-bookable,
.yith-wcbk-booking-form-message .non-available-reason {
    color: #dc2626;
    background: #fef2f2;
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid #fecaca;
    margin: 0.75rem 0;
    font-size: 0.875rem;
    font-weight: 500;
}


/* ----------------------------------------------------------------
   18. MINI NUMBER FIELD (standalone, not inside stepper)
   ---------------------------------------------------------------- */
input.yith-wcbk-number-minifield {
    width: 70px !important;
    display: inline-block;
    text-align: center;
    min-height: 44px;
    height: 44px;
    padding: 0 10px !important;
    border: 1.5px solid #e5e7eb !important;
    border-radius: 8px !important;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #111827;
    background: #fff !important;
    box-shadow: none !important;
}


/* ----------------------------------------------------------------
   19. ADD TO CART BUTTON
   ---------------------------------------------------------------- */
button.button.yith-wcbk-add-to-cart-button,
button.button.alt.yith-wcbk-add-to-cart-button,
.woocommerce .yith-wcbk-booking-form button.button.yith-wcbk-add-to-cart-button,
.woocommerce .yith-wcbk-booking-form button.button.alt.yith-wcbk-add-to-cart-button,
.product button.button.alt.yith-wcbk-add-to-cart-button {
    display: block;
    width: 100%;
    padding: 15px 24px;
    background: var(--wcbk-primary, var(--wcbk-primary, #2563eb)) !important;
    color: var(--wcbk-btn-text, #fff) !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
    text-transform: none !important;
    cursor: pointer;
    transition: background .2s ease, transform .1s ease, box-shadow .2s ease;
    box-shadow: var(--wcbk-btn-shadow, 0 2px 8px rgba(37,99,235,0.30)) !important;
    margin-top: 1.25rem;
    text-align: center;
    line-height: 1.4;
}

button.button.yith-wcbk-add-to-cart-button:hover,
button.button.alt.yith-wcbk-add-to-cart-button:hover,
.woocommerce .yith-wcbk-booking-form button.button.yith-wcbk-add-to-cart-button:hover,
.woocommerce .yith-wcbk-booking-form button.button.alt.yith-wcbk-add-to-cart-button:hover,
.product button.button.alt.yith-wcbk-add-to-cart-button:hover {
    background: var(--wcbk-primary-hover, #1d4ed8) !important;
    box-shadow: var(--wcbk-btn-hover-shadow, 0 4px 14px rgba(37,99,235,0.40)) !important;
    transform: translateY(-1px);
}

button.button.yith-wcbk-add-to-cart-button:active,
button.button.alt.yith-wcbk-add-to-cart-button:active,
.woocommerce .yith-wcbk-booking-form button.button.alt.yith-wcbk-add-to-cart-button:active {
    transform: translateY(0);
    box-shadow: var(--wcbk-btn-shadow, 0 2px 6px rgba(37,99,235,0.30)) !important;
}

button.button.yith-wcbk-add-to-cart-button:disabled,
button.button.alt.yith-wcbk-add-to-cart-button:disabled,
.woocommerce .yith-wcbk-booking-form button.button.alt.yith-wcbk-add-to-cart-button:disabled,
.product button.button.alt.yith-wcbk-add-to-cart-button:disabled {
    background: #9ca3af !important;
    cursor: not-allowed;
    box-shadow: none !important;
    transform: none !important;
    color: #fff !important;
    opacity: 0.75;
}


/* ----------------------------------------------------------------
   20. MOBILE RESPONSIVE
   ---------------------------------------------------------------- */
/* ----------------------------------------------------------------
   21. PERSON TYPE PRICE LABEL
   ---------------------------------------------------------------- */
.wcbk-person-type-price {
    display: block;
    font-weight: 400;
    font-size: 0.75rem;
    text-transform: none;
    letter-spacing: 0;
    color: var(--wcbk-primary, var(--wcbk-primary, #2563eb));
    margin-top: 2px;
}


/* ----------------------------------------------------------------
   22. BUG FIXES & LAYOUT IMPROVEMENTS
   ---------------------------------------------------------------- */

/* Hide the duration row entirely */
.yith-wcbk-booking-form .yith-wcbk-form-section-duration {
    display: none !important;
}

/* Adults + Kids on one row */
.yith-wcbk-booking-form .yith-wcbk-form-section-persons-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 1.5rem !important;
    align-items: flex-start !important;
}

.yith-wcbk-booking-form .yith-wcbk-form-section-persons-wrapper
> .yith-wcbk-form-section-person-types {
    flex: 1 1 140px !important;
    width: auto !important;
    max-width: 50% !important;
}

/* Fix double chevron on YITH's select-alt wrapper.
   YITH overlays a `.yith-wcbk-select-alt__arrow` icon (yith-icon-arrow-down-alt)
   which renders as a double-chevron glyph from their icon font.
   Our `select` rule already adds a clean single SVG chevron via background-image,
   so we suppress the native browser arrow AND hide YITH's icon overlay
   to leave exactly one arrow. */
.yith-wcbk-booking-form .yith-wcbk-select-alt__container select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    padding-right: 44px !important;
}

.yith-wcbk-booking-form .yith-wcbk-select-alt__arrow,
.yith-wcbk-booking-form .yith-wcbk-select-alt__container .yith-icon-arrow-down-alt {
    display: none !important;
}


@media (max-width: 640px) {
    .yith-wcbk-booking-form {
        max-width: 100%;
    }

    .yith-wcbk-booking-form label.yith-wcbk-booking-form__label {
        font-size: 0.75rem;
    }

    /* Prevent iOS auto-zoom on focus */
    .yith-wcbk-booking-form input:not([type='checkbox']):not(.yith-wcbk-date-picker):not(.yith-wcbk-number-minifield),
    .yith-wcbk-booking-form select,
    .yith-wcbk-date-range-picker input.yith-wcbk-date-picker--formatted {
        font-size: 16px;
    }

    .yith-wcbk-booking-form .yith-wcbk-booking-time-select-list
      .yith-wcbk-select-list__options {
        grid-template-columns: repeat(auto-fill, minmax(76px, 1fr));
    }

    #ui-datepicker-div.yith-wcbk-datepicker.ui-widget-content {
        width: calc(100vw - 32px);
        max-width: 360px;
    }

    .yith-wcbk-people-selector__fields-container {
        min-width: 0;
        width: 100%;
    }

    .yith-wcbk-form-section-persons-wrapper,
    .yith-wcbk-form-section-person-types {
        gap: 1rem !important;
    }
}