@bigz-app/booking-widget 1.2.0 → 1.3.0

package/dist/index.esm.js

@@ -233,6 +233,7 @@ const de$1 = {
     "events.soldOut": "Ausgebucht",
     "events.availableFrom": "Freie Plätze ab {{date}}",
     "events.noAvailableDates": "Keine Termine frei",
+    "events.previewSectionTitle": "Specials & nächste Termine",
     // Event instances
     "instances.title": "Terminauswahl",
     "instances.noAvailable": "Keine verfügbaren Termine",
@@ -249,6 +250,15 @@ const de$1 = {
     "nextEvents.noUpcomingMessage": "Aktuell sind keine Termine verfügbar. Bitte schaue später noch einmal vorbei oder kontaktiere uns direkt.",
     "nextEvents.showAll": "Alle Events anzeigen",
     "nextEvents.priceOnRequest": "Preis auf Anfrage",
+    // Specials view
+    "specials.title": "Sonderangebote",
+    "specials.subtitle": "Unsere aktuellen Angebote auf einen Blick",
+    "specials.noSpecials": "Keine Sonderangebote",
+    "specials.noSpecialsMessage": "Derzeit sind keine Sonderangebote verfügbar. Bitte schaue später noch einmal vorbei.",
+    "specials.save": "Spare {{amount}}",
+    "specials.savePercent": "{{percent}}% Rabatt",
+    "specials.spotsLeft": "Noch {{count}} Plätze frei",
+    "specials.bookNow": "Jetzt buchen",
     // Booking form
     "booking.title": "Buchung - {{name}}",
     "booking.notPossible": "Buchung nicht möglich",
@@ -493,6 +503,7 @@ const en = {
     "events.soldOut": "Sold out",
     "events.availableFrom": "Available from {{date}}",
     "events.noAvailableDates": "No dates available",
+    "events.previewSectionTitle": "Specials & upcoming dates",
     // Event instances
     "instances.title": "Select a date",
     "instances.noAvailable": "No available dates",
@@ -509,6 +520,15 @@ const en = {
     "nextEvents.noUpcomingMessage": "There are currently no dates available. Please check back later or contact us directly.",
     "nextEvents.showAll": "Show all events",
     "nextEvents.priceOnRequest": "Price on request",
+    // Specials view
+    "specials.title": "Special Offers",
+    "specials.subtitle": "Our current deals at a glance",
+    "specials.noSpecials": "No special offers",
+    "specials.noSpecialsMessage": "There are currently no special offers available. Please check back later.",
+    "specials.save": "Save {{amount}}",
+    "specials.savePercent": "{{percent}}% off",
+    "specials.spotsLeft": "{{count}} spots left",
+    "specials.bookNow": "Book now",
     // Booking form
     "booking.title": "Booking - {{name}}",
     "booking.notPossible": "Booking not possible",
@@ -753,6 +773,7 @@ const es = {
     "events.soldOut": "Agotado",
     "events.availableFrom": "Disponible desde {{date}}",
     "events.noAvailableDates": "Sin fechas disponibles",
+    "events.previewSectionTitle": "Especiales & próximas fechas",
     // Event instances
     "instances.title": "Seleccionar fecha",
     "instances.noAvailable": "Sin fechas disponibles",
@@ -769,6 +790,15 @@ const es = {
     "nextEvents.noUpcomingMessage": "Actualmente no hay fechas disponibles. Por favor, vuelve más tarde o contáctanos directamente.",
     "nextEvents.showAll": "Mostrar todos los eventos",
     "nextEvents.priceOnRequest": "Precio bajo consulta",
+    // Specials view
+    "specials.title": "Ofertas especiales",
+    "specials.subtitle": "Nuestras ofertas actuales de un vistazo",
+    "specials.noSpecials": "Sin ofertas especiales",
+    "specials.noSpecialsMessage": "Actualmente no hay ofertas especiales disponibles. Vuelve más tarde.",
+    "specials.save": "Ahorra {{amount}}",
+    "specials.savePercent": "{{percent}}% de descuento",
+    "specials.spotsLeft": "{{count}} plazas disponibles",
+    "specials.bookNow": "Reservar ahora",
     // Booking form
     "booking.title": "Reserva - {{name}}",
     "booking.notPossible": "Reserva no posible",
@@ -1013,6 +1043,7 @@ const pt = {
     "events.soldOut": "Esgotado",
     "events.availableFrom": "Disponível a partir de {{date}}",
     "events.noAvailableDates": "Sem datas disponíveis",
+    "events.previewSectionTitle": "Especiais & próximas datas",
     // Event instances
     "instances.title": "Selecionar data",
     "instances.noAvailable": "Sem datas disponíveis",
@@ -1029,6 +1060,15 @@ const pt = {
     "nextEvents.noUpcomingMessage": "Atualmente não há datas disponíveis. Por favor, volte mais tarde ou contacte-nos diretamente.",
     "nextEvents.showAll": "Mostrar todos os eventos",
     "nextEvents.priceOnRequest": "Preço sob consulta",
+    // Specials view
+    "specials.title": "Ofertas especiais",
+    "specials.subtitle": "As nossas ofertas atuais num relance",
+    "specials.noSpecials": "Sem ofertas especiais",
+    "specials.noSpecialsMessage": "Atualmente não há ofertas especiais disponíveis. Por favor, volte mais tarde.",
+    "specials.save": "Poupe {{amount}}",
+    "specials.savePercent": "{{percent}}% de desconto",
+    "specials.spotsLeft": "{{count}} lugares disponíveis",
+    "specials.bookNow": "Reservar agora",
     // Booking form
     "booking.title": "Reserva - {{name}}",
     "booking.notPossible": "Reserva não possível",
@@ -1273,6 +1313,7 @@ const sv = {
     "events.soldOut": "Fullbokat",
     "events.availableFrom": "Lediga platser från {{date}}",
     "events.noAvailableDates": "Inga datum lediga",
+    "events.previewSectionTitle": "Specials & kommande datum",
     // Event instances
     "instances.title": "Välj datum",
     "instances.noAvailable": "Inga tillgängliga datum",
@@ -1289,6 +1330,15 @@ const sv = {
     "nextEvents.noUpcomingMessage": "Det finns för närvarande inga datum tillgängliga. Kom tillbaka senare eller kontakta oss direkt.",
     "nextEvents.showAll": "Visa alla evenemang",
     "nextEvents.priceOnRequest": "Pris på förfrågan",
+    // Specials view
+    "specials.title": "Specialerbjudanden",
+    "specials.subtitle": "Våra aktuella erbjudanden i korthet",
+    "specials.noSpecials": "Inga specialerbjudanden",
+    "specials.noSpecialsMessage": "Det finns för närvarande inga specialerbjudanden tillgängliga. Kom tillbaka senare.",
+    "specials.save": "Spara {{amount}}",
+    "specials.savePercent": "{{percent}}% rabatt",
+    "specials.spotsLeft": "{{count}} platser kvar",
+    "specials.bookNow": "Boka nu",
     // Booking form
     "booking.title": "Bokning - {{name}}",
     "booking.notPossible": "Bokning inte möjlig",
@@ -1694,129 +1744,143 @@ const resolveSemanticColor = (colorValue, fallbackValue) => {
     // If semantic resolution fails, use fallback or return the original value
     return fallbackValue || colorValue;
 };
-// Predefined themes (modern, accessibility-tested)
+// Predefined themes
 const themes = {
     // --- Light Themes ---
-    "light-fresh": {
-        highlight: "#00b1aa", // accent-strong
-        background: "#f8fdfe", // neutral-strong (background)
-        surface: "#ffffff", // card (pure white)
-        text: "#0e7490", // Turquoise 800
-        border: "#bae6fd", // Blue 200
-        success: "#38bdf8", // Blue 400
-        warning: "#fbbf24", // Amber 400
-        error: "#f43f5e", // Rose 500
-        borderRadius: "18px", // Very rounded corners
+    "teal-minimal": {
+        highlight: "#00b1aa",
+        background: "#f8fdfe",
+        surface: "#ffffff",
+        text: "#0e7490",
+        border: "#bae6fd",
+        success: "#38bdf8",
+        warning: "#fbbf24",
+        error: "#f43f5e",
+        borderRadius: "18px",
         fontFamily: "'Inter', system-ui, sans-serif",
     },
-    "light-elegant": {
-        highlight: "#8b5cf6", // Violet 500
-        background: "#f5f3ff", // Violet 50
-        surface: "#ffffff", // White
-        text: "#4c1d95", // Violet 900
-        border: "#ede9fe", // Violet 100
-        success: "#16a34a", // Green 600
-        warning: "#ca8a04", // Yellow 600
-        error: "#dc2626", // Red 600
-        borderRadius: "12px",
-        fontFamily: "'Playfair Display', serif",
+    "blue-business": {
+        highlight: "#2563eb",
+        background: "#f8fafc",
+        surface: "#ffffff",
+        text: "#0f172a",
+        border: "#cbd5e1",
+        success: "#059669",
+        warning: "#d97706",
+        error: "#b91c1c",
+        borderRadius: "6px",
+        fontFamily: "'Plus Jakarta Sans', system-ui, sans-serif",
     },
-    "light-vibrant": {
-        highlight: "#ed702d", // blue-500 - bright blue accent
-        background: "#1f2630", // slate-900 - dark background
-        surface: "#1f2630", // slate-800 - dark cards
-        text: "#f1f5f9", // slate-100 - light text
-        border: "#ed702d", // slate-700 - subtle borders
-        success: "#22c55e", // green-500
-        warning: "#eab308", // yellow-500
-        error: "#ef4444", // red-500
+    "orange-raw": {
+        highlight: "#ed702d",
+        background: "#1f2630",
+        surface: "#1f2630",
+        text: "#f1f5f9",
+        border: "#ed702d",
+        success: "#22c55e",
+        warning: "#eab308",
+        error: "#ef4444",
         borderRadius: "0px",
         fontFamily: "Inter, system-ui, sans-serif",
     },
-    "light-professional": {
-        highlight: "#2563eb", // Blue 600
-        background: "#f8fafc", // Slate 50
-        surface: "#ffffff", // White
-        text: "#1e293b", // Slate 800
-        border: "#e2e8f0", // Slate 200
-        success: "#059669", // Emerald 600
-        warning: "#d97706", // Amber 600
-        error: "#b91c1c", // Red 700
-        borderRadius: "4px",
-        fontFamily: "system-ui, -apple-system, sans-serif",
-    },
-    "dark-night": {
-        highlight: "#3b82f6", // blue-500 - bright blue accent
-        background: "#0f172a", // slate-900 - dark background
-        surface: "#1e293b", // slate-800 - dark cards
-        text: "#f1f5f9", // slate-100 - light text
-        border: "#334155", // slate-700 - subtle borders
-        success: "#22c55e", // green-500
-        warning: "#eab308", // yellow-500
-        error: "#ef4444", // red-500
-        borderRadius: "8px",
-        fontFamily: "Inter, system-ui, sans-serif",
-    },
-    "dark-modern": {
-        highlight: "#3b82f6", // blue-500 - bright blue accent
-        background: "#0f172a", // slate-900 - dark background
-        surface: "#1e293b", // slate-800 - dark cards
-        text: "#f1f5f9", // slate-100 - light text
-        border: "#334155", // slate-700 - subtle borders
-        success: "#22c55e", // green-500
-        warning: "#eab308", // yellow-500
-        error: "#ef4444", // red-500
-        borderRadius: "8px",
-        fontFamily: "Inter, system-ui, sans-serif",
+    // --- Dark Themes ---
+    "navy-night": {
+        highlight: "#60a5fa",
+        background: "#0b1120",
+        surface: "#111827",
+        text: "#e2e8f0",
+        border: "#1e3a5f",
+        success: "#34d399",
+        warning: "#fbbf24",
+        error: "#f87171",
+        borderRadius: "10px",
+        fontFamily: "'Outfit', system-ui, sans-serif",
     },
-    "dark-forest": {
-        highlight: "#34d399", // Emerald 400
-        background: "#05140d",
-        surface: "#062215",
-        text: "#d1fae5", // Emerald 100
-        border: "#043322",
-        success: "#4ade80", // Green 400
-        warning: "#facc15", // Yellow 400
-        error: "#f87171", // Red 400
+    "green-deep": {
+        highlight: "#34d399",
+        background: "#030d07",
+        surface: "#051a0e",
+        text: "#d1fae5",
+        border: "#064e20",
+        success: "#4ade80",
+        warning: "#facc15",
+        error: "#f87171",
         borderRadius: "12px",
-        fontFamily: "system-ui, -apple-system, sans-serif",
+        fontFamily: "'Instrument Sans', system-ui, sans-serif",
     },
-    "dark-matrix": {
-        highlight: "#33ff33",
+    "green-matrix": {
+        highlight: "#39ff14",
         background: "#000000",
-        surface: "#0a0a0a",
-        text: "#00ff00",
-        border: "#1a1a1a",
-        success: "#33ff33",
+        surface: "#060f06",
+        text: "#00ff41",
+        border: "#0d2b0d",
+        success: "#39ff14",
         warning: "#ffff00",
         error: "#ff3333",
         borderRadius: "0px",
-        fontFamily: "'Courier New', monospace",
+        fontFamily: "'Share Tech Mono', monospace",
     },
-    "dark-luxury": {
-        highlight: "#fde047", // Yellow 300
-        background: "#1c1917", // Stone 900
-        surface: "#292524", // Stone 800
-        text: "#fafaf9", // Stone 50
-        border: "#44403c", // Stone 700
-        success: "#a3e635", // Lime 400
-        warning: "#f59e0b", // Amber 500
-        error: "#fca5a5", // Red 300
+    "gold-luxury": {
+        highlight: "#fde047",
+        background: "#1c1917",
+        surface: "#292524",
+        text: "#fafaf9",
+        border: "#44403c",
+        success: "#a3e635",
+        warning: "#f59e0b",
+        error: "#fca5a5",
         borderRadius: "24px",
-        fontFamily: "'Cinzel', serif",
+        fontFamily: "'Bodoni Moda', serif",
     },
-    "dark-energetic": {
-        highlight: "#d946ef", // Fuchsia 500
-        background: "#2e1046",
-        surface: "#401561",
-        text: "#f3e8ff", // Purple 50
-        border: "#581c87", // Purple 900
-        success: "#4ade80", // Green 400
-        warning: "#facc15", // Yellow 400
-        error: "#f87171", // Red 400
+    "purple-electric": {
+        highlight: "#d946ef",
+        background: "#110820",
+        surface: "#1a0d30",
+        text: "#f3e8ff",
+        border: "#3b0764",
+        success: "#4ade80",
+        warning: "#facc15",
+        error: "#f87171",
         borderRadius: "14px",
         fontFamily: "'Geologica', sans-serif",
     },
+    "dark-neon-brutalism": {
+        highlight: "#00e5cc",
+        background: "#0e1420",
+        surface: "#0e1420",
+        text: "#e8eef5",
+        border: "#00e5cc",
+        success: "#00e5cc",
+        warning: "#ffe45e",
+        error: "#ff4d6d",
+        borderRadius: "4px",
+        fontFamily: "'JetBrains Mono', monospace",
+        buttonTextColor: "#0e1420",
+    },
+    "rose-editorial": {
+        highlight: "#be3455",
+        background: "#fdf8f5",
+        surface: "#ffffff",
+        text: "#1a0a0f",
+        border: "#f2d5db",
+        success: "#2d6a4f",
+        warning: "#b5451b",
+        error: "#9b1d20",
+        borderRadius: "0px",
+        fontFamily: "'Cormorant', serif",
+    },
+    "amber-retro": {
+        highlight: "#f59e0b",
+        background: "#1a1008",
+        surface: "#241a0a",
+        text: "#fef3c7",
+        border: "#78350f",
+        success: "#84cc16",
+        warning: "#f59e0b",
+        error: "#ef4444",
+        borderRadius: "6px",
+        fontFamily: "'Syne', sans-serif",
+    },
 };
 const StyleProvider = ({ config, children, }) => {
     // Track hydration state to prevent mismatches
@@ -1826,8 +1890,8 @@ const StyleProvider = ({ config, children, }) => {
     }, []);
     // PERFORMANCE OPTIMIZATION: Memoize style calculations
     const themedStyles = useMemo(() => {
-        const themeName = config.theme || "light-fresh";
-        const themeDefaults = themes[themeName] || themes["light-fresh"];
+        const themeName = config.theme || "teal-minimal";
+        const themeDefaults = themes[themeName] || themes["teal-minimal"];
         const getCSSValue = (value, fallback) => {
             if (!value)
                 return fallback;
@@ -1897,6 +1961,7 @@ const StyleProvider = ({ config, children, }) => {
             "--bw-surface-color": finalColors.surface,
             "--bw-text-color": finalColors.text,
             "--bw-text-muted": addOpacity(finalColors.text, 0.7),
+            "--bw-button-text-color": themeDefaults.buttonTextColor || "#ffffff",
             "--bw-border-color": finalColors.border,
             "--bw-success-color": finalColors.success,
             "--bw-warning-color": finalColors.warning,
@@ -1914,7 +1979,7 @@ const StyleProvider = ({ config, children, }) => {
             "--bw-highlight-muted": addOpacity(finalColors.highlight, 0.1),
             "--bw-highlight-subtle": addOpacity(finalColors.highlight, 0.05),
             "--bw-text-subtle": addOpacity(finalColors.text, 0.4),
-            colorScheme: themeName.startsWith("dark-") || themeName === "dark-night" ? "dark" : "light",
+            colorScheme: (["navy-night", "green-deep", "green-matrix", "gold-luxury", "purple-electric", "dark-neon-brutalism", "amber-retro", "orange-raw"].includes(themeName) || themeName.startsWith("dark-")) ? "dark" : "light",
         };
     }, [
         config.theme,
@@ -4468,6 +4533,7 @@ function DialogWrapper({ isOpen, onClose, children, maxWidth = "700px", classNam
                 "--bw-font-family": computedStyles.getPropertyValue("--bw-font-family").trim() || "system-ui, sans-serif",
                 "--bw-shadow-md": computedStyles.getPropertyValue("--bw-shadow-md").trim() ||
                     "0 4px 6px -1px rgba(0, 0, 0, 0.1)",
+                "--bw-button-text-color": computedStyles.getPropertyValue("--bw-button-text-color").trim() || "#ffffff",
             };
             setFallbackStyles(fallbacks);
         }
@@ -11177,11 +11243,13 @@ const buttonBase = {
     whiteSpace: "nowrap",
     border: "none",
 };
+// CSS class name for button hover effects
+const buttonClassName = "bw-button-hover";
 const buttonStyles = {
     primary: {
         ...buttonBase,
         backgroundColor: "var(--bw-highlight-color)",
-        color: "#ffffff",
+        color: "var(--bw-button-text-color, #ffffff)",
         border: "none",
     },
     secondary: {
@@ -12709,8 +12777,8 @@ function VoucherPurchaseCard({ config, minEventPrice, fallbackImages = [], onCli
     const displayPrice = !config.allowMonetaryVouchers && minEventPrice && minEventPrice > 0
         ? minEventPrice
         : minEventPrice && minEventPrice > 0
-            ? Math.min(config.monetaryPresets[0] || 2500, minEventPrice)
-            : config.monetaryPresets[0] || 2500;
+            ? Math.min(config.monetaryPresets[0] || 2000, minEventPrice)
+            : config.monetaryPresets[0] || 2000;
     const slideshowImages = useMemo(() => Array.from(new Set(fallbackImages.filter(Boolean))).slice(0, 5), [fallbackImages]);
     const hasSlideshow = !config.image && slideshowImages.length > 0;
     useEffect(() => {
@@ -13364,7 +13432,7 @@ function VoucherPurchaseForm({ config, voucherConfig, eventTypes, isOpen, onClos
                                                                 color: "var(--bw-text-muted)",
                                                                 fontFamily: "var(--bw-font-family)",
                                                             }, children: [t("voucher.for"), " ", recipientName] }))] })] }), jsx("div", { style: {
-                                                fontSize: "24px",
+                                                fontSize: "clamp(18px, 4vw, 22px)",
                                                 fontWeight: 700,
                                                 color: "var(--bw-highlight-color)",
                                                 fontFamily: "var(--bw-font-family)",
@@ -13635,6 +13703,20 @@ function VoucherAttachment({ onClick }) {
                 }, children: t("voucher.buyAsGift") })] }));
 }
 
+function VoucherIntegration({ config, voucherConfig, eventTypes, systemConfig, isFormOpen, isLoadingConfig, preselectedEventTypeId, voucherPurchaseResult, isSuccess, showStandaloneCard, onCardClick, onFormClose, onSuccess, onError, onSuccessModalClose, }) {
+    if (!voucherConfig?.enabled) {
+        return null;
+    }
+    return (jsxs(Fragment, { children: [showStandaloneCard && (jsx("div", { style: { padding: "0" }, children: jsx("div", { style: {
+                        display: "grid",
+                        gridTemplateColumns: "minmax(350px, 500px)",
+                        gap: "24px",
+                        justifyContent: "center",
+                    }, children: jsx(VoucherPurchaseCard, { config: voucherConfig, minEventPrice: eventTypes.length > 0
+                            ? Math.min(...eventTypes.map((et) => et.maxPrice))
+                            : undefined, fallbackImages: eventTypes.flatMap((eventType) => eventType.images || []), onClick: onCardClick, standalone: true }) }) })), jsx(VoucherPurchaseForm, { config: config, voucherConfig: voucherConfig, eventTypes: eventTypes, isOpen: isFormOpen, onClose: onFormClose, onSuccess: onSuccess, onError: onError, systemConfig: systemConfig, preselectedEventTypeId: preselectedEventTypeId, isLoadingEventTypes: isLoadingConfig }), isSuccess && voucherPurchaseResult && (jsx(VoucherSuccessModal, { isOpen: true, onClose: onSuccessModalClose, result: voucherPurchaseResult }))] }));
+}
+
 // Helper function to preprocess markdown for underline support
 const preprocessMarkdown = (markdown) => {
     // Convert double underscores to HTML underline tags for React Markdown
@@ -13654,8 +13736,48 @@ function formatDurationInfo(info, t) {
     const rest = formatted.slice(0, -1).join(", ");
     return `${t("duration.optionally")} ${rest} ${t("duration.or")} ${last} ${unitPlural}`;
 }
-function EventTypeSelection({ eventTypes, onEventTypeSelect, isLoading = false, skeletonCount = 4, showVoucherAttachment = false, onVoucherClick, }) {
+function InfoBadge({ text }) {
+    const [open, setOpen] = useState(false);
+    const ref = useRef(null);
+    return (jsxs("span", { ref: ref, onClick: (e) => { e.stopPropagation(); setOpen((v) => !v); }, style: {
+            position: "relative",
+            display: "inline-flex",
+            alignItems: "center",
+            justifyContent: "center",
+            width: "16px",
+            height: "16px",
+            borderRadius: "50%",
+            border: "1px solid var(--bw-highlight-color)",
+            color: "var(--bw-highlight-color)",
+            fontSize: "9px",
+            fontWeight: 700,
+            cursor: "pointer",
+            flexShrink: 0,
+            userSelect: "none",
+        }, children: ["i", open && (jsx("span", { style: {
+                    position: "absolute",
+                    bottom: "calc(100% + 6px)",
+                    right: 0,
+                    backgroundColor: "var(--bw-surface-color)",
+                    border: "1px solid var(--bw-border-color)",
+                    borderRadius: "var(--bw-border-radius-small)",
+                    boxShadow: "var(--bw-shadow-md)",
+                    padding: "6px 10px",
+                    fontSize: "14px",
+                    color: "var(--bw-text-color)",
+                    fontWeight: 400,
+                    whiteSpace: "normal",
+                    width: "160px",
+                    lineHeight: 1.4,
+                    zIndex: 100,
+                    textAlign: "left",
+                    pointerEvents: "none",
+                }, children: text }))] }));
+}
+function EventTypeSelection({ eventTypes, onEventTypeSelect, onInstancePreview, isLoading = false, skeletonCount = 4, showVoucherAttachment = false, onVoucherClick, }) {
     const t = useTranslations();
+    const { locale } = useLocale();
+    const timezone = useTimezone();
     // State for details dialog
     const [detailsDialogOpen, setDetailsDialogOpen] = useState(false);
     const [selectedEventTypeForDetails, setSelectedEventTypeForDetails] = useState(null);
@@ -13765,7 +13887,7 @@ function EventTypeSelection({ eventTypes, onEventTypeSelect, isLoading = false,
                                         display: "flex",
                                         flexDirection: "column",
                                         justifyContent: "space-between",
-                                        height: "400px",
+                                        height: "490px",
                                     }, children: [jsxs("div", { children: [jsx("h2", { className: "event-type-title", style: {
                                                         fontSize: "clamp(1.1rem, 2.5vw, 24px)",
                                                         fontWeight: 700,
@@ -13846,7 +13968,43 @@ function EventTypeSelection({ eventTypes, onEventTypeSelect, isLoading = false,
                                                                 color: "var(--bw-text-color)",
                                                                 fontFamily: "var(--bw-font-family)",
                                                                 textAlign: "right",
-                                                            }, children: jsxs("span", { children: [t("common.from"), " ", formatCurrency(eventType.minPrice)] }) })] }), jsxs("div", { style: {
+                                                            }, children: jsxs("span", { children: [t("common.from"), " ", formatCurrency(eventType.minPrice)] }) })] }), (() => {
+                                                    const preview = eventType.cardPreview ?? [];
+                                                    return (jsxs("div", { style: {
+                                                            marginTop: "12px",
+                                                            borderTop: "1px solid var(--bw-border-color)",
+                                                            paddingTop: "8px",
+                                                            marginBottom: "16px",
+                                                        }, children: [jsx("div", { style: {
+                                                                    fontSize: "11px",
+                                                                    fontWeight: 700,
+                                                                    color: "var(--bw-text-muted)",
+                                                                    textTransform: "uppercase",
+                                                                    letterSpacing: "0.05em",
+                                                                    marginBottom: "4px",
+                                                                }, children: t("events.previewSectionTitle") }), jsx("div", { style: { height: "102px" }, children: Array.from({ length: 3 }).map((_, i) => {
+                                                                    const item = preview[i];
+                                                                    if (!item)
+                                                                        return jsx("div", { style: { height: "34px" } }, i);
+                                                                    const hasDiscount = item.basePrice > 0 && item.price < item.basePrice;
+                                                                    return (jsxs("div", { onClick: (e) => { e.stopPropagation(); onInstancePreview?.(item.id, eventType.id); }, onMouseEnter: (e) => { if (onInstancePreview)
+                                                                            e.currentTarget.style.backgroundColor = "var(--bw-border-color)"; }, onMouseLeave: (e) => { e.currentTarget.style.backgroundColor = "transparent"; }, style: {
+                                                                            height: "34px",
+                                                                            display: "grid",
+                                                                            gridTemplateColumns: "auto 1fr auto 20px",
+                                                                            alignItems: "center",
+                                                                            gap: "8px",
+                                                                            width: "100%",
+                                                                            fontSize: "13px",
+                                                                            color: "var(--bw-text-muted)",
+                                                                            cursor: onInstancePreview ? "pointer" : "default",
+                                                                            borderRadius: "4px",
+                                                                            padding: "0 2px",
+                                                                            transition: "background 0.15s",
+                                                                            boxSizing: "border-box",
+                                                                        }, children: [jsxs("span", { style: { whiteSpace: "nowrap", display: "flex", alignItems: "center", gap: "3px" }, children: [item.isSpecial && (jsx("span", { style: { color: "var(--bw-highlight-color)", fontSize: "11px", lineHeight: 1 }, children: "\u2605" })), formatWeekday(item.startTime, timezone, locale), " ", formatDate(item.startTime, timezone, locale)] }), jsx("span", { style: { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", opacity: 0.75 }, children: item.name }), jsxs("span", { style: { display: "flex", alignItems: "center", gap: "4px", whiteSpace: "nowrap" }, children: [hasDiscount && (jsx("span", { style: { textDecoration: "line-through", opacity: 0.55, fontSize: "11px" }, children: formatCurrency(item.basePrice) })), jsx("span", { style: { fontWeight: 700, color: item.isSpecial ? "var(--bw-highlight-color)" : "var(--bw-text-color)" }, children: formatCurrency(item.price) })] }), item.specialDescription ? (jsx(InfoBadge, { text: item.specialDescription })) : (jsx("span", {}))] }, item.id));
+                                                                }) })] }));
+                                                })(), jsxs("div", { style: {
                                                         display: "flex",
                                                         justifyContent: "flex-end",
                                                         alignItems: "center",
@@ -13861,7 +14019,6 @@ function EventTypeSelection({ eventTypes, onEventTypeSelect, isLoading = false,
                                                                 backgroundColor: "var(--bw-surface-color)",
                                                                 padding: "12px",
                                                                 borderRadius: "var(--bw-border-radius)",
-                                                                fontSize: "clamp(0.8rem, 2vw, 16px)",
                                                                 fontWeight: 600,
                                                                 fontFamily: "var(--bw-font-family)",
                                                                 display: "flex",
@@ -13874,7 +14031,7 @@ function EventTypeSelection({ eventTypes, onEventTypeSelect, isLoading = false,
                                                             }, children: t("button.moreDetails") })), isAvailable && (jsxs("div", { style: {
                                                                 backgroundColor: "var(--bw-highlight-color)",
                                                                 color: "var(--bw-surface-color)",
-                                                                padding: "12px 24px",
+                                                                padding: "12px 14px",
                                                                 borderRadius: "var(--bw-border-radius)",
                                                                 fontSize: "clamp(1rem, 2vw, 16px)",
                                                                 fontWeight: 600,
@@ -14532,6 +14689,172 @@ function NextEventsPreview({ events, onEventSelect, onShowAll, showAllButtonText
                                 }, children: "\u27F3" }), t("common.loading")] })) : (showAllButtonText) }) }))] }));
 }
 
+function SpecialsView({ specials, onEventSelect, isLoading = false, showSavingsAmount = true, showSavingsPercent = false, emptyStateText, isLoadingEventDetails = false, }) {
+    const t = useTranslations();
+    const { locale } = useLocale();
+    const timezone = useTimezone();
+    const [selectedId, setSelectedId] = useState(null);
+    const handleSelect = (id) => {
+        setSelectedId(id);
+        onEventSelect(id);
+    };
+    if (isLoading) {
+        return jsx(NextEventsSkeleton, { count: 3 });
+    }
+    if (specials.length === 0) {
+        return (jsx("div", { style: { maxWidth: "500px", margin: "0 auto", padding: "16px" }, children: jsxs("div", { style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    textAlign: "center",
+                    backgroundColor: "var(--bw-surface-color)",
+                    border: "1px solid var(--bw-border-color)",
+                    borderRadius: "var(--bw-border-radius)",
+                    padding: "24px",
+                    fontFamily: "var(--bw-font-family)",
+                    minHeight: "300px",
+                }, children: [jsx("div", { style: {
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            borderRadius: "50%",
+                            width: "64px",
+                            height: "64px",
+                            backgroundColor: "var(--bw-highlight-color)",
+                            marginBottom: "16px",
+                            fontSize: "32px",
+                            color: "#ffffff",
+                            opacity: 0.8,
+                        }, children: "\uD83C\uDFF7\uFE0F" }), jsx("h3", { style: {
+                            fontWeight: 600,
+                            margin: "0 0 8px 0",
+                            fontSize: "20px",
+                            color: "var(--bw-text-color)",
+                            fontFamily: "var(--bw-font-family)",
+                        }, children: t("specials.noSpecials") }), jsx("p", { style: {
+                            margin: 0,
+                            color: "var(--bw-text-muted)",
+                            fontSize: "16px",
+                            lineHeight: 1.6,
+                            fontFamily: "var(--bw-font-family)",
+                            maxWidth: "400px",
+                        }, children: emptyStateText ?? t("specials.noSpecialsMessage") })] }) }));
+    }
+    return (jsxs("div", { style: {
+            maxWidth: "500px",
+            margin: "0 auto",
+            padding: "16px",
+            fontFamily: "var(--bw-font-family)",
+        }, children: [jsxs("div", { style: { textAlign: "center", marginBottom: "24px" }, children: [jsx("h2", { style: {
+                            fontWeight: 600,
+                            margin: "0 0 8px 0",
+                            fontSize: "18px",
+                            color: "var(--bw-text-color)",
+                            fontFamily: "var(--bw-font-family)",
+                        }, children: t("specials.title") }), jsx("p", { style: {
+                            margin: 0,
+                            fontSize: "16px",
+                            color: "var(--bw-text-muted)",
+                            fontFamily: "var(--bw-font-family)",
+                        }, children: t("specials.subtitle") })] }), jsx("div", { style: { display: "flex", flexDirection: "column", gap: "12px" }, children: specials.map((special) => {
+                    const isFullyBooked = special.availableSpots === 0;
+                    const isDisabled = isFullyBooked || !special.bookingOpen;
+                    const hasDiscount = special.basePrice > 0 && special.price < special.basePrice;
+                    return (jsxs("div", { style: {
+                            position: "relative",
+                            backgroundColor: "var(--bw-surface-color)",
+                            borderRadius: "var(--bw-border-radius)",
+                            border: "1px solid var(--bw-highlight-color)",
+                            overflow: "hidden",
+                            opacity: isDisabled ? 0.5 : 1,
+                            cursor: isDisabled ? "not-allowed" : "pointer",
+                            transition: "all 0.2s ease",
+                        }, onClick: () => {
+                            if (!isDisabled)
+                                handleSelect(special.id);
+                        }, children: [selectedId === special.id && isLoadingEventDetails && (jsx("div", { style: {
+                                    position: "absolute",
+                                    inset: 0,
+                                    display: "flex",
+                                    alignItems: "center",
+                                    justifyContent: "center",
+                                    backgroundColor: "rgba(15, 23, 42, 0.8)",
+                                    borderRadius: "var(--bw-border-radius)",
+                                    zIndex: 10,
+                                }, children: jsx("div", { style: { fontSize: "32px", color: "var(--bw-highlight-color)", animation: "spin 1s linear infinite" }, children: "\u27F3" }) })), jsxs("div", { style: { display: "flex", gap: "12px", padding: "12px" }, children: [special.images.length > 0 && (jsx("div", { style: {
+                                            flexShrink: 0,
+                                            width: "72px",
+                                            height: "72px",
+                                            borderRadius: "var(--bw-border-radius-small)",
+                                            overflow: "hidden",
+                                        }, children: jsx("img", { src: special.images[0], alt: special.eventTypeName, style: { width: "100%", height: "100%", objectFit: "cover" } }) })), jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [jsx("div", { style: { marginBottom: "4px" }, children: jsx("span", { style: {
+                                                        fontSize: "11px",
+                                                        fontWeight: 600,
+                                                        color: "var(--bw-text-muted)",
+                                                        textTransform: "uppercase",
+                                                        letterSpacing: "0.05em",
+                                                    }, children: special.categoryName }) }), jsx("h4", { style: {
+                                                    margin: "0 0 2px 0",
+                                                    fontSize: "15px",
+                                                    fontWeight: 600,
+                                                    color: "var(--bw-text-color)",
+                                                    lineHeight: 1.3,
+                                                    overflow: "hidden",
+                                                    textOverflow: "ellipsis",
+                                                    whiteSpace: "nowrap",
+                                                }, children: special.eventTypeName }), jsxs("div", { style: {
+                                                    fontSize: "13px",
+                                                    fontWeight: 500,
+                                                    color: "var(--bw-highlight-color)",
+                                                    marginBottom: "2px",
+                                                    overflow: "hidden",
+                                                    textOverflow: "ellipsis",
+                                                    whiteSpace: "nowrap",
+                                                }, children: ["\u2605 ", special.name] }), special.specialDescription && (jsx("div", { style: {
+                                                    fontSize: "12px",
+                                                    color: "var(--bw-text-muted)",
+                                                    marginBottom: "6px",
+                                                    lineHeight: 1.4,
+                                                }, children: special.specialDescription })), jsxs("div", { style: { fontSize: "13px", color: "var(--bw-text-muted)", marginBottom: "8px" }, children: [formatWeekday(special.startTime, timezone, locale), ",", " ", formatDate(special.startTime, timezone, locale)] }), jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px", flexWrap: "wrap" }, children: [hasDiscount && (jsx("span", { style: {
+                                                            fontSize: "13px",
+                                                            color: "var(--bw-text-muted)",
+                                                            textDecoration: "line-through",
+                                                        }, children: formatCurrency(special.basePrice) })), jsx("span", { style: {
+                                                            fontSize: "16px",
+                                                            fontWeight: 700,
+                                                            color: "var(--bw-highlight-color)",
+                                                        }, children: formatCurrency(special.price) }), hasDiscount && showSavingsAmount && (jsx("span", { style: {
+                                                            fontSize: "12px",
+                                                            fontWeight: 600,
+                                                            color: "#ffffff",
+                                                            backgroundColor: "var(--bw-success-color, #22c55e)",
+                                                            borderRadius: "4px",
+                                                            padding: "2px 6px",
+                                                        }, children: t("specials.save").replace("{{amount}}", formatCurrency(special.savings)) })), hasDiscount && showSavingsPercent && (jsx("span", { style: {
+                                                            fontSize: "12px",
+                                                            fontWeight: 600,
+                                                            color: "#ffffff",
+                                                            backgroundColor: "var(--bw-success-color, #22c55e)",
+                                                            borderRadius: "4px",
+                                                            padding: "2px 6px",
+                                                        }, children: t("specials.savePercent").replace("{{percent}}", String(special.savingsPercent)) }))] })] })] }), jsxs("div", { style: {
+                                    borderTop: "1px solid var(--bw-border-color)",
+                                    padding: "8px 12px",
+                                    display: "flex",
+                                    justifyContent: "space-between",
+                                    alignItems: "center",
+                                    backgroundColor: "var(--bw-background-color)",
+                                }, children: [jsx("span", { style: { fontSize: "12px", color: "var(--bw-text-muted)" }, children: isFullyBooked
+                                            ? t("common.fullyBooked")
+                                            : t("specials.spotsLeft").replace("{{count}}", String(special.availableSpots)) }), jsxs("span", { style: {
+                                            fontSize: "13px",
+                                            fontWeight: 600,
+                                            color: "var(--bw-highlight-color)",
+                                        }, children: [t("specials.bookNow"), " \u2192"] })] })] }, special.id));
+                }) })] }));
+}
+
 const getThemeConfig = (theme = "generic") => {
     switch (theme) {
         case "christmas":
@@ -14791,8 +15114,8 @@ const cardDisabledStyles = {
 };
 const checkboxContainerStyles = {
     position: "absolute",
-    top: "12px",
-    right: "12px",
+    bottom: "12px",
+    left: "12px",
     zIndex: 1,
 };
 const checkboxInnerStyles = {
@@ -14887,6 +15210,7 @@ const priceContainerStyles = {
     alignItems: "flex-end",
     marginTop: "8px",
     paddingTop: "8px",
+    paddingBottom: "0px",
     borderTop: "1px solid var(--bw-border-color)",
 };
 const pricePerPersonStyles = {
@@ -14978,7 +15302,7 @@ function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, is
     };
     const selectedTotal = calculateTotal();
     const selectedCount = selectedUpsells.length;
-    const footerContent = (jsxs(Fragment, { children: [jsx("button", { type: "button", onClick: onBack, style: mergeStyles(buttonStyles.secondary, buttonStyles.fullWidth), children: t("common.back") }), jsx("button", { type: "button", onClick: onContinue, style: mergeStyles(buttonStyles.primary, buttonStyles.fullWidth), children: selectedCount === 0 ? t("button.continueWithout") : t("button.continue") })] }));
+    const footerContent = (jsxs(Fragment, { children: [jsx("button", { type: "button", onClick: onBack, style: mergeStyles(buttonStyles.secondary, buttonStyles.fullWidth), className: buttonClassName, children: t("common.back") }), jsx("button", { type: "button", onClick: onContinue, style: mergeStyles(buttonStyles.primary, buttonStyles.fullWidth), className: buttonClassName, children: selectedCount === 0 ? t("button.continueWithout") : t("button.continue") })] }));
     return (jsx(Sidebar, { isOpen: isOpen, onClose: onClose, title: t("upsells.title"), footer: footerContent, children: jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%", padding: "16px 16px" }, children: [isLoading && (jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "12px", padding: "40px 20px", ...textStyles.muted }, children: [spinner(), jsx("span", { children: t("upsells.loading") })] })), !isLoading && upsells.length === 0 && (jsx("div", { style: { textAlign: "center", padding: "40px 20px", ...textStyles.muted }, children: jsx("p", { children: t("upsells.noExtras") }) })), !isLoading && upsells.length > 0 && (jsx("div", { style: { display: "flex", flexDirection: "column", gap: "12px", flex: 1, overflowY: "auto", paddingBottom: "16px" }, children: upsells.map((upsell) => (jsx(UpsellCard, { upsell: upsell, isSelected: isSelected(upsell.id), participantCount: participantCount, onSelect: () => selectUpsell(upsell.id) }, upsell.id))) })), selectedCount > 0 && (jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: "16px", paddingBottom: "16px", paddingTop: "16px", borderTop: "1px solid var(--bw-border-color)", fontSize: "14px" }, children: [jsx("span", { style: textStyles.muted, children: selectedCount === 1 ? t("upsells.selected", { count: selectedCount }) : t("upsells.selectedPlural", { count: selectedCount }) }), jsxs("span", { style: { fontWeight: 600, color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+", formatCurrency(selectedTotal)] })] }))] }) }));
 }
 
@@ -15017,7 +15341,6 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
     // Detect single event type mode and direct instance mode
     const isSingleEventTypeMode = !!config.eventTypeId && !config.categoryId && !config.eventTypeIds;
     const isDirectInstanceMode = !!config.eventInstanceId;
-    const isMultiEventListingContext = Boolean(config.categoryId || config.eventTypeIds?.length);
     // Voucher card integration logic:
     // - For standalone voucher mode: always show voucher card (it's the main content)
     // - For event listings (single or multi): show by default unless explicitly disabled
@@ -15027,6 +15350,8 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         : (config.voucherIntegration ?? (hasEventSelection && !isDirectInstanceMode));
     // Selection flow state
     const [currentStep, setCurrentStep] = useState("eventTypes");
+    // Tracks where to return when closing the booking form
+    const bookingReturnStep = useRef("eventInstances");
     const [eventTypes, setEventTypes] = useState([]);
     const [selectedEventType, setSelectedEventType] = useState(null);
     const [eventInstances, setEventInstances] = useState([]);
@@ -15039,6 +15364,9 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
     // State for upcoming events (next-events view mode)
     const [upcomingEvents, setUpcomingEvents] = useState([]);
     const [showingPreview, setShowingPreview] = useState(true);
+    // State for specials view mode
+    const [specials, setSpecials] = useState([]);
+    const [isLoadingSpecials, setIsLoadingSpecials] = useState(false);
     // New: sidebar open state for single event type mode
     const [sidebarOpen, setSidebarOpen] = useState(false);
     // Booking flow state
@@ -15074,8 +15402,9 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         // Load voucher config if:
         // - Explicit voucher params are set
         // - OR voucherIntegration is explicitly set (even to true/false)
-        // - OR it's a multi-event listing context (may want to show voucher card)
-        if (!isVoucherModeRequested && !isMultiEventListingContext)
+        // - OR it's an event listing context (single or multi) that may want to show voucher card
+        const shouldLoadVoucherConfig = isVoucherModeRequested || hasEventSelection;
+        if (!shouldLoadVoucherConfig)
             return;
         setIsLoadingVoucherConfig(true);
         try {
@@ -15128,10 +15457,10 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                 const mergedConfig = {
                     enabled: true,
                     monetaryPresets: allowMonetaryVouchers
-                        ? (presetFromValue ?? serverConfig.monetaryPresets ?? [2500, 5000, 10000, 15000, 20000])
+                        ? (presetFromValue ?? serverConfig.monetaryPresets ?? [2000, 5000, 10000, 15000, 20000, 25000, 30000, 40000, 50000])
                         : [],
-                    minAmount: serverConfig.minAmount || 1000,
-                    maxAmount: serverConfig.maxAmount || 100000,
+                    minAmount: serverConfig.minAmount || 500,
+                    maxAmount: serverConfig.maxAmount || 1000000,
                     allowMonetaryVouchers,
                     allowEventVouchers,
                     title: serverConfig.title,
@@ -15166,8 +15495,8 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         const initializeWidget = async () => {
             try {
                 setIsLoading(true);
-                // Load voucher config in parallel if voucher mode is requested or it's a multi-event context
-                if (isVoucherModeRequested || isMultiEventListingContext) {
+                // Load voucher config in parallel if voucher mode is requested or there's event selection
+                if (isVoucherModeRequested || hasEventSelection) {
                     void loadVoucherConfig();
                 }
                 // Direct instance selection (old behavior)
@@ -15188,6 +15517,11 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                     await loadUpcomingEvents();
                     return;
                 }
+                // Specials view mode: load special offers
+                if (viewMode === "specials") {
+                    await loadSpecials();
+                    return;
+                }
                 // Single event type mode: load event type and instances, but don't open sidebar yet
                 if (isSingleEventTypeMode) {
                     await loadEventTypes();
@@ -15213,7 +15547,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
             }
         };
         void initializeWidget();
-    }, [config, isVoucherModeRequested, hasEventSelection, isStandaloneVoucherMode, isMultiEventListingContext]);
+    }, [config, isVoucherModeRequested, hasEventSelection, isStandaloneVoucherMode]);
     // Re-fetch translated content when locale changes (skip initial mount)
     const prevLocaleRef = useRef(locale);
     useEffect(() => {
@@ -15411,6 +15745,45 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
             setError(data.error || t("error.loadUpcomingEvents"));
         }
     };
