tickera-angular-components 0.0.1-dev.171 → 0.0.1-dev.173

package/fesm2022/tickera-angular-components.mjs

@@ -2339,6 +2339,7 @@ var SelectedDiscountCardType;
     SelectedDiscountCardType["COUPON"] = "COUPON";
     SelectedDiscountCardType["CORPORATE_BOND"] = "CORPORATE_BOND";
     SelectedDiscountCardType["GIFT_BOND"] = "GIFT_BOND";
+    SelectedDiscountCardType["VIP"] = "VIP";
 })(SelectedDiscountCardType || (SelectedDiscountCardType = {}));
 
 const getCustomerFullname = (customer) => {
@@ -2688,6 +2689,69 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                     args: [TICKERA_COMPONENTS_CONFIG]
                 }] }] });
 
+/**
+ * Deshabilita el zoom del NAVEGADOR (no el zoom interno del mapa de
+ * asientos, que sigue funcionando igual). Se instancia una sola vez —
+ * inyectarlo en el componente raíz de la app alcanza, porque es
+ * `providedIn: 'root'` — y cubre las cuatro formas en que un navegador
+ * deja hacer zoom:
+ *
+ *  - Ctrl/Cmd + rueda del mouse (desktop, todos los navegadores).
+ *  - Ctrl/Cmd + "+"/"-"/"0" por teclado (desktop, todos los navegadores).
+ *  - Gesto de pellizco en trackpad en Safari, que no dispara `wheel` sino
+ *    sus propios eventos `gesture*` (no estándar, solo Safari/WebKit).
+ *  - Pellizco con dos dedos en pantallas táctiles, como respaldo además
+ *    del `user-scalable=no` del viewport (que ya lo bloquea en la mayoría
+ *    de los navegadores, pero no en todos de forma consistente).
+ *
+ * No toca el zoom interno de `TicketMapZoomService` (ese es zoom propio de
+ * la app sobre el SVG del mapa, con sus propios botones +/-, y debe seguir
+ * funcionando tal cual).
+ */
+class BrowserZoomLockService {
+    constructor(platformId) {
+        if (!isPlatformBrowser(platformId))
+            return;
+        window.addEventListener('wheel', this.onWheel, { passive: false });
+        window.addEventListener('keydown', this.onKeydown);
+        window.addEventListener('touchmove', this.onTouchMove, { passive: false });
+        // Eventos no estándar de Safari/WebKit para gestos de pellizco en
+        // trackpad — no existen tipos oficiales en lib.dom.d.ts, de ahí el `any`.
+        const win = window;
+        win.addEventListener('gesturestart', this.onGesture);
+        win.addEventListener('gesturechange', this.onGesture);
+        win.addEventListener('gestureend', this.onGesture);
+    }
+    onWheel = (event) => {
+        if (event.ctrlKey) {
+            event.preventDefault();
+        }
+    };
+    onKeydown = (event) => {
+        const isZoomKey = ['+', '-', '_', '=', '0'].includes(event.key);
+        if ((event.ctrlKey || event.metaKey) && isZoomKey) {
+            event.preventDefault();
+        }
+    };
+    onTouchMove = (event) => {
+        if (event.touches.length > 1) {
+            event.preventDefault();
+        }
+    };
+    onGesture = (event) => {
+        event.preventDefault();
+    };
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BrowserZoomLockService, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BrowserZoomLockService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: BrowserZoomLockService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: Object, decorators: [{
+                    type: Inject,
+                    args: [PLATFORM_ID]
+                }] }] });
+
 class ToastService {
     show(message, type = 'info') {
         toast[type](message);
@@ -3696,11 +3760,13 @@ class TicketSelectionDiscountService {
     _corporateBondCode = signal(null, ...(ngDevMode ? [{ debugName: "_corporateBondCode" }] : []));
     _giftBond = signal(null, ...(ngDevMode ? [{ debugName: "_giftBond" }] : []));
     _giftBondCode = signal(null, ...(ngDevMode ? [{ debugName: "_giftBondCode" }] : []));
+    _vipCard = signal(null, ...(ngDevMode ? [{ debugName: "_vipCard" }] : []));
     coupon = computed(() => this._coupon(), ...(ngDevMode ? [{ debugName: "coupon" }] : []));
     corporateBond = computed(() => this._corporateBond(), ...(ngDevMode ? [{ debugName: "corporateBond" }] : []));
     corporateBondCode = computed(() => this._corporateBondCode(), ...(ngDevMode ? [{ debugName: "corporateBondCode" }] : []));
     giftBond = computed(() => this._giftBond(), ...(ngDevMode ? [{ debugName: "giftBond" }] : []));
     giftBondCode = computed(() => this._giftBondCode(), ...(ngDevMode ? [{ debugName: "giftBondCode" }] : []));
+    vipCard = computed(() => this._vipCard(), ...(ngDevMode ? [{ debugName: "vipCard" }] : []));
     selectedDiscount = computed(() => {
         const coupon = this.coupon();
         if (!!coupon) {
@@ -3729,6 +3795,16 @@ class TicketSelectionDiscountService {
                 discountType: 'fixed',
             };
         }
+        const vipCard = this.vipCard();
+        if (!!vipCard) {
+            return {
+                name: vipCard.category_snapshot?.name ?? 'Tarjeta VIP',
+                value: Number(vipCard.category_snapshot?.discount_percentage ?? 0),
+                type: SelectedDiscountCardType.VIP,
+                discountType: 'percentage',
+                serviceFeeExempt: !!vipCard.category_snapshot?.service_fee_exempt,
+            };
+        }
         return null;
     }, ...(ngDevMode ? [{ debugName: "selectedDiscount" }] : []));
     selectedDiscountType = computed(() => {
@@ -3752,12 +3828,22 @@ class TicketSelectionDiscountService {
     setGiftBondCode(code) {
         this._giftBondCode.set(code);
     }
+    /**
+     * Saldo VIP como método de pago (VIP-HU-04). Solo debe contar como
+     * descuento "seleccionado" mientras el cliente efectivamente eligió
+     * pagar con su saldo VIP, no solo por tener una tarjeta activa —
+     * llamar con `null` en cuanto deje de ser el método de pago elegido.
+     */
+    setVipCard(card) {
+        this._vipCard.set(card);
+    }
     clearSelection() {
         this._coupon.set(null);
         this._corporateBond.set(null);
         this._corporateBondCode.set(null);
         this._giftBond.set(null);
         this._giftBondCode.set(null);
+        this._vipCard.set(null);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketSelectionDiscountService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketSelectionDiscountService, providedIn: 'root' });
@@ -4126,6 +4212,9 @@ class TicketSelectionTotalsService {
         }, 0);
     }, ...(ngDevMode ? [{ debugName: "ticketSubtotal" }] : []));
     serviceFee = computed(() => {
+        if (this.selectionDiscountService.selectedDiscount()?.serviceFeeExempt) {
+            return 0;
+        }
         return Number(this.bookingDataService.show()?.service_fee ?? '0');
     }, ...(ngDevMode ? [{ debugName: "serviceFee" }] : []));
     discountAmount = computed(() => {
@@ -9493,7 +9582,7 @@ class TicketMapTotalsComponent {
         this.activatedRoute = activatedRoute;
     }
     get serviceFee() {
-        return Number(this.bookingDataService.show()?.service_fee ?? '0');
+        return this.selectionTotalsService.serviceFee();
     }
     get performanceId() {
         return Number(this.activatedRoute.snapshot.paramMap.get('id'));
@@ -9502,7 +9591,7 @@ class TicketMapTotalsComponent {
         return this.selectionService.selectedTicketIdList();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketMapTotalsComponent, deps: [{ token: PerformanceBookingDataService }, { token: TicketSelectionDetailsService }, { token: TicketSelectionDiscountService }, { token: TicketSelectionTotalsService }, { token: TicketSelectionService }, { token: i3$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TicketMapTotalsComponent, isStandalone: true, selector: "ticket-map-totals", inputs: { title: "title", buttonText: "buttonText", loadingButtonText: "loadingButtonText", isLoading: "isLoading" }, outputs: { onPurchaseClick: "onPurchaseClick" }, ngImport: i0, template: "<ticket-map-widget class=\"w-full\">\n  <ticket-map-widget-header [title]=\"title\" />\n\n  <div class=\"ticket-map-totals\">\n    <p class=\"ticket-map-totals__item\">\n      <span>Entradas ({{ selectionService.selectedCount() | number: '1.0-2' }}):</span>\n      <span> ${{ selectionTotalsService.ticketSubtotal() | number: '1.0-2' }} </span>\n    </p>\n\n    @if (selectionService.selectedProductCount() > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Productos ({{ selectionService.selectedProductCount() | number: '1.0-2' }}):</span>\n        <span>${{ selectionTotalsService.productSubtotal() | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ bookingDataService.show()?.service_fee ?? '0' | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.coupon() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }}\n          @if (selectionDiscountService.selectedDiscount()?.discountType === 'percentage') {\n            ({{ selectionDiscountService.coupon()?.discount_value }}%)\n          }\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.corporateBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.corporateBond()?.value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.giftBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.giftBond()?.original_value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    <hr class=\"ticket-map-totals__divider\" />\n\n    <div class=\"ticket-map-totals__calculated\">\n      <span class=\"ticket-map-totals__calculated-title\">Total:</span>\n\n      @if (\n        selectionTotalsService.totalDiscounted() || selectionTotalsService.totalDiscounted() === 0\n      ) {\n        <span class=\"ticket-map-totals__calculated-inline\">\n          <span class=\"ticket-map-totals__calculated-discount\">\n            ${{ selectionTotalsService.totalValue() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n          <span class=\"ticket-map-totals__calculated-total\">\n            ${{ selectionTotalsService.totalDiscounted() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"ticket-map-totals__calculated-total\">\n          ${{ selectionTotalsService.totalValue() | number: '1.0-2' }}\n        </span>\n      }\n    </div>\n\n    @if (selectionService.selectedCount() > 0 || selectionService.selectedProductCount() > 0) {\n      <div class=\"flex flex-col gap-2\">\n        <app-button\n          (click)=\"onPurchaseClick.emit()\"\n          size=\"sm\"\n          icon=\"ri-dashboard-3-line\"\n          [text]=\"buttonText\"\n          [loadingText]=\"loadingButtonText\"\n          [loading]=\"isLoading\"\n          variant=\"primary\"\n        />\n      </div>\n    }\n  </div>\n</ticket-map-widget>\n", styles: [".ticket-map-totals{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;width:100%}.ticket-map-totals__item{align-items:center;color:#9ca3af;display:flex;flex-direction:row;font-size:.75rem;justify-content:space-between;margin:0}.ticket-map-totals__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.ticket-map-totals__calculated{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:0}.ticket-map-totals__calculated-title{color:#4b5563;font-size:1rem;font-weight:700}.ticket-map-totals__calculated-inline{display:flex;flex-direction:column;align-items:flex-end}.ticket-map-totals__calculated-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}.ticket-map-totals__calculated-total{color:#4b5563;font-size:1rem;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: TicketMapWidgetHeaderComponent, selector: "ticket-map-widget-header", inputs: ["title"] }, { kind: "component", type: TicketMapWidgetComponent, selector: "ticket-map-widget" }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: TicketMapTotalsComponent, isStandalone: true, selector: "ticket-map-totals", inputs: { title: "title", buttonText: "buttonText", loadingButtonText: "loadingButtonText", isLoading: "isLoading" }, outputs: { onPurchaseClick: "onPurchaseClick" }, ngImport: i0, template: "<ticket-map-widget class=\"w-full\">\n  <ticket-map-widget-header [title]=\"title\" />\n\n  <div class=\"ticket-map-totals\">\n    <p class=\"ticket-map-totals__item\">\n      <span>Entradas ({{ selectionService.selectedCount() | number: '1.0-2' }}):</span>\n      <span> ${{ selectionTotalsService.ticketSubtotal() | number: '1.0-2' }} </span>\n    </p>\n\n    @if (selectionService.selectedProductCount() > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Productos ({{ selectionService.selectedProductCount() | number: '1.0-2' }}):</span>\n        <span>${{ selectionTotalsService.productSubtotal() | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ bookingDataService.show()?.service_fee ?? '0' | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.coupon() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }}\n          @if (selectionDiscountService.selectedDiscount()?.discountType === 'percentage') {\n            ({{ selectionDiscountService.coupon()?.discount_value }}%)\n          }\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.corporateBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.corporateBond()?.value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.giftBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.giftBond()?.original_value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.vipCard() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarjeta VIP:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }} ({{\n            selectionDiscountService.vipCard()?.category_snapshot?.discount_percentage\n          }}%)\n        </span>\n      </p>\n    }\n\n    <hr class=\"ticket-map-totals__divider\" />\n\n    <div class=\"ticket-map-totals__calculated\">\n      <span class=\"ticket-map-totals__calculated-title\">Total:</span>\n\n      @if (\n        selectionTotalsService.totalDiscounted() || selectionTotalsService.totalDiscounted() === 0\n      ) {\n        <span class=\"ticket-map-totals__calculated-inline\">\n          <span class=\"ticket-map-totals__calculated-discount\">\n            ${{ selectionTotalsService.totalValue() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n          <span class=\"ticket-map-totals__calculated-total\">\n            ${{ selectionTotalsService.totalDiscounted() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"ticket-map-totals__calculated-total\">\n          ${{ selectionTotalsService.totalValue() | number: '1.0-2' }}\n        </span>\n      }\n    </div>\n\n    @if (selectionService.selectedCount() > 0 || selectionService.selectedProductCount() > 0) {\n      <div class=\"flex flex-col gap-2\">\n        <app-button\n          (click)=\"onPurchaseClick.emit()\"\n          size=\"sm\"\n          icon=\"ri-dashboard-3-line\"\n          [text]=\"buttonText\"\n          [loadingText]=\"loadingButtonText\"\n          [loading]=\"isLoading\"\n          variant=\"primary\"\n        />\n      </div>\n    }\n  </div>\n</ticket-map-widget>\n", styles: [".ticket-map-totals{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;width:100%}.ticket-map-totals__item{align-items:center;color:#9ca3af;display:flex;flex-direction:row;font-size:.75rem;justify-content:space-between;margin:0}.ticket-map-totals__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.ticket-map-totals__calculated{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:0}.ticket-map-totals__calculated-title{color:#4b5563;font-size:1rem;font-weight:700}.ticket-map-totals__calculated-inline{display:flex;flex-direction:column;align-items:flex-end}.ticket-map-totals__calculated-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}.ticket-map-totals__calculated-total{color:#4b5563;font-size:1rem;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: TicketMapWidgetHeaderComponent, selector: "ticket-map-widget-header", inputs: ["title"] }, { kind: "component", type: TicketMapWidgetComponent, selector: "ticket-map-widget" }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: TicketMapTotalsComponent, decorators: [{
             type: Component,
@@ -9511,7 +9600,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
                         AppButtonComponent,
                         TicketMapWidgetHeaderComponent,
                         TicketMapWidgetComponent,
-                    ], template: "<ticket-map-widget class=\"w-full\">\n  <ticket-map-widget-header [title]=\"title\" />\n\n  <div class=\"ticket-map-totals\">\n    <p class=\"ticket-map-totals__item\">\n      <span>Entradas ({{ selectionService.selectedCount() | number: '1.0-2' }}):</span>\n      <span> ${{ selectionTotalsService.ticketSubtotal() | number: '1.0-2' }} </span>\n    </p>\n\n    @if (selectionService.selectedProductCount() > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Productos ({{ selectionService.selectedProductCount() | number: '1.0-2' }}):</span>\n        <span>${{ selectionTotalsService.productSubtotal() | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ bookingDataService.show()?.service_fee ?? '0' | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.coupon() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }}\n          @if (selectionDiscountService.selectedDiscount()?.discountType === 'percentage') {\n            ({{ selectionDiscountService.coupon()?.discount_value }}%)\n          }\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.corporateBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.corporateBond()?.value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.giftBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.giftBond()?.original_value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    <hr class=\"ticket-map-totals__divider\" />\n\n    <div class=\"ticket-map-totals__calculated\">\n      <span class=\"ticket-map-totals__calculated-title\">Total:</span>\n\n      @if (\n        selectionTotalsService.totalDiscounted() || selectionTotalsService.totalDiscounted() === 0\n      ) {\n        <span class=\"ticket-map-totals__calculated-inline\">\n          <span class=\"ticket-map-totals__calculated-discount\">\n            ${{ selectionTotalsService.totalValue() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n          <span class=\"ticket-map-totals__calculated-total\">\n            ${{ selectionTotalsService.totalDiscounted() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"ticket-map-totals__calculated-total\">\n          ${{ selectionTotalsService.totalValue() | number: '1.0-2' }}\n        </span>\n      }\n    </div>\n\n    @if (selectionService.selectedCount() > 0 || selectionService.selectedProductCount() > 0) {\n      <div class=\"flex flex-col gap-2\">\n        <app-button\n          (click)=\"onPurchaseClick.emit()\"\n          size=\"sm\"\n          icon=\"ri-dashboard-3-line\"\n          [text]=\"buttonText\"\n          [loadingText]=\"loadingButtonText\"\n          [loading]=\"isLoading\"\n          variant=\"primary\"\n        />\n      </div>\n    }\n  </div>\n</ticket-map-widget>\n", styles: [".ticket-map-totals{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;width:100%}.ticket-map-totals__item{align-items:center;color:#9ca3af;display:flex;flex-direction:row;font-size:.75rem;justify-content:space-between;margin:0}.ticket-map-totals__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.ticket-map-totals__calculated{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:0}.ticket-map-totals__calculated-title{color:#4b5563;font-size:1rem;font-weight:700}.ticket-map-totals__calculated-inline{display:flex;flex-direction:column;align-items:flex-end}.ticket-map-totals__calculated-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}.ticket-map-totals__calculated-total{color:#4b5563;font-size:1rem;font-weight:700}\n"] }]
+                    ], template: "<ticket-map-widget class=\"w-full\">\n  <ticket-map-widget-header [title]=\"title\" />\n\n  <div class=\"ticket-map-totals\">\n    <p class=\"ticket-map-totals__item\">\n      <span>Entradas ({{ selectionService.selectedCount() | number: '1.0-2' }}):</span>\n      <span> ${{ selectionTotalsService.ticketSubtotal() | number: '1.0-2' }} </span>\n    </p>\n\n    @if (selectionService.selectedProductCount() > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Productos ({{ selectionService.selectedProductCount() | number: '1.0-2' }}):</span>\n        <span>${{ selectionTotalsService.productSubtotal() | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ bookingDataService.show()?.service_fee ?? '0' | number: '1.0-2' }}</span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.coupon() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }}\n          @if (selectionDiscountService.selectedDiscount()?.discountType === 'percentage') {\n            ({{ selectionDiscountService.coupon()?.discount_value }}%)\n          }\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.corporateBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.corporateBond()?.value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.giftBond()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"line-through\">\n          ${{ selectionDiscountService.giftBond()?.original_value ?? '0' | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (!!selectionDiscountService.vipCard() && selectionTotalsService.discountAmount()) {\n      <p class=\"ticket-map-totals__item\">\n        <span>Tarjeta VIP:</span>\n        <span class=\"line-through\">\n          -${{ selectionTotalsService.discountAmount() | number: '1.0-2' }} ({{\n            selectionDiscountService.vipCard()?.category_snapshot?.discount_percentage\n          }}%)\n        </span>\n      </p>\n    }\n\n    <hr class=\"ticket-map-totals__divider\" />\n\n    <div class=\"ticket-map-totals__calculated\">\n      <span class=\"ticket-map-totals__calculated-title\">Total:</span>\n\n      @if (\n        selectionTotalsService.totalDiscounted() || selectionTotalsService.totalDiscounted() === 0\n      ) {\n        <span class=\"ticket-map-totals__calculated-inline\">\n          <span class=\"ticket-map-totals__calculated-discount\">\n            ${{ selectionTotalsService.totalValue() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n          <span class=\"ticket-map-totals__calculated-total\">\n            ${{ selectionTotalsService.totalDiscounted() | currency: 'COP' : 'symbol' : '1.0-2' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"ticket-map-totals__calculated-total\">\n          ${{ selectionTotalsService.totalValue() | number: '1.0-2' }}\n        </span>\n      }\n    </div>\n\n    @if (selectionService.selectedCount() > 0 || selectionService.selectedProductCount() > 0) {\n      <div class=\"flex flex-col gap-2\">\n        <app-button\n          (click)=\"onPurchaseClick.emit()\"\n          size=\"sm\"\n          icon=\"ri-dashboard-3-line\"\n          [text]=\"buttonText\"\n          [loadingText]=\"loadingButtonText\"\n          [loading]=\"isLoading\"\n          variant=\"primary\"\n        />\n      </div>\n    }\n  </div>\n</ticket-map-widget>\n", styles: [".ticket-map-totals{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;width:100%}.ticket-map-totals__item{align-items:center;color:#9ca3af;display:flex;flex-direction:row;font-size:.75rem;justify-content:space-between;margin:0}.ticket-map-totals__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.ticket-map-totals__calculated{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin:0}.ticket-map-totals__calculated-title{color:#4b5563;font-size:1rem;font-weight:700}.ticket-map-totals__calculated-inline{display:flex;flex-direction:column;align-items:flex-end}.ticket-map-totals__calculated-discount{color:#9ca3af;font-size:.75rem;text-decoration:line-through}.ticket-map-totals__calculated-total{color:#4b5563;font-size:1rem;font-weight:700}\n"] }]
         }], ctorParameters: () => [{ type: PerformanceBookingDataService }, { type: TicketSelectionDetailsService }, { type: TicketSelectionDiscountService }, { type: TicketSelectionTotalsService }, { type: TicketSelectionService }, { type: i3$1.ActivatedRoute }], propDecorators: { title: [{
                 type: Input
             }], buttonText: [{
@@ -9660,7 +9749,7 @@ class ConfirmationOrderModalComponent {
         return this.selectionService.selectedCount();
     }
     get serviceFee() {
-        return Number(this.bookingDataService.show()?.service_fee ?? '0');
+        return this.selectionTotalsService.serviceFee();
     }
     get subtotalValue() {
         return this.selectionTotalsService.subtotalValue();
@@ -9689,6 +9778,17 @@ class ConfirmationOrderModalComponent {
     get giftBond() {
         return this.selectionDiscountService.giftBond();
     }
+    get vipCard() {
+        return this.selectionDiscountService.vipCard();
+    }
+    /**
+     * A diferencia de coupon/corporateBond/giftBond (que aquí muestran su
+     * valor crudo sin pasar por `discountAmount()`), para VIP sí se calcula
+     * el monto real en pesos, ya que el descuento es un porcentaje.
+     */
+    get vipDiscountAmount() {
+        return this.selectionTotalsService.discountAmount() ?? 0;
+    }
     onClose() {
         if (this.loading)
             return;
@@ -9698,11 +9798,11 @@ class ConfirmationOrderModalComponent {
         this.onConfirm && this.onConfirm.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ConfirmationOrderModalComponent, deps: [{ token: ConfirmationOrderModalService }, { token: TicketSelectionDiscountService }, { token: TicketSelectionTotalsService }, { token: TicketSelectionService }, { token: PerformanceBookingDataService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ConfirmationOrderModalComponent, isStandalone: true, selector: "confirmation-order-modal", inputs: { modalTitle: "modalTitle", confirmButtonText: "confirmButtonText", confirmButtonTextLoading: "confirmButtonTextLoading", loading: "loading" }, outputs: { onConfirm: "onConfirm" }, ngImport: i0, template: "<app-modal [title]=\"modalTitle\" [isOpen]=\"isOpen\" size=\"md\" (closeModal)=\"onClose()\">\n  <div class=\"confirmation-modal\">\n    <p class=\"confirmation-modal__description\">\n      Revise los detalles de la compra antes de confirmar.\n    </p>\n\n    <p class=\"confirmation-modal__item\">\n      <span>Entradas ({{ selectedCount | number: '1.0-0' }}):</span>\n      <span>${{ ticketSubtotal | number: '1.0' }}</span>\n    </p>\n\n    @if (productCount > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Productos ({{ productCount | number: '1.0-0' }}):</span>\n        <span>${{ productSubtotal | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ serviceFee | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (coupon) {\n      <p class=\"confirmation-modal__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ coupon.discount_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (corporateBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ corporateBond.value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (giftBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ giftBond.original_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    <hr class=\"confirmation-modal__divider\" />\n\n    <p class=\"confirmation-modal__totals\">\n      <span class=\"confirmation-modal__totals-title\">Total:</span>\n\n      @if (totalDiscounted || totalDiscounted === 0) {\n        <span class=\"confirmation-modal__totals-discounted\">\n          <span class=\"confirmation-modal__discount\">\n            ${{ totalValue | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n          <span class=\"confirmation-modal__price\">\n            ${{ totalDiscounted | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"confirmation-modal__price\">${{ totalValue | number: '1.0' }}</span>\n      }\n    </p>\n  </div>\n\n  <div class=\"confirmation-modal__actions\">\n    <app-button\n      size=\"sm\"\n      variant=\"tertiary\"\n      text=\"Cancelar\"\n      (click)=\"onClose()\"\n      [disabled]=\"loading\"\n    />\n\n    <app-button\n      size=\"sm\"\n      variant=\"primary\"\n      [text]=\"confirmButtonText\"\n      [loadingText]=\"confirmButtonTextLoading\"\n      [loading]=\"loading\"\n      [disabled]=\"loading\"\n      (click)=\"confirmOrder()\"\n    />\n  </div>\n</app-modal>\n", styles: [".confirmation-modal{display:flex;flex-flow:column nowrap;gap:.5rem;width:100%}.confirmation-modal__description{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.confirmation-modal__item{align-items:center;color:#9ca3af;display:flex;flex-flow:row wrap;font-size:.75rem;justify-content:space-between;margin:0}.confirmation-modal__discount{text-decoration:line-through}.confirmation-modal__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.confirmation-modal__price{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals{align-items:center;display:flex;flex-flow:row;justify-content:space-between;margin:0;width:100%}.confirmation-modal__totals-title{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals-discounted{align-items:flex-end;display:flex;flex-flow:column}.confirmation-modal__totals-discounted .confirmation-modal__discount{color:#9ca3af;font-size:.75rem}.confirmation-modal__actions{display:flex;flex-flow:row;gap:.5rem;justify-content:flex-end;padding-top:1rem;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: ConfirmationOrderModalComponent, isStandalone: true, selector: "confirmation-order-modal", inputs: { modalTitle: "modalTitle", confirmButtonText: "confirmButtonText", confirmButtonTextLoading: "confirmButtonTextLoading", loading: "loading" }, outputs: { onConfirm: "onConfirm" }, ngImport: i0, template: "<app-modal [title]=\"modalTitle\" [isOpen]=\"isOpen\" size=\"md\" (closeModal)=\"onClose()\">\n  <div class=\"confirmation-modal\">\n    <p class=\"confirmation-modal__description\">\n      Revise los detalles de la compra antes de confirmar.\n    </p>\n\n    <p class=\"confirmation-modal__item\">\n      <span>Entradas ({{ selectedCount | number: '1.0-0' }}):</span>\n      <span>${{ ticketSubtotal | number: '1.0' }}</span>\n    </p>\n\n    @if (productCount > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Productos ({{ productCount | number: '1.0-0' }}):</span>\n        <span>${{ productSubtotal | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ serviceFee | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (coupon) {\n      <p class=\"confirmation-modal__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ coupon.discount_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (corporateBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ corporateBond.value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (giftBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ giftBond.original_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (vipCard) {\n      <p class=\"confirmation-modal__item\">\n        <span>Tarjeta VIP:</span>\n        <span class=\"confirmation-modal__discount\">\n          -${{ vipDiscountAmount | number: '1.0-2' }}\n          ({{ vipCard.category_snapshot?.discount_percentage }}%)\n        </span>\n      </p>\n    }\n\n    <hr class=\"confirmation-modal__divider\" />\n\n    <p class=\"confirmation-modal__totals\">\n      <span class=\"confirmation-modal__totals-title\">Total:</span>\n\n      @if (totalDiscounted || totalDiscounted === 0) {\n        <span class=\"confirmation-modal__totals-discounted\">\n          <span class=\"confirmation-modal__discount\">\n            ${{ totalValue | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n          <span class=\"confirmation-modal__price\">\n            ${{ totalDiscounted | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"confirmation-modal__price\">${{ totalValue | number: '1.0' }}</span>\n      }\n    </p>\n  </div>\n\n  <div class=\"confirmation-modal__actions\">\n    <app-button\n      size=\"sm\"\n      variant=\"tertiary\"\n      text=\"Cancelar\"\n      (click)=\"onClose()\"\n      [disabled]=\"loading\"\n    />\n\n    <app-button\n      size=\"sm\"\n      variant=\"primary\"\n      [text]=\"confirmButtonText\"\n      [loadingText]=\"confirmButtonTextLoading\"\n      [loading]=\"loading\"\n      [disabled]=\"loading\"\n      (click)=\"confirmOrder()\"\n    />\n  </div>\n</app-modal>\n", styles: [".confirmation-modal{display:flex;flex-flow:column nowrap;gap:.5rem;width:100%}.confirmation-modal__description{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.confirmation-modal__item{align-items:center;color:#9ca3af;display:flex;flex-flow:row wrap;font-size:.75rem;justify-content:space-between;margin:0}.confirmation-modal__discount{text-decoration:line-through}.confirmation-modal__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.confirmation-modal__price{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals{align-items:center;display:flex;flex-flow:row;justify-content:space-between;margin:0;width:100%}.confirmation-modal__totals-title{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals-discounted{align-items:flex-end;display:flex;flex-flow:column}.confirmation-modal__totals-discounted .confirmation-modal__discount{color:#9ca3af;font-size:.75rem}.confirmation-modal__actions{display:flex;flex-flow:row;gap:.5rem;justify-content:flex-end;padding-top:1rem;width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: AppButtonComponent, selector: "app-button", inputs: ["disabled", "loading", "type", "variant", "text", "size", "loadingText", "icon", "tooltip"], outputs: ["clicked"] }, { kind: "component", type: AppModalComponent, selector: "app-modal", inputs: ["title", "disableClose", "showHeader", "showCloseButton", "showTitle", "interactiveClose", "isOpen", "size"], outputs: ["closeModal"] }, { kind: "pipe", type: i1$1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$1.CurrencyPipe, name: "currency" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: ConfirmationOrderModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'confirmation-order-modal', standalone: true, imports: [CommonModule, AppButtonComponent, AppModalComponent], template: "<app-modal [title]=\"modalTitle\" [isOpen]=\"isOpen\" size=\"md\" (closeModal)=\"onClose()\">\n  <div class=\"confirmation-modal\">\n    <p class=\"confirmation-modal__description\">\n      Revise los detalles de la compra antes de confirmar.\n    </p>\n\n    <p class=\"confirmation-modal__item\">\n      <span>Entradas ({{ selectedCount | number: '1.0-0' }}):</span>\n      <span>${{ ticketSubtotal | number: '1.0' }}</span>\n    </p>\n\n    @if (productCount > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Productos ({{ productCount | number: '1.0-0' }}):</span>\n        <span>${{ productSubtotal | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ serviceFee | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (coupon) {\n      <p class=\"confirmation-modal__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ coupon.discount_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (corporateBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ corporateBond.value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (giftBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ giftBond.original_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    <hr class=\"confirmation-modal__divider\" />\n\n    <p class=\"confirmation-modal__totals\">\n      <span class=\"confirmation-modal__totals-title\">Total:</span>\n\n      @if (totalDiscounted || totalDiscounted === 0) {\n        <span class=\"confirmation-modal__totals-discounted\">\n          <span class=\"confirmation-modal__discount\">\n            ${{ totalValue | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n          <span class=\"confirmation-modal__price\">\n            ${{ totalDiscounted | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"confirmation-modal__price\">${{ totalValue | number: '1.0' }}</span>\n      }\n    </p>\n  </div>\n\n  <div class=\"confirmation-modal__actions\">\n    <app-button\n      size=\"sm\"\n      variant=\"tertiary\"\n      text=\"Cancelar\"\n      (click)=\"onClose()\"\n      [disabled]=\"loading\"\n    />\n\n    <app-button\n      size=\"sm\"\n      variant=\"primary\"\n      [text]=\"confirmButtonText\"\n      [loadingText]=\"confirmButtonTextLoading\"\n      [loading]=\"loading\"\n      [disabled]=\"loading\"\n      (click)=\"confirmOrder()\"\n    />\n  </div>\n</app-modal>\n", styles: [".confirmation-modal{display:flex;flex-flow:column nowrap;gap:.5rem;width:100%}.confirmation-modal__description{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.confirmation-modal__item{align-items:center;color:#9ca3af;display:flex;flex-flow:row wrap;font-size:.75rem;justify-content:space-between;margin:0}.confirmation-modal__discount{text-decoration:line-through}.confirmation-modal__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.confirmation-modal__price{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals{align-items:center;display:flex;flex-flow:row;justify-content:space-between;margin:0;width:100%}.confirmation-modal__totals-title{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals-discounted{align-items:flex-end;display:flex;flex-flow:column}.confirmation-modal__totals-discounted .confirmation-modal__discount{color:#9ca3af;font-size:.75rem}.confirmation-modal__actions{display:flex;flex-flow:row;gap:.5rem;justify-content:flex-end;padding-top:1rem;width:100%}\n"] }]
+            args: [{ selector: 'confirmation-order-modal', standalone: true, imports: [CommonModule, AppButtonComponent, AppModalComponent], template: "<app-modal [title]=\"modalTitle\" [isOpen]=\"isOpen\" size=\"md\" (closeModal)=\"onClose()\">\n  <div class=\"confirmation-modal\">\n    <p class=\"confirmation-modal__description\">\n      Revise los detalles de la compra antes de confirmar.\n    </p>\n\n    <p class=\"confirmation-modal__item\">\n      <span>Entradas ({{ selectedCount | number: '1.0-0' }}):</span>\n      <span>${{ ticketSubtotal | number: '1.0' }}</span>\n    </p>\n\n    @if (productCount > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Productos ({{ productCount | number: '1.0-0' }}):</span>\n        <span>${{ productSubtotal | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (serviceFee > 0) {\n      <p class=\"confirmation-modal__item\">\n        <span>Tarifa de servicio:</span>\n        <span>${{ serviceFee | number: '1.0' }}</span>\n      </p>\n    }\n\n    @if (coupon) {\n      <p class=\"confirmation-modal__item\">\n        <span>Cup\u00F3n de descuento:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ coupon.discount_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (corporateBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono corporativo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ corporateBond.value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (giftBond) {\n      <p class=\"confirmation-modal__item\">\n        <span>Bono de regalo:</span>\n        <span class=\"confirmation-modal__discount\">\n          ${{ giftBond.original_value | number: '1.0-2' }}\n        </span>\n      </p>\n    }\n\n    @if (vipCard) {\n      <p class=\"confirmation-modal__item\">\n        <span>Tarjeta VIP:</span>\n        <span class=\"confirmation-modal__discount\">\n          -${{ vipDiscountAmount | number: '1.0-2' }}\n          ({{ vipCard.category_snapshot?.discount_percentage }}%)\n        </span>\n      </p>\n    }\n\n    <hr class=\"confirmation-modal__divider\" />\n\n    <p class=\"confirmation-modal__totals\">\n      <span class=\"confirmation-modal__totals-title\">Total:</span>\n\n      @if (totalDiscounted || totalDiscounted === 0) {\n        <span class=\"confirmation-modal__totals-discounted\">\n          <span class=\"confirmation-modal__discount\">\n            ${{ totalValue | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n          <span class=\"confirmation-modal__price\">\n            ${{ totalDiscounted | currency: 'COP' : 'symbol' : '1.0' }}\n          </span>\n        </span>\n      } @else {\n        <span class=\"confirmation-modal__price\">${{ totalValue | number: '1.0' }}</span>\n      }\n    </p>\n  </div>\n\n  <div class=\"confirmation-modal__actions\">\n    <app-button\n      size=\"sm\"\n      variant=\"tertiary\"\n      text=\"Cancelar\"\n      (click)=\"onClose()\"\n      [disabled]=\"loading\"\n    />\n\n    <app-button\n      size=\"sm\"\n      variant=\"primary\"\n      [text]=\"confirmButtonText\"\n      [loadingText]=\"confirmButtonTextLoading\"\n      [loading]=\"loading\"\n      [disabled]=\"loading\"\n      (click)=\"confirmOrder()\"\n    />\n  </div>\n</app-modal>\n", styles: [".confirmation-modal{display:flex;flex-flow:column nowrap;gap:.5rem;width:100%}.confirmation-modal__description{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.confirmation-modal__item{align-items:center;color:#9ca3af;display:flex;flex-flow:row wrap;font-size:.75rem;justify-content:space-between;margin:0}.confirmation-modal__discount{text-decoration:line-through}.confirmation-modal__divider{border:none;border-top:1px solid #e5e7eb;width:100%}.confirmation-modal__price{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals{align-items:center;display:flex;flex-flow:row;justify-content:space-between;margin:0;width:100%}.confirmation-modal__totals-title{color:#4b5563;font-size:1rem;font-weight:700}.confirmation-modal__totals-discounted{align-items:flex-end;display:flex;flex-flow:column}.confirmation-modal__totals-discounted .confirmation-modal__discount{color:#9ca3af;font-size:.75rem}.confirmation-modal__actions{display:flex;flex-flow:row;gap:.5rem;justify-content:flex-end;padding-top:1rem;width:100%}\n"] }]
         }], ctorParameters: () => [{ type: ConfirmationOrderModalService }, { type: TicketSelectionDiscountService }, { type: TicketSelectionTotalsService }, { type: TicketSelectionService }, { type: PerformanceBookingDataService }], propDecorators: { modalTitle: [{
                 type: Input
             }], confirmButtonText: [{
@@ -10306,6 +10406,10 @@ class VipRechargeModalComponent {
             order_notice_accepted: [false, [Validators.requiredTrue]],
         });
         this.paymentMethodOptions = [
+            {
+                label: this.transloco.translate('order.paymentMethods.mercado_pago'),
+                value: PaymentMethod.MERCADO_PAGO,
+            },
             {
                 label: this.transloco.translate('order.paymentMethods.payroll'),
                 value: PaymentMethod.PAYROLL,
@@ -10323,7 +10427,6 @@ class VipRechargeModalComponent {
                 label: this.transloco.translate('order.paymentMethods.customer_exchange'),
                 value: PaymentMethod.CLIENT_EXCHANGE,
             },
-            { label: 'Mercado Pago', value: PaymentMethod.MERCADO_PAGO },
         ];
         this.applyPaymentMethodRestriction();
     }
@@ -10431,5 +10534,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ADMIN_API_ROUTES, ADMISSION_API_ROUTES, ALERT_ICONS, AdminSelectComponent, AdminService, AdmissionQueueService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, CITY_API_ENDPOINTS, COUNTRY_API_ENDPOINTS, CUSTOMERS_API_ROUTES, ChangePasswordFormComponent, ChangePasswordFormService, CitiesService, CitySelectComponent, ColorPickerComponent, ConfirmationOrderModalComponent, ConfirmationOrderModalService, CorporateBondStatus, CountrySelectComponent, CountryService, CouponApplicability, CouponDiscountType, CouponStatus, CreatorType, CustomerSelectComponent, CustomerService, DEFAULT_STAGE_CONFIG, DOCUMENT_TYPES_OPTIONS, DateInputComponent, DateService, DaySelectorGridComponent, DeleteConfirmationComponent, DeleteConfirmationService, DynamicTableComponent, ERROR_INPUT_CLASSES, EndDateGreaterThanStartValidator, FORM_ERROR_MESSAGES, FeedbackModalComponent, FeedbackModalService, FileType, FileUploadComponent, FileUploadPreviewComponent, FormEditorComponent, FormInputComponent, FormSelectComponent, FormTextareaComponent, GiftBondPurchaseStatus, GiftBondStatus, KONVA_SHAPE_MAPPINGS, LanguageSwitcherComponent, MembershipStatus, MinTodayValidator, MustMatchValidator, NumberInputComponent, ORDER_DISCOUNT_COLORS, ORDER_ITEM_TYPES_COLORS, ORDER_STATUS_COLORS, OrderBillingInfoComponent, OrderDiscountAppliedComponent, OrderInformationComponent, OrderItemType, OrderItemTypeBadgeComponent, OrderItemsComponent, OrderStatus, OrderStatusBadgeComponent, OrderTransactionDetailsModalComponent, OrderTransactionDetailsModalService, OrderTransactionsComponent, PAYMENT_METHODS_OPTIONS, PERFORMANCES_API_ROUTES, PERFORMANCE_STATUS_COLORS, PERFORMANCE_TICKET_STATUS_COLORS, PHONE_COUNTRIES, PRICE_ZONES_API_ROUTES, PRODUCTS_API_ROUTES, PRODUCT_CATEGORIES_API_ROUTES, PRODUCT_TAGS_API_ROUTES, PRODUCT_TYPES_API_ROUTES, PaymentMethod, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, PurchaseLimitService, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, SHOW_TYPE_COLORS, STATE_API_ENDPOINTS, SeatAvailabilitySseService, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowType, ShowTypeBadgeComponent, ShowsFilterComponent, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, TICKET_MAP_GRID_SIZE, TICKET_MAP_LAST_TICKETS_LIMIT, TICKET_MAP_TITLE_HEIGHT, TICKET_STATUS_COLORS, TICKET_STATUS_FILLS, TICKET_STATUS_LABELS, TIcketMapProductSelectionComponent, TRANSACTION_STATUS_COLORS, TextExpandableComponent, TickeraTranslocoLoader, TicketMapFloorSelectorComponent, TicketMapPriceZonesComponent, TicketMapProductSelectionItemComponent, TicketMapTotalsComponent, TicketMapWidgetComponent, TicketMapWidgetHeaderComponent, TicketMapWrapperComponent, TicketMapZoomControlsComponent, TicketMapZoomService, TicketQrComponent, TicketQrModalComponent, TicketQrModalService, TicketQrService, TicketSelectionDetailsService, TicketSelectionDiscountService, TicketSelectionService, TicketSelectionTotalsService, ToastService, ToggleSwitchComponent, TransactionStatus, VENUES_API_ROUTES, VIP_CARDS_API_ROUTES, VipBalanceCardComponent, VipCardService, VipCardStatus, VipCardStatusBadgeComponent, VipRechargeModalComponent, VipTransactionType, VipTransactionsTableComponent, ZonePriceItemComponent, ZonePriceListComponent, authInterceptor, drawChairIcon$1 as drawChairIcon, drawHappyFace, drawRoundedRect, drawWheelchairIcon, emailValidator, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, ticketCanOpenQr, tintColor, transformImageToFile, transformUrlParams };
+export { ADMIN_API_ROUTES, ADMISSION_API_ROUTES, ALERT_ICONS, AdminSelectComponent, AdminService, AdmissionQueueService, ApiService, AppAlertComponent, AppBadgeComponent, AppBreadcumbComponent, AppButtonComponent, AppLinkButtonComponent, AppModalComponent, AsyncSelectComponent, AuditInformationComponent, BASE_BUTTON_CLASSES, BASE_INPUT_CLASSES, BUTTON_SIZES_CLASSES, BUTTON_VARIANT_CLASSES, BaseModalService, BrowserZoomLockService, CITY_API_ENDPOINTS, COUNTRY_API_ENDPOINTS, CUSTOMERS_API_ROUTES, ChangePasswordFormComponent, ChangePasswordFormService, CitiesService, CitySelectComponent, ColorPickerComponent, ConfirmationOrderModalComponent, ConfirmationOrderModalService, CorporateBondStatus, CountrySelectComponent, CountryService, CouponApplicability, CouponDiscountType, CouponStatus, CreatorType, CustomerSelectComponent, CustomerService, DEFAULT_STAGE_CONFIG, DOCUMENT_TYPES_OPTIONS, DateInputComponent, DateService, DaySelectorGridComponent, DeleteConfirmationComponent, DeleteConfirmationService, DynamicTableComponent, ERROR_INPUT_CLASSES, EndDateGreaterThanStartValidator, FORM_ERROR_MESSAGES, FeedbackModalComponent, FeedbackModalService, FileType, FileUploadComponent, FileUploadPreviewComponent, FormEditorComponent, FormInputComponent, FormSelectComponent, FormTextareaComponent, GiftBondPurchaseStatus, GiftBondStatus, KONVA_SHAPE_MAPPINGS, LanguageSwitcherComponent, MembershipStatus, MinTodayValidator, MustMatchValidator, NumberInputComponent, ORDER_DISCOUNT_COLORS, ORDER_ITEM_TYPES_COLORS, ORDER_STATUS_COLORS, OrderBillingInfoComponent, OrderDiscountAppliedComponent, OrderInformationComponent, OrderItemType, OrderItemTypeBadgeComponent, OrderItemsComponent, OrderStatus, OrderStatusBadgeComponent, OrderTransactionDetailsModalComponent, OrderTransactionDetailsModalService, OrderTransactionsComponent, PAYMENT_METHODS_OPTIONS, PERFORMANCES_API_ROUTES, PERFORMANCE_STATUS_COLORS, PERFORMANCE_TICKET_STATUS_COLORS, PHONE_COUNTRIES, PRICE_ZONES_API_ROUTES, PRODUCTS_API_ROUTES, PRODUCT_CATEGORIES_API_ROUTES, PRODUCT_TAGS_API_ROUTES, PRODUCT_TYPES_API_ROUTES, PaymentMethod, PerformanceBookingDataService, PerformanceCardComponent, PerformanceCardListComponent, PerformanceMultiSelectComponent, PerformanceSelectComponent, PerformanceService, PerformanceStatus, PerformanceStatusBadgeComponent, PerformanceStepperComponent, PerformanceTicketMapComponent, PerformanceTicketStatus, PerformanceTicketStatusBadgeComponent, PerformancesListEventsService, PhoneInputComponent, PriceZoneEventService, PriceZoneFormModalService, PriceZoneSelectComponent, PriceZoneService, ProductCategoryService, ProductMultiSelectComponent, ProductSelectComponent, ProductService, ProductTagService, ProductTypeService, PurchaseLimitService, RoomMapElementOrientation, RoomMapElementType, SHOWS_API_ROUTES, SHOW_TYPE_COLORS, STATE_API_ENDPOINTS, SeatAvailabilitySseService, SeatSelectionEmptySummaryComponent, SeatSelectionSummaryComponent, SeatSelectionSummaryItemComponent, SelectedDiscountCardType, ShowCardComponent, ShowCardSkeletonComponent, ShowMultiSelectComponent, ShowSelectComponent, ShowService, ShowType, ShowTypeBadgeComponent, ShowsFilterComponent, StateSelectComponent, StatesService, TICKERA_COMPONENTS_CONFIG, TICKET_ELEMENT_TYPES, TICKET_MAP_GRID_SIZE, TICKET_MAP_LAST_TICKETS_LIMIT, TICKET_MAP_TITLE_HEIGHT, TICKET_STATUS_COLORS, TICKET_STATUS_FILLS, TICKET_STATUS_LABELS, TIcketMapProductSelectionComponent, TRANSACTION_STATUS_COLORS, TextExpandableComponent, TickeraTranslocoLoader, TicketMapFloorSelectorComponent, TicketMapPriceZonesComponent, TicketMapProductSelectionItemComponent, TicketMapTotalsComponent, TicketMapWidgetComponent, TicketMapWidgetHeaderComponent, TicketMapWrapperComponent, TicketMapZoomControlsComponent, TicketMapZoomService, TicketQrComponent, TicketQrModalComponent, TicketQrModalService, TicketQrService, TicketSelectionDetailsService, TicketSelectionDiscountService, TicketSelectionService, TicketSelectionTotalsService, ToastService, ToggleSwitchComponent, TransactionStatus, VENUES_API_ROUTES, VIP_CARDS_API_ROUTES, VipBalanceCardComponent, VipCardService, VipCardStatus, VipCardStatusBadgeComponent, VipRechargeModalComponent, VipTransactionType, VipTransactionsTableComponent, ZonePriceItemComponent, ZonePriceListComponent, authInterceptor, drawChairIcon$1 as drawChairIcon, drawHappyFace, drawRoundedRect, drawWheelchairIcon, emailValidator, findElementAtPosition, findTicketAtPosition, formatCitiesResponseToSelect, generateExitScene, generateHallwayScene, generateProductionAreaScene, generateSeatBlockScene, generateSeatBlockTicketScene, generateStageScene, generateStairScene, generateTableScene, generateTableTicketScene, generateUnavailableSpaceScene, generateZoneScene, getBrowserLanguage, getCustomerFullname, getItemTypeIcon, getOrderDiscount, getStoredLanguage, numberToLetter$1 as numberToLetter, parseJsonToFormDataAdvanced, phoneCountryFlag, processElementsToRenderData, provideTickeraComponents, resolveLanguage, setStoredLanguage, ticketCanOpenQr, tintColor, transformImageToFile, transformUrlParams };
 //# sourceMappingURL=tickera-angular-components.mjs.map