/* _content/FTS.Online/Components/Layout/MainLayout.razor.rz.scp.css */
/* _hideChrome routes (Account/Login, Profile/Create): .hub-login (kit.css) pins itself to the
   viewport with position:fixed, but that only solves *that* element — it still sits inside this
   ancestor chain (.spa-page > NotAuthorized's <main>), which independently carries its own
   min-height:100vh and stays in normal document flow, so it was still contributing its own sliver
   of scrollable height regardless of what its now-fixed-position child did. Neither page's own
   CSS can reach these ancestors to fix them (CSS isolation's ::deep only crosses into
   descendants), so this has to be fixed here, in the component that actually owns them. */
.spa-page--fullbleed[b-82wmqb2p2v] {
    height: 100vh;
    overflow: hidden;
}

/* Matches kit.css's own .hub-login breakpoint, where it drops position:fixed and goes back to
   normal flow (no hero column to clamp against on mobile) — this must revert in step, or a tall
   mobile form (e.g. Create's longer field list) would get clipped at 100vh instead of scrolling. */
@media (max-width: 48rem) {
    .spa-page--fullbleed[b-82wmqb2p2v] {
        height: auto;
        min-height: 100vh;
        overflow: visible;
    }
}

.page[b-82wmqb2p2v] {
    position: relative;
    display: flex;
    flex-direction: column;
    padding-top: 4.75rem; /* 60px nav height + 16px breathing room, was flush against the nav */
    padding-inline: var(--grid-margin, 2rem); /* kit's page-edge inset */
    max-width: var(--grid-max-width, 120rem);
    margin-inline: auto;
}

main[b-82wmqb2p2v] {
    flex: 1;
    /* Flex items default to min-width:auto (won't shrink below their content's intrinsic width)
       regardless of flex-basis. Without this, any page with wide content (e.g. a table needing to
       scroll internally) can force the whole layout wider than the viewport instead of letting the
       content's own overflow:auto container absorb it — a real, site-wide latent bug, not specific
       to one page. */
    min-width: 0;
}

@media (max-width: 47.9975rem) { /* 768px — matches spa-top-nav's mobile height breakpoint */
    .page[b-82wmqb2p2v] {
        padding-top: 4.5rem; /* 56px nav height + 16px breathing room, was flush against the nav */
    }
}

#blazor-error-ui[b-82wmqb2p2v] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -0.0625rem 0.125rem rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-82wmqb2p2v] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/FTS.Online/Components/Pages/Account/Forgot.razor.rz.scp.css */
/* Shares Account/Login.razor's shell entirely — see kit.css's "Auth split screen" comment.
   Nothing page-specific to scope here. */
/* _content/FTS.Online/Components/Pages/Account/Login.razor.rz.scp.css */
/* All hub-login* styling now lives in kit.css — see the "Auth split screen" comment there.
   Promoted once Profile/Create needed the identical shell. Nothing left to scope here. */
/* _content/FTS.Online/Components/Pages/Account/ResetByToken.razor.rz.scp.css */
.login-container[b-i73ufkqz6x] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 2rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.login-card[b-i73ufkqz6x] {
    background: white;
    border-radius: 0.75rem;
    box-shadow: 0 0.625rem 2.5rem rgba(0, 0, 0, 0.1);
    padding: 2.5rem;
    width: 100%;
    max-width: 28.125rem;
}

.login-header[b-i73ufkqz6x] {
    text-align: center;
    margin-bottom: 2rem;
}

.login-header h2[b-i73ufkqz6x] {
    color: #333;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.login-header p[b-i73ufkqz6x] {
    color: #666;
    font-size: 0.95rem;
}

.back-link-container[b-i73ufkqz6x] {
    text-align: center;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 0.0625rem solid #e0e0e0;
}

.back-link[b-i73ufkqz6x] {
    color: #667eea;
    text-decoration: none;
    font-size: 0.9rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.back-link:hover[b-i73ufkqz6x] {
    text-decoration: underline;
    color: #5568d3;
}

/* _content/FTS.Online/Components/Pages/Appointments/AppointmentSummaryDialog.razor.rz.scp.css */
.appointment-summary-dialog[b-1u5kw8z1s5]
{
    max-height: 80vh;
    overflow: auto;
}

.summary-dialog-loading[b-1u5kw8z1s5]
{
    min-height: 8rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.summary-dialog-content[b-1u5kw8z1s5]
{
    margin-bottom: 1rem;
}

.summary-dialog-footer[b-1u5kw8z1s5]
{
    padding-top: 1rem;
    border-top: 1px solid var(--rz-base-300);
    display: flex;
    justify-content: flex-end;
}
/* _content/FTS.Online/Components/Pages/Appointments/Index.razor.rz.scp.css */
/* Page-scoped (CSS isolation) — these hub-* styles are unique to this page, ported from the kit's
   actual pages/hub/my-appointments.html markup (not the generic component library, which the kit's
   own pages don't fully use either). Retokenized to kit's :root custom properties throughout. */

.cancel-confirm-text[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
}

.hub-appts[b-iy78kyh3lz] {
    display: flex;
    gap: 1.625rem;
    align-items: flex-start;
}

.hub-appts__mid[b-iy78kyh3lz] {
    /* Takes all the width the rail leaves (the old 74.5rem cap only made sense next to the removed left
       sidebar, and left a dead strip on the right once that sidebar went away). */
    flex: 1 1 0;
    min-width: 0;
}

.hub-switch[b-iy78kyh3lz] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    cursor: pointer;
    user-select: none;
}

.hub-switch input[b-iy78kyh3lz] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.hub-switch__track[b-iy78kyh3lz] {
    position: relative;
    flex-shrink: 0;
    width: 2.5rem;
    height: 1.375rem;
    background: var(--color-border);
    border-radius: var(--radius-pill, 999px);
    transition: background var(--duration-normal, 0.2s) var(--ease-default, ease);
}

.hub-switch__thumb[b-iy78kyh3lz] {
    position: absolute;
    top: 0.1875rem;
    left: 0.1875rem;
    width: 1rem;
    height: 1rem;
    background: var(--color-surface, #fff);
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    transition: transform var(--duration-normal, 0.2s) var(--ease-default, ease);
}

.hub-switch input:checked ~ .hub-switch__track[b-iy78kyh3lz] {
    background: var(--color-primary);
}

.hub-switch input:checked ~ .hub-switch__track .hub-switch__thumb[b-iy78kyh3lz] {
    transform: translateX(1.125rem);
}

.hub-switch input:focus-visible ~ .hub-switch__track[b-iy78kyh3lz] {
    outline: 0.125rem solid var(--color-focus, var(--color-primary));
    outline-offset: 0.125rem;
}

.hub-switch__label[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-secondary);
}

.hub-appts__rail[b-iy78kyh3lz] {
    width: var(--sidebar-width);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* Below 1120px the rail drops under the table. With the left sidebar gone, mid + rail only need the
   table's min width (40rem) + rail (306px) + gaps and page padding (~1040px), so there is no reason to
   stack any earlier than this. */
@media (max-width: 70rem) {
    .hub-appts[b-iy78kyh3lz] {
        flex-direction: column;
    }

    .hub-appts__mid[b-iy78kyh3lz] {
        /* flex-basis is a main-axis property — once .hub-appts switches to flex-direction:column the
           main axis becomes vertical, so the row-mode basis would be read as a height hint instead.
           Reset it for column mode. */
        flex-basis: auto;
        max-width: 100%;
    }

    .hub-appts__rail[b-iy78kyh3lz] {
        width: 100%;
    }
}


.welcome-heading[b-iy78kyh3lz] {
    margin-bottom: 1rem;
}

.welcome-book-btn[b-iy78kyh3lz] {
    display: none;
}

@media (max-width: 35.99875rem) {
    .welcome-row[b-iy78kyh3lz] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        margin-bottom: 1rem;
    }

    .welcome-row .welcome-heading[b-iy78kyh3lz] {
        margin-bottom: 0;
        font-size: var(--font-size-xl);
        min-width: 0;
    }

    .welcome-book-btn[b-iy78kyh3lz] {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        margin-left: auto;
        height: 2.25rem;
        padding: 0 1rem;
        background: #335d88;
        color: #fffcf6;
        border: 0.0625rem solid #335d88;
        border-radius: 6.25rem;
        font-family: var(--font-body);
        font-size: 0.875rem;
        font-weight: 700;
        letter-spacing: 0.01rem;
        text-decoration: none;
        white-space: nowrap;
    }

    .welcome-book-btn:hover[b-iy78kyh3lz] {
        background: #274a6f;
        border-color: #274a6f;
    }
}

/* ── Next-appointment card (rail) — kit's actual inline-styled rail card, converted to classes ── */

.next-appt-card[b-iy78kyh3lz] {
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.next-appt-card__top[b-iy78kyh3lz] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
}

.next-appt-card__location[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--color-primary);
    display: block;
}

.next-appt-card__datetime[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--color-text-secondary);
    margin: 0.125rem 0 0;
}

.next-appt-card__edit[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--color-primary);
    text-decoration: none;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
}
.next-appt-card__edit:hover[b-iy78kyh3lz] { text-decoration: underline; }

.next-appt-card__title[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-text-primary);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.next-appt-card__expand[b-iy78kyh3lz] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font: inherit;
    color: inherit;
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
    text-align: left;
}
.next-appt-card__expand svg[b-iy78kyh3lz] { width: 0.875rem; height: 0.875rem; flex-shrink: 0; transition: transform var(--duration-normal); }
.next-appt-card__expand[aria-expanded="true"] svg[b-iy78kyh3lz] { transform: rotate(180deg); }

.next-appt-card__meta[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-size: 0.75rem;
    color: var(--color-text-secondary);
    margin: 0.25rem 0 0;
}

.next-appt-card__actions[b-iy78kyh3lz] {
    display: flex;
    justify-content: center;
    gap: 0.375rem;
    flex-wrap: nowrap;
}

.next-appt-card__actions .spa-btn[b-iy78kyh3lz] {
    /* Sizing/font/padding come from SpaButton's Size="ExtraSmall" (spa-btn--xs, kit.css). Content-
       sized (not stretched) and centered as a group; min-width:0 + ellipsis still guard against
       overflow if the rail is ever narrower than the three buttons' natural width. */
    flex: 0 0 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-top: 0.0625rem;
}

.next-appt-card__actions .spa-btn--gray[b-iy78kyh3lz] {
    border-color: var(--color-border);
}

.next-appt-slider-nav[b-iy78kyh3lz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    margin-top: -0.25rem;
}

.next-appt-slider-btn[b-iy78kyh3lz] {
    width: 1.5rem;
    height: 1.5rem;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--color-text-muted);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.next-appt-slider-btn:hover:not(:disabled)[b-iy78kyh3lz] { background: var(--color-primary-muted); color: var(--color-primary); }
.next-appt-slider-btn:disabled[b-iy78kyh3lz] { opacity: 0.35; cursor: not-allowed; }

.next-appt-slider-count[b-iy78kyh3lz] {
    font-size: 0.75rem;
    color: var(--color-text-muted);
}

.reschedule-warning[b-iy78kyh3lz] {
    border-color: var(--color-accent-terracotta) !important;
    color: var(--color-accent-terracotta) !important;
}

.reschedule-warning-icon[b-iy78kyh3lz] {
    vertical-align: middle;
}

.visit-appt-list[b-iy78kyh3lz] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.visit-appt-item[b-iy78kyh3lz] {
    border-top: 0.0625rem solid var(--color-border);
    padding-top: 0.375rem;
    font-size: 0.75rem;
}

.visit-appt-service[b-iy78kyh3lz] {
    font-weight: 600;
    color: var(--color-text-primary);
}

.visit-appt-details[b-iy78kyh3lz] {
    color: var(--color-text-muted);
}

/* ── Rail mini-calendar — kit's actual rail markup (border card, not the spa-datepicker shadow
   card used in the booking-flow date picker; a different, simpler treatment). The "has-appt" day
   dot is our own addition — the kit's static demo never modeled real appointment data. ── */

.mini-calendar-section[b-iy78kyh3lz] {
    background: var(--color-surface);
    border: 0.0625rem solid var(--color-border);
    border-radius: 0.75rem;
    padding: 1rem;
}

.mini-calendar-header[b-iy78kyh3lz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.mini-calendar-title[b-iy78kyh3lz] {
    font-family: var(--font-body);
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--color-text-primary);
}

.mini-calendar-nav-btn[b-iy78kyh3lz] {
    width: 1.5rem;
    height: 1.5rem;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--color-text-muted);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.mini-calendar-nav-btn:hover[b-iy78kyh3lz] { background: var(--color-primary-muted); color: var(--color-primary); }

