/* The booking journey stays in one place, with one clear action per step. */
html body .bkv[data-bk-phase] { --bk-ink:#173f34; --bk-muted:#60756d; --bk-line:#dce8df; }
html body .bkv .bk-journey-art {
  position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) 180px;
  align-items:center;gap:20px;overflow:hidden;margin:0 0 24px;padding:26px 28px;
  border:1px solid #dce8df;border-radius:23px;background:#f0f6ed;color:var(--bk-ink,#173f34);
}
html body .bkv .bk-journey-copy { position:relative;z-index:1;min-width:0; }
html body .bkv .bk-journey-copy small { display:block;color:#537665;font-size:11px;font-weight:800;letter-spacing:.02em; }
html body .bkv .bk-journey-copy h2 { margin:8px 0;font-size:clamp(21px,2.2vw,29px);line-height:1.55;letter-spacing:-.7px;color:#173f34; }
html body .bkv .bk-journey-copy p { margin:0;max-width:43ch;color:#536d61;font-size:13px;line-height:1.95; }
html body .bkv .bk-journey-visual {
  position:relative;min-height:152px;border-radius:19px;background:linear-gradient(180deg,#173f3410,#173f3466),url('landing-hero.webp') center/cover;
  box-shadow:0 14px 26px #173f341a;transform:rotate(-3deg);
}
html body .bkv .bk-journey-visual::after {
  content:'';position:absolute;width:88px;height:68px;inset:auto -12px -10px auto;
  border:3px solid #fff;border-radius:14px;background:#e9f3df url('court-illustration.svg') center/cover;
  box-shadow:0 8px 20px #173f3420;transform:rotate(7deg);
}
html body .bkv[data-bk-phase="otp"] .bk-journey-art { background:linear-gradient(115deg,#edf7f3,#f7faed); }
html body .bkv[data-bk-phase="payment"] .bk-journey-art { background:linear-gradient(115deg,#fff8eb,#eff6ed); }
html body .bkv[data-bk-phase="done"] .bk-journey-art { background:linear-gradient(115deg,#e5f5e9,#eff9d7); }
html body .bkv[data-bk-phase="phone"] #bk-step2 form[data-otp-booking],
html body .bkv[data-bk-phase="otp"] #bk-step2 form[data-otp-booking] {
  display:grid;grid-template-columns:minmax(0,1fr);gap:16px;max-width:460px;margin:20px auto 8px;
}
html body .bkv[data-bk-phase] #bk-step2 form[data-otp-booking] .fg { min-width:0; }
html body .bkv[data-bk-phase] #bk-step2 form[data-otp-booking] .fg label { display:block;margin-bottom:8px;font-size:13px!important;line-height:1.8; }
html body .bkv[data-bk-phase] #bk-step2 form[data-otp-booking] input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]) {
  min-height:54px!important;font-size:16px!important;border-radius:14px!important;
}
html body .bkv[data-bk-phase="phone"] #bk-step2 input[name="customer_phone"],
html body .bkv[data-bk-phase="otp"] #bk-step2 input[name="otp"] {
  text-align:center;letter-spacing:3px;font-variant-numeric:tabular-nums;
}
html body .bkv[data-bk-phase="otp"] #bk-step2 input[name="otp"] { font-size:25px!important;letter-spacing:10px;min-height:64px!important; }
html body .bkv[data-bk-phase] #bk-step2 form[data-otp-booking] > .btn { min-height:50px;font-size:14px!important;border-radius:14px; }
html body .bkv[data-bk-phase] #bk-step2 form[data-otp-booking] > .btn.secondary { min-height:44px; }
html body .bkv[data-bk-phase] .bk-checkout-details { display:grid;gap:18px;min-width:0; }
html body .bkv[data-bk-phase] .bk-checkout-details .qm-grid2 { gap:16px; }
html body .bkv .bk-flow-status,html body .bkv .bk-flow-error {
  display:flex;align-items:center;gap:10px;grid-column:1/-1;padding:13px 16px;margin:14px 0;
  border:1px solid #cfe4d7;border-radius:14px;background:#eff8f1;color:#27573c;font-size:13px;line-height:1.9;overflow-wrap:anywhere;
}
html body .bkv .bk-flow-error { border-color:#f0d2c8;background:#fff3ee;color:#953e2d; }
html body .bkv .bk-flow-status[hidden],html body .bkv .bk-flow-error[hidden] { display:none!important; }
html body .bkv[aria-busy="true"] .bk-flow-status::before {
  content:'';flex:none;width:17px;height:17px;border:2px solid #b8d1c1;border-top-color:#285b41;border-radius:50%;animation:bkJourneySpin .8s linear infinite;
}
html body .bkv[data-bk-phase] button:disabled { cursor:wait;opacity:.62; }
html body .bkv[data-bk-phase] [data-auth-resend]:disabled { cursor:default; }
html body .bkv[data-bk-phase] :is(button,a,input,summary):focus-visible { outline:3px solid #4e7c60;outline-offset:4px; }
html body .bkv .bk-receipt-upload { padding:20px;border:1px dashed #9bbb9f;border-radius:18px;background:#f6faf2; }
html body .bkv .bk-receipt-upload input[type="file"] { max-width:100%;font:inherit;font-size:13px; }
html body .bkv .bk-receipt-upload input[type="file"]::file-selector-button { padding:10px 14px;margin-inline-end:12px;border:1px solid #c2d6c4;border-radius:10px;background:#fff;color:#214c35;font:inherit;cursor:pointer; }
html body .bkv .bk-receipt-upload .bk-file-label { display:block;padding:18px 12px;margin-top:10px;border:1px solid #bed3bd;border-radius:13px;background:#fff;text-align:center;cursor:pointer;color:#214c35!important;font-size:14px!important; }
html body .bkv .bk-receipt-upload .bk-file-input { position:absolute;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;border:0!important;clip-path:inset(50%);overflow:hidden; }
html body .bkv .bk-receipt-upload:focus-within { outline:3px solid #4e7c60;outline-offset:3px; }
html body .bkv .bk-result-actions { display:grid;gap:10px;margin-top:20px; }
html body .bkv .bk-receipt-preview { display:flex;align-items:center;gap:12px;max-width:100%;margin-top:14px;color:#365743;font-size:12px;overflow-wrap:anywhere; }
html body .bkv .bk-receipt-preview[hidden] { display:none; }
html body .bkv .bk-receipt-preview img { display:block;max-width:140px;max-height:140px;object-fit:contain;border:1px solid #d6e4d6;border-radius:12px;background:#fff; }
html body .bkv .bk-receipt-preview :is(span,p) { min-width:0;overflow-wrap:anywhere; }
@keyframes bkJourneyEnter { from { opacity:0;transform:translateY(10px); } to { opacity:1;transform:translateY(0); } }
@keyframes bkJourneySpin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:no-preference) {
  html body .bkv .bk-journey-art,html body .bkv[data-bk-phase] #bk-step2 form[data-otp-booking] { animation:bkJourneyEnter .38s ease-out both; }
  html body .bkv[data-bk-phase] .btn { transition:background .18s,box-shadow .18s,transform .18s; }
}
@media(max-width:600px) {
  html body .bkv .bk-journey-art { grid-template-columns:minmax(0,1fr) 95px;gap:14px;padding:20px 17px;margin-bottom:20px;border-radius:18px; }
  html body .bkv .bk-journey-visual { min-height:112px;border-radius:14px; }
  html body .bkv .bk-journey-visual::after { width:55px;height:43px;right:-6px;bottom:-6px;border-width:2px;border-radius:9px; }
  html body .bkv .bk-journey-copy h2 { font-size:20px; }
  html body .bkv .bk-journey-copy p { font-size:12px;line-height:1.9; }
  html body .bkv[data-bk-phase="phone"] #bk-step2 form[data-otp-booking],html body .bkv[data-bk-phase="otp"] #bk-step2 form[data-otp-booking] { margin:16px 0 0;max-width:none; }
  html body .bkv[data-bk-phase] .bk-checkout-details .qm-grid2 { grid-template-columns:1fr; }
}
@media(max-width:360px) {
  html body .bkv .bk-journey-art { grid-template-columns:minmax(0,1fr); }
  html body .bkv .bk-journey-visual { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  html body .bkv[data-bk-phase],html body .bkv[data-bk-phase] *,html body .bkv[data-bk-phase] *::before,html body .bkv[data-bk-phase] *::after { animation:none!important;transition:none!important;scroll-behavior:auto!important; }
}
