@bigz-app/booking-widget 1.3.0 → 1.3.2

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';
@@ -280,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.",
@@ -428,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
@@ -550,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.",
@@ -698,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
@@ -820,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.",
@@ -968,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
@@ -1090,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.",
@@ -1238,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
@@ -1360,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.",
@@ -1508,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
@@ -1601,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);
@@ -1744,6 +1765,16 @@ const resolveSemanticColor = (colorValue, fallbackValue) => {
     // If semantic resolution fails, use fallback or return the original value
     return fallbackValue || colorValue;
 };
+// 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 ---
@@ -1890,7 +1921,9 @@ const StyleProvider = ({ config, children, }) => {
     }, []);
     // PERFORMANCE OPTIMIZATION: Memoize style calculations
     const themedStyles = useMemo(() => {
-        const themeName = config.theme || "teal-minimal";
+        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)
@@ -11183,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")),
@@ -11202,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, {
@@ -11345,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",
@@ -11403,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);
@@ -11415,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");
@@ -11468,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);
@@ -11486,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") {
@@ -11507,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();
@@ -11525,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]) {
@@ -11560,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;
@@ -11576,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;
@@ -11621,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 }));
@@ -11740,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;
@@ -11748,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)",
@@ -11764,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: {
@@ -11793,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;
@@ -11896,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 }));
@@ -11948,121 +12008,145 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
 }
 
 /**
- * Google Ads Conversion Tracking Utility
+ * Google Ads Tracking Utility
  *
- * Simplified utility that waits 1500ms, checks/initializes gtag, and sends conversion.
- */
-/**
- * Check if gtag is available in current or parent window
+ * Handles pageview tracking (widget load) and conversion tracking (successful booking).
+ * Supports both direct gtag.js and GTM dataLayer setups.
  */
 function isGtagAvailable() {
-    if (typeof window === "undefined") {
+    if (typeof window === "undefined")
         return false;
-    }
-    // Check current window
-    if (typeof window.gtag === "function") {
+    if (typeof window.gtag === "function")
         return true;
-    }
-    // Check parent window (for iframe/widget scenarios)
     if (window !== window.parent) {
         try {
-            if (typeof window.parent?.gtag === "function") {
+            if (typeof window.parent?.gtag === "function")
                 return true;
-            }
         }
         catch {
-            // Cannot access parent window (cross-origin)
+            // Cross-origin
         }
     }
     return false;
 }
-/**
- * Initialize gtag if not already available
- */
 function initializeGtag(tagId) {
-    if (typeof window === "undefined") {
+    if (typeof window === "undefined" || isGtagAvailable())
         return;
-    }
-    // Skip if gtag already exists
-    if (isGtagAvailable()) {
-        return;
-    }
-    // Initialize dataLayer and gtag function
     window.dataLayer = window.dataLayer || [];
     window.gtag = (...args) => {
         window.dataLayer.push(args);
     };
-    // Set current timestamp
     window.gtag("js", new Date());
-    // Load gtag script
     const script = document.createElement("script");
     script.async = true;
     script.src = `https://www.googletagmanager.com/gtag/js?id=${tagId}`;
     document.head.appendChild(script);
-    // Configure the tag
     window.gtag("config", tagId, {
         anonymize_ip: true,
         allow_google_signals: false,
         allow_ad_personalization_signals: false,
     });
 }
