/* Блокируется страница, а не прокручиваемое содержимое штатного окна. */
html.servicepro-booking-scroll-lock {
    overflow: hidden;
    overscroll-behavior: none;
}

html.servicepro-booking-scroll-lock.servicepro-booking-scrollbar {
    scrollbar-gutter: stable;
}

/* Блокировка на html не должна создавать у body новый контейнер для sticky-шапки. */
html.servicepro-booking-scroll-lock body.servicepro-body {
    overflow: visible;
    overflow-x: clip;
}

.specappointment-booking-modal .specappointment-booking-root .spc-modal-body {
    overscroll-behavior: contain;
}

/* Booking widget follows the theme tokens */
.specappointment-booking-host,
.specappointment-booking-modal {
    --spc-accent: var(--servicepro-accent, #6f7561);
    --spc-accent-dark: #555c49;
    --spc-border: var(--servicepro-border, #d7d1cc);
    --spc-bg: var(--servicepro-page, #ece9e6);
    --spc-panel: var(--servicepro-surface, #fcf9f7);
    --spc-text: var(--servicepro-ink, #37302a);
    --spc-muted: var(--servicepro-ink-soft, #746c65);
    --spc-link: var(--servicepro-accent, #6f7561);
}

.specappointment-booking-root {
    font-family: var(--servicepro-body-font, "Onest", sans-serif);
}

.specappointment-booking-root .spc-modal-title,
.specappointment-booking-root .spc-spec-name,
.specappointment-booking-root .spc-cal-title,
.specappointment-booking-host .spc-title {
    font-family: var(--servicepro-heading-font, "Onest", sans-serif);
    font-weight: 400;
}

.specappointment-booking-modal .spc-modal,
.specappointment-booking-modal .spc-modal-root,
.specappointment-booking-root .spc-spec-card,
.specappointment-booking-root .spc-form-fields input:not([type="checkbox"]):not([type="radio"]),
.specappointment-booking-root .spc-form-fields textarea,
.specappointment-booking-root .spc-form-fields select,
.specappointment-booking-root .spc-service-trigger,
.specappointment-booking-root .spc-service-menu,
.specappointment-booking-root .spc-service-option,
.specappointment-booking-root .spc-calendar,
.specappointment-booking-root .spc-cal-panel,
.specappointment-booking-root .spc-time-btn {
    background: var(--spc-panel);
    color: var(--spc-text);
}

.specappointment-booking-modal .spc-modal,
.specappointment-booking-root .spc-spec-card,
.specappointment-booking-root .spc-calendar,
.specappointment-booking-root .spc-service-trigger,
.specappointment-booking-root .spc-form-fields input:not([type="checkbox"]):not([type="radio"]),
.specappointment-booking-root .spc-form-fields textarea,
.specappointment-booking-root .spc-form-fields select,
.specappointment-booking-root .spc-time-btn {
    border-color: var(--spc-border);
    border-radius: var(--servicepro-card-radius);
}

.specappointment-booking-root .spc-form-fields input:not([type="checkbox"]):not([type="radio"]),
.specappointment-booking-root .spc-form-fields textarea,
.specappointment-booking-root .spc-form-fields select,
.specappointment-booking-root .spc-time-btn {
    border-radius: var(--servicepro-input-radius);
}

.specappointment-booking-root .spc-spec-card {
    padding: 16px;
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

.specappointment-booking-root .spc-spec-card:hover {
    transform: translateY(-1px);
}

.specappointment-booking-root .spc-spec-card.is-active,
.specappointment-booking-root .spc-service-option.is-selected,
.specappointment-booking-root .spc-service-option.is-selected:hover,
.specappointment-booking-root .spc-service-option.is-selected:focus,
.specappointment-booking-root .spc-service-option.is-selected:active {
    border-color: var(--spc-accent);
    background: rgba(111, 117, 97, .11);
    color: var(--spc-text) !important;
}

.specappointment-booking-root .spc-service-trigger:focus,
.specappointment-booking-root .spc-service-trigger:focus-visible {
    border-color: var(--spc-accent);
    box-shadow: 0 0 0 3px rgba(111, 117, 97, .14) !important;
}

.specappointment-booking-root .spc-cal-hero {
    background: var(--servicepro-dark, #181511);
    color: var(--servicepro-surface, #fcf9f7);
}

.specappointment-booking-root .spc-day.is-open:hover,
.specappointment-booking-root .spc-day.is-selected .spc-day-num,
.specappointment-booking-root .spc-time-btn.is-active,
.specappointment-booking-root .spc-time-btn.is-active:hover,
.specappointment-booking-root .spc-time-btn.is-active:focus,
.specappointment-booking-root .spc-submit {
    border-color: var(--servicepro-dark, #181511);
    background: var(--servicepro-dark, #181511);
    color: var(--servicepro-surface, #fcf9f7);
}

.specappointment-booking-root .spc-day.is-today .spc-day-num {
    border-color: var(--spc-accent);
    color: var(--spc-accent-dark);
}

.specappointment-booking-root .spc-submit {
    min-height: 48px;
    padding-inline: 24px;
    border-radius: var(--servicepro-button-radius);
}

.specappointment-booking-root .spc-time-btn {
    min-height: 46px;
}

.specappointment-booking-modal .spc-modal {
    border-radius: var(--servicepro-modal-radius, 14px);
}

@media (max-width: 620px) {
    .servicepro-booking-layout__main {
        padding: 24px 16px;
    }

    .specappointment-booking-root .spc-cal-hero {
        min-height: 210px;
    }

    .specappointment-booking-root .spc-time-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
.specappointment-booking-modal .spc-spec-card[hidden],
.specappointment-booking-modal .spc-service-option[hidden] { display: none; }