/* Shared by ClientPortal and the isolated branding editor preview.
   Store overrides are generated as --portal-* variables; do not put store values here. */
.portal-theme {
    --bs-body-bg: var(--portal-page-bg);
    --bs-body-bg-rgb: var(--portal-page-bg-rgb);
    --bs-body-color: var(--portal-text);
    --bs-body-color-rgb: var(--portal-text-rgb);
    --bs-body-font-family: var(--portal-font);
    --bs-body-font-size: var(--portal-font-size);
    --bs-heading-color: var(--portal-heading);
    --bs-dark: var(--portal-heading);
    --bs-dark-rgb: var(--portal-heading-rgb);
    --bs-secondary-color: var(--portal-muted);
    --bs-secondary-color-rgb: var(--portal-muted-rgb);
    --bs-tertiary-color: var(--portal-muted);
    --bs-tertiary-color-rgb: var(--portal-muted-rgb);
    --bs-secondary-bg: var(--portal-surface-muted);
    --bs-secondary-bg-rgb: var(--portal-surface-muted-rgb);
    --bs-tertiary-bg: var(--portal-surface-muted);
    --bs-tertiary-bg-rgb: var(--portal-surface-muted-rgb);
    --bs-light: var(--portal-surface-muted);
    --bs-light-rgb: var(--portal-surface-muted-rgb);
    --bs-secondary: var(--portal-surface-muted);
    --bs-secondary-rgb: var(--portal-surface-muted-rgb);
    --bs-secondary-text-emphasis: var(--portal-muted);
    --bs-secondary-bg-subtle: var(--portal-surface-muted);
    --bs-secondary-border-subtle: var(--portal-border);
    --bs-primary: var(--portal-button-primary-bg);
    --bs-primary-rgb: var(--portal-button-primary-bg-rgb);
    --bs-primary-text-emphasis: var(--portal-link);
    --bs-primary-bg-subtle: var(--portal-selection-hover-bg);
    --bs-primary-border-subtle: var(--portal-selection-border);
    --bs-link-color: var(--portal-link);
    --bs-link-color-rgb: var(--portal-link-rgb);
    --bs-link-hover-color: var(--portal-link-hover);
    --bs-link-hover-color-rgb: var(--portal-link-hover-rgb);
    --bs-border-color: var(--portal-border);
    --bs-border-width: var(--portal-border-width);
    background: var(--portal-page-bg);
    color: var(--portal-text);
    font-family: var(--portal-font);
    font-size: var(--portal-font-size);
}
.portal-theme h1, .portal-theme h2, .portal-theme h3,
.portal-theme h4, .portal-theme h5, .portal-theme h6,
.portal-theme .portal-heading, .portal-theme .text-dark {
    color: var(--portal-heading) !important;
    font-family: var(--portal-font);
}
.portal-theme a:not(.btn) { color: var(--portal-link); }
.portal-theme a:not(.btn):hover { color: var(--portal-link-hover); }
.portal-theme .text-muted, .portal-theme .portal-text-muted {
    color: var(--portal-muted) !important;
}
.portal-theme .bg-white { background-color: var(--portal-surface) !important; }
.portal-theme .portal-header {
    --bs-navbar-color: var(--portal-nav-link);
    --bs-navbar-hover-color: var(--portal-nav-hover);
    --bs-navbar-active-color: var(--portal-nav-hover);
    --bs-navbar-brand-color: var(--portal-header-text);
    --bs-navbar-brand-hover-color: var(--portal-header-text);
    background: var(--portal-header-bg);
    color: var(--portal-header-text);
}
.portal-theme .portal-header .navbar-brand { color: var(--portal-header-text); }
.portal-theme .portal-header .navbar-brand:hover { color: var(--portal-header-text); }
.portal-theme .portal-header .nav-link { color: var(--portal-nav-link); }
.portal-theme .portal-header .nav-link:hover,
.portal-theme .portal-header .nav-link.active { color: var(--portal-nav-hover); }
.portal-theme .portal-header .nav-link:hover,
.portal-theme .portal-header .nav-link:focus-visible,
.portal-theme .portal-header .nav-link.active { text-decoration: underline; text-underline-offset: .2em; }
.portal-theme .portal-header .navbar-toggler { color: var(--portal-header-text); }
.portal-theme .portal-header .navbar-toggler-icon {
    position: relative;
    width: 1.25em;
    height: .85em;
    background-image: none;
    border-top: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
}
.portal-theme .portal-header .navbar-toggler-icon::after {
    content: "";
    position: absolute;
    inset: 45% 0 auto;
    border-top: 2px solid currentColor;
}
.portal-theme .portal-footer {
    background: var(--portal-footer-bg);
    color: var(--portal-footer-text);
}
.portal-theme .portal-footer .text-body-secondary { color: var(--portal-footer-text) !important; }
.portal-theme .portal-footer a,
.portal-theme .portal-footer a.text-body-secondary { color: var(--portal-footer-link) !important; }
.portal-theme .card, .portal-theme .portal-card {
    --bs-card-bg: var(--portal-surface);
    --bs-card-color: var(--portal-text);
    --bs-card-title-color: var(--portal-heading);
    --bs-card-border-color: var(--portal-border);
    --bs-card-border-width: var(--portal-border-width);
    --bs-card-border-radius: var(--portal-card-radius);
    --bs-card-inner-border-radius: max(0px, calc(var(--portal-card-radius) - var(--portal-border-width)));
    --bs-card-spacer-x: 1.375rem;
    --bs-card-spacer-y: 1.375rem;
    --bs-card-title-spacer-y: 1rem;
    --bs-card-cap-bg: var(--portal-surface);
    --bs-card-cap-color: var(--portal-heading);
    background: var(--portal-surface);
    color: var(--portal-text);
    border: var(--portal-border-width) solid var(--portal-border);
    border-radius: var(--portal-card-radius) !important;
    box-shadow: var(--portal-shadow) !important;
}
.portal-theme .portal-summary {
    --bs-body-color: var(--portal-summary-text);
    background: var(--portal-summary-bg);
    color: var(--portal-summary-text);
}
.portal-theme .portal-summary .card-body { background: transparent; }
.portal-theme .btn {
    --bs-btn-border-radius: var(--portal-button-radius);
    --bs-btn-padding-x: 1.75rem;
    --bs-btn-padding-y: .825rem;
    --bs-btn-font-size: calc(var(--portal-font-size) * .875);
    --bs-btn-font-weight: 600;
    --bs-btn-line-height: 1.4;
    border-radius: var(--portal-button-radius) !important;
    font-family: var(--portal-font);
}
.portal-theme :is(.btn-sm, .btn-group-sm > .btn) {
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-padding-y: .575rem;
    --bs-btn-font-size: calc(var(--portal-font-size) * .75);
}
.portal-theme :is(.btn-lg, .btn-group-lg > .btn) {
    --bs-btn-padding-x: 2rem;
    --bs-btn-padding-y: 1rem;
    --bs-btn-font-size: var(--portal-font-size);
}
.portal-theme :is(a, button, input, select, textarea):focus-visible {
    outline: 3px solid var(--portal-focus);
    outline-offset: 3px;
}

