/* Auto-split from style.css — do not edit by hand without re-split awareness. */


.schedule-modal-tab--clarify {
    color: var(--danger-text) !important;
}

.schedule-toolbar {
    display: flex;
    align-items: end;
    gap: 9px;
    flex-wrap: wrap;
}

.schedule-strip-wrap {
    margin-top: 0;
    margin-bottom: 1rem;
    position: sticky;
    /* Липнем сразу под шапкой (значение выставляется из JS на странице графика) */
    top: var(--schedule-sticky-top, calc(env(safe-area-inset-top, 0px) + var(--leader-sidebar-under-header)));
    z-index: 9;
    padding: 8px 9px;
    border-radius: 9px;
    border: 1px solid var(--border);
    background: var(--leader-collapsible-bg);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* В pin-блоке графика — без лишнего margin и без собственного sticky */
.schedule-pin .schedule-strip-wrap {
    position: static;
    top: auto;
    z-index: auto;
    margin: 0;
    margin-bottom: 0;
    padding: 4px 6px;
}

.schedule-location-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin-bottom: 1rem;
    padding: 9px 12px;
    border-radius: 9px;
    border: 1px solid var(--border);
    background: var(--leader-collapsible-bg);
}

.schedule-location-bar__label {
    font-weight: 700;
    font-size: 10px;
}

.schedule-location-bar__select {
    min-width: min(100%, 240px);
    max-width: 100%;
    padding: 8px 9px;
    border-radius: 9px;
    border: 1px solid var(--border);
    font: inherit;
    background: var(--field-surface);
    color: var(--text);
}

.schedule-days-strip {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 0;
}

