@bigz-app/booking-widget 1.1.6 → 1.1.8

package/dist/index.cjs

@@ -223,7 +223,7 @@ const de$1 = {
     "error.loadBookingData": "Fehler beim Abrufen der Buchungsdaten",
     "error.processingError": "Ein Fehler ist bei der Verarbeitung aufgetreten.",
     "error.createBooking": "Fehler beim Erstellen der Buchung",
-    "error.createPaymentIntent": "Fehler beim Erstellen der Zahlungsabsicht",
+    "error.createPayment": "Fehler beim Erstellen der Zahlung",
     "error.paymentProcessing": "Fehler beim Verarbeiten der Zahlung",
     "error.paymentFailed": "Die Zahlung war nicht erfolgreich. Bitte versuche es erneut.",
     "error.paymentIncomplete": "Die Zahlung konnte nicht abgeschlossen werden. Bitte versuche es erneut.",
@@ -337,7 +337,7 @@ const de$1 = {
     "voucher.giftCardApplied": "−{{amount}} Gutschein",
     "voucher.remaining": "Rest: {{amount}}",
     "voucher.remove": "Entfernen",
-    "voucher.alreadyHasDiscount": "Es wurde bereits ein Rabattcode angewendet. Du kannst weitere Gutscheine hinzufügen.",
+    "voucher.alreadyHasDiscount": "Du kannst weitere Gutscheine hinzufügen.",
     // Booking success
     "success.title": "Reservierung erfolgreich!",
     "success.bookingDetails": "Buchungsdetails",
@@ -432,7 +432,7 @@ const en = {
     "error.loadBookingData": "Error fetching booking data",
     "error.processingError": "An error occurred during processing.",
     "error.createBooking": "Error creating booking",
-    "error.createPaymentIntent": "Error creating payment intent",
+    "error.createPayment": "Error creating payment",
     "error.paymentProcessing": "Error processing payment",
     "error.paymentFailed": "The payment was not successful. Please try again.",
     "error.paymentIncomplete": "The payment could not be completed. Please try again.",
@@ -641,7 +641,7 @@ const es = {
     "error.loadBookingData": "Error al obtener datos de la reserva",
     "error.processingError": "Ocurrió un error durante el procesamiento.",
     "error.createBooking": "Error al crear la reserva",
-    "error.createPaymentIntent": "Error al crear la intención de pago",
+    "error.createPayment": "Error al crear el pago",
     "error.paymentProcessing": "Error al procesar el pago",
     "error.paymentFailed": "El pago no fue exitoso. Por favor, inténtalo de nuevo.",
     "error.paymentIncomplete": "El pago no pudo completarse. Por favor, inténtalo de nuevo.",
@@ -850,7 +850,7 @@ const pt = {
     "error.loadBookingData": "Erro ao obter dados da reserva",
     "error.processingError": "Ocorreu um erro durante o processamento.",
     "error.createBooking": "Erro ao criar reserva",
-    "error.createPaymentIntent": "Erro ao criar intenção de pagamento",
+    "error.createPayment": "Erro ao criar pagamento",
     "error.paymentProcessing": "Erro ao processar pagamento",
     "error.paymentFailed": "O pagamento não foi bem-sucedido. Por favor, tente novamente.",
     "error.paymentIncomplete": "O pagamento não pôde ser concluído. Por favor, tente novamente.",
@@ -1059,7 +1059,7 @@ const sv = {
     "error.loadBookingData": "Fel vid hämtning av bokningsdata",
     "error.processingError": "Ett fel uppstod vid bearbetningen.",
     "error.createBooking": "Fel vid skapande av bokning",
-    "error.createPaymentIntent": "Fel vid skapande av betalningsavsikt",
+    "error.createPayment": "Fel vid skapande av betalning",
     "error.paymentProcessing": "Fel vid bearbetning av betalning",
     "error.paymentFailed": "Betalningen lyckades inte. Försök igen.",
     "error.paymentIncomplete": "Betalningen kunde inte slutföras. Försök igen.",
@@ -4418,6 +4418,108 @@ const IconChevronLeft = ({ size = 20, color = "white", className, }) => (jsxRunt
 // Chevron Right icon - used for carousel navigation
 const IconChevronRight = ({ size = 20, color = "white", className, }) => (jsxRuntime.jsx("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: className, children: jsxRuntime.jsx("polyline", { points: "9 18 15 12 9 6" }) }));
 
+function GiftCardOnlyBooking({ config, eventDetails, formData, discountCode, giftCards, onSuccess, onError, upsellSelections = [], }) {
+    const t = useTranslations();
+    const [isLoading, setIsLoading] = React.useState(false);
+    const [error, setError] = React.useState(null);
+    const handleBooking = async () => {
+        setIsLoading(true);
+        setError(null);
+        try {
+            const requestData = {
+                eventInstanceId: config.eventInstanceId || eventDetails.id,
+                organizationId: config.organizationId,
+                participants: formData.participants.filter((p) => p.name?.trim()),
+                discountCode: discountCode?.code,
+                giftCardCodes: giftCards.map((gc) => gc.code),
+                customerName: formData.customerName?.trim(),
+                customerEmail: formData.customerEmail?.trim(),
+                customerPhone: formData.customerPhone?.trim(),
+                comment: formData.comment?.trim(),
+                paymentMethod: "gift_card",
+                ...(upsellSelections.length > 0 && { upsellSelections }),
+            };
+            const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/create-gift-card-booking"), {
+                method: "POST",
+                headers: createApiHeaders(config),
+                body: JSON.stringify(createRequestBody(config, requestData)),
+            });
+            const data = await response.json();
+            if (response.ok) {
+                onSuccess({
+                    booking: data.booking,
+                    order: data.order,
+                    giftCardRedemptions: data.giftCardRedemptions,
+                });
+            }
+            else {
+                setError(data.error || t("error.createBooking"));
+                onError(data.error || t("error.createBooking"));
+            }
+        }
+        catch (err) {
+            setError(err.message || t("error.createBooking"));
+            onError(err.message || t("error.createBooking"));
+        }
+        finally {
+            setIsLoading(false);
+        }
+    };
+    const totalGiftCardAmount = giftCards.reduce((sum, gc) => sum + (gc.balanceToUse || gc.discountAmount || 0), 0);
+    return (jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "16px" }, children: [jsxRuntime.jsxs("div", { style: {
+                    backgroundColor: "rgba(var(--bw-success-color), 0.15)",
+                    border: "1px solid rgba(var(--bw-success-color), 0.4)",
+                    borderRadius: "var(--bw-border-radius)",
+                    padding: "16px",
+                }, children: [jsxRuntime.jsxs("div", { style: {
+                            display: "flex",
+                            alignItems: "center",
+                            gap: "8px",
+                            marginBottom: "8px",
+                            color: "var(--bw-success-color)",
+                            fontFamily: "var(--bw-font-family)",
+                            fontWeight: 600,
+                        }, children: ["\uD83C\uDF81 ", t("payment.giftCardCovered")] }), jsxRuntime.jsx("div", { style: {
+                            fontSize: "16px",
+                            color: "var(--bw-text-muted)",
+                            fontFamily: "var(--bw-font-family)",
+                        }, children: t("payment.giftCardBalance", { amount: formatCurrency(totalGiftCardAmount) }) })] }), error && (jsxRuntime.jsxs("div", { style: {
+                    backgroundColor: "rgba(var(--bw-error-color), 0.15)",
+                    border: "1px solid rgba(var(--bw-error-color), 0.4)",
+                    borderRadius: "var(--bw-border-radius)",
+                    padding: "16px",
+                    color: "var(--bw-error-color)",
+                    fontSize: "16px",
+                    fontFamily: "var(--bw-font-family)",
+                }, children: ["\u26A0\uFE0F ", error] })), jsxRuntime.jsx("button", { type: "button", onClick: handleBooking, disabled: isLoading, style: {
+                    width: "100%",
+                    padding: "12px 24px",
+                    backgroundColor: "var(--bw-highlight-color)",
+                    color: "#ffffff",
+                    border: "none",
+                    borderRadius: "var(--bw-border-radius)",
+                    fontSize: "16px",
+                    fontWeight: 600,
+                    fontFamily: "var(--bw-font-family)",
+                    transition: "all 0.2s ease",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    gap: "8px",
+                    cursor: isLoading ? "not-allowed" : "pointer",
+                    opacity: isLoading ? 0.6 : 1,
+                }, children: isLoading ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [spinner("#ffffff"), t("button.creatingBooking")] })) : (t("button.bookWithGiftCard")) })] }));
+}
+/**
+ * Calculate whether gift cards fully cover the order after discounts.
+ */
+function isGiftCardFullyCovered(giftCards, eventPrice, participantCount, discountAmount) {
+    const totalGiftCardAmount = giftCards.reduce((sum, gc) => sum + (gc.balanceToUse || gc.discountAmount || 0), 0);
+    const baseTotal = eventPrice * participantCount;
+    const amountAfterDiscount = Math.max(0, baseTotal - discountAmount);
+    return totalGiftCardAmount >= amountAfterDiscount && amountAfterDiscount > 0;
+}
+
 const mollieLocaleMap = {
     de: "de_DE",
     en: "en_US",
@@ -4478,13 +4580,8 @@ function MolliePaymentForm({ config, eventDetails, formData, totalAmount, discou
     const mollieRef = React.useRef(null);
     const cardFormRef = React.useRef(null);
     const cardContainerRef = React.useRef(null);
-    const totalGiftCardAmount = giftCards.reduce((sum, gc) => sum + (gc.balanceToUse || gc.discountAmount || 0), 0);
-    const baseTotal = eventDetails?.price
-        ? eventDetails.price * (formData.participants?.filter((p) => p.name?.trim()).length || 0)
-        : 0;
-    const discountAmount = discountCode?.discountAmount || 0;
-    const amountAfterDiscount = Math.max(0, baseTotal - discountAmount);
-    const isFullyCoveredByGiftCards = totalGiftCardAmount >= amountAfterDiscount && amountAfterDiscount > 0;
+    const participantCount = formData.participants?.filter((p) => p.name?.trim()).length || 0;
+    const isFullyCoveredByGiftCards = isGiftCardFullyCovered(giftCards, eventDetails?.price || 0, participantCount, discountCode?.discountAmount || 0);
     const isCreditCard = selectedMethod === "creditcard";
     React.useEffect(() => {
         if (isFullyCoveredByGiftCards)
@@ -4591,7 +4688,7 @@ function MolliePaymentForm({ config, eventDetails, formData, totalAmount, discou
         };
     }, [isCreditCard, mollieProfileId, mollieTestmode, isFullyCoveredByGiftCards]);
     if (isFullyCoveredByGiftCards && totalAmount <= 0) {
-        return null;
+        return (jsxRuntime.jsx(GiftCardOnlyBooking, { config: config, eventDetails: eventDetails, formData: formData, discountCode: discountCode, giftCards: giftCards, onSuccess: _onSuccess, onError: onError, upsellSelections: upsellSelections }));
     }
     const validateBeforePayment = () => {
         const participantCount = formData.participants.filter((p) => p.name?.trim()).length;
@@ -4633,7 +4730,7 @@ function MolliePaymentForm({ config, eventDetails, formData, totalAmount, discou
             }
             const { token, error: tokenError } = await mollieRef.current.createToken();
             if (tokenError || !token) {
-                setPaymentError(tokenError?.message || t("error.createPaymentIntent"));
+                setPaymentError(tokenError?.message || t("error.createPayment"));
                 return;
             }
             const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/create-mollie-payment"), {
@@ -4649,8 +4746,8 @@ function MolliePaymentForm({ config, eventDetails, formData, totalAmount, discou
                 _onSuccess({ paymentIntent: { id: data.molliePaymentId } });
             }
             else {
-                setPaymentError(data.error || t("error.createPaymentIntent"));
-                onError(data.error || t("error.createPaymentIntent"));
+                setPaymentError(data.error || t("error.createPayment"));
+                onError(data.error || t("error.createPayment"));
             }
         }
         catch (err) {
@@ -4682,8 +4779,8 @@ function MolliePaymentForm({ config, eventDetails, formData, totalAmount, discou
                 window.location.href = data.checkoutUrl;
             }
             else {
-                setPaymentError(data.error || t("error.createPaymentIntent"));
-                onError(data.error || t("error.createPaymentIntent"));
+                setPaymentError(data.error || t("error.createPayment"));
+                onError(data.error || t("error.createPayment"));
             }
         }
         catch (err) {
@@ -6153,106 +6250,6 @@ var reactStripe_umd = {exports: {}};
 
 var reactStripe_umdExports = reactStripe_umd.exports;
 
-// Component for bookings fully covered by gift cards (no Stripe payment needed)
-function GiftCardOnlyBooking({ config, eventDetails, formData, discountCode, giftCards, onSuccess, onError, upsellSelections = [], }) {
-    const t = useTranslations();
-    const [isLoading, setIsLoading] = React.useState(false);
-    const [error, setError] = React.useState(null);
-    const handleBooking = async () => {
-        setIsLoading(true);
-        setError(null);
-        try {
-            const requestData = {
-                eventInstanceId: config.eventInstanceId || eventDetails.id,
-                organizationId: config.organizationId,
-                participants: formData.participants.filter((p) => p.name?.trim()),
-                discountCode: discountCode?.code,
-                giftCardCodes: giftCards.map((gc) => gc.code),
-                customerName: formData.customerName?.trim(),
-                customerEmail: formData.customerEmail?.trim(),
-                customerPhone: formData.customerPhone?.trim(),
-                comment: formData.comment?.trim(),
-                paymentMethod: "gift_card",
-                ...(upsellSelections.length > 0 && { upsellSelections }),
-            };
-            const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/create-gift-card-booking"), {
-                method: "POST",
-                headers: createApiHeaders(config),
-                body: JSON.stringify(createRequestBody(config, requestData)),
-            });
-            const data = await response.json();
-            if (response.ok) {
-                onSuccess({
-                    booking: data.booking,
-                    order: data.order,
-                    giftCardRedemptions: data.giftCardRedemptions,
-                });
-            }
-            else {
-                setError(data.error || t("error.createBooking"));
-                onError(data.error || t("error.createBooking"));
-            }
-        }
-        catch (err) {
-            setError(err.message || t("error.createBooking"));
-            onError(err.message || t("error.createBooking"));
-        }
-        finally {
-            setIsLoading(false);
-        }
-    };
-    const totalGiftCardAmount = giftCards.reduce((sum, gc) => sum + (gc.balanceToUse || gc.discountAmount || 0), 0);
-    return (jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "16px" }, children: [jsxRuntime.jsxs("div", { style: {
-                    backgroundColor: "rgba(var(--bw-success-color), 0.15)",
-                    border: "1px solid rgba(var(--bw-success-color), 0.4)",
-                    borderRadius: "var(--bw-border-radius)",
-                    padding: "16px",
-                }, children: [jsxRuntime.jsxs("div", { style: {
-                            display: "flex",
-                            alignItems: "center",
-                            gap: "8px",
-                            marginBottom: "8px",
-                            color: "var(--bw-success-color)",
-                            fontFamily: "var(--bw-font-family)",
-                            fontWeight: 600,
-                        }, children: ["\uD83C\uDF81 ", t("payment.giftCardCovered")] }), jsxRuntime.jsx("div", { style: {
-                            fontSize: "16px",
-                            color: "var(--bw-text-muted)",
-                            fontFamily: "var(--bw-font-family)",
-                        }, children: t("payment.giftCardBalance", { amount: formatCurrency(totalGiftCardAmount) }) })] }), error && (jsxRuntime.jsxs("div", { style: {
-                    backgroundColor: "rgba(var(--bw-error-color), 0.15)",
-                    border: "1px solid rgba(var(--bw-error-color), 0.4)",
-                    borderRadius: "var(--bw-border-radius)",
-                    padding: "16px",
-                    color: "var(--bw-error-color)",
-                    fontSize: "16px",
-                    fontFamily: "var(--bw-font-family)",
-                }, children: ["\u26A0\uFE0F ", error] })), jsxRuntime.jsx("button", { type: "button", onClick: handleBooking, disabled: isLoading, style: {
-                    width: "100%",
-                    padding: "12px 24px",
-                    backgroundColor: "var(--bw-highlight-color)",
-                    color: "#ffffff",
-                    border: "none",
-                    borderRadius: "var(--bw-border-radius)",
-                    fontSize: "16px",
-                    fontWeight: 600,
-                    fontFamily: "var(--bw-font-family)",
-                    transition: "all 0.2s ease",
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    gap: "8px",
-                    cursor: isLoading ? "not-allowed" : "pointer",
-                    opacity: isLoading ? 0.6 : 1,
-                }, children: isLoading ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { style: {
-                                width: "16px",
-                                height: "16px",
-                                border: "2px solid #ffffff",
-                                borderTopColor: "transparent",
-                                borderRadius: "50%",
-                                animation: "spin 1s linear infinite",
-                            } }), t("button.creatingBooking")] })) : (t("button.bookWithGiftCard")) })] }));
-}
 // Inner component that uses the Stripe hooks
 function PaymentFormInner({ config, eventDetails, formData, totalAmount, onSuccess, onError, }) {
     const t = useTranslations();
@@ -6289,7 +6286,7 @@ function PaymentFormInner({ config, eventDetails, formData, totalAmount, onSucce
                 redirect: "if_required",
             });
             if (error) {
-                console.error("[PAYMENT_FORM] Payment confirmation error:", {
+                console.error("[STRIPE_PAYMENT] Payment confirmation error:", {
                     type: error.type,
                     code: error.code,
                     message: error.message,
@@ -6365,8 +6362,7 @@ function PaymentFormInner({ config, eventDetails, formData, totalAmount, onSucce
                         ? t("button.depositAndBook")
                         : t("button.bookNow") })) })] }));
 }
