/* SVL Booking — shared customer purchase UI
   Brand materials come from the global SVL design system.
   Booking keeps only workflow-specific scale plus the Discovery olive accent. */
.svl-booking-entry {
    padding-bottom: 96px;
    --svl-booking-olive: #758445;
    /* One visual treatment for every photographic booking card. */
    --svl-photo-opacity: .38;
    --svl-photo-opacity-active: .43;
    --svl-photo-filter: grayscale(1) contrast(1.06) brightness(.88);
    --svl-photo-background: linear-gradient(135deg, rgba(110,124,59,.54) 0%, rgba(76,86,42,.46) 34%, rgba(16,17,14,.78) 100%);
    --svl-photo-overlay: linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,0) 18%, rgba(7,7,7,.12) 48%, rgba(7,7,7,.34) 100%), radial-gradient(circle at 16% 16%, color-mix(in srgb, var(--svl-gold) 15%, transparent) 0%, transparent 30%), linear-gradient(135deg, rgba(117,132,69,.34) 0%, rgba(117,132,69,.16) 36%, rgba(10,10,10,0) 72%);
    --svl-photo-border: 1px solid color-mix(in srgb, var(--svl-gold) 18%, rgba(255,255,255,.12));
    --svl-photo-shadow: 0 18px 40px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1px rgba(117,132,69,.14);
    --svl-photo-active-border: color-mix(in srgb, var(--svl-gold) 55%, var(--svl-booking-olive));
    --svl-photo-active-shadow: 0 22px 46px rgba(0,0,0,.28), inset 0 0 0 1px color-mix(in srgb, var(--svl-gold) 45%, var(--svl-booking-olive));
    --svl-booking-danger-bg: rgba(120, 25, 25, 0.18);
    --svl-booking-font-xs: 12px;
    --svl-booking-font-sm: 14px;
    --svl-booking-font-base: 16px;
    --svl-booking-font-md: 18px;
    --svl-booking-font-lg: 20px;
    --svl-card-title-size: clamp(22px, 2.1vw, 28px);
    --svl-card-meta-size: 14px;
    --svl-step-title-gap: 28px;
    --svl-step-context-gap: 64px;

    color: var(--svl-text);
    font-family: var(--e-global-typography-text-font-family, inherit);
    font-weight: var(--e-global-typography-text-font-weight, inherit);
    font-size: var(--svl-booking-font-base);
    line-height: 1.45;
}

/* Global .svl-glass material with a local Discovery-green tint. */
.svl-booking-entry .svl-booking-glass {
    --svl-glass-angle: 110deg;
    --svl-glass-start: color-mix(in srgb, var(--svl-booking-olive) 20%, rgba(30,30,30,0.64));
    --svl-glass-mid: color-mix(in srgb, var(--svl-booking-olive) 9%, rgba(10,10,10,0.82));
    --svl-glass-mid-stop: 58%;
    --svl-glass-end: rgba(4,4,4,0.92);
    --svl-glass-border-color: var(--svl-border-gold);
    --svl-glass-radius: var(--svl-radius-card);
    --svl-glass-blur: 0px;
}

.svl-booking-entry *,
.svl-booking-entry *::before,
.svl-booking-entry *::after { box-sizing: border-box; }
.svl-booking-entry [hidden] { display: none !important; }
.svl-booking-intro-hidden { display: none !important; }

.svl-booking-section + .svl-booking-section { margin-top: 28px; }
.svl-booking-section-title,
.svl-lesson-progress-eyebrow,
.svl-booking-summary-title,
.svl-time-filter-label {
    display: block;
    margin: 0 0 var(--svl-step-title-gap);
}

/* Shared choice-card system */
.svl-booking-grid,
.svl-route-grid {
    display: grid;
    gap: 22px;
}
.svl-booking-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.svl-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 280px));
    justify-content: center;
}
.svl-path-grid {
    grid-template-columns: repeat(3, minmax(240px, 300px));
    justify-content: center;
}

.svl-booking-card,
.svl-route-card {
    --svl-card-padding: 20px 22px;

    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    min-height: 124px;
    color: var(--svl-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.svl-booking-card::before,
.svl-route-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(
            circle at 14% 16%,
            color-mix(in srgb, var(--svl-booking-olive) 24%, transparent) 0%,
            color-mix(in srgb, var(--svl-booking-olive) 10%, transparent) 38%,
            transparent 68%
        );
    opacity: .68;
    pointer-events: none;
    transition: opacity var(--svl-transition);
}
.svl-booking-card > *,
.svl-route-card > * {
    position: relative;
    z-index: 1;
}
.svl-choice-card {
    min-height: 168px;
    aspect-ratio: 1.45 / 1;
}
.svl-choice-card,
.svl-path-card {
    align-items: center;
    text-align: center;
}


/* Shared photographic language: offer, path and location use the SAME image treatment.
   Geometry remains independent and is defined by their existing card classes. */
.svl-offer-image-card,
.svl-location-card {
    overflow: hidden;
    isolation: isolate;
    border: var(--svl-photo-border);
    background: var(--svl-photo-background);
    box-shadow: var(--svl-photo-shadow);
}
.svl-offer-image-card::before,
.svl-location-card::before {
    background-image: var(--svl-card-image);
    background-size: cover;
    background-position: var(--svl-card-position, center);
    background-repeat: no-repeat;
    filter: var(--svl-photo-filter);
    opacity: var(--svl-photo-opacity);
    transform: none;
    transform-origin: center;
    transition: opacity var(--svl-transition), filter var(--svl-transition), transform var(--svl-transition);
}
.svl-offer-image-card::after,
.svl-location-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: var(--svl-photo-overlay);
    pointer-events: none;
}
/* All photo cards share one hover/focus/selection treatment. */
.svl-booking-entry :is(.svl-offer-image-card, .svl-location-card):is(:hover:not(:disabled), :focus-visible:not(:disabled), .is-selected)::before {
    opacity: var(--svl-photo-opacity-active);
}
.svl-booking-entry :is(.svl-offer-image-card, .svl-location-card):is(:hover:not(:disabled), :focus-visible:not(:disabled), .is-selected) {
    border-color: var(--svl-photo-active-border);
    box-shadow: var(--svl-photo-active-shadow);
}
.svl-offer-image-card > * { position: relative; z-index: 1; }
/* Image sources are set by the shared renderer; only positioning varies. */
.svl-offer-image-card { --svl-card-image: var(--svl-choice-image); --svl-card-position: var(--svl-choice-bg-position, center); }
.svl-location-card { --svl-card-image: var(--svl-ghost-image); --svl-card-position: var(--svl-ghost-bg-position, center); }
.svl-booking-card.svl-offer-image-card[data-svl-offer-group="paths"]:nth-child(2),
.svl-booking-card.svl-offer-image-card[data-svl-offer-group="paths"]:nth-child(3) { --svl-card-position: center 61%; }