.portal-theme .btn-primary, .portal-theme .portal-button-primary {
    --bs-btn-color: var(--portal-button-primary-text);
    --bs-btn-bg: var(--portal-button-primary-bg);
    --bs-btn-border-color: var(--portal-button-primary-border);
    --bs-btn-hover-color: var(--portal-button-primary-hover-text);
    --bs-btn-hover-bg: var(--portal-button-primary-hover-bg);
    --bs-btn-hover-border-color: var(--portal-button-primary-hover-bg);
    --bs-btn-active-color: var(--portal-button-primary-active-text);
    --bs-btn-active-bg: var(--portal-button-primary-active-bg);
    --bs-btn-active-border-color: var(--portal-button-primary-active-bg);
    --bs-btn-disabled-color: var(--portal-button-primary-disabled-text);
    --bs-btn-disabled-bg: var(--portal-button-primary-disabled-bg);
    --bs-btn-disabled-border-color: var(--portal-button-primary-disabled-bg);
    --bs-btn-focus-shadow-rgb: var(--portal-focus-rgb);
}

.portal-theme .btn-secondary, .portal-theme .portal-button-secondary {
    --bs-btn-color: var(--portal-button-secondary-text);
    --bs-btn-bg: var(--portal-button-secondary-bg);
    --bs-btn-border-color: var(--portal-button-secondary-border);
    --bs-btn-hover-color: var(--portal-button-secondary-hover-text);
    --bs-btn-hover-bg: var(--portal-button-secondary-hover-bg);
    --bs-btn-hover-border-color: var(--portal-button-secondary-hover-bg);
    --bs-btn-active-color: var(--portal-button-secondary-active-text);
    --bs-btn-active-bg: var(--portal-button-secondary-active-bg);
    --bs-btn-active-border-color: var(--portal-button-secondary-active-bg);
    --bs-btn-disabled-color: var(--portal-button-secondary-disabled-text);
    --bs-btn-disabled-bg: var(--portal-button-secondary-disabled-bg);
    --bs-btn-disabled-border-color: var(--portal-button-secondary-disabled-bg);
    --bs-btn-focus-shadow-rgb: var(--portal-focus-rgb);
}

