simpo-component-library 3.6.940 → 3.6.941

package/fesm2022/simpo-component-library.mjs

@@ -9835,12 +9835,14 @@ class CartComponent extends BaseSection {
         this.redemptionType = "COUPONS";
         this.redemptionCouponType = "REWARDS";
         this.couponValueType = '';
-        // "See It Live" - select which cart items to see on a video call, then merge them straight
-        // into the Video Call booking cart and continue booking. No dialog and no contact form here -
-        // contact always comes from the account at booking time, same as Try at Home / Schedule Video
-        // Call elsewhere in the app.
-        this.selectedForVideo = {};
+        // "See It Live" - "CONTINUE TO SCHEDULE" opens a side panel pre-selecting every cart item;
+        // the shopper can deselect some before confirming. Confirming merges the selected items
+        // straight into the Video Call booking cart and continues booking - no contact form here,
+        // contact always comes from the account at booking time, same as Try at Home elsewhere in
+        // the app.
         this.videoCartCount = 0;
+        this.schedulePanelOpen = false;
+        this.panelSelected = {};
         this.showReedemError = false;
         this.vaildAmount = 0;
         this.referEarnExist = false;
@@ -10552,29 +10554,53 @@ class CartComponent extends BaseSection {
             this.selectedRedmpationData = response;
         });
     }
