/**
 * Chauffeur Booking Engine — Dark theme (2.27.0)
 *
 * The widget's second skin: near-black paper, one gold, one green, and an editorial
 * offer card. Scoped to `.cbe-widget.cbe-theme-dark`, so a page can carry both themes
 * and the visitor's toggle only swaps a class.
 *
 * WHY THE SELECTORS LOOK LIKE THIS
 * cbe-armor.css re-asserts component colours as `.cbe-widget .x { … !important }` (0,2,0).
 * Every rule here that has to beat it carries the theme class on the SAME element —
 * `.cbe-widget.cbe-theme-dark .x` (0,3,0) — so it wins whatever the load order.
 * Colours the armor reads from `--cbe-*` tokens are simply re-declared once, at the top:
 * the armor forces the property, this file decides the value.
 *
 * The driver tile was always dark (even in the light theme), so this file leaves it alone
 * apart from the photo grade; the work is in everything that used to be ivory.
 */

/* ── 1. Tokens ───────────────────────────────────────────────────────── */
.cbe-widget.cbe-theme-dark{
    /* palette */
    --cbe-d-bg:#0a0a0a;          /* widget canvas */
    --cbe-d-card:#0d0d0d;        /* offer card */
    --cbe-d-panel:#101010;       /* raised panel: form cards, boxes, header */
    --cbe-d-field:#171717;       /* inputs, pills, menu rows */
    --cbe-d-deck:#0b0b0b;        /* price deck / strips */
    --cbe-d-line:rgba(197,169,106,.20);   /* gold hairline */
    --cbe-d-edge:rgba(197,169,106,.34);   /* gold card edge */
    --cbe-d-line2:#242424;                /* neutral hairline */
    --cbe-d-ink:#f4efe4;
    --cbe-d-ink2:#c2baa9;
    --cbe-d-ink3:#8d8676;
    --cbe-d-gold-hi:#e3cd97;
    --cbe-d-gold-dim:#8a7340;
    --cbe-d-green:#4fb383;
    --cbe-d-cool:#8fa9c9;        /* the one non-gold accent: "+N more", quiet affordances */
    --cbe-d-cta:linear-gradient(135deg,#f2ddab 0%,#dcc182 45%,#bd9c56 100%);

    /* armor tokens — same names the light theme declares, dark values */
    --cbe-gold:#c5a96a;
    --cbe-ghost-fg:#e3cd97;
    --cbe-chip-bg:rgba(255,255,255,.03);--cbe-chip-fg:#d8cdb4;--cbe-chip-bd:rgba(197,169,106,.30);
    --cbe-tgl-fg:#8d8676;
    --cbe-surf:#171717;--cbe-surf-fg:#e8e2d6;--cbe-surf-bd:#2e2a22;
    --cbe-surf2:#141414;--cbe-surf2-fg:#e8e2d6;--cbe-surf2-bd:#2e2a22;
    --cbe-oid-bg:#141414;--cbe-oid-fg:#f4efe4;--cbe-oid-bd:#4a3f28;
    --cbe-input-bg:#171717;--cbe-input-fg:#f4efe4;--cbe-input-bd:#332f27;
    --cbe-cc-bg:#1d1d1d;--cbe-menu-bg:#131313;--cbe-menu-fg:#e8e2d6;
    --cbe-ink:#f4efe4;--cbe-dim:#8d8676;

    background:var(--cbe-d-bg);
    color:var(--cbe-d-ink2);
    /* native date/time pickers, scrollbars and autofill follow the theme */
    color-scheme:dark;
}
/* The dark widget paints its own canvas. It has to: dropped onto a white page with a
   transparent background, the black offer card would float on white and the header,
   the inclusions box and the form would each need a second, lighter design. */
.cbe-widget.cbe-theme-dark{padding:20px;border-radius:16px}

/* ── 2. Theme toggle ─────────────────────────────────────────────────── */
/* Lives in both themes (booking.css carries the light look); this is the dark one. */
.cbe-widget.cbe-theme-dark .cbe-theme-toggle{
    background:rgba(255,255,255,.04)!important;border:1px solid var(--cbe-d-line)!important;
    color:var(--cbe-d-gold-hi)!important}
.cbe-widget.cbe-theme-dark .cbe-theme-toggle:hover{background:rgba(197,169,106,.12)!important;border-color:var(--cbe-d-edge)!important}

/* ── 3. Splash + progress + form ─────────────────────────────────────── */
.cbe-widget.cbe-theme-dark .cbe-cta-splash{background:linear-gradient(170deg,#141414 0%,#101010 55%,#0a0a0a 100%);border-color:var(--cbe-d-line);box-shadow:0 18px 50px rgba(0,0,0,.6)}
.cbe-widget.cbe-theme-dark .cbe-cta-splash:hover{box-shadow:0 22px 60px rgba(0,0,0,.7)}
.cbe-widget.cbe-theme-dark .cbe-cta-headline{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-cta-subtitle2,.cbe-widget.cbe-theme-dark .cbe-cta-benefit-desc{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-cta-benefit-title{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-cta-benefit+.cbe-cta-benefit{border-top-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-cta-benefit-icon{background:radial-gradient(120% 120% at 30% 25%,#1e1e1e 0%,#161616 70%,#101010 100%);box-shadow:0 6px 16px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.06)}
.cbe-widget.cbe-theme-dark .cbe-cta-divider{background:linear-gradient(90deg,transparent,var(--cbe-d-edge),transparent)}
.cbe-widget.cbe-theme-dark .cbe-pay-chip{color:#b9ae91}
.cbe-widget.cbe-theme-dark .cbe-pay-brand i{color:#ddd6c8}
.cbe-widget.cbe-theme-dark .cbe-cta-accept,.cbe-widget.cbe-theme-dark .cbe-cta-trust{color:var(--cbe-d-ink3);border-top-color:var(--cbe-d-line)}

.cbe-widget.cbe-theme-dark .cbe-plabel{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-progress-step.active .cbe-plabel,
.cbe-widget.cbe-theme-dark .cbe-progress-step.completed .cbe-plabel{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-pnum{background:#1c1c1c;color:#6f6a5e}
.cbe-widget.cbe-theme-dark .cbe-progress-step.completed .cbe-pnum{background:var(--cbe-d-gold-dim);color:#0a0a0a}
.cbe-widget.cbe-theme-dark .cbe-progress-line{background:#1e1e1e}

.cbe-widget.cbe-theme-dark .cbe-field label{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-input{background:var(--cbe-d-field)!important;border-color:#332f27!important;color:var(--cbe-d-ink)!important}
.cbe-widget.cbe-theme-dark .cbe-input:focus{border-color:var(--cbe-gold)!important;box-shadow:0 0 0 2px rgba(197,169,106,.18)!important}
.cbe-widget.cbe-theme-dark .cbe-input::placeholder{color:#6b6659}
.cbe-widget.cbe-theme-dark .cbe-ff>label{color:#7e7869}
.cbe-widget.cbe-theme-dark .cbe-ff .cbe-input:focus~label,
.cbe-widget.cbe-theme-dark .cbe-ff .cbe-input:not(:placeholder-shown)~label,
.cbe-widget.cbe-theme-dark .cbe-ff select.cbe-input~label{color:var(--cbe-d-gold-hi)}
.cbe-widget.cbe-theme-dark .cbe-toggle-group,.cbe-widget.cbe-theme-dark .cbe-return-toggle{background:#131313;border-color:#242424;box-shadow:inset 0 1px 3px rgba(0,0,0,.5)}
.cbe-widget.cbe-theme-dark .cbe-toggle-btn i,.cbe-widget.cbe-theme-dark .cbe-return-opt-btn i{color:#6f6752}
.cbe-widget.cbe-theme-dark .cbe-toggle-btn:hover:not(.active),
.cbe-widget.cbe-theme-dark .cbe-return-opt-btn:hover:not(.active){background:rgba(255,255,255,.05);color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-radio-card{background:#131313;border-color:#242424}
.cbe-widget.cbe-theme-dark .cbe-radio-card.active{border-color:var(--cbe-gold);background:rgba(197,169,106,.09)}
.cbe-widget.cbe-theme-dark .cbe-radio-label{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark #cbe-waypoints-wrap{border-left-color:var(--cbe-d-gold-dim)}
.cbe-widget.cbe-theme-dark .cbe-extras-section,
.cbe-widget.cbe-theme-dark .cbe-service-options,
.cbe-widget.cbe-theme-dark .cbe-children-section,
.cbe-widget.cbe-theme-dark .cbe-total-summary{background:var(--cbe-d-panel);border-color:#242424;color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-extra-desc{color:#6f6a5e}
.cbe-widget.cbe-theme-dark .cbe-sec-caret{color:#6f6a5e}
.cbe-widget.cbe-theme-dark .cbe-agreement-field,.cbe-widget.cbe-theme-dark .cbe-lead-notice{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-form-card{background:linear-gradient(150deg,#131313,#0e0e0e);border-color:#242424}
.cbe-widget.cbe-theme-dark .cbe-card-head{color:var(--cbe-d-ink);border-bottom-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-error-banner{background:#241414;border-color:#5b2a2a;color:#f0a5a5}
.cbe-widget.cbe-theme-dark .cbe-agreement-error{background:#241414;border-color:#7a3030}
.cbe-widget.cbe-theme-dark .cbe-field-error{color:#f0a5a5}
.cbe-widget.cbe-theme-dark .cbe-spinner{background:rgba(10,10,10,.88)}
.cbe-widget.cbe-theme-dark .cbe-spinner-ring{border-color:#242424;border-top-color:var(--cbe-gold)}
.cbe-widget.cbe-theme-dark .cbe-no-vehicles,.cbe-widget.cbe-theme-dark .cbe-searching-note{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-skel-card{background:#101010;border-color:#242424}
.cbe-widget.cbe-theme-dark .cbe-skel-hero,.cbe-widget.cbe-theme-dark .cbe-skel-line{background:linear-gradient(90deg,#151515 25%,#1e1e1e 50%,#151515 75%);background-size:200% 100%}
.cbe-widget.cbe-theme-dark .cbe-create-recovery{background:#1d1809;border-color:#5a4718}
.cbe-widget.cbe-theme-dark .cbe-create-recovery p{color:#e0c88f}

/* Filled CTAs — gold gradient on dark, dark ink on the gold.
   The armor forces `background:var(--cbe-btn-bg)` AND `background-image:none`, and the
   Labels colour arrives inline, so the gradient has to be re-applied here at (0,3,0). */
.cbe-widget.cbe-theme-dark .cbe-btn-search,
.cbe-widget.cbe-theme-dark .cbe-btn-confirm,
.cbe-widget.cbe-theme-dark .cbe-ch-select,
.cbe-widget.cbe-theme-dark .cbe-vehicle-select-btn{
    --cbe-btn-bg:#cbae6b!important;--cbe-btn-fg:#15110a!important;
    background-color:#cbae6b!important;background-image:var(--cbe-d-cta)!important;
    color:#15110a!important;box-shadow:0 8px 22px rgba(197,169,106,.22),inset 0 1px 0 rgba(255,255,255,.32)!important}
.cbe-widget.cbe-theme-dark .cbe-btn-search:hover,
.cbe-widget.cbe-theme-dark .cbe-btn-confirm:hover,
.cbe-widget.cbe-theme-dark .cbe-ch-select:hover{filter:brightness(1.06)}
.cbe-widget.cbe-theme-dark .cbe-btn-loading::after{border-color:rgba(0,0,0,.25);border-top-color:#15110a}
.cbe-widget.cbe-theme-dark .cbe-back-btn{color:var(--cbe-d-gold-hi)!important}

/* ── 4. Trip header — the panel the mockup opens with ────────────────── */
/* Header, trust chips and the all-inclusive line are three siblings in the DOM. On dark
   they read as ONE panel: the header opens it, whichever of the other two comes last
   closes it. `:has()` decides who draws the bottom edge, so any combination of the
   Conversion switches still produces a closed box. */
.cbe-widget.cbe-theme-dark .cbe-trip-header{
    background:linear-gradient(135deg,#131313 0%,#0d0d0d 55%,#0a0a0a 100%);
    border:1px solid var(--cbe-d-edge);border-radius:16px;padding:18px 20px 15px;margin-bottom:14px;
    box-shadow:0 16px 44px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.04)}
.cbe-widget.cbe-theme-dark .cbe-trip-header:has(+.cbe-trust-bar),
.cbe-widget.cbe-theme-dark .cbe-trip-header:has(+.cbe-all-inclusive){border-bottom:none;border-radius:16px 16px 0 0;margin-bottom:0}
.cbe-widget.cbe-theme-dark .cbe-trip-header::before{height:2px;background:linear-gradient(90deg,var(--cbe-d-gold-dim),var(--cbe-d-gold-hi) 50%,var(--cbe-d-gold-dim));z-index:2}
/* Optional destination backdrop (Settings → Widget). Bleeds in from the right and is
   masked to nothing before it reaches the text, so the route never loses contrast. */
.cbe-widget.cbe-theme-dark .cbe-trip-header::after{
    content:'';position:absolute;inset:0 0 0 22%;z-index:0;pointer-events:none;
    background-image:var(--cbe-hero-img,none);background-size:cover;background-position:center;
    opacity:.7;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) 30%,rgba(0,0,0,.8) 62%,#000 88%);
    mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) 30%,rgba(0,0,0,.8) 62%,#000 88%)}
.cbe-widget.cbe-theme-dark .cbe-trip-header>*{position:relative;z-index:1}
.cbe-widget.cbe-theme-dark .cbe-trip-route{color:var(--cbe-d-ink);font-size:20px;letter-spacing:-.2px;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.cbe-widget.cbe-theme-dark .cbe-trip-route .cbe-arrow{color:var(--cbe-gold)}
.cbe-widget.cbe-theme-dark .cbe-trip-dest{color:var(--cbe-d-gold-hi)}
.cbe-widget.cbe-theme-dark .cbe-trip-datetime,
.cbe-widget.cbe-theme-dark .cbe-trip-eta{color:var(--cbe-d-ink2);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.cbe-widget.cbe-theme-dark .cbe-trip-eta strong{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-trip-distance{color:var(--cbe-d-ink3);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.cbe-widget.cbe-theme-dark .cbe-trip-line i{color:var(--cbe-gold)}
.cbe-widget.cbe-theme-dark .cbe-trip-stops{border-left-color:var(--cbe-d-gold-dim);color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-trip-stop strong{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-trip-divider{border-top-color:var(--cbe-d-gold-dim)}
.cbe-widget.cbe-theme-dark .cbe-trip-summary{background:var(--cbe-d-panel);border-color:#242424;color:var(--cbe-d-gold-hi);box-shadow:none}

/* Trust chips — outline pills, no fill (the mockup's row under the route).
   2.28.0 — the bar has TWO jobs and they need different boxes. On step 2 it is the bottom
   half of the route panel and must not draw a top edge. On step 1 there is no route yet
   (booking.js prepends it as the first thing in the step), and the step-2 styling left it
   open at the top: a lidless box with square upper corners, which is what the dark widget
   opened with. It is a closed panel of its own now, gold hairline and all, and only becomes
   the panel's lower half when a trip header is actually sitting on top of it. */
.cbe-widget.cbe-theme-dark .cbe-trust-bar{
    position:relative;overflow:hidden;display:flex;margin:0 0 14px;padding:12px 14px;background:#0b0b0b;
    border:1px solid var(--cbe-d-edge);border-radius:16px;
    box-shadow:0 16px 44px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.04)}
.cbe-widget.cbe-theme-dark .cbe-trust-bar::before{
    content:'';position:absolute;top:0;left:0;right:0;height:2px;
    background:linear-gradient(90deg,var(--cbe-d-gold-dim),var(--cbe-d-gold-hi) 50%,var(--cbe-d-gold-dim))}
.cbe-widget.cbe-theme-dark .cbe-trip-header+.cbe-trust-bar{
    margin:0;padding:11px 14px 12px;border-top:none;border-radius:0 0 16px 16px;box-shadow:none}
.cbe-widget.cbe-theme-dark .cbe-trip-header+.cbe-trust-bar::before{display:none}
.cbe-widget.cbe-theme-dark .cbe-trip-header+.cbe-trust-bar:has(+.cbe-all-inclusive){border-bottom:none;border-radius:0}
.cbe-widget.cbe-theme-dark .cbe-trust-chip{padding:6px 13px!important;font-size:11.5px!important;letter-spacing:.3px}
.cbe-widget.cbe-theme-dark a.cbe-trust-chip:hover{background:rgba(197,169,106,.10)!important;border-color:var(--cbe-d-edge)!important}
.cbe-widget.cbe-theme-dark .cbe-trust-rating{--cbe-chip-fg:#f4efe4}
/* Same two jobs as the chips above it: the bottom of the route panel when it really is
   sitting under one, a closed strip of its own otherwise (a multi-stop trip puts the trip
   summary between the header and these, which broke the chain and left an open top edge). */
.cbe-widget.cbe-theme-dark .cbe-all-inclusive{
    padding:12px 14px;background:#0b0b0b;color:var(--cbe-d-green);
    border:1px solid var(--cbe-d-edge);border-radius:16px;margin-bottom:16px}
.cbe-widget.cbe-theme-dark .cbe-trip-header+.cbe-all-inclusive,
.cbe-widget.cbe-theme-dark .cbe-trip-header+.cbe-trust-bar+.cbe-all-inclusive{
    padding:0 14px 13px;border-top:none;border-radius:0 0 16px 16px}
.cbe-widget.cbe-theme-dark .cbe-all-inclusive i{color:var(--cbe-d-green)}

/* ── 5. The offer card ───────────────────────────────────────────────── */
.cbe-widget.cbe-theme-dark .cbe-ch-card{
    background:var(--cbe-d-card);border:1px solid var(--cbe-d-edge);
    box-shadow:0 20px 60px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.03)}
.cbe-widget.cbe-theme-dark .cbe-ch-card.cbe-ch-rec{border-color:rgba(197,169,106,.6);box-shadow:0 22px 66px rgba(0,0,0,.7),0 0 0 1px rgba(197,169,106,.18)}
/* the hairline between the two photos */
.cbe-widget.cbe-theme-dark .cbe-mag-spread{background:var(--cbe-d-edge)}
.cbe-widget.cbe-theme-dark .cbe-mag-vehsel{padding:12px 16px 2px}

/* Photo grade — "dark studio". The light theme prints both photos greyscale like a
   newspaper spread; here they keep their own light, pushed to deeper blacks and a
   warmer, quieter mid-tone so a phone snapshot sits next to a studio shot without
   the difference shouting. AI normalisation (Settings → AI Photos) does the rest. */
.cbe-widget.cbe-theme-dark .cbe-mag-dphoto{filter:grayscale(.15) contrast(1.14) saturate(.86) brightness(.9)}
.cbe-widget.cbe-theme-dark .cbe-mag-vphoto{filter:grayscale(.1) contrast(1.1) saturate(.9) brightness(.92)}
/* 2.28.0 — data-ph-d means this element is showing a photo MADE for the dark card
   (its own AI pass, its own prompt). The grade above is the rescue treatment for a photo
   that was shot for the light one; running it over an already-dark photo grades it twice
   and the subject sinks into the background. */
.cbe-widget.cbe-theme-dark .cbe-mag-dphoto[data-ph-d],
.cbe-widget.cbe-theme-dark .cbe-mag-vphoto[data-ph-d]{filter:none}
.cbe-widget.cbe-theme-dark .cbe-mag-driver{background:#0b0b0b}
.cbe-widget.cbe-theme-dark .cbe-mag-vtile{background:#0d0d0d}
.cbe-widget.cbe-theme-dark .cbe-mag-vph{background:linear-gradient(160deg,#151515,#0b0b0b);color:#3a3630}
.cbe-widget.cbe-theme-dark .cbe-mag-dph{background:linear-gradient(160deg,#151515,#0b0b0b);color:#5c5233}
/* The vehicle tile's scrim is ivory in the light theme — on dark it has to be black, or
   the car sits in a white fog and the name below it disappears. The soft warm key light
   from above rides on the SAME element: the scrim is the one layer that is already above
   the photo and below the copy, and a separate overlay div would have to sit above the
   scrim, darkening the subject twice over. */
.cbe-widget.cbe-theme-dark .cbe-mag-vscrim{
    background:radial-gradient(120% 70% at 50% -14%,rgba(197,169,106,.15) 0,rgba(197,169,106,.04) 40%,transparent 70%),
               linear-gradient(to top,rgba(6,6,6,.95) 0,rgba(6,6,6,.84) 22%,rgba(6,6,6,.34) 44%,rgba(6,6,6,0) 62%)}
.cbe-widget.cbe-theme-dark .cbe-mag-dscrim{
    background:radial-gradient(120% 70% at 50% -14%,rgba(197,169,106,.17) 0,rgba(197,169,106,.05) 40%,transparent 70%),
               linear-gradient(to top,rgba(5,5,5,.96) 0,rgba(5,5,5,.88) 26%,rgba(5,5,5,.44) 46%,rgba(5,5,5,.06) 64%,transparent 78%)}
.cbe-widget.cbe-theme-dark .cbe-mag-dtxt,.cbe-widget.cbe-theme-dark .cbe-mag-vtxt{z-index:2}
.cbe-widget.cbe-theme-dark .cbe-mag-etop{z-index:3}
.cbe-widget.cbe-theme-dark .cbe-mag-etop-v{color:var(--cbe-gold);text-shadow:0 1px 8px rgba(0,0,0,.85)}
.cbe-widget.cbe-theme-dark .cbe-mag-vehname{color:var(--cbe-d-ink)!important;text-shadow:0 2px 18px rgba(0,0,0,.6)!important}
/* the rule under the vehicle name — the one piece of chrome the light card does not have */
.cbe-widget.cbe-theme-dark .cbe-mag-vtxt .cbe-mag-vehname::after{
    content:'';display:block;width:64px;height:2px;margin-top:9px;
    background:linear-gradient(90deg,var(--cbe-d-gold-hi),var(--cbe-d-gold-dim))}
.cbe-widget.cbe-theme-dark .cbe-mag-hl div{color:#a79e88}
.cbe-widget.cbe-theme-dark .cbe-mag-rides{color:#9a9384}
.cbe-widget.cbe-theme-dark .cbe-rec-chip{background:#0f0f0f!important;color:var(--cbe-d-gold-hi)!important;box-shadow:0 3px 12px rgba(0,0,0,.6),inset 0 0 0 1px rgba(197,169,106,.42)!important}

/* icon strip */
.cbe-widget.cbe-theme-dark .cbe-mag-strip{background:#0f0f0f;border-top-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-mag-si{color:#a79e88;border-left-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-mag-si-l b{color:var(--cbe-d-ink)!important}
.cbe-widget.cbe-theme-dark .cbe-mag-simore{color:var(--cbe-d-cool)!important;border-left-color:var(--cbe-d-line)!important}
.cbe-widget.cbe-theme-dark .cbe-mag-simore i{color:var(--cbe-d-cool)!important}
.cbe-widget.cbe-theme-dark .cbe-mag-simore:hover{color:#b4c8e2!important;background:rgba(143,169,201,.08)!important}

/* price deck */
.cbe-widget.cbe-theme-dark .cbe-mag-deck{background:var(--cbe-d-deck);border-top-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-mag-incl div,.cbe-widget.cbe-theme-dark .cbe-ch-incl div{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-mag-incl i,.cbe-widget.cbe-theme-dark .cbe-ch-incl i{color:var(--cbe-d-green)}
.cbe-widget.cbe-theme-dark .cbe-ch-pbadge{background:linear-gradient(135deg,#e8d29a,#c5a96a);color:#15110a;box-shadow:0 3px 12px rgba(197,169,106,.25)}
.cbe-widget.cbe-theme-dark .cbe-ch-price-amt{color:var(--cbe-d-gold-hi)!important;text-shadow:0 2px 16px rgba(197,169,106,.18)}
.cbe-widget.cbe-theme-dark .cbe-ch-price-amt span{color:var(--cbe-gold)}
.cbe-widget.cbe-theme-dark .cbe-ch-price-sub{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-ch-price{border-left-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-mag-bdlink{color:var(--cbe-d-gold-hi)!important}
.cbe-widget.cbe-theme-dark .cbe-ch-instant{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-ch-instant i{color:var(--cbe-gold)}
.cbe-widget.cbe-theme-dark .cbe-price-breakdown{background:#101010;border-color:#242424}
.cbe-widget.cbe-theme-dark .cbe-bd-row{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-bd-total{color:var(--cbe-d-ink);border-top-color:#2a2a2a}
.cbe-widget.cbe-theme-dark .cbe-bd-sub{color:var(--cbe-d-ink3);border-left-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-bd-sub-l em{color:#6f6a5e}

/* review strip */
.cbe-widget.cbe-theme-dark .cbe-ch-review{background:linear-gradient(180deg,rgba(197,169,106,.07),transparent);border-top-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-ch-review-q{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-ch-review-by,.cbe-widget.cbe-theme-dark .cbe-ch-review-caret{color:var(--cbe-d-ink3)}

/* compact card variant (Settings → Widget → Step 2 Card Style) */
.cbe-widget.cbe-theme-dark .cbe-ch-veh-name{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-ch-veh-eyebrow{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-ch-veh-meta{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-ch-veh-img{background:linear-gradient(135deg,#161616,#0d0d0d)}
.cbe-widget.cbe-theme-dark .cbe-ch-veh-ph{color:#3a3630}
.cbe-widget.cbe-theme-dark .cbe-ch-feat{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-ch-feats{border-top-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-ch-feats-more{color:var(--cbe-d-cool)!important}
.cbe-widget.cbe-theme-dark .cbe-rec-tag{background:#0f0f0f;color:var(--cbe-d-gold-hi)}
.cbe-widget.cbe-theme-dark .cbe-vehicle-card{background:#101010;border-color:#242424}
.cbe-widget.cbe-theme-dark .cbe-vehicle-hero{background:linear-gradient(135deg,#161616,#0d0d0d)}
.cbe-widget.cbe-theme-dark .cbe-vehicle-title,.cbe-widget.cbe-theme-dark .cbe-vehicle-price-amount{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-vehicle-class,.cbe-widget.cbe-theme-dark .cbe-vehicle-meta{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-feat-active{background:rgba(197,169,106,.14);color:var(--cbe-d-gold-hi)}
.cbe-widget.cbe-theme-dark .cbe-feat-inactive{background:#1a1a1a;color:#4a463d}

/* ── 6. Step 3 — payment selector, phone picker, boxes ───────────────── */
.cbe-widget.cbe-theme-dark .cbe-pay-methods{background:linear-gradient(150deg,#131313,#0e0e0e);border-color:#242424}
.cbe-widget.cbe-theme-dark .cbe-pay-opt.active{background:rgba(197,169,106,.10)!important;border-color:var(--cbe-gold)!important}
.cbe-widget.cbe-theme-dark .cbe-phone-cc:hover{background:#262626!important;border-color:var(--cbe-gold)!important}
.cbe-widget.cbe-theme-dark .cbe-phone-menu{box-shadow:0 14px 40px rgba(0,0,0,.7)}
.cbe-widget.cbe-theme-dark .cbe-phone-opt:hover{background:#1e1e1e}
.cbe-widget.cbe-theme-dark .cbe-phone-opt .cbe-phone-cd{color:var(--cbe-d-gold-hi)!important}
.cbe-widget.cbe-theme-dark .cbe-inclusions,.cbe-widget.cbe-theme-dark .cbe-next-steps{background:linear-gradient(150deg,#131313,#0e0e0e);border-color:#242424;box-shadow:none}
.cbe-widget.cbe-theme-dark .cbe-incl-title,.cbe-widget.cbe-theme-dark .cbe-next-steps h3{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-incl-row,.cbe-widget.cbe-theme-dark .cbe-timeline li{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-incl-row i{color:var(--cbe-d-green)}
.cbe-widget.cbe-theme-dark .cbe-timeline li::before{background:var(--cbe-gold);color:#15110a}
.cbe-widget.cbe-theme-dark .cbe-timeline li+li::after{background:var(--cbe-d-gold-dim)}
.cbe-widget.cbe-theme-dark .cbe-contact-strip{background:linear-gradient(150deg,#131313,#0e0e0e);border-color:#242424;box-shadow:none}
.cbe-widget.cbe-theme-dark .cbe-cs-text{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-contact-strip .cbe-cs-link{background:#171717;border-color:#2e2a22!important;border-bottom-color:#2e2a22!important;color:var(--cbe-d-ink)!important;box-shadow:none}
.cbe-widget.cbe-theme-dark .cbe-contact-strip .cbe-cs-link:hover{background:#1e1e1e;border-color:var(--cbe-gold)!important;border-bottom-color:var(--cbe-gold)!important}
.cbe-widget.cbe-theme-dark .cbe-nudge{background:#141210;border-color:var(--cbe-d-gold-dim)}
.cbe-widget.cbe-theme-dark .cbe-nudge-text{color:var(--cbe-d-ink2)}
.cbe-widget.cbe-theme-dark .cbe-nudge-close{color:var(--cbe-d-ink3)!important}

/* ── 7. Step 4 — confirmation ────────────────────────────────────────── */
.cbe-widget.cbe-theme-dark .cbe-conf-title{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-conf-oidlabel{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-conf-recap{background:linear-gradient(150deg,#131313,#0d0d0d);border-color:#242424;box-shadow:none}
.cbe-widget.cbe-theme-dark .cbe-recap-route,.cbe-widget.cbe-theme-dark .cbe-recap-price-val{color:var(--cbe-d-ink)}
.cbe-widget.cbe-theme-dark .cbe-recap-meta,.cbe-widget.cbe-theme-dark .cbe-recap-price-label{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-recap-price{border-top-color:var(--cbe-d-line)}
.cbe-widget.cbe-theme-dark .cbe-recap-dot{color:#4a463d}
.cbe-widget.cbe-theme-dark .cbe-conf-oid.cbe-copied{color:var(--cbe-d-green)!important;border-color:#2f6b4c!important;background:#0f1a14!important}
.cbe-widget.cbe-theme-dark .cbe-conf-oid.cbe-copied i{color:var(--cbe-d-green)!important}
.cbe-widget.cbe-theme-dark .cbe-copy-btn:hover{background:rgba(197,169,106,.12)}
/* The payment block stays a light island on purpose: an IBAN, a QR code and a bank
   reference are copied and photographed, and both scan better on white. */
.cbe-widget.cbe-theme-dark .cbe-payment-block{background:#fff;color:#1a1a1a;border-color:#2e2a22}

/* ── 8. Popular routes ───────────────────────────────────────────────── */
.cbe-widget.cbe-theme-dark .cbe-hot-title{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-hot-card{background:#111!important;border-color:#242424!important;color:var(--cbe-d-ink)!important}
.cbe-widget.cbe-theme-dark .cbe-hot-card:hover{border-color:var(--cbe-gold)!important}
.cbe-widget.cbe-theme-dark .cbe-hot-price em{color:var(--cbe-d-ink3)}
.cbe-widget.cbe-theme-dark .cbe-hot-price b{color:var(--cbe-d-gold-hi)!important}

/* ── 9. Body-level pieces ────────────────────────────────────────────── */
/* The sticky bar is appended to <body>, outside the widget, so it cannot inherit the
   widget's class. cbe-theme.js mirrors the resolved theme onto <body>. */
body[data-cbe-theme="dark"] #cbe-sticky-bar{background:#0c0c0c;border-top-color:#242424;box-shadow:0 -6px 22px rgba(0,0,0,.6)}
body[data-cbe-theme="dark"] #cbe-sticky-bar .cbe-sb-text{color:var(--cbe-d-ink3,#8d8676)}
body[data-cbe-theme="dark"] #cbe-sticky-bar .cbe-sb-price{color:#f4efe4}
body[data-cbe-theme="dark"] #cbe-sticky-bar .cbe-sb-btn{background-image:linear-gradient(135deg,#e8d29a,#cbae6b 48%,#ac8c4a)!important;color:#15110a!important}

/* ── 10. Chat widget ─────────────────────────────────────────────────── */
/* The conversational form shares the palette but not the classes. */
.cb-root.cbe-theme-dark{background:#0a0a0a;color:#c2baa9}
.cb-root.cbe-theme-dark .cb-header{background:linear-gradient(135deg,#131313,#0b0b0b);border-color:rgba(197,169,106,.28)}
.cb-root.cbe-theme-dark .cb-pill{background:#151515;border-color:#2a2a2a;color:#c2baa9}
.cb-root.cbe-theme-dark .cb-q{color:#f4efe4}
.cb-root.cbe-theme-dark .cb-opt{background:#141414;border-color:#2a2a2a;color:#e8e2d6}
.cb-root.cbe-theme-dark .cb-opt:hover,.cb-root.cbe-theme-dark .cb-opt.selected{border-color:#c5a96a;background:rgba(197,169,106,.10)}
.cb-root.cbe-theme-dark .cb-input{background:#171717;border-color:#332f27;color:#f4efe4}
.cb-root.cbe-theme-dark .cb-input::placeholder{color:#6b6659}
.cb-root.cbe-theme-dark .cb-back{color:#e3cd97}
.cb-root.cbe-theme-dark .cb-vcard{background:#111;border-color:#242424}
.cb-root.cbe-theme-dark .cb-vcard.selected{border-color:#c5a96a}
.cb-root.cbe-theme-dark .cb-vcard-name{color:#f4efe4}
.cb-root.cbe-theme-dark .cb-vcard-sub{color:#8d8676}
.cb-root.cbe-theme-dark .cb-vcard-price{color:#e3cd97}
.cb-root.cbe-theme-dark .cb-extra-row,.cb-root.cbe-theme-dark .cb-svc-row{background:#131313;border-color:#242424;color:#c2baa9}
.cb-root.cbe-theme-dark .cb-vband-dph,.cb-root.cbe-theme-dark .cb-vband-vph{background-color:#0b0b0b}

/* ── 11. Motion ──────────────────────────────────────────────────────── */
.cbe-widget .cbe-theme-toggle i{transition:transform .35s cubic-bezier(.4,0,.2,1)}
.cbe-widget.cbe-theme-dark .cbe-theme-toggle i{transform:rotate(-25deg)}
@media(prefers-reduced-motion:reduce){.cbe-widget .cbe-theme-toggle i{transition:none}}