-// Main PaymentForm component that handles payment intent creation and Elements wrapper
-function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode, giftCards, onSuccess, onError, systemConfig, stripePromise, stripeAppearance, upsellSelections = [], }) {
+function StripePaymentForm({ config, eventDetails, formData, totalAmount, discountCode, giftCards, onSuccess, onError, systemConfig, stripePromise, stripeAppearance, upsellSelections = [], }) {
     const t = useTranslations();
     const [clientSecret, setClientSecret] = React.useState(null);
     const [paymentIntentId, setPaymentIntentId] = React.useState(null);
@@ -6427,7 +6423,7 @@ function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode
         }
     }, [paymentIntentId]);
     React.useEffect(() => {
-        const createPaymentIntent = async () => {
+        const createStripePayment = async () => {
             if (!systemConfig || !eventDetails || !formData.participants?.length) {
                 return;
             }
@@ -6468,35 +6464,38 @@ function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode
                 if (!requestData.customerEmail) {
                     throw new Error("Customer email is required");
                 }
-                const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/create-payment-intent"), {
+                const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/create-stripe-payment"), {
                     method: "POST",
                     headers: createApiHeaders(config),
                     body: JSON.stringify(createRequestBody(config, requestData)),
                 });
                 const data = await response.json();
                 if (response.ok) {
+                    if (data.stalePaymentIntent) {
+                        clearPersistedPaymentIntent();
+                    }
                     setClientSecret(data.clientSecret);
                     setPaymentIntentId(data.paymentIntentId);
                 }
                 else {
-                    console.error("[PAYMENT_FORM] Payment intent creation failed:", {
+                    console.error("[STRIPE_PAYMENT] Payment creation failed:", {
                         status: response.status,
                         error: data.error,
                         details: data.details,
                         requestData: { ...requestData, customerEmail: "[redacted]" },
                     });
-                    setPaymentError(data.error || t("error.createPaymentIntent"));
+                    setPaymentError(data.error || t("error.createPayment"));
                 }
             }
             catch (err) {
-                console.error("[PAYMENT_FORM] Payment intent creation error:", err);
-                setPaymentError(err.message || t("error.createPaymentIntent"));
+                console.error("[STRIPE_PAYMENT] Payment creation error:", err);
+                setPaymentError(err.message || t("error.createPayment"));
             }
             finally {
                 setIsCreatingPaymentIntent(false);
             }
         };
-        const timer = setTimeout(createPaymentIntent, 500);
+        const timer = setTimeout(createStripePayment, 500);
         return () => clearTimeout(timer);
     }, [
         systemConfig,
@@ -6504,19 +6503,15 @@ function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode
         formData.participants,
         formData.customerEmail,
         formData.customerName,
+        formData.comment,
         totalAmount,
         discountCode,
         giftCards,
         config,
         upsellSelections,
     ]);