.portal-theme .btn-outline-primary, .portal-theme .btn-outline-secondary,
.portal-theme .portal-button-outline {
    --bs-btn-color: var(--portal-outline-text);
    --bs-btn-bg: var(--portal-outline-bg);
    --bs-btn-border-color: var(--portal-outline-border);
    --bs-btn-hover-color: var(--portal-outline-hover-text);
    --bs-btn-hover-bg: var(--portal-outline-hover-bg);
    --bs-btn-hover-border-color: var(--portal-outline-hover-bg);
    --bs-btn-active-color: var(--portal-outline-hover-text);
    --bs-btn-active-bg: var(--portal-outline-hover-bg);
    --bs-btn-active-border-color: var(--portal-outline-hover-bg);
    --bs-btn-disabled-color: var(--portal-button-primary-disabled-text);
    --bs-btn-disabled-bg: var(--portal-button-primary-disabled-bg);
    --bs-btn-disabled-border-color: var(--portal-border);
    --bs-btn-focus-shadow-rgb: var(--portal-focus-rgb);
}
.portal-theme .btn-link {
    --bs-btn-color: var(--portal-link);
    --bs-btn-hover-color: var(--portal-link-hover);
    --bs-btn-active-color: var(--portal-link-hover);
}
.portal-theme .form-control, .portal-theme .form-select, .portal-theme .portal-field {
    background-color: var(--portal-input-bg);
    color: var(--portal-input-text);
    border-color: var(--portal-input-border);
    border-radius: var(--portal-input-radius);
    font-family: var(--portal-font);
}
/* Keep the established control sizes while allowing Bootstrap floating labels
   and explicit size modifiers to retain their own padding. */