.mini-calendar-grid[b-iy78kyh3lz] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.125rem;
    text-align: center;
}

.calendar-dow-label[b-iy78kyh3lz] {
    padding: 0.25rem 0;
    color: var(--color-text-muted);
    font-weight: 500;
    font-size: 0.6875rem;
}

.calendar-day-filler[b-iy78kyh3lz] { }

.calendar-day[b-iy78kyh3lz] {
    aspect-ratio: 1;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 50%;
    color: var(--color-text-primary);
    font-size: 0.75rem;
    padding: 0.125rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 1.5rem;
    position: relative;
}
.calendar-day:hover:not(.selected)[b-iy78kyh3lz] { background: var(--color-primary-muted); }

.calendar-day.today[b-iy78kyh3lz] {
    background: var(--color-primary);
    color: #fff;
}

.calendar-day.selected[b-iy78kyh3lz] {
    background: var(--color-primary);
    color: #fff;
}

.calendar-day-number[b-iy78kyh3lz] { line-height: 1; }

.calendar-day.has-appt:not(.today):not(.selected) .calendar-day-number[b-iy78kyh3lz]::after {
    content: '';
    position: absolute;
    bottom: 0.0625rem;
    left: 50%;
    transform: translateX(-50%);
    width: 0.25rem;
    height: 0.25rem;
    border-radius: 50%;
    background: var(--color-accent-terracotta);
}

.mini-calendar-legend[b-iy78kyh3lz] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.75rem;
    font-size: 0.6875rem;
    color: var(--color-text-muted);
}

.legend-dot[b-iy78kyh3lz] {
    width: 0.375rem;
    height: 0.375rem;
    border-radius: 50%;
    background: var(--color-accent-terracotta);
}

.empty-text[b-iy78kyh3lz] {
    font-size: 0.875rem;
    color: var(--color-text-muted);
    padding: 1rem 0;
}

/* ── Book a treatment banner ── */

.book-treatment-banner[b-iy78kyh3lz] {
    display: block;
    border-radius: 0.75rem;
    overflow: hidden;
    text-decoration: none;
    margin-top: 1rem;
}
.book-treatment-banner img[b-iy78kyh3lz] { width: 100%; height: auto; display: block; }

@media (max-width: 35.99875rem) {
    .book-treatment-banner[b-iy78kyh3lz] {
        display: none;
    }
}

/* ── Appointments history table row content — SpaTable (kit.css) provides the generic table
   chrome; these classes style the RowContent/HeaderContent markup this page passes into it. ── */

.hub-table__row--expanded td[b-iy78kyh3lz] { background: rgba(236, 232, 221, 0.35); }

.hub-table__expand[b-iy78kyh3lz] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--color-text-primary);
    font: inherit;
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    border: none;
    background: none;
    padding: 0;
    text-align: left;
}
.hub-table__expand svg[b-iy78kyh3lz] { width: 0.9375rem; height: 0.9375rem; transition: transform var(--duration-normal); flex-shrink: 0; }
.hub-table__expand[aria-expanded="true"] svg[b-iy78kyh3lz] { transform: rotate(180deg); }

.hub-table__sub[b-iy78kyh3lz] {
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin-top: var(--space-2);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.hub-table__sub-line[b-iy78kyh3lz] {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}
.hub-table__sub-time[b-iy78kyh3lz] { color: var(--color-primary); font-weight: var(--font-weight-semibold); }

.hub-table__loc[b-iy78kyh3lz] {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--color-text-secondary);
}

.hub-table__rebook[b-iy78kyh3lz] {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    border: none;
    background: none;
    cursor: pointer;
    font: inherit;
    padding: 0;
}
.hub-table__rebook:hover[b-iy78kyh3lz] { text-decoration: underline; }
.hub-table__rebook--pending[b-iy78kyh3lz] { font-weight: var(--font-weight-bold, 700); }
.hub-table__rebook:disabled[b-iy78kyh3lz] {
    color: var(--color-text-muted);
    cursor: not-allowed;
    pointer-events: none;
}

.hub-badge[b-iy78kyh3lz] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: 0.25rem 0.5rem;
    border-radius: var(--radius-badge);
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    line-height: 1;
    white-space: nowrap;
}
.hub-badge--finalized[b-iy78kyh3lz] { background: #c8d7c2; color: #085a12; }
.hub-badge--upcoming[b-iy78kyh3lz] { background: #dce8f5; color: var(--color-primary); }
.hub-badge--cancelled[b-iy78kyh3lz] { background: #f5dcdc; color: #8b2222; }
.hub-badge--mine[b-iy78kyh3lz] { background: #c8d7c2; color: #085a12; padding: 0.125rem 0.5rem; font-size: 0.6875rem; }
.hub-badge--other[b-iy78kyh3lz] { background: var(--color-border-light); color: var(--color-text-secondary); padding: 0.125rem 0.5rem; font-size: 0.6875rem; }

/* ── Table responsiveness ── SpaTable's min-width:40rem + hub-table-wrap's overflow-x:auto (kit.css)
   already make the table horizontally scrollable rather than breaking page layout. On top of that,
   drop the least-essential column (ApptVisitId — a support/reference field, not something a customer
   needs at a glance) on phones so the remaining 6 columns need less scrolling to reach Rebook. Column
   order: Date(1) Location(2) Treatments(3) Service provider(4) Status(5) ApptVisitId(6) Rebook(7). */
@media (min-width: 36rem) and (max-width: 40rem) {
    .hub-table th:nth-child(6)[b-iy78kyh3lz],
    .hub-table td:nth-child(6)[b-iy78kyh3lz] {
        display: none;
    }
}

@media (max-width: 35.99875rem) {
    .hub-appts[b-iy78kyh3lz]  .hub-table {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .hub-appts[b-iy78kyh3lz]  .hub-table thead {
        display: none;
    }

    .hub-appts[b-iy78kyh3lz]  .hub-table tbody {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
        padding: 0 0.75rem 0.75rem;
    }

    .hub-appts[b-iy78kyh3lz]  .hub-table tbody tr {
        display: grid;
        grid-template-columns: 5.25rem minmax(0, 1fr) auto;
        grid-template-areas:
            "date service service"
            "loc status rebook";
        column-gap: 0.625rem;
        row-gap: 0.5rem;
        align-items: start;
        padding: 0.75rem;
        background: var(--color-surface);
        border: 0.0625rem solid var(--color-border);
        border-radius: var(--radius-md);
    }

    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td {
        padding: 0;
        border-bottom: none;
        background: transparent;
        min-width: 0;
    }

    .hub-appts[b-iy78kyh3lz]  .hub-table tbody tr.hub-table__row--expanded {
        background: rgba(236, 232, 221, 0.35);
    }

    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(1) { grid-area: date; }
    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(2) { grid-area: loc; }
    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(3) { grid-area: service; }
    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(4) { display: none; }
    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(5) { grid-area: status; }
    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(6) {
        grid-area: rebook;
        align-self: center;
        justify-self: end;
    }

    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(2),
    .hub-appts[b-iy78kyh3lz]  .hub-table tbody td:nth-child(5) {
        align-self: center;
    }
}
/* _content/FTS.Online/Components/Pages/Appointments/PendingVisitsModal.razor.rz.scp.css */
.pending-visits-subtitle[b-96fartt4e0] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0 0 var(--space-4);
}

.pending-visits-list[b-96fartt4e0] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.pending-visit-card[b-96fartt4e0] {
    background: var(--color-bg-cream);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.pending-visit-card__top[b-96fartt4e0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-3);
}

.pending-visit-card__title[b-96fartt4e0] {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0;
}

.pending-visit-card__meta[b-96fartt4e0] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin: 0.1875rem 0 0;
}

[b-96fartt4e0] .pending-visit-card__resume {
    width: 100%;
}
/* _content/FTS.Online/Components/Pages/Gifts/EditGiftRecipientDialog.razor.rz.scp.css */
/* Shared shell (gc-*) lives in kit.css — see the "Gifts module shared shell" comment there.
   This dialog stacks more sections (delivery, gratuity, recipient, address) in a narrower 32rem
   column than FlatAmountSection/GiftCardPackageSection, so its own wrapper (not the shared
   gc-form) sets a roomier gap between sections instead of changing the shared default. */

.edit-recipient-form[b-dx02xsakqf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.edit-recipient-services__list[b-dx02xsakqf] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    font-size: var(--font-size-sm);
}

.edit-recipient-services__list li[b-dx02xsakqf] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-3);
}

.edit-recipient-services__qty[b-dx02xsakqf] {
    white-space: nowrap;
}

/* Gratuity pills + the Amount field are one logical group (same relationship as the package
   card's gc-package-card__expand), so they keep a tighter gap than the surrounding sections. */
.edit-recipient-gratuity[b-dx02xsakqf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

/* Delivery-option pills read as too large at this dialog's 32rem width — a smaller, denser
   pill matches the compact gratuity chips below it better than the default spa-pill size. */
.edit-recipient-delivery[b-dx02xsakqf]  .spa-pill {
    padding: 0.5rem 1rem;
    font-size: var(--font-size-xs);
}
/* _content/FTS.Online/Components/Pages/Gifts/FlatAmountSection.razor.rz.scp.css */
/* Shared shell (gc-*) lives in kit.css — see the "Gifts module shared shell" comment there.
   Nothing left to scope here once the Radzen/Bootstrap markup was replaced. */
/* _content/FTS.Online/Components/Pages/Gifts/GiftBillingSection.razor.rz.scp.css */
/* Shell (billing-header/-page-card/-label/-failure/-card-list/-actions) and the credit-card form
   grid/tokenizer (billing-form-*, billing-tokenizer*) live in kit.css — shared with BillingSection,
   see the comments above those rules there. Only the delete-card affordance is specific to gifts
   (the booking billing step has no equivalent). */

.gift-billing-card-row[b-9t3w5fv00b] {
    position: relative;
}

[b-9t3w5fv00b] .gift-billing-card-row .hub-card-on-file {
    max-width: none;
    padding-right: 3rem;
}

.gift-billing-card-delete[b-9t3w5fv00b] {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: none;
    color: var(--color-text-muted);
    cursor: pointer;
    transition: color var(--duration-normal) var(--ease-default), background-color var(--duration-normal) var(--ease-default);
}

.gift-billing-card-delete:hover:not(:disabled)[b-9t3w5fv00b] {
    color: var(--color-error);
    background: rgba(192, 57, 43, 0.1);
}

.gift-billing-card-delete:disabled[b-9t3w5fv00b] {
    opacity: 0.4;
    cursor: not-allowed;
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftCardCart.razor.rz.scp.css */
/* Kit has no reference for this cart. Shell classes (hub-itinerary-sidebar, cart-group,
   cart-remove-btn, cart-discount-row, cart-empty, spa-loading-row) come from kit.css — see the
   comment above .hub-itinerary-sidebar there. Item rows reuse the same __item-name/__item-provider/
   __item-price/__item-member-price classes as ItinerarySection's items, for a consistent look
   between the booking itinerary and this cart. Everything below is specific to this component's
   shipping-group / region-row layout, which the shared sidebar shell doesn't cover. */

.gift-cart[b-gwkr2f4po1] {
    position: sticky;
    top: var(--space-4);
}

.gift-cart-region-row[b-gwkr2f4po1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    border-top: 0.0625rem solid #e4e9ee;
    padding-top: var(--space-3);
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
}

.gift-cart-region-row .cart-label[b-gwkr2f4po1] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.gift-cart-region-link[b-gwkr2f4po1] {
    display: inline-flex;
    align-items: center;
    gap: 0.3125rem;
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-decoration: none;
}

.gift-cart-region-link:hover[b-gwkr2f4po1] {
    text-decoration: underline;
}

.gift-cart-region-link svg[b-gwkr2f4po1] {
    width: 0.75rem;
    height: 0.75rem;
    opacity: 0.7;
}

.gift-cart-group-header[b-gwkr2f4po1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-xs);
}

.gift-cart-group-meta[b-gwkr2f4po1] {
    color: var(--color-text-muted);
    font-weight: var(--font-weight-semibold);
}

.gift-cart-group-meta--price[b-gwkr2f4po1] {
    color: var(--color-primary);
}

.gift-cart-shipping-edit[b-gwkr2f4po1] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    margin-top: var(--space-1);
    width: 100%;
}

.gift-cart-shipping-edit__option[b-gwkr2f4po1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    cursor: pointer;
}

.gift-cart-shipping-edit__option input[b-gwkr2f4po1] {
    accent-color: var(--color-primary);
    cursor: pointer;
}

.gift-cart-shipping-edit__cancel[b-gwkr2f4po1] {
    align-self: flex-start;
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    text-decoration: underline;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.gift-cart-item-actions[b-gwkr2f4po1] {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.gift-cart-address-line[b-gwkr2f4po1] {
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gift-cart-subtotal-rows[b-gwkr2f4po1] {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    border-top: 0.0625rem solid #e4e9ee;
    padding-top: var(--space-3);
}

.gift-cart-subtotal-row[b-gwkr2f4po1] {
    display: flex;
    justify-content: space-between;
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.gift-cart-subtotal-row strong[b-gwkr2f4po1] {
    color: var(--color-text-primary);
    font-weight: var(--font-weight-semibold);
}

[b-gwkr2f4po1] .gift-cart-checkout-btn {
    width: 100%;
}

@media (max-width: 48rem) {
    .gift-cart[b-gwkr2f4po1] {
        position: relative;
        top: 0;
    }
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftCardMainScreen.razor.rz.scp.css */
/* Gift Card Main Screen styles */

.type-content-section[b-lg38lho5ib] {
    min-height: 20rem;
}

.gifts-type-row[b-lg38lho5ib] {
    display: flex;
    justify-content: center;
    max-width: 100%;
    overflow-x: auto;
    margin-bottom: var(--space-6);
}

@media (max-width: 48rem) {
    .gifts-type-row[b-lg38lho5ib]  .spa-pill-group {
        flex-wrap: wrap;
        justify-content: center;
    }
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftCardPackageSection.razor.rz.scp.css */
/* Kit has no reference for this — shared shell (gc-header/gc-page-card/gc-field/gc-divider/gc-actions)
   lives in kit.css, see the "Gifts module shared shell" comment there. Package cards below are
   specific to this component (not reused by FlatAmountSection/GiftExperienceSection), styled as a
   selectable pricing-card grid instead of the checkbox-in-the-corner form list this used to be. */

.gc-package-group-heading[b-wqfzis06a4] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-xl);
    color: var(--color-text-primary);
    margin: var(--space-6) 0 var(--space-3);
    padding-bottom: var(--space-2);
    border-bottom: 0.0625rem solid var(--color-border);
}

.gc-package-group-heading:first-child[b-wqfzis06a4] {
    margin-top: 0;
}

.gc-package-grid[b-wqfzis06a4] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: var(--space-5);
    align-items: start;
}

.gc-package-card[b-wqfzis06a4] {
    background: #fff;
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    cursor: pointer;
    transition: border-color var(--duration-normal) var(--ease-default), box-shadow var(--duration-normal) var(--ease-default);
}

.gc-package-card:hover[b-wqfzis06a4] {
    border-color: var(--color-primary);
    box-shadow: 0 0.375rem 1rem rgba(0, 0, 0, 0.08);
}

.gc-package-card--selected[b-wqfzis06a4] {
    border-color: var(--color-primary);
    border-width: 0.125rem;
    background: var(--color-primary-muted);
    box-shadow: 0 0.375rem 1rem rgba(0, 0, 0, 0.1);
}

.gc-package-card__header[b-wqfzis06a4] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-2);
}

.gc-package-card__name[b-wqfzis06a4] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-lg);
    color: var(--color-text-primary);
    line-height: var(--line-height-tight);
    margin: 0;
}

