@propmix/profet-common-header 3.0.15-utility-unstable.8 → 3.0.17-cross-tab-session-expiry

package/fesm2020/propmix-profet-common-header.mjs

@@ -1,20 +1,19 @@
-import * as i0 from '@angular/core';
-import { inject, Injectable, Pipe, Component, Inject, InjectionToken, Injector, EventEmitter, Input, Output, ViewChild, HostListener, NgModule } from '@angular/core';
-import { HttpClient, HttpHeaders, HttpClientModule } from '@angular/common/http';
-import * as i1 from '@angular/material/dialog';
-import { MAT_DIALOG_DATA, MatDialog, MatDialogModule } from '@angular/material/dialog';
-import { Observable, ReplaySubject, Subject, reduce } from 'rxjs';
 import * as i1$1 from '@angular/common';
 import { CommonModule, TitleCasePipe, LowerCasePipe } from '@angular/common';
-import * as i3 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
+import { HttpClient, HttpClientModule } from '@angular/common/http';
+import * as i0 from '@angular/core';
+import { Component, Inject, inject, Injectable, Pipe, EventEmitter, Input, Output, ViewChild, HostListener, NgModule } from '@angular/core';
+import * as i11 from '@angular/forms';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
 import * as i4 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
-import * as i3$1 from '@angular/forms';
-import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import * as i1 from '@angular/material/dialog';
+import { MAT_DIALOG_DATA, MatDialog, MatDialogModule } from '@angular/material/dialog';
 import { MatDividerModule } from '@angular/material/divider';
 import * as i8 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
+import * as i3 from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
 import { MatListModule } from '@angular/material/list';
 import * as i6 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
@@ -31,8 +30,24 @@ import { DomSanitizer } from '@angular/platform-browser';
 import * as i1$2 from '@angular/router';
 import { Router } from '@angular/router';
 import { signOut } from 'aws-amplify/auth';
+import { Observable, ReplaySubject, reduce } from 'rxjs';
 import * as i10 from '@angular/material/core';
 