.portal-theme :where(.form-control, .form-select) {
    padding: .825rem 1rem;
    font-size: calc(var(--portal-font-size) * .875);
    line-height: 1.4;
}
.portal-theme :where(.form-select) {
    padding-right: 3rem;
    background-position: right 1rem center;
}
.portal-theme :where(.form-control-sm, .form-select-sm) {
    padding: .575rem .875rem;
    font-size: calc(var(--portal-font-size) * .75);
}
.portal-theme :where(.form-control-lg, .form-select-lg) {
    padding: 1rem 1.125rem;
    font-size: var(--portal-font-size);
}
.portal-theme :where(.form-select-sm, .form-select-lg) {
    padding-right: 3rem;
}
.portal-theme .form-control::placeholder { color: var(--portal-input-placeholder); }
.portal-theme .form-control:focus, .portal-theme .form-select:focus {
    background-color: var(--portal-input-bg);
    color: var(--portal-input-text);
    border-color: var(--portal-input-focus-border);
    box-shadow: 0 0 0 .2rem rgba(var(--portal-focus-rgb), .2);
}
.portal-theme .form-control:disabled, .portal-theme .form-select:disabled {
    background-color: var(--portal-input-disabled-bg);
    color: var(--portal-input-disabled-text);
}
.portal-theme .form-check-input { border-color: var(--portal-input-border); }
.portal-theme .form-check-input:checked {
    background-color: var(--portal-selection-selected-bg);
    border-color: var(--portal-selection-border);
}
.portal-theme .form-floating > label { color: var(--portal-input-placeholder); }
.portal-theme .form-floating > label::after { background-color: var(--portal-input-bg); }
.portal-theme .invalid, .portal-theme .is-invalid { border-color: var(--portal-danger); outline-color: var(--portal-danger); }
.portal-theme .valid.modified:not([type=checkbox]) { outline-color: var(--portal-success); }
.portal-theme .validation-message, .portal-theme .invalid-feedback { color: var(--portal-danger-text); }
.portal-theme .portal-slot, .portal-theme .portal-step, .portal-theme .portal-selection {
    --bs-btn-bg: var(--portal-selection-bg);
    --bs-btn-color: var(--portal-selection-text);
    --bs-btn-border-color: var(--portal-border);
    --bs-btn-hover-bg: var(--portal-selection-hover-bg);
    --bs-btn-hover-color: var(--portal-selection-text);
}
.portal-theme .portal-selection {
    background-color: var(--portal-selection-bg);
    color: var(--portal-selection-text);
}
.portal-theme .portal-selection:not(.is-selected):hover { background-color: var(--portal-selection-hover-bg); }
.portal-theme .portal-slot[aria-pressed=true],
.portal-theme .portal-slot[aria-checked=true],
.portal-theme .portal-step[aria-current=step] {
    --bs-btn-bg: var(--portal-selection-selected-bg);
    --bs-btn-color: var(--portal-selection-selected-text);
    --bs-btn-border-color: var(--portal-selection-border);
    --bs-btn-hover-bg: var(--portal-selection-selected-bg);
    --bs-btn-hover-color: var(--portal-selection-selected-text);
    background-color: var(--portal-selection-selected-bg);
    border-color: var(--portal-selection-border) !important;
    color: var(--portal-selection-selected-text);
}
.portal-theme .portal-selection.is-selected {
    /* Large cards use a light tint; the border and checkmark carry the selection accent. */
    background-color: var(--portal-selection-bg);
    background-color: color-mix(in srgb, var(--portal-selection-selected-bg) 10%, var(--portal-selection-bg));
    border-color: var(--portal-selection-border) !important;
    color: var(--portal-selection-text);
}
.portal-theme .portal-step.portal-step-complete {
    --bs-btn-bg: var(--portal-step-complete-bg);
    --bs-btn-color: var(--portal-step-complete-text);
    --bs-btn-border-color: var(--portal-step-complete-bg);
    --bs-btn-hover-bg: var(--portal-step-complete-bg);
    --bs-btn-hover-color: var(--portal-step-complete-text);
}
.portal-theme .table, .portal-theme .portal-table {
    --bs-table-bg: var(--portal-table-bg);
    --bs-table-color: var(--portal-table-text);
    --bs-table-border-color: var(--portal-border);
    --bs-table-hover-bg: var(--portal-table-hover-bg);
    --bs-table-hover-color: var(--portal-table-text);
    --bs-table-striped-bg: var(--portal-table-header-bg);
    --bs-table-striped-color: var(--portal-table-text);
}
.portal-theme .table thead { --bs-table-bg: var(--portal-table-header-bg); }
.portal-theme .modal-content, .portal-theme .offcanvas, .portal-theme .dropdown-menu, .portal-theme .portal-modal {
    --bs-modal-bg: var(--portal-modal-bg);
    --bs-modal-color: var(--portal-modal-text);
    --bs-offcanvas-bg: var(--portal-modal-bg);
    --bs-offcanvas-color: var(--portal-modal-text);
    --bs-dropdown-bg: var(--portal-modal-bg);
    --bs-dropdown-color: var(--portal-modal-text);
    --bs-dropdown-link-color: var(--portal-modal-text);
    --bs-dropdown-link-hover-color: var(--portal-modal-text);
    --bs-dropdown-link-hover-bg: var(--portal-selection-hover-bg);
    --bs-dropdown-link-active-color: var(--portal-selection-selected-text);
    --bs-dropdown-link-active-bg: var(--portal-selection-selected-bg);
    background: var(--portal-modal-bg);
    color: var(--portal-modal-text);
    border-color: var(--portal-border);
    border-radius: var(--portal-card-radius);
}
.portal-theme .modal-backdrop, .portal-theme .offcanvas-backdrop { background-color: var(--portal-overlay); }
.portal-theme .portal-loading {
    background: var(--portal-loading-bg);
    color: var(--portal-loading-text);
}
.portal-theme .portal-loading :is(h2, p) { color: var(--portal-loading-text) !important; }
.portal-theme .spinner-border.text-primary, .portal-theme .spinner-grow.text-primary { color: var(--portal-loading) !important; }
.portal-theme .booking-mobile-actions, .portal-theme .mobile-bottom-booking-bar,
.portal-theme .portal-mobile-actions {
    background: var(--portal-mobile-bg) !important;
    color: var(--portal-mobile-text);
    border-color: var(--portal-border) !important;
    box-shadow: var(--portal-shadow);
}
.portal-theme .portal-mobile-actions .text-dark,
.portal-theme .mobile-bottom-booking-bar .text-dark { color: var(--portal-mobile-text) !important; }
.portal-theme .portal-logo {
    height: var(--portal-logo-height);
    max-width: 100%;
    width: auto;
    object-fit: contain;
}
.portal-theme .portal-hero {
    width: 100%;
    height: var(--portal-hero-height);
    max-height: var(--portal-hero-height);
    object-fit: cover;
    object-position: var(--portal-hero-position);
    border-radius: var(--portal-card-radius) !important;
}

