/* Public scheduling surface — intentionally loaded after legacy calendar layers. */
body[data-page="index"] .booking-calendar-shell {
    width: min(100%, 1060px);
    margin-inline: auto;
    border: 1px solid rgba(20, 72, 112, .14);
    border-radius: 20px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 48px rgba(18, 75, 112, .1);
    overflow: hidden;
}

body[data-page="index"] .booking-calendar-intro {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 24px 16px;
}

body[data-page="index"] .booking-calendar-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 6px;
    color: #1266b6;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
}

body[data-page="index"] .booking-calendar-intro h2 {
    margin: 0;
    color: #0a243d;
    font-size: clamp(1.65rem, 3vw, 2.35rem);
    font-weight: 850;
    line-height: 1.08;
    letter-spacing: -.025em;
}

body[data-page="index"] .booking-calendar-intro p {
    margin: 7px 0 0;
    max-width: 620px;
    color: #587086;
    font-size: 14px;
    line-height: 1.5;
}

body[data-page="index"] .booking-hours {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
    border-left: 3px solid #ff9f1c;
    padding: 7px 0 7px 12px;
    color: #17334c;
    font-size: 13px;
}

body[data-page="index"] .booking-hours i {
    color: #e78300;
    font-size: 18px;
}

body[data-page="index"] .booking-hours span,
body[data-page="index"] .booking-hours strong {
    display: block;
}

body[data-page="index"] .booking-hours strong {
    margin-bottom: 1px;
    font-size: 11px;
    font-weight: 800;
}

body[data-page="index"] .calendar-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    border-block: 1px solid rgba(20, 72, 112, .1);
    padding: 10px 24px;
    background: #f6faff;
}

body[data-page="index"] .calendar-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #4a6278;
    font-size: 12px;
    font-weight: 700;
}

body[data-page="index"] .legend-mark {
    width: 10px;
    height: 10px;
    border: 1px solid transparent;
    border-radius: 3px;
}

body[data-page="index"] .legend-mark.available { background: #fff; border-color: #7aaee0; }
body[data-page="index"] .legend-mark.today { background: #147ce5; }
body[data-page="index"] .legend-mark.booked { background: #ff9f1c; }
body[data-page="index"] .legend-mark.unavailable { background: #dce3e9; }

body[data-page="index"] .calendar-mobile-hint {
    display: none;
    margin: 0;
    padding: 10px 14px 0;
    color: #49647c;
    font-size: 12px;
    font-weight: 700;
}

body[data-page="index"] #calendar {
    width: 100%;
    max-width: 100%;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible;
    padding: 16px 24px 8px !important;
}

body[data-page="index"] #calendar .fc {
    color: #17334c;
    font-family: inherit;
}

body[data-page="index"] #calendar .fc-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 12px !important;
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
}

body[data-page="index"] #calendar .fc-toolbar-chunk:first-child { justify-self: start; }
body[data-page="index"] #calendar .fc-toolbar-chunk:nth-child(2) { justify-self: center; }
body[data-page="index"] #calendar .fc-toolbar-chunk:last-child { justify-self: end; }

body[data-page="index"] #calendar .fc-toolbar-title {
    color: #0a243d !important;
    font-size: 1.08rem !important;
    font-weight: 850 !important;
    letter-spacing: -.015em;
    line-height: 1.2;
    text-align: center;
}

body[data-page="index"] #calendar .fc-button-group {
    display: inline-flex;
    gap: 4px;
    border: 0;
    border-radius: 9px;
    background: #eef5fb;
    padding: 3px;
}

body[data-page="index"] #calendar .fc-button {
    min-width: 40px;
    min-height: 40px;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #24567f !important;
    box-shadow: none !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-transform: capitalize;
}

body[data-page="index"] #calendar .fc-button:hover,
body[data-page="index"] #calendar .fc-button:focus-visible,
body[data-page="index"] #calendar .fc-button-active {
    border-color: #bed8ee !important;
    background: #fff !important;
    color: #0c66b2 !important;
}

body[data-page="index"] #calendar .fc-button:focus-visible {
    outline: 3px solid rgba(20, 124, 229, .24) !important;
    outline-offset: 2px;
}

body[data-page="index"] #calendar .fc-scrollgrid {
    overflow: hidden;
    border: 1px solid #d8e4ed !important;
    border-radius: 12px;
    table-layout: fixed !important;
}