/* Step headings: one consistent hierarchy for every entry point. */
.svl-booking-router .svl-booking-section-title,
.svl-booking-packages .svl-booking-section-title,
.svl-booking-locations .svl-booking-section-title {
    margin: 0 0 var(--svl-step-title-gap);
    font-size: clamp(18px, 1.65vw, 22px);
    font-weight: 700;
    letter-spacing: .16em;
    color: var(--svl-gold);
    text-align: center;
}
.svl-booking-router,
.svl-booking-packages,
.svl-booking-locations { padding-top: 8px; }
/* The entry router has no preceding flow wrapper; give its heading the same
   breathing room the following steps receive from .svl-booking-flow. */
.svl-booking-router { margin-top: var(--svl-step-context-gap); }
.svl-booking-router .svl-booking-section-title { margin-bottom: 36px; }

/* Modality cards are the main visual hook.
   They intentionally consume the global ghost-image variables,
   while geometry and interaction remain local to booking. */
.svl-booking-locations { margin-bottom: 40px; }

/* Both two-choice steps use the shared .svl-choice-grid geometry. */
/* Location changes text placement only, never card sizing, overlay or opacity. */
.svl-location-card {
    --svl-card-padding: 18px 18px 20px;
    align-items: flex-start;
    justify-content: flex-end;
    text-align: left;
}
.svl-location-card > * { max-width: min(100%, 280px); }
.svl-booking-card-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    color: var(--svl-gold-soft);
    font-size: 11px;
    letter-spacing: .14em;
    text-transform: uppercase;
    opacity: .94;
}
.svl-booking-card-kicker::before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 1px;
    background: color-mix(in srgb, var(--svl-gold) 72%, transparent);
}
.svl-location-card .svl-booking-card-title {
    max-width: 11ch;
    line-height: 1.15;
    text-wrap: balance;
}
.svl-location-card .svl-booking-card-meta {
    max-width: 24ch;
    margin-top: 10px;
    color: color-mix(in srgb, var(--svl-text) 76%, var(--svl-text-secondary));
    font-size: var(--svl-card-meta-size);
    line-height: 1.35;
}
.svl-location-card .svl-booking-card-selected {
    top: 14px;
    right: 14px;
}
.svl-location-card.is-online { --svl-ghost-bg-position: center center; }
.svl-location-card.is-studio { --svl-ghost-bg-position: 52% center; }
.svl-path-card { min-height: 192px; }
.svl-booking-card:hover:not(:disabled),
.svl-booking-card:focus-visible:not(:disabled),
.svl-route-card:hover:not(:disabled),
.svl-route-card:focus-visible:not(:disabled) {
    border-color: var(--svl-border-gold-hover);
    transform: translateY(-2px);
    outline: none;
}
.svl-booking-card:not(.svl-offer-image-card):not(.svl-location-card):hover:not(:disabled)::before,
.svl-booking-card:not(.svl-offer-image-card):not(.svl-location-card):focus-visible:not(:disabled)::before,
.svl-route-card:not(.svl-offer-image-card):hover:not(:disabled)::before,
.svl-route-card:not(.svl-offer-image-card):focus-visible:not(:disabled)::before,
.svl-booking-card:not(.svl-offer-image-card):not(.svl-location-card).is-selected::before,
.svl-route-card:not(.svl-offer-image-card).is-selected::before { opacity: 1; }
.svl-booking-card:not(.svl-offer-image-card):not(.svl-location-card).is-selected,
.svl-route-card:not(.svl-offer-image-card).is-selected {
    border-color: var(--svl-gold);
    box-shadow: inset 0 0 0 1px var(--svl-gold);
}
.svl-booking-card-title,
.svl-route-card-title {
    color: var(--svl-text);
    font-size: var(--svl-card-title-size);
    font-weight: 650;
    line-height: 1.15;
}
.svl-booking-card-meta,
.svl-route-card-meta {
    margin-top: 6px;
    color: var(--svl-text-secondary);
    font-size: var(--svl-card-meta-size);
}
.svl-booking-card-price {
    margin-top: 16px;
    color: var(--svl-gold);
    font-size: var(--svl-booking-font-md);
    font-weight: 600;
}
.svl-booking-card-selected {
    position: absolute;
    top: 12px;
    right: 12px;
    margin: 0;
}

