:root{
  --bk-ink:#0f0f10;
  --bk-muted:#5c5f66;
  --bk-line:rgba(15,15,16,.10);
  --bk-stone:#f5f6f7;
  --bk-card:#ffffff;
  --bk-soft:rgba(15,15,16,.04);
}

html, body{
  width:100%;
  overflow-x:hidden;
}

/* -------------------------------------------------------
   Hard safety against horizontal scroll (page-level)
-------------------------------------------------------- */
.bk-wrap, .bk-hero, .bk-grid, .bk-main, .bk-summary,
.bk-card, .bk-summary-card, .bk-step, .bk-formgrid, .bk-split,
.bk-trip-grid, .bk-fleet-grid, .bk-counter-row, .bk-air,
.bk-sum-mapcard, .bk-sum-map, #bkMap{
  max-width:100%;
}

.bk-grid, .bk-main, .bk-summary, .bk-card, .bk-summary-card,
.bk-step, .bk-formgrid, .bk-split, .bk-trip-grid, .bk-fleet-grid{
  min-width:0;
}

img, svg, video, canvas{
  max-width:100%;
}

*{ box-sizing:border-box; }

/* -------------------------------------------------------
   HERO
-------------------------------------------------------- */
.bk-hero{
  position:relative;
  padding:26px 0 18px;
  overflow:hidden;
}
.bk-hero-media{
  position:absolute; inset:0;
  background-image: url("/assets/frontend/images/aus-contact-chauffeur.webp");
  background-size:cover;
  background-position:center;
  filter:grayscale(1);
  opacity:.20;
}
.bk-hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(0,0,0,.76), rgba(0,0,0,.35));
}
.bk-hero-inner{ position:relative; z-index:2; }
.bk-crumbs{
  display:flex;
  gap:10px;
  align-items:center;
  margin:0 0 8px;
  font-size:13px;
  color:rgba(255,255,255,.75);
  flex-wrap:wrap;
}
.bk-crumbs a{ color:#fff; text-decoration:none; opacity:.85; }
.bk-hero-row{ max-width:860px; }
.bk-hero-title{
  margin:10px 0 6px;
  color:#fff;
  font-size:34px;
  letter-spacing:-.02em;
}
.bk-hero-sub{
  margin:0;
  color:rgba(255,255,255,.75);
  font-size:14px;
  line-height:1.7;
}
.bk-hero-cut{
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:18px;
  background:linear-gradient(180deg, rgba(255,255,255,0), #fff);
}

/* -------------------------------------------------------
   WRAP + CARDS
-------------------------------------------------------- */
.bk-wrap{ padding:22px 0 72px; background:#fff; }

.bk-card, .bk-summary-card{
  background:var(--bk-card);
  border:1px solid var(--bk-line);
  border-radius:18px;
  box-shadow:0 18px 40px rgba(0,0,0,.06);
  overflow:hidden;
}

/* -------------------------------------------------------
   GRID LAYOUT
-------------------------------------------------------- */
.bk-grid{
  display:grid;
  grid-template-columns: 1fr 340px;
  gap:16px;
  align-items:start;
  grid-template-areas:"main summary";
}
.bk-main{ grid-area:main; }
.bk-summary{ grid-area:summary; }

@media (max-width: 991.98px){
  .bk-grid{
    grid-template-columns:1fr;
    grid-template-areas:
      "main"
      "summary";
  }
  .bk-wrap{ padding:16px 0 52px; }
  .bk-card, .bk-summary-card{ border-radius:16px; }
}

/* -------------------------------------------------------
   PROGRESS
-------------------------------------------------------- */
.bk-progress{
  padding:14px 16px;
  border-bottom:1px solid var(--bk-line);
  background:linear-gradient(180deg, var(--bk-soft), rgba(255,255,255,0));
}
.bk-progress-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.bk-progress-title{ font-size:13px; color:#1a1b1f; }
.bk-dots{ display:flex; gap:6px; }
.bk-dot{
  width:8px; height:8px;
  border-radius:999px;
  background:rgba(15,15,16,.18);
}
.bk-dot.is-on{ background:rgba(15,15,16,.85); }
.bk-bar{
  margin-top:10px;
  height:6px;
  border-radius:999px;
  background:rgba(15,15,16,.10);
  overflow:hidden;
}
.bk-bar span{
  display:block;
  height:100%;
  width:0%;
  background:rgba(15,15,16,.85);
  border-radius:999px;
  transition:width .18s ease;
}

/* -------------------------------------------------------
   STEPS + HEAD
-------------------------------------------------------- */
.bk-step{ display:none; padding:16px; }
.bk-step.is-active{ display:block; }

.bk-head{ margin:0 0 12px; }
.bk-head h2{
  margin:0 0 6px;
  font-size:20px;
  letter-spacing:-.01em;
  color:var(--bk-ink);
}
.bk-head p{
  margin:0;
  color:var(--bk-muted);
  font-size:14px;
  line-height:1.7;
}

/* -------------------------------------------------------
   INFO BOX (Vehicle disclaimer)
-------------------------------------------------------- */
.bk-info{
  margin-top:10px;
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(15,15,16,.10);
  background:rgba(15,15,16,.03);
}
.bk-info-ic{
  width:22px; height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:12px;
  color:#111;
  background:#fff;
  border:1px solid rgba(15,15,16,.14);
  flex:0 0 auto;
}
.bk-info-txt{
  font-size:12.5px;
  line-height:1.6;
  color:#4f535a;
}

/* -------------------------------------------------------
   STEP 1 TRIP CARDS
-------------------------------------------------------- */
.bk-trip-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}
@media (max-width: 991.98px){
  .bk-trip-grid{ grid-template-columns:1fr; }
}

.bk-trip{
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;

  border-radius:14px;
  border:1px solid rgba(15,15,16,.12);
  background:#fff;
  padding:14px 14px 12px;
  cursor:pointer;
  text-align:left;
  min-height:96px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
.bk-trip:hover{ transform:translateY(-1px); box-shadow:0 16px 34px rgba(0,0,0,.08); }
.bk-trip:active{ transform:scale(0.99); }

.bk-trip.is-selected,
.bk-trip[aria-checked="true"]{
  border-color: rgba(15,15,16,.62);
  background: linear-gradient(180deg, rgba(15,15,16,.04), rgba(255,255,255,0));
  box-shadow:
    0 16px 34px rgba(0,0,0,.10),
    inset 0 0 0 2px rgba(15,15,16,.85);
}
.bk-trip:focus-visible{
  outline:none;
  box-shadow:
    0 16px 34px rgba(0,0,0,.10),
    inset 0 0 0 2px rgba(15,15,16,.85),
    0 0 0 4px rgba(191,156,96,.22);
}

.bk-trip-top{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
}
.bk-trip-title{
  font-weight:800;
  color:var(--bk-ink);
  font-size:15px;
  line-height:1.2;
}
.bk-trip-tag{
  font-size:11px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(15,15,16,.55);
  white-space:nowrap;
}
.bk-trip-sub{
  margin-top:10px;
  color:var(--bk-muted);
  font-size:13px;
  line-height:1.55;
}

/* -------------------------------------------------------
   FORM GRID
-------------------------------------------------------- */
.bk-formgrid{
  display:grid;
  grid-template-columns:repeat(12, minmax(0,1fr));
  gap:12px;
}
.bk-col-12{ grid-column:span 12; }
.bk-col-6{ grid-column:span 6; }
@media (max-width: 991.98px){
  .bk-col-6{ grid-column:span 12; }
}

.bk-field label{
  display:block;
  margin:0 0 6px;
  font-size:13px;
  color:#1a1b1f;
}

.bk-field input, .bk-field select, .bk-field textarea{
  width:100%;
  border-radius:14px;
  border:1px solid rgba(15,15,16,.14);
  background:linear-gradient(180deg, #ffffff, rgba(15,15,16,.02));
  padding:12px 12px;
  font-size:14px;
  outline:none;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
  transition:border-color .15s ease, box-shadow .15s ease, transform .08s ease;
}
.bk-field input::placeholder,
.bk-field textarea::placeholder{ color:rgba(15,15,16,.42); }
.bk-field textarea{ min-height:120px; resize:vertical; }

.bk-field input:focus, .bk-field select:focus, .bk-field textarea:focus{
  border-color:rgba(15,15,16,.42);
  box-shadow:0 14px 30px rgba(0,0,0,.10), 0 0 0 4px rgba(191,156,96,.18);
}
.bk-help{ display:block; margin-top:6px; color:var(--bk-muted); font-size:12px; }

/* return split */
.bk-split{
  display:grid;
  grid-template-columns:repeat(12, minmax(0,1fr));
  gap:12px;
}
.bk-split .bk-col-6{ grid-column:span 6; }
@media (max-width: 991.98px){
  .bk-split .bk-col-6{ grid-column:span 12; }
}

/* -------------------------------------------------------
   COUNTERS
-------------------------------------------------------- */
.bk-counter-row{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:10px;
}
@media (max-width: 991.98px){
  .bk-counter-row{ grid-template-columns:1fr; }
}

.bk-counter{
  border:1px solid rgba(15,15,16,.10);
  border-radius:14px;
  background:var(--bk-stone);
  padding:10px;
}
.bk-counter-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:8px;
}
.bk-counter-label{ font-weight:800; color:#1a1b1f; font-size:13px; }
.bk-counter-range{ color:var(--bk-muted); font-size:12px; }

.bk-counter-ui{
  display:grid;
  grid-template-columns:40px minmax(64px, 1fr) 40px;
  gap:10px;
  align-items:center;
}
.bk-ct-btn{
  width:100%;
  height:38px;
  border-radius:12px;
  border:1px solid rgba(15,15,16,.18);
  background:#fff;
  color:#000;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  line-height:1;
  font-size:18px;
}
.bk-ct-val{
  width:100%;
  height:38px;
  line-height:38px;
  border-radius:12px;
  border:1px solid rgba(15,15,16,.14);
  background:#fff;
  font-weight:850;
  text-align:center;
  padding:0;
  appearance:none;
  -webkit-appearance:none;
}

.bk-note{
  border:1px solid rgba(15,15,16,.10);
  background:rgba(15,15,16,.03);
  border-radius:14px;
  padding:10px 12px;
  color:#2a2d33;
  font-size:13px;
}

/* -------------------------------------------------------
   AIRPORT BOX
-------------------------------------------------------- */
.bk-air{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border:1px solid rgba(15,15,16,.10);
  border-radius:14px;
  background:#fff;
}
@media (max-width: 991.98px){ .bk-air{ flex-direction:column; } }

.bk-switch{
  display:flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  user-select:none;
}
.bk-switch input{ position:absolute; opacity:0; pointer-events:none; }

.bk-slider{
  width:44px; height:26px; border-radius:999px;
  background:rgba(15,15,16,.14);
  border:1px solid rgba(15,15,16,.18);
  position:relative;
  transition:all .15s ease;
}
.bk-slider:after{
  content:"";
  width:20px; height:20px; border-radius:999px;
  background:#fff;
  position:absolute; top:50%; left:3px;
  transform:translateY(-50%);
  box-shadow:0 8px 18px rgba(0,0,0,.12);
  transition:all .15s ease;
}
#is_airport:checked + .bk-slider{ background:rgba(15,15,16,.85); }
#is_airport:checked + .bk-slider:after{ left:21px; }

.bk-switch-text{ font-weight:700; color:#1a1b1f; font-size:13px; }

.bk-flight{ min-width:320px; flex:1; }
@media (max-width: 991.98px){ .bk-flight{ min-width:0; width:100%; } }

/* -------------------------------------------------------
   ACTION BUTTONS
-------------------------------------------------------- */
.bk-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--bk-line);
}
.bk-actions--tight{ border-top:none; padding-top:0; }
.bk-actions--submit{ align-items:flex-end; }
.bk-submit-split{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }

.bk-btn{
  border-radius:999px;
  border:1px solid rgba(15,15,16,.18);
  background:#fff;
  color:#111;
  font-weight:400;
  font-size:15px;
  padding:0 20px;
  height:44px;
  line-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  max-width:100%;
}
.bk-btn--primary{
  background:rgba(15,15,16,.92);
  color:#fff;
  border-color:rgba(15,15,16,.92);
  box-shadow:0 14px 30px rgba(0,0,0,.16);
}
.bk-btn--ghost{
  background:var(--bk-stone);
  border-color:rgba(15,15,16,.10);
}

/* -------------------------------------------------------
   SUMMARY (and overflow-safe rows)
-------------------------------------------------------- */
.bk-summary-card{
  padding:14px;
  position:sticky;
  top:18px;
}
@media (max-width: 991.98px){
  .bk-summary-card{ position:static; }
}

.bk-sum-mapcard{
  margin:10px 0 12px;
  border:1px solid rgba(15,15,16,.10);
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 18px 40px rgba(0,0,0,.07);
  position:relative;
}
.bk-sum-map, #bkMap{
  width:100%;
  max-width:100%;
  height:160px;
  background:#f4f5f6;
  overflow:hidden;
  border-radius:16px;
}
@media (max-width: 575.98px){
  .bk-sum-map, #bkMap{ height:130px; }
}

/* Prevent MapLibre from causing overflow */
#bkMap{ position:relative; z-index:1; filter:none !important; }
#bkMap canvas{ pointer-events:auto; background:transparent !important; max-width:100%; }
.maplibregl-canvas-container, .maplibregl-canvas{ position:relative !important; max-width:100%; }
#bkMap .maplibregl-ctrl-group{
  border-radius:12px !important;
  overflow:hidden;
  box-shadow:0 10px 22px rgba(0,0,0,.14);
  border:1px solid rgba(15,15,16,.12);
}
#bkMap .maplibregl-ctrl button{ width:36px; height:36px; }

.bk-summary-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  border-bottom:1px solid var(--bk-line);
  padding-bottom:10px;
  margin-bottom:10px;
}
.bk-summary-title{ font-weight:900; color:#111; }
.bk-summary-chip{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--bk-stone);
  border:1px solid rgba(15,15,16,.10);
}

.bk-summary-list{ display:grid; gap:8px; }

.bk-srow{
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
  color:#1a1b1f;
  min-width:0;
}
.bk-srow span{ color:var(--bk-muted); min-width:0; }
.bk-srow strong{
  min-width:0;
  max-width:62%;
  text-align:right;
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* Emphasise last row (Total fare) */
.bk-srow:last-child{
  padding-top:10px;
  margin-top:6px;
  border-top:1px solid rgba(15,15,16,.10);
}

.bk-fare-icon{
  margin-left:6px;
  font-size:11px;
  color:rgba(15,15,16,.55);
  vertical-align:middle;
}

/* -------------------------------------------------------
   STEP 3 — FLEET CARDS (desktop 2-col, mobile 1-col)
-------------------------------------------------------- */

/* grid: 2 columns by default */
.bk-fleet-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  align-items:stretch;
}

/* card */
.bk-fleet{
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;

  position:relative;
  display:grid;
  grid-template-columns:160px minmax(0, 1fr);
  gap:14px;
  align-items:center;

  padding:16px;
  border-radius:18px;
  border:1.5px solid rgba(15,15,16,.14);
  background:#fff;
  text-align:left;
  cursor:pointer;

  /* IMPORTANT: do not let the card collapse on small screens */
  min-height:132px;
  height:auto;
  overflow:hidden;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, opacity .12s ease;
}

.bk-fleet:hover{
  transform:translateY(-1px);
  box-shadow:0 18px 40px rgba(0,0,0,.08);
}

/* selected */
.bk-fleet.is-selected,
.bk-fleet[aria-pressed="true"]{
  border-color: rgba(15,15,16,.75) !important;
  background: linear-gradient(180deg, rgba(15,15,16,.04), rgba(255,255,255,0)) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.10), inset 0 0 0 2px rgba(15,15,16,.85) !important;
  transform:none;
}
/* --- FLEET GRID: fix paint/stacking issues --- */
.bk-fleet-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  align-items:stretch;

  /* key: creates a stacking context so z-index works predictably */
  isolation:isolate;
}

