@mj-biz-apps/orders-ng 5.36.0 → 5.37.0

package/dist/lib/checkout-widget/checkout-widget.component.js

@@ -98,7 +98,7 @@ function MJCheckoutWidgetComponent_Conditional_17_For_4_Conditional_3_Template(r
 } }
 function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_4_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "textarea", 38);
+    i0.ɵɵelementStart(0, "textarea", 37);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_4_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
     i0.ɵɵtext(1, "                                ");
     i0.ɵɵelementEnd();
@@ -120,7 +120,7 @@ function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_For_4_Template(rf
 } }
 function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "select", 39);
+    i0.ɵɵelementStart(0, "select", 38);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template_select_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r5); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
     i0.ɵɵelementStart(1, "option", 21);
     i0.ɵɵtext(2);
@@ -141,7 +141,7 @@ function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template(rf, ctx)
 } }
 function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "label", 34)(1, "input", 40);
+    i0.ɵɵelementStart(0, "label", 34)(1, "input", 39);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r7); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(2, "span");
@@ -158,7 +158,7 @@ function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template(rf, ctx)
 } }
 function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 41);
+    i0.ɵɵelementStart(0, "input", 40);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r8); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -169,7 +169,7 @@ function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template(rf, ctx)
 } }
 function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 42);
+    i0.ɵɵelementStart(0, "input", 41);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r9); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -178,23 +178,31 @@ function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template(rf, ctx)
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngModel", (tmp_12_0 = ctx_r0.units()[0]) == null ? null : tmp_12_0[field_r4.name])("required", field_r4.required || false);
 } }
+function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 43);
+    i0.ɵɵtext(1, "Your member discount is tied to this verified e-mail.");
+    i0.ɵɵelementEnd();
+} }
 function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Template(rf, ctx) { if (rf & 1) {
     const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 43);
+    i0.ɵɵelementStart(0, "input", 42);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r10); const field_r4 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.updateUnitField(0, field_r4.name, $event)); });
     i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(1, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Conditional_1_Template, 2, 0, "p", 43);
 } if (rf & 2) {
     let tmp_13_0;
     const field_r4 = i0.ɵɵnextContext().$implicit;
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("type", field_r4.name.toLowerCase().includes("email") ? "email" : "text")("ngModel", (tmp_13_0 = ctx_r0.units()[0]) == null ? null : tmp_13_0[field_r4.name])("placeholder", field_r4.placeholder || "")("required", field_r4.required || false);
+    i0.ɵɵproperty("type", field_r4.name.toLowerCase().includes("email") ? "email" : "text")("ngModel", (tmp_13_0 = ctx_r0.units()[0]) == null ? null : tmp_13_0[field_r4.name])("placeholder", field_r4.placeholder || "")("readonly", ctx_r0.isLockedEmail(0, field_r4.name))("required", field_r4.required || false);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r0.isLockedEmail(0, field_r4.name) ? 1 : -1);
 } }
 function MJCheckoutWidgetComponent_Conditional_17_For_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 17)(1, "label", 18);
     i0.ɵɵtext(2);
     i0.ɵɵconditionalCreate(3, MJCheckoutWidgetComponent_Conditional_17_For_4_Conditional_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_4_Template, 2, 3, "textarea", 32)(5, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template, 5, 4, "select", 33)(6, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template, 4, 2, "label", 34)(7, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template, 1, 3, "input", 35)(8, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template, 1, 2, "input", 36)(9, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Template, 1, 4, "input", 37);
+    i0.ɵɵconditionalCreate(4, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_4_Template, 2, 3, "textarea", 32)(5, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_5_Template, 5, 4, "select", 33)(6, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_6_Template, 4, 2, "label", 34)(7, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_7_Template, 1, 3, "input", 35)(8, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_8_Template, 1, 2, "input", 36)(9, MJCheckoutWidgetComponent_Conditional_17_For_4_Case_9_Template, 2, 6);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     let tmp_14_0;
@@ -226,7 +234,7 @@ function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Conditional_3_Temp
 } }
 function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_4_Template(rf, ctx) { if (rf & 1) {
     const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "textarea", 38);
+    i0.ɵɵelementStart(0, "textarea", 37);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_4_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
     i0.ɵɵtext(1, "                                            ");
     i0.ɵɵelementEnd();
@@ -247,7 +255,7 @@ function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_For_4_Templ
 } }
 function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template(rf, ctx) { if (rf & 1) {
     const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "select", 39);
+    i0.ɵɵelementStart(0, "select", 38);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template_select_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
     i0.ɵɵelementStart(1, "option", 21);
     i0.ɵɵtext(2);
@@ -267,7 +275,7 @@ function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template(rf
 } }
 function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template(rf, ctx) { if (rf & 1) {
     const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "label", 34)(1, "input", 40);
+    i0.ɵɵelementStart(0, "label", 34)(1, "input", 39);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(2, "span");
@@ -283,7 +291,7 @@ function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template(rf
 } }
 function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template(rf, ctx) { if (rf & 1) {
     const _r20 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 41);
+    i0.ɵɵelementStart(0, "input", 40);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -293,7 +301,7 @@ function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template(rf
 } }
 function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template(rf, ctx) { if (rf & 1) {
     const _r21 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 42);
+    i0.ɵɵelementStart(0, "input", 41);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r21); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -301,22 +309,33 @@ function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template(rf
     const unit_r16 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵproperty("ngModel", unit_r16[field_r14.name])("required", field_r14.required || false);
 } }
+function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 43);
+    i0.ɵɵtext(1, "Your member discount is tied to this verified e-mail.");
+    i0.ɵɵelementEnd();
+} }
 function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Template(rf, ctx) { if (rf & 1) {
     const _r22 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 43);
+    i0.ɵɵelementStart(0, "input", 42);
     i0.ɵɵlistener("ngModelChange", function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r12 = i0.ɵɵnextContext(); const field_r14 = ctx_r12.$implicit; const $index_r15 = ctx_r12.$index; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.updateUnitField($index_r15, field_r14.name, $event)); });
     i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(1, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Conditional_1_Template, 2, 0, "p", 43);
 } if (rf & 2) {
-    const field_r14 = i0.ɵɵnextContext().$implicit;
+    const ctx_r12 = i0.ɵɵnextContext();
+    const field_r14 = ctx_r12.$implicit;
+    const $index_r15 = ctx_r12.$index;
     const unit_r16 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵproperty("type", field_r14.name.toLowerCase().includes("email") ? "email" : "text")("ngModel", unit_r16[field_r14.name])("placeholder", field_r14.placeholder || "")("required", field_r14.required || false);
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("type", field_r14.name.toLowerCase().includes("email") ? "email" : "text")("ngModel", unit_r16[field_r14.name])("placeholder", field_r14.placeholder || "")("readonly", ctx_r0.isLockedEmail($index_r15, field_r14.name))("required", field_r14.required || false);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r0.isLockedEmail($index_r15, field_r14.name) ? 1 : -1);
 } }
 function MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 17)(1, "label", 18);
     i0.ɵɵtext(2);
     i0.ɵɵconditionalCreate(3, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Conditional_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_4_Template, 2, 3, "textarea", 32)(5, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template, 5, 4, "select", 33)(6, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template, 4, 2, "label", 34)(7, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template, 1, 3, "input", 35)(8, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template, 1, 2, "input", 36)(9, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Template, 1, 4, "input", 37);
+    i0.ɵɵconditionalCreate(4, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_4_Template, 2, 3, "textarea", 32)(5, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_5_Template, 5, 4, "select", 33)(6, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_6_Template, 4, 2, "label", 34)(7, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_7_Template, 1, 3, "input", 35)(8, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_8_Template, 1, 2, "input", 36)(9, MJCheckoutWidgetComponent_Conditional_18_For_7_For_5_Case_9_Template, 2, 6);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     let tmp_24_0;
@@ -550,7 +569,7 @@ function MJCheckoutWidgetComponent_For_41_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵrepeater(group_r34.options);
 } }
 function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 75);
+    i0.ɵɵelementStart(0, "p", 76);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -559,7 +578,7 @@ function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_7_T
     i0.ɵɵtextInterpolate(ctx_r0.promotionError);
 } }
 function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 76);
+    i0.ɵɵelementStart(0, "p", 77);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -570,17 +589,17 @@ function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_8_T
 } }
 function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     const _r35 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 66)(1, "label", 71);
+    i0.ɵɵelementStart(0, "div", 66)(1, "label", 72);
     i0.ɵɵtext(2, "Promo code");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 72)(4, "input", 73);
+    i0.ɵɵelementStart(3, "div", 73)(4, "input", 74);
     i0.ɵɵlistener("input", function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Template_input_input_4_listener($event) { i0.ɵɵrestoreView(_r35); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.promotionCodeInput.set($event.target.value)); })("keydown.enter", function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Template_input_keydown_enter_4_listener() { i0.ɵɵrestoreView(_r35); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.applyPromotionCode()); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "button", 74);
+    i0.ɵɵelementStart(5, "button", 75);
     i0.ɵɵlistener("click", function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r35); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.applyPromotionCode()); });
     i0.ɵɵtext(6, "Apply");
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(7, MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_7_Template, 2, 1, "p", 75)(8, MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_8_Template, 2, 3, "p", 76);
+    i0.ɵɵconditionalCreate(7, MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_7_Template, 2, 1, "p", 76)(8, MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Conditional_8_Template, 2, 3, "p", 77);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     let tmp_7_0;
@@ -595,9 +614,19 @@ function MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Template(rf, ct
     i0.ɵɵconditional(ctx_r0.promotionError ? 7 : (tmp_7_0 = ctx_r0.activePromotion()) ? 8 : -1, tmp_7_0);
 } }
 function MJCheckoutWidgetComponent_Conditional_42_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    const _r37 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "label", 67)(1, "input", 60);
-    i0.ɵɵlistener("change", function MJCheckoutWidgetComponent_Conditional_42_Conditional_11_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r37); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.autoRenewConsent.set($event.target.checked)); });
+    i0.ɵɵelementStart(0, "p", 67);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const member_r37 = ctx;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate3(" ", member_r37.code ? member_r37.code + " member discount" : "Member discount", ": \u2212", ctx_r0.currencySymbol(), "", member_r37.discount.toFixed(2), " ");
+} }
+function MJCheckoutWidgetComponent_Conditional_42_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    const _r38 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "label", 68)(1, "input", 60);
+    i0.ɵɵlistener("change", function MJCheckoutWidgetComponent_Conditional_42_Conditional_12_Template_input_change_1_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.autoRenewConsent.set($event.target.checked)); });
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
@@ -609,11 +638,11 @@ function MJCheckoutWidgetComponent_Conditional_42_Conditional_11_Template(rf, ct
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(ctx);
 } }
-function MJCheckoutWidgetComponent_Conditional_42_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 68)(1, "span", 69);
+function MJCheckoutWidgetComponent_Conditional_42_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 69)(1, "span", 70);
     i0.ɵɵtext(2, "Sales Tax");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 70);
+    i0.ɵɵelementStart(3, "span", 71);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -634,28 +663,32 @@ function MJCheckoutWidgetComponent_Conditional_42_Template(rf, ctx) { if (rf & 1
     i0.ɵɵtext(9, "Secured by Stripe \u2022 PCI-DSS Level 1 Certified \u2022 End-to-end Encrypted");
     i0.ɵɵelementEnd()()()();
     i0.ɵɵconditionalCreate(10, MJCheckoutWidgetComponent_Conditional_42_Conditional_10_Template, 9, 8, "div", 66);
-    i0.ɵɵconditionalCreate(11, MJCheckoutWidgetComponent_Conditional_42_Conditional_11_Template, 4, 3, "label", 67);
-    i0.ɵɵconditionalCreate(12, MJCheckoutWidgetComponent_Conditional_42_Conditional_12_Template, 5, 2, "div", 68);
-    i0.ɵɵelementStart(13, "div", 68)(14, "span", 69);
-    i0.ɵɵtext(15, "Total Due");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(16, "span", 70);
-    i0.ɵɵtext(17);
+    i0.ɵɵconditionalCreate(11, MJCheckoutWidgetComponent_Conditional_42_Conditional_11_Template, 2, 3, "p", 67);
+    i0.ɵɵconditionalCreate(12, MJCheckoutWidgetComponent_Conditional_42_Conditional_12_Template, 4, 3, "label", 68);
+    i0.ɵɵconditionalCreate(13, MJCheckoutWidgetComponent_Conditional_42_Conditional_13_Template, 5, 2, "div", 69);
+    i0.ɵɵelementStart(14, "div", 69)(15, "span", 70);
+    i0.ɵɵtext(16, "Total Due");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(17, "span", 71);
+    i0.ɵɵtext(18);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     let tmp_2_0;
+    let tmp_3_0;
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance(10);
     i0.ɵɵconditional(ctx_r0.allowsPromotionCodes() ? 10 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional((tmp_2_0 = ctx_r0.autoRenewConsentText()) ? 11 : -1, tmp_2_0);
+    i0.ɵɵconditional((tmp_2_0 = ctx_r0.activeMemberDiscount()) ? 11 : -1, tmp_2_0);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r0.quotedTax !== null ? 12 : -1);
+    i0.ɵɵconditional((tmp_3_0 = ctx_r0.autoRenewConsentText()) ? 12 : -1, tmp_3_0);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r0.quotedTax !== null ? 13 : -1);
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate2("", ctx_r0.currencySymbol(), "", ctx_r0.totalGross().toFixed(2));
 } }
 function MJCheckoutWidgetComponent_Conditional_45_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 77);
