@bigz-app/booking-widget 0.3.6 → 0.3.9

package/dist/booking-widget.js

@@ -6946,7 +6946,7 @@
       // Convert double underscores to HTML underline tags for React Markdown
       return markdown.replace(/__([^_]+)__/g, "<u>$1</u>");
   };
-  const IconCheck$1 = ({ size = 16, color = "#10b981" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: u$2("polyline", { points: "20 6 9 17 4 12" }) }));
+  const IconCheck$2 = ({ size = 16, color = "#10b981" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: u$2("polyline", { points: "20 6 9 17 4 12" }) }));
   const IconWave$1 = ({ size = 20, color = "#0ea5e9" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("path", { d: "M2 18c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), u$2("path", { d: "M2 12c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), u$2("path", { d: "M2 6c2-2 6-2 8 0s6 2 8 0 6-2 8 0" })] }));
   function EventTypeDetailsDialog({ isOpen, onClose, eventType, onEventTypeSelect, }) {
       if (!isOpen || !eventType)
@@ -6993,7 +6993,7 @@
                                               fontSize: "16px",
                                               lineHeight: "1.6",
                                               color: "var(--bw-text-color)",
-                                          }, children: [u$2("div", { style: { marginTop: "4px", flexShrink: 0 }, children: u$2(IconCheck$1, { size: 16, color: "var(--bw-success-color)" }) }), u$2("span", { children: highlight.trim() })] }, index))) }) }) }))] }), eventType.description && (u$2("div", { style: {
+                                          }, children: [u$2("div", { style: { marginTop: "4px", flexShrink: 0 }, children: u$2(IconCheck$2, { size: 16, color: "var(--bw-success-color)" }) }), u$2("span", { children: highlight.trim() })] }, index))) }) }) }))] }), eventType.description && (u$2("div", { style: {
                           marginBottom: "24px",
                           color: "var(--bw-text-muted)",
                           fontSize: "16px",
@@ -7302,7 +7302,7 @@
   // Custom minimal SVG icons (Lucide-style)
   const IconClock = ({ size = 16, color = "#10b981" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("circle", { cx: "12", cy: "12", r: "10" }), u$2("polyline", { points: "12 6 12 12 16 14" })] }));
   const IconCalendar = ({ size = 16, color = "#3b82f6" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2" }), u$2("line", { x1: "16", y1: "2", x2: "16", y2: "6" }), u$2("line", { x1: "8", y1: "2", x2: "8", y2: "6" }), u$2("line", { x1: "3", y1: "10", x2: "21", y2: "10" })] }));
-  const IconCheck = ({ size = 16, color = "#10b981" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: u$2("polyline", { points: "20 6 9 17 4 12" }) }));
+  const IconCheck$1 = ({ size = 16, color = "#10b981" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: u$2("polyline", { points: "20 6 9 17 4 12" }) }));
   // Wave icon for booking action
   const IconWave = ({ size = 20, color = "#0ea5e9" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("path", { d: "M2 18c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), u$2("path", { d: "M2 12c2-2 6-2 8 0s6 2 8 0 6-2 8 0" }), u$2("path", { d: "M2 6c2-2 6-2 8 0s6 2 8 0 6-2 8 0" })] }));
   // Loading skeleton component that matches the actual design
@@ -7766,7 +7766,7 @@
                                                                       color: "var(--bw-text-muted)",
                                                                       position: "relative",
                                                                       maxWidth: "100%",
-                                                                  }, children: [u$2("div", { style: { marginTop: "4px", flexShrink: 0 }, children: u$2(IconCheck, { size: 16, color: "var(--bw-success-color)" }) }), u$2("span", { style: {
+                                                                  }, children: [u$2("div", { style: { marginTop: "4px", flexShrink: 0 }, children: u$2(IconCheck$1, { size: 16, color: "var(--bw-success-color)" }) }), u$2("span", { style: {
                                                                               textOverflow: "ellipsis",
                                                                               overflow: "hidden",
                                                                               whiteSpace: "nowrap",
@@ -9196,6 +9196,110 @@
 
   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, }) {
+      const [isLoading, setIsLoading] = d$1(false);
+      const [error, setError] = d$1(null);
+      const handleBooking = async () => {
+          setIsLoading(true);
+          setError(null);
+          try {
+              // Create booking directly without Stripe payment
+              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",
+              };
+              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 || "Fehler beim Erstellen der Buchung");
+                  onError(data.error || "Fehler beim Erstellen der Buchung");
+              }
+          }
+          catch (err) {
+              setError(err.message || "Fehler beim Erstellen der Buchung");
+              onError(err.message || "Fehler beim Erstellen der Buchung");
+          }
+          finally {
+              setIsLoading(false);
+          }
+      };
+      const totalGiftCardAmount = giftCards.reduce((sum, gc) => sum + (gc.balanceToUse || gc.discountAmount || 0), 0);
+      return (u$2("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing)" }, children: [u$2("div", { style: {
+                      backgroundColor: "var(--bw-success-color)15",
+                      border: "1px solid var(--bw-success-color)40",
+                      borderRadius: "var(--bw-border-radius)",
+                      padding: "var(--bw-spacing)",
+                  }, children: [u$2("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 Vollst\u00E4ndig durch Gutschein(e) gedeckt" }), u$2("div", { style: {
+                              fontSize: "var(--bw-font-size)",
+                              color: "var(--bw-text-muted)",
+                              fontFamily: "var(--bw-font-family)",
+                          }, children: ["Gutschein-Guthaben: ", formatCurrency(totalGiftCardAmount)] })] }), error && (u$2("div", { style: {
+                      backgroundColor: "var(--bw-error-color)15",
+                      border: "1px solid var(--bw-error-color)40",
+                      borderRadius: "var(--bw-border-radius)",
+                      padding: "var(--bw-spacing)",
+                      color: "var(--bw-error-color)",
+                      fontSize: "var(--bw-font-size)",
+                      fontFamily: "var(--bw-font-family)",
+                  }, children: ["\u26A0\uFE0F ", error] })), u$2("button", { type: "button", onClick: handleBooking, disabled: isLoading, style: {
+                      width: "100%",
+                      padding: "12px 24px",
+                      backgroundColor: "var(--bw-highlight-color)",
+                      color: "#fff",
+                      border: "none",
+                      borderRadius: "var(--bw-border-radius)",
+                      fontSize: "var(--bw-font-size)",
+                      fontWeight: "600",
+                      cursor: isLoading ? "not-allowed" : "pointer",
+                      opacity: isLoading ? 0.6 : 1,
+                      transition: "all 0.2s ease",
+                      fontFamily: "var(--bw-font-family)",
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "center",
+                      gap: "8px",
+                  }, children: isLoading ? (u$2(k$3, { children: [u$2("div", { style: {
+                                  width: "16px",
+                                  height: "16px",
+                                  border: "2px solid #fff",
+                                  borderTopColor: "transparent",
+                                  borderRadius: "50%",
+                                  animation: "spin 1s linear infinite",
+                              } }), "Buchung wird erstellt..."] })) : ("Mit Gutschein buchen") }), u$2("style", { children: `
+				@keyframes spin {
+					from { transform: rotate(0deg); }
+					to { transform: rotate(360deg); }
+				}
+			` })] }));
+  }
   const spinner$1 = (borderColor) => (u$2("div", { style: {
           width: "auto",
           height: "auto",
@@ -9212,7 +9316,7 @@
               borderRadius: "50%",
           } }) }));
   // Inner component that uses the Stripe hooks
-  function PaymentFormInner({ config, eventDetails, formData, totalAmount, discountCode, onSuccess, onError, }) {
+  function PaymentFormInner({ config, eventDetails, formData, totalAmount, discountCode, giftCards, onSuccess, onError, }) {
       const stripe = reactStripe_umdExports.useStripe();
       const elements = reactStripe_umdExports.useElements();
       const [isLoading, setIsLoading] = d$1(false);
@@ -9343,7 +9447,7 @@
 			` })] }));
   }
   // Main PaymentForm component that handles payment intent creation and Elements wrapper
-  function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode, onSuccess, onError, systemConfig, stripePromise, stripeAppearance, }) {
+  function PaymentForm({ config, eventDetails, formData, totalAmount, discountCode, giftCards, onSuccess, onError, systemConfig, stripePromise, stripeAppearance, }) {
       const [clientSecret, setClientSecret] = d$1(null);
       const [paymentIntentId, setPaymentIntentId] = d$1(null);
       const [isCreatingPaymentIntent, setIsCreatingPaymentIntent] = d$1(false);
@@ -9439,6 +9543,7 @@
                       currency: "eur",
                       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(),
@@ -9500,8 +9605,21 @@
           formData.customerName,
           totalAmount,
           discountCode,
+          giftCards,
           config,
       ]);
+      // Calculate total gift card coverage
+      const totalGiftCardAmount = giftCards?.reduce((sum, gc) => sum + (gc.balanceToUse || gc.discountAmount || 0), 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;
+      // If gift cards fully cover the payment, show a simplified booking button
+      if (isFullyCoveredByGiftCards && totalAmount <= 0) {
+          return (u$2(GiftCardOnlyBooking, { config: config, eventDetails: eventDetails, formData: formData, discountCode: discountCode, giftCards: giftCards || [], onSuccess: onSuccess, onError: onError }));
+      }
       // Show loading state while creating payment intent
       if (isCreatingPaymentIntent || !clientSecret) {
           return (u$2("div", { style: {
@@ -9535,7 +9653,7 @@
               clientSecret,
               appearance: stripeAppearance || { theme: "stripe" },
               locale: config.locale || "de",
-          }, children: u$2(PaymentFormInner, { config: config, eventDetails: eventDetails, formData: formData, totalAmount: totalAmount, discountCode: discountCode, onSuccess: (result) => {
+          }, children: u$2(PaymentFormInner, { config: config, eventDetails: eventDetails, formData: formData, totalAmount: totalAmount, discountCode: discountCode, giftCards: giftCards, onSuccess: (result) => {
                   // Clear persisted PI data on successful payment
                   clearPersistedPaymentIntent();
                   setPaymentIntentId(null);
@@ -9740,6 +9858,222 @@
                   }, children: children }))] }));
   }
 
+  // Icons
+  const IconTicket = ({ size = 20, color = "currentColor" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("path", { d: "M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z" }), u$2("path", { d: "M13 5v2" }), u$2("path", { d: "M13 17v2" }), u$2("path", { d: "M13 11v2" })] }));
+  const IconGift = ({ size = 20, color = "currentColor" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("rect", { x: "3", y: "8", width: "18", height: "4", rx: "1" }), u$2("path", { d: "M12 8v13" }), u$2("path", { d: "M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7" }), u$2("path", { d: "M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5" })] }));
+  const IconCheck = ({ size = 16, color = "currentColor" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: u$2("polyline", { points: "20 6 9 17 4 12" }) }));
+  const IconX = ({ size = 16, color = "currentColor" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), u$2("line", { x1: "6", y1: "6", x2: "18", y2: "18" })] }));
+  const IconSpinner = ({ size = 16, color = "currentColor" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", style: { animation: "spin 1s linear infinite" }, children: u$2("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) }));
+  function VoucherInput({ config, orderValue, eventInstanceId, customerEmail, onVoucherValidated, appliedVouchers, onRemoveVoucher, disabled = false, }) {
+      const [inputValue, setInputValue] = d$1("");
+      const [isLoading, setIsLoading] = d$1(false);
+      const [error, setError] = d$1(null);
+      const [isExpanded, setIsExpanded] = d$1(false);
+      // Check if a discount code is already applied (only one allowed)
+      const hasDiscountCode = appliedVouchers.some((v) => v.type === "discount");
+      const validateVoucher = q$2(async (code) => {
+          if (!code.trim()) {
+              setError(null);
+              return;
+          }
+          // Check if code is already applied
+          if (appliedVouchers.some((v) => v.code.toUpperCase() === code.toUpperCase())) {
+              setError("Dieser Code wurde bereits angewendet");
+              return;
+          }
+          setIsLoading(true);
+          setError(null);
+          try {
+              const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/validate-voucher"), {
+                  method: "POST",
+                  headers: createApiHeaders(config),
+                  body: JSON.stringify(createRequestBody(config, {
+                      code: code.trim(),
+                      orderValue: orderValue,
+                      eventInstanceId: eventInstanceId,
+                      customerEmail: customerEmail,
+                  })),
+              });
+              const data = await response.json();
+              if (data.valid && data.voucher) {
+                  // Check if trying to add a second discount code
+                  if (data.voucher.type === "discount" && hasDiscountCode) {
+                      setError("Es kann nur ein Rabattcode verwendet werden");
+                      onVoucherValidated(null, "Es kann nur ein Rabattcode verwendet werden");
+                      return;
+                  }
+                  onVoucherValidated(data.voucher);
+                  setInputValue("");
+                  setError(null);
+              }
+              else {
+                  setError(data.error || "Code nicht gefunden oder ungültig");
+                  onVoucherValidated(null, data.error);
+              }
+          }
+          catch (err) {
+              const errorMsg = "Fehler beim Validieren des Codes";
+              setError(errorMsg);
+              onVoucherValidated(null, errorMsg);
+          }
+          finally {
+              setIsLoading(false);
+          }
+      }, [
+          config,
+          orderValue,
+          eventInstanceId,
+          customerEmail,
+          appliedVouchers,
+          hasDiscountCode,
+          onVoucherValidated,
+      ]);
+      const handleSubmit = () => {
+          if (inputValue.trim() && !isLoading && !disabled) {
+              validateVoucher(inputValue);
+          }
+      };
+      const handleKeyDown = (e) => {
+          if (e.key === "Enter") {
+              e.preventDefault();
+              if (inputValue.trim() && !isLoading && !disabled) {
+                  validateVoucher(inputValue);
+              }
+          }
+      };
+      const inputStyle = {
+          flex: 1,
+          padding: "10px 12px",
+          backgroundColor: "var(--bw-background-color)",
+          border: "1px solid var(--bw-border-color)",
+          borderRadius: "var(--bw-border-radius)",
+          color: "var(--bw-text-color)",
+          fontSize: "var(--bw-font-size)",
+          fontFamily: "var(--bw-font-family)",
+          outline: "none",
+          transition: "all 0.2s ease",
+          textTransform: "uppercase",
+      };
+      const buttonStyle = {
+          padding: "10px 16px",
+          backgroundColor: "var(--bw-highlight-color)",
+          border: "none",
+          borderRadius: "var(--bw-border-radius)",
+          color: "#fff",
+          fontSize: "var(--bw-font-size)",
+          fontFamily: "var(--bw-font-family)",
+          fontWeight: "600",
+          cursor: disabled || isLoading ? "not-allowed" : "pointer",
+          opacity: disabled || isLoading ? 0.6 : 1,
+          transition: "all 0.2s ease",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: "6px",
+          minWidth: "100px",
+      };
+      const appliedVoucherStyle = {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          padding: "10px 12px",
+          backgroundColor: "var(--bw-surface-color)",
+          border: "1px solid var(--bw-border-color)",
+          borderRadius: "var(--bw-border-radius)",
+          marginBottom: "8px",
+      };
+      const removeButtonStyle = {
+          background: "none",
+          border: "none",
+          padding: "4px",
+          cursor: "pointer",
+          color: "var(--bw-error-color)",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          borderRadius: "50%",
+          transition: "background-color 0.2s ease",
+      };
+      return (u$2("div", { style: {
+              backgroundColor: "var(--bw-surface-color)",
+              border: "1px solid var(--bw-border-color)",
+              borderRadius: "var(--bw-border-radius)",
+              overflow: "hidden",
+          }, children: [u$2("button", { type: "button", onClick: () => setIsExpanded(!isExpanded), style: {
+                      width: "100%",
+                      padding: "var(--bw-spacing)",
+                      backgroundColor: "transparent",
+                      border: "none",
+                      cursor: "pointer",
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "space-between",
+                      color: "var(--bw-text-color)",
+                      fontFamily: "var(--bw-font-family)",
+                      fontSize: "var(--bw-font-size)",
+                      fontWeight: "500",
+                  }, children: [u$2("span", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [u$2(IconTicket, { size: 18, color: "var(--bw-highlight-color)" }), "Rabattcode oder Gutschein", appliedVouchers.length > 0 && (u$2("span", { style: {
+                                      backgroundColor: "var(--bw-highlight-color)",
+                                      color: "#fff",
+                                      padding: "2px 8px",
+                                      borderRadius: "12px",
+                                      fontSize: "12px",
+                                      fontWeight: "600",
+                                  }, children: appliedVouchers.length }))] }), u$2("span", { style: {
+                              transform: isExpanded ? "rotate(180deg)" : "rotate(0deg)",
+                              transition: "transform 0.2s ease",
+                          }, children: "\u25BC" })] }), isExpanded && (u$2("div", { style: { padding: "0 var(--bw-spacing) var(--bw-spacing)" }, children: [appliedVouchers.length > 0 && (u$2("div", { style: { marginBottom: "12px" }, children: appliedVouchers.map((voucher) => (u$2("div", { style: appliedVoucherStyle, children: [u$2("div", { style: { display: "flex", alignItems: "center", gap: "10px" }, children: [voucher.type === "discount" ? (u$2(IconTicket, { size: 18, color: "var(--bw-success-color)" })) : (u$2(IconGift, { size: 18, color: "var(--bw-success-color)" })), u$2("div", { children: [u$2("div", { style: {
+                                                          fontFamily: "var(--bw-font-family)",
+                                                          fontSize: "var(--bw-font-size)",
+                                                          fontWeight: "600",
+                                                          color: "var(--bw-text-color)",
+                                                          display: "flex",
+                                                          alignItems: "center",
+                                                          gap: "6px",
+                                                      }, children: [u$2("span", { style: { fontFamily: "monospace" }, children: voucher.code }), u$2(IconCheck, { size: 14, color: "var(--bw-success-color)" })] }), u$2("div", { style: {
+                                                          fontFamily: "var(--bw-font-family)",
+                                                          fontSize: "12px",
+                                                          color: "var(--bw-success-color)",
+                                                      }, children: [voucher.type === "discount"
+                                                              ? `−${formatCurrency(voucher.discountAmount)} Rabatt`
+                                                              : `−${formatCurrency(voucher.balanceToUse || voucher.discountAmount)} Gutschein`, voucher.type === "giftCard" &&
+                                                              voucher.remainingBalance !== undefined &&
+                                                              voucher.remainingBalance > 0 && (u$2("span", { style: { color: "var(--bw-text-muted)", marginLeft: "8px" }, children: ["(Rest: ", formatCurrency(voucher.remainingBalance), ")"] }))] })] })] }), u$2("button", { type: "button", onClick: () => onRemoveVoucher(voucher.code), style: removeButtonStyle, title: "Entfernen", children: u$2(IconX, { size: 16 }) })] }, voucher.code))) })), u$2("div", { style: { display: "flex", gap: "8px" }, children: [u$2("input", { type: "text", value: inputValue, onChange: (e) => {
+                                      setInputValue(e.target.value.toUpperCase());
+                                      setError(null);
+                                  }, onKeyDown: handleKeyDown, placeholder: hasDiscountCode
+                                      ? "Gutscheincode eingeben..."
+                                      : "Rabatt- oder Gutscheincode eingeben...", style: inputStyle, disabled: disabled || isLoading, onFocus: (e) => {
+                                      e.target.style.borderColor = "var(--bw-highlight-color)";
+                                      e.target.style.boxShadow = "0 0 0 2px var(--bw-highlight-color)33";
+                                  }, onBlur: (e) => {
+                                      e.target.style.borderColor = "var(--bw-border-color)";
+                                      e.target.style.boxShadow = "none";
+                                  } }), u$2("button", { type: "button", onClick: handleSubmit, style: buttonStyle, disabled: disabled || isLoading || !inputValue.trim(), children: isLoading ? (u$2(IconSpinner, { size: 16, color: "#fff" })) : (u$2(k$3, { children: [u$2(IconCheck, { size: 16 }), "Einl\u00F6sen"] })) })] }), error && (u$2("div", { style: {
+                              marginTop: "8px",
+                              padding: "8px 12px",
+                              backgroundColor: "var(--bw-error-color)15",
+                              border: "1px solid var(--bw-error-color)40",
+                              borderRadius: "var(--bw-border-radius)",
+                              color: "var(--bw-error-color)",
+                              fontSize: "var(--bw-font-size)",
+                              fontFamily: "var(--bw-font-family)",
+                              display: "flex",
+                              alignItems: "center",
+                              gap: "8px",
+                          }, children: [u$2(IconX, { size: 16 }), error] })), hasDiscountCode && (u$2("div", { style: {
+                              marginTop: "8px",
+                              fontSize: "12px",
+                              color: "var(--bw-text-muted)",
+                              fontFamily: "var(--bw-font-family)",
+                          }, children: "\uD83D\uDCA1 Es wurde bereits ein Rabattcode angewendet. Du kannst weitere Gutscheine hinzuf\u00FCgen." }))] })), u$2("style", { children: `
+				@keyframes spin {
+					from { transform: rotate(0deg); }
+					to { transform: rotate(360deg); }
+				}
+			` })] }));
+  }
+
   // Form schemas
   const participantSchema = objectType({
       name: stringType().min(1, "Name ist erforderlich"),
@@ -9759,6 +10093,10 @@
   const IconWarning = ({ size = 48, color = "var(--bw-error-color)" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("circle", { cx: "12", cy: "12", r: "10" }), u$2("line", { x1: "12", y1: "8", x2: "12", y2: "12" }), u$2("circle", { cx: "12", cy: "16", r: "1" })] }));
   const IconMoney = ({ size = 20, color = "var(--bw-text-muted)" }) => (u$2("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [u$2("rect", { x: "2", y: "6", width: "20", height: "12", rx: "2" }), u$2("circle", { cx: "12", cy: "12", r: "4" }), u$2("line", { x1: "2", y1: "10", x2: "2", y2: "14" }), u$2("line", { x1: "22", y1: "10", x2: "22", y2: "14" })] }));
   function BookingForm({ config, eventDetails, stripePromise, onSuccess, onError, onBackToEventInstances, onBackToEventTypes, selectedEventType, selectedEventInstance, isOpen, onClose, systemConfig, }) {
+      // New voucher system - supports multiple gift cards + one discount code
+      const [appliedVouchers, setAppliedVouchers] = d$1([]);
+      const [voucherError, setVoucherError] = d$1(null);
+      // Legacy state for backward compatibility
       const [discountCode, setDiscountCode] = d$1(null);
       const [discountLoading, setDiscountLoading] = d$1(false);
       const [discountError, setDiscountError] = d$1(null);
@@ -9772,28 +10110,66 @@
           },
       });
       const watchedParticipants = form.watch("participants");
-      const watchedDiscountCode = form.watch("discountCode");
+      form.watch("discountCode");
       const watchedCustomerName = form.watch("customerName");
       const watchedCustomerEmail = form.watch("customerEmail");
       const customerNameError = form.formState.errors.customerName;
       const customerEmailError = form.formState.errors.customerEmail;
       const watchedAcceptTerms = form.watch("acceptTerms");
-      // Calculate total amount and deposit amount
-      const calculateTotal = () => {
+      // Calculate base total before any discounts
+      const calculateBaseTotal = q$2(() => {
           if (!eventDetails)
               return 0;
-          const baseTotal = eventDetails.price * watchedParticipants.filter((p) => p.name.trim()).length;
-          return discountCode ? discountCode.newTotal : baseTotal;
-      };
+          return eventDetails.price * watchedParticipants.filter((p) => p.name.trim()).length;
+      }, [eventDetails, watchedParticipants]);
+      // Calculate total discount from all applied vouchers
+      const calculateTotalDiscount = q$2(() => {
+          return appliedVouchers.reduce((total, voucher) => {
+              if (voucher.type === "discount") {
+                  return total + voucher.discountAmount;
+              }
+              else if (voucher.type === "giftCard") {
+                  return total + (voucher.balanceToUse || voucher.discountAmount);
+              }
+              return total;
+          }, 0);
+      }, [appliedVouchers]);
+      // Calculate total amount after discounts
+      const calculateTotal = q$2(() => {
+          const baseTotal = calculateBaseTotal();
+          const totalDiscount = calculateTotalDiscount();
+          return Math.max(0, baseTotal - totalDiscount);
+      }, [calculateBaseTotal, calculateTotalDiscount]);
       const calculateDeposit = () => {
           if (!eventDetails || !eventDetails.deposit)
               return 0;
           const participantCount = watchedParticipants.filter((p) => p.name.trim()).length;
           return eventDetails.deposit * participantCount;
       };
+      const baseTotal = calculateBaseTotal();
+      const totalDiscount = calculateTotalDiscount();
       const totalAmount = calculateTotal();
       const depositAmount = calculateDeposit();
-      const paymentAmount = depositAmount > 0 ? depositAmount : totalAmount;
+      // If there's a deposit, we pay the deposit; otherwise we pay the total after discounts
+      const paymentAmount = depositAmount > 0 ? Math.max(0, depositAmount - totalDiscount) : totalAmount;
+      // Get discount code for legacy compatibility
+      const appliedDiscountCode = appliedVouchers.find((v) => v.type === "discount");
+      // Get gift cards
+      const appliedGiftCards = appliedVouchers.filter((v) => v.type === "giftCard");
+      // Voucher handlers
+      const handleVoucherValidated = q$2((voucher, error) => {
+          if (error) {
+              setVoucherError(error);
+              return;
+          }
+          if (voucher) {
+              setAppliedVouchers((prev) => [...prev, voucher]);
+              setVoucherError(null);
+          }
+      }, []);
+      const handleRemoveVoucher = q$2((code) => {
+          setAppliedVouchers((prev) => prev.filter((v) => v.code !== code));
+      }, []);
       // Form validation helper
       const isFormValid = () => {
           const participantCount = watchedParticipants.filter((p) => p.name.trim()).length;
@@ -9807,48 +10183,51 @@
           const hasAcceptedTerms = watchedAcceptTerms === true;
           return validParticipants && participantsWithinLimit && hasName && hasEmail && hasAcceptedTerms;
       };
-      // Validate discount codes
+      // Re-validate vouchers when participant count changes (affects order value)
       y$1(() => {
-          const validateDiscountCode = async (code) => {
-              if (!code.trim() || !eventDetails) {
-                  setDiscountCode(null);
-                  setDiscountError(null);
-                  return;
-              }
-              setDiscountLoading(true);
-              setDiscountError(null);
-              try {
-                  const baseTotal = eventDetails.price * watchedParticipants.filter((p) => p.name.trim()).length;
-                  const response = await fetch(getApiUrl(config.apiBaseUrl, "/booking/validate-discount"), {
-                      method: "POST",
-                      headers: createApiHeaders(config),
-                      body: JSON.stringify(createRequestBody(config, {
-                          code: code.trim(),
-                          orderValue: baseTotal,
-                      })),
-                  });
-                  const data = await response.json();
-                  if (data.valid) {
-                      setDiscountCode(data.discountCode);
+          // When participants change, we need to recalculate voucher amounts
+          // For now, we'll clear vouchers if the order value changes significantly
+          // In a production app, you might want to re-validate each voucher
+          if (appliedVouchers.length > 0) {
+              // Recalculate discount amounts based on new order value
+              const newBaseTotal = eventDetails?.price
+                  ? eventDetails.price * watchedParticipants.filter((p) => p.name.trim()).length
+                  : 0;
+              // Update voucher amounts (simplified - in production, re-validate via API)
+              setAppliedVouchers((prev) => prev.map((voucher) => {
+                  if (voucher.type === "discount") {
+                      let newDiscountAmount = 0;
+                      if (voucher.discountType === "percentage") {
+                          newDiscountAmount = Math.round((newBaseTotal * (voucher.discountValue || 0)) / 10000);
+                      }
+                      else {
+                          newDiscountAmount = voucher.discountValue || 0;
+                      }
+                      newDiscountAmount = Math.min(newDiscountAmount, newBaseTotal);
+                      return {
+                          ...voucher,
+                          discountAmount: newDiscountAmount,
+                          newTotal: newBaseTotal - newDiscountAmount,
+                      };
                   }
-                  else {
-                      setDiscountCode(null);
-                      setDiscountError(data.error);
+                  else if (voucher.type === "giftCard") {
+                      // Gift card balance stays the same, but amount to use might change
+                      const remainingAfterDiscount = newBaseTotal -
+                          prev
+                              .filter((v) => v.type === "discount")
+                              .reduce((sum, v) => sum + v.discountAmount, 0);
+                      const balanceToUse = Math.min(voucher.currentBalance || 0, Math.max(0, remainingAfterDiscount));
+                      return {
+                          ...voucher,
+                          balanceToUse,
+                          remainingBalance: (voucher.currentBalance || 0) - balanceToUse,
+                          discountAmount: balanceToUse,
+                      };
                   }
-              }
-              catch (err) {
-                  setDiscountError("Fehler beim Validieren des Rabattcodes");
-                  setDiscountCode(null);
-              }
-              finally {
-                  setDiscountLoading(false);
-              }
-          };
-          const timer = setTimeout(() => {
-              validateDiscountCode(watchedDiscountCode || "");
-          }, 500);
-          return () => clearTimeout(timer);
-      }, [watchedDiscountCode, watchedParticipants, eventDetails, config]);
+                  return voucher;
+              }));
+          }
+      }, [watchedParticipants, eventDetails]);
       // Helper functions
       const addParticipant = () => {
           const currentParticipants = form.getValues("participants");
@@ -10003,7 +10382,7 @@
                                                   color: "var(--bw-text-color)",
                                                   fontWeight: "500",
                                                   fontFamily: "var(--bw-font-family)",
-                                              }, children: [formatCurrency(eventDetails.price), " pro Person"] })] })] })] }), u$2("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-large)" }, children: [u$2("form", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-large)" }, children: [u$2("div", { style: {
+                                              }, children: [formatCurrency(eventDetails.price), " pro Person"] })] })] })] }), u$2("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-large)" }, children: [u$2("div", { style: { display: "flex", flexDirection: "column", gap: "var(--bw-spacing-large)" }, children: [u$2("div", { style: {
                                           backgroundColor: "var(--bw-surface-color)",
                                           border: `1px solid var(--bw-border-color)`,
                                           backdropFilter: "blur(4px)",
@@ -10148,7 +10527,7 @@
                                                           color: "var(--bw-error-color)",
                                                           fontSize: "var(--bw-font-size)",
                                                           fontFamily: "var(--bw-font-family)",
-                                                      }, children: ["Maximal ", eventDetails.availableSpots, " Pl\u00E4tze verf\u00FCgbar."] }))] })] }), u$2("div", { style: {
+                                                      }, children: ["Maximal ", eventDetails.availableSpots, " Pl\u00E4tze verf\u00FCgbar."] }))] })] }), u$2(VoucherInput, { config: config, orderValue: baseTotal, eventInstanceId: eventDetails?.id, customerEmail: watchedCustomerEmail, onVoucherValidated: handleVoucherValidated, appliedVouchers: appliedVouchers, onRemoveVoucher: handleRemoveVoucher, disabled: !eventDetails }), u$2("div", { style: {
                                           backgroundColor: "var(--bw-surface-color)",
                                           border: `1px solid var(--bw-border-color)`,
                                           backdropFilter: "blur(4px)",
@@ -10247,7 +10626,7 @@
                                                                   color: "var(--bw-text-color)",
                                                                   fontWeight: "500",
                                                                   fontFamily: "var(--bw-font-family)",
-                                                              }, children: formatCurrency(eventDetails.deposit || 0) })] })), discountCode && (u$2(k$3, { children: [u$2("div", { style: {
+                                                              }, children: formatCurrency(eventDetails.deposit || 0) })] })), appliedVouchers.length > 0 && (u$2(k$3, { children: [u$2("div", { style: {
                                                                   display: "flex",
                                                                   justifyContent: "space-between",
                                                                   alignItems: "center",
@@ -10256,20 +10635,31 @@
                                                                           fontFamily: "var(--bw-font-family)",
                                                                       }, children: "Zwischensumme:" }), u$2("span", { style: {
                                                                           color: "var(--bw-text-muted)",
-                                                                          textDecoration: "line-through",
+                                                                          textDecoration: totalDiscount > 0 ? "line-through" : "none",
+                                                                          fontFamily: "var(--bw-font-family)",
+                                                                      }, children: formatCurrency(baseTotal) })] }), appliedDiscountCode && (u$2("div", { style: {
+                                                                  display: "flex",
+                                                                  justifyContent: "space-between",
+                                                                  alignItems: "center",
+                                                              }, children: [u$2("span", { style: {
+                                                                          color: "var(--bw-success-color)",
                                                                           fontFamily: "var(--bw-font-family)",
-                                                                      }, children: formatCurrency(eventDetails.price *
-                                                                          watchedParticipants.filter((p) => p.name.trim()).length) })] }), u$2("div", { style: {
+                                                                          fontSize: "var(--bw-font-size)",
+                                                                      }, children: ["Rabatt (", appliedDiscountCode.code, "):"] }), u$2("span", { style: {
+                                                                          color: "var(--bw-success-color)",
+                                                                          fontFamily: "var(--bw-font-family)",
+                                                                      }, children: ["-", formatCurrency(appliedDiscountCode.discountAmount)] })] })), appliedGiftCards.map((giftCard) => (u$2("div", { style: {
                                                                   display: "flex",
                                                                   justifyContent: "space-between",
                                                                   alignItems: "center",
                                                               }, children: [u$2("span", { style: {
                                                                           color: "var(--bw-success-color)",
                                                                           fontFamily: "var(--bw-font-family)",
-                                                                      }, children: "Rabatt:" }), u$2("span", { style: {
+                                                                          fontSize: "var(--bw-font-size)",
+                                                                      }, children: ["Gutschein (", giftCard.code, "):"] }), u$2("span", { style: {
                                                                           color: "var(--bw-success-color)",
                                                                           fontFamily: "var(--bw-font-family)",
-                                                                      }, children: ["-", formatCurrency(discountCode.discountAmount)] })] })] })), u$2("div", { style: {
+                                                                      }, children: ["-", formatCurrency(giftCard.balanceToUse || giftCard.discountAmount)] })] }, giftCard.code)))] })), u$2("div", { style: {
                                                           borderTop: `1px solid var(--bw-border-color)`,
                                                           paddingTop: "12px",
                                                       }, children: [depositAmount > 0 && (u$2("div", { style: {
@@ -10342,7 +10732,15 @@
                                                           fontFamily: "var(--bw-font-family)",
                                                           borderBottom: "2px solid var(--bw-highlight-color)",
                                                           paddingBottom: 4,
-                                                      }, children: "Zahlung" }), u$2(PaymentForm, { config: config, eventDetails: eventDetails, formData: form.getValues(), totalAmount: paymentAmount, discountCode: discountCode, onSuccess: onSuccess, onError: onError, systemConfig: systemConfig, stripePromise: stripePromise, stripeAppearance: stripeAppearance })] }));
+                                                      }, children: "Zahlung" }), u$2(PaymentForm, { config: config, eventDetails: eventDetails, formData: form.getValues(), totalAmount: paymentAmount, discountCode: appliedDiscountCode ? {
+                                                          id: appliedDiscountCode.id,
+                                                          code: appliedDiscountCode.code,
+                                                          description: appliedDiscountCode.description || undefined,
+                                                          type: appliedDiscountCode.discountType || "percentage",
+                                                          value: appliedDiscountCode.discountValue || 0,
+                                                          discountAmount: appliedDiscountCode.discountAmount,
+                                                          newTotal: appliedDiscountCode.newTotal,
+                                                      } : null, giftCards: appliedGiftCards, onSuccess: onSuccess, onError: onError, systemConfig: systemConfig, stripePromise: stripePromise, stripeAppearance: stripeAppearance })] }));
                                       })()] })] }), u$2("style", { children: `
                     .booking-widget-container *,
                     .booking-widget-container *::before,
@@ -11369,137 +11767,155 @@
 						font-size: 1.1rem !important;
 					}
 				}
-			` }), u$2(Sidebar, { isOpen: isOpen, onClose: handleClose, title: "Termin-Auswahl", children: [u$2("p", { className: "bw-event-instance-title", children: selectedEventType?.name }), u$2("div", { className: "bw-event-instance-list", style: { padding: "24px" }, children: u$2("div", { style: {
-                                  display: "flex",
-                                  flexDirection: "column",
-                                  gap: "20px",
-                              }, children: monthYearGroups.map(({ key, label, events, minPrice }) => {
-                                  const monthPriceDisplayInfo = getMonthPriceDisplayInfo(minPrice);
-                                  return (u$2(Accordion, { title: label, priceInfo: u$2("div", { style: {
-                                              fontSize: "1rem",
-                                              backgroundColor: monthPriceDisplayInfo
-                                                  ? monthPriceDisplayInfo.backgroundColor
-                                                  : "#14532d",
-                                              color: monthPriceDisplayInfo ? monthPriceDisplayInfo.textColor : "#4ade80",
-                                              fontWeight: 500,
-                                              marginLeft: "auto",
-                                              padding: "4px 8px",
-                                              borderRadius: "var(--bw-border-radius-small)",
-                                              border: monthPriceDisplayInfo ? "none" : undefined,
-                                              boxShadow: monthPriceDisplayInfo
-                                                  ? "0 2px 4px rgba(0, 0, 0, 0.2)"
-                                                  : undefined,
-                                          }, children: `ab ${formatCurrency(minPrice)}` }), isOpen: openGroups.has(key), onToggle: () => toggleGroup(key), children: u$2("div", { style: {
-                                              display: "flex",
-                                              flexDirection: "column",
-                                              gap: "12px",
-                                              paddingTop: "12px",
-                                          }, children: events.map((event) => {
-                                              const availableSpots = event.maxParticipants - event.participantCount;
-                                              const isFullyBooked = availableSpots === 0;
-                                              const startDate = new Date(event.startTime);
-                                              const isPastEvent = today.toISOString() >= startDate.toISOString();
-                                              return (u$2("div", { className: "bw-event-instance-card", style: {
-                                                      position: "relative",
-                                                      cursor: !isFullyBooked && !isPastEvent && event.bookingOpen
-                                                          ? "pointer"
-                                                          : "not-allowed",
-                                                      border: "1px solid var(--bw-border-color)",
-                                                      backgroundColor: "var(--bw-surface-color)",
-                                                      borderRadius: "var(--bw-border-radius)",
-                                                      padding: "16px 20px",
-                                                      transition: "all 0.2s ease",
-                                                      opacity: isFullyBooked || isPastEvent ? 0.3 : 1,
-                                                      filter: isFullyBooked || isPastEvent ? "grayscale(40%)" : "none",
-                                                      fontFamily: "var(--bw-font-family)",
-                                                  }, onClick: () => {
-                                                      if (!isFullyBooked && !isPastEvent && event.bookingOpen) {
-                                                          handleEventInstanceSelect(event);
-                                                      }
-                                                  }, onMouseEnter: (e) => {
-                                                      if (!isFullyBooked && !isPastEvent && event.bookingOpen) {
-                                                          e.currentTarget.style.transform = "scale(1.02)";
-                                                          e.currentTarget.style.backgroundColor =
-                                                              "var(--bw-surface-muted, rgba(59, 130, 246, 0.1))";
-                                                      }
-                                                  }, onMouseLeave: (e) => {
-                                                      if (!isFullyBooked && !isPastEvent && event.bookingOpen) {
-                                                          e.currentTarget.style.transform = "scale(1)";
-                                                          e.currentTarget.style.backgroundColor = "var(--bw-surface-color)";
-                                                      }
-                                                  }, children: [selectedEventInstanceId === event.id && isLoadingEventDetails && (u$2("div", { style: {
-                                                              position: "absolute",
-                                                              top: 0,
-                                                              left: 0,
-                                                              width: "100%",
-                                                              height: "100%",
-                                                              backgroundColor: "var(--bw-overlay-color, rgba(15, 23, 42, 0.8))",
-                                                              borderRadius: "var(--bw-border-radius)",
-                                                              display: "flex",
-                                                              alignItems: "center",
-                                                              justifyContent: "center",
-                                                          }, children: u$2("div", { style: {
-                                                                  width: "32px",
-                                                                  height: "32px",
-                                                                  color: "var(--bw-highlight-color-muted, rgba(59, 130, 246, 0.8))",
-                                                                  animation: "spin 1s linear infinite",
-                                                                  fontSize: "32px",
-                                                              }, children: spinner() }) })), u$2(SpecialPriceBadge, { price: event.price, yearPrices: yearPrices }), u$2(AllocationBadge, { availableSpots: availableSpots, maxParticipants: event.maxParticipants }), u$2("div", { style: {
-                                                              display: "flex",
-                                                              justifyContent: "space-between",
-                                                              width: "100%",
-                                                              alignItems: "start",
-                                                              gap: "12px",
-                                                              marginBottom: "4px",
-                                                          }, children: [u$2("div", { style: { display: "flex", alignItems: "start", gap: "12px" }, children: [u$2("div", { className: "bw-event-instance-datebox", style: {
-                                                                              fontSize: "var(--bw-font-size)",
-                                                                              transition: "all 0.2s ease",
-                                                                              borderRadius: "var(--bw-border-radius-small)",
-                                                                              borderTop: `4px solid var(--bw-border-color)`,
-                                                                              border: "1px solid var(--bw-border-color)",
-                                                                              width: "40px",
-                                                                              height: "40px",
-                                                                              display: "flex",
-                                                                              alignItems: "center",
-                                                                              justifyContent: "center",
-                                                                              fontWeight: "bold",
-                                                                              color: "var(--bw-text-color)",
-                                                                              backgroundColor: "var(--bw-background-color)",
-                                                                          }, children: startDate.getDate() }), u$2("div", { style: {
-                                                                              fontSize: "var(--bw-font-size)",
-                                                                              color: "var(--bw-text-color)",
-                                                                              display: "flex",
-                                                                              flexDirection: "column",
-                                                                              alignItems: "start",
-                                                                              justifyContent: "start",
-                                                                              lineHeight: "1.2",
-                                                                          }, children: [u$2("div", { children: [u$2("span", { className: "bw-event-instance-title", style: { fontWeight: "600", marginBottom: "2px" }, children: formatWeekday(event.startTime) }), formatWeekday(event.startTime) !==
-                                                                                          formatWeekday(event.endTime) && (u$2(k$3, { children: [u$2("span", { style: { color: "var(--bw-text-muted)", fontSize: "14px" }, children: " - " }), u$2("span", { className: "bw-event-instance-title", style: { fontWeight: "600", marginBottom: "2px" }, children: formatWeekday(event.endTime) })] }))] }), u$2("div", { children: formatWeekday(event.startTime) ===
-                                                                                      formatWeekday(event.endTime) ? (u$2(k$3, { children: [u$2("span", { style: { color: "var(--bw-text-muted)", fontSize: "14px" }, children: formatTime(event.startTime) }), u$2("span", { style: { color: "var(--bw-text-muted)", fontSize: "14px" }, children: " - " }), u$2("span", { style: { color: "var(--bw-text-muted)", fontSize: "14px" }, children: formatTime(event.endTime) })] })) : (u$2("span", { style: { color: "var(--bw-text-muted)", fontSize: "14px" }, children: [formatTime(event.startTime), " Uhr"] })) })] }), u$2("span", { style: {
-                                                                              fontSize: "12px",
-                                                                              fontWeight: 400,
-                                                                              color: "var(--bw-text-muted)",
-                                                                              marginLeft: "6px",
-                                                                              background: "var(--bw-background-muted)",
-                                                                              whiteSpace: "nowrap",
-                                                                          }, children: [event.durationDays, " Tag", event.durationDays > 1 ? "e" : ""] })] }), u$2("div", { className: "bw-event-instance-price", style: {
-                                                                      textAlign: "right",
-                                                                      display: "flex",
-                                                                      flexDirection: "column",
-                                                                      alignItems: "end",
-                                                                  }, children: u$2(PriceDisplay, { price: event.price, yearPrices: yearPrices }) })] }), event.name !== selectedEventType?.name && (u$2("h4", { className: "bw-event-instance-title", style: {
-                                                              fontSize: "var(--bw-font-size)",
-                                                              fontWeight: "600",
-                                                              color: "var(--bw-text-color)",
-                                                              lineHeight: "1.25",
-                                                              margin: "0 0 2px 0",
-                                                              display: "flex",
-                                                              alignItems: "center",
-                                                              gap: "8px",
-                                                              maxWidth: "230px",
-                                                          }, children: event.name }))] }, event.id));
-                                          }) }) }, key));
-                              }) }) })] })] }));
+			` }), u$2(Sidebar, { isOpen: isOpen, onClose: handleClose, title: `${selectedEventType?.name}`, children: u$2("div", { className: "bw-event-instance-list", style: { padding: "24px" }, children: u$2("div", { style: {
+                              display: "flex",
+                              flexDirection: "column",
+                              gap: "20px",
+                          }, children: monthYearGroups.map(({ key, label, events, minPrice, year }, idx) => {
+                              const monthPriceDisplayInfo = getMonthPriceDisplayInfo(minPrice);
+                              return (u$2(k$3, { children: [idx > 0 && monthYearGroups[idx - 1].year !== year && (u$2("div", { style: {
+                                              height: 1,
+                                              backgroundColor: "var(--bw-border-color)",
+                                              margin: "4px 0",
+                                          } })), u$2(Accordion, { title: label, priceInfo: u$2("div", { style: {
+                                                  fontSize: "1rem",
+                                                  backgroundColor: monthPriceDisplayInfo
+                                                      ? monthPriceDisplayInfo.backgroundColor
+                                                      : "#14532d",
+                                                  color: monthPriceDisplayInfo
+                                                      ? monthPriceDisplayInfo.textColor
+                                                      : "#4ade80",
+                                                  fontWeight: 500,
+                                                  marginLeft: "auto",
+                                                  padding: "4px 8px",
+                                                  borderRadius: "var(--bw-border-radius-small)",
+                                                  border: monthPriceDisplayInfo ? "none" : undefined,
+                                                  boxShadow: monthPriceDisplayInfo
+                                                      ? "0 2px 4px rgba(0, 0, 0, 0.2)"
+                                                      : undefined,
+                                              }, children: `ab ${formatCurrency(minPrice)}` }), isOpen: openGroups.has(key), onToggle: () => toggleGroup(key), children: u$2("div", { style: {
+                                                  display: "flex",
+                                                  flexDirection: "column",
+                                                  gap: "12px",
+                                                  paddingTop: "12px",
+                                              }, children: events.map((event) => {
+                                                  const availableSpots = event.maxParticipants - event.participantCount;
+                                                  const isFullyBooked = availableSpots === 0;
+                                                  const startDate = new Date(event.startTime);
+                                                  const isPastEvent = today.toISOString() >= startDate.toISOString();
+                                                  return (u$2("div", { className: "bw-event-instance-card", style: {
+                                                          position: "relative",
+                                                          cursor: !isFullyBooked && !isPastEvent && event.bookingOpen
+                                                              ? "pointer"
+                                                              : "not-allowed",
+                                                          border: "1px solid var(--bw-border-color)",
+                                                          backgroundColor: "var(--bw-surface-color)",
+                                                          borderRadius: "var(--bw-border-radius)",
+                                                          padding: "16px 20px",
+                                                          transition: "all 0.2s ease",
+                                                          opacity: isFullyBooked || isPastEvent ? 0.3 : 1,
+                                                          filter: isFullyBooked || isPastEvent ? "grayscale(40%)" : "none",
+                                                          fontFamily: "var(--bw-font-family)",
+                                                      }, onClick: () => {
+                                                          if (!isFullyBooked && !isPastEvent && event.bookingOpen) {
+                                                              handleEventInstanceSelect(event);
+                                                          }
+                                                      }, onMouseEnter: (e) => {
+                                                          if (!isFullyBooked && !isPastEvent && event.bookingOpen) {
+                                                              e.currentTarget.style.transform = "scale(1.02)";
+                                                              e.currentTarget.style.backgroundColor =
+                                                                  "var(--bw-surface-muted, rgba(59, 130, 246, 0.1))";
+                                                          }
+                                                      }, onMouseLeave: (e) => {
+                                                          if (!isFullyBooked && !isPastEvent && event.bookingOpen) {
+                                                              e.currentTarget.style.transform = "scale(1)";
+                                                              e.currentTarget.style.backgroundColor = "var(--bw-surface-color)";
+                                                          }
+                                                      }, children: [selectedEventInstanceId === event.id && isLoadingEventDetails && (u$2("div", { style: {
+                                                                  position: "absolute",
+                                                                  top: 0,
+                                                                  left: 0,
+                                                                  width: "100%",
+                                                                  height: "100%",
+                                                                  backgroundColor: "var(--bw-overlay-color, rgba(15, 23, 42, 0.8))",
+                                                                  borderRadius: "var(--bw-border-radius)",
+                                                                  display: "flex",
+                                                                  alignItems: "center",
+                                                                  justifyContent: "center",
+                                                              }, children: u$2("div", { style: {
+                                                                      width: "32px",
+                                                                      height: "32px",
+                                                                      color: "var(--bw-highlight-color-muted, rgba(59, 130, 246, 0.8))",
+                                                                      animation: "spin 1s linear infinite",
+                                                                      fontSize: "32px",
+                                                                  }, children: spinner() }) })), u$2(SpecialPriceBadge, { price: event.price, yearPrices: yearPrices }), u$2(AllocationBadge, { availableSpots: availableSpots, maxParticipants: event.maxParticipants }), u$2("div", { style: {
+                                                                  display: "flex",
+                                                                  justifyContent: "space-between",
+                                                                  width: "100%",
+                                                                  alignItems: "start",
+                                                                  gap: "12px",
+                                                                  marginBottom: "4px",
+                                                              }, children: [u$2("div", { style: { display: "flex", alignItems: "start", gap: "12px" }, children: [u$2("div", { className: "bw-event-instance-datebox", style: {
+                                                                                  fontSize: "var(--bw-font-size)",
+                                                                                  transition: "all 0.2s ease",
+                                                                                  borderRadius: "var(--bw-border-radius-small)",
+                                                                                  borderTop: `4px solid var(--bw-border-color)`,
+                                                                                  border: "1px solid var(--bw-border-color)",
+                                                                                  width: "40px",
+                                                                                  height: "40px",
+                                                                                  display: "flex",
+                                                                                  alignItems: "center",
+                                                                                  justifyContent: "center",
+                                                                                  fontWeight: "bold",
+                                                                                  color: "var(--bw-text-color)",
+                                                                                  backgroundColor: "var(--bw-background-color)",
+                                                                              }, children: startDate.getDate() }), u$2("div", { style: {
+                                                                                  fontSize: "var(--bw-font-size)",
+                                                                                  color: "var(--bw-text-color)",
+                                                                                  display: "flex",
+                                                                                  flexDirection: "column",
+                                                                                  alignItems: "start",
+                                                                                  justifyContent: "start",
+                                                                                  lineHeight: "1.2",
+                                                                              }, children: [u$2("div", { children: [u$2("span", { className: "bw-event-instance-title", style: { fontWeight: "600", marginBottom: "2px" }, children: formatWeekday(event.startTime) }), formatWeekday(event.startTime) !==
+                                                                                              formatWeekday(event.endTime) && (u$2(k$3, { children: [u$2("span", { style: {
+                                                                                                          color: "var(--bw-text-muted)",
+                                                                                                          fontSize: "14px",
+                                                                                                      }, children: " - " }), u$2("span", { className: "bw-event-instance-title", style: { fontWeight: "600", marginBottom: "2px" }, children: formatWeekday(event.endTime) })] }))] }), u$2("div", { children: formatWeekday(event.startTime) ===
+                                                                                          formatWeekday(event.endTime) ? (u$2(k$3, { children: [u$2("span", { style: {
+                                                                                                      color: "var(--bw-text-muted)",
+                                                                                                      fontSize: "14px",
+                                                                                                  }, children: formatTime(event.startTime) }), u$2("span", { style: {
+                                                                                                      color: "var(--bw-text-muted)",
+                                                                                                      fontSize: "14px",
+                                                                                                  }, children: " - " }), u$2("span", { style: {
+                                                                                                      color: "var(--bw-text-muted)",
+                                                                                                      fontSize: "14px",
+                                                                                                  }, children: formatTime(event.endTime) })] })) : (u$2("span", { style: { color: "var(--bw-text-muted)", fontSize: "14px" }, children: [formatTime(event.startTime), " Uhr"] })) })] }), u$2("span", { style: {
+                                                                                  fontSize: "12px",
+                                                                                  fontWeight: 400,
+                                                                                  color: "var(--bw-text-muted)",
+                                                                                  marginLeft: "6px",
+                                                                                  background: "var(--bw-background-muted)",
+                                                                                  whiteSpace: "nowrap",
+                                                                              }, children: [event.durationDays, " Tag", event.durationDays > 1 ? "e" : ""] })] }), u$2("div", { className: "bw-event-instance-price", style: {
+                                                                          textAlign: "right",
+                                                                          display: "flex",
+                                                                          flexDirection: "column",
+                                                                          alignItems: "end",
+                                                                      }, children: u$2(PriceDisplay, { price: event.price, yearPrices: yearPrices }) })] }), event.name !== selectedEventType?.name && (u$2("h4", { className: "bw-event-instance-title", style: {
+                                                                  fontSize: "var(--bw-font-size)",
+                                                                  fontWeight: "600",
+                                                                  color: "var(--bw-text-color)",
+                                                                  lineHeight: "1.25",
+                                                                  margin: "0 0 2px 0",
+                                                                  display: "flex",
+                                                                  alignItems: "center",
+                                                                  gap: "8px",
+                                                                  maxWidth: "230px",
+                                                              }, children: event.name }))] }, event.id));
+                                              }) }) })] }, key));
+                          }) }) }) })] }));
   }
 
   // Loading skeleton component for NextEventsPreview
