/* triponly mobile pass: transport (phones only, wrap everything in @media screen and (max-width: 767px)) */
/* ==========================================================================
   Car rental / Umrah transport (/cars, /car_booking) and shuttle / car hire
   (/shuttle, /shuttle/{id}, shuttle thank-you). Adapted from babumrah's
   mobile-sheets.css (car-page / car-book-page blocks) and car-search.css to
   triponly's older markup. Desktop untouched: every rule sits inside the
   max-width:767px block; the phone-only elements (.car-msum, .car-mobile-bar,
   .cb-price-summary, .cb-total, .sh-mfilter*) are display:none outside it.
   Side gutter 15px, no rounded buttons, brand yellow #FAC917.
   ========================================================================== */

.car-msum, .car-mobile-bar, .cb-total, .cb-price-summary, .sh-mfilter-btn, .sh-mfilter-head, .sh-mfilter-foot { display: none; }

/* ---- 1. /cars: transport results ---- */
@media screen and (max-width: 767px) {
	/* one 15px edge for every block; results first (custom.css reversed every .row, which also flipped the car order) */
	html body .car-page { padding-bottom: 72px; }
	html body .car-page > .t-container { padding: 0 15px !important; }
	html body .car-page > .t-container > .row { display: flex !important; flex-direction: column !important; width: auto !important; margin: 0 !important; }
	html body .car-page > .t-container > .row > .col-sm-3,
	html body .car-page > .t-container > .row > .col-sm-3 > .sidebar,
	html body .car-page > .t-container > .row > .col-sm-9 { display: contents !important; }
	html body .car-page .car-msum { order: 1; }
	html body .car-page .side-col { order: 2; display: none !important; }
	html body .car-page.car-search-open .side-col { display: block !important; }
	html body .car-page .lst-top { order: 3; }
	html body .car-page .listing-nav { order: 4; }
	html body .car-page #nav-tabContent { order: 5; }
	html body .car-page .cart-box { order: 6; }

	/* trip summary + Change */
	html body .car-page .car-msum { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid #e6e6e6; border-left: 4px solid #FAC917; padding: 10px 12px; margin: 12px 0 10px; }
	html body .car-page .car-msum-txt { flex: 1; min-width: 0; line-height: 1.3; }
	html body .car-page .car-msum-txt b { display: block; font-size: 14px; color: #313131; }
	html body .car-page .car-msum-txt span { display: block; font-size: 12.5px; color: #666; margin-top: 2px; }
	html body .car-page .car-msum-txt span i { color: #c79a00; margin-right: 3px; }
	html body .car-page .car-msum-edit { flex: none; background: #FAC917; border: 0; border-radius: 0; padding: 7px 12px; font-size: 13px; font-weight: 700; color: #313131; }
	html body .car-page.car-search-open .car-msum-edit { background: #313131; color: #fff; }

	/* search form (opened by Change) */
	html body .car-page .side-col { margin: 0 0 12px !important; padding: 12px !important; border-radius: 0 !important; min-width: 0 !important; width: 100% !important; max-width: 100% !important; }
	html body .car-page .side-col .car-rent-routes::before { display: none !important; }
	html body .car-page .side-col h2 { display: none; }
	html body .car-page .side-col .form-group { margin-bottom: 10px; }
	html body .car-page .side-col .sideSearchbtn { width: 100%; border-radius: 0 !important; height: 46px; }

	/* count; the sort bar does nothing on this page (no sort in CarController::car), so it is hidden on phones */
	html body .car-page .lst-top { margin: 0 0 8px !important; }
	html body .car-page .lst-top h2 { font-size: 15px !important; margin: 0 !important; }
	html body .car-page .listing-nav { display: none !important; }

	/* result cards: photo beside the name, features on one line, price + Select */
	html body .car-page .cars-list-render-html > .row { display: block !important; margin: 0 !important; width: auto !important; }
	html body .car-page .car-cols { display: grid !important; grid-template-columns: 112px minmax(0, 1fr); grid-template-areas: "img title" "img comp" "feat feat" "price btn"; align-items: center; max-width: 100% !important; padding: 0 !important; margin: 0 0 10px !important; background: #fff; border: 1px solid #e6e6e6; }
	html body .car-page .car-detail { display: contents !important; }
	html body .car-page .car-rental-img { grid-area: img; height: 76px !important; padding: 8px 4px 4px 8px !important; border: 0 !important; transition: none; }
	html body .car-page .transporter-logo { width: 30px !important; top: 8px !important; right: 8px !important; border-radius: 0 !important; }
	html body .car-page .car-detail h4 { grid-area: title; align-self: end; text-align: left !important; font-size: 16px !important; letter-spacing: 0 !important; color: #313131 !important; padding: 10px 44px 0 6px; }
	html body .car-page .car-detail .trans_n { grid-area: comp; align-self: start; text-align: left !important; font-size: 12px !important; letter-spacing: 0 !important; padding: 2px 44px 0 6px; }
	html body .car-page .car-detail .route_n { display: none !important; }
	html body .car-page .car-detail ul { grid-area: feat; display: flex !important; flex-wrap: wrap; gap: 4px 12px; padding: 8px 12px 8px !important; margin: 0 !important; border-bottom: 1px solid #eee; }
	html body .car-page .car-detail ul li { flex: none !important; min-width: 0 !important; padding: 0 !important; font-size: 12px !important; }
	html body .car-page .car-detail ul li span { top: 1px !important; margin-left: 2px; }
	html body .car-page .car-detail .car-price { grid-area: price; text-align: left !important; font-size: 21px !important; color: #313131 !important; padding: 8px 12px 10px; margin: 0 !important; }
	html body .car-page .car-detail .addToCart { grid-area: btn; justify-self: end; width: auto !important; min-width: 112px; margin: 0 12px 0 0 !important; padding: 10px 16px !important; border-radius: 0 !important; font-size: 14px !important; position: static !important; }
	html body .car-page .car-detail .addToCart { margin: 8px 12px 10px 0 !important; }

	/* cart (target of the bar's total) */
	html body .car-page .cart-box { margin: 6px 0 12px !important; border-radius: 0 !important; scroll-margin-top: 70px; }
	html body .car-page .reserve-now-box .reserve-btn { border-radius: 0 !important; }

	/* bottom bar: cart total + Reserve, above the bottom nav */
	html body .car-page .car-mobile-bar { display: flex; align-items: center; gap: 10px; position: fixed; left: 0; right: 0; bottom: calc(58px + env(safe-area-inset-bottom, 0px)); z-index: 1000; background: #313131; color: #fff; padding: 8px 15px; box-shadow: 0 -4px 12px rgba(0, 0, 0, .15); }
	html body .car-page .car-mobile-bar .cmb-total { flex: 1; min-width: 0; line-height: 1.2; color: #fff; text-decoration: none; }
	html body .car-page .car-mobile-bar .cmb-total small { display: block; font-size: 11.5px; color: #ccc; }
	html body .car-page .car-mobile-bar .cmb-total b { font-size: 17px; color: #fff; }
	html body .car-page .car-mobile-bar .reserve-btn { flex: none; background: #FAC917; border: 0; border-radius: 0; padding: 11px 24px; font-size: 15px; font-weight: 700; color: #313131; }
	html body .car-page .car-mobile-bar.is-empty .reserve-btn { background: #555; color: #aaa; }
}

/* ---- 2. /car_booking: details on top, short form, price summary + sticky Book bar ---- */
@media screen and (max-width: 767px) {
	html body section.hts-Section.car-book-page { padding-top: 12px !important; }
	html body section.hts-Section.car-book-page > .t-container { padding: 0 15px !important; }
	html body section.hts-Section.car-book-page > .t-container > .row { display: flex !important; flex-direction: column !important; margin: 0 !important; }
	html body section.hts-Section.car-book-page > .t-container > .row > .col-sm-3 { display: contents !important; }
	html body section.hts-Section.car-book-page > .t-container > .row > .col-sm-3 > .card:nth-child(1) { order: 1; margin: 0 0 10px !important; }
	html body section.hts-Section.car-book-page > .t-container > .row > .col-sm-3 > .card:nth-child(2) { display: none !important; }
	html body section.hts-Section.car-book-page > .t-container > .row > .col-sm-9 { order: 3; width: 100% !important; max-width: 100% !important; flex: none !important; padding: 0 !important; margin: 0 !important; }
	html body .car-book-page .sp-s1 { display: none; }

	/* booking details card */
	html body .car-book-page .card-new { border-radius: 0 !important; border: 1px solid #e6e6e6 !important; }
	html body .car-book-page .card-new .card-header { padding: 8px 12px !important; font-size: 14px !important; border-radius: 0 !important; }
	html body .car-book-page .card-new .card-body { padding: 8px 12px 4px !important; }
	html body .car-book-page .card-new .card-footer { padding: 8px 12px !important; font-size: 13px; }
	html body .car-book-page .cdine { display: flex !important; justify-content: space-between; gap: 10px; margin: 0 0 6px !important; padding: 0 !important; border: 0 !important; font-size: 12.5px; }
	html body .car-book-page .cdine > div { width: auto !important; border: 0 !important; padding: 0 !important; margin: 0 !important; }
	html body .car-book-page .cdine span { display: block; font-size: 11px; color: #777; }
	html body .car-book-page .cdine b { font-size: 13.5px; }
	html body .car-book-page .lnegt-stay { display: inline-flex !important; gap: 4px; margin: 0 0 6px !important; font-size: 12.5px; }
	html body .car-book-page .traveltb { display: block !important; width: 100% !important; text-align: center; border-radius: 0 !important; margin-top: 6px; padding: 9px 12px !important; font-size: 13px !important; }

	/* form: flat, full width, fields in their real order */
	html body .car-book-page .enter-details > .card, html body .car-book-page .enter-details > .card > .card-body { border: 0 !important; box-shadow: none !important; padding: 0 !important; background: transparent !important; margin: 0 !important; }
	html body .car-book-page .row { flex-direction: row !important; }
	html body .car-book-page .entrstyle { font-size: 16px !important; margin: 4px 0 8px !important; }
	html body .car-book-page .acr { max-width: 100% !important; width: 100% !important; }
	html body .car-book-page .acr > .row, html body .car-book-page .setFormFont { display: flex !important; flex-direction: column !important; margin: 0 !important; }
	html body .car-book-page .acr [class*="col-"], html body .car-book-page .setFormFont > [class*="col-"] { width: 100% !important; max-width: 100% !important; flex: none !important; padding: 0 !important; }
	html body .car-book-page .ac-account { margin-left: -15px; margin-right: -15px; }
	html body .car-book-page .form-group { margin: 0 0 10px !important; }
	html body .car-book-page label { font-size: 12.5px !important; margin: 0 0 3px !important; font-weight: 600; }
	html body .car-book-page .form-control { height: 46px !important; border-radius: 0 !important; font-size: 14px !important; padding: 8px 12px !important; }
	html body .car-book-page textarea.form-control { height: 58px !important; min-height: 0; resize: none; }
	html body .car-book-page .gratDv { background: transparent !important; padding: 0 !important; margin: 6px 0 0 !important; border: 0 !important; }
	html body .car-book-page .bedCh { background: #fff; border: 1px solid #e6e6e6; border-left: 4px solid #FAC917; border-radius: 0 !important; padding: 10px 12px 2px !important; margin: 0 0 10px !important; box-shadow: none !important; }
	html body .car-book-page .bedCh .entrstyle { font-size: 14.5px !important; margin: 0 0 8px !important; padding: 0 0 6px !important; }
	html body .car-book-page .enter-details .card-body > br { display: none; }
	html body .car-book-page .lbDvChk { font-size: 12px; line-height: 1.45; color: #555; margin: 4px 0 10px !important; }
	html body .car-book-page .lbDvChk p { margin: 0; }

	/* price summary just above the confirm bar */
	html body .car-book-page .cb-price-summary { display: block; background: #fff; border: 1px solid #e6e6e6; border-top: 3px solid #FAC917; padding: 10px 12px; margin: 6px 0 10px; }
	html body .car-book-page .cb-price-summary .entrstyle { margin: 0 0 6px !important; font-size: 15px !important; }
	html body .car-book-page .cps-row, html body .car-book-page .cps-total { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; padding: 4px 0; }
	html body .car-book-page .cps-total { border-top: 1px dashed #ddd; margin-top: 4px; padding-top: 8px; font-weight: 700; font-size: 16px; }
	html body .car-book-page .cps-total small { font-weight: 400; font-size: 11px; color: #777; }

	/* confirm bar: edge to edge, stays above the bottom nav until its own place is reached */
	html body section.hts-Section.car-book-page .enter-details .card-body > .text-right { position: sticky; bottom: calc(58px + env(safe-area-inset-bottom, 0px)); z-index: 1000; display: flex !important; align-items: center; gap: 12px; background: #fff; border-top: 1px solid #e6e6e6; box-shadow: 0 -4px 12px rgba(0, 0, 0, .08); margin: 0 -15px 12px !important; width: auto !important; max-width: none !important; padding: 8px 15px !important; text-align: left !important; }
	html body .car-book-page .cb-total { display: block; line-height: 1.15; flex: none; }
	html body .car-book-page .cb-total small { display: block; font-size: 11px; color: #777; }
	html body .car-book-page .cb-total b { font-size: 18px; color: #313131; }
	html body .car-book-page .text-right .timbtn { flex: 1; width: auto !important; height: 48px; margin: 0 !important; border-radius: 0 !important; font-size: 15px !important; }
}

/* ---- 3. /shuttle: car hire results (filters in a bottom sheet) ---- */
.sh-mfilter-backdrop { display: none; }
@media screen and (max-width: 767px) {
	html body .shuttle-page > .t-container { padding: 0 15px !important; }
	html body .shuttle-page > .t-container > .row { margin: 0 !important; }
	html body .shuttle-page > .t-container > .row > [class*="col-"] { padding: 0 !important; }
	html body .shuttle-page .row.mt-5 { margin-top: 10px !important; }

	/* search summary: from -> to on one line, Edit at the right */
	html body .shuttle-page .rent-search-bx { margin: 12px 0 0 !important; padding: 10px 12px !important; border-radius: 0 !important; }
	html body .shuttle-page .rent-search-bx > .row { flex-wrap: nowrap !important; margin: 0 !important; align-items: center; }
	html body .shuttle-page .rent-search-bx > .row > div { padding: 0 !important; width: auto !important; max-width: none !important; }
	html body .shuttle-page .rent-search-bx .col-sm-10 { flex: 1 1 auto !important; min-width: 0; }
	html body .shuttle-page .rent-search-bx .col-sm-10 > div:not(.pl-5) { flex: 1 1 0; min-width: 0; }
	html body .shuttle-page .rent-search-bx .pl-5 { padding: 0 8px !important; flex: none; }
	html body .shuttle-page .rent-search-bx .col-sm-2 { flex: none !important; padding-left: 8px !important; }
	html body .shuttle-page .rent-search-bx h5 { font-size: 13px !important; line-height: 1.25; margin: 0 0 2px !important; }
	html body .shuttle-page .rent-search-bx p { font-size: 11.5px !important; margin: 0 !important; }
	html body .shuttle-page .rent-search-bx h5 { overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; }
	html body .shuttle-page .searchAgain.btn { border-radius: 0 !important; padding: 7px 12px !important; }
	html body .shuttle-page .rent-search-bx-2 { margin-top: 12px !important; border-radius: 0 !important; }
	html body .shuttle-page .rent-search-bx-2 .fsearchbtn { border-radius: 0 !important; width: 100%; }
	html body .shuttle-page .rent-search-bx-2 { padding: 12px !important; }
	html body .shuttle-page .rent-search-bx-2 .shuttleLoc { flex-wrap: wrap !important; }
	html body .shuttle-page .rent-search-bx-2 .shuttleLoc .flight-form, html body .shuttle-page .rent-search-bx-2 .shuttleLoc .flight-to { flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; }
	html body .shuttle-page .rent-search-bx-2 .shuttleLoc .flight-icon { display: none !important; }
	html body .shuttle-page .rent-search-bx-2 .retrnul { display: flex !important; flex-wrap: wrap; gap: 8px 12px; padding: 0 !important; }
	html body .shuttle-page .rent-search-bx-2 .retrnul li { max-width: 100%; margin: 0 !important; padding: 0 !important; }
	html body .shuttle-page .rent-search-bx-2 .retrnul li.sp { display: none !important; }
	html body .shuttle-page .rent-search-bx-2 .retrnul .ckContainer { white-space: nowrap; }

	/* count + Filters button */
	html body .shuttle-page .lst-top { display: flex !important; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 8px !important; }
	html body .shuttle-page .lst-top h2 { font-size: 15px !important; margin: 0 !important; }
	html body .shuttle-page .lst-top .lst-right { display: none !important; }
	html body .shuttle-page .sh-mfilter-btn { display: inline-flex; align-items: center; gap: 6px; flex: none; background: #fff; border: 1px solid #313131; border-radius: 0; padding: 7px 14px; font-size: 13px; font-weight: 700; color: #313131; }

	/* sort: one row of chips */
	html body .shuttle-page .listing-nav { margin: 0 0 10px !important; }
	html body .shuttle-page .listing-nav .property-ul { display: flex !important; flex-wrap: nowrap !important; gap: 6px; padding: 0 !important; margin: 0 !important; border: 0 !important; }
	html body .shuttle-page .listing-nav .property-ul li { flex: 1 1 0 !important; min-width: 0; margin: 0 !important; padding: 0 !important; border: 0 !important; }
	html body .shuttle-page .listing-nav .property-ul .nav-link { padding: 8px 4px !important; font-size: 12px !important; line-height: 1.2; border: 1px solid #ddd !important; border-radius: 0 !important; white-space: normal; height: 100%; display: flex; align-items: center; justify-content: center; }
	html body .shuttle-page .listing-nav .property-ul .nav-link.active { background: #FAC917 !important; border-color: #FAC917 !important; color: #313131 !important; }

	/* filters: bottom sheet above the nav, applied on change */
	html body .shuttle-page .left-col-3 { display: none !important; }
	html body .shuttle-page.sh-filters-open .left-col-3 { display: block !important; position: fixed; left: 0; right: 0; bottom: 0; max-height: 85vh; overflow-y: auto; -webkit-overflow-scrolling: touch; z-index: 1003; background: #fff; padding: 0 !important; width: auto !important; max-width: none !important; box-shadow: 0 -6px 24px rgba(0, 0, 0, .2); }
	html body .shuttle-page.sh-filters-open .sh-mfilter-backdrop { display: block; position: fixed; inset: 0; z-index: 1002; background: rgba(0, 0, 0, .45); }
	html body.sh-noscroll { overflow: hidden !important; }
	html body .shuttle-page .sh-mfilter-head { display: flex; align-items: center; justify-content: space-between; position: sticky; top: 0; z-index: 2; background: #fff; border-bottom: 1px solid #eee; padding: 12px 15px; font-size: 16px; }
	html body .shuttle-page .sh-mfilter-head .sh-mfilter-close { background: none; border: 0; font-size: 20px; line-height: 1; padding: 2px 4px; color: #313131; }
	html body .shuttle-page .sh-mfilter-foot { display: block; position: sticky; bottom: 0; z-index: 2; background: #fff; border-top: 1px solid #eee; padding: 10px 15px calc(10px + env(safe-area-inset-bottom, 0px)); }
	html body .shuttle-page .sh-mfilter-foot .sh-mfilter-close { width: 100%; height: 46px; background: #FAC917; border: 0; border-radius: 0; font-weight: 700; font-size: 15px; color: #313131; }
	html body .shuttle-page .left-col-3 .sidebar { padding: 0 15px !important; margin: 0 !important; }
	html body .shuttle-page .left-col-3 .dis-2 { margin-top: 6px !important; }
	html body .shuttle-page .left-col-3 .filterBox > h2 { display: none; }
	html body .shuttle-page .left-col-3 .starBox, html body .shuttle-page .left-col-3 .filterBox { margin: 0 !important; padding: 10px 0 !important; border-bottom: 1px solid #f0f0f0; }
	html body .shuttle-page .left-col-3 .filter-uls { display: flex !important; flex-wrap: wrap; gap: 2px 16px; margin: 0 !important; }
	html body .shuttle-page .left-col-3 .filter-uls li { margin: 0 !important; }

	/* result cards: photo beside the name, features as a compact grid, price + Select */
	html body .shuttle-page ul.lstTbs { margin: 0 !important; padding: 0 !important; }
	html body .shuttle-page ul.lstTbs > li { margin: 0 0 10px !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; }
	html body .shuttle-page ul.lstTbs .lst-D { display: grid !important; grid-template-columns: 104px minmax(0, 1fr); grid-template-areas: "img head" "pack pack"; padding: 0 !important; margin: 0 !important; background: #fff; border: 1px solid #e6e6e6 !important; border-radius: 0 !important; box-shadow: none !important; }
	html body .shuttle-page ul.lstTbs .lst-Dleft { grid-area: img; width: auto !important; max-width: none !important; padding: 10px 0 0 10px !important; }
	html body .shuttle-page ul.lstTbs .lst-Dleft .lftig.ve-img, html body .shuttle-page ul.lstTbs .lst-Dleft .lftig.ve-img a { display: block; height: 74px !important; width: 94px !important; margin: 0 !important; }
	html body .shuttle-page ul.lstTbs .lst-Dleft .lftig.ve-img img { width: 94px !important; height: 74px !important; object-fit: contain; border-radius: 0 !important; }
	html body .shuttle-page ul.lstTbs .lst-Dright { display: contents !important; }
	html body .shuttle-page ul.lstTbs .nightDs { grid-area: head; display: flex !important; align-items: flex-start; gap: 8px; padding: 10px 10px 0 10px !important; margin: 0 !important; min-width: 0; }
	html body .shuttle-page ul.lstTbs .nightD-left { flex: 1; min-width: 0; width: auto !important; }
	html body .shuttle-page ul.lstTbs .nightD-right { flex: none; width: auto !important; }
	html body .shuttle-page ul.lstTbs .ve-supplier img { width: 56px !important; height: auto !important; }
	html body .shuttle-page ul.lstTbs .nightTitee { font-size: 15px !important; margin: 0 0 4px !important; line-height: 1.25; }
	html body .shuttle-page ul.lstTbs .detail-mp { margin: 0 !important; }
	html body .shuttle-page ul.lstTbs .detail-mp p { font-size: 10.5px !important; padding: 1px 6px !important; margin: 0 4px 2px 0 !important; border-radius: 0 !important; }
	html body .shuttle-page ul.lstTbs .nt-pack { grid-area: pack; display: block !important; min-height: 0 !important; padding: 8px 10px 10px !important; margin: 0 !important; }
	html body .shuttle-page ul.lstTbs .nt-l, html body .shuttle-page ul.lstTbs .nt-r { min-height: 0 !important; height: auto !important; width: 100% !important; max-width: none !important; padding: 0 !important; }
	html body .shuttle-page ul.lstTbs .ve-spc { display: grid !important; grid-template-columns: 1fr 1fr; gap: 3px 10px; padding: 0 0 8px !important; margin: 0 !important; border-bottom: 1px solid #eee; }
	html body .shuttle-page ul.lstTbs .ve-spc li { width: auto !important; margin: 0 !important; font-size: 12px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	/* pick-up / drop-off is the same on every card and already in the summary at the top */
	html body .shuttle-page ul.lstTbs .ve-terminals { display: none !important; }
	html body .shuttle-page ul.lstTbs .pr-package, html body .shuttle-page ul.lstTbs .pnprice { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
	html body .shuttle-page ul.lstTbs .pnprice { display: flex !important; align-items: center; justify-content: space-between; gap: 10px; padding-top: 8px !important; }
	html body .shuttle-page ul.lstTbs .pson { text-align: left !important; margin: 0 !important; }
	html body .shuttle-page ul.lstTbs .pson b { font-size: 20px !important; line-height: 1.1; }
	html body .shuttle-page ul.lstTbs .pson b span { font-size: 11px !important; font-weight: 400; color: #777; }
	html body .shuttle-page ul.lstTbs .sd-pack { margin: 0 !important; flex: none; }
	html body .shuttle-page ul.lstTbs .package-select-btn { display: inline-block; border-radius: 0 !important; padding: 10px 16px !important; font-size: 14px !important; margin: 0 !important; }
	html body .shuttle-page .seeMoreVehicle { border-radius: 0 !important; padding: 9px 26px !important; }
	html body .shuttle-page .tab-content .text-center.pb-5 { padding-bottom: 24px !important; }
}

/* ---- 4. /shuttle/{id}: car hire booking (vehicle, short form, sticky Total + Continue) ---- */
@media screen and (max-width: 767px) {
	html body section.flights-Section.shuttle-book-page { padding: 12px 0 0 !important; }
	html body .shuttle-book-page > .t-container { padding: 0 15px !important; overflow: visible !important; overflow-x: clip !important; }
	html body .shuttle-book-page > .t-container > .row { display: flex !important; flex-direction: column !important; margin: 0 !important; }
	html body .shuttle-book-page > .t-container > .row > .col-sm-9 { order: 1; }
	html body .shuttle-book-page > .t-container > .row > .col-sm-3 { order: 2; }
	html body .shuttle-book-page > .t-container > .row > [class*="col-"] { width: 100% !important; max-width: 100% !important; flex: none !important; padding: 0 !important; }

	/* sign-in notice */
	html body .shuttle-book-page .loginFirstToContinue { display: block !important; margin: 0 0 12px !important; padding: 10px 12px !important; border-radius: 0 !important; }
	html body .shuttle-book-page .loginFirstToContinue p { width: auto !important; font-size: 12.5px !important; line-height: 1.45; margin: 0 0 8px !important; }
	html body .shuttle-book-page .loginFirstToContinue > div { display: flex; gap: 8px; margin: 0 !important; }
	html body .shuttle-book-page .loginFirstToContinue a { flex: 1; text-align: center; border-radius: 0 !important; margin: 0 !important; padding: 8px 10px !important; }

	/* cards */
	html body .shuttle-book-page .card { border-radius: 0 !important; margin-bottom: 12px !important; }
	html body .shuttle-book-page .card-header { padding: 0 12px !important; border-radius: 0 !important; }
	html body .shuttle-book-page .card-header .panel-deal-row { padding: 10px 0 !important; }
	html body .shuttle-book-page .card-header .row { margin: 0 !important; }
	html body .shuttle-book-page .card-header [class*="col-"] { padding: 0 !important; }
	html body .shuttle-book-page .card-header h3 { font-size: 16px !important; margin: 0 !important; }
	html body .shuttle-book-page .card-body { padding: 12px !important; }

	/* vehicle: photo beside the name */
	html body .shuttle-book-page .col-sm-9 > .card:first-child .card-body > .d-flex { gap: 12px; align-items: flex-start; }
	html body .shuttle-book-page .col-sm-9 > .card:first-child .card-body > .d-flex > img.imageReload { flex: 0 0 92px; width: 92px !important; height: 72px !important; object-fit: contain; margin: 0 !important; }
	html body .shuttle-book-page .col-sm-9 > .card:first-child .card-body > .d-flex > div { flex: 1; min-width: 0; }
	html body .shuttle-book-page .car_name_h3 { font-size: 16px !important; line-height: 1.25; margin: 0 0 4px !important; }
	html body .shuttle-book-page .card-body .ve-spc { display: grid !important; grid-template-columns: 1fr; gap: 2px; }
	html body .shuttle-book-page .card-body .ve-spc li { width: auto !important; margin: 0 !important; font-size: 12px !important; }
	html body .shuttle-book-page .card-body .ve-terminals { display: flex !important; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0 0 !important; }
	html body .shuttle-book-page .card-body .ve-terminals .tairports { font-size: 11.5px !important; padding: 4px 8px !important; margin: 0 !important; }

	/* "why book" box */
	html body .shuttle-book-page .whoS { padding: 12px !important; margin: 0 0 12px !important; border-radius: 0 !important; }
	html body .shuttle-book-page .whoS h2, html body .shuttle-book-page .whoS h3 { font-size: 15px !important; margin: 0 0 8px !important; }
	html body .shuttle-book-page .whoS .bulletPoints { display: block !important; margin: 0 !important; padding: 0 !important; }
	html body .shuttle-book-page .whoS .bulletPoints li { position: relative; width: auto !important; margin: 0 0 4px !important; padding: 0 0 0 20px !important; font-size: 12.5px !important; }

	/* form */
	html body .shuttle-book-page form .card-body > .row { margin: 0 !important; }
	html body .shuttle-book-page form .card-body > .row > [class*="col-"] { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; padding: 0 !important; margin: 0 0 10px !important; }
	html body .shuttle-book-page form label { font-size: 12.5px !important; margin: 0 0 3px !important; font-weight: 600; }
	html body .shuttle-book-page form .form-control, html body .shuttle-book-page form .bootstrap-select > .dropdown-toggle { height: 46px !important; border-radius: 0 !important; font-size: 14px !important; }
	html body .shuttle-book-page .total_prbox { padding: 10px 12px !important; border-radius: 0 !important; }
	html body .shuttle-book-page .total_prbox h5 { font-size: 15px !important; margin: 0 !important; }
	html body .shuttle-book-page .total_prbox p { font-size: 18px !important; margin: 0 !important; text-align: right; line-height: 1.15; }

	/* sticky bar: Total + Continue / Sign-in, edge to edge above the bottom nav */
	html body .shuttle-book-page .sbmitDv { position: sticky; bottom: calc(58px + env(safe-area-inset-bottom, 0px)); z-index: 1000; display: flex !important; align-items: center; gap: 12px; background: #fff; border-top: 1px solid #e6e6e6; box-shadow: 0 -4px 12px rgba(0, 0, 0, .08); margin: 0 -15px 12px !important; padding: 8px 15px !important; width: auto !important; border-radius: 0 !important; }
	html body .shuttle-book-page .sbmitDv .lft-sbm { display: none !important; }
	html body .shuttle-book-page .sbmitDv .cb-total { display: block; flex: none; line-height: 1.15; text-align: left; }
	html body .shuttle-book-page .sbmitDv .cb-total small { display: block; font-size: 11px; color: #777; }
	html body .shuttle-book-page .sbmitDv .cb-total b { font-size: 17px; color: #313131; }
	html body .shuttle-book-page .sbmitDv .rht-sbm { flex: 1; margin: 0 !important; padding: 0 !important; width: auto !important; }
	html body .shuttle-book-page .sbmitDv .btn-sdmb { width: 100% !important; height: 48px; margin: 0 !important; border-radius: 0 !important; font-size: 15px !important; }

	/* trip summary (below the form) */
	html body .shuttle-book-page .perpson { padding: 12px !important; margin: 0 0 12px !important; border-radius: 0 !important; }
	html body .shuttle-book-page .perpson .row { margin: 0 !important; }
	html body .shuttle-book-page .perpson [class*="col-"] { padding: 0 !important; }
	html body .shuttle-book-page .perpson h3 { font-size: 14px !important; }
	html body .shuttle-book-page .perpson img { max-width: 70px; height: auto; }
	html body .shuttle-book-page .col-sm-3 .sp-s1 { display: none; }
	html body .shuttle-book-page .col-sm-3 > .bg-transparent { padding: 0 0 12px !important; }
	html body .shuttle-book-page .col-sm-3 > .bg-transparent .row { margin: 0 !important; display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 12px; }
	html body .shuttle-book-page .col-sm-3 > .bg-transparent [class*="col-"] { width: auto !important; max-width: none !important; padding: 0 !important; }
}

/* narrow phones (320-360) */
@media screen and (max-width: 360px) {
	html body .shuttle-page .rent-search-bx h5 { font-size: 12px !important; }
	html body .shuttle-page .rent-search-bx .pl-5 { padding: 0 5px !important; }
	html body .shuttle-page .listing-nav .property-ul .nav-link { font-size: 11px !important; padding: 7px 2px !important; }
}