+    const loadSpecials = async () => {
+        setIsLoadingSpecials(true);
+        const specialsSettings = config.specialsSettings ?? {};
+        const requestBody = {
+            organizationId: config.organizationId,
+            limit: specialsSettings.count ?? 20,
+        };
+        if (config.categoryId) {
+            requestBody.categoryId = config.categoryId;
+        }
+        else if (config.eventTypeIds) {
+            requestBody.eventTypeIds = config.eventTypeIds;
+        }
+        else if (config.eventTypeId) {
+            requestBody.eventTypeId = config.eventTypeId;
+        }
+        try {
+            const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/specials"), {
+                method: "POST",
+                headers: createApiHeaders(config, locale),
+                body: JSON.stringify(requestBody),
+            });
+            const data = await response.json();
+            if (response.ok) {
+                const wl = extractWidgetLanguagePayload(data);
+                if (wl) {
+                    onWidgetLanguage?.(wl);
+                    onTimezone?.(wl.timezone);
+                }
+                setSpecials(data.specials || []);
+            }
+            else {
+                setError(data.error || t("error.loadUpcomingEvents"));
+            }
+        }
+        finally {
+            setIsLoadingSpecials(false);
+        }
+    };
     const loadEventInstances = async (eventTypeId) => {
         const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/event-instances"), {
             method: "POST",
@@ -15595,6 +15968,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
     // Event instance selection handlers
     const handleEventInstanceSelect = async (eventInstance) => {
         setSelectedEventInstance(eventInstance);
+        bookingReturnStep.current = "eventInstances";
         // Set default participant count for upsell calculations
         const defaultParticipantCount = 1;
         setTempParticipantCount(defaultParticipantCount);
@@ -15607,7 +15981,14 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                 if (availableUpsells.length > 0) {
                     // Show upsells step
                     setUpsells(availableUpsells);
-                    setSelectedUpsells([]);
+                    // Pre-select default-checked upsells
+                    const defaultSelections = availableUpsells
+                        .filter((upsell) => upsell.defaultChecked && upsell.available)
+                        .map((upsell) => ({
+                        upsellPackageId: upsell.id,
+                        quantity: defaultParticipantCount,
+                    }));
+                    setSelectedUpsells(defaultSelections);
                     setCurrentStep("upsells");
                     setIsLoadingUpsells(false);
                     return; // Don't proceed to booking yet
@@ -15638,7 +16019,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         setEventInstances([]);
     };
     const handleBackToEventInstances = () => {
-        setCurrentStep("eventInstances");
+        setCurrentStep(bookingReturnStep.current);
         setSelectedEventInstance(null);
         setEventDetails(null);
     };
@@ -15672,8 +16053,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         }
     };
     const handleUpsellsBack = () => {
-        // Go back to event instance selection
-        setCurrentStep("eventInstances");
+        setCurrentStep(bookingReturnStep.current);
         setSelectedUpsells([]);
         setUpsells([]);
     };