/* Успешное завершение записи (график): без перезагрузки страницы */
.schedule-completion-toast {
    position: fixed;
    right: max(12px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
    z-index: 10050;
    max-width: min(270px, calc(100vw - 24px));
    padding: 9px 12px;
    border-radius: 8px;
    background: var(--card);
    color: var(--text, #111827);
    border: 1px solid var(--border);
    box-shadow: 0 8px 27px rgba(15, 23, 42, 0.14);
    font-size: 0.95rem;
    line-height: 1.35;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.4s ease, transform 0.4s ease;
    pointer-events: none;
}

.schedule-completion-toast--in {
    opacity: 1;
    transform: translateY(0);
}

.schedule-completion-toast--out {
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

/* Общий предок шапки (.schedule-pin) и тела (.schedule-workspace__body) —
   иначе --schedule-time-col-width не доходит до thead и колонки «плывут». */
.schedule-workspace {
    /* Ширина колонок «Время» (фикс.); боксы делят остаток: (контейнер − время×N) / N боксов */
    --schedule-time-col-width: 3.25rem;
}

.schedule-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
    max-height: none;
    transition: padding-bottom 0.16s ease;
    container-type: inline-size;
    container-name: schedule-scroll;
}

.schedule-scroll.schedule-scroll--services-preview-open {
    overflow-y: visible;
}

.schedule-scroll .schedule-table {
    overflow: visible;
}

/* До 5 боксов — таблица на всю ширину карточки, боксы равной ширины */
.schedule-scroll--fit .schedule-table {
    width: 100%;
    table-layout: fixed;
}

.schedule-scroll--fit .schedule-col-time {
    width: var(--schedule-time-col-width, 3.25rem);
    min-width: var(--schedule-time-col-width, 3.25rem);
    max-width: var(--schedule-time-col-width, 3.25rem);
}

.schedule-scroll--fit .schedule-col-box {
    width: calc(
        (100% - (var(--schedule-time-col-count, 2) * var(--schedule-time-col-width, 3.25rem)))
            / max(1, var(--schedule-box-count, 1))
    );
    /* min-width: 0 давало сильное сжатие «Свободно» / «Прошло» и боксов */
    min-width: max(7.5rem, 100px);
}

/* Больше 5 боксов — горизонтальный скролл; мин. ширина бокса ≈ (ширина области − колонки времени) / min(боксов, 5) */
.schedule-scroll:not(.schedule-scroll--fit) .schedule-table {
    width: auto;
    min-width: 100%;
    table-layout: auto;
}

.schedule-scroll:not(.schedule-scroll--fit) .schedule-col-time {
    width: var(--schedule-time-col-width, 3.25rem);
    min-width: var(--schedule-time-col-width, 3.25rem);
    box-sizing: border-box;
}

.schedule-scroll:not(.schedule-scroll--fit) .schedule-col-box {
    min-width: max(
        7.5rem,
        calc(
            (100cqi - (var(--schedule-time-col-count, 2) * var(--schedule-time-col-width, 3.25rem)))
                / max(1, var(--schedule-slot-divisor, 1))
        )
    );
    box-sizing: border-box;
}

.schedule-table th,
.schedule-table td {
    border-top: 1px solid var(--border);
    padding: 6px 8px;
    vertical-align: top;
}

/* Минимальная высота слота; фиксированная высота шага — index.css (--schedule-slot-h) */
.schedule-table {
    --schedule-row-min-h: 2.75rem;
    --schedule-slot-h: 2.5rem;
    --schedule-booking-single-slot-h: 6rem;
    --schedule-booking-actions-reserve: 28px;
    --schedule-booking-main-line-gap: 4px;
    --schedule-free-btn-min-h: 2.25rem;
    --schedule-free-row-min-h: calc(var(--schedule-free-btn-min-h) + 16px);
    --schedule-cell-gutter: 8px;
}

.schedule-table tbody td.schedule-td-time,
.schedule-table tbody td.schedule-col-box {
    height: var(--schedule-slot-h);
    box-sizing: border-box;
}

/* Повышаем высоту только для одиночных записей; multi-slot тянется за счёт rowspan */
.schedule-table tbody tr.schedule-tr-has-single-slot-booking td.schedule-td-time,
.schedule-table tbody tr.schedule-tr-has-single-slot-booking td.schedule-col-box {
    height: var(--schedule-booking-single-slot-h);
}

.schedule-table tbody tr.schedule-tr-all-free {
    height: var(--schedule-free-row-min-h);
    min-height: var(--schedule-free-row-min-h);
}

/* «Свободно»: высота кнопки ×2 (в потоке — иначе table/td min-height не срабатывает) */
.schedule-table tbody td.schedule-col-box.schedule-td-free {
    padding: var(--schedule-cell-gutter);
    vertical-align: middle;
    text-align: center;
    box-sizing: border-box;
}

.schedule-table tbody td.schedule-td-common-off {
    background: color-mix(in srgb, var(--field-surface) 72%, var(--bg) 28%);
}

.schedule-table .schedule-common-off-msg {
    display: block;
    white-space: normal;
    word-break: break-word;
    line-height: 1.25;
    max-width: 12rem;
    margin: 0 auto;
    text-align: center;
    font-size: 0.8125rem;
}

.schedule-table tbody td.schedule-col-box.schedule-td-free .schedule-free-btn {
    width: 100%;
    min-height: var(--schedule-free-btn-min-h);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-sizing: border-box;
}

/* В строке с одиночной записью соседний пост «Свободно» — та же высота, что у плашки записи */
.schedule-table tbody tr.schedule-tr-has-single-slot-booking td.schedule-col-box.schedule-td-free {
    position: relative;
    padding: 0;
    vertical-align: top;
}

.schedule-table tbody tr.schedule-tr-has-single-slot-booking td.schedule-col-box.schedule-td-free .schedule-free-btn {
    position: absolute;
    inset: var(--schedule-cell-gutter);
    width: auto;
    height: auto;
    min-height: 0;
}

/* Удержание слота (онлайн / форма «Новая запись») */
.schedule-table tbody td.schedule-td-slot-hold {
    padding: 6px 8px;
    vertical-align: middle;
    text-align: center;
    background: transparent;
}
/* Несколько слотов подряд — тянем подпись на всю объединённую ячейку */
.schedule-table tbody td.schedule-td-slot-hold-span {
    position: relative;
    padding: 0;
    vertical-align: top;
}
.schedule-table tbody td.schedule-td-slot-hold-span .schedule-hold-btn {
    position: absolute;
    top: 6px;
    left: 8px;
    right: 8px;
    bottom: 6px;
    width: auto;
    height: auto;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Запись: absolute inset — index.css */
.schedule-table tbody td.schedule-col-box.schedule-td-booking {
    position: relative;
    padding: 0;
    vertical-align: top;
    box-sizing: border-box;
}

.schedule-table tbody td.schedule-td-booking-span {
    padding: 0;
    vertical-align: top;
    background: var(--schedule-surface);
}

.schedule-booking-panel--time-clarify {
  border-color: color-mix(in srgb, var(--danger-text) 48%, rgba(14, 165, 233, 0.35)) !important;
  background: color-mix(in srgb, var(--danger-text) 10%, var(--card-bg, var(--card))) !important;
}

.schedule-booking-cell--time-clarify .schedule-booking-btn--main {
    color: var(--danger-text);
}

/*
 * Многосегментная запись: absolute у .schedule-booking-btn убран — с абсолютным
 * дочерним кнопка не задаёт высоту .schedule-booking-panel, и в ячейке
 * с rowspan остаётся пустая полоса «между слотами». Высоту тянет flex в index.css.
 */

.schedule-table th {
    border-top: 0;
    text-align: left;
    color: var(--muted);
    font-size: 10px;
}

.schedule-table th.schedule-th-box {
    text-align: center;
}

.schedule-table .schedule-th-time,
.schedule-table .schedule-td-time {
    white-space: nowrap;
    padding: 4px 3px;
    font-variant-numeric: tabular-nums;
    text-align: center;
    vertical-align: middle;
    box-sizing: border-box;
}

.schedule-col-time--sticky-left {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--schedule-surface);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 3px 0 6px -3px rgba(15, 23, 42, 0.12);
}

.schedule-col-time--sticky-right {
    position: sticky;
    right: 0;
    z-index: 2;
    background: var(--schedule-surface);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: -3px 0 6px -3px rgba(15, 23, 42, 0.12);
}

.schedule-booking-btn,
.schedule-free-btn,
.schedule-hold-btn {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--field-surface);
    color: var(--text);
    padding: 7px 8px;
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
    font-size: 13px;
    line-height: 1.32;
}

.schedule-free-btn {
    min-height: var(--schedule-free-btn-min-h, 2.25rem);
    text-align: center;
}

.schedule-booking-btn {
    background: rgba(14, 165, 233, 0.08);
    border-color: rgba(14, 165, 233, 0.4);
    position: relative;
}

/* Тёмная тема: ячейка «запись» не светится как на светлом фоне */
html[data-simple-ui-theme="dark"] .schedule-booking-btn {
    background: rgba(56, 189, 248, 0.1);
    border-color: rgba(56, 189, 248, 0.26);
    color: var(--text);
}

html[data-simple-ui-theme="dark"] .schedule-cell-services-preview {
    border-color: rgba(56, 189, 248, 0.28);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.38);
}