-/**
- * Send conversion event using available gtag
- */
-function sendConversion(config) {
-    if (typeof window === "undefined") {
-        return;
+function getGtag() {
+    if (typeof window === "undefined")
+        return null;
+    if (typeof window.gtag === "function") {
+        return window.gtag;
     }
-    let gtag = window.gtag;
-    // Try parent window gtag if current window doesn't have it
-    if (typeof gtag !== "function" && window !== window.parent) {
+    if (window !== window.parent) {
         try {
-            gtag = window.parent?.gtag;
+            const parentGtag = window.parent?.gtag;
+            if (typeof parentGtag === "function")
+                return parentGtag;
         }
         catch {
-            // Cannot access parent window (cross-origin)
+            // Cross-origin
         }
     }
-    if (typeof gtag !== "function") {
+    return null;
+}
+/**
+ * Push an event to the dataLayer for GTM visibility,
+ * then also fire via gtag for direct Google Ads tracking.
+ */
+function sendEvent(eventName, params) {
+    if (typeof window === "undefined")
         return;
+    // GTM dataLayer push (object format — visible in Tag Assistant)
+    window.dataLayer = window.dataLayer || [];
+    window.dataLayer.push({
+        event: eventName,
+        ...params,
+    });
+    // gtag call (array format — processed by gtag.js for Google Ads)
+    const gtag = getGtag();
+    if (gtag) {
+        gtag("event", eventName, params);
     }
-    // Build conversion data
-    const conversionData = {
+}
+function sendConversion(config) {
+    const params = {
         send_to: `${config.tagId}/${config.conversionId}`,
     };
-    // Add optional parameters
     if (config.conversionValue !== undefined) {
-        conversionData.value = config.conversionValue;
+        params.value = config.conversionValue;
     }
     if (config.conversionCurrency) {
-        conversionData.currency = config.conversionCurrency;
+        params.currency = config.conversionCurrency;
     }
     if (config.transactionId) {
-        conversionData.transaction_id = config.transactionId;
+        params.transaction_id = config.transactionId;
     }
-    // Send conversion event
-    gtag("event", "conversion", conversionData);
+    sendEvent("conversion", params);
 }
 /**
- * Main function to handle Google Ads conversion tracking
- * Waits 1500ms, checks/initializes gtag, then sends conversion
+ * Track widget pageview (fired once on widget mount).
  */
-function handleGoogleAdsConversion(config) {
-    // Validate required config
-    if (!config.tagId || !config.conversionId) {
+function handleGoogleAdsPageview(tagId, consent) {
+    if (!tagId || false || typeof window === "undefined")
         return;
+    if (!isGtagAvailable()) {
+        initializeGtag(tagId);
     }
-    // Wait 1500ms before proceeding
+    const fire = () => sendEvent("widget_pageview", {
+        send_to: tagId,
+        page_location: window.location.href,
+        page_title: document.title,
+    });
+    if (isGtagAvailable()) {
+        fire();
+        return;
+    }
+    const script = document.querySelector(`script[src*="googletagmanager.com/gtag/js?id=${tagId}"]`);
+    if (script) {
+        script.addEventListener("load", fire, { once: true });
+    }
+}
+/**
+ * Handle Google Ads conversion tracking.
+ * Waits 1500ms for the success page to settle, then fires.
+ */
+function handleGoogleAdsConversion(config) {
+    if (!config.tagId || !config.conversionId)
+        return;
     setTimeout(() => {
-        // Check if gtag is available, initialize if not
-        if (!isGtagAvailable()) {
-            initializeGtag(config.tagId);
+        if (isGtagAvailable()) {
+            sendConversion(config);
+            return;
+        }
+        initializeGtag(config.tagId);
+        const script = document.querySelector(`script[src*="googletagmanager.com/gtag/js?id=${config.tagId}"]`);
+        if (script) {
+            script.addEventListener("load", () => sendConversion(config));
+            script.addEventListener("error", () => sendConversion(config));
+        }
+        else {
+            sendConversion(config);
         }
-        sendConversion(config);
     }, 1500);
 }
 
-const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId, }) => {
+const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId, googleAdsConfig: googleAdsConfigProp, }) => {
     const t = useTranslations();
     const { locale } = useLocale();
     const timezone = useTimezone();
@@ -12079,7 +12163,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,
                     })),
@@ -12111,20 +12195,16 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
                     });
                     setPaymentStatus(data.stripePaymentIntent?.status || data.order.status);
                     const finalPaymentStatus = data.stripePaymentIntent?.status || data.order.status;
+                    const adsConfig = googleAdsConfigProp ?? data.googleAdsConfig;
                     if (finalPaymentStatus === "succeeded" &&
-                        config.googleAds?.tagId &&
-                        config.googleAds?.conversionId &&
-                        config.googleAds?.consent !== false) {
-                        // Prepare conversion tracking data
-                        const conversionValue = data.order.total / 100;
-                        const transactionId = data.order.id;
-                        // Track the conversion
+                        adsConfig?.tagId &&
+                        adsConfig?.conversionId) {
                         handleGoogleAdsConversion({
-                            tagId: config.googleAds.tagId,
-                            conversionId: config.googleAds.conversionId,
-                            conversionValue,
-                            conversionCurrency: config.googleAds.conversionCurrency || "EUR",
-                            transactionId,
+                            tagId: adsConfig.tagId,
+                            conversionId: adsConfig.conversionId,
+                            conversionValue: data.order.total / 100,
+                            conversionCurrency: adsConfig.conversionCurrency || "EUR",
+                            transactionId: data.order.id,
                         });
                     }
                 }