.gc-package-card__radio[b-wqfzis06a4] {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-top: 0.125rem;
    border-radius: 50%;
    border: 0.125rem solid var(--color-border-input);
    position: relative;
}

.gc-package-card--selected .gc-package-card__radio[b-wqfzis06a4] {
    border-color: var(--color-primary);
}

.gc-package-card--selected .gc-package-card__radio[b-wqfzis06a4]::after {
    content: "";
    position: absolute;
    inset: 0.1875rem;
    border-radius: 50%;
    background: var(--color-primary);
}

.gc-package-card__price-row[b-wqfzis06a4] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-top: var(--space-2);
    border-top: 0.0625rem solid var(--color-border);
}

.gc-package-card__price[b-wqfzis06a4] {
    font-family: var(--font-heading);
    font-weight: 350;
    font-size: var(--font-size-2xl);
    color: var(--color-primary);
}

.gc-package-card__savings[b-wqfzis06a4] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.gc-package-card__description[b-wqfzis06a4] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
    padding-top: var(--space-2);
    border-top: 0.0625rem solid var(--color-border);
}

.gc-package-card__includes[b-wqfzis06a4] {
    padding-top: var(--space-2);
    border-top: 0.0625rem solid var(--color-border);
}

.gc-package-card__includes-label[b-wqfzis06a4] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2);
}

.gc-package-card__service-list[b-wqfzis06a4] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.gc-package-card__service-list li[b-wqfzis06a4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.gc-package-card__check[b-wqfzis06a4] {
    color: var(--color-primary);
    flex-shrink: 0;
}

.gc-package-card__upgrades[b-wqfzis06a4] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    cursor: default;
}

.gc-package-card__expand[b-wqfzis06a4] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    cursor: default;
}

.gc-package-card__expand[b-wqfzis06a4]  .spa-pill-group {
    justify-content: center;
}

@media (max-width: 30rem) {
    .gc-package-grid[b-wqfzis06a4] {
        grid-template-columns: 1fr;
    }
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftCardView.razor.rz.scp.css */
/* Kit reference: pages/hub/gift-cards-print.html. Ported as scoped classes/tokens instead of the
   kit's inline styles + shared .hub-print-* classes, since this page renders standalone (no site
   chrome — see the layout note in the .razor file) and needs its own page background/centering. */

.gcv-page[b-1r5tl47evg] {
    min-height: 100vh;
    background: var(--color-bg);
    padding: var(--space-8) var(--space-4);
}

.gcv-content[b-1r5tl47evg] {
    max-width: 52.5rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.gcv-header[b-1r5tl47evg] {
    background: var(--color-bg-cream);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-5) var(--space-6);
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-5);
}

.gcv-header__title[b-1r5tl47evg] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-2xl);
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2);
}

.gcv-header__subtitle[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    line-height: var(--line-height-base);
}

.gcv-header__subtitle a[b-1r5tl47evg] {
    color: var(--color-primary);
}

.gcv-print-btn[b-1r5tl47evg] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    height: 2.5rem;
    padding: 0 1rem;
    border: 0.09375rem solid var(--color-primary);
    border-radius: 6.25rem;
    background: transparent;
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
}

.gcv-print-btn svg[b-1r5tl47evg] {
    width: 1rem;
    height: 1rem;
}

.gcv-card[b-1r5tl47evg] {
    width: 100%;
    margin: 0 auto;
    background: var(--color-bg-cream);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 2rem 6rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.gcv-card__logo[b-1r5tl47evg] {
    width: 2.75rem;
    height: auto;
    display: block;
    margin-bottom: var(--space-3);
}

.gcv-card__rule[b-1r5tl47evg] {
    width: 100%;
    height: 1px;
    background: var(--color-border);
    margin-bottom: var(--space-3);
}

.gcv-card__title[b-1r5tl47evg] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: 2.25rem;
    color: var(--color-primary);
    margin: 0 0 var(--space-3);
    text-align: center;
}

.gcv-card__cert-no[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    letter-spacing: 0.04em;
    margin: 0 0 var(--space-2);
    text-align: center;
}

.gcv-card__row[b-1r5tl47evg] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.875rem 0;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

.gcv-card__row-label[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.gcv-card__row-value[b-1r5tl47evg] {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: var(--font-weight-heading);
    color: var(--color-primary);
}

.gcv-card__package[b-1r5tl47evg] {
    width: 100%;
    padding: var(--space-4) 0;
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

.gcv-card__package-name[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2);
}

.gcv-card__package-name strong[b-1r5tl47evg] {
    color: var(--color-primary);
}

.gcv-card__package-label[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0 0 var(--space-2);
}

.gcv-card__package-list[b-1r5tl47evg] {
    margin: 0;
    padding-left: 1.25rem;
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    line-height: var(--line-height-base);
}

.gcv-card__package-list li + li[b-1r5tl47evg] {
    margin-top: 0.25rem;
}

.gcv-card__gratuity[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-style: italic;
    color: var(--color-primary);
    margin: var(--space-2) 0 0;
}

.gcv-card__names[b-1r5tl47evg] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3);
    padding: 0.875rem 0;
    border-bottom: 1px solid var(--color-border);
}

.gcv-card__names-label[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.gcv-card__names-label em[b-1r5tl47evg] {
    font-family: var(--font-script);
    font-style: normal;
    color: var(--color-primary);
    font-size: var(--font-size-lg);
}

.gcv-card__blank[b-1r5tl47evg] {
    display: inline-block;
    min-width: 12rem;
    border-bottom: 1px solid var(--color-border);
    vertical-align: baseline;
}

.gcv-card__message[b-1r5tl47evg] {
    width: 100%;
    padding: var(--space-5) 0;
    border-bottom: 1px solid var(--color-border);
}

.gcv-card__message-label[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0 0 0.625rem;
}

.gcv-card__message-text[b-1r5tl47evg] {
    font-family: var(--font-script);
    font-style: normal;
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    line-height: 1.6;
    margin: 0;
}

.gcv-card__footer-brand[b-1r5tl47evg] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.625rem;
    margin: var(--space-5) 0 0.375rem;
}

.gcv-card__wordmark[b-1r5tl47evg] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: 2rem;
    color: var(--color-primary);
    margin: 0;
    text-align: center;
}

.gcv-card__terms[b-1r5tl47evg] {
    font-family: var(--font-body);
    font-size: 0.6875rem;
    color: var(--color-text-secondary);
    margin: 0;
    text-align: center;
}

.gcv-status[b-1r5tl47evg] {
    max-width: 30rem;
    margin: var(--space-8) auto 0;
    text-align: center;
    font-family: var(--font-body);
    color: var(--color-text-secondary);
}

.gcv-status--error h1[b-1r5tl47evg] {
    font-family: var(--font-heading);
    font-size: var(--font-size-xl);
    color: var(--color-text-primary);
    margin: 0 0 var(--space-3);
}

@media (max-width: 36rem) {
    .gcv-page[b-1r5tl47evg] {
        padding: var(--space-5) var(--space-3);
    }

    .gcv-header[b-1r5tl47evg] {
        flex-direction: column;
        align-items: stretch;
    }

    .gcv-print-btn[b-1r5tl47evg] {
        width: 100%;
    }

    .gcv-card[b-1r5tl47evg] {
        padding: var(--space-6) var(--space-4);
    }

    .gcv-card__blank[b-1r5tl47evg] {
        min-width: 8rem;
    }

    .gcv-card__names[b-1r5tl47evg] {
        flex-direction: column;
        align-items: flex-start;
    }
}

@page {
    margin: 1in 0.75in;
}

@media print {
    .gcv-page[b-1r5tl47evg] {
        background: #fff;
        padding: 0;
    }

    .gcv-header[b-1r5tl47evg] {
        display: none;
    }

    .gcv-card[b-1r5tl47evg] {
        border: none;
        padding: 0 1.5in;
    }

    .gcv-card__names[b-1r5tl47evg] {
        padding: 1rem 0;
    }
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftCheckoutShippingSection.razor.rz.scp.css */
/* Kit has no reference for this. Shared shell (gc-*) lives in kit.css — see the "Gifts module
   shared shell" comment there. Item cards below intentionally mirror GiftOrderConfirmation's
   orderreview-item look (bordered card + icon circle + gc-summary__row detail rows), for a
   consistent look across the gifts checkout flow. */

.giftshipping-text[b-3iofbgrhm9] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
}

.giftshipping-shipments[b-3iofbgrhm9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.giftshipping-shipment[b-3iofbgrhm9] {
    background: var(--color-bg);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.giftshipping-shipment__header[b-3iofbgrhm9] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.giftshipping-shipment__header .gc-subheading[b-3iofbgrhm9] {
    font-size: var(--font-size-md);
}

.giftshipping-shipment__address[b-3iofbgrhm9] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin: 0;
}

.giftshipping-method-row[b-3iofbgrhm9] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
}

.giftshipping-method-name[b-3iofbgrhm9] {
    color: var(--color-text-secondary);
    font-weight: var(--font-weight-medium);
}

.giftshipping-method-charge[b-3iofbgrhm9] {
    color: var(--color-primary);
    font-weight: var(--font-weight-semibold);
}

.giftshipping-method-edit-btn[b-3iofbgrhm9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: none;
    color: var(--color-text-muted);
    cursor: pointer;
}