@@ -11894,6 +12310,263 @@
 			` })] }));
   }
 
+  function PromoDialog({ onClose, onCtaClick }) {
+      const [copied, setCopied] = d$1(false);
+      const [isVisible, setIsVisible] = d$1(false);
+      // Hardcoded Xmas surf school content
+      const discountCode = "X-MAS";
+      // Animate in on mount
+      y$1(() => {
+          const timer = setTimeout(() => setIsVisible(true), 50);
+          return () => clearTimeout(timer);
+      }, []);
+      const handleCopyCode = async () => {
+          try {
+              await navigator.clipboard.writeText(discountCode);
+              setCopied(true);
+              setTimeout(() => setCopied(false), 2000);
+          }
+          catch (err) {
+              // Fallback for older browsers
+              const textArea = document.createElement("textarea");
+              textArea.value = discountCode;
+              document.body.appendChild(textArea);
+              textArea.select();
+              document.execCommand("copy");
+              document.body.removeChild(textArea);
+              setCopied(true);
+              setTimeout(() => setCopied(false), 2000);
+          }
+      };
+      const handleClose = () => {
+          setIsVisible(false);
+          setTimeout(onClose, 200);
+      };
+      const handleCtaClick = () => {
+          setIsVisible(false);
+          setTimeout(onCtaClick, 200);
+      };
+      return (u$2(k$3, { children: [u$2("style", { children: `
+					@keyframes promo-wave {
+						0%, 100% { transform: translateX(0) translateY(0); }
+						25% { transform: translateX(5px) translateY(-3px); }
+						50% { transform: translateX(0) translateY(-5px); }
+						75% { transform: translateX(-5px) translateY(-3px); }
+					}
+					@keyframes promo-float {
+						0%, 100% { transform: translateY(0); }
+						50% { transform: translateY(-8px); }
+					}
+					@keyframes promo-shimmer {
+						0% { background-position: -200% center; }
+						100% { background-position: 200% center; }
+					}
+					@keyframes promo-sparkle {
+						0%, 100% { opacity: 0.3; transform: scale(1); }
+						50% { opacity: 1; transform: scale(1.2); }
+					}
+					@keyframes promo-snow {
+						0% { transform: translateY(-10px) rotate(0deg); opacity: 0; }
+						10% { opacity: 1; }
+						90% { opacity: 1; }
+						100% { transform: translateY(350px) rotate(360deg); opacity: 0; }
+					}
+				` }), u$2("div", { onClick: handleClose, style: {
+                      position: "fixed",
+                      inset: 0,
+                      backgroundColor: "rgba(0, 20, 40, 0.85)",
+                      backdropFilter: "blur(8px)",
+                      zIndex: 9998,
+                      opacity: isVisible ? 1 : 0,
+                      transition: "opacity 300ms ease-out",
+                  } }), u$2("div", { style: {
+                      position: "fixed",
+                      top: "50%",
+                      left: "50%",
+                      transform: `translate(-50%, -50%) scale(${isVisible ? 1 : 0.9})`,
+                      zIndex: 9999,
+                      width: "92%",
+                      maxWidth: "440px",
+                      opacity: isVisible ? 1 : 0,
+                      transition: "all 300ms cubic-bezier(0.34, 1.56, 0.64, 1)",
+                  }, children: u$2("div", { style: {
+                          position: "relative",
+                          background: "linear-gradient(165deg, #0c4a6e 0%, #0e7490 40%, #0891b2 100%)",
+                          borderRadius: "28px",
+                          overflow: "hidden",
+                          boxShadow: "0 25px 60px -12px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255,255,255,0.1), inset 0 1px 0 rgba(255,255,255,0.2)",
+                      }, children: [Array.from({ length: 15 }).map((_, i) => (u$2("div", { style: {
+                                  position: "absolute",
+                                  left: `${5 + Math.random() * 90}%`,
+                                  top: "-10px",
+                                  fontSize: `${10 + Math.random() * 14}px`,
+                                  color: "white",
+                                  opacity: 0,
+                                  animation: `promo-snow ${4 + Math.random() * 3}s linear infinite`,
+                                  animationDelay: `${Math.random() * 4}s`,
+                                  pointerEvents: "none",
+                                  zIndex: 1,
+                              }, children: "\u2744" }, i))), u$2("div", { style: {
+                                  position: "relative",
+                                  height: "180px",
+                                  background: "linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(12,74,110,0.8) 100%)",
+                                  display: "flex",
+                                  alignItems: "center",
+                                  justifyContent: "center",
+                                  overflow: "hidden",
+                              }, children: [u$2("img", { src: "https://images.unsplash.com/photo-1502680390469-be75c86b636f?w=600&q=80", alt: "Surfer at sunset", style: {
+                                          position: "absolute",
+                                          inset: 0,
+                                          width: "100%",
+                                          height: "100%",
+                                          objectFit: "cover",
+                                          opacity: 0.6,
+                                      } }), u$2("div", { style: {
+                                          position: "absolute",
+                                          inset: 0,
+                                          background: "linear-gradient(180deg, rgba(12,74,110,0.3) 0%, rgba(12,74,110,0.95) 100%)",
+                                      } }), u$2("div", { style: {
+                                          position: "relative",
+                                          zIndex: 2,
+                                          fontSize: "64px",
+                                          animation: "promo-float 3s ease-in-out infinite",
+                                          filter: "drop-shadow(0 8px 16px rgba(0,0,0,0.4))",
+                                      }, children: "\uD83C\uDFC4\u200D\u2642\uFE0F" }), u$2("div", { style: {
+                                          position: "absolute",
+                                          top: "16px",
+                                          left: "20px",
+                                          fontSize: "28px",
+                                          animation: "promo-sparkle 2s ease-in-out infinite",
+                                      }, children: "\uD83C\uDF84" }), u$2("div", { style: {
+                                          position: "absolute",
+                                          top: "20px",
+                                          right: "20px",
+                                          fontSize: "24px",
+                                          animation: "promo-sparkle 2s ease-in-out infinite 0.5s",
+                                      }, children: "\u2B50" })] }), u$2("button", { onClick: handleClose, style: {
+                                  position: "absolute",
+                                  top: "16px",
+                                  right: "16px",
+                                  width: "36px",
+                                  height: "36px",
+                                  borderRadius: "50%",
+                                  border: "none",
+                                  background: "rgba(0, 0, 0, 0.3)",
+                                  backdropFilter: "blur(4px)",
+                                  color: "white",
+                                  fontSize: "22px",
+                                  cursor: "pointer",
+                                  display: "flex",
+                                  alignItems: "center",
+                                  justifyContent: "center",
+                                  transition: "all 150ms ease",
+                                  zIndex: 10,
+                                  lineHeight: 1,
+                              }, onMouseEnter: (e) => {
+                                  e.currentTarget.style.background = "rgba(0, 0, 0, 0.5)";
+                                  e.currentTarget.style.transform = "scale(1.1)";
+                              }, onMouseLeave: (e) => {
+                                  e.currentTarget.style.background = "rgba(0, 0, 0, 0.3)";
+                                  e.currentTarget.style.transform = "scale(1)";
+                              }, children: "\u00D7" }), u$2("div", { style: { padding: "28px 28px 32px", textAlign: "center", position: "relative", zIndex: 2 }, children: [u$2("h2", { style: {
+                                          fontSize: "26px",
+                                          fontWeight: "800",
+                                          color: "white",
+                                          marginBottom: "6px",
+                                          textShadow: "0 2px 8px rgba(0,0,0,0.3)",
+                                          letterSpacing: "-0.5px",
+                                      }, children: "Frohe Weihnachten! \uD83C\uDF85" }), u$2("p", { style: {
+                                          fontSize: "17px",
+                                          color: "rgba(255, 255, 255, 0.9)",
+                                          marginBottom: "20px",
+                                          lineHeight: 1.5,
+                                      }, children: ["Schenk dir oder deinen Liebsten", u$2("br", {}), u$2("strong", { style: { color: "#fbbf24" }, children: "10% Rabatt" }), " auf alle Kurse!"] }), u$2("div", { style: {
+                                          background: "white",
+                                          borderRadius: "16px",
+                                          padding: "18px 20px",
+                                          marginBottom: "20px",
+                                          boxShadow: "0 8px 24px rgba(0,0,0,0.15), inset 0 -2px 0 rgba(0,0,0,0.05)",
+                                      }, children: [u$2("p", { style: {
+                                                  fontSize: "11px",
+                                                  textTransform: "uppercase",
+                                                  letterSpacing: "1.5px",
+                                                  color: "#64748b",
+                                                  marginBottom: "10px",
+                                                  fontWeight: "600",
+                                              }, children: "Dein Geschenk-Code" }), u$2("div", { style: {
+                                                  display: "flex",
+                                                  alignItems: "center",
+                                                  justifyContent: "center",
+                                                  gap: "14px",
+                                              }, children: [u$2("div", { style: {
+                                                          background: "linear-gradient(135deg, #dc2626 0%, #b91c1c 100%)",
+                                                          padding: "10px 20px",
+                                                          borderRadius: "10px",
+                                                          boxShadow: "0 4px 12px rgba(220, 38, 38, 0.3)",
+                                                      }, children: u$2("span", { style: {
+                                                              fontSize: "28px",
+                                                              fontWeight: "900",
+                                                              color: "white",
+                                                              letterSpacing: "6px",
+                                                              textShadow: "0 2px 4px rgba(0,0,0,0.2)",
+                                                          }, children: discountCode }) }), u$2("button", { onClick: handleCopyCode, style: {
+                                                          padding: "12px 16px",
+                                                          borderRadius: "10px",
+                                                          border: "2px solid",
+                                                          borderColor: copied ? "#22c55e" : "#e2e8f0",
+                                                          background: copied ? "#dcfce7" : "#f8fafc",
+                                                          color: copied ? "#15803d" : "#475569",
+                                                          fontSize: "13px",
+                                                          fontWeight: "600",
+                                                          cursor: "pointer",
+                                                          transition: "all 150ms ease",
+                                                          display: "flex",
+                                                          alignItems: "center",
+                                                          gap: "6px",
+                                                          whiteSpace: "nowrap",
+                                                      }, children: copied ? (u$2(k$3, { children: "\u2713 Kopiert!" })) : (u$2(k$3, { children: [u$2("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: [u$2("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }), u$2("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })] }), "Kopieren"] })) })] })] }), u$2("div", { style: {
+                                          display: "flex",
+                                          justifyContent: "center",
+                                          gap: "8px",
+                                          marginBottom: "20px",
+                                          flexWrap: "wrap",
+                                      }, children: ["🏄 Surfen", "🪁 Wingen", "🏄‍♀️ SUP", "💨 Windsurfen"].map((activity) => (u$2("span", { style: {
+                                              background: "rgba(255,255,255,0.15)",
+                                              backdropFilter: "blur(4px)",
+                                              padding: "6px 12px",
+                                              borderRadius: "20px",
+                                              fontSize: "13px",
+                                              color: "white",
+                                              fontWeight: "500",
+                                          }, children: activity }, activity))) }), u$2("button", { onClick: handleCtaClick, style: {
+                                          width: "100%",
+                                          padding: "18px 24px",
+                                          borderRadius: "14px",
+                                          border: "none",
+                                          background: "linear-gradient(135deg, #f59e0b 0%, #d97706 100%)",
+                                          color: "white",
+                                          fontSize: "18px",
+                                          fontWeight: "700",
+                                          cursor: "pointer",
+                                          transition: "all 150ms ease",
+                                          boxShadow: "0 8px 24px rgba(245, 158, 11, 0.4), inset 0 1px 0 rgba(255,255,255,0.2)",
+                                          display: "flex",
+                                          alignItems: "center",
+                                          justifyContent: "center",
+                                          gap: "10px",
+                                      }, onMouseEnter: (e) => {
+                                          e.currentTarget.style.transform = "translateY(-2px)";
+                                          e.currentTarget.style.boxShadow = "0 12px 28px rgba(245, 158, 11, 0.5), inset 0 1px 0 rgba(255,255,255,0.2)";
+                                      }, onMouseLeave: (e) => {
+                                          e.currentTarget.style.transform = "translateY(0)";
+                                          e.currentTarget.style.boxShadow = "0 8px 24px rgba(245, 158, 11, 0.4), inset 0 1px 0 rgba(255,255,255,0.2)";
+                                      }, children: [u$2("span", { style: { animation: "promo-wave 2s ease-in-out infinite" }, children: "\uD83C\uDF81" }), "Jetzt Kurs buchen", u$2("span", { children: "\u2192" })] }), u$2("p", { style: {
+                                          marginTop: "16px",
+                                          fontSize: "12px",
+                                          color: "rgba(255,255,255,0.6)",
+                                      }, children: "G\u00FCltig f\u00FCr alle Buchungen bis 31. Dezember 2025" })] })] }) })] }));
+  }
+
   // Predefined themes & Style Provider have been moved to ../styles/StyleProvider.tsx
   // Main widget component
   function UniversalBookingWidget({ config: baseConfig }) {
@@ -11936,6 +12609,9 @@
       // PERFORMANCE OPTIMIZATION: Lazy component loading
       const [shouldRenderInstanceSelection, setShouldRenderInstanceSelection] = d$1(false);
       const [shouldRenderBookingForm, setShouldRenderBookingForm] = d$1(false);
+      // Promo dialog state
+      const [showPromoDialog, setShowPromoDialog] = d$1(false);
+      const [widgetContainerRef, setWidgetContainerRef] = d$1(null);
       // Determine initial step and load data
       y$1(() => {
           const initializeWidget = async () => {
@@ -12010,6 +12686,46 @@
               setShouldRenderBookingForm(true);
           }
       }, [currentStep, shouldRenderInstanceSelection, shouldRenderBookingForm]);
+      // Promo dialog: show Xmas promo once per user during holiday season, prevent double-opening across multiple widgets
+      y$1(() => {
+          // Only show during holiday season (December and January)
+          const now = new Date();
+          const month = now.getMonth(); // 0 = January, 11 = December
+          const isHolidaySeason = month === 11 || month === 0; // December (11) or January (0)
+          if (!isHolidaySeason) {
+              return;
+          }
+          const promoId = "xmas-2024";
+          const storageKey = `bigz-promo-${promoId}-shown`;
+          const globalFlagKey = `__bigzPromoShown_${promoId}`;
+          // Check if already shown in this session (localStorage) or claimed by another widget (global flag)
+          const alreadyShown = localStorage.getItem(storageKey) === "true";
+          const claimedByOtherWidget = window[globalFlagKey] === true;
+          if (alreadyShown || claimedByOtherWidget) {
+              return;
+          }
+          // Claim this promo for this widget instance (prevents other widgets from showing it)
+          window[globalFlagKey] = true;
+          // Show the dialog after a short delay for better UX
+          const timer = setTimeout(() => {
+              setShowPromoDialog(true);
+          }, 1000);
+          return () => clearTimeout(timer);
+      }, []);
+      // Handle promo dialog close
+      const handlePromoDialogClose = () => {
+          setShowPromoDialog(false);
+          localStorage.setItem("bigz-promo-xmas-2024-shown", "true");
+      };
+      // Handle promo dialog CTA click - scroll to widget
+      const handlePromoCtaClick = () => {
+          setShowPromoDialog(false);
+          localStorage.setItem("bigz-promo-xmas-2024-shown", "true");
+          // Scroll to the widget container
+          if (widgetContainerRef) {
+              widgetContainerRef.scrollIntoView({ behavior: "smooth", block: "start" });
+          }
+      };
       const loadEventTypes = async () => {
           const requestBody = {
               organizationId: config.organizationId,
@@ -12409,104 +13125,104 @@
       // Main view based on view mode
       if (viewMode === "next-events" && showingPreview) {
           // Next events preview mode
-          return (u$2(StyleProvider, { config: config, children: [u$2(NextEventsPreview, { events: upcomingEvents, onEventSelect: handleUpcomingEventSelect, onShowAll: handleShowAllEvents, showAllButtonText: nextEventsSettings.showAllButtonText, showAllButton: nextEventsSettings.showAllButton, isLoadingEventDetails: isLoadingEventDetails, isLoadingShowAll: isLoadingShowAll, isLoading: isLoading }), shouldRenderBookingForm && eventDetails && (u$2(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: () => {
-                          setCurrentStep("eventTypes");
-                          setShowingPreview(true);
-                          setEventDetails(null);
-                      }, onBackToEventTypes: () => {
-                          setCurrentStep("eventTypes");
-                          setShowingPreview(true);
-                          setEventDetails(null);
-                      }, selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: () => {
-                          setCurrentStep("eventTypes");
-                          setShowingPreview(true);
-                          setEventDetails(null);
-                      }, systemConfig: systemConfig })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
-                          setIsSuccess(false);
-                          setCurrentStep("eventTypes");
-                          setShowingPreview(true);
-                          // Reset state
-                          setSuccessPaymentIntentId(null);
-                          // Reset lazy loading flags
-                          setShouldRenderInstanceSelection(false);
-                          setShouldRenderBookingForm(false);
-                          // Clean up URL to remove Stripe parameters
-                          const url = new URL(window.location.href);
-                          url.searchParams.delete("payment_intent");
-                          url.searchParams.delete("payment_intent_client_secret");
-                          url.searchParams.delete("redirect_status");
-                          window.history.replaceState({}, "", url.toString());
-                      }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }));
+          return (u$2(StyleProvider, { config: config, children: [u$2("div", { ref: setWidgetContainerRef, children: [u$2(NextEventsPreview, { events: upcomingEvents, onEventSelect: handleUpcomingEventSelect, onShowAll: handleShowAllEvents, showAllButtonText: nextEventsSettings.showAllButtonText, showAllButton: nextEventsSettings.showAllButton, isLoadingEventDetails: isLoadingEventDetails, isLoadingShowAll: isLoadingShowAll, isLoading: isLoading }), shouldRenderBookingForm && eventDetails && (u$2(BookingForm, { config: config, eventDetails: eventDetails, stripePromise: stripePromise, onSuccess: handleBookingSuccess, onError: handleBookingError, onBackToEventInstances: () => {
+                                  setCurrentStep("eventTypes");
+                                  setShowingPreview(true);
+                                  setEventDetails(null);
+                              }, onBackToEventTypes: () => {
+                                  setCurrentStep("eventTypes");
+                                  setShowingPreview(true);
+                                  setEventDetails(null);
+                              }, selectedEventType: selectedEventType, selectedEventInstance: selectedEventInstance, isOpen: currentStep === "booking" && !!eventDetails, onClose: () => {
+                                  setCurrentStep("eventTypes");
+                                  setShowingPreview(true);
+                                  setEventDetails(null);
+                              }, systemConfig: systemConfig })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
+                                  setIsSuccess(false);
+                                  setCurrentStep("eventTypes");
+                                  setShowingPreview(true);
+                                  // Reset state
+                                  setSuccessPaymentIntentId(null);
+                                  // Reset lazy loading flags
+                                  setShouldRenderInstanceSelection(false);
+                                  setShouldRenderBookingForm(false);
+                                  // Clean up URL to remove Stripe parameters
+                                  const url = new URL(window.location.href);
+                                  url.searchParams.delete("payment_intent");
+                                  url.searchParams.delete("payment_intent_client_secret");
+                                  url.searchParams.delete("redirect_status");
+                                  window.history.replaceState({}, "", url.toString());
+                              }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && (u$2(PromoDialog, { onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
       }
       if (viewMode === "next-events" && !showingPreview && currentStep === "eventInstances") {
           // Show all events for the single event type
-          return (u$2(StyleProvider, { config: config, children: [shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => {
-                          setShowingPreview(true);
-                          setCurrentStep("eventTypes");
-                      }, isOpen: currentStep === "eventInstances", onClose: () => {
-                          setShowingPreview(true);
-                          setCurrentStep("eventTypes");
-                      }, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
-                          setIsSuccess(false);
-                          setCurrentStep("eventTypes");
-                          setShowingPreview(true);
-                          // Reset state
-                          setSuccessPaymentIntentId(null);
-                          // Reset lazy loading flags
-                          setShouldRenderInstanceSelection(false);
-                          setShouldRenderBookingForm(false);
-                          // Clean up URL to remove Stripe parameters
-                          const url = new URL(window.location.href);
-                          url.searchParams.delete("payment_intent");
-                          url.searchParams.delete("payment_intent_client_secret");
-                          url.searchParams.delete("redirect_status");
-                          window.history.replaceState({}, "", url.toString());
-                      }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }));
+          return (u$2(StyleProvider, { config: config, children: [u$2("div", { ref: setWidgetContainerRef, children: [shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => {
+                                  setShowingPreview(true);
+                                  setCurrentStep("eventTypes");
+                              }, isOpen: currentStep === "eventInstances", onClose: () => {
+                                  setShowingPreview(true);
+                                  setCurrentStep("eventTypes");
+                              }, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
+                                  setIsSuccess(false);
+                                  setCurrentStep("eventTypes");
+                                  setShowingPreview(true);
+                                  // Reset state
+                                  setSuccessPaymentIntentId(null);
+                                  // Reset lazy loading flags
+                                  setShouldRenderInstanceSelection(false);
+                                  setShouldRenderBookingForm(false);
+                                  // Clean up URL to remove Stripe parameters
+                                  const url = new URL(window.location.href);
+                                  url.searchParams.delete("payment_intent");
+                                  url.searchParams.delete("payment_intent_client_secret");
+                                  url.searchParams.delete("redirect_status");
+                                  window.history.replaceState({}, "", url.toString());
+                              }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && (u$2(PromoDialog, { onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
       }
       if (viewMode === "button" && (isSingleEventTypeMode || isDirectInstanceMode)) {
           // Button mode - show button that opens sidebar/booking directly
-          return (u$2(StyleProvider, { config: config, children: u$2("div", { style: {
-                      display: "flex",
-                      justifyContent: "center",
-                      alignItems: "center",
-                      minHeight: "120px",
-                  }, children: [u$2("button", { type: "button", style: {
-                              backgroundColor: "var(--bw-highlight-color)",
-                              color: "white",
-                              padding: "16px 32px",
-                              border: "none",
-                              borderRadius: "var(--bw-border-radius)",
-                              fontSize: "18px",
-                              fontWeight: 600,
-                              fontFamily: "var(--bw-font-family)",
-                              boxShadow: "var(--bw-shadow-md)",
-                              cursor: "pointer",
-                          }, onClick: () => {
-                              if (isDirectInstanceMode) {
-                                  setCurrentStep("booking");
-                                  setShouldRenderBookingForm(true);
-                              }
-                              else {
-                                  setSidebarOpen(true);
-                                  setShouldRenderInstanceSelection(true);
-                              }
-                          }, children: config.buttonText ||
-                              (isDirectInstanceMode ? "Jetzt buchen" : "Jetzt Termin auswählen") }), shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen, onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
-                              setIsSuccess(false);
-                              setCurrentStep("eventTypes");
-                              setSidebarOpen(false);
-                              // Reset state
-                              setSuccessPaymentIntentId(null);
-                              // Reset lazy loading flags
-                              setShouldRenderInstanceSelection(false);
-                              setShouldRenderBookingForm(false);
-                              // Clean up URL to remove Stripe parameters
-                              const url = new URL(window.location.href);
-                              url.searchParams.delete("payment_intent");
-                              url.searchParams.delete("payment_intent_client_secret");
-                              url.searchParams.delete("redirect_status");
-                              window.history.replaceState({}, "", url.toString());
-                          }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }) }));
+          return (u$2(StyleProvider, { config: config, children: [u$2("div", { ref: setWidgetContainerRef, style: {
+                          display: "flex",
+                          justifyContent: "center",
+                          alignItems: "center",
+                          minHeight: "120px",
+                      }, children: [u$2("button", { type: "button", style: {
+                                  backgroundColor: "var(--bw-highlight-color)",
+                                  color: "white",
+                                  padding: "16px 32px",
+                                  border: "none",
+                                  borderRadius: "var(--bw-border-radius)",
+                                  fontSize: "18px",
+                                  fontWeight: 600,
+                                  fontFamily: "var(--bw-font-family)",
+                                  boxShadow: "var(--bw-shadow-md)",
+                                  cursor: "pointer",
+                              }, onClick: () => {
+                                  if (isDirectInstanceMode) {
+                                      setCurrentStep("booking");
+                                      setShouldRenderBookingForm(true);
+                                  }
+                                  else {
+                                      setSidebarOpen(true);
+                                      setShouldRenderInstanceSelection(true);
+                                  }
+                              }, children: config.buttonText ||
+                                  (isDirectInstanceMode ? "Jetzt buchen" : "Jetzt Termin auswählen") }), shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: () => setSidebarOpen(false), isOpen: sidebarOpen, onClose: () => setSidebarOpen(false), isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
+                                  setIsSuccess(false);
+                                  setCurrentStep("eventTypes");
+                                  setSidebarOpen(false);
+                                  // Reset state
+                                  setSuccessPaymentIntentId(null);
+                                  // Reset lazy loading flags
+                                  setShouldRenderInstanceSelection(false);
+                                  setShouldRenderBookingForm(false);
+                                  // Clean up URL to remove Stripe parameters
+                                  const url = new URL(window.location.href);
+                                  url.searchParams.delete("payment_intent");
+                                  url.searchParams.delete("payment_intent_client_secret");
+                                  url.searchParams.delete("redirect_status");
+                                  window.history.replaceState({}, "", url.toString());
+                              }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && (u$2(PromoDialog, { onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
       }
       // Cards mode (default) - show event type selection
       const cardsView = (u$2(EventTypeSelection, { eventTypes: eventTypes, onEventTypeSelect: handleEventTypeSelect, isLoading: isLoading, skeletonCount: getSkeletonCount() }));
@@ -12539,21 +13255,21 @@
           };
       };
       const backHandlers = getBackHandlers();
-      return (u$2(StyleProvider, { config: config, children: [cardsView, shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
-                      setIsSuccess(false);
-                      setCurrentStep("eventTypes");
-                      // Reset state
-                      setSuccessPaymentIntentId(null);
-                      // Reset lazy loading flags
-                      setShouldRenderInstanceSelection(false);
-                      setShouldRenderBookingForm(false);
-                      // Clean up URL to remove Stripe parameters
-                      const url = new URL(window.location.href);
-                      url.searchParams.delete("payment_intent");
-                      url.searchParams.delete("payment_intent_client_secret");
-                      url.searchParams.delete("redirect_status");
-                      window.history.replaceState({}, "", url.toString());
-                  }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }));
+      return (u$2(StyleProvider, { config: config, children: [u$2("div", { ref: setWidgetContainerRef, children: [cardsView, shouldRenderInstanceSelection && (u$2(EventInstanceSelection, { eventInstances: eventInstances, selectedEventType: selectedEventType, onEventInstanceSelect: handleEventInstanceSelect, onBackToEventTypes: handleBackToEventTypes, isOpen: currentStep === "eventInstances", onClose: handleBackToEventTypes, isLoadingEventInstances: isLoadingEventInstances, isLoadingEventDetails: isLoadingEventDetails })), shouldRenderBookingForm && eventDetails && (u$2(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 })), u$2(BookingSuccessModal, { isOpen: isSuccess, onClose: () => {
+                              setIsSuccess(false);
+                              setCurrentStep("eventTypes");
+                              // Reset state
+                              setSuccessPaymentIntentId(null);
+                              // Reset lazy loading flags
+                              setShouldRenderInstanceSelection(false);
+                              setShouldRenderBookingForm(false);
+                              // Clean up URL to remove Stripe parameters
+                              const url = new URL(window.location.href);
+                              url.searchParams.delete("payment_intent");
+                              url.searchParams.delete("payment_intent_client_secret");
+                              url.searchParams.delete("redirect_status");
+                              window.history.replaceState({}, "", url.toString());
+                          }, config: config, onError: setError, paymentIntentId: successPaymentIntentId })] }), showPromoDialog && (u$2(PromoDialog, { onClose: handlePromoDialogClose, onCtaClick: handlePromoCtaClick }))] }));
   }
 
   // Export init function for vanilla JS usage with Preact