/* card base */
.bk-fleet{
  position:relative;
  z-index:0;                 /* base layer */
  border-radius:18px;
  border:1.5px solid rgba(15,15,16,.14);
  background:#fff;
  overflow:hidden;           /* keep inner content tidy */
  transition:border-color .12s ease, box-shadow .12s ease, transform .12s ease;
}

/* use OUTLINE for selection: most reliable on all mobiles */
.bk-fleet.is-selected,
.bk-fleet[aria-pressed="true"]{
  z-index:5;                 /* bring above neighbours */
  border-color: rgba(15,15,16,.75) !important;
  background: linear-gradient(180deg, rgba(15,15,16,.04), rgba(255,255,255,0)) !important;

  /* outline draws outside the element and doesn't get clipped like shadows */
  outline: 3px solid rgba(15,15,16,.88);
  outline-offset: -3px;      /* sits nicely on the edge */

  box-shadow: 0 18px 42px rgba(0,0,0,.10);
}

/* optional left rail (keep it) */
.bk-fleet.is-selected::before,
.bk-fleet[aria-pressed="true"]::before{
  content:"";
  position:absolute;
  left:0;
  top:14px;
  bottom:14px;
  width:4px;
  border-radius:999px;
  background: rgba(15,15,16,.90);
}

/* focus state (keyboard + iOS tap focus) */
.bk-fleet:focus,
.bk-fleet:focus-visible{
  z-index:5;
  outline: 3px solid rgba(15,15,16,.88);
  outline-offset: -3px;
  box-shadow: 0 18px 42px rgba(0,0,0,.10), 0 0 0 4px rgba(191,156,96,.18);
}

