.reservoir-flow,
.reservoir-account-page,
.reservoir-account-dropdown {
    --reservoir-color-bg: #f6f7fb;
    --reservoir-color-surface: #ffffff;
    --reservoir-color-card-bg: #ffffff;
    --reservoir-color-surface-rgb: 255, 255, 255;
    --reservoir-color-surface-muted: #f2f4f8;
    --reservoir-color-border: #d7dee8;
    --reservoir-color-border-strong: #bcc7d6;
    --reservoir-color-input-focus-border: color-mix(in srgb, var(--reservoir-color-accent) 50%, var(--reservoir-color-border));
    --reservoir-color-input-focus-ring: color-mix(in srgb, var(--reservoir-color-accent) 15%, transparent);
    --reservoir-color-text: #1b2430;
    --reservoir-color-text-rgb: 27, 36, 48;
    --reservoir-color-text-muted: #607086;
    --reservoir-color-accent: #1f6feb;
    --reservoir-color-accent-hover: #1759bc;
    --reservoir-color-accent-contrast: #ffffff;
    --reservoir-color-success: #1f8f5f;
    --reservoir-color-success-rgb: 31, 143, 95;
    --reservoir-color-info-bg: #eaf3ff;
    --reservoir-color-info-text: #0f4f9c;
    --reservoir-color-info-border: #bfd9ff;
    --reservoir-color-danger-bg: #fff0f0;
    --reservoir-color-danger-text: #b42318;
    --reservoir-color-danger-border: #f5c2c7;
    --reservoir-color-warning-bg: #fff6dd;
    --reservoir-color-warning-text: #8a6116;
    --reservoir-color-warning-border: #edd58c;
    --reservoir-color-neutral-bg: #eef2f6;
    --reservoir-color-neutral-text: #516173;
    --reservoir-color-neutral-border: #d7dee8;
    --reservoir-shadow-sm: 0 0.5rem 1rem rgba(15, 23, 42, 0.08);
    --reservoir-shadow-md: 0 1rem 2.5rem rgba(15, 23, 42, 0.12);
    --reservoir-radius-sm: 0.5rem;
    --reservoir-radius-md: 0.75rem;
    --reservoir-radius-lg: 1rem;
    --reservoir-radius-xl: 1.25rem;
    --reservoir-body-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --reservoir-body-font-size: 1rem;
    --reservoir-body-font-weight: 400;
    --reservoir-body-line-height: 1.55;
    --reservoir-heading-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --reservoir-heading-font-weight: 700;
    --reservoir-heading-line-height: 1.25;
    --reservoir-heading-size-lg: 1.75rem;
    --reservoir-heading-size-md: 1.25rem;
    --reservoir-heading-size-sm: 1rem;
    --reservoir-button-border-radius: var(--reservoir-radius-md);
    --reservoir-input-border-radius: var(--reservoir-radius-md);
    --reservoir-shadow: var(--reservoir-shadow-sm);
    --reservoir-surface: var(--reservoir-color-surface);
    --reservoir-surface-rgb: var(--reservoir-color-surface-rgb);
    --reservoir-border: var(--reservoir-color-border);
    --reservoir-border-rgb: 215, 222, 232;
    --reservoir-text: var(--reservoir-color-text);
    --reservoir-text-rgb: var(--reservoir-color-text-rgb);
    --reservoir-muted: var(--reservoir-color-surface-muted);
    --reservoir-accent: var(--reservoir-color-accent);
    --reservoir-accent-hover: var(--reservoir-color-accent-hover);
    --reservoir-success: var(--reservoir-color-success);
    --reservoir-success-rgb: var(--reservoir-color-success-rgb);
    color: var(--reservoir-text);
    font-family: var(--reservoir-body-font-family);
    font-size: var(--reservoir-body-font-size);
    font-weight: var(--reservoir-body-font-weight);
    line-height: var(--reservoir-body-line-height);
}

.reservoir-flow,
.reservoir-account-page {
    background: var(--reservoir-color-bg);
}

.reservoir-flow {
    position: relative;
}

.reservoir-flow__shell {
    position: relative;
}

.reservoir-validation-modal {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}