.giftshipping-method-edit-btn:hover[b-3iofbgrhm9] {
    color: var(--color-primary);
    background: rgba(51, 93, 136, 0.08);
}

.giftshipping-method-edit[b-3iofbgrhm9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.giftshipping-method-edit__option[b-3iofbgrhm9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    cursor: pointer;
}

.giftshipping-method-edit__option input[b-3iofbgrhm9] {
    accent-color: var(--color-primary);
    cursor: pointer;
}

.giftshipping-method-edit__cancel[b-3iofbgrhm9] {
    align-self: flex-start;
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    text-decoration: underline;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.giftshipping-shipment__items[b-3iofbgrhm9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.giftshipping-item[b-3iofbgrhm9] {
    display: flex;
    gap: var(--space-3);
    background: var(--color-surface);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    box-shadow: var(--shadow-sm);
}

.giftshipping-item__icon[b-3iofbgrhm9] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--color-primary-muted);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.giftshipping-item__body[b-3iofbgrhm9] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.giftshipping-item__row[b-3iofbgrhm9] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
}

.giftshipping-item__type[b-3iofbgrhm9] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
}

.giftshipping-item__price[b-3iofbgrhm9] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
    white-space: nowrap;
    flex-shrink: 0;
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftExperienceSection.razor.rz.scp.css */
/* Kit has no reference for this flow — treatment cards mirror GiftCardPackageSection's
   gc-package-card visual language (selectable radio-style card) since Package already
   established that pattern for this module. Everything else (gc-header, gc-summary, gc-field,
   gc-divider, gc-gratuity-pills, gc-actions, hub-enhancement-grid/card) is shared, defined in
   kit.css / global scope, and needs no page-specific CSS here. */

.gc-experience-treatments-field[b-q0zjpaku52] {
    margin-top: var(--space-6);
}

.gc-experience-enhancements-field[b-q0zjpaku52] {
    margin-top: var(--space-5);
}

.gc-enh-total[b-q0zjpaku52] {
    background: var(--color-bg);
    border-radius: var(--radius-md);
    padding: var(--space-4) var(--space-5);
    margin-top: var(--space-5);
}

.gc-enh-total__row[b-q0zjpaku52] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
}

.gc-enh-total__note[b-q0zjpaku52] {
    margin: var(--space-2) 0 0;
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.gc-experience-grid[b-q0zjpaku52] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
    gap: var(--space-5);
}

.gc-experience-card[b-q0zjpaku52] {
    background: #fff;
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-5);
    min-height: 11rem;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    cursor: pointer;
    transition: border-color var(--duration-normal) var(--ease-default), box-shadow var(--duration-normal) var(--ease-default);
}

.gc-experience-card:hover[b-q0zjpaku52] {
    border-color: var(--color-primary);
    box-shadow: 0 0.375rem 1rem rgba(0, 0, 0, 0.08);
}

.gc-experience-card--selected[b-q0zjpaku52] {
    border-color: var(--color-primary);
    border-width: 0.125rem;
    background: var(--color-primary-muted);
    box-shadow: 0 0.375rem 1rem rgba(0, 0, 0, 0.1);
}

.gc-experience-card__header[b-q0zjpaku52] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-2);
}

.gc-experience-card__name[b-q0zjpaku52] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-lg);
    color: var(--color-text-primary);
    line-height: var(--line-height-tight);
    margin: 0;
}

.gc-experience-card__radio[b-q0zjpaku52] {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-top: 0.125rem;
    border-radius: 50%;
    border: 0.125rem solid var(--color-border-input);
    position: relative;
}

.gc-experience-card--selected .gc-experience-card__radio[b-q0zjpaku52] {
    border-color: var(--color-primary);
}

.gc-experience-card--selected .gc-experience-card__radio[b-q0zjpaku52]::after {
    content: "";
    position: absolute;
    inset: 0.1875rem;
    border-radius: 50%;
    background: var(--color-primary);
}

.gc-experience-card__description[b-q0zjpaku52] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
}

.gc-experience-card__expand[b-q0zjpaku52] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    cursor: default;
}

.gc-experience-card__expand[b-q0zjpaku52]  .spa-pill-group {
    justify-content: center;
}

@media (max-width: 30rem) {
    .gc-experience-grid[b-q0zjpaku52] {
        grid-template-columns: 1fr;
    }
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftInvoiceSummaryDialog.razor.rz.scp.css */
.gift-invoice-meta[b-t1mm65gd2o] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--space-3);
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    padding-bottom: var(--space-4);
    margin-bottom: var(--space-4);
    border-bottom: 0.0625rem solid var(--color-border);
}

.gift-invoice-meta__total[b-t1mm65gd2o] {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.gift-invoice-group[b-t1mm65gd2o] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.gift-invoice-group + .gift-invoice-group[b-t1mm65gd2o] {
    margin-top: var(--space-5);
}

.gift-invoice-item[b-t1mm65gd2o] {
    display: flex;
    gap: var(--space-3);
    background: var(--color-bg-cream);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
}

.gift-invoice-item__icon[b-t1mm65gd2o] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--color-primary-muted);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.gift-invoice-item__body[b-t1mm65gd2o] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.gift-invoice-item__row[b-t1mm65gd2o] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
}

.gift-invoice-item__type[b-t1mm65gd2o] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
}

.gift-invoice-item__price[b-t1mm65gd2o] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
    white-space: nowrap;
    flex-shrink: 0;
}

.gift-invoice-item__detail[b-t1mm65gd2o] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    word-break: break-word;
}

.gift-invoice-item__detail strong[b-t1mm65gd2o] {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.gift-invoice-item__detail--message[b-t1mm65gd2o] {
    font-style: italic;
}

.gift-invoice-item__action[b-t1mm65gd2o] {
    margin-top: var(--space-2);
    display: flex;
}

.gift-invoice-item__reprint[b-t1mm65gd2o] {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-decoration: none;
}

.gift-invoice-item__reprint:hover[b-t1mm65gd2o] {
    text-decoration: underline;
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftOrderConfirmation.razor.rz.scp.css */
/* Kit has no reference for this — a standard e-commerce checkout-review layout (item list +
   sticky order-summary rail bundling promo/totals/payment/CTA), but placed in the same row/
   col-md-9/col-md-3 grid (and gifts-cart-sticky sidebar class) every other gifts step uses, so the
   summary sits in the exact same column position throughout the flow. summary-hero/-meta (the
   receipt phase) live in kit.css — see the "Order/booking summary" comment there. */

.orderreview-header[b-b63h4itli8] {
    margin: 0;
}

/* Receipt hero — summary-hero/-check/-title/-text/summary-meta are shared with the booking
   confirmation (kit.css), where they sit inside SummarySection's own padded card. Here they had no
   such wrapper and no room to breathe, so this card gives them one and loosens their tight default
   gap (tuned for a smaller embedded card, not a page-level hero) without touching the shared rule. */
.orderreview-hero-card[b-b63h4itli8] {
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    padding: var(--space-8) var(--space-6);
    margin-bottom: var(--space-6);
}

.orderreview-hero-card .summary-hero[b-b63h4itli8] {
    gap: var(--space-4);
}

.orderreview-hero-card .summary-hero__check[b-b63h4itli8] {
    width: 3rem;
    height: 3rem;
}

/* Both confirmation pages use the knot-mark badge (kit.css .summary-hero__check--badge) —
   this page's own .summary-hero__check override above is more specific once Blazor's css
   isolation attribute is added, so it needs repeating here to actually win. */
.orderreview-hero-card .summary-hero__check--badge[b-b63h4itli8] {
    width: 4.5rem;
    height: 4.5rem;
    background: transparent;
    border-radius: 0;
}

.orderreview-hero-card .orderreview-receipt-meta[b-b63h4itli8] {
    margin-top: var(--space-2);
    gap: var(--space-4);
}

.orderreview-header__subtitle[b-b63h4itli8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: var(--space-2) 0 0;
}

/* ── Items (left column) ───────────────────────────────── */

.orderreview-items[b-b63h4itli8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
    min-width: 0;
}

.orderreview-group[b-b63h4itli8] {
    background: var(--color-bg-cream);
    border-radius: var(--radius-lg);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.orderreview-group__header[b-b63h4itli8] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.orderreview-group__address[b-b63h4itli8] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.orderreview-item[b-b63h4itli8] {
    display: flex;
    gap: var(--space-3);
    background: var(--color-surface);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    box-shadow: var(--shadow-sm);
}

.orderreview-item__icon[b-b63h4itli8] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--color-primary-muted);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.orderreview-item__body[b-b63h4itli8] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.orderreview-item__row[b-b63h4itli8] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--space-3);
}

.orderreview-item__type[b-b63h4itli8] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
}

.orderreview-item__price[b-b63h4itli8] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
    white-space: nowrap;
    flex-shrink: 0;
}

.orderreview-item__detail[b-b63h4itli8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    word-break: break-word;
}

.orderreview-item__detail strong[b-b63h4itli8] {
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.orderreview-item__detail--discount[b-b63h4itli8] {
    color: var(--color-error);
}

/* ── Summary (right rail) ──────────────────────────────── */

.orderreview-summary[b-b63h4itli8] {
    position: sticky;
    top: var(--space-5);
    background: var(--color-bg-cream);
    border: 0.0625rem solid #ece8dd;
    border-radius: var(--radius-md);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.orderreview-summary__title[b-b63h4itli8] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-lg);
    color: var(--color-text-primary);
    margin: 0;
}

.orderreview-promo[b-b63h4itli8] {
    display: flex;
    gap: var(--space-2);
    padding-bottom: var(--space-4);
    border-bottom: 0.0625rem solid var(--color-border);
}

.orderreview-promo .spa-field__input[b-b63h4itli8] {
    flex: 1;
    min-width: 0;
}

.orderreview-promo--applied[b-b63h4itli8] {
    align-items: center;
    justify-content: space-between;
}

.orderreview-promo__code[b-b63h4itli8] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
}

.orderreview-promo__amount[b-b63h4itli8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-error);
    margin-left: var(--space-2);
}

.orderreview-link-btn[b-b63h4itli8] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-decoration: underline;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
}

.orderreview-link-btn:disabled[b-b63h4itli8] {
    opacity: 0.5;
    cursor: not-allowed;
}

.orderreview-totals[b-b63h4itli8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding-bottom: var(--space-4);
    border-bottom: 0.0625rem solid var(--color-border);
}

.orderreview-totals__row[b-b63h4itli8] {
    display: flex;
    justify-content: space-between;
    gap: var(--space-3);
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
}

.orderreview-totals__row > span:first-child[b-b63h4itli8] {
    white-space: nowrap;
}

.orderreview-totals__row--discount[b-b63h4itli8] {
    color: var(--color-error);
}

.orderreview-totals__row--grand[b-b63h4itli8] {
    padding-top: var(--space-2);
    margin-top: var(--space-1);
    border-top: 0.0625rem solid var(--color-border);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-lg);
    color: var(--color-text-primary);
}

.orderreview-payment[b-b63h4itli8] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding-bottom: var(--space-4);
    border-bottom: 0.0625rem solid var(--color-border);
}

.orderreview-payment__icon[b-b63h4itli8] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--color-bg);
    color: var(--color-text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.orderreview-payment__line[b-b63h4itli8] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    margin: 0;
}

.orderreview-payment__meta[b-b63h4itli8] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin: 0.125rem 0 0;
}

[b-b63h4itli8] .orderreview-confirm-btn {
    width: 100%;
    white-space: normal;
    height: auto;
    min-height: 3rem;
    text-align: center;
}

.orderreview-back-link[b-b63h4itli8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-secondary);
    text-decoration: underline;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    text-align: center;
}

.orderreview-back-link:hover:not(:disabled)[b-b63h4itli8] {
    color: var(--color-primary);
}

.orderreview-back-link:disabled[b-b63h4itli8] {
    opacity: 0.5;
    cursor: not-allowed;
}

.orderreview-receipt-meta[b-b63h4itli8] {
    justify-content: center;
}

@media (min-width: 48rem) {
    .orderreview .row > .page-rail.page-rail--narrow[b-b63h4itli8] {
        width: clamp(18rem, calc(25vw - 2rem), 25rem);
    }
}

@media (max-width: 48rem) {
    .orderreview-summary[b-b63h4itli8] {
        position: relative;
        top: 0;
    }
}

@media (max-width: 30rem) {
    .orderreview-receipt-meta[b-b63h4itli8] {
        flex-direction: column;
        gap: var(--space-1);
    }
}

.orderreview-item__title[b-b63h4itli8] {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
}