.svl-booking-flow { margin-top: var(--svl-step-context-gap); }
.svl-resolved-choice {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    gap: 10px;
    margin: 0 0 12px;
    padding: 7px 12px;
    opacity: .82;
}
.svl-resolved-choice-label {
    flex: 0 0 auto;
    margin: 0;
}
.svl-resolved-choice strong { color: var(--svl-text); font-size: var(--svl-booking-font-base); }

.svl-booking-flow-status {
    margin: 0 0 16px;
    padding: 12px 14px;
    color: var(--svl-text);
    font-size: var(--svl-booking-font-sm);
}
.svl-booking-flow-status.is-error {
    border-color: rgba(226, 139, 139, 0.55);
    background: var(--svl-booking-danger-bg);
}
.svl-booking-flow-status.is-blocking,
.svl-stop-state {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 20px;
}
.svl-stop-title { font-size: var(--svl-booking-font-md); }
.svl-stop-copy { color: var(--svl-text-secondary); font-size: var(--svl-booking-font-base); }
.svl-stop-link { margin-top: 5px; color: var(--svl-gold); text-decoration: underline; text-underline-offset: 3px; }
.svl-flow-loading { padding: 18px 0; color: var(--svl-text-secondary); font-size: var(--svl-booking-font-base); }

/* Shared action system.
   The global button component targets links; booking uses real buttons,
   so we reuse its tokens/geometry and keep only the control-specific rules here. */
.svl-primary-action,
.svl-secondary-action,
.svl-text-action {
    font: inherit;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.svl-primary-action,
.svl-secondary-action {
    min-height: 52px;
    padding: var(--svl-btn-outline-padding, 13px 22px);
    border-radius: var(--svl-radius-small);
    font-size: var(--svl-btn-outline-font-size, 15px);
    line-height: 1.2;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    transform: translateY(0) scale(1);
    transition:
        background var(--svl-transition),
        color var(--svl-transition),
        border-color var(--svl-transition),
        box-shadow var(--svl-transition),
        transform var(--svl-transition-fast);
}
.svl-primary-action {
    border: 1px solid color-mix(in srgb, var(--svl-gold) 68%, transparent);
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--svl-booking-olive) 30%, transparent) 0%,
            color-mix(in srgb, var(--svl-gold) 16%, transparent) 100%
        );
    color: var(--svl-gold-soft);
    box-shadow:
        0 8px 22px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.07);
}
.svl-primary-action:hover:not(:disabled),
.svl-primary-action:focus-visible:not(:disabled) {
    border-color: var(--svl-gold);
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--svl-booking-olive) 40%, transparent) 0%,
            color-mix(in srgb, var(--svl-gold) 22%, transparent) 100%
        );
    color: var(--svl-gold-soft);
    box-shadow:
        0 10px 26px rgba(0,0,0,.24),
        inset 0 1px 0 rgba(255,255,255,.11);
    outline: none;
}
.svl-secondary-action {
    border: 1px solid color-mix(in srgb, var(--svl-gold) 65%, transparent);
    background: transparent;
    color: var(--svl-gold);
    text-decoration: none;
}
.svl-secondary-action:hover:not(:disabled),
.svl-secondary-action:focus-visible:not(:disabled) {
    background: rgba(255,255,255,.045);
    border-color: var(--svl-gold);
    outline: none;
}
.svl-primary-action:active:not(:disabled),
.svl-secondary-action:active:not(:disabled) {
    transform: translateY(2px) scale(.985);
}
.svl-text-action {
    padding: 0 0 3px;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--svl-gold) 55%, transparent);
    background: transparent;
    color: var(--svl-gold);
    font-size: var(--svl-booking-font-sm);
    font-weight: 500;
    text-decoration: none;
    transition:
        color var(--svl-transition-fast),
        border-color var(--svl-transition-fast);
}
.svl-text-action:hover,
.svl-text-action:focus-visible {
    color: var(--svl-gold-soft);
    border-color: var(--svl-gold);
    outline: none;
}
.svl-change-action,
.svl-review-edit-action {
    font-size: var(--svl-booking-font-sm);
}
.svl-primary-action:disabled,
.svl-secondary-action:disabled { cursor: wait; opacity: 0.55; }