.reservoir-validation-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.42);
}

.reservoir-validation-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 36rem);
    border: 1px solid var(--reservoir-color-danger-border);
    border-radius: var(--reservoir-radius-xl);
    background: var(--reservoir-color-card-bg);
    box-shadow: var(--reservoir-shadow-md);
}

.reservoir-validation-modal__header,
.reservoir-validation-modal__footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 1.25rem 0;
}

.reservoir-validation-modal__body {
    padding: 1rem 1.25rem;
}

.reservoir-validation-modal__footer {
    padding: 0 1.25rem 1.25rem;
    justify-content: flex-end;
}

.reservoir-validation-modal__title {
    color: var(--reservoir-color-danger-text);
}

.reservoir-validation-modal__lead {
    color: var(--reservoir-color-text-muted);
    font-size: 0.95rem;
}

.reservoir-validation-modal__close {
    border: 0;
    background: transparent;
    color: var(--reservoir-color-text-muted);
    font-size: 1.75rem;
    line-height: 1;
    cursor: pointer;
}

.reservoir-validation-modal__list {
    display: grid;
    gap: 0.75rem;
    padding-left: 1.25rem;
}

.reservoir-validation-modal__list li {
    color: var(--reservoir-color-danger-text);
}

.reservoir-form-field {
    transition: box-shadow 0.18s ease, border-color 0.18s ease, background-color 0.18s ease;
}

.reservoir-form-field.is-invalid {
    padding: 0.85rem;
    border-radius: var(--reservoir-radius-md);
    background: color-mix(in srgb, var(--reservoir-color-danger-bg) 70%, white);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--reservoir-color-danger-border) 58%, transparent);
}

.reservoir-form-field.is-invalid .form-control,
.reservoir-form-field.is-invalid .form-select,
.reservoir-form-field.is-invalid .reservoir-check__label,
.reservoir-form-field.is-invalid .form-check-label {
    border-color: var(--reservoir-color-danger-border);
    color: var(--reservoir-color-danger-text);
}

.reservoir-account-bar {
    display: grid;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-xl);
    background: var(--reservoir-color-card-bg);
    box-shadow: var(--reservoir-shadow);
}

.reservoir-account-bar__guest,
.reservoir-account-bar__authenticated {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.reservoir-account-bar__title {
    font-family: var(--reservoir-heading-font-family);
    font-weight: var(--reservoir-heading-font-weight);
    margin-bottom: 0.15rem;
}

.reservoir-account-bar__text {
    color: color-mix(in srgb, var(--reservoir-text) 78%, white);
    font-size: 0.95rem;
}

.reservoir-account-bar__actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
    align-items: center;
}