/* disabled */
.bk-fleet.is-disabled{
  opacity:.42;
  cursor:not-allowed;
  box-shadow:none;
  outline:none;
}

.bk-fleet.is-selected::before,
.bk-fleet[aria-pressed="true"]::before{
  content:"";
  position:absolute;
  left:0;
  top:14px;
  bottom:14px;
  width:4px;
  border-radius:999px;
  background: rgba(15,15,16,.90);
}

.bk-fleet.is-disabled{
  opacity:.42;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}

/* media box (stable, no weird cropping) */
.bk-fleet-media{
  width:160px;
  height:92px;
  display:flex;
  align-items:center;
  justify-content:center;

  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;

  overflow:hidden; /* keeps any accidental oversize safe */
}

.bk-fleet-media img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 !important;
}

/* body layout: title left, price right, meta under title */
.bk-fleet-body{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  grid-template-areas:
    "title price"
    "meta  price";
  column-gap:12px;
  row-gap:8px;
  align-items:start;
}
.bk-fleet-top{ display:contents !important; }

.bk-fleet-title{
  grid-area:title;
  font-weight:900;
  color:var(--bk-ink);
  font-size:16px;
  line-height:1.15;
  margin:0;
  min-width:0;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.bk-fleet-meta{
  grid-area:meta;
  display:flex;
  gap:14px;
  align-items:center;
  flex-wrap:wrap;
  margin:0 !important;
  min-width:0;
}

.bk-meta{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#111;
  font-size:13px;
  font-weight:800;
}

/* price on right */
.bk-fleet-price{
  grid-area:price;
  justify-self:end;
  align-self:start;
  display:inline-flex;
  align-items:flex-end;
  justify-content:flex-end;
  padding:0;
  border:0;
  background:transparent;
  min-width:0;
}

.bk-fleet-price-val{
  font-size:13px;
  font-weight:900;
  color:var(--bk-ink);
  white-space:nowrap;
  padding-bottom:2px;
  border-bottom:1px solid rgba(15,15,16,.28);
}


.bk-fleet .bk-fleet-price-val{ border-bottom-color: rgba(15,15,16,.18); }
.bk-fleet:hover .bk-fleet-price-val{ border-bottom-color: rgba(15,15,16,.40); }

/* -------------------------------------------------------
   Instant tap feedback (CSS-only)
   Makes selection feel immediate even if JS/price is slow
-------------------------------------------------------- */

/* remove the default focus ring but keep a premium focus state */
.bk-fleet:focus{ outline:none; }

/* on tap/click (instant) */
.bk-fleet:active{
  border-color: rgba(15,15,16,.75) !important;
  background: linear-gradient(180deg, rgba(15,15,16,.04), rgba(255,255,255,0)) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.10), inset 0 0 0 2px rgba(15,15,16,.85) !important;
  transform:none;
}