@@ -12313,7 +12393,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",
@@ -12324,11 +12404,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)",
@@ -15385,6 +15469,13 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
     const [shouldRenderInstanceSelection, setShouldRenderInstanceSelection] = useState(false);
     const [shouldRenderUpsells, setShouldRenderUpsells] = useState(false);
     const [shouldRenderBookingForm, setShouldRenderBookingForm] = useState(false);
+    // Google Ads config (received from API, set once from the first API response)
+    const [googleAdsConfig, setGoogleAdsConfig] = useState(null);
+    const extractGoogleAdsConfig = (data) => {
+        if (!googleAdsConfig && data?.googleAdsConfig?.tagId) {
+            setGoogleAdsConfig(data.googleAdsConfig);
+        }
+    };
     // Promo dialog state
     const [showPromoDialog, setShowPromoDialog] = useState(false);
     const [widgetContainerRef, setWidgetContainerRef] = useState(null);
@@ -15468,6 +15559,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                     image: resolvedImage,
                 };
                 setVoucherConfig(mergedConfig);
+                extractGoogleAdsConfig(data);
                 setVoucherEventTypes(data.eventTypes || []);
                 // Set system config for payment processing
                 if (data.paymentProvider) {
@@ -15490,6 +15582,14 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
             setIsLoadingVoucherConfig(false);
         }
     };
+    // Fire widget pageview once when Google Ads config is received from API
+    const pageviewFiredRef = useRef(false);
+    useEffect(() => {
+        if (!pageviewFiredRef.current && googleAdsConfig?.tagId) {
+            pageviewFiredRef.current = true;
+            handleGoogleAdsPageview(googleAdsConfig.tagId);
+        }
+    }, [googleAdsConfig]);
     // Determine initial step and load data
     useEffect(() => {
         const initializeWidget = async () => {
@@ -15703,6 +15803,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                 onWidgetLanguage?.(wl);
                 onTimezone?.(wl.timezone);
             }
+            extractGoogleAdsConfig(data);
             setEventTypes(data.eventTypes);
             if (isSingleEventTypeMode && data.eventTypes.length === 1) {
                 setSelectedEventType(data.eventTypes[0]);
@@ -15739,6 +15840,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                 onWidgetLanguage?.(wl);
                 onTimezone?.(wl.timezone);
             }
+            extractGoogleAdsConfig(data);
             setUpcomingEvents(data.upcomingEvents || []);
         }
         else {
@@ -15774,6 +15876,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                     onWidgetLanguage?.(wl);
                     onTimezone?.(wl.timezone);
                 }
+                extractGoogleAdsConfig(data);
                 setSpecials(data.specials || []);
             }
             else {
@@ -15800,6 +15903,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                 onWidgetLanguage?.(wl);
                 onTimezone?.(wl.timezone);
             }