-    const totalGiftCardAmount = giftCards.reduce((sum, gc) => sum + (gc.balanceToUse || gc.discountAmount || 0), 0);
-    const baseTotal = eventDetails?.price
-        ? eventDetails.price * (formData.participants?.filter((p) => p.name?.trim()).length || 0)
-        : 0;
-    const discountAmount = discountCode?.discountAmount || 0;
-    const amountAfterDiscount = Math.max(0, baseTotal - discountAmount);
-    const isFullyCoveredByGiftCards = totalGiftCardAmount >= amountAfterDiscount && amountAfterDiscount > 0;
+    const participantCount = formData.participants?.filter((p) => p.name?.trim()).length || 0;
+    const isFullyCoveredByGiftCards = isGiftCardFullyCovered(giftCards, eventDetails?.price || 0, participantCount, discountCode?.discountAmount || 0);
     if (isFullyCoveredByGiftCards && totalAmount <= 0) {
         return (jsxRuntime.jsx(GiftCardOnlyBooking, { config: config, eventDetails: eventDetails, formData: formData, discountCode: discountCode, giftCards: giftCards, onSuccess: onSuccess, onError: onError, upsellSelections: upsellSelections }));
     }
@@ -11026,13 +11021,6 @@ function mergeStyles(...styles) {
     return Object.assign({}, ...styles.filter(Boolean));
 }
 
