/* Phase76.7: booking rail, selection cards, date/time and appointment review.
   Only the eight-route content activation loads these owned styles. Scheduling remains server-owned. */
.mw76-root.mw76-booking-content { display: block; padding: var(--mw76-space-8); background: var(--mw76-surface-muted); align-content: start; }
.mw76-frame[data-mw-76-shell="CUSTOMER_SHELL"] > .mw76-booking-content { grid-column: 2; grid-row: 2; inline-size: 100%; }
.mw76-root.mw76-booking-content .mw76-booking-page { max-inline-size: var(--mw76-content-public); margin-inline: auto; }
.mw76-root.mw76-booking-content .mw76-booking-context { display: flex; justify-content: space-between; align-items: center; gap: var(--mw76-space-6); margin-block-end: var(--mw76-space-8); }
.mw76-root.mw76-booking-content .mw76-booking-context__identity { display: flex; align-items: flex-start; gap: var(--mw76-space-4); min-inline-size: 0; }
.mw76-root.mw76-booking-content .mw76-booking-context__mark { display: inline-grid; place-items: center; flex-shrink: 0; inline-size: 3rem; block-size: 3rem; border-radius: var(--mw76-radius-card); color: var(--mw76-color-action); background: var(--mw76-surface-tint); }
.mw76-root.mw76-booking-content .mw76-booking-context h1 { color: var(--mw76-color-secondary); font: 700 var(--mw76-heading-1)/1.3 var(--mw76-font-display); margin: var(--mw76-space-2) 0; }
.mw76-root.mw76-booking-content .mw76-booking-context p { margin-block-end: var(--mw76-space-1); color: var(--mw76-text-muted); }
.mw76-root.mw76-booking-content .mw76-booking-context__salon { font-weight: 600; }
.mw76-root.mw76-booking-content .mw76-booking-context__location { display: flex; align-items: center; gap: var(--mw76-space-2); font-size: var(--mw76-font-label); }
.mw76-root.mw76-booking-content .mw76-booking-context__actions { display: flex; gap: var(--mw76-space-2); flex-wrap: wrap; }
.mw76-root.mw76-booking-content .mw76-booking-kicker { font-size: var(--mw76-font-label); color: var(--mw76-color-action); font-weight: 700; }
.mw76-root.mw76-booking-content .mw76-booking-layout { display: grid; grid-template-columns: 16rem minmax(0,1fr); gap: var(--mw76-space-8); align-items: start; }
.mw76-root.mw76-booking-content .mw76-booking-decisions { display: grid; gap: var(--mw76-space-6); min-inline-size: 0; }
.mw76-root.mw76-booking-content .mw76-booking-summary { padding: var(--mw76-space-6); border: 1px solid var(--mw76-surface-tint); border-radius: var(--mw76-radius-card); background: var(--mw76-surface); box-shadow: var(--mw76-shadow-card); min-inline-size: 0; }
.mw76-root.mw76-booking-content .mw76-booking-summary__heading { border-block-start: 1px solid var(--mw76-surface-tint); padding-block-start: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-booking-summary__heading > span { font-size: var(--mw76-font-label); color: var(--mw76-color-action); font-weight: 600; }
.mw76-root.mw76-booking-content .mw76-booking-summary h2 { font-size: var(--mw76-heading-3); color: var(--mw76-color-secondary); margin-block: var(--mw76-space-2) var(--mw76-space-4); }
.mw76-root.mw76-booking-content .mw76-booking-summary dl { margin: 0; }
.mw76-root.mw76-booking-content .mw76-booking-summary dl > div { padding-block: var(--mw76-space-3); border-block-end: 1px solid var(--mw76-surface-tint); }
.mw76-root.mw76-booking-content .mw76-booking-summary dt { font-weight: 400; font-size: var(--mw76-font-label); color: var(--mw76-text-muted); }
.mw76-root.mw76-booking-content .mw76-booking-summary dd { margin: var(--mw76-space-1) 0 0; font-weight: 600; overflow-wrap: anywhere; }
.mw76-root.mw76-booking-content .mw76-booking-summary > p { display: flex; align-items: start; gap: var(--mw76-space-2); font-size: var(--mw76-font-label); color: var(--mw76-text-muted); margin-block: var(--mw76-space-4) 0; }
.mw76-root.mw76-booking-content .mw76-booking-progress-list { display: grid; gap: var(--mw76-space-4); padding: 0; margin: 0 0 var(--mw76-space-6); list-style: none; }
.mw76-root.mw76-booking-content .mw76-booking-step { display: flex; align-items: center; gap: var(--mw76-space-3); color: var(--mw76-text-muted); font-size: var(--mw76-font-label); }
.mw76-root.mw76-booking-content .mw76-booking-step-marker { display: inline-grid; place-items: center; inline-size: 2rem; block-size: 2rem; border: 1px solid var(--mw76-border); border-radius: 50%; flex-shrink: 0; font-weight: 600; }
.mw76-root.mw76-booking-content .mw76-booking-step.is-current { color: var(--mw76-color-action); font-weight: 700; }
.mw76-root.mw76-booking-content .mw76-booking-step.is-current .mw76-booking-step-marker { color: var(--mw76-surface); background: var(--mw76-color-action); border-color: var(--mw76-color-action); }
.mw76-root.mw76-booking-content .mw76-booking-step.is-complete { color: var(--mw76-success); }
.mw76-root.mw76-booking-content .mw76-booking-step.is-complete .mw76-booking-step-marker { border-color: var(--mw76-success); }
.mw76-root.mw76-booking-content .mw76-booking-section,
.mw76-root.mw76-booking-content .mw76-booking-times { padding: var(--mw76-space-6); border-radius: var(--mw76-radius-card); background: var(--mw76-surface); border: 1px solid var(--mw76-surface-tint); }
.mw76-root.mw76-booking-content .mw76-booking-section__heading,
.mw76-root.mw76-booking-content .mw76-booking-times__heading { display: flex; align-items: start; justify-content: space-between; flex-wrap: wrap; gap: var(--mw76-space-3); margin-block-end: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-booking-section__heading h2,
.mw76-root.mw76-booking-content .mw76-booking-times__heading h2 { margin: 0 0 var(--mw76-space-2); color: var(--mw76-color-secondary); font-size: var(--mw76-heading-2); }
.mw76-root.mw76-booking-content .mw76-booking-section__heading p,
.mw76-root.mw76-booking-content .mw76-booking-times__heading p { color: var(--mw76-text-muted); font-size: var(--mw76-font-label); margin: 0; }
.mw76-root.mw76-booking-content .mw76-booking-section__index { display: inline-block; font-size: var(--mw76-font-caption); font-weight: 700; color: var(--mw76-color-action); margin-block-end: var(--mw76-space-2); }
.mw76-root.mw76-booking-content .mw76-booking-complete-label,
.mw76-root.mw76-booking-content .mw76-booking-count { display: inline-flex; align-items: center; gap: var(--mw76-space-1); color: var(--mw76-success); padding: var(--mw76-space-1) var(--mw76-space-2); font-size: var(--mw76-font-caption); border: 1px solid currentColor; border-radius: var(--mw76-radius-control); }
.mw76-root.mw76-booking-content .mw76-booking-count { color: var(--mw76-color-secondary); }
.mw76-root.mw76-booking-content .mw76-booking-native-select { display: grid; gap: var(--mw76-space-2); margin-block-end: var(--mw76-space-4); }
.mw76-root.mw76-booking-content .mw76-field-label { display: block; margin-block-end: var(--mw76-space-2); font-weight: 600; font-size: var(--mw76-font-label); }
.mw76-root.mw76-booking-content .mw76-input { inline-size: 100%; min-inline-size: 0; min-block-size: 3rem; padding: var(--mw76-space-3); border: 1px solid var(--mw76-border); border-radius: var(--mw76-radius-control); font: inherit; color: var(--mw76-text); background: var(--mw76-surface); }
.mw76-root.mw76-booking-content .mw76-input:focus { outline: 2px solid var(--mw76-focus); outline-offset: 2px; }
.mw76-root.mw76-booking-content .mw76-field-error { color: var(--mw76-error); font-size: var(--mw76-font-label); }
.mw76-root.mw76-booking-content .mw76-booking-choice-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--mw76-space-4); }
.mw76-root.mw76-booking-content .mw76-booking-choice { display: flex; flex-direction: column; gap: var(--mw76-space-3); align-items: stretch; text-align: start; padding: var(--mw76-space-3); min-inline-size: 0; border: 1px solid var(--mw76-border); border-radius: var(--mw76-radius-card); background: var(--mw76-surface); color: var(--mw76-text); font: inherit; cursor: pointer; }
.mw76-root.mw76-booking-content .mw76-booking-choice:hover { border-color: var(--mw76-color-action); box-shadow: var(--mw76-shadow-card); }
.mw76-root.mw76-booking-content .mw76-booking-choice.is-selected { border-color: var(--mw76-color-action); box-shadow: inset 0 0 0 1px var(--mw76-color-action); background: var(--mw76-surface-tint); }
.mw76-root.mw76-booking-content .mw76-booking-choice__media { display: grid; place-items: center; aspect-ratio: 16 / 9; overflow: hidden; background: var(--mw76-surface-muted); color: var(--mw76-color-secondary); border-radius: var(--mw76-radius-control); }
.mw76-root.mw76-booking-content .mw76-booking-choice__media img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.mw76-root.mw76-booking-content .mw76-booking-choice__media > svg { inline-size: 2rem; block-size: 2rem; }
.mw76-root.mw76-booking-content .mw76-booking-choice__media--avatar { inline-size: 4rem; block-size: 4rem; aspect-ratio: 1; border-radius: 50%; align-self: center; }
.mw76-root.mw76-booking-content .mw76-booking-provider-choice { text-align: center; }
.mw76-root.mw76-booking-content .mw76-booking-choice__content { display: grid; gap: var(--mw76-space-2); }
.mw76-root.mw76-booking-content .mw76-booking-choice__content strong { font-size: var(--mw76-font-body); font-weight: 600; }
.mw76-root.mw76-booking-content .mw76-booking-choice__content > span,
.mw76-root.mw76-booking-content .mw76-booking-choice__facts { display: grid; gap: var(--mw76-space-1); color: var(--mw76-text-muted); font-size: var(--mw76-font-caption); }
.mw76-root.mw76-booking-content .mw76-booking-choice__status { visibility: hidden; display: flex; align-items: center; justify-content: center; gap: var(--mw76-space-1); font-size: var(--mw76-font-caption); color: var(--mw76-color-action); margin-block-start: auto; }
.mw76-root.mw76-booking-content .mw76-booking-choice.is-selected .mw76-booking-choice__status { visibility: visible; }
.mw76-root.mw76-booking-content .mw76-booking-date-control { max-inline-size: 22rem; margin-block-end: var(--mw76-space-4); }
.mw76-root.mw76-booking-content .mw76-booking-date-strip { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: var(--mw76-space-2); }
.mw76-root.mw76-booking-content .mw76-booking-date-choice { display: grid; justify-items: center; gap: var(--mw76-space-1); padding: var(--mw76-space-3) var(--mw76-space-1); border: 1px solid var(--mw76-border); border-radius: var(--mw76-radius-control); background: var(--mw76-surface); color: var(--mw76-text); font: inherit; font-size: var(--mw76-font-caption); cursor: pointer; }
.mw76-root.mw76-booking-content .mw76-booking-date-choice strong { font-size: var(--mw76-heading-3); }
.mw76-root.mw76-booking-content .mw76-booking-date-choice.is-selected { background: var(--mw76-color-action); border-color: var(--mw76-color-action); color: var(--mw76-surface); text-decoration: underline; text-underline-offset: 0.15em; }
.mw76-root.mw76-booking-content .mw76-booking-date-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: var(--mw76-space-4); margin-block-start: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-booking-hours-context { display: flex; align-items: start; gap: var(--mw76-space-2); font-size: var(--mw76-font-label); }
.mw76-root.mw76-booking-content .mw76-booking-hours-context > div { display: grid; gap: var(--mw76-space-1); }
.mw76-root.mw76-booking-content .mw76-booking-hours-context small { color: var(--mw76-text-muted); max-inline-size: 24rem; }
.mw76-root.mw76-booking-content .mw76-booking-slot-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--mw76-space-3); }
.mw76-root.mw76-booking-content .mw76-booking-slot { display: grid; gap: var(--mw76-space-3); padding: var(--mw76-space-4); border: 1px solid var(--mw76-border); border-radius: var(--mw76-radius-card); min-inline-size: 0; }
.mw76-root.mw76-booking-content .mw76-booking-slot__time { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--mw76-space-2); color: var(--mw76-color-secondary); }
.mw76-root.mw76-booking-content .mw76-booking-slot__time strong { font-size: var(--mw76-heading-3); }
.mw76-root.mw76-booking-content .mw76-booking-slot__time span { font-size: var(--mw76-font-label); color: var(--mw76-text-muted); }
.mw76-root.mw76-booking-content .mw76-booking-slot__detail { display: grid; gap: var(--mw76-space-1); font-size: var(--mw76-font-label); }
.mw76-root.mw76-booking-content .mw76-booking-slot__detail > span { display: flex; align-items: center; gap: var(--mw76-space-1); color: var(--mw76-text-muted); }
.mw76-root.mw76-booking-content .mw76-booking-slot__action { display: flex; align-items: center; justify-content: space-between; gap: var(--mw76-space-2); min-block-size: max(2.75rem, 44px); padding: var(--mw76-space-2); border-radius: var(--mw76-radius-control); background: var(--mw76-surface-tint); color: var(--mw76-color-action); text-decoration: none; font-size: var(--mw76-font-label); font-weight: 600; }
.mw76-root.mw76-booking-content .mw76-booking-slot__action:hover,
.mw76-root.mw76-booking-content .mw76-booking-slot__action.is-selected { background: var(--mw76-color-action); color: var(--mw76-surface); text-decoration: underline; }
.mw76-root.mw76-booking-content .mw76-booking-slot__unavailable { font-size: var(--mw76-font-label); color: var(--mw76-text-muted); }
.mw76-root.mw76-booking-content .mw76-booking-alert,
.mw76-root.mw76-booking-content .mw76-booking-validation-summary.validation-summary-errors { display: flex; gap: var(--mw76-space-3); padding: var(--mw76-space-4); margin-block-end: var(--mw76-space-4); background: var(--mw76-surface); border-inline-start: 3px solid var(--mw76-info); color: var(--mw76-info); border-radius: var(--mw76-radius-control); }
.mw76-root.mw76-booking-content .mw76-booking-alert--danger,
.mw76-root.mw76-booking-content .mw76-booking-validation-summary.validation-summary-errors { color: var(--mw76-error); border-color: var(--mw76-error); }
.mw76-root.mw76-booking-content .mw76-booking-alert--success { color: var(--mw76-success); border-color: var(--mw76-success); }
.mw76-root.mw76-booking-content .mw76-booking-alert--warning { color: var(--mw76-warning); border-color: var(--mw76-warning); }
.mw76-root.mw76-booking-content .mw76-booking-alert > div { display: grid; gap: var(--mw76-space-2); }
.mw76-root.mw76-booking-content .mw76-booking-validation-summary ul { padding-inline-start: var(--mw76-space-4); margin: 0; }
.mw76-root.mw76-booking-content .mw76-booking-validation-summary.validation-summary-valid { display: none; }
.mw76-root.mw76-booking-content .mw76-booking-recovery-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: var(--mw76-space-3); margin-block-start: var(--mw76-space-4); }
.mw76-root.mw76-booking-content .mw76-confirm-layout { display: grid; grid-template-columns: minmax(0,1fr) 18rem; gap: var(--mw76-space-6); align-items: start; margin-block-end: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-confirm-details { display: grid; gap: var(--mw76-space-6); min-inline-size: 0; }
.mw76-root.mw76-booking-content .mw76-confirm-service { display: flex; align-items: center; gap: var(--mw76-space-3); padding: var(--mw76-space-6); background: var(--mw76-surface-tint); border-radius: var(--mw76-radius-card); color: var(--mw76-color-action); margin-block-end: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-confirm-service h3 { font-size: var(--mw76-heading-3); margin: 0; }
.mw76-root.mw76-booking-content .mw76-confirm-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--mw76-space-6); margin-block-end: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-confirm-facts dt { font-size: var(--mw76-font-label); font-weight: 400; color: var(--mw76-text-muted); }
.mw76-root.mw76-booking-content .mw76-confirm-facts dd { margin: var(--mw76-space-2) 0 0; font-weight: 600; }
.mw76-root.mw76-booking-content .mw76-confirm-price { display: flex; justify-content: space-between; gap: var(--mw76-space-4); padding-block-start: var(--mw76-space-6); border-block-start: 1px solid var(--mw76-border); color: var(--mw76-color-secondary); }
.mw76-root.mw76-booking-content .mw76-confirm-price strong { font-size: var(--mw76-heading-2); }
.mw76-root.mw76-booking-content .mw76-confirm-decision { display: grid; gap: var(--mw76-space-4); }
.mw76-root.mw76-booking-content .mw76-confirm-decision h2,
.mw76-root.mw76-booking-content .mw76-confirm-decision p { margin: 0; }
.mw76-root.mw76-booking-content .mw76-booking-confirm-form > .mw76-booking-section { margin-block-end: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--mw76-space-6); }
.mw76-root.mw76-booking-content .mw76-field { min-inline-size: 0; }
.mw76-root.mw76-booking-content .mw76-field--full { grid-column: 1 / -1; }
.mw76-root.mw76-booking-content .mw76-field-help { color: var(--mw76-text-muted); font-size: var(--mw76-font-label); }
.mw76-root.mw76-booking-content .mw76-emphasis { font-weight: 600; }
.mw76-root.mw76-booking-content .mw76-prewrap { white-space: pre-wrap; overflow-wrap: anywhere; }
.mw76-root.mw76-booking-content .mw76-data { unicode-bidi: isolate; }
.mw76-root.mw76-booking-content .mw76-directional-icon:dir(rtl) { transform: scaleX(-1); }
.mw76-root.mw76-booking-content svg { inline-size: 1.125rem; block-size: 1.125rem; flex-shrink: 0; }
.mw76-root.mw76-booking-content [hidden] { display: none; }
.mw76-root.mw76-booking-content button:disabled { cursor: wait; opacity: 0.65; }
.mw76-root.mw76-booking-content .mw76-booking-loading-state { display: flex; gap: var(--mw76-space-3); align-items: center; }
.mw76-root.mw76-booking-content .mw76-spinner:not([hidden]) { display: inline-block; inline-size: 1rem; block-size: 1rem; border: 2px solid currentColor; border-inline-end-color: transparent; border-radius: 50%; }
@media (max-width: 1199.98px) {
    .mw76-root.mw76-booking-content .mw76-booking-layout { grid-template-columns: minmax(0,1fr); }
    .mw76-root.mw76-booking-content .mw76-booking-progress-list { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .mw76-root.mw76-booking-content .mw76-booking-summary dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--mw76-space-4); }
    .mw76-root.mw76-booking-content .mw76-booking-choice-list,
    .mw76-root.mw76-booking-content .mw76-booking-slot-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 991.98px) {
    .mw76-frame[data-mw-76-shell="CUSTOMER_SHELL"] > .mw76-booking-content { grid-column: 1; }
    .mw76-root.mw76-booking-content .mw76-booking-context { align-items: start; flex-direction: column; }
    .mw76-root.mw76-booking-content .mw76-confirm-layout { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 575.98px) {
    .mw76-root.mw76-booking-content { padding: var(--mw76-space-6) var(--mw76-space-4); }
    .mw76-root.mw76-booking-content .mw76-booking-context h1 { font-size: 1.75rem; }
    .mw76-root.mw76-booking-content .mw76-booking-context__mark { display: none; }
    .mw76-root.mw76-booking-content .mw76-booking-section,
    .mw76-root.mw76-booking-content .mw76-booking-times,
    .mw76-root.mw76-booking-content .mw76-booking-summary { padding: var(--mw76-space-4); }
    .mw76-root.mw76-booking-content .mw76-booking-progress-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mw76-root.mw76-booking-content .mw76-booking-choice-list--services,
    .mw76-root.mw76-booking-content .mw76-booking-slot-grid,
    .mw76-root.mw76-booking-content .mw76-field-grid { grid-template-columns: minmax(0,1fr); }
    .mw76-root.mw76-booking-content .mw76-booking-service-choice { display: grid; grid-template-columns: 5rem minmax(0,1fr); align-items: center; }
    .mw76-root.mw76-booking-content .mw76-booking-service-choice .mw76-booking-choice__media { aspect-ratio: 1; }
    .mw76-root.mw76-booking-content .mw76-booking-service-choice .mw76-booking-choice__status { grid-column: 2; justify-content: start; }
    .mw76-root.mw76-booking-content .mw76-booking-date-strip { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .mw76-root.mw76-booking-content .mw76-booking-date-footer > .mw76-action { inline-size: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .mw76-root.mw76-booking-content .mw76-booking-choice,
    .mw76-root.mw76-booking-content .mw76-booking-slot__action { transition: none; }
}
@media (forced-colors: active) {
    .mw76-root.mw76-booking-content .mw76-booking-choice.is-selected { outline: 2px solid Highlight; }
}

.mw76-booking-timezone { display: grid; gap: .35rem; padding: 1rem; margin-block: 0 1.25rem; border: 1px solid var(--mw-border, #dce0e6); border-radius: .75rem; overflow-wrap: anywhere; }
.mw76-booking-timezone span { font-size: .875rem; line-height: 1.5; }