@@ -15708,10 +16088,36 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         setError(errorMessage);
         config.onError?.(errorMessage);
     };
-    const handleUpcomingEventSelect = async (eventInstanceId) => {
+    const handleUpcomingEventSelect = async (eventInstanceId, eventTypeId) => {
+        // Resolve the event type — may come from card preview (eventTypeId provided) or
+        // from the next-events list where selectedEventType is already set
+        const resolvedEventType = eventTypeId != null
+            ? (eventTypes.find((et) => et.id === eventTypeId) ?? selectedEventType)
+            : selectedEventType;
+        if (resolvedEventType && resolvedEventType !== selectedEventType) {
+            setSelectedEventType(resolvedEventType);
+        }
+        // Check if this is coming from a card preview (eventTypeId was provided)
+        // In that case, we need to load event instances so back navigation works properly
+        const isFromCardPreview = eventTypeId != null;
+        if (isFromCardPreview && resolvedEventType) {
+            // Load event instances in background so back navigation shows instances
+            setShouldRenderInstanceSelection(true);
+            void loadEventInstances(resolvedEventType.id);
+            // Record that we should return to instance selection (not event types)
+            bookingReturnStep.current = "eventInstances";
+        }
+        else {
+            // Record where to return when the booking form is closed
+            bookingReturnStep.current = currentStep === "eventInstances" ? "eventInstances" : "eventTypes";
+        }
+        // First try to find the event in upcomingEvents (for next-events view mode)
         const upcomingEvent = upcomingEvents.find((event) => event.id === eventInstanceId);
-        if (upcomingEvent) {
-            const eventInstance = {
+        // If not found in upcomingEvents, try to find in card preview items
+        const cardPreviewItem = !upcomingEvent && resolvedEventType?.cardPreview?.find((item) => item.id === eventInstanceId);
+        // Build the event instance from either source
+        const eventInstance = upcomingEvent
+            ? {
                 id: upcomingEvent.id,
                 name: upcomingEvent.name,
                 startTime: upcomingEvent.startTime,
@@ -15725,13 +16131,63 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                 bookingOpen: upcomingEvent.bookingOpen,
                 ...(upcomingEvent.deposit !== undefined && { deposit: upcomingEvent.deposit }),
                 ...(upcomingEvent.notes !== undefined && { notes: upcomingEvent.notes }),
-            };
+            }
+            : cardPreviewItem
+                ? {
+                    id: cardPreviewItem.id,
+                    name: cardPreviewItem.name,
+                    startTime: cardPreviewItem.startTime,
+                    endTime: cardPreviewItem.startTime,
+                    price: cardPreviewItem.price,
+                    maxParticipants: cardPreviewItem.availableSpots + 1,
+                    participantCount: 1,
+                    availableSpots: cardPreviewItem.availableSpots,
+                    durationDays: 1,
+                    durationPerDay: 1,
+                    bookingOpen: true,
+                }
+                : null;
+        if (eventInstance) {
             setSelectedEventInstance(eventInstance);
         }
+        setError(null);
+        // Check for upsells before going to booking (same as handleEventInstanceSelect)
+        const eventTypeForUpsells = resolvedEventType;
+        if (eventTypeForUpsells) {
+            const defaultParticipantCount = 1;
+            setTempParticipantCount(defaultParticipantCount);
+            setIsLoadingUpsells(true);
+            setShouldRenderUpsells(true);
+            try {
+                const availableUpsells = await loadUpsells(eventTypeForUpsells.id, eventInstanceId, defaultParticipantCount);
+                if (availableUpsells.length > 0) {
+                    setUpsells(availableUpsells);
+                    // Pre-select default-checked upsells
+                    const defaultSelections = availableUpsells
+                        .filter((upsell) => upsell.defaultChecked && upsell.available)
+                        .map((upsell) => ({
+                        upsellPackageId: upsell.id,
+                        quantity: defaultParticipantCount,
+                    }));
+                    setSelectedUpsells(defaultSelections);
+                    setCurrentStep("upsells");
+                    setIsLoadingUpsells(false);
+                    // Load event details in background for when user continues past upsells
+                    void loadEventDetails(eventInstanceId);
+                    return;
+                }
+            }
+            catch (err) {
+                console.error("Error loading upsells:", err);
+            }
+            finally {
+                setIsLoadingUpsells(false);
+            }
+        }
+        // No upsells — go directly to booking
         setCurrentStep("booking");
         setShouldRenderBookingForm(true);
         setIsLoadingEventDetails(true);
-        setError(null);
         try {
             await loadEventDetails(eventInstanceId);
         }
@@ -15888,6 +16344,31 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 window.history.replaceState({}, "", url.toString());
                             }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
     }
+    if (viewMode === "specials" && showingPreview) {
+        return (jsxs(StyleProvider, { config: config, children: [jsxs("div", { ref: setWidgetContainerRef, children: [jsx(SpecialsView, { specials: specials, onEventSelect: handleUpcomingEventSelect, isLoading: isLoadingSpecials, showSavingsAmount: config.specialsSettings?.showSavingsAmount ?? true, showSavingsPercent: config.specialsSettings?.showSavingsPercent ?? false, emptyStateText: config.specialsSettings?.emptyStateText }), shouldRenderBookingForm && eventDetails && (jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: () => {
+                                setCurrentStep("eventTypes");
+                                setShowingPreview(true);
+                                setEventDetails(null);
+                            }, onBackToEventTypes: () => {
+                                setCurrentStep("eventTypes");
+                                setShowingPreview(true);
+                                setEventDetails(null);
+                            }, selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: () => {
+                                setCurrentStep("eventTypes");
+                                setShowingPreview(true);
+                                setEventDetails(null);
+                            }, systemConfig: systemConfig, selectedUpsells: selectedUpsells, upsells: upsells })), jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
+                                setIsSuccess(false);
+                                setCurrentStep("eventTypes");
+                                setShowingPreview(true);
+                                setSuccessPaymentId(null);
+                                setShouldRenderInstanceSelection(false);
+                                setShouldRenderUpsells(false);
+                                setShouldRenderBookingForm(false);
+                                setSelectedUpsells([]);
+                                setUpsells([]);
+                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+    }
     if (viewMode === "next-events" && !showingPreview && currentStep === "eventInstances") {
         return (jsxs(StyleProvider, { config: config, children: [jsxs("div", { ref: setWidgetContainerRef, children: [shouldRenderInstanceSelection && (jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => {
                                 setShowingPreview(true);
@@ -15958,14 +16439,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                             }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
     }
     // Cards mode (default) - show event type selection with optional voucher card
-    const cardsView = (jsxs(Fragment, { children: [hasEventSelection && (jsx(EventTypeSelection, { eventTypes: eventTypes, onEventTypeSelect: handleEventTypeSelect, isLoading: isLoading, skeletonCount: getSkeletonCount(), showVoucherAttachment: Boolean(voucherConfig?.enabled && voucherCardIntegrationEnabled && !isStandaloneVoucherMode), onVoucherClick: handleVoucherAttachmentClick })), voucherConfig?.enabled && voucherCardIntegrationEnabled && isStandaloneVoucherMode && (jsx("div", { style: { padding: hasEventSelection ? "0 0 24px 0" : "0" }, children: jsx("div", { style: {
-                        display: "grid",
-                        gridTemplateColumns: "minmax(350px, 500px)",
-                        gap: "24px",
-                        justifyContent: "center",
-                    }, children: jsx(VoucherPurchaseCard, { config: voucherConfig, minEventPrice: voucherEventTypes.length > 0
-                            ? Math.min(...voucherEventTypes.map((et) => et.maxPrice))
-                            : undefined, fallbackImages: voucherEventTypes.flatMap((eventType) => eventType.images || []), onClick: handleVoucherCardClick, standalone: true }) }) })), isStandaloneVoucherMode && isLoading && !voucherConfig && (jsx("div", { style: { padding: "24px", textAlign: "center" }, children: jsx("div", { style: {
+    const cardsView = (jsxs(Fragment, { children: [hasEventSelection && (jsx(EventTypeSelection, { eventTypes: eventTypes, onEventTypeSelect: handleEventTypeSelect, onInstancePreview: (instanceId, eventTypeId) => void handleUpcomingEventSelect(instanceId, eventTypeId), isLoading: isLoading, skeletonCount: getSkeletonCount(), showVoucherAttachment: Boolean(voucherConfig?.enabled && voucherCardIntegrationEnabled && !isStandaloneVoucherMode), onVoucherClick: handleVoucherAttachmentClick })), isStandaloneVoucherMode && (jsx(VoucherIntegration, { config: config, voucherConfig: voucherConfig, eventTypes: voucherEventTypes, systemConfig: systemConfig, isFormOpen: false, isLoadingConfig: isLoadingVoucherConfig, preselectedEventTypeId: null, voucherPurchaseResult: null, isSuccess: false, showStandaloneCard: Boolean(voucherConfig?.enabled && voucherCardIntegrationEnabled), onCardClick: handleVoucherCardClick, onFormClose: handleVoucherFormClose, onSuccess: handleVoucherSuccess, onError: handleVoucherError, onSuccessModalClose: () => { } })), isStandaloneVoucherMode && isLoading && !voucherConfig && (jsx("div", { style: { padding: "24px", textAlign: "center" }, children: jsx("div", { style: {
                         display: "inline-block",
                         width: "32px",
                         height: "32px",
@@ -16018,19 +16492,17 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                             url.searchParams.delete("mollie_payment_id");
                             url.searchParams.delete("mollie_status");
                             window.history.replaceState({}, "", url.toString());
-                        }, config: config, onError: setError, paymentIntentId: successPaymentId }), isSuccess && voucherPurchaseResult && (jsx(VoucherSuccessModal, { isOpen: true, onClose: () => {
+                        }, config: config, onError: setError, paymentIntentId: successPaymentId }), jsx(VoucherIntegration, { config: config, voucherConfig: voucherConfig, eventTypes: voucherEventTypes, systemConfig: systemConfig, isFormOpen: isVoucherFormOpen, isLoadingConfig: isLoadingVoucherConfig, preselectedEventTypeId: preselectedVoucherEventTypeId, voucherPurchaseResult: voucherPurchaseResult, isSuccess: isSuccess, showStandaloneCard: false, onCardClick: handleVoucherCardClick, onFormClose: handleVoucherFormClose, onSuccess: handleVoucherSuccess, onError: handleVoucherError, onSuccessModalClose: () => {
                             setIsSuccess(false);
                             setVoucherPurchaseResult(null);
                             const url = new URL(window.location.href);
-                            // Clean up Stripe params
                             url.searchParams.delete("payment_intent");
                             url.searchParams.delete("payment_intent_client_secret");
                             url.searchParams.delete("redirect_status");
-                            // Clean up Mollie params
                             url.searchParams.delete("mollie_payment_id");
                             url.searchParams.delete("mollie_status");
                             window.history.replaceState({}, "", url.toString());
-                        }, result: voucherPurchaseResult })), voucherConfig?.enabled && (jsx(VoucherPurchaseForm, { config: config, voucherConfig: voucherConfig, eventTypes: voucherEventTypes, isOpen: isVoucherFormOpen, onClose: handleVoucherFormClose, onSuccess: handleVoucherSuccess, onError: handleVoucherError, systemConfig: systemConfig, preselectedEventTypeId: preselectedVoucherEventTypeId, isLoadingEventTypes: isLoadingVoucherConfig }))] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                        } })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
 }
 function UniversalBookingWidget(props) {
     const [languagePolicy, setLanguagePolicy] = useState(null);
@@ -16072,7 +16544,7 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z = ".booking-widget-container{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;color:var(--bw-text-color,#1e293b);direction:ltr;display:block;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;position:relative;text-align:left}.booking-widget-container *,.booking-widget-container :after,.booking-widget-container :before{box-sizing:border-box;margin:0;padding:0}.booking-widget-container input,.booking-widget-container select,.booking-widget-container textarea{font-family:inherit;font-size:inherit;line-height:inherit}.booking-widget-container button{background:none;border:none;cursor:pointer;font-family:inherit;font-size:inherit}.booking-widget-container a{color:inherit;text-decoration:none}.booking-widget-container img{display:block;height:auto;max-width:100%;vertical-align:middle}.booking-widget-container ol,.booking-widget-container ul{list-style:none}.booking-widget-container h1,.booking-widget-container h2,.booking-widget-container h3,.booking-widget-container h4,.booking-widget-container h5,.booking-widget-container h6{font-size:inherit;font-weight:inherit}#booking-widget-portal{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);direction:ltr;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;text-align:left}#booking-widget-portal *,#booking-widget-portal :after,#booking-widget-portal :before{box-sizing:border-box}#booking-widget-portal-root{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);line-height:1.5}:root{--bw-highlight-color:#00b1aa;--bw-highlight-color-rgb:0,177,170;--bw-background-color:#f8fdfe;--bw-surface-color:#fff;--bw-text-color:#0e7490;--bw-text-muted:rgba(14,116,144,.7);--bw-border-color:#bae6fd;--bw-success-color:#38bdf8;--bw-warning-color:#fbbf24;--bw-error-color:#f43f5e;--bw-border-radius:18px;--bw-border-radius-small:calc(var(--bw-border-radius)*0.8);--bw-spacing:16px;--bw-spacing-large:24px;--bw-font-family:\"Inter\",system-ui,sans-serif;--bw-font-size:14px;--bw-font-size-large:18px;--bw-font-size-small:12px;--bw-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--bw-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--bw-highlight-muted:rgba(0,177,170,.1);--bw-highlight-subtle:rgba(0,177,170,.05);--bw-text-subtle:rgba(14,116,144,.4)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes shimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes slide-in-right{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out-right{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}@keyframes slide-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-spin{animation:spin 1s linear infinite}.animate-shimmer{animation:shimmer 2s infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-fade-in{animation:fade-in .2s ease-out}.animate-slide-in-up{animation:slide-in-up .3s ease-out}.animate-scale-in{animation:scale-in .2s ease-out}.skeleton-shimmer{overflow:hidden;position:relative}.skeleton-shimmer:after{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}@media (max-width:768px){.sidebar-mobile{border-radius:0!important;max-width:100%!important;width:100%!important}}@media (max-width:600px){.event-type-list{gap:12px!important;padding:8px!important}.event-type-card{flex:1 1 100%!important;max-width:100%!important;padding:0!important}.event-type-img{height:160px!important}.event-type-title{font-size:1.1rem!important}.event-type-desc{font-size:.8rem!important;max-height:100px!important;min-height:100px!important}.event-type-content{padding:16px 24px!important}}.event-type-markdown{overflow:visible!important}.event-type-markdown p{color:var(--bw-text-muted);font-family:var(--bw-font-family);line-height:1.6;margin:0 0 8px}.event-type-markdown p:last-child{margin-bottom:0}.event-type-markdown h2{font-size:18px!important;font-weight:700!important;margin:12px 0 6px!important}.event-type-markdown h2,.event-type-markdown h3{color:var(--bw-text-color)!important;line-height:1.3!important}.event-type-markdown h3{font-size:16px!important;font-weight:600!important;margin:10px 0 4px!important}.event-type-markdown strong{color:var(--bw-text-color);font-weight:600}.event-type-markdown em{font-style:italic}.event-type-markdown u{text-decoration:underline}.event-type-markdown ul{list-style:none!important;margin:6px 0!important;padding:0 0 0 24px!important;position:relative!important}.event-type-markdown ul li{color:var(--bw-text-muted)!important;font-family:var(--bw-font-family)!important;margin-bottom:2px!important;padding-left:0!important;position:relative!important}.event-type-markdown ul li:before{color:var(--bw-text-color)!important;content:\"•\"!important;font-weight:700!important;left:-16px!important;position:absolute!important;top:0!important}.event-type-markdown ol{counter-reset:list-counter!important;list-style:none!important;margin:6px 0!important;padding:0 0 0 24px!important;position:relative!important}.event-type-markdown ol li{color:var(--bw-text-muted)!important;counter-increment:list-counter!important;font-family:var(--bw-font-family)!important;margin-bottom:2px!important;padding-left:0!important;position:relative!important}.event-type-markdown ol li:before{color:var(--bw-text-color)!important;content:counter(list-counter) \".\"!important;font-weight:700!important;left:-20px!important;position:absolute!important;top:0!important}.event-type-markdown blockquote{border-left:2px solid var(--bw-border-color);color:var(--bw-text-muted);font-style:italic;margin:4px 0;padding-left:12px}.event-type-markdown a{color:var(--bw-highlight-color);text-decoration:underline}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{color:var(--bw-text-color);font-weight:600;margin-bottom:.5em}.markdown-content h1{font-size:1.5em}.markdown-content h2{font-size:1.25em}.markdown-content h3{font-size:1.1em}.markdown-content p{line-height:1.6;margin-bottom:1em}.markdown-content ol,.markdown-content ul{margin-bottom:1em;padding-left:1.5em}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content li{margin-bottom:.25em}.markdown-content a{color:var(--bw-highlight-color);text-decoration:underline}.markdown-content a:hover{opacity:.8}.markdown-content strong{font-weight:600}.markdown-content em{font-style:italic}.markdown-content code{background:var(--bw-highlight-subtle);border-radius:4px;font-family:monospace;font-size:.9em;padding:.125em .25em}.markdown-content blockquote{border-left:3px solid var(--bw-highlight-color);color:var(--bw-text-muted);margin:1em 0;padding-left:1em}.print-only{display:none}.print-hidden{display:block}@media print{.print-only{display:block}.print-hidden{display:none!important}.print-booking-header{border-bottom:2px solid #000;display:block;margin-bottom:24px;padding-bottom:16px;text-align:center}.print-booking-header h1{font-size:24px;margin:0 0 8px}.print-booking-header .subtitle{color:#666;font-size:14px}.print-booking-card{border:1px solid #ccc;border-radius:8px;margin-bottom:16px;padding:16px;page-break-inside:avoid}.print-section-title{border-bottom:1px solid #ddd;display:block;font-size:16px;font-weight:600;margin-bottom:12px;padding-bottom:8px}.print-detail-grid{display:grid;gap:12px;grid-template-columns:1fr 1fr}.print-detail-item{margin-bottom:8px}.print-detail-label{color:#666;font-size:12px;margin-bottom:4px}.print-detail-value{font-size:14px;font-weight:600}.print-status-badge{border-radius:9999px;display:inline-block;font-size:12px;font-weight:600;padding:4px 12px}.print-status-paid{background-color:#dcfce7;color:#166534;display:inline-block}.print-participant{align-items:center;background-color:#f9fafb;border-radius:4px;display:flex;justify-content:space-between;margin-bottom:8px;padding:8px}.print-participant-name{font-weight:600}.print-participant-age{color:#666;font-size:12px}.print-payment-summary{display:block}.print-payment-row{border-bottom:1px solid #eee;display:flex;justify-content:space-between;padding:4px 0}.print-payment-row:last-child{border-bottom:none;font-weight:600}.print-footer{border-top:1px solid #ddd;color:#666;display:block;font-size:12px;margin-top:24px;padding-top:16px;text-align:center}.print-footer p{margin:4px 0}}";
+var css_248z = ".booking-widget-container{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;box-sizing:border-box;color:var(--bw-text-color,#1e293b);direction:ltr;display:block;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;position:relative;text-align:left}.booking-widget-container *,.booking-widget-container :after,.booking-widget-container :before{box-sizing:border-box;margin:0;padding:0}.booking-widget-container input,.booking-widget-container select,.booking-widget-container textarea{font-family:inherit;font-size:inherit;line-height:inherit}.booking-widget-container button{background:none;border:none;cursor:pointer;font-family:inherit;font-size:inherit}.booking-widget-container a{color:inherit;text-decoration:none}.booking-widget-container img{display:block;height:auto;max-width:100%;vertical-align:middle}.booking-widget-container ol,.booking-widget-container ul{list-style:none}.booking-widget-container h1,.booking-widget-container h2,.booking-widget-container h3,.booking-widget-container h4,.booking-widget-container h5,.booking-widget-container h6{font-size:inherit;font-weight:inherit}#booking-widget-portal{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);direction:ltr;font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);isolation:isolate;line-height:1.5;text-align:left}#booking-widget-portal *,#booking-widget-portal :after,#booking-widget-portal :before{box-sizing:border-box}#booking-widget-portal-root{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--bw-text-color,#1e293b);font-family:var(--bw-font-family,system-ui,-apple-system,sans-serif);font-size:var(--bw-font-size,14px);line-height:1.5}:root{--bw-highlight-color:#00b1aa;--bw-highlight-color-rgb:0,177,170;--bw-background-color:#f8fdfe;--bw-surface-color:#fff;--bw-text-color:#0e7490;--bw-text-muted:rgba(14,116,144,.7);--bw-border-color:#bae6fd;--bw-success-color:#38bdf8;--bw-warning-color:#fbbf24;--bw-error-color:#f43f5e;--bw-border-radius:18px;--bw-border-radius-small:calc(var(--bw-border-radius)*0.8);--bw-spacing:16px;--bw-spacing-large:24px;--bw-font-family:\"Inter\",system-ui,sans-serif;--bw-font-size:14px;--bw-font-size-large:18px;--bw-font-size-small:12px;--bw-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--bw-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--bw-highlight-muted:rgba(0,177,170,.1);--bw-highlight-subtle:rgba(0,177,170,.05);--bw-text-subtle:rgba(14,116,144,.4)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes shimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes slide-in-right{0%{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}@keyframes slide-out-right{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100%)}}@keyframes slide-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-spin{animation:spin 1s linear infinite}.animate-shimmer{animation:shimmer 2s infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.animate-fade-in{animation:fade-in .2s ease-out}.animate-slide-in-up{animation:slide-in-up .3s ease-out}.animate-scale-in{animation:scale-in .2s ease-out}.skeleton-shimmer{overflow:hidden;position:relative}.skeleton-shimmer:after{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.3),transparent);content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}.bw-btn{transition:all .2s ease!important}.bw-btn:hover:not(:disabled):not([disabled]){box-shadow:0 4px 12px rgba(0,0,0,.15);transform:translateY(-1px)}.bw-btn:active:not(:disabled):not([disabled]){box-shadow:0 2px 4px rgba(0,0,0,.1)}.bw-btn-primary:hover:not(:disabled):not([disabled]){background-color:var(--bw-highlight-color);filter:brightness(1.1)}.bw-btn-secondary:hover:not(:disabled):not([disabled]){background-color:var(--bw-surface-color);border-color:var(--bw-highlight-color);color:var(--bw-highlight-color)}.bw-btn-ghost:hover:not(:disabled):not([disabled]){background-color:var(--bw-highlight-muted)}.bw-btn-outline:hover:not(:disabled):not([disabled]){background-color:var(--bw-highlight-color);color:var(--bw-button-text-color,#fff)}.bw-btn:disabled,.bw-btn[disabled]{cursor:not-allowed!important;opacity:.5!important}button[class*=bw-btn],button[style*=transition]{transition:all .2s ease!important}button[data-variant=primary]:hover:not(:disabled),button[style*=\"--bw-highlight-color\"]:hover:not(:disabled){box-shadow:0 4px 12px rgba(0,0,0,.15);filter:brightness(1.1);transform:translateY(-1px)}button[data-variant=secondary]:hover:not(:disabled){border-color:var(--bw-highlight-color)!important;color:var(--bw-highlight-color)!important}button[data-variant=ghost]:hover:not(:disabled){background-color:var(--bw-highlight-muted)!important}button[data-variant=outline]:hover:not(:disabled){background-color:var(--bw-highlight-color)!important;color:var(--bw-button-text-color,#fff)!important}.bw-button-hover:hover:not(:disabled){box-shadow:0 4px 12px rgba(0,0,0,.15);transform:translateY(-1px)}.bw-button-hover:active:not(:disabled){box-shadow:0 2px 4px rgba(0,0,0,.1);transform:translateY(0)}@media (max-width:768px){.sidebar-mobile{border-radius:0!important;max-width:100%!important;width:100%!important}}@media (max-width:600px){.event-type-list{gap:12px!important;padding:8px!important}.event-type-card{flex:1 1 100%!important;max-width:100%!important;padding:0!important}.event-type-img{height:160px!important}.event-type-title{font-size:1.1rem!important}.event-type-desc{font-size:.8rem!important;max-height:100px!important;min-height:100px!important}.event-type-content{padding:16px 24px!important}}.event-type-markdown{overflow:visible!important}.event-type-markdown p{color:var(--bw-text-muted);font-family:var(--bw-font-family);line-height:1.6;margin:0 0 8px}.event-type-markdown p:last-child{margin-bottom:0}.event-type-markdown h2{font-size:18px!important;font-weight:700!important;margin:12px 0 6px!important}.event-type-markdown h2,.event-type-markdown h3{color:var(--bw-text-color)!important;line-height:1.3!important}.event-type-markdown h3{font-size:16px!important;font-weight:600!important;margin:10px 0 4px!important}.event-type-markdown strong{color:var(--bw-text-color);font-weight:600}.event-type-markdown em{font-style:italic}.event-type-markdown u{text-decoration:underline}.event-type-markdown ul{list-style:none!important;margin:6px 0!important;padding:0 0 0 24px!important;position:relative!important}.event-type-markdown ul li{color:var(--bw-text-muted)!important;font-family:var(--bw-font-family)!important;margin-bottom:2px!important;padding-left:0!important;position:relative!important}.event-type-markdown ul li:before{color:var(--bw-text-color)!important;content:\"•\"!important;font-weight:700!important;left:-16px!important;position:absolute!important;top:0!important}.event-type-markdown ol{counter-reset:list-counter!important;list-style:none!important;margin:6px 0!important;padding:0 0 0 24px!important;position:relative!important}.event-type-markdown ol li{color:var(--bw-text-muted)!important;counter-increment:list-counter!important;font-family:var(--bw-font-family)!important;margin-bottom:2px!important;padding-left:0!important;position:relative!important}.event-type-markdown ol li:before{color:var(--bw-text-color)!important;content:counter(list-counter) \".\"!important;font-weight:700!important;left:-20px!important;position:absolute!important;top:0!important}.event-type-markdown blockquote{border-left:2px solid var(--bw-border-color);color:var(--bw-text-muted);font-style:italic;margin:4px 0;padding-left:12px}.event-type-markdown a{color:var(--bw-highlight-color);text-decoration:underline}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{color:var(--bw-text-color);font-weight:600;margin-bottom:.5em}.markdown-content h1{font-size:1.5em}.markdown-content h2{font-size:1.25em}.markdown-content h3{font-size:1.1em}.markdown-content p{line-height:1.6;margin-bottom:1em}.markdown-content ol,.markdown-content ul{margin-bottom:1em;padding-left:1.5em}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content li{margin-bottom:.25em}.markdown-content a{color:var(--bw-highlight-color);text-decoration:underline}.markdown-content a:hover{opacity:.8}.markdown-content strong{font-weight:600}.markdown-content em{font-style:italic}.markdown-content code{background:var(--bw-highlight-subtle);border-radius:4px;font-family:monospace;font-size:.9em;padding:.125em .25em}.markdown-content blockquote{border-left:3px solid var(--bw-highlight-color);color:var(--bw-text-muted);margin:1em 0;padding-left:1em}.print-only{display:none}.print-hidden{display:block}@media print{.print-only{display:block}.print-hidden{display:none!important}.print-booking-header{border-bottom:2px solid #000;display:block;margin-bottom:24px;padding-bottom:16px;text-align:center}.print-booking-header h1{font-size:24px;margin:0 0 8px}.print-booking-header .subtitle{color:#666;font-size:14px}.print-booking-card{border:1px solid #ccc;border-radius:8px;margin-bottom:16px;padding:16px;page-break-inside:avoid}.print-section-title{border-bottom:1px solid #ddd;display:block;font-size:16px;font-weight:600;margin-bottom:12px;padding-bottom:8px}.print-detail-grid{display:grid;gap:12px;grid-template-columns:1fr 1fr}.print-detail-item{margin-bottom:8px}.print-detail-label{color:#666;font-size:12px;margin-bottom:4px}.print-detail-value{font-size:14px;font-weight:600}.print-status-badge{border-radius:9999px;display:inline-block;font-size:12px;font-weight:600;padding:4px 12px}.print-status-paid{background-color:#dcfce7;color:#166534;display:inline-block}.print-participant{align-items:center;background-color:#f9fafb;border-radius:4px;display:flex;justify-content:space-between;margin-bottom:8px;padding:8px}.print-participant-name{font-weight:600}.print-participant-age{color:#666;font-size:12px}.print-payment-summary{display:block}.print-payment-row{border-bottom:1px solid #eee;display:flex;justify-content:space-between;padding:4px 0}.print-payment-row:last-child{border-bottom:none;font-weight:600}.print-footer{border-top:1px solid #ddd;color:#666;display:block;font-size:12px;margin-top:24px;padding-top:16px;text-align:center}.print-footer p{margin:4px 0}}";
 styleInject(css_248z);
 
 // Export init function for vanilla JS usage