/* Active lesson-selection flow. Material = global .svl-glass. */
.svl-calendar-shell,
.svl-booking-summary,
.svl-information-panel,
.svl-review-panel {
    margin-top: 16px;
    padding: 24px;
}
.svl-active-selected-lessons { margin-bottom: 18px; }
.svl-selected-lessons-list { border-top: 1px solid var(--svl-border); }
.svl-selected-lesson-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 78px;
    padding: 14px 0;
    border-bottom: 1px solid var(--svl-border);
}
.svl-selected-lesson-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.svl-selected-lesson-copy strong { font-size: var(--svl-booking-font-base); }
.svl-selected-lesson-copy span { color: var(--svl-text-secondary); font-size: var(--svl-booking-font-sm); }
.svl-booking-policy-block {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 0 0 20px;
    padding: 12px 14px;
    border-left: 2px solid var(--svl-gold);
    background: color-mix(in srgb, var(--svl-booking-olive) 14%, transparent);
}
.svl-booking-deadline {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 5px;
    color: var(--svl-text-secondary);
    font-size: var(--svl-booking-font-sm);
}
.svl-booking-deadline strong { color: var(--svl-text); font-size: var(--svl-booking-font-base); }
.svl-booking-policy-copy,
.svl-booking-policy-notice { color: var(--svl-text-secondary); font-size: var(--svl-booking-font-sm); }
.svl-review-policy-block { gap: 7px; margin: 30px 0 0; }
.svl-review-policy-intro { color: var(--svl-gold); font-size: var(--svl-booking-font-sm); font-weight: 600; }
.svl-review-policy-block .svl-booking-policy-notice { color: var(--svl-text); }
.svl-calendar-heading { margin: 0 0 16px; }
.svl-calendar-heading .svl-lesson-progress-eyebrow { margin-bottom: 5px; }
.svl-calendar-title {
    display: block;
    margin: 0;
    color: var(--svl-text);
    font-size: clamp(22px, 2.2vw, 28px);
    line-height: 1.2;
}

.svl-time-filter-host { margin: 0 0 18px; }
.svl-time-filter-label { margin-bottom: 9px; }
.svl-time-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.svl-time-filter-button {
    min-height: 38px;
    padding: 8px 14px;
    border: 1px solid var(--svl-border);
    border-radius: 999px;
    background: transparent;
    color: var(--svl-text-secondary);
    font: inherit;
    font-size: var(--svl-booking-font-sm);
    cursor: pointer;
}
.svl-time-filter-button:hover,
.svl-time-filter-button:focus-visible,
.svl-time-filter-button.is-active {
    border-color: var(--svl-gold);
    color: var(--svl-gold);
    background: color-mix(in srgb, var(--svl-booking-olive) 18%, transparent);
    outline: none;
}

.svl-calendar-empty-state {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-top: 14px;
    padding: 16px;
    font-size: var(--svl-booking-font-base);

}
.svl-calendar-empty-state span { color: var(--svl-text-secondary); }
.svl-waitlist {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px solid var(--svl-border);
    color: var(--svl-text-secondary);
    font-size: var(--svl-booking-font-sm);
}
.svl-waitlist.is-primary { flex-direction: column; align-items: flex-start; margin: 0; padding: 0; border: 0; }
.svl-waitlist-message { color: inherit; }

