/* MetroLimo Sys — frontend (scoped to .mls-quote; theme-independent) */
/* .mls-checkout added (#audit-2026-07) — .mls-field (used for its own fields below the
   checkout redesign, and now reused for the checkout page's own fields for platform-wide
   field consistency) reads the --mq-* names; without this bridge here too, those fields
   would silently fall back to --mq-*'s dark-theme-oriented literal defaults instead of
   this page's actual (light) theme colors. */
.mls-quote,.mls-abtn-wrap,.mls-account-btn,.mls-checkout{--mq-gold:var(--mls-accent,#F8B53F);--mq-gold2:color-mix(in srgb,var(--mls-accent,#F8B53F) 80%,white 20%);--mq-ink:var(--mls-ink,#f2ede1);--mq-mut:var(--mls-mut,#9b968b);--mq-line:var(--mls-line,rgba(255,255,255,.15));--mq-surface:var(--mls-surface,rgba(255,255,255,.05));--mq-surface-hover:var(--mls-surface-hover,rgba(255,255,255,.07))}
.mls-quote{max-width:680px;margin:0 auto;font-family:var(--mls-font);color:var(--mq-ink);
  background:var(--mls-card,linear-gradient(180deg,#161512,#0e0e0c));border:1px solid color-mix(in srgb,var(--mq-gold) 28%,transparent);border-radius:18px;
  padding:28px 26px;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.mls-quote *,.mls-book *,.mls-portal *{box-sizing:border-box}
.mls-eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--mq-gold);font-weight:600;margin-bottom:6px}
.mls-title{font-size:1.6em;font-weight:600;margin:0 0 16px;line-height:1.15}
.mls-steps{display:flex;gap:6px;margin-bottom:20px}
.mls-steps i{flex:1;height:3px;border-radius:3px;background:var(--mq-line,rgba(255,255,255,.12))}
.mls-steps i.on{background:linear-gradient(90deg,var(--mq-gold),var(--mq-gold2))}
.mls-field{margin-bottom:14px}
.mls-field label{display:block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mq-mut);font-weight:600;margin-bottom:6px}
.mls-req{color:var(--mq-gold)}
.mls-field input,.mls-field select,.mls-field textarea{width:100%;background:var(--mq-surface,rgba(255,255,255,.05));border:1px solid var(--mq-line,rgba(255,255,255,.15));
  border-radius:10px;padding:12px 14px;color:var(--mq-ink);font:inherit;font-size:15px;outline:none;transition:border-color .2s}
.mls-field input:focus,.mls-field select:focus,.mls-field textarea:focus{border-color:var(--mq-gold)}
.mls-field select option{background:var(--mls-card,#1a1916);color:var(--mq-ink)}
.mls-stime-wrap{display:flex;gap:8px}
.mls-stime-wrap .mls-stime-text{flex:1;min-width:0}
.mls-stime-wrap .mls-stime-native{flex:0 0 auto;width:118px;padding-left:8px;padding-right:8px}
/* Split date + time (mls-ui-kit.js MLSUI.dateTimeField) — always two real fields, the
   portal's own counterpart to .mls-stime-wrap above (used by the quote wizard's mls.js).
   Element-qualified selectors so they outrank .mls-field input's width:100% above. */
.mls-dt-time{display:flex;gap:8px;align-items:center}
.mls-dt-time input.mls-dt-time-text{flex:1;min-width:0}
.mls-dt-time input.mls-dt-time-native{flex:0 0 auto;width:118px;padding-left:8px;padding-right:8px}
.mls-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.mls-row{grid-template-columns:1fr}}
.mls-row3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px}
@media(max-width:520px){.mls-row3{grid-template-columns:1fr}}
.mls-chips{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mls-chip{background:var(--mq-surface,rgba(255,255,255,.05));border:1px solid var(--mq-line,rgba(255,255,255,.15));border-radius:12px;padding:14px;cursor:pointer;
  text-align:left;color:var(--mq-ink);font:inherit;font-size:14.5px;transition:border-color .15s,background .15s}
.mls-chip:hover{border-color:var(--mq-gold)}
.mls-chip.sel{border-color:var(--mq-gold);background:color-mix(in srgb,var(--mq-gold) 10%,transparent)}
.mls-chip-arrow{float:right;color:var(--mq-gold,var(--mls-accent,#F8B53F))}
.mls-addr-chips{display:flex;flex-wrap:wrap;gap:6px;margin:-6px 0 14px}
.mls-addr-chip{background:var(--mq-surface,rgba(255,255,255,.05));border:1px solid var(--mq-line,rgba(255,255,255,.15));border-radius:20px;padding:5px 12px;cursor:pointer;
  color:var(--mq-ink);font:inherit;font-size:12.5px;transition:border-color .15s,background .15s}
.mls-addr-chip:hover{border-color:var(--mq-gold);background:color-mix(in srgb,var(--mq-gold) 10%,transparent)}
.mls-btn{display:inline-block;background:linear-gradient(180deg,var(--mq-gold),var(--mq-gold2));color:#111;border:0;border-radius:10px;
  padding:14px 22px;font:inherit;font-weight:700;font-size:15px;cursor:pointer;transition:filter .2s}
.mls-btn:hover{filter:brightness(1.07)}
.mls-btn[disabled]{opacity:.55;cursor:default}
.mls-btn--ghost{background:transparent;color:var(--mq-mut);border:1px solid var(--mq-line,rgba(255,255,255,.2))}
.mls-btn--sm{display:inline-flex;align-items:center;justify-content:center;padding:0;font-size:18px;font-weight:600;line-height:1}
.mls-nav{display:flex;justify-content:space-between;align-items:center;margin-top:18px;gap:10px}
.mls-vehicles{display:flex;flex-direction:column;gap:12px}
.mls-veh{display:flex;gap:14px;align-items:center;background:var(--mq-surface,rgba(255,255,255,.04));border:1px solid var(--mq-line,rgba(255,255,255,.14));
  border-radius:14px;padding:14px 16px;cursor:pointer;transition:border-color .15s}
.mls-veh:hover{border-color:var(--mq-gold)}
.mls-veh img{width:96px;height:60px;object-fit:cover;border-radius:8px;background:#000}
.mls-veh-info{flex:1}
.mls-veh-name{font-weight:600;font-size:15.5px}
.mls-veh-cap{font-size:12px;color:var(--mq-mut);margin-top:2px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mls-veh-stat{display:inline-flex;align-items:center;gap:4px}
.mls-veh-stat svg{opacity:.75;flex:0 0 auto}
.mls-veh-minnote{font-size:11.5px;color:var(--mq-gold);margin-top:4px}
.mls-veh-price{font-size:22px;font-weight:700;color:var(--mq-gold);white-space:nowrap}
.mls-veh-price small{display:block;font-size:10.5px;color:var(--mq-mut);font-weight:400;text-align:right}
.mls-veh-unpriced{border-style:dashed}
.mls-veh-unpriced .mls-veh-price small{font-size:13px;font-weight:600;color:var(--mq-gold)}
.mls-stops .mls-stop{display:flex;gap:8px;margin-bottom:8px}
.mls-stops .mls-stop input{flex:1;min-width:0;width:auto;background:var(--mq-surface,rgba(255,255,255,.05));border:1px solid var(--mq-line,rgba(255,255,255,.15));
  border-radius:10px;padding:12px 14px;color:var(--mq-ink);font:inherit;font-size:15px;outline:none;transition:border-color .2s}
.mls-stops .mls-stop input:focus{border-color:var(--mq-gold)}
.mls-stops .mls-stop input::placeholder{color:var(--mq-mut);opacity:1}
.mls-stops .mls-stop button{background:none;border:1px solid var(--mq-line,rgba(255,255,255,.2));color:var(--mq-mut);border-radius:8px;padding:0 12px;cursor:pointer;font-size:16px;flex:0 0 auto}
.mls-stops .mls-stop button:hover{border-color:var(--mq-gold);color:var(--mq-gold)}
.mls-addlink{background:none;border:0;color:var(--mq-gold);font:inherit;font-size:13px;cursor:pointer;padding:0;text-decoration:underline}
.mls-check{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--mq-mut,var(--mls-mut,#9b968b));margin:10px 0;cursor:pointer}
.mls-check input{accent-color:var(--mq-gold,var(--mls-accent,#F8B53F));width:16px;height:16px;margin-top:2px;flex:0 0 auto}
.mls-check a{color:inherit;text-decoration:underline}
.mls-recur-box{background:var(--mq-surface,rgba(255,255,255,.05));border:1px solid var(--mq-line,rgba(255,255,255,.15));border-radius:12px;padding:14px 16px;margin:4px 0 14px}
.mls-recur-days{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.mls-recur-day{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:var(--mq-ink);cursor:pointer}
.mls-recur-day input{accent-color:var(--mq-gold,var(--mls-accent,#F8B53F))}
.mls-addons{display:flex;flex-direction:column;gap:4px}
.mls-addon-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--mq-line,rgba(255,255,255,.08))}
.mls-addon-row:last-child{border-bottom:0}
.mls-addon-name{font-size:14.5px;color:var(--mq-ink)}
.mls-addon-name em{color:var(--mq-mut);font-style:normal;font-size:12.5px}
.mls-qty{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.mls-qty button{width:30px;height:30px;border-radius:8px;background:none;border:1px solid var(--mq-line,rgba(255,255,255,.2));color:var(--mq-ink);font-size:16px;line-height:1;cursor:pointer;flex:0 0 auto}
.mls-qty button:hover{border-color:var(--mq-gold);color:var(--mq-gold)}
.mls-qty input{width:40px;text-align:center;background:var(--mq-surface,rgba(255,255,255,.05));border:1px solid var(--mq-line,rgba(255,255,255,.15));border-radius:8px;padding:6px 4px;color:var(--mq-ink);font:inherit;font-size:14px}
.mls-qty input::-webkit-inner-spin-button,.mls-qty input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.mls-quotebox{text-align:center;padding:16px 0}
.mls-price{font-size:46px;font-weight:700;color:var(--mq-gold);line-height:1}
.mls-price-note{color:var(--mq-mut);font-size:12.5px;margin-top:8px}
.mls-breakdown{margin:16px auto 0;max-width:420px;text-align:left;font-size:13px;color:var(--mq-mut)}
.mls-breakdown div{display:flex;justify-content:space-between;padding:4px 0;border-bottom:1px dashed var(--mq-line,rgba(255,255,255,.08))}
.mls-error{color:#f0a0a0;font-size:13px;margin-top:10px;display:none}
.mls-done{text-align:center;padding:18px 0}
.mls-done-ck{width:58px;height:58px;border-radius:50%;background:color-mix(in srgb,var(--mq-gold) 12%,transparent);border:1px solid var(--mq-gold);
  display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:26px;color:var(--mq-gold)}
.mls-done h3{margin:0 0 8px;font-size:22px;color:var(--mq-ink)}
.mls-done p{color:var(--mq-mut);font-size:14px;line-height:1.6;max-width:400px;margin:0 auto}
.mls-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.mls-loading{text-align:center;color:var(--mq-mut);padding:26px 0}
.mls-loading:before{content:"";display:block;width:28px;height:28px;border:3px solid color-mix(in srgb,var(--mq-gold) 25%,transparent);border-top-color:var(--mq-gold);
  border-radius:50%;margin:0 auto 12px;animation:mlqspin .8s linear infinite}
@keyframes mlqspin{to{transform:rotate(360deg)}}
/* Google Places autocomplete dropdown. Google appends .pac-container to <body>, OUTSIDE the
   widget, so the widget's scoped theme vars (mls- / mq- custom properties) never reach it — it would fall back
   to the wizard's original DARK colors even on a light form. Style it as a clean, theme-neutral
   light popover (Google's own default is light too) with the brand accent, so it matches the
   form regardless of where Google injects it. */
.pac-container{z-index:2147483647!important;background:#fff!important;border:1px solid rgba(0,0,0,.12);border-radius:12px;
  font-family:inherit;box-shadow:0 16px 42px rgba(0,0,0,.18);margin-top:4px;padding:4px 0;overflow:hidden}
.pac-item{padding:10px 14px;color:#1c2431;border-top:1px solid rgba(0,0,0,.06);cursor:pointer;font-size:14px;line-height:1.4}
.pac-item:first-child{border-top:0}
.pac-item:hover,.pac-item-selected{background:color-mix(in srgb,var(--mls-accent,#F8B53F) 15%,#fff)}
.pac-item-query{color:#1c2431}.pac-matched{color:var(--mls-accent,#b9832a);font-weight:700}.pac-icon{display:none}

/* ---- MetroLimo Sys: booking checkout + customer portal (theme-var driven) ---- */
.mls-book,.mls-portal{max-width:680px;margin:0 auto;font-family:var(--mls-font);color:var(--mls-ink,#f2ede1)}
/* My Trips portal is a data surface — give it room (checkout stays narrow). */
.mls-portal{max-width:min(1120px,92vw)}
.mls-portal .mls-qprice{display:flex;align-items:center;gap:12px;margin:2px 0 16px}
.mls-portal .mls-qprice-amt{font-size:1.9em;font-weight:800;line-height:1}
.mls-portal .mls-qform{margin-top:6px}
@media(min-width:760px){.mls-portal .mls-qactions .mls-btn{min-width:180px}}
.mls-bcard{background:var(--mls-card,#1a1916);border:1px solid var(--mls-line,rgba(255,255,255,.14));border-radius:18px;padding:26px 24px;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.mls-bhead h2{margin:4px 0 8px;font-size:24px;color:var(--mls-ink,#f2ede1)}
.mls-bhead p{color:var(--mls-mut,#9b968b);font-size:14px;margin:0 0 14px}
.mls-book .mls-eyebrow,.mls-portal .mls-eyebrow{color:var(--mls-accent,#F8B53F)}
.mls-btrip table{width:100%;border-collapse:collapse;margin:6px 0 14px}
.mls-btrip th{width:110px;text-align:left;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mls-mut,#9b968b);padding:6px 0;font-weight:600;vertical-align:top}
.mls-btrip td{font-size:14px;padding:6px 0;border-bottom:1px dashed var(--mls-line,rgba(255,255,255,.12))}
.mls-bprice{display:flex;gap:12px;margin:14px 0 18px;flex-wrap:wrap}
.mls-bprice>div{flex:1;min-width:150px;border:1px solid var(--mls-line,rgba(255,255,255,.14));border-radius:12px;padding:12px 14px}
.mls-bprice>div.acc{border-color:var(--mls-accent,#F8B53F);background:color-mix(in srgb,var(--mls-accent,#F8B53F) 10%,transparent)}
.mls-bprice span{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--mls-mut,#9b968b);margin-bottom:4px}
.mls-bprice b{font-size:22px;color:var(--mls-ink,#f2ede1)}
.mls-bprice>div.acc b{color:var(--mls-accent,#F8B53F)}
.mls-countdown{font-size:13px;color:var(--mls-mut,#9b968b);margin:-8px 0 14px}
.mls-countdown b{color:var(--mls-ink,#f2ede1);font-weight:600}
.mls-countdown.mls-countdown-soon{color:var(--mls-accent,#F8B53F)}
.mls-countdown.mls-countdown-soon b{color:var(--mls-accent,#F8B53F)}
.mls-socialproof{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--mls-mut,#9b968b);margin:-8px 0 14px;padding:6px 12px;border:1px solid var(--mls-line,rgba(255,255,255,.14));border-radius:999px}
#mls-card{background:#fff;border-radius:10px;padding:10px;min-height:44px}
.mls-book .mls-field label,.mls-portal .mls-field label{color:var(--mls-mut,#5f6368)}
.mls-book .mls-field input,.mls-portal .mls-field input{background:var(--mls-card,#f7f7f5);color:var(--mls-ink,#17181c);
  border:1px solid var(--mls-line,rgba(0,0,0,.14))}
.mls-book .mls-field input:focus,.mls-portal .mls-field input:focus{border-color:var(--mls-accent,#F8B53F)}
.mls-book .mls-btn,.mls-portal .mls-btn{width:100%;text-align:center;background:var(--mls-accent,#F8B53F)!important;color:#111!important}
.mls-portal .mls-btn--ghost{width:auto;background:transparent!important;color:var(--mls-mut,#9b968b)!important;border:1px solid var(--mls-line,rgba(255,255,255,.2))!important;padding:9px 16px;font-size:12.5px}
.mls-book .mls-addr-chip,.mls-portal .mls-addr-chip{color:var(--mls-ink,#17181c);border-color:var(--mls-line,rgba(0,0,0,.14))}
.mls-book .mls-addr-chip:hover,.mls-portal .mls-addr-chip:hover{border-color:var(--mls-accent,#F8B53F);background:rgba(248,181,63,.1)}
.mls-bfine{color:var(--mls-mut,#9b968b);font-size:12px;margin-top:10px}
.mls-berr{display:none;color:#e08585;font-size:13px;margin-top:12px}
.mls-wallets{margin-bottom:14px}
.mls-walletbtn{width:100%;height:44px;border-radius:10px;border:0;margin-bottom:8px;cursor:pointer}
.mls-walletdivider{display:flex;align-items:center;gap:10px;margin:10px 0;color:var(--mls-mut,#9b968b);font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.mls-walletdivider::before,.mls-walletdivider::after{content:'';flex:1;height:1px;background:var(--mls-line,rgba(255,255,255,.14))}
.mls-couponrow{display:flex;gap:8px}
.mls-couponrow input{flex:1;min-width:0}
.mls-couponrow .mls-btn{width:auto!important;flex:0 0 auto;padding:12px 18px}
.mls-couponmsg{font-size:12.5px;margin-top:8px;min-height:1em}
.mls-couponmsg-ok{color:#4caf7d}
.mls-couponmsg-bad{color:#e08585}
.mls-bdone{margin-top:16px;padding:14px 16px;border:1px solid var(--mls-accent,#F8B53F);border-radius:12px;background:color-mix(in srgb,var(--mls-accent,#F8B53F) 10%,transparent);font-size:14.5px;line-height:1.6}
.mls-bdone a{color:var(--mls-accent,#F8B53F)}
.mls-psec{margin:22px 0 10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mls-accent,#F8B53F)}
.mls-hubgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:4px 0 8px}
.mls-hubtile{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px 16px;border:1px solid var(--mls-line,rgba(127,127,127,.28));border-radius:12px;background:var(--mls-surface,rgba(127,127,127,.06));color:var(--mls-ink,inherit);text-decoration:none;font-weight:600;font-size:14px;transition:border-color .15s ease,transform .15s ease}
.mls-hubtile:hover,.mls-hubtile:focus{border-color:var(--mls-accent,#F8B53F);transform:translateY(-1px)}
.mls-hubtile-ic{font-size:22px;line-height:1}
.mls-trip{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:14px 16px;margin:10px 0;border:1px solid var(--mls-line,rgba(255,255,255,.14));border-radius:14px;font-size:14px}
.mls-tripnum{text-align:right;white-space:nowrap}
.mls-pill{display:inline-block;padding:2px 9px;border-radius:20px;font-size:10.5px;font-weight:600;letter-spacing:.04em;border:1px solid var(--mls-line,rgba(255,255,255,.2));color:var(--mls-mut,#9b968b)}
/* Status colors flow from the MLX semantic status system (mlx-tokens.css); the
   old hexes stay as var() fallbacks so nothing changes if the token tier is
   ever absent (#mlx-redesign). */
.mls-pill-confirmed,.mls-pill-completed,.mls-pill-converted{border-color:var(--mlx-st-ok-line,#4caf7d);color:var(--mlx-st-ok-ink,#4caf7d);background:var(--mlx-st-ok-tint,transparent)}
.mls-pill-quoted{border-color:var(--mlx-st-warn-line,#F8B53F);color:var(--mlx-st-warn-ink,#F8B53F);background:var(--mlx-st-warn-tint,transparent)}
.mls-pill-assigned{border-color:var(--mlx-st-info-line,#F8B53F);color:var(--mlx-st-info-ink,#F8B53F);background:var(--mlx-st-info-tint,transparent)}
.mls-pill-enroute{border-color:var(--mlx-st-live-line,#F8B53F);color:var(--mlx-st-live-ink,#F8B53F);background:var(--mlx-st-live-tint,transparent)}
.mls-pill-expired,.mls-pill-cancelled,.mls-pill-no_show,.mls-pill-lost{border-color:var(--mlx-st-danger-line,#c96a6a);color:var(--mlx-st-danger-ink,#c96a6a);background:var(--mlx-st-danger-tint,transparent)}
.mls-minibtn{display:inline-block;margin-top:4px;color:var(--mls-accent,#F8B53F);font-size:12.5px;text-decoration:none;border:1px solid var(--mls-accent,#F8B53F);border-radius:8px;padding:4px 10px;background:none;cursor:pointer;font-family:inherit}
.mls-upsell{margin:0 0 16px;padding:12px 15px;border:1px dashed var(--mls-accent,#F8B53F);border-radius:12px;font-size:13.5px;line-height:1.6;background:color-mix(in srgb,var(--mls-accent,#F8B53F) 7%,transparent)}
.mls-addstop{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.mls-addstop input{flex:1;min-width:180px;background:rgba(127,127,127,.08);border:1px solid var(--mls-line,rgba(255,255,255,.15));border-radius:8px;padding:8px 10px;color:var(--mls-ink,#f2ede1);font:inherit;font-size:13px}
.mls-rateprompt,.mls-rated{width:100%;margin-top:10px;padding-top:10px;border-top:1px dashed var(--mls-line,rgba(255,255,255,.14))}
.mls-stars{display:flex;gap:2px;margin:6px 0}
.mls-star{background:none;border:0;cursor:pointer;font-size:22px;line-height:1;color:var(--mls-mut,#9b968b);padding:2px}
.mls-star-on{color:var(--mls-accent,#F8B53F)}
.mls-ratecomment{width:100%;margin-top:6px;background:rgba(127,127,127,.08);border:1px solid var(--mls-line,rgba(255,255,255,.15));border-radius:8px;padding:8px 10px;color:var(--mls-ink,#f2ede1);font:inherit;font-size:13px;resize:vertical}
.mls-rateerr{margin-top:6px}
.mls-tipprompt{width:100%;margin-top:10px;padding-top:10px;border-top:1px dashed var(--mls-line,rgba(255,255,255,.14))}
.mls-tipamounts{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin:6px 0}
.mls-tipamt{min-width:44px}
.mls-tipamt-on{background:var(--mls-accent,#F8B53F);color:#1a1408}
.mls-tipcustom{width:90px;background:rgba(127,127,127,.08);border:1px solid var(--mls-line,rgba(255,255,255,.15));border-radius:8px;padding:6px 8px;color:var(--mls-ink,#f2ede1);font:inherit;font-size:13px}
.mls-tiperr{margin-top:6px}
/* Driver console — mobile-first cards with big tap targets */
.mls-drivecard{border:1px solid var(--mlx-line-soft,var(--mls-line,rgba(255,255,255,.14)));border-radius:var(--mlx-r-md,14px);padding:14px 16px;margin:12px 0;background:var(--mlx-surface-1,transparent);box-shadow:var(--mlx-shadow-1,none)}
.mls-drivetime{font-size:12px;letter-spacing:.05em;color:var(--mls-accent,#F8B53F);margin-bottom:6px;font-weight:600}
.mls-drivebody{font-size:14.5px;line-height:1.7}
.mls-drivebody a{color:var(--mls-accent,#F8B53F)}
.mls-drivebtns{display:flex;gap:10px;margin-top:12px}
.mls-drivebtns .mls-btn{flex:1;padding:15px 8px;font-size:15px;border-radius:12px}
.mls-statussel{background:rgba(127,127,127,.1);border:1px solid var(--mls-line,rgba(255,255,255,.2));color:var(--mls-ink,#f2ede1);border-radius:8px;padding:5px 8px;font-size:12px;margin-top:5px}
@media(max-width:560px){.mls-trip{flex-direction:column;align-items:flex-start}.mls-tripnum{text-align:left}}
/* Get Directions — tap-to-navigate, driver console only used curbside/one-handed, so it's a real tap target, not a text link */
.mls-directions{display:inline-flex;align-items:center;gap:5px;margin:4px 6px 0 0;padding:6px 12px;border:1px solid var(--mls-accent,#F8B53F);border-radius:20px;color:var(--mls-accent,#F8B53F);text-decoration:none;font-size:12.5px;font-weight:600}
.mls-drivebody a.mls-directions{color:var(--mls-accent,#F8B53F)}
.mls-drivecard .mls-drivetime{display:flex;align-items:center;justify-content:space-between}
/* Chauffeur app-shell pass (#pwa-audit) — day summary, sticky day headers, NEXT
   emphasis, Today|All segmented filter. Base styles here; the ≤700px block at the
   bottom of this file goes full-bleed. */
.mls-drivesummary{margin:4px 0 0;font-size:13px;color:var(--mls-mut,#6b7280)}
.mls-driveday{position:sticky;top:0;z-index:2;margin:18px 0 4px;padding:8px 0;background:var(--mls-popover-bg,#fff);font-size:var(--mlx-fs-label,11.5px);letter-spacing:.12em;text-transform:uppercase;color:var(--mls-mut,#6b7280);font-weight:700}
.mls-drivecard--next{position:relative;border-color:var(--mls-accent,#F8B53F);box-shadow:0 0 0 1px var(--mls-accent,#F8B53F),0 12px 40px var(--mlx-accent-glow,color-mix(in srgb,var(--mls-accent,#F8B53F) 18%,transparent))}
.mls-drivenext-chip{position:absolute;top:-9px;left:14px;background:var(--mls-accent,#F8B53F);color:var(--mlx-on-accent,#1a1a1a);font-size:10px;font-weight:800;letter-spacing:.1em;padding:2px 9px;border-radius:999px}
.mls-drivecard--next{overflow:visible}
.mls-driveseg{display:inline-flex;gap:0;margin:4px 0 6px;border:1px solid var(--mls-line,rgba(127,127,127,.3));border-radius:999px;overflow:hidden}
.mls-driveseg-btn{font:inherit;font-size:13px;font-weight:600;padding:8px 20px;border:0;background:transparent;color:var(--mls-mut,#6b7280);cursor:pointer}
.mls-driveseg-btn.on{background:var(--mls-accent,#F8B53F);color:#1a1a1a}
/* Chauffeur "My profile" card (#dispatch-v2) — self-serve photo + online-profile opt-in */
.mls-driveprofile{margin-top:22px;padding:16px;border:1px solid var(--mlx-line-soft,var(--mls-line,rgba(127,127,127,.2)));border-radius:var(--mlx-r-md,14px);background:var(--mlx-surface-1,transparent)}
.mls-driveprofile .mls-driveday{position:static;margin:0 0 12px;padding:0;background:transparent}
.mls-driveprofile-row{display:flex;align-items:center;gap:16px}
.mls-driveprofile-photo{width:72px;height:72px;flex:0 0 auto;border-radius:50%;overflow:hidden;background:var(--mlx-well,rgba(127,127,127,.12));border:2px solid var(--mls-accent,#F8B53F);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800;color:var(--mls-accent,#F8B53F)}
.mls-driveprofile-photo img{width:100%;height:100%;object-fit:cover;display:block}
.mls-driveprofile-acts{min-width:0}
.mls-driveprofile-toggle{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--mls-line,rgba(127,127,127,.16));font-size:13.5px;line-height:1.5;cursor:pointer}
.mls-driveprofile-toggle input{width:18px;height:18px;flex:0 0 auto;margin-top:1px;accent-color:var(--mls-accent,#F8B53F);cursor:pointer}
/* Chauffeur photo beside the name on the CUSTOMER'S live trip card (#dispatch-v2) */
.mls-chauf-photo{width:28px;height:28px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:7px;border:1px solid var(--mls-accent,#F8B53F)}
/* Install-the-app helper (#pwa-install-fix) — shared by all three surfaces via
   booking.js window.mlsInstallApp(): shown only when the browser offers no native
   install prompt (iOS always; Android when beforeinstallprompt never fired). Sits
   above every sheet/scrim (portal sheet z51, console sheet z51). */
.mls-install-help{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--mlx-scrim,rgba(10,12,18,.6))}
.mls-install-help-card{max-width:420px;width:100%;background:var(--mls-popover-bg,#fff);color:var(--mls-ink,#1e1e1e);border:1px solid var(--mls-line,rgba(127,127,127,.25));border-radius:var(--mlx-r-lg,18px);padding:22px 24px;box-shadow:0 24px 70px rgba(10,12,18,.45);font-family:var(--mls-font)}
.mls-install-help-card > b{display:block;font-size:17px;margin-bottom:10px} /* #mobile-fix — scope to the TITLE only; was hitting inline <b> in the steps, breaking each onto its own line */
.mls-install-help-card p{margin:0 0 10px;font-size:14.5px;line-height:1.55}
.mls-install-help-card .mls-ih-key{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 4px;border:1px solid var(--mls-line,rgba(127,127,127,.35));border-radius:6px;font-size:13px;vertical-align:middle}
.mls-install-help-card .mls-ih-note{color:var(--mls-mut,#6b7280);font-size:13px}
.mls-install-help-card .mls-btn{width:100%;margin-top:6px}
.mls-drv-install{display:block;width:100%;margin-top:14px;text-align:center;padding:12px}

/* ---- theme-defense layer: win against global theme button/heading styles ---- */
#mls-quote h2.mls-title{color:var(--mq-ink)!important;font-family:var(--mls-font)!important;font-size:1.6em!important;font-weight:600!important;line-height:1.15!important}
#mls-quote .mls-field label{color:var(--mq-mut)!important;font-family:var(--mls-font)!important}
#mls-quote button.mls-chip{background:var(--mq-surface,rgba(255,255,255,.05))!important;color:var(--mq-ink)!important;
  border:1px solid var(--mq-line,rgba(255,255,255,.15))!important;box-shadow:none!important;text-transform:none!important;
  letter-spacing:normal!important;border-radius:12px!important;padding:14px!important;line-height:1.4!important;font-family:var(--mls-font)!important;font-size:14.5px!important;font-weight:400!important}
#mls-quote button.mls-chip:hover{border-color:var(--mq-gold)!important;background:var(--mq-surface-hover,rgba(255,255,255,.07))!important}
#mls-quote button.mls-chip.sel{border-color:var(--mq-gold)!important;background:color-mix(in srgb,var(--mq-gold) 12%,transparent)!important}
#mls-quote .mls-btn{background:linear-gradient(180deg,var(--mq-gold),var(--mq-gold2))!important;color:#111!important;
  border:0!important;border-radius:10px!important;text-transform:none!important;letter-spacing:normal!important;font-family:var(--mls-font)!important}
#mls-quote .mls-btn--ghost{background:transparent!important;color:var(--mq-mut)!important;border:1px solid var(--mq-line,rgba(255,255,255,.2))!important}
#mls-quote input,#mls-quote select,#mls-quote textarea{background:var(--mq-surface,rgba(255,255,255,.05))!important;color:var(--mq-ink)!important;
  border:1px solid var(--mq-line,rgba(255,255,255,.15))!important;border-radius:10px!important;font-family:var(--mls-font)!important;font-size:15px!important}
#mls-quote input:focus,#mls-quote select:focus,#mls-quote textarea:focus{border-color:var(--mq-gold)!important;outline:none!important}
#mls-quote .mls-veh{color:var(--mq-ink)!important}
.mls-quote a.mls-btn{text-decoration:none!important}

/* ---- [metrolimo_account_button] signed-out inline sign-in dropdown ---- */
.mls-abtn-wrap{display:inline-block;position:relative;font-family:var(--mls-font)}
.mls-abtn-panel{display:none;position:absolute;top:calc(100% + 10px);left:0;z-index:100;width:290px;
  background:var(--mls-popover-bg,#1a1916)!important;border:1px solid color-mix(in srgb,var(--mq-gold) 28%,transparent);border-radius:14px;
  padding:18px 18px 16px;box-shadow:0 24px 60px rgba(0,0,0,.45);color:var(--mq-ink)}
.mls-abtn-panel.open{display:block}
.mls-abtn-panel .mls-field{margin-bottom:10px}
.mls-abtn-panel .mls-btn{width:100%;text-align:center;padding:11px 16px;font-size:13.5px}
.mls-abtn-err.show{display:block}
.mls-abtn-codewrap{margin-top:14px;padding-top:14px;border-top:1px solid var(--mq-line,rgba(255,255,255,.12))}

/* Keyboard accessibility — a visible focus ring on every custom interactive element,
   not just native inputs. Chrome/Safari/Firefox all support :focus-visible. */
.mls-quote button:focus-visible,.mls-quote a:focus-visible,
.mls-book button:focus-visible,.mls-book a:focus-visible,
.mls-portal button:focus-visible,.mls-portal a:focus-visible,
.mls-portal select:focus-visible,.mls-portal input:focus-visible,
.mls-abtn-wrap button:focus-visible,.mls-abtn-wrap a:focus-visible,.mls-abtn-wrap input:focus-visible{
  outline:2px solid var(--mls-accent,var(--mq-gold,#F8B53F));outline-offset:2px}

/* Non-blocking toast (driver/staff console feedback, replaces native alert) */
.mls-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);z-index:2147483000;
  max-width:90vw;padding:12px 20px;border-radius:12px;background:#1c2b22;color:#eafff2;font-size:14.5px;font-weight:600;
  box-shadow:0 16px 40px rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.mls-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.mls-toast-error{background:#3a1c1c;color:#ffe6e6}
/* Completed/closed trip card de-emphasis in the driver console (in-place status update) */
.mls-trip-done{opacity:.55}

/* Printing the portal page directly (e.g. Ctrl/Cmd+P) — hide chrome that makes no sense on
   paper (sign-in/sign-out, buttons, forms); the dedicated "Print receipt" link opens a
   purpose-built branded receipt page instead, this is just a sane fallback. */
@media print {
  .mls-portal .mls-btn,.mls-portal .mls-btn--ghost,.mls-portal .mls-minibtn,
  .mls-portal .mls-addstop,.mls-portal .mls-cancelwrap,.mls-portal .mls-rateprompt,
  .mls-portal .mls-rated,.mls-portal #mls-pcard-wrap,.mls-portal #mls-addr-wrap,
  .mls-portal .mls-statussel{display:none!important}
}
.mls-countdown-expired b{color:#c96a6a}

.mls-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Reduced-motion support (#130) — the spinning loading indicator and every
   micro-transition (border/hover/opacity) across the wizard/checkout/portal
   are disabled for anyone whose OS asks for less motion (vestibular-disorder
   accommodation, not just a preference). */
@media (prefers-reduced-motion: reduce) {
	.mls-quote *, .mls-book *, .mls-portal * { transition: none !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

/* Fleet showcase shortcode (#250) — deliberately unique "mls-fleet-" prefix,
   not reused from any other component, per the class-namespace-collision
   lesson (a shared prefix silently inherits unrelated page styles). */
.mls-fleet-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;margin:16px 0}
.mls-fleet-card{background:#0A0A0A;border:1px solid #2a2a2a;border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.mls-fleet-img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:#1a1a1a}
.mls-fleet-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px}
.mls-fleet-name{font-family:'Bodoni Moda',Georgia,serif;font-size:18px;color:#fff;font-weight:600}
.mls-fleet-cat{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:#F8B53F}
.mls-fleet-stats{display:flex;gap:12px;font-size:13px;color:#bbb;margin-top:2px}
.mls-fleet-price{font-size:14px;color:#fff;font-weight:600;margin-top:4px}
.mls-fleet-cta{margin-top:10px;display:inline-block;text-align:center;padding:9px 14px;border-radius:6px;background:#F8B53F;color:#111;font-weight:600;text-decoration:none;font-size:14px}
.mls-fleet-cta:hover{background:#D6B55D;color:#111}
.mls-fleet-empty{color:#999;text-align:center;padding:20px}
.mls-veh-preferred{outline:2px solid #F8B53F;outline-offset:2px}

/* Multi-leg itinerary (#19) — "sum of priced legs" running summary. */
.mls-itin-summary{background:color-mix(in srgb,var(--mq-gold) 7%,transparent);border:1px solid color-mix(in srgb,var(--mq-gold) 30%,transparent);border-radius:8px;padding:12px 14px;margin-bottom:16px}
.mls-itin-title{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--mq-gold,#F8B53F);margin-bottom:8px;font-weight:600}
.mls-itin-row{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--mq-ink,#eee);padding:3px 0}
.mls-itin-total{border-top:1px solid color-mix(in srgb,var(--mq-gold) 30%,transparent);margin-top:6px;padding-top:8px;font-weight:700;color:var(--mq-ink,#fff)}
.mls-itin-addleg{margin:10px 0}

/* Amenity picker (#18) — expandable checkbox list on each vehicle card. */
.mls-amenity-pick{margin:8px 0;flex:1 0 100%}
.mls-amenity-toggle{font-size:13px;color:var(--mq-gold,var(--mls-accent,#F8B53F));background:none;border:none;cursor:pointer;padding:4px 0;font-family:inherit}
.mls-amenity-list{display:none;padding:8px 0}
.mls-amenity-pick.open .mls-amenity-list{display:block}
.mls-amenity-item{display:block;padding:4px 0;font-size:13px;cursor:pointer}
.mls-amenity-item input{accent-color:var(--mq-gold,var(--mls-accent,#F8B53F));vertical-align:middle;margin-right:4px}
/* Tip prompt (#24) — percentage preset buttons on the contact step. */
.mls-tip-row{margin:12px 0}
.mls-tip-label{font-size:13px;display:block;margin-bottom:6px;color:var(--mq-mut,var(--mls-mut,#9b968b))}
.mls-tip-btns{display:flex;gap:6px;flex-wrap:wrap}
.mls-tip-btn{padding:6px 14px;border-radius:8px;border:1px solid var(--mq-line,rgba(128,128,128,.3));background:transparent;color:var(--mq-ink,#e0e0e0);cursor:pointer;font-size:13px;font-family:inherit}
.mls-tip-btn.active{background:var(--mq-gold,var(--mls-accent,#F8B53F));color:#1a1a1a;border-color:var(--mq-gold,var(--mls-accent,#F8B53F))}
/* Guest booking (#11) — toggle + extra name/email/phone fields. */
.mls-guest-toggle{margin:12px 0;font-size:13px;color:var(--mq-mut,var(--mls-mut,#9b968b))}
.mls-guest-toggle input{accent-color:var(--mq-gold,var(--mls-accent,#F8B53F));vertical-align:middle;margin-right:4px}
.mls-guest-fields{margin:8px 0;display:flex;flex-direction:column;gap:8px}

/* ---------------- [ml_hero_quote] hero/banner band ---------------- */
.mls-hero{background:linear-gradient(135deg,#12161c 0%,#0b0e12 100%);border-radius:16px;
  padding:clamp(20px,3vw,34px);display:grid;gap:22px;color:#f2ede1;box-shadow:0 20px 50px rgba(0,0,0,.28)}
.mls-hero-copy{max-width:60ch}
.mls-hero-h{margin:0 0 8px;font-size:clamp(22px,3.2vw,34px);line-height:1.08;color:#f6f2e8;font-weight:800;letter-spacing:-.01em}
.mls-hero-sub{margin:0;color:#b9b3a6;font-size:15px;line-height:1.5}
.mls-hero .mls-quote,.mls-hero .mls-hero-wizard{margin:0}
.mls-hero--center{justify-items:center;text-align:center}
.mls-hero--center .mls-hero-copy{margin-inline:auto}
@media (min-width:880px){
  .mls-hero--left{grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);align-items:center;gap:34px}
  .mls-hero--left .mls-hero-copy{align-self:center}
}

/* ============================================================================
   Premium Reservation Checkout (.mls-checkout) — 3.36.0
   Scoped 2-column booking workspace. Theme-harmony only: font: inherit and the
   plugin's --mls-* tokens (which themselves fall back to the active theme's
   accent/font via theme_css_vars()). No standalone hex except token fallbacks.
   ========================================================================== */
.mls-book:has(.mls-checkout){max-width:1040px}
.mls-checkout{font-family:inherit;color:var(--mls-ink,inherit)}
.mls-checkout *{font-family:inherit;box-sizing:border-box}
.mls-co-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start}
.mls-co-main{min-width:0}

/* Header + metadata badges */
.mls-co-head{margin-bottom:20px}
.mls-co-title{margin:2px 0 0;font:inherit;font-size:1.7em;font-weight:800;line-height:1.15}
.mls-co-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.mls-co-tag{display:inline-flex;align-items:center;gap:7px;font-size:.86em;padding:5px 12px;border:1px solid var(--mls-line,rgba(127,127,127,.28));border-radius:999px;color:inherit}
.mls-co-tag em{font-style:normal;text-transform:uppercase;letter-spacing:.05em;font-size:.8em;opacity:.55}

/* Itinerary timeline (pickup dot -> drop-off dot) */
.mls-co-itinerary{margin:22px 0 0}
.mls-co-node{position:relative;display:flex;gap:14px;padding-bottom:20px}
.mls-co-node:last-child{padding-bottom:0}
.mls-co-node:not(:last-child)::before{content:"";position:absolute;left:6px;top:18px;bottom:-2px;width:2px;background:var(--mls-line,rgba(127,127,127,.3))}
.mls-co-dot{flex:0 0 auto;width:14px;height:14px;margin-top:3px;border-radius:50%;border:2px solid var(--mls-accent,#F8B53F);background:var(--mls-accent,#F8B53F);position:relative;z-index:1}
.mls-co-node--end .mls-co-dot{background:transparent}
.mls-co-nodebody{min-width:0}
.mls-co-lbl{display:block;font-size:.72em;text-transform:uppercase;letter-spacing:.06em;opacity:.55;margin-bottom:2px}
.mls-co-val{display:block;font-weight:600;word-break:break-word}

/* When + passengers meta */
.mls-co-meta{display:flex;flex-wrap:wrap;gap:16px 30px;margin-top:18px;padding-top:18px;border-top:1px solid var(--mls-line,rgba(127,127,127,.22))}
.mls-co-metaitem{display:flex;align-items:center;gap:11px}
.mls-co-ico{width:22px;height:22px;flex:0 0 auto;opacity:.8;color:var(--mls-accent,currentColor)}

/* Form: standard platform field style (#audit-2026-07) — .mls-field (label above the
   input, defined near the top of this file) replaced this page's one-off floating-label
   style so every form on the site — Trip Details, checkout, everywhere — looks the same. */
.mls-co-form{margin-top:24px;display:flex;flex-direction:column;gap:14px}
.mls-co-couponwrap{display:flex;gap:8px}
.mls-co-couponwrap input{flex:1}
.mls-couponmsg{font-size:.86em;margin-top:-4px}
.mls-couponmsg-ok{color:var(--mls-accent,#0a7d33)}
.mls-couponmsg-bad{color:currentColor;opacity:.85}
/* 3.42.9 lesson, carried forward to .mls-field on this page — the theme/Elementor
   injects a GLOBAL input rule AFTER this stylesheet that can override an input's
   padding/height/margin. Re-assert the layout-critical box so the theme can't collapse
   it, scoped to .mls-checkout with !important on only those properties — color/border/
   background stay theme-driven via .mls-field's own rule. */
.mls-checkout .mls-field input{box-sizing:border-box!important;min-height:0!important;height:auto!important;margin:0!important}

/* Master action button — inherits accent from .mls-btn, adds motion */
.mls-checkout .mls-co-cta{width:100%;border-radius:12px;padding:15px 18px;margin-top:4px;transition:transform .12s ease,filter .12s ease,box-shadow .12s ease}
.mls-checkout .mls-co-cta:hover{transform:translateY(-1px) scale(1.01);filter:brightness(1.04);box-shadow:0 10px 26px rgba(0,0,0,.14)}
.mls-checkout .mls-co-cta:active{transform:translateY(0) scale(.995)}

/* Sticky price sidebar */
.mls-co-side{position:relative}
.mls-co-pricecard{position:sticky;top:20px;border:1px solid var(--mls-line,rgba(127,127,127,.22));border-radius:16px;padding:18px 18px 20px;background:var(--mls-surface,var(--mls-popover-bg,rgba(127,127,127,.04)))}
.mls-co-priceline{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;font:inherit}
.mls-co-priceline span{color:var(--mls-mut,#6b7280)}
.mls-co-priceline b{font-weight:600;white-space:nowrap}
.mls-co-due{margin:8px -8px;padding:13px 12px;border-radius:12px;background:color-mix(in srgb,var(--mls-accent,#F8B53F) 14%,transparent)}
.mls-co-due span{color:inherit;font-weight:700}
.mls-co-due b{font-size:1.3em;font-weight:800;color:var(--mls-accent,#c07d16)}
.mls-co-muted b{color:var(--mls-mut,#6b7280);font-weight:600}
.mls-co-credit b{color:var(--mls-accent,#0a7d33)}
.mls-co-breakdown{margin-top:12px;padding-top:12px;border-top:1px dashed var(--mls-line,rgba(127,127,127,.3))}
.mls-co-breakdown div{display:flex;justify-content:space-between;gap:10px;font-size:.86em;padding:3px 0;color:var(--mls-mut,#6b7280)}
.mls-co-fine{font-size:.8em;margin-top:12px;opacity:.75}
.mls-co-countdown{margin-top:12px;font-size:.86em}
.mls-co-social{margin-top:10px;font-size:.82em;opacity:.7}
.mls-co-upsell{margin-top:12px;padding:10px 12px;border-radius:12px;border:1px dashed var(--mls-accent,#F8B53F);font-size:.86em}

/* Mobile: single column + sticky Due-today action bar */
.mls-co-stickybar{display:none}
@media(max-width:860px){
	.mls-co-grid{grid-template-columns:1fr;gap:20px}
	.mls-co-side{order:-1}
	.mls-co-pricecard{position:static}
}
@media(max-width:767px){
	.mls-co-stickybar{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;bottom:0;margin:14px -18px -18px;padding:12px 18px;background:var(--mls-popover-bg,#fff);border-top:1px solid var(--mls-line,rgba(127,127,127,.3));box-shadow:0 -8px 22px rgba(0,0,0,.1);z-index:6}
	.mls-co-stickyamt{display:flex;flex-direction:column;line-height:1.1}
	.mls-co-stickyamt span{font-size:.68em;text-transform:uppercase;letter-spacing:.06em;opacity:.6}
	.mls-co-stickyamt b{font-size:1.15em;font-weight:800}
	.mls-co-stickycta{font:inherit;font-weight:700;text-decoration:none;background:var(--mls-accent,#F8B53F);color:#1a1a1a;padding:11px 20px;border-radius:10px;white-space:nowrap}
	.mls-co-title{font-size:1.45em}
}

/* Vehicle-card price breakdown (transparency) — 3.37.0 */
.mls-veh{flex-wrap:wrap}
.mls-veh-bdtoggle{margin-top:6px;background:none;border:0;padding:0;cursor:pointer;font:inherit;font-size:12px;color:var(--mq-gold,var(--mls-accent,#c07d16));text-decoration:underline;text-underline-offset:2px}
.mls-veh-bdtoggle.on{opacity:.85}
.mls-veh-bd{flex:1 0 100%;margin-top:10px;padding-top:10px;border-top:1px dashed var(--mq-line,rgba(127,127,127,.22));font-size:12.5px;color:var(--mq-mut,#6b7280)}
.mls-veh-bd-method{font-weight:600;color:var(--mq-ink,inherit);margin-bottom:6px;opacity:.9}
.mls-veh-bd div{display:flex;justify-content:space-between;gap:12px;padding:3px 0}

/* Customer quote panel: vehicle meta + negotiation thread — 3.39.0 */
.mls-portal .mls-qmeta{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 16px}
.mls-portal .mls-qmeta span{display:inline-flex;align-items:center;gap:7px;font-size:.86em;padding:5px 12px;border:1px solid var(--mls-line,rgba(127,127,127,.28));border-radius:999px}
.mls-portal .mls-qmeta em{font-style:normal;text-transform:uppercase;letter-spacing:.05em;font-size:.8em;opacity:.55}
.mls-portal .mls-qnego{margin:6px 0 18px;padding:14px 16px;border:1px solid var(--mls-line,rgba(127,127,127,.24));border-radius:12px}
.mls-portal .mls-qnego .mls-psec{margin-top:0}
.mls-portal .mls-qnego-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:6px 0;border-bottom:1px dashed var(--mls-line,rgba(127,127,127,.18));font-size:13.5px}
.mls-portal .mls-qnego-row:last-of-type{border-bottom:0}
.mls-portal .mls-qnego-at{margin-left:auto;color:var(--mls-mut,#9b968b);font-size:11.5px}
.mls-portal .mls-qnego-callout{margin-top:10px;padding:11px 13px;border-radius:10px;background:color-mix(in srgb,var(--mls-accent,#F8B53F) 14%,transparent);font-size:14px;font-weight:600}
.mls-portal .mls-qnego-callout.ok{background:color-mix(in srgb,#4caf7d 16%,transparent)}
/* Button hardening (3.42.3). Elementor injects its GLOBAL button CSS in an inline <style>
   block AFTER the plugin stylesheet, so a class-level !important rule ties on specificity and
   loses by source order (buttons render in the theme's link color / plain text). ID-scoped
   selectors (1,1,0) outrank any class-based theme/Elementor rule regardless of source order.
   Only color/appearance is re-asserted here — width is deliberately left untouched so the
   quote wizard's Back/Continue nav (which nests inside #mls-book) is not forced full-width. */
#mls-quote .mls-btn,#mls-book .mls-btn,#mls-openacct .mls-btn,#mls-portal .mls-btn,.mls-abtn-wrap .mls-account-btn,.mls-abtn-wrap .mls-abtn-send,.mls-abtn-wrap .mls-abtn-verify{
  -webkit-appearance:none!important;appearance:none!important;
  background:var(--mls-accent,#F8B53F)!important;color:#111!important;
  border:0!important;border-radius:10px!important;padding:14px 22px!important;
  font:inherit!important;font-weight:700!important;font-size:15px!important;
  text-decoration:none!important;cursor:pointer!important;line-height:1.25!important;box-shadow:none!important}
#mls-quote .mls-btn:hover,#mls-book .mls-btn:hover,#mls-openacct .mls-btn:hover,#mls-portal .mls-btn:hover{filter:brightness(1.06)}
/* 3.42.8 — the header account button ("My Trips" / "Sign In") sits inline in the site
   header next to the theme's own CTA (e.g. Reserve). The hardening rule above forces it
   to 15px, which made its text read visibly LARGER than the neighboring header button
   (theme CTAs run ~12px). Relax only its sizing here so it blends into the header — a
   compact, header-appropriate size — while color/appearance stay hardened above. Covers
   both states: the signed-out dropdown button (inside .mls-abtn-wrap) and the signed-in
   plain link. Does NOT touch the in-panel sign-in form buttons (.mls-abtn-send/verify),
   which stay at the readable form size. */
.mls-abtn-wrap .mls-account-btn,a.mls-account-btn{
  font-size:12px!important;letter-spacing:.96px!important;padding:14px 24px!important}
/* 3.42.10 — the in-panel sign-in buttons ("Email me a sign-in code" / "Sign in") live in
   the 290px dropdown, not the header. The hardening rule above forces them to 15px with
   22px side padding; at that size the longest label ("Email me a sign-in code") is ~237px
   wide but only ~210px fits inside the panel, so the nowrap text spilled outside the
   button. Restore the panel's intended compact sizing (font 13.5px, tighter padding and
   letter-spacing) so the label fits with margin to spare — measured text ~207px in ~222px
   available. Same specificity as the hardening rule (0,2,0) but later in source, so it
   wins; color/appearance stay hardened above. */
.mls-abtn-panel .mls-abtn-send,.mls-abtn-panel .mls-abtn-verify{
  font-size:13.5px!important;letter-spacing:.6px!important;padding:13px 16px!important}
#mls-quote .mls-btn--ghost,#mls-book .mls-btn--ghost,#mls-openacct .mls-btn--ghost,#mls-portal .mls-btn--ghost,
#mls-openacct .mls-pathbtn[aria-pressed="false"],#mls-portal .mls-pathbtn[aria-pressed="false"]{
  background:transparent!important;color:var(--mls-ink,#17181c)!important;border:1px solid var(--mls-line,rgba(0,0,0,.2))!important}

/* Social sign-in (#social-login) — round provider buttons under the email button.
   Google/Microsoft sit on a neutral tile per their brand rules; Apple black,
   Yahoo purple. 48px circles = comfortable tap targets. */
.mls-oauth-divider{display:flex;align-items:center;gap:12px;margin:18px 0 14px;color:var(--mls-mut,#6b7280);font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.mls-oauth-divider::before,.mls-oauth-divider::after{content:"";flex:1;height:1px;background:var(--mls-line,rgba(127,127,127,.25))}
.mls-oauth-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}
.mls-oauth-btn{width:48px;height:48px;flex:0 0 auto;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--mls-line,rgba(127,127,127,.3));background:#fff;text-decoration:none;transition:transform .12s ease,box-shadow .12s ease}
.mls-oauth-btn svg{width:22px;height:22px;display:block}
.mls-oauth-btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(10,12,18,.22)}
.mls-oauth-btn--apple{background:#000;color:#fff;border-color:#000}
.mls-oauth-btn--yahoo{background:#6001D2;color:#fff;border-color:#6001D2}

/* Branded sign-in gate (#brand-signin) — the operator's logo leads the screen on
   every width; scaled to fit, never cropped. The eyebrow below it is the business
   name. Accent/font/theme-mode already flow via the --mls-* wrapper vars. */
.mls-signincard .mls-signin-logo{display:block;max-height:64px;max-width:min(240px,70%);width:auto;margin:2px auto 16px;object-fit:contain}
.mls-signincard .mls-bhead{text-align:center}
.mls-signincard .mls-eyebrow{letter-spacing:.16em}

/* ============================================================================
   Sign-in as a full-screen app gate at phone widths (#pwa-audit) — scoped
   strictly to .mls-portal--signin (the logged-OUT My Trips variant only; the
   signed-in customer/driver/staff surfaces are untouched). Desktop unchanged.
   ========================================================================== */
@media(max-width:700px){
	.mls-portal--signin{position:fixed;inset:0;z-index:99990;max-width:none;margin:0;background:var(--mls-popover-bg,#fff);display:flex;flex-direction:column;justify-content:center;overflow-y:auto;padding:calc(24px + env(safe-area-inset-top)) 22px calc(24px + env(safe-area-inset-bottom))}
	.admin-bar .mls-portal--signin{top:46px}
	.mls-portal--signin .mls-bcard{border:0;border-radius:0;box-shadow:none;background:transparent;padding:0;max-width:420px;margin:0 auto;width:100%}
	.mls-portal--signin .mls-bhead{text-align:center}
	.mls-portal--signin .mls-bhead h2{font-size:26px;line-height:1.15}
	.mls-portal--signin .mls-field input{min-height:52px;font-size:16px} /* 16px stops iOS auto-zoom on focus */
	.mls-portal--signin .mls-btn{width:100%;min-height:52px;font-size:15.5px}
	.mls-portal--signin .mls-codewrap{margin-top:20px}
	.mls-portal--signin .mls-signin-logo{max-height:84px;margin-bottom:20px} /* app front door — the brand gets room (#brand-signin) */

	/* Chauffeur console full-bleed app posture (#pwa-audit) — same fixed-inset escape
	   as the sign-in gate above; scoped to the driver variant only. */
	.mls-portal--driver{position:fixed;inset:0;z-index:99990;max-width:none;margin:0;background:var(--mls-popover-bg,#fff);overflow-y:auto;-webkit-overflow-scrolling:touch;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
	.admin-bar .mls-portal--driver{top:46px}
	.mls-portal--driver .mls-empview{border:0;border-radius:0;box-shadow:none;margin:0;padding:16px 16px calc(24px + env(safe-area-inset-bottom));min-height:100%}
	.mls-portal--driver .mls-drivehead{position:sticky;top:0;z-index:3;background:var(--mls-popover-bg,#fff);margin:-16px -16px 8px;padding:14px 16px;border-bottom:1px solid var(--mls-line,rgba(127,127,127,.2))}
	.mls-portal--driver .mls-driveday{top:76px} /* clears the sticky header */
	/* One-thumb curbside targets: status buttons stack full-width. */
	.mls-portal--driver .mls-drivebtns{flex-direction:column}
	.mls-portal--driver .mls-drivebtns .mls-btn{min-height:56px}
	.mls-portal--driver .mls-drivebtns .mls-minibtn{min-height:44px}
	.mls-portal--driver .mls-directions{min-height:44px;padding:10px 16px;font-size:13.5px}
	.mls-portal--driver .mls-addstop input{min-height:44px;font-size:16px}
}

/* ============================================================================
   Desktop floating app window (#mlx-redesign) — ≥701px, .mls-portal--win.
   The My Trips wrapper lifts out of the page into a fixed, centered app window
   over the dimmed/blurred site (the "app in front of the website" moment).
   701px so the ≤700px phone shells above are never double-styled. The interior
   (.mls-portal-app for the customer SPA, .mls-empview for the chauffeur
   day-sheet) supplies its own window geometry in its own stylesheet — this
   block is only the shared frame: fixed posture, scrim, centering, entry.
   Excluded: the installed PWA (`:not(.mls-standalone)` — standalone fills the
   screen, no scrim) and the ?q= quote panel (never gets the --win class, see
   account_shortcode()). Deliberately NO Escape/backdrop dismissal and no
   role=dialog: this window IS the page's main content, not a dialog.
   html.mls-winlock is toggled by booking.js initWindowMode() so the page
   behind the window can't scroll. ========================================== */
html.mls-winlock, html.mls-winlock body { overflow: hidden; }
@media (min-width: 701px) {
	.mls-portal--win:not(.mls-standalone) {
		position: fixed; inset: 0; z-index: 99990; max-width: none; margin: 0;
		display: flex; align-items: center; justify-content: center;
		padding: 3vh 3vw;
	}
	/* The scrim paints on the wrapper's own ::before — no extra DOM, nothing for
	   the PWA head-sniffing or the service worker to trip over. */
	.mls-portal--win:not(.mls-standalone)::before {
		content: ""; position: absolute; inset: 0;
		background: var(--mlx-scrim, rgba(9,14,26,.55));
		animation: mlxScrim var(--mlx-dur-3, 420ms) var(--mlx-ease-out, ease-out) both;
	}
	@supports (backdrop-filter: blur(1px)) {
		.mls-portal--win:not(.mls-standalone)::before {
			backdrop-filter: blur(var(--mlx-blur-scrim, 10px)) saturate(.8) brightness(.9);
		}
	}
	/* WP admin bar offsets — same precedent as the staff console (console.css). */
	.admin-bar .mls-portal--win:not(.mls-standalone) { top: 32px; }
	/* Sign-in gate (#mlx-redesign): a centered velvet-rope card over the dimmed
	   live site, not a full window — the product appears behind it. */
	.mls-portal--signin.mls-portal--win:not(.mls-standalone) .mls-bcard {
		position: relative;
		width: min(440px, 92vw); max-height: 92vh; overflow-y: auto;
		border-radius: var(--mlx-r-lg, 18px);
		background: var(--mlx-float, var(--mls-popover-bg, #fff));
		box-shadow: var(--mlx-shadow-3, 0 28px 70px rgba(6,9,20,.45)), inset 0 1px 0 var(--mlx-glass-hilite, rgba(255,255,255,.09));
		padding: 36px 34px;
		animation: mlxWinIn var(--mlx-dur-3, 420ms) var(--mlx-ease-spring, ease-out) both;
	}
}
@media (min-width: 701px) and (max-width: 782px) {
	/* WP's own admin-bar height breakpoint. */
	.admin-bar .mls-portal--win:not(.mls-standalone) { top: 46px; }
}
@media (min-width: 701px) and (max-height: 560px) {
	/* Small-height screens: the floating window loses its inset margins and goes
	   edge-to-edge (the staff console's posture) rather than shrinking unusably. */
	.mls-portal--win:not(.mls-standalone) { padding: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.mls-portal--win:not(.mls-standalone)::before,
	.mls-portal--signin.mls-portal--win:not(.mls-standalone) .mls-bcard { animation: none; }
}

/* ============================================================================
   Desktop floating app window — chauffeur console interior (#mlx-redesign).
   Same shared frame as the customer SPA (the .mls-portal--win block above);
   here the window is the .mls-empview card itself, which doubles as the
   scroll surface. Narrower than the customer window — the day-sheet is one
   deliberate column. Phone (≤700px) full-bleed block above is untouched.
   ========================================================================== */
@media (min-width: 701px) {
	.mls-portal--driver.mls-portal--win:not(.mls-standalone) .mls-empview {
		position: relative;
		width: min(920px, 90vw);
		height: min(90vh, 880px);
		height: min(90dvh, 880px);
		margin: 0; max-width: none;
		overflow-y: auto; -webkit-overflow-scrolling: touch;
		border-radius: var(--mlx-r-xl, 26px);
		box-shadow: var(--mlx-shadow-3, 0 28px 70px rgba(6,9,20,.45)), inset 0 1px 0 var(--mlx-glass-hilite, rgba(255,255,255,.09));
		background: var(--mlx-canvas, var(--mls-popover-bg, #fff));
		padding: 0 26px 26px;
		animation: mlxWinIn var(--mlx-dur-3, 420ms) var(--mlx-ease-spring, ease-out) both;
	}
	/* The day-summary header becomes the window's glass titlebar — sticky against
	   the .mls-empview scroller. */
	.mls-portal--driver.mls-portal--win:not(.mls-standalone) .mls-drivehead {
		position: sticky; top: 0; z-index: 3;
		margin: 0 -26px 14px; padding: 16px 26px;
		background: var(--mlx-float, var(--mls-popover-bg, #fff));
		border-bottom: 1px solid var(--mlx-line-soft, var(--mls-line, rgba(127,127,127,.2)));
	}
	@supports (backdrop-filter: blur(1px)) {
		.mls-portal--driver.mls-portal--win:not(.mls-standalone) .mls-drivehead {
			background: var(--mlx-glass, var(--mls-popover-bg, #fff));
			backdrop-filter: blur(var(--mlx-blur, 18px)) saturate(1.05);
		}
	}
	/* Sticky day-group headers clear the titlebar (sticky resolves against the
	   .mls-empview scroll container). */
	.mls-portal--driver.mls-portal--win:not(.mls-standalone) .mls-driveday { position: sticky; top: 78px; z-index: 2; }
}
@media (min-width: 701px) and (max-height: 560px) {
	.mls-portal--driver.mls-portal--win:not(.mls-standalone) .mls-empview { width: 100%; height: 100vh; height: 100dvh; border-radius: 0; }
}
@media (prefers-reduced-motion: reduce) {
	.mls-portal--driver.mls-portal--win:not(.mls-standalone) .mls-empview { animation: none; }
}

/* NEXT-card breathing glow (#mlx-redesign) — a slow accent pulse marks the
   chauffeur's very next pickup; killed by the reduced-motion block above. */
@keyframes mlxNextBreath { 50% { box-shadow:0 0 0 1px var(--mls-accent,#F8B53F), 0 14px 48px color-mix(in srgb, var(--mls-accent,#F8B53F) 36%, transparent); } }
.mls-drivecard--next { animation: mlxNextBreath 3s ease-in-out infinite; }

/* Day-progress rail (#mlx-redesign) — 3px accent bar under the chauffeur's
   sticky day header showing today's completed/total, driven by --mls-done
   (0-100) set by booking.js on every status change. */
.mls-portal--driver .mls-drivehead { position:relative; }
.mls-portal--driver .mls-drivehead::after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:3px; background:linear-gradient(90deg, var(--mls-accent,#F8B53F) calc(var(--mls-done,0) * 1%), color-mix(in srgb, var(--mls-line,rgba(127,127,127,.3)) 55%, transparent) 0); }

/* Window exit (#mlx-hotfix) — the floating desktop window dims the site behind
   it, so without an explicit way out the visitor is trapped in My Trips. The ×
   (rendered on all three surfaces + the sign-in gate) returns to the website.
   Hidden everywhere except the desktop windowed mode — the phone app shells
   and the installed PWA ARE the app and keep no exit, as before. */
.mls-win-close { display: none; }
@media (min-width: 701px) {
	.mls-portal--win:not(.mls-standalone) .mls-win-close {
		display: inline-flex; align-items: center; justify-content: center;
		width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%;
		border: 1px solid var(--mlx-line-soft, var(--mls-line, rgba(127,127,127,.3)));
		background: transparent; color: var(--mls-mut, #6b7280);
		font-size: 17px; line-height: 1; text-decoration: none; cursor: pointer;
		transition: border-color var(--mlx-dur-1, 120ms) ease, color var(--mlx-dur-1, 120ms) ease, transform var(--mlx-dur-1, 120ms) ease;
	}
	.mls-portal--win:not(.mls-standalone) .mls-win-close:hover {
		border-color: var(--mls-accent, #F8B53F); color: var(--mls-ink, #1e1e1e); transform: scale(1.06);
	}
	/* Sign-in gate: the × floats on the card's top-right corner. */
	.mls-portal--signin.mls-portal--win:not(.mls-standalone) .mls-win-close { position: absolute; top: 14px; right: 14px; }
}
