/* VetConnect — appointment booking experience */
.booking-hero{background:var(--color-blue-pale);padding:24px 0 34px;border-bottom:1px solid var(--color-border)}
.booking-back{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--color-border);border-radius:12px;padding:10px 15px;color:var(--color-ink);font-weight:700;box-shadow:var(--shadow-sm)}
.booking-hero-copy{text-align:center;max-width:760px;margin:28px auto 0}.booking-eyebrow{display:inline-block;border:1px solid #a9d8f5;border-radius:999px;padding:7px 13px;color:var(--color-blue-deep);font-size:.74rem;font-weight:800;letter-spacing:.08em;background:#fff}.booking-hero h1{font-size:clamp(2rem,4vw,3rem);margin:18px 0 8px;color:var(--color-ink)}.booking-hero p{margin:0;color:var(--color-slate);font-size:1rem}
.booking-body{background:#f7fafc;padding:26px 0 84px;min-height:620px}.booking-container{max-width:980px}
.booking-stepper{display:flex;align-items:center;justify-content:center;gap:8px;background:#fff;border:1px solid var(--color-border);border-radius:16px;padding:14px 18px;margin:0 auto 22px;box-shadow:var(--shadow-sm);overflow-x:auto}.booking-stepper i{font-style:normal;color:#b5c5d1;font-weight:700}.step-indicator{border:0;background:transparent;display:flex;align-items:center;gap:8px;color:var(--color-slate);font:inherit;cursor:pointer;white-space:nowrap;padding:4px 6px}.step-indicator span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#eaf4fb;color:var(--color-blue-deep);font-weight:800;font-size:.82rem}.step-indicator strong{font-size:.85rem}.step-indicator.is-active{color:var(--color-blue-deep)}.step-indicator.is-active span{background:var(--color-blue);color:#fff}.step-indicator.is-complete span{background:var(--color-lime);color:var(--color-ink)}
.booking-step[hidden]{display:none!important}.booking-card{background:#fff;border:1px solid var(--color-border);border-radius:18px;padding:30px;box-shadow:var(--shadow-sm)}.booking-section-head{display:flex;align-items:center;gap:13px;margin-bottom:22px}.booking-section-number{width:34px;height:34px;border-radius:50%;background:var(--color-blue-pale);color:var(--color-blue-deep);font-weight:800;display:grid;place-items:center;flex:0 0 auto}.booking-section-head h2{margin:0;font-size:1.35rem}.booking-section-head p{margin:4px 0 0;color:var(--color-slate);font-size:.9rem}
.owner-prefill-note,.booking-confirm-note,.assign-note{display:flex;gap:10px;align-items:flex-start;background:var(--color-blue-pale);color:var(--color-blue-deep);border-radius:12px;padding:12px 14px;font-size:.86rem;margin-bottom:20px}.owner-prefill-note svg{width:17px;height:17px;flex:0 0 auto;margin-top:1px}.owner-grid{display:grid;grid-template-columns:1.2fr 1.2fr 1fr;gap:16px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.field-span-2{grid-column:1/-1}.optional{font-weight:400;color:var(--color-slate)}
.form-field{margin-bottom:18px}.form-field label{display:block;font-weight:700;font-size:.86rem;margin-bottom:7px;color:var(--color-ink)}.form-field input,.form-field select,.form-field textarea{width:100%;border:1px solid #d7e2ea;border-radius:11px;background:#fff;padding:12px 13px;font:inherit;color:var(--color-ink);outline:none;transition:border-color .15s,box-shadow .15s}.form-field textarea{min-height:105px;resize:vertical}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--color-blue);box-shadow:0 0 0 3px rgba(23,147,210,.12)}.form-field input[readonly]{background:#f5f8fa;color:#536777}
.service-select-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.service-select-card{position:relative}.service-select-card input{position:absolute;opacity:0;pointer-events:none}.service-select-card label{min-height:82px;display:flex;align-items:center;gap:13px;border:1.5px solid var(--color-border);border-radius:13px;padding:13px 15px;cursor:pointer;transition:.15s}.service-select-card label:hover{border-color:#8bc8e9}.service-select-card input:checked+label{border-color:var(--color-blue);background:var(--color-blue-pale);box-shadow:0 0 0 2px rgba(23,147,210,.08)}.service-icon{width:40px;height:40px;border-radius:12px;background:#eef8fc;display:grid;place-items:center;font-size:20px;flex:0 0 auto}.service-select-card strong{display:block;font-size:.93rem}.service-select-card small{display:block;color:var(--color-slate);font-size:.77rem;margin-top:3px}.service-card-wide{grid-column:1/-1}.sub-service-choice{display:none;margin-top:14px;padding:15px;background:#f0f8fc;border-radius:12px}.sub-service-choice.is-visible{display:block}.sub-service-choice p{margin:0 0 10px;font-weight:700;color:var(--color-blue-deep);font-size:.88rem}.sub-service-options{display:flex;gap:10px;flex-wrap:wrap}.sub-service-options label{background:#fff;border:1px solid var(--color-border);border-radius:999px;padding:8px 13px;font-size:.84rem;cursor:pointer}
.clinic-fixed-note{display:flex;align-items:center;gap:9px;background:#eff9e9;color:var(--color-lime-deep);border-radius:11px;padding:11px 13px;font-weight:700;margin-bottom:18px}.schedule-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}.schedule-info{border:1px solid var(--color-border);border-radius:12px;padding:13px 15px;display:flex;flex-direction:column;gap:4px;min-height:78px}.schedule-info strong{font-size:.84rem}.schedule-info span,.schedule-info small{color:var(--color-slate);font-size:.8rem}.time-slot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.time-slot{border:1.5px solid var(--color-border);background:#fff;border-radius:10px;padding:12px;font-weight:700;color:var(--color-ink);cursor:pointer}.time-slot[aria-pressed=true]{border-color:var(--color-blue);background:var(--color-blue-pale);color:var(--color-blue-deep);box-shadow:0 0 0 2px rgba(23,147,210,.08)}.assign-note{margin-top:10px;margin-bottom:0}
.review-summary{border:1px solid var(--color-border);border-radius:14px;overflow:hidden}.review-group{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;border-bottom:1px solid var(--color-border)}.review-group>div{min-width:0}.review-group span{display:block;font-size:.75rem;color:var(--color-slate);margin-bottom:3px}.review-group strong{display:block;font-size:.96rem}.review-group small{display:block;color:var(--color-slate);margin-top:3px}.text-button{border:0;background:transparent;color:var(--color-blue-deep);font-weight:800;cursor:pointer}.review-clinic{padding:16px 18px;background:#f6fbfd;display:flex;gap:7px;align-items:center;flex-wrap:wrap;font-size:.88rem}.review-clinic span{color:var(--color-slate)}.booking-confirm-note{margin:18px 0 0}
.booking-actions{display:flex;justify-content:space-between;gap:12px;margin-top:26px;padding-top:20px;border-top:1px solid #edf2f5}.booking-actions .btn{min-height:44px}
.auth-gate{max-width:480px;margin:64px auto;text-align:center;border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:48px 40px;box-shadow:var(--shadow-sm)}.auth-gate-icon{width:56px;height:56px;border-radius:50%;background:var(--color-blue-pale);color:var(--color-blue-deep);display:flex;align-items:center;justify-content:center;margin:0 auto 18px}.auth-gate-icon svg{width:28px;height:28px}.auth-gate h1{font-size:1.4rem;margin-bottom:8px}.auth-gate p{color:var(--color-slate);margin:0 auto 24px}.auth-gate-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.success-panel{display:none;background:#f7fafc;padding:35px 0 80px}.success-panel.is-active{display:block}.success-card{max-width:620px;margin:25px auto;text-align:center;border:1px solid var(--color-border);border-radius:18px;padding:48px 40px;background:#fff;box-shadow:var(--shadow-md)}.success-icon{width:64px;height:64px;border-radius:50%;background:var(--color-lime-pale);color:var(--color-lime-deep);display:flex;align-items:center;justify-content:center;margin:0 auto 20px}.success-icon svg{width:31px;height:31px}.success-card h1{font-size:1.6rem}.success-ref{display:inline-block;font-weight:800;font-size:1.05rem;background:var(--color-blue-pale);color:var(--color-blue-deep);border-radius:10px;padding:8px 17px;margin:14px 0 18px}.success-status-row{display:flex;justify-content:center;gap:26px;margin:20px 0;flex-wrap:wrap}.success-status-row div{text-align:left}.success-status-row span.label{display:block;font-size:.76rem;color:var(--color-slate);margin-bottom:4px}.success-when{color:var(--color-slate);font-size:.92rem}.success-note{background:var(--color-blue-pale);color:var(--color-blue-deep);border-radius:11px;padding:14px 16px;font-size:.86rem;text-align:left;margin:20px 0 26px}.success-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
@media(max-width:760px){.owner-grid,.schedule-grid{grid-template-columns:1fr}.service-select-grid{grid-template-columns:1fr}.service-card-wide{grid-column:auto}.booking-card{padding:22px}.booking-stepper{justify-content:flex-start}.step-indicator strong{display:none}.field-grid{grid-template-columns:1fr}.field-span-2{grid-column:auto}.time-slot-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.booking-hero{padding-top:16px}.booking-hero-copy h1{font-size:2rem}.booking-stepper{padding:11px}.booking-actions{flex-direction:column-reverse}.booking-actions .btn{width:100%}.success-card{padding:34px 22px}}

/* ---------- Redesigned appointment booking layout ---------- */
.booking-hero{background:linear-gradient(180deg,#f4fbff 0%,var(--color-blue-pale) 100%);padding:26px 0 36px}
.booking-back{color:var(--color-blue-deep)}
.booking-hero-copy{margin-top:26px}
.booking-eyebrow{color:var(--color-blue-deep);border-color:#b9def1;background:#fff}
.booking-hero h1{color:var(--color-blue-deep);font-family:var(--font-body);font-weight:700;letter-spacing:-.025em}
.booking-hero p{font-family:var(--font-body)}
.booking-body{background:#f8fbfd;padding:30px 0 88px}
.booking-container{max-width:1180px}
.booking-stepper{max-width:100%;margin-bottom:24px;border-radius:16px;padding:13px 18px}
.booking-layout{display:grid;grid-template-columns:minmax(280px,.78fr) minmax(0,1.5fr);gap:24px;align-items:start}
.booking-intro{position:sticky;top:24px;overflow:hidden;background:#fff;border:1px solid var(--color-border);border-radius:20px;box-shadow:var(--shadow-sm)}
.booking-intro-media{position:relative;min-height:270px;background:linear-gradient(145deg,#e9f7fd 0%,#d9f0fb 55%,#eff8df 100%);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.booking-intro-media:before{content:"";position:absolute;width:250px;height:250px;border-radius:50%;background:rgba(255,255,255,.55);top:-90px;right:-70px}
.booking-intro-media img{position:relative;width:92%;max-width:370px;height:270px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 15px rgba(20,60,90,.08))}
.booking-paw{position:absolute;right:24px;bottom:22px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--color-lime-deep);font-size:1.25rem;box-shadow:var(--shadow-sm)}
.booking-intro-copy{padding:24px 25px 26px}
.booking-intro-badge{display:inline-flex;padding:6px 10px;border-radius:999px;background:var(--color-lime-pale);border:1px solid #d7eabb;color:var(--color-lime-deep);font-size:.7rem;font-weight:800;letter-spacing:.06em}
.booking-intro-copy h2{margin:14px 0 11px;font-family:var(--font-body);font-size:1.85rem;line-height:1.14;color:var(--color-blue-deep);font-weight:700;letter-spacing:-.025em}
.booking-intro-copy h2 span{color:var(--color-ink)}
.booking-intro-copy p{color:var(--color-slate);font-size:.92rem;margin-bottom:18px}
.booking-benefits{display:grid;gap:9px}
.booking-benefits li{display:flex;align-items:center;gap:9px;color:var(--color-ink);font-size:.86rem;font-weight:600}
.booking-benefits li span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--color-lime-pale);color:var(--color-lime-deep);font-size:.75rem;font-weight:800}
.booking-layout #booking-form{min-width:0}
.booking-card{border-radius:18px;padding:28px 30px;box-shadow:var(--shadow-sm)}
.booking-section-head h2{font-family:var(--font-body);font-size:1.3rem;color:var(--color-blue-deep);font-weight:700;letter-spacing:-.01em}
.booking-section-head p{font-family:var(--font-body)}
.booking-section-number{background:var(--color-blue-pale);color:var(--color-blue-deep)}
.form-field label{color:var(--color-blue-deep);font-family:var(--font-body);font-size:.8rem;text-transform:uppercase;letter-spacing:.025em}
.form-field input,.form-field select,.form-field textarea{font-family:var(--font-body);border-radius:10px}
.service-select-card strong{color:var(--color-blue-deep);font-family:var(--font-body)}
.time-slot{font-family:var(--font-body)}
.review-group strong{color:var(--color-blue-deep)}
.booking-actions .btn-primary{font-family:var(--font-body)}

@media(max-width:900px){
  .booking-layout{grid-template-columns:1fr}
  .booking-intro{position:relative;top:auto;display:grid;grid-template-columns:.9fr 1.1fr;align-items:stretch}
  .booking-intro-media{min-height:100%;}
  .booking-intro-media img{height:250px}
}
@media(max-width:650px){
  .booking-intro{display:block}
  .booking-intro-media{min-height:220px}
  .booking-intro-media img{height:220px}
  .booking-card{padding:22px}
  .booking-stepper{border-radius:13px}
}

/* ---------- Single-page appointment form ---------- */
.booking-body{padding-top:24px}
.booking-back-inline{margin:0 0 18px;display:inline-flex;background:#fff;color:var(--color-blue-deep)}
.booking-layout{grid-template-columns:minmax(280px,.78fr) minmax(0,1.5fr);gap:24px;align-items:start}
.booking-layout #booking-form{display:grid;gap:18px;min-width:0}
.booking-form-section{min-width:0}
.booking-card{height:100%}
.booking-section-number{font-size:.88rem}
.booking-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.booking-summary-item{min-width:0;padding:14px 15px;border:1px solid var(--color-border);border-radius:12px;background:#f8fbfd}
.booking-summary-item span{display:block;margin-bottom:5px;color:var(--color-slate);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.035em}
.booking-summary-item strong{display:block;overflow-wrap:anywhere;color:var(--color-blue-deep);font-size:.94rem}
.booking-submit-row{align-items:center}
.booking-submit-help{color:var(--color-slate);font-size:.82rem}
.booking-submit-row .btn{min-height:48px;white-space:nowrap}
.booking-confirm-note{line-height:1.6}

@media(max-width:900px){
  .booking-layout{grid-template-columns:minmax(0,1fr)}
  .booking-intro{position:relative;top:auto;display:grid;grid-template-columns:minmax(220px,.85fr) minmax(0,1.15fr);align-items:stretch}
  .booking-intro-media{min-height:100%}
  .booking-intro-media img{height:250px;max-width:100%}
  .booking-layout #booking-form{gap:16px}
}
@media(max-width:650px){
  .booking-body{padding:18px 0 54px}
  .booking-container{width:min(100% - 28px,100%)}
  .booking-intro{display:block}
  .booking-intro-media{min-height:210px}
  .booking-intro-media img{height:220px}
  .booking-intro-copy{padding:21px}
  .booking-intro-copy h2{font-size:1.65rem}
  .booking-card{padding:20px 17px}
  .booking-section-head{align-items:flex-start;gap:10px;margin-bottom:18px}
  .booking-section-head h2{font-size:1.15rem}
  .owner-grid,.field-grid,.schedule-grid{grid-template-columns:minmax(0,1fr)}
  .field-span-2{grid-column:auto}
  .service-select-grid{grid-template-columns:minmax(0,1fr)}
  .service-card-wide{grid-column:auto}
  .time-slot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .booking-summary-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px}
  .booking-summary-item{padding:12px 10px}
  .booking-submit-row{align-items:stretch;flex-direction:column}
  .booking-submit-row .btn{width:100%}
  .booking-submit-help{text-align:center}
}
@media(max-width:380px){
  .booking-summary-grid{grid-template-columns:minmax(0,1fr)}
  .time-slot-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .booking-intro-badge{font-size:.62rem}
}


/* ---------- Form-only appointment layout ---------- */
.booking-container{max-width:1120px}
.booking-layout{display:block;max-width:1040px;margin:0 auto}
.booking-layout #booking-form{display:grid;grid-template-columns:1fr;gap:18px;width:100%}
.booking-layout #booking-form .booking-card{width:100%}
.booking-intro{display:none!important}
.booking-card{box-sizing:border-box}
@media(max-width:650px){
  .booking-layout{max-width:none}
  .booking-card{width:100%}
}

/* ---------- Confirmation page typography consistency ---------- */
.success-card,
.success-card h1,
.success-card h2,
.success-card h3,
.success-card p,
.success-card .success-ref,
.success-card .success-status-row,
.success-card .success-when,
.success-card .success-note,
.success-card .success-actions,
.success-card .btn {
  font-family: var(--font-body);
}

.success-card h1 {
  color: var(--color-blue-deep);
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  font-weight: 700;
  letter-spacing: -0.025em;
}

.success-card > p {
  color: var(--color-ink);
}

.success-card .success-when {
  color: var(--color-slate);
}

.success-card .success-ref {
  color: var(--color-blue-deep);
  font-weight: 700;
}

.success-card .success-note {
  color: var(--color-blue-deep);
  line-height: 1.6;
}

@media (max-width: 520px) {
  .success-card h1 {
    font-size: 1.65rem;
  }
}