-function getEffectivePrice(upsell, round) {
-    const dp = upsell.discountPercent ?? 0;
-    if (dp <= 0)
-        return upsell.price;
-    const raw = Math.round(upsell.price * (100 - dp) / 100);
-    return round ? Math.floor(raw / 100) * 100 : raw;
-}
 // Local style aliases from shared styles
 const cardStyles = cardStyles$1.base;
 const sectionHeaderStyles = sectionStyles.header;
@@ -11044,6 +11032,11 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     const { locale } = useLocale();
     const timezone = useTimezone();
     const roundEnabled = systemConfig?.roundPricesEnabled !== false;
+    const roundDiscountUp = (minorUnits) => Math.ceil(minorUnits / 100) * 100;
+    const calcPercentDiscountAmount = (baseAmount, basisPoints, round) => {
+        const raw = Math.round((baseAmount * basisPoints) / 10000);
+        return round ? roundDiscountUp(raw) : raw;
+    };
     const [appliedVouchers, setAppliedVouchers] = React.useState([]);
     const paymentSectionRef = React.useRef(null);
     // Payment option: "deposit" or "full" - only relevant when deposit is available
@@ -11065,6 +11058,8 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
     const watchedParticipants = form.watch("participants");
     const watchedCustomerName = form.watch("customerName");
     const watchedCustomerEmail = form.watch("customerEmail");
+    const watchedComment = form.watch("comment");
+    const watchedCustomerPhone = form.watch("customerPhone");
     const customerNameError = form.formState.errors.customerName;
     const customerEmailError = form.formState.errors.customerEmail;
     const watchedAcceptTerms = form.watch("acceptTerms");
@@ -11114,7 +11109,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                 participantUpsellIds.forEach(upsellId => {
                     const upsell = upsells.find(u => u.id === upsellId);
                     if (upsell) {
-                        total += getEffectivePrice(upsell, roundEnabled);
+                        total += upsell.price;
                     }
                 });
             }
@@ -11176,6 +11171,13 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
             participantIndices,
         }));
     }, [participantUpsells, watchedParticipants]);