+class CompanySwitchWarningComponent {
+    constructor(comInfo) {
+        this.comInfo = comInfo;
+    }
+}
+CompanySwitchWarningComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CompanySwitchWarningComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
+CompanySwitchWarningComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CompanySwitchWarningComponent, selector: "lib-company-switch-warning", ngImport: i0, template: "<div class=\"switchCompanyDialog\">\n    <h3 mat-dialog-title class=\"mb-5\">Switch Company</h3>\n    <p class=\"confirmation-msg\">\n        Switching company to <span>{{comInfo?.switchingCompany}}.</span> <br />\n        Are you sure to continue?\n    </p>\n    <mat-dialog-actions class=\"switchCompanyActions\">\n        <button color=\"primary\" mat-button mat-dialog-close>Cancel</button>\n        <button color=\"primary\" class=\"proceedBtn\" mat-flat-button [mat-dialog-close]=\"true\"\n            cdkFocusInitial>Yes, Switch Company</button>\n    </mat-dialog-actions>\n</div>  ", styles: [".switchCompanyDialog{min-width:320px}.switchCompanyDialog h3{padding:0;text-align:center}.switchCompanyDialog p{width:100%;text-align:center;color:#292929}.switchCompanyDialog p span{font-weight:500;color:#000}.switchCompanyActions{text-align:center;display:block}.proceedBtn{color:#fff}.confirmation-msg{font-size:1rem}\n"], dependencies: [{ kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CompanySwitchWarningComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-company-switch-warning', template: "<div class=\"switchCompanyDialog\">\n    <h3 mat-dialog-title class=\"mb-5\">Switch Company</h3>\n    <p class=\"confirmation-msg\">\n        Switching company to <span>{{comInfo?.switchingCompany}}.</span> <br />\n        Are you sure to continue?\n    </p>\n    <mat-dialog-actions class=\"switchCompanyActions\">\n        <button color=\"primary\" mat-button mat-dialog-close>Cancel</button>\n        <button color=\"primary\" class=\"proceedBtn\" mat-flat-button [mat-dialog-close]=\"true\"\n            cdkFocusInitial>Yes, Switch Company</button>\n    </mat-dialog-actions>\n</div>  ", styles: [".switchCompanyDialog{min-width:320px}.switchCompanyDialog h3{padding:0;text-align:center}.switchCompanyDialog p{width:100%;text-align:center;color:#292929}.switchCompanyDialog p span{font-weight:500;color:#000}.switchCompanyActions{text-align:center;display:block}.proceedBtn{color:#fff}.confirmation-msg{font-size:1rem}\n"] }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MAT_DIALOG_DATA]
+                }] }]; } });
+
 class EndPoints {
 }
 EndPoints.API_URLS = {
@@ -44,8 +59,7 @@ EndPoints.API_URLS = {
     getUserDetails: '/api/user/getUserInformation',
     getCompanyList: '/api/user/getUserCompanies',
     getAppMenu: '/api/user/getAppMenu',
-    updateLastAccessedApplication: '/api/user/updateLastAccessedApplication',
-    appraisalChat: '/api/user/chat'
+    updateLastAccessedApplication: '/api/user/updateLastAccessedApplication'
 };
 
 class ApiGatewayService {
@@ -54,9 +68,17 @@ class ApiGatewayService {
     }
     doGet(url, config) {
         return new Observable(observer => {
-            let headers = config?.httpHeader ?? new HttpHeaders();
-            if (config?.isUnauthorized) {
-                headers = headers.set('skip', 'true');
+            if (!config) {
+                config = {
+                    isLoaderHidden: false
+                };
+            }
+            ;
+            let headers;
+            if (config.isUnauthorized) {
+                headers = {
+                    skip: "true"
+                };
             }
             // this._loaderService.requestStarted(config);
             this._http
@@ -143,10 +165,10 @@ class SessionExpiryInfoComponent {
     }
 }
 SessionExpiryInfoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SessionExpiryInfoComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-SessionExpiryInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SessionExpiryInfoComponent, selector: "lib-session-expiry-info", ngImport: i0, template: "<mat-dialog-content style=\"padding: 15px;\">\n    <div style=\"display: inline-block;\">\n        <mat-icon class=\"session-icon\">search_activity</mat-icon>\n    </div>\n    <div style=\"display: inline-block;margin-left: 20px;\">\n        <h2 style=\"margin-bottom: 0px;\">Session Expired</h2>\n        <p *ngIf=\"!sessionInfo?.sessionOutTimeInMins\">You will be redirected to the Login page.</p>\n        <p *ngIf=\"sessionInfo?.sessionOutTimeInMins\">Session expired due to inactivity in the last\n            {{sessionInfo.sessionOutTimeInMins | millisecondsToMinute}}</p>\n    </div>\n    <div>\n        <button class=\"btn-ok\" mat-flat-button color=\"primary\" cdkFocusInitial (click)=\"redirectLogin()\">OK</button>\n    </div>\n</mat-dialog-content>", styles: [".session-icon{font-size:50px!important;width:auto;height:auto;top:7px;position:relative;color:#ec5d57}.btn-ok{margin-top:20px;float:right}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "pipe", type: MillisecondsToMinutePipe, name: "millisecondsToMinute" }] });
+SessionExpiryInfoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SessionExpiryInfoComponent, selector: "lib-session-expiry-info", ngImport: i0, template: "<mat-dialog-content style=\"padding: 15px;\">\n    <div style=\"display: inline-block;\">\n        <mat-icon class=\"session-icon\">search_activity</mat-icon>\n    </div>\n    <div style=\"display: inline-block;margin-left: 20px;\">\n        <h2 style=\"margin-bottom: 0px;\">Session Expired</h2>\n        <p *ngIf=\"!sessionInfo?.sessionOutTimeInMins\">Your session has expired.</p>\n        <p *ngIf=\"sessionInfo?.sessionOutTimeInMins\">Session expired due to inactivity in the last\n            {{sessionInfo.sessionOutTimeInMins | millisecondsToMinute}}</p>\n    </div>\n    <div>\n        <button class=\"btn-ok\" mat-flat-button color=\"primary\" cdkFocusInitial mat-dialog-close>OK</button>\n    </div>\n</mat-dialog-content>", styles: [".session-icon{font-size:50px!important;width:auto;height:auto;top:7px;position:relative;color:#ec5d57}.btn-ok{margin-top:20px;float:right}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "pipe", type: MillisecondsToMinutePipe, name: "millisecondsToMinute" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SessionExpiryInfoComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-session-expiry-info', template: "<mat-dialog-content style=\"padding: 15px;\">\n    <div style=\"display: inline-block;\">\n        <mat-icon class=\"session-icon\">search_activity</mat-icon>\n    </div>\n    <div style=\"display: inline-block;margin-left: 20px;\">\n        <h2 style=\"margin-bottom: 0px;\">Session Expired</h2>\n        <p *ngIf=\"!sessionInfo?.sessionOutTimeInMins\">You will be redirected to the Login page.</p>\n        <p *ngIf=\"sessionInfo?.sessionOutTimeInMins\">Session expired due to inactivity in the last\n            {{sessionInfo.sessionOutTimeInMins | millisecondsToMinute}}</p>\n    </div>\n    <div>\n        <button class=\"btn-ok\" mat-flat-button color=\"primary\" cdkFocusInitial (click)=\"redirectLogin()\">OK</button>\n    </div>\n</mat-dialog-content>", styles: [".session-icon{font-size:50px!important;width:auto;height:auto;top:7px;position:relative;color:#ec5d57}.btn-ok{margin-top:20px;float:right}\n"] }]
+            args: [{ selector: 'lib-session-expiry-info', template: "<mat-dialog-content style=\"padding: 15px;\">\n    <div style=\"display: inline-block;\">\n        <mat-icon class=\"session-icon\">search_activity</mat-icon>\n    </div>\n    <div style=\"display: inline-block;margin-left: 20px;\">\n        <h2 style=\"margin-bottom: 0px;\">Session Expired</h2>\n        <p *ngIf=\"!sessionInfo?.sessionOutTimeInMins\">Your session has expired.</p>\n        <p *ngIf=\"sessionInfo?.sessionOutTimeInMins\">Session expired due to inactivity in the last\n            {{sessionInfo.sessionOutTimeInMins | millisecondsToMinute}}</p>\n    </div>\n    <div>\n        <button class=\"btn-ok\" mat-flat-button color=\"primary\" cdkFocusInitial mat-dialog-close>OK</button>\n    </div>\n</mat-dialog-content>", styles: [".session-icon{font-size:50px!important;width:auto;height:auto;top:7px;position:relative;color:#ec5d57}.btn-ok{margin-top:20px;float:right}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -194,9 +216,6 @@ class Utilities {
 }
 
 class CommonHeaderService {
-    toggleUtilityContentDrawer() {
-        this.utilityContentDrawerSub.next();
-    }
     constructor(config) {
         this.config = config;
         this.baseUrl = '';
@@ -207,8 +226,6 @@ class CommonHeaderService {
         this.activeMenuList$ = this.menuStateSubject.asObservable();
         this.companyListSubject = new ReplaySubject(1);
         this.companyList$ = this.companyListSubject.asObservable();
-        this.utilityContentDrawerSub = new Subject();
-        this.utilityContentToggle$ = this.utilityContentDrawerSub.asObservable();
         this.headerConfig = config;
         this.baseUrl = config.apiUrl;
     }
@@ -294,32 +311,6 @@ class CommonHeaderService {
         let url = `${this.baseUrl + EndPoints.API_URLS.updateLastAccessedApplication}`;
         return this._apiGatewayService.doPost(url, reqBody);
     }
-    objectToQueryParams(obj) {
-        const params = new URLSearchParams();
-        for (const key in obj) {
-            if (obj[key] !== undefined && obj[key] !== null) {
-                params.append(key, obj[key]);
-            }
-        }
-        return params.toString();
-    }
-    getCookie(name) {
-        const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
-        return match ? decodeURIComponent(match[2]) : null;
-    }
-    getQueryResponse(request) {
-        let url = `${this.baseUrl + EndPoints.API_URLS.appraisalChat}`;
-        if (request?.query) {
-            url = `${url}?${this.objectToQueryParams(request)}`;
-        }
-        const chatCtx = this.getCookie('profet-ctx');
-        const headers = chatCtx ? new HttpHeaders().set('profet-ctx', chatCtx) : undefined;
-        let config = {};
-        if (chatCtx) {
-            config.httpHeader = headers;
-        }
-        return this._apiGatewayService.doGet(url, config);
-    }
 }
 CommonHeaderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CommonHeaderService, deps: [{ token: 'headerConfig' }], target: i0.ɵɵFactoryTarget.Injectable });
 CommonHeaderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CommonHeaderService, providedIn: 'root' });
@@ -333,30 +324,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                     args: ['headerConfig']
                 }] }]; } });
 