/* Native Booknetic calendar embedded as availability engine. Keep its accepted sizing. */
.svl-lesson-calendar-preview .booknetic_appointment_steps,
.svl-lesson-calendar-preview .booknetic_appointment_container_footer,
.svl-lesson-calendar-preview .booknetic_appointment_container_header,
.svl-lesson-calendar-preview .booknetic_branding,
.svl-booknetic-panel-host .booknetic_appointment_steps,
.svl-booknetic-panel-host .booknetic_appointment_container_footer,
.svl-booknetic-panel-host .booknetic_appointment_container_header,
.svl-booknetic-panel-host .booknetic_branding { display: none !important; }
.svl-booknetic-panel-host .booknetic_appointment,
.svl-booknetic-panel-host .booknetic_appointment_container,
.svl-booknetic-panel-host .booknetic_appointment_container_body,
.svl-booknetic-panel-host .booknetic_appointment_container_body > div {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}
.svl-booknetic-panel-host .booknetic_appointment_container_body { padding: 0 !important; }
.svl-booknetic-panel-host .booknetic_date_time_area { display: flex !important; align-items: flex-start; gap: 15px; width: 100% !important; }
.svl-booknetic-panel-host .booknetic_calendar_div { width: min(100%, 430px) !important; flex: 1 1 430px; }
.svl-booknetic-panel-host .booknetic_time_div { width: min(100%, 320px) !important; flex: 0 1 320px; }
.svl-booknetic-panel-host #booknetic_calendar_area,
.svl-booknetic-panel-host .booknetic_times {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    border: 1px solid var(--svl-border) !important;
    border-radius: 10px !important;
    background: color-mix(in srgb, var(--svl-booking-olive) 7%, rgba(5,5,5,.74)) !important;
    box-shadow: none !important;
}
.svl-booknetic-panel-host .booknetic_calendar_head,
.svl-booknetic-panel-host .booknetic_calendar_head > div,
.svl-booknetic-panel-host .booknetic_times_head,
.svl-booknetic-panel-host .booknetic_time_div,
.svl-booknetic-panel-host .booknetic_time_div * { color: var(--svl-text) !important; }
.svl-booknetic-panel-host .booknetic_time_div .booknetic_empty_box,
.svl-booknetic-panel-host .booknetic_time_div .booknetic_empty_box * { color: var(--svl-text-secondary) !important; }
.svl-booknetic-panel-host .booknetic_calendar_head { padding: 13px 12px 4px !important; }
.svl-booknetic-panel-host .booknetic_month_name { font-weight: 650 !important; }
.svl-booknetic-panel-host .booknetic_next_month,
.svl-booknetic-panel-host .booknetic_prev_month { color: var(--svl-gold) !important; }
.svl-booknetic-panel-host .booknetic_week_names > .booknetic_td { color: var(--svl-text-secondary) !important; border-bottom-color: var(--svl-border) !important; }
.svl-booknetic-panel-host .booknetic_week_names > .booknetic_td { white-space: nowrap !important; word-break: normal !important; overflow-wrap: normal !important; }
.svl-booknetic-panel-host .booknetic_calendar_days > div {
    border-radius: 7px !important;
    background: color-mix(in srgb, var(--svl-text) 8%, transparent) !important;
    color: var(--svl-text) !important;
}
.svl-booknetic-panel-host .booknetic_calendar_days:not(.booknetic_calendar_empty_day) > div:hover { box-shadow: inset 0 0 0 1px var(--svl-gold) !important; }
.svl-booknetic-panel-host .booknetic_calendar_days.booknetic_calendar_selected_day > div { background: var(--svl-gold) !important; color: #17100d !important; }
.svl-booknetic-panel-host .booknetic_calendar_days.booknetic_calendar_empty_day > div { background: color-mix(in srgb, var(--svl-text) 3.5%, transparent) !important; color: color-mix(in srgb, var(--svl-text) 25%, transparent) !important; cursor: default !important; }
.svl-booknetic-panel-host .booknetic_calendar_days.svl-calendar-out-of-range {
    pointer-events: none !important;
}
.svl-booknetic-panel-host .booknetic_calendar_days.svl-calendar-out-of-range > div {
    visibility: hidden !important;
    opacity: 0 !important;
    color: transparent !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    cursor: default !important;
    pointer-events: none !important;
}
.svl-booknetic-panel-host .booknetic_calendar_days.svl-calendar-out-of-range > div * {
    visibility: hidden !important;
    opacity: 0 !important;
    color: transparent !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
.svl-booknetic-panel-host .booknetic_calendar_days.svl-calendar-out-of-range > div:hover {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.svl-booknetic-panel-host .booknetic_calendar_days > div > span > i[a] { background: var(--svl-gold) !important; }
.svl-booknetic-panel-host .booknetic_calendar_days.booknetic_calendar_empty_day > div > span > i[a] { background: color-mix(in srgb, var(--svl-text-secondary) 36%, transparent) !important; }
.svl-booknetic-panel-host .booknetic_calendar_days > div > span > i[b] { background: transparent !important; }
.svl-booknetic-panel-host .booknetic_times { padding-bottom: 8px !important; }
.svl-booknetic-panel-host .booknetic_times_title { border-bottom-color: var(--svl-border) !important; }
.svl-booknetic-panel-host .booknetic_times_list { height: 270px !important; padding: 6px 8px !important; }
.svl-booknetic-panel-host .booknetic_times_list > div {
    width: calc(50% - 10px) !important;
    height: 48px !important;
    margin: 5px !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: color-mix(in srgb, var(--svl-text) 8%, transparent) !important;
    color: var(--svl-text) !important;
    box-shadow: none !important;
}
.svl-booknetic-panel-host .booknetic_times_list > div:hover { border-color: var(--svl-gold) !important; }
.svl-booknetic-panel-host .booknetic_times_list > div.booknetic_selected_time,
.svl-booknetic-panel-host .booknetic_times_list > div.booknetic_selected_time * { background: var(--svl-gold) !important; color: #17100d !important; }

/* Selected-lessons checkpoint */
.svl-booking-summary { margin-top: 12px; }
.svl-booking-summary-actions,
.svl-information-actions,
.svl-review-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 14px; }
.svl-booking-summary-actions .svl-primary-action { min-width: 220px; }

/* Participant details */
.svl-information-panel .svl-booking-summary-title { margin-bottom: 5px; }
.svl-information-helper { margin: 0 0 20px; color: var(--svl-text-secondary); font-size: var(--svl-booking-font-base); }
.svl-information-panel .form-row,
.svl-package-customer-form .booknetic_custom_form { display: flex; flex-wrap: wrap; margin: 0 -7px; }
.svl-information-panel .form-group,
.svl-package-customer-form .form-group { flex: 0 0 100%; max-width: 100%; padding: 0 7px; margin: 0 0 18px; }
.svl-information-panel .col-md-6,
.svl-package-customer-form .col-md-6 { flex-basis: 50%; max-width: 50%; }
.svl-information-panel .col-md-4,
.svl-package-customer-form .col-md-4 { flex-basis: 33.333%; max-width: 33.333%; }
.svl-information-panel .col-md-3,
.svl-package-customer-form .col-md-3 { flex-basis: 25%; max-width: 25%; }
.svl-information-panel label,
.svl-package-customer-form label[data-label="true"] { display: block; margin: 0 0 7px; color: var(--svl-text); font-size: var(--svl-booking-font-sm); font-weight: 500; }
.svl-information-panel label[data-required="true"]::after,
.svl-package-customer-form label[data-required="true"]::after { content: " *"; color: var(--svl-gold); }
.svl-information-panel .form-control,
.svl-package-customer-form .form-control,
.svl-package-customer-form select {
    width: 100%;
    min-height: 50px;
    margin: 0;
    padding: 11px 13px;
    border: 1px solid var(--svl-border) !important;
    border-radius: 9px !important;
    background: color-mix(in srgb, var(--svl-booking-olive) 5%, rgba(5,5,5,.42)) !important;
    color: var(--svl-text) !important;
    font: inherit;
    font-size: var(--svl-booking-font-base);
    box-shadow: none !important;
}
.svl-information-panel .form-control:focus,
.svl-package-customer-form .form-control:focus { border-color: var(--svl-gold) !important; outline: none; }
.svl-information-panel textarea.form-control,
.svl-package-customer-form textarea.form-control { min-height: 116px; resize: vertical; }
.svl-package-customer-form { margin-top: 8px; }
.svl-package-customer-form .form-control-plaintext,
.svl-package-customer-form .form-control-plain { color: var(--svl-text-secondary); font-size: var(--svl-booking-font-sm); line-height: 1.55; }
.svl-package-customer-form .help-text { display: block; margin-top: 5px; color: var(--svl-text-secondary); font-size: var(--svl-booking-font-sm); }
.svl-package-customer-form input[type="radio"],
.svl-package-customer-form input[type="checkbox"] { width: 18px; height: 18px; margin: 0 9px 0 0; accent-color: var(--svl-gold); }
.svl-package-customer-form .form-group > div:not(.input_group) > div[style*="display: flex"] {
    align-items: center !important;
    min-height: 44px;
    margin: 7px 0;
    padding: 10px 12px;
    border: 1px solid var(--svl-border);
    border-radius: 8px;
    background: color-mix(in srgb, var(--svl-booking-olive) 5%, rgba(5,5,5,.34));
    font-size: var(--svl-booking-font-sm);
}
.svl-package-customer-form .form-group > div:not(.input_group) > div[style*="display: flex"] label { display: inline; margin: 0; cursor: pointer; }

/* Review */
.svl-review-panel { max-width: 880px; }
.svl-review-context { display: flex; flex-direction: column; gap: 3px; margin-bottom: 16px; }
.svl-review-context strong { font-size: var(--svl-booking-font-md); }
.svl-review-context span { color: var(--svl-text-secondary); font-size: var(--svl-booking-font-base); }
.svl-review-section { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--svl-border); }
.svl-review-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 10px; }
.svl-review-section-head h4 { margin: 0; color: var(--svl-text); font-size: var(--svl-booking-font-base); }
.svl-review-participant { display: flex; flex-direction: column; gap: 3px; color: var(--svl-text-secondary); font-size: var(--svl-booking-font-base); }
.svl-review-price {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--svl-border);
}
.svl-review-price span { color: var(--svl-text-secondary); font-size: var(--svl-booking-font-lg); }
.svl-review-price strong { color: var(--svl-text); font-size: var(--svl-booking-font-lg); }
.svl-review-discount { margin-top: 6px; color: var(--svl-text-secondary); font-size: var(--svl-booking-font-sm); }