+    const paymentFormData = React.useMemo(() => ({
+        customerName: watchedCustomerName,
+        customerEmail: watchedCustomerEmail,
+        customerPhone: watchedCustomerPhone,
+        participants: watchedParticipants,
+        comment: watchedComment,
+    }), [watchedCustomerName, watchedCustomerEmail, watchedCustomerPhone, watchedParticipants, watchedComment]);
     const appliedDiscountCode = appliedVouchers.find((v) => v.type === "discount");
     const appliedGiftCards = appliedVouchers.filter((v) => v.type === "giftCard");
     const handleVoucherValidated = React.useCallback((voucher, _error) => {
@@ -11212,7 +11214,10 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                     // TODO: discounts currently apply to base total only; extend when discount-applies-to-upsells flag is added
                     let newDiscountAmount = 0;
                     if (voucher.discountType === "percentage") {
-                        newDiscountAmount = Math.round((newBaseTotal * (voucher.discountValue || 0)) / 10000);
+                        newDiscountAmount = calcPercentDiscountAmount(newBaseTotal, voucher.discountValue || 0, roundEnabled);
+                        if (voucher.restrictions?.maxDiscount) {
+                            newDiscountAmount = Math.min(newDiscountAmount, voucher.restrictions.maxDiscount);
+                        }
                     }
                     else {
                         newDiscountAmount = voucher.discountValue || 0;
@@ -11390,7 +11395,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                                                         padding: 0,
                                                                     }, children: "\u00D7" })] }))] }), upsells.length > 0 && (jsxRuntime.jsx("div", { style: participantUpsellStyles.container, children: upsells.map((upsell) => {
                                                         const isSelected = (participantUpsells[index] || []).includes(upsell.id);
-                                                        return (jsxRuntime.jsxs("label", { htmlFor: `upsell-${index}-${upsell.id}`, style: isSelected ? participantUpsellStyles.labelSelected : participantUpsellStyles.label, children: [jsxRuntime.jsx("input", { id: `upsell-${index}-${upsell.id}`, type: "checkbox", style: participantUpsellStyles.checkbox, checked: isSelected, onChange: () => toggleParticipantUpsell(index, upsell.id) }), jsxRuntime.jsx("span", { style: { fontWeight: 500 }, children: upsell.name }), jsxRuntime.jsxs("span", { style: { fontSize: "12px", opacity: 0.8 }, children: ["(+", formatCurrency(getEffectivePrice(upsell, roundEnabled)), ")"] })] }, upsell.id));
+                                                        return (jsxRuntime.jsxs("label", { htmlFor: `upsell-${index}-${upsell.id}`, style: isSelected ? participantUpsellStyles.labelSelected : participantUpsellStyles.label, children: [jsxRuntime.jsx("input", { id: `upsell-${index}-${upsell.id}`, type: "checkbox", style: participantUpsellStyles.checkbox, checked: isSelected, onChange: () => toggleParticipantUpsell(index, upsell.id) }), jsxRuntime.jsx("span", { style: { fontWeight: 500 }, children: upsell.name }), jsxRuntime.jsxs("span", { style: { fontSize: "12px", opacity: 0.8 }, children: ["(+", formatCurrency(upsell.price), ")"] })] }, upsell.id));
                                                     }) }))] }, index))), watchedParticipants.length < eventDetails.availableSpots ? (jsxRuntime.jsx("div", { style: {
                                                 display: "flex",
                                                 flexDirection: "column",
@@ -11422,7 +11427,7 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                                             const countWithUpsell = watchedParticipants.filter((p, idx) => p.name.trim() && (participantUpsells[idx] || []).includes(upsell.id)).length;
                                                             if (countWithUpsell === 0)
                                                                 return null;
-                                                            const upsellLineTotal = getEffectivePrice(upsell, roundEnabled) * countWithUpsell;
+                                                            const upsellLineTotal = upsell.price * countWithUpsell;
                                                             return (jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: "13px" }, children: [jsxRuntime.jsxs("span", { style: { color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+ ", upsell.name, " (", countWithUpsell, "\u00D7)"] }), jsxRuntime.jsx("span", { style: { color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: formatCurrency(upsellLineTotal) })] }, upsell.id));
                                                         })] })), appliedVouchers.length > 0 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [jsxRuntime.jsx("span", { style: { color: "var(--bw-text-muted)", fontFamily: "var(--bw-font-family)" }, children: t$1("summary.subtotal") }), jsxRuntime.jsx("span", { style: {
                                                                         fontFamily: "var(--bw-font-family)",
@@ -11565,9 +11570,9 @@ function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError,
                                                 }
                                                 : null;
                                             if (systemConfig?.paymentProvider === "mollie") {
-                                                return (jsxRuntime.jsxs("div", { style: cardStyles, children: [jsxRuntime.jsx("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), jsxRuntime.jsx(MolliePaymentForm, { config: config, eventDetails: eventDetails, formData: form.getValues(), totalAmount: paymentAmount, discountCode: discountCodeProp, giftCards: appliedGiftCards, onSuccess: onSuccess, onError: onError, upsellSelections: aggregatedUpsellSelections(), mollieProfileId: systemConfig?.mollieProfileId, mollieTestmode: systemConfig?.mollieTestmode })] }));
+                                                return (jsxRuntime.jsxs("div", { style: cardStyles, children: [jsxRuntime.jsx("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), jsxRuntime.jsx(MolliePaymentForm, { config: config, eventDetails: eventDetails, formData: paymentFormData, totalAmount: paymentAmount, discountCode: discountCodeProp, giftCards: appliedGiftCards, onSuccess: onSuccess, onError: onError, upsellSelections: aggregatedUpsellSelections(), mollieProfileId: systemConfig?.mollieProfileId, mollieTestmode: systemConfig?.mollieTestmode })] }));
                                             }
-                                            return (jsxRuntime.jsxs("div", { style: cardStyles, children: [jsxRuntime.jsx("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), jsxRuntime.jsx(PaymentForm, { config: config, eventDetails: eventDetails, formData: form.getValues(), totalAmount: paymentAmount, discountCode: discountCodeProp, giftCards: appliedGiftCards, onSuccess: onSuccess, onError: onError, systemConfig: systemConfig ?? null, stripePromise: stripePromise, stripeAppearance: stripeAppearance, upsellSelections: aggregatedUpsellSelections() })] }));
+                                            return (jsxRuntime.jsxs("div", { style: cardStyles, children: [jsxRuntime.jsx("h2", { style: { ...sectionHeaderStyles }, children: t$1("summary.payment") }), jsxRuntime.jsx(StripePaymentForm, { config: config, eventDetails: eventDetails, formData: paymentFormData, totalAmount: paymentAmount, discountCode: discountCodeProp, giftCards: appliedGiftCards, onSuccess: onSuccess, onError: onError, systemConfig: systemConfig ?? null, stripePromise: stripePromise, stripeAppearance: stripeAppearance, upsellSelections: aggregatedUpsellSelections() })] }));
                                         })() })] })] })] }) }));
 }
 
@@ -11701,7 +11706,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
         if (targetPaymentIntentId) {
             setIsLoading(true);
             try {
-                const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/get-booking-by-payment-intent"), {
+                const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/get-booking-by-payment"), {
                     method: "POST",
                     headers: createApiHeaders(config),
                     body: JSON.stringify(createRequestBody(config, {
@@ -11717,7 +11722,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
                         orderItems: data.orderItems,
                         purchases: data.purchases || [],
                         discount: data.discount || null,
-                        stripePaymentIntent: data.stripePaymentIntent,
+                        providerPaymentDetails: data.stripePaymentIntent,
                     });
                     setEventDetails({
                         id: data.booking.eventInstance.id,
@@ -11725,7 +11730,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
                         description: data.booking.eventInstance.eventType.description,
                         startTime: data.booking.eventInstance.startTime,
                         endTime: data.booking.eventInstance.endTime,
-                        price: data.booking.eventInstance.price || 0, // Use actual event instance price
+                        price: data.booking.eventInstance.price || 0,
                     });
                     setFormData({
                         customerEmail: data.booking.customerEmail,
@@ -11733,9 +11738,7 @@ const BookingSuccessModal = ({ isOpen, onClose, config, onError, paymentIntentId
                         customerPhone: data.booking.customerPhone,
                         participants: data.booking.participants || [],
                     });
-                    // Set payment status from Stripe data or order status
                     setPaymentStatus(data.stripePaymentIntent?.status || data.order.status);
-                    // Trigger Google Ads conversion tracking if payment is successful
                     const finalPaymentStatus = data.stripePaymentIntent?.status || data.order.status;
                     if (finalPaymentStatus === "succeeded" &&
                         config.googleAds?.tagId &&
@@ -13685,11 +13688,10 @@ function formatUnavailableReason(reason, t) {
             return t("upsells.reason.notEnoughSpots", { eventTypeName: reason.eventTypeName });
     }
 }
-function UpsellCard({ upsell, isSelected, participantCount, onSelect, roundPricesEnabled = true, }) {
+function UpsellCard({ upsell, isSelected, participantCount, onSelect, }) {
     const t = useTranslations();
     const { locale } = useLocale();
-    const effectivePrice = getEffectiveUpsellPrice(upsell, roundPricesEnabled);
-    const totalPrice = effectivePrice * participantCount;
+    const totalPrice = upsell.price * participantCount;
     const isDisabled = !upsell.available;
     const getCardStyles = () => {
         if (isDisabled)
@@ -13707,19 +13709,12 @@ function UpsellCard({ upsell, isSelected, participantCount, onSelect, roundPrice
                                         weekday: "short",
                                         day: "numeric",
                                         month: "short",
-                                    })] }), jsxRuntime.jsx("span", { style: { color: "var(--bw-text-muted)" }, children: t("upsells.spotsFree", { count: upsell.suggestedEventInstance.availableSpots }) })] }))] }), jsxRuntime.jsxs("div", { style: priceContainerStyles, children: [jsxRuntime.jsxs("span", { style: pricePerPersonStyles, children: [formatCurrency(effectivePrice), "/", t("common.perPerson")] }), participantCount > 1 && (jsxRuntime.jsxs("span", { style: priceTotalStyles, children: ["= ", formatCurrency(totalPrice)] }))] }), isDisabled && (jsxRuntime.jsx("div", { style: unavailableOverlayStyles, children: jsxRuntime.jsx("span", { children: upsell.unavailableReason
+                                    })] }), jsxRuntime.jsx("span", { style: { color: "var(--bw-text-muted)" }, children: t("upsells.spotsFree", { count: upsell.suggestedEventInstance.availableSpots }) })] }))] }), jsxRuntime.jsxs("div", { style: priceContainerStyles, children: [jsxRuntime.jsxs("span", { style: pricePerPersonStyles, children: [formatCurrency(upsell.price), "/", t("common.perPerson")] }), participantCount > 1 && (jsxRuntime.jsxs("span", { style: priceTotalStyles, children: ["= ", formatCurrency(totalPrice)] }))] }), isDisabled && (jsxRuntime.jsx("div", { style: unavailableOverlayStyles, children: jsxRuntime.jsx("span", { children: upsell.unavailableReason
                         ? formatUnavailableReason(upsell.unavailableReason, t)
                         : t("upsells.notAvailable") }) }))] }));
 }
 