/* when it receives focus (mobile taps give focus) */
.bk-fleet:focus{
  border-color: rgba(15,15,16,.75);
  box-shadow: 0 18px 42px rgba(0,0,0,.10), inset 0 0 0 2px rgba(15,15,16,.85), 0 0 0 4px rgba(191,156,96,.18);
}

/* left rail for active/focus too (same as selected) */
.bk-fleet:active::before,
.bk-fleet:focus::before{
  content:"";
  position:absolute;
  left:0;
  top:14px;
  bottom:14px;
  width:4px;
  border-radius:999px;
  background: rgba(15,15,16,.90);
}

/* disabled should never “flash” active look */
.bk-fleet.is-disabled:active,
.bk-fleet.is-disabled:focus{
  box-shadow:none !important;
  border-color: rgba(15,15,16,.14) !important;
  background:#fff !important;
}
.bk-fleet.is-disabled:active::before,
.bk-fleet.is-disabled:focus::before{
  content:none !important;
}

/* tablet: keep 2 columns, just tighter */
@media (max-width: 991.98px){
  .bk-fleet{
    grid-template-columns:140px minmax(0, 1fr);
    padding:14px;
    min-height:124px;
  }
  .bk-fleet-media{
    width:140px;
    height:86px;
  }
}

/* mobile: 1 column list, image on top, title+price row preserved */
@media (max-width: 575.98px){
  .bk-fleet-grid{
    grid-template-columns:1fr;
  }

  .bk-fleet{
    grid-template-columns:1fr;
    gap:10px;
    padding:12px;
    min-height:0;
    overflow:hidden; /* safe */
  }

  .bk-fleet-media{
    width:100%;
    height:120px;   /* IMPORTANT: fixed height prevents “thin strip” */
    border-radius:14px;
    background:rgba(15,15,16,.02) !important;
    border:1px solid rgba(15,15,16,.08) !important;
  }

  .bk-fleet-media img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }

  .bk-fleet-body{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "title price"
      "meta  price";
  }

  .bk-fleet-price-val{
    font-size:13.5px;
  }
}