.orderreview-item__services[b-b63h4itli8] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}
/* _content/FTS.Online/Components/Pages/Gifts/GiftRecipientAddressSection.razor.rz.scp.css */
/* Shared shell (gc-*) lives in kit.css — see the "Gifts module shared shell" comment there. */
/* _content/FTS.Online/Components/Pages/Gifts/GiftRecipientSection.razor.rz.scp.css */
/* Shared shell (gc-*) lives in kit.css — see the "Gifts module shared shell" comment there. */
/* _content/FTS.Online/Components/Pages/Gifts/Index.razor.rz.scp.css */
/* Kit has no reference for the gifts flow. Page-scoped classes (gifts-*) below have no kit
   component equivalent — reusable pieces (pills, sidebar cart shell) come from Components/Shared/Kit
   and kit.css instead, matching the sibling QuickBooking wizard's shell pattern. */

.gifts-region-intro[b-gek57v6mz2] {
    max-width: 28rem;
    margin: var(--space-8) auto 0;
    text-align: center;
}

.gifts-region-intro__subtitle[b-gek57v6mz2] {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    color: var(--color-text-secondary);
    margin: var(--space-2) 0 0;
}

.gifts-header[b-gek57v6mz2] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-4);
}

.gifts-header__title[b-gek57v6mz2] {
    margin: 0;
}

.gifts-header__subtitle[b-gek57v6mz2] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: var(--space-2) 0 0;
}

.gifts-header__subtitle a[b-gek57v6mz2] {
    color: var(--color-primary);
    font-weight: var(--font-weight-semibold);
    text-decoration: underline;
}

.gifts-admin-toggle[b-gek57v6mz2] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    background: none;
    border: none;
    text-decoration: underline;
    cursor: pointer;
    padding: 0;
}

.gifts-admin-toggle:hover[b-gek57v6mz2] {
    color: var(--color-primary);
}

.gifts-admin-toggle--on[b-gek57v6mz2] {
    color: var(--color-primary);
    font-weight: var(--font-weight-semibold);
}

/* Hidden per request — kept in the DOM (not removed) so it's a one-line revert to bring back. */
.gifts-admin-toggle--hidden[b-gek57v6mz2] {
    display: none;
}
/* _content/FTS.Online/Components/Pages/Gifts/MyGiftCards.razor.rz.scp.css */
.gift-invoices__header[b-qrpgge23u4] {
    margin-bottom: var(--space-5);
}

.gift-invoices__subtitle[b-qrpgge23u4] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: var(--space-2) 0 0;
    max-width: 40rem;
}

.gift-invoices__empty[b-qrpgge23u4] {
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: var(--space-8) var(--space-6);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-4);
}

.gift-invoices__empty p[b-qrpgge23u4] {
    font-family: var(--font-body);
    color: var(--color-text-secondary);
    margin: 0;
}

.gift-invoices__link[b-qrpgge23u4] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    border: none;
    background: none;
    padding: 0;
    font: inherit;
    font-weight: var(--font-weight-medium);
    color: var(--color-primary);
    cursor: pointer;
}

.gift-invoices__link:hover[b-qrpgge23u4] {
    text-decoration: underline;
}

.gift-invoices__link-icon[b-qrpgge23u4] {
    display: inline-flex;
    width: 1.5rem;
    height: 1.5rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: var(--color-primary-muted);
    color: var(--color-primary);
    align-items: center;
    justify-content: center;
}

.gift-invoices__amount-col[b-qrpgge23u4] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}
/* _content/FTS.Online/Components/Pages/OnlineBooking/CancelAV.razor.rz.scp.css */
.cancel-confirm-text[b-xty2duvfmt] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
}

.cancel-confirm-details[b-xty2duvfmt] {
    margin-top: 0.75rem;
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    line-height: var(--line-height-base);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
/* _content/FTS.Online/Components/Pages/Profile/Create.razor.rz.scp.css */
/* Shares Account/Login.razor's shell (kit.css's "Auth split screen" comment) — these are
   Create-only overrides/additions, layered on top rather than changed in the shared classes,
   since Login's own short 2-field form still wants the narrower, vertically-centered version. */

/* The base .hub-login__brand centers its content (right for Login's short form) — Create's
   longer form can be taller than the viewport, and centering an overflowing flex child clips it
   symmetrically top-and-bottom, which is what was scrolling the logo out of view. Top-align
   instead, so the overflow (if any) only ever shows at the bottom, inside the panel's own
   overflow-y:auto — never hiding the logo. */
.hub-login__brand--top[b-0v7jtemo62] {
    justify-content: flex-start;
    padding-top: var(--space-7);
    padding-bottom: var(--space-7);
}

/* Wider than Login's 25.875rem so paired fields below have room to sit side by side without
   feeling cramped. */
.hub-login__panel--wide[b-0v7jtemo62] {
    max-width: 36rem;
}

/* Two-column field pairing (Email+Phone, First+Last Name, Password+Confirm) — cuts the form's
   height roughly in half versus one field per row, which is what was forcing the scroll/clip. */
.hub-login__row[b-0v7jtemo62] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

@media (max-width: 40rem) {
    .hub-login__row[b-0v7jtemo62] {
        grid-template-columns: 1fr;
    }
}
/* _content/FTS.Online/Components/Pages/Profile/EditProfile.razor.rz.scp.css */
/* _content/FTS.Online/Components/Pages/Profile/Index.razor.rz.scp.css */
/* Page-scoped (CSS isolation) — ported from the kit's actual pages/hub/manage-membership.html
   markup (not the generic component library, which the kit's own pages don't fully use either).
   Retokenized to kit's :root custom properties throughout. */

.hub-manage__title[b-q19smtoc6t] {
    margin: 0 0 var(--space-4);
}

.hub-manage-grid[b-q19smtoc6t] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--sidebar-width, 19.125rem);
    gap: var(--space-5);
    align-items: start;
}

.hub-manage-grid--no-rail[b-q19smtoc6t] {
    grid-template-columns: minmax(0, 1fr);
}

.hub-manage-main[b-q19smtoc6t] {
    min-width: 0;
}

.hub-manage-cards[b-q19smtoc6t] {
    display: grid;
    grid-template-columns: minmax(0, 639fr) minmax(0, 526fr);
    gap: 1.6875rem;
    margin-bottom: 1.625rem;
    align-items: stretch;
}

.hub-plan-card[b-q19smtoc6t] {
    background: var(--color-bg-cream);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-5);
    height: 16.375rem;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
}

.hub-plan-card__header[b-q19smtoc6t] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-2);
    row-gap: var(--space-1);
    margin-bottom: var(--space-2);
}

.hub-plan-card__label[b-q19smtoc6t] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-xl);
    line-height: var(--line-height-tight);
    color: #101010;
    margin: 0;
}

.hub-plan-card__badges[b-q19smtoc6t] {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-wrap: wrap;
}

.hub-plan-card__since[b-q19smtoc6t] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    line-height: 1;
    color: var(--color-text-primary);
    background: var(--color-border);
    padding: 0.25rem var(--space-2);
    border-radius: var(--radius-pill);
    display: inline-block;
    white-space: nowrap;
}

.hub-plan-card__status[b-q19smtoc6t] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    line-height: 1;
    padding: 0.25rem var(--space-2);
    border-radius: var(--radius-pill);
    display: inline-block;
    white-space: nowrap;
}

.hub-plan-card__status--active[b-q19smtoc6t] {
    background: var(--color-success-bg);
    color: #3a5c34;
}

.hub-plan-card__status--suspended[b-q19smtoc6t] {
    background: rgba(192, 57, 43, 0.08);
    color: var(--color-error);
}

.hub-plan-card__name[b-q19smtoc6t] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-2xl);
    line-height: 1.2;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2);
}

.hub-plan-card__charge[b-q19smtoc6t] {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    color: var(--color-text-primary);
    line-height: var(--line-height-base);
    margin: 0;
}

.hub-plan-card__actions[b-q19smtoc6t] {
    display: flex;
    gap: var(--space-5);
    flex-wrap: wrap;
    margin-bottom: 0.625rem;
}

.hub-plan-card__contact[b-q19smtoc6t] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-primary);
    margin: 0;
}

.hub-plan-card__contact a[b-q19smtoc6t] {
    color: var(--color-primary);
}

/* Promo card — background image is the same asset used as the login page's hero placeholder. */
.hub-promo-card[b-q19smtoc6t] {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: var(--space-3);
    height: 16.375rem;
    padding: var(--space-5);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-sizing: border-box;
    background-color: var(--color-primary);
    color: var(--color-bg-cream);
    text-decoration: none;
    flex-shrink: 0;
    min-width: 0;
}

.hub-promo-card[b-q19smtoc6t]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url('/images/booking/membership-promo-overlay.jpg') center / cover no-repeat;
    opacity: 0.4;
    pointer-events: none;
}

.hub-promo-card > *[b-q19smtoc6t] {
    position: relative;
    z-index: 1;
}

.hub-promo-card__top[b-q19smtoc6t] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.hub-promo-card__badge[b-q19smtoc6t] {
    /* Normal flow + align-self (not the kit's position:absolute) — on a full-width mobile card the
       title below can wrap to 2 lines, and an absolutely-positioned badge would sit on top of it
       instead of being pushed down with the rest of the content. */
    align-self: flex-end;
    flex-shrink: 0;
    background: var(--color-bg);
    color: var(--color-text-primary);
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-normal);
    line-height: 1;
    padding: 0.25rem var(--space-2);
    border-radius: var(--radius-pill);
    white-space: nowrap;
}

.hub-promo-card__title[b-q19smtoc6t] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-2xl);
    line-height: 1.2;
    color: var(--color-bg-cream);
    margin: 0 0 var(--space-2);
}

.hub-promo-card__copy[b-q19smtoc6t] {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    line-height: var(--line-height-base);
    color: var(--color-bg-cream);
    margin: 0;
    max-width: 26em;
}

.hub-promo-card__btn[b-q19smtoc6t] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 2.75rem;
    padding: var(--space-2) var(--space-5);
    margin-top: var(--space-4);
    background: transparent;
    border: 1px solid var(--color-bg-cream);
    border-radius: var(--radius-pill);
    color: #fff;
    font-family: var(--font-body);
    font-size: 0.9375rem;
    font-weight: var(--font-weight-medium);
    width: fit-content;
}

.hub-benefits-rail__title[b-q19smtoc6t] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-xl);
    color: var(--color-primary);
    margin: 0 0 var(--space-4);
}

.hub-benefits-stack[b-q19smtoc6t] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.hub-benefit-item[b-q19smtoc6t] {
    background: var(--color-bg-cream);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    font-size: var(--font-size-sm);
    display: flex;
    gap: var(--space-3);
    align-items: flex-start;
}

.hub-benefit-item__icon[b-q19smtoc6t] {
    color: var(--color-primary);
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    opacity: 0.55;
}

.hub-benefit-item__icon svg[b-q19smtoc6t] {
    width: 100%;
    height: 100%;
}

.hub-benefit-item p[b-q19smtoc6t] {
    margin: 0 0 var(--space-2);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
}

.hub-benefit-item p:last-child[b-q19smtoc6t] {
    margin-bottom: 0;
}

.hub-benefit-item a[b-q19smtoc6t] {
    color: var(--color-primary);
    font-weight: var(--font-weight-medium);
    font-size: 0.8125rem;
    text-decoration: underline;
}

@media (max-width: 75rem) {
    .hub-manage-cards[b-q19smtoc6t] {
        grid-template-columns: 1fr;
    }

    .hub-plan-card[b-q19smtoc6t],
    .hub-promo-card[b-q19smtoc6t] {
        height: auto;
        min-height: 16.375rem;
    }
}

/* 80rem, not the kit's own 1024px — this grid sits INSIDE the app's outer sidebar+content layout
   (MainLayout.razor.css), which stays side-by-side down to 900px. Between 1024-1280px the outer
   306px sidebar would still be showing at the same time as this grid's own 306px benefits column,
   squeezing the plan/promo card stack (already collapsed to 1 column by the 75rem rule above) into
   a sliver. Collapsing this grid earlier guarantees that squeeze never happens. Same reasoning as
   Appointments/Index.razor.css's hub-appts__rail 80rem breakpoint. */