.portal-theme {
    --bs-success: var(--portal-success);
    --bs-success-rgb: var(--portal-success-rgb);
    --bs-success-text-emphasis: var(--portal-success-text);
    --bs-success-bg-subtle: var(--portal-success-bg);
    --bs-success-border-subtle: var(--portal-success-border);
}
.portal-theme .alert-success {
    --bs-alert-color: var(--portal-success-text);
    --bs-alert-bg: var(--portal-success-bg);
    --bs-alert-border-color: var(--portal-success-border);
    --bs-alert-link-color: var(--portal-success-text);
    color: var(--portal-success-text);
    background: var(--portal-success-bg);
    border-color: var(--portal-success-border);
}
.portal-theme .btn-success {
    --bs-btn-bg: var(--portal-success-bg);
    --bs-btn-color: var(--portal-success-text);
    --bs-btn-border-color: var(--portal-success-border);
    --bs-btn-hover-bg: var(--portal-success-border);
    --bs-btn-hover-color: var(--portal-success-text);
    --bs-btn-hover-border-color: var(--portal-success);
    --bs-btn-active-bg: var(--portal-success-border);
    --bs-btn-active-color: var(--portal-success-text);
    --bs-btn-active-border-color: var(--portal-success);
}
.portal-theme .badge.bg-success {
    background: var(--portal-success-bg) !important;
    color: var(--portal-success-text) !important;
}

.portal-theme {
    --bs-warning: var(--portal-warning);
    --bs-warning-rgb: var(--portal-warning-rgb);
    --bs-warning-text-emphasis: var(--portal-warning-text);
    --bs-warning-bg-subtle: var(--portal-warning-bg);
    --bs-warning-border-subtle: var(--portal-warning-border);
}
.portal-theme .alert-warning {
    --bs-alert-color: var(--portal-warning-text);
    --bs-alert-bg: var(--portal-warning-bg);
    --bs-alert-border-color: var(--portal-warning-border);
    --bs-alert-link-color: var(--portal-warning-text);
    color: var(--portal-warning-text);
    background: var(--portal-warning-bg);
    border-color: var(--portal-warning-border);
}
.portal-theme .btn-warning {
    --bs-btn-bg: var(--portal-warning-bg);
    --bs-btn-color: var(--portal-warning-text);
    --bs-btn-border-color: var(--portal-warning-border);
    --bs-btn-hover-bg: var(--portal-warning-border);
    --bs-btn-hover-color: var(--portal-warning-text);
    --bs-btn-hover-border-color: var(--portal-warning);
    --bs-btn-active-bg: var(--portal-warning-border);
    --bs-btn-active-color: var(--portal-warning-text);
    --bs-btn-active-border-color: var(--portal-warning);
}
.portal-theme .badge.bg-warning {
    background: var(--portal-warning-bg) !important;
    color: var(--portal-warning-text) !important;
}