/* touch devices: don’t let hover override selected look */
@media (hover: none) and (pointer: coarse){
  .bk-fleet:hover{ transform:none !important; box-shadow:none !important; }
  .bk-fleet:hover .bk-fleet-price-val{ border-bottom-color: rgba(15,15,16,.18) !important; }
}

/* -------------------------------------------------------
   CHILD SEAT ROW
-------------------------------------------------------- */
.bk-childseat{
  margin-top:12px;
  padding:12px;
  border-radius:16px;
  border:1px solid rgba(15,15,16,.10);
  background:var(--bk-stone);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
@media (max-width: 991.98px){
  .bk-childseat{ flex-direction:column; align-items:stretch; }
}
.bk-childseat-title{ font-weight:850; color:var(--bk-ink); font-size:14px; }
.bk-childseat-sub{ color:var(--bk-muted); font-size:13px; margin-top:4px; }

.bk-counter-inline{
  display:grid;
  grid-template-columns:40px 78px 40px;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
}
.bk-counter-inline .bk-ct-btn{ height:38px; border-radius:12px; }
.bk-counter-inline .bk-ct-val{
  height:38px;
  line-height:38px;
  border-radius:12px;
  width:78px;
}

/* -------------------------------------------------------
   PHONE
-------------------------------------------------------- */
.bk-phone{
  display:grid;
  grid-template-columns: 86px 1fr;
  gap:10px;
  align-items:center;
}
.bk-phone .bk-cc{
  text-align:center;
  padding:10px 10px;
  font-weight:850;
}
@media (max-width: 430px){
  .bk-phone{ grid-template-columns:78px 1fr; gap:8px; }
  .bk-phone .bk-cc{ padding:10px 8px; }
}

/* -------------------------------------------------------
   EMPTY STATE
-------------------------------------------------------- */
.bk-empty{
  grid-column:1 / -1;
  border:1px dashed rgba(15,15,16,.20);
  border-radius:14px;
  padding:14px;
  color:var(--bk-muted);
  background:rgba(15,15,16,.02);
}

/* -------------------------------------------------------
   FLATPICKR ALIGNMENT
-------------------------------------------------------- */
.flatpickr-calendar{
  border-radius:16px !important;
  border:1px solid rgba(15,15,16,.12) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.12) !important;
  overflow:hidden;
}
.flatpickr-day.selected,
.flatpickr-day.selected:hover{
  background:#111 !important;
  border-color:#111 !important;
}
.flatpickr-time input{ font-weight:900; }