@media (max-width: 80rem) {
    .hub-manage-grid[b-q19smtoc6t] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 48rem) {
    .hub-manage__title[b-q19smtoc6t] {
        margin-bottom: var(--space-3);
    }

    .hub-manage-grid[b-q19smtoc6t] {
        gap: var(--space-4);
    }

    .hub-manage-cards[b-q19smtoc6t] {
        gap: var(--space-3);
        margin-bottom: var(--space-4);
    }

    .hub-plan-card[b-q19smtoc6t],
    .hub-promo-card[b-q19smtoc6t] {
        padding: var(--space-4);
    }

    .hub-plan-card__name[b-q19smtoc6t],
    .hub-promo-card__title[b-q19smtoc6t] {
        font-size: var(--font-size-xl);
    }

    .hub-plan-card__actions[b-q19smtoc6t] {
        flex-direction: column;
        align-items: stretch;
        gap: var(--space-3);
    }

    /* Full-width stacked, not side-by-side-if-it-fits: the buttons' own white-space:nowrap (kit.css)
       means "Edit Payment Method" needs ~230px+ on its own, so relying on flex-wrap to decide
       per-viewport whether they fit side by side produced an inconsistent, easy-to-misjudge
       breakpoint. Forcing the stack for every phone-width screen is the standard thumb-friendly
       mobile CTA pattern and avoids that guesswork entirely. */
    .hub-plan-card__actions[b-q19smtoc6t]  .spa-btn {
        width: 100%;
    }
}
/* _content/FTS.Online/Components/Pages/QuickBooking/AnonymousVisitConflictModal.razor.rz.scp.css */
.conflict-visits-subtitle[b-xer9pzokq9] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0 0 var(--space-4);
}

.conflict-visits-list[b-xer9pzokq9] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.conflict-visit-card[b-xer9pzokq9] {
    background: var(--color-bg-cream);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.conflict-visit-card__top[b-xer9pzokq9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-3);
}

.conflict-visit-card__title[b-xer9pzokq9] {
    font-family: var(--font-body);
    font-size: var(--font-size-md);
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0;
}

.conflict-visit-card__meta[b-xer9pzokq9] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
    margin: 0.1875rem 0 0;
}

[b-xer9pzokq9] .conflict-visit-card__continue {
    width: 100%;
}
/* _content/FTS.Online/Components/Pages/QuickBooking/Index.razor.rz.scp.css */
[b-q454vwfj42] .quickbooking-continue-btn {
    width: 100%;
}

.quickbooking-itinerary-sticky[b-q454vwfj42] {
    align-self: flex-start;
}

@media (min-width: 768px) {
    .quickbooking-itinerary-sticky[b-q454vwfj42] {
        position: sticky;
        top: 4.75rem;
    }
}

.cancel-confirm-text[b-q454vwfj42] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
}

.quickbooking-session-id[b-q454vwfj42] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    text-align: right;
    margin-top: var(--space-2);
}

/* Bootstrap's col-md-* stacks to full width below md but gives stacked columns no vertical
   gap on its own — add one so the itinerary card doesn't sit flush against the form above it. */
@media (max-width: 48rem) {
    .quickbooking-itinerary-sticky[b-q454vwfj42] {
        margin-top: var(--space-6);
    }
}
/* _content/FTS.Online/Components/Pages/QuickBooking/SearchAppointmentSection.razor.rz.scp.css */
/* Kit reference: pages/hub/rebook.html (search form) + pages/hub/availability.html (results).
   Page-scoped classes (qb-*) below have no kit component equivalent — everything reusable
   (pills, dropdown fields, date picker, time slots) comes from Components/Shared/Kit instead. */

/* Whole mid-column content sits in one white card, matching the sidebar's own #fffdf8/10px
   card treatment (kit.css .spa-sidebar__nav) — kit's own pages wrap form+results the same way. */
.qb-search__header[b-gjgaza9ig8] {
    margin-bottom: var(--space-5);
}

.qb-page-card[b-gjgaza9ig8] {
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: var(--space-6);
}

.qb-search[b-gjgaza9ig8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.qb-search__title[b-gjgaza9ig8] {
    margin: 0 0 var(--space-2);
}

.qb-search__subtitle[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    max-width: 40rem;
    line-height: var(--line-height-base);
}

/* EditForm renders a <form> — a child component's own markup, so this needs ::deep to apply.
   Gives every field block (Location, treatment section, therapist preference, etc.) the same
   standard spacing before/after, rather than each relying on its own ad-hoc margin. */
.qb-search[b-gjgaza9ig8]  form {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.qb-field--narrow[b-gjgaza9ig8] {
    max-width: 22.5rem;
}

.qb-favorite-location[b-gjgaza9ig8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    height: 2.75rem;
    padding: 0 1rem;
    background: var(--color-bg-cream);
    border: 0.0625rem solid var(--color-border-input);
    border-radius: var(--radius-input);
}

.qb-favorite-location__name[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qb-favorite-location__clear[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-decoration: underline;
    flex-shrink: 0;
    cursor: pointer;
}

.qb-field-label-row[b-gjgaza9ig8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.qb-optional[b-gjgaza9ig8] {
    font-weight: var(--font-weight-normal);
    text-transform: none;
    color: var(--color-text-muted);
}

.qb-info-link[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-primary);
    text-decoration: underline;
    cursor: pointer;
}

.qb-field-block[b-gjgaza9ig8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.qb-treatment-hint[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin: 0;
}

.qb-loading-hint[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

/* Treatment section */

.qb-treatment-section[b-gjgaza9ig8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.qb-treatment-cards[b-gjgaza9ig8] {
    display: flex;
    flex-direction: column;
    margin-top: var(--space-2);
}

/* Borderless recap layout, matching the kit's actual rebook.html treatment block exactly
   (no card/border in the reference — just a row + a bottom divider). The checkbox has no kit
   equivalent (the reference is a static single-item recap, not a browsable list) — added at the
   left of the row since our app needs multi-treatment selection. */
.qb-treatment-item[b-gjgaza9ig8] {
    padding-top: var(--space-3);
    padding-bottom: var(--space-5);
    border-bottom: 0.0625rem solid var(--color-border);
}

.qb-treatment-item:first-child[b-gjgaza9ig8] {
    padding-top: 0;
}

.qb-treatment-item:last-child[b-gjgaza9ig8] {
    border-bottom: none;
    padding-bottom: 0;
}

.qb-treatment-item__row[b-gjgaza9ig8] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

.qb-treatment-item__checkbox[b-gjgaza9ig8] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding-top: 0.1875rem;
}

.qb-treatment-item__checkbox input[b-gjgaza9ig8] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: var(--color-primary);
    cursor: pointer;
}

.qb-treatment-item--collapsed .qb-treatment-item__checkbox input[b-gjgaza9ig8] {
    cursor: not-allowed;
    opacity: 0.5;
}

.qb-treatment-item__main[b-gjgaza9ig8] {
    flex: 1;
    min-width: 0;
}

.qb-treatment-item__title[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
    line-height: var(--line-height-tight);
}

.qb-treatment-item__meta[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: var(--space-1) 0 0;
}

.qb-treatment-item__description[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    line-height: var(--line-height-base);
    margin: var(--space-1) 0 0;
    max-width: 34rem;
}

.qb-treatment-item__pricing[b-gjgaza9ig8] {
    display: flex;
    gap: var(--space-5);
    flex-shrink: 0;
    text-align: right;
}

.qb-treatment-item__price-block[b-gjgaza9ig8] {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.qb-treatment-item__price-label[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: 0.6875rem;
    color: var(--color-text-muted);
}

.qb-treatment-item__price-label--member[b-gjgaza9ig8] {
    color: var(--color-primary);
}

.qb-treatment-item__price-value[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
}

.qb-treatment-show-more[b-gjgaza9ig8] {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 2.5rem;
    height: 2.5rem;
    margin-top: var(--space-3);
    padding: 0;
    border: 0.0625rem solid var(--color-border);
    border-radius: 50%;
    background: var(--color-bg-cream);
    color: var(--color-primary);
    box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.12);
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.qb-treatment-show-more:hover[b-gjgaza9ig8] {
    background: var(--color-primary);
    color: #fff;
}

.qb-treatment-show-more svg[b-gjgaza9ig8] {
    width: 1.375rem;
    height: 1.375rem;
    stroke-width: 2;
}

.qb-treatment-item__duration[b-gjgaza9ig8] {
    margin-top: var(--space-3);
    margin-left: calc(1.125rem + var(--space-3));
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    max-width: 30rem;
}

/* Search actions */

.qb-search-actions[b-gjgaza9ig8] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
}

/* Results */

.qb-results[b-gjgaza9ig8] {
    margin-top: var(--space-6);
    padding-top: var(--space-6);
    border-top: 0.0625rem solid var(--color-border);
}

.qb-results__title[b-gjgaza9ig8] {
    margin: 0 0 var(--space-5);
}

.qb-results__grid[b-gjgaza9ig8] {
    display: grid;
    grid-template-columns: minmax(0, 19rem) minmax(0, 1fr);
    gap: var(--space-6);
    align-items: start;
}

.qb-results__grid--single[b-gjgaza9ig8] {
    grid-template-columns: minmax(0, 1fr);
}

.qb-results__calendar[b-gjgaza9ig8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    min-width: 0;
}

.qb-results__calendar[b-gjgaza9ig8]  .spa-datepicker {
    width: 100%;
    max-width: 100%;
}

.qb-calendar-legend[b-gjgaza9ig8] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
}

.qb-calendar-legend__dot[b-gjgaza9ig8] {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.qb-calendar-legend__dot--scheduled[b-gjgaza9ig8] {
    background: var(--color-accent-terracotta);
}

.qb-calendar-legend__dot--available[b-gjgaza9ig8] {
    background: #345d89;
}

.qb-calendar-end-warning[b-gjgaza9ig8] {
    margin-top: var(--space-3);
}

.qb-results__slots[b-gjgaza9ig8] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    min-width: 0;
}

/* Compact pill chips (kit's own .hub-timeslot default is 4rem tall — shorter here to match the
   reference availability.html screenshot) with an explicit, non-stretching flex-wrap so slots
   flow multiple-per-row instead of stacking one per row. */
.qb-results__slots[b-gjgaza9ig8]  .hub-timeslots {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.qb-results__slots[b-gjgaza9ig8]  .hub-timeslot {
    flex: 0 0 auto;
    width: auto;
    min-width: 5rem;
    height: 2.75rem;
    padding: 0 0.75rem;
}

.qb-results__slots[b-gjgaza9ig8]  .hub-timeslot span {
    font-size: var(--font-size-sm);
}

.qb-locked-date-header[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    margin: 0;
}

.qb-partofday-warning[b-gjgaza9ig8] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin: 0;
}

.qb-book-now-row[b-gjgaza9ig8] {
    margin-top: var(--space-2);
}

@media (max-width: 35.99875rem) {
    .qb-treatment-item__pricing[b-gjgaza9ig8] {
        display: none;
    }
}

@media (max-width: 48rem) {
    .qb-results__grid[b-gjgaza9ig8] {
        grid-template-columns: minmax(0, 1fr);
    }

    .qb-results__calendar[b-gjgaza9ig8]  .spa-datepicker,
    .qb-results__calendar[b-gjgaza9ig8] {
        max-width: 100%;
    }

    .qb-treatment-item__row[b-gjgaza9ig8] {
        flex-wrap: wrap;
    }

    .qb-treatment-item__pricing[b-gjgaza9ig8] {
        gap: var(--space-4);
        margin-left: calc(1.125rem + var(--space-3));
        text-align: left;
    }

    .qb-page-card[b-gjgaza9ig8] {
        padding: var(--space-4);
    }

    .qb-search-actions[b-gjgaza9ig8]  .spa-btn,
    .qb-book-now-row[b-gjgaza9ig8]  .spa-btn {
        width: 100%;
    }

    .qb-search-actions[b-gjgaza9ig8] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* _content/FTS.Online/Components/Pages/Rebook/Index.razor.rz.scp.css */
/* Kit reference: pages/hub/rebook.html (search form) + pages/hub/availability.html (results —
   date picker + time slots), same references SearchAppointmentSection.razor.css uses for /booking.
   Page-scoped classes (rebook-*) below have no kit component equivalent — everything reusable
   (pills, dropdown fields, date picker, time slots) comes from Components/Shared/Kit instead.
   No .cs logic changed — markup/CSS only. */

.rebook-back-home[b-e6661js90c] {
    margin-bottom: var(--space-4);
}

.rebook-back-home a[b-e6661js90c] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-primary);
    text-decoration: none;
}

.rebook-back-home a:hover[b-e6661js90c] {
    text-decoration: underline;
}

.rebook-header[b-e6661js90c] {
    margin-bottom: var(--space-5);
}

.rebook-header__title[b-e6661js90c] {
    margin: 0 0 var(--space-2);
}

.rebook-header__subtitle[b-e6661js90c] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    max-width: 40rem;
    line-height: var(--line-height-base);
}

.rebook-page-card[b-e6661js90c] {
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.rebook-field--narrow[b-e6661js90c] {
    max-width: 22.5rem;
}

/* Treatment section — kit's rebook.html shows one static already-selected treatment recap;
   our app needs a browsable list of the visit's original services, so this repeats that same
   row+divider layout per item rather than inventing a new pattern. */

.rebook-treatment-section[b-e6661js90c] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.rebook-treatment-list[b-e6661js90c] {
    display: flex;
    flex-direction: column;
}

.rebook-treatment-item[b-e6661js90c] {
    padding-top: var(--space-4);
    padding-bottom: var(--space-5);
    border-bottom: 0.0625rem solid var(--color-border);
}

.rebook-treatment-item:first-child[b-e6661js90c] {
    padding-top: 0;
}

.rebook-treatment-item:last-child[b-e6661js90c] {
    border-bottom: none;
    padding-bottom: 0;
}

.rebook-treatment-item__header[b-e6661js90c] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

.rebook-treatment-item__original[b-e6661js90c] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0 0 var(--space-1);
}

.rebook-treatment-item__remove[b-e6661js90c] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    margin-left: auto;
    padding: 0;
    border: none;
    background: none;
    color: var(--color-error);
    cursor: pointer;
    flex-shrink: 0;
}