.portal-theme {
    --bs-danger: var(--portal-danger);
    --bs-danger-rgb: var(--portal-danger-rgb);
    --bs-danger-text-emphasis: var(--portal-danger-text);
    --bs-danger-bg-subtle: var(--portal-danger-bg);
    --bs-danger-border-subtle: var(--portal-danger-border);
}
.portal-theme .alert-danger {
    --bs-alert-color: var(--portal-danger-text);
    --bs-alert-bg: var(--portal-danger-bg);
    --bs-alert-border-color: var(--portal-danger-border);
    --bs-alert-link-color: var(--portal-danger-text);
    color: var(--portal-danger-text);
    background: var(--portal-danger-bg);
    border-color: var(--portal-danger-border);
}
.portal-theme .btn-danger {
    --bs-btn-bg: var(--portal-danger-bg);
    --bs-btn-color: var(--portal-danger-text);
    --bs-btn-border-color: var(--portal-danger-border);
    --bs-btn-hover-bg: var(--portal-danger-border);
    --bs-btn-hover-color: var(--portal-danger-text);
    --bs-btn-hover-border-color: var(--portal-danger);
    --bs-btn-active-bg: var(--portal-danger-border);
    --bs-btn-active-color: var(--portal-danger-text);
    --bs-btn-active-border-color: var(--portal-danger);
}
.portal-theme .badge.bg-danger {
    background: var(--portal-danger-bg) !important;
    color: var(--portal-danger-text) !important;
}

.portal-theme {
    --bs-info: var(--portal-info);
    --bs-info-rgb: var(--portal-info-rgb);
    --bs-info-text-emphasis: var(--portal-info-text);
    --bs-info-bg-subtle: var(--portal-info-bg);
    --bs-info-border-subtle: var(--portal-info-border);
}
.portal-theme .alert-info {
    --bs-alert-color: var(--portal-info-text);
    --bs-alert-bg: var(--portal-info-bg);
    --bs-alert-border-color: var(--portal-info-border);
    --bs-alert-link-color: var(--portal-info-text);
    color: var(--portal-info-text);
    background: var(--portal-info-bg);
    border-color: var(--portal-info-border);
}
.portal-theme .btn-info {
    --bs-btn-bg: var(--portal-info-bg);
    --bs-btn-color: var(--portal-info-text);
    --bs-btn-border-color: var(--portal-info-border);
    --bs-btn-hover-bg: var(--portal-info-border);
    --bs-btn-hover-color: var(--portal-info-text);
    --bs-btn-hover-border-color: var(--portal-info);
    --bs-btn-active-bg: var(--portal-info-border);
    --bs-btn-active-color: var(--portal-info-text);
    --bs-btn-active-border-color: var(--portal-info);
}
.portal-theme .badge.bg-info {
    background: var(--portal-info-bg) !important;
    color: var(--portal-info-text) !important;
}

.portal-theme :is(.btn-success, .btn-warning, .btn-danger, .btn-info) {
    --bs-btn-disabled-color: var(--bs-btn-color);
    --bs-btn-disabled-bg: var(--bs-btn-bg);
    --bs-btn-disabled-border-color: var(--bs-btn-border-color);
    --bs-btn-focus-shadow-rgb: var(--portal-focus-rgb);
}

/* Functional pages share their selected website's character without inheriting
   the public hero heading sizes or changing any booking and payment controls. */
.portal-operational {
    --operational-content-width: 1280px;
    --operational-gutter: clamp(1.25rem, 4vw, 3rem);
    --operational-page-space: clamp(1.5rem, 3vw, 3rem);
    --operational-main-bg: var(--portal-page-bg);
    --operational-card-border: var(--portal-border);
    --operational-card-shadow: var(--portal-shadow);
    --operational-heading-weight: 600;
    --operational-heading-spacing: -.035em;
    --operational-heading-case: none;
    --operational-button-weight: 600;
    --operational-label-weight: 500;
    --operational-field-space: .825rem;
}

.portal-operational-warm {
    --operational-main-bg: color-mix(in srgb, var(--portal-surface-muted) 65%, var(--portal-page-bg));
    --operational-card-border: color-mix(in srgb, var(--portal-border) 70%, var(--portal-surface));
    --operational-heading-weight: 500;
    --operational-button-weight: 500;
    --operational-field-space: .875rem;
}

.portal-operational-minimal {
    --operational-content-width: 1200px;
    --operational-page-space: clamp(1.5rem, 4vw, 3.5rem);
    --operational-card-shadow: none;
    --operational-heading-spacing: -.025em;
    --operational-button-weight: 500;
    --operational-field-space: .75rem;
}

