import { Component, Input } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import { environment } from '../../environments/environment';
import * as i0 from "@angular/core";
import * as i1 from "../../services/cart.service";
import * as i2 from "@spartacus/storefront";
import * as i3 from "@angular/common";
export class OrderDetailListComponent {
    constructor(cartService, cdr) {
        this.cartService = cartService;
        this.cdr = cdr;
        this.showDetails = [];
        this.cartDetails = [];
        this.showWaitCursor = new BehaviorSubject(false);
    }
    ngOnInit() {
    }
    ngOnChanges(changes) {
        var _a;
        if (!changes.cartDetails.firstChange) {
            this.cdr.detectChanges();
        }
        this.showWaitCursor.next(true);
        if ((_a = this.cartDetails) === null || _a === void 0 ? void 0 : _a.length) {
            this.showWaitCursor.next(false);
        }
        else {
            this.showWaitCursor.next(false);
            this.noRecord = 'No data';
        }
        for (let i = 0; i < this.cartDetails.length; i++) {
            this.showDetails.push(false);
        }
        this.cartService.expandAll.subscribe((data) => {
            for (let i = 0; i < this.cartDetails.length; i++) {
                this.showDetails[i] = data;
            }
        });
    }
    // Get the Image Details based on Products
    getImageDetails(cartDetails, thumbnail = true) {
        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
        let imageUrl = (_a = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.product) === null || _a === void 0 ? void 0 : _a.images;
        if (this.isCardData) {
            imageUrl = (_b = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.product) === null || _b === void 0 ? void 0 : _b.images;
        }
        else {
            imageUrl = (_e = (_d = (_c = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.product) === null || _c === void 0 ? void 0 : _c.images) === null || _d === void 0 ? void 0 : _d.PRIMARY) === null || _e === void 0 ? void 0 : _e.cartIcon;
        }
        let srcUrl;
        if ((cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.attachments) &&
            ((_f = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.attachments) === null || _f === void 0 ? void 0 : _f.length) &&
            ((_g = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.product) === null || _g === void 0 ? void 0 : _g.flashingProduct)) {
            srcUrl =
                thumbnail && ((_h = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.attachments) === null || _h === void 0 ? void 0 : _h.length) > 1
                    ? (_j = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.attachments[1]) === null || _j === void 0 ? void 0 : _j.downloadURL
                    : (_k = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.attachments[0]) === null || _k === void 0 ? void 0 : _k.downloadURL;
            imageUrl = {
                url: (_l = (environment.occBaseUrl.slice(0, environment.occBaseUrl.length - 1) +
                    srcUrl)) === null || _l === void 0 ? void 0 : _l.replace('&attachment=true', ''),
            };
        }
        return imageUrl;
    }
    showHide(ind) {
        this.showDetails[ind] = !this.showDetails[ind];
    }
    viewImage(event, cartDetails) {
        var _a;
        event.preventDefault();
        this.imageModalSrc = (_a = this.getImageDetails(cartDetails, false)) === null || _a === void 0 ? void 0 : _a.url;
    }
    getPdfLink(cartDetails) {
        var _a;
        return (_a = this.getImageDetails(cartDetails, false)) === null || _a === void 0 ? void 0 : _a.url;
    }
    hasImage(cartDetails) {
        var _a;
        const mimeType = (_a = cartDetails === null || cartDetails === void 0 ? void 0 : cartDetails.attachments[0]) === null || _a === void 0 ? void 0 : _a.mime;
        const mimeArray = ["image/png", "image/jpg", "image/jpeg"];
        return mimeArray.includes(mimeType);
    }
}
OrderDetailListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: OrderDetailListComponent, deps: [{ token: i1.CartService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
OrderDetailListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: OrderDetailListComponent, selector: "app-order-detail-list", inputs: { cartDetails: "cartDetails", sortByVal: "sortByVal", orderDate: "orderDate", isCardData: "isCardData" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"loading\" *ngIf=\"showWaitCursor | async \">Loading&#8230;</div>\r\n<div class=\"revieworder-table-container py-3\">\r\n        <table class=\"w-100 table\">\r\n            <tr class=\"revieworder-header-container\">\r\n                <th>#</th>\r\n                <th class=\"item\">ITEM</th>\r\n                <th>JOB REFERENCE</th>\r\n                <th>DELIVERY DATE</th>\r\n                <!-- <th>DELIVERY #</th> -->\r\n                <th>QUANTITY ORDERED</th>\r\n                <!-- <th>QUANTITY SHIPPED</th> -->\r\n                <th class=\"colHD\"><div class=\"text-right\">TOTAL PRICE</div> <span class=\"text-right\">excl GST</span></th>\r\n                <th>STATUS</th>\r\n            </tr>\r\n            <ng-container *ngIf=\"cartDetails.length; else nodata\">\r\n                <ng-container *ngFor=\"let cart of cartDetails;let i = index\">\r\n                    <tr class=\"revieworder-body-container\" [ngClass]=\"cart?.configurationInfos.length ? '' : 'borderNew' \">\r\n                        <td>\r\n                            <ng-container *ngIf=\"cart.entryNumber.length>9; else entryId\">{{cart.entryNumber}}</ng-container>\r\n                            <ng-template #entryId>0{{cart.entryNumber+1}}</ng-template>\r\n                        </td>\r\n                        <td>\r\n                            <div class=\"row product-image-container\">\r\n                                <div class=\"col-sm-4 col-lg-2 p-2 product-img\">\r\n                                        <ng-container\r\n                                          *ngIf=\"\r\n                                            cartDetails[i]?.product?.flashingProduct;\r\n                                            else normalImage\r\n                                          \"\r\n                                        >\r\n                                          <a data-toggle=\"modal\" class=\"flashing-expand\" (click)=\"viewImage($event,cartDetails[i])\" [attr.data-target]=\"'#imageModal'\" *ngIf=\"hasImage(cartDetails[i]);else hasPdf\">\r\n                                            <cx-media\r\n                                              [container]=\"getImageDetails(cartDetails[i])\"\r\n                                              format=\"cartIcon\"\r\n                                              role=\"presentation\"\r\n                                            ></cx-media>\r\n                                          </a>\r\n                                          <ng-template #hasPdf>\r\n                                            <a class=\"flashing-expand flashing-open\" [href]=\"getPdfLink(cartDetails[i])\" target=\"_blank\">\r\n                                              <img class=\"pdf-icon\" src=\"../../../../../assets/images/pdf-icon.svg\" alt=\"Click to open PDF\" title=\"Click to open PDF\" />\r\n                                            </a>\r\n                                          </ng-template>\r\n                                        </ng-container>\r\n                                        <ng-template #normalImage>\r\n                                          <cx-media\r\n                                            [container]=\"getImageDetails(cartDetails[i])\"\r\n                                            format=\"cartIcon\"\r\n                                            role=\"presentation\"\r\n                                          ></cx-media>\r\n                                        </ng-template>\r\n                                </div>\r\n                                <div class=\"col-sm-8 col-lg-10\">\r\n                                    <p class=\"reviewproduct-name mb-2\">{{cart?.product?.name}}</p>\r\n                                    <p class=\"sku-text mb-0\">SKU: {{cart?.product?.code }}</p>\r\n                                </div>\r\n                            </div>\r\n                        </td>\r\n                        <td>{{cart?.jobReference || '-'}}</td>\r\n                        <td>{{orderDate | date:\"dd/MM/yyyy\"}}</td>\r\n                        <td>{{cart.quantityDouble}}{{cart?.totalPrice?.unitType}}<br>\r\n                            <span class=\"subPrice\">@ {{cart?.totalPrice?.formattedValue}}/{{cart?.totalPrice?.unitType}}</span></td>\r\n                        <td>{{cart?.totalPrice?.formattedValue}} <span class=\"d-block\">excl GST</span></td>\r\n                        <td class=\"statusColm\">\r\n                            <small class=\"statusColor\"\r\n                            [ngStyle]=\"{'background-color':\r\n                            (cart?.status=='CREATED') ? ('#F3A931') :\r\n                            (cart?.status=='APPROVED') ? ('#f26522') :\r\n                            (cart?.status=='PROCESSING') ? ('#75578A') :\r\n                            (cart?.status=='READY') ? ('#496471') :\r\n                            (cart?.status=='DELIVERING') ? ('#00ACBD') :\r\n                            (cart?.status=='COMPLETED') ? ('#8DC440') :\r\n                            (cart?.status=='RETURNED') ? ('#8DC440') :\r\n                            (cart?.status=='CANCELLED') ? ('#000000') :\r\n                            ('')}\"\r\n                            ></small>\r\n                            {{cart?.statusDisplay || '-'}}\r\n                        </td>\r\n                    </tr>\r\n                    <ng-container *ngIf=\"cart?.product?.classifications\">\r\n                        <tr class=\"revieworder-body-container\">\r\n                            <td colspan=\"9\">\r\n                                <span *ngFor=\"let attributes of cart?.product?.classifications[0]?.features;last as isLast\">\r\n                                    {{attributes?.featureValues[0]?.value }} <span *ngIf=\"!isLast\"> | </span>\r\n                                </span>\r\n                                mm\r\n                            </td>\r\n                        </tr>\r\n                    </ng-container>\r\n                    <tr class=\"revieworder-body-container\" *ngIf=\"cart?.configurationInfos.length\" [ngClass]=\"cart?.configurationInfos.length ? 'borderNew' : '' \">\r\n                        <td colspan=\"9\">\r\n                            <p class=\"colors-paragraph mb-0\">\r\n                                <span class=\"revieworder-color mr-3\"\r\n                                [ngStyle]=\"{ background: cart?.configurationInfos[0]?.configurationValue.split('|') | slice:2}\"></span>\r\n                                {{cart?.configurationInfos[0]?.configurationValue.split('|') | slice:1:2}}\r\n                            </p> \r\n                            <ng-container *ngIf=\"cart?.subLineConfigInfos.length>0\">\r\n                                <p class=\"m-0\">\r\n                                    <a href=\"javascript:void(0)\" (click)=\"showHide(i)\" class=\"see-more-link\">\r\n                                        {{showDetails[i] == true ? 'Hide' : 'See'}} more details\r\n                                    </a>\r\n                                </p>\r\n                                <div class=\"revieworder-collapse\" *ngIf=\"showDetails[i]\">\r\n                                    <div class=\"row\">\r\n                                        <div class=\"col-sm-6 bundle-details\">\r\n                                            <div class=\"row bundle-details-header\">\r\n                                                <div class=\"col-3\">Quantity</div>\r\n                                                <div class=\"col-3\">Length (LM)</div>\r\n                                                <ng-container *ngIf=\"cart?.subLineConfigInfos[i]?.bundleName\">\r\n                                                    <div class=\"col-3\">Bundle</div>\r\n                                                    <div class=\"col-3\">Reference</div>\r\n                                                </ng-container>\r\n                                            </div>\r\n                                            <div class=\"row\" *ngFor=\"let subLine of cart?.subLineConfigInfos\">\r\n                                                <div class=\"col-3\">{{subLine?.quantity}}</div>\r\n                                                <div class=\"col-3\">{{subLine?.length | number:'0.3-3'}}</div>\r\n                                                <ng-container *ngIf=\"subLine?.bundleName\">\r\n                                                    <div class=\"col-3\">{{subLine?.bundleName}}</div>\r\n                                                    <div class=\"col-3\">{{subLine?.reference}}</div>\r\n                                                </ng-container>\r\n                                            </div>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            </ng-container>\r\n                        </td>\r\n                    </tr>\r\n                    <tr>\r\n                        <td colspan=\"9\" class=\"p-0\">\r\n                            <div *ngIf=\"cartDetails[i]?.product?.flashingProduct && cartDetails[i]?.productConfiguredInfos\">\r\n                                <div class=\"flashing-block \" *ngFor=\"let data of cartDetails[i]?.productConfiguredInfos\">\r\n                                    <div class=\"row\">\r\n                                        <div class=\"col-sm-3\">\r\n                                            <h3 class=\"flash-title\">{{ data?.product?.name }}</h3>\r\n                                            <h6 class=\"skuId\">SKU: {{ data?.product?.code }}</h6>\r\n                                            <span *ngIf=\"data?.girth\">Grith: +{{data.girth}}mm </span>\r\n                                        </div>\r\n                                        <div class=\"offset-sm-3 col-sm-2\">\r\n                                            {{data?.quantityDouble}}{{data?.unitType}}\r\n                                        </div>\r\n                                        <div class=\"col-sm-2\">\r\n                                            {{data?.basePrice?.formattedValue}}/{{data?.unitType}}\r\n                                        </div>\r\n                                        <div class=\"col-sm-2\">\r\n                                            {{data?.totalPrice?.formattedValue}}\r\n                                            <span class=\"gst-text\">excl GST</span>\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </td>\r\n                    </tr>\r\n                </ng-container>\r\n            </ng-container>\r\n            <ng-template #nodata>\r\n                <tr class=\"revieworder-body-container\">\r\n                    <td colspan=\"7\" class=\"text-center\">{{noRecord}}</td>\r\n               </tr>\r\n             </ng-template>\r\n             \r\n        </table>\r\n\r\n\r\n</div>\r\n<div class=\"modal fade\" id=\"imageModal\" role=\"dialog\" aria-labelledby=\"imageModal\" aria-hidden=\"true\" #imageModal>\r\n    <div class=\"modal-dialog modal-lg\" role=\"document\">\r\n        <div class=\"modal-content\">\r\n            <div class=\"modal-header\">\r\n                <i class=\"icon-close invite-pop-close\" #closeInviteModal data-dismiss=\"modal\" aria-label=\"Close\"></i>\r\n            </div>\r\n            <div class=\"modal-body m-4\">\r\n                <img [src]=\"imageModalSrc\" alt=\"alert\" />\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: ["@charset \"UTF-8\";@media screen and (min-width: 1366px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: 1.063rem;--fontsize17-5: 1.1rem;--fontsize18: 1.125rem;--fontsize18-4: 1.5rem;--fontsize20: 1.25rem;--fontsize21: 1.313rem;--fontsize22: 1.375rem;--fontsize23: 1.438rem;--fontsize24: 1.5rem;--fontsize26: 1.625rem;--fontsize28: 1.75rem;--fontsize30: 1.625rem;--fontsize32: 2rem;--fontsize34: 2.125rem;--fontsize36: 2rem;--fontsize40: 2.25rem;--fontsize46: 2.875rem;--fontsize80: 5rem}}@media screen and (max-width: 1365px) and (min-width: 768px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2.875rem;--fontsize80: 3.5rem}}@media screen and (max-width: 767px){:root{--fontsize12: .75rem;--fontsize14: .875rem;--fontsize16: 1rem;--fontsize16-5: .77rem;--fontsize17: .9rem;--fontsize17-5: 1rem;--fontsize18: .875rem;--fontsize19: .938rem;--fontsize20: 1rem;--fontsize21: 1.063rem;--fontsize22: 1.125rem;--fontsize23: 1.188rem;--fontsize24: 1rem;--fontsize26: 1.25rem;--fontsize28: 1.5rem;--fontsize30: 1.25rem;--fontsize32: 1.75rem;--fontsize34: 1.875rem;--fontsize36: 1.625rem;--fontsize40: 2.5rem;--fontsize46: 2rem;--fontsize80: 2.5rem}}@font-face{font-family:icomoon;font-weight:400;src:url(../assets/fonts/icomoon.ttf) format(\"ttf\"),url(../assets/fonts/icomoon.woff) format(\"woff\");font-weight:normal;font-style:normal;font-display:swap}@font-face{font-family:\"Arial Regular\";src:url(../assets/fonts/arial-webfont.woff) format(\"woff\"),url(../assets/fonts/arial-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Bold\";src:url(../assets/fonts/arialbold-webfont.woff) format(\"woff\"),url(../assets/fonts/arialbold-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Arial Black\";src:url(../assets/fonts/arialblack-webfont.woff) format(\"woff\"),url(../assets/fonts/arialblack-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Reqular\";src:url(../assets/fonts/helveticaneue.woff) format(\"woff\"),url(../assets/fonts/helveticaneue.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Thin\";src:url(../assets/fonts/helveticaneuethin-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuethin-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}@font-face{font-family:\"Helvetica Neue Medium\";src:url(../assets/fonts/helveticaneuemedium-webfont.woff) format(\"woff\"),url(../assets/fonts/helveticaneuemedium-webfont.woff2) format(\"woff2\");font-weight:normal;font-style:normal}[class*=\" icon-\"],[class^=icon-]{font-family:icomoon!important;font-feature-settings:normal;font-variant:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-weight:400;line-height:1;text-transform:none;font-display:swap}.icon-right:before{content:\"\\e902\"}.icon-materials:before{content:\"\\e900\"}.icon-natural-lighting:before{content:\"\\e90a\"}.icon-rainwater:before{content:\"\\e901\"}.icon-roofing:before{content:\"\\e90b\"}.icon-flashing{position:relative;display:inline-block;height:32px;text-align:center;width:32px}.icon-flashing:before,.mainnav-link-level-2.show .navTagChild .icon-flashing:before{content:url(../assets/images/icon-flashing-white.svg);height:20px;width:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);line-height:15px}li.megamenuSubChild:hover .icon-flashing:before{content:url(../assets/images/icon-flashing-black.svg)}.icon-structural:before{content:\"\\e90c\"}.icon-accessories-old .path1:before{content:\"\\e903\"}.icon-accessories-old .path2:before{margin-left:-1em;content:\"\\e904\"}.icon-accessories-old .path3:before{margin-left:-1em;content:\"\\e905\"}.icon-cladding-old .path1:before{content:\"\\e90d\"}.icon-cladding-old .path2:before{margin-left:-1em;content:\"\\e90e\"}.icon-close:before{content:\"\\e90f\"}.icon-message:before{content:\"\\e910\"}.icon-search .path1:before{content:\"\\e906\"}.icon-search .path2:before{content:\"\\e907\"}.icon-search .path3:before{margin-left:-1.0156em;content:\"\\e908\"}.icon-summary:before{content:\"\\e911\"}.icon-branch:before{content:\"\\e912\"}.icon-delivery:before{content:\"\\e913\"}.icon-downloads:before{content:\"\\e909\"}.icon-drawings:before{content:\"\\e914\"}.icon-full:before{content:\"\\e915\"}.icon-manual:before{content:\"\\e916\"}.icon-payment:before{content:\"\\e917\"}.icon-empty .path1:before{content:\"\\e918\"}.icon-empty .path2:before{margin-left:-1em;content:\"\\e919\"}.icon-empty .path3:before{margin-left:-1em;content:\"\\e91a\"}.icon-product-overview:before{content:\"\\e91b\"}.icon-arrows:before{content:\"\\e91c\"}.icon-selected:before{content:\"\\e91d\"}.icon-accessories:before{content:\"\\e91b\"}.icon-cladding:before{content:\"\\e91e\"}.icon-Triangle:before{content:\"\\e91f\"}.icon-home:before{content:\"\\e920\"}.icon-faq:before{content:\"\\e921\"}.icon-temperature:before{content:\"\\e922\"}body header{font-family:\"Arial Regular\",sans-serif}header{background-color:#1d1d1b;position:sticky;top:0;background-size:100% 25%!important;background-repeat:no-repeat;z-index:10}header .header{max-width:100%;padding:0}header cx-banner cx-media img{margin-top:.7rem;margin-bottom:0}header label{display:inline-flex}header .SiteLinks{height:52px;display:flex;align-items:center;justify-content:space-between;padding-top:5px;padding-bottom:5px}header .SiteLinks cx-paragraph p{color:#fff;font-size:var(--fontsize16);line-height:var(--fontsize16);margin-bottom:0}header .SiteLinks cx-paragraph{font-size:var(--fontsize16)}header .SiteLinks app-account-dropdown,header .SiteLinks app-find-store{width:calc(25% - 25px);max-width:328px;margin-right:25px}header .SiteLinks app-contact-us{width:calc(20% - 25px);max-width:100px;margin-left:auto}header .SiteLinks app-custom-mini-cart{width:10%}header .SiteLinks .preferenceLink{margin-left:auto}header .SiteLinks .preferenceLink cx-generic-link{margin:0}header .SiteLinks .preferenceLink cx-generic-link cx-media img{height:22px;margin:0}header .SiteLogo .storeLogo{position:absolute;z-index:99;left:40px;bottom:10px}header .SiteLogo .homeLogo{max-width:28px;height:28px;position:absolute;z-index:99;bottom:47px}header .NavigationBar{flex:70%;background-color:#b61828;min-height:40px;display:flex;align-items:center;position:relative;z-index:10}header .logoutMenu{margin-top:0!important}header .logoutMenu li{cursor:pointer;background-color:#4c4c4c;color:#fff}header .logoutMenu li:hover{text-decoration:underline;background-color:#4c4c4c}header .MarketingContext{width:100%;margin:auto}.customer-service-icon{cursor:pointer}d .helpSupport{width:20rem;border:0;margin-top:.5rem!important;transform:translate(-42%,36px)!important;padding:1rem 1rem 0;background-color:#393939;color:#fff;top:0}d .helpSupport .arrow-up{position:absolute;top:-8px;right:44%;width:0;height:0;border-left:15px solid rgba(0,0,0,0);border-right:15px solid rgba(0,0,0,0);border-bottom:15px solid #393939}d .helpSupport .contact-us-info .heading{font-family:\"Arial Bold\",sans-serif}d .helpSupport .contact-us-info .detail{font-size:var(--fontsize14);line-height:2rem}d .helpSupport .contact-us-info .detail .service-icon{height:20px;width:20px;margin-right:10px}d .helpSupport .contact-us-info .contactLink a{font-size:var(--fontsize14);text-decoration:underline;text-transform:uppercase}d .helpSupport .contact-us-info a{color:#fff;text-decoration:none}d .helpSupport .contact-us-info a:hover{text-decoration:underline}.pageTitle{font-family:\"Helvetica Neue Regular\",sans-serif;font-size:var(--fontsize54)}@media screen and (max-width: 991px){cx-storefront header{background-color:#b61828}cx-storefront header cx-banner cx-media img{margin:auto}cx-storefront header .SiteLogo{width:100%;max-width:211px;margin:auto;padding-left:30px;box-sizing:border-box}cx-storefront header .SiteLogo .storeLogo{position:unset}cx-storefront header .SearchBox{margin:14px 0 10px;width:30px}cx-storefront header .SiteLinks{background-color:transparent;width:110px;margin:auto 25px auto 0}cx-storefront header .SiteLinks app-account-dropdown,cx-storefront header .SiteLinks app-find-store,cx-storefront header .SiteLinks app-contact-us,cx-storefront header .SiteLinks cx-paragraph,cx-storefront header .SiteLinks .preferenceLink{display:none}cx-storefront header .SiteLinks app-custom-mini-cart,cx-storefront header .SiteLinks app-custom-user-account{width:35px}cx-storefront header.is-expanded{overflow-y:auto;position:fixed;bottom:0;top:0;width:calc(100% - 99px)}cx-storefront header.is-expanded .header{background-color:#b61828;margin-left:0}cx-storefront header.is-expanded .PreHeader{position:absolute;right:15px;top:15px}cx-storefront header.is-expanded .SearchBox{display:none}cx-storefront header.is-expanded .SiteLogo{position:absolute;top:25px;z-index:9}cx-storefront header.is-expanded .SiteLinks{background-color:#1d1d1b;width:100%;margin:15px auto 15px 0;height:unset;padding:15px;max-width:100%;position:relative;z-index:9;top:60px}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-account-dropdown{width:100%;max-width:100%}cx-storefront header.is-expanded .SiteLinks app-find-store{width:50%;max-width:328px;min-width:328px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-right:15px;margin-left:auto;width:115px;max-width:unset}cx-storefront header.is-expanded .navigation{position:relative;top:45px}cx-storefront header.is-expanded:before{background-color:#0000004d;right:0;content:\"\";position:fixed;z-index:2;top:0;bottom:0;height:100vh;width:99px}cx-storefront header.is-expanded:after{background-color:transparent}}@media screen and (max-width: 576px){cx-storefront header .SiteLogo{max-width:80px}cx-storefront header .SiteLogo .storeLogo{display:none}cx-storefront header .searchBox{height:45px}cx-storefront header.is-expanded{width:100%}cx-storefront header.is-expanded .header,cx-storefront header.is-expanded .navigation{width:100%}cx-storefront header.is-expanded .SiteLogo{max-width:211px!important}cx-storefront header.is-expanded .SiteLogo .storeLogo{display:block}cx-storefront header.is-expanded .SiteLinks{max-width:100%;width:100%}cx-storefront header.is-expanded .SiteLinks app-account-dropdown,cx-storefront header.is-expanded .SiteLinks app-find-store,cx-storefront header.is-expanded .SiteLinks app-contact-us,cx-storefront header.is-expanded .SiteLinks cx-paragraph,cx-storefront header.is-expanded .SiteLinks .preferenceLink{display:block}cx-storefront header.is-expanded .SiteLinks app-custom-mini-cart,cx-storefront header.is-expanded .SiteLinks app-custom-user-account{display:none}cx-storefront header.is-expanded .SiteLinks app-find-store{width:100%;max-width:100%;margin-bottom:10px}cx-storefront header.is-expanded .SiteLinks app-contact-us{margin-left:0}cx-storefront header.is-expanded .SiteLinks cx-paragraph{margin-left:auto}cx-storefront header.is-expanded:before{display:none}}#visualization-container{text-align:center;margin:0 auto}#cds-viewer-container-3d{width:320px;height:200px}#cds-viewer-container-2d{width:320px;height:200px}[aria-label=Close]{cursor:pointer}cx-media.is-missing{background:url(./assets/images/search-noimage.svg);background-size:cover;background-position:center;background-repeat:no-repeat}.table{color:#1d1d1b;background:#ffffff}.table td{border:0;vertical-align:top!important}.revieworder-table-container{padding-bottom:15rem}.revieworder-table-container .revieworder-header-container{background:#646363;color:#fff;font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .revieworder-header-container th{vertical-align:middle!important}.revieworder-table-container .revieworder-header-container .colHD{width:120px;font-size:14px;display:flex;flex-direction:column;align-self:center;line-height:18px}.revieworder-table-container .revieworder-header-container .colHD span{text-align:right;display:block;font-size:12px}.revieworder-table-container .revieworder-header-container .item{width:350px}.revieworder-table-container .product-img{width:50px;height:50px;border:1px solid #E0E0E0;min-width:50px}.revieworder-table-container .product-img cx-media{top:-1px}.revieworder-table-container .borderNew{border-bottom:1px solid #E0E0E0}.revieworder-table-container .statusColm{width:140px}.revieworder-table-container .statusColor{display:inline-block;width:12px;height:12px;border-radius:50%}.revieworder-table-container .subPrice{color:#707070}.revieworder-table-container .revieworder-body-container{padding-bottom:1rem}.revieworder-table-container .revieworder-body-container .product-image-container{display:flex}.revieworder-table-container .revieworder-body-container .product-image-container .reviewproduct-image{width:71px;height:71px}.revieworder-table-container .revieworder-body-container .product-image-container .reviewproduct-name{font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .revieworder-body-container .product-image-container .sku-text{font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif;color:#6f6f6f}.revieworder-table-container .revieworder-body-container .see-more-link{text-decoration:underline}.revieworder-table-container .revieworder-body-container .see-more-link:hover{color:#d51317}.revieworder-table-container .revieworder-body-container .seemoredetails-link{font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif;text-decoration:underline;cursor:pointer}.revieworder-table-container .revieworder-body-container .seemoredetails-link:hover{color:#b61828}.revieworder-table-container .revieworder-body-container .revieworder-collapse .bundle-details{background:#F6F6F6;border:1px solid #E0E0E0;margin-left:15px;padding:1rem;line-height:2.5rem}.revieworder-table-container .revieworder-body-container .revieworder-collapse .bundle-details .bundle-details-header{font-family:\"Arial Bold\",sans-serif}.revieworder-table-container .colors-paragraph{display:flex;align-items:center}.revieworder-table-container .colors-paragraph .revieworder-color{width:20px;height:20px;border:1px solid #000000;display:inline-flex}::ng-deep .flashing-expand{cursor:pointer}::ng-deep .flashing-expand:after{background:url(../../../../assets/images/expand-icon.svg) no-repeat center;z-index:2;width:24px;content:\"\";height:24px;position:absolute;top:0;right:0}::ng-deep .flashing-expand img{max-height:40px;max-width:40px}::ng-deep .flashing-expand.flashing-open:after{background:url(../../../../assets/images/expand-icon.svg) no-repeat center}#imageModal.show{display:flex!important;vertical-align:middle!important;align-items:center!important}#imageModal.show .modal-header{justify-content:right;border:none}#imageModal.show .modal-body{text-align:center;vertical-align:middle;margin:0 auto}#imageModal.show .modal-body img{max-width:100%;max-height:80vh}.flashing-block{background-color:#e8e8e8;padding:12px;border-bottom:1px solid #C6C6C6}.flashing-block .flash-title{font-size:var(--fontsize16);font-family:\"Arial Bold\",sans-serif}.flashing-block .skuId{color:#707070;font-size:var(--fontsize14);font-family:\"Arial Bold\",sans-serif}.flashing-block .gst-text{display:block;font-size:var(--fontsize16);font-family:\"Arial Regular\",sans-serif}\n"], components: [{ type: i2.MediaComponent, selector: "cx-media", inputs: ["container", "format", "alt", "role", "loading"], outputs: ["loaded"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], pipes: { "async": i3.AsyncPipe, "date": i3.DatePipe, "slice": i3.SlicePipe, "number": i3.DecimalPipe } });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0, type: OrderDetailListComponent, decorators: [{
            type: Component,
            args: [{
                    selector: 'app-order-detail-list',
                    templateUrl: './order-detail-list.component.html',
                    styleUrls: ['./order-detail-list.component.scss']
                }]
        }], ctorParameters: function () { return [{ type: i1.CartService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { cartDetails: [{
                type: Input
            }], sortByVal: [{
                type: Input
            }], orderDate: [{
                type: Input
            }], isCardData: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 