/* -------------------------------------------------------
   Touch devices: do not let hover kill selection look
-------------------------------------------------------- */
@media (hover: none) and (pointer: coarse){
  .bk-fleet:hover{ transform:none !important; box-shadow:none !important; }
  .bk-fleet:hover .bk-fleet-price-val{ border-bottom-color: rgba(15,15,16,.18) !important; }
}

/* iOS Safari: stop "zoom on focus" by forcing 16px inputs */
@supports (-webkit-touch-callout: none) {
  .bk-field input,
  .bk-field select,
  .bk-field textarea,
  .bk-phone input {
    font-size: 16px !important;
  }

  /* optional: keep text rendering stable */
  html { -webkit-text-size-adjust: 100%; }
}

/* --- Mobile submit tap fix: prevent overlays stealing taps --- */
@media (max-width: 991.98px){
  /* keep summary under the form in stacking order */
  .bk-main{ position: relative; z-index: 5; }
  .bk-summary{ position: relative; z-index: 1; }

  /* map should never capture taps in mobile layout */
  #bkMap,
  #bkMap canvas,
  .maplibregl-canvas-container,
  .maplibregl-canvas{
    pointer-events: none !important;
  }

  /* make sure the footer actions are always tappable */
  .bk-actions,
  .bk-actions--submit,
  .bk-submit-split,
  #btnQuote,
  #btnBook{
    position: relative;
    z-index: 10;
    pointer-events: auto !important;
  }
}

.bk-fleet-category {
  margin-top: 2px;
  font-size: 12px;
  font-style: italic;
  color: rgba(0, 0, 0, 0.55);
  line-height: 1.2;
}
.bk-fleet-category {
  font-size: 11px;
  opacity: 0.6;
}