@loczer/storefront-sdk 0.180.0 → 0.182.0

package/dist/pages/HomePage.js

@@ -1,525 +1,624 @@
-import { jsxs as r, jsx as e, Fragment as oe } from "react/jsx-runtime";
-import { useMemo as h, useState as b, useRef as je, useEffect as Ue } from "react";
-import { useMediaQuery as Ve } from "@rpcbase/client";
-import { useParams as ze, useLocation as Ye, useSearchParams as Qe, useNavigate as We, Link as M } from "@rpcbase/router";
-import { cn as m } from "@rpcbase/ui";
-import { Clock as Ke, MapPin as Ge, ShieldCheck as Je, Umbrella as Xe, Truck as Ze, ArrowRight as z, Bike as ce } from "lucide-react";
-import { useTranslation as et } from "react-i18next";
-import W from "../chunks/assets/playground-hero-preview.svg-DNbSwXV5.js";
-import { getAvailabilityVariant as tt } from "../lib/utils.js";
-import { getStorefrontPreset as at } from "../data/config.js";
-import { getLocalizedValue as A } from "../localization.js";
-import { AboutSection as rt } from "../components/AboutSection/index.js";
-import { BikeProductCard as st } from "../components/BikeProductCard/index.js";
-import { ContactSection as it } from "../components/ContactSection/index.js";
-import { ProductPriceBadge as de } from "../components/ProductPriceBadge/index.js";
-import { ProductWarningNotice as lt } from "../components/ProductWarningNotice/index.js";
-import { resolveStorefrontCancellationPolicyTeaserTier as nt, StorefrontCancellationPolicyNotice as ot } from "../components/StorefrontCancellationPolicyNotice/index.js";
-import { TestimonialsSection as ct } from "../components/TestimonialsSection/index.js";
-import { BookingPeriodProvider as dt } from "../components/BookingPeriodSelector/BookingPeriodContext.js";
-import { BookingStartDateField as mt } from "../components/BookingPeriodSelector/components/BookingStartDateField.js";
-import { BookingStartTimeField as ht } from "../components/BookingPeriodSelector/components/BookingStartTimeField.js";
-import { BookingEndDateField as pt } from "../components/BookingPeriodSelector/components/BookingEndDateField.js";
-import { BookingEndTimeField as gt } from "../components/BookingPeriodSelector/components/BookingEndTimeField.js";
-import "../components/BookingPeriodSelector/components/BookingMobileDateDrawer.js";
-import { Badge as Y } from "../ui/badge.js";
-import { Button as me } from "../ui/button.js";
-import { Card as he } from "../ui/card.js";
-import { resolveBookingSearchParamsFromSessionStorage as ut, createBookingPeriodConfigFromStorefrontConfiguration as ft, getDefaultBookingParamsForStorefrontConfiguration as xt, getBookingParamsFromSearch as vt, applyBookingParamsToSearch as bt, writeBookingSearchParamsToSessionStorage as Nt } from "../lib/booking.js";
-import { createStorefrontTimeSlotsFetcher as _t } from "../lib/fetchStorefrontTimeSlots.js";
-import { resolveProductImageContainerStyle as pe } from "../lib/productImageStyles.js";
-import { usePlaygroundDevSettings as kt } from "../lib/playgroundDevSettings.js";
-import { useStorefront as yt, useStorefrontProducts as wt } from "../StorefrontProvider.js";
-import { FulfillmentSection as ge } from "../components/FulfillmentSection/index.js";
-import { DeliveryAddressSelector as St } from "../components/DeliveryAddressSelector/index.js";
-const ue = (a) => String(a).padStart(2, "0"), fe = "text-2xs font-semibold uppercase tracking-wide text-slate-600", xe = "h-10", Pt = 6, ve = 5, be = [15, 25, 42, 66, 33, 54], Q = ["4 / 5", "1 / 1", "3 / 4", "5 / 4", "7 / 9", "4 / 3", "9 / 16", "6 / 7"], Ne = (a) => `${a.getFullYear()}-${ue(a.getMonth() + 1)}-${ue(a.getDate())}`, E = (a) => {
-  if (!a)
-    return;
-  const i = a.match(/^(\d{4})-(\d{2})-(\d{2})$/);
-  if (!i)
-    return;
-  const l = Number(i[1]), p = Number(i[2]), c = Number(i[3]), o = new Date(l, p - 1, c);
-  if (!(Number.isNaN(o.getTime()) || o.getFullYear() !== l || o.getMonth() !== p - 1 || o.getDate() !== c))
-    return o;
-}, Ct = (a) => {
-  const i = a.length > 0 ? a : [W];
-  return Array.from({ length: Pt }, (l, p) => Array.from({ length: ve }, (c, o) => {
-    const u = p * ve + o;
-    return {
-      aspectRatio: Q[(u + p) % Q.length] ?? Q[0],
-      src: i[u % i.length] ?? W
-    };
-  }));
+import { getStorefrontPreset as e } from "../data/config.js";
+import { applyBookingParamsToSearch as t, createBookingPeriodConfigFromStorefrontConfiguration as n, getBookingParamsFromSearch as r, getDefaultBookingParamsForStorefrontConfiguration as i, resolveBookingSearchParamsFromSessionStorage as a, writeBookingSearchParamsToSessionStorage as o } from "../lib/booking.js";
+import { getAvailabilityVariant as ee } from "../lib/utils.js";
+import { getLocalizedValue as s } from "../localization.js";
+import { Badge as c } from "../ui/badge.js";
+import { Button as l } from "../ui/button.js";
+import { usePlaygroundDevSettings as u } from "../lib/playgroundDevSettings.js";
+import { BookingPeriodProvider as te } from "../components/BookingPeriodSelector/BookingPeriodContext.js";
+import { BookingStartDateField as ne } from "../components/BookingPeriodSelector/components/BookingStartDateField.js";
+import { BookingStartTimeField as re } from "../components/BookingPeriodSelector/components/BookingStartTimeField.js";
+import { BookingEndDateField as ie } from "../components/BookingPeriodSelector/components/BookingEndDateField.js";
+import { BookingEndTimeField as ae } from "../components/BookingPeriodSelector/components/BookingEndTimeField.js";
+import "../components/BookingPeriodSelector/index.js";
+import { DeliveryAddressSelector as oe } from "../components/DeliveryAddressSelector/index.js";
+import { useStorefront as se, useStorefrontProducts as ce } from "../StorefrontProvider.js";
+import { ContactSection as le } from "../components/ContactSection/index.js";
+import { TestimonialsSection as ue } from "../components/TestimonialsSection/index.js";
+import { AboutSection as de } from "../components/AboutSection/index.js";
+import { Card as fe } from "../ui/card.js";
+import { ProductWarningNotice as pe } from "../components/ProductWarningNotice/index.js";
+import { ProductPriceBadge as me } from "../components/ProductPriceBadge/index.js";
+import he from "../chunks/assets/playground-hero-preview-kf4c9tSc.js";
+import { resolveProductImageContainerStyle as ge } from "../lib/productImageStyles.js";
+import { BikeProductCard as _e } from "../components/BikeProductCard/index.js";
+import { StorefrontCancellationPolicyNotice as ve, resolveStorefrontCancellationPolicyTeaserTier as ye } from "../components/StorefrontCancellationPolicyNotice/index.js";
+import { createStorefrontTimeSlotsFetcher as be } from "../lib/fetchStorefrontTimeSlots.js";
+import { FulfillmentSection as xe } from "../components/FulfillmentSection/index.js";
+import { useEffect as Se, useMemo as d, useRef as Ce, useState as f } from "react";
+import { Fragment as we, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { cn as h } from "@rpcbase/ui";
+import { useMediaQuery as Te } from "@rpcbase/client";
+import { Link as g, useLocation as Ee, useNavigate as De, useParams as Oe, useSearchParams as ke } from "@rpcbase/router";
+import { useTranslation as Ae } from "react-i18next";
+import { ArrowRight as _, Bike as je, Clock as Me, MapPin as Ne, ShieldCheck as Pe, Truck as Fe, Umbrella as Ie } from "lucide-react";
+//#region src/pages/HomePage.tsx
+var v = (e) => String(e).padStart(2, "0"), y = "text-2xs font-semibold uppercase tracking-wide text-slate-600", b = "h-10", x = 6, S = 5, C = [
+	15,
+	25,
+	42,
+	66,
+	33,
+	54
+], w = [
+	"4 / 5",
+	"1 / 1",
+	"3 / 4",
+	"5 / 4",
+	"7 / 9",
+	"4 / 3",
+	"9 / 16",
+	"6 / 7"
+], T = (e) => `${e.getFullYear()}-${v(e.getMonth() + 1)}-${v(e.getDate())}`, E = (e) => {
+	if (!e) return;
+	let t = e.match(/^(\d{4})-(\d{2})-(\d{2})$/);
+	if (!t) return;
+	let n = Number(t[1]), r = Number(t[2]), i = Number(t[3]), a = new Date(n, r - 1, i);
+	if (!(Number.isNaN(a.getTime()) || a.getFullYear() !== n || a.getMonth() !== r - 1 || a.getDate() !== i)) return a;
+}, Le = (e) => {
+	let t = e.length > 0 ? e : [he];
+	return Array.from({ length: x }, (e, n) => Array.from({ length: S }, (e, r) => {
+		let i = n * S + r;
+		return {
+			aspectRatio: w[(i + n) % w.length] ?? w[0],
+			src: t[i % t.length] ?? "data:image/svg+xml,%3csvg%20width='1600'%20height='1066'%20viewBox='0%200%201600%201066'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cdefs%3e%3clinearGradient%20id='bg'%20x1='0'%20y1='0'%20x2='1600'%20y2='1066'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%230F172A'/%3e%3cstop%20offset='1'%20stop-color='%23164E63'/%3e%3c/linearGradient%3e%3clinearGradient%20id='road'%20x1='0'%20y1='740'%20x2='1600'%20y2='1066'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23334155'/%3e%3cstop%20offset='1'%20stop-color='%230F172A'/%3e%3c/linearGradient%3e%3c/defs%3e%3crect%20width='1600'%20height='1066'%20fill='url(%23bg)'/%3e%3cpath%20d='M0%20675C233%20555%20420%20530%20590%20551C752%20571%20930%20635%201088%20632C1252%20629%201423%20559%201600%20498V1066H0V675Z'%20fill='%231E293B'%20opacity='0.7'/%3e%3cpath%20d='M0%20792C213%20710%20393%20686%20573%20697C760%20708%20945%20760%201123%20761C1286%20762%201437%20722%201600%20666V1066H0V792Z'%20fill='url(%23road)'/%3e%3ccircle%20cx='440'%20cy='620'%20r='92'%20stroke='%23F8FAFC'%20stroke-width='18'%20opacity='0.8'/%3e%3ccircle%20cx='740'%20cy='620'%20r='92'%20stroke='%23F8FAFC'%20stroke-width='18'%20opacity='0.8'/%3e%3cpath%20d='M440%20620L560%20520L650%20620H740M560%20520L610%20445M595%20470H665'%20stroke='%23F8FAFC'%20stroke-width='18'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3ccircle%20cx='980'%20cy='700'%20r='80'%20stroke='%23E2E8F0'%20stroke-width='14'%20opacity='0.7'/%3e%3ccircle%20cx='1240'%20cy='700'%20r='80'%20stroke='%23E2E8F0'%20stroke-width='14'%20opacity='0.7'/%3e%3cpath%20d='M980%20700L1078%20616L1156%20700H1240M1078%20616L1122%20556M1112%20574H1172'%20stroke='%23E2E8F0'%20stroke-width='14'%20stroke-linecap='round'%20stroke-linejoin='round'%20opacity='0.7'/%3e%3c/svg%3e"
+		};
+	}));
 };
-function ca() {
-  const { t: a, i18n: i } = et(), { storeSlug: l } = ze(), p = Ye(), { storefrontConfiguration: c } = yt(), o = c.workspace?.workspaceLanguage, { bikes: u, accessories: K } = wt(), [R] = Qe(), _e = We(), f = h(
-    () => ut(R, l),
-    [R, l]
-  ), x = h(() => at(l), [l]), ke = h(
-    () => ft(c),
-    [c]
-  ), d = h(
-    () => xt(c),
-    [c]
-  ), N = h(() => E(d.start_date), [d.start_date]), ye = h(
-    () => E(d.end_date) ?? N,
-    [d.end_date, N]
-  ), v = c.settings.fulfillmentModes.includes("delivery"), G = c.settings.deliveryDisabledReason.trim(), we = !!nt(c.bookingEngine.cancellationPolicy), q = h(
-    () => vt(f, d),
-    [d, f]
-  ), [w, J] = b(
-    () => q.fulfillment === "delivery" && v ? "delivery" : "pickup"
-  ), [L, Se] = b(
-    () => E(f.get("start_date")) ?? N
-  ), [F, Pe] = b(() => f.get("start_time") ?? d.start_time), [O, Ce] = b(() => {
-    const t = E(f.get("start_date")) ?? N;
-    return E(f.get("end_date")) ?? t ?? ye;
-  }), [$, De] = b(() => f.get("end_time") ?? d.end_time), [S, I] = b(() => q.start_address), [P, H] = b(() => q.end_address), j = je(null), Ae = h(() => u.slice(0, 4), [u]), { heroMode: X } = kt(), C = X === "vertical_marquee_hero", _ = X === "booking_bar_overlay_hero" || C, Z = Ve("(min-width: 1024px)"), Ee = _t(l), Be = h(
-    () => ({
-      startDate: a("booking_start_date"),
-      pickStartDate: a("booking_start_date"),
-      startTime: a("booking_start_time"),
-      endDate: a("booking_end_date"),
-      pickEndDate: a("booking_end_date"),
-      endTime: a("booking_end_time"),
-      selectedDaysTooltip: ({ count: t }) => a("booking_selected_days_tooltip", { count: t })
-    }),
-    [i.language, a]
-  ), B = h(() => {
-    const n = L ?? (N ?? /* @__PURE__ */ new Date()), s = O ?? n;
-    return bt(new URLSearchParams(), {
-      fulfillment: w === "delivery" && v ? "delivery" : "pickup",
-      start_date: Ne(n),
-      start_time: F || d.start_time,
-      end_date: Ne(s),
-      end_time: $ || d.end_time,
-      start_address: S,
-      end_address: P
-    });
-  }, [
-    d.end_time,
-    d.start_time,
-    N,
-    v,
-    P,
-    O,
-    $,
-    w,
-    S,
-    L,
-    F
-  ]), ee = B.toString(), Te = ee ? `?${ee}` : "";
-  Ue(() => {
-    Nt(l, B);
-  }, [B, l]);
-  const Me = {
-    startDate: L,
-    onStartDateChange: Se,
-    startTime: F,
-    onStartTimeChange: Pe,
-    endDate: O,
-    onEndDateChange: Ce,
-    endTime: $,
-    onEndTimeChange: De,
-    onEndTimeCommit: () => {
-      j.current?.focus({ preventScroll: !0 });
-    },
-    bookingPeriodConfig: ke,
-    fetchTimeSlots: Ee,
-    labels: Be,
-    localeCode: i.language
-  }, U = () => {
-    const t = new URLSearchParams(R);
-    for (const [n, s] of B.entries())
-      t.set(n, s);
-    _e(`/${l ?? ""}/booking?${t.toString()}#booking-products`);
-  }, te = (t) => `/${l ?? ""}/products/${t}`, T = {
-    backTo: `${p.pathname}${p.search}${p.hash}`
-  }, ae = /* @__PURE__ */ r("div", { children: [
-    /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ r(Y, { variant: "secondary", children: [
-        /* @__PURE__ */ e(Ke, { className: "h-3 w-3", "aria-hidden": "true" }),
-        /* @__PURE__ */ e("span", { children: a("status_open") })
-      ] }),
-      /* @__PURE__ */ r(Y, { variant: "outline", children: [
-        /* @__PURE__ */ e(Ge, { className: "h-3 w-3", "aria-hidden": "true" }),
-        /* @__PURE__ */ e("span", { children: x.address })
-      ] })
-    ] }),
-    /* @__PURE__ */ e("h1", { className: "mt-4 text-3xl font-semibold tracking-tight sm:text-4xl", children: /* @__PURE__ */ e("span", { children: a("hero_title", { fallback: x.hero_title }) }) }),
-    /* @__PURE__ */ e("p", { className: "mt-3 text-sm text-slate-700 sm:text-base", children: /* @__PURE__ */ e("span", { children: a("hero_description", { fallback: x.hero_description }) }) }),
-    /* @__PURE__ */ e("div", { className: m("mt-6", !_ && "rounded-xl border bg-white/70 p-3"), children: /* @__PURE__ */ r("ul", { className: m("space-y-3", _ && "space-y-2"), children: [
-      /* @__PURE__ */ e(ot, { policy: c.bookingEngine.cancellationPolicy }),
-      /* @__PURE__ */ r("li", { className: m("flex items-start gap-3", !_ && we && "border-t border-slate-200/70 pt-3"), children: [
-        /* @__PURE__ */ e(Je, { className: "mt-0.5 h-5 w-5 text-success", "aria-hidden": "true" }),
-        /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: [
-          /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_secure_payment_title") }) }),
-          /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_secure_payment_description") }) })
-        ] })
-      ] }),
-      /* @__PURE__ */ r("li", { className: m("flex items-start gap-3", !_ && "border-t border-slate-200/70 pt-3"), children: [
-        /* @__PURE__ */ e(Xe, { className: "mt-0.5 h-5 w-5 text-success", "aria-hidden": "true" }),
-        /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: [
-          /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_guarantee_insurance_title") }) }),
-          /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_guarantee_insurance_description") }) })
-        ] })
-      ] }),
-      v ? /* @__PURE__ */ r("li", { className: m("flex items-start gap-3", !_ && "border-t border-slate-200/70 pt-3"), children: [
-        /* @__PURE__ */ e(Ze, { className: "mt-0.5 h-5 w-5 text-slate-900", "aria-hidden": "true" }),
-        /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5", children: [
-          /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-950", children: /* @__PURE__ */ e("span", { children: a("feature_delivery_title") }) }),
-          /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("feature_delivery_description") }) })
-        ] })
-      ] }) : null
-    ] }) })
-  ] }), re = ({
-    className: t,
-    showSubmitButton: n = !1,
-    submitButtonClassName: s
-  }) => /* @__PURE__ */ e(
-    dt,
-    {
-      ...Me,
-      labelClassName: fe,
-      inputClassName: xe,
-      children: /* @__PURE__ */ r("div", { className: t, children: [
-        /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e(mt, {}) }),
-        /* @__PURE__ */ e(ht, {}),
-        /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e(pt, {}) }),
-        /* @__PURE__ */ e(gt, {}),
-        n ? /* @__PURE__ */ r(me, { ref: j, className: m("gap-2", s), onClick: U, children: [
-          /* @__PURE__ */ e("span", { children: a("booking_submit") }),
-          /* @__PURE__ */ e(z, { className: "h-4 w-4", "aria-hidden": "true" })
-        ] }) : null
-      ] })
-    }
-  ), se = (t) => v ? /* @__PURE__ */ e(
-    St,
-    {
-      open: w === "delivery",
-      className: "sm:min-h-[6.75rem]",
-      inputClassName: `${xe} bg-white`,
-      labelClassName: fe,
-      startAddress: S,
-      onStartAddressChange: I,
-      returnAddress: P,
-      onReturnAddressChange: H,
-      testIdPrefix: t
-    }
-  ) : null, Re = se("storefront-home-fulfillment-delivery-address"), qe = se("storefront-home-compact-fulfillment-delivery-address"), Le = /* @__PURE__ */ r(he, { className: "border-slate-200 bg-white/80 shadow-sm", children: [
-    /* @__PURE__ */ r("div", { className: "border-b border-slate-200 px-4 py-4", children: [
-      /* @__PURE__ */ e("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ e("span", { children: a("booking_title") }) }),
-      /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("booking_subtitle") }) })
-    ] }),
-    /* @__PURE__ */ r("div", { className: "grid gap-4 px-4 py-4", children: [
-      /* @__PURE__ */ e(
-        ge,
-        {
-          value: w,
-          onValueChange: J,
-          pickupAddress: x.address,
-          deliveryEnabled: v,
-          deliveryDisabledReason: G,
-          startAddress: S,
-          onStartAddressChange: I,
-          endAddress: P,
-          onEndAddressChange: H,
-          showDeliveryAddressSelector: !1,
-          testIdPrefix: "storefront-home-fulfillment"
-        }
-      ),
-      re({
-        className: "grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-[minmax(0,1fr)_150px_minmax(0,1fr)_150px] xl:items-start"
-      }),
-      Re,
-      /* @__PURE__ */ e("p", { className: "text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: a("booking_minimum_duration", { hours: 4 }) }) }),
-      /* @__PURE__ */ r(
-        me,
-        {
-          ref: j,
-          className: "h-11 w-fit justify-self-start rounded-xl text-sm font-semibold gap-2",
-          onClick: U,
-          children: [
-            /* @__PURE__ */ e("span", { children: a("booking_submit") }),
-            /* @__PURE__ */ e(z, { className: "h-4 w-4", "aria-hidden": "true" })
-          ]
-        }
-      )
-    ] })
-  ] }), ie = /* @__PURE__ */ e(he, { className: "border-slate-200 bg-white/95 shadow-xl", children: /* @__PURE__ */ r("div", { className: "grid gap-3 p-4", children: [
-    /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
-      ge,
-      {
-        value: w,
-        onValueChange: J,
-        pickupAddress: x.address,
-        deliveryEnabled: v,
-        deliveryDisabledReason: G,
-        startAddress: S,
-        onStartAddressChange: I,
-        endAddress: P,
-        onEndAddressChange: H,
-        showDeliveryAddressSelector: !1,
-        testIdPrefix: "storefront-home-compact-fulfillment"
-      }
-    ) }),
-    re({
-      className: "grid gap-3 md:grid-cols-2 xl:grid-cols-[minmax(0,1fr)_150px_minmax(0,1fr)_150px_auto] xl:items-end",
-      showSubmitButton: !0,
-      submitButtonClassName: "h-10 rounded-xl text-sm font-semibold xl:self-end"
-    }),
-    qe
-  ] }) }), Fe = [...u, ...K].flatMap((t) => Array.isArray(t.images) ? t.images : []).filter((t) => typeof t == "string" && t.trim().length > 0).map((t) => t.trim()).slice(0, 12), Oe = Ct(Fe), $e = C ? /* @__PURE__ */ e("style", { children: `
-      @keyframes storefront-hero-marquee-up {
-        0% { transform: translateY(0); }
-        100% { transform: translateY(calc(-50% - (var(--storefront-hero-marquee-gap) / 2))); }
-      }
-      @keyframes storefront-hero-marquee-down {
-        0% { transform: translateY(calc(-50% - (var(--storefront-hero-marquee-gap) / 2))); }
-        100% { transform: translateY(0); }
-      }
-      .storefront-hero-marquee-track {
-        animation: storefront-hero-marquee-up var(--storefront-hero-marquee-duration, 32s) linear infinite;
-        will-change: transform;
-      }
-      .storefront-hero-marquee-track-reverse {
-        animation-name: storefront-hero-marquee-down;
-      }
-      @media (prefers-reduced-motion: reduce) {
-        .storefront-hero-marquee-track,
-        .storefront-hero-marquee-track-reverse {
-          animation: none !important;
-          transform: none !important;
-        }
-      }
-    ` }) : null, le = (t) => /* @__PURE__ */ e(
-    "div",
-    {
-      className: m("relative h-full min-h-[340px] overflow-hidden", t),
-      style: {
-        WebkitMaskImage: "linear-gradient(to bottom, transparent 0%, black 5%, black 95%, transparent 100%)",
-        maskImage: "linear-gradient(to bottom, transparent 0%, black 5%, black 95%, transparent 100%)",
-        WebkitMaskRepeat: "no-repeat",
-        maskRepeat: "no-repeat",
-        WebkitMaskSize: "100% 100%",
-        maskSize: "100% 100%"
-      },
-      "aria-hidden": "true",
-      children: /* @__PURE__ */ e("div", { className: "absolute inset-0 grid grid-cols-2 gap-3 md:grid-cols-3 lg:grid-cols-6", children: Oe.map((n, s) => {
-        const k = be[s % be.length] ?? 32, y = [...n, ...n];
-        return /* @__PURE__ */ e(
-          "div",
-          {
-            className: m(
-              "relative min-h-0 overflow-hidden",
-              s === 2 && "hidden md:block",
-              s >= 3 && "hidden lg:block"
-            ),
-            children: /* @__PURE__ */ e(
-              "div",
-              {
-                className: m(
-                  "storefront-hero-marquee-track flex flex-col gap-[var(--storefront-hero-marquee-gap)]",
-                  s % 2 === 1 && "storefront-hero-marquee-track-reverse"
-                ),
-                style: {
-                  "--storefront-hero-marquee-duration": `${k}s`,
-                  "--storefront-hero-marquee-gap": "0.75rem"
-                },
-                children: y.map((g, D) => /* @__PURE__ */ r(
-                  "div",
-                  {
-                    className: "group relative overflow-hidden rounded-[1.35rem] border border-white/40 bg-transparent",
-                    style: { aspectRatio: g.aspectRatio },
-                    children: [
-                      /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-to-b from-white/22 via-transparent to-transparent" }),
-                      /* @__PURE__ */ e(
-                        "img",
-                        {
-                          src: g.src,
-                          alt: "",
-                          className: "absolute inset-0 h-full w-full object-cover opacity-90 saturate-[1.05] transition-transform duration-700 group-hover:scale-[1.04]",
-                          loading: D < n.length ? "eager" : "lazy"
-                        }
-                      ),
-                      /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-to-t from-slate-950/40 via-slate-950/10 to-white/10" })
-                    ]
-                  },
-                  `hero-marquee-tile-${s}-${D}`
-                ))
-              }
-            )
-          },
-          `hero-marquee-column-${s}`
-        );
-      }) })
-    }
-  ), Ie = C ? /* @__PURE__ */ e("div", { className: "pointer-events-none absolute inset-0 hidden lg:block", "aria-hidden": "true", children: /* @__PURE__ */ r("div", { className: "mx-auto grid h-full max-w-7xl grid-cols-12 gap-8 px-4 sm:px-6", children: [
-    /* @__PURE__ */ e("div", { className: "lg:col-span-5" }),
-    /* @__PURE__ */ e("div", { className: "lg:col-span-7", children: le() })
-  ] }) }) : null, He = C ? /* @__PURE__ */ r(oe, { children: [
-    /* @__PURE__ */ e("div", { className: "lg:hidden", children: le() }),
-    /* @__PURE__ */ e("div", { className: "hidden min-h-[510px] lg:block", "aria-hidden": "true" })
-  ] }) : /* @__PURE__ */ r("div", { className: "relative min-h-[340px] overflow-hidden rounded-3xl border border-slate-200 bg-slate-900 shadow-sm lg:min-h-[510px]", children: [
-    /* @__PURE__ */ e(
-      "img",
-      {
-        src: W,
-        alt: "Bikes ready for reservation",
-        className: "absolute inset-0 h-full w-full object-cover"
-      }
-    ),
-    /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-to-t from-slate-900/45 via-slate-900/15 to-transparent", "aria-hidden": "true" })
-  ] });
-  return /* @__PURE__ */ r(oe, { children: [
-    /* @__PURE__ */ r("section", { className: "relative overflow-hidden border-b border-slate-200", children: [
-      /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-to-b from-slate-50 to-white", "aria-hidden": "true" }),
-      /* @__PURE__ */ e(
-        "div",
-        {
-          className: "absolute inset-0 opacity-[0.07]",
-          style: {
-            backgroundImage: "radial-gradient(circle at 20% 20%, rgba(15, 23, 42, 0.9) 0px, transparent 55%), radial-gradient(circle at 80% 35%, rgba(14, 116, 144, 0.9) 0px, transparent 55%), radial-gradient(circle at 55% 85%, rgba(99, 102, 241, 0.9) 0px, transparent 55%)"
-          },
-          "aria-hidden": "true"
-        }
-      ),
-      $e,
-      Ie,
-      _ ? /* @__PURE__ */ r("div", { className: "relative mx-auto grid max-w-7xl gap-8 px-4 py-10 sm:px-6 lg:grid-cols-12 lg:py-14", children: [
-        /* @__PURE__ */ r("div", { className: "lg:col-span-5", children: [
-          ae,
-          Z ? /* @__PURE__ */ e("div", { className: "mt-7", children: /* @__PURE__ */ e("div", { className: "relative z-20 w-[calc(100%+24rem)] max-w-none", children: ie }) }) : null
-        ] }),
-        /* @__PURE__ */ r("div", { className: m("lg:col-span-7", !C && "lg:pt-4"), children: [
-          He,
-          Z ? null : /* @__PURE__ */ e("div", { className: "mt-4", children: ie })
-        ] })
-      ] }) : /* @__PURE__ */ r("div", { className: "relative mx-auto grid max-w-7xl gap-8 px-4 py-10 sm:px-6 lg:grid-cols-12 lg:items-center lg:py-14", children: [
-        /* @__PURE__ */ e("div", { className: "lg:col-span-5", children: ae }),
-        /* @__PURE__ */ e("div", { className: "lg:col-span-7", children: Le })
-      ] })
-    ] }),
-    /* @__PURE__ */ r("section", { id: "featured", className: "mx-auto max-w-7xl scroll-mt-16 px-4 py-10 sm:scroll-mt-20 sm:px-6", children: [
-      /* @__PURE__ */ r("div", { className: "flex items-center justify-between gap-3", children: [
-        /* @__PURE__ */ r("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ e("h2", { className: "text-xl font-semibold tracking-tight", children: /* @__PURE__ */ e("span", { children: a("featured_title") }) }),
-          /* @__PURE__ */ e("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ e("span", { children: a("featured_description") }) })
-        ] }),
-        /* @__PURE__ */ r(
-          M,
-          {
-            className: "hidden items-center gap-2 text-sm font-medium text-slate-700 hover:text-slate-950 sm:inline-flex",
-            to: `/${l ?? ""}/booking${Te}`,
-            children: [
-              /* @__PURE__ */ e("span", { children: a("featured_view_all") }),
-              /* @__PURE__ */ e(z, { className: "h-4 w-4", "aria-hidden": "true" })
-            ]
-          }
-        )
-      ] }),
-      /* @__PURE__ */ e("div", { className: "mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: Ae.map((t) => {
-        const n = t.id, s = t.slug, k = A(t.name, i.language, o), y = A(t.description, i.language, o), g = typeof t.images?.[0] == "string" ? t.images[0].trim() : "", D = pe(t.primaryImageStyle), ne = tt(t.availabilityStatus), V = te(s);
-        return /* @__PURE__ */ r(
-          "div",
-          {
-            className: "group flex h-full flex-col gap-2 rounded-xl border border-slate-200 bg-white p-3 text-left shadow-sm transition hover:border-slate-400",
-            children: [
-              /* @__PURE__ */ e(
-                M,
-                {
-                  to: V,
-                  state: T,
-                  className: "block",
-                  children: /* @__PURE__ */ e(
-                    "span",
-                    {
-                      className: m("relative block aspect-[1618/1000] overflow-hidden rounded-xl", D.className),
-                      style: D.style,
-                      children: g ? /* @__PURE__ */ e("img", { src: g, alt: k, className: "absolute inset-0 h-full w-full object-contain p-1", loading: "lazy" }) : /* @__PURE__ */ e("span", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ e(ce, { className: "h-8 w-8", "aria-hidden": "true" }) })
-                    }
-                  )
-                }
-              ),
-              /* @__PURE__ */ r("span", { className: "flex flex-1 flex-col gap-1", children: [
-                /* @__PURE__ */ e(
-                  M,
-                  {
-                    to: V,
-                    state: T,
-                    className: "text-sm font-semibold text-slate-950 hover:text-slate-700",
-                    children: /* @__PURE__ */ e("span", { children: k })
-                  }
-                ),
-                /* @__PURE__ */ e(de, { prices: t.prices, className: "self-start" }),
-                /* @__PURE__ */ e("span", { className: "line-clamp-2 text-xs text-slate-600", children: y })
-              ] }),
-              /* @__PURE__ */ r("span", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [
-                /* @__PURE__ */ e(Y, { variant: ne.variant, children: /* @__PURE__ */ e("span", { children: a(ne.labelKey) }) }),
-                /* @__PURE__ */ e("span", { className: "text-slate-400", children: "·" }),
-                /* @__PURE__ */ e(
-                  M,
-                  {
-                    to: V,
-                    state: T,
-                    className: "text-xs font-medium text-slate-700 hover:text-slate-950",
-                    children: /* @__PURE__ */ e("span", { children: a("product_details_link") })
-                  }
-                )
-              ] })
-            ]
-          },
-          n
-        );
-      }) })
-    ] }),
-    /* @__PURE__ */ e("section", { id: "products", className: "border-t bg-slate-50/60 scroll-mt-16 sm:scroll-mt-20", children: /* @__PURE__ */ r("div", { className: "mx-auto max-w-7xl px-4 py-10 sm:px-6", children: [
-      /* @__PURE__ */ e("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: /* @__PURE__ */ r("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ e("h2", { className: "text-xl font-semibold tracking-tight", children: /* @__PURE__ */ e("span", { children: a("products_title") }) }),
-        /* @__PURE__ */ e("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ e("span", { children: a("products_description") }) })
-      ] }) }),
-      /* @__PURE__ */ e("div", { className: "mt-6 grid gap-4 md:grid-cols-2", children: u.map((t) => /* @__PURE__ */ e(
-        st,
-        {
-          bike: t,
-          detailsPath: te(t.slug),
-          productDetailsLinkState: T,
-          fallbackLanguage: o,
-          onAction: U
-        },
-        t.id
-      )) })
-    ] }) }),
-    /* @__PURE__ */ r("section", { className: "mx-auto max-w-7xl px-4 py-10 sm:px-6", children: [
-      /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between", children: /* @__PURE__ */ r("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ e("h2", { className: "text-xl font-semibold tracking-tight", children: /* @__PURE__ */ e("span", { children: a("accessories_title") }) }),
-        /* @__PURE__ */ e("p", { className: "text-sm text-slate-600", children: /* @__PURE__ */ e("span", { children: a("accessories_description") }) })
-      ] }) }),
-      /* @__PURE__ */ e("div", { className: "mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: K.slice(0, 4).map((t) => {
-        const n = A(t.name, i.language, o), s = A(t.description, i.language, o), k = A(t.warning, i.language, o), y = typeof t.images?.[0] == "string" ? t.images[0].trim() : "", g = pe(t.primaryImageStyle);
-        return /* @__PURE__ */ r("div", { className: "flex h-full flex-col gap-2 rounded-xl border border-slate-200 bg-white p-3 shadow-sm", children: [
-          /* @__PURE__ */ e(
-            "div",
-            {
-              className: m("relative aspect-[1618/1000] overflow-hidden rounded-xl", g.className),
-              style: g.style,
-              children: y ? /* @__PURE__ */ e("img", { src: y, alt: n, className: "absolute inset-0 h-full w-full object-contain p-1", loading: "lazy" }) : /* @__PURE__ */ e("div", { className: "absolute inset-0 flex items-center justify-center text-slate-400", children: /* @__PURE__ */ e(ce, { className: "h-8 w-8", "aria-hidden": "true" }) })
-            }
-          ),
-          /* @__PURE__ */ r("div", { className: "flex flex-1 flex-col gap-1", children: [
-            /* @__PURE__ */ e("p", { className: "text-sm font-semibold text-slate-950", children: /* @__PURE__ */ e("span", { children: n }) }),
-            /* @__PURE__ */ e("p", { className: "line-clamp-2 text-xs text-slate-600", children: /* @__PURE__ */ e("span", { children: s }) }),
-            /* @__PURE__ */ e(lt, { warning: k, className: "mt-1" })
-          ] }),
-          /* @__PURE__ */ e("div", { className: "flex items-center justify-between gap-2", children: /* @__PURE__ */ e(de, { prices: t.prices }) })
-        ] }, t.id);
-      }) })
-    ] }),
-    /* @__PURE__ */ e(rt, { preset: x }),
-    /* @__PURE__ */ e(ct, {}),
-    /* @__PURE__ */ e(it, { preset: x, storeSlug: l ?? "" })
-  ] });
+function D() {
+	let { t: v, i18n: x } = Ae(), { storeSlug: S } = Oe(), w = Ee(), { storefrontConfiguration: D } = se(), O = D.workspace?.workspaceLanguage, { bikes: k, accessories: Re } = ce(), [A] = ke(), ze = De(), j = d(() => a(A, S), [A, S]), M = d(() => e(S), [S]), Be = d(() => n(D), [D]), N = d(() => i(D), [D]), P = d(() => E(N.start_date), [N.start_date]), Ve = d(() => E(N.end_date) ?? P, [N.end_date, P]), F = D.settings.fulfillmentModes.includes("delivery"), He = D.settings.deliveryDisabledReason.trim(), Ue = !!ye(D.bookingEngine.cancellationPolicy), I = d(() => r(j, N), [N, j]), [L, We] = f(() => I.fulfillment === "delivery" && F ? "delivery" : "pickup"), [R, Ge] = f(() => E(j.get("start_date")) ?? P), [z, Ke] = f(() => j.get("start_time") ?? N.start_time), [B, qe] = f(() => {
+		let e = E(j.get("start_date")) ?? P;
+		return E(j.get("end_date")) ?? e ?? Ve;
+	}), [V, Je] = f(() => j.get("end_time") ?? N.end_time), [H, U] = f(() => I.start_address), [W, G] = f(() => I.end_address), K = Ce(null), Ye = d(() => k.slice(0, 4), [k]), { heroMode: Xe } = u(), q = Xe === "vertical_marquee_hero", J = Xe === "booking_bar_overlay_hero" || q, Ze = Te("(min-width: 1024px)"), Qe = be(S), $e = d(() => ({
+		startDate: v("booking_start_date"),
+		pickStartDate: v("booking_start_date"),
+		startTime: v("booking_start_time"),
+		endDate: v("booking_end_date"),
+		pickEndDate: v("booking_end_date"),
+		endTime: v("booking_end_time"),
+		selectedDaysTooltip: ({ count: e }) => v("booking_selected_days_tooltip", { count: e })
+	}), [x.language, v]), Y = d(() => {
+		let e = R ?? P ?? /* @__PURE__ */ new Date(), n = B ?? e;
+		return t(new URLSearchParams(), {
+			fulfillment: L === "delivery" && F ? "delivery" : "pickup",
+			start_date: T(e),
+			start_time: z || N.start_time,
+			end_date: T(n),
+			end_time: V || N.end_time,
+			start_address: H,
+			end_address: W
+		});
+	}, [
+		N.end_time,
+		N.start_time,
+		P,
+		F,
+		W,
+		B,
+		V,
+		L,
+		H,
+		R,
+		z
+	]), et = Y.toString(), tt = et ? `?${et}` : "";
+	Se(() => {
+		o(S, Y);
+	}, [Y, S]);
+	let nt = {
+		startDate: R,
+		onStartDateChange: Ge,
+		startTime: z,
+		onStartTimeChange: Ke,
+		endDate: B,
+		onEndDateChange: qe,
+		endTime: V,
+		onEndTimeChange: Je,
+		onEndTimeCommit: () => {
+			K.current?.focus({ preventScroll: !0 });
+		},
+		bookingPeriodConfig: Be,
+		fetchTimeSlots: Qe,
+		labels: $e,
+		localeCode: x.language
+	}, X = () => {
+		let e = new URLSearchParams(A);
+		for (let [t, n] of Y.entries()) e.set(t, n);
+		ze(`/${S ?? ""}/booking?${e.toString()}#booking-products`);
+	}, rt = (e) => `/${S ?? ""}/products/${e}`, Z = { backTo: `${w.pathname}${w.search}${w.hash}` }, it = /* @__PURE__ */ m("div", { children: [
+		/* @__PURE__ */ m("div", {
+			className: "flex items-center gap-2",
+			children: [/* @__PURE__ */ m(c, {
+				variant: "secondary",
+				children: [/* @__PURE__ */ p(Me, {
+					className: "h-3 w-3",
+					"aria-hidden": "true"
+				}), /* @__PURE__ */ p("span", { children: v("status_open") })]
+			}), /* @__PURE__ */ m(c, {
+				variant: "outline",
+				children: [/* @__PURE__ */ p(Ne, {
+					className: "h-3 w-3",
+					"aria-hidden": "true"
+				}), /* @__PURE__ */ p("span", { children: M.address })]
+			})]
+		}),
+		/* @__PURE__ */ p("h1", {
+			className: "mt-4 text-3xl font-semibold tracking-tight sm:text-4xl",
+			children: /* @__PURE__ */ p("span", { children: v("hero_title", { fallback: M.hero_title }) })
+		}),
+		/* @__PURE__ */ p("p", {
+			className: "mt-3 text-sm text-slate-700 sm:text-base",
+			children: /* @__PURE__ */ p("span", { children: v("hero_description", { fallback: M.hero_description }) })
+		}),
+		/* @__PURE__ */ p("div", {
+			className: h("mt-6", !J && "rounded-xl border bg-white/70 p-3"),
+			children: /* @__PURE__ */ m("ul", {
+				className: h("space-y-3", J && "space-y-2"),
+				children: [
+					/* @__PURE__ */ p(ve, { policy: D.bookingEngine.cancellationPolicy }),
+					/* @__PURE__ */ m("li", {
+						className: h("flex items-start gap-3", !J && Ue && "border-t border-slate-200/70 pt-3"),
+						children: [/* @__PURE__ */ p(Pe, {
+							className: "mt-0.5 h-5 w-5 text-success",
+							"aria-hidden": "true"
+						}), /* @__PURE__ */ m("div", {
+							className: "flex flex-col gap-0.5",
+							children: [/* @__PURE__ */ p("p", {
+								className: "text-sm font-medium text-slate-950",
+								children: /* @__PURE__ */ p("span", { children: v("feature_secure_payment_title") })
+							}), /* @__PURE__ */ p("p", {
+								className: "text-xs text-slate-600",
+								children: /* @__PURE__ */ p("span", { children: v("feature_secure_payment_description") })
+							})]
+						})]
+					}),
+					/* @__PURE__ */ m("li", {
+						className: h("flex items-start gap-3", !J && "border-t border-slate-200/70 pt-3"),
+						children: [/* @__PURE__ */ p(Ie, {
+							className: "mt-0.5 h-5 w-5 text-success",
+							"aria-hidden": "true"
+						}), /* @__PURE__ */ m("div", {
+							className: "flex flex-col gap-0.5",
+							children: [/* @__PURE__ */ p("p", {
+								className: "text-sm font-medium text-slate-950",
+								children: /* @__PURE__ */ p("span", { children: v("feature_guarantee_insurance_title") })
+							}), /* @__PURE__ */ p("p", {
+								className: "text-xs text-slate-600",
+								children: /* @__PURE__ */ p("span", { children: v("feature_guarantee_insurance_description") })
+							})]
+						})]
+					}),
+					F ? /* @__PURE__ */ m("li", {
+						className: h("flex items-start gap-3", !J && "border-t border-slate-200/70 pt-3"),
+						children: [/* @__PURE__ */ p(Fe, {
+							className: "mt-0.5 h-5 w-5 text-slate-900",
+							"aria-hidden": "true"
+						}), /* @__PURE__ */ m("div", {
+							className: "flex flex-col gap-0.5",
+							children: [/* @__PURE__ */ p("p", {
+								className: "text-sm font-medium text-slate-950",
+								children: /* @__PURE__ */ p("span", { children: v("feature_delivery_title") })
+							}), /* @__PURE__ */ p("p", {
+								className: "text-xs text-slate-600",
+								children: /* @__PURE__ */ p("span", { children: v("feature_delivery_description") })
+							})]
+						})]
+					}) : null
+				]
+			})
+		})
+	] }), at = ({ className: e, showSubmitButton: t = !1, submitButtonClassName: n }) => /* @__PURE__ */ p(te, {
+		...nt,
+		labelClassName: y,
+		inputClassName: b,
+		children: /* @__PURE__ */ m("div", {
+			className: e,
+			children: [
+				/* @__PURE__ */ p("div", {
+					className: "min-w-0",
+					children: /* @__PURE__ */ p(ne, {})
+				}),
+				/* @__PURE__ */ p(re, {}),
+				/* @__PURE__ */ p("div", {
+					className: "min-w-0",
+					children: /* @__PURE__ */ p(ie, {})
+				}),
+				/* @__PURE__ */ p(ae, {}),
+				t ? /* @__PURE__ */ m(l, {
+					ref: K,
+					className: h("gap-2", n),
+					onClick: X,
+					children: [/* @__PURE__ */ p("span", { children: v("booking_submit") }), /* @__PURE__ */ p(_, {
+						className: "h-4 w-4",
+						"aria-hidden": "true"
+					})]
+				}) : null
+			]
+		})
+	}), Q = (e) => F ? /* @__PURE__ */ p(oe, {
+		open: L === "delivery",
+		className: "sm:min-h-[6.75rem]",
+		inputClassName: `${b} bg-white`,
+		labelClassName: y,
+		startAddress: H,
+		onStartAddressChange: U,
+		returnAddress: W,
+		onReturnAddressChange: G,
+		testIdPrefix: e
+	}) : null, ot = Q("storefront-home-fulfillment-delivery-address"), st = Q("storefront-home-compact-fulfillment-delivery-address"), ct = /* @__PURE__ */ m(fe, {
+		className: "border-slate-200 bg-white/80 shadow-sm",
+		children: [/* @__PURE__ */ m("div", {
+			className: "border-b border-slate-200 px-4 py-4",
+			children: [/* @__PURE__ */ p("p", {
+				className: "text-sm font-semibold text-slate-950",
+				children: /* @__PURE__ */ p("span", { children: v("booking_title") })
+			}), /* @__PURE__ */ p("p", {
+				className: "mt-1 text-xs text-slate-600",
+				children: /* @__PURE__ */ p("span", { children: v("booking_subtitle") })
+			})]
+		}), /* @__PURE__ */ m("div", {
+			className: "grid gap-4 px-4 py-4",
+			children: [
+				/* @__PURE__ */ p(xe, {
+					value: L,
+					onValueChange: We,
+					pickupAddress: M.address,
+					deliveryEnabled: F,
+					deliveryDisabledReason: He,
+					startAddress: H,
+					onStartAddressChange: U,
+					endAddress: W,
+					onEndAddressChange: G,
+					showDeliveryAddressSelector: !1,
+					testIdPrefix: "storefront-home-fulfillment"
+				}),
+				at({ className: "grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-[minmax(0,1fr)_150px_minmax(0,1fr)_150px] xl:items-start" }),
+				ot,
+				/* @__PURE__ */ p("p", {
+					className: "text-xs text-slate-600",
+					children: /* @__PURE__ */ p("span", { children: v("booking_minimum_duration", { hours: 4 }) })
+				}),
+				/* @__PURE__ */ m(l, {
+					ref: K,
+					className: "h-11 w-fit justify-self-start rounded-xl text-sm font-semibold gap-2",
+					onClick: X,
+					children: [/* @__PURE__ */ p("span", { children: v("booking_submit") }), /* @__PURE__ */ p(_, {
+						className: "h-4 w-4",
+						"aria-hidden": "true"
+					})]
+				})
+			]
+		})]
+	}), lt = /* @__PURE__ */ p(fe, {
+		className: "border-slate-200 bg-white/95 shadow-xl",
+		children: /* @__PURE__ */ m("div", {
+			className: "grid gap-3 p-4",
+			children: [
+				/* @__PURE__ */ p("div", { children: /* @__PURE__ */ p(xe, {
+					value: L,
+					onValueChange: We,
+					pickupAddress: M.address,
+					deliveryEnabled: F,
+					deliveryDisabledReason: He,
+					startAddress: H,
+					onStartAddressChange: U,
+					endAddress: W,
+					onEndAddressChange: G,
+					showDeliveryAddressSelector: !1,
+					testIdPrefix: "storefront-home-compact-fulfillment"
+				}) }),
+				at({
+					className: "grid gap-3 md:grid-cols-2 xl:grid-cols-[minmax(0,1fr)_150px_minmax(0,1fr)_150px_auto] xl:items-end",
+					showSubmitButton: !0,
+					submitButtonClassName: "h-10 rounded-xl text-sm font-semibold xl:self-end"
+				}),
+				st
+			]
+		})
+	}), ut = Le([...k, ...Re].flatMap((e) => Array.isArray(e.images) ? e.images : []).filter((e) => typeof e == "string" && e.trim().length > 0).map((e) => e.trim()).slice(0, 12)), dt = q ? /* @__PURE__ */ p("style", { children: "\n      @keyframes storefront-hero-marquee-up {\n        0% { transform: translateY(0); }\n        100% { transform: translateY(calc(-50% - (var(--storefront-hero-marquee-gap) / 2))); }\n      }\n      @keyframes storefront-hero-marquee-down {\n        0% { transform: translateY(calc(-50% - (var(--storefront-hero-marquee-gap) / 2))); }\n        100% { transform: translateY(0); }\n      }\n      .storefront-hero-marquee-track {\n        animation: storefront-hero-marquee-up var(--storefront-hero-marquee-duration, 32s) linear infinite;\n        will-change: transform;\n      }\n      .storefront-hero-marquee-track-reverse {\n        animation-name: storefront-hero-marquee-down;\n      }\n      @media (prefers-reduced-motion: reduce) {\n        .storefront-hero-marquee-track,\n        .storefront-hero-marquee-track-reverse {\n          animation: none !important;\n          transform: none !important;\n        }\n      }\n    " }) : null, $ = (e) => /* @__PURE__ */ p("div", {
+		className: h("relative h-full min-h-[340px] overflow-hidden", e),
+		style: {
+			WebkitMaskImage: "linear-gradient(to bottom, transparent 0%, black 5%, black 95%, transparent 100%)",
+			maskImage: "linear-gradient(to bottom, transparent 0%, black 5%, black 95%, transparent 100%)",
+			WebkitMaskRepeat: "no-repeat",
+			maskRepeat: "no-repeat",
+			WebkitMaskSize: "100% 100%",
+			maskSize: "100% 100%"
+		},
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ p("div", {
+			className: "absolute inset-0 grid grid-cols-2 gap-3 md:grid-cols-3 lg:grid-cols-6",
+			children: ut.map((e, t) => {
+				let n = C[t % C.length] ?? 32, r = [...e, ...e];
+				return /* @__PURE__ */ p("div", {
+					className: h("relative min-h-0 overflow-hidden", t === 2 && "hidden md:block", t >= 3 && "hidden lg:block"),
+					children: /* @__PURE__ */ p("div", {
+						className: h("storefront-hero-marquee-track flex flex-col gap-[var(--storefront-hero-marquee-gap)]", t % 2 == 1 && "storefront-hero-marquee-track-reverse"),
+						style: {
+							"--storefront-hero-marquee-duration": `${n}s`,
+							"--storefront-hero-marquee-gap": "0.75rem"
+						},
+						children: r.map((n, r) => /* @__PURE__ */ m("div", {
+							className: "group relative overflow-hidden rounded-[1.35rem] border border-white/40 bg-transparent",
+							style: { aspectRatio: n.aspectRatio },
+							children: [
+								/* @__PURE__ */ p("div", { className: "absolute inset-0 bg-linear-to-b from-white/22 via-transparent to-transparent" }),
+								/* @__PURE__ */ p("img", {
+									src: n.src,
+									alt: "",
+									className: "absolute inset-0 h-full w-full object-cover opacity-90 saturate-[1.05] transition-transform duration-700 group-hover:scale-[1.04]",
+									loading: r < e.length ? "eager" : "lazy"
+								}),
+								/* @__PURE__ */ p("div", { className: "absolute inset-0 bg-linear-to-t from-slate-950/40 via-slate-950/10 to-white/10" })
+							]
+						}, `hero-marquee-tile-${t}-${r}`))
+					})
+				}, `hero-marquee-column-${t}`);
+			})
+		})
+	}), ft = q ? /* @__PURE__ */ p("div", {
+		className: "pointer-events-none absolute inset-0 hidden lg:block",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ m("div", {
+			className: "mx-auto grid h-full max-w-7xl grid-cols-12 gap-8 px-4 sm:px-6",
+			children: [/* @__PURE__ */ p("div", { className: "lg:col-span-5" }), /* @__PURE__ */ p("div", {
+				className: "lg:col-span-7",
+				children: $()
+			})]
+		})
+	}) : null, pt = q ? /* @__PURE__ */ m(we, { children: [/* @__PURE__ */ p("div", {
+		className: "lg:hidden",
+		children: $()
+	}), /* @__PURE__ */ p("div", {
+		className: "hidden min-h-[510px] lg:block",
+		"aria-hidden": "true"
+	})] }) : /* @__PURE__ */ m("div", {
+		className: "relative min-h-[340px] overflow-hidden rounded-3xl border border-slate-200 bg-slate-900 shadow-sm lg:min-h-[510px]",
+		children: [/* @__PURE__ */ p("img", {
+			src: he,
+			alt: "Bikes ready for reservation",
+			className: "absolute inset-0 h-full w-full object-cover"
+		}), /* @__PURE__ */ p("div", {
+			className: "absolute inset-0 bg-linear-to-t from-slate-900/45 via-slate-900/15 to-transparent",
+			"aria-hidden": "true"
+		})]
+	});
+	return /* @__PURE__ */ m(we, { children: [
+		/* @__PURE__ */ m("section", {
+			className: "relative overflow-hidden border-b border-slate-200",
+			children: [
+				/* @__PURE__ */ p("div", {
+					className: "absolute inset-0 bg-linear-to-b from-slate-50 to-white",
+					"aria-hidden": "true"
+				}),
+				/* @__PURE__ */ p("div", {
+					className: "absolute inset-0 opacity-[0.07]",
+					style: { backgroundImage: "radial-gradient(circle at 20% 20%, rgba(15, 23, 42, 0.9) 0px, transparent 55%), radial-gradient(circle at 80% 35%, rgba(14, 116, 144, 0.9) 0px, transparent 55%), radial-gradient(circle at 55% 85%, rgba(99, 102, 241, 0.9) 0px, transparent 55%)" },
+					"aria-hidden": "true"
+				}),
+				dt,
+				ft,
+				J ? /* @__PURE__ */ m("div", {
+					className: "relative mx-auto grid max-w-7xl gap-8 px-4 py-10 sm:px-6 lg:grid-cols-12 lg:py-14",
+					children: [/* @__PURE__ */ m("div", {
+						className: "lg:col-span-5",
+						children: [it, Ze ? /* @__PURE__ */ p("div", {
+							className: "mt-7",
+							children: /* @__PURE__ */ p("div", {
+								className: "relative z-20 w-[calc(100%+24rem)] max-w-none",
+								children: lt
+							})
+						}) : null]
+					}), /* @__PURE__ */ m("div", {
+						className: h("lg:col-span-7", !q && "lg:pt-4"),
+						children: [pt, Ze ? null : /* @__PURE__ */ p("div", {
+							className: "mt-4",
+							children: lt
+						})]
+					})]
+				}) : /* @__PURE__ */ m("div", {
+					className: "relative mx-auto grid max-w-7xl gap-8 px-4 py-10 sm:px-6 lg:grid-cols-12 lg:items-center lg:py-14",
+					children: [/* @__PURE__ */ p("div", {
+						className: "lg:col-span-5",
+						children: it
+					}), /* @__PURE__ */ p("div", {
+						className: "lg:col-span-7",
+						children: ct
+					})]
+				})
+			]
+		}),
+		/* @__PURE__ */ m("section", {
+			id: "featured",
+			className: "mx-auto max-w-7xl scroll-mt-16 px-4 py-10 sm:scroll-mt-20 sm:px-6",
+			children: [/* @__PURE__ */ m("div", {
+				className: "flex items-center justify-between gap-3",
+				children: [/* @__PURE__ */ m("div", {
+					className: "space-y-1",
+					children: [/* @__PURE__ */ p("h2", {
+						className: "text-xl font-semibold tracking-tight",
+						children: /* @__PURE__ */ p("span", { children: v("featured_title") })
+					}), /* @__PURE__ */ p("p", {
+						className: "text-sm text-slate-600",
+						children: /* @__PURE__ */ p("span", { children: v("featured_description") })
+					})]
+				}), /* @__PURE__ */ m(g, {
+					className: "hidden items-center gap-2 text-sm font-medium text-slate-700 hover:text-slate-950 sm:inline-flex",
+					to: `/${S ?? ""}/booking${tt}`,
+					children: [/* @__PURE__ */ p("span", { children: v("featured_view_all") }), /* @__PURE__ */ p(_, {
+						className: "h-4 w-4",
+						"aria-hidden": "true"
+					})]
+				})]
+			}), /* @__PURE__ */ p("div", {
+				className: "mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
+				children: Ye.map((e) => {
+					let t = e.id, n = e.slug, r = s(e.name, x.language, O), i = s(e.description, x.language, O), a = typeof e.images?.[0] == "string" ? e.images[0].trim() : "", o = ge(e.primaryImageStyle), l = ee(e.availabilityStatus), u = rt(n);
+					return /* @__PURE__ */ m("div", {
+						className: "group flex h-full flex-col gap-2 rounded-xl border border-slate-200 bg-white p-3 text-left shadow-sm transition hover:border-slate-400",
+						children: [
+							/* @__PURE__ */ p(g, {
+								to: u,
+								state: Z,
+								className: "block",
+								children: /* @__PURE__ */ p("span", {
+									className: h("relative block aspect-[1618/1000] overflow-hidden rounded-xl", o.className),
+									style: o.style,
+									children: a ? /* @__PURE__ */ p("img", {
+										src: a,
+										alt: r,
+										className: "absolute inset-0 h-full w-full object-contain p-1",
+										loading: "lazy"
+									}) : /* @__PURE__ */ p("span", {
+										className: "absolute inset-0 flex items-center justify-center text-slate-400",
+										children: /* @__PURE__ */ p(je, {
+											className: "h-8 w-8",
+											"aria-hidden": "true"
+										})
+									})
+								})
+							}),
+							/* @__PURE__ */ m("span", {
+								className: "flex flex-1 flex-col gap-1",
+								children: [
+									/* @__PURE__ */ p(g, {
+										to: u,
+										state: Z,
+										className: "text-sm font-semibold text-slate-950 hover:text-slate-700",
+										children: /* @__PURE__ */ p("span", { children: r })
+									}),
+									/* @__PURE__ */ p(me, {
+										prices: e.prices,
+										className: "self-start"
+									}),
+									/* @__PURE__ */ p("span", {
+										className: "line-clamp-2 text-xs text-slate-600",
+										children: i
+									})
+								]
+							}),
+							/* @__PURE__ */ m("span", {
+								className: "flex flex-wrap items-center gap-x-2 gap-y-1",
+								children: [
+									/* @__PURE__ */ p(c, {
+										variant: l.variant,
+										children: /* @__PURE__ */ p("span", { children: v(l.labelKey) })
+									}),
+									/* @__PURE__ */ p("span", {
+										className: "text-slate-400",
+										children: "·"
+									}),
+									/* @__PURE__ */ p(g, {
+										to: u,
+										state: Z,
+										className: "text-xs font-medium text-slate-700 hover:text-slate-950",
+										children: /* @__PURE__ */ p("span", { children: v("product_details_link") })
+									})
+								]
+							})
+						]
+					}, t);
+				})
+			})]
+		}),
+		/* @__PURE__ */ p("section", {
+			id: "products",
+			className: "border-t bg-slate-50/60 scroll-mt-16 sm:scroll-mt-20",
+			children: /* @__PURE__ */ m("div", {
+				className: "mx-auto max-w-7xl px-4 py-10 sm:px-6",
+				children: [/* @__PURE__ */ p("div", {
+					className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between",
+					children: /* @__PURE__ */ m("div", {
+						className: "space-y-1",
+						children: [/* @__PURE__ */ p("h2", {
+							className: "text-xl font-semibold tracking-tight",
+							children: /* @__PURE__ */ p("span", { children: v("products_title") })
+						}), /* @__PURE__ */ p("p", {
+							className: "text-sm text-slate-600",
+							children: /* @__PURE__ */ p("span", { children: v("products_description") })
+						})]
+					})
+				}), /* @__PURE__ */ p("div", {
+					className: "mt-6 grid gap-4 md:grid-cols-2",
+					children: k.map((e) => /* @__PURE__ */ p(_e, {
+						bike: e,
+						detailsPath: rt(e.slug),
+						productDetailsLinkState: Z,
+						fallbackLanguage: O,
+						onAction: X
+					}, e.id))
+				})]
+			})
+		}),
+		/* @__PURE__ */ m("section", {
+			className: "mx-auto max-w-7xl px-4 py-10 sm:px-6",
+			children: [/* @__PURE__ */ p("div", {
+				className: "flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between",
+				children: /* @__PURE__ */ m("div", {
+					className: "space-y-1",
+					children: [/* @__PURE__ */ p("h2", {
+						className: "text-xl font-semibold tracking-tight",
+						children: /* @__PURE__ */ p("span", { children: v("accessories_title") })
+					}), /* @__PURE__ */ p("p", {
+						className: "text-sm text-slate-600",
+						children: /* @__PURE__ */ p("span", { children: v("accessories_description") })
+					})]
+				})
+			}), /* @__PURE__ */ p("div", {
+				className: "mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
+				children: Re.slice(0, 4).map((e) => {
+					let t = s(e.name, x.language, O), n = s(e.description, x.language, O), r = s(e.warning, x.language, O), i = typeof e.images?.[0] == "string" ? e.images[0].trim() : "", a = ge(e.primaryImageStyle);
+					return /* @__PURE__ */ m("div", {
+						className: "flex h-full flex-col gap-2 rounded-xl border border-slate-200 bg-white p-3 shadow-sm",
+						children: [
+							/* @__PURE__ */ p("div", {
+								className: h("relative aspect-[1618/1000] overflow-hidden rounded-xl", a.className),
+								style: a.style,
+								children: i ? /* @__PURE__ */ p("img", {
+									src: i,
+									alt: t,
+									className: "absolute inset-0 h-full w-full object-contain p-1",
+									loading: "lazy"
+								}) : /* @__PURE__ */ p("div", {
+									className: "absolute inset-0 flex items-center justify-center text-slate-400",
+									children: /* @__PURE__ */ p(je, {
+										className: "h-8 w-8",
+										"aria-hidden": "true"
+									})
+								})
+							}),
+							/* @__PURE__ */ m("div", {
+								className: "flex flex-1 flex-col gap-1",
+								children: [
+									/* @__PURE__ */ p("p", {
+										className: "text-sm font-semibold text-slate-950",
+										children: /* @__PURE__ */ p("span", { children: t })
+									}),
+									/* @__PURE__ */ p("p", {
+										className: "line-clamp-2 text-xs text-slate-600",
+										children: /* @__PURE__ */ p("span", { children: n })
+									}),
+									/* @__PURE__ */ p(pe, {
+										warning: r,
+										className: "mt-1"
+									})
+								]
+							}),
+							/* @__PURE__ */ p("div", {
+								className: "flex items-center justify-between gap-2",
+								children: /* @__PURE__ */ p(me, { prices: e.prices })
+							})
+						]
+					}, e.id);
+				})
+			})]
+		}),
+		/* @__PURE__ */ p(de, { preset: M }),
+		/* @__PURE__ */ p(ue, {}),
+		/* @__PURE__ */ p(le, {
+			preset: M,
+			storeSlug: S ?? ""
+		})
+	] });
 }
-export {
-  ca as default
-};
+//#endregion
+export { D as default };