-function getEffectiveUpsellPrice(upsell, round = true) {
-    const dp = upsell.discountPercent ?? 0;
-    if (dp <= 0)
-        return upsell.price;
-    const raw = Math.round(upsell.price * (100 - dp) / 100);
-    return round ? Math.floor(raw / 100) * 100 : raw;
-}
-function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, isOpen, onClose, onSelect, onContinue, onBack, roundPricesEnabled = true, }) {
+function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, isOpen, onClose, onSelect, onContinue, onBack, }) {
     const t = useTranslations();
     const selectUpsell = (upsellId) => {
         const exists = selectedUpsells.find((s) => s.upsellPackageId === upsellId);
@@ -13738,7 +13733,7 @@ function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, is
         return selectedUpsells.reduce((total, selection) => {
             const upsell = upsells.find((u) => u.id === selection.upsellPackageId);
             if (upsell) {
-                return total + getEffectiveUpsellPrice(upsell, roundPricesEnabled) * selection.quantity;
+                return total + upsell.price * selection.quantity;
             }
             return total;
         }, 0);
@@ -13746,7 +13741,7 @@ function UpsellsStep({ upsells, selectedUpsells, participantCount, isLoading, is
     const selectedTotal = calculateTotal();
     const selectedCount = selectedUpsells.length;
     const footerContent = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("button", { type: "button", onClick: onBack, style: mergeStyles(buttonStyles.secondary, buttonStyles.fullWidth), children: t("common.back") }), jsxRuntime.jsx("button", { type: "button", onClick: onContinue, style: mergeStyles(buttonStyles.primary, buttonStyles.fullWidth), children: selectedCount === 0 ? t("button.continueWithout") : t("button.continue") })] }));