.svl-private-rate-notice { margin: 0 0 18px; padding: 14px 16px; border: 1px solid var(--svl-border); border-radius: 9px; background: color-mix(in srgb, var(--svl-booking-olive) 18%, transparent); }
.svl-private-rate-notice strong,
.svl-private-rate-notice span { display: block; }
.svl-private-rate-notice span { margin-top: 3px; color: var(--svl-text-secondary); }
.svl-booking-error { padding: 12px 14px; border: 1px solid rgba(226, 139, 139, 0.55); border-radius: 9px; }

/* Mobile only. Tablet deliberately inherits desktop rules. */
@media (max-width: 767px) {
    .svl-booking-entry { --svl-step-context-gap: 56px; --svl-card-title-size: 22px; }
    .svl-choice-grid { grid-template-columns: 1fr; gap: 18px; width: min(100%, 340px); margin-inline: auto; }
    .svl-choice-card { --svl-card-padding: 18px; min-height: 158px; aspect-ratio: 1.7 / 1; }
    .svl-booking-locations { margin-bottom: 34px; }
    .svl-location-card { --svl-card-padding: 14px; }
    .svl-location-card .svl-booking-card-title { max-width: 9ch; }
    .svl-location-card .svl-booking-card-meta { margin-top: 8px; }
    .svl-booking-card-kicker { margin-bottom: 8px; font-size: 10px; letter-spacing: .12em; }
    .svl-path-grid { grid-template-columns: minmax(0, 320px); justify-content: center; }
    .svl-path-card { min-height: 124px; }

    .svl-calendar-shell,
    .svl-booking-summary,
    .svl-information-panel,
    .svl-review-panel { padding: 18px 16px; }

    .svl-booknetic-panel-host .booknetic_date_time_area { flex-direction: column !important; gap: 12px; }
    .svl-booknetic-panel-host .booknetic_calendar_div,
    .svl-booknetic-panel-host .booknetic_time_div { width: 100% !important; flex-basis: auto; }
    .svl-booknetic-panel-host .booknetic_times_list { height: auto !important; max-height: 260px; }

    .svl-information-panel .col-md-6,
    .svl-information-panel .col-md-4,
    .svl-information-panel .col-md-3,
    .svl-package-customer-form .col-md-6,
    .svl-package-customer-form .col-md-4,
    .svl-package-customer-form .col-md-3 { flex-basis: 100%; max-width: 100%; }

    .svl-primary-action,
    .svl-secondary-action { width: 100%; }
    .svl-booking-summary-actions,
    .svl-information-actions,
    .svl-review-actions { flex-direction: column; }
    .svl-waitlist { align-items: flex-start; flex-direction: column; gap: 5px; }
    .svl-time-filter-host { margin-bottom: 14px; }
    .svl-time-filter-label {
        margin-bottom: 6px;
        font-size: 11px;
        letter-spacing: 0.09em;
        opacity: 0.82;
    }
    .svl-time-filter {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 5px;
    }
    .svl-time-filter-button {
        width: 100%;
        min-height: 32px;
        padding: 5px 4px;
        font-size: 12px;
        white-space: nowrap;
    }
    .svl-booking-policy-block { padding: 11px 12px; }
    .svl-booking-deadline,
    .svl-booking-policy-copy,
    .svl-booking-policy-notice { font-size: 14px; }
    .svl-booking-deadline strong { font-size: 15px; }
}