+    i0.ɵɵelement(0, "span", 78);
     i0.ɵɵelementStart(1, "span");
     i0.ɵɵtext(2, "Processing...");
     i0.ɵɵelementEnd();
@@ -717,6 +750,23 @@ export class MJCheckoutWidgetComponent {
     }
     /** Why the last code could not be used, in the server's words. Set by the host. */
     promotionError = null;
+    _memberDiscount = signal(null, ...(ngDevMode ? [{ debugName: "_memberDiscount" }] : []));
+    /**
+     * The verified member's discount the server priced this checkout with, or null (#919). Set by the
+     * host from a draft. While it holds, the widget shows it as a discount line and hides the
+     * promo-code box: the member code is the one the order carries, as it was on CDP's checkout.
+     */
+    set memberDiscount(val) {
+        this._memberDiscount.set(val);
+    }
+    get memberDiscount() {
+        return this._memberDiscount();
+    }
+    /**
+     * True when the e-mail is the one a member token was signed for (#919). The field is read-only,
+     * since the discount is bound to that address and a changed one would price at full rate.
+     */
+    lockEmail = false;
     _serverPricedTotal = signal(null, ...(ngDevMode ? [{ debugName: "_serverPricedTotal" }] : []));
     /**
      * The total the server last priced this checkout at, or null. Set by the host after a draft, so a
@@ -753,6 +803,12 @@ export class MJCheckoutWidgetComponent {
     cancelled = new EventEmitter();
     /** Emitted when an input that changes the price (quantity, location) changes, so the host drops its quote. */
     quoteInvalidated = new EventEmitter();
+    /**
+     * The form as it stands, with no typed code, each time a price input changes while the e-mail
+     * and billing location are complete (#919). A host with a member token prices it in the
+     * background so the buyer sees the member discount before Pay; other hosts ignore it.
+     */
+    quoteRequested = new EventEmitter();
     // Internal error message for client-side validation failures
     internalErrorMessage = signal(null, ...(ngDevMode ? [{ debugName: "internalErrorMessage" }] : []));
     displayErrorMessage = computed(() => this._errorMessage() || this.internalErrorMessage(), ...(ngDevMode ? [{ debugName: "displayErrorMessage" }] : []));
@@ -893,8 +949,16 @@ export class MJCheckoutWidgetComponent {
         const price = this._config()?.unitPrice ?? 0;
         return price * this.quantity();
     }, ...(ngDevMode ? [{ debugName: "subtotal" }] : []));
-    /** Whether this widget takes promotion codes — only for a paid checkout whose configuration invites them. */
-    allowsPromotionCodes = computed(() => this._config()?.allowCoupons === true && !this.isFree(), ...(ngDevMode ? [{ debugName: "allowsPromotionCodes" }] : []));
+    /** The member discount, when it was priced for the current quantity; a stale one is ignored. */
+    activeMemberDiscount = computed(() => {
+        const discount = this._memberDiscount();
+        return discount && discount.quantity === this.quantity() ? discount : null;
+    }, ...(ngDevMode ? [{ debugName: "activeMemberDiscount" }] : []));
+    /**
+     * Whether this widget takes promotion codes — only for a paid checkout whose configuration invites
+     * them, and not while a verified member's discount applies (#919).
+     */
+    allowsPromotionCodes = computed(() => this._config()?.allowCoupons === true && !this.isFree() && !this.activeMemberDiscount(), ...(ngDevMode ? [{ debugName: "allowsPromotionCodes" }] : []));
     /** The applied promotion, when it was priced for the current quantity; a stale one is ignored. */
     activePromotion = computed(() => {
         const applied = this._appliedPromotion();
@@ -1034,6 +1098,7 @@ export class MJCheckoutWidgetComponent {
         this.quantity.set(clamped);
         this.syncUnits();
         this.quoteInvalidated.emit();
+        this.requestQuote();
         this.executeLifecycleHook('onQuantityChange', { quantity: clamped });
     }
     onBillingCountryChange(country) {
@@ -1041,14 +1106,31 @@ export class MJCheckoutWidgetComponent {
         // A region belongs to one country; keeping it across a change would submit a wrong pairing.
         this.billingRegion.set('');
         this.quoteInvalidated.emit();
+        this.requestQuote();
     }
     onBillingRegionChange(region) {
         this.billingRegion.set(region ?? '');
         this.quoteInvalidated.emit();
+        this.requestQuote();
     }
     onBillingPostalCodeChange(postalCode) {
         this.billingPostalCode.set(postalCode ?? '');
         this.quoteInvalidated.emit();
+        this.requestQuote();
+    }
+    /** The buyer's e-mail looks complete: the same check `isFormValid` makes. */
+    hasValidEmail() {
+        const em = String(this.units()[0]?.['email'] || this.email()).trim();
+        return em.includes('@');
+    }
+    /**
+     * Ask the host for a background price once the e-mail and the billing location are complete
+     * (#919). Never blocks the form; the host decides whether to price at all.
+     */
+    requestQuote() {
+        if (!this.hasValidEmail() || !this.isBillingLocationValid())
+            return;
+        this.quoteRequested.emit({ ...this.buildSubmission(), promotionCode: undefined });
     }
     syncUnits() {
         const currentQty = this.quantity();
@@ -1109,8 +1191,18 @@ export class MJCheckoutWidgetComponent {
                     this.title.set(String(value ?? ''));
             }
             this.units.set(list);
+            if (index === 0 && fieldName === 'email') {
+                // A member discount is bound to the e-mail, so a changed one drops it and prices again (#919).
+                if (this._memberDiscount())
+                    this.quoteInvalidated.emit();
+                this.requestQuote();
+            }
         }
     }
+    /** True for the first unit's e-mail field while it is locked to a member token's address (#919). */
+    isLockedEmail(index, fieldName) {
+        return this.lockEmail && index === 0 && fieldName.toLowerCase() === 'email';
+    }
     updateAttendee(index, field, value) {
         this.updateUnitField(index, field, value);
     }
@@ -1243,11 +1335,13 @@ export class MJCheckoutWidgetComponent {
             stripePaymentMethodId: this.isFree() ? undefined : (this.stripePaymentMethodId ?? undefined),
             sessionKey: finalSessionKey,
             autoRenewConsent: this.autoRenewConsentText() ? this.autoRenewConsent() : undefined,
+            // allowsPromotionCodes is false while a member discount applies: the box is hidden, so a
+            // code typed before it appeared is not sent behind the buyer's back.
             promotionCode: this.allowsPromotionCodes() && typedCode ? typedCode : undefined
         };
     }
     static ɵfac = function MJCheckoutWidgetComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MJCheckoutWidgetComponent)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.Renderer2)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJCheckoutWidgetComponent, selectors: [["mj-checkout-widget"]], inputs: { config: "config", distributionSlug: "distributionSlug", sessionKey: "sessionKey", isProcessing: "isProcessing", errorMessage: "errorMessage", isPaymentReady: "isPaymentReady", stripePaymentMethodId: "stripePaymentMethodId", prefillEmail: "prefillEmail", appliedPromotion: "appliedPromotion", promotionError: "promotionError", serverPricedTotal: "serverPricedTotal", quotedTotal: "quotedTotal", quotedTax: "quotedTax" }, outputs: { submitted: "submitted", promotionCodeApplied: "promotionCodeApplied", cancelled: "cancelled", quoteInvalidated: "quoteInvalidated" }, features: [i0.ɵɵNgOnChangesFeature], decls: 50, vars: 35, consts: [[1, "mj-checkout-widget-container"], [1, "mj-widget-header"], [1, "mj-widget-title"], [1, "mj-widget-description"], ["role", "alert", 1, "mj-widget-error-banner"], [1, "mj-widget-summary-card"], [1, "mj-summary-row"], [1, "mj-summary-item-info"], [1, "mj-product-name"], [1, "mj-badge-free"], [1, "mj-summary-price"], [1, "mj-price-free"], [1, "mj-price-amount"], [1, "mj-quantity-selector-row"], [1, "mj-widget-form-section"], [1, "mj-section-title"], [1, "mj-form-grid"], [1, "mj-form-group"], [1, "mj-label"], [1, "mj-required"], ["autocomplete", "country", "required", "", 1, "mj-select", 3, "ngModelChange", "id", "ngModel"], [3, "ngValue"], ["type", "text", "autocomplete", "postal-code", "maxlength", "20", 1, "mj-input", 3, "ngModelChange", "id", "ngModel", "required"], [1, "mj-widget-actions"], ["type", "button", 1, "mj-btn-submit", 3, "click", "disabled"], ["type", "button", 1, "mj-btn-cancel", 3, "click", "disabled"], [1, "mj-error-icon"], ["for", "quantityInput", 1, "mj-label"], [1, "mj-qty-controls"], ["type", "button", 1, "mj-qty-btn", 3, "click", "disabled"], ["id", "quantityInput", "type", "number", "min", "1", 1, "mj-qty-input", 3, "ngModelChange", "ngModel", "max"], [1, "mj-form-group", 3, "full-width"], [1, "mj-input", "mj-textarea", 3, "ngModel", "placeholder", "required"], [1, "mj-select", 3, "ngModel", "required"], [1, "mj-checkbox-label"], ["type", "number", 1, "mj-input", 3, "ngModel", "placeholder", "required"], ["type", "date", 1, "mj-input", 3, "ngModel", "required"], [1, "mj-input", 3, "type", "ngModel", "placeholder", "required"], [1, "mj-input", "mj-textarea", 3, "ngModelChange", "ngModel", "placeholder", "required"], [1, "mj-select", 3, "ngModelChange", "ngModel", "required"], ["type", "checkbox", 3, "ngModelChange", "ngModel"], ["type", "number", 1, "mj-input", 3, "ngModelChange", "ngModel", "placeholder", "required"], ["type", "date", 1, "mj-input", 3, "ngModelChange", "ngModel", "required"], [1, "mj-input", 3, "ngModelChange", "type", "ngModel", "placeholder", "required"], [1, "mj-multi-attendee-header"], ["type", "button", 1, "mj-btn-link", 3, "click"], [1, "mj-attendee-matrix"], [1, "mj-attendee-card"], [1, "mj-attendee-card-title"], ["autocomplete", "address-level1", "required", "", 1, "mj-select", 3, "ngModelChange", "id", "ngModel"], [1, "mj-form-group", "full-width"], ["type", "text", 1, "mj-input", 3, "id", "ngModel", "required"], [1, "mj-select", 3, "ngModelChange", "id", "ngModel", "required"], ["type", "text", "placeholder", "Please specify", "required", "", 1, "mj-input", "mj-question-other", 3, "ngModel"], ["type", "text", "placeholder", "Please specify", "required", "", 1, "mj-input", "mj-question-other", 3, "ngModelChange", "ngModel"], ["type", "text", 1, "mj-input", 3, "ngModelChange", "id", "ngModel", "required"], [1, "mj-choice-group"], [1, "mj-choice-count"], [1, "mj-choice-options"], [1, "mj-checkbox-label", 3, "is-disabled"], ["type", "checkbox", 3, "change", "checked", "disabled"], [1, "mj-widget-payment-section"], [1, "mj-stripe-container"], ["id", "stripe-card-element", 1, "mj-stripe-mount-point"], [1, "mj-stripe-badge"], [1, "mj-stripe-lock-icon"], [1, "mj-checkout-promo"], [1, "mj-checkout-consent"], [1, "mj-checkout-total-row"], [1, "mj-total-label"], [1, "mj-total-amount"], [1, "mj-checkout-promo__label", 3, "for"], [1, "mj-checkout-promo__row"], ["type", "text", "autocomplete", "off", "maxlength", "60", 1, "mj-input", "mj-checkout-promo__input", 3, "input", "keydown.enter", "id", "value", "disabled"], ["type", "button", 1, "mj-checkout-promo__apply", 3, "click", "disabled"], ["role", "alert", 1, "mj-checkout-promo__error"], ["role", "status", 1, "mj-checkout-promo__applied"], [1, "mj-spinner"]], template: function MJCheckoutWidgetComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJCheckoutWidgetComponent, selectors: [["mj-checkout-widget"]], inputs: { config: "config", distributionSlug: "distributionSlug", sessionKey: "sessionKey", isProcessing: "isProcessing", errorMessage: "errorMessage", isPaymentReady: "isPaymentReady", stripePaymentMethodId: "stripePaymentMethodId", prefillEmail: "prefillEmail", appliedPromotion: "appliedPromotion", promotionError: "promotionError", memberDiscount: "memberDiscount", lockEmail: "lockEmail", serverPricedTotal: "serverPricedTotal", quotedTotal: "quotedTotal", quotedTax: "quotedTax" }, outputs: { submitted: "submitted", promotionCodeApplied: "promotionCodeApplied", cancelled: "cancelled", quoteInvalidated: "quoteInvalidated", quoteRequested: "quoteRequested" }, features: [i0.ɵɵNgOnChangesFeature], decls: 50, vars: 35, consts: [[1, "mj-checkout-widget-container"], [1, "mj-widget-header"], [1, "mj-widget-title"], [1, "mj-widget-description"], ["role", "alert", 1, "mj-widget-error-banner"], [1, "mj-widget-summary-card"], [1, "mj-summary-row"], [1, "mj-summary-item-info"], [1, "mj-product-name"], [1, "mj-badge-free"], [1, "mj-summary-price"], [1, "mj-price-free"], [1, "mj-price-amount"], [1, "mj-quantity-selector-row"], [1, "mj-widget-form-section"], [1, "mj-section-title"], [1, "mj-form-grid"], [1, "mj-form-group"], [1, "mj-label"], [1, "mj-required"], ["autocomplete", "country", "required", "", 1, "mj-select", 3, "ngModelChange", "id", "ngModel"], [3, "ngValue"], ["type", "text", "autocomplete", "postal-code", "maxlength", "20", 1, "mj-input", 3, "ngModelChange", "id", "ngModel", "required"], [1, "mj-widget-actions"], ["type", "button", 1, "mj-btn-submit", 3, "click", "disabled"], ["type", "button", 1, "mj-btn-cancel", 3, "click", "disabled"], [1, "mj-error-icon"], ["for", "quantityInput", 1, "mj-label"], [1, "mj-qty-controls"], ["type", "button", 1, "mj-qty-btn", 3, "click", "disabled"], ["id", "quantityInput", "type", "number", "min", "1", 1, "mj-qty-input", 3, "ngModelChange", "ngModel", "max"], [1, "mj-form-group", 3, "full-width"], [1, "mj-input", "mj-textarea", 3, "ngModel", "placeholder", "required"], [1, "mj-select", 3, "ngModel", "required"], [1, "mj-checkbox-label"], ["type", "number", 1, "mj-input", 3, "ngModel", "placeholder", "required"], ["type", "date", 1, "mj-input", 3, "ngModel", "required"], [1, "mj-input", "mj-textarea", 3, "ngModelChange", "ngModel", "placeholder", "required"], [1, "mj-select", 3, "ngModelChange", "ngModel", "required"], ["type", "checkbox", 3, "ngModelChange", "ngModel"], ["type", "number", 1, "mj-input", 3, "ngModelChange", "ngModel", "placeholder", "required"], ["type", "date", 1, "mj-input", 3, "ngModelChange", "ngModel", "required"], [1, "mj-input", 3, "ngModelChange", "type", "ngModel", "placeholder", "readonly", "required"], [1, "mj-field-hint"], [1, "mj-multi-attendee-header"], ["type", "button", 1, "mj-btn-link", 3, "click"], [1, "mj-attendee-matrix"], [1, "mj-attendee-card"], [1, "mj-attendee-card-title"], ["autocomplete", "address-level1", "required", "", 1, "mj-select", 3, "ngModelChange", "id", "ngModel"], [1, "mj-form-group", "full-width"], ["type", "text", 1, "mj-input", 3, "id", "ngModel", "required"], [1, "mj-select", 3, "ngModelChange", "id", "ngModel", "required"], ["type", "text", "placeholder", "Please specify", "required", "", 1, "mj-input", "mj-question-other", 3, "ngModel"], ["type", "text", "placeholder", "Please specify", "required", "", 1, "mj-input", "mj-question-other", 3, "ngModelChange", "ngModel"], ["type", "text", 1, "mj-input", 3, "ngModelChange", "id", "ngModel", "required"], [1, "mj-choice-group"], [1, "mj-choice-count"], [1, "mj-choice-options"], [1, "mj-checkbox-label", 3, "is-disabled"], ["type", "checkbox", 3, "change", "checked", "disabled"], [1, "mj-widget-payment-section"], [1, "mj-stripe-container"], ["id", "stripe-card-element", 1, "mj-stripe-mount-point"], [1, "mj-stripe-badge"], [1, "mj-stripe-lock-icon"], [1, "mj-checkout-promo"], ["role", "status", 1, "mj-checkout-promo__applied", "mj-checkout-member-discount"], [1, "mj-checkout-consent"], [1, "mj-checkout-total-row"], [1, "mj-total-label"], [1, "mj-total-amount"], [1, "mj-checkout-promo__label", 3, "for"], [1, "mj-checkout-promo__row"], ["type", "text", "autocomplete", "off", "maxlength", "60", 1, "mj-input", "mj-checkout-promo__input", 3, "input", "keydown.enter", "id", "value", "disabled"], ["type", "button", 1, "mj-checkout-promo__apply", 3, "click", "disabled"], ["role", "alert", 1, "mj-checkout-promo__error"], ["role", "status", 1, "mj-checkout-promo__applied"], [1, "mj-spinner"]], template: function MJCheckoutWidgetComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "header", 1)(2, "h2", 2);
             i0.ɵɵtext(3);
             i0.ɵɵelementEnd();