.portal-operational-bold {
    --operational-content-width: 1320px;
    --operational-card-border: var(--portal-heading);
    --operational-card-shadow: none;
    --operational-heading-weight: 800;
    --operational-heading-spacing: -.055em;
    --operational-heading-case: uppercase;
    --operational-button-weight: 700;
    --operational-label-weight: 600;
    --operational-field-space: .875rem;
}

.portal-operational-solo {
    --operational-content-width: 1140px;
    --operational-main-bg: color-mix(in srgb, var(--portal-surface-muted) 40%, var(--portal-page-bg));
    --operational-heading-weight: 500;
    --operational-field-space: .875rem;
}

.portal-operational > .portal-operational-main {
    min-width: 0;
    background: var(--operational-main-bg);
}

.portal-operational:not(.portal-embedded) > .portal-operational-main > .container {
    width: calc(100% - max(var(--operational-gutter), env(safe-area-inset-left)) - max(var(--operational-gutter), env(safe-area-inset-right)));
    max-width: var(--operational-content-width);
    padding: var(--operational-page-space) 0;
}

.portal-operational .portal-operational-main h1 {
    font-size: clamp(1.85rem, 3vw, 2.75rem);
    font-weight: var(--operational-heading-weight) !important;
    letter-spacing: var(--operational-heading-spacing);
    line-height: 1.15;
    text-transform: var(--operational-heading-case);
}

.portal-operational .portal-operational-main .portal-page-heading {
    padding-block: .5rem;
}

.portal-operational .portal-operational-main :is(.card, .portal-card) {
    border-color: var(--operational-card-border);
    box-shadow: var(--operational-card-shadow) !important;
}

.portal-operational .portal-operational-main .btn {
    --bs-btn-font-weight: var(--operational-button-weight);
}

.portal-operational .portal-operational-main .form-label {
    font-size: .875em;
    font-weight: var(--operational-label-weight);
}

/* Preserve floating labels and explicit small/large input sizes. */
.portal-operational .portal-operational-main :where(.form-control, .form-select):where(:not(.form-floating > *, .form-control-sm, .form-control-lg, .form-select-sm, .form-select-lg)) {
    padding-block: var(--operational-field-space);
}

.portal-operational-bold .portal-operational-main .portal-page-heading {
    border-bottom: 2px solid var(--portal-heading);
    padding-bottom: 1rem;
}

.portal-operational-solo .portal-operational-main .portal-summary {
    border-top: max(2px, var(--portal-border-width)) solid var(--portal-selection-border);
}

@media (max-width: 575.98px) {
    .portal-operational {
        --operational-gutter: .75rem;
        --operational-page-space: 1rem;
    }

    .portal-operational .portal-operational-main h1 {
        font-size: 1.75rem;
    }

    /* The mobile booking header stays compact above its existing progress strip. */
    .portal-operational .portal-operational-main .booking-wizard .portal-page-heading h1 {
        font-size: 1.25rem;
        line-height: 1.3;
    }
}

/* Small portal utilities retained by the existing booking and account screens. */
.portal-theme .fs-xs { font-size: calc(var(--portal-font-size) * .75) !important; }
.portal-theme .fs-sm { font-size: calc(var(--portal-font-size) * .875) !important; }
.portal-theme .fs-base { font-size: var(--portal-font-size) !important; }
.portal-theme .fs-lg { font-size: calc(var(--portal-font-size) * 1.125) !important; }
.portal-theme .fs-xl { font-size: calc(var(--portal-font-size) * 1.25) !important; }
.portal-theme .card-hover { position: relative; }
.portal-theme .bg-faded-danger { background-color: var(--portal-danger-bg) !important; }
.portal-theme .min-w-0 { min-width: 0; }
.portal-theme .text-truncate-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.portal-theme .w-100px { width: 100px !important; max-width: 100%; }
.portal-theme .w-150px { width: 150px !important; max-width: 100%; }
.portal-theme .w-200px { width: 200px !important; max-width: 100%; }

@media (min-width: 768px) {
    .portal-theme .border-end-md {
        border-inline-end: var(--portal-border-width) solid var(--portal-border) !important;
    }
}

