*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--brand-primary:var(--vx-brand-primary,#f16a87);--brand-accent:var(--vx-brand-accent,#f16a87);--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--radius:8px;--success:#16a34a;--danger:#dc2626}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:var(--gray-800);background:var(--gray-50);line-height:1.6}
a{color:var(--brand-primary);text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 28px}

.booking-header{background:#fff;border-bottom:1px solid var(--gray-200);padding:1rem 0}
.booking-brand{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;width:100%}
.booking-logo{height:48px;border-radius:8px}
.booking-brand h1{font-size:1.25rem;font-weight:700;color:var(--gray-900)}
.booking-location-bar{width:100%;background:#f8f8f8;border-bottom:1px solid #e8e8e8;padding:.5rem 0}
.booking-location-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .75rem .3rem .55rem;background:#fff;border:1px solid color-mix(in srgb,var(--brand-primary) 30%,transparent);border-radius:999px;font-size:.8rem;font-weight:500;color:var(--brand-primary);white-space:nowrap}
.booking-location-badge svg{flex-shrink:0}
.booking-location-change{margin-left:.5rem;padding:.1rem .5rem;background:var(--brand-accent);color:#fff;border-radius:999px;font-size:.72rem;font-weight:600;text-decoration:none;transition:opacity .15s}
.booking-location-change:hover{opacity:.85}

.booking-main{padding:2rem 0 4rem}
.step-indicator{display:flex;gap:.5rem;margin-bottom:2rem;flex-wrap:wrap}
.step{padding:.5rem 1rem;border-radius:9999px;font-size:.8rem;font-weight:500;background:var(--gray-100);color:var(--gray-500);transition:all .2s}
.step.active{background:var(--brand-primary);color:#fff}
.step.completed{background:var(--brand-accent);color:#fff}
.step-num{font-weight:700;margin-right:.25rem}

.step-content{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.step-content h2{font-size:1.25rem;font-weight:600;margin-bottom:1.5rem;color:var(--gray-900)}
.hidden{display:none}

.service-category h3{font-size:1rem;font-weight:600;margin:1.5rem 0 .75rem;color:var(--gray-700)}
.service-option{display:flex;justify-content:space-between;align-items:center;padding:1rem;border:2px solid var(--gray-200);border-radius:var(--radius);margin-bottom:.75rem;cursor:pointer;transition:all .15s}
.service-option:hover{border-color:var(--brand-primary);background:color-mix(in srgb,var(--brand-primary) 5%,#fff)}
.service-option.selected{border-color:var(--brand-primary);background:color-mix(in srgb,var(--brand-primary) 8%,#fff)}
.service-info h4{font-size:.95rem;font-weight:600;color:var(--gray-900)}
.service-info p{font-size:.8rem;color:var(--gray-500);margin-top:.25rem}
.service-meta{text-align:right;flex-shrink:0}
.service-duration{display:block;font-size:.8rem;color:var(--gray-500)}
.service-price{display:block;font-size:1.1rem;font-weight:700;color:var(--gray-900)}

.staff-option{display:flex;align-items:center;gap:1rem;padding:1rem;border:2px solid var(--gray-200);border-radius:var(--radius);margin-bottom:.75rem;cursor:pointer;transition:all .15s}
.staff-option:hover{border-color:var(--brand-primary)}
.staff-option.selected{border-color:var(--brand-primary);background:color-mix(in srgb,var(--brand-primary) 8%,#fff)}
.staff-avatar{width:48px;height:48px;border-radius:50%;background:var(--brand-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.25rem;flex-shrink:0}
.staff-info h4{font-size:.95rem;font-weight:600}
.staff-info p{font-size:.8rem;color:var(--gray-500)}

/* "Select Professional" step (Fresha-style mode picker + per-service dropdowns) */
.staff-mode-helper{color:var(--gray-500);margin:.25rem 0 1rem;font-size:.9rem}
.staff-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1rem}
@media(max-width:600px){.staff-mode-grid{grid-template-columns:1fr}}
.staff-mode-card{position:relative;display:flex;align-items:center;gap:.85rem;padding:1rem 1.1rem;border:2px solid var(--gray-200);border-radius:var(--radius);background:#fff;cursor:pointer;text-align:left;transition:all .15s;font:inherit;color:inherit}
.staff-mode-card:hover{border-color:var(--brand-primary)}
.staff-mode-card.is-selected{border-color:var(--brand-primary);background:color-mix(in srgb,var(--brand-primary) 8%,#fff)}
.vx-checkout-section{padding:1.1rem 1.25rem;background:#fff;border:1px solid #f0f0f0;border-radius:14px;margin-bottom:.85rem}
.vx-checkout-section-label{font-weight:600;font-size:.92rem;color:#111;margin-bottom:.65rem}
.vx-checkout-optional{font-weight:400;font-size:.8rem;color:#9ca3af;margin-left:.35rem}
.vx-tip-chip{transition:background .15s,border-color .15s,color .15s,box-shadow .15s}
.vx-tip-chip.is-selected{background:var(--brand-accent,#f16a87);border-color:var(--brand-accent,#f16a87);color:var(--brand-accent-text,#fff);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-accent,#f16a87) 22%,transparent);font-weight:600}
.vx-tip-chip.is-selected:hover{background:var(--brand-accent,#f16a87);color:var(--brand-accent-text,#fff)}
.staff-mode-icon{width:44px;height:44px;border-radius:50%;background:color-mix(in srgb,var(--brand-primary) 12%,#fff);color:var(--brand-primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.staff-mode-body{flex:1;min-width:0}
.staff-mode-title{font-weight:600;font-size:.95rem;color:var(--gray-900);margin-bottom:.15rem}
.staff-mode-desc{font-size:.8rem;color:var(--gray-500);line-height:1.35}
.staff-mode-check{width:24px;height:24px;border-radius:50%;background:var(--brand-primary);color:#fff;display:none;align-items:center;justify-content:center;font-size:.85rem;font-weight:700;flex-shrink:0}
.staff-mode-card.is-selected .staff-mode-check{display:inline-flex}
.staff-per-service{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1rem}
.staff-service-row{display:flex;align-items:center;gap:.75rem;padding:.75rem .9rem;border:1px solid var(--gray-200);border-radius:var(--radius);background:#fafafb}
.staff-service-row-label{flex:1;min-width:0}
.staff-service-row-name{font-weight:600;font-size:.9rem;color:var(--gray-900);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.staff-service-row-meta{font-size:.75rem;color:var(--gray-500);margin-top:.1rem}
.staff-service-row-select{flex:0 0 210px;max-width:210px}
@media(max-width:600px){.staff-service-row{flex-direction:column;align-items:stretch}.staff-service-row-select{flex:0 0 auto;max-width:none;width:100%}}
.vx-select-wrap{position:relative}
.vx-select-wrap::after{content:'';pointer-events:none;position:absolute;right:1rem;top:50%;width:7px;height:7px;transform:translateY(-70%) rotate(45deg);border-right:2px solid var(--brand-primary,#f16a87);border-bottom:2px solid var(--brand-primary,#f16a87)}
.vx-select{appearance:none;-webkit-appearance:none;width:100%;padding:.65rem 2.5rem .65rem 1rem;border:1.5px solid var(--brand-primary,#f16a87);border-radius:var(--radius);background:#fff;font:inherit;font-size:.875rem;font-weight:500;color:var(--gray-900);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.vx-select:hover{opacity:.85}
.vx-select:focus{outline:none;box-shadow:0 0 0 3px rgba(0,0,0,.08)}
.staff-mode-error{padding:.6rem .8rem;border-radius:var(--radius);background:#fef2f2;color:#b91c1c;font-size:.85rem;margin-bottom:1rem}
.summary-staff-line{display:block;font-size:.78rem;color:var(--gray-500);margin-top:.15rem}

.datetime-picker{display:flex;flex-direction:column;gap:1.5rem}
.form-label{display:block;font-weight:500;font-size:.875rem;color:var(--gray-700);margin-bottom:.5rem}
.date-selector .form-input{width:100%;padding:.75rem;font-size:1rem}

.date-strip-card{background:#fff;border:1px solid var(--gray-200);border-radius:14px;padding:1.25rem 1.25rem 1rem;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.date-strip-header{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem}
.date-strip-eyebrow{font-size:.85rem;font-weight:600;color:var(--brand-primary);letter-spacing:.02em}
.date-strip-month{font-size:1.35rem;font-weight:700;color:var(--gray-900);margin-top:.15rem}
.date-strip-controls{display:flex;gap:.5rem;align-items:center}
.date-strip-nav,.date-strip-toggle{width:36px;height:36px;border-radius:50%;border:none;background:var(--gray-100);color:var(--gray-700);font-size:1.1rem;line-height:1;cursor:pointer;transition:background .15s,color .15s;display:inline-flex;align-items:center;justify-content:center}
.date-strip-nav:hover,.date-strip-toggle:hover{background:var(--gray-200)}
.date-strip-nav-primary{background:var(--brand-primary);color:#fff}
.date-strip-nav-primary:hover{background:var(--brand-primary);opacity:.9}
.date-strip-nav:disabled{opacity:.4;cursor:not-allowed}
.date-strip-divider{height:1px;background:var(--gray-200);margin:.85rem 0 1rem}
.date-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:.5rem}
.date-strip-day{background:var(--gray-100);border:none;border-radius:10px;padding:.75rem .25rem;cursor:pointer;text-align:center;transition:all .15s;display:flex;flex-direction:column;gap:.25rem;color:var(--gray-700);font-family:inherit}
.date-strip-day:hover:not(:disabled){background:var(--gray-200)}
.date-strip-day:disabled{opacity:.45;cursor:not-allowed}
/* Days the chosen stylist is unavailable — visually blanked out so customers
   can see at a glance which days they cannot pick. */
.date-strip-day.is-unavailable{position:relative;background:repeating-linear-gradient(135deg,#f3f4f6 0 6px,#e5e7eb 6px 12px);color:#9ca3af;opacity:.65}
.date-strip-day.is-unavailable .dow,.date-strip-day.is-unavailable .dom{color:#9ca3af;text-decoration:line-through;text-decoration-color:rgba(156,163,175,.7);text-decoration-thickness:1.5px}
.date-strip-day.is-unavailable:hover{background:repeating-linear-gradient(135deg,#f3f4f6 0 6px,#e5e7eb 6px 12px)}
.date-strip-day .dow{font-size:.7rem;font-weight:600;letter-spacing:.05em;color:var(--gray-500);text-transform:uppercase}
.date-strip-day .dom{font-size:1.15rem;font-weight:700;color:var(--gray-900)}
.date-strip-day.selected{background:var(--brand-primary);color:#fff}
.date-strip-day.selected .dow,.date-strip-day.selected .dom{color:#fff}
.date-calendar-fallback{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--gray-200)}
.vx-sr-input{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.vx-cal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem}
.vx-cal-month{font-weight:700;font-size:1rem;color:var(--gray-900)}
.vx-cal-nav{width:32px;height:32px;border-radius:50%;border:none;background:var(--gray-100);color:var(--gray-700);font-size:1rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .15s;font-family:inherit}
.vx-cal-nav:hover:not(:disabled){background:var(--gray-200)}
.vx-cal-nav:disabled{opacity:.4;cursor:not-allowed}
.vx-cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:.72rem;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.03em;margin-bottom:.35rem}
.vx-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.2rem;grid-auto-rows:36px}
.vx-cal-day{height:36px;width:100%;border:none;border-radius:8px;background:transparent;color:var(--gray-800);font-size:.85rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s;font-family:inherit}
.vx-cal-day:hover:not(:disabled):not(.is-selected){background:var(--gray-100)}
.vx-cal-day:disabled{opacity:.35;cursor:not-allowed}
.vx-cal-day.is-outside{visibility:hidden;pointer-events:none}
.vx-cal-day.is-today:not(.is-selected){box-shadow:inset 0 0 0 1.5px var(--brand-primary)}
.vx-cal-day.is-unavailable{color:#9ca3af;text-decoration:line-through;text-decoration-color:rgba(156,163,175,.7)}
.vx-cal-day.is-selected{background:var(--brand-accent);color:#fff;font-weight:700;opacity:1;text-decoration:none}
.hidden{display:none}
@media(max-width:480px){
    .date-strip{grid-template-columns:repeat(5,1fr)}
    .date-strip-day:nth-child(n+6){display:none}
    .date-strip-month{font-size:1.15rem}
}

.time-slots-wrap{min-height:120px}
.time-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem}
.time-slots > p{grid-column:1 / -1;margin:0}
@media(max-width:600px){.time-slots{grid-template-columns:repeat(3,1fr)}}
.time-slot{padding:.5rem;text-align:center;border:1px solid var(--gray-200);border-radius:var(--radius);cursor:pointer;font-size:.85rem;transition:all .15s}
.time-slot:hover{border-color:var(--brand-primary);background:color-mix(in srgb,var(--brand-primary) 8%,#fff)}
.time-slot.selected{background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}

.form-input{width:100%;padding:.5rem .75rem;border:1px solid var(--gray-300);border-radius:var(--radius);font-size:.9rem;transition:border-color .15s}
input[type="date"]{accent-color:var(--brand-accent)}
.form-input:focus{outline:none;border-color:var(--brand-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-primary) 20%,transparent)}
.form-input.input-error{border-color:var(--danger)}
.form-group{margin-bottom:1rem}
.form-group label{display:block;font-weight:500;margin-bottom:.25rem;color:var(--gray-700);font-size:.875rem}
.required{color:var(--danger)}
.field-error{color:var(--danger);font-size:.8rem;margin-top:.25rem}

.step-nav{display:flex;justify-content:space-between;align-items:center;margin-top:1.5rem;gap:1rem}

.btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;border-radius:var(--radius);font-weight:500;font-size:.875rem;border:none;cursor:pointer;transition:all .15s;text-decoration:none}
.btn-primary{background:var(--brand-accent);color:#fff}.btn-primary:hover{opacity:.9}
.btn-outline{background:transparent;color:var(--gray-700);border:1px solid var(--gray-300)}.btn-outline:hover{border-color:var(--gray-500)}
.btn-lg{padding:.75rem 1.5rem;font-size:1rem}
.btn-full{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}

.booking-summary{padding:1.5rem;background:var(--gray-50);border-radius:var(--radius);margin-bottom:1.5rem}
.summary-row{display:flex;justify-content:space-between;padding:.375rem 0;font-size:.9rem}
.summary-row.total{font-weight:700;font-size:1.1rem;border-top:2px solid var(--gray-200);padding-top:.75rem;margin-top:.5rem}
.summary-row.fee-row{color:var(--gray-500);font-size:.85rem}
.summary-row.discount-row{color:#047857;font-weight:600}
.summary-row.balance-row{position:relative;isolation:isolate;margin-top:.6rem;padding:.55rem .7rem;border:1.5px solid var(--brand-primary,#f16a87);border-radius:8px;font-size:.88rem;color:#1c1917;font-weight:600}
.summary-row.balance-row::before{content:'';position:absolute;inset:0;background:var(--brand-primary,#f16a87);opacity:.13;z-index:-1;pointer-events:none;border-radius:6px}
.summary-divider{border-top:1px solid var(--gray-200);margin:.5rem 0}
.ref-code{font-family:monospace;font-size:.85rem;background:var(--gray-100);padding:.125rem .5rem;border-radius:4px}

.stripe-container{margin-bottom:1.5rem;padding:1rem;background:var(--gray-50);border-radius:var(--radius)}

/* Card-on-file mandate disclosure — brand-tinted, always-readable */
.card-on-file-mandate{position:relative;isolation:isolate;margin-top:1rem;padding:14px 16px;border:1.5px solid var(--brand-primary,#f16a87);border-radius:8px}
.card-on-file-mandate::before{content:'';position:absolute;inset:0;background:var(--brand-primary,#f16a87);opacity:.1;z-index:-1;pointer-events:none;border-radius:6px}
.card-on-file-mandate p,.card-on-file-mandate label,.card-on-file-mandate details summary,.card-on-file-mandate details div{color:#1c1917}
.card-on-file-mandate p:first-of-type{margin:0 0 .5rem;font-weight:600;font-size:.95rem}

/* Saved-card chip (shown when card already on file) */
.saved-card-chip{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;position:relative;isolation:isolate;border:1.5px solid var(--brand-accent,#f16a87);border-radius:8px;gap:.75rem;margin-bottom:1rem}
.saved-card-chip::before{content:'';position:absolute;inset:0;background:var(--brand-accent,#f16a87);opacity:.1;z-index:-1;pointer-events:none;border-radius:6px}
.saved-card-chip-inner{display:flex;align-items:center;gap:.5rem;font-size:.93rem;color:#1c1917;font-weight:600}
.payment-message{color:var(--danger);font-size:.85rem;margin-top:.75rem}
.no-payment-msg{padding:1rem;background:#fef3c7;border-radius:var(--radius);margin-bottom:1rem;font-size:.9rem;color:#92400e}

.confirmation-page{text-align:center;padding:2rem 0}
.confirmation-icon{width:80px;height:80px;border-radius:50%;background:color-mix(in srgb,var(--brand-primary) 15%,#fff);color:var(--brand-primary);display:flex;align-items:center;justify-content:center;font-size:2.5rem;margin:0 auto 1.5rem;font-weight:700}
.confirmation-subtitle{color:var(--gray-500);margin-bottom:2rem}
.confirmation-details{text-align:left;max-width:400px;margin:0 auto 2rem;background:var(--gray-50);border-radius:var(--radius);padding:1.5rem}
.conf-row{display:flex;justify-content:space-between;padding:.375rem 0;font-size:.9rem}
.conf-row+.conf-row{border-top:1px solid var(--gray-100)}
.conf-status{margin-top:.75rem;padding:.75rem;background:var(--brand-primary);border-radius:var(--radius);color:var(--brand-primary-text,#fff);font-size:.9rem;text-align:center;font-weight:500}
.confirmation-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

.booking-footer{padding:1rem 0;text-align:center;font-size:.8rem;color:var(--gray-500)}
.booking-footer a{color:var(--gray-500)}

.text-muted{color:var(--gray-500)}

/* Prominent calendar status banner shown above the date strip when the
   customer's pick was snapped to the next open day, or when the calendar
   is empty. Replaces the old faded grey one-liner. */
.bk-cal-note{display:flex;align-items:flex-start;gap:.6rem;margin-top:.85rem;padding:.7rem .85rem;border-radius:10px;border:1px solid;font-size:.92rem;line-height:1.35;font-weight:500}
.bk-cal-note .bk-cal-note-icon{flex:0 0 18px;width:18px;height:18px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;line-height:1;color:#fff;margin-top:1px}
.bk-cal-note .bk-cal-note-text{flex:1;min-width:0}
.bk-cal-note-info{background:color-mix(in srgb,var(--brand-accent) 8%,#fff);border-color:color-mix(in srgb,var(--brand-accent) 35%,#e5e7eb);color:color-mix(in srgb,var(--brand-accent) 75%,#111827)}
.bk-cal-note-info .bk-cal-note-icon{background:var(--brand-accent)}
.bk-cal-note-info .bk-cal-note-icon::before{content:"i"}
.bk-cal-note-warn{background:#fffbeb;border-color:#fcd34d;color:#92400e}
.bk-cal-note-warn .bk-cal-note-icon{background:#f59e0b}
.bk-cal-note-warn .bk-cal-note-icon::before{content:"!"}
.bk-cal-note-error{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.bk-cal-note-error .bk-cal-note-icon{background:#ef4444}
.bk-cal-note-error .bk-cal-note-icon::before{content:"!"}

/* Customer account banner + marketing checkbox on booking step 4 */
.booking-account-banner{background:color-mix(in srgb,var(--brand-primary) 8%,#fff);border:1px solid color-mix(in srgb,var(--brand-primary) 35%,#e5e7eb);color:color-mix(in srgb,var(--brand-primary) 75%,#111827);border-radius:10px;padding:.75rem 1rem;font-size:.9rem;margin-bottom:1rem}
.booking-account-banner strong{color:color-mix(in srgb,var(--brand-primary) 85%,#000)}
.booking-account-banner .link-btn{background:none;border:0;color:var(--brand-primary);font-weight:600;cursor:pointer;padding:0;font:inherit;text-decoration:underline}
.check-label{display:flex;gap:.6rem;align-items:flex-start;font-size:.88rem;color:var(--gray-700);font-weight:400;line-height:1.45}
.check-label a{color:var(--brand-primary)}
.check-label input[type="checkbox"]{appearance:none;-webkit-appearance:none;flex-shrink:0;width:18px;height:18px;margin-top:.15rem;border:2px solid var(--brand-checkbox,#374151);border-radius:4px;background:#fff;cursor:pointer;position:relative;transition:background .15s,border-color .15s}
.check-label input[type="checkbox"]:checked{background:var(--brand-checkbox,#374151);border-color:var(--brand-checkbox,#374151)}
.check-label input[type="checkbox"]:checked::after{content:'';position:absolute;left:4px;top:1px;width:5px;height:9px;border:2px solid #fff;border-top:none;border-left:none;transform:rotate(45deg)}
.check-label input[type="checkbox"]:focus-visible{outline:2px solid var(--brand-checkbox,#374151);outline-offset:2px}
.form-input[readonly]{background:#f3f4f6;color:#374151;cursor:default}

/* Auth modal (Fresha-style log in / sign up at booking step) */
.auth-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.auth-modal.hidden { display: none; }
.auth-modal-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.55); backdrop-filter: blur(2px); }
.auth-modal-card { position: relative; background: #fff; border-radius: 20px; width: 100%; max-width: 460px; padding: 32px; box-shadow: 0 30px 80px rgba(15, 23, 42, 0.25); max-height: 92vh; overflow-y: auto; }
.auth-modal-close { position: absolute; top: 14px; right: 16px; background: none; border: 0; font-size: 28px; line-height: 1; color: #64748b; cursor: pointer; padding: 4px 10px; border-radius: 999px; }
.auth-modal-close:hover { background: #f1f5f9; color: #1e2339; }
.auth-modal-card h2 { margin: 0 0 6px; font-size: 24px; font-weight: 700; color: #1e2339; }
.auth-modal-subtitle { margin: 0 0 20px; color: #475569; font-size: 14px; }
.auth-tabs { display: flex; gap: 4px; padding: 4px; background: #f1f5f9; border-radius: 12px; margin-bottom: 18px; }
.auth-tab { flex: 1; padding: 10px 12px; background: transparent; border: 0; border-radius: 9px; font-weight: 600; font-size: 14px; color: #475569; cursor: pointer; transition: background 0.15s, color 0.15s; }
.auth-tab.active { background: var(--brand-primary); color: #fff; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08); }
.auth-form .btn-primary { background: var(--brand-primary); }
.auth-form { display: flex; flex-direction: column; gap: 14px; }
.auth-form.hidden { display: none; }
.auth-form label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600; color: #334155; }
.auth-form label > span { font-size: 13px; }
.auth-form input[type="email"],
.auth-form input[type="text"],
.auth-form input[type="tel"],
.auth-form input[type="password"] {
    padding: 12px 14px; border: 1px solid #cbd5e1; border-radius: 10px; font-size: 15px; font-family: inherit; background: #fff;
}
.auth-form input:focus { outline: none; border-color: var(--brand-primary); box-shadow: 0 0 0 3px color-mix(in srgb,var(--brand-primary) 20%,transparent); }
.auth-check { flex-direction: row !important; align-items: flex-start; gap: 10px !important; font-weight: 500 !important; color: #475569 !important; font-size: 13px !important; }
.auth-check input { margin-top: 2px; }
.auth-check span { font-weight: 500; }
.auth-helper { margin: 4px 0 0; text-align: center; font-size: 13px; }
.auth-helper a { color: var(--brand-primary); text-decoration: none; }
.auth-helper a:hover { text-decoration: underline; }
.auth-error { background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; padding: 10px 12px; border-radius: 10px; font-size: 13px; margin-bottom: 14px; }
.auth-error.hidden { display: none; }
.booking-account-banner.hidden { display: none; }
@media (max-width: 480px) {
    .auth-modal-card { padding: 24px 20px; border-radius: 16px; }
    .auth-modal-card h2 { font-size: 20px; }
}

/* Payment choice block on step 4 */
.payment-choice { margin: 1.5rem 0 .5rem; }
.payment-choice-title { font-weight: 600; font-size: .95rem; color: #111827; margin-bottom: .75rem; }
.payment-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
@media (max-width: 600px) { .payment-choice-grid { grid-template-columns: 1fr; } }
.payment-choice-option {
    display: flex; align-items: flex-start; gap: .75rem;
    padding: 1rem; border: 1.5px solid #e5e7eb; border-radius: 12px;
    cursor: pointer; background: #fff; transition: all .15s ease;
    position: relative;
}
.payment-choice-option:hover { border-color: color-mix(in srgb, var(--brand-primary) 35%, #e5e7eb); background: color-mix(in srgb, var(--brand-primary) 4%, #fff); }
.payment-choice-option.is-selected { border-color: var(--brand-primary); background: color-mix(in srgb, var(--brand-primary) 8%, #fff); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-primary) 18%, transparent); }
.payment-choice-option input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.payment-choice-icon {
    flex: 0 0 40px; width: 40px; height: 40px; border-radius: 10px;
    background: #f3f4f6; color: #6b7280;
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .15s ease;
}
.payment-choice-option.is-selected .payment-choice-icon { background: var(--brand-primary); color: #fff; }
.payment-choice-body { display: flex; flex-direction: column; gap: .2rem; flex: 1; min-width: 0; }
.payment-choice-label { font-weight: 600; font-size: .95rem; color: #111827; line-height: 1.2; }
.payment-choice-desc { font-size: .82rem; color: #6b7280; line-height: 1.35; }

.booking-error-banner {
    display: flex; align-items: flex-start; gap: .65rem;
    padding: .85rem 1rem; margin: 0 0 1rem;
    background: #fef2f2; border: 1px solid #fecaca; border-radius: 10px;
    color: #991b1b; font-size: .9rem; line-height: 1.4;
    transition: opacity .35s ease;
}
.booking-error-banner--fade { opacity: 0; }
.booking-error-icon {
    flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%;
    background: #dc2626; color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: .8rem;
}

/* Multi-service selection (step 1) */
.services-helper{font-size:.85rem;color:var(--gray-500);margin:-1rem 0 1.25rem}
.service-option{position:relative;padding-right:3rem}
.service-option::before{content:"";position:absolute;right:1rem;top:50%;transform:translateY(-50%);width:22px;height:22px;border:2px solid var(--gray-300);border-radius:6px;background:#fff;transition:all .15s}
.service-option.selected::before{background:var(--brand-primary);border-color:var(--brand-primary)}
.service-option.selected::after{content:"";position:absolute;right:1.45rem;top:50%;transform:translateY(-58%) rotate(45deg);width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0}
.services-cart{position:sticky;bottom:.75rem;margin-top:1.5rem;background:#fff;border:1px solid var(--gray-200);border-radius:14px;padding:1rem 1.1rem;box-shadow:0 8px 24px rgba(15,23,42,.08);display:flex;flex-direction:column;gap:.85rem;z-index:5}
.services-cart-list{display:flex;flex-direction:column;gap:.4rem}
.services-cart-row{display:flex;justify-content:space-between;align-items:center;gap:.75rem;font-size:.9rem;color:var(--gray-700)}
.services-cart-name{font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.services-cart-meta{display:flex;align-items:center;gap:.85rem;color:var(--gray-500);font-size:.85rem;flex-shrink:0}
.services-cart-meta>span{white-space:nowrap}
.services-cart-remove{border:none;background:transparent;color:var(--gray-400);font-size:1.15rem;line-height:1;cursor:pointer;padding:0 .25rem;border-radius:6px}
.services-cart-remove:hover{background:var(--gray-100);color:var(--gray-700)}
.services-cart-foot{display:flex;justify-content:space-between;align-items:center;gap:.75rem;border-top:1px dashed var(--gray-200);padding-top:.85rem}
.services-cart-totals{display:flex;flex-direction:column;line-height:1.15}
.services-cart-duration{font-size:.78rem;color:var(--gray-500);text-transform:uppercase;letter-spacing:.04em}
.services-cart-price{font-size:1.25rem;font-weight:700;color:var(--gray-900)}
.summary-row-stack{align-items:flex-start}
.summary-services-list{display:flex;flex-direction:column;gap:.25rem;text-align:right}
.summary-service-line{display:block}
.summary-service-meta{color:var(--gray-500);font-size:.8rem}
.conf-services-list{display:flex;flex-direction:column;gap:.2rem;text-align:right}
.conf-service-line{display:block}
