@bigz-app/booking-widget 1.2.1 → 1.3.1

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import React__default, { createContext, useState, useEffect, useCallback, useMemo, useContext, forwardRef, useRef, Fragment as Fragment$1 } from 'react';
+import React__default, { createContext, useState, useCallback, useMemo, useContext, useEffect, forwardRef, useRef, Fragment as Fragment$1 } from 'react';
 import { createRoot } from 'react-dom/client';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import ReactDOM, { createPortal } from 'react-dom';
@@ -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",
@@ -270,6 +280,8 @@ const de$1 = {
     "booking.participantName": "Name *",
     "booking.participantNamePlaceholder": "Teilnehmername",
     "booking.participantAge": "Alter",
+    "booking.participantLevel": "Level",
+    "booking.participantLevelPlaceholder": "Level wählen...",
     "booking.addParticipant": "{{number}}. Teilnehmer hinzufügen",
     "booking.maxParticipants": "Maximale Anzahl an Teilnehmern erreicht. Es sind nur noch {{count}} Plätze verfügbar.",
     "booking.maxSpotsReached": "Maximal {{count}} Plätze verfügbar.",
@@ -418,7 +430,11 @@ const de$1 = {
     "validation.emailInvalid": "Ungültiges E-Mail-Format",
     "validation.emailDomainInvalid": "Ungültige E-Mail-Domain",
     "validation.participantRequired": "Mindestens ein Teilnehmer erforderlich",
+    "validation.ageRequired": "Alter ist erforderlich",
+    "validation.levelRequired": "Bitte ein Level auswählen",
     "validation.acceptTerms": "Bitte akzeptiere die Allgemeinen Geschäftsbedingungen",
+    "level.beginner": "Anfänger",
+    "level.advanced": "Fortgeschritten",
     // Sidebar
     "sidebar.close": "Schließen",
     // Promo
@@ -493,6 +509,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 +526,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",
@@ -530,6 +556,8 @@ const en = {
     "booking.participantName": "Name *",
     "booking.participantNamePlaceholder": "Participant name",
     "booking.participantAge": "Age",
+    "booking.participantLevel": "Level",
+    "booking.participantLevelPlaceholder": "Select level...",
     "booking.addParticipant": "Add participant {{number}}",
     "booking.maxParticipants": "Maximum number of participants reached. Only {{count}} spots are available.",
     "booking.maxSpotsReached": "Maximum {{count}} spots available.",
@@ -678,7 +706,11 @@ const en = {
     "validation.emailInvalid": "Invalid email format",
     "validation.emailDomainInvalid": "Invalid email domain",
     "validation.participantRequired": "At least one participant is required",
+    "validation.ageRequired": "Age is required",
+    "validation.levelRequired": "Please select a level",
     "validation.acceptTerms": "Please accept the terms and conditions",
+    "level.beginner": "Beginner",
+    "level.advanced": "Advanced",
     // Sidebar
     "sidebar.close": "Close",
     // Promo
@@ -753,6 +785,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 +802,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",
@@ -790,6 +832,8 @@ const es = {
     "booking.participantName": "Nombre *",
     "booking.participantNamePlaceholder": "Nombre del participante",
     "booking.participantAge": "Edad",
+    "booking.participantLevel": "Nivel",
+    "booking.participantLevelPlaceholder": "Seleccionar nivel...",
     "booking.addParticipant": "Añadir participante {{number}}",
     "booking.maxParticipants": "Número máximo de participantes alcanzado. Solo quedan {{count}} plazas disponibles.",
     "booking.maxSpotsReached": "Máximo {{count}} plazas disponibles.",
@@ -938,7 +982,11 @@ const es = {
     "validation.emailInvalid": "Formato de correo electrónico inválido",
     "validation.emailDomainInvalid": "Dominio de correo electrónico inválido",
     "validation.participantRequired": "Se requiere al menos un participante",
+    "validation.ageRequired": "La edad es obligatoria",
+    "validation.levelRequired": "Selecciona un nivel",
     "validation.acceptTerms": "Por favor, acepta los términos y condiciones",
+    "level.beginner": "Principiante",
+    "level.advanced": "Avanzado",
     // Sidebar
     "sidebar.close": "Cerrar",
     // Promo
@@ -1013,6 +1061,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 +1078,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",
@@ -1050,6 +1108,8 @@ const pt = {
     "booking.participantName": "Nome *",
     "booking.participantNamePlaceholder": "Nome do participante",
     "booking.participantAge": "Idade",
+    "booking.participantLevel": "Nível",
+    "booking.participantLevelPlaceholder": "Selecionar nível...",
     "booking.addParticipant": "Adicionar participante {{number}}",
     "booking.maxParticipants": "Número máximo de participantes atingido. Apenas {{count}} lugares disponíveis.",
     "booking.maxSpotsReached": "Máximo {{count}} lugares disponíveis.",
@@ -1198,7 +1258,11 @@ const pt = {
     "validation.emailInvalid": "Formato de email inválido",
     "validation.emailDomainInvalid": "Domínio de email inválido",
     "validation.participantRequired": "É necessário pelo menos um participante",
+    "validation.ageRequired": "A idade é obrigatória",
+    "validation.levelRequired": "Por favor selecione um nível",
     "validation.acceptTerms": "Por favor, aceite os termos e condições",
+    "level.beginner": "Iniciante",
+    "level.advanced": "Avançado",
     // Sidebar
     "sidebar.close": "Fechar",
     // Promo
@@ -1273,6 +1337,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 +1354,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",
@@ -1310,6 +1384,8 @@ const sv = {
     "booking.participantName": "Namn *",
     "booking.participantNamePlaceholder": "Deltagarens namn",
     "booking.participantAge": "Ålder",
+    "booking.participantLevel": "Nivå",
+    "booking.participantLevelPlaceholder": "Välj nivå...",
     "booking.addParticipant": "Lägg till deltagare {{number}}",
     "booking.maxParticipants": "Maximalt antal deltagare uppnått. Bara {{count}} platser är tillgängliga.",
     "booking.maxSpotsReached": "Maximalt {{count}} platser tillgängliga.",
@@ -1458,7 +1534,11 @@ const sv = {
     "validation.emailInvalid": "Ogiltigt e-postformat",
     "validation.emailDomainInvalid": "Ogiltig e-postdomän",
     "validation.participantRequired": "Minst en deltagare krävs",
+    "validation.ageRequired": "Ålder krävs",
+    "validation.levelRequired": "Välj en nivå",
     "validation.acceptTerms": "Acceptera villkoren",
+    "level.beginner": "Nybörjare",
+    "level.advanced": "Avancerad",
     // Sidebar
     "sidebar.close": "Stäng",
     // Promo
@@ -1551,18 +1631,9 @@ function persistLocale(locale) {
 }
 const I18nContext = createContext(null);
 function I18nProvider({ configLocale, children }) {
-    // Priority: configLocale (site owner) > persisted user choice > browser language > "de"
-    // If configLocale is set, the site owner has locked the language - don't restore user choice.
-    const [overrideLocale, setOverrideLocale] = useState(() => {
-        if (configLocale)
-            return null;
-        return readPersistedLocale();
-    });
-    useEffect(() => {
-        if (configLocale) {
-            setOverrideLocale(null);
-        }
-    }, [configLocale]);
+    // Priority: persisted user choice > configLocale (org default) > browser language > "de"
+    // This keeps org locale as default, but remembers explicit user overrides across reloads.
+    const [overrideLocale, setOverrideLocale] = useState(() => readPersistedLocale());
     const locale = overrideLocale ?? resolveLocale(configLocale);
     const handleSetLocale = useCallback((next) => {
         persistLocale(next);
@@ -1694,129 +1765,153 @@ const resolveSemanticColor = (colorValue, fallbackValue) => {
     // If semantic resolution fails, use fallback or return the original value
     return fallbackValue || colorValue;
 };
-// Predefined themes (modern, accessibility-tested)
+// Legacy theme name redirects (old name → new name)
+const legacyThemeRedirects = {
+    "light-fresh": "teal-minimal",
+    "light-elegant": "blue-business",
+    "light-vibrant": "orange-raw",
+    "light-professional": "blue-business",
+    "dark-night": "navy-night",
+    "dark-modern": "navy-night",
+    "dark-forest": "green-deep",
+};
+// 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 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-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-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 +1921,10 @@ 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 rawThemeName = config.theme || "teal-minimal";
+        // Redirect legacy theme names to new names
+        const themeName = legacyThemeRedirects[rawThemeName] || rawThemeName;
+        const themeDefaults = themes[themeName] || themes["teal-minimal"];
         const getCSSValue = (value, fallback) => {
             if (!value)
                 return fallback;
@@ -1897,6 +1994,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 +2012,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 +4566,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);
         }
@@ -11117,16 +11216,37 @@ const objectType = ZodObject.create;
 ZodUnion.create;
 ZodIntersection.create;
 ZodTuple.create;
-ZodEnum.create;
+const enumType = ZodEnum.create;
 ZodPromise.create;
 ZodOptional.create;
 ZodNullable.create;
+const preprocessType = ZodEffects.createWithPreprocess;
 
-const participantSchema = (t) => objectType({
-    name: stringType().trim().min(1, t("validation.nameRequired")),
+const DEFAULT_PARTICIPANT_FIELDS_CONFIG = {
+    name: { enabled: true, required: true },
+    age: { enabled: true, required: false },
+    level: { enabled: false, required: false },
+};
+const participantSchema = (t, fieldsConfig) => objectType({
+    name: stringType().trim().optional(),
     age: numberType().min(0).max(120).optional(),
+    level: preprocessType((value) => (value === "" ? undefined : value), enumType(["beginner", "advanced"]).optional()),
+})
+    .superRefine((value, ctx) => {
+    if (fieldsConfig.name.required && (!value.name || value.name.trim().length < 1)) {
+        ctx.addIssue({ code: ZodIssueCode.custom, message: t("validation.nameRequired"), path: ["name"] });
+    }
+    if (!fieldsConfig.name.enabled && value.name && value.name.trim().length > 0) {
+        ctx.addIssue({ code: ZodIssueCode.custom, message: t("validation.nameRequired"), path: ["name"] });
+    }
+    if (fieldsConfig.age.required && typeof value.age !== "number") {
+        ctx.addIssue({ code: ZodIssueCode.custom, message: t("validation.ageRequired"), path: ["age"] });
+    }
+    if (fieldsConfig.level.required && !value.level) {
+        ctx.addIssue({ code: ZodIssueCode.custom, message: t("validation.levelRequired"), path: ["level"] });
+    }
 });
-function createBookingFormSchema(t) {
+function createBookingFormSchema(t, fieldsConfig = DEFAULT_PARTICIPANT_FIELDS_CONFIG) {
     const tr = t ?? ((key) => key);
     return objectType({
         customerName: stringType().trim().min(2, tr("validation.nameMinLength")),
@@ -11136,7 +11256,7 @@ function createBookingFormSchema(t) {
             .email(tr("validation.emailInvalid"))
             .regex(/\.[a-zA-Z]{2,}$/, tr("validation.emailDomainInvalid")),
         customerPhone: stringType().trim().optional(),
-        participants: arrayType(participantSchema(tr)).min(1, tr("validation.participantRequired")),
+        participants: arrayType(participantSchema(tr, fieldsConfig)).min(1, tr("validation.participantRequired")),
         discountCode: stringType().trim().optional(),
         comment: stringType().trim().optional(),
         acceptTerms: booleanType().refine((val) => val === true, {
@@ -11177,11 +11297,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: {
@@ -11277,7 +11399,8 @@ const participantUpsellStyles = {
         gap: "8px",
         marginTop: "10px",
         paddingTop: "10px",
-        borderTop: "1px dashed var(--bw-border-color)",
+        paddingBottom: "25px",
+        borderBottom: "1px dashed var(--bw-border-color)",
     },
     label: {
         display: "inline-flex",
@@ -11335,6 +11458,8 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     const { locale } = useLocale();
     const timezone = useTimezone();
     const roundEnabled = systemConfig?.roundPricesEnabled !== false;
+    const participantFieldsConfig = eventDetails.participantFieldsConfig ?? DEFAULT_PARTICIPANT_FIELDS_CONFIG;
+    const participantLevelOptions = eventDetails.participantLevelOptions ?? ["beginner", "advanced"];
     const roundDiscountUp = (minorUnits) => Math.ceil(minorUnits / 100) * 100;
     const calcPercentDiscountAmount = (baseAmount, basisPoints, round) => {
         const raw = Math.round((baseAmount * basisPoints) / 10000);
@@ -11347,18 +11472,19 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     // Per-participant upsell selections: participantIndex -> array of upsell package IDs
     const [participantUpsells, setParticipantUpsells] = useState({});
     const form = useForm({
-        resolver: t(createBookingFormSchema(t$1)),
+        resolver: t(createBookingFormSchema(t$1, participantFieldsConfig)),
         defaultValues: {
             customerName: "",
             customerEmail: "",
             customerPhone: "",
-            participants: [{ name: "" }],
+            participants: [{ name: "", level: undefined }],
             discountCode: "",
             comment: "",
             acceptTerms: false,
         },
     });
     const watchedParticipants = form.watch("participants");
+    const participantCount = watchedParticipants.length;
     const watchedCustomerName = form.watch("customerName");
     const watchedCustomerEmail = form.watch("customerEmail");
     const watchedComment = form.watch("comment");
@@ -11400,14 +11526,13 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     const calculateBaseTotal = useCallback(() => {
         if (!eventDetails)
             return 0;
-        return eventDetails.price * watchedParticipants.filter((p) => p.name.trim()).length;
-    }, [eventDetails, watchedParticipants]);
+        return eventDetails.price * participantCount;
+    }, [eventDetails, participantCount]);
     // Calculate upsells total based on per-participant selections
     const calculateUpsellsTotal = useCallback(() => {
         let total = 0;
-        watchedParticipants.forEach((participant, index) => {
-            // Only count upsells for participants with names
-            if (participant.name.trim()) {
+        watchedParticipants.forEach((_, index) => {
+            if (participantCount > 0) {
                 const participantUpsellIds = participantUpsells[index] || [];
                 participantUpsellIds.forEach(upsellId => {
                     const upsell = upsells.find(u => u.id === upsellId);
@@ -11418,7 +11543,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
             }
         });
         return total;
-    }, [participantUpsells, upsells, watchedParticipants]);
+    }, [participantUpsells, upsells, watchedParticipants, participantCount]);
     const calculateTotalDiscount = useCallback(() => {
         return appliedVouchers.reduce((total, voucher) => {
             if (voucher.type === "discount") {
@@ -11439,8 +11564,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     const calculateDeposit = () => {
         if (!eventDetails || !eventDetails.deposit)
             return 0;
-        const participantCount = watchedParticipants.filter((p) => p.name.trim()).length;
-        return eventDetails.deposit * participantCount;
+        return eventDetails.deposit * watchedParticipants.length;
     };
     const baseTotal = calculateBaseTotal();
     const upsellsTotal = calculateUpsellsTotal();
@@ -11457,8 +11581,8 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     // Includes participantIndices to track which participants selected each upsell
     const aggregatedUpsellSelections = useCallback(() => {
         const upsellParticipantMap = {};
-        watchedParticipants.forEach((participant, index) => {
-            if (participant.name.trim()) {
+        watchedParticipants.forEach((_, index) => {
+            if (participantCount > 0) {
                 const participantUpsellIds = participantUpsells[index] || [];
                 participantUpsellIds.forEach(upsellId => {
                     if (!upsellParticipantMap[upsellId]) {
@@ -11492,15 +11616,17 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
         setAppliedVouchers((prev) => prev.filter((v) => v.code !== code));
     }, []);
     const isReadyForPayment = () => {
-        const participantsWithNames = watchedParticipants.filter((p) => p.name.trim()).length;
+        const participantsWithNames = watchedParticipants.filter((p) => p.name?.trim()).length;
         const totalParticipantRows = watchedParticipants.length;
-        const allParticipantsHaveNames = participantsWithNames === totalParticipantRows;
+        const allParticipantsHaveNames = participantFieldsConfig.name.required
+            ? participantsWithNames === totalParticipantRows
+            : true;
         const participantsWithinLimit = participantsWithNames <= (eventDetails?.availableSpots || 0);
         const hasValidCustomerName = watchedCustomerName && watchedCustomerName.trim().length >= 2;
         const hasValidCustomerEmail = watchedCustomerEmail && watchedCustomerEmail.trim().length > 0 && !customerEmailError;
         return allParticipantsHaveNames &&
             participantsWithinLimit &&
-            participantsWithNames > 0 &&
+            (participantFieldsConfig.name.required ? participantsWithNames > 0 : totalParticipantRows > 0) &&
             hasValidCustomerName &&
             hasValidCustomerEmail &&
             watchedAcceptTerms;
@@ -11508,7 +11634,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     useEffect(() => {
         if (appliedVouchers.length > 0) {
             const newBaseTotal = eventDetails?.price
-                ? eventDetails.price * watchedParticipants.filter((p) => p.name.trim()).length
+                ? eventDetails.price * watchedParticipants.length
                 : 0;
             const currentUpsellsTotal = calculateUpsellsTotal();
             const orderTotal = newBaseTotal + currentUpsellsTotal;
@@ -11553,7 +11679,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
         const currentParticipants = form.getValues("participants");
         const availableSpots = eventDetails?.availableSpots || 0;
         if (currentParticipants.length < availableSpots) {
-            form.setValue("participants", [...currentParticipants, { name: "" }]);
+            form.setValue("participants", [...currentParticipants, { name: "", level: undefined }]);
         }
         else {
             alert(t$1("booking.maxParticipants", { count: availableSpots }));
@@ -11672,7 +11798,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                         justifyContent: "space-between",
                                         alignItems: "center",
                                         marginBottom: "16px",
-                                    }, children: jsx("h2", { style: { ...sectionHeaderStyles$1, marginBottom: 0 }, children: t$1("booking.participants") }) }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "16px" }, children: [watchedParticipants.map((_, index) => (jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [jsxs("div", { style: { display: "flex", gap: "12px", alignItems: "center" }, children: [jsxs("div", { style: { flex: 1 }, children: [jsx("label", { htmlFor: `participant-name-${index}`, style: labelStyles$1, children: t$1("booking.participantName") }), jsx("input", { id: `participant-name-${index}`, ...form.register(`participants.${index}.name`), type: "text", style: inputStyles$1, placeholder: t$1("booking.participantNamePlaceholder") }), form.formState.errors.participants?.[index]?.name && (jsx("p", { style: errorTextStyles$1, children: form.formState.errors.participants[index]?.name?.message }))] }), jsxs("div", { style: { width: "80px" }, children: [jsx("label", { htmlFor: `participant-age-${index}`, style: labelStyles$1, children: t$1("booking.participantAge") }), jsx("input", { id: `participant-age-${index}`, ...form.register(`participants.${index}.age`, {
+                                    }, children: jsx("h2", { style: { ...sectionHeaderStyles$1, marginBottom: 0 }, children: t$1("booking.participants") }) }), jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "16px" }, children: [watchedParticipants.map((_, index) => (jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "8px" }, children: [jsxs("div", { style: { display: "flex", gap: "12px", alignItems: "center" }, children: [participantFieldsConfig.name.enabled && (jsxs("div", { style: { flex: 1 }, children: [jsx("label", { htmlFor: `participant-name-${index}`, style: labelStyles$1, children: t$1("booking.participantName") }), jsx("input", { id: `participant-name-${index}`, ...form.register(`participants.${index}.name`), type: "text", style: inputStyles$1, placeholder: t$1("booking.participantNamePlaceholder") }), form.formState.errors.participants?.[index]?.name && (jsx("p", { style: errorTextStyles$1, children: form.formState.errors.participants[index]?.name?.message }))] })), participantFieldsConfig.age.enabled && (jsxs("div", { style: { width: "80px" }, children: [jsx("label", { htmlFor: `participant-age-${index}`, style: labelStyles$1, children: t$1("booking.participantAge") }), jsx("input", { id: `participant-age-${index}`, ...form.register(`participants.${index}.age`, {
                                                                         setValueAs: (value) => {
                                                                             if (value === "" || value === null || value === undefined) {
                                                                                 return undefined;
@@ -11680,7 +11806,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                                                             const num = Number(value);
                                                                             return Number.isNaN(num) ? undefined : num;
                                                                         },
-                                                                    }), type: "number", min: "0", max: "120", style: inputStyles$1, placeholder: "25" })] }), watchedParticipants.length > 1 && (jsxs("div", { children: [jsx("label", { style: { ...labelStyles$1, visibility: "hidden" }, children: "\u00A0" }), jsx("button", { type: "button", onClick: () => removeParticipant(index), style: {
+                                                                    }), type: "number", min: "0", max: "120", style: inputStyles$1, placeholder: "25" })] })), watchedParticipants.length > 1 && (jsxs("div", { children: [jsx("label", { style: { ...labelStyles$1, visibility: "hidden" }, children: "\u00A0" }), jsx("button", { type: "button", onClick: () => removeParticipant(index), style: {
                                                                         color: "var(--bw-error-color)",
                                                                         backgroundColor: "var(--bw-surface-color)",
                                                                         border: "1px solid var(--bw-border-color)",
@@ -11696,7 +11822,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                                                         fontWeight: 700,
                                                                         fontFamily: "var(--bw-font-family)",
                                                                         padding: 0,
-                                                                    }, children: "\u00D7" })] }))] }), upsells.length > 0 && (jsx("div", { style: participantUpsellStyles.container, children: upsells.map((upsell) => {
+                                                                    }, children: "\u00D7" })] }))] }), participantFieldsConfig.level.enabled && (jsxs("div", { style: { minWidth: "140px" }, children: [jsx("label", { htmlFor: `participant-level-${index}`, style: labelStyles$1, children: t$1("booking.participantLevel") }), jsxs("select", { id: `participant-level-${index}`, ...form.register(`participants.${index}.level`), style: inputStyles$1, children: [jsx("option", { value: "", children: t$1("booking.participantLevelPlaceholder") }), participantLevelOptions.map((level) => (jsx("option", { value: level, children: t$1(`level.${level}`) }, level)))] }), form.formState.errors.participants?.[index]?.level && (jsx("p", { style: errorTextStyles$1, children: form.formState.errors.participants[index]?.level?.message }))] })), upsells.length > 0 && (jsx("div", { style: participantUpsellStyles.container, children: upsells.map((upsell) => {
                                                         const isSelected = (participantUpsells[index] || []).includes(upsell.id);
                                                         return (jsxs("label", { htmlFor: `upsell-${index}-${upsell.id}`, style: isSelected ? participantUpsellStyles.labelSelected : participantUpsellStyles.label, children: [jsx("input", { id: `upsell-${index}-${upsell.id}`, type: "checkbox", style: participantUpsellStyles.checkbox, checked: isSelected, onChange: () => toggleParticipantUpsell(index, upsell.id) }), jsx("span", { style: { fontWeight: 500 }, children: upsell.name }), jsxs("span", { style: { fontSize: "12px", opacity: 0.8 }, children: ["(+", formatCurrency(upsell.price), ")"] })] }, upsell.id));
                                                     }) }))] }, index))), watchedParticipants.length < eventDetails.availableSpots ? (jsx("div", { style: {
@@ -11725,9 +11851,9 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                                                 color: "var(--bw-text-color)",
                                                                 fontWeight: 500,
                                                                 fontFamily: "var(--bw-font-family)",
-                                                            }, children: [jsxs("span", { style: { fontWeight: 200 }, children: [watchedParticipants.length > 1 ? watchedParticipants.filter((p) => p.name.trim()).length : 1, " x "] }), " ", formatCurrency(eventDetails.price)] })] }), upsellsTotal > 0 && (jsxs("div", { style: { marginTop: "8px", paddingTop: "8px", borderTop: "1px dashed var(--bw-border-color)" }, children: [jsxs("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)", fontSize: "13px", display: "block", marginBottom: "4px" }, children: [t$1("common.extras"), ":"] }), upsells.map((upsell) => {
+                                                            }, children: [jsxs("span", { style: { fontWeight: 200 }, children: [watchedParticipants.length > 1 ? watchedParticipants.length : 1, " x "] }), " ", formatCurrency(eventDetails.price)] })] }), upsellsTotal > 0 && (jsxs("div", { style: { marginTop: "8px", paddingTop: "8px", borderTop: "1px dashed var(--bw-border-color)" }, children: [jsxs("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)", fontSize: "13px", display: "block", marginBottom: "4px" }, children: [t$1("common.extras"), ":"] }), upsells.map((upsell) => {
                                                             // Count how many participants have this upsell selected
-                                                            const countWithUpsell = watchedParticipants.filter((p, idx) => p.name.trim() && (participantUpsells[idx] || []).includes(upsell.id)).length;
+                                                            const countWithUpsell = watchedParticipants.filter((_, idx) => (participantUpsells[idx] || []).includes(upsell.id)).length;
                                                             if (countWithUpsell === 0)
                                                                 return null;
                                                             const upsellLineTotal = upsell.price * countWithUpsell;
@@ -11828,15 +11954,17 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                                             }, children: t$1("summary.remainingOnSite", { amount: formatCurrency(totalAmount - depositAmount) }) }))] })] })] }), jsx("div", { ref: paymentSectionRef, children: (stripePromise || systemConfig?.paymentProvider === "mollie") &&
                                         (() => {
                                             if (!isReadyForPayment()) {
-                                                const participantsWithNames = watchedParticipants.filter((p) => p.name.trim()).length;
+                                                const participantsWithNames = watchedParticipants.filter((p) => p.name?.trim()).length;
                                                 const totalParticipantRows = watchedParticipants.length;
                                                 const participantsWithoutNames = totalParticipantRows - participantsWithNames;
                                                 const missing = [];
-                                                if (participantsWithNames === 0) {
-                                                    missing.push(t$1("payment.needParticipant"));
-                                                }
-                                                else if (participantsWithoutNames > 0) {
-                                                    missing.push(t$1("payment.needAllNames", { count: totalParticipantRows }));
+                                                if (participantFieldsConfig.name.required) {
+                                                    if (participantsWithNames === 0) {
+                                                        missing.push(t$1("payment.needParticipant"));
+                                                    }
+                                                    else if (participantsWithoutNames > 0) {
+                                                        missing.push(t$1("payment.needAllNames", { count: totalParticipantRows }));
+                                                    }
                                                 }
                                                 if (participantsWithNames > (eventDetails?.availableSpots || 0)) {
                                                     missing.push(t$1("payment.reduceParticipants", { count: eventDetails?.availableSpots || 0 }));
@@ -12011,7 +12139,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
             try {
                 const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/get-booking-by-payment"), {
                     method: "POST",
-                    headers: createApiHeaders(config),
+                    headers: createApiHeaders(config, locale),
                     body: JSON.stringify(createRequestBody(config, {
                         paymentIntentId: targetPaymentIntentId,
                     })),
@@ -12245,7 +12373,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
                                             flexDirection: "column",
                                             gap: "var(--bw-spacing-small)",
                                         }, children: formData.participants
-                                            .filter((p) => p.name.trim())
+                                            .filter((p) => p.name?.trim() || p.age || p.level)
                                             .map((participant, index) => (jsx("div", { className: "print-participant", style: {
                                                 display: "flex",
                                                 justifyContent: "space-between",
@@ -12256,11 +12384,15 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
                                             }, children: jsxs("div", { className: "print-participant-info", children: [jsx("div", { className: "print-participant-name", style: {
                                                             color: "var(--bw-text-color)",
                                                             fontFamily: "var(--bw-font-family)",
-                                                        }, children: participant.name }), participant.age && (jsx("div", { className: "print-participant-age", style: {
+                                                        }, children: participant.name || `#${index + 1}` }), participant.age && (jsx("div", { className: "print-participant-age", style: {
                                                             color: "var(--bw-text-muted)",
                                                             fontSize: "var(--bw-font-size-small)",
                                                             fontFamily: "var(--bw-font-family)",
-                                                        }, children: t("success.age", { age: participant.age }) }))] }) }, index))) }) })] })), jsxs("div", { className: "print-booking-card", style: {
+                                                        }, children: t("success.age", { age: participant.age }) })), participant.level && (jsxs("div", { style: {
+                                                            color: "var(--bw-text-muted)",
+                                                            fontSize: "var(--bw-font-size-small)",
+                                                            fontFamily: "var(--bw-font-family)",
+                                                        }, children: [t("booking.participantLevel"), ": ", t(`level.${participant.level}`)] }))] }) }, index))) }) })] })), jsxs("div", { className: "print-booking-card", style: {
                                 backgroundColor: "var(--bw-surface-color)",
                                 border: `1px solid var(--bw-border-color)`,
                                 borderRadius: "var(--bw-border-radius)",
@@ -13668,8 +13800,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);
@@ -13779,7 +13951,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,
@@ -13860,7 +14032,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",
@@ -13875,7 +14083,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",
@@ -13888,7 +14095,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,
@@ -14546,6 +14753,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":
@@ -14805,8 +15178,8 @@ const cardDisabledStyles = {
 };
 const checkboxContainerStyles = {
     position: "absolute",
-    top: "12px",
-    right: "12px",
+    bottom: "12px",
+    left: "12px",
     zIndex: 1,
 };
 const checkboxInnerStyles = {
@@ -14901,6 +15274,7 @@ const priceContainerStyles = {
     alignItems: "flex-end",
     marginTop: "8px",
     paddingTop: "8px",
+    paddingBottom: "0px",
     borderTop: "1px solid var(--bw-border-color)",
 };
 const pricePerPersonStyles = {
@@ -14992,7 +15366,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)] })] }))] }) }));
 }
 
@@ -15040,6 +15414,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([]);
@@ -15052,6 +15428,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
@@ -15202,6 +15581,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();
@@ -15425,6 +15809,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",
@@ -15609,6 +16032,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);
@@ -15621,7 +16045,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
@@ -15652,7 +16083,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         setEventInstances([]);
     };
     const handleBackToEventInstances = () => {
-        setCurrentStep("eventInstances");
+        setCurrentStep(bookingReturnStep.current);
         setSelectedEventInstance(null);
         setEventDetails(null);
     };
@@ -15686,8 +16117,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         }
     };
     const handleUpsellsBack = () => {
-        // Go back to event instance selection
-        setCurrentStep("eventInstances");
+        setCurrentStep(bookingReturnStep.current);
         setSelectedUpsells([]);
         setUpsells([]);
     };
@@ -15722,10 +16152,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,
@@ -15739,13 +16195,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);
         }