@media (prefers-color-scheme: dark) {
    html[data-simple-ui-theme="system"] .schedule-booking-btn {
        background: rgba(56, 189, 248, 0.1);
        border-color: rgba(56, 189, 248, 0.26);
        color: var(--text);
    }

    html[data-simple-ui-theme="system"] .schedule-cell-services-preview {
        border-color: rgba(56, 189, 248, 0.28);
        box-shadow: 0 8px 22px rgba(0, 0, 0, 0.38);
    }

}

.schedule-booking-panel {
    position: relative;
    overflow: visible;
}

.schedule-booking-cell {
    overflow: visible;
}

.schedule-cell-services-preview {
    position: absolute;
    left: 0;
    right: auto;
    top: calc(100% + 4px);
    z-index: 50;
    box-sizing: border-box;
    /* Не уже плашки; на узкой колонке — минимум 400px */
    width: max(100%, min(400px, calc(100vw - 24px)));
    min-width: min(400px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    padding: 10px 12px 12px;
    border: 1px solid rgba(14, 165, 233, 0.35);
    border-radius: 10px;
    background: var(--card-bg, var(--card));
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
    max-height: min(280px, 52vh);
    opacity: 0;
    overflow-x: hidden;
    overflow-y: auto;
    pointer-events: none;
    transform: translateY(-4px);
    transition: opacity 0.14s ease, transform 0.14s ease;
}

.schedule-booking-panel:hover .schedule-cell-services-preview,
.schedule-booking-panel:focus-within .schedule-cell-services-preview,
.schedule-booking-panel.schedule-booking-panel--services-open .schedule-cell-services-preview,
.schedule-cell-services-preview.schedule-cell-services-preview--layout {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Кнопки в широкой всплывашке — в один ряд, без сжатия по ширине колонки */
.schedule-booking-actions.schedule-booking-actions--in-preview {
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    padding: 0 0 8px;
    border-top: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--border, #cbd5e1) 85%, transparent);
    opacity: 1;
    transform: none;
    pointer-events: auto !important;
    z-index: auto;
}

.schedule-booking-actions.schedule-booking-actions--in-preview .schedule-booking-quick-btn,
.schedule-booking-actions.schedule-booking-actions--in-preview .btn {
    flex: 0 0 auto;
    white-space: nowrap;
    font-size: 12px;
    line-height: 1.25;
    padding: 5px 10px;
    min-height: 30px;
    pointer-events: auto;
    cursor: pointer;
}

/* Hover-строка и ячейка — превью вниз не перекрывается соседними ячейками/строками */
.schedule-table tbody tr:has(td.schedule-td-booking:hover),
.schedule-table tbody tr:has(td.schedule-td-booking:focus-within),
.schedule-table tbody tr:has(.schedule-booking-panel--services-open) {
    position: relative;
    z-index: 25;
}

.schedule-table tbody tr:last-child td.schedule-td-booking {
    overflow: visible;
}

/* Плашка записи и превью услуг — поверх соседних ячеек в строке */
.schedule-table tbody td.schedule-td-booking:hover,
.schedule-table tbody td.schedule-td-booking:focus-within,
.schedule-table tbody td.schedule-td-booking:has(.schedule-booking-panel--services-open) {
    position: relative;
    z-index: 30;
}

.schedule-booking-panel:hover,
.schedule-booking-panel:focus-within,
.schedule-booking-panel.schedule-booking-panel--services-open {
    z-index: 40;
}

.schedule-booking-panel:hover .schedule-booking-btn,
.schedule-booking-panel:focus-within .schedule-booking-btn {
    box-shadow: none;
}

.schedule-booking-comments-badge {
    position: absolute;
    top: 4px;
    right: 6px;
    font-size: 12px;
    line-height: 1;
    opacity: 0.88;
    pointer-events: none;
}

.schedule-cell-comments-preview__label {
    margin-top: 6px;
}

.schedule-cell-comments-preview__stack {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 13px;
    line-height: 1.35;
    color: var(--text);
}

.schedule-cell-comments-preview__line {
    white-space: pre-wrap;
    word-break: break-word;
}

.schedule-cell-services-preview__label {
    display: block;
    font-size: 13px;
    color: var(--text);
    font-weight: 600;
    margin-bottom: 4px;
}

.schedule-cell-services-preview__list {
    margin: 0;
    padding-left: 16px;
    font-size: 13px;
    line-height: 1.35;
}

.schedule-booking-actions .btn {
    min-height: 30px;
    font-size: 12px;
    padding: 6px 10px;
}

.schedule-free-btn {
    background: rgba(34, 197, 94, 0.10);
    border-color: rgba(34, 197, 94, 0.35);
}

.schedule-hold-btn {
    background: #fff9c4;
    border-color: rgba(180, 150, 0, 0.35);
    color: #5d4a00;
    cursor: default;
    font-weight: 600;
    line-height: 1.25;
    white-space: normal;
    word-break: break-word;
    text-align: center;
}

#booking-reschedule-modal .schedule-days-strip,
dialog.booking-modal.cabinet-reschedule-dialog .schedule-days-strip {
    flex-wrap: nowrap;
    overflow-x: hidden;
}

#booking-reschedule-modal .schedule-strip-wrap,
dialog.booking-modal.cabinet-reschedule-dialog .schedule-strip-wrap {
    margin-bottom: 0;
}

#booking-create-modal .schedule-modal-tabs--sticky {
    flex-shrink: 0;
}

#booking-info-modal .schedule-modal-pane.is-active[data-pane="main"],
#booking-info-modal .schedule-modal-pane.is-active[data-pane="services"],
#booking-info-modal .schedule-modal-pane.is-active[data-pane="marketing_calc"],
#booking-info-modal .schedule-modal-pane.is-active[data-pane="comment"] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    box-sizing: border-box;
}

#booking-info-modal .schedule-modal-pane.is-active[data-pane="main"] {
    justify-content: flex-start;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 3px;
    padding-bottom: 9px;
    box-sizing: border-box;
    -webkit-overflow-scrolling: touch;
}

#booking-info-modal .schedule-modal-pane.is-active[data-pane="comment"] {
    justify-content: flex-start;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 3px;
    padding-bottom: 9px;
    box-sizing: border-box;
    -webkit-overflow-scrolling: touch;
}

.schedule-modal-tabs {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 6px 0 9px;
    flex-wrap: wrap;
}

.schedule-modal-tabs__start {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.schedule-modal-tabs--sticky {
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--card-bg, var(--card));
    padding-bottom: 6px;
}


.schedule-modal-pane {
    display: none;
}

.schedule-modal-pane.is-active {
    display: block;
}