-    isVideoSelected(item) {
-        return !!this.selectedForVideo[item.varientId];
-    }
-    toggleVideoSelection(item) {
-        this.selectedForVideo[item.varientId] = !this.selectedForVideo[item.varientId];
-    }
-    get noVideoSelection() {
-        return !Object.values(this.selectedForVideo).some((v) => v);
+    get hasCartItems() {
+        return (this.responseData?.orderedItems?.length ?? 0) > 0;
     }
     get videoSelectionLine() {
-        const count = Object.values(this.selectedForVideo).filter((v) => v).length;
-        return count === 0 ? 'Select at least one item above.' : `${count} item${count === 1 ? '' : 's'} selected`;
+        return this.hasCartItems ? 'Pick which pieces to include on the next screen.' : 'Add pieces to your cart first.';
     }
     async loadVideoCartCount() {
         const items = await this.bookingProductCartService.getItems('VIDEO_CALL');
         this.videoCartCount = items.length;
     }
-    async continueToSchedule() {
-        const selected = (this.responseData?.orderedItems ?? []).filter((item) => this.isVideoSelected(item));
+    openSchedulePanel() {
+        if (!this.hasCartItems)
+            return;
+        const sel = {};
+        (this.responseData?.orderedItems ?? []).forEach((item) => { sel[item.varientId] = true; });
+        this.panelSelected = sel;
+        this.schedulePanelOpen = true;
+    }
+    closeSchedulePanel() {
+        this.schedulePanelOpen = false;
+    }
+    isPanelSelected(item) {
+        return !!this.panelSelected[item.varientId];
+    }
+    togglePanelSelection(item) {
+        if (this.panelSelected[item.varientId])
+            delete this.panelSelected[item.varientId];
+        else
+            this.panelSelected[item.varientId] = true;
+    }
+    get panelSelectedCount() {
+        return Object.keys(this.panelSelected).length;
+    }
+    get panelInvalid() {
+        return this.panelSelectedCount === 0;
+    }
+    get panelSelectionLine() {
+        const count = this.panelSelectedCount;
+        return count === 0 ? 'Select at least one item.' : `${count} item${count === 1 ? '' : 's'} selected`;
+    }
+    async confirmSchedulePanel() {
+        const selected = (this.responseData?.orderedItems ?? []).filter((item) => this.isPanelSelected(item));
         if (selected.length === 0)
             return;
         await Promise.all(selected.map((item) => this.bookingProductCartService.addOrderedItem('VIDEO_CALL', item)));
-        this.selectedForVideo = {};
+        this.schedulePanelOpen = false;
+        this.panelSelected = {};
         await this.loadVideoCartCount();
         if (!this.storageService.getUser()) {
             this.router.navigate(['/login'], { queryParams: { tryAtHome: true, mode: 'VIDEO_CALL' } });
@@ -10746,7 +10772,7 @@ class CartComponent extends BaseSection {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CartComponent, deps: [{ token: EventsService }, { token: CartService }, { token: i2$2.Router }, { token: RestService }, { token: i3$2.MatDialog }, { token: StorageServiceService }, { token: i6$1.MessageService }, { token: i8$1.MatBottomSheet }, { token: i2$2.ActivatedRoute }, { token: BookingProductCartService }, { token: MAT_DIALOG_DATA, optional: true }, { token: i3$2.MatDialogRef, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CartComponent, isStandalone: true, selector: "simpo-cart", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete", customClass: "customClass" }, providers: [MessageService], viewQueries: [{ propertyName: "d2", first: true, predicate: ["d2"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isLoading\">\r\n  <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n    [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n  <ng-container *ngIf=\"data\">\r\n    <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n      [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n      (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n      [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n      <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n        [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n        *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n        <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline isActive\">Address</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n      </div>\r\n      <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n        <!-- && ecomConfigs?.appointmentBookingEnabled\" -->\r\n        <div class=\"cart-tabs\" [id]=\"data?.id\">\r\n          <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n            (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n          <div [ngClass]=\"{'selected-cart-tab': cartType==='BOOKING'}\" (click)=\"cartType='BOOKING'\">Booking Cart\r\n            ({{getTotalBookingItems}})</div>\r\n        </div>\r\n      </div>\r\n      <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n        [simpoAnimation]=\"styles?.animation\">\r\n        <ng-container>\r\n          <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n            <ng-container\r\n              *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"cartType === 'BOOKING'\">\r\n            <div class=\"w-100\">\r\n              <simpo-booking-cart-groups></simpo-booking-cart-groups>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"d-flex checkoutPage\"\r\n        *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n        <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n        </ng-container>\r\n      </div>\r\n\r\n\r\n      <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n        <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n          [isEcommerce]=\"true\"></simpo-hover-elements>\r\n      </div>\r\n      <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n        <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n      </div>\r\n\r\n    </section>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!data\">\r\n    <section class=\"cart-window\">\r\n      <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n        <div class=\"d-flex align-items-center\">\r\n          <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n          <span>Your Cart</span>\r\n        </div>\r\n        <div class=\"saving\"></div>\r\n      </div>\r\n      <div class=\"offers\">\r\n        <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n          <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n          <span>Avail Offers / Coupons</span>\r\n        </div>\r\n        <mat-icon>keyboard_arrow_right</mat-icon>\r\n      </div>\r\n      <div class=\"small-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n          <div class=\"small-item\">\r\n            <div class=\"d-flex\" style=\"gap: 5px;\">\r\n              <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n                  class=\"small-product-img\"\r\n                  [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n                  (click)=\"goToProductDetails(item)\">\r\n              </div>\r\n              <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n              <div class=\"small-item-quantity\">\r\n                <span class=\"cursor\">-</span>\r\n                <span>{{item.quantity}}</span>\r\n                <span class=\"cursor\">+</span>\r\n              </div>\r\n              <div class=\"small-item-price\">\r\n                <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.sellingPrice) | number: '1.0-2'}}\r\n                </div>\r\n                <!-- <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n                </div> -->\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"fotter-sec\">\r\n        <div class=\"delivery-add d-flex\">\r\n          <mat-icon>home</mat-icon>\r\n          <div class=\"address\">Tetsting</div>\r\n        </div>\r\n        <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n            style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n          {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n      </div>\r\n    </section>\r\n  </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n  width: '100%',\r\n  height: '40vh',\r\n  'border-radius': '10px',\r\n  'position': 'relative',\r\n  'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n  <section class=\"coupons-listing-section\">\r\n    <div class=\"coupon-heading\">\r\n      <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Apply Coupon</div>\r\n    </div>\r\n    <!-- <div class=\"coupon-search-sec\">\r\n      <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n      <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n    </div> -->\r\n    <div class=\"coupon-listing\">\r\n      <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n          <div class=\"coupon-details\"\r\n            [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\"\r\n            *ngIf=\"couponDetails?.status\">\r\n            <div class=\"details__coupon-heading\">\r\n              <div class=\"coupon-brief\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}</div>\r\n                  <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n                </div>\r\n              </div>\r\n              <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n                <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n                <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n              </div> -->\r\n            </div>\r\n            <ng-container>\r\n              <!-- *ngIf=\"couponDetails.status\" -->\r\n              <div class=\"details-divider\"></div>\r\n              <ul class=\"details__coupon-terms\">\r\n                <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n              </ul>\r\n            </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #RedemptionVouchers>\r\n  <section class=\"vouchers-listing-section d-flex flex-column\">\r\n    <div class=\"coupon-heading d-flex align-items-center gap-2 p-3 fs-18 fw-600 border-bottom\">\r\n      <div class=\"back-btn cursor-pointer d-flex align-items-center\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Coupons & Vouchers</div>\r\n    </div>\r\n\r\n    <!-- <div class=\"d-flex align-items-center tab-container justify-content-between gap-2 p-3\">\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'COUPONS'}\"\r\n        (click)=\"redemptionType = 'COUPONS'\">\r\n        Coupons\r\n      </div>\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'VOUCHERS'}\"\r\n        (click)=\"redemptionType = 'VOUCHERS'\">\r\n        Vouchers\r\n      </div>\r\n    </div> -->\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3 pt-3\" *ngIf=\"redemptionType === 'COUPONS'\">\r\n      <div class=\"d-flex align-items-center tab-container gap-3\">\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'REWARDS'}\" (click)=\"redemptionCouponType = 'REWARDS'\">\r\n          Rewards\r\n        </div>\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'DISCOUNTS'}\"\r\n          (click)=\"redemptionCouponType = 'DISCOUNTS'\">\r\n          Discounts\r\n        </div>\r\n      </div>\r\n      <ng-container *ngIf=\"redemptionCouponType === 'REWARDS'\">\r\n        <ng-container *ngIf=\"(listRedemptionCoupons?.vouchers?.length > 0) ; else showEmptyScreen\">\r\n          <ng-container *ngFor=\"let voucher of listRedemptionCoupons?.vouchers; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%'\r\n                    }}\r\n                    off on your payment\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">\r\n                    Apply</div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n                <span class=\"separator text-secondary\">|</span>\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n                </span>\r\n                <span class=\"separator text-secondary\" *ngIf=\"voucher.maxRedeemableAmount\">|</span>\r\n                <span class=\"min-order\" *ngIf=\"voucher.maxRedeemableAmount\">Max Redeemable Amount: \u20B9{{\r\n                  voucher.maxRedeemableAmount | number }}</span>\r\n              </div>\r\n\r\n              <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"redemptionCouponType === 'DISCOUNTS'\">\r\n        <ng-container *ngIf=\"(couponList.length > 0); else showEmptyDiscounts\">\r\n          <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"couponDetails?.status\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\"\r\n                    [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}\r\n                  </div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    {{ couponDetails.discountDescription | titlecase }}\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\"\r\n                    [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : 'not-allowed'}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">\r\n                    Apply\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ couponDetails.couponCode | uppercase }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}\r\n                </span>\r\n              </div>\r\n\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyDiscounts>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Discount Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no discount coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no coupons</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3\" *ngIf=\"redemptionType === 'VOUCHERS'\">\r\n      <ng-container *ngIf=\"listRedemptionVouchers?.vouchers?.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let voucher of listRedemptionVouchers?.vouchers; let idx = index\">\r\n          <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n            <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n              <div class=\"coupon-brief__left-sec\">\r\n                <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                <div class=\"coupon-desc fs-12 text-secondary\">\r\n                  Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%' }}\r\n                  off on your payment\r\n                </div>\r\n              </div>\r\n              <div class=\"coupon-brief__right-sec\">\r\n                <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">Apply\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n              <div class=\"code-label\">Code</div>\r\n              <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n            </div>\r\n\r\n            <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n              <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n              <span class=\"separator text-secondary\">|</span>\r\n              <span class=\"validity\">\r\n                <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n              </span>\r\n            </div>\r\n\r\n            <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Vouchers Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no vouchers</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n  <div class=\"container\">\r\n    <div class=\"main-content\">\r\n      <div class=\"cart-items\">\r\n        <div class=\"cart-header\">\r\n          <h2>Your Cart</h2>\r\n        </div>\r\n        <ng-container\r\n          *ngTemplateOutlet=\"CARTITEM;context:{data: responseData?.orderedItems}\"></ng-container>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"sidebar\">\r\n      <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"getUrl()\">\r\n        <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n          <div class=\"toogle-switch\">\r\n            <div class=\"form-check form-switch\">\r\n              <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n                [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <!-- <div class=\"select_matured_text  w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n          Select Matured Scheme\r\n        </div> -->\r\n        <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectedRedemption\">\r\n          Selected Scheme\r\n          <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n            scheme-5000/M <span>Change</span></div>\r\n          <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n            <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n          </div>\r\n        </div> -->\r\n      </div>\r\n      <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n        <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n      </div>\r\n      <div class=\"coupon-section\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && !referEarnExist\">\r\n        <div class=\"coupon-left\">\r\n          <div class=\"coupon-icon\"><mat-icon>percent</mat-icon></div>\r\n          <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply\r\n            Coupon</span>\r\n          <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon\r\n            Applied</span>\r\n        </div>\r\n        <svg *ngIf=\"!responseData.billdetails?.couponId\" xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\"\r\n          viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\"\r\n          stroke-linejoin=\"round\" class=\"chevron-icon\" (click)=\"openDialog(CouponList)\">\r\n          <path d=\"m9 18 6-6-6-6\" />\r\n        </svg>\r\n        <span *ngIf=\"responseData.billdetails?.couponId\"\r\n          (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n      </div>\r\n\r\n      <div class=\"promo-banner mb-3\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\">\r\n        <div class=\"promo-banner-row\">\r\n          <div class=\"promo-text\">\r\n            <h3>See It Before You Buy It</h3>\r\n            <p>Experience our designs in detail via video call</p>\r\n          </div>\r\n          <button class=\"see-live-btn\" [disabled]=\"noVideoSelection\" (click)=\"continueToSchedule()\">\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n              stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n              class=\"lucide lucide-video\">\r\n              <path d=\"m22 8-6 4 6 4V8Z\" />\r\n              <rect width=\"14\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\" ry=\"2\" />\r\n            </svg>\r\n            CONTINUE TO SCHEDULE\r\n          </button>\r\n        </div>\r\n        <div class=\"video-selection-line\">{{videoSelectionLine}}</div>\r\n        <a class=\"video-cart-hint\" *ngIf=\"videoCartCount > 0\" (click)=\"viewPendingVideoCart()\">{{videoCartCount}}\r\n          item{{videoCartCount === 1 ? '' : 's'}} waiting in your Video Call cart \u2014 view it</a>\r\n      </div>\r\n\r\n      <div class=\"plan-details-container p-3 rounded-4 bg-white text-dark voucher-details\"\r\n        *ngIf=\"referEarnExist && this?.redemptionPoints?.availablePoints > 0\">\r\n        <div class=\"fs-14 fw-500\">\r\n          Rewards Available\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-start border-bottom pb-2\">\r\n          <div class=\"avb_pts mt-2 mb-2\">\r\n            <span class=\"fs-16 fw-500 total_points text-secondary\">\r\n              <span class=\" fs-18 fw-600 text-dark\">{{(this?.redemptionPoints?.availablePoints || 0).toFixed(2)}}</span>\r\n              pts\r\n            </span>\r\n            <div class=\"total_value fs-12 text-secondary\">\r\n              = max \u20B9{{(this?.redemptionPoints?.pointsConvertedRupees || 0).toFixed(2)}} discount\r\n            </div>\r\n          </div>\r\n          <div class=\"wallte_icon\">\r\n            <img src=\"https://d2z9497xp8xb12.cloudfront.net/prod-images/777779c1775200561187wallet_(1).png\" alt=\"\">\r\n          </div>\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n          <div class=\"redemable_text\">\r\n            <div class=\"title_text\">\r\n              <div class=\"fs-14 fw-500\">\r\n                Redeem Points\r\n              </div>\r\n              <div class=\"fs-13 fs-400\">\r\n                Use your points for discount\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <div class=\"toggle_btn\">\r\n            <label class=\"switch\">\r\n              <input type=\"checkbox\" id=\"toggleSwitch\" [checked]=\"isPointsRedeeming\"\r\n                (click)=\"onPointsRedeemingChange($event)\" />\r\n              <span class=\"slider\"></span>\r\n            </label>\r\n          </div>\r\n        </div>\r\n        <div class=\"mt-3 success_selected w-100 applied-coupon-card\" *ngIf=\"isPointsRedeeming\">\r\n          <div class=\"d-flex align-items-start gap-2\">\r\n            <div class=\"success_icon\">\r\n              <mat-icon class=\"d-flex justify-content-center align-items-center text-success\">check_circle</mat-icon>\r\n            </div>\r\n            <div class=\"success_text\">\r\n              <div class=\"fs-13 fw-500\">\r\n                You're saving \u20B9\r\n                {{totalSavingAmt || 0}}\r\n              </div>\r\n              <div class=\"fs-12 fs-400 text-success\">\r\n                {{totalSavingPoints}} points remaining after redemption\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- Existing coupon row (keep as-is) -->\r\n      <div class=\"coupon-section d-flex flex-column voucher-details\" [id]=\"data?.id\"\r\n        *ngIf=\"cartType === 'SHOPPING' && referEarnExist\">\r\n        <div class=\"d-flex justify-content-between align-items-center w-100\">\r\n          <div class=\"coupon-left\">\r\n            Apply Coupon\r\n          </div>\r\n          <div (click)=\"addRedemptionCoupon(RedemptionVouchers)\">View All</div>\r\n        </div>\r\n\r\n        <!-- Applied Coupon Success Banner -->\r\n        <div class=\"applied-coupon-card w-100 mt-3 d-flex align-items-center justify-content-between\"\r\n          *ngIf=\"selectedVoucherId\">\r\n          <div class=\"applied-coupon-left d-flex align-items-center gap-3\">\r\n            <mat-icon class=\"success-check\">check_circle</mat-icon>\r\n            <div class=\"applied-coupon-info\">\r\n              <div class=\"applied-coupon-code\">Coupon {{ selectedVoucherCode }} applied!</div>\r\n              <div class=\"applied-coupon-saving\">You're saving\r\n                <span *ngIf=\"this.couponValueType === 'AMOUNT'\">\u20B9 {{selectedVoucherAmount || 0}}</span>\r\n                <span *ngIf=\"this.couponValueType === 'PERCENTAGE'\"> {{selectedVoucherPercentage || 0}}%</span>\r\n              </div>\r\n\r\n            </div>\r\n          </div>\r\n          <div class=\"remove-coupon-btn fs-14 fw-500 text-secondary cursor-pointer\"\r\n            (click)=\"removeRedemptionCoupon($event)\">Remove</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n        <div class=\"delivery-header\">\r\n          <mat-icon>gps_fixed</mat-icon>\r\n          <span>Delivering to</span>\r\n          <span class=\"pincode\">{{pincode}}</span>\r\n          <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"summary-section\">\r\n        <div class=\"summary-title\">Summary</div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Subtotal</span>\r\n          <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalNetValue ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && referEarnExist && isPointsRedeeming\">\r\n          <span class=\"summary-label\">Points Redeemed</span>\r\n          <span class=\"summary-value\">- \u20B9{{ totalSavingAmt || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'AMOUNT' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ selectedVoucherAmount || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'PERCENTAGE' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ percentageReduced || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount\">\r\n          <span class=\"summary-label\">Discount Amount</span>\r\n          <span class=\"summary-value\">\r\n            {{('\u20B9' + (responseData?.billdetails?.discountAmount | number: '1.0-2')) }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Shipping</span>\r\n          <span class=\"summary-value\"\r\n            [ngClass]=\"{'savings': !responseData?.billdetails?.deliveryCharges || responseData.billdetails.deliveryCharges <= 0}\">\r\n            {{ (responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0) ? ('\u20B9' +\r\n            (responseData.billdetails.deliveryCharges | number: '1.0-2')) : 'Free' }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Estimated Tax</span>\r\n          <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Total</span>\r\n          <!-- <span class=\"summary-value\">\u20B9{{ responseData?.totalAmount | number: '1.0-2' }}</span> -->\r\n          <span class=\"total-value\" *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{ responseData?.totalAmount |\r\n            number: '1.0-2' }}</span>\r\n\r\n          <span class=\"total-value\" *ngIf=\"isPointsRedeeming\">\u20B9{{ (responseData?.totalAmount - (totalSavingAmt || 0)) |\r\n            number: '1.0-2' }}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (percentageReduced || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n      <button class=\"place-order-btn\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n      <button class=\"place-order-btn mt-0\" (click)=\"edit ? '' : proceedToCheckout()\" simpoButtonDirective\r\n        *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n        Cart'}}</button>\r\n\r\n    </div>\r\n  </div>\r\n  <!-- <ng-container *ngIf=\"recommededData?.length\">\r\n    <simpo-featured-products [edit]=\"false\" [data]=\"featureProductData\"\r\n      [responseData]=\"recommededData\"></simpo-featured-products>\r\n  </ng-container> -->\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n  <div class=\"checkout-left-panel\">\r\n    <div class=\"checkout-main-content\">\r\n      <!-- <div class=\"delivery-options\">\r\n        <div class=\"delivery-option active\">\r\n          <div class=\"delivery-icon\"></div>\r\n          HOME DELIVERY\r\n        </div>\r\n        <div class=\"delivery-option\">\r\n          <div class=\"delivery-icon\"></div>\r\n          STORE PICK-UP\r\n        </div>\r\n      </div> -->\r\n\r\n      <div class=\"section-title\">Shipping Address</div>\r\n\r\n      <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n        <div class=\"address-info\">\r\n          <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n          <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n            {{defaultAddress?.stateName}}</div>\r\n          <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n        <mat-icon>add</mat-icon>\r\n      </div>\r\n\r\n      <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n      <button class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective\r\n        *ngIf=\"defaultAddress && !placeOrderLoader\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">\r\n        Place Order\r\n      </button>\r\n      <button class=\"btn w-100 mt-1 payment-btn\" simpoButtonDirective *ngIf=\"defaultAddress && placeOrderLoader\"\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\">\r\n        Loading...\r\n      </button>\r\n\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"checkout-right-panel\">\r\n    <div class=\"order-summary\">\r\n      <div class=\"summary-title\">Order Summary</div>\r\n\r\n      <div class=\"checkout-product\">\r\n        <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n            alt=\"\">\r\n          <div class=\"product-details\">\r\n            <div class=\"product-name\">{{item.itemName}}</div>\r\n            <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n            <div class=\"product-price\">\u20B9{{(item.sellingPrice * item.quantity) | number: '1.0-2'}}</div>\r\n          </div>\r\n        </div>\r\n\r\n      </div>\r\n\r\n      <div class=\"price-breakdown\">\r\n        <div class=\"price-row\">\r\n          <span>Total Price</span>\r\n          <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n            ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\">\r\n          <span>Total Tax</span>\r\n          <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n          <span class=\"summary-label\">Redeem Amount</span>\r\n          <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"price-row discount\" *ngIf=\"responseData?.billdetails?.discountAmount && !isJewellery\">\r\n          <span>Coupon Discount</span>\r\n          <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n            | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <span>Delivery Charge</span>\r\n          <span>{{responseData.billdetails.deliveryCharges\r\n            |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row total\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span>TOTAL AMOUNT</span>\r\n          <span *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{(responseData?.totalAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"isPointsRedeeming\">\u20B9{{(responseData?.totalAmount - (totalSavingAmt || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (responseData?.totalAmount * (selectedVoucherPercentage / 100) || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n  <div class=\"cart-item\" *ngFor=\"let item of products\" [style.color]=\"fontColor\">\r\n    <div class=\"item-left\">\r\n      <button type=\"button\" class=\"video-select-checkbox\" *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\"\r\n        [class.checked]=\"isVideoSelected(item)\" (click)=\"toggleVideoSelection(item)\">\r\n        <mat-icon *ngIf=\"isVideoSelected(item)\">check</mat-icon>\r\n      </button>\r\n      <div class=\"item-image\">\r\n        <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n          (click)=\"goToProductDetails(item)\" style=\"cursor: pointer;\">\r\n      </div>\r\n      <div class=\"item-details\">\r\n        <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n        <div class=\"item-subtitle\" *ngIf=\"item.itemVariant\">\r\n          <span *ngFor=\"let varient of getKeys(item.itemVariant.properties); let last = last\">\r\n            {{ item.itemVariant.properties[varient] | titlecase }}<span *ngIf=\"!last\">, </span>\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"item-right\">\r\n      <div class=\"quantity-control\" *ngIf=\"cartType === 'SHOPPING'\">\r\n        <button class=\"qty-btn px-2\" (click)=\"decreaseQty(item)\" [disabled]=\"item.quantity === 1\">\r\n          <mat-icon>remove</mat-icon>\r\n        </button>\r\n        <span class=\"qty-value px-3\">{{item.quantity}}</span>\r\n        <button class=\"qty-btn px-2\" (click)=\"increaseQty(item)\">\r\n          <mat-icon>add</mat-icon>\r\n        </button>\r\n      </div>\r\n\r\n      <div class=\"item-price\">\r\n        \u20B9{{item.sellingPrice | number: '1.0-2'}}\r\n      </div>\r\n\r\n      <div class=\"delete-btn-circle\" (click)=\"removeItem(item)\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\r\n          stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-trash-2\">\r\n          <path d=\"M3 6h18\" />\r\n          <path d=\"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6\" />\r\n          <path d=\"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2\" />\r\n          <line x1=\"10\" x2=\"10\" y1=\"11\" y2=\"17\" />\r\n          <line x1=\"14\" x2=\"14\" y1=\"11\" y2=\"17\" />\r\n        </svg>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n  <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n    <div class=\"empty-cart-container d-flex flex-column\">\r\n      <div class=\"cart-image\">\r\n        <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n          [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n          [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n      </div>\r\n      <div class=\"cart-text content-side\">\r\n        <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n          <div class=\"d-flex justify-content-center\"\r\n            [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n            <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\" [isRTE]=\"text.isRTE\"></simpo-text-editor>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <button class=\"place-order-btn mx-auto w-fit\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n  <div class=\"modal-body\">\r\n    <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n      [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n      <label for=\"individual\" class=\"scheme-card\">\r\n        <div class=\"scheme-info d-flex gap-1\">\r\n          <div class=\"form-check-radio\">\r\n            <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n          </div>\r\n          <div class=\"right-side\">\r\n            <div class=\"scheme-name\">\r\n              <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n              <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n            </div>\r\n            <div class=\"scheme-details\">\r\n              <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n              <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n            </div>\r\n            <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n          </div>\r\n        </div>\r\n      </label>\r\n    </div>\r\n    <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n      Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n    </div>\r\n  </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{background:#fff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.cart-header{padding:16px 24px;border-bottom:1px solid #e2e8f0;background:#f8fafc}.cart-header h2{margin:0;font-size:18px;font-weight:500;color:#0f172a}.cart-item{display:flex!important;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0;gap:20px;padding:0 8px;transition:background .2s}.cart-item:hover{background:#fbfcfe}.item-left{display:flex;align-items:center;flex:1}.item-right{display:flex;align-items:center;padding:15px;gap:32px}.item-image img{width:64px;height:64px;border-radius:12px;object-fit:cover;border:1px solid #f1f5f9}.item-details{display:flex;flex-direction:column;gap:4px}.item-title{margin:0;font-size:15px;font-weight:600;color:#0f172a;line-height:1.4}.item-subtitle{font-size:13px;color:#64748b;font-weight:400}.quantity-control{display:flex;align-items:center;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden;height:38px;background:#fff;width:fit-content}.qty-btn{width:38px;height:100%;border:none;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#475569;transition:all .2s ease}.qty-btn:hover{background:#f8fafc;color:#0f172a}.qty-btn mat-icon{font-size:16px;width:16px;height:16px;display:flex;align-items:center;justify-content:center}.qty-value{width:32px;height:100%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;color:#0f172a;border-left:1.5px solid #e2e8f0;border-right:1.5px solid #e2e8f0}.item-price{font-size:18px;font-weight:700;color:#0f172a;min-width:60px;text-align:right;letter-spacing:-.01em}.delete-btn-circle{width:36px;height:36px;border-radius:50%;border:1px solid #fee2e2;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ef4444;transition:all .2s ease}.delete-btn-circle:hover{background:#fef2f2;border-color:#fecaca;transform:scale(1.05);color:#dc2626}.delete-btn-circle svg{width:18px;height:18px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;width:100%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.fs-12{font-size:12px}.fs-18{font-size:18px}.b-1-b{border-width:0px 1px;border-style:solid;border-color:#000}.container{max-width:unset;padding:24px;display:flex;gap:24px;width:100%!important}.main-content{background:#fff;border-radius:12px;width:70%}.promo-banner{padding:16px 20px;display:flex;flex-direction:column;gap:10px;border-radius:8px;border:1px solid #e2e8f0}.promo-banner-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.promo-text h3{font-size:16px!important;font-weight:500;margin-bottom:4px}.promo-text p{font-size:.9rem!important;margin-bottom:0!important;color:#64748b}.see-live-btn{background:#fff;border:1px solid #e2e8f0;font-weight:600;color:#000;padding:8px 16px;border-radius:8px;font-size:12px!important;cursor:pointer;display:flex;align-items:center;gap:8px;width:max-content!important;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.see-live-btn:hover{background:#f8fafc;border-color:#cbd5e1;transform:translateY(-1px)}.see-live-btn:disabled{color:#94a3b8;cursor:not-allowed;box-shadow:none}.see-live-btn:disabled:hover{background:#fff;border-color:#e2e8f0;transform:none}.see-live-btn svg{color:#6366f1}.video-selection-line{font-size:.8rem;color:#64748b}.video-cart-hint{font-size:.8rem;color:#6366f1;cursor:pointer;text-decoration:underline;width:max-content}.video-select-checkbox{width:20px;height:20px;flex:none;border:1.5px solid #cbd5e1;border-radius:5px;background:#fff;cursor:pointer;display:grid;place-items:center;padding:0;margin-right:10px}.video-select-checkbox.checked{background:#6366f1;border-color:#6366f1}.video-select-checkbox mat-icon{color:#fff!important;font-size:14px!important;height:14px!important;width:14px!important}.cart-item{display:flex;gap:16px;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:15%;height:100px;border-radius:8px;object-fit:cover;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-weight:500;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px}.current-price{font-size:1rem;font-weight:600}.original-price{font-size:1rem;text-decoration:line-through}.discount{background:#fef3c7;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:32%}.coupon-section{border-radius:8px;padding:10px 15px;border:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all .2s ease}.coupon-section:hover{border-color:#cbd5e1;background-color:#f8fafc}.chevron-icon{color:#94a3b8;transition:transform .2s ease}.coupon-section:hover .chevron-icon{transform:translate(2px);color:#64748b}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.coupon-icon mat-icon{font-size:17px;width:17px!important;height:19px!important}.coupon-text{font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:8px;padding:20px;border:1px solid #e2e8f0}.summary-title{font-size:16px;font-weight:700;color:#0f172a;margin-bottom:20px;letter-spacing:-.01em}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.summary-row:last-child{margin-bottom:0}.summary-label{font-size:14px;font-weight:400;color:#64748b}.summary-value{font-size:14px;font-weight:500;color:#0f172a}.summary-divider{height:1px;background:#f1f5f9;margin:16px 0;width:100%}.total-row .summary-label{font-size:16px;font-weight:600;color:#0f172a}.total-row .summary-value{font-size:16px;font-weight:700;color:#0f172a}.total-row{border-top:1px solid #e2e8f0;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px}.total-value{font-weight:700;font-size:18px}.place-order-btn{background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;align-items:center;width:max-content;border-radius:8px;border:1px solid #e2e8f0}.cart-tabs div{padding:7px 10px;cursor:pointer;font-size:14px}.selected-cart-tab{margin:6px;background:#f1f5f9;border-radius:5px;color:#000!important;font-weight:500}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.cart-item{flex-direction:column!important;align-items:flex-start!important;padding:16px 12px!important;gap:16px!important}.item-left{width:100%!important;gap:16px!important;align-items:flex-start!important}.item-image{width:86px!important;height:86px!important;flex-shrink:0!important}.item-right{width:100%!important;justify-content:space-between!important;padding:0!important;gap:12px!important;margin-top:4px!important}.item-price{flex:1!important;text-align:right!important;margin-right:8px!important;font-size:16px!important}.item-title{font-size:14px!important;-webkit-line-clamp:2!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.quantity-control{height:34px!important}.qty-btn{width:34px!important}.qty-value{width:28px!important;font-size:13px!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}.vouchers-listing-section{min-width:unset!important;width:100vw!important}.separator{display:none!important}.coupon-meta{display:grid!important;grid-template-columns:1fr 1fr!important}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.w-fit{width:fit-content!important}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}.add-to-cart-parent{width:max-content;border:1px solid #000000;border-radius:8px}.cursor{cursor:pointer}.cart-text{max-width:600px;margin:0 auto;text-align:center}.cart-text div{word-break:break-word;overflow-wrap:break-word;white-space:normal}.switch{position:relative;display:inline-block;width:45px;height:20px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.4s;border-radius:34px}.slider:before{position:absolute;content:\"\";height:16px;width:16px;left:3px;bottom:2px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#4caf50}input:checked+.slider:before{transform:translate(24px)}.vouchers-listing-section{position:relative;width:fit-content;min-width:500px;z-index:100;background:#fff;height:100vh}.vouchers-listing-section .coupon-heading{border-bottom:1px solid #eee}.vouchers-listing-section .coupon-listing{padding:12px 16px;overflow-y:auto;height:calc(97vh - 100px)}.voucher-details{background:#fff;border-radius:12px;padding:14px;box-shadow:0 1px 4px #00000042}.voucher-details .coupon-brief .apply-offer-btn{background:#111;color:#fff;border-radius:10px;padding:6px 16px}.voucher-details .coupon-code-box{border:1.5px dashed #bbb;border-radius:8px;padding:8px 12px;margin-bottom:10px}.voucher-details .coupon-code-box .code-label{font-size:11px;color:#888;margin-bottom:2px}.voucher-details .coupon-code-box .code-row .code-value{font-weight:700;font-size:15px;letter-spacing:1px}.voucher-details .coupon-meta .clock-icon{font-size:14px;height:14px;width:14px;vertical-align:middle}.applied-coupon-card{background:#f0fff8;border-radius:12px;padding:12px 16px}.applied-coupon-card .applied-coupon-left .success-check{color:#22c55e;font-size:22px}.applied-coupon-card .applied-coupon-left .applied-coupon-code{font-weight:700;font-size:14px}.applied-coupon-card .applied-coupon-left .applied-coupon-saving{font-size:13px;color:#097d5f;margin-top:2px}.active-type{background:#111!important;color:#fff!important}.redemption-type{text-align:center;border-radius:10px;padding:6px 16px;background:#d3d3d36b;width:-webkit-fill-available!important}.wallte_icon{background:#000;border-radius:50px;padding:5px 9px 7px}.wallte_icon img{width:18px;height:18px}.fw-600{font-weight:600}.coupon-type{width:fit-content!important;border-radius:26px!important;background:transparent!important;border:1px solid #afafaf;color:#393838;text-align:center;padding:6px 16px}.active-coupon{background:transparent!important;border:2px solid black!important;color:#000!important}.my-close-btn{position:absolute!important;top:10px!important;right:10px!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i3.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i3.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "component", type: i7.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "ngmodule", type: MatBottomSheetModule }, { kind: "directive", type: 
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CartComponent, isStandalone: true, selector: "simpo-cart", inputs: { data: "data", responseData: "responseData", index: "index", edit: "edit", delete: "delete", customClass: "customClass" }, providers: [MessageService], viewQueries: [{ propertyName: "d2", first: true, predicate: ["d2"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isLoading\">\r\n  <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n    [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n  <ng-container *ngIf=\"data\">\r\n    <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n      [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n      (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n      [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n      <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n        [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n        *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n        <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline isActive\">Address</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n      </div>\r\n      <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n        <!-- && ecomConfigs?.appointmentBookingEnabled\" -->\r\n        <div class=\"cart-tabs\" [id]=\"data?.id\">\r\n          <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n            (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n          <div [ngClass]=\"{'selected-cart-tab': cartType==='BOOKING'}\" (click)=\"cartType='BOOKING'\">Booking Cart\r\n            ({{getTotalBookingItems}})</div>\r\n        </div>\r\n      </div>\r\n      <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n        [simpoAnimation]=\"styles?.animation\">\r\n        <ng-container>\r\n          <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n            <ng-container\r\n              *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"cartType === 'BOOKING'\">\r\n            <div class=\"w-100\">\r\n              <simpo-booking-cart-groups></simpo-booking-cart-groups>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"d-flex checkoutPage\"\r\n        *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n        <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n        </ng-container>\r\n      </div>\r\n\r\n\r\n      <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n        <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n          [isEcommerce]=\"true\"></simpo-hover-elements>\r\n      </div>\r\n      <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n        <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n      </div>\r\n\r\n    </section>\r\n\r\n    <div class=\"schedule-panel-overlay\" *ngIf=\"schedulePanelOpen\">\r\n      <button type=\"button\" class=\"schedule-panel-backdrop\" (click)=\"closeSchedulePanel()\"></button>\r\n      <div class=\"schedule-panel\">\r\n        <div class=\"schedule-panel-header\">\r\n          <div>\r\n            <div class=\"schedule-panel-title\">Schedule a Video Call</div>\r\n            <div class=\"schedule-panel-subtitle\">Choose which pieces to include</div>\r\n          </div>\r\n          <button type=\"button\" class=\"schedule-panel-close\" (click)=\"closeSchedulePanel()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n        <div class=\"schedule-panel-body\">\r\n          <button type=\"button\" class=\"schedule-panel-row\" *ngFor=\"let item of responseData?.orderedItems\"\r\n            [class.selected]=\"isPanelSelected(item)\" (click)=\"togglePanelSelection(item)\">\r\n            <div class=\"schedule-panel-checkbox\" [class.checked]=\"isPanelSelected(item)\">\r\n              <mat-icon *ngIf=\"isPanelSelected(item)\">check</mat-icon>\r\n            </div>\r\n            <img class=\"schedule-panel-thumb\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\">\r\n            <div class=\"schedule-panel-info\">\r\n              <div class=\"schedule-panel-name\">{{item.itemName}}</div>\r\n            </div>\r\n          </button>\r\n        </div>\r\n        <div class=\"schedule-panel-footer\">\r\n          <div class=\"schedule-panel-selection-line\">{{panelSelectionLine}}</div>\r\n          <button type=\"button\" class=\"schedule-panel-cta\" [disabled]=\"panelInvalid\" (click)=\"confirmSchedulePanel()\">Continue</button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!data\">\r\n    <section class=\"cart-window\">\r\n      <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n        <div class=\"d-flex align-items-center\">\r\n          <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n          <span>Your Cart</span>\r\n        </div>\r\n        <div class=\"saving\"></div>\r\n      </div>\r\n      <div class=\"offers\">\r\n        <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n          <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n          <span>Avail Offers / Coupons</span>\r\n        </div>\r\n        <mat-icon>keyboard_arrow_right</mat-icon>\r\n      </div>\r\n      <div class=\"small-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n          <div class=\"small-item\">\r\n            <div class=\"d-flex\" style=\"gap: 5px;\">\r\n              <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n                  class=\"small-product-img\"\r\n                  [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n                  (click)=\"goToProductDetails(item)\">\r\n              </div>\r\n              <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n              <div class=\"small-item-quantity\">\r\n                <span class=\"cursor\">-</span>\r\n                <span>{{item.quantity}}</span>\r\n                <span class=\"cursor\">+</span>\r\n              </div>\r\n              <div class=\"small-item-price\">\r\n                <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.sellingPrice) | number: '1.0-2'}}\r\n                </div>\r\n                <!-- <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n                </div> -->\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"fotter-sec\">\r\n        <div class=\"delivery-add d-flex\">\r\n          <mat-icon>home</mat-icon>\r\n          <div class=\"address\">Tetsting</div>\r\n        </div>\r\n        <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n            style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n          {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n      </div>\r\n    </section>\r\n  </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n  width: '100%',\r\n  height: '40vh',\r\n  'border-radius': '10px',\r\n  'position': 'relative',\r\n  'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n  <section class=\"coupons-listing-section\">\r\n    <div class=\"coupon-heading\">\r\n      <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Apply Coupon</div>\r\n    </div>\r\n    <!-- <div class=\"coupon-search-sec\">\r\n      <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n      <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n    </div> -->\r\n    <div class=\"coupon-listing\">\r\n      <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n          <div class=\"coupon-details\"\r\n            [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\"\r\n            *ngIf=\"couponDetails?.status\">\r\n            <div class=\"details__coupon-heading\">\r\n              <div class=\"coupon-brief\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}</div>\r\n                  <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n                </div>\r\n              </div>\r\n              <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n                <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n                <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n              </div> -->\r\n            </div>\r\n            <ng-container>\r\n              <!-- *ngIf=\"couponDetails.status\" -->\r\n              <div class=\"details-divider\"></div>\r\n              <ul class=\"details__coupon-terms\">\r\n                <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n              </ul>\r\n            </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #RedemptionVouchers>\r\n  <section class=\"vouchers-listing-section d-flex flex-column\">\r\n    <div class=\"coupon-heading d-flex align-items-center gap-2 p-3 fs-18 fw-600 border-bottom\">\r\n      <div class=\"back-btn cursor-pointer d-flex align-items-center\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Coupons & Vouchers</div>\r\n    </div>\r\n\r\n    <!-- <div class=\"d-flex align-items-center tab-container justify-content-between gap-2 p-3\">\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'COUPONS'}\"\r\n        (click)=\"redemptionType = 'COUPONS'\">\r\n        Coupons\r\n      </div>\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'VOUCHERS'}\"\r\n        (click)=\"redemptionType = 'VOUCHERS'\">\r\n        Vouchers\r\n      </div>\r\n    </div> -->\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3 pt-3\" *ngIf=\"redemptionType === 'COUPONS'\">\r\n      <div class=\"d-flex align-items-center tab-container gap-3\">\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'REWARDS'}\" (click)=\"redemptionCouponType = 'REWARDS'\">\r\n          Rewards\r\n        </div>\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'DISCOUNTS'}\"\r\n          (click)=\"redemptionCouponType = 'DISCOUNTS'\">\r\n          Discounts\r\n        </div>\r\n      </div>\r\n      <ng-container *ngIf=\"redemptionCouponType === 'REWARDS'\">\r\n        <ng-container *ngIf=\"(listRedemptionCoupons?.vouchers?.length > 0) ; else showEmptyScreen\">\r\n          <ng-container *ngFor=\"let voucher of listRedemptionCoupons?.vouchers; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%'\r\n                    }}\r\n                    off on your payment\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">\r\n                    Apply</div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n                <span class=\"separator text-secondary\">|</span>\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n                </span>\r\n                <span class=\"separator text-secondary\" *ngIf=\"voucher.maxRedeemableAmount\">|</span>\r\n                <span class=\"min-order\" *ngIf=\"voucher.maxRedeemableAmount\">Max Redeemable Amount: \u20B9{{\r\n                  voucher.maxRedeemableAmount | number }}</span>\r\n              </div>\r\n\r\n              <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"redemptionCouponType === 'DISCOUNTS'\">\r\n        <ng-container *ngIf=\"(couponList.length > 0); else showEmptyDiscounts\">\r\n          <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"couponDetails?.status\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\"\r\n                    [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}\r\n                  </div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    {{ couponDetails.discountDescription | titlecase }}\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\"\r\n                    [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : 'not-allowed'}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">\r\n                    Apply\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ couponDetails.couponCode | uppercase }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}\r\n                </span>\r\n              </div>\r\n\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyDiscounts>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Discount Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no discount coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no coupons</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3\" *ngIf=\"redemptionType === 'VOUCHERS'\">\r\n      <ng-container *ngIf=\"listRedemptionVouchers?.vouchers?.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let voucher of listRedemptionVouchers?.vouchers; let idx = index\">\r\n          <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n            <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n              <div class=\"coupon-brief__left-sec\">\r\n                <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                <div class=\"coupon-desc fs-12 text-secondary\">\r\n                  Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%' }}\r\n                  off on your payment\r\n                </div>\r\n              </div>\r\n              <div class=\"coupon-brief__right-sec\">\r\n                <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">Apply\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n              <div class=\"code-label\">Code</div>\r\n              <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n            </div>\r\n\r\n            <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n              <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n              <span class=\"separator text-secondary\">|</span>\r\n              <span class=\"validity\">\r\n                <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n              </span>\r\n            </div>\r\n\r\n            <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Vouchers Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no vouchers</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n  <div class=\"container\">\r\n    <div class=\"main-content\">\r\n      <div class=\"cart-items\">\r\n        <div class=\"cart-header\">\r\n          <h2>Your Cart</h2>\r\n        </div>\r\n        <ng-container\r\n          *ngTemplateOutlet=\"CARTITEM;context:{data: responseData?.orderedItems}\"></ng-container>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"sidebar\">\r\n      <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"getUrl()\">\r\n        <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n          <div class=\"toogle-switch\">\r\n            <div class=\"form-check form-switch\">\r\n              <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n                [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <!-- <div class=\"select_matured_text  w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n          Select Matured Scheme\r\n        </div> -->\r\n        <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectedRedemption\">\r\n          Selected Scheme\r\n          <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n            scheme-5000/M <span>Change</span></div>\r\n          <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n            <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n          </div>\r\n        </div> -->\r\n      </div>\r\n      <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n        <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n      </div>\r\n      <div class=\"coupon-section\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && !referEarnExist\">\r\n        <div class=\"coupon-left\">\r\n          <div class=\"coupon-icon\"><mat-icon>percent</mat-icon></div>\r\n          <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply\r\n            Coupon</span>\r\n          <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon\r\n            Applied</span>\r\n        </div>\r\n        <svg *ngIf=\"!responseData.billdetails?.couponId\" xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\"\r\n          viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\"\r\n          stroke-linejoin=\"round\" class=\"chevron-icon\" (click)=\"openDialog(CouponList)\">\r\n          <path d=\"m9 18 6-6-6-6\" />\r\n        </svg>\r\n        <span *ngIf=\"responseData.billdetails?.couponId\"\r\n          (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n      </div>\r\n\r\n      <div class=\"promo-banner mb-3\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\">\r\n        <div class=\"promo-banner-row\">\r\n          <div class=\"promo-text\">\r\n            <h3>See It Before You Buy It</h3>\r\n            <p>Experience our designs in detail via video call</p>\r\n          </div>\r\n          <button class=\"see-live-btn\" [disabled]=\"!hasCartItems\" (click)=\"openSchedulePanel()\">\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n              stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n              class=\"lucide lucide-video\">\r\n              <path d=\"m22 8-6 4 6 4V8Z\" />\r\n              <rect width=\"14\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\" ry=\"2\" />\r\n            </svg>\r\n            CONTINUE TO SCHEDULE\r\n          </button>\r\n        </div>\r\n        <div class=\"video-selection-line\">{{videoSelectionLine}}</div>\r\n        <a class=\"video-cart-hint\" *ngIf=\"videoCartCount > 0\" (click)=\"viewPendingVideoCart()\">{{videoCartCount}}\r\n          item{{videoCartCount === 1 ? '' : 's'}} waiting in your Video Call cart \u2014 view it</a>\r\n      </div>\r\n\r\n      <div class=\"plan-details-container p-3 rounded-4 bg-white text-dark voucher-details\"\r\n        *ngIf=\"referEarnExist && this?.redemptionPoints?.availablePoints > 0\">\r\n        <div class=\"fs-14 fw-500\">\r\n          Rewards Available\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-start border-bottom pb-2\">\r\n          <div class=\"avb_pts mt-2 mb-2\">\r\n            <span class=\"fs-16 fw-500 total_points text-secondary\">\r\n              <span class=\" fs-18 fw-600 text-dark\">{{(this?.redemptionPoints?.availablePoints || 0).toFixed(2)}}</span>\r\n              pts\r\n            </span>\r\n            <div class=\"total_value fs-12 text-secondary\">\r\n              = max \u20B9{{(this?.redemptionPoints?.pointsConvertedRupees || 0).toFixed(2)}} discount\r\n            </div>\r\n          </div>\r\n          <div class=\"wallte_icon\">\r\n            <img src=\"https://d2z9497xp8xb12.cloudfront.net/prod-images/777779c1775200561187wallet_(1).png\" alt=\"\">\r\n          </div>\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n          <div class=\"redemable_text\">\r\n            <div class=\"title_text\">\r\n              <div class=\"fs-14 fw-500\">\r\n                Redeem Points\r\n              </div>\r\n              <div class=\"fs-13 fs-400\">\r\n                Use your points for discount\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <div class=\"toggle_btn\">\r\n            <label class=\"switch\">\r\n              <input type=\"checkbox\" id=\"toggleSwitch\" [checked]=\"isPointsRedeeming\"\r\n                (click)=\"onPointsRedeemingChange($event)\" />\r\n              <span class=\"slider\"></span>\r\n            </label>\r\n          </div>\r\n        </div>\r\n        <div class=\"mt-3 success_selected w-100 applied-coupon-card\" *ngIf=\"isPointsRedeeming\">\r\n          <div class=\"d-flex align-items-start gap-2\">\r\n            <div class=\"success_icon\">\r\n              <mat-icon class=\"d-flex justify-content-center align-items-center text-success\">check_circle</mat-icon>\r\n            </div>\r\n            <div class=\"success_text\">\r\n              <div class=\"fs-13 fw-500\">\r\n                You're saving \u20B9\r\n                {{totalSavingAmt || 0}}\r\n              </div>\r\n              <div class=\"fs-12 fs-400 text-success\">\r\n                {{totalSavingPoints}} points remaining after redemption\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- Existing coupon row (keep as-is) -->\r\n      <div class=\"coupon-section d-flex flex-column voucher-details\" [id]=\"data?.id\"\r\n        *ngIf=\"cartType === 'SHOPPING' && referEarnExist\">\r\n        <div class=\"d-flex justify-content-between align-items-center w-100\">\r\n          <div class=\"coupon-left\">\r\n            Apply Coupon\r\n          </div>\r\n          <div (click)=\"addRedemptionCoupon(RedemptionVouchers)\">View All</div>\r\n        </div>\r\n\r\n        <!-- Applied Coupon Success Banner -->\r\n        <div class=\"applied-coupon-card w-100 mt-3 d-flex align-items-center justify-content-between\"\r\n          *ngIf=\"selectedVoucherId\">\r\n          <div class=\"applied-coupon-left d-flex align-items-center gap-3\">\r\n            <mat-icon class=\"success-check\">check_circle</mat-icon>\r\n            <div class=\"applied-coupon-info\">\r\n              <div class=\"applied-coupon-code\">Coupon {{ selectedVoucherCode }} applied!</div>\r\n              <div class=\"applied-coupon-saving\">You're saving\r\n                <span *ngIf=\"this.couponValueType === 'AMOUNT'\">\u20B9 {{selectedVoucherAmount || 0}}</span>\r\n                <span *ngIf=\"this.couponValueType === 'PERCENTAGE'\"> {{selectedVoucherPercentage || 0}}%</span>\r\n              </div>\r\n\r\n            </div>\r\n          </div>\r\n          <div class=\"remove-coupon-btn fs-14 fw-500 text-secondary cursor-pointer\"\r\n            (click)=\"removeRedemptionCoupon($event)\">Remove</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n        <div class=\"delivery-header\">\r\n          <mat-icon>gps_fixed</mat-icon>\r\n          <span>Delivering to</span>\r\n          <span class=\"pincode\">{{pincode}}</span>\r\n          <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"summary-section\">\r\n        <div class=\"summary-title\">Summary</div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Subtotal</span>\r\n          <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalNetValue ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && referEarnExist && isPointsRedeeming\">\r\n          <span class=\"summary-label\">Points Redeemed</span>\r\n          <span class=\"summary-value\">- \u20B9{{ totalSavingAmt || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'AMOUNT' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ selectedVoucherAmount || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'PERCENTAGE' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ percentageReduced || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount\">\r\n          <span class=\"summary-label\">Discount Amount</span>\r\n          <span class=\"summary-value\">\r\n            {{('\u20B9' + (responseData?.billdetails?.discountAmount | number: '1.0-2')) }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Shipping</span>\r\n          <span class=\"summary-value\"\r\n            [ngClass]=\"{'savings': !responseData?.billdetails?.deliveryCharges || responseData.billdetails.deliveryCharges <= 0}\">\r\n            {{ (responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0) ? ('\u20B9' +\r\n            (responseData.billdetails.deliveryCharges | number: '1.0-2')) : 'Free' }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Estimated Tax</span>\r\n          <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Total</span>\r\n          <!-- <span class=\"summary-value\">\u20B9{{ responseData?.totalAmount | number: '1.0-2' }}</span> -->\r\n          <span class=\"total-value\" *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{ responseData?.totalAmount |\r\n            number: '1.0-2' }}</span>\r\n\r\n          <span class=\"total-value\" *ngIf=\"isPointsRedeeming\">\u20B9{{ (responseData?.totalAmount - (totalSavingAmt || 0)) |\r\n            number: '1.0-2' }}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (percentageReduced || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n      <button class=\"place-order-btn\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n      <button class=\"place-order-btn mt-0\" (click)=\"edit ? '' : proceedToCheckout()\" simpoButtonDirective\r\n        *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n        Cart'}}</button>\r\n\r\n    </div>\r\n  </div>\r\n  <!-- <ng-container *ngIf=\"recommededData?.length\">\r\n    <simpo-featured-products [edit]=\"false\" [data]=\"featureProductData\"\r\n      [responseData]=\"recommededData\"></simpo-featured-products>\r\n  </ng-container> -->\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n  <div class=\"checkout-left-panel\">\r\n    <div class=\"checkout-main-content\">\r\n      <!-- <div class=\"delivery-options\">\r\n        <div class=\"delivery-option active\">\r\n          <div class=\"delivery-icon\"></div>\r\n          HOME DELIVERY\r\n        </div>\r\n        <div class=\"delivery-option\">\r\n          <div class=\"delivery-icon\"></div>\r\n          STORE PICK-UP\r\n        </div>\r\n      </div> -->\r\n\r\n      <div class=\"section-title\">Shipping Address</div>\r\n\r\n      <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n        <div class=\"address-info\">\r\n          <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n          <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n            {{defaultAddress?.stateName}}</div>\r\n          <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n        <mat-icon>add</mat-icon>\r\n      </div>\r\n\r\n      <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n      <button class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective\r\n        *ngIf=\"defaultAddress && !placeOrderLoader\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">\r\n        Place Order\r\n      </button>\r\n      <button class=\"btn w-100 mt-1 payment-btn\" simpoButtonDirective *ngIf=\"defaultAddress && placeOrderLoader\"\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\">\r\n        Loading...\r\n      </button>\r\n\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"checkout-right-panel\">\r\n    <div class=\"order-summary\">\r\n      <div class=\"summary-title\">Order Summary</div>\r\n\r\n      <div class=\"checkout-product\">\r\n        <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n            alt=\"\">\r\n          <div class=\"product-details\">\r\n            <div class=\"product-name\">{{item.itemName}}</div>\r\n            <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n            <div class=\"product-price\">\u20B9{{(item.sellingPrice * item.quantity) | number: '1.0-2'}}</div>\r\n          </div>\r\n        </div>\r\n\r\n      </div>\r\n\r\n      <div class=\"price-breakdown\">\r\n        <div class=\"price-row\">\r\n          <span>Total Price</span>\r\n          <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n            ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\">\r\n          <span>Total Tax</span>\r\n          <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n          <span class=\"summary-label\">Redeem Amount</span>\r\n          <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"price-row discount\" *ngIf=\"responseData?.billdetails?.discountAmount && !isJewellery\">\r\n          <span>Coupon Discount</span>\r\n          <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n            | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <span>Delivery Charge</span>\r\n          <span>{{responseData.billdetails.deliveryCharges\r\n            |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row total\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span>TOTAL AMOUNT</span>\r\n          <span *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{(responseData?.totalAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"isPointsRedeeming\">\u20B9{{(responseData?.totalAmount - (totalSavingAmt || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (responseData?.totalAmount * (selectedVoucherPercentage / 100) || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n  <div class=\"cart-item\" *ngFor=\"let item of products\" [style.color]=\"fontColor\">\r\n    <div class=\"item-left\">\r\n      <div class=\"item-image\">\r\n        <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n          (click)=\"goToProductDetails(item)\" style=\"cursor: pointer;\">\r\n      </div>\r\n      <div class=\"item-details\">\r\n        <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n        <div class=\"item-subtitle\" *ngIf=\"item.itemVariant\">\r\n          <span *ngFor=\"let varient of getKeys(item.itemVariant.properties); let last = last\">\r\n            {{ item.itemVariant.properties[varient] | titlecase }}<span *ngIf=\"!last\">, </span>\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"item-right\">\r\n      <div class=\"quantity-control\" *ngIf=\"cartType === 'SHOPPING'\">\r\n        <button class=\"qty-btn px-2\" (click)=\"decreaseQty(item)\" [disabled]=\"item.quantity === 1\">\r\n          <mat-icon>remove</mat-icon>\r\n        </button>\r\n        <span class=\"qty-value px-3\">{{item.quantity}}</span>\r\n        <button class=\"qty-btn px-2\" (click)=\"increaseQty(item)\">\r\n          <mat-icon>add</mat-icon>\r\n        </button>\r\n      </div>\r\n\r\n      <div class=\"item-price\">\r\n        \u20B9{{item.sellingPrice | number: '1.0-2'}}\r\n      </div>\r\n\r\n      <div class=\"delete-btn-circle\" (click)=\"removeItem(item)\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\r\n          stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-trash-2\">\r\n          <path d=\"M3 6h18\" />\r\n          <path d=\"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6\" />\r\n          <path d=\"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2\" />\r\n          <line x1=\"10\" x2=\"10\" y1=\"11\" y2=\"17\" />\r\n          <line x1=\"14\" x2=\"14\" y1=\"11\" y2=\"17\" />\r\n        </svg>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n  <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n    <div class=\"empty-cart-container d-flex flex-column\">\r\n      <div class=\"cart-image\">\r\n        <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n          [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n          [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n      </div>\r\n      <div class=\"cart-text content-side\">\r\n        <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n          <div class=\"d-flex justify-content-center\"\r\n            [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n            <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\" [isRTE]=\"text.isRTE\"></simpo-text-editor>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <button class=\"place-order-btn mx-auto w-fit\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n  <div class=\"modal-body\">\r\n    <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n      [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n      <label for=\"individual\" class=\"scheme-card\">\r\n        <div class=\"scheme-info d-flex gap-1\">\r\n          <div class=\"form-check-radio\">\r\n            <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n          </div>\r\n          <div class=\"right-side\">\r\n            <div class=\"scheme-name\">\r\n              <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n              <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n            </div>\r\n            <div class=\"scheme-details\">\r\n              <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n              <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n            </div>\r\n            <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n          </div>\r\n        </div>\r\n      </label>\r\n    </div>\r\n    <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n      Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n    </div>\r\n  </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{background:#fff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.cart-header{padding:16px 24px;border-bottom:1px solid #e2e8f0;background:#f8fafc}.cart-header h2{margin:0;font-size:18px;font-weight:500;color:#0f172a}.cart-item{display:flex!important;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0;gap:20px;padding:0 8px;transition:background .2s}.cart-item:hover{background:#fbfcfe}.item-left{display:flex;align-items:center;flex:1}.item-right{display:flex;align-items:center;padding:15px;gap:32px}.item-image img{width:64px;height:64px;border-radius:12px;object-fit:cover;border:1px solid #f1f5f9}.item-details{display:flex;flex-direction:column;gap:4px}.item-title{margin:0;font-size:15px;font-weight:600;color:#0f172a;line-height:1.4}.item-subtitle{font-size:13px;color:#64748b;font-weight:400}.quantity-control{display:flex;align-items:center;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden;height:38px;background:#fff;width:fit-content}.qty-btn{width:38px;height:100%;border:none;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#475569;transition:all .2s ease}.qty-btn:hover{background:#f8fafc;color:#0f172a}.qty-btn mat-icon{font-size:16px;width:16px;height:16px;display:flex;align-items:center;justify-content:center}.qty-value{width:32px;height:100%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;color:#0f172a;border-left:1.5px solid #e2e8f0;border-right:1.5px solid #e2e8f0}.item-price{font-size:18px;font-weight:700;color:#0f172a;min-width:60px;text-align:right;letter-spacing:-.01em}.delete-btn-circle{width:36px;height:36px;border-radius:50%;border:1px solid #fee2e2;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ef4444;transition:all .2s ease}.delete-btn-circle:hover{background:#fef2f2;border-color:#fecaca;transform:scale(1.05);color:#dc2626}.delete-btn-circle svg{width:18px;height:18px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;width:100%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.fs-12{font-size:12px}.fs-18{font-size:18px}.b-1-b{border-width:0px 1px;border-style:solid;border-color:#000}.container{max-width:unset;padding:24px;display:flex;gap:24px;width:100%!important}.main-content{background:#fff;border-radius:12px;width:70%}.promo-banner{padding:16px 20px;display:flex;flex-direction:column;gap:10px;border-radius:8px;border:1px solid #e2e8f0}.promo-banner-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.promo-text h3{font-size:16px!important;font-weight:500;margin-bottom:4px}.promo-text p{font-size:.9rem!important;margin-bottom:0!important;color:#64748b}.see-live-btn{background:#fff;border:1px solid #e2e8f0;font-weight:600;color:#000;padding:8px 16px;border-radius:8px;font-size:12px!important;cursor:pointer;display:flex;align-items:center;gap:8px;width:max-content!important;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.see-live-btn:hover{background:#f8fafc;border-color:#cbd5e1;transform:translateY(-1px)}.see-live-btn:disabled{color:#94a3b8;cursor:not-allowed;box-shadow:none}.see-live-btn:disabled:hover{background:#fff;border-color:#e2e8f0;transform:none}.see-live-btn svg{color:#6366f1}.video-selection-line{font-size:.8rem;color:#64748b}.video-cart-hint{font-size:.8rem;color:#6366f1;cursor:pointer;text-decoration:underline;width:max-content}.schedule-panel-overlay{position:fixed;inset:0;background:#141a2666;z-index:1200}.schedule-panel-backdrop{position:absolute;inset:0;border:none;background:none;cursor:default;padding:0}.schedule-panel{position:absolute;top:0;right:0;bottom:0;width:400px;max-width:92vw;background:#fff;box-shadow:-20px 0 50px -20px #141a2659;display:flex;flex-direction:column}.schedule-panel-header{flex:none;padding:20px 22px;border-bottom:1px solid #e2e8f0;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.schedule-panel-title{font-size:17px;font-weight:600;color:#1b2436}.schedule-panel-subtitle{font-size:12.5px;color:#64748b}.schedule-panel-close{flex:none;border:none;background:none;cursor:pointer;color:#64748b;line-height:0;padding:3px}.schedule-panel-body{flex:1;min-height:0;overflow-y:auto;padding:16px 22px;display:flex;flex-direction:column;gap:10px}.schedule-panel-row{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px;cursor:pointer;width:100%;background:#fff;border:1px solid #e2e8f0;text-align:left}.schedule-panel-row.selected{background:#f5f3ff;border-color:#c7d2fe}.schedule-panel-checkbox{width:18px;height:18px;flex:none;border:1.5px solid #cbd5e1;border-radius:4px;background:#fff;display:grid;place-items:center}.schedule-panel-checkbox.checked{background:#6366f1;border-color:#6366f1}.schedule-panel-checkbox mat-icon{color:#fff!important;font-size:13px!important;height:13px!important;width:13px!important}.schedule-panel-thumb{width:46px;height:46px;border-radius:6px;object-fit:cover;flex:none;background:#f3efe9}.schedule-panel-info{flex:1}.schedule-panel-name{font-size:13.5px;color:#1b2436}.schedule-panel-footer{flex:none;padding:16px 22px;border-top:1px solid #e2e8f0;display:flex;flex-direction:column;gap:10px}.schedule-panel-selection-line{font-size:11.5px;color:#64748b}.schedule-panel-cta{width:100%;height:48px;border:none;border-radius:8px;background:#7c3a11;color:#fff;font-size:14px;font-weight:600;cursor:pointer}.schedule-panel-cta:disabled{background:#cbd5e1;cursor:not-allowed}.cart-item{display:flex;gap:16px;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:15%;height:100px;border-radius:8px;object-fit:cover;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-weight:500;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px}.current-price{font-size:1rem;font-weight:600}.original-price{font-size:1rem;text-decoration:line-through}.discount{background:#fef3c7;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:32%}.coupon-section{border-radius:8px;padding:10px 15px;border:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all .2s ease}.coupon-section:hover{border-color:#cbd5e1;background-color:#f8fafc}.chevron-icon{color:#94a3b8;transition:transform .2s ease}.coupon-section:hover .chevron-icon{transform:translate(2px);color:#64748b}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.coupon-icon mat-icon{font-size:17px;width:17px!important;height:19px!important}.coupon-text{font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:8px;padding:20px;border:1px solid #e2e8f0}.summary-title{font-size:16px;font-weight:700;color:#0f172a;margin-bottom:20px;letter-spacing:-.01em}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.summary-row:last-child{margin-bottom:0}.summary-label{font-size:14px;font-weight:400;color:#64748b}.summary-value{font-size:14px;font-weight:500;color:#0f172a}.summary-divider{height:1px;background:#f1f5f9;margin:16px 0;width:100%}.total-row .summary-label{font-size:16px;font-weight:600;color:#0f172a}.total-row .summary-value{font-size:16px;font-weight:700;color:#0f172a}.total-row{border-top:1px solid #e2e8f0;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px}.total-value{font-weight:700;font-size:18px}.place-order-btn{background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;align-items:center;width:max-content;border-radius:8px;border:1px solid #e2e8f0}.cart-tabs div{padding:7px 10px;cursor:pointer;font-size:14px}.selected-cart-tab{margin:6px;background:#f1f5f9;border-radius:5px;color:#000!important;font-weight:500}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.cart-item{flex-direction:column!important;align-items:flex-start!important;padding:16px 12px!important;gap:16px!important}.item-left{width:100%!important;gap:16px!important;align-items:flex-start!important}.item-image{width:86px!important;height:86px!important;flex-shrink:0!important}.item-right{width:100%!important;justify-content:space-between!important;padding:0!important;gap:12px!important;margin-top:4px!important}.item-price{flex:1!important;text-align:right!important;margin-right:8px!important;font-size:16px!important}.item-title{font-size:14px!important;-webkit-line-clamp:2!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.quantity-control{height:34px!important}.qty-btn{width:34px!important}.qty-value{width:28px!important;font-size:13px!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}.vouchers-listing-section{min-width:unset!important;width:100vw!important}.separator{display:none!important}.coupon-meta{display:grid!important;grid-template-columns:1fr 1fr!important}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.w-fit{width:fit-content!important}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}.add-to-cart-parent{width:max-content;border:1px solid #000000;border-radius:8px}.cursor{cursor:pointer}.cart-text{max-width:600px;margin:0 auto;text-align:center}.cart-text div{word-break:break-word;overflow-wrap:break-word;white-space:normal}.switch{position:relative;display:inline-block;width:45px;height:20px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.4s;border-radius:34px}.slider:before{position:absolute;content:\"\";height:16px;width:16px;left:3px;bottom:2px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#4caf50}input:checked+.slider:before{transform:translate(24px)}.vouchers-listing-section{position:relative;width:fit-content;min-width:500px;z-index:100;background:#fff;height:100vh}.vouchers-listing-section .coupon-heading{border-bottom:1px solid #eee}.vouchers-listing-section .coupon-listing{padding:12px 16px;overflow-y:auto;height:calc(97vh - 100px)}.voucher-details{background:#fff;border-radius:12px;padding:14px;box-shadow:0 1px 4px #00000042}.voucher-details .coupon-brief .apply-offer-btn{background:#111;color:#fff;border-radius:10px;padding:6px 16px}.voucher-details .coupon-code-box{border:1.5px dashed #bbb;border-radius:8px;padding:8px 12px;margin-bottom:10px}.voucher-details .coupon-code-box .code-label{font-size:11px;color:#888;margin-bottom:2px}.voucher-details .coupon-code-box .code-row .code-value{font-weight:700;font-size:15px;letter-spacing:1px}.voucher-details .coupon-meta .clock-icon{font-size:14px;height:14px;width:14px;vertical-align:middle}.applied-coupon-card{background:#f0fff8;border-radius:12px;padding:12px 16px}.applied-coupon-card .applied-coupon-left .success-check{color:#22c55e;font-size:22px}.applied-coupon-card .applied-coupon-left .applied-coupon-code{font-weight:700;font-size:14px}.applied-coupon-card .applied-coupon-left .applied-coupon-saving{font-size:13px;color:#097d5f;margin-top:2px}.active-type{background:#111!important;color:#fff!important}.redemption-type{text-align:center;border-radius:10px;padding:6px 16px;background:#d3d3d36b;width:-webkit-fill-available!important}.wallte_icon{background:#000;border-radius:50px;padding:5px 9px 7px}.wallte_icon img{width:18px;height:18px}.fw-600{font-weight:600}.coupon-type{width:fit-content!important;border-radius:26px!important;background:transparent!important;border:1px solid #afafaf;color:#393838;text-align:center;padding:6px 16px}.active-coupon{background:transparent!important;border:2px solid black!important;color:#000!important}.my-close-btn{position:absolute!important;top:10px!important;right:10px!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i3.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i3.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "component", type: i7.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { kind: "ngmodule", type: MatBottomSheetModule }, { kind: "directive", type: 
                 //DIRECTIVE
                 ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color", "scrollValue", "backgroundInfo"] }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "ngmodule", type: ToastModule }, { kind: "component", type: i11.Toast, selector: "p-toast", inputs: ["key", "autoZIndex", "baseZIndex", "life", "style", "styleClass", "position", "preventOpenDuplicates", "preventDuplicates", "showTransformOptions", "hideTransformOptions", "showTransitionOptions", "hideTransitionOptions", "breakpoints"], outputs: ["onClose"] }, { kind: "component", type: TextEditorComponent, selector: "simpo-text-editor", inputs: ["value", "editable", "isRTE", "sectionId", "label", "type", "inputTextIndex", "itemIndex"], outputs: ["valueChange"] }, { kind: "directive", type: ImageEditorDirective, selector: "[appImageEditor]", inputs: ["appImageEditor", "imageData", "sectionId", "showIcon", "iconData", "itemIndex"] }, { kind: "directive", type: SpacingHorizontalDirective, selector: "[spacingHorizontal]", inputs: ["spacingHorizontal", "isHeader"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "directive", type: ButtonEditorDirective, selector: "button[appButtonEditor]", inputs: ["appButtonEditor", "buttonData", "buttonStyle", "backgroundInfo", "sectionId", "buttonId", "itemIndex"] }, { kind: "component", type: BookingCartGroupsComponent, selector: "simpo-booking-cart-groups" }] }); }
 }
@@ -10777,7 +10803,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         FeaturedProductsComponent,
                         MatSpinner,
                         BookingCartGroupsComponent
-                    ], providers: [MessageService], template: "<ng-container *ngIf=\"!isLoading\">\r\n  <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n    [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n  <ng-container *ngIf=\"data\">\r\n    <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n      [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n      (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n      [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n      <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n        [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n        *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n        <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline isActive\">Address</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n      </div>\r\n      <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n        <!-- && ecomConfigs?.appointmentBookingEnabled\" -->\r\n        <div class=\"cart-tabs\" [id]=\"data?.id\">\r\n          <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n            (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n          <div [ngClass]=\"{'selected-cart-tab': cartType==='BOOKING'}\" (click)=\"cartType='BOOKING'\">Booking Cart\r\n            ({{getTotalBookingItems}})</div>\r\n        </div>\r\n      </div>\r\n      <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n        [simpoAnimation]=\"styles?.animation\">\r\n        <ng-container>\r\n          <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n            <ng-container\r\n              *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"cartType === 'BOOKING'\">\r\n            <div class=\"w-100\">\r\n              <simpo-booking-cart-groups></simpo-booking-cart-groups>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"d-flex checkoutPage\"\r\n        *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n        <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n        </ng-container>\r\n      </div>\r\n\r\n\r\n      <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n        <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n          [isEcommerce]=\"true\"></simpo-hover-elements>\r\n      </div>\r\n      <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n        <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n      </div>\r\n\r\n    </section>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!data\">\r\n    <section class=\"cart-window\">\r\n      <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n        <div class=\"d-flex align-items-center\">\r\n          <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n          <span>Your Cart</span>\r\n        </div>\r\n        <div class=\"saving\"></div>\r\n      </div>\r\n      <div class=\"offers\">\r\n        <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n          <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n          <span>Avail Offers / Coupons</span>\r\n        </div>\r\n        <mat-icon>keyboard_arrow_right</mat-icon>\r\n      </div>\r\n      <div class=\"small-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n          <div class=\"small-item\">\r\n            <div class=\"d-flex\" style=\"gap: 5px;\">\r\n              <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n                  class=\"small-product-img\"\r\n                  [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n                  (click)=\"goToProductDetails(item)\">\r\n              </div>\r\n              <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n              <div class=\"small-item-quantity\">\r\n                <span class=\"cursor\">-</span>\r\n                <span>{{item.quantity}}</span>\r\n                <span class=\"cursor\">+</span>\r\n              </div>\r\n              <div class=\"small-item-price\">\r\n                <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.sellingPrice) | number: '1.0-2'}}\r\n                </div>\r\n                <!-- <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n                </div> -->\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"fotter-sec\">\r\n        <div class=\"delivery-add d-flex\">\r\n          <mat-icon>home</mat-icon>\r\n          <div class=\"address\">Tetsting</div>\r\n        </div>\r\n        <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n            style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n          {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n      </div>\r\n    </section>\r\n  </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n  width: '100%',\r\n  height: '40vh',\r\n  'border-radius': '10px',\r\n  'position': 'relative',\r\n  'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n  <section class=\"coupons-listing-section\">\r\n    <div class=\"coupon-heading\">\r\n      <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Apply Coupon</div>\r\n    </div>\r\n    <!-- <div class=\"coupon-search-sec\">\r\n      <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n      <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n    </div> -->\r\n    <div class=\"coupon-listing\">\r\n      <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n          <div class=\"coupon-details\"\r\n            [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\"\r\n            *ngIf=\"couponDetails?.status\">\r\n            <div class=\"details__coupon-heading\">\r\n              <div class=\"coupon-brief\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}</div>\r\n                  <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n                </div>\r\n              </div>\r\n              <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n                <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n                <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n              </div> -->\r\n            </div>\r\n            <ng-container>\r\n              <!-- *ngIf=\"couponDetails.status\" -->\r\n              <div class=\"details-divider\"></div>\r\n              <ul class=\"details__coupon-terms\">\r\n                <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n              </ul>\r\n            </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #RedemptionVouchers>\r\n  <section class=\"vouchers-listing-section d-flex flex-column\">\r\n    <div class=\"coupon-heading d-flex align-items-center gap-2 p-3 fs-18 fw-600 border-bottom\">\r\n      <div class=\"back-btn cursor-pointer d-flex align-items-center\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Coupons & Vouchers</div>\r\n    </div>\r\n\r\n    <!-- <div class=\"d-flex align-items-center tab-container justify-content-between gap-2 p-3\">\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'COUPONS'}\"\r\n        (click)=\"redemptionType = 'COUPONS'\">\r\n        Coupons\r\n      </div>\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'VOUCHERS'}\"\r\n        (click)=\"redemptionType = 'VOUCHERS'\">\r\n        Vouchers\r\n      </div>\r\n    </div> -->\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3 pt-3\" *ngIf=\"redemptionType === 'COUPONS'\">\r\n      <div class=\"d-flex align-items-center tab-container gap-3\">\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'REWARDS'}\" (click)=\"redemptionCouponType = 'REWARDS'\">\r\n          Rewards\r\n        </div>\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'DISCOUNTS'}\"\r\n          (click)=\"redemptionCouponType = 'DISCOUNTS'\">\r\n          Discounts\r\n        </div>\r\n      </div>\r\n      <ng-container *ngIf=\"redemptionCouponType === 'REWARDS'\">\r\n        <ng-container *ngIf=\"(listRedemptionCoupons?.vouchers?.length > 0) ; else showEmptyScreen\">\r\n          <ng-container *ngFor=\"let voucher of listRedemptionCoupons?.vouchers; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%'\r\n                    }}\r\n                    off on your payment\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">\r\n                    Apply</div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n                <span class=\"separator text-secondary\">|</span>\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n                </span>\r\n                <span class=\"separator text-secondary\" *ngIf=\"voucher.maxRedeemableAmount\">|</span>\r\n                <span class=\"min-order\" *ngIf=\"voucher.maxRedeemableAmount\">Max Redeemable Amount: \u20B9{{\r\n                  voucher.maxRedeemableAmount | number }}</span>\r\n              </div>\r\n\r\n              <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"redemptionCouponType === 'DISCOUNTS'\">\r\n        <ng-container *ngIf=\"(couponList.length > 0); else showEmptyDiscounts\">\r\n          <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"couponDetails?.status\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\"\r\n                    [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}\r\n                  </div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    {{ couponDetails.discountDescription | titlecase }}\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\"\r\n                    [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : 'not-allowed'}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">\r\n                    Apply\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ couponDetails.couponCode | uppercase }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}\r\n                </span>\r\n              </div>\r\n\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyDiscounts>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Discount Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no discount coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no coupons</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3\" *ngIf=\"redemptionType === 'VOUCHERS'\">\r\n      <ng-container *ngIf=\"listRedemptionVouchers?.vouchers?.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let voucher of listRedemptionVouchers?.vouchers; let idx = index\">\r\n          <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n            <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n              <div class=\"coupon-brief__left-sec\">\r\n                <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                <div class=\"coupon-desc fs-12 text-secondary\">\r\n                  Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%' }}\r\n                  off on your payment\r\n                </div>\r\n              </div>\r\n              <div class=\"coupon-brief__right-sec\">\r\n                <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">Apply\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n              <div class=\"code-label\">Code</div>\r\n              <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n            </div>\r\n\r\n            <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n              <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n              <span class=\"separator text-secondary\">|</span>\r\n              <span class=\"validity\">\r\n                <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n              </span>\r\n            </div>\r\n\r\n            <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Vouchers Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no vouchers</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n  <div class=\"container\">\r\n    <div class=\"main-content\">\r\n      <div class=\"cart-items\">\r\n        <div class=\"cart-header\">\r\n          <h2>Your Cart</h2>\r\n        </div>\r\n        <ng-container\r\n          *ngTemplateOutlet=\"CARTITEM;context:{data: responseData?.orderedItems}\"></ng-container>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"sidebar\">\r\n      <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"getUrl()\">\r\n        <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n          <div class=\"toogle-switch\">\r\n            <div class=\"form-check form-switch\">\r\n              <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n                [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <!-- <div class=\"select_matured_text  w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n          Select Matured Scheme\r\n        </div> -->\r\n        <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectedRedemption\">\r\n          Selected Scheme\r\n          <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n            scheme-5000/M <span>Change</span></div>\r\n          <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n            <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n          </div>\r\n        </div> -->\r\n      </div>\r\n      <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n        <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n      </div>\r\n      <div class=\"coupon-section\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && !referEarnExist\">\r\n        <div class=\"coupon-left\">\r\n          <div class=\"coupon-icon\"><mat-icon>percent</mat-icon></div>\r\n          <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply\r\n            Coupon</span>\r\n          <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon\r\n            Applied</span>\r\n        </div>\r\n        <svg *ngIf=\"!responseData.billdetails?.couponId\" xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\"\r\n          viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\"\r\n          stroke-linejoin=\"round\" class=\"chevron-icon\" (click)=\"openDialog(CouponList)\">\r\n          <path d=\"m9 18 6-6-6-6\" />\r\n        </svg>\r\n        <span *ngIf=\"responseData.billdetails?.couponId\"\r\n          (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n      </div>\r\n\r\n      <div class=\"promo-banner mb-3\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\">\r\n        <div class=\"promo-banner-row\">\r\n          <div class=\"promo-text\">\r\n            <h3>See It Before You Buy It</h3>\r\n            <p>Experience our designs in detail via video call</p>\r\n          </div>\r\n          <button class=\"see-live-btn\" [disabled]=\"noVideoSelection\" (click)=\"continueToSchedule()\">\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n              stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n              class=\"lucide lucide-video\">\r\n              <path d=\"m22 8-6 4 6 4V8Z\" />\r\n              <rect width=\"14\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\" ry=\"2\" />\r\n            </svg>\r\n            CONTINUE TO SCHEDULE\r\n          </button>\r\n        </div>\r\n        <div class=\"video-selection-line\">{{videoSelectionLine}}</div>\r\n        <a class=\"video-cart-hint\" *ngIf=\"videoCartCount > 0\" (click)=\"viewPendingVideoCart()\">{{videoCartCount}}\r\n          item{{videoCartCount === 1 ? '' : 's'}} waiting in your Video Call cart \u2014 view it</a>\r\n      </div>\r\n\r\n      <div class=\"plan-details-container p-3 rounded-4 bg-white text-dark voucher-details\"\r\n        *ngIf=\"referEarnExist && this?.redemptionPoints?.availablePoints > 0\">\r\n        <div class=\"fs-14 fw-500\">\r\n          Rewards Available\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-start border-bottom pb-2\">\r\n          <div class=\"avb_pts mt-2 mb-2\">\r\n            <span class=\"fs-16 fw-500 total_points text-secondary\">\r\n              <span class=\" fs-18 fw-600 text-dark\">{{(this?.redemptionPoints?.availablePoints || 0).toFixed(2)}}</span>\r\n              pts\r\n            </span>\r\n            <div class=\"total_value fs-12 text-secondary\">\r\n              = max \u20B9{{(this?.redemptionPoints?.pointsConvertedRupees || 0).toFixed(2)}} discount\r\n            </div>\r\n          </div>\r\n          <div class=\"wallte_icon\">\r\n            <img src=\"https://d2z9497xp8xb12.cloudfront.net/prod-images/777779c1775200561187wallet_(1).png\" alt=\"\">\r\n          </div>\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n          <div class=\"redemable_text\">\r\n            <div class=\"title_text\">\r\n              <div class=\"fs-14 fw-500\">\r\n                Redeem Points\r\n              </div>\r\n              <div class=\"fs-13 fs-400\">\r\n                Use your points for discount\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <div class=\"toggle_btn\">\r\n            <label class=\"switch\">\r\n              <input type=\"checkbox\" id=\"toggleSwitch\" [checked]=\"isPointsRedeeming\"\r\n                (click)=\"onPointsRedeemingChange($event)\" />\r\n              <span class=\"slider\"></span>\r\n            </label>\r\n          </div>\r\n        </div>\r\n        <div class=\"mt-3 success_selected w-100 applied-coupon-card\" *ngIf=\"isPointsRedeeming\">\r\n          <div class=\"d-flex align-items-start gap-2\">\r\n            <div class=\"success_icon\">\r\n              <mat-icon class=\"d-flex justify-content-center align-items-center text-success\">check_circle</mat-icon>\r\n            </div>\r\n            <div class=\"success_text\">\r\n              <div class=\"fs-13 fw-500\">\r\n                You're saving \u20B9\r\n                {{totalSavingAmt || 0}}\r\n              </div>\r\n              <div class=\"fs-12 fs-400 text-success\">\r\n                {{totalSavingPoints}} points remaining after redemption\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- Existing coupon row (keep as-is) -->\r\n      <div class=\"coupon-section d-flex flex-column voucher-details\" [id]=\"data?.id\"\r\n        *ngIf=\"cartType === 'SHOPPING' && referEarnExist\">\r\n        <div class=\"d-flex justify-content-between align-items-center w-100\">\r\n          <div class=\"coupon-left\">\r\n            Apply Coupon\r\n          </div>\r\n          <div (click)=\"addRedemptionCoupon(RedemptionVouchers)\">View All</div>\r\n        </div>\r\n\r\n        <!-- Applied Coupon Success Banner -->\r\n        <div class=\"applied-coupon-card w-100 mt-3 d-flex align-items-center justify-content-between\"\r\n          *ngIf=\"selectedVoucherId\">\r\n          <div class=\"applied-coupon-left d-flex align-items-center gap-3\">\r\n            <mat-icon class=\"success-check\">check_circle</mat-icon>\r\n            <div class=\"applied-coupon-info\">\r\n              <div class=\"applied-coupon-code\">Coupon {{ selectedVoucherCode }} applied!</div>\r\n              <div class=\"applied-coupon-saving\">You're saving\r\n                <span *ngIf=\"this.couponValueType === 'AMOUNT'\">\u20B9 {{selectedVoucherAmount || 0}}</span>\r\n                <span *ngIf=\"this.couponValueType === 'PERCENTAGE'\"> {{selectedVoucherPercentage || 0}}%</span>\r\n              </div>\r\n\r\n            </div>\r\n          </div>\r\n          <div class=\"remove-coupon-btn fs-14 fw-500 text-secondary cursor-pointer\"\r\n            (click)=\"removeRedemptionCoupon($event)\">Remove</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n        <div class=\"delivery-header\">\r\n          <mat-icon>gps_fixed</mat-icon>\r\n          <span>Delivering to</span>\r\n          <span class=\"pincode\">{{pincode}}</span>\r\n          <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"summary-section\">\r\n        <div class=\"summary-title\">Summary</div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Subtotal</span>\r\n          <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalNetValue ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && referEarnExist && isPointsRedeeming\">\r\n          <span class=\"summary-label\">Points Redeemed</span>\r\n          <span class=\"summary-value\">- \u20B9{{ totalSavingAmt || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'AMOUNT' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ selectedVoucherAmount || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'PERCENTAGE' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ percentageReduced || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount\">\r\n          <span class=\"summary-label\">Discount Amount</span>\r\n          <span class=\"summary-value\">\r\n            {{('\u20B9' + (responseData?.billdetails?.discountAmount | number: '1.0-2')) }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Shipping</span>\r\n          <span class=\"summary-value\"\r\n            [ngClass]=\"{'savings': !responseData?.billdetails?.deliveryCharges || responseData.billdetails.deliveryCharges <= 0}\">\r\n            {{ (responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0) ? ('\u20B9' +\r\n            (responseData.billdetails.deliveryCharges | number: '1.0-2')) : 'Free' }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Estimated Tax</span>\r\n          <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Total</span>\r\n          <!-- <span class=\"summary-value\">\u20B9{{ responseData?.totalAmount | number: '1.0-2' }}</span> -->\r\n          <span class=\"total-value\" *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{ responseData?.totalAmount |\r\n            number: '1.0-2' }}</span>\r\n\r\n          <span class=\"total-value\" *ngIf=\"isPointsRedeeming\">\u20B9{{ (responseData?.totalAmount - (totalSavingAmt || 0)) |\r\n            number: '1.0-2' }}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (percentageReduced || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n      <button class=\"place-order-btn\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n      <button class=\"place-order-btn mt-0\" (click)=\"edit ? '' : proceedToCheckout()\" simpoButtonDirective\r\n        *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n        Cart'}}</button>\r\n\r\n    </div>\r\n  </div>\r\n  <!-- <ng-container *ngIf=\"recommededData?.length\">\r\n    <simpo-featured-products [edit]=\"false\" [data]=\"featureProductData\"\r\n      [responseData]=\"recommededData\"></simpo-featured-products>\r\n  </ng-container> -->\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n  <div class=\"checkout-left-panel\">\r\n    <div class=\"checkout-main-content\">\r\n      <!-- <div class=\"delivery-options\">\r\n        <div class=\"delivery-option active\">\r\n          <div class=\"delivery-icon\"></div>\r\n          HOME DELIVERY\r\n        </div>\r\n        <div class=\"delivery-option\">\r\n          <div class=\"delivery-icon\"></div>\r\n          STORE PICK-UP\r\n        </div>\r\n      </div> -->\r\n\r\n      <div class=\"section-title\">Shipping Address</div>\r\n\r\n      <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n        <div class=\"address-info\">\r\n          <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n          <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n            {{defaultAddress?.stateName}}</div>\r\n          <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n        <mat-icon>add</mat-icon>\r\n      </div>\r\n\r\n      <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n      <button class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective\r\n        *ngIf=\"defaultAddress && !placeOrderLoader\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">\r\n        Place Order\r\n      </button>\r\n      <button class=\"btn w-100 mt-1 payment-btn\" simpoButtonDirective *ngIf=\"defaultAddress && placeOrderLoader\"\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\">\r\n        Loading...\r\n      </button>\r\n\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"checkout-right-panel\">\r\n    <div class=\"order-summary\">\r\n      <div class=\"summary-title\">Order Summary</div>\r\n\r\n      <div class=\"checkout-product\">\r\n        <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n            alt=\"\">\r\n          <div class=\"product-details\">\r\n            <div class=\"product-name\">{{item.itemName}}</div>\r\n            <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n            <div class=\"product-price\">\u20B9{{(item.sellingPrice * item.quantity) | number: '1.0-2'}}</div>\r\n          </div>\r\n        </div>\r\n\r\n      </div>\r\n\r\n      <div class=\"price-breakdown\">\r\n        <div class=\"price-row\">\r\n          <span>Total Price</span>\r\n          <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n            ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\">\r\n          <span>Total Tax</span>\r\n          <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n          <span class=\"summary-label\">Redeem Amount</span>\r\n          <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"price-row discount\" *ngIf=\"responseData?.billdetails?.discountAmount && !isJewellery\">\r\n          <span>Coupon Discount</span>\r\n          <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n            | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <span>Delivery Charge</span>\r\n          <span>{{responseData.billdetails.deliveryCharges\r\n            |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row total\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span>TOTAL AMOUNT</span>\r\n          <span *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{(responseData?.totalAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"isPointsRedeeming\">\u20B9{{(responseData?.totalAmount - (totalSavingAmt || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (responseData?.totalAmount * (selectedVoucherPercentage / 100) || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n  <div class=\"cart-item\" *ngFor=\"let item of products\" [style.color]=\"fontColor\">\r\n    <div class=\"item-left\">\r\n      <button type=\"button\" class=\"video-select-checkbox\" *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\"\r\n        [class.checked]=\"isVideoSelected(item)\" (click)=\"toggleVideoSelection(item)\">\r\n        <mat-icon *ngIf=\"isVideoSelected(item)\">check</mat-icon>\r\n      </button>\r\n      <div class=\"item-image\">\r\n        <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n          (click)=\"goToProductDetails(item)\" style=\"cursor: pointer;\">\r\n      </div>\r\n      <div class=\"item-details\">\r\n        <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n        <div class=\"item-subtitle\" *ngIf=\"item.itemVariant\">\r\n          <span *ngFor=\"let varient of getKeys(item.itemVariant.properties); let last = last\">\r\n            {{ item.itemVariant.properties[varient] | titlecase }}<span *ngIf=\"!last\">, </span>\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"item-right\">\r\n      <div class=\"quantity-control\" *ngIf=\"cartType === 'SHOPPING'\">\r\n        <button class=\"qty-btn px-2\" (click)=\"decreaseQty(item)\" [disabled]=\"item.quantity === 1\">\r\n          <mat-icon>remove</mat-icon>\r\n        </button>\r\n        <span class=\"qty-value px-3\">{{item.quantity}}</span>\r\n        <button class=\"qty-btn px-2\" (click)=\"increaseQty(item)\">\r\n          <mat-icon>add</mat-icon>\r\n        </button>\r\n      </div>\r\n\r\n      <div class=\"item-price\">\r\n        \u20B9{{item.sellingPrice | number: '1.0-2'}}\r\n      </div>\r\n\r\n      <div class=\"delete-btn-circle\" (click)=\"removeItem(item)\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\r\n          stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-trash-2\">\r\n          <path d=\"M3 6h18\" />\r\n          <path d=\"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6\" />\r\n          <path d=\"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2\" />\r\n          <line x1=\"10\" x2=\"10\" y1=\"11\" y2=\"17\" />\r\n          <line x1=\"14\" x2=\"14\" y1=\"11\" y2=\"17\" />\r\n        </svg>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n  <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n    <div class=\"empty-cart-container d-flex flex-column\">\r\n      <div class=\"cart-image\">\r\n        <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n          [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n          [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n      </div>\r\n      <div class=\"cart-text content-side\">\r\n        <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n          <div class=\"d-flex justify-content-center\"\r\n            [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n            <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\" [isRTE]=\"text.isRTE\"></simpo-text-editor>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <button class=\"place-order-btn mx-auto w-fit\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n  <div class=\"modal-body\">\r\n    <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n      [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n      <label for=\"individual\" class=\"scheme-card\">\r\n        <div class=\"scheme-info d-flex gap-1\">\r\n          <div class=\"form-check-radio\">\r\n            <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n          </div>\r\n          <div class=\"right-side\">\r\n            <div class=\"scheme-name\">\r\n              <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n              <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n            </div>\r\n            <div class=\"scheme-details\">\r\n              <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n              <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n            </div>\r\n            <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n          </div>\r\n        </div>\r\n      </label>\r\n    </div>\r\n    <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n      Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n    </div>\r\n  </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{background:#fff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.cart-header{padding:16px 24px;border-bottom:1px solid #e2e8f0;background:#f8fafc}.cart-header h2{margin:0;font-size:18px;font-weight:500;color:#0f172a}.cart-item{display:flex!important;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0;gap:20px;padding:0 8px;transition:background .2s}.cart-item:hover{background:#fbfcfe}.item-left{display:flex;align-items:center;flex:1}.item-right{display:flex;align-items:center;padding:15px;gap:32px}.item-image img{width:64px;height:64px;border-radius:12px;object-fit:cover;border:1px solid #f1f5f9}.item-details{display:flex;flex-direction:column;gap:4px}.item-title{margin:0;font-size:15px;font-weight:600;color:#0f172a;line-height:1.4}.item-subtitle{font-size:13px;color:#64748b;font-weight:400}.quantity-control{display:flex;align-items:center;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden;height:38px;background:#fff;width:fit-content}.qty-btn{width:38px;height:100%;border:none;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#475569;transition:all .2s ease}.qty-btn:hover{background:#f8fafc;color:#0f172a}.qty-btn mat-icon{font-size:16px;width:16px;height:16px;display:flex;align-items:center;justify-content:center}.qty-value{width:32px;height:100%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;color:#0f172a;border-left:1.5px solid #e2e8f0;border-right:1.5px solid #e2e8f0}.item-price{font-size:18px;font-weight:700;color:#0f172a;min-width:60px;text-align:right;letter-spacing:-.01em}.delete-btn-circle{width:36px;height:36px;border-radius:50%;border:1px solid #fee2e2;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ef4444;transition:all .2s ease}.delete-btn-circle:hover{background:#fef2f2;border-color:#fecaca;transform:scale(1.05);color:#dc2626}.delete-btn-circle svg{width:18px;height:18px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;width:100%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.fs-12{font-size:12px}.fs-18{font-size:18px}.b-1-b{border-width:0px 1px;border-style:solid;border-color:#000}.container{max-width:unset;padding:24px;display:flex;gap:24px;width:100%!important}.main-content{background:#fff;border-radius:12px;width:70%}.promo-banner{padding:16px 20px;display:flex;flex-direction:column;gap:10px;border-radius:8px;border:1px solid #e2e8f0}.promo-banner-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.promo-text h3{font-size:16px!important;font-weight:500;margin-bottom:4px}.promo-text p{font-size:.9rem!important;margin-bottom:0!important;color:#64748b}.see-live-btn{background:#fff;border:1px solid #e2e8f0;font-weight:600;color:#000;padding:8px 16px;border-radius:8px;font-size:12px!important;cursor:pointer;display:flex;align-items:center;gap:8px;width:max-content!important;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.see-live-btn:hover{background:#f8fafc;border-color:#cbd5e1;transform:translateY(-1px)}.see-live-btn:disabled{color:#94a3b8;cursor:not-allowed;box-shadow:none}.see-live-btn:disabled:hover{background:#fff;border-color:#e2e8f0;transform:none}.see-live-btn svg{color:#6366f1}.video-selection-line{font-size:.8rem;color:#64748b}.video-cart-hint{font-size:.8rem;color:#6366f1;cursor:pointer;text-decoration:underline;width:max-content}.video-select-checkbox{width:20px;height:20px;flex:none;border:1.5px solid #cbd5e1;border-radius:5px;background:#fff;cursor:pointer;display:grid;place-items:center;padding:0;margin-right:10px}.video-select-checkbox.checked{background:#6366f1;border-color:#6366f1}.video-select-checkbox mat-icon{color:#fff!important;font-size:14px!important;height:14px!important;width:14px!important}.cart-item{display:flex;gap:16px;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:15%;height:100px;border-radius:8px;object-fit:cover;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-weight:500;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px}.current-price{font-size:1rem;font-weight:600}.original-price{font-size:1rem;text-decoration:line-through}.discount{background:#fef3c7;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:32%}.coupon-section{border-radius:8px;padding:10px 15px;border:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all .2s ease}.coupon-section:hover{border-color:#cbd5e1;background-color:#f8fafc}.chevron-icon{color:#94a3b8;transition:transform .2s ease}.coupon-section:hover .chevron-icon{transform:translate(2px);color:#64748b}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.coupon-icon mat-icon{font-size:17px;width:17px!important;height:19px!important}.coupon-text{font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:8px;padding:20px;border:1px solid #e2e8f0}.summary-title{font-size:16px;font-weight:700;color:#0f172a;margin-bottom:20px;letter-spacing:-.01em}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.summary-row:last-child{margin-bottom:0}.summary-label{font-size:14px;font-weight:400;color:#64748b}.summary-value{font-size:14px;font-weight:500;color:#0f172a}.summary-divider{height:1px;background:#f1f5f9;margin:16px 0;width:100%}.total-row .summary-label{font-size:16px;font-weight:600;color:#0f172a}.total-row .summary-value{font-size:16px;font-weight:700;color:#0f172a}.total-row{border-top:1px solid #e2e8f0;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px}.total-value{font-weight:700;font-size:18px}.place-order-btn{background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;align-items:center;width:max-content;border-radius:8px;border:1px solid #e2e8f0}.cart-tabs div{padding:7px 10px;cursor:pointer;font-size:14px}.selected-cart-tab{margin:6px;background:#f1f5f9;border-radius:5px;color:#000!important;font-weight:500}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.cart-item{flex-direction:column!important;align-items:flex-start!important;padding:16px 12px!important;gap:16px!important}.item-left{width:100%!important;gap:16px!important;align-items:flex-start!important}.item-image{width:86px!important;height:86px!important;flex-shrink:0!important}.item-right{width:100%!important;justify-content:space-between!important;padding:0!important;gap:12px!important;margin-top:4px!important}.item-price{flex:1!important;text-align:right!important;margin-right:8px!important;font-size:16px!important}.item-title{font-size:14px!important;-webkit-line-clamp:2!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.quantity-control{height:34px!important}.qty-btn{width:34px!important}.qty-value{width:28px!important;font-size:13px!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}.vouchers-listing-section{min-width:unset!important;width:100vw!important}.separator{display:none!important}.coupon-meta{display:grid!important;grid-template-columns:1fr 1fr!important}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.w-fit{width:fit-content!important}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}.add-to-cart-parent{width:max-content;border:1px solid #000000;border-radius:8px}.cursor{cursor:pointer}.cart-text{max-width:600px;margin:0 auto;text-align:center}.cart-text div{word-break:break-word;overflow-wrap:break-word;white-space:normal}.switch{position:relative;display:inline-block;width:45px;height:20px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.4s;border-radius:34px}.slider:before{position:absolute;content:\"\";height:16px;width:16px;left:3px;bottom:2px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#4caf50}input:checked+.slider:before{transform:translate(24px)}.vouchers-listing-section{position:relative;width:fit-content;min-width:500px;z-index:100;background:#fff;height:100vh}.vouchers-listing-section .coupon-heading{border-bottom:1px solid #eee}.vouchers-listing-section .coupon-listing{padding:12px 16px;overflow-y:auto;height:calc(97vh - 100px)}.voucher-details{background:#fff;border-radius:12px;padding:14px;box-shadow:0 1px 4px #00000042}.voucher-details .coupon-brief .apply-offer-btn{background:#111;color:#fff;border-radius:10px;padding:6px 16px}.voucher-details .coupon-code-box{border:1.5px dashed #bbb;border-radius:8px;padding:8px 12px;margin-bottom:10px}.voucher-details .coupon-code-box .code-label{font-size:11px;color:#888;margin-bottom:2px}.voucher-details .coupon-code-box .code-row .code-value{font-weight:700;font-size:15px;letter-spacing:1px}.voucher-details .coupon-meta .clock-icon{font-size:14px;height:14px;width:14px;vertical-align:middle}.applied-coupon-card{background:#f0fff8;border-radius:12px;padding:12px 16px}.applied-coupon-card .applied-coupon-left .success-check{color:#22c55e;font-size:22px}.applied-coupon-card .applied-coupon-left .applied-coupon-code{font-weight:700;font-size:14px}.applied-coupon-card .applied-coupon-left .applied-coupon-saving{font-size:13px;color:#097d5f;margin-top:2px}.active-type{background:#111!important;color:#fff!important}.redemption-type{text-align:center;border-radius:10px;padding:6px 16px;background:#d3d3d36b;width:-webkit-fill-available!important}.wallte_icon{background:#000;border-radius:50px;padding:5px 9px 7px}.wallte_icon img{width:18px;height:18px}.fw-600{font-weight:600}.coupon-type{width:fit-content!important;border-radius:26px!important;background:transparent!important;border:1px solid #afafaf;color:#393838;text-align:center;padding:6px 16px}.active-coupon{background:transparent!important;border:2px solid black!important;color:#000!important}.my-close-btn{position:absolute!important;top:10px!important;right:10px!important}\n"] }]
+                    ], providers: [MessageService], template: "<ng-container *ngIf=\"!isLoading\">\r\n  <p-toast position=\"bottom-right\" [baseZIndex]=\"10000000000\" [autoZIndex]=\"true\"\r\n    [showTransformOptions]=\"isMobile ? 'translateY(-100%)' : ''\"></p-toast>\r\n\r\n  <ng-container *ngIf=\"data\">\r\n    <section [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [id]=\"data?.id\"\r\n      [attr.class]=\"isMobile ? 'py-5 position-relative' : 'position-relative'\" simpoHover\r\n      (hovering)=\"showEditTabs($event)\" [attr.style]=\"customClass\"\r\n      [ngClass]=\"!responseData?.orderedItems?.length ? 'no-items' : ''\">\r\n      <div class=\"d-flex align-items-center justify-content-center m-auto mb-4\"\r\n        [style.marginTop.px]=\"isMobile ? '': '50'\" [style.width.%]=\"isMobile ? '90' : ''\"\r\n        *ngIf=\"responseData?.orderedItems?.length && currentTab === 'ADDRESS'\">\r\n        <span class=\"timeline\" (click)=\"currentTab = 'BAG'\">Bag</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline isActive\">Address</span>\r\n        <div class=\"bar\"></div>\r\n        <span class=\"timeline\" style=\"cursor: auto;\">Payment</span>\r\n      </div>\r\n      <div class=\"cart-tab-parent w-100\" *ngIf=\"currentTab == 'BAG' && ecomConfigs?.appointmentBookingEnabled\">\r\n        <!-- && ecomConfigs?.appointmentBookingEnabled\" -->\r\n        <div class=\"cart-tabs\" [id]=\"data?.id\">\r\n          <div class=\"selected-cart-tab\" [ngClass]=\"{'selected-cart-tab': cartType==='SHOPPING'}\"\r\n            (click)=\"cartType='SHOPPING'\">Shopping Cart ({{responseData?.orderedItems?.length ?? 0}})</div>\r\n          <div [ngClass]=\"{'selected-cart-tab': cartType==='BOOKING'}\" (click)=\"cartType='BOOKING'\">Booking Cart\r\n            ({{getTotalBookingItems}})</div>\r\n        </div>\r\n      </div>\r\n      <div class=\"cart-parent\" [spacingHorizontal]=\"stylesLayout\" *ngIf=\"currentTab === 'BAG'\" [id]=\"data?.id\"\r\n        [simpoAnimation]=\"styles?.animation\">\r\n        <ng-container>\r\n          <ng-container *ngIf=\"cartType === 'SHOPPING'\">\r\n            <ng-container\r\n              *ngTemplateOutlet=\"(responseData?.orderedItems?.length || 0) > 0 ? CARTPAGE : EMPTYITEM\"></ng-container>\r\n          </ng-container>\r\n          <ng-container *ngIf=\"cartType === 'BOOKING'\">\r\n            <div class=\"w-100\">\r\n              <simpo-booking-cart-groups></simpo-booking-cart-groups>\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"d-flex checkoutPage\"\r\n        *ngIf=\"(responseData?.orderedItems?.length || 0) > 0 && currentTab === 'ADDRESS'\">\r\n        <ng-container *ngTemplateOutlet=\"CHECKOUTPAGE\">\r\n        </ng-container>\r\n      </div>\r\n\r\n\r\n      <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n        <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"\r\n          [isEcommerce]=\"true\"></simpo-hover-elements>\r\n      </div>\r\n      <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n        <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n      </div>\r\n\r\n    </section>\r\n\r\n    <div class=\"schedule-panel-overlay\" *ngIf=\"schedulePanelOpen\">\r\n      <button type=\"button\" class=\"schedule-panel-backdrop\" (click)=\"closeSchedulePanel()\"></button>\r\n      <div class=\"schedule-panel\">\r\n        <div class=\"schedule-panel-header\">\r\n          <div>\r\n            <div class=\"schedule-panel-title\">Schedule a Video Call</div>\r\n            <div class=\"schedule-panel-subtitle\">Choose which pieces to include</div>\r\n          </div>\r\n          <button type=\"button\" class=\"schedule-panel-close\" (click)=\"closeSchedulePanel()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n        <div class=\"schedule-panel-body\">\r\n          <button type=\"button\" class=\"schedule-panel-row\" *ngFor=\"let item of responseData?.orderedItems\"\r\n            [class.selected]=\"isPanelSelected(item)\" (click)=\"togglePanelSelection(item)\">\r\n            <div class=\"schedule-panel-checkbox\" [class.checked]=\"isPanelSelected(item)\">\r\n              <mat-icon *ngIf=\"isPanelSelected(item)\">check</mat-icon>\r\n            </div>\r\n            <img class=\"schedule-panel-thumb\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\">\r\n            <div class=\"schedule-panel-info\">\r\n              <div class=\"schedule-panel-name\">{{item.itemName}}</div>\r\n            </div>\r\n          </button>\r\n        </div>\r\n        <div class=\"schedule-panel-footer\">\r\n          <div class=\"schedule-panel-selection-line\">{{panelSelectionLine}}</div>\r\n          <button type=\"button\" class=\"schedule-panel-cta\" [disabled]=\"panelInvalid\" (click)=\"confirmSchedulePanel()\">Continue</button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!data\">\r\n    <section class=\"cart-window\">\r\n      <div class=\"heading-large lh-2 mb-3 header-sec\">\r\n        <div class=\"d-flex align-items-center\">\r\n          <mat-icon (click)=\"closeWindow()\">keyboard_arrow_left</mat-icon>\r\n          <span>Your Cart</span>\r\n        </div>\r\n        <div class=\"saving\"></div>\r\n      </div>\r\n      <div class=\"offers\">\r\n        <div class=\"d-flex align-items-center\" style=\"gap: 5px;\">\r\n          <img src=\"https://i.postimg.cc/htY55sqY/discount.png\" alt=\"\" height=\"20\" width=\"20\">\r\n          <span>Avail Offers / Coupons</span>\r\n        </div>\r\n        <mat-icon>keyboard_arrow_right</mat-icon>\r\n      </div>\r\n      <div class=\"small-items\">\r\n        <ng-container *ngFor=\"let item of responseData?.orderedItems\">\r\n          <div class=\"small-item\">\r\n            <div class=\"d-flex\" style=\"gap: 5px;\">\r\n              <div class=\"h-100\" style=\"padding: 0px; width: fit-content;\">\r\n                <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n                  class=\"small-product-img\"\r\n                  [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n                  (click)=\"goToProductDetails(item)\">\r\n              </div>\r\n              <div class=\"small-item-name trim-text\">{{ item.itemName | titlecase }}</div>\r\n              <div class=\"small-item-quantity\">\r\n                <span class=\"cursor\">-</span>\r\n                <span>{{item.quantity}}</span>\r\n                <span class=\"cursor\">+</span>\r\n              </div>\r\n              <div class=\"small-item-price\">\r\n                <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.sellingPrice) | number: '1.0-2'}}\r\n                </div>\r\n                <!-- <div class=\"price-with-tax\">\r\n                  <span [innerHTML]='currency'></span> {{(item.selling) | number: '1.0-2'}}\r\n                </div> -->\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <div class=\"fotter-sec\">\r\n        <div class=\"delivery-add d-flex\">\r\n          <mat-icon>home</mat-icon>\r\n          <div class=\"address\">Tetsting</div>\r\n        </div>\r\n        <button class=\"payment-btn\" [disabled]=\"cartInfo.addressDetails\" (click)=\"proceedToCheckout()\"> <span\r\n            style=\"margin-right: 5px;\">Click to Pay</span> <span [innerHtml]='currency'></span>\r\n          {{(responseData?.totalAmount ?? 0) | number: '1.0-2'}}</button>\r\n      </div>\r\n    </section>\r\n  </ng-container>\r\n</ng-container>\r\n\r\n<ngx-skeleton-loader *ngIf=\"isLoading\" count=\"1\" appearance=\"circle\" [theme]=\"{\r\n  width: '100%',\r\n  height: '40vh',\r\n  'border-radius': '10px',\r\n  'position': 'relative',\r\n  'right': '5px'\r\n}\">\r\n</ngx-skeleton-loader>\r\n\r\n<ng-template #CouponList>\r\n  <section class=\"coupons-listing-section\">\r\n    <div class=\"coupon-heading\">\r\n      <div class=\"back-btn\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Apply Coupon</div>\r\n    </div>\r\n    <!-- <div class=\"coupon-search-sec\">\r\n      <input type=\"text\" placeholder=\"Type Coupon Code\" [(ngModel)]=\"enteredCouponCode\">\r\n      <div class=\"apply-btn-search\" (click)=\"searchIfApplicable()\">Apply</div>\r\n    </div> -->\r\n    <div class=\"coupon-listing\">\r\n      <ng-container *ngIf=\"couponList.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n          <div class=\"coupon-details\"\r\n            [ngStyle]=\"{'background-color': !couponDetails.applicable ? '#FFF2F4' : '#EDFFFA'}\"\r\n            *ngIf=\"couponDetails?.status\">\r\n            <div class=\"details__coupon-heading\">\r\n              <div class=\"coupon-brief\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name\" [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}</div>\r\n                  <div class=\"coupon-desc\">{{ couponDetails.discountDescription | titlecase }}</div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn\" [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : ''}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">Apply</div>\r\n                </div>\r\n              </div>\r\n              <!-- <div class=\"coupon-toggle-details-btn\" (click)=\"couponDetails.status = !couponDetails.status\">\r\n                <span class=\"hide-details-btn\" *ngIf=\"couponDetails.status\">Hide details</span>\r\n                <div class=\"show-details-btn\" *ngIf=\"!couponDetails.status\">View details</div>\r\n              </div> -->\r\n            </div>\r\n            <ng-container>\r\n              <!-- *ngIf=\"couponDetails.status\" -->\r\n              <div class=\"details-divider\"></div>\r\n              <ul class=\"details__coupon-terms\">\r\n                <li>Offer valid from {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}</li>\r\n              </ul>\r\n            </ng-container>\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupon Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #RedemptionVouchers>\r\n  <section class=\"vouchers-listing-section d-flex flex-column\">\r\n    <div class=\"coupon-heading d-flex align-items-center gap-2 p-3 fs-18 fw-600 border-bottom\">\r\n      <div class=\"back-btn cursor-pointer d-flex align-items-center\" (click)=\"closeDialogRef()\">\r\n        <mat-icon>keyboard_arrow_left</mat-icon>\r\n      </div>\r\n      <div class=\"header-text\">Coupons & Vouchers</div>\r\n    </div>\r\n\r\n    <!-- <div class=\"d-flex align-items-center tab-container justify-content-between gap-2 p-3\">\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'COUPONS'}\"\r\n        (click)=\"redemptionType = 'COUPONS'\">\r\n        Coupons\r\n      </div>\r\n      <div class=\"redemption-type fs-16 fw-500 cursor-pointer\" [ngClass]=\"{'active-type': redemptionType === 'VOUCHERS'}\"\r\n        (click)=\"redemptionType = 'VOUCHERS'\">\r\n        Vouchers\r\n      </div>\r\n    </div> -->\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3 pt-3\" *ngIf=\"redemptionType === 'COUPONS'\">\r\n      <div class=\"d-flex align-items-center tab-container gap-3\">\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'REWARDS'}\" (click)=\"redemptionCouponType = 'REWARDS'\">\r\n          Rewards\r\n        </div>\r\n        <div class=\"coupon-type fs-16 fw-500 cursor-pointer\"\r\n          [ngClass]=\"{'active-coupon': redemptionCouponType === 'DISCOUNTS'}\"\r\n          (click)=\"redemptionCouponType = 'DISCOUNTS'\">\r\n          Discounts\r\n        </div>\r\n      </div>\r\n      <ng-container *ngIf=\"redemptionCouponType === 'REWARDS'\">\r\n        <ng-container *ngIf=\"(listRedemptionCoupons?.vouchers?.length > 0) ; else showEmptyScreen\">\r\n          <ng-container *ngFor=\"let voucher of listRedemptionCoupons?.vouchers; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%'\r\n                    }}\r\n                    off on your payment\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">\r\n                    Apply</div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n                <span class=\"separator text-secondary\">|</span>\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n                </span>\r\n                <span class=\"separator text-secondary\" *ngIf=\"voucher.maxRedeemableAmount\">|</span>\r\n                <span class=\"min-order\" *ngIf=\"voucher.maxRedeemableAmount\">Max Redeemable Amount: \u20B9{{\r\n                  voucher.maxRedeemableAmount | number }}</span>\r\n              </div>\r\n\r\n              <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"redemptionCouponType === 'DISCOUNTS'\">\r\n        <ng-container *ngIf=\"(couponList.length > 0); else showEmptyDiscounts\">\r\n          <ng-container *ngFor=\"let couponDetails of couponList; let idx = index\">\r\n            <div class=\"voucher-details\" *ngIf=\"couponDetails?.status\">\r\n\r\n              <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n                <div class=\"coupon-brief__left-sec\">\r\n                  <div class=\"coupon-name fs-16 fw-600 mb-1\"\r\n                    [ngStyle]=\"{'color': !couponDetails.applicable ? '#DB1A1A' : '#097D5F'}\">\r\n                    {{ couponDetails.couponCode | uppercase }}\r\n                  </div>\r\n                  <div class=\"coupon-desc fs-12 text-secondary\">\r\n                    {{ couponDetails.discountDescription | titlecase }}\r\n                  </div>\r\n                </div>\r\n                <div class=\"coupon-brief__right-sec\">\r\n                  <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\"\r\n                    [style.opacity]=\"couponDetails.applicable ? '1' : '0.3'\"\r\n                    [ngStyle]=\"{'cursor': couponDetails.applicable ? 'pointer' : 'not-allowed'}\"\r\n                    (click)=\"applyCoupon(couponDetails)\">\r\n                    Apply\r\n                  </div>\r\n                </div>\r\n              </div>\r\n\r\n              <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n                <div class=\"code-label\">Code</div>\r\n                <div class=\"code-value\">{{ couponDetails.couponCode | uppercase }}</div>\r\n              </div>\r\n\r\n              <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n                <span class=\"validity\">\r\n                  <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                  {{ couponDetails.validFrom | date }} - {{ couponDetails.validTo | date }}\r\n                </span>\r\n              </div>\r\n\r\n            </div>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyDiscounts>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Discount Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">\r\n            Looks like there are no discount coupons at the moment\r\n          </div>\r\n          <!-- <div class=\"empty-screen__button\">Explore</div> -->\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Coupons Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no coupons</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n\r\n    <div class=\"coupon-listing d-flex flex-column gap-3\" *ngIf=\"redemptionType === 'VOUCHERS'\">\r\n      <ng-container *ngIf=\"listRedemptionVouchers?.vouchers?.length > 0; else showEmptyScreen\">\r\n        <ng-container *ngFor=\"let voucher of listRedemptionVouchers?.vouchers; let idx = index\">\r\n          <div class=\"voucher-details\" *ngIf=\"!voucher.utilised\">\r\n\r\n            <div class=\"coupon-brief d-flex justify-content-between align-items-start mb-3\">\r\n              <div class=\"coupon-brief__left-sec\">\r\n                <div class=\"coupon-name fs-16 fw-600 mb-1\">{{ voucher.voucherName }}</div>\r\n                <div class=\"coupon-desc fs-12 text-secondary\">\r\n                  Get {{ voucher.couponValueType === 'FIXED' ? '\u20B9' + voucher.couponValue : voucher.couponValue + '%' }}\r\n                  off on your payment\r\n                </div>\r\n              </div>\r\n              <div class=\"coupon-brief__right-sec\">\r\n                <div class=\"apply-offer-btn fs-12 fw-600 cursor-pointer\" (click)=\"applyRedemptionCoupon(voucher)\">Apply\r\n                </div>\r\n              </div>\r\n            </div>\r\n\r\n            <div class=\"coupon-code-box d-flex align-items-center gap-3\">\r\n              <div class=\"code-label\">Code</div>\r\n              <div class=\"code-value\">{{ voucher.voucherCode }}</div>\r\n            </div>\r\n\r\n            <div class=\"coupon-meta d-flex align-items-center gap-2 fs-12 text-secondary mb-2\">\r\n              <span class=\"min-order\">Min: \u20B9{{ voucher.minOrderValue | number }}</span>\r\n              <span class=\"separator text-secondary\">|</span>\r\n              <span class=\"validity\">\r\n                <mat-icon class=\"clock-icon\">schedule</mat-icon>\r\n                Until {{ voucher.issuedDate | date: 'MMM dd, yyyy' }}\r\n              </span>\r\n            </div>\r\n\r\n            <!-- <div class=\"terms-link\">View terms & conditions</div> -->\r\n          </div>\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <ng-template #showEmptyScreen>\r\n        <div class=\"empty-screen-container\">\r\n          <img loading=\"lazy\" src=\"../../../../../assets/common/coupon-empty-img.svg\" alt=\"\">\r\n          <div class=\"empty-screen__primary-text\">No Vouchers Available</div>\r\n          <div class=\"empty-screen__secondary-text\">Looks like there are no vouchers</div>\r\n        </div>\r\n      </ng-template>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #CARTPAGE>\r\n  <div class=\"container\">\r\n    <div class=\"main-content\">\r\n      <div class=\"cart-items\">\r\n        <div class=\"cart-header\">\r\n          <h2>Your Cart</h2>\r\n        </div>\r\n        <ng-container\r\n          *ngTemplateOutlet=\"CARTITEM;context:{data: responseData?.orderedItems}\"></ng-container>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"sidebar\">\r\n      <div class=\"reedem-section d-flex flex-column align-items-center\" *ngIf=\"getUrl()\">\r\n        <div class=\"justify-content-between d-flex align-items-center w-100 redeem-section-text\">Redeem Section Amount\r\n          <div class=\"toogle-switch\">\r\n            <div class=\"form-check form-switch\">\r\n              <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" role=\"switch\" id=\"flexSwitchCheckChecked\"\r\n                [checked]=\"selectMatureScheme\" (change)=\"onToggleChange()\">\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <!-- <div class=\"select_matured_text  w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectMatureScheme && !selectedRedemption\" (click)=\"selectScheme()\">\r\n          Select Matured Scheme\r\n        </div> -->\r\n        <!-- <div class=\"select_matured_text d-flex flex-column gap-2 w-100 text-start cursor-pointer\"\r\n          *ngIf=\"selectedRedemption\">\r\n          Selected Scheme\r\n          <div class=\"d-flex w-100 justify-content-between align-items-center group_invest\">Group Investment\r\n            scheme-5000/M <span>Change</span></div>\r\n          <div class=\"d-flex justify-content-between align-items-center w-100 redeem_amount\">Redeemable Amount\r\n            <span>\u20B9{{selectedRedmpationData.selectedAmount}}</span>\r\n          </div>\r\n        </div> -->\r\n      </div>\r\n      <div class=\"scheme-section\" *ngIf=\"selectMatureScheme\">\r\n        <ng-container *ngTemplateOutlet=\"SCHEME_REDEMPTION\"></ng-container>\r\n      </div>\r\n      <div class=\"coupon-section\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && !referEarnExist\">\r\n        <div class=\"coupon-left\">\r\n          <div class=\"coupon-icon\"><mat-icon>percent</mat-icon></div>\r\n          <span class=\"coupon-text\" *ngIf=\"!responseData.billdetails?.couponId\">Apply\r\n            Coupon</span>\r\n          <span class=\"coupon-text\" *ngIf=\"responseData.billdetails?.couponId\">Coupon\r\n            Applied</span>\r\n        </div>\r\n        <svg *ngIf=\"!responseData.billdetails?.couponId\" xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\"\r\n          viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\"\r\n          stroke-linejoin=\"round\" class=\"chevron-icon\" (click)=\"openDialog(CouponList)\">\r\n          <path d=\"m9 18 6-6-6-6\" />\r\n        </svg>\r\n        <span *ngIf=\"responseData.billdetails?.couponId\"\r\n          (click)=\"removeCoupon($event)\"><mat-icon>close</mat-icon></span>\r\n      </div>\r\n\r\n      <div class=\"promo-banner mb-3\" [id]=\"data?.id\" *ngIf=\"cartType === 'SHOPPING' && ecomConfigs?.videoCallEnabled\">\r\n        <div class=\"promo-banner-row\">\r\n          <div class=\"promo-text\">\r\n            <h3>See It Before You Buy It</h3>\r\n            <p>Experience our designs in detail via video call</p>\r\n          </div>\r\n          <button class=\"see-live-btn\" [disabled]=\"!hasCartItems\" (click)=\"openSchedulePanel()\">\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n              stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\r\n              class=\"lucide lucide-video\">\r\n              <path d=\"m22 8-6 4 6 4V8Z\" />\r\n              <rect width=\"14\" height=\"12\" x=\"2\" y=\"6\" rx=\"2\" ry=\"2\" />\r\n            </svg>\r\n            CONTINUE TO SCHEDULE\r\n          </button>\r\n        </div>\r\n        <div class=\"video-selection-line\">{{videoSelectionLine}}</div>\r\n        <a class=\"video-cart-hint\" *ngIf=\"videoCartCount > 0\" (click)=\"viewPendingVideoCart()\">{{videoCartCount}}\r\n          item{{videoCartCount === 1 ? '' : 's'}} waiting in your Video Call cart \u2014 view it</a>\r\n      </div>\r\n\r\n      <div class=\"plan-details-container p-3 rounded-4 bg-white text-dark voucher-details\"\r\n        *ngIf=\"referEarnExist && this?.redemptionPoints?.availablePoints > 0\">\r\n        <div class=\"fs-14 fw-500\">\r\n          Rewards Available\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-start border-bottom pb-2\">\r\n          <div class=\"avb_pts mt-2 mb-2\">\r\n            <span class=\"fs-16 fw-500 total_points text-secondary\">\r\n              <span class=\" fs-18 fw-600 text-dark\">{{(this?.redemptionPoints?.availablePoints || 0).toFixed(2)}}</span>\r\n              pts\r\n            </span>\r\n            <div class=\"total_value fs-12 text-secondary\">\r\n              = max \u20B9{{(this?.redemptionPoints?.pointsConvertedRupees || 0).toFixed(2)}} discount\r\n            </div>\r\n          </div>\r\n          <div class=\"wallte_icon\">\r\n            <img src=\"https://d2z9497xp8xb12.cloudfront.net/prod-images/777779c1775200561187wallet_(1).png\" alt=\"\">\r\n          </div>\r\n        </div>\r\n        <div class=\"d-flex justify-content-between align-items-center mt-3\">\r\n          <div class=\"redemable_text\">\r\n            <div class=\"title_text\">\r\n              <div class=\"fs-14 fw-500\">\r\n                Redeem Points\r\n              </div>\r\n              <div class=\"fs-13 fs-400\">\r\n                Use your points for discount\r\n              </div>\r\n            </div>\r\n          </div>\r\n          <div class=\"toggle_btn\">\r\n            <label class=\"switch\">\r\n              <input type=\"checkbox\" id=\"toggleSwitch\" [checked]=\"isPointsRedeeming\"\r\n                (click)=\"onPointsRedeemingChange($event)\" />\r\n              <span class=\"slider\"></span>\r\n            </label>\r\n          </div>\r\n        </div>\r\n        <div class=\"mt-3 success_selected w-100 applied-coupon-card\" *ngIf=\"isPointsRedeeming\">\r\n          <div class=\"d-flex align-items-start gap-2\">\r\n            <div class=\"success_icon\">\r\n              <mat-icon class=\"d-flex justify-content-center align-items-center text-success\">check_circle</mat-icon>\r\n            </div>\r\n            <div class=\"success_text\">\r\n              <div class=\"fs-13 fw-500\">\r\n                You're saving \u20B9\r\n                {{totalSavingAmt || 0}}\r\n              </div>\r\n              <div class=\"fs-12 fs-400 text-success\">\r\n                {{totalSavingPoints}} points remaining after redemption\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- Existing coupon row (keep as-is) -->\r\n      <div class=\"coupon-section d-flex flex-column voucher-details\" [id]=\"data?.id\"\r\n        *ngIf=\"cartType === 'SHOPPING' && referEarnExist\">\r\n        <div class=\"d-flex justify-content-between align-items-center w-100\">\r\n          <div class=\"coupon-left\">\r\n            Apply Coupon\r\n          </div>\r\n          <div (click)=\"addRedemptionCoupon(RedemptionVouchers)\">View All</div>\r\n        </div>\r\n\r\n        <!-- Applied Coupon Success Banner -->\r\n        <div class=\"applied-coupon-card w-100 mt-3 d-flex align-items-center justify-content-between\"\r\n          *ngIf=\"selectedVoucherId\">\r\n          <div class=\"applied-coupon-left d-flex align-items-center gap-3\">\r\n            <mat-icon class=\"success-check\">check_circle</mat-icon>\r\n            <div class=\"applied-coupon-info\">\r\n              <div class=\"applied-coupon-code\">Coupon {{ selectedVoucherCode }} applied!</div>\r\n              <div class=\"applied-coupon-saving\">You're saving\r\n                <span *ngIf=\"this.couponValueType === 'AMOUNT'\">\u20B9 {{selectedVoucherAmount || 0}}</span>\r\n                <span *ngIf=\"this.couponValueType === 'PERCENTAGE'\"> {{selectedVoucherPercentage || 0}}%</span>\r\n              </div>\r\n\r\n            </div>\r\n          </div>\r\n          <div class=\"remove-coupon-btn fs-14 fw-500 text-secondary cursor-pointer\"\r\n            (click)=\"removeRedemptionCoupon($event)\">Remove</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"delivery-section\" *ngIf=\"getUrl()\">\r\n        <div class=\"delivery-header\">\r\n          <mat-icon>gps_fixed</mat-icon>\r\n          <span>Delivering to</span>\r\n          <span class=\"pincode\">{{pincode}}</span>\r\n          <!-- <a class=\"change-link\">Change Pincode</a> -->\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"summary-section\">\r\n        <div class=\"summary-title\">Summary</div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Subtotal</span>\r\n          <span class=\"summary-value\">\u20B9{{(responseData?.billdetails?.totalNetValue ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && referEarnExist && isPointsRedeeming\">\r\n          <span class=\"summary-label\">Points Redeemed</span>\r\n          <span class=\"summary-value\">- \u20B9{{ totalSavingAmt || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'AMOUNT' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ selectedVoucherAmount || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\"\r\n          *ngIf=\"cartType === 'SHOPPING' && referEarnExist && (this.couponValueType === 'PERCENTAGE' && appliedVoucher)\">\r\n          <span class=\"summary-label\">Voucher Applied</span>\r\n          <span class=\"summary-value\">- \u20B9{{ percentageReduced || 0 }}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && responseData?.billdetails?.discountAmount\">\r\n          <span class=\"summary-label\">Discount Amount</span>\r\n          <span class=\"summary-value\">\r\n            {{('\u20B9' + (responseData?.billdetails?.discountAmount | number: '1.0-2')) }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Shipping</span>\r\n          <span class=\"summary-value\"\r\n            [ngClass]=\"{'savings': !responseData?.billdetails?.deliveryCharges || responseData.billdetails.deliveryCharges <= 0}\">\r\n            {{ (responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0) ? ('\u20B9' +\r\n            (responseData.billdetails.deliveryCharges | number: '1.0-2')) : 'Free' }}\r\n          </span>\r\n        </div>\r\n\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Estimated Tax</span>\r\n          <span class=\"summary-value\">\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"summary-row total-row\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span class=\"summary-label\">Total</span>\r\n          <!-- <span class=\"summary-value\">\u20B9{{ responseData?.totalAmount | number: '1.0-2' }}</span> -->\r\n          <span class=\"total-value\" *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{ responseData?.totalAmount |\r\n            number: '1.0-2' }}</span>\r\n\r\n          <span class=\"total-value\" *ngIf=\"isPointsRedeeming\">\u20B9{{ (responseData?.totalAmount - (totalSavingAmt || 0)) |\r\n            number: '1.0-2' }}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (percentageReduced || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n      <button class=\"place-order-btn\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        *ngIf=\"cartType === 'SHOPPING'\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n      <button class=\"place-order-btn mt-0\" (click)=\"edit ? '' : proceedToCheckout()\" simpoButtonDirective\r\n        *ngIf=\"cartType === 'SHOPPING'\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[0]?.content?.label ?? 'Checkout\r\n        Cart'}}</button>\r\n\r\n    </div>\r\n  </div>\r\n  <!-- <ng-container *ngIf=\"recommededData?.length\">\r\n    <simpo-featured-products [edit]=\"false\" [data]=\"featureProductData\"\r\n      [responseData]=\"recommededData\"></simpo-featured-products>\r\n  </ng-container> -->\r\n</ng-template>\r\n<ng-template #CHECKOUTPAGE>\r\n  <div class=\"checkout-left-panel\">\r\n    <div class=\"checkout-main-content\">\r\n      <!-- <div class=\"delivery-options\">\r\n        <div class=\"delivery-option active\">\r\n          <div class=\"delivery-icon\"></div>\r\n          HOME DELIVERY\r\n        </div>\r\n        <div class=\"delivery-option\">\r\n          <div class=\"delivery-icon\"></div>\r\n          STORE PICK-UP\r\n        </div>\r\n      </div> -->\r\n\r\n      <div class=\"section-title\">Shipping Address</div>\r\n\r\n      <div class=\"shipping-info\" *ngIf=\"defaultAddress\">\r\n        <div class=\"address-info\">\r\n          <div class=\"address-name\">{{defaultAddress?.receiverName}} ({{defaultAddress?.addressType}})</div>\r\n          <div class=\"address-details\">{{defaultAddress?.addressLine1}}, {{defaultAddress?.cityName}},\r\n            {{defaultAddress?.stateName}}</div>\r\n          <div class=\"mobile-number\">Mobile: {{defaultAddress?.receiverPhone}}</div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"addLinks h-100\" *ngIf=\"!defaultAddress\" (click)=\"addAddress()\">\r\n        <mat-icon>add</mat-icon>\r\n      </div>\r\n\r\n      <button class=\"change-address-btn\" (click)=\"changeAddress()\" *ngIf=\"defaultAddress\">CHANGE OR ADD ADDRESS</button>\r\n\r\n      <button class=\"btn w-100 mt-1 payment-btn\" (click)=\"proceedToPayment()\" simpoButtonDirective\r\n        *ngIf=\"defaultAddress && !placeOrderLoader\" [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\"\r\n        [color]=\"data?.styles?.background?.accentColor\" [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">\r\n        Place Order\r\n      </button>\r\n      <button class=\"btn w-100 mt-1 payment-btn\" simpoButtonDirective *ngIf=\"defaultAddress && placeOrderLoader\"\r\n        [buttonStyle]=\"data?.action?.buttons?.[0]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\" [backgroundInfo]=\"styles?.background\">\r\n        Loading...\r\n      </button>\r\n\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"checkout-right-panel\">\r\n    <div class=\"order-summary\">\r\n      <div class=\"summary-title\">Order Summary</div>\r\n\r\n      <div class=\"checkout-product\">\r\n        <div class=\"product-item\" *ngFor=\"let item of responseData?.orderedItems; let idx = index\">\r\n          <img [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" class=\"product-image\"\r\n            alt=\"\">\r\n          <div class=\"product-details\">\r\n            <div class=\"product-name\">{{item.itemName}}</div>\r\n            <div class=\"product-quantity\">Quantity: {{item.quantity}}</div>\r\n            <div class=\"product-price\">\u20B9{{(item.sellingPrice * item.quantity) | number: '1.0-2'}}</div>\r\n          </div>\r\n        </div>\r\n\r\n      </div>\r\n\r\n      <div class=\"price-breakdown\">\r\n        <div class=\"price-row\">\r\n          <span>Total Price</span>\r\n          <span>\u20B9{{(responseData?.billdetails?.totalNetValue\r\n            ?? 0) | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\">\r\n          <span>Total Tax</span>\r\n          <span>\u20B9{{((!responseData.billdetails?.couponId ?\r\n            responseData?.billdetails?.totalTax : responseData?.billdetails?.totalTaxAfterDiscount) ?? 0) |\r\n            number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"summary-row\" *ngIf=\"cartType === 'SHOPPING' && cartInfo?.billdetails?.orraSchemeRedeemedAmount\">\r\n          <span class=\"summary-label\">Redeem Amount</span>\r\n          <span class=\"summary-value\">\u20B9{{(cartInfo?.billdetails?.orraSchemeRedeemedAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n        </div>\r\n\r\n        <div class=\"price-row discount\" *ngIf=\"responseData?.billdetails?.discountAmount && !isJewellery\">\r\n          <span>Coupon Discount</span>\r\n          <span>- \u20B9{{responseData?.billdetails?.discountAmount\r\n            | number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row\"\r\n          *ngIf=\"responseData?.billdetails?.deliveryCharges && responseData.billdetails.deliveryCharges > 0\">\r\n          <span>Delivery Charge</span>\r\n          <span>{{responseData.billdetails.deliveryCharges\r\n            |\r\n            number: '1.0-2'}}</span>\r\n        </div>\r\n        <div class=\"price-row total\" *ngIf=\"cartType === 'SHOPPING'\">\r\n          <span>TOTAL AMOUNT</span>\r\n          <span *ngIf=\"!isPointsRedeeming && !appliedVoucher\">\u20B9{{(responseData?.totalAmount ?? 0) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"isPointsRedeeming\">\u20B9{{(responseData?.totalAmount - (totalSavingAmt || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'AMOUNT'\">\u20B9{{(responseData?.totalAmount -\r\n            (selectedVoucherAmount || 0)) | number:\r\n            '1.0-2'}}</span>\r\n          <span *ngIf=\"appliedVoucher && this.couponValueType === 'PERCENTAGE'\">\u20B9{{(responseData?.totalAmount -\r\n            (responseData?.totalAmount * (selectedVoucherPercentage / 100) || 0)) | number:\r\n            '1.0-2' }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #CARTITEM let-products=\"data\">\r\n  <div class=\"cart-item\" *ngFor=\"let item of products\" [style.color]=\"fontColor\">\r\n    <div class=\"item-left\">\r\n      <div class=\"item-image\">\r\n        <img class=\"item-img\" [src]=\"item.imgUrl ?? 'https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\" alt=\"\"\r\n          (click)=\"goToProductDetails(item)\" style=\"cursor: pointer;\">\r\n      </div>\r\n      <div class=\"item-details\">\r\n        <h3 class=\"item-title\">{{item.itemName}}</h3>\r\n        <div class=\"item-subtitle\" *ngIf=\"item.itemVariant\">\r\n          <span *ngFor=\"let varient of getKeys(item.itemVariant.properties); let last = last\">\r\n            {{ item.itemVariant.properties[varient] | titlecase }}<span *ngIf=\"!last\">, </span>\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"item-right\">\r\n      <div class=\"quantity-control\" *ngIf=\"cartType === 'SHOPPING'\">\r\n        <button class=\"qty-btn px-2\" (click)=\"decreaseQty(item)\" [disabled]=\"item.quantity === 1\">\r\n          <mat-icon>remove</mat-icon>\r\n        </button>\r\n        <span class=\"qty-value px-3\">{{item.quantity}}</span>\r\n        <button class=\"qty-btn px-2\" (click)=\"increaseQty(item)\">\r\n          <mat-icon>add</mat-icon>\r\n        </button>\r\n      </div>\r\n\r\n      <div class=\"item-price\">\r\n        \u20B9{{item.sellingPrice | number: '1.0-2'}}\r\n      </div>\r\n\r\n      <div class=\"delete-btn-circle\" (click)=\"removeItem(item)\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"\r\n          stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-trash-2\">\r\n          <path d=\"M3 6h18\" />\r\n          <path d=\"M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6\" />\r\n          <path d=\"M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2\" />\r\n          <line x1=\"10\" x2=\"10\" y1=\"11\" y2=\"17\" />\r\n          <line x1=\"14\" x2=\"14\" y1=\"11\" y2=\"17\" />\r\n        </svg>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #EMPTYITEM>\r\n  <section class=\"empty-cart w-100 d-flex align-items-center justify-content-center\">\r\n    <div class=\"empty-cart-container d-flex flex-column\">\r\n      <div class=\"cart-image\">\r\n        <img loading=\"lazy\" onerror=\"this.src='https://i.postimg.cc/hPS2JpV0/no-image-available.jpg'\"\r\n          [src]=\"data?.content?.image?.url\" [alt]=\"data?.content?.image?.altText\" [appImageEditor]=\"edit || false\"\r\n          [imageData]=\"data?.content?.image\" [sectionId]=\"data?.id\">\r\n      </div>\r\n      <div class=\"cart-text content-side\">\r\n        <ng-container *ngFor=\"let text of data?.content?.inputText\">\r\n          <div class=\"d-flex justify-content-center\"\r\n            [ngClass]=\"{'heading-medium': text.label == 'Heading', 'description': text.label == 'Text'}\">\r\n            <simpo-text-editor [(value)]=\"text.value\" [editable]=\"edit || false\" [isRTE]=\"text.isRTE\"></simpo-text-editor>\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n      <button class=\"place-order-btn mx-auto w-fit\" (click)=\"edit ? '' : proceedToListPage()\" simpoButtonDirective\r\n        [buttonStyle]=\"data?.action?.buttons?.[1]?.styles\" [color]=\"data?.styles?.background?.accentColor\"\r\n        [appButtonEditor]=\"edit ?? false\"\r\n        [backgroundInfo]=\"styles?.background\">{{data?.action?.buttons?.[1]?.content?.label ?? 'Continue\r\n        Shopping'}}</button>\r\n    </div>\r\n  </section>\r\n</ng-template>\r\n\r\n<ng-template #SCHEME_REDEMPTION>\r\n  <div class=\"modal-body\">\r\n    <div class=\"scheme-option\" *ngFor=\"let scheme of schemeList\" (click)=\"redeemScheme(scheme, false)\"\r\n      [style.borderColor]=\"cartInfo.billdetails.orraSchemeCode ? styles?.background?.color : ''\">\r\n      <label for=\"individual\" class=\"scheme-card\">\r\n        <div class=\"scheme-info d-flex gap-1\">\r\n          <div class=\"form-check-radio\">\r\n            <input class=\"form-check-input-radio\" type=\"radio\" name=\"flexRadioDefault\" id=\"flexRadioDefault2\">\r\n          </div>\r\n          <div class=\"right-side\">\r\n            <div class=\"scheme-name\">\r\n              <div class=\"scheme-title\">Individual Investment Scheme</div>\r\n              <div class=\"scheme-monthly\">\u20B98000/M</div>\r\n            </div>\r\n            <div class=\"scheme-details\">\r\n              <span class=\"scheme-id\">GPP Id: {{scheme.GPPId}}</span>\r\n              <!-- <span class=\"scheme-maturity\">Maturity Date: 12 April 2024</span> -->\r\n            </div>\r\n            <div class=\"scheme-amount\">\u20B9{{scheme.amount}}</div>\r\n          </div>\r\n        </div>\r\n      </label>\r\n    </div>\r\n    <div class=\"reedem_error d-flex justify-content-center align-items-center\" *ngIf=\"showReedemError\">\r\n      Please add more \u20B9{{vaildAmount}} to reedem this scheme\r\n    </div>\r\n  </div>\r\n</ng-template>", styles: ["*{font-family:var(--website-font-family)}mat-icon{font-family:Material Icons!important}.reedem-section{padding:10px 15px;border-radius:15px;background:#f6f3f9;box-shadow:#b2b2ca80 2px 2px 6px;font-weight:700;font-size:13px}.redeem-section-text{font-size:.9rem;font-weight:700}.form-check-input:checked{background-color:#28a745!important;border-color:#28a745!important}.form-check-input:focus{border-color:#28a745!important;outline:0;box-shadow:none!important}.close-btn{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#374151}.select_matured_text{font-size:.8rem!important;margin-top:10px;color:#05aacf}.position-relative{position:relative}.cart-parent{display:flex;margin-top:15px}.left-panel{width:65%;padding-right:5rem;border-right:1px solid #E9E9E9}.timeline{cursor:pointer}.cart-items{background:#fff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.cart-header{padding:16px 24px;border-bottom:1px solid #e2e8f0;background:#f8fafc}.cart-header h2{margin:0;font-size:18px;font-weight:500;color:#0f172a}.cart-item{display:flex!important;align-items:center;justify-content:space-between;border-bottom:1px solid #e2e8f0;gap:20px;padding:0 8px;transition:background .2s}.cart-item:hover{background:#fbfcfe}.item-left{display:flex;align-items:center;flex:1}.item-right{display:flex;align-items:center;padding:15px;gap:32px}.item-image img{width:64px;height:64px;border-radius:12px;object-fit:cover;border:1px solid #f1f5f9}.item-details{display:flex;flex-direction:column;gap:4px}.item-title{margin:0;font-size:15px;font-weight:600;color:#0f172a;line-height:1.4}.item-subtitle{font-size:13px;color:#64748b;font-weight:400}.quantity-control{display:flex;align-items:center;border:1.5px solid #e2e8f0;border-radius:7px;overflow:hidden;height:38px;background:#fff;width:fit-content}.qty-btn{width:38px;height:100%;border:none;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#475569;transition:all .2s ease}.qty-btn:hover{background:#f8fafc;color:#0f172a}.qty-btn mat-icon{font-size:16px;width:16px;height:16px;display:flex;align-items:center;justify-content:center}.qty-value{width:32px;height:100%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;color:#0f172a;border-left:1.5px solid #e2e8f0;border-right:1.5px solid #e2e8f0}.item-price{font-size:18px;font-weight:700;color:#0f172a;min-width:60px;text-align:right;letter-spacing:-.01em}.delete-btn-circle{width:36px;height:36px;border-radius:50%;border:1px solid #fee2e2;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#ef4444;transition:all .2s ease}.delete-btn-circle:hover{background:#fef2f2;border-color:#fecaca;transform:scale(1.05);color:#dc2626}.delete-btn-circle svg{width:18px;height:18px}.isActive{color:#0267c1;font-weight:600}.bar{width:150px;border-top:2px solid lightgray;margin:0 5px}.right-panel{width:35%;padding-left:5rem}.my-bag{font-size:16px;font-weight:600;color:#000;margin-left:8px}.my-bag span{color:#939393}.coupons{display:flex;justify-content:space-between;padding:10px;border-radius:4px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px;margin-top:10px;cursor:pointer}.coupon-list-section{padding:15px;width:400px;z-index:10000001!important}.coupon-list-section .search{padding:8px;border:1px solid lightgray;border-radius:20px;display:flex;justify-content:space-between}.coupon-list-section input{border:none;outline:none;width:90%}.coupon-list-section .coupon-list{height:60vh;width:100%}.item-parent{margin:10px 0;min-height:120px}.lh-23{line-height:23px;margin-left:10px}.item-name{color:#141514;font-size:16px;line-height:30px;font-weight:600}.price-with-tax{font-weight:400;font-size:16px;color:#626262}.item-sku{font-weight:400;font-size:14px;color:#626262}.item-price{display:flex;font-weight:600;font-size:16px;color:#141514}.product-img{border-radius:5px;height:100%;width:110px;padding:0;cursor:pointer}.quantity-box{display:flex;gap:5px;align-items:center;border:1px solid #E8E8E8;width:45px;height:22px}.quantity-box input{outline:none;text-align:center;border:none;width:30px;height:100%}.quantity-box .plus{font-size:20px;position:relative;top:-3px;font-weight:500}.quantity-box .minus{font-size:30px;position:relative;top:-3px;font-weight:500}.delete-item{color:#df2e2e;cursor:pointer;font-size:18px}.item-quantity{margin-top:5px;display:flex;min-width:90px;max-width:fit-content;border:1px solid lightgray;justify-content:space-between;align-items:center;padding:5px 10px;border-radius:3px}.coupon{display:flex;justify-content:space-between;border:1px solid #E8E8E8;border-radius:5px;padding:10px;margin-top:10px}.apply-coupon{font-weight:500;color:#626262;font-size:15px}.coupon-desc{color:#939393;font-size:12px;font-weight:500}.apply-coupon-btn{color:#0267c1;font-size:16px;font-weight:600}.price-details{padding:10px;margin-top:10px;border-radius:5px;box-shadow:0 0 1px #28293d14,0 0 2px #60617029;margin-bottom:15px}.price-parent-block{display:flex;justify-content:space-between;margin-top:5px}.price-type{font-weight:400;font-size:16px;color:#434443}.price-value{font-weight:500;font-size:18px;color:#141514}.button-parent{margin-top:20px;display:flex;flex-direction:column;gap:10px}hr{border:1px solid #E8E8E8}.btn{height:40px;font-size:16px!important}.delete-item{text-align:right;position:absolute;right:16px;bottom:10px}.quantity{display:flex;border:2px solid #E6E6E6;align-items:center;gap:15px;height:47px;margin-top:1rem;border-radius:5px}.quantity .plus{position:relative;left:10px;font-size:18px;font-weight:600;cursor:pointer;color:#848484}.quantity .minus{position:relative;right:15px;font-size:18px;font-weight:600;color:#848484;cursor:pointer}.quantity input{width:60px;border:none;outline:none;text-align:center}.label{color:#000}.total-container{min-height:80vh;position:relative;display:block!important;height:calc(100vh - 170px)}.hover_effect{position:unset;width:100%;top:0;left:0;height:100%}.cart-image{width:13%;display:flex;margin-right:auto;margin-left:auto}.cart-image img{width:100%}.heading-medium{font-weight:600;color:#000}.description{font-size:18px;color:#7f7676;width:100%;text-align:center}.cart-window{padding:10px}.cart-window .small-product-img{width:55px;height:55px;border-radius:5px}.cart-window .small-items{display:flex;flex-direction:column;gap:10px;margin-top:15px;height:calc(100vh - 160px);overflow-y:auto}.cart-window .small-item{width:100%;display:flex;justify-content:space-between}.cart-window .small-item-name{width:200px}.cart-window .small-item-quantity{display:flex;align-items:center;justify-content:space-between;border-radius:5px;width:80px;background-color:#fafad2;padding:3px 8px;height:35px;font-weight:500;margin-right:3px}.cart-window .small-item-price{display:flex;flex-direction:column;gap:5px}.cart-window .small-item-price .price-with-tax{display:flex;font-size:13px!important}.cart-window .fotter-sec{background-color:#fff;position:absolute;bottom:0;left:0;width:100%;padding:10px}.cart-window .fotter-sec .payment-btn{border-radius:5px;border:none;display:flex;align-items:center;justify-content:center;background-color:#f08080;padding:10px 5px;color:#fff;cursor:pointer}.offers{background-color:#fff;display:flex;justify-content:space-between;padding:8px;border-radius:8px;box-shadow:#959da533 0 -1px 6px}.header-sec{font-size:26px}@media screen and (max-width: 475px){.cart-parent{flex-direction:column}.see-live-btn{white-space:nowrap!important}.left-panel{width:100%;padding-right:0rem}.right-panel{width:100%;z-index:1000;padding-left:0rem}.cart-image{width:42%}.description{width:84%}.heading-medium{font-size:28px}.item-price{white-space:nowrap;display:none}.product-img{width:82px}[class*=col-md]{padding-left:5px!important;padding-right:5px!important}.mobile-fixed{height:40px;font-size:16px!important;border:1px solid lightgray;width:100%;position:relative;bottom:10px}.empty-cart-container{height:calc(100vh - 130px)}.coupons-listing-section{width:100vw!important}.checkoutPage{flex-direction:column}.checkout-left-panel,.checkout-right-panel{width:100%!important}}.mobile-fixed{color:#fff}.coupons-listing-section{height:100vh;padding-top:0;position:relative;width:390px;z-index:100;background:#d3d3d354}.coupons-listing-section .coupon-heading{display:flex;align-items:center;background-color:#fff;padding:15px 20px;width:100%;box-sizing:border-box}.coupons-listing-section .coupon-heading img{height:15px;width:15px;position:relative;top:2px;cursor:pointer}.coupons-listing-section .coupon-heading .header-text{font-size:16px;color:#000;font-weight:600;margin-left:15px;position:relative;top:-3px;right:15px;cursor:pointer}.coupons-listing-section .coupon-search-sec{width:90%;box-sizing:border-box;margin:10px auto;border:1px solid lightgray;padding:10px;border-radius:10px;background-color:#fff;display:flex;font-size:16px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec input{border:none;outline:none;background-color:transparent;width:95%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-search-sec input:focus{font-size:14px;color:#000;font-weight:600}.coupons-listing-section .coupon-search-sec .back-btn{position:relative;top:3px;cursor:pointer}.coupons-listing-section .coupon-search-sec .apply-btn-search{font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing{height:72%;overflow-y:auto;width:90%;margin:20px auto}.coupons-listing-section .coupon-listing .coupon-details{padding:15px;margin-bottom:15px;background-color:#edfffa;border-radius:10px;border:1px solid lightgray}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading{display:flex;flex-direction:column;gap:25px}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief{display:flex;justify-content:space-between;width:100%}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-name{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-desc{padding:5px 0;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .show-details-btn{cursor:pointer}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec{display:flex;justify-content:flex-end}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-brief .coupon-brief__right-sec .apply-offer-btn{font-size:16px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-heading .coupon-toggle-details-btn{text-align:left;text-decoration:underline;width:100%;font-size:14px;color:#000;font-weight:400}.coupons-listing-section .coupon-listing .coupon-details .details-divider{border-top:2px solid lightgray;opacity:.3;margin:15px 0}.coupons-listing-section .coupon-listing .coupon-details .details__coupon-terms{font-size:14px;color:#000;font-weight:400}.empty-screen-container{height:100%;width:85%;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.empty-screen-container .empty-screen__primary-text{font-size:22px;color:#000;font-weight:400}.empty-screen-container .empty-screen__secondary-text{text-align:center;padding:10px 0;font-size:16px;color:#000;font-weight:400}.empty-screen-container .empty-screen__button{width:90%;background-color:#fff;border-radius:8px;text-align:center;padding:10px;margin:10px auto 0;cursor:pointer;font-size:18px;color:#000;font-weight:400}.box-shadow{box-shadow:#00000029 0 1px 4px}.main-content{border-radius:12px;padding:0 30px 30px;width:100%;overflow:scroll;height:calc(100vh - 150px)}.delivery-options{display:flex;gap:20px;margin-bottom:30px}.delivery-option{padding:12px 24px;border:2px solid #e0e0e0;border-radius:25px;background:#fff;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:500;transition:all .2s}.delivery-option.active{background:#f0e6ff;border-color:#8b5cf6;color:#7c3aed}.delivery-option:hover{border-color:silver}.delivery-icon{width:16px;height:16px;background:#8b5cf6;border-radius:3px}.section-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.shipping-info{border-radius:10px;padding:20px;margin-bottom:20px;border:1px solid rgb(238,232,255);box-shadow:#0000000a 0 4px 8px}.delivery-date{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.delivery-date-text{color:#666;font-weight:500}.change-date-btn{color:#e91e63;background:none;border:none;font-weight:600;cursor:pointer;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.address-info{margin-bottom:15px}.address-name{font-weight:700;margin-bottom:8px;color:#000}.address-details{color:#666;margin-bottom:8px}.mobile-number{font-weight:700;color:#000;font-size:15px}.change-address-btn{font-size:1rem!important;font-weight:700!important;padding:6px;background:#fff;border:1px solid rgb(229,221,255);border-radius:8px;color:#000;cursor:pointer;transition:all .2s;box-shadow:#0000000a 0 4px 8px}.change-address-btn:hover{border-color:#8b5cf6;color:#8b5cf6}.billing-section{margin-top:40px}.billing-options{display:flex;flex-direction:column;gap:15px;margin-top:20px}.billing-option{display:flex;align-items:center;gap:12px;padding:15px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.billing-option.active{background:#f0e6ff;border-color:#8b5cf6}.radio-btn{width:20px;height:20px;border:2px solid #e0e0e0;border-radius:50%;position:relative}.billing-option.active .radio-btn{border-color:#8b5cf6}.billing-option.active .radio-btn:after{content:\"\";width:10px;height:10px;background:#8b5cf6;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.order-summary{border-radius:12px;padding:25px;width:75%}.summary-title{font-size:16px;font-weight:700;margin-bottom:20px;color:#000}.product-item{display:flex;gap:15px;margin-bottom:20px;border-bottom:1px solid #f0f0f0;border-radius:7px;background:#fff;padding:15px}.product-item:last-of-type{border-bottom:none;margin-bottom:30px;padding-bottom:0}.product-image{max-width:110px;width:100%;height:100%;border-radius:8px}.product-details{flex:1}.product-name{font-weight:500;margin-bottom:4px;color:#2d3748;font-size:14px}.product-quantity{color:#666;font-size:12px;margin-bottom:8px}.product-price{font-weight:600;color:#2d3748}.delivery-info{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#8b5cf6}.delivery-icon-small{width:12px;height:12px;background:#8b5cf6;border-radius:2px}.price-breakdown{border-top:1px solid #f0f0f0;padding-top:20px}.price-row{display:flex;justify-content:space-between;margin-bottom:12px;color:#666}.price-row.total{font-weight:600;color:#2d3748;font-size:16px;margin-top:15px;padding-top:15px;border-top:1px solid #f0f0f0}.discount{color:#22c55e!important}@media (max-width: 768px){.container{grid-template-columns:1fr;padding:15px;gap:20px}.main-content,.order-summary{padding:20px;width:100%}.delivery-options{flex-direction:column;gap:10px}}.checkout-left-panel{width:65%;display:flex;justify-content:center}.checkout-right-panel{width:35%;display:flex;justify-content:center;background-color:#f9f9fa}.checkout-product{max-height:50vh;overflow:scroll}.mt-1{margin-top:1rem!important}.payment-btn{box-shadow:#0000000a 0 4px 8px}.addLinks{padding-bottom:8px;padding-top:9px;border:1px dashed;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:5px;height:25vh!important;margin-bottom:20px}.addLinks mat-icon{border:1px solid rgb(219,223,225);display:flex;border-radius:100%;align-items:center;justify-content:center;font-size:16px;color:#dbdfe1}.change-pincode{display:flex;gap:10px}.change-pincode mat-icon{font-size:18px;align-items:center;justify-content:center;display:flex}.change-pincode span{font-size:14px}.fs-13{font-size:13px}.fs-12{font-size:12px}.fs-18{font-size:18px}.b-1-b{border-width:0px 1px;border-style:solid;border-color:#000}.container{max-width:unset;padding:24px;display:flex;gap:24px;width:100%!important}.main-content{background:#fff;border-radius:12px;width:70%}.promo-banner{padding:16px 20px;display:flex;flex-direction:column;gap:10px;border-radius:8px;border:1px solid #e2e8f0}.promo-banner-row{display:flex;justify-content:space-between;align-items:center;gap:12px}.promo-text h3{font-size:16px!important;font-weight:500;margin-bottom:4px}.promo-text p{font-size:.9rem!important;margin-bottom:0!important;color:#64748b}.see-live-btn{background:#fff;border:1px solid #e2e8f0;font-weight:600;color:#000;padding:8px 16px;border-radius:8px;font-size:12px!important;cursor:pointer;display:flex;align-items:center;gap:8px;width:max-content!important;transition:all .2s ease;box-shadow:0 1px 2px #0000000d}.see-live-btn:hover{background:#f8fafc;border-color:#cbd5e1;transform:translateY(-1px)}.see-live-btn:disabled{color:#94a3b8;cursor:not-allowed;box-shadow:none}.see-live-btn:disabled:hover{background:#fff;border-color:#e2e8f0;transform:none}.see-live-btn svg{color:#6366f1}.video-selection-line{font-size:.8rem;color:#64748b}.video-cart-hint{font-size:.8rem;color:#6366f1;cursor:pointer;text-decoration:underline;width:max-content}.schedule-panel-overlay{position:fixed;inset:0;background:#141a2666;z-index:1200}.schedule-panel-backdrop{position:absolute;inset:0;border:none;background:none;cursor:default;padding:0}.schedule-panel{position:absolute;top:0;right:0;bottom:0;width:400px;max-width:92vw;background:#fff;box-shadow:-20px 0 50px -20px #141a2659;display:flex;flex-direction:column}.schedule-panel-header{flex:none;padding:20px 22px;border-bottom:1px solid #e2e8f0;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.schedule-panel-title{font-size:17px;font-weight:600;color:#1b2436}.schedule-panel-subtitle{font-size:12.5px;color:#64748b}.schedule-panel-close{flex:none;border:none;background:none;cursor:pointer;color:#64748b;line-height:0;padding:3px}.schedule-panel-body{flex:1;min-height:0;overflow-y:auto;padding:16px 22px;display:flex;flex-direction:column;gap:10px}.schedule-panel-row{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px;cursor:pointer;width:100%;background:#fff;border:1px solid #e2e8f0;text-align:left}.schedule-panel-row.selected{background:#f5f3ff;border-color:#c7d2fe}.schedule-panel-checkbox{width:18px;height:18px;flex:none;border:1.5px solid #cbd5e1;border-radius:4px;background:#fff;display:grid;place-items:center}.schedule-panel-checkbox.checked{background:#6366f1;border-color:#6366f1}.schedule-panel-checkbox mat-icon{color:#fff!important;font-size:13px!important;height:13px!important;width:13px!important}.schedule-panel-thumb{width:46px;height:46px;border-radius:6px;object-fit:cover;flex:none;background:#f3efe9}.schedule-panel-info{flex:1}.schedule-panel-name{font-size:13.5px;color:#1b2436}.schedule-panel-footer{flex:none;padding:16px 22px;border-top:1px solid #e2e8f0;display:flex;flex-direction:column;gap:10px}.schedule-panel-selection-line{font-size:11.5px;color:#64748b}.schedule-panel-cta{width:100%;height:48px;border:none;border-radius:8px;background:#7c3a11;color:#fff;font-size:14px;font-weight:600;cursor:pointer}.schedule-panel-cta:disabled{background:#cbd5e1;cursor:not-allowed}.cart-item{display:flex;gap:16px;position:relative}.cart-item:last-child{border-bottom:none}.item-image{width:15%;height:100px;border-radius:8px;object-fit:cover;display:flex;align-items:center;justify-content:center}.item-details{flex:1}.item-title{font-weight:500;margin-bottom:8px}.item-price{display:flex;align-items:center;gap:8px}.current-price{font-size:1rem;font-weight:600}.original-price{font-size:1rem;text-decoration:line-through}.discount{background:#fef3c7;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:500}.item-code{font-size:12px;color:#9ca3af;margin-bottom:8px}.item-options{display:flex;gap:16px;font-size:14px;color:#6b7280;margin-bottom:12px}.delivery-info{font-size:12px;color:#8b5cf6}.pickup-info{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:5px 15px;margin-top:12px;display:flex;align-items:center;cursor:pointer;width:max-content;gap:20px}.pickup-text{font-size:.9rem;color:#374151}.remove-btn{position:absolute;top:16px;right:0;width:20px!important;height:20px;background:#000;color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:10px!important}.sidebar{display:flex;flex-direction:column;gap:16px;width:32%}.coupon-section{border-radius:8px;padding:10px 15px;border:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:all .2s ease}.coupon-section:hover{border-color:#cbd5e1;background-color:#f8fafc}.chevron-icon{color:#94a3b8;transition:transform .2s ease}.coupon-section:hover .chevron-icon{transform:translate(2px);color:#64748b}.scheme-section{border-radius:12px;padding:10px 15px;cursor:pointer}.coupon-left{display:flex;align-items:center;gap:12px}.coupon-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center}.coupon-icon mat-icon{font-size:17px;width:17px!important;height:19px!important}.coupon-text{font-weight:700;font-size:.9rem}.delivery-section{background:#fff;border-radius:12px;padding:10px 15px;box-shadow:#b2b2ca80 2px 2px 6px;background:#f6f3f9}.delivery-header{display:flex;align-items:center;gap:12px;margin-bottom:4px}.delivery-header span{font-size:.9rem;font-weight:700}.delivery-header mat-icon{width:20px;height:20px;font-size:17px;position:relative;top:2px}.delivery-icon{width:20px;height:20px;background:#8b5cf6;border-radius:50%}.pincode{font-weight:600;color:#111827}.change-link{color:#ec4899;font-size:.9rem;text-decoration:none;margin-left:auto}.summary-section{background:#fff;border-radius:8px;padding:20px;border:1px solid #e2e8f0}.summary-title{font-size:16px;font-weight:700;color:#0f172a;margin-bottom:20px;letter-spacing:-.01em}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.summary-row:last-child{margin-bottom:0}.summary-label{font-size:14px;font-weight:400;color:#64748b}.summary-value{font-size:14px;font-weight:500;color:#0f172a}.summary-divider{height:1px;background:#f1f5f9;margin:16px 0;width:100%}.total-row .summary-label{font-size:16px;font-weight:600;color:#0f172a}.total-row .summary-value{font-size:16px;font-weight:700;color:#0f172a}.total-row{border-top:1px solid #e2e8f0;padding-top:15px;margin-top:15px}.total-label{font-weight:600;font-size:16px}.total-value{font-weight:700;font-size:18px}.place-order-btn{background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;border:none;border-radius:12px;padding:9px 10px;font-size:.9rem!important;font-weight:600;cursor:pointer;margin-top:10px;text-transform:uppercase}.place-order-btn:hover{opacity:.9}.chain-icon,.earring-icon{width:60px;height:60px;filter:sepia(1) hue-rotate(30deg) saturate(2)}.item-img{width:100%;height:100%;object-fit:cover}.mt-0{margin-top:0!important}select{outline:none;border-radius:5px;padding:2px;width:20%;border:none;box-shadow:#9999994d 2px 2px 6px;cursor:pointer}.cart-tab-parent{display:flex;justify-content:center}.cart-tabs{gap:10px;display:flex;justify-content:center;align-items:center;width:max-content;border-radius:8px;border:1px solid #e2e8f0}.cart-tabs div{padding:7px 10px;cursor:pointer;font-size:14px}.selected-cart-tab{margin:6px;background:#f1f5f9;border-radius:5px;color:#000!important;font-weight:500}.checkout-main-content{width:50%;padding:30px;border-radius:12px}@media screen and (max-width: 475px){.main-content{padding:0;height:auto!important}.cart-item{flex-direction:column!important;align-items:flex-start!important;padding:16px 12px!important;gap:16px!important}.item-left{width:100%!important;gap:16px!important;align-items:flex-start!important}.item-image{width:86px!important;height:86px!important;flex-shrink:0!important}.item-right{width:100%!important;justify-content:space-between!important;padding:0!important;gap:12px!important;margin-top:4px!important}.item-price{flex:1!important;text-align:right!important;margin-right:8px!important;font-size:16px!important}.item-title{font-size:14px!important;-webkit-line-clamp:2!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.quantity-control{height:34px!important}.qty-btn{width:34px!important}.qty-value{width:28px!important;font-size:13px!important}.no-items{height:86vh;overflow:hidden;margin:0}.checkout-main-content{width:100%}.container{padding:0!important}.pickup-info{display:none}.container{display:flex;flex-direction:column}.promo-banner{gap:10px}select{width:50%}.main-content,.sidebar{width:100%}.vouchers-listing-section{min-width:unset!important;width:100vw!important}.separator{display:none!important}.coupon-meta{display:grid!important;grid-template-columns:1fr 1fr!important}}.group_invest{color:#000;font-size:.8rem}.reedem_error{color:red}.group_invest span{color:#05aacf}.redeem_amount{padding:2%;border-radius:4px;background:#fff;margin-top:2%;color:#000;font-size:.8rem}.redeem_amount span{color:#0dc577}.w-fit{width:fit-content!important}.modal-body{padding-bottom:0;overflow-y:scroll;max-height:300px;padding:0!important}.scheme-option{margin-bottom:16px}.scheme-option input[type=radio]:checked+.scheme-card{border-color:#06b6d4;background:#f0f9ff;position:relative}.scheme-option input[type=radio]:checked+.scheme-card:before{content:\"\";position:absolute;top:20px;left:20px;width:20px;height:20px;border:2px solid #06b6d4;border-radius:50%;background:#fff}.scheme-option input[type=radio]:checked+.scheme-card:after{content:\"\";position:absolute;top:26px;left:26px;width:8px;height:8px;background:#06b6d4;border-radius:50%}.scheme-card{justify-content:space-between;padding:10px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;width:100%}.scheme-card:hover{border-color:#d1d5db;background:#f9fafb}.form-check-radio{width:10%}.scheme-title{font-size:12px;font-weight:600;color:#111827;margin-bottom:8px}.scheme-details{display:flex;gap:25px;margin-bottom:20px}.scheme-name{display:flex;justify-content:space-between}.scheme-details span{font-size:12px;color:#0000004d}.scheme-monthly{font-size:14px;font-weight:600;color:#111827;min-width:100px;text-align:right}.right-side{width:90%}.scheme-amount{font-weight:700}@media screen and (min-width: 700px){.cart-items{max-height:500px;overflow:scroll}}.add-to-cart-parent{width:max-content;border:1px solid #000000;border-radius:8px}.cursor{cursor:pointer}.cart-text{max-width:600px;margin:0 auto;text-align:center}.cart-text div{word-break:break-word;overflow-wrap:break-word;white-space:normal}.switch{position:relative;display:inline-block;width:45px;height:20px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.4s;border-radius:34px}.slider:before{position:absolute;content:\"\";height:16px;width:16px;left:3px;bottom:2px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#4caf50}input:checked+.slider:before{transform:translate(24px)}.vouchers-listing-section{position:relative;width:fit-content;min-width:500px;z-index:100;background:#fff;height:100vh}.vouchers-listing-section .coupon-heading{border-bottom:1px solid #eee}.vouchers-listing-section .coupon-listing{padding:12px 16px;overflow-y:auto;height:calc(97vh - 100px)}.voucher-details{background:#fff;border-radius:12px;padding:14px;box-shadow:0 1px 4px #00000042}.voucher-details .coupon-brief .apply-offer-btn{background:#111;color:#fff;border-radius:10px;padding:6px 16px}.voucher-details .coupon-code-box{border:1.5px dashed #bbb;border-radius:8px;padding:8px 12px;margin-bottom:10px}.voucher-details .coupon-code-box .code-label{font-size:11px;color:#888;margin-bottom:2px}.voucher-details .coupon-code-box .code-row .code-value{font-weight:700;font-size:15px;letter-spacing:1px}.voucher-details .coupon-meta .clock-icon{font-size:14px;height:14px;width:14px;vertical-align:middle}.applied-coupon-card{background:#f0fff8;border-radius:12px;padding:12px 16px}.applied-coupon-card .applied-coupon-left .success-check{color:#22c55e;font-size:22px}.applied-coupon-card .applied-coupon-left .applied-coupon-code{font-weight:700;font-size:14px}.applied-coupon-card .applied-coupon-left .applied-coupon-saving{font-size:13px;color:#097d5f;margin-top:2px}.active-type{background:#111!important;color:#fff!important}.redemption-type{text-align:center;border-radius:10px;padding:6px 16px;background:#d3d3d36b;width:-webkit-fill-available!important}.wallte_icon{background:#000;border-radius:50px;padding:5px 9px 7px}.wallte_icon img{width:18px;height:18px}.fw-600{font-weight:600}.coupon-type{width:fit-content!important;border-radius:26px!important;background:transparent!important;border:1px solid #afafaf;color:#393838;text-align:center;padding:6px 16px}.active-coupon{background:transparent!important;border:2px solid black!important;color:#000!important}.my-close-btn{position:absolute!important;top:10px!important;right:10px!important}\n"] }]
         }], ctorParameters: () => [{ type: EventsService }, { type: CartService }, { type: i2$2.Router }, { type: RestService }, { type: i3$2.MatDialog }, { type: StorageServiceService }, { type: i6$1.MessageService }, { type: i8$1.MatBottomSheet }, { type: i2$2.ActivatedRoute }, { type: BookingProductCartService }, { type: undefined, decorators: [{
                     type: Optional
                 }, {