@@ -15902,6 +16408,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);
@@ -15972,7 +16503,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 })), 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: {
+    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",
@@ -16040,11 +16571,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
 function UniversalBookingWidget(props) {
     const [languagePolicy, setLanguagePolicy] = useState(null);
     const [orgTimezone, setOrgTimezone] = useState("Europe/Berlin");
-    const serverLockedLocale = languagePolicy && !languagePolicy.multiLanguageEnabled
-        ? languagePolicy.organizationLocale
-        : undefined;
-    const i18nConfigLocale = serverLockedLocale !== undefined ? serverLockedLocale : props.config.locale;
-    const providerProps = i18nConfigLocale ? { configLocale: i18nConfigLocale } : {};
+    const providerProps = props.config.locale ? { configLocale: props.config.locale } : {};
     const showLanguagePicker = props.config.showLanguagePicker !== false &&
         (languagePolicy === null || languagePolicy.multiLanguageEnabled);
     return (jsx(I18nProvider, { ...providerProps, children: jsx(ShowLanguagePickerProvider, { value: showLanguagePicker, children: jsx(TimezoneProvider, { value: orgTimezone, children: jsx(UniversalBookingWidgetInner, { ...props, onWidgetLanguage: setLanguagePolicy, onTimezone: setOrgTimezone }) }) }) }));
@@ -16077,7 +16604,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