-    return (jsxRuntime.jsx(Sidebar, { isOpen: isOpen, onClose: onClose, title: t("upsells.title"), footer: footerContent, children: jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%", padding: "16px 16px" }, children: [isLoading && (jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "12px", padding: "40px 20px", ...textStyles.muted }, children: [spinner(), jsxRuntime.jsx("span", { children: t("upsells.loading") })] })), !isLoading && upsells.length === 0 && (jsxRuntime.jsx("div", { style: { textAlign: "center", padding: "40px 20px", ...textStyles.muted }, children: jsxRuntime.jsx("p", { children: t("upsells.noExtras") }) })), !isLoading && upsells.length > 0 && (jsxRuntime.jsx("div", { style: { display: "flex", flexDirection: "column", gap: "12px", flex: 1, overflowY: "auto", paddingBottom: "16px" }, children: upsells.map((upsell) => (jsxRuntime.jsx(UpsellCard, { upsell: upsell, isSelected: isSelected(upsell.id), participantCount: participantCount, onSelect: () => selectUpsell(upsell.id), roundPricesEnabled: roundPricesEnabled }, upsell.id))) })), selectedCount > 0 && (jsxRuntime.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: [jsxRuntime.jsx("span", { style: textStyles.muted, children: selectedCount === 1 ? t("upsells.selected", { count: selectedCount }) : t("upsells.selectedPlural", { count: selectedCount }) }), jsxRuntime.jsxs("span", { style: { fontWeight: 600, color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+", formatCurrency(selectedTotal)] })] }))] }) }));
+    return (jsxRuntime.jsx(Sidebar, { isOpen: isOpen, onClose: onClose, title: t("upsells.title"), footer: footerContent, children: jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%", padding: "16px 16px" }, children: [isLoading && (jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "12px", padding: "40px 20px", ...textStyles.muted }, children: [spinner(), jsxRuntime.jsx("span", { children: t("upsells.loading") })] })), !isLoading && upsells.length === 0 && (jsxRuntime.jsx("div", { style: { textAlign: "center", padding: "40px 20px", ...textStyles.muted }, children: jsxRuntime.jsx("p", { children: t("upsells.noExtras") }) })), !isLoading && upsells.length > 0 && (jsxRuntime.jsx("div", { style: { display: "flex", flexDirection: "column", gap: "12px", flex: 1, overflowY: "auto", paddingBottom: "16px" }, children: upsells.map((upsell) => (jsxRuntime.jsx(UpsellCard, { upsell: upsell, isSelected: isSelected(upsell.id), participantCount: participantCount, onSelect: () => selectUpsell(upsell.id) }, upsell.id))) })), selectedCount > 0 && (jsxRuntime.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: [jsxRuntime.jsx("span", { style: textStyles.muted, children: selectedCount === 1 ? t("upsells.selected", { count: selectedCount }) : t("upsells.selectedPlural", { count: selectedCount }) }), jsxRuntime.jsxs("span", { style: { fontWeight: 600, color: "var(--bw-highlight-color)", fontFamily: "var(--bw-font-family)" }, children: ["+", formatCurrency(selectedTotal)] })] }))] }) }));
 }
 
 // Main widget component
@@ -13792,7 +13787,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
     const [isLoadingShowAll, setIsLoadingShowAll] = React.useState(false);
     const [error, setError] = React.useState(null);
     const [isSuccess, setIsSuccess] = React.useState(false);
-    const [successPaymentIntentId, setSuccessPaymentIntentId] = React.useState(null);
+    const [successPaymentId, setSuccessPaymentId] = React.useState(null);
     const [systemConfig, setSystemConfig] = React.useState(null);
     // PERFORMANCE OPTIMIZATION: Lazy component loading
     const [shouldRenderInstanceSelection, setShouldRenderInstanceSelection] = React.useState(false);
@@ -13858,7 +13853,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
             const stripeReturn = detectStripeReturn();
             if (stripeReturn) {
                 if (stripeReturn.redirectStatus === "succeeded") {
-                    setSuccessPaymentIntentId(stripeReturn.paymentIntent);
+                    setSuccessPaymentId(stripeReturn.paymentIntent);
                     setIsSuccess(true);
                 }
                 else if (stripeReturn.redirectStatus === "failed") {
@@ -14213,7 +14208,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
     };
     const handleBookingSuccess = (result) => {
         setIsSuccess(true);
-        setSuccessPaymentIntentId(result.paymentIntent.id);
+        setSuccessPaymentId(result.paymentIntent.id);
         setSidebarOpen(false);
         setShouldRenderBookingForm(false);
         config.onSuccess?.(result);
@@ -14411,7 +14406,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 setIsSuccess(false);
                                 setCurrentStep("eventTypes");
                                 setShowingPreview(true);
-                                setSuccessPaymentIntentId(null);
+                                setSuccessPaymentId(null);
                                 setShouldRenderInstanceSelection(false);
                                 setShouldRenderUpsells(false);
                                 setShouldRenderBookingForm(false);
@@ -14422,7 +14417,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 url.searchParams.delete("payment_intent_client_secret");
                                 url.searchParams.delete("redirect_status");
                                 window.history.replaceState({}, "", url.toString());
-                            }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
     }
     if (viewMode === "next-events" && !showingPreview && currentStep === "eventInstances") {
         return (jsxRuntime.jsxs(StyleProvider, { config: config, children: [jsxRuntime.jsxs("div", { ref: setWidgetContainerRef, children: [shouldRenderInstanceSelection && (jsxRuntime.jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => {
@@ -14435,7 +14430,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 setIsSuccess(false);
                                 setCurrentStep("eventTypes");
                                 setShowingPreview(true);
-                                setSuccessPaymentIntentId(null);
+                                setSuccessPaymentId(null);
                                 setShouldRenderInstanceSelection(false);
                                 setShouldRenderBookingForm(false);
                                 const url = new URL(window.location.href);
@@ -14443,7 +14438,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 url.searchParams.delete("payment_intent_client_secret");
                                 url.searchParams.delete("redirect_status");
                                 window.history.replaceState({}, "", url.toString());
-                            }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
     }
     if (viewMode === "button" && (isSingleEventTypeMode || isDirectInstanceMode)) {
         return (jsxRuntime.jsxs(StyleProvider, { config: config, children: [jsxRuntime.jsxs("div", { ref: setWidgetContainerRef, style: {
@@ -14472,11 +14467,11 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                     setShouldRenderInstanceSelection(true);
                                 }
                             }, children: config.buttonText ||
-                                (isDirectInstanceMode ? t("button.bookNow") : t("button.selectDate")) }), shouldRenderInstanceSelection && (jsxRuntime.jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen && currentStep === "eventInstances", onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsxRuntime.jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack, roundPricesEnabled: systemConfig?.roundPricesEnabled !== false })), shouldRenderBookingForm && eventDetails && (jsxRuntime.jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), onBackToEventTypes: () => setSidebarOpen(false), selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), systemConfig: systemConfig, selectedUpsells: selectedUpsells, upsells: upsells })), jsxRuntime.jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
+                                (isDirectInstanceMode ? t("button.bookNow") : t("button.selectDate")) }), shouldRenderInstanceSelection && (jsxRuntime.jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen && currentStep === "eventInstances", onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsxRuntime.jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack })), shouldRenderBookingForm && eventDetails && (jsxRuntime.jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), onBackToEventTypes: () => setSidebarOpen(false), selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: () => setCurrentStep(isDirectInstanceMode ? "eventTypes" : "eventInstances"), systemConfig: systemConfig, selectedUpsells: selectedUpsells, upsells: upsells })), jsxRuntime.jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
                                 setIsSuccess(false);
                                 setCurrentStep("eventTypes");
                                 setSidebarOpen(false);
-                                setSuccessPaymentIntentId(null);
+                                setSuccessPaymentId(null);
                                 setShouldRenderInstanceSelection(false);
                                 setShouldRenderUpsells(false);
                                 setShouldRenderBookingForm(false);
@@ -14487,7 +14482,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                                 url.searchParams.delete("payment_intent_client_secret");
                                 url.searchParams.delete("redirect_status");
                                 window.history.replaceState({}, "", url.toString());
-                            }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                            }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
     }
     // Cards mode (default) - show event type selection
     const cardsView = (jsxRuntime.jsx(EventTypeSelection, { eventTypes: eventTypes, onEventTypeSelect: handleEventTypeSelect, isLoading: isLoading, skeletonCount: getSkeletonCount() }));