-class BaseController {
-    constructor() {
-        this.commonService = inject(CommonHeaderService);
-    }
-    close() {
-        this.commonService.toggleUtilityContentDrawer();
-    }
-}
-
-class CompanySwitchWarningComponent {
-    constructor(comInfo) {
-        this.comInfo = comInfo;
-    }
-}
-CompanySwitchWarningComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CompanySwitchWarningComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-CompanySwitchWarningComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: CompanySwitchWarningComponent, selector: "lib-company-switch-warning", ngImport: i0, template: "<div class=\"switchCompanyDialog\">\n    <h3 mat-dialog-title class=\"mb-5\">Switch Company</h3>\n    <p class=\"confirmation-msg\">\n        Switching company to <span>{{comInfo?.switchingCompany}}.</span> <br />\n        Are you sure to continue?\n    </p>\n    <mat-dialog-actions class=\"switchCompanyActions\">\n        <button color=\"primary\" mat-button mat-dialog-close>Cancel</button>\n        <button color=\"primary\" class=\"proceedBtn\" mat-flat-button [mat-dialog-close]=\"true\"\n            cdkFocusInitial>Yes, Switch Company</button>\n    </mat-dialog-actions>\n</div>  ", styles: [".switchCompanyDialog{min-width:320px}.switchCompanyDialog h3{padding:0;text-align:center}.switchCompanyDialog p{width:100%;text-align:center;color:#292929}.switchCompanyDialog p span{font-weight:500;color:#000}.switchCompanyActions{text-align:center;display:block}.proceedBtn{color:#fff}.confirmation-msg{font-size:1rem}\n"], dependencies: [{ kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CompanySwitchWarningComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-company-switch-warning', template: "<div class=\"switchCompanyDialog\">\n    <h3 mat-dialog-title class=\"mb-5\">Switch Company</h3>\n    <p class=\"confirmation-msg\">\n        Switching company to <span>{{comInfo?.switchingCompany}}.</span> <br />\n        Are you sure to continue?\n    </p>\n    <mat-dialog-actions class=\"switchCompanyActions\">\n        <button color=\"primary\" mat-button mat-dialog-close>Cancel</button>\n        <button color=\"primary\" class=\"proceedBtn\" mat-flat-button [mat-dialog-close]=\"true\"\n            cdkFocusInitial>Yes, Switch Company</button>\n    </mat-dialog-actions>\n</div>  ", styles: [".switchCompanyDialog{min-width:320px}.switchCompanyDialog h3{padding:0;text-align:center}.switchCompanyDialog p{width:100%;text-align:center;color:#292929}.switchCompanyDialog p span{font-weight:500;color:#000}.switchCompanyActions{text-align:center;display:block}.proceedBtn{color:#fff}.confirmation-msg{font-size:1rem}\n"] }]
-        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
-                    type: Inject,
-                    args: [MAT_DIALOG_DATA]
-                }] }]; } });
-
 class AppConfig {
 }
 AppConfig.appConfig = {
@@ -378,8 +345,6 @@ AppConfig.appConfig = {
     }
 };
 
-const UTILITY_WIDGET_CONFIG = new InjectionToken('UTILITY_WIDGET_CONFIG');
-
 var PROFET_APPS;
 (function (PROFET_APPS) {
     PROFET_APPS["profet_portal"] = "profet_portal";
@@ -431,29 +396,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
         }], ctorParameters: function () { return [{ type: i1$2.Router }]; } });
 
 class HeaderComponent {
-    async openItem(item) {
-        // this.selected = item;
-        if (item.loadComponent) {
-            this.componentToLoad = await item.loadComponent();
-            this.dynamicInjector = Injector.create({
-                parent: this.injector,
-                providers: [
-                    {
-                        provide: UTILITY_WIDGET_CONFIG,
-                        useValue: item.config?.useValue ?? {}
-                    }
-                ]
-            });
-        }
-        // toggle: if clicking the same item again, close drawer
-        if (this.selected?.id === item.id) {
-            this.selected = undefined;
-            this.utilitySpace.close();
-        }
-        else {
-            this.selected = item;
-        }
-    }
     constructor() {
         this.portalUrl = '';
         this.userImageLink = null;
@@ -469,12 +411,6 @@ class HeaderComponent {
         this.appConfig = AppConfig.appConfig;
         this.companyList = [];
         this.menuList = [];
-        this.config = [];
-        this.defaultApps = [];
-        this.componentToLoad = null;
-        this.injector = inject(Injector);
-    }
-    async ngOnChanges(changes) {
     }
     async ngOnInit() {
         this.updateLastAccessedAppInfo();
@@ -492,14 +428,6 @@ class HeaderComponent {
                 }
             }
         });