@media (max-width: 460px) {
    .svl-first-lesson-horizon-note { font-size: 14px; }
    .svl-location-card .svl-booking-card-title { max-width: 100%; }
    .svl-selected-lesson-row { align-items: flex-start; }
    .svl-time-filter-button { font-size: 11px; padding-inline: 2px; }
    .svl-booknetic-panel-host .booknetic_calendar_days { padding: 3px !important; }
    .svl-booknetic-panel-host .booknetic_calendar_days > div { height: 38px !important; line-height: 38px !important; font-size: 13px !important; }
    .svl-booknetic-panel-host .booknetic_times_list > div { width: calc(50% - 8px) !important; margin: 4px !important; }
}

/* Participant details and Review own the viewport; earlier booking context stays hidden. */
.svl-booking-entry.svl-is-information .svl-resolved-offer-dynamic,
.svl-booking-entry.svl-is-information [data-svl-location-host],
.svl-booking-entry.svl-is-information [data-svl-calendar-host],
.svl-booking-entry.svl-is-information [data-svl-summary-host],
.svl-booking-entry.svl-is-review .svl-resolved-offer-dynamic,
.svl-booking-entry.svl-is-review [data-svl-location-host],
.svl-booking-entry.svl-is-review [data-svl-calendar-host],
.svl-booking-entry.svl-is-review [data-svl-summary-host] { display: none !important; }

/* Explicit reload choice: Back/Forward keeps the flow, a real reload asks before resuming. */
.svl-booking-entry.svl-awaiting-reload-choice > *:not(.svl-reload-prompt) {
    display: none !important;
}
.svl-reload-prompt {
    width: min(100%, 620px);
    margin: 18px auto;
    padding: 24px;
    color: var(--svl-text);
}
.svl-reload-prompt .svl-booking-summary-title { margin-bottom: 8px; }
.svl-reload-prompt-copy {
    margin: 0;
    color: var(--svl-text-secondary);
    font-size: var(--svl-booking-font-base);
}
.svl-reload-prompt-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}
@media (max-width: 767px) {
    .svl-reload-prompt { padding: 18px 16px; }
    .svl-reload-prompt-actions { flex-direction: column; }
    .svl-reload-prompt-actions .svl-primary-action,
    .svl-reload-prompt-actions .svl-secondary-action { width: 100%; }
}

/* First-lesson horizon: secondary explanation; range is also visible in the calendar itself. */
.svl-first-lesson-horizon-note {
    margin: 4px 0 16px;
    font-size: 15px;
    line-height: 1.45;
    color: color-mix(in srgb, var(--svl-text) 82%, transparent);
}