@@ -14519,10 +14514,10 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
         };
     };
     const backHandlers = getBackHandlers();
-    return (jsxRuntime.jsxs(StyleProvider, { config: config, children: [jsxRuntime.jsxs("div", { ref: setWidgetContainerRef, children: [cardsView, shouldRenderInstanceSelection && (jsxRuntime.jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsxRuntime.jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack, roundPricesEnabled: systemConfig?.roundPricesEnabled !== false })), shouldRenderBookingForm && eventDetails && (jsxRuntime.jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: backHandlers.onBackToEventInstances, onBackToEventTypes: backHandlers.onBackToEventTypes, selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: backHandlers.onClose, systemConfig: systemConfig, selectedUpsells: selectedUpsells, upsells: upsells })), jsxRuntime.jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
+    return (jsxRuntime.jsxs(StyleProvider, { config: config, children: [jsxRuntime.jsxs("div", { ref: setWidgetContainerRef, children: [cardsView, shouldRenderInstanceSelection && (jsxRuntime.jsx(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderUpsells && (jsxRuntime.jsx(UpsellsStep, { upsells: upsells, selectedUpsells: selectedUpsells, participantCount: tempParticipantCount, isLoading: isLoadingUpsells, isOpen: currentStep === "upsells", onClose: () => setCurrentStep("eventInstances"), onSelect: handleUpsellsSelect, onContinue: handleUpsellsContinue, onBack: handleUpsellsBack })), shouldRenderBookingForm && eventDetails && (jsxRuntime.jsx(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: backHandlers.onBackToEventInstances, onBackToEventTypes: backHandlers.onBackToEventTypes, selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: backHandlers.onClose, systemConfig: systemConfig, selectedUpsells: selectedUpsells, upsells: upsells })), jsxRuntime.jsx(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
                             setIsSuccess(false);
                             setCurrentStep("eventTypes");
-                            setSuccessPaymentIntentId(null);
+                            setSuccessPaymentId(null);
                             setShouldRenderInstanceSelection(false);
                             setShouldRenderUpsells(false);
                             setShouldRenderBookingForm(false);
@@ -14533,7 +14528,7 @@ function UniversalBookingWidgetInner({ config: baseConfig, onWidgetLanguage, onT
                             url.searchParams.delete("payment_intent_client_secret");
                             url.searchParams.delete("redirect_status");
                             window.history.replaceState({}, "", url.toString());
-                        }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
+                        }, config: config, onError: setError, paymentIntentId: successPaymentId })] }), showPromoDialog && config.promo && (jsxRuntime.jsx(PromoDialog, { config: config.promo, onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
 }
 function UniversalBookingWidget(props) {
     const [languagePolicy, setLanguagePolicy] = React.useState(null);