-        if (!this._headerSer.headerConfig.disableAppraisalAssistantApp) {
-            this.defaultApps.push({
-                id: 'appraisal-assistant',
-                label: 'Appraisal Assistant',
-                icon: '3p',
-                loadComponent: () => import('./propmix-profet-common-header-appraisal-assistant-chat-widget.component-8816b836.mjs').then(m => m.AppraisalAssistantChatWidgetComponent)
-            });
-        }
         // if (userInfo?.username) {
         //   let userDetails = this._headerSer.getUserDetails();
         //   forkJoin([userDetails]).subscribe({
@@ -516,21 +444,119 @@ class HeaderComponent {
         //   });
         // }
         this.resetTimer();
-        this._headerSer.utilityContentToggle$.subscribe(_ => {
-            this.closeUtilitySpace();
-        });
+        // Clear any stale logout signal on init
+        this.setCookie('session_expired', '', -1);
+        this.startLogoutCheck();
+    }
+    /**
+     * Helper to get the root domain (e.g. .mycom.ai) to share cookies across subdomains/ports.
+     * If on localhost or an IP, it falls back to the hostname.
+     */
+    getRootDomain() {
+        const hostname = window.location.hostname;
+        const parts = hostname.split('.');
+        if (parts.length > 2 && !/^\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}$/.test(hostname)) {
+            // If we have 4+ parts (e.g. app1.local.profet.ai), we want to include the environment (local.profet.ai)
+            // to avoid sharing cookies with app1.dev.profet.ai or app1.profet.ai.
+            if (parts.length > 3) {
+                return '.' + parts.slice(-3).join('.');
+            }
+            // For standard 3 parts (app1.profet.ai), share on .profet.ai
+            return '.' + parts.slice(-2).join('.');
+        }
+        return hostname;
+    }
+    setCookie(name, value, days) {
+        let expires = "";
+        if (days) {
+            const date = new Date();
+            date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
+            expires = "; expires=" + date.toUTCString();
+        }
+        // Important: set domain to allow sharing across subdomains
+        const domain = "; domain=" + this.getRootDomain();
+        document.cookie = name + "=" + (value || "") + expires + domain + "; path=/";
     }