@@ -1292,7 +1386,7 @@ export class MJCheckoutWidgetComponent {
             i0.ɵɵelementEnd()()()();
             i0.ɵɵconditionalCreate(39, MJCheckoutWidgetComponent_Conditional_39_Template, 6, 0, "section", 14);
             i0.ɵɵrepeaterCreate(40, MJCheckoutWidgetComponent_For_41_Template, 10, 3, "section", 14, _forTrack1);
-            i0.ɵɵconditionalCreate(42, MJCheckoutWidgetComponent_Conditional_42_Template, 18, 5);
+            i0.ɵɵconditionalCreate(42, MJCheckoutWidgetComponent_Conditional_42_Template, 19, 6);
             i0.ɵɵelementStart(43, "div", 23)(44, "button", 24);
             i0.ɵɵlistener("click", function MJCheckoutWidgetComponent_Template_button_click_44_listener() { return ctx.handleSubmit(); });
             i0.ɵɵconditionalCreate(45, MJCheckoutWidgetComponent_Conditional_45_Template, 3, 0)(46, MJCheckoutWidgetComponent_Conditional_46_Template, 2, 0, "span")(47, MJCheckoutWidgetComponent_Conditional_47_Template, 2, 2, "span");
@@ -1353,11 +1447,11 @@ export class MJCheckoutWidgetComponent {
             i0.ɵɵconditional(ctx.isProcessing ? 45 : ctx.isFree() ? 46 : 47);
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("disabled", ctx.isProcessing);
-        } }, dependencies: [CommonModule, FormsModule, i1.NgSelectOption, i1.ɵNgSelectMultipleOption, i1.DefaultValueAccessor, i1.NumberValueAccessor, i1.CheckboxControlValueAccessor, i1.SelectControlValueAccessor, i1.NgControlStatus, i1.RequiredValidator, i1.MaxLengthValidator, i1.MinValidator, i1.MaxValidator, i1.NgModel], styles: ["[_nghost-%COMP%] {\n    display: block;\n    font-family: var(--mj-font-family, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);\n    color: var(--mj-text-color, #1e293b);\n}\n\n.mj-checkout-widget-container[_ngcontent-%COMP%] {\n    max-width: 560px;\n    margin: 0 auto;\n    background: var(--mj-bg-color, #ffffff);\n    border: 1px solid #e2e8f0;\n    border-radius: var(--mj-border-radius, 8px);\n    padding: 24px;\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);\n}\n\n.mj-widget-header[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.mj-widget-title[_ngcontent-%COMP%] {\n    margin: 0 0 6px 0;\n    font-size: 1.35rem;\n    font-weight: 700;\n    color: var(--mj-text-color, #0f172a);\n}\n\n.mj-widget-description[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 0.9rem;\n    color: #64748b;\n    line-height: 1.4;\n}\n\n.mj-widget-error-banner[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: #fef2f2;\n    border: 1px solid #f87171;\n    color: #991b1b;\n    padding: 10px 14px;\n    border-radius: 6px;\n    margin-bottom: 18px;\n    font-size: 0.875rem;\n}\n\n.mj-error-icon[_ngcontent-%COMP%] {\n    font-size: 1rem;\n}\n\n.mj-widget-summary-card[_ngcontent-%COMP%] {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px 16px;\n    margin-bottom: 20px;\n}\n\n.mj-summary-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n\n.mj-summary-price[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n}\n\n.mj-widget-form-section[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.mj-summary-item-info[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.mj-product-name[_ngcontent-%COMP%] {\n    font-weight: 600;\n    font-size: 1rem;\n    color: #1e293b;\n}\n\n.mj-badge-free[_ngcontent-%COMP%] {\n    background: #dcfce7;\n    color: #166534;\n    font-size: 0.75rem;\n    font-weight: 700;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.mj-price-free[_ngcontent-%COMP%] {\n    font-weight: 700;\n    color: #166534;\n    font-size: 1.1rem;\n}\n\n.mj-price-amount[_ngcontent-%COMP%] {\n    font-weight: 700;\n    color: #0f172a;\n    font-size: 1.1rem;\n}\n\n.mj-quantity-selector-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-top: 12px;\n    padding-top: 12px;\n    border-top: 1px dashed #cbd5e1;\n}\n\n.mj-qty-controls[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mj-qty-btn[_ngcontent-%COMP%] {\n    width: 28px;\n    height: 28px;\n    background: #ffffff;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    cursor: pointer;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.mj-qty-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.mj-qty-input[_ngcontent-%COMP%] {\n    width: 44px;\n    height: 28px;\n    text-align: center;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    font-weight: 600;\n}\n\n.mj-section-title[_ngcontent-%COMP%] {\n    font-size: 1rem;\n    font-weight: 600;\n    margin: 0 0 12px 0;\n    color: #334155;\n}\n\n.mj-form-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n    margin-bottom: 18px;\n}\n\n.mj-form-group[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.mj-form-group.full-width[_ngcontent-%COMP%] {\n    grid-column: 1 / -1;\n}\n\n.mj-label[_ngcontent-%COMP%] {\n    font-size: 0.8rem;\n    font-weight: 500;\n    color: #475569;\n}\n\n.mj-required[_ngcontent-%COMP%] {\n    color: #ef4444;\n}\n\n.mj-input[_ngcontent-%COMP%], .mj-select[_ngcontent-%COMP%] {\n    padding: 8px 12px;\n    font-size: 0.9rem;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    background: #ffffff;\n    color: #1e293b;\n    outline: none;\n    transition: border-color 0.15s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.mj-textarea[_ngcontent-%COMP%] {\n    min-height: 70px;\n    resize: vertical;\n    font-family: inherit;\n}\n\n.mj-select[_ngcontent-%COMP%] {\n    min-height: 38px;\n}\n\n.mj-checkbox-label[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n    font-size: 0.9rem;\n    font-weight: 400;\n    color: #334155;\n    margin-top: 4px;\n}\n\n\n\n.mj-question-other[_ngcontent-%COMP%] {\n    margin-top: 8px;\n}\n\n\n\n.mj-choice-group[_ngcontent-%COMP%] {\n    border: 0;\n    margin: 0;\n    padding: 0;\n}\n\n.mj-choice-count[_ngcontent-%COMP%] {\n    font-weight: normal;\n    color: #64748b;\n}\n\n.mj-choice-options[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.mj-checkbox-label.is-disabled[_ngcontent-%COMP%] {\n    cursor: not-allowed;\n    opacity: 0.55;\n}\n\n.mj-input[_ngcontent-%COMP%]:focus, .mj-select[_ngcontent-%COMP%]:focus {\n    border-color: var(--mj-primary-color, #2563eb);\n    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);\n}\n\n.mj-multi-attendee-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.mj-btn-link[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    color: var(--mj-primary-color, #2563eb);\n    font-size: 0.8rem;\n    cursor: pointer;\n    text-decoration: underline;\n    padding: 0;\n}\n\n.mj-attendee-matrix[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    margin-bottom: 20px;\n}\n\n.mj-attendee-card[_ngcontent-%COMP%] {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 12px 14px;\n}\n\n.mj-attendee-card-title[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #475569;\n    margin-bottom: 10px;\n}\n\n\n\n.mj-widget-payment-section[_ngcontent-%COMP%] {\n    margin-top: 16px;\n    padding-top: 16px;\n    border-top: 1px solid #e2e8f0;\n}\n\n.mj-stripe-container[_ngcontent-%COMP%] {\n    background: #ffffff;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px;\n    margin-bottom: 16px;\n}\n\n.mj-stripe-mount-point[_ngcontent-%COMP%] {\n    min-height: 40px;\n}\n\n.mj-stripe-badge[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    margin-top: 10px;\n    font-size: 0.75rem;\n    color: #64748b;\n}\n\n.mj-stripe-lock-icon[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n}\n\n.mj-checkout-total-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 0;\n    border-top: 1px solid #e2e8f0;\n    margin-top: 10px;\n    margin-bottom: 18px;\n}\n\n.mj-total-label[_ngcontent-%COMP%] {\n    font-weight: 700;\n    font-size: 1.05rem;\n    color: #0f172a;\n}\n\n.mj-total-amount[_ngcontent-%COMP%] {\n    font-weight: 800;\n    font-size: 1.25rem;\n    color: var(--mj-primary-color, #2563eb);\n}\n\n.mj-widget-actions[_ngcontent-%COMP%] {\n    margin-top: 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 12px;\n    background: var(--mj-primary-color, #2563eb);\n    color: #ffffff;\n    font-size: 1rem;\n    font-weight: 600;\n    border: none;\n    border-radius: var(--mj-border-radius, 8px);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: opacity 0.15s ease;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%]:hover:not(:disabled) {\n    opacity: 0.92;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.mj-btn-cancel[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 8px 12px;\n    background: transparent;\n    color: #64748b;\n    font-size: 0.875rem;\n    font-weight: 500;\n    border: none;\n    cursor: pointer;\n    text-align: center;\n}\n\n.mj-btn-cancel[_ngcontent-%COMP%]:hover:not(:disabled) {\n    color: #334155;\n    text-decoration: underline;\n}\n\n.mj-spinner[_ngcontent-%COMP%] {\n    width: 16px;\n    height: 16px;\n    border: 2px solid #ffffff;\n    border-top-color: transparent;\n    border-radius: 50%;\n    animation: _ngcontent-%COMP%_mj-spin 0.8s linear infinite;\n}\n\n@keyframes _ngcontent-%COMP%_mj-spin {\n    to { transform: rotate(360deg); }\n}\n\n.mj-checkout-consent[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 0.5rem;\n    align-items: flex-start;\n    margin: 0.75rem 0;\n    font-size: 0.875rem;\n    font-weight: 400;\n    line-height: 1.4;\n}\n.mj-checkout-consent[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    margin-top: 0.2rem;\n}\n\n\n\n\n\n.mj-checkbox-label[_ngcontent-%COMP%]   input[type=checkbox][_ngcontent-%COMP%], \n.mj-checkout-consent[_ngcontent-%COMP%]   input[type=checkbox][_ngcontent-%COMP%] {\n    width: auto;\n    height: auto;\n    padding: 0;\n    border: 0;\n    flex: 0 0 auto;\n}\n\n.mj-checkout-promo[_ngcontent-%COMP%] {\n    margin: 0.75rem 0;\n}\n.mj-checkout-promo__label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 0.875rem;\n    margin-bottom: 0.25rem;\n}\n.mj-checkout-promo__row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 0.5rem;\n}\n.mj-checkout-promo__input[_ngcontent-%COMP%] {\n    flex: 1 1 auto;\n}\n.mj-checkout-promo__error[_ngcontent-%COMP%] {\n    color: var(--mj-error-color, #b91c1c);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-promo__applied[_ngcontent-%COMP%] {\n    color: var(--mj-success-color, #15803d);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-promo__apply[_ngcontent-%COMP%] {\n    flex: 0 0 auto;\n    padding: 8px 14px;\n    background: transparent;\n    color: var(--mj-primary-color, #2563eb);\n    border: 1px solid var(--mj-border-color, #cbd5e1);\n    border-radius: var(--mj-border-radius, 8px);\n    font-size: 0.875rem;\n    font-weight: 600;\n    cursor: pointer;\n}\n.mj-checkout-promo__apply[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}"], changeDetection: 0 });
+        } }, dependencies: [CommonModule, FormsModule, i1.NgSelectOption, i1.ɵNgSelectMultipleOption, i1.DefaultValueAccessor, i1.NumberValueAccessor, i1.CheckboxControlValueAccessor, i1.SelectControlValueAccessor, i1.NgControlStatus, i1.RequiredValidator, i1.MaxLengthValidator, i1.MinValidator, i1.MaxValidator, i1.NgModel], styles: ["[_nghost-%COMP%] {\n    display: block;\n    font-family: var(--mj-font-family, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);\n    color: var(--mj-text-color, #1e293b);\n}\n\n.mj-checkout-widget-container[_ngcontent-%COMP%] {\n    max-width: 560px;\n    margin: 0 auto;\n    background: var(--mj-bg-color, #ffffff);\n    border: 1px solid #e2e8f0;\n    border-radius: var(--mj-border-radius, 8px);\n    padding: 24px;\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);\n}\n\n.mj-widget-header[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.mj-widget-title[_ngcontent-%COMP%] {\n    margin: 0 0 6px 0;\n    font-size: 1.35rem;\n    font-weight: 700;\n    color: var(--mj-text-color, #0f172a);\n}\n\n.mj-widget-description[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 0.9rem;\n    color: #64748b;\n    line-height: 1.4;\n}\n\n.mj-widget-error-banner[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: #fef2f2;\n    border: 1px solid #f87171;\n    color: #991b1b;\n    padding: 10px 14px;\n    border-radius: 6px;\n    margin-bottom: 18px;\n    font-size: 0.875rem;\n}\n\n.mj-error-icon[_ngcontent-%COMP%] {\n    font-size: 1rem;\n}\n\n.mj-widget-summary-card[_ngcontent-%COMP%] {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px 16px;\n    margin-bottom: 20px;\n}\n\n.mj-summary-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n\n.mj-summary-price[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n}\n\n.mj-widget-form-section[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.mj-summary-item-info[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.mj-product-name[_ngcontent-%COMP%] {\n    font-weight: 600;\n    font-size: 1rem;\n    color: #1e293b;\n}\n\n.mj-badge-free[_ngcontent-%COMP%] {\n    background: #dcfce7;\n    color: #166534;\n    font-size: 0.75rem;\n    font-weight: 700;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.mj-price-free[_ngcontent-%COMP%] {\n    font-weight: 700;\n    color: #166534;\n    font-size: 1.1rem;\n}\n\n.mj-price-amount[_ngcontent-%COMP%] {\n    font-weight: 700;\n    color: #0f172a;\n    font-size: 1.1rem;\n}\n\n.mj-quantity-selector-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-top: 12px;\n    padding-top: 12px;\n    border-top: 1px dashed #cbd5e1;\n}\n\n.mj-qty-controls[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mj-qty-btn[_ngcontent-%COMP%] {\n    width: 28px;\n    height: 28px;\n    background: #ffffff;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    cursor: pointer;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.mj-qty-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.mj-qty-input[_ngcontent-%COMP%] {\n    width: 44px;\n    height: 28px;\n    text-align: center;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    font-weight: 600;\n}\n\n.mj-section-title[_ngcontent-%COMP%] {\n    font-size: 1rem;\n    font-weight: 600;\n    margin: 0 0 12px 0;\n    color: #334155;\n}\n\n.mj-form-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n    margin-bottom: 18px;\n}\n\n.mj-form-group[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.mj-form-group.full-width[_ngcontent-%COMP%] {\n    grid-column: 1 / -1;\n}\n\n.mj-label[_ngcontent-%COMP%] {\n    font-size: 0.8rem;\n    font-weight: 500;\n    color: #475569;\n}\n\n.mj-required[_ngcontent-%COMP%] {\n    color: #ef4444;\n}\n\n.mj-input[_ngcontent-%COMP%], .mj-select[_ngcontent-%COMP%] {\n    padding: 8px 12px;\n    font-size: 0.9rem;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    background: #ffffff;\n    color: #1e293b;\n    outline: none;\n    transition: border-color 0.15s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.mj-textarea[_ngcontent-%COMP%] {\n    min-height: 70px;\n    resize: vertical;\n    font-family: inherit;\n}\n\n.mj-select[_ngcontent-%COMP%] {\n    min-height: 38px;\n}\n\n.mj-checkbox-label[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n    font-size: 0.9rem;\n    font-weight: 400;\n    color: #334155;\n    margin-top: 4px;\n}\n\n\n\n.mj-question-other[_ngcontent-%COMP%] {\n    margin-top: 8px;\n}\n\n\n\n.mj-choice-group[_ngcontent-%COMP%] {\n    border: 0;\n    margin: 0;\n    padding: 0;\n}\n\n.mj-choice-count[_ngcontent-%COMP%] {\n    font-weight: normal;\n    color: #64748b;\n}\n\n.mj-choice-options[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.mj-checkbox-label.is-disabled[_ngcontent-%COMP%] {\n    cursor: not-allowed;\n    opacity: 0.55;\n}\n\n.mj-input[_ngcontent-%COMP%]:focus, .mj-select[_ngcontent-%COMP%]:focus {\n    border-color: var(--mj-primary-color, #2563eb);\n    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);\n}\n\n\n\n.mj-input[readonly][_ngcontent-%COMP%] {\n    background: #f1f5f9;\n    color: #475569;\n    cursor: default;\n}\n\n.mj-field-hint[_ngcontent-%COMP%] {\n    font-size: 0.8rem;\n    color: #64748b;\n    margin: 0.25rem 0 0;\n}\n\n.mj-multi-attendee-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.mj-btn-link[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    color: var(--mj-primary-color, #2563eb);\n    font-size: 0.8rem;\n    cursor: pointer;\n    text-decoration: underline;\n    padding: 0;\n}\n\n.mj-attendee-matrix[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    margin-bottom: 20px;\n}\n\n.mj-attendee-card[_ngcontent-%COMP%] {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 12px 14px;\n}\n\n.mj-attendee-card-title[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #475569;\n    margin-bottom: 10px;\n}\n\n\n\n.mj-widget-payment-section[_ngcontent-%COMP%] {\n    margin-top: 16px;\n    padding-top: 16px;\n    border-top: 1px solid #e2e8f0;\n}\n\n.mj-stripe-container[_ngcontent-%COMP%] {\n    background: #ffffff;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px;\n    margin-bottom: 16px;\n}\n\n.mj-stripe-mount-point[_ngcontent-%COMP%] {\n    min-height: 40px;\n}\n\n.mj-stripe-badge[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    margin-top: 10px;\n    font-size: 0.75rem;\n    color: #64748b;\n}\n\n.mj-stripe-lock-icon[_ngcontent-%COMP%] {\n    font-size: 0.85rem;\n}\n\n.mj-checkout-total-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 0;\n    border-top: 1px solid #e2e8f0;\n    margin-top: 10px;\n    margin-bottom: 18px;\n}\n\n.mj-total-label[_ngcontent-%COMP%] {\n    font-weight: 700;\n    font-size: 1.05rem;\n    color: #0f172a;\n}\n\n.mj-total-amount[_ngcontent-%COMP%] {\n    font-weight: 800;\n    font-size: 1.25rem;\n    color: var(--mj-primary-color, #2563eb);\n}\n\n.mj-widget-actions[_ngcontent-%COMP%] {\n    margin-top: 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 12px;\n    background: var(--mj-primary-color, #2563eb);\n    color: #ffffff;\n    font-size: 1rem;\n    font-weight: 600;\n    border: none;\n    border-radius: var(--mj-border-radius, 8px);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: opacity 0.15s ease;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%]:hover:not(:disabled) {\n    opacity: 0.92;\n}\n\n.mj-btn-submit[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.mj-btn-cancel[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 8px 12px;\n    background: transparent;\n    color: #64748b;\n    font-size: 0.875rem;\n    font-weight: 500;\n    border: none;\n    cursor: pointer;\n    text-align: center;\n}\n\n.mj-btn-cancel[_ngcontent-%COMP%]:hover:not(:disabled) {\n    color: #334155;\n    text-decoration: underline;\n}\n\n.mj-spinner[_ngcontent-%COMP%] {\n    width: 16px;\n    height: 16px;\n    border: 2px solid #ffffff;\n    border-top-color: transparent;\n    border-radius: 50%;\n    animation: _ngcontent-%COMP%_mj-spin 0.8s linear infinite;\n}\n\n@keyframes _ngcontent-%COMP%_mj-spin {\n    to { transform: rotate(360deg); }\n}\n\n.mj-checkout-consent[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 0.5rem;\n    align-items: flex-start;\n    margin: 0.75rem 0;\n    font-size: 0.875rem;\n    font-weight: 400;\n    line-height: 1.4;\n}\n.mj-checkout-consent[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    margin-top: 0.2rem;\n}\n\n\n\n\n\n.mj-checkbox-label[_ngcontent-%COMP%]   input[type=checkbox][_ngcontent-%COMP%], \n.mj-checkout-consent[_ngcontent-%COMP%]   input[type=checkbox][_ngcontent-%COMP%] {\n    width: auto;\n    height: auto;\n    padding: 0;\n    border: 0;\n    flex: 0 0 auto;\n}\n\n.mj-checkout-promo[_ngcontent-%COMP%] {\n    margin: 0.75rem 0;\n}\n.mj-checkout-promo__label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 0.875rem;\n    margin-bottom: 0.25rem;\n}\n.mj-checkout-promo__row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 0.5rem;\n}\n.mj-checkout-promo__input[_ngcontent-%COMP%] {\n    flex: 1 1 auto;\n}\n.mj-checkout-promo__error[_ngcontent-%COMP%] {\n    color: var(--mj-error-color, #b91c1c);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-promo__applied[_ngcontent-%COMP%] {\n    color: var(--mj-success-color, #15803d);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-member-discount[_ngcontent-%COMP%] {\n    margin: 0.75rem 0;\n}\n.mj-checkout-promo__apply[_ngcontent-%COMP%] {\n    flex: 0 0 auto;\n    padding: 8px 14px;\n    background: transparent;\n    color: var(--mj-primary-color, #2563eb);\n    border: 1px solid var(--mj-border-color, #cbd5e1);\n    border-radius: var(--mj-border-radius, 8px);\n    font-size: 0.875rem;\n    font-weight: 600;\n    cursor: pointer;\n}\n.mj-checkout-promo__apply[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}"], changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJCheckoutWidgetComponent, [{
         type: Component,
-        args: [{ selector: 'mj-checkout-widget', standalone: true, imports: [CommonModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mj-checkout-widget-container\"\n    [style.--mj-primary-color]=\"activeTheme()?.primaryColor || '#2563eb'\"\n    [style.--mj-accent-color]=\"activeTheme()?.accentColor || '#3b82f6'\"\n    [style.--mj-border-radius]=\"activeTheme()?.borderRadius || '8px'\"\n    [style.--mj-bg-color]=\"activeTheme()?.backgroundColor || '#ffffff'\"\n    [style.--mj-text-color]=\"activeTheme()?.textColor || '#0f172a'\"\n    [style.--mj-font-family]=\"activeTheme()?.fontFamily || 'inherit'\">\n\n    <!-- Widget Header -->\n    <header class=\"mj-widget-header\">\n        <h2 class=\"mj-widget-title\">{{ config?.title || 'Checkout' }}</h2>\n        @if (config?.description) {\n            <p class=\"mj-widget-description\">{{ config?.description }}</p>\n        }\n    </header>\n\n    <!-- Error Banner -->\n    @if (displayErrorMessage()) {\n        <div class=\"mj-widget-error-banner\" role=\"alert\">\n            <span class=\"mj-error-icon\">\u26A0\uFE0F</span>\n            <span>{{ displayErrorMessage() }}</span>\n        </div>\n    }\n\n    <!-- Order Item & Pricing Summary -->\n    <div class=\"mj-widget-summary-card\">\n        <div class=\"mj-summary-row\">\n            <div class=\"mj-summary-item-info\">\n                <span class=\"mj-product-name\">{{ config?.productName || 'Order Item' }}</span>\n                @if (isFree()) {\n                    <span class=\"mj-badge-free\">FREE</span>\n                }\n            </div>\n            <div class=\"mj-summary-price\">\n                @if (isFree()) {\n                    <span class=\"mj-price-free\">$0.00</span>\n                } @else {\n                    <span class=\"mj-price-amount\">{{ currencySymbol() }}{{ (config?.unitPrice || 0).toFixed(2) }}</span>\n                }\n            </div>\n        </div>\n\n        @if (config?.allowQuantity) {\n            <div class=\"mj-quantity-selector-row\">\n                <label for=\"quantityInput\" class=\"mj-label\">Quantity</label>\n                <div class=\"mj-qty-controls\">\n                    <button type=\"button\" class=\"mj-qty-btn\" (click)=\"onQuantityChange(quantity() - 1)\" [disabled]=\"quantity() <= 1\">-</button>\n                    <input id=\"quantityInput\" type=\"number\" class=\"mj-qty-input\" [ngModel]=\"quantity()\" (ngModelChange)=\"onQuantityChange($event)\" min=\"1\" [max]=\"config?.maxQuantity || 50\" />\n                    <button type=\"button\" class=\"mj-qty-btn\" (click)=\"onQuantityChange(quantity() + 1)\" [disabled]=\"quantity() >= (config?.maxQuantity || 50)\">+</button>\n                </div>\n            </div>\n        }\n    </div>\n\n    <!-- Registration / Contact / Product Extension Form Section -->\n    <section class=\"mj-widget-form-section\">\n        @if (isSingleUnit()) {\n            <!-- Single Unit / Primary Form -->\n            <h3 class=\"mj-section-title\">Details</h3>\n            <div class=\"mj-form-grid\">\n                @for (field of activeFieldDefs(); track field.name) {\n                    <div class=\"mj-form-group\" [class.full-width]=\"field.type === 'textarea' || field.name === 'email' || field.name === 'Email'\">\n                        <label class=\"mj-label\">\n                            {{ field.label }}\n                            @if (field.required) {\n                                <span class=\"mj-required\">*</span>\n                            }\n                        </label>\n\n                        @switch (field.type) {\n                            @case ('textarea') {\n                                <textarea\n                                    class=\"mj-input mj-textarea\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\">\n                                </textarea>\n                            }\n                            @case ('select') {\n                                <select\n                                    class=\"mj-select\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [required]=\"field.required || false\">\n                                    <option [ngValue]=\"''\">Select {{ field.label }}</option>\n                                    @for (opt of field.options; track opt.value) {\n                                        <option [ngValue]=\"opt.value\">{{ opt.label }}</option>\n                                    }\n                                </select>\n                            }\n                            @case ('boolean') {\n                                <label class=\"mj-checkbox-label\">\n                                    <input\n                                        type=\"checkbox\"\n                                        [ngModel]=\"units()[0]?.[field.name]\"\n                                        (ngModelChange)=\"updateUnitField(0, field.name, $event)\" />\n                                    <span>{{ field.label }}</span>\n                                </label>\n                            }\n                            @case ('number') {\n                                <input\n                                    type=\"number\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\" />\n                            }\n                            @case ('date') {\n                                <input\n                                    type=\"date\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [required]=\"field.required || false\" />\n                            }\n                            @default {\n                                <input\n                                    [type]=\"field.name.toLowerCase().includes('email') ? 'email' : 'text'\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\" />\n                            }\n                        }\n                    </div>\n                }\n            </div>\n        } @else {\n            <!-- Multi-Unit Matrix (Repeating Fieldsets for Quantity > 1) -->\n            <div class=\"mj-multi-attendee-header\">\n                <h3 class=\"mj-section-title\">Item Details ({{ quantity() }})</h3>\n                <button type=\"button\" class=\"mj-btn-link\" (click)=\"copyPrimaryToAll()\">Copy Primary Info to All</button>\n            </div>\n\n            <div class=\"mj-attendee-matrix\">\n                @for (unit of units(); track $index) {\n                    <div class=\"mj-attendee-card\">\n                        <div class=\"mj-attendee-card-title\">Item {{ $index + 1 }}</div>\n                        <div class=\"mj-form-grid\">\n                            @for (field of activeFieldDefs(); track field.name) {\n                                <div class=\"mj-form-group\" [class.full-width]=\"field.type === 'textarea' || field.name === 'email' || field.name === 'Email'\">\n                                    <label class=\"mj-label\">\n                                        {{ field.label }}\n                                        @if (field.required) {\n                                            <span class=\"mj-required\">*</span>\n                                        }\n                                    </label>\n\n                                    @switch (field.type) {\n                                        @case ('textarea') {\n                                            <textarea\n                                                class=\"mj-input mj-textarea\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\">\n                                            </textarea>\n                                        }\n                                        @case ('select') {\n                                            <select\n                                                class=\"mj-select\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [required]=\"field.required || false\">\n                                                <option [ngValue]=\"''\">Select {{ field.label }}</option>\n                                                @for (opt of field.options; track opt.value) {\n                                                    <option [ngValue]=\"opt.value\">{{ opt.label }}</option>\n                                                }\n                                            </select>\n                                        }\n                                        @case ('boolean') {\n                                            <label class=\"mj-checkbox-label\">\n                                                <input\n                                                    type=\"checkbox\"\n                                                    [ngModel]=\"unit[field.name]\"\n                                                    (ngModelChange)=\"updateUnitField($index, field.name, $event)\" />\n                                                <span>{{ field.label }}</span>\n                                            </label>\n                                        }\n                                        @case ('number') {\n                                            <input\n                                                type=\"number\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                        @case ('date') {\n                                            <input\n                                                type=\"date\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                        @default {\n                                            <input\n                                                [type]=\"field.name.toLowerCase().includes('email') ? 'email' : 'text'\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                    }\n                                </div>\n                            }\n                        </div>\n                    </div>\n                }\n            </div>\n        }\n    </section>\n\n    <!-- Billing Location \u2014 required so the sale can be placed in a tax jurisdiction -->\n    <section class=\"mj-widget-form-section\">\n        <h3 class=\"mj-section-title\">Billing Location</h3>\n        <div class=\"mj-form-grid\">\n            <div class=\"mj-form-group\">\n                <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-billing-country'\">\n                    Country <span class=\"mj-required\">*</span>\n                </label>\n                <select\n                    class=\"mj-select\"\n                    [id]=\"widgetInstanceId + '-billing-country'\"\n                    autocomplete=\"country\"\n                    [ngModel]=\"billingCountry()\"\n                    (ngModelChange)=\"onBillingCountryChange($event)\"\n                    required>\n                    <option [ngValue]=\"''\">Select country</option>\n                    @for (c of billingCountries; track c.Code) {\n                        <option [ngValue]=\"c.Code\">{{ c.Name }}</option>\n                    }\n                </select>\n            </div>\n            @if (billingRegions().length > 0) {\n                <div class=\"mj-form-group\">\n                    <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-billing-region'\">\n                        State / Province <span class=\"mj-required\">*</span>\n                    </label>\n                    <select\n                        class=\"mj-select\"\n                        [id]=\"widgetInstanceId + '-billing-region'\"\n                        autocomplete=\"address-level1\"\n                        [ngModel]=\"billingRegion()\"\n                        (ngModelChange)=\"onBillingRegionChange($event)\"\n                        required>\n                        <option [ngValue]=\"''\">Select state or province</option>\n                        @for (r of billingRegions(); track r.Code) {\n                            <option [ngValue]=\"r.Code\">{{ r.Name }}</option>\n                        }\n                    </select>\n                </div>\n            }\n            <div class=\"mj-form-group\">\n                <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-billing-postal'\">\n                    Postal Code\n                    @if (billingPostalRequired()) {\n                        <span class=\"mj-required\">*</span>\n                    }\n                </label>\n                <input\n                    type=\"text\"\n                    class=\"mj-input\"\n                    [id]=\"widgetInstanceId + '-billing-postal'\"\n                    autocomplete=\"postal-code\"\n                    maxlength=\"20\"\n                    [ngModel]=\"billingPostalCode()\"\n                    (ngModelChange)=\"onBillingPostalCodeChange($event)\"\n                    [required]=\"billingPostalRequired()\" />\n            </div>\n        </div>\n    </section>\n    <!-- Questions from the widget's Configuration; answers are recorded on the order -->\n    @if (questions().length > 0) {\n        <section class=\"mj-widget-form-section\">\n            <h3 class=\"mj-section-title\">A few questions</h3>\n            <div class=\"mj-form-grid\">\n                @for (question of questions(); track question.key) {\n                    <div class=\"mj-form-group full-width\">\n                        <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-q-' + question.key\">\n                            {{ question.label }}\n                            @if (question.required) {\n                                <span class=\"mj-required\">*</span>\n                            }\n                        </label>\n                        @if (question.type === 'select') {\n                            <select\n                                class=\"mj-select\"\n                                [id]=\"widgetInstanceId + '-q-' + question.key\"\n                                [ngModel]=\"answerFor(question.key).Value ?? ''\"\n                                (ngModelChange)=\"updateAnswer(question.key, { Value: $event })\"\n                                [required]=\"question.required || false\">\n                                <option [ngValue]=\"''\">Select an answer</option>\n                                @for (opt of question.options; track optionValue(opt)) {\n                                    <option [ngValue]=\"optionValue(opt)\">{{ optionLabel(opt) }}</option>\n                                }\n                            </select>\n                            @if (isOtherChosen(question)) {\n                                <input\n                                    type=\"text\"\n                                    class=\"mj-input mj-question-other\"\n                                    [attr.aria-label]=\"question.label + ' (please specify)'\"\n                                    placeholder=\"Please specify\"\n                                    [attr.maxlength]=\"answerMaxLength(question)\"\n                                    [ngModel]=\"answerFor(question.key).OtherText ?? ''\"\n                                    (ngModelChange)=\"updateAnswer(question.key, { OtherText: $event })\"\n                                    required />\n                            }\n                        } @else {\n                            <input\n                                type=\"text\"\n                                class=\"mj-input\"\n                                [id]=\"widgetInstanceId + '-q-' + question.key\"\n                                [attr.maxlength]=\"answerMaxLength(question)\"\n                                [ngModel]=\"answerFor(question.key).Value ?? ''\"\n                                (ngModelChange)=\"updateAnswer(question.key, { Value: $event })\"\n                                [required]=\"question.required || false\" />\n                        }\n                    </div>\n                }\n            </div>\n        </section>\n    }\n\n    <!-- Choice groups from the widget's Configuration; the picks are recorded on the order line -->\n    @for (group of choiceGroups(); track group.key) {\n        <section class=\"mj-widget-form-section\">\n            <fieldset class=\"mj-choice-group\">\n                <legend class=\"mj-section-title\">\n                    {{ group.label }}\n                    <span class=\"mj-choice-count\">(choose {{ choiceCount(group) }})</span>\n                    @if (group.min > 0) {\n                        <span class=\"mj-required\">*</span>\n                    }\n                </legend>\n                <div class=\"mj-choice-options\">\n                    @for (opt of group.options; track choiceValue(opt)) {\n                        <label\n                            class=\"mj-checkbox-label\"\n                            [class.is-disabled]=\"isGroupFull(group) && !isChosen(group.key, choiceValue(opt))\">\n                            <input\n                                type=\"checkbox\"\n                                [checked]=\"isChosen(group.key, choiceValue(opt))\"\n                                [disabled]=\"isGroupFull(group) && !isChosen(group.key, choiceValue(opt))\"\n                                (change)=\"toggleChoice(group, choiceValue(opt))\" />\n                            <span>{{ choiceLabel(opt) }}</span>\n                        </label>\n                    }\n                </div>\n            </fieldset>\n        </section>\n    }\n\n    <!-- Stripe Embedded Payment Section -->\n    @if (!isFree()) {\n        <section class=\"mj-widget-payment-section\">\n            <h3 class=\"mj-section-title\">Payment</h3>\n            <div class=\"mj-stripe-container\">\n                <div id=\"stripe-card-element\" class=\"mj-stripe-mount-point\">\n                    <!-- Stripe.js mounts secure hosted Elements iframe here -->\n                </div>\n                <div class=\"mj-stripe-badge\">\n                    <span class=\"mj-stripe-lock-icon\">\uD83D\uDD12</span>\n                    <span>Secured by Stripe \u2022 PCI-DSS Level 1 Certified \u2022 End-to-end Encrypted</span>\n                </div>\n            </div>\n        </section>\n\n        @if (allowsPromotionCodes()) {\n            <div class=\"mj-checkout-promo\">\n                <label class=\"mj-checkout-promo__label\" for=\"{{ widgetInstanceId }}-promo\">Promo code</label>\n                <div class=\"mj-checkout-promo__row\">\n                    <input id=\"{{ widgetInstanceId }}-promo\" type=\"text\" class=\"mj-input mj-checkout-promo__input\" autocomplete=\"off\" maxlength=\"60\"\n                        [value]=\"promotionCodeInput()\"\n                        (input)=\"promotionCodeInput.set($any($event.target).value)\"\n                        (keydown.enter)=\"applyPromotionCode()\"\n                        [disabled]=\"isProcessing\" />\n                    <button type=\"button\" class=\"mj-checkout-promo__apply\"\n                        [disabled]=\"isProcessing || !promotionCodeInput().trim()\"\n                        (click)=\"applyPromotionCode()\">Apply</button>\n                </div>\n                @if (promotionError) {\n                    <p class=\"mj-checkout-promo__error\" role=\"alert\">{{ promotionError }}</p>\n                } @else if (activePromotion(); as promo) {\n                    <p class=\"mj-checkout-promo__applied\" role=\"status\">\n                        {{ promo.code }} applied: \u2212{{ currencySymbol() }}{{ promo.discount.toFixed(2) }}\n                    </p>\n                }\n            </div>\n        }\n\n        @if (autoRenewConsentText(); as consentText) {\n            <label class=\"mj-checkout-consent\">\n                <input type=\"checkbox\"\n                    [checked]=\"autoRenewConsent()\"\n                    (change)=\"autoRenewConsent.set($any($event.target).checked)\"\n                    [disabled]=\"isProcessing\" />\n                <span>{{ consentText }}</span>\n            </label>\n        }\n\n        <!-- Final Total Line -->\n        @if (quotedTax !== null) {\n            <div class=\"mj-checkout-total-row\">\n                <span class=\"mj-total-label\">Sales Tax</span>\n                <span class=\"mj-total-amount\">{{ currencySymbol() }}{{ (quotedTax ?? 0).toFixed(2) }}</span>\n            </div>\n        }\n        <div class=\"mj-checkout-total-row\">\n            <span class=\"mj-total-label\">Total Due</span>\n            <span class=\"mj-total-amount\">{{ currencySymbol() }}{{ totalGross().toFixed(2) }}</span>\n        </div>\n    }\n\n    <!-- Actions -->\n    <div class=\"mj-widget-actions\">\n        <button type=\"button\" class=\"mj-btn-submit\" [disabled]=\"!isFormValid() || isProcessing\" (click)=\"handleSubmit()\">\n            @if (isProcessing) {\n                <span class=\"mj-spinner\"></span>\n                <span>Processing...</span>\n            } @else if (isFree()) {\n                <span>Complete Free Registration</span>\n            } @else {\n                <span>Pay {{ currencySymbol() }}{{ totalGross().toFixed(2) }}</span>\n            }\n        </button>\n\n        <button type=\"button\" class=\"mj-btn-cancel\" [disabled]=\"isProcessing\" (click)=\"cancelled.emit()\">\n            Cancel\n        </button>\n    </div>\n</div>\n", styles: [":host {\n    display: block;\n    font-family: var(--mj-font-family, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);\n    color: var(--mj-text-color, #1e293b);\n}\n\n.mj-checkout-widget-container {\n    max-width: 560px;\n    margin: 0 auto;\n    background: var(--mj-bg-color, #ffffff);\n    border: 1px solid #e2e8f0;\n    border-radius: var(--mj-border-radius, 8px);\n    padding: 24px;\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);\n}\n\n.mj-widget-header {\n    margin-bottom: 20px;\n}\n\n.mj-widget-title {\n    margin: 0 0 6px 0;\n    font-size: 1.35rem;\n    font-weight: 700;\n    color: var(--mj-text-color, #0f172a);\n}\n\n.mj-widget-description {\n    margin: 0;\n    font-size: 0.9rem;\n    color: #64748b;\n    line-height: 1.4;\n}\n\n.mj-widget-error-banner {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: #fef2f2;\n    border: 1px solid #f87171;\n    color: #991b1b;\n    padding: 10px 14px;\n    border-radius: 6px;\n    margin-bottom: 18px;\n    font-size: 0.875rem;\n}\n\n.mj-error-icon {\n    font-size: 1rem;\n}\n\n.mj-widget-summary-card {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px 16px;\n    margin-bottom: 20px;\n}\n\n.mj-summary-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n\n.mj-summary-price {\n    display: flex;\n    align-items: center;\n}\n\n.mj-widget-form-section {\n    margin-bottom: 20px;\n}\n\n.mj-summary-item-info {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.mj-product-name {\n    font-weight: 600;\n    font-size: 1rem;\n    color: #1e293b;\n}\n\n.mj-badge-free {\n    background: #dcfce7;\n    color: #166534;\n    font-size: 0.75rem;\n    font-weight: 700;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.mj-price-free {\n    font-weight: 700;\n    color: #166534;\n    font-size: 1.1rem;\n}\n\n.mj-price-amount {\n    font-weight: 700;\n    color: #0f172a;\n    font-size: 1.1rem;\n}\n\n.mj-quantity-selector-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-top: 12px;\n    padding-top: 12px;\n    border-top: 1px dashed #cbd5e1;\n}\n\n.mj-qty-controls {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mj-qty-btn {\n    width: 28px;\n    height: 28px;\n    background: #ffffff;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    cursor: pointer;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.mj-qty-btn:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.mj-qty-input {\n    width: 44px;\n    height: 28px;\n    text-align: center;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    font-weight: 600;\n}\n\n.mj-section-title {\n    font-size: 1rem;\n    font-weight: 600;\n    margin: 0 0 12px 0;\n    color: #334155;\n}\n\n.mj-form-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n    margin-bottom: 18px;\n}\n\n.mj-form-group {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.mj-form-group.full-width {\n    grid-column: 1 / -1;\n}\n\n.mj-label {\n    font-size: 0.8rem;\n    font-weight: 500;\n    color: #475569;\n}\n\n.mj-required {\n    color: #ef4444;\n}\n\n.mj-input, .mj-select {\n    padding: 8px 12px;\n    font-size: 0.9rem;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    background: #ffffff;\n    color: #1e293b;\n    outline: none;\n    transition: border-color 0.15s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.mj-textarea {\n    min-height: 70px;\n    resize: vertical;\n    font-family: inherit;\n}\n\n.mj-select {\n    min-height: 38px;\n}\n\n.mj-checkbox-label {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n    font-size: 0.9rem;\n    font-weight: 400;\n    color: #334155;\n    margin-top: 4px;\n}\n\n/* The free-text answer that appears under a question's \"Other\" choice. */\n.mj-question-other {\n    margin-top: 8px;\n}\n\n/* A choice group: its options stacked, with how many to pick beside the heading. */\n.mj-choice-group {\n    border: 0;\n    margin: 0;\n    padding: 0;\n}\n\n.mj-choice-count {\n    font-weight: normal;\n    color: #64748b;\n}\n\n.mj-choice-options {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.mj-checkbox-label.is-disabled {\n    cursor: not-allowed;\n    opacity: 0.55;\n}\n\n.mj-input:focus, .mj-select:focus {\n    border-color: var(--mj-primary-color, #2563eb);\n    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);\n}\n\n.mj-multi-attendee-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.mj-btn-link {\n    background: none;\n    border: none;\n    color: var(--mj-primary-color, #2563eb);\n    font-size: 0.8rem;\n    cursor: pointer;\n    text-decoration: underline;\n    padding: 0;\n}\n\n.mj-attendee-matrix {\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    margin-bottom: 20px;\n}\n\n.mj-attendee-card {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 12px 14px;\n}\n\n.mj-attendee-card-title {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #475569;\n    margin-bottom: 10px;\n}\n\n/* Stripe Payment Container */\n.mj-widget-payment-section {\n    margin-top: 16px;\n    padding-top: 16px;\n    border-top: 1px solid #e2e8f0;\n}\n\n.mj-stripe-container {\n    background: #ffffff;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px;\n    margin-bottom: 16px;\n}\n\n.mj-stripe-mount-point {\n    min-height: 40px;\n}\n\n.mj-stripe-badge {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    margin-top: 10px;\n    font-size: 0.75rem;\n    color: #64748b;\n}\n\n.mj-stripe-lock-icon {\n    font-size: 0.85rem;\n}\n\n.mj-checkout-total-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 0;\n    border-top: 1px solid #e2e8f0;\n    margin-top: 10px;\n    margin-bottom: 18px;\n}\n\n.mj-total-label {\n    font-weight: 700;\n    font-size: 1.05rem;\n    color: #0f172a;\n}\n\n.mj-total-amount {\n    font-weight: 800;\n    font-size: 1.25rem;\n    color: var(--mj-primary-color, #2563eb);\n}\n\n.mj-widget-actions {\n    margin-top: 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.mj-btn-submit {\n    width: 100%;\n    padding: 12px;\n    background: var(--mj-primary-color, #2563eb);\n    color: #ffffff;\n    font-size: 1rem;\n    font-weight: 600;\n    border: none;\n    border-radius: var(--mj-border-radius, 8px);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: opacity 0.15s ease;\n}\n\n.mj-btn-submit:hover:not(:disabled) {\n    opacity: 0.92;\n}\n\n.mj-btn-submit:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.mj-btn-cancel {\n    width: 100%;\n    padding: 8px 12px;\n    background: transparent;\n    color: #64748b;\n    font-size: 0.875rem;\n    font-weight: 500;\n    border: none;\n    cursor: pointer;\n    text-align: center;\n}\n\n.mj-btn-cancel:hover:not(:disabled) {\n    color: #334155;\n    text-decoration: underline;\n}\n\n.mj-spinner {\n    width: 16px;\n    height: 16px;\n    border: 2px solid #ffffff;\n    border-top-color: transparent;\n    border-radius: 50%;\n    animation: mj-spin 0.8s linear infinite;\n}\n\n@keyframes mj-spin {\n    to { transform: rotate(360deg); }\n}\n\n.mj-checkout-consent {\n    display: flex;\n    gap: 0.5rem;\n    align-items: flex-start;\n    margin: 0.75rem 0;\n    font-size: 0.875rem;\n    font-weight: 400;\n    line-height: 1.4;\n}\n.mj-checkout-consent input {\n    margin-top: 0.2rem;\n}\n\n/* Checkboxes keep their native size even when the host page styles every input\n   (e.g. `input { width: 100% }`): this rule is scoped to the widget, so it outranks\n   a plain element or class selector on the host page. */\n.mj-checkbox-label input[type=checkbox],\n.mj-checkout-consent input[type=checkbox] {\n    width: auto;\n    height: auto;\n    padding: 0;\n    border: 0;\n    flex: 0 0 auto;\n}\n\n.mj-checkout-promo {\n    margin: 0.75rem 0;\n}\n.mj-checkout-promo__label {\n    display: block;\n    font-size: 0.875rem;\n    margin-bottom: 0.25rem;\n}\n.mj-checkout-promo__row {\n    display: flex;\n    gap: 0.5rem;\n}\n.mj-checkout-promo__input {\n    flex: 1 1 auto;\n}\n.mj-checkout-promo__error {\n    color: var(--mj-error-color, #b91c1c);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-promo__applied {\n    color: var(--mj-success-color, #15803d);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-promo__apply {\n    flex: 0 0 auto;\n    padding: 8px 14px;\n    background: transparent;\n    color: var(--mj-primary-color, #2563eb);\n    border: 1px solid var(--mj-border-color, #cbd5e1);\n    border-radius: var(--mj-border-radius, 8px);\n    font-size: 0.875rem;\n    font-weight: 600;\n    cursor: pointer;\n}\n.mj-checkout-promo__apply:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n"] }]
+        args: [{ selector: 'mj-checkout-widget', standalone: true, imports: [CommonModule, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"mj-checkout-widget-container\"\n    [style.--mj-primary-color]=\"activeTheme()?.primaryColor || '#2563eb'\"\n    [style.--mj-accent-color]=\"activeTheme()?.accentColor || '#3b82f6'\"\n    [style.--mj-border-radius]=\"activeTheme()?.borderRadius || '8px'\"\n    [style.--mj-bg-color]=\"activeTheme()?.backgroundColor || '#ffffff'\"\n    [style.--mj-text-color]=\"activeTheme()?.textColor || '#0f172a'\"\n    [style.--mj-font-family]=\"activeTheme()?.fontFamily || 'inherit'\">\n\n    <!-- Widget Header -->\n    <header class=\"mj-widget-header\">\n        <h2 class=\"mj-widget-title\">{{ config?.title || 'Checkout' }}</h2>\n        @if (config?.description) {\n            <p class=\"mj-widget-description\">{{ config?.description }}</p>\n        }\n    </header>\n\n    <!-- Error Banner -->\n    @if (displayErrorMessage()) {\n        <div class=\"mj-widget-error-banner\" role=\"alert\">\n            <span class=\"mj-error-icon\">\u26A0\uFE0F</span>\n            <span>{{ displayErrorMessage() }}</span>\n        </div>\n    }\n\n    <!-- Order Item & Pricing Summary -->\n    <div class=\"mj-widget-summary-card\">\n        <div class=\"mj-summary-row\">\n            <div class=\"mj-summary-item-info\">\n                <span class=\"mj-product-name\">{{ config?.productName || 'Order Item' }}</span>\n                @if (isFree()) {\n                    <span class=\"mj-badge-free\">FREE</span>\n                }\n            </div>\n            <div class=\"mj-summary-price\">\n                @if (isFree()) {\n                    <span class=\"mj-price-free\">$0.00</span>\n                } @else {\n                    <span class=\"mj-price-amount\">{{ currencySymbol() }}{{ (config?.unitPrice || 0).toFixed(2) }}</span>\n                }\n            </div>\n        </div>\n\n        @if (config?.allowQuantity) {\n            <div class=\"mj-quantity-selector-row\">\n                <label for=\"quantityInput\" class=\"mj-label\">Quantity</label>\n                <div class=\"mj-qty-controls\">\n                    <button type=\"button\" class=\"mj-qty-btn\" (click)=\"onQuantityChange(quantity() - 1)\" [disabled]=\"quantity() <= 1\">-</button>\n                    <input id=\"quantityInput\" type=\"number\" class=\"mj-qty-input\" [ngModel]=\"quantity()\" (ngModelChange)=\"onQuantityChange($event)\" min=\"1\" [max]=\"config?.maxQuantity || 50\" />\n                    <button type=\"button\" class=\"mj-qty-btn\" (click)=\"onQuantityChange(quantity() + 1)\" [disabled]=\"quantity() >= (config?.maxQuantity || 50)\">+</button>\n                </div>\n            </div>\n        }\n    </div>\n\n    <!-- Registration / Contact / Product Extension Form Section -->\n    <section class=\"mj-widget-form-section\">\n        @if (isSingleUnit()) {\n            <!-- Single Unit / Primary Form -->\n            <h3 class=\"mj-section-title\">Details</h3>\n            <div class=\"mj-form-grid\">\n                @for (field of activeFieldDefs(); track field.name) {\n                    <div class=\"mj-form-group\" [class.full-width]=\"field.type === 'textarea' || field.name === 'email' || field.name === 'Email'\">\n                        <label class=\"mj-label\">\n                            {{ field.label }}\n                            @if (field.required) {\n                                <span class=\"mj-required\">*</span>\n                            }\n                        </label>\n\n                        @switch (field.type) {\n                            @case ('textarea') {\n                                <textarea\n                                    class=\"mj-input mj-textarea\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\">\n                                </textarea>\n                            }\n                            @case ('select') {\n                                <select\n                                    class=\"mj-select\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [required]=\"field.required || false\">\n                                    <option [ngValue]=\"''\">Select {{ field.label }}</option>\n                                    @for (opt of field.options; track opt.value) {\n                                        <option [ngValue]=\"opt.value\">{{ opt.label }}</option>\n                                    }\n                                </select>\n                            }\n                            @case ('boolean') {\n                                <label class=\"mj-checkbox-label\">\n                                    <input\n                                        type=\"checkbox\"\n                                        [ngModel]=\"units()[0]?.[field.name]\"\n                                        (ngModelChange)=\"updateUnitField(0, field.name, $event)\" />\n                                    <span>{{ field.label }}</span>\n                                </label>\n                            }\n                            @case ('number') {\n                                <input\n                                    type=\"number\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [required]=\"field.required || false\" />\n                            }\n                            @case ('date') {\n                                <input\n                                    type=\"date\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [required]=\"field.required || false\" />\n                            }\n                            @default {\n                                <input\n                                    [type]=\"field.name.toLowerCase().includes('email') ? 'email' : 'text'\"\n                                    class=\"mj-input\"\n                                    [ngModel]=\"units()[0]?.[field.name]\"\n                                    (ngModelChange)=\"updateUnitField(0, field.name, $event)\"\n                                    [placeholder]=\"field.placeholder || ''\"\n                                    [readonly]=\"isLockedEmail(0, field.name)\"\n                                    [required]=\"field.required || false\" />\n                                @if (isLockedEmail(0, field.name)) {\n                                    <p class=\"mj-field-hint\">Your member discount is tied to this verified e-mail.</p>\n                                }\n                            }\n                        }\n                    </div>\n                }\n            </div>\n        } @else {\n            <!-- Multi-Unit Matrix (Repeating Fieldsets for Quantity > 1) -->\n            <div class=\"mj-multi-attendee-header\">\n                <h3 class=\"mj-section-title\">Item Details ({{ quantity() }})</h3>\n                <button type=\"button\" class=\"mj-btn-link\" (click)=\"copyPrimaryToAll()\">Copy Primary Info to All</button>\n            </div>\n\n            <div class=\"mj-attendee-matrix\">\n                @for (unit of units(); track $index) {\n                    <div class=\"mj-attendee-card\">\n                        <div class=\"mj-attendee-card-title\">Item {{ $index + 1 }}</div>\n                        <div class=\"mj-form-grid\">\n                            @for (field of activeFieldDefs(); track field.name) {\n                                <div class=\"mj-form-group\" [class.full-width]=\"field.type === 'textarea' || field.name === 'email' || field.name === 'Email'\">\n                                    <label class=\"mj-label\">\n                                        {{ field.label }}\n                                        @if (field.required) {\n                                            <span class=\"mj-required\">*</span>\n                                        }\n                                    </label>\n\n                                    @switch (field.type) {\n                                        @case ('textarea') {\n                                            <textarea\n                                                class=\"mj-input mj-textarea\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\">\n                                            </textarea>\n                                        }\n                                        @case ('select') {\n                                            <select\n                                                class=\"mj-select\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [required]=\"field.required || false\">\n                                                <option [ngValue]=\"''\">Select {{ field.label }}</option>\n                                                @for (opt of field.options; track opt.value) {\n                                                    <option [ngValue]=\"opt.value\">{{ opt.label }}</option>\n                                                }\n                                            </select>\n                                        }\n                                        @case ('boolean') {\n                                            <label class=\"mj-checkbox-label\">\n                                                <input\n                                                    type=\"checkbox\"\n                                                    [ngModel]=\"unit[field.name]\"\n                                                    (ngModelChange)=\"updateUnitField($index, field.name, $event)\" />\n                                                <span>{{ field.label }}</span>\n                                            </label>\n                                        }\n                                        @case ('number') {\n                                            <input\n                                                type=\"number\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                        @case ('date') {\n                                            <input\n                                                type=\"date\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [required]=\"field.required || false\" />\n                                        }\n                                        @default {\n                                            <input\n                                                [type]=\"field.name.toLowerCase().includes('email') ? 'email' : 'text'\"\n                                                class=\"mj-input\"\n                                                [ngModel]=\"unit[field.name]\"\n                                                (ngModelChange)=\"updateUnitField($index, field.name, $event)\"\n                                                [placeholder]=\"field.placeholder || ''\"\n                                                [readonly]=\"isLockedEmail($index, field.name)\"\n                                                [required]=\"field.required || false\" />\n                                            @if (isLockedEmail($index, field.name)) {\n                                                <p class=\"mj-field-hint\">Your member discount is tied to this verified e-mail.</p>\n                                            }\n                                        }\n                                    }\n                                </div>\n                            }\n                        </div>\n                    </div>\n                }\n            </div>\n        }\n    </section>\n\n    <!-- Billing Location \u2014 required so the sale can be placed in a tax jurisdiction -->\n    <section class=\"mj-widget-form-section\">\n        <h3 class=\"mj-section-title\">Billing Location</h3>\n        <div class=\"mj-form-grid\">\n            <div class=\"mj-form-group\">\n                <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-billing-country'\">\n                    Country <span class=\"mj-required\">*</span>\n                </label>\n                <select\n                    class=\"mj-select\"\n                    [id]=\"widgetInstanceId + '-billing-country'\"\n                    autocomplete=\"country\"\n                    [ngModel]=\"billingCountry()\"\n                    (ngModelChange)=\"onBillingCountryChange($event)\"\n                    required>\n                    <option [ngValue]=\"''\">Select country</option>\n                    @for (c of billingCountries; track c.Code) {\n                        <option [ngValue]=\"c.Code\">{{ c.Name }}</option>\n                    }\n                </select>\n            </div>\n            @if (billingRegions().length > 0) {\n                <div class=\"mj-form-group\">\n                    <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-billing-region'\">\n                        State / Province <span class=\"mj-required\">*</span>\n                    </label>\n                    <select\n                        class=\"mj-select\"\n                        [id]=\"widgetInstanceId + '-billing-region'\"\n                        autocomplete=\"address-level1\"\n                        [ngModel]=\"billingRegion()\"\n                        (ngModelChange)=\"onBillingRegionChange($event)\"\n                        required>\n                        <option [ngValue]=\"''\">Select state or province</option>\n                        @for (r of billingRegions(); track r.Code) {\n                            <option [ngValue]=\"r.Code\">{{ r.Name }}</option>\n                        }\n                    </select>\n                </div>\n            }\n            <div class=\"mj-form-group\">\n                <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-billing-postal'\">\n                    Postal Code\n                    @if (billingPostalRequired()) {\n                        <span class=\"mj-required\">*</span>\n                    }\n                </label>\n                <input\n                    type=\"text\"\n                    class=\"mj-input\"\n                    [id]=\"widgetInstanceId + '-billing-postal'\"\n                    autocomplete=\"postal-code\"\n                    maxlength=\"20\"\n                    [ngModel]=\"billingPostalCode()\"\n                    (ngModelChange)=\"onBillingPostalCodeChange($event)\"\n                    [required]=\"billingPostalRequired()\" />\n            </div>\n        </div>\n    </section>\n    <!-- Questions from the widget's Configuration; answers are recorded on the order -->\n    @if (questions().length > 0) {\n        <section class=\"mj-widget-form-section\">\n            <h3 class=\"mj-section-title\">A few questions</h3>\n            <div class=\"mj-form-grid\">\n                @for (question of questions(); track question.key) {\n                    <div class=\"mj-form-group full-width\">\n                        <label class=\"mj-label\" [attr.for]=\"widgetInstanceId + '-q-' + question.key\">\n                            {{ question.label }}\n                            @if (question.required) {\n                                <span class=\"mj-required\">*</span>\n                            }\n                        </label>\n                        @if (question.type === 'select') {\n                            <select\n                                class=\"mj-select\"\n                                [id]=\"widgetInstanceId + '-q-' + question.key\"\n                                [ngModel]=\"answerFor(question.key).Value ?? ''\"\n                                (ngModelChange)=\"updateAnswer(question.key, { Value: $event })\"\n                                [required]=\"question.required || false\">\n                                <option [ngValue]=\"''\">Select an answer</option>\n                                @for (opt of question.options; track optionValue(opt)) {\n                                    <option [ngValue]=\"optionValue(opt)\">{{ optionLabel(opt) }}</option>\n                                }\n                            </select>\n                            @if (isOtherChosen(question)) {\n                                <input\n                                    type=\"text\"\n                                    class=\"mj-input mj-question-other\"\n                                    [attr.aria-label]=\"question.label + ' (please specify)'\"\n                                    placeholder=\"Please specify\"\n                                    [attr.maxlength]=\"answerMaxLength(question)\"\n                                    [ngModel]=\"answerFor(question.key).OtherText ?? ''\"\n                                    (ngModelChange)=\"updateAnswer(question.key, { OtherText: $event })\"\n                                    required />\n                            }\n                        } @else {\n                            <input\n                                type=\"text\"\n                                class=\"mj-input\"\n                                [id]=\"widgetInstanceId + '-q-' + question.key\"\n                                [attr.maxlength]=\"answerMaxLength(question)\"\n                                [ngModel]=\"answerFor(question.key).Value ?? ''\"\n                                (ngModelChange)=\"updateAnswer(question.key, { Value: $event })\"\n                                [required]=\"question.required || false\" />\n                        }\n                    </div>\n                }\n            </div>\n        </section>\n    }\n\n    <!-- Choice groups from the widget's Configuration; the picks are recorded on the order line -->\n    @for (group of choiceGroups(); track group.key) {\n        <section class=\"mj-widget-form-section\">\n            <fieldset class=\"mj-choice-group\">\n                <legend class=\"mj-section-title\">\n                    {{ group.label }}\n                    <span class=\"mj-choice-count\">(choose {{ choiceCount(group) }})</span>\n                    @if (group.min > 0) {\n                        <span class=\"mj-required\">*</span>\n                    }\n                </legend>\n                <div class=\"mj-choice-options\">\n                    @for (opt of group.options; track choiceValue(opt)) {\n                        <label\n                            class=\"mj-checkbox-label\"\n                            [class.is-disabled]=\"isGroupFull(group) && !isChosen(group.key, choiceValue(opt))\">\n                            <input\n                                type=\"checkbox\"\n                                [checked]=\"isChosen(group.key, choiceValue(opt))\"\n                                [disabled]=\"isGroupFull(group) && !isChosen(group.key, choiceValue(opt))\"\n                                (change)=\"toggleChoice(group, choiceValue(opt))\" />\n                            <span>{{ choiceLabel(opt) }}</span>\n                        </label>\n                    }\n                </div>\n            </fieldset>\n        </section>\n    }\n\n    <!-- Stripe Embedded Payment Section -->\n    @if (!isFree()) {\n        <section class=\"mj-widget-payment-section\">\n            <h3 class=\"mj-section-title\">Payment</h3>\n            <div class=\"mj-stripe-container\">\n                <div id=\"stripe-card-element\" class=\"mj-stripe-mount-point\">\n                    <!-- Stripe.js mounts secure hosted Elements iframe here -->\n                </div>\n                <div class=\"mj-stripe-badge\">\n                    <span class=\"mj-stripe-lock-icon\">\uD83D\uDD12</span>\n                    <span>Secured by Stripe \u2022 PCI-DSS Level 1 Certified \u2022 End-to-end Encrypted</span>\n                </div>\n            </div>\n        </section>\n\n        @if (allowsPromotionCodes()) {\n            <div class=\"mj-checkout-promo\">\n                <label class=\"mj-checkout-promo__label\" for=\"{{ widgetInstanceId }}-promo\">Promo code</label>\n                <div class=\"mj-checkout-promo__row\">\n                    <input id=\"{{ widgetInstanceId }}-promo\" type=\"text\" class=\"mj-input mj-checkout-promo__input\" autocomplete=\"off\" maxlength=\"60\"\n                        [value]=\"promotionCodeInput()\"\n                        (input)=\"promotionCodeInput.set($any($event.target).value)\"\n                        (keydown.enter)=\"applyPromotionCode()\"\n                        [disabled]=\"isProcessing\" />\n                    <button type=\"button\" class=\"mj-checkout-promo__apply\"\n                        [disabled]=\"isProcessing || !promotionCodeInput().trim()\"\n                        (click)=\"applyPromotionCode()\">Apply</button>\n                </div>\n                @if (promotionError) {\n                    <p class=\"mj-checkout-promo__error\" role=\"alert\">{{ promotionError }}</p>\n                } @else if (activePromotion(); as promo) {\n                    <p class=\"mj-checkout-promo__applied\" role=\"status\">\n                        {{ promo.code }} applied: \u2212{{ currencySymbol() }}{{ promo.discount.toFixed(2) }}\n                    </p>\n                }\n            </div>\n        }\n\n        @if (activeMemberDiscount(); as member) {\n            <p class=\"mj-checkout-promo__applied mj-checkout-member-discount\" role=\"status\">\n                {{ member.code ? member.code + ' member discount' : 'Member discount' }}: \u2212{{ currencySymbol() }}{{ member.discount.toFixed(2) }}\n            </p>\n        }\n\n        @if (autoRenewConsentText(); as consentText) {\n            <label class=\"mj-checkout-consent\">\n                <input type=\"checkbox\"\n                    [checked]=\"autoRenewConsent()\"\n                    (change)=\"autoRenewConsent.set($any($event.target).checked)\"\n                    [disabled]=\"isProcessing\" />\n                <span>{{ consentText }}</span>\n            </label>\n        }\n\n        <!-- Final Total Line -->\n        @if (quotedTax !== null) {\n            <div class=\"mj-checkout-total-row\">\n                <span class=\"mj-total-label\">Sales Tax</span>\n                <span class=\"mj-total-amount\">{{ currencySymbol() }}{{ (quotedTax ?? 0).toFixed(2) }}</span>\n            </div>\n        }\n        <div class=\"mj-checkout-total-row\">\n            <span class=\"mj-total-label\">Total Due</span>\n            <span class=\"mj-total-amount\">{{ currencySymbol() }}{{ totalGross().toFixed(2) }}</span>\n        </div>\n    }\n\n    <!-- Actions -->\n    <div class=\"mj-widget-actions\">\n        <button type=\"button\" class=\"mj-btn-submit\" [disabled]=\"!isFormValid() || isProcessing\" (click)=\"handleSubmit()\">\n            @if (isProcessing) {\n                <span class=\"mj-spinner\"></span>\n                <span>Processing...</span>\n            } @else if (isFree()) {\n                <span>Complete Free Registration</span>\n            } @else {\n                <span>Pay {{ currencySymbol() }}{{ totalGross().toFixed(2) }}</span>\n            }\n        </button>\n\n        <button type=\"button\" class=\"mj-btn-cancel\" [disabled]=\"isProcessing\" (click)=\"cancelled.emit()\">\n            Cancel\n        </button>\n    </div>\n</div>\n", styles: [":host {\n    display: block;\n    font-family: var(--mj-font-family, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);\n    color: var(--mj-text-color, #1e293b);\n}\n\n.mj-checkout-widget-container {\n    max-width: 560px;\n    margin: 0 auto;\n    background: var(--mj-bg-color, #ffffff);\n    border: 1px solid #e2e8f0;\n    border-radius: var(--mj-border-radius, 8px);\n    padding: 24px;\n    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);\n}\n\n.mj-widget-header {\n    margin-bottom: 20px;\n}\n\n.mj-widget-title {\n    margin: 0 0 6px 0;\n    font-size: 1.35rem;\n    font-weight: 700;\n    color: var(--mj-text-color, #0f172a);\n}\n\n.mj-widget-description {\n    margin: 0;\n    font-size: 0.9rem;\n    color: #64748b;\n    line-height: 1.4;\n}\n\n.mj-widget-error-banner {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    background: #fef2f2;\n    border: 1px solid #f87171;\n    color: #991b1b;\n    padding: 10px 14px;\n    border-radius: 6px;\n    margin-bottom: 18px;\n    font-size: 0.875rem;\n}\n\n.mj-error-icon {\n    font-size: 1rem;\n}\n\n.mj-widget-summary-card {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px 16px;\n    margin-bottom: 20px;\n}\n\n.mj-summary-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n\n.mj-summary-price {\n    display: flex;\n    align-items: center;\n}\n\n.mj-widget-form-section {\n    margin-bottom: 20px;\n}\n\n.mj-summary-item-info {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.mj-product-name {\n    font-weight: 600;\n    font-size: 1rem;\n    color: #1e293b;\n}\n\n.mj-badge-free {\n    background: #dcfce7;\n    color: #166534;\n    font-size: 0.75rem;\n    font-weight: 700;\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.mj-price-free {\n    font-weight: 700;\n    color: #166534;\n    font-size: 1.1rem;\n}\n\n.mj-price-amount {\n    font-weight: 700;\n    color: #0f172a;\n    font-size: 1.1rem;\n}\n\n.mj-quantity-selector-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-top: 12px;\n    padding-top: 12px;\n    border-top: 1px dashed #cbd5e1;\n}\n\n.mj-qty-controls {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n}\n\n.mj-qty-btn {\n    width: 28px;\n    height: 28px;\n    background: #ffffff;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    cursor: pointer;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.mj-qty-btn:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.mj-qty-input {\n    width: 44px;\n    height: 28px;\n    text-align: center;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    font-weight: 600;\n}\n\n.mj-section-title {\n    font-size: 1rem;\n    font-weight: 600;\n    margin: 0 0 12px 0;\n    color: #334155;\n}\n\n.mj-form-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 12px;\n    margin-bottom: 18px;\n}\n\n.mj-form-group {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.mj-form-group.full-width {\n    grid-column: 1 / -1;\n}\n\n.mj-label {\n    font-size: 0.8rem;\n    font-weight: 500;\n    color: #475569;\n}\n\n.mj-required {\n    color: #ef4444;\n}\n\n.mj-input, .mj-select {\n    padding: 8px 12px;\n    font-size: 0.9rem;\n    border: 1px solid #cbd5e1;\n    border-radius: 4px;\n    background: #ffffff;\n    color: #1e293b;\n    outline: none;\n    transition: border-color 0.15s ease;\n    width: 100%;\n    box-sizing: border-box;\n}\n\n.mj-textarea {\n    min-height: 70px;\n    resize: vertical;\n    font-family: inherit;\n}\n\n.mj-select {\n    min-height: 38px;\n}\n\n.mj-checkbox-label {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    cursor: pointer;\n    font-size: 0.9rem;\n    font-weight: 400;\n    color: #334155;\n    margin-top: 4px;\n}\n\n/* The free-text answer that appears under a question's \"Other\" choice. */\n.mj-question-other {\n    margin-top: 8px;\n}\n\n/* A choice group: its options stacked, with how many to pick beside the heading. */\n.mj-choice-group {\n    border: 0;\n    margin: 0;\n    padding: 0;\n}\n\n.mj-choice-count {\n    font-weight: normal;\n    color: #64748b;\n}\n\n.mj-choice-options {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.mj-checkbox-label.is-disabled {\n    cursor: not-allowed;\n    opacity: 0.55;\n}\n\n.mj-input:focus, .mj-select:focus {\n    border-color: var(--mj-primary-color, #2563eb);\n    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);\n}\n\n/* The e-mail a member token was signed for (#919): shown, not editable. */\n.mj-input[readonly] {\n    background: #f1f5f9;\n    color: #475569;\n    cursor: default;\n}\n\n.mj-field-hint {\n    font-size: 0.8rem;\n    color: #64748b;\n    margin: 0.25rem 0 0;\n}\n\n.mj-multi-attendee-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 12px;\n}\n\n.mj-btn-link {\n    background: none;\n    border: none;\n    color: var(--mj-primary-color, #2563eb);\n    font-size: 0.8rem;\n    cursor: pointer;\n    text-decoration: underline;\n    padding: 0;\n}\n\n.mj-attendee-matrix {\n    display: flex;\n    flex-direction: column;\n    gap: 14px;\n    margin-bottom: 20px;\n}\n\n.mj-attendee-card {\n    background: #f8fafc;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 12px 14px;\n}\n\n.mj-attendee-card-title {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #475569;\n    margin-bottom: 10px;\n}\n\n/* Stripe Payment Container */\n.mj-widget-payment-section {\n    margin-top: 16px;\n    padding-top: 16px;\n    border-top: 1px solid #e2e8f0;\n}\n\n.mj-stripe-container {\n    background: #ffffff;\n    border: 1px solid #e2e8f0;\n    border-radius: 6px;\n    padding: 14px;\n    margin-bottom: 16px;\n}\n\n.mj-stripe-mount-point {\n    min-height: 40px;\n}\n\n.mj-stripe-badge {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    margin-top: 10px;\n    font-size: 0.75rem;\n    color: #64748b;\n}\n\n.mj-stripe-lock-icon {\n    font-size: 0.85rem;\n}\n\n.mj-checkout-total-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 0;\n    border-top: 1px solid #e2e8f0;\n    margin-top: 10px;\n    margin-bottom: 18px;\n}\n\n.mj-total-label {\n    font-weight: 700;\n    font-size: 1.05rem;\n    color: #0f172a;\n}\n\n.mj-total-amount {\n    font-weight: 800;\n    font-size: 1.25rem;\n    color: var(--mj-primary-color, #2563eb);\n}\n\n.mj-widget-actions {\n    margin-top: 12px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.mj-btn-submit {\n    width: 100%;\n    padding: 12px;\n    background: var(--mj-primary-color, #2563eb);\n    color: #ffffff;\n    font-size: 1rem;\n    font-weight: 600;\n    border: none;\n    border-radius: var(--mj-border-radius, 8px);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: opacity 0.15s ease;\n}\n\n.mj-btn-submit:hover:not(:disabled) {\n    opacity: 0.92;\n}\n\n.mj-btn-submit:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.mj-btn-cancel {\n    width: 100%;\n    padding: 8px 12px;\n    background: transparent;\n    color: #64748b;\n    font-size: 0.875rem;\n    font-weight: 500;\n    border: none;\n    cursor: pointer;\n    text-align: center;\n}\n\n.mj-btn-cancel:hover:not(:disabled) {\n    color: #334155;\n    text-decoration: underline;\n}\n\n.mj-spinner {\n    width: 16px;\n    height: 16px;\n    border: 2px solid #ffffff;\n    border-top-color: transparent;\n    border-radius: 50%;\n    animation: mj-spin 0.8s linear infinite;\n}\n\n@keyframes mj-spin {\n    to { transform: rotate(360deg); }\n}\n\n.mj-checkout-consent {\n    display: flex;\n    gap: 0.5rem;\n    align-items: flex-start;\n    margin: 0.75rem 0;\n    font-size: 0.875rem;\n    font-weight: 400;\n    line-height: 1.4;\n}\n.mj-checkout-consent input {\n    margin-top: 0.2rem;\n}\n\n/* Checkboxes keep their native size even when the host page styles every input\n   (e.g. `input { width: 100% }`): this rule is scoped to the widget, so it outranks\n   a plain element or class selector on the host page. */\n.mj-checkbox-label input[type=checkbox],\n.mj-checkout-consent input[type=checkbox] {\n    width: auto;\n    height: auto;\n    padding: 0;\n    border: 0;\n    flex: 0 0 auto;\n}\n\n.mj-checkout-promo {\n    margin: 0.75rem 0;\n}\n.mj-checkout-promo__label {\n    display: block;\n    font-size: 0.875rem;\n    margin-bottom: 0.25rem;\n}\n.mj-checkout-promo__row {\n    display: flex;\n    gap: 0.5rem;\n}\n.mj-checkout-promo__input {\n    flex: 1 1 auto;\n}\n.mj-checkout-promo__error {\n    color: var(--mj-error-color, #b91c1c);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-promo__applied {\n    color: var(--mj-success-color, #15803d);\n    font-size: 0.875rem;\n    margin: 0.35rem 0 0;\n}\n.mj-checkout-member-discount {\n    margin: 0.75rem 0;\n}\n.mj-checkout-promo__apply {\n    flex: 0 0 auto;\n    padding: 8px 14px;\n    background: transparent;\n    color: var(--mj-primary-color, #2563eb);\n    border: 1px solid var(--mj-border-color, #cbd5e1);\n    border-radius: var(--mj-border-radius, 8px);\n    font-size: 0.875rem;\n    font-weight: 600;\n    cursor: pointer;\n}\n.mj-checkout-promo__apply:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n"] }]
     }], () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], { config: [{
             type: Input
         }], distributionSlug: [{
@@ -1378,6 +1472,10 @@ export class MJCheckoutWidgetComponent {
             type: Input
         }], promotionError: [{
             type: Input
+        }], memberDiscount: [{
+            type: Input
+        }], lockEmail: [{
+            type: Input
         }], serverPricedTotal: [{
             type: Input
         }], quotedTotal: [{
@@ -1392,6 +1490,8 @@ export class MJCheckoutWidgetComponent {
             type: Output
         }], quoteInvalidated: [{
             type: Output
+        }], quoteRequested: [{
+            type: Output
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJCheckoutWidgetComponent, { className: "MJCheckoutWidgetComponent", filePath: "lib/checkout-widget/checkout-widget.component.ts", lineNumber: 181 }); })();
 //# sourceMappingURL=checkout-widget.component.js.map