body[data-page="index"] #calendar :is(.fc-theme-standard td, .fc-theme-standard th, .fc-scrollgrid td, .fc-scrollgrid th) {
    border-color: #e1e9ef !important;
}

body[data-page="index"] #calendar .fc-col-header {
    background: #0d70bf !important;
}

body[data-page="index"] #calendar .fc-col-header-cell {
    border: 0 !important;
    background: transparent !important;
    padding: 8px 2px !important;
}

body[data-page="index"] #calendar .fc-col-header-cell:first-child,
body[data-page="index"] #calendar .fc-col-header-cell:last-child {
    background: #e88300 !important;
}

body[data-page="index"] #calendar .fc-col-header-cell-cushion {
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 850;
    letter-spacing: .02em;
    text-decoration: none;
}

body[data-page="index"] #calendar .fc-daygrid-day {
    background: #fff !important;
    transition: background-color 140ms ease, box-shadow 140ms ease;
}

body[data-page="index"] #calendar .fc-daygrid-day-frame {
    min-height: 72px !important;
}

body[data-page="index"] #calendar .fc-daygrid-day-number {
    display: inline-grid;
    min-width: 32px;
    min-height: 32px;
    place-items: center;
    margin: 4px;
    border-radius: 8px;
    color: #163650 !important;
    font-size: 12px !important;
    font-weight: 750;
    line-height: 1;
    padding: 0 !important;
    text-decoration: none;
}

body[data-page="index"] #calendar .fc-daygrid-day.is-bookable {
    cursor: pointer !important;
}

body[data-page="index"] #calendar .fc-daygrid-day.is-bookable:hover {
    background: #edf7ff !important;
    box-shadow: inset 0 0 0 2px rgba(20, 124, 229, .42);
}

body[data-page="index"] #calendar .fc-daygrid-day.is-bookable:focus-within {
    box-shadow: inset 0 0 0 3px rgba(20, 124, 229, .34);
}

body[data-page="index"] #calendar .fc-daygrid-day.is-selected {
    background: #eaf5ff !important;
    box-shadow: inset 0 0 0 2px #147ce5;
}

body[data-page="index"] #calendar .fc-daygrid-day.is-selected .fc-daygrid-day-number {
    color: #0b61a8 !important;
    font-weight: 900;
}

body[data-page="index"] #calendar .fc-daygrid-day.is-unavailable {
    background: #f0f3f5 !important;
    cursor: not-allowed !important;
}

body[data-page="index"] #calendar .fc-daygrid-day.is-unavailable .fc-daygrid-day-number {
    color: #91a0ac !important;
    text-decoration: line-through;
    text-decoration-thickness: 1px;
}

body[data-page="index"] #calendar .fc-day-other .fc-daygrid-day-number {
    color: #a6b2bc !important;
}

body[data-page="index"] #calendar .fc-day-today {
    background: #e7f3ff !important;
}

body[data-page="index"] #calendar .fc-day-today .fc-daygrid-day-number {
    width: 32px !important;
    height: 32px !important;
    background: #147ce5 !important;
    color: #fff !important;
    border-radius: 8px !important;
}

body[data-page="index"] #calendar .fc-event {
    border: 0 !important;
    border-radius: 4px !important;
    background: #fff0da !important;
    color: #864c00 !important;
    padding: 2px 5px !important;
    font-size: 10px !important;
    font-weight: 800;
}

body[data-page="index"] #calendar .fc-event * {
    color: inherit !important;
}

body[data-page="index"] .calendar-status {
    margin: 0;
    min-height: 35px;
    padding: 7px 24px 12px;
    color: #5e7487;
    font-size: 12px;
    line-height: 1.35;
}

body[data-page="index"] .calendar-status.is-error {
    color: #a42b2b;
    font-weight: 700;
}

html[data-bs-theme="dark"] body[data-page="index"] .booking-calendar-shell {
    border-color: rgba(140, 192, 236, .2);
    background: #0c2032;
    box-shadow: 0 18px 52px rgba(0, 0, 0, .28);
}

html[data-bs-theme="dark"] body[data-page="index"] :is(.booking-calendar-intro h2, #calendar .fc-toolbar-title) {
    color: #f4f8fb !important;
}

html[data-bs-theme="dark"] body[data-page="index"] .booking-hours {
    color: #d7e8f5;
}