.rebook-treatment-item__remove-text[b-e6661js90c] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-error);
}

.rebook-treatment-item__title[b-e6661js90c] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
    line-height: var(--line-height-tight);
    margin: 0;
}

/* Technician + enhancements sit in their own row below the treatment recap, each capped to a
   sensible field width, rather than squeezed beside the recap text where a long treatment name
   left them stranded at the top of an unbalanced row. */
.rebook-treatment-item__fields[b-e6661js90c] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--space-5);
    margin-top: var(--space-4);
}

.rebook-treatment-item__technician[b-e6661js90c] {
    flex: 0 1 16rem;
    min-width: 12rem;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.rebook-treatment-item__enhancements[b-e6661js90c] {
    flex: 1 1 16rem;
    min-width: 12rem;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.rebook-chip-row[b-e6661js90c] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

.rebook-chip[b-e6661js90c] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    border-radius: var(--radius-pill);
    padding: 0.375rem var(--space-3);
    background: var(--color-bg);
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-primary);
}

.rebook-chip__remove[b-e6661js90c] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    padding: 0;
    border: none;
    background: none;
    color: var(--color-text-muted);
    cursor: pointer;
    flex-shrink: 0;
    border-radius: 50%;
}

.rebook-chip__remove:hover[b-e6661js90c] {
    color: var(--color-error);
    background: rgba(192, 57, 43, 0.1);
}

/* Search actions */

.rebook-search-actions[b-e6661js90c] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

/* Results */

/* Results sit inside the same .rebook-page-card as the search form (divider, not a second
   stacked card) — two adjacent rounded cards with little/no gap between them produced a visible
   seam where their corners nearly met. */
.rebook-results[b-e6661js90c] {
    margin-top: var(--space-6);
    padding-top: var(--space-6);
    border-top: 0.0625rem solid var(--color-border);
}

.rebook-results__title[b-e6661js90c] {
    margin: 0 0 var(--space-5);
}

.rebook-results__grid[b-e6661js90c] {
    display: grid;
    grid-template-columns: minmax(0, 19rem) minmax(0, 1fr);
    gap: var(--space-6);
    align-items: start;
}

.rebook-results__calendar[b-e6661js90c] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    min-width: 0;
}

.rebook-results__calendar[b-e6661js90c]  .spa-datepicker {
    width: 100%;
    max-width: 100%;
}

.rebook-calendar-legend[b-e6661js90c] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
}

.rebook-calendar-legend__dot[b-e6661js90c] {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.rebook-calendar-legend__dot--scheduled[b-e6661js90c] {
    background: var(--color-accent-terracotta);
}

.rebook-calendar-legend__dot--available[b-e6661js90c] {
    background: #345d89;
}

.rebook-results__slots[b-e6661js90c] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    min-width: 0;
}

.rebook-results__slots[b-e6661js90c]  .hub-timeslots {
    display: flex;
    flex-wrap: wrap;
    gap: 0.625rem;
}

.rebook-results__slots[b-e6661js90c]  .hub-timeslot {
    flex: 0 0 auto;
    width: auto;
    min-width: 5rem;
    height: auto;
    min-height: 2.75rem;
    padding: 0.375rem 0.75rem;
}

.rebook-results__slots[b-e6661js90c]  .hub-timeslot span {
    font-size: var(--font-size-sm);
}

.rebook-slot-meta-line[b-e6661js90c] {
    display: block;
}

.rebook-partofday-warning[b-e6661js90c] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin: 0;
}

.rebook-book-now-row[b-e6661js90c] {
    margin-top: var(--space-2);
}

/* Continue/Next button lives in ItinerarySection's FooterContent slot (matches QuickBooking's
   quickbooking-continue-btn) rather than as a standalone row in the page column. */
[b-e6661js90c] .rebook-continue-btn {
    width: 100%;
}

@media (max-width: 48rem) {
    .rebook-results__grid[b-e6661js90c] {
        grid-template-columns: minmax(0, 1fr);
    }

    .rebook-results__calendar[b-e6661js90c]  .spa-datepicker,
    .rebook-results__calendar[b-e6661js90c] {
        max-width: 100%;
    }

    .rebook-page-card[b-e6661js90c] {
        padding: var(--space-4);
    }

    .rebook-search-actions[b-e6661js90c]  .spa-btn,
    .rebook-book-now-row[b-e6661js90c]  .spa-btn {
        width: 100%;
    }
}
/* _content/FTS.Online/Components/Pages/Survey/SurveyView.razor.rz.scp.css */
.sv-page[b-n9bsns6c0v] {
    min-height: 100vh;
    background: var(--color-bg);
    padding: var(--space-8) var(--space-4);
}

.sv-content[b-n9bsns6c0v] {
    max-width: 40rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.sv-header__title[b-n9bsns6c0v] {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-heading);
    font-size: var(--font-size-2xl);
    color: var(--color-primary);
    margin: 0 0 var(--space-2);
    text-align: center;
}

.sv-header__subtitle[b-n9bsns6c0v] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
    text-align: center;
}

.sv-questions[b-n9bsns6c0v] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.sv-question[b-n9bsns6c0v] {
    background: var(--color-bg-cream);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-5);
}

.sv-question__text[b-n9bsns6c0v] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-base);
    color: var(--color-text-primary);
    margin: 0 0 var(--space-4);
}

.sv-range[b-n9bsns6c0v] {
    display: flex;
    gap: var(--space-2);
}

.sv-range__option[b-n9bsns6c0v] {
    flex: 1;
    height: 2.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg);
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    cursor: pointer;
}

.sv-range__option--selected[b-n9bsns6c0v] {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-bg);
}

.sv-range__labels[b-n9bsns6c0v] {
    display: flex;
    justify-content: space-between;
    margin-top: var(--space-2);
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-secondary);
}

.sv-yesno[b-n9bsns6c0v] {
    display: flex;
    gap: var(--space-3);
}

.sv-yesno__option[b-n9bsns6c0v] {
    flex: 1;
    height: 2.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg);
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
    cursor: pointer;
}

.sv-yesno__option--selected[b-n9bsns6c0v] {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-bg);
}

.sv-textarea[b-n9bsns6c0v] {
    width: 100%;
    min-height: 5rem;
    padding: var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg);
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    resize: vertical;
}

.sv-submit-btn[b-n9bsns6c0v] {
    height: 3rem;
    border: none;
    border-radius: 6.25rem;
    background: var(--color-primary);
    font-family: var(--font-body);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-base);
    color: var(--color-bg);
    cursor: pointer;
}

.sv-submit-btn:disabled[b-n9bsns6c0v] {
    opacity: 0.5;
    cursor: not-allowed;
}

.sv-status[b-n9bsns6c0v] {
    max-width: 30rem;
    margin: var(--space-8) auto 0;
    text-align: center;
    font-family: var(--font-body);
    color: var(--color-text-secondary);
}

.sv-status h1[b-n9bsns6c0v] {
    font-family: var(--font-heading);
    font-size: var(--font-size-xl);
    color: var(--color-text-primary);
    margin: 0 0 var(--space-3);
}

.sv-status--error h1[b-n9bsns6c0v] {
    color: var(--color-text-primary);
}

@media (max-width: 36rem) {
    .sv-page[b-n9bsns6c0v] {
        padding: var(--space-5) var(--space-3);
    }

    .sv-question[b-n9bsns6c0v] {
        padding: var(--space-4);
    }
}
/* _content/FTS.Online/Components/Shared/AppointmentOptionsSection.razor.rz.scp.css */
/* Kit reference: pages/hub/treatments-enhancements.html. hub-enhancement-grid/-card (kit.css) cover
   the enhancement tiles themselves; these fill the gaps kit has no reusable class for yet
   (per-appointment card chrome, collapse toggle). */

.opts-header[b-cw6z5918m3] {
    margin-bottom: var(--space-5);
}

.opts-header h1[b-cw6z5918m3] {
    margin: 0;
}

.opts-page-card[b-cw6z5918m3] {
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.opts-list[b-cw6z5918m3] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.opts-card[b-cw6z5918m3] {
    background: var(--color-surface);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-4) var(--space-4) var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.opts-card__header[b-cw6z5918m3] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-3);
}

.opts-card__title[b-cw6z5918m3] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-md);
    color: var(--color-primary);
    margin: 0 0 0.25rem;
}

.opts-card__meta[b-cw6z5918m3] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    margin: 0;
}

.opts-card__toggle[b-cw6z5918m3] {
    width: 1.75rem;
    height: 1.75rem;
    flex-shrink: 0;
    border: none;
    border-radius: 50%;
    background: var(--color-bg);
    color: var(--color-text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.opts-card__toggle svg[b-cw6z5918m3] {
    transition: transform var(--duration-normal) var(--ease-default);
}

.opts-card__toggle[aria-expanded="true"] svg[b-cw6z5918m3] {
    transform: rotate(180deg);
}

/* Kit's default hub-enhancement-grid column (12.5rem) reads cramped with real service names
   ("CBD Enhanced Relaxation") — widen just here rather than changing the shared kit.css default. */
.opts-card .hub-enhancement-grid[b-cw6z5918m3] {
    grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
}

.opts-card__label[b-cw6z5918m3] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    margin: 0;
}

.opts-empty[b-cw6z5918m3] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    margin: 0;
}

.opts-actions[b-cw6z5918m3] {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

@media (max-width: 40rem) {
    .opts-header[b-cw6z5918m3] {
        margin-top: var(--space-2);
    }

    .opts-page-card[b-cw6z5918m3] {
        padding: var(--space-4);
    }

    .opts-card[b-cw6z5918m3] {
        padding: var(--space-3) var(--space-3) var(--space-4);
    }

    .opts-card .hub-enhancement-grid[b-cw6z5918m3] {
        grid-template-columns: 1fr;
        gap: var(--space-3);
    }

    /* Kit's card packs image+title+price+button into one tight column at 72px image size;
       on a full-width mobile card that leaves a lot of dead space beside the text. Widen the
       image and let the text/button sit beside it on one row instead. */
    .opts-card[b-cw6z5918m3]  .hub-enhancement-card {
        align-items: center;
    }

    .opts-card[b-cw6z5918m3]  .hub-enhancement-card__img {
        width: 5.5rem;
        height: 5.5rem;
    }

    .opts-actions[b-cw6z5918m3]  .spa-btn {
        flex: 1;
    }
}
/* _content/FTS.Online/Components/Shared/BillingSection.razor.rz.scp.css */
/* Kit reference: pages/hub/confirm-reservation.html. Shell classes (billing-header/-page-card/
   -label/-failure/-card-list/-actions) and the form-grid/tokenizer field styling (billing-form-*,
   billing-tokenizer*) all live in kit.css now — GiftBillingSection reuses the whole shell too, so
   it's shared design-system CSS, not this page's own. Nothing left to scope here. */

.billing-intro[b-rsu65lix7a] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
}
/* _content/FTS.Online/Components/Shared/ConfirmationSection.razor.rz.scp.css */
/* Kit reference: pages/hub/confirm-reservation.html — the embedded sidebar (used as the Billing
   step's cart) reuses kit.css's .hub-itinerary-sidebar/.cart-* families (same as ItinerarySection)
   plus the promo-code + legal-text block, which kit's own version keeps much shorter than ours. */

.hub-itinerary-sidebar[b-a16ic1rtsh] {
    width: 100%;
}