.reservoir-account-dropdown__toggle {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.reservoir-account-dropdown__toggle .ph {
    font-size: 1.2rem;
    line-height: 1;
}

.reservoir-header-account {
    display: inline-flex;
    align-items: center;
    line-height: 1;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.reservoir-account-dropdown {
    position: relative;
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.reservoir-account-dropdown__submenu {
    position: absolute;
    top: 100%;
    right: 0;
    max-height: 0;
    overflow: hidden;
    transition: all 0.2s ease-in-out;
    z-index: 1000;
    width: max-content;
}

.reservoir-account-dropdown:hover > .reservoir-account-dropdown__submenu {
    max-height: 480px;
}

.reservoir-account-dropdown__menu {
    min-width: 320px;
    padding: 1rem;
    background: var(--reservoir-surface, #fff);
    border: 1px solid var(--reservoir-border, #d7dee8);
    border-radius: var(--reservoir-radius-md, 0.75rem);
    box-shadow: var(--reservoir-shadow-md, 0 1rem 2.5rem rgba(15, 23, 42, 0.12));
    color: var(--reservoir-text, #1b2430);
}

.reservoir-account-dropdown__content {
    display: grid;
    gap: 0.25rem;
}

.reservoir-account-dropdown__divider {
    margin: 0.9rem 0;
    border-color: var(--reservoir-border);
    opacity: 1;
}

.reservoir-account-dropdown__links {
    display: grid;
    gap: 0.5rem;
}

.reservoir-account-dropdown__link {
    color: var(--reservoir-text);
    text-decoration: none;
}

.reservoir-account-dropdown__link:hover,
.reservoir-account-dropdown__link:focus {
    text-decoration: underline;
}

.reservoir-account-login-form {
    margin-top: 0.25rem;
}

.reservoir-password-field {
    position: relative;
}

.reservoir-password-field .form-control {
    padding-right: 2.75rem;
}

.reservoir-password-field__toggle {
    position: absolute;
    top: 50%;
    right: 0.75rem;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--reservoir-color-text-muted);
    cursor: pointer;
    line-height: 1;
}

.reservoir-password-field__toggle:hover,
.reservoir-password-field__toggle:focus {
    color: var(--reservoir-text);
}

.reservoir-password-field__toggle:focus {
    outline: none;
}

.reservoir-account-dropdown__menu .reservoir-account-bar__text,
.reservoir-account-dropdown__menu .reservoir-account-bar__title,
.reservoir-account-dropdown__menu label {
    color: var(--reservoir-text);
}

.reservoir-flow__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: var(--reservoir-muted);
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.reservoir-flow__title {
    font-family: var(--reservoir-heading-font-family);
    font-weight: var(--reservoir-heading-font-weight);
    line-height: var(--reservoir-heading-line-height);
    font-size: var(--reservoir-heading-size-lg);
}

.reservoir-flow .reservoir-step__title,
.reservoir-account-page .reservoir-step__title,
.reservoir-flow h3.h4,
.reservoir-account-page h3.h4,
.reservoir-flow h3.h5,
.reservoir-account-page h3.h5 {
    font-size: var(--reservoir-heading-size-md);
    line-height: var(--reservoir-heading-line-height);
}

.reservoir-flow h4.h6,
.reservoir-account-page h4.h6 {
    font-size: var(--reservoir-heading-size-sm);
    line-height: var(--reservoir-heading-line-height);
}

.reservoir-flow .btn {
    --bs-btn-font-family: var(--reservoir-body-font-family);
    --bs-btn-font-size: 0.95rem;
    --bs-btn-font-weight: 600;
    --bs-btn-border-radius: var(--reservoir-button-border-radius);
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: 0.7rem;
}

.reservoir-flow .shadow-sm,
.reservoir-account-page .shadow-sm,
.reservoir-account-dropdown .shadow-sm {
    box-shadow: var(--reservoir-shadow-sm) !important;
}

.reservoir-flow .shadow,
.reservoir-account-page .shadow,
.reservoir-account-dropdown .shadow {
    box-shadow: var(--reservoir-shadow-md) !important;
}

.reservoir-flow .btn-primary {
    --bs-btn-color: var(--reservoir-color-accent-contrast);
    --bs-btn-bg: var(--reservoir-accent);
    --bs-btn-border-color: var(--reservoir-accent);
    --bs-btn-hover-color: var(--reservoir-color-accent-contrast);
    --bs-btn-hover-bg: var(--reservoir-accent-hover);
    --bs-btn-hover-border-color: var(--reservoir-accent-hover);
    --bs-btn-active-color: var(--reservoir-color-accent-contrast);
    --bs-btn-active-bg: var(--reservoir-accent-hover);
    --bs-btn-active-border-color: var(--reservoir-accent-hover);
    --bs-btn-disabled-color: var(--reservoir-color-accent-contrast);
    --bs-btn-disabled-bg: color-mix(in srgb, var(--reservoir-accent) 72%, white);
    --bs-btn-disabled-border-color: color-mix(in srgb, var(--reservoir-accent) 72%, white);
}

.reservoir-flow .btn-outline-primary {
    --bs-btn-color: var(--reservoir-accent);
    --bs-btn-border-color: var(--reservoir-accent);
    --bs-btn-hover-color: var(--reservoir-surface);
    --bs-btn-hover-bg: var(--reservoir-accent);
    --bs-btn-hover-border-color: var(--reservoir-accent);
    --bs-btn-active-color: var(--reservoir-surface);
    --bs-btn-active-bg: var(--reservoir-accent);
    --bs-btn-active-border-color: var(--reservoir-accent);
    --bs-btn-disabled-color: var(--reservoir-accent);
    --bs-btn-disabled-border-color: var(--reservoir-accent);
}

.reservoir-flow .btn-outline-secondary {
    --bs-btn-color: var(--reservoir-text);
    --bs-btn-border-color: var(--reservoir-text);
    --bs-btn-hover-color: var(--reservoir-surface);
    --bs-btn-hover-bg: var(--reservoir-text);
    --bs-btn-hover-border-color: var(--reservoir-text);
    --bs-btn-active-color: var(--reservoir-surface);
    --bs-btn-active-bg: var(--reservoir-text);
    --bs-btn-active-border-color: var(--reservoir-text);
    --bs-btn-disabled-color: color-mix(in srgb, var(--reservoir-text) 60%, var(--reservoir-surface));
    --bs-btn-disabled-border-color: color-mix(in srgb, var(--reservoir-text) 60%, var(--reservoir-surface));
}

.reservoir-flow .form-control,
.reservoir-flow .form-select {
    --bs-body-color: var(--reservoir-text);
    --bs-body-bg: var(--reservoir-surface);
    --bs-border-color: var(--reservoir-border);
    --bs-secondary-color: var(--reservoir-color-text-muted);
    --bs-border-radius: var(--reservoir-input-border-radius);
    --bs-border-width: 1px;
    font-family: var(--reservoir-body-font-family);
    font-size: 0.95rem;
}

.reservoir-flow .form-control:focus,
.reservoir-flow .form-select:focus,
.reservoir-account-page .form-control:focus,
.reservoir-account-page .form-select:focus,
.reservoir-account-dropdown .form-control:focus,
.reservoir-account-dropdown .form-select:focus {
    --bs-border-color: var(--reservoir-color-input-focus-border);
    border-color: var(--reservoir-color-input-focus-border);
    box-shadow: 0 0 0 0.2rem var(--reservoir-color-input-focus-ring);
}

.reservoir-flow .text-body-secondary,
.reservoir-flow .small.text-body-secondary {
    color: var(--reservoir-color-text-muted) !important;
}

.reservoir-flow .alert-danger {
    --bs-alert-color: var(--reservoir-color-danger-text);
    --bs-alert-bg: var(--reservoir-color-danger-bg);
    --bs-alert-border-color: var(--reservoir-color-danger-border);
    --bs-alert-link-color: var(--reservoir-color-danger-text);
    border-radius: var(--reservoir-radius-md);
}

.reservoir-flow .alert-success {
    --bs-alert-color: var(--reservoir-color-success);
    --bs-alert-bg: color-mix(in srgb, var(--reservoir-success) 10%, var(--reservoir-surface));
    --bs-alert-border-color: color-mix(in srgb, var(--reservoir-success) 28%, var(--reservoir-border));
    --bs-alert-link-color: var(--reservoir-success);
    border-radius: var(--reservoir-radius-md);
}

.reservoir-flow .alert-info {
    --bs-alert-color: var(--reservoir-color-info-text);
    --bs-alert-bg: var(--reservoir-color-info-bg);
    --bs-alert-border-color: var(--reservoir-color-info-border);
    --bs-alert-link-color: var(--reservoir-color-info-text);
    color: var(--reservoir-color-info-text);
    background: var(--reservoir-color-info-bg);
    border-color: var(--reservoir-color-info-border);
    border-radius: var(--reservoir-radius-md);
}

.reservoir-step {
    border: 1px solid var(--reservoir-border);
    background: var(--reservoir-color-card-bg);
    transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.reservoir-step.is-active {
    border-color: color-mix(in srgb, var(--reservoir-accent) 35%, var(--reservoir-border));
    box-shadow: var(--reservoir-shadow);
}

.reservoir-step__meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.reservoir-step__header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.reservoir-step__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--reservoir-accent) 12%, transparent);
    font-weight: 700;
}

.reservoir-step__label {
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    opacity: 0.7;
}

.reservoir-services {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
    gap: 0.75rem;
}

.reservoir-service {
    width: 100%;
    padding: 0.85rem 1rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-lg);
    background: transparent;
    text-align: left;
    transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.reservoir-service:hover,
.reservoir-service:focus-visible,
.reservoir-slot:hover,
.reservoir-slot:focus-visible {
    border-color: color-mix(in srgb, var(--reservoir-accent-hover) 45%, var(--reservoir-border));
    transform: translateY(-1px);
}

.reservoir-service.is-selected,
.reservoir-slot.is-selected {
    border-color: var(--reservoir-accent);
    background: color-mix(in srgb, var(--reservoir-accent) 10%, var(--reservoir-surface));
}

.reservoir-slot--day-intake {
    border-color: color-mix(in srgb, #f0a500 55%, var(--reservoir-border));
    background: color-mix(in srgb, #f0a500 12%, var(--reservoir-surface));
}

.reservoir-service__name {
    display: block;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.reservoir-service__meta,
.reservoir-service__description {
    display: block;
    font-size: 0.85rem;
    opacity: 0.8;
}

.reservoir-days {
    display: grid;
    gap: 1rem;
}

.reservoir-days__toolbar {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

.reservoir-days__nav {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.reservoir-days__range {
    font-weight: 700;
}

.reservoir-days__grid-wrap {
    overflow-x: auto;
    padding-bottom: 0.25rem;
}

.reservoir-days__grid {
    display: grid;
    grid-template-columns: repeat(var(--reservoir-day-columns, 6), minmax(var(--reservoir-day-min-width, 9rem), 1fr));
    gap: 1rem;
    min-width: 100%;
    width: max-content;
}

.reservoir-days__empty {
    padding: 1rem 1.25rem;
    border: 1px dashed var(--reservoir-border);
    border-radius: var(--reservoir-radius-lg);
    color: color-mix(in srgb, var(--reservoir-text) 72%, white);
}

.reservoir-days__placeholder {
    padding: 1rem 1.25rem;
    border: 1px dashed var(--reservoir-border);
    border-radius: var(--reservoir-radius-lg);
}

.reservoir-days__info {
    white-space: pre-line;
}

.reservoir-day {
    min-width: var(--reservoir-day-min-width, 9rem);
    min-inline-size: 0;
    display: grid;
    gap: 0.75rem;
    align-content: start;
}

.reservoir-day__header {
    padding: 1rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-lg);
    background: var(--reservoir-color-card-bg);
}

.reservoir-day__date {
    font-weight: 700;
    text-transform: capitalize;
}

.reservoir-day__meta {
    margin-top: 0.25rem;
    font-size: 0.9rem;
    opacity: 0.75;
    overflow-wrap: anywhere;
}

.reservoir-day__slots {
    display: grid;
    gap: 0.75rem;
}

.reservoir-day__empty {
    padding: 0.9rem 1rem;
    border-radius: var(--reservoir-radius-md);
    border: 1px dashed var(--reservoir-border);
    font-size: 0.95rem;
    opacity: 0.8;
    overflow-wrap: anywhere;
}

.reservoir-slot {
    padding: 0.9rem 0.75rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-md);
    background: transparent;
    font-weight: 600;
    width: 100%;
}

.reservoir-hold {
    padding: 0.85rem 1rem;
    margin-bottom: 1.5rem;
    border-radius: var(--reservoir-radius-md);
    background: color-mix(in srgb, var(--reservoir-accent) 8%, var(--reservoir-surface));
    border: 1px solid color-mix(in srgb, var(--reservoir-accent) 20%, var(--reservoir-border));
}

.reservoir-form__identity,
.reservoir-custom-fields__body,
.reservoir-account-panel,
.reservoir-account__login {
    padding: 1rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-md);
    background: var(--reservoir-color-card-bg);
    box-shadow: var(--reservoir-shadow-sm);
}

.reservoir-account__login-note {
    margin-top: 0;
}

.reservoir-account__status {
    margin-bottom: 0;
}

.reservoir-custom-field__info {
    padding: 0.9rem 1rem;
    border-radius: var(--reservoir-radius-md);
    background: color-mix(in srgb, var(--reservoir-accent) 5%, var(--reservoir-surface));
    border: 1px solid var(--reservoir-border);
    font-size: 0.95rem;
}

.reservoir-check {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
}

.reservoir-check__input {
    margin: 0.2rem 0 0;
    flex: 0 0 auto;
    inline-size: 1.1rem;
    block-size: 1.1rem;
    cursor: pointer;
    accent-color: var(--reservoir-accent);
    -webkit-appearance: checkbox;
    appearance: auto;
}

.reservoir-check__label {
    cursor: pointer;
    line-height: 1.45;
}

.reservoir-check__input:focus {
    outline: 2px solid color-mix(in srgb, var(--reservoir-accent) 35%, transparent);
    outline-offset: 2px;
}

.reservoir-confirmation__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    color: var(--reservoir-success);
    background: rgba(var(--reservoir-success-rgb), 0.12);
    border: 1px solid rgba(var(--reservoir-success-rgb), 0.28);
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.reservoir-confirmation__summary {
    display: grid;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-lg);
    background: var(--reservoir-color-card-bg);
    box-shadow: var(--reservoir-shadow-sm);
}

.reservoir-confirmation__line {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.reservoir-confirmation__label {
    opacity: 0.75;
}

.reservoir-account-page__empty,
.reservoir-account-page__loading,
.reservoir-account-card {
    padding: 1rem 1.25rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-lg);
    background: var(--reservoir-color-card-bg);
    box-shadow: var(--reservoir-shadow-sm);
}

.reservoir-account-page__loading {
    text-align: center;
    color: var(--reservoir-color-text-muted);
}

.reservoir-account-page__list {
    display: grid;
    gap: 1rem;
}

.reservoir-account-panel {
    padding: 1rem 1.25rem;
    border: 1px solid var(--reservoir-border);
    border-radius: var(--reservoir-radius-lg);
    background: var(--reservoir-color-card-bg);
    box-shadow: var(--reservoir-shadow-sm);
}

.reservoir-account-page__filters .btn.is-active {
    color: var(--reservoir-color-accent-contrast);
    background: var(--reservoir-accent);
    border-color: var(--reservoir-accent);
}

.reservoir-account-card {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
}

.reservoir-account-card__meta {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.reservoir-account-card__code {
    font-weight: 700;
}

.reservoir-account-card__status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.55rem;
    border-radius: var(--reservoir-radius-sm);
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid transparent;
    background: var(--reservoir-color-neutral-bg);
    color: var(--reservoir-color-neutral-text);
    border-color: var(--reservoir-color-neutral-border);
}

.reservoir-account-card__status.is-confirmed {
    background: var(--reservoir-color-info-bg);
    color: var(--reservoir-color-info-text);
    border-color: var(--reservoir-color-info-border);
}

.reservoir-account-card__status.is-cancelled {
    background: var(--reservoir-color-danger-bg);
    color: var(--reservoir-color-danger-text);
    border-color: var(--reservoir-color-danger-border);
}

.reservoir-account-card__status.is-completed {
    background: color-mix(in srgb, var(--reservoir-success) 12%, var(--reservoir-surface));
    color: var(--reservoir-success);
    border-color: color-mix(in srgb, var(--reservoir-success) 28%, var(--reservoir-border));
}

.reservoir-account-card__status.is-hold,
.reservoir-account-card__status.is-no_show {
    background: var(--reservoir-color-warning-bg);
    color: var(--reservoir-color-warning-text);
    border-color: var(--reservoir-color-warning-border);
}

@media (max-width: 767.98px) {
    .reservoir-account-bar__guest,
    .reservoir-account-bar__authenticated,
    .reservoir-account-bar__actions {
        align-items: stretch;
    }

    .reservoir-account-bar__actions > * {
        flex: 1 1 100%;
    }

    .reservoir-step__header {
        flex-direction: column;
    }

    .reservoir-days__toolbar {
        align-items: stretch;
    }

    .reservoir-days__nav {
        width: 100%;
    }

    .reservoir-days__nav .btn,
    .reservoir-days__toolbar > .btn {
        width: 100%;
    }

    .reservoir-account-card {
        flex-direction: column;
    }
}