/* ─── Variables on :root — portaled panels (calendar, dropdowns) are outside .lcb-widget so they need variables on :root to resolve correctly ─────── */ :root { --lcb-primary: #c6a66b; --lcb-primary-hover: #a8894a; --lcb-ink: #0c1117; --lcb-navy: #1a2433; --lcb-paper: #f7f4ee; --lcb-line: #d9d7d0; --lcb-muted: #6d737c; } /* ─── Widget reset ────────────────────────────────────────────────────────── */ .lcb-widget { color: var(--lcb-ink); font-family: 'Poppins', Arial, sans-serif; } /* Force all SVGs visible — Elementor sometimes hides them */ .lcb-widget svg, .lcb-cal svg { display: inline-block !important; overflow: visible; } /* ─── Hard reset for ALL buttons inside portaled panels ───────────────────── These panels live directly under , outside .lcb-widget. Elementor's global button rules target them — wipe those styles first. */ .lcb-cal button, .lcb-dropdown__panel button { -webkit-appearance: none !important; appearance: none !important; background: transparent !important; background-color: transparent !important; background-image: none !important; border-color: transparent !important; border-radius: 0 !important; border-style: solid !important; border-width: 0 !important; box-shadow: none !important; color: inherit !important; cursor: pointer !important; display: flex !important; font-family: 'Poppins', Arial, sans-serif !important; font-size: inherit !important; font-weight: inherit !important; letter-spacing: 0 !important; line-height: inherit !important; margin: 0 !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; text-decoration: none !important; text-transform: none !important; transition: none !important; } /* Re-apply calendar nav button styles after the hard reset */ .lcb-cal .lcb-cal__nav { align-items: center !important; border: 1.5px solid rgba(255,255,255,0.22) !important; border-radius: 50% !important; color: rgba(255,255,255,0.7) !important; height: 38px !important; justify-content: center !important; transition: background 150ms, border-color 150ms, color 150ms !important; width: 38px !important; } .lcb-cal .lcb-cal__nav:hover { background-color: rgba(198,166,107,0.15) !important; border-color: rgba(198,166,107,0.5) !important; color: #c6a66b !important; } /* Re-apply calendar day button styles after the hard reset */ .lcb-cal .lcb-cal__day { align-items: center !important; aspect-ratio: 1 !important; border-radius: 10px !important; color: rgba(255,255,255,0.82) !important; font-size: 14px !important; font-weight: 400 !important; justify-content: center !important; min-height: 42px !important; transition: background 120ms, color 120ms !important; } button.lcb-cal__day:hover { background-color: rgba(255,255,255,0.09) !important; color: #fff !important; } .lcb-cal .lcb-cal__day.is-today { border: 1.5px solid #c6a66b !important; color: #c6a66b !important; font-weight: 600 !important; } .lcb-cal .lcb-cal__day.is-sel, .lcb-cal .lcb-cal__day.is-sel:hover { background-color: #c6a66b !important; color: #0c1117 !important; font-weight: 700 !important; } /* Re-apply dropdown item styles after the hard reset */ .lcb-dropdown__panel .lcb-dropdown__item { align-items: center !important; border-bottom: 1px solid rgba(255,255,255,0.05) !important; border-radius: 0 !important; color: rgba(255,255,255,0.82) !important; display: flex !important; font-size: 16px !important; font-weight: 500 !important; gap: 14px !important; padding: 15px 22px !important; transition: background 100ms, color 100ms !important; width: 100% !important; } .lcb-dropdown__panel .lcb-dropdown__item:last-child { border-bottom: none !important; } .lcb-dropdown__panel .lcb-dropdown__item:hover { background-color: rgba(255,255,255,0.05) !important; color: #fff !important; } /* Selected dropdown item — gold color */ .lcb-dropdown__panel .lcb-dropdown__item.is-active { background-color: transparent !important; color: #c6a66b !important; font-weight: 600 !important; } /* The ::before circle pseudo-element is NOT affected by Elementor resets */ .lcb-widget *, .lcb-widget *::before, .lcb-widget *::after { box-sizing: border-box; } /* Critical: prevent display:flex/grid from overriding [hidden] attribute */ .lcb-widget [hidden] { display: none !important; } /* ─── Hero ────────────────────────────────────────────────────────────────── */ .lcb-hero { background-color: #0c111700; background-position: center; background-size: cover; min-height: 340px; } /* Only apply image gradient overlay when CSS variable is set */ .lcb-hero[style] { background-image: linear-gradient(90deg, rgba(10,14,18,0.82), rgba(10,14,18,0.5)), var(--lcb-hero-image, none); } .lcb-widget--compact .lcb-hero { min-height: 0; background-image: none; } .lcb-hero__shade { padding: 36px 20px 50px; } .lcb-widget--compact .lcb-hero__shade { padding: 0; } .lcb-shell { margin: 0 auto; max-width: 1480px; } /* ─── Mode toggle ─────────────────────────────────────────────────────────── */ .lcb-mode { align-items: center; /* background: rgba(5,8,11,0.88); */ border: 1px solid rgba(255,255,255,0.72); border-radius: 999px; box-shadow: 0 10px 30px rgba(0,0,0,0.3); display: flex; gap: 6px; margin: 0 auto 28px; padding: 7px; width: max-content; backdrop-filter: blur(16px); background: radial-gradient(rgba(0, 0, 0, .15), rgba(0, 0, 0, 0) 90%), radial-gradient(circle at 80% 200%, rgba(255, 255, 255, .25), rgba(255, 255, 255, 0) 80%), linear-gradient(rgba(15, 19, 25, .2)); background-color: rgba(0, 0, 0, .2); } .lcb-mode__item { align-items: center; border-radius: 999px; color: rgba(255,255,255,0.72); cursor: pointer; display: inline-flex; font-size: 16px; font-weight: 600; height: 44px; justify-content: center; min-width: 140px; padding: 0 22px; transition: background-color 150ms, color 150ms, box-shadow 150ms; } .lcb-mode__item input { position: absolute; opacity: 0; pointer-events: none; } .lcb-mode__item.is-active { background: var(--lcb-primary); color: var(--lcb-ink); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.2); } /* ─── Search form ─────────────────────────────────────────────────────────── */ .lcb-search { align-items: stretch; backdrop-filter: blur(16px); box-shadow: 0 2px 8px 0 rgba(6, 10, 13, .12), inset 4px 4px 8px rgba(0, 0, 0, .06); background: radial-gradient(rgba(0, 0, 0, .15), rgba(0, 0, 0, 0) 90%), radial-gradient(circle at 80% 200%, rgba(255, 255, 255, .25), rgba(255, 255, 255, 0) 80%), linear-gradient(rgba(15, 19, 25, .2)); background-color: rgba(0, 0, 0, .2); /* backdrop-filter: blur(20px); background: linear-gradient(110deg, rgba(60,62,58,0.82), rgba(10,16,22,0.88)); */ border: 1px solid rgba(255,255,255,0.68); border-radius: 10px; box-shadow: 0 24px 70px rgba(0,0,0,0.4); display: grid; grid-template-columns: minmax(200px,1.6fr) minmax(200px,1.6fr) minmax(140px,0.8fr) minmax(150px,0.8fr) auto; margin: 0 auto; max-width: 1480px; min-height: 120px; padding: 24px; } /* ─── Field ───────────────────────────────────────────────────────────────── */ .lcb-field { border-right: 1px solid rgba(255,255,255,0.55); display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 0 20px; } .lcb-field:first-child { padding-left: 0; } .lcb-field > label { color: rgba(255,255,255,0.85); font-size: 12px; font-weight: 600; letter-spacing: 0.07em; line-height: 1; margin-bottom: 10px; text-transform: uppercase; } .lcb-field__control { border-bottom: 1px solid rgba(255,255,255,0.28); min-height: 36px; position: relative; } /* Location pin icon inside pickup / dropoff fields */ .lcb-field__icon { align-items: center; color: var(--lcb-primary); display: flex; flex-shrink: 0; left: 0; pointer-events: none; position: absolute; top: 46%; transform: translateY(-50%); } .lcb-field--location input, .lcb-field--dropoff input { padding-left: 22px !important; } .lcb-field input, .lcb-field select { appearance: none; background: transparent; border: 0; border-radius: 0; color: #fff; font: inherit; font-size: 17px; font-weight: 500; min-height: 32px; outline: 0; padding: 0 28px 6px 0; text-overflow: ellipsis; width: 100%; } .lcb-field select { background-image: linear-gradient(45deg, transparent 50%, #fff 50%), linear-gradient(135deg, #fff 50%, transparent 50%); background-position: calc(100% - 14px) 10px, calc(100% - 7px) 10px; background-repeat: no-repeat; background-size: 7px 7px; cursor: pointer; } .lcb-field input::placeholder { color: rgba(255,255,255,0.55); font-weight: 600; } .lcb-field select option { color: #111; } .lcb-action { align-items: center; display: flex; justify-content: flex-end; padding-left: 20px; } /* ─── Buttons ─────────────────────────────────────────────────────────────── */ .lcb-button { align-items: center; border: 2px solid transparent; border-radius: 999px; cursor: pointer; display: inline-flex; font-family: inherit; font-size: 17px; font-weight: 800; justify-content: center; line-height: 1; min-height: 52px; padding: 0 30px; text-decoration: none; transition: background-color 150ms, border-color 150ms, color 150ms, transform 150ms; white-space: nowrap; } .lcb-button:hover { transform: translateY(-1px); } .lcb-button--primary, .lcb-button--primary:hover, .lcb-button--primary:focus, .lcb-button--primary:active { background: var(--lcb-primary)!important; color: #0c1117 !important; } .lcb-button--primary:hover, .lcb-button--primary:focus { background: var(--lcb-primary-hover); } .lcb-button--primary:disabled { background: rgba(255,255,255,0.15); color: rgba(255,255,255,0.4) !important; cursor: not-allowed; transform: none; } .lcb-button--outline { background: transparent; border-color: var(--lcb-primary); color: var(--lcb-primary); } .lcb-button--ghost, .lcb-button--ghost:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.2); color: rgba(255,255,255,0.8) !important; min-height: 42px; padding: 0 18px; } .lcb-button--ghost:hover { background: rgba(255,255,255,0.14); border-color: rgba(255,255,255,0.35); color: #fff !important; } .lcb-button--wide { width: 100%; } /* ─── Messages ────────────────────────────────────────────────────────────── */ .lcb-message, .lcb-form-status { background: rgba(255,255,255,0.96); border-left: 4px solid var(--lcb-primary); border-radius: 6px; color: var(--lcb-ink); font-size: 14px; font-weight: 700; margin-top: 14px; padding: 11px 14px; } .lcb-form-status { background: #fdf9f2; border-left-color: var(--lcb-primary); } .lcb-form-status.is-error, .lcb-message.is-error { background: #fff0f0; border-left-color: #c0392b; color: #7b1f1f; } /* ─── Custom Dropdown (shared: date picker + duration + time) ────────────── */ .lcb-datepicker, .lcb-dropdown { position: relative; } /* Shared trigger style for all three dropdowns */ .lcb-datepicker__trigger, .lcb-dropdown__trigger { align-items: center; background: transparent; border: none; color: #fff; cursor: pointer; display: flex; font-family: inherit; font-size: 17px; font-weight: 500; gap: 8px; min-height: 32px; padding: 0 0 6px; text-align: left; width: 100%; } .lcb-datepicker__trigger [data-lcb-date-display], .lcb-dropdown__trigger [data-lcb-dur-display], .lcb-dropdown__trigger [data-lcb-time-display] { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .lcb-dp-arrow { color: rgba(255,255,255,0.7); flex-shrink: 0; transition: transform 200ms; } [aria-expanded="true"] .lcb-dp-arrow { transform: rotate(180deg); } /* ─── Dropdown panel (duration & time) — portaled to body ────────────────── */ .lcb-dropdown__panel { backdrop-filter: blur(16px); box-shadow: 0 2px 8px 0 rgba(6, 10, 13, .12), inset 4px 4px 8px rgba(0, 0, 0, .06); background-color: rgba(0, 0, 0, .2); border: 1px solid rgba(255, 255, 255, 0.382); border-radius: 14px; box-shadow: 0 24px 64px rgba(0,0,0,0.65); max-height: 320px; overflow: hidden auto; overscroll-behavior: contain; padding: 0; position: absolute; z-index: 999999; } .lcb-dropdown__panel[hidden] { display: none !important; } .lcb-dropdown__panel::-webkit-scrollbar { width: 4px; } .lcb-dropdown__panel::-webkit-scrollbar-track { background: transparent; } .lcb-dropdown__panel::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 2px; } .lcb-dropdown__item { align-items: center; background: transparent; border: none; border-bottom: 1px solid rgba(255,255,255,0.05); border-radius: 0; color: rgba(255,255,255,0.82); cursor: pointer; display: flex; font-family: inherit; font-size: 16px; font-weight: 500; gap: 14px; padding: 15px 22px; text-align: left; transition: background 100ms, color 100ms; width: 100%; } .lcb-dropdown__item:last-child { border-bottom: none; } /* Radio circle — all items */ .lcb-dropdown__item::before { border: 1.5px solid rgba(255,255,255,0.22); border-radius: 50%; content: ''; display: block; flex-shrink: 0; height: 17px; min-width: 17px; transition: background 120ms, border-color 120ms, box-shadow 120ms; width: 17px; } .lcb-dropdown__item:hover { background: rgba(255,255,255,0.04); color: #fff; } /* Selected: gold circle, gold text, transparent background */ .lcb-dropdown__item.is-active { background: transparent; color: var(--lcb-primary); font-weight: 600; } .lcb-dropdown__item.is-active::before { background: var(--lcb-primary); border-color: var(--lcb-primary); box-shadow: 0 0 0 3px rgba(198,166,107,0.2); } .lcb-dropdown__item.is-disabled { color: rgba(255,255,255,0.2); cursor: default; } /* ─── Custom Date Picker ─────────────────────────────────────────────────── */ /* Calendar panel — portaled to , positioned via JS */ .lcb-cal { backdrop-filter: blur(16px); box-shadow: 0 2px 8px 0 rgba(6, 10, 13, .12), inset 4px 4px 8px rgba(0, 0, 0, .06); background-color: rgba(0, 0, 0, .2); border: 1px solid rgba(255, 255, 255, 0.382); border-radius: 18px; box-shadow: 0 40px 100px rgba(0,0,0,0.72), 0 0 0 1px rgba(198,166,107,0.1); padding: 24px 20px 20px; position: absolute; width: 420px; z-index: 999999; } .lcb-cal[hidden] { display: none !important; } .lcb-cal__head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 22px; padding: 0 4px; } .lcb-cal__head strong { color: #fff; font-size: 18px; font-weight: 700; letter-spacing: -0.01em; } .lcb-cal__nav { align-items: center; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.1); border-radius: 50%; color: rgba(255,255,255,0.7); cursor: pointer; display: flex; height: 38px; justify-content: center; transition: background 150ms, color 150ms, border-color 150ms; width: 38px; } .lcb-cal__nav:hover { background: rgba(198,166,107,0.18); border-color: rgba(198,166,107,0.5); color: var(--lcb-primary); } .lcb-cal__week { display: grid; gap: 2px; grid-template-columns: repeat(7, 1fr); margin-bottom: 6px; } .lcb-cal__week span { color: rgba(255,255,255,0.28); font-size: 11px; font-weight: 700; letter-spacing: 0.09em; padding: 6px 0; text-align: center; text-transform: uppercase; } .lcb-cal__grid { display: grid; gap: 4px; grid-template-columns: repeat(7, 1fr); } .lcb-cal__day { align-items: center; aspect-ratio: 1; background: transparent; border: none; border-radius: 10px; color: rgba(255,255,255,0.82); cursor: pointer; display: flex; font-family: inherit; font-size: 15px; font-weight: 500; justify-content: center; min-height: 48px; transition: background 120ms, color 120ms; } button.lcb-cal__day:hover { background: rgba(255,255,255,0.09); color: #fff; } span.lcb-cal__day { color: rgba(255,255,255,0.15); cursor: not-allowed; font-size: 15px; text-decoration: line-through; text-decoration-color: rgba(255,255,255,0.1); } .lcb-cal__day.is-today { border: 1.5px solid var(--lcb-primary); color: var(--lcb-primary); font-weight: 700; } .lcb-cal__day.is-sel { background: var(--lcb-primary) !important; color: #0c1117 !important; font-weight: 800; } .lcb-cal__day.is-sel:hover { background: var(--lcb-primary-hover) !important; } /* ─── Results ────────────────────────────────────────────────────────────── */ .lcb-results { background: transparent; padding: 32px 20px 64px; } .lcb-results__bar, .lcb-results__grid { margin: 0 auto; max-width: 1600px; } .lcb-results__bar { align-items: center; display: flex; gap: 16px; justify-content: space-between; margin-bottom: 32px; } /* ─── Search Summary Pill — Premium Dark Card ────────────────────────────── */ .lcb-summary-pill { align-items: stretch; background: #0c1117; border: 1.5px solid rgba(198,166,107,0.35); border-radius: 14px; box-shadow: 0 4px 24px rgba(0,0,0,0.35), 0 0 0 1px rgba(198,166,107,0.06) inset; color: #fff; display: flex; flex: 1; min-height: 56px; overflow: hidden; } /* Route section (pickup → dropoff) */ .lcb-sum-route { align-items: center; display: flex; flex: 1; gap: 10px; min-width: 0; padding: 14px 20px; } .lcb-sum-from { color: #fff; flex-shrink: 1; font-size: 14px; font-weight: 700; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .lcb-sum-to { color: rgba(255,255,255,0.65); flex-shrink: 1; font-size: 14px; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .lcb-sum-arrow-icon { color: var(--lcb-primary); display: inline-block; flex-shrink: 0; } /* Vertical divider */ .lcb-sum-divider { background: rgba(255,255,255,0.09); flex-shrink: 0; margin: 10px 0; width: 1px; } /* Time + distance section */ .lcb-sum-meta { align-items: center; color: rgba(255,255,255,0.55); display: flex; flex-shrink: 0; font-size: 13px; font-weight: 500; gap: 7px; padding: 14px 20px; white-space: nowrap; } .lcb-sum-clock { color: rgba(255,255,255,0.4); flex-shrink: 0; } .lcb-sum-dist { color: rgba(255,255,255,0.3); font-size: 12px; } .lcb-results__grid { align-items: start; /* required for sticky sidebar */ display: grid; gap: 40px; grid-template-columns: minmax(0,1fr) minmax(320px,480px); } /* ─── Vehicle Section ─────────────────────────────────────────────────────── */ .lcb-vehicles h2 { color: var(--lcb-paper); font-size: 28px; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 24px; } .lcb-vehicle-grid { display: grid; gap: 24px; grid-template-columns: repeat(3, 1fr); } .lcb-no-results { color: var(--lcb-muted); font-size: 15px; grid-column: 1/-1; padding: 32px 0; } /* ─── Vehicle Card (Dark luxury) ─────────────────────────────────────────── */ .lcb-vehicle { background: #0c1117 !important; border: 2px solid rgba(255,255,255,0.1) !important; border-radius: 22px !important; cursor: pointer !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; position: relative !important; text-align: left !important; transition: border-color 350ms ease, box-shadow 350ms ease, transform 350ms ease !important; } .lcb-vehicle:hover { border-color: rgba(198,166,107,0.6) !important; box-shadow: 0 15px 40px rgba(198,166,107,0.16) !important; transform: translateY(-5px) !important; } .lcb-vehicle.is-active { border-color: #c6a66b !important; border-width: 2px !important; box-shadow: 0 0 0 3px rgba(198,166,107,0.2) !important; } .lcb-vehicle-image { padding: 14px 14px 0; } .lcb-vehicle-image img { aspect-ratio: 12 / 16; border-radius: 14px; display: block; height: auto; object-fit: cover; object-position: center center; width: 100%; } .lcb-vehicle-content { padding: 18px 20px 20px; } /* Elementor override — force all card text styles */ .lcb-widget .lcb-vehicle .lcb-vehicle-head, .lcb-vehicle-head { align-items: flex-start !important; display: flex !important; gap: 10px !important; justify-content: space-between !important; margin: 0 0 12px !important; } .lcb-widget .lcb-vehicle .lcb-vehicle-head h3, .lcb-vehicle-head h3 { color: #ffffff !important; font-family: 'Poppins', Arial, sans-serif !important; font-size: 18px !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.3 !important; margin: 0 !important; text-transform: none !important; } .lcb-widget .lcb-vehicle .lcb-vehicle-head span, .lcb-vehicle-head span { color: #c6a66b !important; font-size: 18px !important; font-weight: 700 !important; white-space: nowrap !important; } .lcb-widget .lcb-vehicle .lcb-vehicle-meta, .lcb-vehicle-meta { color: rgba(255,255,255,0.7) !important; display: flex !important; font-size: 15px !important; gap: 20px !important; } .lcb-widget .lcb-vehicle .lcb-vehicle-meta div, .lcb-vehicle-meta div { align-items: center !important; display: flex !important; gap: 6px !important; } .lcb-widget .lcb-vehicle .lcb-vehicle-meta i, .lcb-vehicle-meta i { color: #c6a66b !important; font-size: 14px !important; } /* ─── Sidebar — sticky only on large screens ─────────────────────────────── */ .lcb-sidebar { align-self: start; display: flex; flex-direction: column; gap: 16px; position: sticky; top: 24px; } /* Remove sticky on any screen where the grid collapses to 1 column */ @media (max-width: 1200px) { .lcb-sidebar { position: relative !important; top: auto !important; } } .lcb-map { background: #cfd8df; border-radius: 10px; height: 210px; overflow: hidden; position: relative; } .lcb-map__fallback { align-items: center; background: linear-gradient(135deg, #e8edf1, #cdd6dc); display: flex; height: 100%; justify-content: space-around; padding: 24px; } .lcb-map__fallback span { background: #fff; border: 2px solid var(--lcb-primary); border-radius: 999px; color: #27313b; font-size: 12px; font-weight: 800; max-width: 120px; overflow: hidden; padding: 7px 12px; text-overflow: ellipsis; white-space: nowrap; } .lcb-map__route { background: repeating-linear-gradient(90deg,var(--lcb-primary),var(--lcb-primary) 8px,transparent 8px,transparent 16px); height: 2px; min-width: 80px; width: 30%; } /* ─── Selection Panel — Dark Luxury sidebar ──────────────────────────────── */ .lcb-selection { backdrop-filter: blur(16px); background: radial-gradient(rgba(0,0,0,.12),rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%,rgba(255,255,255,.18),rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.15)); background-color: #0f1620; border: 1px solid rgba(255,255,255,0.1); border-radius: 18px; box-shadow: 0 20px 60px rgba(0,0,0,0.5), 0 0 0 1px rgba(198,166,107,0.06); overflow: hidden; } .lcb-selection__top { align-items: flex-start; border-bottom: 1px solid rgba(255,255,255,0.08); display: flex; gap: 12px; justify-content: space-between; padding: 20px 22px 16px; } .lcb-selection__top strong { color: #fff; display: block; font-size: 18px; font-weight: 700; line-height: 1.25; } .lcb-selection__top span { color: rgba(255,255,255,0.45); display: block; font-size: 13px; margin-top: 4px; } .lcb-selection__top .lcb-sel-price { color: var(--lcb-primary); font-size: 20px; font-weight: 800; white-space: nowrap; } /* ─── Booking Choice Buttons — Dark ─────────────────────────────────────── */ .lcb-booking-choice { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px 8px; } .lcb-choice, .lcb-choice:hover { -webkit-appearance: none !important; appearance: none !important; align-items: center !important; background: rgba(255,255,255,0.04) !important; background-image: none !important; border: 1.5px solid rgba(255,255,255,0.12) !important; border-radius: 12px !important; box-shadow: none !important; cursor: pointer !important; display: flex !important; gap: 14px !important; min-height: 68px !important; padding: 14px 16px !important; text-align: left !important; text-transform: none !important; transition: border-color 150ms, background 150ms !important; width: 100% !important; } .lcb-choice:hover { background: rgba(255,255,255,0.07) !important; border-color: rgba(255,255,255,0.22) !important; } .lcb-choice.is-active, .lcb-choice.is-active:hover { background: rgba(198,166,107,0.08) !important; border-color: var(--lcb-primary) !important; border-width: 1.5px !important; } .lcb-choice__icon { align-items: center !important; background: rgba(255,255,255,0.08) !important; border-radius: 50% !important; color: rgba(255,255,255,0.5) !important; display: inline-flex !important; flex-shrink: 0 !important; height: 40px !important; justify-content: center !important; transition: background 150ms, color 150ms !important; width: 40px !important; } .lcb-choice.is-active .lcb-choice__icon { background: rgba(198,166,107,0.18) !important; color: var(--lcb-primary) !important; } .lcb-choice__text { flex: 1 !important; } .lcb-choice strong, .lcb-choice small { display: block !important; } .lcb-choice strong { color: #fff !important; font-family: 'Poppins', Arial, sans-serif !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: 0 !important; } .lcb-choice small { color: rgba(255,255,255,0.45) !important; font-size: 12px !important; font-weight: 400 !important; margin-top: 2px !important; } .lcb-choice__chevron { color: rgba(255,255,255,0.3) !important; flex-shrink: 0 !important; margin-left: auto !important; } .lcb-fees-row { align-items: center; border-top: 1px solid rgba(255,255,255,0.07); color: rgba(255,255,255,0.45); display: flex; font-size: 13px; font-weight: 500; justify-content: space-between; margin-top: 6px; padding: 12px 22px; } .lcb-fees-badge { align-items: center; background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.12); border-radius: 999px; color: rgba(255,255,255,0.7); display: inline-flex; font-size: 12px; font-weight: 600; padding: 5px 12px; } .lcb-selection__cta { padding: 6px 18px 20px; } /* ─── Modal — Dark Luxury ─────────────────────────────────────────────────── */ .lcb-modal[hidden] { display: none; } .lcb-modal { align-items: flex-start; display: flex; inset: 0; justify-content: center; overflow-y: auto; padding: 32px 16px; position: fixed; z-index: 99999; } .lcb-modal__backdrop { backdrop-filter: blur(4px); background: rgba(5,8,12,0.78); inset: 0; position: fixed; } .lcb-modal__panel { backdrop-filter: blur(16px); background: radial-gradient(rgba(0,0,0,.12),rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%,rgba(255,255,255,.18),rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.15)); background-color: #0f1620; border: 1px solid rgba(255,255,255,0.1); border-radius: 20px; box-shadow: 0 40px 100px rgba(0,0,0,0.7), 0 0 0 1px rgba(198,166,107,0.08); margin: auto; max-width: 580px; overflow: hidden; padding: 0; position: relative; width: 100%; } .lcb-modal__close { align-items: center; backdrop-filter: blur(16px); background-color: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.2); border-radius: 50%; color: rgba(255,255,255,0.8); cursor: pointer; display: inline-flex; height: 38px; justify-content: center; position: absolute; right: 18px; top: 18px; transition: background-color 150ms, color 150ms; width: 38px; z-index: 1; } .lcb-modal__close:hover { background-color: rgba(255,255,255,0.22); color: #fff; } .lcb-modal__header { background: linear-gradient(135deg, rgba(198,166,107,0.12), rgba(198,166,107,0.04)); border-bottom: 1px solid rgba(255,255,255,0.08); border-radius: 20px 20px 0 0; color: #fff; padding: 24px 56px 20px 26px; } .lcb-modal__header h2 { color: #fff; font-family: 'Poppins', Arial, sans-serif; font-size: 19px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.3; margin: 0 0 4px; } .lcb-modal__header p { color: rgba(255,255,255,0.5); font-size: 13px; line-height: 1.4; margin: 0; } /* ─── Booking Form — Dark Luxury ─────────────────────────────────────────── */ .lcb-booking-form { display: grid; gap: 14px; padding: 22px 26px 26px; } .lcb-booking-form label { display: grid; gap: 6px; } .lcb-booking-form label span { color: rgba(255,255,255,0.5); font-size: 11px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; } .lcb-booking-form input, .lcb-booking-form textarea, .lcb-booking-form select { appearance: none; background: rgba(255,255,255,0.06) !important; border: 1.5px solid rgba(255,255,255,0.14) !important; border-radius: 8px !important; color: #fff !important; font: inherit; font-size: 14px; min-height: 42px; outline: none; padding: 10px 14px; transition: border-color 150ms, background 150ms; width: 100%; } .lcb-booking-form input::placeholder, .lcb-booking-form textarea::placeholder { color: rgba(255,255,255,0.3) !important; } .lcb-booking-form input:focus, .lcb-booking-form textarea:focus, .lcb-booking-form select:focus { background: rgba(255,255,255,0.1) !important; border-color: var(--lcb-primary) !important; } .lcb-booking-form textarea { min-height: 80px; resize: vertical; } .lcb-booking-form select option { background: #0f1620; color: #fff; } .lcb-input-row { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0,1fr)); } /* ─── Extras icon grid — Dark ────────────────────────────────────────────── */ .lcb-extras:empty { display: none; } .lcb-extras-label { color: rgba(255,255,255,0.45); font-size: 11px; font-weight: 700; letter-spacing: 0.07em; margin: 0 0 10px; text-transform: uppercase; } .lcb-extras-grid { display: grid; gap: 10px; grid-template-columns: repeat(3, 1fr); } .lcb-extra-card { align-items: center; border: 1.5px solid rgba(255,255,255,0.12); border-radius: 10px; cursor: pointer; display: flex; flex-direction: column; gap: 6px; padding: 12px 8px; position: relative; text-align: center; transition: border-color 150ms, background 150ms; } .lcb-extra-card input { opacity: 0; pointer-events: none; position: absolute; } .lcb-extra-card:has(input:checked) { background: rgba(198,166,107,0.1); border-color: var(--lcb-primary); } .lcb-extra-card__icon { align-items: center; background: rgba(255,255,255,0.08); border-radius: 50%; color: rgba(255,255,255,0.5); display: flex; height: 38px; justify-content: center; transition: background 150ms, color 150ms; width: 38px; } .lcb-extra-card:has(input:checked) .lcb-extra-card__icon { background: rgba(198,166,107,0.18); color: var(--lcb-primary); } .lcb-extra-card__name { color: rgba(255,255,255,0.75); display: block; font-size: 12px; font-weight: 600; line-height: 1.3; } .lcb-extra-card__price { color: var(--lcb-primary); display: block; font-size: 12px; font-weight: 700; } /* ─── Modal Total — Dark ─────────────────────────────────────────────────── */ .lcb-modal-total { align-items: center; background: rgba(198,166,107,0.1); border: 1.5px solid rgba(198,166,107,0.25); border-radius: 10px; display: flex; justify-content: space-between; padding: 12px 16px; } .lcb-modal-total span { color: rgba(255,255,255,0.5); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; } .lcb-modal-total strong { color: var(--lcb-primary); font-size: 22px; font-weight: 800; } /* ─── Booking Confirmation — Dark ────────────────────────────────────────── */ .lcb-confirm { padding: 40px 32px; text-align: center; } .lcb-confirm__check { align-items: center; background: radial-gradient(rgba(198,166,107,0.15), transparent 70%); border-radius: 50%; display: inline-flex; height: 72px; justify-content: center; margin: 0 auto 20px; width: 72px; } .lcb-confirm__check svg { color: var(--lcb-primary); } .lcb-confirm__title { color: #fff; font-family: Georgia, 'Times New Roman', serif; font-size: 26px; font-weight: 400; letter-spacing: -0.01em; margin: 0 0 8px; } .lcb-confirm__sub { color: rgba(255,255,255,0.55); font-size: 14px; line-height: 1.6; margin: 0 auto 28px; max-width: 360px; } .lcb-confirm__card { backdrop-filter: blur(16px); background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 14px; margin: 0 auto; max-width: 400px; padding: 22px 24px; text-align: left; } .lcb-confirm__card dl { display: grid; gap: 12px; grid-template-columns: 1fr 1fr; margin: 0; } .lcb-confirm__card dt { color: rgba(255,255,255,0.45); font-size: 13px; } .lcb-confirm__card dd { color: #fff; font-size: 14px; font-weight: 700; margin: 0; text-align: right; } .lcb-confirm__ref { color: var(--lcb-primary); font-size: 13px; font-weight: 700; margin-top: 18px; text-align: center; } body.lcb-modal-open { overflow: hidden; } /* ─── Google Places Autocomplete — dark theme ────────────────────────────── */ .pac-container { background: #0c1117 !important; border: 1px solid rgba(255,255,255,0.2) !important; border-radius: 12px !important; box-shadow: 0 20px 60px rgba(0,0,0,0.7) !important; font-family: 'Poppins', Arial, sans-serif !important; margin-top: 4px !important; min-width: 0 !important; overflow: hidden; z-index: 999999 !important; } /* Footer: "powered by" white text + custom Google PNG logo right after */ .pac-container::after { align-items: center !important; background-color: #0c1117 !important; background-position: left 84px center !important; background-repeat: no-repeat !important; background-size: auto 15px !important; border-top: 1px solid rgba(255,255,255,0.07) !important; color: rgba(255,255,255,0.75) !important; content: "powered by" !important; display: flex !important; font-family: 'Poppins', Arial, sans-serif !important; font-size: 11px !important; font-weight: 500 !important; height: 34px !important; letter-spacing: 0.02em !important; padding: 0 12px !important; } /* Grid layout: pin icon spans both rows, name + address stack vertically */ .pac-item { border: none !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important; column-gap: 10px !important; cursor: pointer !important; display: grid !important; font-family: 'Poppins', Arial, sans-serif !important; font-size: 13px !important; grid-template-columns: 22px 1fr !important; line-height: 1.5 !important; overflow: visible !important; padding: 12px 20px 12px 16px !important; transition: background 100ms !important; white-space: normal !important; } .pac-item:last-child { border-bottom: none !important; } .pac-item:hover, .pac-item-selected { background: rgba(255,255,255,0.07) !important; } /* Icon spans both name and address rows */ .pac-icon { align-self: start !important; filter: brightness(0) invert(1) !important; grid-column: 1 !important; grid-row: 1 / 3 !important; margin-top: 3px !important; opacity: 0.45 !important; } /* Establishment / place name — white bold, first row */ .pac-item-query { color: #fff !important; font-size: 14px !important; font-weight: 600 !important; grid-column: 2 !important; grid-row: 1 !important; line-height: 1.45 !important; margin-bottom: 3px !important; overflow-wrap: break-word !important; white-space: normal !important; word-break: break-word !important; } /* Secondary address text — muted, second row, wraps fully */ .pac-item > span:not(.pac-icon):not(.pac-item-query) { color: rgba(255,255,255,0.5) !important; font-size: 12px !important; grid-column: 2 !important; grid-row: 2 !important; line-height: 1.4 !important; overflow-wrap: break-word !important; white-space: normal !important; word-break: break-word !important; } .pac-matched { color: var(--lcb-primary) !important; font-weight: 700 !important; } /* ─── intl-tel-input — dark luxury theme ─────────────────────────────────── */ /* Wrapper fills the label */ .lcb-booking-form .iti { width: 100% !important; } .lcb-booking-form .iti input[type="tel"], .lcb-booking-form .iti input[type="tel"]:focus { padding-left: 90px !important; /* room for flag+code */ } /* Flag+code button */ .lcb-booking-form .iti__selected-flag, .lcb-booking-form .iti__selected-flag:hover, .lcb-booking-form .iti__selected-flag:focus { background: rgba(255,255,255,0.08) !important; border-right: 1px solid rgba(255,255,255,0.12) !important; border-radius: 8px 0 0 8px !important; padding: 0 10px !important; outline: none !important; } .lcb-booking-form .iti__selected-flag:hover { background: rgba(255,255,255,0.14) !important; } /* Dial code text (e.g. +1) */ .lcb-booking-form .iti__selected-dial-code { color: rgba(255,255,255,0.75) !important; font-size: 13px !important; font-weight: 600 !important; margin-left: 4px !important; } /* Down arrow */ .lcb-booking-form .iti__arrow { border-top-color: rgba(255,255,255,0.45) !important; margin-left: 5px !important; } .lcb-booking-form .iti__arrow--up { border-bottom-color: rgba(255,255,255,0.45) !important; border-top: none !important; } /* Country dropdown */ .iti__country-list { background: #0f1620 !important; border: 1px solid rgba(255,255,255,0.14) !important; border-radius: 12px !important; box-shadow: 0 24px 60px rgba(0,0,0,0.75) !important; max-height: 260px !important; overflow-y: auto !important; padding: 6px 0 !important; } .iti__country-list::-webkit-scrollbar { width: 4px; } .iti__country-list::-webkit-scrollbar-track { background: transparent; } .iti__country-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 2px; } .iti__country { color: rgba(255,255,255,0.8) !important; padding: 9px 14px !important; transition: background 100ms !important; } .iti__country:hover, .iti__country.iti__highlight { background: rgba(255,255,255,0.07) !important; } .iti__country-name { color: rgba(255,255,255,0.8) !important; font-size: 13px !important; } .iti__dial-code { color: rgba(255,255,255,0.38) !important; font-size: 12px !important; } .iti__divider { border-top-color: rgba(255,255,255,0.08) !important; margin: 4px 0 !important; } /* Search box inside dropdown (v17+) */ .iti__search-input { background: rgba(255,255,255,0.07) !important; border: 1px solid rgba(255,255,255,0.12) !important; border-radius: 6px !important; color: #fff !important; margin: 6px 10px !important; outline: none !important; padding: 7px 10px !important; width: calc(100% - 20px) !important; } .iti__search-input::placeholder { color: rgba(255,255,255,0.3) !important; } /* ─── Remove number input spinners ──────────────────────────────────────── */ .lcb-booking-form input[type="number"], .lcb-widget input[type="number"] { -moz-appearance: textfield !important; appearance: textfield !important; } .lcb-booking-form input[type="number"]::-webkit-inner-spin-button, .lcb-booking-form input[type="number"]::-webkit-outer-spin-button, .lcb-widget input[type="number"]::-webkit-inner-spin-button, .lcb-widget input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none !important; margin: 0 !important; } /* ─── Detail section buttons — force dark theme overrides ───────────────── */ .lcb-detail .lcb-captabs__tab, .lcb-detail .lcb-captabs__tab:hover, .lcb-detail .lcb-captabs__tab:focus { -webkit-appearance: none !important; appearance: none !important; background: transparent !important; background-color: transparent !important; background-image: none !important; border-color: transparent !important; border-radius: 0 !important; border-style: none !important; border-width: 0 !important; border-bottom-width: 2px !important; border-bottom-style: solid !important; border-bottom-color: transparent !important; box-shadow: none !important; color: rgba(255,255,255,0.45) !important; cursor: pointer !important; font-family: 'Poppins', Arial, sans-serif !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0 !important; margin: 0 !important; min-height: 0 !important; padding: 8px 20px 10px !important; text-transform: none !important; transition: color 150ms, border-color 150ms !important; } .lcb-detail .lcb-captabs__tab.is-active, .lcb-detail .lcb-captabs__tab.is-active:hover { border-bottom-color: #fff !important; color: #fff !important; } .lcb-detail .lcb-captabs__tab:hover:not(.is-active) { color: rgba(255,255,255,0.8) !important; } .lcb-detail .lcb-captabs__subtab, .lcb-detail .lcb-captabs__subtab:hover, .lcb-detail .lcb-captabs__subtab:focus { -webkit-appearance: none !important; appearance: none !important; background: transparent !important; background-image: none !important; border: 1.5px solid rgba(255,255,255,0.25) !important; border-radius: 999px !important; box-shadow: none !important; color: rgba(255,255,255,0.8) !important; cursor: pointer !important; font-family: 'Poppins', Arial, sans-serif !important; font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0 !important; min-height: 0 !important; padding: 7px 16px !important; text-transform: none !important; transition: border-color 150ms, background 150ms, color 150ms !important; white-space: nowrap !important; } .lcb-detail .lcb-captabs__subtab.is-active, .lcb-detail .lcb-captabs__subtab.is-active:hover { background: var(--lcb-primary) !important; background-color: var(--lcb-primary) !important; border-color: var(--lcb-primary) !important; color: #0c1117 !important; } .lcb-detail .lcb-captabs__subtab:hover:not(.is-active) { border-color: rgba(255,255,255,0.55) !important; color: #fff !important; } /* Book button inside detail */ .lcb-detail .lcb-button--primary, .lcb-detail .lcb-button--primary:hover { background: var(--lcb-primary) !important; background-color: var(--lcb-primary) !important; background-image: none !important; border: none !important; border-radius: 999px !important; box-shadow: 0 4px 24px rgba(198,166,107,0.3) !important; color: #0c1117 !important; } .lcb-detail .lcb-button--primary:hover { background-color: var(--lcb-primary-hover) !important; transform: translateY(-1px) !important; } /* ─── Elementor overrides for widget-internal buttons ────────────────────── */ /* Search form dropdown triggers */ .lcb-search .lcb-datepicker__trigger, .lcb-search .lcb-datepicker__trigger:hover, .lcb-search .lcb-dropdown__trigger, .lcb-search .lcb-dropdown__trigger:hover { -webkit-appearance: none !important; appearance: none !important; align-items: center !important; background: transparent !important; background-image: none !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; color: #fff !important; display: flex !important; font-size: 17px !important; font-weight: 500 !important; gap: 8px !important; letter-spacing: 0 !important; min-height: 32px !important; padding: 0 0 6px !important; text-transform: none !important; width: 100% !important; } /* Widget main buttons */ .lcb-widget .lcb-button { font-family: 'Poppins', Arial, sans-serif !important; font-size: 16px !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important; } /* Sidebar choice buttons */ .lcb-selection .lcb-choice, .lcb-selection .lcb-choice:hover { background-image: none !important; box-shadow: none !important; letter-spacing: 0 !important; text-align: left !important; text-transform: none !important; } .lcb-choice__icon { align-items: center !important; display: inline-flex !important; justify-content: center !important; } .lcb-choice__icon svg, .lcb-choice__chevron { display: block !important; } /* ─── Responsive 1200px ──────────────────────────────────────────────────── */ @media (max-width: 1200px) { .lcb-search { grid-template-columns: repeat(2, minmax(0,1fr)); } .lcb-field { border-right: none; padding: 12px 16px; } .lcb-field:first-child { padding-left: 16px; } .lcb-action { grid-column: 1 / -1; justify-content: stretch; padding: 12px 16px; } .lcb-action .lcb-button { width: 100%; } .lcb-results__grid { gap: 32px; grid-template-columns: 1fr; } /* Sidebar goes above the vehicle list when stacked */ .lcb-sidebar { order: -1; } .lcb-map { height: 260px; } .lcb-vehicle-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } .lcb-vehicle-image img { aspect-ratio: 12 / 16; } .lcb-cal { left: 0; } /* Summary bar stacks on narrow screens */ .lcb-results__bar { align-items: stretch; flex-direction: column; gap: 12px; } .lcb-summary-pill { min-height: 50px; } } /* ─── Responsive 860px ───────────────────────────────────────────────────── */ @media (max-width: 860px) { .lcb-hero__shade { padding: 24px 14px 36px; } .lcb-mode { margin-bottom: 18px; width: 100%; } .lcb-mode__item { flex: 1; font-size: 15px; min-width: 0; padding: 0 12px; } .lcb-search { padding: 12px; } .lcb-input-row { grid-template-columns: 1fr; } .lcb-vehicle-grid { grid-template-columns: 1fr; gap: 16px; } .lcb-vehicle-image img { aspect-ratio: 12 / 16; } .lcb-vehicle-head { flex-direction: column; gap: 6px; } .lcb-vehicle-head h3 { font-size: 18px; } .lcb-vehicle-head span { font-size: 17px; } .lcb-results { padding: 24px 14px 48px; } .lcb-results__bar { align-items: stretch; flex-direction: column; gap: 10px; } /* On mobile the summary pill wraps route and time to separate rows */ .lcb-summary-pill { flex-wrap: wrap; } .lcb-sum-divider { display: none; } .lcb-sum-route { padding: 14px 16px 8px; } .lcb-sum-meta { padding: 0 16px 14px; border-top: 1px solid rgba(255,255,255,0.07); margin-top: 0; width: 100%; } .lcb-vehicles h2 { font-size: 24px; margin-bottom: 18px; } .lcb-modal { padding: 16px; } .lcb-modal__header { padding: 22px 48px 18px 22px; } .lcb-modal__header h2 { font-size: 18px; } .lcb-booking-form { padding: 18px 20px 22px; } .lcb-selection__top { padding: 16px 18px 14px; } .lcb-fees-row { padding: 10px 18px; } .lcb-selection__cta { padding: 0 14px 16px; } .lcb-confirm { padding: 28px 20px; } } /* ─── Responsive 560px ───────────────────────────────────────────────────── */ @media (max-width: 560px) { .lcb-vehicle-image img { aspect-ratio: 12 / 16; } .lcb-modal__panel { border-radius: 14px 14px 0 0; margin-bottom: 0; } .lcb-modal { align-items: flex-end; padding: 0; } .lcb-cal .lcb-cal__day { aspect-ratio: 1 !important; font-size: 12px !important; min-height: 30px !important; } } /* ═══════════════════════════════════════════════════════════════════════════ VEHICLE DETAIL — Unavailable overlay + Explore button ═══════════════════════════════════════════════════════════════════════════ */ /* Unavailable card dim */ .lcb-vehicle.is-unavailable { cursor: default !important; opacity: 0.82; } .lcb-vehicle.is-unavailable:hover { border-color: rgba(255,255,255,0.1) !important; box-shadow: none !important; transform: none !important; } /* Overlay sits over the image */ .lcb-vehicle-image { position: relative; } .lcb-vehicle-overlay { backdrop-filter: blur(16px); background: radial-gradient(rgba(0,0,0,.15), rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%, rgba(255,255,255,.25), rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.2)); background-color: rgba(0,0,0,.6); border-radius: 14px; align-items: center; display: flex; justify-content: center; position: absolute; inset: 14px 14px 0; } .lcb-vehicle-overlay__box { align-items: center; color: #fff; display: flex; flex-direction: column; gap: 6px; padding: 16px; text-align: center; } .lcb-vehicle-overlay__box svg { opacity: 0.8; } .lcb-vehicle-overlay__box strong { color: #fff; display: block; font-size: 14px; font-weight: 700; letter-spacing: 0.03em; } .lcb-vehicle-overlay__box span { color: rgba(255,255,255,0.65); display: block; font-size: 12px; font-weight: 500; line-height: 1.4; } /* Click-hint on cards — gold bottom glow on hover to suggest clickability */ .lcb-vehicle:not(.is-unavailable):hover .lcb-vehicle-content { border-top: 1px solid rgba(198,166,107,0.15); margin-top: -1px; } /* ═══════════════════════════════════════════════════════════════════════════ INLINE VEHICLE DETAIL SECTION — Dark theme ═══════════════════════════════════════════════════════════════════════════ */ .lcb-detail[hidden] { display: none !important; } .lcb-detail { background: #0c1117; border-radius: 20px; color: #fff; margin-top: 28px; overflow: hidden; position: relative; } /* Top bar: name + close */ .lcb-detail__topbar { padding: 22px 22px 0; } .lcb-detail__titlerow { align-items: flex-start; display: flex; gap: 12px; justify-content: space-between; } .lcb-detail__name { color: #fff; font-family: 'Poppins', Arial, sans-serif; font-size: 22px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.2; margin: 0 0 4px; } .lcb-detail__model { color: rgba(255,255,255,0.55); font-size: 13px; line-height: 1.4; margin: 0 0 10px; } .lcb-detail__topright { align-items: center; display: flex; flex-shrink: 0; gap: 14px; } .lcb-detail__hprice { color: var(--lcb-primary); font-size: 22px; font-weight: 700; white-space: nowrap; } /* Close button */ .lcb-detail__close { align-items: center; backdrop-filter: blur(16px); background: radial-gradient(rgba(0,0,0,.15),rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%,rgba(255,255,255,.25),rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.2)); background-color: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.2); border-radius: 999px; color: #fff; cursor: pointer; display: inline-flex; flex-shrink: 0; height: 38px; justify-content: center; min-width: 38px; transition: background-color 150ms; width: 38px; } .lcb-detail__close:hover { background-color: rgba(255,255,255,0.22); } /* Body padding */ .lcb-detail__body { padding: 0 0 32px; } /* Unavailable notice */ .lcb-detail__unavail { align-items: center; background: rgba(255,180,0,0.1); border: 1px solid rgba(255,180,0,0.3); border-radius: 10px; color: #ffc84a; display: flex; font-size: 13px; font-weight: 600; gap: 8px; margin: 14px 22px 0; padding: 12px 16px; } /* Sections — glass-card effect with white transparent border */ .lcb-detail__section { backdrop-filter: blur(16px); background: radial-gradient(rgba(0,0,0,.15),rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%,rgba(255,255,255,.25),rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.2)); background-color: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.09); border-radius: 14px; margin: 16px 22px 0; padding: 22px; } .lcb-detail__stitle { color: #fff; font-family: 'Poppins', Arial, sans-serif; font-size: 17px; font-weight: 700; letter-spacing: -0.01em; margin: 0 0 16px; } /* Footer CTA */ .lcb-detail__footer { margin: 20px 22px 0; } /* ═══════════════════════════════════════════════════════════════════════════ GALLERY SLIDER (inside detail drawer) ═══════════════════════════════════════════════════════════════════════════ */ .lcb-dgallery { background: #0c1117; overflow: hidden; position: relative; } .lcb-dgallery[hidden] { display: none !important; } .lcb-dgallery__track { cursor: grab; height: 300px; overflow: hidden; position: relative; user-select: none; } .lcb-dgallery__img { display: block; height: 100%; object-fit: cover; object-position: center; width: 100%; } .lcb-dgallery__nav { backdrop-filter: blur(16px); background-color: rgba(0,0,0,.2); background: radial-gradient(rgba(0,0,0,.15),rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%,rgba(255,255,255,.25),rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.2)); border: 1px solid rgba(255,255,255,0.25); border-radius: 50%; color: #fff; cursor: pointer; font-size: 24px; height: 44px; line-height: 1; padding: 0; position: absolute; top: 50%; transform: translateY(-50%); transition: background-color 150ms; width: 44px; display: flex; align-items: center; justify-content: center; z-index: 2; } .lcb-dgallery__nav:hover { background-color: rgba(0,0,0,.38); } .lcb-dgallery__nav--prev { left: 14px; } .lcb-dgallery__nav--next { right: 14px; } .lcb-dgallery__footer { align-items: center; backdrop-filter: blur(16px); background-color: rgba(0,0,0,.2); background: radial-gradient(rgba(0,0,0,.15),rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%,rgba(255,255,255,.25),rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.2)); bottom: 0; display: flex; gap: 12px; justify-content: space-between; left: 0; padding: 10px 18px; position: absolute; right: 0; } .lcb-dgallery__caption { color: rgba(255,255,255,0.9); flex: 1; font-size: 13px; font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .lcb-dgallery__dots { align-items: center; display: flex; flex-shrink: 0; gap: 6px; } .lcb-dgallery__dot { background: rgba(255,255,255,0.4); border-radius: 50%; display: block; height: 8px; transition: background 150ms, transform 150ms; width: 8px; } .lcb-dgallery__dot.is-active { background: #c6a66b; transform: scale(1.3); } /* ═══════════════════════════════════════════════════════════════════════════ WHAT'S INCLUDED GRID — dark theme ═══════════════════════════════════════════════════════════════════════════ */ .lcb-included-grid { display: grid; gap: 20px 16px; grid-template-columns: repeat(3, 1fr); } .lcb-included-item { align-items: center; display: flex; flex-direction: column; gap: 10px; text-align: center; } .lcb-included-item__icon { align-items: center; color: rgba(255,255,255,0.6); display: flex; flex-shrink: 0; height: 44px; justify-content: center; width: 44px; } .lcb-included-item__label { color: rgba(255,255,255,0.65); font-size: 12px; line-height: 1.4; } /* ═══════════════════════════════════════════════════════════════════════════ CAPACITY TABS — dark theme ═══════════════════════════════════════════════════════════════════════════ */ .lcb-captabs__bar { border-bottom: 1px solid rgba(255,255,255,0.12); display: flex; gap: 0; margin-bottom: 14px; } .lcb-captabs__tab { background: transparent; border: none; border-bottom: 2px solid transparent; color: rgba(255,255,255,0.45); cursor: pointer; font-family: 'Poppins', Arial, sans-serif; font-size: 15px; font-weight: 600; margin-bottom: -1px; padding: 8px 20px 10px; transition: color 150ms, border-color 150ms; } .lcb-captabs__tab.is-active { border-bottom-color: #fff; color: #fff; } .lcb-captabs__tab:hover:not(.is-active) { color: rgba(255,255,255,0.8); } .lcb-captabs__note { color: rgba(255,255,255,0.5); font-size: 13px; line-height: 1.5; margin: 0 0 14px; } .lcb-captabs__sub { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; } .lcb-captabs__subtab { background: transparent; border: 1.5px solid rgba(255,255,255,0.25); border-radius: 999px; color: rgba(255,255,255,0.8); cursor: pointer; font-family: 'Poppins', Arial, sans-serif; font-size: 13px; font-weight: 600; padding: 7px 16px; transition: border-color 150ms, background 150ms, color 150ms; white-space: nowrap; } .lcb-captabs__subtab.is-active { background: var(--lcb-primary); border-color: var(--lcb-primary); color: #0c1117; } .lcb-captabs__subtab:hover:not(.is-active) { border-color: rgba(255,255,255,0.55); color: #fff; } .lcb-captabs__img-wrap, .lcb-captabs__imgwrap { border-radius: 12px; overflow: hidden; } .lcb-captabs__img { display: block; height: 260px; object-fit: cover; width: 100%; } .lcb-captabs__noimg { background: rgba(255,255,255,0.06); height: 180px; } .lcb-captabs__desc { color: rgba(255,255,255,0.55); font-size: 13px; line-height: 1.5; margin: 12px 0 0; } /* ═══════════════════════════════════════════════════════════════════════════ PRICE BREAKDOWN — dark theme ═══════════════════════════════════════════════════════════════════════════ */ .lcb-pbreak { background: transparent; } .lcb-pbreak__row { align-items: center; border-bottom: 1px solid rgba(255,255,255,0.08); display: flex; justify-content: space-between; padding: 12px 0; } .lcb-pbreak__row span:first-child { color: rgba(255,255,255,0.7); font-size: 14px; font-weight: 500; } .lcb-pbreak__row strong { color: #fff; font-size: 15px; font-weight: 700; } .lcb-pbreak__sep { border: none; border-top: 1px solid rgba(255,255,255,0.1); margin: 8px 0; } .lcb-pbreak__note-head { color: var(--lcb-primary); font-size: 12px; font-weight: 700; margin: 14px 0 6px; text-transform: uppercase; letter-spacing: 0.05em; } .lcb-pbreak__notes { color: rgba(255,255,255,0.45); font-size: 12px; line-height: 1.6; margin: 0; padding-left: 16px; } .lcb-pbreak__notes li { margin-bottom: 6px; } /* Hero collapse when results are showing */ .lcb-hero--collapsed { display: none !important; } /* ═══════════════════════════════════════════════════════════════════════════ INLINE DETAIL — Responsive ═══════════════════════════════════════════════════════════════════════════ */ @media (max-width: 860px) { .lcb-included-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; } .lcb-dgallery__track { height: 240px; } } @media (max-width: 560px) { .lcb-detail { border-radius: 14px; } .lcb-detail__section { margin: 12px 14px 0; padding: 18px; } .lcb-detail__topbar { padding: 18px 14px 0; } .lcb-detail__footer { margin: 16px 14px 0; } .lcb-detail__unavail { margin: 12px 14px 0; } .lcb-included-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; } .lcb-captabs__sub { gap: 6px; } .lcb-captabs__subtab { font-size: 12px; padding: 6px 12px; } .lcb-dgallery__track { height: 200px; } .lcb-detail__name { font-size: 18px; } .lcb-detail__hprice { font-size: 18px; } } /* ═══════════════════════════════════════════════════════════════════════════ FLEET GRID [legacy_chauffeur_fleet] ═══════════════════════════════════════════════════════════════════════════ */ .lcf-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; font-family: 'Poppins', Arial, sans-serif; /* cards need a dark page behind them for backdrop-filter to work */ position: relative; } @media (max-width: 900px) { .lcf-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 560px) { .lcf-grid { grid-template-columns: 1fr; } } .lcf-card { display: flex; flex-direction: column; backdrop-filter: blur(16px); background: radial-gradient(rgba(0, 0, 0, .15), rgba(0, 0, 0, 0) 90%), radial-gradient(circle at 80% 200%, rgba(255, 255, 255, .25), rgba(255, 255, 255, 0) 80%), linear-gradient(rgba(15, 19, 25, .2)); background-color: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 18px; overflow: hidden; text-decoration: none; color: inherit; transition: border-color .22s, box-shadow .22s, transform .22s; } .lcf-card:hover { border-color: rgba(198,166,107,.55); box-shadow: 0 8px 36px rgba(0,0,0,.55), 0 0 0 1px rgba(198,166,107,.1) inset; transform: translateY(-4px); } .lcf-card--unavail { opacity: .55; } .lcf-card__img { position: relative; aspect-ratio: 12 / 13!important; overflow: hidden; background: #000000; } .lcf-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s; } .lcf-card:hover .lcf-card__img img { transform: scale(1.05); } .lcf-card__img::after { content: ''; position: absolute; inset: auto 0 0 0; height: 55%; background: linear-gradient(to top, rgba(10,14,20,.88) 0%, rgba(10,14,20,.3) 55%, transparent 100%); pointer-events: none; } .lcf-card__badge { position: absolute; bottom: 10px; left: 10px; display: flex; align-items: center; gap: 5px; background-color: rgba(0,0,0,.55); backdrop-filter: blur(8px); border-radius: 999px; padding: 5px 12px; font-size: 12px; font-weight: 600; color: #fff; } .lcf-badge-sep { opacity: .45; } .lcf-card__unavail-badge { position: absolute; top: 10px; right: 10px; background: rgba(220,38,38,.85); border-radius: 999px; padding: 3px 10px; font-size: 11px; font-weight: 700; color: #fff; } .lcf-card__body { padding: 20px; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; flex: 1; } .lcf-card__name { font-size: 24px; font-weight: 500; color: #fff; margin: 0 0 4px; letter-spacing: .01em; } .lcf-card__model { font-size: 12px; color: rgba(255,255,255,.42); margin: 0; line-height: 1.5; } .lcf-card__footer { display: flex; justify-content: space-between; align-items: center; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.07); } .lcf-card__price { font-size: 20px; font-weight: 700; color: #c6a66b; } .lcf-card__cta { display: flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.5); transition: color .2s; } .lcf-card:hover .lcf-card__cta { color: #c6a66b; } /* ── Perfect for — fleet card ── */ .lcf-pfor { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; } .lcf-pfor__item { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 400; color: rgba(255,255,255,.6); line-height: 1.4; } .lcf-pfor__icon { color: #c6a66b; flex-shrink: 0; } /* ── Perfect for — single listing page (larger) ── */ .lcf-pfor--large .lcf-pfor__item { font-size: 14px; gap: 8px; color: rgba(255,255,255,.75); } .lcf-pfor--large .lcf-pfor__icon { width: 15px; height: 15px; } /* ═══════════════════════════════════════════════════════════════════════════ SINGLE FLEET PAGE (template: single-lcb_listing.php) ═══════════════════════════════════════════════════════════════════════════ */ .lcf-page { font-family: 'Poppins', Arial, sans-serif; background: #0a0e14; color: #fff; min-height: 60vh; } /* ── Shell ── */ .lcf-shell { max-width: 90%; margin: 0 auto; padding: 0 24px; } @media (max-width: 1100px) { .lcf-shell { max-width: 95%; } } @media (max-width: 600px) { .lcf-shell { max-width: 100%; padding: 0 15px; } } /* ── Topbar (back button row) ── */ .lcf-topbar { padding: 28px 0 8px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; } /* Trip summary bar — mirrors booking-page summary pill */ .lcf-trip-bar { display: flex; align-items: center; gap: 0; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.09); border-radius: 999px; padding: 0 14px; height: 36px; font-size: 12px; overflow: hidden; max-width: calc(100% - 90px); } .lcf-trip-bar .lcb-sum-route, .lcf-trip-bar .lcb-sum-meta { display: flex; align-items: center; gap: 6px; } .lcf-trip-bar .lcb-sum-divider { width: 1px; height: 18px; background: rgba(255,255,255,.12); margin: 0 12px; flex-shrink: 0; } .lcf-trip-bar .lcb-sum-from { color: #fff; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; } .lcf-trip-bar .lcb-sum-to { color: rgba(255,255,255,.55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; } .lcf-trip-bar .lcb-sum-meta { color: rgba(255,255,255,.45); } .lcf-trip-bar .lcb-sum-dist { display: none; } @media (max-width: 600px) { .lcf-trip-bar { max-width: 100%; border-radius: 12px; height: auto; padding: 8px 14px; } .lcf-trip-bar .lcb-sum-divider { display: none; } .lcf-trip-bar .lcb-sum-route, .lcf-trip-bar .lcb-sum-meta { flex-wrap: wrap; } } .lcf-back { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .04em !important; color: rgba(255,255,255,.45) !important; text-decoration: none !important; transition: color .2s !important; cursor: pointer !important; border: none !important; background: none !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; border-radius: 0 !important; outline: none !important; } .lcf-back:hover { color: #c6a66b !important; } /* Chip style reused in vehicle info card */ .lcf-hero__chip { display: inline-flex; align-items: center; gap: 7px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.11); border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 500; color: rgba(255,255,255,.7); } .lcf-hero__chip svg { color: #c6a66b; flex-shrink: 0; } /* ── Two-column layout ── */ .lcf-layout { display: grid; grid-template-columns: 16fr 380px; gap: 28px; align-items: start; padding: 20px 0 64px; } /* ── Vehicle info card (top of left column) ── */ .lcf-vinfo { backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); background: radial-gradient(rgba(0,0,0,.18), rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%, rgba(255,255,255,.15), rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.25)); background-color: rgba(255,255,255,.05); border: 1.5px solid rgba(255,255,255,.12); border-radius: 16px; padding: 20px 22px; margin-bottom: 16px; } .lcf-vinfo__main { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; } .lcf-vinfo__name { color: #fff; font-size: 22px; font-weight: 700; margin: 0 0 4px; letter-spacing: -.01em; line-height: 1.2; } .lcf-vinfo__model { color: rgba(255,255,255,.45); font-size: 13px; margin: 0; } .lcf-vinfo__price { color: #c6a66b; font-size: 17px; font-weight: 700; white-space: nowrap; flex-shrink: 0; } .lcf-vinfo__chips { display: flex; gap: 8px; flex-wrap: wrap; } /* ── Card hero image ── */ .lcf-hero-img { position: relative; border-radius: 14px; overflow: hidden; aspect-ratio: 16/10; margin-bottom: 12px; background: #1a2433; } .lcf-hero-img img { width: 100%; height: 100%; object-fit: cover; display: block; } .lcf-hero-img__overlay { position: absolute; inset: auto 0 0 0; height: 50%; background: linear-gradient(to top, rgba(10,14,20,.85) 0%, transparent 100%); pointer-events: none; } /* ── Content sections ── */ .lcf-section { backdrop-filter: blur(22px) !important; -webkit-backdrop-filter: blur(22px) !important; background: radial-gradient(rgba(0,0,0,.18), rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%, rgba(255,255,255,.15), rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.25)) !important; background-color: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.12) !important; border-radius: 16px !important; padding: 26px 28px; margin-bottom: 16px; } .lcf-section__title { font-size: 15px; font-weight: 700; color: #fff; margin: 0 0 18px; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,.09); } /* ── Gallery ── */ .lcf-gallery { position: relative; aspect-ratio: 16/9; border-radius: 14px; overflow: hidden; margin-bottom: 16px; background: #1a2433; box-shadow: 0 2px 12px rgba(0,0,0,.15); } .lcf-gallery__track { width: 100%; height: 100%; position: relative; } .lcf-gallery__img { width: 100%; height: 100%; object-fit: cover; display: block; position: absolute; top: 0; left: 0; } .lcf-gallery__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 42px; height: 42px; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); background: radial-gradient(rgba(0,0,0,.18),rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 200%,rgba(255,255,255,.22),rgba(255,255,255,0) 80%), linear-gradient(rgba(15,19,25,.25)); background-color: rgba(0,0,0,.28); border: 1px solid rgba(255,255,255,.28); border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 22px; line-height: 1; transition: background-color .18s, border-color .18s, color .18s; z-index: 2; box-shadow: 0 4px 16px rgba(0,0,0,.35); -webkit-user-select: none; user-select: none; } .lcf-gallery__nav:hover { background-color: rgba(198,166,107,.92) !important; border-color: #c6a66b; color: #0c1117; } .lcf-gallery__prev { left: 12px; } .lcf-gallery__next { right: 12px; } .lcf-gallery__footer { position: absolute; bottom: 0; left: 0; right: 0; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); background: rgba(0,0,0,.42); border-top: 1px solid rgba(255,255,255,.09); padding: 10px 16px 12px; display: flex; justify-content: space-between; align-items: center; } .lcf-gallery__caption { font-size: 12px; color: rgba(255,255,255,.7); } .lcf-gallery__dots { display: flex; gap: 5px; } .lcf-gallery__dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.35); transition: background .18s; } .lcf-gallery__dot.is-active { background: #c6a66b; width: 14px; border-radius: 3px; } /* ── Included grid ── */ .lcf-included-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } @media (max-width: 560px) { .lcf-included-grid { grid-template-columns: 1fr; } } .lcf-included-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: rgba(255,255,255,.04); border-radius: 10px; border: 1px solid rgba(255,255,255,.09); } .lcf-included-item__icon { color: #c6a66b; flex-shrink: 0; } .lcf-included-item__label { font-size: 13px; color: rgba(255,255,255,.75); line-height: 1.4; } /* ── Capacity tabs ── */ .lcf-captabs__bar { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 14px; } .lcf-captab, .lcf-captab:hover, .lcf-captab:focus, .lcf-captab:active { padding: 3px 10px !important; border-radius: 999px !important; font-size: 11px !important; font-weight: 500 !important; cursor: pointer !important; border: 1px solid rgba(255,255,255,.12) !important; background: rgba(255,255,255,.04) !important; color: rgba(255,255,255,.45) !important; transition: all .15s !important; font-family: 'Poppins', Arial, sans-serif !important; white-space: nowrap !important; letter-spacing: .02em !important; line-height: 1.5 !important; text-transform: none !important; box-shadow: none !important; outline: none !important; min-width: 0 !important; width: auto !important; display: inline-flex !important; align-items: center !important; margin: 0 !important; } .lcf-captab.is-active, .lcf-captab.is-active:hover { background: rgba(198,166,107,.15) !important; border-color: rgba(198,166,107,.45) !important; color: #c6a66b !important; } @media (max-width: 600px) { .lcf-captab, .lcf-captab:hover, .lcf-captab:focus { padding: 3px 9px !important; font-size: 10px !important; } .lcf-captabs__bar { gap: 4px; margin-bottom: 10px; } } .lcf-captabs__note { font-size: 12px; color: rgba(255,255,255,.45); background: rgba(255,255,255,.04); border-radius: 8px; border: 1px solid rgba(255,255,255,.07); padding: 10px 12px; margin: 0 0 14px; line-height: 1.6; } .lcf-subtab-bar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; } .lcf-subtab, .lcf-subtab:hover, .lcf-subtab:focus, .lcf-subtab:active { font-size: 12px !important; font-weight: 500 !important; padding: 5px 10px !important; border: 1px solid rgba(255,255,255,.15) !important; border-radius: 6px !important; cursor: pointer !important; background: rgba(255,255,255,.04) !important; color: rgba(255,255,255,.6) !important; transition: all .15s !important; font-family: 'Poppins', Arial, sans-serif !important; line-height: 1.5 !important; text-transform: none !important; box-shadow: none !important; min-width: 0 !important; width: auto !important; display: inline-flex !important; align-items: center !important; margin: 0 !important; } .lcf-subtab.is-active, .lcf-subtab.is-active:hover { background: #c6a66b !important; border-color: #c6a66b !important; color: #0c1117 !important; } .lcf-captabs__imgwrap { border-radius: 10px; overflow: hidden; } .lcf-captabs__imgwrap img { width: 100%; height: auto; max-width: 100%; display: block; border-radius: 8px; } .lcf-captabs__desc { font-size: 12px; color: rgba(255,255,255,.45); margin: 8px 0 0; } .lcf-captabs__noimg { height: 80px; background: rgba(255,255,255,.05); border-radius: 10px; } /* ═══════════════════════════════════════════════════════════════════════════ SINGLE PAGE SIDEBAR — embedded booking widget (self-contained, no redirect) ═══════════════════════════════════════════════════════════════════════════ */ .lcf-single-sidebar { position: sticky; top: 24px; align-self: start; } /* Transparent hero — compact search form */ .lcf-single-sidebar .lcb-widget { background: transparent !important; min-height: 0 !important; } .lcf-single-sidebar .lcb-hero { background: transparent !important; min-height: 0 !important; } .lcf-single-sidebar .lcb-hero__shade { background: rgba(255,255,255,.04) !important; border: 1.5px solid rgba(255,255,255,.1) !important; border-radius: 16px !important; padding: 16px !important; } .lcf-single-sidebar .lcb-shell { padding: 0 !important; max-width: none !important; } /* Force search form to single-column stack (no overflow) */ .lcf-single-sidebar .lcb-mode { width: 100% !important; margin-bottom: 14px !important; } .lcf-single-sidebar .lcb-mode__item { flex: 1 !important; min-width: 0 !important; } .lcf-single-sidebar .lcb-search { display: flex !important; flex-direction: column !important; gap: 0 !important; min-height: 0 !important; padding: 0 !important; background: none !important; border: none !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } .lcf-single-sidebar .lcb-field { border-right: none !important; border-bottom: 1px solid rgba(255,255,255,.09) !important; padding: 10px 0 !important; } .lcf-single-sidebar .lcb-field:last-of-type { border-bottom: none !important; } .lcf-single-sidebar .lcb-field:first-child { padding-left: 0 !important; } .lcf-single-sidebar .lcb-action { padding: 12px 0 0 !important; justify-content: stretch !important; } .lcf-single-sidebar .lcb-action .lcb-button { width: 100% !important; } /* Results: single-column — sidebar first (map), then price breakdown */ .lcf-single-sidebar .lcb-results { padding: 0 !important; background: transparent !important; } .lcf-single-sidebar .lcb-results__bar { display: none !important; } .lcf-single-sidebar .lcb-results__grid { display: flex !important; flex-direction: column !important; } /* lcb-vehicles contains lcb-detail (price breakdown) — show it but strip chrome */ .lcf-single-sidebar .lcb-vehicles > h2 { display: none !important; } .lcf-single-sidebar .lcb-vehicle-grid { display: none !important; } .lcf-single-sidebar .lcb-extras { display: none !important; } /* Map panel comes first */ .lcf-single-sidebar .lcb-sidebar { order: 1; position: static !important; top: auto !important; display: block !important; width: 100% !important; } /* Price breakdown + book button come second */ .lcf-single-sidebar .lcb-vehicles { order: 2; } /* Sidebar selection card — keep booking-choice + fees, hide duplicate title/CTA */ .lcf-single-sidebar .lcb-selection { border: 1.5px solid rgba(255,255,255,.1) !important; border-radius: 16px !important; overflow: hidden !important; } .lcf-single-sidebar .lcb-selection__top { display: none !important; } .lcf-single-sidebar .lcb-selection__cta { display: none !important; } .lcf-single-sidebar .lcb-map { border-radius: 12px !important; margin-bottom: 12px !important; } /* Detail panel: show only price breakdown + book button, hide duplicates */ .lcf-single-sidebar .lcb-detail { background: rgba(255,255,255,.03); border: 1.5px solid rgba(255,255,255,.1); border-radius: 16px; margin-top: 12px; overflow: hidden; } .lcf-single-sidebar .lcb-detail .lcb-dgallery { display: none !important; } .lcf-single-sidebar .lcb-detail .lcb-detail__topbar { display: none !important; } .lcf-single-sidebar .lcb-detail [data-lcb-detail-unavail]{ display: none !important; } .lcf-single-sidebar .lcb-detail .lcb-detail__section:not([data-lcb-detail-pb-wrap]) { display: none !important; } .lcf-single-sidebar .lcb-detail .lcb-detail__body { padding: 16px 16px 0 !important; } .lcf-single-sidebar .lcb-detail .lcb-detail__footer { padding: 16px !important; } /* ═══════════════════════════════════════════════════════════════════════════ [legacy_chauffeur_search] — compact search shortcode with toggle ═══════════════════════════════════════════════════════════════════════════ */ .lcbs-wrap { font-family: 'Poppins', Arial, sans-serif; display: block; width: 100%; } .lcbs-toggle { display: inline-flex; align-items: center; gap: 9px; padding: 14px 22px; width: auto; max-width: 100%; background: linear-gradient(135deg, #c6a66b 0%, #a8894a 100%); border: none; border-radius: 12px; color: #0c1117; font-family: 'Poppins', Arial, sans-serif; font-size: 14px; font-weight: 700; cursor: pointer; transition: filter .2s, transform .15s; box-shadow: 0 4px 18px rgba(198,166,107,.35); } .lcbs-toggle:hover { filter: brightness(1.08); transform: translateY(-1px); } .lcbs-panel { margin-top: 12px; width: 100%; } .lcbs-panel[hidden] { display: none; } /* Panel: transparent widget wrapper — mode toggle floats above glass box */ .lcbs-panel .lcb-widget { background: transparent !important; min-height: 0 !important; } .lcbs-panel .lcb-hero { background: transparent !important; min-height: 0 !important; } /* Hero shade: transparent — glass is on the search box itself */ .lcbs-panel .lcb-hero__shade { background: none !important; border: none !important; border-radius: 0 !important; padding: 0 !important; } .lcbs-panel .lcb-shell { padding: 0 !important; max-width: none !important; } /* Mode toggle — compact, visually separated above the form box */ .lcbs-panel .lcb-mode { width: max-content !important; margin: 0 auto 16px !important; display: flex !important; } .lcbs-panel .lcb-mode__item { flex: 1 !important; min-width: 150px !important; } /* Form box: own glass background + blur, full width */ .lcbs-panel .lcb-search { width: 100% !important; min-height: 0 !important; padding: 24px !important; backdrop-filter: blur(18px) !important; -webkit-backdrop-filter: blur(18px) !important; background: radial-gradient(rgba(0,0,0,.18), rgba(0,0,0,0) 90%), radial-gradient(circle at 80% 180%, rgba(255,255,255,.12), rgba(255,255,255,0) 80%), linear-gradient(rgba(10,14,20,.55)) !important; background-color: rgba(0,0,0,.18) !important; border: 1px solid rgba(255,255,255,.18) !important; border-radius: 14px !important; box-shadow: 0 8px 32px rgba(0,0,0,.35) !important; /* grid-template-columns intentionally NOT overridden — uses the 5-col default */ } /* Field dividers inside glass box */ .lcbs-panel .lcb-field { border-right: 1px solid rgba(255,255,255,.28) !important; border-bottom: none !important; padding: 8px 20px !important; background: none !important; border-radius: 0 !important; } .lcbs-panel .lcb-field:first-child { padding-left: 0 !important; } .lcbs-panel .lcb-action { padding: 0 !important; } /* ── Mobile (≤600px): single column ── */ @media (max-width: 600px) { .lcbs-panel .lcb-search { grid-template-columns: 1fr !important; padding: 16px !important; } .lcbs-panel .lcb-field { border-right: none !important; border-bottom: 1px solid rgba(255,255,255,.15) !important; padding: 10px 0 !important; } .lcbs-panel .lcb-action { padding: 12px 0 0 !important; justify-content: stretch !important; } .lcbs-panel .lcb-action .lcb-button { width: 100% !important; } } /* ── Responsive ── */ @media (max-width: 1100px) { .lcf-layout { grid-template-columns: 16fr 340px; } } @media (max-width: 900px) { .lcf-layout { grid-template-columns: 1fr; gap: 20px; } .lcf-single-sidebar { position: static; } } @media (max-width: 560px) { .lcf-layout { padding: 16px 0 48px; gap: 16px; } .lcf-section { padding: 18px; } .lcf-vinfo { padding: 16px 18px; } .lcf-vinfo__name { font-size: 18px; } } /* ══ Service cards grid [legacy_chauffeur_services] ══════════════════════════ */ .lcf-services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 0; padding: 0; } .lcf-svc-card { display: flex; flex-direction: column; gap: 8px; padding: 28px 24px 24px; background: rgba(255, 255, 255, 0.04); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid rgba(255, 255, 255, 0.10); border-radius: 16px; text-decoration: none; color: inherit; transition: background 0.25s ease, border-color 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease; position: relative; overflow: hidden; } .lcf-svc-card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(ellipse at top left, rgba(184, 143, 68, 0.08) 0%, transparent 65%); pointer-events: none; opacity: 0; transition: opacity 0.3s ease; } .lcf-svc-card:hover { background: rgba(255, 255, 255, 0.07); border-color: rgba(184, 143, 68, 0.35); transform: translateY(-3px); box-shadow: 0 12px 36px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(184, 143, 68, 0.12); } .lcf-svc-card:hover::before { opacity: 1; } .lcf-svc-card__icon { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 14px; background: rgba(184, 143, 68, 0.12); border: 1px solid rgba(184, 143, 68, 0.22); color: #b88f44; margin-bottom: 4px; flex-shrink: 0; transition: background 0.2s ease, border-color 0.2s ease; } .lcf-svc-card:hover .lcf-svc-card__icon { background: rgba(184, 143, 68, 0.20); border-color: rgba(184, 143, 68, 0.40); } .lcf-svc-card__title { font-family: 'Poppins', sans-serif; font-size: 16px; font-weight: 700; color: #fff; margin: 0; line-height: 1.3; letter-spacing: -0.01em; } .lcf-svc-card__tag { font-family: 'Poppins', sans-serif; font-size: 11px; font-weight: 600; color: #b88f44; margin: 0; letter-spacing: 0.03em; text-transform: uppercase; } .lcf-svc-card__desc { font-family: 'Poppins', sans-serif; font-size: 13px; color: rgba(255, 255, 255, 0.62); margin: 4px 0 0; line-height: 1.65; flex: 1; } .lcf-svc-card__cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-family: 'Poppins', sans-serif; font-size: 12px; font-weight: 600; color: #b88f44; letter-spacing: 0.02em; transition: gap 0.2s ease, color 0.2s ease; } .lcf-svc-card:hover .lcf-svc-card__cta { gap: 10px; color: #d4a85a; } @media (max-width: 900px) { .lcf-services-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; } } @media (max-width: 560px) { .lcf-services-grid { grid-template-columns: 1fr; gap: 14px; } .lcf-svc-card { padding: 22px 18px 20px; } } /* Prevent horizontal page shift on all screen sizes */ html, body { overflow-x: hidden !important; } /* pac-container: JS tags it with .lcb-pac and overrides width/position inline */ .lcb-pac { box-sizing: border-box !important; max-width: 350px !important; } @media (max-width: 768px) { .lcb-pac { max-width: 280px !important; } } /* ── Kill Elementor default borders/shadows on all search form inputs ──────── */ .lcb-search .lcb-field input, .lcb-search .lcb-field input:hover, .lcb-search .lcb-field input:focus, .lcb-search .lcb-field input:active, .lcb-search .lcb-field select, .lcb-search .lcb-field select:hover, .lcb-search .lcb-field select:focus { -webkit-appearance: none !important; appearance: none !important; background: transparent !important; background-color: transparent !important; background-image: none !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; outline: none !important; padding-left: 0 !important; } .lcb-search .lcb-field--location input, .lcb-search .lcb-field--location input:hover, .lcb-search .lcb-field--location input:focus, .lcb-search .lcb-field--location input:active, .lcb-search .lcb-field--dropoff input, .lcb-search .lcb-field--dropoff input:hover, .lcb-search .lcb-field--dropoff input:focus, .lcb-search .lcb-field--dropoff input:active { padding-left: 22px !important; }