/* ============================================================================
   LUX4RIDES — Global Booking Widget
   Self-contained, portable styles for the inline booking form + sticky bar.
   Loads on every page. Palette is hard-coded (dark + gold) so the widget looks
   identical regardless of which page stylesheet is present.
   Single source of truth — restyle the whole site's widget by editing this file.
   ========================================================================== */

.l4rbw,
.l4rbar,
.l4rbw-sheet {
  /* Local design tokens — do not depend on page CSS variables */
  --l4r-gold: #ffc24b;
  --l4r-gold-2: #ffd700;
  --l4r-gold-deep: #e69500;
  --l4r-ink: #0c0c0d;
  --l4r-ink-2: #151517;
  --l4r-field: #1a1a1d;
  --l4r-line: rgba(255, 255, 255, 0.12);
  --l4r-line-gold: rgba(255, 194, 75, 0.45);
  --l4r-fg: #f6f4ee;
  --l4r-muted: rgba(255, 255, 255, 0.62);
  --l4r-faint: rgba(255, 255, 255, 0.40);
  --l4r-radius: 16px;
  --l4r-radius-sm: 10px;
  --l4r-grad: linear-gradient(135deg, #ffd700 0%, #ffc24b 45%, #e69500 100%);
  --l4r-font: "Playfair Display", Georgia, serif;
  --l4r-body: "Inter", "Montserrat", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  box-sizing: border-box;
}
.l4rbw *, .l4rbar *, .l4rbw-sheet * { box-sizing: border-box; }

/* ── Inline widget ───────────────────────────────────────────────────────── */
.l4rbw {
  font-family: var(--l4r-body);
  max-width: 1080px;
  margin: 2.25rem auto;
  padding: clamp(18px, 2.4vw, 28px);
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(255, 194, 75, 0.10), transparent 55%),
    linear-gradient(160deg, var(--l4r-ink-2) 0%, var(--l4r-ink) 100%);
  border: 1px solid var(--l4r-line);
  border-radius: var(--l4r-radius);
  box-shadow: 0 24px 60px -28px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(255, 194, 75, 0.05);
  color: var(--l4r-fg);
  position: relative;
  scroll-margin-top: 100px;
}
.l4rbw__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 18px;
  margin-bottom: 18px;
}
.l4rbw__title {
  font-family: var(--l4r-font);
  font-size: clamp(19px, 2.4vw, 25px);
  font-weight: 600;
  letter-spacing: .2px;
  margin: 0;
  line-height: 1.15;
}
.l4rbw__title b { color: var(--l4r-gold); font-weight: 600; }

/* Service tabs */
.l4rbw__tabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid var(--l4r-line);
  border-radius: 999px;
}
.l4rbw__tab {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--l4r-muted);
  font: 600 12.5px/1 var(--l4r-body);
  letter-spacing: .02em;
  padding: 9px 15px;
  min-height: 36px;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  transition: color .2s ease, background .2s ease;
}
.l4rbw__tab:hover { color: var(--l4r-fg); }
.l4rbw__tab.is-active {
  background: var(--l4r-grad);
  color: #1a1206;
  box-shadow: 0 4px 14px -4px rgba(255, 194, 75, 0.5);
}