-    resetTimer() {
+    getCookie(name) {
+        const nameEQ = name + "=";
+        const ca = document.cookie.split(';');
+        for (let i = 0; i < ca.length; i++) {
+            let c = ca[i];
+            while (c.charAt(0) == ' ')
+                c = c.substring(1, c.length);
+            if (c.indexOf(nameEQ) == 0)
+                return c.substring(nameEQ.length, c.length);
+        }
+        return null;
+    }
+    resetTimer(isUserActivity = true) {
         clearTimeout(this.inactivityTimeout);
+        // Update global activity timestamp in cookie ONLY if triggered by user activity
+        if (isUserActivity) {
+            // Use a short expiry (e.g. 1 day) or sync with session length
+            this.setCookie('lastActiveSessionTime', Date.now().toString(), 1);
+        }
         if (!this._headerSer.isSessionExpiryDialogOpen) {
             this.inactivityTimeout = setTimeout(() => {
-                this.logoutEvent.emit();
-                signOut({ global: true, oauth: { redirectUrl: this._headerSer.headerConfig.signOutUrl } });
-                this._headerSer.openSessionExpireInfo({ sessionOutTimeInMins: this.INACTIVITY_LIMIT });
-                clearTimeout(this.inactivityTimeout);
+                // Check global activity before logging out
+                const lastActive = this.getCookie('lastActiveSessionTime');
+                const now = Date.now();
+                const lastActiveTime = lastActive ? parseInt(lastActive, 10) : 0;
+                const elapsed = now - lastActiveTime;
+                if (lastActive && elapsed < this.INACTIVITY_LIMIT) {
+                    // User was active in another tab/app recently
+                    // Reschedule the check, but DO NOT update the activity timestamp
+                    this.resetTimer(false);
+                }
+                else {
+                    // Really inactive across all known tabs
+                    this.handleLogout();
+                }
             }, this.INACTIVITY_LIMIT);
         }
     }
+    /**
+       * Helper to identify the session expiry in in-active tabs.
+    */
+    startLogoutCheck() {
+        // Poll for the logout signal cookie (works across ports/subdomains)
+        this.logoutCheckInterval = setInterval(() => {
+            if (this.getCookie('session_expired')) {
+                this.handleLogout(false);
+            }
+        }, 2000); // Check every 2 seconds
+    }
+    handleLogout(broadcast = true, showPopup = true) {
+        // Prevent multiple popups if already open
+        if (this._headerSer.isSessionExpiryDialogOpen && showPopup) {
+            return; // If popup is already open and we want to show it, do nothing (it's there). 
+            // If we don't want to show it (manual logout), we proceed to signOut anyway? 
+        }
+        if (broadcast) {
+            // Set a cookie to signal other tabs/ports
+            this.setCookie('session_expired', 'true', 1);
+        }
+        this.logoutEvent.emit();
+        let sessionUrl = this._headerSer.headerConfig.signOutUrl + '?sessionExpired=true&timeout=' + this.INACTIVITY_LIMIT;
+        signOut({ global: true, oauth: { redirectUrl: sessionUrl } })
+            .then(() => {
+            window.open(sessionUrl, '_self');
+        })
+            .catch((error) => {
+            console.error('Logout failed:', error);
+            window.open(sessionUrl, '_self');
+        });
+        // if (showPopup) {
+        //   this._headerSer.openSessionExpireInfo({ sessionOutTimeInMins: this.INACTIVITY_LIMIT });
+        // }
+        if (this.inactivityTimeout) {
+            clearTimeout(this.inactivityTimeout);
+        }
+        // Stop polling once we are logging out
+        if (this.logoutCheckInterval) {
+            clearInterval(this.logoutCheckInterval);
+        }
+    }
     selectCurrentCompany() {
         let com = this.companyList.find(x => x.isActive);
         this.activeCompany = com;
@@ -542,10 +568,6 @@ class HeaderComponent {
     sideMenuToggle() {
         this.sidenav.toggle();
     }
-    closeUtilitySpace() {
-        this.selected = undefined;
-        this.utilitySpace.close();
-    }
     groupByAppType(menuList) {
         let grouped = menuList.reduce((r, a) => {
             r[a.appType] = r[a.appType] || [];
@@ -621,6 +643,13 @@ class HeaderComponent {
         }
     }
     onLogoutClick() {
+        // Sync with other tabs
+        this.setCookie('session_expired', 'true', 1);
+        // Clear timers
+        if (this.inactivityTimeout)
+            clearTimeout(this.inactivityTimeout);
+        if (this.logoutCheckInterval)
+            clearInterval(this.logoutCheckInterval);
         this.logoutEvent.emit();
         signOut({ global: true, oauth: { redirectUrl: this._headerSer.headerConfig.signOutUrl } })
             .then((data) => {
@@ -701,13 +730,16 @@ class HeaderComponent {
         if (this.inactivityTimeout) {
             clearTimeout(this.inactivityTimeout);
         }
+        if (this.logoutCheckInterval) {
+            clearInterval(this.logoutCheckInterval);
+        }
     }
 }
 HeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: HeaderComponent, selector: "lib-header", inputs: { INACTIVITY_LIMIT: "INACTIVITY_LIMIT", config: "config" }, outputs: { logoutEvent: "logoutEvent" }, host: { listeners: { "document:mousemove": "resetTimer()", "document:keydown": "resetTimer()", "document:click": "resetTimer()", "document:touchstart": "resetTimer()", "document:touchmove": "resetTimer()", "document:scroll": "resetTimer()", "window:focus": "resetTimer()" } }, viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["sidenav"], descendants: true }, { propertyName: "utilitySpace", first: true, predicate: ["utilitySpaceDrawer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n    <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n        <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n        <div class=\"app-menu-content-section\">\n            <ng-container *ngFor=\"let appType of menuList\">\n                <div class=\"appList\">\n                    <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n                </div>\n                <div class=\"subHeadListItems\">\n                    <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n                        [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n                        <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n                        <span>{{ item.menuName }}</span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n    </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n    <!-- Main nav button and navigation links -->\n    <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n        class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n        matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n        matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n    <a class=\"navbar-brand me-auto\" href=\"#\">\n        <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n            alt=\"App Logo\" class=\"app-logo\">\n    </a>\n    <ng-content select=\"[headerInfo]\"></ng-content>\n    <!-- <ng-content></ng-content> -->\n\n    <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n        <mat-label>Company</mat-label>\n        <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\">\n            <mat-option *ngFor=\"let opt of companyList\" [value]=\"opt\">\n                {{opt.name}}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n\n    <!-- Profile button and profile dropdown links -->\n    <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n        matTooltipPosition=\"below\">\n        <div class=\"profile-inner\">\n            <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n                [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n                [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n            <div class=\"avatar\">\n                <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n                <ng-template #defaultAvatar><img\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n                        class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n            </div>\n        </div>\n    </button>\n    <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n        <div class=\"popover-content show-menu\">\n            <div class=\"popover-header\">\n                <div class=\"popover-user-top\">\n                    <div class=\"avatar-wrapper\">\n                        <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n                            alt=\"Avatar\">\n                        <ng-template #defaultLargeAvatar>\n                            <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n                                class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n                        </ng-template>\n                    </div>\n                    <div class=\"user-data\">\n                        <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n                                userAuthData?.lastName }}</span></h3>\n                        <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n                            (click)=\"profile()\">View Profile</button>\n                    </div>\n                </div>\n            </div>\n            <div class=\"popover-body\">\n                <!-- <div class=\"popover-content-title\">\n                    <p>Overview</p>\n                </div> -->\n\n                <div *ngIf=\"userAuthData?.email\">\n                    <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n                        <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n                            userAuthData?.email }}</span>\n                    </p>\n                </div>\n                <ng-container *ngIf=\"userAuthData?.contactPhone\">\n                    <p mat-menu-item class=\"list-text mb-3\">\n                        <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n                            userAuthData?.contactPhone }}</span>\n                    </p>\n                </ng-container>\n\n                <hr />\n                <ul cdkMenu class=\"list-group last-group my-1\">\n                    <li cdkMenuItem class=\"list-item py-2\">\n                        <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n                            <mat-icon>power_settings_new</mat-icon>\n                            <span class=\"list-text\">Logout</span>\n                        </button>\n                    </li>\n                </ul>\n            </div>\n        </div>\n    </mat-menu>\n</mat-toolbar>\n<mat-drawer-container class=\"outer-drawer-container\" autosize>\n    <mat-drawer #utilityDrawer class=\"utility-menu-drawer\" mode=\"side\" position=\"end\">\n        <ng-container *ngIf=\"defaultApps.length > 0\">\n            <button mat-icon-button color=\"primary\" class=\"btn-right-menu\" aria-label=\"Button\"\n                *ngFor=\"let item of defaultApps\" (click)=\"openItem(item)\">\n                <mat-icon>{{ item.icon }}</mat-icon>\n            </button>\n            <hr>\n        </ng-container>\n        <ng-container *ngIf=\"config.length > 0\">\n            <button mat-icon-button color=\"primary\" class=\"btn-right-menu\" aria-label=\"Button\"\n                *ngFor=\"let item of config\" (click)=\"openItem(item)\">\n                <mat-icon>{{ item.icon }}</mat-icon>\n            </button>\n        </ng-container>\n    </mat-drawer>\n    <mat-drawer-content>\n        <mat-drawer-container class=\"inner-drawer-container\" autosize>\n            <mat-drawer #utilitySpaceDrawer class=\"utility-content-drawer\" position=\"end\"\n                [mode]=\"selected?.layout || 'side'\" [opened]=\"!!selected\" (closed)=\"selected = undefined\">\n                <ng-container *ngIf=\"componentToLoad\">\n                    <ng-container *ngComponentOutlet=\"componentToLoad; injector: dynamicInjector\"></ng-container>\n                </ng-container>\n            </mat-drawer>\n            <!-- <mat-drawer #sampleDrawer position=\"end\" mode=\"over\">\n        <p>Sample content</p>\n      </mat-drawer> -->\n            <mat-drawer-content><ng-content class=\"body_content\"\n                    select=\"[bodyContentInfo]\"></ng-content></mat-drawer-content>\n        </mat-drawer-container>\n        <button type=\"button\" mat-button class=\"utility-toggle-button\"\n            [ngClass]=\"utilityDrawer.opened ? 'utility-opened' : 'utility-closed'\"\n            *ngIf=\"!_headerSer.headerConfig.disableUtilityDrawer\" (click)=\"utilityDrawer.toggle()\">\n            <mat-icon class=\"chat-expand-arrow\" *ngIf=\"utilityDrawer.opened\">arrow_right</mat-icon>\n            <mat-icon class=\"chat-expand-arrow\" *ngIf=\"!utilityDrawer.opened\">arrow_left</mat-icon>\n        </button>\n    </mat-drawer-content>\n</mat-drawer-container>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}:host ::ng-deep .app-assistant-sidenav-container{z-index:999}.utility-toggle-button{background-color:#fff;border-top-left-radius:30px;border-bottom-left-radius:30px;box-shadow:0 1px 2px 2px #ccc;text-align:center;right:-20px;bottom:38px;position:fixed!important;height:34px!important;width:45px;cursor:pointer;z-index:1004;transition:all .2s}.utility-toggle-button mat-icon.chat-expand-arrow{font-size:28px!important;position:relative;top:-4px;right:10px;height:20px;vertical-align:middle;transition:all .2s}.utility-toggle-button:hover{right:0}.utility-toggle-button.utility-opened{right:10px;border-radius:30px;width:34px;box-shadow:none;background-color:#e7e7e7;min-width:unset}.utility-toggle-button.utility-opened mat-icon.chat-expand-arrow{right:0;top:0;width:22px;height:22px;margin:0;font-size:22px!important}::ng-deep .mat-drawer-container.outer-drawer-container{overflow:unset}::ng-deep .outer-drawer-container>mat-drawer-content{margin-top:56px;z-index:3}.utility-menu-drawer{padding:3px;height:91vh;width:56px;margin-top:56px;overflow:hidden}.utility-content-drawer{height:91vh;width:540px;overflow:hidden}.list-icons-cell{padding:8px;text-align:center;vertical-align:middle;height:40px;width:40px;cursor:pointer;border-radius:30px}.list-icons-cell .mat-icon.list-icons{font-size:25px!important;color:#4b85ea!important}.list-icons-cell:hover{background-color:#ccc}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i5.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i5.MatDrawerContent, selector: "mat-drawer-content" }, { kind: "component", type: i5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i5.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "component", type: i9.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i10.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: ActiveRoutePipe, name: "activeRoute" }] });
+HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: HeaderComponent, selector: "lib-header", inputs: { INACTIVITY_LIMIT: "INACTIVITY_LIMIT" }, outputs: { logoutEvent: "logoutEvent" }, host: { listeners: { "document:mousemove": "resetTimer()", "document:keydown": "resetTimer()", "document:click": "resetTimer()", "document:touchstart": "resetTimer()", "document:touchmove": "resetTimer()", "document:scroll": "resetTimer()", "window:focus": "resetTimer()" } }, viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["sidenav"], descendants: true }], ngImport: i0, template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n    <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n        <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n        <div class=\"app-menu-content-section\">\n            <ng-container *ngFor=\"let appType of menuList\">\n                <div class=\"appList\">\n                    <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n                </div>\n                <div class=\"subHeadListItems\">\n                    <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n                        [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n                        <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n                        <span>{{ item.menuName }}</span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n    </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n    <!-- Main nav button and navigation links -->\n    <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n        class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n        matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n        matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n    <a class=\"navbar-brand me-auto\" href=\"#\">\n        <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n            alt=\"App Logo\" class=\"app-logo\">\n    </a>\n\n    <ng-content></ng-content>\n\n    <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n        <mat-label>Company</mat-label>\n        <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\">\n            <mat-option *ngFor=\"let opt of companyList\" [value]=\"opt\">\n                {{opt.name}}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n\n    <!-- Profile button and profile dropdown links -->\n    <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n        matTooltipPosition=\"below\">\n        <div class=\"profile-inner\">\n            <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n                [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n                [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n            <div class=\"avatar\">\n                <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n                <ng-template #defaultAvatar><img\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n                        class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n            </div>\n        </div>\n    </button>\n    <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n        <div class=\"popover-content show-menu\">\n            <div class=\"popover-header\">\n                <div class=\"popover-user-top\">\n                    <div class=\"avatar-wrapper\">\n                        <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n                            alt=\"Avatar\">\n                        <ng-template #defaultLargeAvatar>\n                            <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n                                class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n                        </ng-template>\n                    </div>\n                    <div class=\"user-data\">\n                        <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n                                userAuthData?.lastName }}</span></h3>\n                        <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n                            (click)=\"profile()\">View Profile</button>\n                    </div>\n                </div>\n            </div>\n            <div class=\"popover-body\">\n                <!-- <div class=\"popover-content-title\">\n                    <p>Overview</p>\n                </div> -->\n\n                <div *ngIf=\"userAuthData?.email\">\n                    <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n                        <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n                            userAuthData?.email }}</span>\n                    </p>\n                </div>\n                <ng-container *ngIf=\"userAuthData?.contactPhone\">\n                    <p mat-menu-item class=\"list-text mb-3\">\n                        <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n                            userAuthData?.contactPhone }}</span>\n                    </p>\n                </ng-container>\n\n                <hr />\n                <ul cdkMenu class=\"list-group last-group my-1\">\n                    <li cdkMenuItem class=\"list-item py-2\">\n                        <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n                            <mat-icon>power_settings_new</mat-icon>\n                            <span class=\"list-text\">Logout</span>\n                        </button>\n                    </li>\n                </ul>\n            </div>\n        </div>\n    </mat-menu>\n</mat-toolbar>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i5.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "component", type: i9.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i10.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i11.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: ActiveRoutePipe, name: "activeRoute" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lib-header', template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n    <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n        <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n        <div class=\"app-menu-content-section\">\n            <ng-container *ngFor=\"let appType of menuList\">\n                <div class=\"appList\">\n                    <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n                </div>\n                <div class=\"subHeadListItems\">\n                    <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n                        [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n                        <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n                        <span>{{ item.menuName }}</span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n    </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n    <!-- Main nav button and navigation links -->\n    <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n        class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n        matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n        matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n    <a class=\"navbar-brand me-auto\" href=\"#\">\n        <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n            alt=\"App Logo\" class=\"app-logo\">\n    </a>\n    <ng-content select=\"[headerInfo]\"></ng-content>\n    <!-- <ng-content></ng-content> -->\n\n    <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n        <mat-label>Company</mat-label>\n        <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\">\n            <mat-option *ngFor=\"let opt of companyList\" [value]=\"opt\">\n                {{opt.name}}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n\n    <!-- Profile button and profile dropdown links -->\n    <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n        matTooltipPosition=\"below\">\n        <div class=\"profile-inner\">\n            <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n                [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n                [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n            <div class=\"avatar\">\n                <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n                <ng-template #defaultAvatar><img\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n                        class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n            </div>\n        </div>\n    </button>\n    <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n        <div class=\"popover-content show-menu\">\n            <div class=\"popover-header\">\n                <div class=\"popover-user-top\">\n                    <div class=\"avatar-wrapper\">\n                        <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n                            alt=\"Avatar\">\n                        <ng-template #defaultLargeAvatar>\n                            <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n                                class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n                        </ng-template>\n                    </div>\n                    <div class=\"user-data\">\n                        <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n                                userAuthData?.lastName }}</span></h3>\n                        <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n                            (click)=\"profile()\">View Profile</button>\n                    </div>\n                </div>\n            </div>\n            <div class=\"popover-body\">\n                <!-- <div class=\"popover-content-title\">\n                    <p>Overview</p>\n                </div> -->\n\n                <div *ngIf=\"userAuthData?.email\">\n                    <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n                        <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n                            userAuthData?.email }}</span>\n                    </p>\n                </div>\n                <ng-container *ngIf=\"userAuthData?.contactPhone\">\n                    <p mat-menu-item class=\"list-text mb-3\">\n                        <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n                            userAuthData?.contactPhone }}</span>\n                    </p>\n                </ng-container>\n\n                <hr />\n                <ul cdkMenu class=\"list-group last-group my-1\">\n                    <li cdkMenuItem class=\"list-item py-2\">\n                        <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n                            <mat-icon>power_settings_new</mat-icon>\n                            <span class=\"list-text\">Logout</span>\n                        </button>\n                    </li>\n                </ul>\n            </div>\n        </div>\n    </mat-menu>\n</mat-toolbar>\n<mat-drawer-container class=\"outer-drawer-container\" autosize>\n    <mat-drawer #utilityDrawer class=\"utility-menu-drawer\" mode=\"side\" position=\"end\">\n        <ng-container *ngIf=\"defaultApps.length > 0\">\n            <button mat-icon-button color=\"primary\" class=\"btn-right-menu\" aria-label=\"Button\"\n                *ngFor=\"let item of defaultApps\" (click)=\"openItem(item)\">\n                <mat-icon>{{ item.icon }}</mat-icon>\n            </button>\n            <hr>\n        </ng-container>\n        <ng-container *ngIf=\"config.length > 0\">\n            <button mat-icon-button color=\"primary\" class=\"btn-right-menu\" aria-label=\"Button\"\n                *ngFor=\"let item of config\" (click)=\"openItem(item)\">\n                <mat-icon>{{ item.icon }}</mat-icon>\n            </button>\n        </ng-container>\n    </mat-drawer>\n    <mat-drawer-content>\n        <mat-drawer-container class=\"inner-drawer-container\" autosize>\n            <mat-drawer #utilitySpaceDrawer class=\"utility-content-drawer\" position=\"end\"\n                [mode]=\"selected?.layout || 'side'\" [opened]=\"!!selected\" (closed)=\"selected = undefined\">\n                <ng-container *ngIf=\"componentToLoad\">\n                    <ng-container *ngComponentOutlet=\"componentToLoad; injector: dynamicInjector\"></ng-container>\n                </ng-container>\n            </mat-drawer>\n            <!-- <mat-drawer #sampleDrawer position=\"end\" mode=\"over\">\n        <p>Sample content</p>\n      </mat-drawer> -->\n            <mat-drawer-content><ng-content class=\"body_content\"\n                    select=\"[bodyContentInfo]\"></ng-content></mat-drawer-content>\n        </mat-drawer-container>\n        <button type=\"button\" mat-button class=\"utility-toggle-button\"\n            [ngClass]=\"utilityDrawer.opened ? 'utility-opened' : 'utility-closed'\"\n            *ngIf=\"!_headerSer.headerConfig.disableUtilityDrawer\" (click)=\"utilityDrawer.toggle()\">\n            <mat-icon class=\"chat-expand-arrow\" *ngIf=\"utilityDrawer.opened\">arrow_right</mat-icon>\n            <mat-icon class=\"chat-expand-arrow\" *ngIf=\"!utilityDrawer.opened\">arrow_left</mat-icon>\n        </button>\n    </mat-drawer-content>\n</mat-drawer-container>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}:host ::ng-deep .app-assistant-sidenav-container{z-index:999}.utility-toggle-button{background-color:#fff;border-top-left-radius:30px;border-bottom-left-radius:30px;box-shadow:0 1px 2px 2px #ccc;text-align:center;right:-20px;bottom:38px;position:fixed!important;height:34px!important;width:45px;cursor:pointer;z-index:1004;transition:all .2s}.utility-toggle-button mat-icon.chat-expand-arrow{font-size:28px!important;position:relative;top:-4px;right:10px;height:20px;vertical-align:middle;transition:all .2s}.utility-toggle-button:hover{right:0}.utility-toggle-button.utility-opened{right:10px;border-radius:30px;width:34px;box-shadow:none;background-color:#e7e7e7;min-width:unset}.utility-toggle-button.utility-opened mat-icon.chat-expand-arrow{right:0;top:0;width:22px;height:22px;margin:0;font-size:22px!important}::ng-deep .mat-drawer-container.outer-drawer-container{overflow:unset}::ng-deep .outer-drawer-container>mat-drawer-content{margin-top:56px;z-index:3}.utility-menu-drawer{padding:3px;height:91vh;width:56px;margin-top:56px;overflow:hidden}.utility-content-drawer{height:91vh;width:540px;overflow:hidden}.list-icons-cell{padding:8px;text-align:center;vertical-align:middle;height:40px;width:40px;cursor:pointer;border-radius:30px}.list-icons-cell .mat-icon.list-icons{font-size:25px!important;color:#4b85ea!important}.list-icons-cell:hover{background-color:#ccc}\n"] }]
+            args: [{ selector: 'lib-header', template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n    <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n        <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n        <div class=\"app-menu-content-section\">\n            <ng-container *ngFor=\"let appType of menuList\">\n                <div class=\"appList\">\n                    <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n                </div>\n                <div class=\"subHeadListItems\">\n                    <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n                        [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n                        <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n                        <span>{{ item.menuName }}</span>\n                    </div>\n                </div>\n            </ng-container>\n        </div>\n    </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n    <!-- Main nav button and navigation links -->\n    <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n        class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n        matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n        matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n    <a class=\"navbar-brand me-auto\" href=\"#\">\n        <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n            alt=\"App Logo\" class=\"app-logo\">\n    </a>\n\n    <ng-content></ng-content>\n\n    <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n        <mat-label>Company</mat-label>\n        <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\">\n            <mat-option *ngFor=\"let opt of companyList\" [value]=\"opt\">\n                {{opt.name}}\n            </mat-option>\n        </mat-select>\n    </mat-form-field>\n\n\n    <!-- Profile button and profile dropdown links -->\n    <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n        matTooltipPosition=\"below\">\n        <div class=\"profile-inner\">\n            <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n                [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n                [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n            <div class=\"avatar\">\n                <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n                <ng-template #defaultAvatar><img\n                        [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n                        class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n            </div>\n        </div>\n    </button>\n    <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n        <div class=\"popover-content show-menu\">\n            <div class=\"popover-header\">\n                <div class=\"popover-user-top\">\n                    <div class=\"avatar-wrapper\">\n                        <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n                            alt=\"Avatar\">\n                        <ng-template #defaultLargeAvatar>\n                            <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n                                class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n                        </ng-template>\n                    </div>\n                    <div class=\"user-data\">\n                        <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n                                userAuthData?.lastName }}</span></h3>\n                        <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n                            (click)=\"profile()\">View Profile</button>\n                    </div>\n                </div>\n            </div>\n            <div class=\"popover-body\">\n                <!-- <div class=\"popover-content-title\">\n                    <p>Overview</p>\n                </div> -->\n\n                <div *ngIf=\"userAuthData?.email\">\n                    <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n                        <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n                            userAuthData?.email }}</span>\n                    </p>\n                </div>\n                <ng-container *ngIf=\"userAuthData?.contactPhone\">\n                    <p mat-menu-item class=\"list-text mb-3\">\n                        <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n                            userAuthData?.contactPhone }}</span>\n                    </p>\n                </ng-container>\n\n                <hr />\n                <ul cdkMenu class=\"list-group last-group my-1\">\n                    <li cdkMenuItem class=\"list-item py-2\">\n                        <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n                            <mat-icon>power_settings_new</mat-icon>\n                            <span class=\"list-text\">Logout</span>\n                        </button>\n                    </li>\n                </ul>\n            </div>\n        </div>\n    </mat-menu>\n</mat-toolbar>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { INACTIVITY_LIMIT: [{
                 type: Input
             }], logoutEvent: [{
@@ -715,11 +747,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
             }], sidenav: [{
                 type: ViewChild,
                 args: ['sidenav']
-            }], utilitySpace: [{
-                type: ViewChild,
-                args: ['utilitySpaceDrawer']
-            }], config: [{
-                type: Input
             }], resetTimer: [{
                 type: HostListener,
                 args: ['document:mousemove']
@@ -818,5 +845,5 @@ const APP_DOMAIN = [
  * Generated bundle index. Do not edit.
  */
 
-export { APP_DOMAIN, BaseController, CommonHeaderModule, CommonHeaderService, HeaderComponent, PROFET_APPS, UTILITY_WIDGET_CONFIG };
+export { APP_DOMAIN, CommonHeaderModule, CommonHeaderService, HeaderComponent, PROFET_APPS };
 //# sourceMappingURL=propmix-profet-common-header.mjs.map