/* Customer account pages: sign in, register, password, my bookings. */
@layer pages {
    .auth-page { max-width: 520px; margin-inline: auto; }
    .auth-links { margin-top: var(--space-5); font-size: var(--text-sm); color: var(--color-text-muted); }
    .auth-links a { color: var(--color-link); text-decoration: underline; }
    .account-menu { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); margin: calc(-1 * var(--space-2)) 0 var(--space-5); padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-border); }
    .account-menu a, .link-button { padding: 0; border: 0; background: none; color: var(--color-text-muted); font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; }
    .account-menu a:hover { color: var(--color-primary); }
    .account-menu a.is-active { color: var(--color-primary); }
    .link-button { color: var(--color-link); font-weight: 400; text-decoration: underline; }
    .account-bookings { display: grid; gap: var(--space-2); }
    .account-booking { display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-4); border: 1.5px solid var(--color-border); border-radius: var(--radius); background: var(--color-surface); color: inherit; text-decoration: none; transition: border-color 0.15s, box-shadow 0.15s; }
    .account-booking:hover { border-color: var(--color-primary); box-shadow: var(--shadow-sm); }
    .account-booking span { display: grid; gap: .15rem; }
    .account-booking small { color: var(--color-text-muted); }
    .account-booking-side { text-align: right; }
    .account-bookings + .account-bookings, .checkout + .checkout, .results-notice + .checkout { margin-top: var(--space-5); }
}