html[data-bs-theme="dark"] body[data-page="index"] :is(.booking-calendar-intro p, .calendar-legend span, .calendar-status) {
    color: #b7c8d6;
}

html[data-bs-theme="dark"] body[data-page="index"] .calendar-legend {
    border-color: rgba(150, 190, 220, .14);
    background: #102a40;
}

html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-button-group { background: #15334a; }
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-button { color: #badaf5 !important; }
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-button:hover,
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-button:focus-visible,
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-button-active { background: #21445f !important; color: #fff !important; }
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-daygrid-day { background: #0f273a !important; }
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-daygrid-day.is-bookable:hover { background: #173a55 !important; }
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-daygrid-day.is-unavailable { background: #101d28 !important; }
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-daygrid-day-number { color: #e0ecf5 !important; }
html[data-bs-theme="dark"] body[data-page="index"] #calendar .fc-daygrid-day.is-unavailable .fc-daygrid-day-number { color: #667988 !important; }

@media (max-width: 767.98px) {
    body[data-page="index"] .booking-calendar-shell { border-radius: 16px; }
    body[data-page="index"] .booking-calendar-intro { align-items: flex-start; padding: 16px 16px 12px; }
    body[data-page="index"] .booking-calendar-intro h2 { font-size: clamp(1.45rem, 7vw, 1.9rem); }
    body[data-page="index"] .booking-calendar-intro p { font-size: 13px; }
    body[data-page="index"] .booking-hours { display: none; }
    body[data-page="index"] .calendar-legend { gap: 7px 14px; padding: 9px 16px; }
    body[data-page="index"] .calendar-mobile-hint { display: flex; align-items: center; gap: 6px; }
    body[data-page="index"] #calendar { padding: 10px 12px 4px !important; overflow: visible !important; }
    body[data-page="index"] #calendar .fc-toolbar { grid-template-columns: minmax(0, 1fr) auto !important; gap: 8px !important; }
    body[data-page="index"] #calendar .fc-toolbar-chunk:first-child { justify-self: end; order: 2; }
    body[data-page="index"] #calendar .fc-toolbar-chunk:nth-child(2) { justify-self: start; order: 1; }
    body[data-page="index"] #calendar .fc-toolbar-chunk:last-child { display: none; }
    body[data-page="index"] #calendar .fc-toolbar-title { font-size: .96rem !important; text-align: left; }
    body[data-page="index"] #calendar .fc-button {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        padding: 6px !important;
    }
    body[data-page="index"] #calendar .fc-daygrid-day-frame { min-height: 48px !important; }
    body[data-page="index"] #calendar .fc-daygrid-day-number { min-width: 28px; min-height: 28px; margin: 2px; font-size: 11px !important; }
    body[data-page="index"] #calendar .fc-day-today .fc-daygrid-day-number { width: 28px !important; height: 28px !important; }
    body[data-page="index"] #calendar .fc-event { display: block; height: 5px; margin: 1px 3px !important; overflow: hidden; padding: 0 !important; text-indent: -999px; }
    body[data-page="index"] #calendar .fc-daygrid-more-link {
        display: block;
        height: 5px;
        margin: 1px 3px;
        overflow: hidden;
        border-radius: 999px;
        background: #ff9f1c;
        color: transparent !important;
        font-size: 0 !important;
        line-height: 0;
    }
    body[data-page="index"] .calendar-status { padding: 5px 14px 10px; }
}

@media (max-width: 380px) {
    body[data-page="index"] .booking-calendar-intro { padding-inline: 12px; }
    body[data-page="index"] .calendar-legend { display: grid; grid-template-columns: 1fr 1fr; padding-inline: 12px; }
    body[data-page="index"] #calendar { padding-inline: 8px !important; }
    body[data-page="index"] #calendar .fc-col-header-cell-cushion { font-size: 9px !important; }
    body[data-page="index"] #calendar .fc-daygrid-day-frame { min-height: 45px !important; }
    body[data-page="index"] #calendar .fc-daygrid-day-number { min-width: 26px; min-height: 26px; font-size: 10px !important; }
    body[data-page="index"] #calendar .fc-day-today .fc-daygrid-day-number { width: 26px !important; height: 26px !important; }
}

@media (prefers-reduced-motion: reduce) {
    body[data-page="index"] #calendar .fc-daygrid-day { transition: none; }
}