/* Field grid */
.l4rbw__grid {
  display: grid;
  grid-template-columns: 1fr 1fr auto auto auto;
  gap: 12px;
  align-items: end;
}
.l4rbw__f { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.l4rbw__f--pickup, .l4rbw__f--drop { grid-column: span 1; }
.l4rbw__f label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--l4r-faint);
}
.l4rbw__input,
.l4rbw__select {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  background: var(--l4r-field);
  border: 1px solid var(--l4r-line);
  border-radius: var(--l4r-radius-sm);
  color: var(--l4r-fg);
  font: 500 15px/1.2 var(--l4r-body);
  transition: border-color .18s ease, box-shadow .18s ease;
  appearance: none;
}
.l4rbw__input::placeholder { color: var(--l4r-faint); }
/* Pickup (green) / drop-off (orange) markers */
.l4rbw__inwrap { position: relative; }
.l4rbw__pin {
  position: absolute; left: 12px; top: 50%;
  transform: translateY(-50%);
  width: 17px; height: 17px;
  pointer-events: none; z-index: 1;
}
.l4rbw__pin--pu { color: #2fcd6f; }   /* PU green */
.l4rbw__pin--do { color: #ff3b30; }   /* drop-off red */
.l4rbw__input--pin { padding-left: 38px; }
/* "Best value" cue on the Hourly tab */
.l4rbw__tab { position: relative; }
.l4rbw__tab-star { color: var(--l4r-gold-2); font-size: 11px; margin-left: 3px; }
.l4rbw__tab.is-active .l4rbw__tab-star { color: #1a1206; }
.l4rbw__hint {
  display: flex; align-items: center; gap: 7px;
  font-size: 12px; color: var(--l4r-muted);
  margin: 12px 0 0; padding: 9px 12px;
  background: rgba(255, 194, 75, 0.07);
  border: 1px solid rgba(255, 194, 75, 0.18);
  border-radius: 10px;
}
.l4rbw__hint svg { width: 15px; height: 15px; color: var(--l4r-gold); flex: 0 0 auto; }
.l4rbw__hint b { color: var(--l4r-fg); font-weight: 600; }
.l4rbw__input:focus,
.l4rbw__select:focus {
  outline: none;
  border-color: var(--l4r-line-gold);
  box-shadow: 0 0 0 3px rgba(255, 194, 75, 0.16);
}
.l4rbw__input:focus-visible,
.l4rbw__select:focus-visible { outline: 2px solid var(--l4r-gold); outline-offset: 1px; }
/* Date/time pickers — keep icons visible on dark */
.l4rbw__input[type="date"],
.l4rbw input[type="time"] { color-scheme: dark; }
.l4rbw__select-wrap { position: relative; }
.l4rbw__select-wrap::after {
  content: "";
  position: absolute;
  right: 13px; top: 50%;
  width: 8px; height: 8px;
  border-right: 2px solid var(--l4r-gold);
  border-bottom: 2px solid var(--l4r-gold);
  transform: translateY(-65%) rotate(45deg);
  pointer-events: none;
}
.l4rbw__select { padding-right: 32px; cursor: pointer; }

/* Submit */
.l4rbw__submit {
  appearance: none;
  border: 0;
  min-height: 48px;
  padding: 0 22px;
  background: var(--l4r-grad);
  color: #1a1206;
  font: 700 14.5px/1 var(--l4r-body);
  letter-spacing: .02em;
  border-radius: var(--l4r-radius-sm);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
  box-shadow: 0 10px 26px -10px rgba(255, 194, 75, 0.6);
}
.l4rbw__submit:hover { filter: brightness(1.05); box-shadow: 0 14px 30px -10px rgba(255, 194, 75, 0.7); }
.l4rbw__submit:active { transform: translateY(1px); }
.l4rbw__submit svg { width: 16px; height: 16px; }

/* Footnotes */
.l4rbw__note,
.l4rbw__trust {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; color: var(--l4r-muted);
  margin: 14px 0 0;
}
.l4rbw__trust { color: var(--l4r-faint); font-size: 11.5px; margin-top: 8px; }
.l4rbw__note svg, .l4rbw__trust svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--l4r-gold); }
.l4rbw__note b { color: var(--l4r-fg); font-weight: 600; }

/* Field-level error */
.l4rbw__f.is-error .l4rbw__input,
.l4rbw__f.is-error .l4rbw__select { border-color: #ff6b6b; box-shadow: 0 0 0 3px rgba(255, 107, 107, 0.14); }
.l4rbw__err { display: none; font-size: 11px; color: #ff8585; font-weight: 600; }
.l4rbw__f.is-error .l4rbw__err { display: block; }

/* Conditional fields hidden by default */
.l4rbw [data-l4r-hours],
.l4rbw [data-l4r-return] { display: none; }
.l4rbw.is-hourly [data-l4r-hours] { display: flex; }
.l4rbw.is-round [data-l4r-return] { display: flex; }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 860px) {
  .l4rbw__grid { grid-template-columns: 1fr 1fr; }
  .l4rbw__f--pickup, .l4rbw__f--drop { grid-column: 1 / -1; }
  .l4rbw__submit { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 520px) {
  .l4rbw { margin: 1.5rem auto; border-radius: 14px; }
  .l4rbw__grid { grid-template-columns: 1fr; }
  .l4rbw__head { flex-direction: column; align-items: flex-start; }
  .l4rbw__tabs { width: 100%; justify-content: space-between; }
  .l4rbw__tab { flex: 1; padding: 9px 8px; }
}

/* ── Sticky bottom bar ───────────────────────────────────────────────────── */
.l4rbar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 11px clamp(14px, 4vw, 32px);
  padding-bottom: calc(11px + env(safe-area-inset-bottom, 0px));
  font-family: var(--l4r-body);
  color: var(--l4r-fg);
  background: linear-gradient(180deg, rgba(18, 18, 20, 0.92), rgba(8, 8, 9, 0.98));
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--l4r-line-gold);
  box-shadow: 0 -12px 30px -16px rgba(0, 0, 0, 0.8);
  transform: translateY(110%);
  transition: transform .42s cubic-bezier(.22, 1, .36, 1);
}
.l4rbar.is-in { transform: translateY(0); }
.l4rbar__msg { display: flex; align-items: center; gap: 11px; min-width: 0; }
.l4rbar__spark {
  flex: 0 0 auto;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--l4r-grad);
  color: #1a1206;
}
.l4rbar__spark svg { width: 18px; height: 18px; }
.l4rbar__txt { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.l4rbar__txt strong { font-size: 14px; font-weight: 700; letter-spacing: .01em; }
.l4rbar__txt span { font-size: 12px; color: var(--l4r-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.l4rbar__actions { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.l4rbar__cta {
  appearance: none; border: 0;
  min-height: 42px; padding: 0 18px;
  background: var(--l4r-grad);
  color: #1a1206;
  font: 700 13.5px/1 var(--l4r-body);
  letter-spacing: .01em;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 7px;
  white-space: nowrap;
  transition: filter .2s ease, transform .15s ease;
  box-shadow: 0 8px 20px -8px rgba(255, 194, 75, 0.6);
}
.l4rbar__cta:hover { filter: brightness(1.06); }
.l4rbar__cta:active { transform: translateY(1px); }
.l4rbar__cta svg { width: 15px; height: 15px; }
.l4rbar__close {
  appearance: none; border: 0; background: transparent;
  color: var(--l4r-faint);
  width: 38px; height: 38px;
  display: grid; place-items: center;
  border-radius: 50%;
  cursor: pointer;
  transition: color .2s ease, background .2s ease;
}
.l4rbar__close:hover { color: var(--l4r-fg); background: rgba(255, 255, 255, 0.08); }
.l4rbar__close svg { width: 16px; height: 16px; }
@media (max-width: 600px) {
  .l4rbar__txt span { display: none; }
  .l4rbar { padding-left: 14px; padding-right: 14px; }
  .l4rbar__cta { padding: 0 15px; }
}

/* ── Slide-up sheet (bar opens this on pages with no inline widget) ───────── */
.l4rbw-sheet {
  position: fixed; inset: 0; z-index: 9999;
  display: none;
  align-items: flex-end;
  justify-content: center;
  font-family: var(--l4r-body);
}
.l4rbw-sheet.is-open { display: flex; }
.l4rbw-sheet__scrim {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, 0.62);
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
  opacity: 0; transition: opacity .3s ease;
}
.l4rbw-sheet.is-open .l4rbw-sheet__scrim { opacity: 1; }
.l4rbw-sheet__panel {
  position: relative;
  width: 100%;
  max-width: 1080px;
  max-height: 92vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 6px 14px calc(20px + env(safe-area-inset-bottom, 0px));
  transform: translateY(16px);
  opacity: 0;
  transition: transform .34s cubic-bezier(.22, 1, .36, 1), opacity .34s ease;
}
.l4rbw-sheet.is-open .l4rbw-sheet__panel { transform: translateY(0); opacity: 1; }
.l4rbw-sheet__panel .l4rbw { margin: 0; }
.l4rbw-sheet__grip {
  width: 42px; height: 4px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.28);
  margin: 8px auto 10px;
}

/* ── Brand trust band (also injected by JS on pages without the shared footer) ── */
.l4r-why{--g:#ffc24b;background:
    radial-gradient(120% 140% at 0% 0%,rgba(255,194,75,.08),transparent 55%),
    linear-gradient(180deg,#0c0c0d 0%,#000 100%);
  border-top:1px solid rgba(255,194,75,.18);border-bottom:1px solid rgba(255,255,255,.06);
  padding:clamp(2.4rem,5vw,3.6rem) 1rem;color:#f6f4ee;font-family:'Inter',system-ui,sans-serif;}
.l4r-why__in{max-width:1100px;margin:0 auto;text-align:center}
.l4r-why__eyebrow{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--g);border:1px solid rgba(255,194,75,.4);
  border-radius:999px;padding:6px 14px;margin-bottom:16px}
.l4r-why__h{font-family:'Playfair Display',Georgia,serif;font-weight:600;
  font-size:clamp(22px,3.4vw,32px);margin:0 0 12px;line-height:1.15}
.l4r-why__h b{color:var(--g)}
.l4r-why__lead{max-width:760px;margin:0 auto 26px;color:rgba(255,255,255,.72);font-size:15.5px;line-height:1.7}
.l4r-why__lead b{color:#fff;font-weight:600}
.l4r-why__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:6px}
.l4r-why__card{background:linear-gradient(150deg,#151517,#0b0b0c);border:1px solid rgba(255,255,255,.08);
  border-radius:14px;padding:18px 16px;text-align:left}
.l4r-why__ic{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;
  background:linear-gradient(135deg,#ffd700,#ffc24b);color:#1a1206;margin-bottom:10px}
.l4r-why__ic svg{width:19px;height:19px}
.l4r-why__ct{font-size:14.5px;font-weight:700;margin:0 0 4px}
.l4r-why__cd{font-size:12.8px;color:rgba(255,255,255,.6);line-height:1.55;margin:0}
.l4r-why__sig{margin:22px auto 0;font-family:'Playfair Display',serif;font-style:italic;
  font-size:15px;color:rgba(255,255,255,.8);max-width:680px}
.l4r-why__sig b{color:var(--g);font-style:normal}
.l4r-why__quote{max-width:780px;margin:28px auto 0;font-family:'Playfair Display',Georgia,serif;font-style:italic;font-size:clamp(16px,2.1vw,18.5px);line-height:1.6;color:#fff;border-top:1px solid rgba(255,194,75,.18);padding-top:24px}
.l4r-why__by{display:block;margin-top:14px;font-style:normal;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--g)}
.l4r-why__press{max-width:740px;margin:16px auto 0;font-size:12.5px;letter-spacing:.02em;color:rgba(255,255,255,.55);line-height:1.6}
.l4r-why__press b{color:var(--g);font-weight:600}
@media(max-width:780px){.l4r-why__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:430px){.l4r-why__grid{grid-template-columns:1fr}}

/* ── Google Places dropdown must sit above the slide-up sheet (z 9999) ────── */
.pac-container {
  z-index: 100001 !important;
  border-radius: 10px;
  margin-top: 4px;
  box-shadow: 0 16px 40px -12px rgba(0, 0, 0, 0.55);
  font-family: var(--l4r-body, "Inter", sans-serif);
}

/* ── Motion / accessibility ──────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .l4rbar, .l4rbw-sheet__panel, .l4rbw-sheet__scrim,
  .l4rbw__submit, .l4rbw__tab, .l4rbar__cta { transition: none !important; }
}

/* ── Host-theme guard ─────────────────────────────────────────────────────────
   Some host sites force text colors with !important via a light/dark theme
   stylesheet (e.g. [data-theme="light"] p { color:#000 !important }). Re-assert
   the widget's OWN colors with higher specificity + !important so it stays
   readable on ANY page, light or dark. Scoped strictly to widget classes. */
.l4rbw .l4rbw__title { color: var(--l4r-fg) !important; }
.l4rbw .l4rbw__title b { color: var(--l4r-gold) !important; }
.l4rbw .l4rbw__note { color: var(--l4r-muted) !important; }
.l4rbw .l4rbw__note b { color: var(--l4r-fg) !important; }
.l4rbw .l4rbw__trust { color: var(--l4r-faint) !important; }
.l4rbw .l4rbw__hint { color: var(--l4r-muted) !important; }
.l4rbw .l4rbw__hint b { color: var(--l4r-fg) !important; }
.l4rbw .l4rbw__f label { color: var(--l4r-faint) !important; }
.l4rbw .l4rbw__err { color: #ff8585 !important; }
.l4rbw .l4rbw__input, .l4rbw .l4rbw__select { color: var(--l4r-fg) !important; }
.l4rbw .l4rbw__tab { color: var(--l4r-muted) !important; }
.l4rbw .l4rbw__tab.is-active { color: #1a1206 !important; }
.l4rbw .l4rbw__submit { color: #1a1206 !important; }
.l4rbar .l4rbar__txt strong { color: var(--l4r-fg) !important; }
.l4rbar .l4rbar__txt span { color: var(--l4r-muted) !important; }
.l4rbar .l4rbar__cta { color: #1a1206 !important; }
.l4rbw-sheet .l4rbw__title { color: var(--l4r-fg) !important; }
.l4r-why .l4r-why__h, .l4r-why .l4r-why__quote { color: #fff !important; }
.l4r-why .l4r-why__h b, .l4r-why .l4r-why__by, .l4r-why .l4r-why__eyebrow, .l4r-why .l4r-why__press b { color: var(--l4r-gold, #ffc24b) !important; }
.l4r-why .l4r-why__lead, .l4r-why .l4r-why__ct, .l4r-why .l4r-why__cd, .l4r-why .l4r-why__press, .l4r-why .l4r-why__sig { color: rgba(255,255,255,.72) !important; }
/* Icon/pin color guard (SVGs use currentColor; host themes force color:#000 !important) */
.l4rbw .l4rbw__pin--pu { color: #2fcd6f !important; }   /* pickup GREEN */
.l4rbw .l4rbw__pin--do { color: #ff3b30 !important; }   /* drop-off RED */
.l4rbw .l4rbw__note svg, .l4rbw .l4rbw__trust svg, .l4rbw .l4rbw__hint svg { color: var(--l4r-gold) !important; }
.l4rbw .l4rbw__submit svg { color: #1a1206 !important; }
.l4rbw .l4rbw__tab-star { color: var(--l4r-gold-2) !important; }
.l4rbw .l4rbw__tab.is-active .l4rbw__tab-star { color: #1a1206 !important; }
.l4rbar .l4rbar__spark { color: #1a1206 !important; }
.l4rbar .l4rbar__cta svg { color: #1a1206 !important; }
.l4r-why .l4r-why__ic, .l4r-why .l4r-why__ic svg { color: #1a1206 !important; }