/* Immediate feedback while the first Booknetic calendar is prepared. */
.svl-calendar-pending { padding: 24px 22px; }
.svl-calendar-pending-heading { color: var(--svl-text-secondary); font-size: var(--svl-booking-font-base); }
.svl-calendar-pending-track { overflow: hidden; height: 3px; margin-top: 16px; background: rgba(255,255,255,.13); border-radius: 999px; }
.svl-calendar-pending-track > span { display: block; width: 34%; height: 100%; border-radius: inherit; background: #b39b5b; animation: svl-calendar-pending 1.25s ease-in-out infinite alternate; }
@keyframes svl-calendar-pending { from { transform: translateX(0); } to { transform: translateX(190%); } }
@media (prefers-reduced-motion: reduce) { .svl-calendar-pending-track > span { animation: none; width: 100%; } }

/* Discreet customer-facing SVL proprietary booking signature. */
.svl-booking-entry > .svl-system-credit,
.svl-customer-panel-shell > .svl-system-credit {
    margin: 76px auto 0;
    padding: 8px 10px;
    text-align: center;
    font-size: 11px;
    line-height: 1.5;
    font-weight: 400;
    letter-spacing: .065em;
    color: #a99e90;
    opacity: .65;
    text-transform: none;
    pointer-events: none;
}


/* Time-range label is informational: Returning/Flexible evening filter is disabled. */
.svl-time-filter-button:disabled {cursor:not-allowed!important;opacity:.62!important;border-color:rgba(255,255,255,.18)!important;background:transparent!important;color:var(--svl-text-secondary,#b9b3a9)!important}
.svl-time-filter-button .svl-fixed-only-label{display:block;font-size:10px;line-height:1.2;font-weight:650;letter-spacing:.04em;text-transform:uppercase;margin-bottom:3px;white-space:nowrap}
.svl-panel-filter-empty{font-size:13px;line-height:1.5;margin:12px 0;color:var(--svl-text-secondary,#b9b3a9)}

/* SVL 0.13.136: show empty-month explanation inside the native time panel,
   replacing its "Select date" placeholder on both desktop and mobile. */
.svl-booknetic-panel-host .booknetic_times_title.svl-empty-time-title-hidden { display: none !important; }
.svl-booknetic-panel-host .booknetic_times > .svl-calendar-empty-state {
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 0 10px 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 16px !important;
    width: 100% !important;
}
.svl-booknetic-panel-host.svl-calendar-filter-empty .booknetic_times_list { display: none !important; }

/* 0.13.162 — Compact time-range filters on small screens; the Fixed-only
   notice is informational, not a large fourth active filter button. */
@media (max-width: 640px) {
    .svl-booking-entry .svl-time-filter,
    .svl-panel-calendar-host .svl-time-filter {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 6px !important;
        width: 100% !important;
    }
    .svl-booking-entry .svl-time-filter.has-fixed-evening,
    .svl-panel-calendar-host .svl-time-filter.has-fixed-evening {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
    .svl-booking-entry .svl-time-filter .svl-time-filter-button,
    .svl-panel-calendar-host .svl-time-filter .svl-time-filter-button {
        min-width: 0 !important;
        width: 100% !important;
        min-height: 34px !important;
        padding: 6px 2px !important;
        font-size: 12px !important;
        line-height: 1.25 !important;
        white-space: nowrap !important;
    }
    .svl-booking-entry .svl-time-filter.has-fixed-evening .svl-time-filter-button:disabled,
    .svl-panel-calendar-host .svl-time-filter.has-fixed-evening .svl-time-filter-button:disabled {
        grid-column: 1 / -1;
        min-height: 30px !important;
        padding: 5px 8px !important;
        font-size: 11px !important;
        opacity: .58 !important;
        cursor: not-allowed !important;
    }
    .svl-booking-entry .svl-time-filter.has-fixed-evening .svl-fixed-only-label,
    .svl-panel-calendar-host .svl-time-filter.has-fixed-evening .svl-fixed-only-label {
        display: inline !important;
        margin: 0 9px 0 0 !important;
        font-size: 10px !important;
        line-height: 1 !important;
    }
}

.svl-selection-recovery-warning {
    color: #f2dadd;
    background: rgba(87, 18, 32, .30);
    border: 1px solid rgba(192, 85, 107, .55);
    border-radius: 8px;
    padding: 13px 16px;
    margin: 15px 0;
    font-size: 15px;
    line-height: 1.5;
}

/* Recovery: make Change the single prominent way forward without altering booking logic. */
.svl-booking-summary-recovery .svl-change-action {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 8px 12px !important;
    border: 1px solid var(--svl-gold, #c6a45f) !important;
    border-radius: 6px;
    color: var(--svl-gold, #c6a45f) !important;
}

/* 0.13.163 — Booking visual hierarchy only. No change to booking state/availability. */
.svl-booking-entry .svl-resolved-choice.svl-booking-glass {
    margin-bottom: 6px;
    padding: 4px 12px;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    opacity: .88;
}
.svl-booking-entry .svl-resolved-choice-label { font-size: 11px; letter-spacing: .12em; }
.svl-booking-entry .svl-booking-summary.svl-booking-glass {
    border-color: color-mix(in srgb, var(--svl-gold) 16%, transparent);
    --svl-glass-start: color-mix(in srgb, var(--svl-booking-olive) 11%, rgba(18,19,16,.85));
    --svl-glass-mid: color-mix(in srgb, var(--svl-booking-olive) 4%, rgba(10,10,10,.9));
    box-shadow: none;
}
.svl-booking-entry .svl-booking-summary-title {
    margin-bottom: 14px;
    letter-spacing: .11em;
    opacity: .9;
}
/* A single quiet but easily noticed deadline/policy row for every package rule. */
.svl-booking-entry .svl-booking-policy-block {
    position: relative;
    gap: 3px;
    min-height: 41px;
    margin: 4px 0 18px;
    padding: 8px 8px 9px 39px;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--svl-gold) 20%, transparent);
    background: transparent;
}
.svl-booking-entry .svl-booking-policy-block::before {
    content: '';
    position: absolute;
    top: 9px;
    left: 5px;
    width: 23px;
    height: 23px;
    background: url('calendar-clock.svg') center / contain no-repeat;
}
.svl-booking-entry .svl-booking-deadline { gap: 5px; color: var(--svl-text); }
.svl-booking-entry .svl-booking-deadline strong { color: var(--svl-gold-soft); font-weight: 700; }
.svl-booking-entry .svl-booking-policy-copy,
.svl-booking-entry .svl-booking-policy-notice { line-height: 1.45; }
/* The add action is secondary; the forward action is visually unmistakable. */
.svl-booking-entry .svl-booking-summary-actions .svl-secondary-action {
    border-color: color-mix(in srgb, var(--svl-text-secondary) 28%, transparent);
    background: transparent;
    color: var(--svl-gold-soft);
    box-shadow: none;
    font-weight: 500;
}
.svl-booking-entry .svl-booking-summary-actions .svl-primary-action {
    border-color: var(--svl-gold);
    background: var(--svl-gold);
    color: #161710;
    box-shadow: none;
    font-weight: 700;
}
.svl-booking-entry .svl-booking-summary-actions .svl-primary-action:hover:not(:disabled),
.svl-booking-entry .svl-booking-summary-actions .svl-primary-action:focus-visible:not(:disabled) {
    background: var(--svl-gold-soft);
    color: #161710;
}
.svl-booking-entry .svl-selected-lessons-list { border-top: 0; }
.svl-booking-entry .svl-selected-lesson-row { min-height: 68px; padding: 12px 0; }
.svl-booking-entry .svl-selected-lesson-row .svl-selected-lesson-copy strong { font-weight: 650; }
@media (max-width: 767px) {
    .svl-booking-entry .svl-booking-summary.svl-booking-glass { padding: 17px 16px 18px; }
    .svl-booking-entry .svl-booking-policy-block { margin-bottom: 12px; }
    .svl-booking-entry .svl-booking-summary-actions { gap: 9px; }
    .svl-booking-entry .svl-booking-summary-actions .svl-primary-action,
    .svl-booking-entry .svl-booking-summary-actions .svl-secondary-action { min-height: 46px; }
}