.confirmation-sidebar__header[b-a16ic1rtsh] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-2);
}

.confirmation-cancel-link[b-a16ic1rtsh] {
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    color: var(--color-error);
    text-decoration: underline;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
}

.confirmation-discount-detail[b-a16ic1rtsh] {
    display: block;
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
    margin-top: 0.125rem;
}

.confirmation-footer[b-a16ic1rtsh] {
    border-top: 0.0625rem solid #e4e9ee;
    padding-top: var(--space-3);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confirmation-promo-link[b-a16ic1rtsh] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-primary);
    text-decoration: underline;
    cursor: pointer;
}

.confirmation-promo-row[b-a16ic1rtsh] {
    display: flex;
    gap: var(--space-2);
    align-items: flex-end;
}

.confirmation-promo-row[b-a16ic1rtsh]  .spa-field {
    flex: 1;
    margin: 0;
}

.confirmation-legal[b-a16ic1rtsh] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    font-family: var(--font-body);
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
    line-height: var(--line-height-base);
}

.confirmation-legal p[b-a16ic1rtsh] {
    margin: 0;
}

[b-a16ic1rtsh] .confirmation-confirm-btn {
    width: 100%;
}
/* _content/FTS.Online/Components/Shared/ContraindicationsSection.razor.rz.scp.css */
/* No kit reference page for this content — chrome mirrors AppointmentOptionsSection.razor.css
   (opts-*) and SearchAppointmentSection.razor.css (qb-*) so the booking-wizard steps read as one
   consistent system. */

.contra-header[b-rzdq36bkvf] {
    margin-bottom: var(--space-5);
}

.contra-header h1[b-rzdq36bkvf] {
    margin: 0;
}

.contra-page-card[b-rzdq36bkvf] {
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

.contra-intro[b-rzdq36bkvf] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
    margin: 0;
}

.contra-list[b-rzdq36bkvf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.contra-card[b-rzdq36bkvf] {
    background: var(--color-surface);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.contra-card__header[b-rzdq36bkvf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-3);
    padding-bottom: var(--space-3);
    border-bottom: 0.0625rem solid var(--color-border-light);
}

.contra-card__time[b-rzdq36bkvf] {
    font-family: var(--font-body);
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    flex-shrink: 0;
}

.contra-card__meta[b-rzdq36bkvf] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    text-align: right;
}

.contra-card__meta strong[b-rzdq36bkvf] {
    color: var(--color-text-primary);
    font-weight: var(--font-weight-semibold);
}

.contra-card__items[b-rzdq36bkvf] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.contra-item[b-rzdq36bkvf] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    cursor: pointer;
}

.contra-item input[b-rzdq36bkvf] {
    flex-shrink: 0;
    width: 1.125rem;
    height: 1.125rem;
    margin-top: 0.1875rem;
    accent-color: var(--color-primary);
    cursor: pointer;
}

.contra-item__text[b-rzdq36bkvf] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    line-height: var(--line-height-base);
}

.contra-actions[b-rzdq36bkvf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media (max-width: 40rem) {
    .contra-page-card[b-rzdq36bkvf] {
        padding: var(--space-4);
    }

    .contra-card__header[b-rzdq36bkvf] {
        flex-direction: column;
    }

    .contra-card__meta[b-rzdq36bkvf] {
        text-align: left;
    }

    .contra-actions[b-rzdq36bkvf]  .spa-btn {
        flex: 1;
    }
}
/* _content/FTS.Online/Components/Shared/FriendSelectionDialog.razor.rz.scp.css */
/* Kit has no reference for this dialog. Rendered inside MainLayout's RadzenDialog (see the
   comment there) so it inherits kit tokens; this is just the content's own layout. */

.friend-dialog[b-wvr6l7l8sv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
    min-width: 20rem;
    max-width: 28rem;
    margin: 0 auto;
}

.friend-dialog__header[b-wvr6l7l8sv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.friend-dialog__notice[b-wvr6l7l8sv] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
}

.friend-dialog__notice a[b-wvr6l7l8sv] {
    color: inherit;
    text-decoration: underline;
}

.friend-dialog__section[b-wvr6l7l8sv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.friend-list[b-wvr6l7l8sv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.friend-list__row[b-wvr6l7l8sv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-3);
    border: 0.0625rem solid var(--color-border);
    border-radius: var(--radius-md);
}

.friend-list__row[b-wvr6l7l8sv]  .spa-checkbox {
    flex: 1;
}

.friend-dialog[b-wvr6l7l8sv]  .friend-list__delete {
    color: var(--color-error);
    border-color: var(--color-error);
    flex-shrink: 0;
}

.friend-dialog__actions[b-wvr6l7l8sv] {
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 30rem) {
    .friend-dialog[b-wvr6l7l8sv] {
        min-width: 0;
    }
}
/* _content/FTS.Online/Components/Shared/InfoTooltip.razor.rz.scp.css */
/* Kit has no reference for this trigger — mirrors the same info-circle icon/button already used
   for RegionSelection's and GiftCardCart's info buttons (own scoped copies there, since isolated
   CSS can't be shared across components). */

.info-tooltip-btn[b-qr0a3ker2a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.125rem;
    height: 1.125rem;
    margin-left: 0.25rem;
    padding: 0;
    border: none;
    background: none;
    color: var(--color-text-muted);
    cursor: pointer;
    vertical-align: -0.15em;
    flex-shrink: 0;
}

.info-tooltip-btn svg[b-qr0a3ker2a] {
    width: 100%;
    height: 100%;
}

.info-tooltip-btn:hover[b-qr0a3ker2a],
.info-tooltip-btn:focus-visible[b-qr0a3ker2a] {
    color: var(--color-primary);
}
/* _content/FTS.Online/Components/Shared/InlineAuthStep.razor.rz.scp.css */
.auth-header[b-cb8idce5s3] {
    max-width: 36rem;
    margin-inline: auto;
    margin-bottom: var(--space-5);
}

.auth-header h1[b-cb8idce5s3] {
    margin: 0;
}

.auth-page-card[b-cb8idce5s3] {
    max-width: 36rem;
    margin-inline: auto;
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    gap: var(--space-5);
}

/* .hub-login__row is defined in Profile/Create.razor.css, which is CSS-isolated to that
   component — duplicated here so the same two-column field pairing works in this component too. */
.hub-login__row[b-cb8idce5s3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-4);
}

.auth-actions[b-cb8idce5s3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: var(--space-2);
}

@media (max-width: 40rem) {
    .auth-page-card[b-cb8idce5s3] {
        padding: var(--space-4);
    }

    .hub-login__row[b-cb8idce5s3] {
        grid-template-columns: 1fr;
    }

    .auth-actions[b-cb8idce5s3]  .spa-btn {
        flex: 1;
    }
}
/* _content/FTS.Online/Components/Shared/ItinerarySection.razor.rz.scp.css */
/* cart-*/hub-itinerary-sidebar__* chrome lives in kit.css (shared with ConfirmationSection's
   embedded itinerary). Only this width override is specific to this component. */

/* Kit's own default is a fixed 19.125rem (306px) aside, sized for its own hub-booking-split
   layout (narrow aside next to a much wider main column). Our page instead gives this a real
   Bootstrap column (col-md-3) to sit in, so it should fill that column's width rather than
   leaving dead space beside a fixed-width card. */
.hub-itinerary-sidebar[b-fc7a36hv3i] {
    width: 100%;
}
/* _content/FTS.Online/Components/Shared/Kit/SpaNotificationHost.razor.rz.scp.css */
.spa-notification-host[b-umaggxpv06] {
    position: fixed;
    top: var(--space-5);
    right: var(--space-5);
    z-index: var(--z-notification);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    max-width: 24rem;
    width: calc(100% - 2 * var(--space-5));
    pointer-events: none;
}

.spa-notification[b-umaggxpv06] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
    padding: var(--space-4);
    border-radius: var(--radius-md);
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    line-height: var(--line-height-relaxed);
    background: #fff;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
    pointer-events: auto;
    animation: spa-notification-in-b-umaggxpv06 var(--duration-normal) var(--ease-default);
}

@keyframes spa-notification-in-b-umaggxpv06 {
    from { opacity: 0; transform: translateY(-0.5rem); }
    to { opacity: 1; transform: translateY(0); }
}

.spa-notification__icon[b-umaggxpv06] {
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.spa-notification__body[b-umaggxpv06] {
    flex: 1;
    min-width: 0;
}

.spa-notification__summary[b-umaggxpv06] {
    margin: 0;
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary);
}

.spa-notification__detail[b-umaggxpv06] {
    margin: 0.25rem 0 0;
    color: var(--color-text-secondary);
}

.spa-notification__close[b-umaggxpv06] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    padding: 0;
    border: none;
    background: none;
    color: var(--color-text-muted);
    cursor: pointer;
    font-size: 0.875rem;
    line-height: 1;
}

.spa-notification__close:hover[b-umaggxpv06] {
    color: var(--color-text-primary);
}

.spa-notification--success[b-umaggxpv06] { border-left: 0.25rem solid var(--color-success); }
.spa-notification--success .spa-notification__icon[b-umaggxpv06] { color: var(--color-success); }

.spa-notification--error[b-umaggxpv06] { border-left: 0.25rem solid var(--color-error); }
.spa-notification--error .spa-notification__icon[b-umaggxpv06] { color: var(--color-error); }

.spa-notification--warning[b-umaggxpv06] { border-left: 0.25rem solid var(--color-accent-terracotta); }
.spa-notification--warning .spa-notification__icon[b-umaggxpv06] { color: var(--color-accent-terracotta); }

.spa-notification--info[b-umaggxpv06] { border-left: 0.25rem solid var(--color-primary); }
.spa-notification--info .spa-notification__icon[b-umaggxpv06] { color: var(--color-primary); }

@media (max-width: 30rem) {
    .spa-notification-host[b-umaggxpv06] {
        left: var(--space-4);
        right: var(--space-4);
        top: var(--space-4);
        max-width: none;
        width: auto;
    }
}
/* _content/FTS.Online/Components/Shared/MembershipCreditCardSection.razor.rz.scp.css */
/* Field grid/tokenizer chrome (billing-form-*, billing-tokenizer*, spa-field) lives in kit.css —
   shared with BillingSection's identical new-card form. Only this component's own small overrides
   stay here. */

.membership-card-update__error-text[b-0nfgn9me9f] {
    margin: 0.25rem 0 0;
}
/* _content/FTS.Online/Components/Shared/RegionSelection.razor.rz.scp.css */
.region-page-card[b-qblm130ime] {
    max-width: 26rem;
    margin: var(--space-8) auto;
    background: var(--color-bg-cream);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: var(--space-5);
}

.region-header[b-qblm130ime] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-3);
}

.region-title-row[b-qblm130ime] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

.region-title-row .spa-heading-3[b-qblm130ime] {
    margin: 0;
}

.region-subtitle[b-qblm130ime] {
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    margin: 0;
}

.region-field[b-qblm130ime] {
    width: 100%;
    max-width: 16rem;
}

[b-qblm130ime] .region-set-btn {
    min-width: 10rem;
}
/* _content/FTS.Online/Components/Shared/Spinner.razor.rz.scp.css */
.spinner-overlay[b-3cmayc6gbg] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(26, 23, 18, 0.4);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
}

.spinner-wrapper[b-3cmayc6gbg] {
    text-align: center;
}

.spinner-message[b-3cmayc6gbg] {
    margin: var(--space-3, 0.75rem) 0 0;
    color: #fff;
    font-family: var(--font-body);
    font-size: var(--font-size-sm);
}

.spa-loader[b-3cmayc6gbg] {
    animation: spa-loader-spin-b-3cmayc6gbg 0.9s linear infinite;
}

.spa-loader__track[b-3cmayc6gbg] {
    stroke: var(--color-primary-muted, rgba(51, 93, 136, 0.12));
}

.spa-loader__arc[b-3cmayc6gbg] {
    stroke: var(--color-primary, #335d88);
    stroke-dasharray: 31 94;
}

@keyframes spa-loader-spin-b-3cmayc6gbg {
    to {
        transform: rotate(360deg);
    }
}
/* _content/FTS.Online/Components/Shared/SummarySection.razor.rz.scp.css */
/* All summary-* styling now lives in kit.css — see the "Order/booking summary" comment there.
   Promoted once GiftOrderConfirmation needed the identical hero/itemized-list look. Nothing left
   to scope here. */

@media (max-width: 35.99875rem) {
    .summary-hero .summary-hero__title[b-zhi8dldenp] {
        font-size: 1.5rem;
        white-space: nowrap;
    }
}