.has-appointments .header-inner { width: min(1320px, calc(100% - 40px)); gap: 20px; }
.has-appointments .site-header nav { gap: clamp(10px, 1.3vw, 20px); }
.header-actions { display: flex; align-items: center; gap: 20px; }
.nav-booking { display: inline-flex; align-items: center; gap: 7px; padding: 10px 15px; border-radius: 24px; background: var(--blue); color: #fff; text-decoration: none; font-size: .76rem; font-weight: 600; white-space: nowrap; }
.booking-hero-link { border: 1px solid #5c5c60; color: #f5f5f7; background: #202022; }
.booking-hero-link:hover { background: #303033; }
.booking-header .header-inner { width: min(1120px, calc(100% - 48px)); grid-template-columns: auto 1fr; }
.booking-header-links { justify-self: end; display: flex; gap: 26px; align-items: center; }
.booking-header-links a { color: var(--blue); font-size: .8rem; text-decoration: none; }
.booking-shell { width: min(1120px, calc(100% - 48px)); margin: 0 auto; padding: 58px 0 70px; }
.booking-intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 22px 48px; align-items: center; margin-bottom: 38px; }
.booking-intro > .booking-fineprint { grid-column: 1 / -1; margin: 0; }
.booking-eyebrow { color: var(--blue); font-size: .65rem; font-weight: 700; letter-spacing: .13em; margin: 0 0 16px; }
.booking-intro h1 { font-size: clamp(2.5rem, 4.5vw, 3.75rem); line-height: 1.04; letter-spacing: -.045em; font-weight: 700; margin-bottom: 18px; }
.booking-intro h1 span { color: #8a8a90; }
.booking-intro-lead { color: var(--muted); line-height: 1.65; font-size: .95rem; margin-bottom: 0; }
.booking-benefits { padding: 24px 28px; border: 1px solid #e1e6ec; border-radius: 18px; background: #f8fafc; }
.booking-benefits h2 { font-size: 1rem; letter-spacing: -.02em; font-weight: 650; margin: 0 0 20px; }
.booking-benefits ul { display: grid; gap: 17px; list-style: none; padding: 0; margin: 0; }
.booking-benefits li { display: flex; gap: 12px; align-items: flex-start; }
.booking-benefits li > span { display: grid; place-items: center; flex: 0 0 28px; height: 28px; border-radius: 9px; background: #eaf2fc; color: var(--blue); font-size: .61rem; font-weight: 650; }
.booking-benefits h3 { font-size: .8rem; font-weight: 600; margin: 0 0 4px; }
.booking-benefits p { color: #737780; font-size: .72rem; line-height: 1.5; margin: 0; }
@media (max-width: 850px) { .booking-intro { grid-template-columns: 1fr; gap: 26px; }.booking-benefits { max-width: none; } }
.booking-layout { display: grid; grid-template-columns: minmax(0, 1fr) 315px; gap: 24px; align-items: start; }
.booking-sections { display: grid; gap: 20px; min-width: 0; }
.booking-card { background: #fff; border: 1px solid #e5e5e9; border-radius: 20px; padding: 28px; }
.booking-step-heading { display: flex; gap: 13px; align-items: center; margin-bottom: 24px; }
.booking-step { display: grid; place-items: center; width: 34px; height: 34px; flex-shrink: 0; border-radius: 50%; background: #f0f5fc; color: var(--blue); font-size: .7rem; font-weight: 650; }
.booking-step-heading h2 { font-size: 1.12rem; letter-spacing: -.025em; margin: 0 0 4px; font-weight: 650; }
.booking-step-heading p { margin: 0; color: var(--muted); font-size: .76rem; line-height: 1.4; }
.booking-device-tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; padding: 4px; border-radius: 12px; background: #f2f2f5; margin-bottom: 22px; }
.booking-device-tabs button { min-height: 38px; padding: 5px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); font: inherit; font-size: .72rem; font-weight: 600; cursor: pointer; }
.booking-device-tabs button[aria-pressed="true"] { color: var(--ink); background: white; box-shadow: 0 2px 6px #0000000d; }
.booking-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.booking-fields label { display: grid; gap: 8px; color: #606068; font-size: .75rem; font-weight: 550; min-width: 0; }
.booking-fields input, .booking-fields select, .booking-date-label input, .booking-admin input { width: 100%; min-width: 0; border: 1px solid #d7d7dd; border-radius: 10px; background: #fff; color: var(--ink); font: inherit; padding: 13px 12px; min-height: 47px; font-size: .86rem; }
.booking-fields input:focus, .booking-fields select:focus, .booking-date-label input:focus, .booking-admin input:focus { outline: 3px solid #0071e324; border-color: var(--blue); }
.booking-full { grid-column: 1 / -1; }
.booking-price-line { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; align-items: center; padding: 16px; background: #f7f8fb; border-radius: 10px; margin-top: 18px; }
.booking-price-line > span { color: var(--muted); font-size: .76rem; }
.booking-price-line > strong { font-size: 1.12rem; font-weight: 650; }
.booking-battery-notice { margin-top: 20px; padding: 20px; border: 1px solid #d6e4f5; border-radius: 12px; background: #f4f8fd; }
.booking-battery-heading { display: flex; align-items: flex-start; gap: 10px; }
.booking-battery-heading > span { flex: 0 0 20px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #e1ecfa; color: var(--blue); font-size: .76rem; font-weight: 700; }
.booking-battery-heading h3 { margin: 1px 0 0; font-size: .86rem; line-height: 1.45; font-weight: 650; }
.booking-battery-notice ol { display: grid; gap: 12px; counter-reset: battery-stage; margin: 17px 0 18px; padding: 0; list-style: none; }
.booking-battery-notice li { counter-increment: battery-stage; position: relative; padding-left: 30px; color: #575c65; font-size: .78rem; line-height: 1.65; }
.booking-battery-notice li::before { content: counter(battery-stage); position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 19px; height: 19px; border: 1px solid #cbd9ed; border-radius: 50%; font-size: .64rem; color: #577297; }
.booking-battery-notice li strong { color: #303b4b; font-weight: 600; }
.booking-battery-call { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 15px; border-top: 1px solid #dce7f5; }
.booking-battery-call p { margin: 0; max-width: 210px; color: #596574; font-size: .75rem; line-height: 1.5; }
.booking-battery-call a { display: grid; gap: 4px; flex-shrink: 0; color: var(--blue); text-decoration: none; font-size: .8rem; font-weight: 600; }
.booking-battery-call a > span { font-size: .69rem; font-weight: 500; }
@media (max-width: 600px) { .booking-battery-notice { padding: 17px 14px; }.booking-battery-call { flex-direction: column; align-items: flex-start; }.booking-battery-call p { max-width: none; } }
.booking-fineprint { color: var(--muted); font-size: .71rem; line-height: 1.6; margin: 12px 0 0; }
.booking-calendar-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.booking-calendar-top > strong { text-transform: capitalize; font-size: .95rem; font-weight: 600; }
.booking-date-label { display: grid; gap: 5px; color: var(--muted); font-size: .65rem; }
.booking-date-label input { min-height: 34px; padding: 6px 8px; font-size: .75rem; }
.booking-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.booking-day { display: flex; flex-direction: column; gap: 5px; align-items: center; padding: 12px 2px; border: 1px solid #e5e5ea; border-radius: 11px; background: #fff; color: var(--ink); font: inherit; cursor: pointer; }
.booking-day > span { color: var(--muted); font-size: .65rem; }
.booking-day strong { font-weight: 600; font-size: 1.2rem; }
.booking-day { justify-content: center; }
.booking-day:disabled { background: #f6f6f8; border-color: #e9e9ed; color: #a0a0a7; cursor: default; }
.booking-day:disabled > span { color: #a0a0a7; }
.booking-day small { font-size: .53rem; color: #8b8b93; }
.booking-day[aria-pressed="true"] { border-color: var(--blue); background: #f0f6ff; }
.booking-day[aria-pressed="true"] > span, .booking-day[aria-pressed="true"] > strong { color: var(--blue); }
.booking-slots-heading { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; align-items: center; margin: 24px 0 12px; }
.booking-slots-heading h3 { font-size: .83rem; margin: 0; font-weight: 600; }
.booking-legend { display: flex; gap: 13px; font-size: .65rem; color: var(--muted); }
.booking-legend span { display: flex; gap: 5px; align-items: center; }
.booking-legend i { width: 5px; height: 5px; border-radius: 50%; }
.available-dot { background: #25804d; }.busy-dot { background: #a0a0a7; }
.booking-slots { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.booking-slot { min-width: 0; min-height: 57px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 4px; border: 1px solid #99cead; border-radius: 10px; background: #e2f3e8; color: #205b36; font: inherit; cursor: pointer; }
.booking-slot > strong { font-size: .9rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.booking-slot small { font-size: .58rem; color: #32774b; }
.booking-slot:hover:enabled { border-color: #4f9c6a; background: #cfead9; }
.booking-slot:disabled { border-color: #dedee3; background: #ececf0; color: #777780; cursor: default; }
.booking-slot:disabled small { color: #85858e; }
.booking-slot[aria-pressed="true"] { background: var(--blue); border-color: var(--blue); color: #fff; box-shadow: 0 3px 8px #0071e31a; }
.booking-slot[aria-pressed="true"]:hover:enabled { background: var(--blue); }
.booking-slot[aria-pressed="true"] small { color: #e4efff; }
.booking-slot:focus-visible, .booking-day:focus-visible, .booking-device-tabs button:focus-visible { outline: 3px solid #0071e340; outline-offset: 2px; }
.booking-availability-message { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; min-height: 32px; margin-top: 7px; }
.booking-availability-message p { font-size: .72rem; color: var(--muted); margin: 0; }
.booking-summary { position: sticky; top: 86px; border: 1px solid #dedee4; border-radius: 20px; background: linear-gradient(150deg, #fff, #f9f9fc); padding: 28px 24px; }
.booking-summary > .booking-eyebrow { color: var(--muted); font-size: .61rem; }
.booking-summary-icon { display: grid; place-items: center; width: 42px; height: 42px; margin: 24px 0 16px; color: var(--blue); background: #eaf2fc; border-radius: 12px; }
.booking-summary-icon svg { width: 25px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.booking-summary h2 { font-size: 1.7rem; margin: 0 0 8px; letter-spacing: -.04em; }
.booking-summary-lead { font-size: .8rem; line-height: 1.5; color: var(--muted); margin: 0 0 24px; }
.booking-summary dl { margin: 0; }
.booking-summary dl > div { display: grid; gap: 6px; border-top: 1px solid #e6e6eb; padding: 13px 0; }
.booking-summary dt { color: var(--muted); font-size: .68rem; }
.booking-summary dd { margin: 0; max-width: none; font-size: .83rem; line-height: 1.45; overflow-wrap: anywhere; }
.booking-summary-price { border-top: 1px solid #d9d9df; padding-top: 18px; margin: 4px 0 20px; display: flex; flex-direction: column; gap: 8px; }
.booking-summary-price > span { color: var(--muted); font-size: .74rem; display: flex; justify-content: space-between; align-items: center; }
.booking-summary-price small { font-size: .61rem; }
.booking-summary-price > strong { font-size: 1.6rem; font-weight: 650; letter-spacing: -.04em; }
.booking-submit { display: flex; justify-content: center; align-items: center; gap: 18px; width: 100%; min-height: 47px; padding: 12px 18px; border: 0; border-radius: 24px; color: #fff; background: var(--blue); font: inherit; font-size: .8rem; font-weight: 600; cursor: pointer; text-decoration: none; }
.booking-submit:hover:enabled { background: var(--blue-hover); }.booking-submit:disabled { opacity: .45; cursor: default; }
.booking-error { color: #b83232; line-height: 1.5; font-size: .77rem; margin: 12px 0 0; }
.booking-error:empty { display: none; }
.booking-location { display: grid; gap: 7px; margin-top: 24px; padding-top: 20px; border-top: 1px solid #e6e6eb; font-size: .72rem; }
.booking-location strong { font-weight: 600; }.booking-location span { line-height: 1.6; color: var(--muted); }
.booking-location a, .booking-text-button { color: var(--blue); font: inherit; font-size: .74rem; text-decoration: none; background: transparent; border: 0; padding: 0; cursor: pointer; }
.booking-footer { width: min(1120px, calc(100% - 48px)); margin: 0 auto; padding: 24px 0; display: flex; gap: 16px; justify-content: space-between; font-size: .7rem; color: var(--muted); border-top: 1px solid #dedee4; }
.booking-success { max-width: 680px; padding: 44px; margin: 0 auto; text-align: center; border: 1px solid #e0e5e3; border-radius: 24px; background: white; }
.booking-success-mark { width: 76px; height: 76px; margin: 0 auto 26px; display: grid; place-items: center; color: #22835b; background: #eaf7ef; border-radius: 50%; animation: booking-appear .45s ease-out; }
.booking-success-mark svg { width: 44px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.booking-success h1 { font-size: 3rem; letter-spacing: -.045em; margin-bottom: 12px; }.booking-success > p { color: var(--muted); line-height: 1.6; font-size: .9rem; }
.booking-success-number { display: grid; gap: 9px; padding: 20px; background: #f3f6fa; border-radius: 13px; margin-top: 25px; }
.booking-success-number span { color: var(--muted); font-size: .72rem; }.booking-success-number strong { letter-spacing: .03em; font-size: 1.05rem; overflow-wrap: anywhere; }
.booking-success dl { text-align: left; margin: 20px 0; }.booking-success dl > div { display: flex; justify-content: space-between; gap: 20px; border-bottom: 1px solid #eaeaf0; padding: 13px 0; }.booking-success dt { color: var(--muted); font-size: .75rem; }.booking-success dd { max-width: 70%; text-align: right; margin: 0; font-size: .8rem; line-height: 1.45; }
.booking-success-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 20px; margin-top: 25px; }.booking-success-actions .booking-submit { width: auto; }
.booking-page [hidden] { display: none !important; }
@keyframes booking-appear { from { opacity: 0; transform: scale(.8); } to { opacity: 1; transform: scale(1); } }
.booking-admin { max-width: 1040px; margin: 0 auto; padding: 35px 24px; }.booking-admin-tools { display: flex; gap: 14px; align-items: end; flex-wrap: wrap; margin: 24px 0; }.booking-admin-tools label { display: grid; gap: 7px; font-size: .78rem; }.booking-admin-tools button { width: auto; }.booking-admin-list { display: grid; gap: 12px; }.booking-admin-item { background: white; border: 1px solid #e0e0e6; border-radius: 14px; padding: 20px; display: grid; grid-template-columns: 70px 1fr auto; gap: 20px; align-items: start; }.booking-admin-item p { font-size: .8rem; line-height: 1.6; margin: 4px 0; }.booking-admin-item small { color: var(--muted); }.booking-admin-item button { margin: 5px 0 0; }.booking-admin-actions { display: grid; gap: 12px; }
@media (max-width: 1150px) { .has-appointments .site-header nav { display: none; }.has-appointments .header-inner { grid-template-columns: auto 1fr auto auto; }.has-appointments .header-actions { justify-self: end; }.has-appointments .menu-button { display: none; } }
@media (max-width: 850px) { .booking-layout { grid-template-columns: 1fr; }.booking-summary { position: static; }.booking-summary-icon, .booking-summary-lead { display: none; }.booking-summary dl { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; }.booking-summary h2 { font-size: 1.4rem; margin-bottom: 18px; }.booking-summary-price { flex-direction: row; justify-content: space-between; align-items: center; }.booking-summary-price > span { display: grid; gap: 5px; }.booking-summary-price > strong { font-size: 1.45rem; } }
@media (max-width: 600px) {
  .has-appointments .site-header .header-inner { display: grid; width: calc(100% - 28px); grid-template-columns: auto 1fr; gap: 0 12px; padding: 7px 0; }
  .has-appointments .store-mobile-link { display: inline-flex; grid-column: 1; justify-self: start; min-height: 26px; font-size: .68rem; }
  .has-appointments .parts-mobile { display: block; grid-column: 2; justify-self: end; }
  .has-appointments .menu-button { display: none; }
  .has-appointments .parts-mobile .parts-trigger { min-height: 26px; font-size: .68rem; }
  .has-appointments .header-actions { gap: 10px; }.has-appointments .header-actions .nav-cta { display: none; }.nav-booking { font-size: .69rem; padding: 9px 12px; }.has-appointments .brand-image { width: 112px; flex-basis: 112px; }
  .has-appointments .hero-actions { flex-wrap: wrap; gap: 10px 20px; justify-content: center; }.has-appointments .hero-actions .button { font-size: .8rem; }
  .booking-header .header-inner { width: calc(100% - 36px); }.booking-header .brand-image { width: 110px; flex-basis: 110px; }.booking-header-links { gap: 15px; }.booking-header-links a { font-size: .69rem; }.booking-header-links a:last-child { display: none; }
  .booking-shell { width: calc(100% - 28px); padding: 34px 0 40px; }.booking-intro { padding: 0 6px; margin-bottom: 28px; }.booking-intro h1 { font-size: 2.65rem; }.booking-intro-lead { font-size: .82rem; }.booking-benefits { padding: 21px; }.booking-benefits h2 { font-size: .95rem; }.booking-intro br:last-child { display: none; }
  .booking-card { border-radius: 16px; padding: 22px 17px; }.booking-layout { gap: 18px; }.booking-step-heading { gap: 10px; margin-bottom: 20px; }.booking-step-heading h2 { font-size: 1.04rem; }.booking-step-heading p { font-size: .69rem; }.booking-step { width: 30px; height: 30px; }
  .booking-fields { grid-template-columns: 1fr; gap: 14px; }.booking-fields label { font-size: .72rem; }.booking-fields input, .booking-fields select { font-size: .85rem; }
  .booking-device-tabs button { font-size: .66rem; }.booking-calendar-top { gap: 7px; }.booking-calendar-top > strong { font-size: .82rem; }.booking-date-label input { max-width: 140px; }
  .booking-days { gap: 4px; }.booking-day { padding: 10px 0; border-radius: 9px; }.booking-day > span { font-size: .59rem; }.booking-day strong { font-size: 1.03rem; }
  .booking-slots { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 6px; }.booking-slot { min-height: 55px; }.booking-slot > strong { font-size: .83rem; }.booking-legend { font-size: .59rem; gap: 8px; }
  .booking-summary { padding: 24px 20px; border-radius: 16px; }.booking-summary dl { grid-template-columns: 1fr; }.booking-summary dl > div { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; }.booking-summary dd { max-width: 72%; text-align: right; font-size: .78rem; }.booking-location { margin-top: 20px; }
  .booking-success { padding: 30px 18px; border-radius: 18px; }.booking-success h1 { font-size: 2.4rem; }.booking-success-number strong { font-size: .9rem; }.booking-footer { width: calc(100% - 36px); flex-direction: column; gap: 7px; }
  .booking-admin { padding: 25px 14px; }.booking-admin-item { grid-template-columns: 55px 1fr; padding: 16px; gap: 12px; }.booking-admin-actions { grid-column: 2; display: flex; gap: 18px; }
}
@media (prefers-reduced-motion: reduce) { .booking-success-mark { animation: none; } }