+            extractGoogleAdsConfig(data);
             setEventInstances(data.eventInstances);
             if (data.paymentProvider) {
                 setSystemConfig({
@@ -15860,6 +15964,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                     onWidgetLanguage?.(wl);
                     onTimezone?.(wl.timezone);
                 }
+                extractGoogleAdsConfig(data);
                 setEventDetails(data.eventDetails);
                 setSystemConfig({
                     paymentProvider: data.paymentProvider,
@@ -15929,6 +16034,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                     onWidgetLanguage?.(wl);
                     onTimezone?.(wl.timezone);
                 }
+                extractGoogleAdsConfig(data);
                 return data.upsells || [];
             }
             else {
@@ -16342,7 +16448,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 url.searchParams.delete("mollie_payment_id");
                                 url.searchParams.delete("mollie_status");
                                 window.history.replaceState({}, "", url.toString());
-                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                            }, config: config, googleAdsConfig: googleAdsConfig, 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: () => {
@@ -16367,7 +16473,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 setShouldRenderBookingForm(false);
                                 setSelectedUpsells([]);
                                 setUpsells([]);
-                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                            }, config: config, googleAdsConfig: googleAdsConfig, 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: () => {
@@ -16390,7 +16496,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 url.searchParams.delete("mollie_payment_id");
                                 url.searchParams.delete("mollie_status");
                                 window.history.replaceState({}, "", url.toString());
-                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                            }, config: config, googleAdsConfig: googleAdsConfig, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
     }
     if (viewMode === "button" && (isSingleEventTypeMode || isDirectInstanceMode)) {
         return (jsxs(StyleProvider, { config: config, children: [jsxs("div", { ref: setWidgetContainerRef, style: {
@@ -16436,7 +16542,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 url.searchParams.delete("mollie_payment_id");
                                 url.searchParams.delete("mollie_status");
                                 window.history.replaceState({}, "", url.toString());
-                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                            }, config: config, googleAdsConfig: googleAdsConfig, 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, 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: {
@@ -16492,7 +16598,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                             url.searchParams.delete("mollie_payment_id");
                             url.searchParams.delete("mollie_status");
                             window.history.replaceState({}, "", url.toString());
-                        }, config: config, onError: setError, paymentIntentId: successPaymentId }), jsx(VoucherIntegration, { config: config, voucherConfig: voucherConfig, eventTypes: voucherEventTypes, systemConfig: systemConfig, isFormOpen: isVoucherFormOpen, isLoadingConfig: isLoadingVoucherConfig, preselectedEventTypeId: preselectedVoucherEventTypeId, voucherPurchaseResult: voucherPurchaseResult, isSuccess: isSuccess, showStandaloneCard: false, onCardClick: handleVoucherCardClick, onFormClose: handleVoucherFormClose, onSuccess: handleVoucherSuccess, onError: handleVoucherError, onSuccessModalClose: () => {
+                        }, config: config, googleAdsConfig: googleAdsConfig, onError: setError, paymentIntentId: successPaymentId }), jsx(VoucherIntegration, { config: config, voucherConfig: voucherConfig, eventTypes: voucherEventTypes, systemConfig: systemConfig, isFormOpen: isVoucherFormOpen, isLoadingConfig: isLoadingVoucherConfig, preselectedEventTypeId: preselectedVoucherEventTypeId, voucherPurchaseResult: voucherPurchaseResult, isSuccess: isSuccess, showStandaloneCard: false, onCardClick: handleVoucherCardClick, onFormClose: handleVoucherFormClose, onSuccess: handleVoucherSuccess, onError: handleVoucherError, onSuccessModalClose: () => {
                             setIsSuccess(false);
                             setVoucherPurchaseResult(null);
                             const url = new URL(window.location.href);
@@ -16507,11 +16613,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 }) }) }) }));