new-front-common-library 16.1.32-ROY-6 → 16.1.32-ROY-7

package/fesm2022/new-front-common-library.mjs

@@ -1221,6 +1221,13 @@ const MENU_SECTIONS = [
                         actionType: 'navigate',
                         permissions: ['COMMERCIAL']
                     },
+                    {
+                        label: 'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.E-INVOICING',
+                        module: 'commercial',
+                        route: '/e-invoicing/search',
+                        actionType: 'navigate',
+                        permissions: ['E-INVOICING']
+                    },
                     {
                         label: 'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.VOD',
                         module: 'commercial',
@@ -1763,6 +1770,7 @@ const en = {
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.DEAL': 'Deal',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.WORK_RECORD': 'Work record',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.INVOICE': 'Invoice',
+    'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.E-INVOICING': 'E-Invoicing',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.VOD': 'VOD',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.VOLUME': 'Volumes',
     'COMMON.HEADER.MENU.COMMERCIAL.FINANCE': 'Finance',
@@ -1925,6 +1933,7 @@ const fr = {
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.DEAL': 'Deal',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.WORK_RECORD': 'Fiche',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.INVOICE': 'Facture',
+    'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.E-INVOICING': 'E-Invoicing',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.VOD': 'VOD',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.VOLUME': 'Volumes',
     'COMMON.HEADER.MENU.COMMERCIAL.FINANCE': 'Compta/CDG',
@@ -2083,6 +2092,7 @@ const de = {
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.DEAL': 'Deal',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.WORK_RECORD': 'Work record',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.INVOICE': 'Invoice',
+    'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.E-INVOICING': 'E-Invoicing',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.VOD': 'VOD',
     'COMMON.HEADER.MENU.COMMERCIAL.SEARCH.VOLUME': 'Volumes',
     'COMMON.HEADER.MENU.COMMERCIAL.FINANCE': 'Finance',
@@ -2446,7 +2456,7 @@ class HeaderComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderComponent, deps: [{ token: i1$3.Router }, { token: LocalStorageEventsService }, { token: LocalStorageService }, { token: ToasterEventsService }, { token: i1$4.TranslateService }, { token: CommonApiService }, { token: SessionStorageService }, { token: PermissionsService }, { token: i9.OverlayContainer }, { token: i1.CookieService }, { token: LangService }, { token: ElasticsearchService }, { token: WEB_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderComponent, selector: "sc-header", outputs: { toogleMenuEvent: "toogleMenuEvent" }, host: { listeners: { "window:scroll": "onWindowScroll()" } }, ngImport: i0, template: "<mat-toolbar class=\"d-flex align-items-center toolbar-header toolbar-padding\">\n  <span class=\"d-flex align-items-end\">\n    <a\n      [href]=\"env === 'prod' ? 'https://unity.studiocanal.com/dashboard' : (env === 'sbx' ? 'https://unity-sbx.cplus/dashboard' : 'https://unity-' + env + '.studiocanal.com/dashboard')\">\n      <img class=\"logo-unity\" src=\"./assets/img/unity_logo_48x48.png\">\n    </a>\n    <span *ngIf=\"env != 'prod'\" [attr.id]=\"'env-' + env\" class=\"env\">{{ env }}</span>\n  </span>\n\n  <sc-menu [lang]=\"lang\" (navigate)=\"navigate($event.module, $event.route, $event.queryParams)\"\n           (redirect)=\"redirect($event.route)\" class=\"menu-header\" />\n\n  <div class=\"global-search\">\n    <mat-icon class=\"header-icon\">search</mat-icon>\n    <span class=\"global-search-separator\"></span>\n    <mat-form-field class=\"max-width-100\" subscriptSizing=\"dynamic\">\n      <input [formControl]=\"formControlSearch\"\n             [matAutocomplete]=\"autoSearch\"\n             class=\"global-search-input max-width-85\"\n             matInput\n             placeholder=\"search ...\" />\n\n      <button (click)=\"navigate(null, '/advanced-search')\"\n              matSuffix\n              class=\"btn advanced-button\" mat-raised-button>\n        <mat-icon>flash_on</mat-icon>\n        {{ 'COMMON.HEADER.GLOBAL_SEARCH.ADVANCED' | commonTranslate: lang }}\n      </button>\n\n      <mat-autocomplete #autoSearch=\"matAutocomplete\" class=\"mat-autocomplete-global-search\" panelWidth=\"54vw\">\n        <mat-option (onSelectionChange)=\"onSelectSearch($event, doc)\"\n                    *ngFor=\"let doc of documents$ | async\"\n                    class=\"mat-option-global-search\">\n          <!--PURCHASE_ORDER-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PURCHASE_ORDER\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt_long</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PURCHASE_ORDER' | commonTranslate: lang }}</span>\n                <span>{{ doc.poNumber }}\n                  - {{ doc.totalAmount | currency: doc.currencyCode:'symbol':undefined:'fr-FR' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.BASKET_NUMBER' | commonTranslate: lang }}</span>\n                <span>{{ doc?.basketNumber ? doc.basketNumber : '-' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc?.ean ? doc.ean : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--PRODUCT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PRODUCT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">movie</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"ellipsis d-flex flex-column max-width-60\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.SUPPORT' | commonTranslate: lang }}</span>\n                <span>{{ doc.support[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc.ean }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.RELEASE_DATE' | commonTranslate: lang }}</span>\n                <span>{{ doc?.releaseDate ? doc.releaseDate : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_VERSION\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">theaters</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-75 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }} ({{ doc.codeIso }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.miloCode }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCTION_YEAR' | commonTranslate: lang }}</span>\n                <span>{{ doc.yearOfProduction }}</span>\n              </div>\n            </div>\n          </div>\n          <!--DEAL-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.DEAL\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">local_offer</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }} - {{ doc.thirdPartyClientName }}\n                  ({{ doc.thirdPartyClientSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.calculatedAmount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.VALIDATION_DATE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.validationDate }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK_RECORD-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_RECORD\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">assignment</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK_RECORD' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.id }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--INVOICE-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.number }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--THIRD_PARTY-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.THIRD_PARTY\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">person</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-85 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.THIRD_PARTY' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.companyOrPersonName }} ({{ doc.address | thirdPartyAddressSearch: lang }}\n                  )</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.code }}</span>\n              </div>\n            </div>\n          </div>\n          <!--CONTRACT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'cess'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'acq'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">shop_two</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'auth'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">account_circle</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.lisaId }} </span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TYPE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.type[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.STATUS' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.status[labelLang] }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn !== 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.LICENSOR' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.licensor ? doc.licensor : '-' }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn === 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CUSTOMER' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.customer ? doc.customer : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY CONTRACT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{doc.clientCodeSap}})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-50 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLES' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.works.join(', ') }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY COUNT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_COUNT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.END_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.periodEnd ? doc.periodEnd : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY INVOICE -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.invoiceNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EMISSION_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.emissionDate }}</span>\n              </div>\n            </div>\n          </div>\n        </mat-option>\n      </mat-autocomplete>\n\n    </mat-form-field>\n  </div>\n\n  <div *ngIf=\"user && user.secondary\" class=\"connected-as d-flex justify-content-between align-items-center\">\n      <span style=\"margin-right: 10px\">\n        {{ 'COMMON.HEADER.CONNECTED_AS' | commonTranslate: lang }}  {{ user.login + ' - ' + user.firstName + ' ' + user.name }}\n      </span>\n\n    <button (click)=\"stopIdentityTheft()\" *ngIf=\"user.secondary\" color=\"warn\" mat-raised-button>\n      {{ 'CORE.STOP' | commonTranslate: lang }}\n    </button>\n  </div>\n\n  <span (click)=\"getHistory()\" [matMenuTriggerFor]=\"menuHistory\"\n        class=\"material-icons header-icon max-width-5\">history</span>\n  <mat-menu #menuHistory=\"matMenu\" class=\"action-menu\">\n    <ng-container *ngFor=\"let history of historyList\" [ngSwitch]=\"history.type\">\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PRODUCT'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">theaters</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PRODUCT' | commonTranslate : lang }}{{ history.type }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PO'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt_long</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PO' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/deal/consult/' + history.id)\" *ngSwitchCase=\"'DEAL'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">local_offer</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.DEAL' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/work-record/consult/'+ history.id +'/general')\" *ngSwitchCase=\"'WORK'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">assignment</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.WORK_RECORD' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/acq/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_ACQ'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">shop_two</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_ACQ' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/cess/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_CESS'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_CESS' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/auth/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_AUTH'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">account_circle</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_AUTH' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/budget/form/' + history.id)\" *ngSwitchCase=\"'BUDGET'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">payments</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.BUDGET' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button *ngSwitchCase=\"'NO_HISTORY_AVAILABLE'\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">not_interested</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.NO_HISTORY_AVAILABLE' | commonTranslate : lang }}\n      </button>\n    </ng-container>\n  </mat-menu>\n  <span class=\"header-separator\"></span>\n\n  <span [matMenuTriggerFor]=\"settings\" class=\"material-icons-outlined header-icon max-width-5\">settings</span>\n\n  <!-- #enddocregion mat-menu-trigger-for -->\n  <mat-menu #settings=\"matMenu\" class=\"settings-menu\">\n    <button (click)=\"switchTheme()\" mat-menu-item>\n      <mat-icon class=\"theme-icon\">toggle_on</mat-icon>\n      <span>{{ 'COMMON.HEADER.PARAMETERS.THEME' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"en\")' *ngIf='lang !== \"en\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/en-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.ENGLISH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"fr\")' *ngIf='lang !== \"fr\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/fr-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.FRENCH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"de\")' *ngIf='lang !== \"de\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/de-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.DEUTCH' | commonTranslate: lang }}</span>\n    </button>\n    <ng-container *ngxPermissionsExcept=\"restrictions\">\n      <!--USER-->\n      <button (click)=\"navigate('user', '/account/authorization/search')\" *ngIf=\"user && user.admin\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">manage_accounts</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SECTION_TITLE' | commonTranslate: lang }}</span>\n      </button>\n    </ng-container>\n      <!--MY PREFERENCES-->\n      <button (click)=\"navigate('user', '/account/settings')\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">settings</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SETTINGS' | commonTranslate: lang }}</span>\n      </button>\n  </mat-menu>\n</mat-toolbar>\n\n", styles: [".header-icon{color:#009ef7;cursor:pointer;text-align:center;margin:0 4px}.header-separator{display:inline-block;height:25%}.global-search-separator{display:inline-block;height:70%;border-right:2px solid #D3DFEC}:host-context(.dark-theme){background-color:#2a2d3e}:host-context(.dark-theme) .global-search{background:#34384c}:host-context(.dark-theme) .global-search-input{background:#34384c}:host-context(.dark-theme) .global-search-separator{border-right:2px solid #2A2D3E}:host-context(.dark-theme) .header-separator{border-right:2px solid #111219}::ng-deep .dark-theme .mat-autocomplete-global-search{background:#2a2d3e!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search:focus:not(.mat-option-disabled){background:#212332!important;color:#fff!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search{color:#fff!important}::ng-deep .dark-theme .global-search-input::placeholder{color:#a1b7d4!important}:host-context(.light-theme){background-color:#fff}:host-context(.light-theme) .global-search{background:#eff3f6}:host-context(.light-theme) .global-search-input{background:#eff3f6}:host-context(.light-theme) .global-search-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .header-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .global-search-input::placeholder{color:#445d7b!important}:host-context(.light-theme) .mat-toolbar{background-color:#fff}::ng-deep .light-theme .mat-mdc-option.mat-option-global-search:hover:not(.mdc-list-item--disabled){background:#d3dfec!important}.logo-unity{height:48px;width:48px}.global-search .header-icon{margin:0 10px}.global-search{display:flex;align-items:center;height:40px;background:#eff3f6;margin-left:5px;border-radius:8px;flex:1 1 0;width:auto;min-width:0}.global-search-input{background:#f3f6f9;border:none;margin-left:10px;font-size:14px!important}.global-search-input :focus{outline:none}.rapid-search-type-icon{font-size:1.4em;vertical-align:middle}.advanced-button{background:#7c87ff!important;color:#fff!important;width:90px;min-width:90px!important;height:24px!important;box-shadow:0 2px 6px #445d7b29,inset 0 2px 6px #ffffff14,inset 0 -2px 4px #445d7b0f;margin-right:5px;padding:0}.advanced-button .mat-icon{color:#fff!important;font-size:14px!important;height:unset;width:unset;margin-right:0}.connected-as{font-size:12px}.user-thumb{margin-right:16px;width:40px;height:40px}#env-dev,#env-uat,#env-sbx{background-color:#809ec1;color:#fff}.env{color:#fff;font-size:10px;border-radius:1px;padding:0 5px;line-height:16px;height:16px}.global-search-input::placeholder{font-style:italic!important;font-weight:700!important}.mat-option-global-search{height:30px!important;line-height:15px!important;padding:0 8px}.auto-complete-label{font-size:8px}::ng-deep .global-search .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .global-search .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:transparent!important}::ng-deep .global-search .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-focus-overlay{opacity:0!important}::ng-deep .global-search .mdc-line-ripple{display:none!important}::ng-deep .global-search .mat-mdc-form-field-infix{min-height:40px!important;padding-top:8px!important;padding-bottom:8px!important}.max-width-0{flex:1 1 0%;max-width:0%}.max-width-5{flex:1 1 5%;max-width:5%}.max-width-10{flex:1 1 10%;max-width:10%}.max-width-15{flex:1 1 15%;max-width:15%}.max-width-20{flex:1 1 20%;max-width:20%}.max-width-25{flex:1 1 25%;max-width:25%}.max-width-30{flex:1 1 30%;max-width:30%}.max-width-35{flex:1 1 35%;max-width:35%}.max-width-40{flex:1 1 40%;max-width:40%}.max-width-45{flex:1 1 45%;max-width:45%}.max-width-50{flex:1 1 50%;max-width:50%}.max-width-55{flex:1 1 55%;max-width:55%}.max-width-60{flex:1 1 60%;max-width:60%}.max-width-65{flex:1 1 65%;max-width:65%}.max-width-70{flex:1 1 70%;max-width:70%}.max-width-75{flex:1 1 75%;max-width:75%}.max-width-80{flex:1 1 80%;max-width:80%}.max-width-85{flex:1 1 85%;max-width:85%}.max-width-90{flex:1 1 90%;max-width:90%}.max-width-95{flex:1 1 95%;max-width:95%}.max-width-100{flex:1 1 100%;max-width:100%}.spacer{flex:1 1 auto}.toolbar-header{height:64px;position:absolute;padding:0 16px!important;z-index:999}.menu-header{max-width:70%;overflow:hidden;max-height:60px}::ng-deep .settings-menu.mat-mdc-menu-panel .mat-mdc-menu-item .mat-icon{height:24px;width:24px;display:flex;justify-content:center;align-items:center;margin-right:15px;font-size:18px}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn .mat-mdc-menu-item-text{display:flex;justify-content:start;align-items:center}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn img{height:12px!important;width:auto!important;display:block!important;padding-left:3px;margin-right:17px!important}.theme-icon{font-size:24px!important}\n"], dependencies: [{ kind: "directive", type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i14.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i15.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.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i17.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i17.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i17.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i17.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$2.NgxPermissionsDirective, selector: "[ngxPermissionsOnly],[ngxPermissionsExcept]", inputs: ["ngxPermissionsOnly", "ngxPermissionsOnlyThen", "ngxPermissionsOnlyElse", "ngxPermissionsExcept", "ngxPermissionsExceptElse", "ngxPermissionsExceptThen", "ngxPermissionsThen", "ngxPermissionsElse", "ngxPermissionsOnlyAuthorisedStrategy", "ngxPermissionsOnlyUnauthorisedStrategy", "ngxPermissionsExceptUnauthorisedStrategy", "ngxPermissionsExceptAuthorisedStrategy", "ngxPermissionsUnauthorisedStrategy", "ngxPermissionsAuthorisedStrategy"], outputs: ["permissionsAuthorized", "permissionsUnauthorized"] }, { kind: "directive", type: i7$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i22.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i23.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i22.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: MenuComponent, selector: "sc-menu", inputs: ["lang"], outputs: ["navigate", "redirect"] }, { kind: "pipe", type: i17.AsyncPipe, name: "async" }, { kind: "pipe", type: i17.CurrencyPipe, name: "currency" }, { kind: "pipe", type: CommonTranslatePipe, name: "commonTranslate" }, { kind: "pipe", type: ThirdPartyAddressSearchPipe, name: "thirdPartyAddressSearch" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: HeaderComponent, selector: "sc-header", outputs: { toogleMenuEvent: "toogleMenuEvent" }, host: { listeners: { "window:scroll": "onWindowScroll()" } }, ngImport: i0, template: "<mat-toolbar class=\"d-flex align-items-center toolbar-header toolbar-padding\">\n  <span class=\"d-flex align-items-end\">\n    <a\n      [href]=\"env === 'prod' ? 'https://unity.studiocanal.com/dashboard' : (env === 'sbx' ? 'https://unity-sbx.cplus/dashboard' : 'https://unity-' + env + '.studiocanal.com/dashboard')\">\n      <img class=\"logo-unity\" src=\"./assets/img/unity_logo_48x48.png\">\n    </a>\n    <span *ngIf=\"env != 'prod'\" [attr.id]=\"'env-' + env\" class=\"env\">{{ env }}</span>\n  </span>\n\n  <sc-menu [lang]=\"lang\" (navigate)=\"navigate($event.module, $event.route, $event.queryParams)\"\n           (redirect)=\"redirect($event.route)\" class=\"menu-header\" />\n\n  <div class=\"global-search\">\n    <mat-icon class=\"header-icon\">search</mat-icon>\n    <span class=\"global-search-separator\"></span>\n    <mat-form-field class=\"max-width-100\" subscriptSizing=\"dynamic\">\n      <input [formControl]=\"formControlSearch\"\n             [matAutocomplete]=\"autoSearch\"\n             class=\"global-search-input max-width-85\"\n             matInput\n             placeholder=\"search ...\" />\n\n      <button (click)=\"navigate(null, '/advanced-search')\"\n              matSuffix\n              class=\"btn advanced-button\" mat-raised-button>\n        <mat-icon>flash_on</mat-icon>\n        {{ 'COMMON.HEADER.GLOBAL_SEARCH.ADVANCED' | commonTranslate: lang }}\n      </button>\n\n      <mat-autocomplete #autoSearch=\"matAutocomplete\" class=\"mat-autocomplete-global-search\" panelWidth=\"54vw\">\n        <mat-option (onSelectionChange)=\"onSelectSearch($event, doc)\"\n                    *ngFor=\"let doc of documents$ | async\"\n                    class=\"mat-option-global-search\">\n          <!--PURCHASE_ORDER-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PURCHASE_ORDER\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt_long</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PURCHASE_ORDER' | commonTranslate: lang }}</span>\n                <span>{{ doc.poNumber }}\n                  - {{ doc.totalAmount | currency: doc.currencyCode:'symbol':undefined:'fr-FR' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.BASKET_NUMBER' | commonTranslate: lang }}</span>\n                <span>{{ doc?.basketNumber ? doc.basketNumber : '-' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc?.ean ? doc.ean : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--PRODUCT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PRODUCT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">movie</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"ellipsis d-flex flex-column max-width-60\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.SUPPORT' | commonTranslate: lang }}</span>\n                <span>{{ doc.support[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc.ean }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.RELEASE_DATE' | commonTranslate: lang }}</span>\n                <span>{{ doc?.releaseDate ? doc.releaseDate : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_VERSION\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">theaters</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-75 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }} ({{ doc.codeIso }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.miloCode }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCTION_YEAR' | commonTranslate: lang }}</span>\n                <span>{{ doc.yearOfProduction }}</span>\n              </div>\n            </div>\n          </div>\n          <!--DEAL-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.DEAL\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">local_offer</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }} - {{ doc.thirdPartyClientName }}\n                  ({{ doc.thirdPartyClientSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.calculatedAmount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.VALIDATION_DATE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.validationDate }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK_RECORD-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_RECORD\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">assignment</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK_RECORD' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.id }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--INVOICE-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.number }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--THIRD_PARTY-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.THIRD_PARTY\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">person</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-85 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.THIRD_PARTY' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.companyOrPersonName }} ({{ doc.address | thirdPartyAddressSearch: lang }}\n                  )</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.code }}</span>\n              </div>\n            </div>\n          </div>\n          <!--CONTRACT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'cess'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'acq'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">shop_two</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'auth'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">account_circle</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.lisaId }} </span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TYPE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.type[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.STATUS' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.status[labelLang] }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn !== 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.LICENSOR' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.licensor ? doc.licensor : '-' }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn === 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CUSTOMER' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.customer ? doc.customer : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY CONTRACT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{doc.clientCodeSap}})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-50 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLES' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.works.join(', ') }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY COUNT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_COUNT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.END_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.periodEnd ? doc.periodEnd : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY INVOICE -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.invoiceNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EMISSION_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.emissionDate }}</span>\n              </div>\n            </div>\n          </div>\n        </mat-option>\n      </mat-autocomplete>\n\n    </mat-form-field>\n  </div>\n\n  <div *ngIf=\"user && user.secondary\" class=\"connected-as d-flex justify-content-between align-items-center\">\n      <span style=\"margin-right: 10px\">\n        {{ 'COMMON.HEADER.CONNECTED_AS' | commonTranslate: lang }}  {{ user.login + ' - ' + user.firstName + ' ' + user.name }}\n      </span>\n\n    <button (click)=\"stopIdentityTheft()\" *ngIf=\"user.secondary\" color=\"warn\" mat-raised-button>\n      {{ 'CORE.STOP' | commonTranslate: lang }}\n    </button>\n  </div>\n\n  <span (click)=\"getHistory()\" [matMenuTriggerFor]=\"menuHistory\"\n        class=\"material-icons header-icon max-width-5\">history</span>\n  <mat-menu #menuHistory=\"matMenu\" class=\"action-menu\">\n    <ng-container *ngFor=\"let history of historyList\" [ngSwitch]=\"history.type\">\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PRODUCT'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">theaters</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PRODUCT' | commonTranslate : lang }}{{ history.type }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PO'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt_long</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PO' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/deal/consult/' + history.id)\" *ngSwitchCase=\"'DEAL'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">local_offer</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.DEAL' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/work-record/consult/'+ history.id +'/general')\" *ngSwitchCase=\"'WORK'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">assignment</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.WORK_RECORD' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/acq/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_ACQ'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">shop_two</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_ACQ' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/cess/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_CESS'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_CESS' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/auth/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_AUTH'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">account_circle</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_AUTH' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/budget/form/' + history.id)\" *ngSwitchCase=\"'BUDGET'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">payments</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.BUDGET' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button *ngSwitchCase=\"'NO_HISTORY_AVAILABLE'\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">not_interested</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.NO_HISTORY_AVAILABLE' | commonTranslate : lang }}\n      </button>\n    </ng-container>\n  </mat-menu>\n  <span class=\"header-separator\"></span>\n\n  <span [matMenuTriggerFor]=\"settings\" class=\"material-icons-outlined header-icon max-width-5\">settings</span>\n\n  <!-- #enddocregion mat-menu-trigger-for -->\n  <mat-menu #settings=\"matMenu\" class=\"settings-menu\">\n    <button (click)=\"switchTheme()\" mat-menu-item>\n      <mat-icon class=\"theme-icon\">toggle_on</mat-icon>\n      <span>{{ 'COMMON.HEADER.PARAMETERS.THEME' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"en\")' *ngIf='lang !== \"en\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/en-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.ENGLISH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"fr\")' *ngIf='lang !== \"fr\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/fr-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.FRENCH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"de\")' *ngIf='lang !== \"de\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/de-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.DEUTCH' | commonTranslate: lang }}</span>\n    </button>\n    <ng-container *ngxPermissionsExcept=\"restrictions\">\n      <!--USER-->\n      <button (click)=\"navigate('user', '/account/authorization/search')\" *ngIf=\"user && user.admin\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">manage_accounts</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SECTION_TITLE' | commonTranslate: lang }}</span>\n      </button>\n    </ng-container>\n      <!--MY PREFERENCES-->\n      <button (click)=\"navigate('user', '/account/settings')\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">settings</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SETTINGS' | commonTranslate: lang }}</span>\n      </button>\n  </mat-menu>\n</mat-toolbar>\n\n", styles: [".header-icon{color:#009ef7;cursor:pointer;text-align:center;margin:0 4px}.header-separator{display:inline-block;height:25%}.global-search-separator{display:inline-block;height:70%;border-right:2px solid #D3DFEC}:host-context(.dark-theme){background-color:#2a2d3e}:host-context(.dark-theme) .global-search{background:#34384c}:host-context(.dark-theme) .global-search-input{background:#34384c}:host-context(.dark-theme) .global-search-separator{border-right:2px solid #2A2D3E}:host-context(.dark-theme) .header-separator{border-right:2px solid #111219}::ng-deep .dark-theme .mat-autocomplete-global-search{background:#2a2d3e!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search:focus:not(.mat-option-disabled){background:#212332!important;color:#fff!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search{color:#fff!important}::ng-deep .dark-theme .global-search-input::placeholder{color:#a1b7d4!important}:host-context(.light-theme){background-color:#fff}:host-context(.light-theme) .global-search{background:#eff3f6}:host-context(.light-theme) .global-search-input{background:#eff3f6}:host-context(.light-theme) .global-search-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .header-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .global-search-input::placeholder{color:#445d7b!important}:host-context(.light-theme) .mat-toolbar{background-color:#fff}::ng-deep .light-theme .mat-mdc-option.mat-option-global-search:hover:not(.mdc-list-item--disabled){background:#d3dfec!important}.logo-unity{height:48px;width:48px}.global-search .header-icon{margin:0 10px}.global-search{display:flex;align-items:center;height:40px;background:#eff3f6;margin-left:5px;border-radius:8px;flex:1 1 0;width:auto;min-width:0}.global-search-input{background:#f3f6f9;border:none;margin-left:10px;font-size:14px!important}.global-search-input :focus{outline:none}.rapid-search-type-icon{font-size:1.4em;vertical-align:middle}.advanced-button{background:#7c87ff!important;color:#fff!important;width:90px;min-width:90px!important;height:24px!important;box-shadow:0 2px 6px #445d7b29,inset 0 2px 6px #ffffff14,inset 0 -2px 4px #445d7b0f;margin-right:5px;padding:0}.advanced-button .mat-icon{color:#fff!important;font-size:14px!important;height:unset;width:unset;margin-right:0}.connected-as{font-size:12px}.user-thumb{margin-right:16px;width:40px;height:40px}#env-dev,#env-uat,#env-sbx{background-color:#809ec1;color:#fff}.env{color:#fff;font-size:10px;border-radius:1px;padding:0 5px;line-height:16px;height:16px}.global-search-input::placeholder{font-style:italic!important;font-weight:700!important}.mat-option-global-search{height:30px!important;line-height:15px!important;padding:0 8px}.auto-complete-label{font-size:8px}::ng-deep .global-search .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .global-search .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:transparent!important}::ng-deep .global-search .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-focus-overlay{opacity:0!important}::ng-deep .global-search .mdc-line-ripple{display:none!important}::ng-deep .global-search .mat-mdc-form-field-infix{min-height:40px!important;padding-top:8px!important;padding-bottom:8px!important}.max-width-0{flex:1 1 0%;max-width:0%}.max-width-5{flex:1 1 5%;max-width:5%}.max-width-10{flex:1 1 10%;max-width:10%}.max-width-15{flex:1 1 15%;max-width:15%}.max-width-20{flex:1 1 20%;max-width:20%}.max-width-25{flex:1 1 25%;max-width:25%}.max-width-30{flex:1 1 30%;max-width:30%}.max-width-35{flex:1 1 35%;max-width:35%}.max-width-40{flex:1 1 40%;max-width:40%}.max-width-45{flex:1 1 45%;max-width:45%}.max-width-50{flex:1 1 50%;max-width:50%}.max-width-55{flex:1 1 55%;max-width:55%}.max-width-60{flex:1 1 60%;max-width:60%}.max-width-65{flex:1 1 65%;max-width:65%}.max-width-70{flex:1 1 70%;max-width:70%}.max-width-75{flex:1 1 75%;max-width:75%}.max-width-80{flex:1 1 80%;max-width:80%}.max-width-85{flex:1 1 85%;max-width:85%}.max-width-90{flex:1 1 90%;max-width:90%}.max-width-95{flex:1 1 95%;max-width:95%}.max-width-100{flex:1 1 100%;max-width:100%}.spacer{flex:1 1 auto}.toolbar-header{height:64px;position:absolute;padding:0 16px!important;z-index:999}.menu-header{max-width:70%;overflow:hidden;max-height:60px}::ng-deep .settings-menu.mat-mdc-menu-panel .mat-mdc-menu-item .mat-icon{height:24px;width:24px;display:flex;justify-content:center;align-items:center;margin-right:15px;font-size:18px}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn .mat-mdc-menu-item-text{display:flex;justify-content:start;align-items:center}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn img{height:12px!important;width:auto!important;display:block!important;padding-left:3px;margin-right:17px!important}.theme-icon{font-size:24px!important}\n"], dependencies: [{ kind: "directive", type: i13.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i14.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i14.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i15.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.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i17.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i17.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i17.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i17.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$2.NgxPermissionsDirective, selector: "[ngxPermissionsOnly],[ngxPermissionsExcept]", inputs: ["ngxPermissionsOnly", "ngxPermissionsOnlyThen", "ngxPermissionsOnlyElse", "ngxPermissionsExcept", "ngxPermissionsExceptElse", "ngxPermissionsExceptThen", "ngxPermissionsThen", "ngxPermissionsElse", "ngxPermissionsOnlyAuthorisedStrategy", "ngxPermissionsOnlyUnauthorisedStrategy", "ngxPermissionsExceptUnauthorisedStrategy", "ngxPermissionsExceptAuthorisedStrategy", "ngxPermissionsUnauthorisedStrategy", "ngxPermissionsAuthorisedStrategy"], outputs: ["permissionsAuthorized", "permissionsUnauthorized"] }, { kind: "directive", type: i7$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i7$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i22.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple", "hideSingleSelectionIndicator"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i23.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i22.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: MenuComponent, selector: "sc-menu", inputs: ["lang"], outputs: ["navigate", "redirect"] }, { kind: "pipe", type: i17.AsyncPipe, name: "async" }, { kind: "pipe", type: i17.CurrencyPipe, name: "currency" }, { kind: "pipe", type: CommonTranslatePipe, name: "commonTranslate" }, { kind: "pipe", type: ThirdPartyAddressSearchPipe, name: "thirdPartyAddressSearch" }] }); }
 }
 __decorate([
     Theme()
@@ -2456,7 +2466,7 @@ __decorate([
 ], HeaderComponent.prototype, "user", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: HeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sc-header', template: "<mat-toolbar class=\"d-flex align-items-center toolbar-header toolbar-padding\">\n  <span class=\"d-flex align-items-end\">\n    <a\n      [href]=\"env === 'prod' ? 'https://unity.studiocanal.com/dashboard' : (env === 'sbx' ? 'https://unity-sbx.cplus/dashboard' : 'https://unity-' + env + '.studiocanal.com/dashboard')\">\n      <img class=\"logo-unity\" src=\"./assets/img/unity_logo_48x48.png\">\n    </a>\n    <span *ngIf=\"env != 'prod'\" [attr.id]=\"'env-' + env\" class=\"env\">{{ env }}</span>\n  </span>\n\n  <sc-menu [lang]=\"lang\" (navigate)=\"navigate($event.module, $event.route, $event.queryParams)\"\n           (redirect)=\"redirect($event.route)\" class=\"menu-header\" />\n\n  <div class=\"global-search\">\n    <mat-icon class=\"header-icon\">search</mat-icon>\n    <span class=\"global-search-separator\"></span>\n    <mat-form-field class=\"max-width-100\" subscriptSizing=\"dynamic\">\n      <input [formControl]=\"formControlSearch\"\n             [matAutocomplete]=\"autoSearch\"\n             class=\"global-search-input max-width-85\"\n             matInput\n             placeholder=\"search ...\" />\n\n      <button (click)=\"navigate(null, '/advanced-search')\"\n              matSuffix\n              class=\"btn advanced-button\" mat-raised-button>\n        <mat-icon>flash_on</mat-icon>\n        {{ 'COMMON.HEADER.GLOBAL_SEARCH.ADVANCED' | commonTranslate: lang }}\n      </button>\n\n      <mat-autocomplete #autoSearch=\"matAutocomplete\" class=\"mat-autocomplete-global-search\" panelWidth=\"54vw\">\n        <mat-option (onSelectionChange)=\"onSelectSearch($event, doc)\"\n                    *ngFor=\"let doc of documents$ | async\"\n                    class=\"mat-option-global-search\">\n          <!--PURCHASE_ORDER-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PURCHASE_ORDER\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt_long</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PURCHASE_ORDER' | commonTranslate: lang }}</span>\n                <span>{{ doc.poNumber }}\n                  - {{ doc.totalAmount | currency: doc.currencyCode:'symbol':undefined:'fr-FR' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.BASKET_NUMBER' | commonTranslate: lang }}</span>\n                <span>{{ doc?.basketNumber ? doc.basketNumber : '-' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc?.ean ? doc.ean : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--PRODUCT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PRODUCT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">movie</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"ellipsis d-flex flex-column max-width-60\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.SUPPORT' | commonTranslate: lang }}</span>\n                <span>{{ doc.support[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc.ean }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.RELEASE_DATE' | commonTranslate: lang }}</span>\n                <span>{{ doc?.releaseDate ? doc.releaseDate : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_VERSION\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">theaters</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-75 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }} ({{ doc.codeIso }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.miloCode }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCTION_YEAR' | commonTranslate: lang }}</span>\n                <span>{{ doc.yearOfProduction }}</span>\n              </div>\n            </div>\n          </div>\n          <!--DEAL-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.DEAL\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">local_offer</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }} - {{ doc.thirdPartyClientName }}\n                  ({{ doc.thirdPartyClientSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.calculatedAmount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.VALIDATION_DATE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.validationDate }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK_RECORD-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_RECORD\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">assignment</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK_RECORD' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.id }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--INVOICE-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.number }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--THIRD_PARTY-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.THIRD_PARTY\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">person</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-85 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.THIRD_PARTY' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.companyOrPersonName }} ({{ doc.address | thirdPartyAddressSearch: lang }}\n                  )</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.code }}</span>\n              </div>\n            </div>\n          </div>\n          <!--CONTRACT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'cess'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'acq'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">shop_two</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'auth'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">account_circle</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.lisaId }} </span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TYPE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.type[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.STATUS' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.status[labelLang] }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn !== 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.LICENSOR' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.licensor ? doc.licensor : '-' }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn === 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CUSTOMER' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.customer ? doc.customer : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY CONTRACT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{doc.clientCodeSap}})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-50 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLES' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.works.join(', ') }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY COUNT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_COUNT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.END_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.periodEnd ? doc.periodEnd : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY INVOICE -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.invoiceNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EMISSION_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.emissionDate }}</span>\n              </div>\n            </div>\n          </div>\n        </mat-option>\n      </mat-autocomplete>\n\n    </mat-form-field>\n  </div>\n\n  <div *ngIf=\"user && user.secondary\" class=\"connected-as d-flex justify-content-between align-items-center\">\n      <span style=\"margin-right: 10px\">\n        {{ 'COMMON.HEADER.CONNECTED_AS' | commonTranslate: lang }}  {{ user.login + ' - ' + user.firstName + ' ' + user.name }}\n      </span>\n\n    <button (click)=\"stopIdentityTheft()\" *ngIf=\"user.secondary\" color=\"warn\" mat-raised-button>\n      {{ 'CORE.STOP' | commonTranslate: lang }}\n    </button>\n  </div>\n\n  <span (click)=\"getHistory()\" [matMenuTriggerFor]=\"menuHistory\"\n        class=\"material-icons header-icon max-width-5\">history</span>\n  <mat-menu #menuHistory=\"matMenu\" class=\"action-menu\">\n    <ng-container *ngFor=\"let history of historyList\" [ngSwitch]=\"history.type\">\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PRODUCT'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">theaters</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PRODUCT' | commonTranslate : lang }}{{ history.type }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PO'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt_long</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PO' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/deal/consult/' + history.id)\" *ngSwitchCase=\"'DEAL'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">local_offer</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.DEAL' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/work-record/consult/'+ history.id +'/general')\" *ngSwitchCase=\"'WORK'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">assignment</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.WORK_RECORD' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/acq/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_ACQ'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">shop_two</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_ACQ' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/cess/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_CESS'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_CESS' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/auth/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_AUTH'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">account_circle</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_AUTH' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/budget/form/' + history.id)\" *ngSwitchCase=\"'BUDGET'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">payments</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.BUDGET' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button *ngSwitchCase=\"'NO_HISTORY_AVAILABLE'\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">not_interested</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.NO_HISTORY_AVAILABLE' | commonTranslate : lang }}\n      </button>\n    </ng-container>\n  </mat-menu>\n  <span class=\"header-separator\"></span>\n\n  <span [matMenuTriggerFor]=\"settings\" class=\"material-icons-outlined header-icon max-width-5\">settings</span>\n\n  <!-- #enddocregion mat-menu-trigger-for -->\n  <mat-menu #settings=\"matMenu\" class=\"settings-menu\">\n    <button (click)=\"switchTheme()\" mat-menu-item>\n      <mat-icon class=\"theme-icon\">toggle_on</mat-icon>\n      <span>{{ 'COMMON.HEADER.PARAMETERS.THEME' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"en\")' *ngIf='lang !== \"en\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/en-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.ENGLISH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"fr\")' *ngIf='lang !== \"fr\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/fr-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.FRENCH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"de\")' *ngIf='lang !== \"de\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/de-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.DEUTCH' | commonTranslate: lang }}</span>\n    </button>\n    <ng-container *ngxPermissionsExcept=\"restrictions\">\n      <!--USER-->\n      <button (click)=\"navigate('user', '/account/authorization/search')\" *ngIf=\"user && user.admin\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">manage_accounts</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SECTION_TITLE' | commonTranslate: lang }}</span>\n      </button>\n    </ng-container>\n      <!--MY PREFERENCES-->\n      <button (click)=\"navigate('user', '/account/settings')\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">settings</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SETTINGS' | commonTranslate: lang }}</span>\n      </button>\n  </mat-menu>\n</mat-toolbar>\n\n", styles: [".header-icon{color:#009ef7;cursor:pointer;text-align:center;margin:0 4px}.header-separator{display:inline-block;height:25%}.global-search-separator{display:inline-block;height:70%;border-right:2px solid #D3DFEC}:host-context(.dark-theme){background-color:#2a2d3e}:host-context(.dark-theme) .global-search{background:#34384c}:host-context(.dark-theme) .global-search-input{background:#34384c}:host-context(.dark-theme) .global-search-separator{border-right:2px solid #2A2D3E}:host-context(.dark-theme) .header-separator{border-right:2px solid #111219}::ng-deep .dark-theme .mat-autocomplete-global-search{background:#2a2d3e!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search:focus:not(.mat-option-disabled){background:#212332!important;color:#fff!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search{color:#fff!important}::ng-deep .dark-theme .global-search-input::placeholder{color:#a1b7d4!important}:host-context(.light-theme){background-color:#fff}:host-context(.light-theme) .global-search{background:#eff3f6}:host-context(.light-theme) .global-search-input{background:#eff3f6}:host-context(.light-theme) .global-search-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .header-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .global-search-input::placeholder{color:#445d7b!important}:host-context(.light-theme) .mat-toolbar{background-color:#fff}::ng-deep .light-theme .mat-mdc-option.mat-option-global-search:hover:not(.mdc-list-item--disabled){background:#d3dfec!important}.logo-unity{height:48px;width:48px}.global-search .header-icon{margin:0 10px}.global-search{display:flex;align-items:center;height:40px;background:#eff3f6;margin-left:5px;border-radius:8px;flex:1 1 0;width:auto;min-width:0}.global-search-input{background:#f3f6f9;border:none;margin-left:10px;font-size:14px!important}.global-search-input :focus{outline:none}.rapid-search-type-icon{font-size:1.4em;vertical-align:middle}.advanced-button{background:#7c87ff!important;color:#fff!important;width:90px;min-width:90px!important;height:24px!important;box-shadow:0 2px 6px #445d7b29,inset 0 2px 6px #ffffff14,inset 0 -2px 4px #445d7b0f;margin-right:5px;padding:0}.advanced-button .mat-icon{color:#fff!important;font-size:14px!important;height:unset;width:unset;margin-right:0}.connected-as{font-size:12px}.user-thumb{margin-right:16px;width:40px;height:40px}#env-dev,#env-uat,#env-sbx{background-color:#809ec1;color:#fff}.env{color:#fff;font-size:10px;border-radius:1px;padding:0 5px;line-height:16px;height:16px}.global-search-input::placeholder{font-style:italic!important;font-weight:700!important}.mat-option-global-search{height:30px!important;line-height:15px!important;padding:0 8px}.auto-complete-label{font-size:8px}::ng-deep .global-search .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .global-search .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:transparent!important}::ng-deep .global-search .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-focus-overlay{opacity:0!important}::ng-deep .global-search .mdc-line-ripple{display:none!important}::ng-deep .global-search .mat-mdc-form-field-infix{min-height:40px!important;padding-top:8px!important;padding-bottom:8px!important}.max-width-0{flex:1 1 0%;max-width:0%}.max-width-5{flex:1 1 5%;max-width:5%}.max-width-10{flex:1 1 10%;max-width:10%}.max-width-15{flex:1 1 15%;max-width:15%}.max-width-20{flex:1 1 20%;max-width:20%}.max-width-25{flex:1 1 25%;max-width:25%}.max-width-30{flex:1 1 30%;max-width:30%}.max-width-35{flex:1 1 35%;max-width:35%}.max-width-40{flex:1 1 40%;max-width:40%}.max-width-45{flex:1 1 45%;max-width:45%}.max-width-50{flex:1 1 50%;max-width:50%}.max-width-55{flex:1 1 55%;max-width:55%}.max-width-60{flex:1 1 60%;max-width:60%}.max-width-65{flex:1 1 65%;max-width:65%}.max-width-70{flex:1 1 70%;max-width:70%}.max-width-75{flex:1 1 75%;max-width:75%}.max-width-80{flex:1 1 80%;max-width:80%}.max-width-85{flex:1 1 85%;max-width:85%}.max-width-90{flex:1 1 90%;max-width:90%}.max-width-95{flex:1 1 95%;max-width:95%}.max-width-100{flex:1 1 100%;max-width:100%}.spacer{flex:1 1 auto}.toolbar-header{height:64px;position:absolute;padding:0 16px!important;z-index:999}.menu-header{max-width:70%;overflow:hidden;max-height:60px}::ng-deep .settings-menu.mat-mdc-menu-panel .mat-mdc-menu-item .mat-icon{height:24px;width:24px;display:flex;justify-content:center;align-items:center;margin-right:15px;font-size:18px}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn .mat-mdc-menu-item-text{display:flex;justify-content:start;align-items:center}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn img{height:12px!important;width:auto!important;display:block!important;padding-left:3px;margin-right:17px!important}.theme-icon{font-size:24px!important}\n"] }]
+            args: [{ selector: 'sc-header', template: "<mat-toolbar class=\"d-flex align-items-center toolbar-header toolbar-padding\">\n  <span class=\"d-flex align-items-end\">\n    <a\n      [href]=\"env === 'prod' ? 'https://unity.studiocanal.com/dashboard' : (env === 'sbx' ? 'https://unity-sbx.cplus/dashboard' : 'https://unity-' + env + '.studiocanal.com/dashboard')\">\n      <img class=\"logo-unity\" src=\"./assets/img/unity_logo_48x48.png\">\n    </a>\n    <span *ngIf=\"env != 'prod'\" [attr.id]=\"'env-' + env\" class=\"env\">{{ env }}</span>\n  </span>\n\n  <sc-menu [lang]=\"lang\" (navigate)=\"navigate($event.module, $event.route, $event.queryParams)\"\n           (redirect)=\"redirect($event.route)\" class=\"menu-header\" />\n\n  <div class=\"global-search\">\n    <mat-icon class=\"header-icon\">search</mat-icon>\n    <span class=\"global-search-separator\"></span>\n    <mat-form-field class=\"max-width-100\" subscriptSizing=\"dynamic\">\n      <input [formControl]=\"formControlSearch\"\n             [matAutocomplete]=\"autoSearch\"\n             class=\"global-search-input max-width-85\"\n             matInput\n             placeholder=\"search ...\" />\n\n      <button (click)=\"navigate(null, '/advanced-search')\"\n              matSuffix\n              class=\"btn advanced-button\" mat-raised-button>\n        <mat-icon>flash_on</mat-icon>\n        {{ 'COMMON.HEADER.GLOBAL_SEARCH.ADVANCED' | commonTranslate: lang }}\n      </button>\n\n      <mat-autocomplete #autoSearch=\"matAutocomplete\" class=\"mat-autocomplete-global-search\" panelWidth=\"54vw\">\n        <mat-option (onSelectionChange)=\"onSelectSearch($event, doc)\"\n                    *ngFor=\"let doc of documents$ | async\"\n                    class=\"mat-option-global-search\">\n          <!--PURCHASE_ORDER-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PURCHASE_ORDER\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt_long</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PURCHASE_ORDER' | commonTranslate: lang }}</span>\n                <span>{{ doc.poNumber }}\n                  - {{ doc.totalAmount | currency: doc.currencyCode:'symbol':undefined:'fr-FR' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.BASKET_NUMBER' | commonTranslate: lang }}</span>\n                <span>{{ doc?.basketNumber ? doc.basketNumber : '-' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc?.ean ? doc.ean : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--PRODUCT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.PRODUCT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">movie</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"ellipsis d-flex flex-column max-width-60\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.SUPPORT' | commonTranslate: lang }}</span>\n                <span>{{ doc.support[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EAN' | commonTranslate: lang }}</span>\n                <span>{{ doc.ean }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.RELEASE_DATE' | commonTranslate: lang }}</span>\n                <span>{{ doc?.releaseDate ? doc.releaseDate : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_VERSION\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">theaters</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-75 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.title }} ({{ doc.codeIso }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.miloCode }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.PRODUCTION_YEAR' | commonTranslate: lang }}</span>\n                <span>{{ doc.yearOfProduction }}</span>\n              </div>\n            </div>\n          </div>\n          <!--DEAL-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.DEAL\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">local_offer</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-70 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }} - {{ doc.thirdPartyClientName }}\n                  ({{ doc.thirdPartyClientSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.calculatedAmount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.VALIDATION_DATE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.validationDate }}</span>\n              </div>\n            </div>\n          </div>\n          <!--WORK_RECORD-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.WORK_RECORD\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">assignment</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.WORK_RECORD' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.id }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--INVOICE-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.number }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.DEAL' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.dealNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.thirdPartyClientName }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-35\">\n                    <span class=\"auto-complete-label\">\n                      {{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLE' | commonTranslate: lang }}\n                      ({{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.MILO_CODE' | commonTranslate: lang }})\n                    </span>\n                <span class=\"ellipsis\">{{ doc.getTitle(lang) }} ({{ doc.miloCode }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.AMOUNT' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.amount | currency: doc.currencyCode:'symbol' }}</span>\n              </div>\n            </div>\n          </div>\n          <!--THIRD_PARTY-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.THIRD_PARTY\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">person</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-85 ellipsis\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.THIRD_PARTY' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.companyOrPersonName }} ({{ doc.address | thirdPartyAddressSearch: lang }}\n                  )</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15\">\n                    <span\n                      class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CODE' | commonTranslate: lang }}</span>\n                <span>{{ doc.code }}</span>\n              </div>\n            </div>\n          </div>\n          <!--CONTRACT-->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'cess'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">receipt</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'acq'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">shop_two</span>\n              <span *ngIf=\"getContractType(doc.type.labelEn) === 'auth'\"\n                    class=\"material-icons-outlined rapid-search-type-icon\">account_circle</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-10 ellipsis\">\n                <span\n                  class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.lisaId }} </span>\n              </div>\n              <div class=\"d-flex flex-column max-width-10\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TYPE' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.type[labelLang] }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.STATUS' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.status[labelLang] }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn !== 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.LICENSOR' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.licensor ? doc.licensor : '-' }}</span>\n              </div>\n              <div *ngIf=\"doc.type.labelEn === 'Sale'\" class=\"d-flex flex-column max-width-40 ellipsis\">\n                    <span class=\"auto-complete-label\">{{\n                        'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CUSTOMER' | commonTranslate: lang\n                      }}</span>\n                <span>{{ doc.customer ? doc.customer : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY CONTRACT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_CONTRACT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-30 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{doc.clientCodeSap}})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-50 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.TITLES' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.works.join(', ') }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY COUNT -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_COUNT\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-20 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.END_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.periodEnd ? doc.periodEnd : '-' }}</span>\n              </div>\n            </div>\n          </div>\n          <!-- ROYALTY INVOICE -->\n          <div *ngIf=\"doc.docType === RapidSearchItemType.ROYALTY_INVOICE\" class=\"d-flex align-items-center\">\n            <div class=\"max-width-5\">\n              <span class=\"material-icons-outlined rapid-search-type-icon\">savings</span>\n            </div>\n            <div class=\"d-flex max-width-95\">\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.INVOICE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.invoiceNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.COUNT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.countNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CONTRACT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.contractNumber }}</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-40 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.CLIENT' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.clientName }} ({{ doc.clientCodeSap }})</span>\n              </div>\n              <div class=\"d-flex flex-column max-width-15 ellipsis\">\n                <span class=\"auto-complete-label\">{{ 'COMMON.HEADER.GLOBAL_SEARCH.ITEM.EMISSION_DATE' | commonTranslate: lang }}</span>\n                <span class=\"ellipsis\">{{ doc.emissionDate }}</span>\n              </div>\n            </div>\n          </div>\n        </mat-option>\n      </mat-autocomplete>\n\n    </mat-form-field>\n  </div>\n\n  <div *ngIf=\"user && user.secondary\" class=\"connected-as d-flex justify-content-between align-items-center\">\n      <span style=\"margin-right: 10px\">\n        {{ 'COMMON.HEADER.CONNECTED_AS' | commonTranslate: lang }}  {{ user.login + ' - ' + user.firstName + ' ' + user.name }}\n      </span>\n\n    <button (click)=\"stopIdentityTheft()\" *ngIf=\"user.secondary\" color=\"warn\" mat-raised-button>\n      {{ 'CORE.STOP' | commonTranslate: lang }}\n    </button>\n  </div>\n\n  <span (click)=\"getHistory()\" [matMenuTriggerFor]=\"menuHistory\"\n        class=\"material-icons header-icon max-width-5\">history</span>\n  <mat-menu #menuHistory=\"matMenu\" class=\"action-menu\">\n    <ng-container *ngFor=\"let history of historyList\" [ngSwitch]=\"history.type\">\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PRODUCT'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">theaters</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PRODUCT' | commonTranslate : lang }}{{ history.type }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/purchase-orders/' + history.id)\" *ngSwitchCase=\"'PO'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt_long</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.PO' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/deal/consult/' + history.id)\" *ngSwitchCase=\"'DEAL'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">local_offer</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.DEAL' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('commercial', '/work-record/consult/'+ history.id +'/general')\" *ngSwitchCase=\"'WORK'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">assignment</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.WORK_RECORD' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/acq/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_ACQ'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">shop_two</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_ACQ' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/cess/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_CESS'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">receipt</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_CESS' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('legal', '/contracts-details/auth/' + history.id)\"\n              *ngSwitchCase=\"'CONTRACT_AUTH'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">account_circle</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.CONTRACT_AUTH' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button (click)=\"navigate('expenditure-commitment', '/budget/form/' + history.id)\" *ngSwitchCase=\"'BUDGET'\"\n              mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">payments</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.BUDGET' | commonTranslate : lang }} {{ history.ref }}\n      </button>\n      <button *ngSwitchCase=\"'NO_HISTORY_AVAILABLE'\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">not_interested</mat-icon>\n        {{ 'COMMON.HEADER.HISTORY.NO_HISTORY_AVAILABLE' | commonTranslate : lang }}\n      </button>\n    </ng-container>\n  </mat-menu>\n  <span class=\"header-separator\"></span>\n\n  <span [matMenuTriggerFor]=\"settings\" class=\"material-icons-outlined header-icon max-width-5\">settings</span>\n\n  <!-- #enddocregion mat-menu-trigger-for -->\n  <mat-menu #settings=\"matMenu\" class=\"settings-menu\">\n    <button (click)=\"switchTheme()\" mat-menu-item>\n      <mat-icon class=\"theme-icon\">toggle_on</mat-icon>\n      <span>{{ 'COMMON.HEADER.PARAMETERS.THEME' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"en\")' *ngIf='lang !== \"en\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/en-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.ENGLISH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"fr\")' *ngIf='lang !== \"fr\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/fr-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.FRENCH' | commonTranslate: lang }}</span>\n    </button>\n    <button class=\"img-btn\" (click)='switchLang(\"de\")' *ngIf='lang !== \"de\"' mat-menu-item>\n      <img class=\"mat-icon\" src=\"assets/img/flag/de-flag.png\">\n      <span>{{ 'COMMON.HEADER.PARAMETERS.TITLE.LANGUAGES.DEUTCH' | commonTranslate: lang }}</span>\n    </button>\n    <ng-container *ngxPermissionsExcept=\"restrictions\">\n      <!--USER-->\n      <button (click)=\"navigate('user', '/account/authorization/search')\" *ngIf=\"user && user.admin\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">manage_accounts</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SECTION_TITLE' | commonTranslate: lang }}</span>\n      </button>\n    </ng-container>\n      <!--MY PREFERENCES-->\n      <button (click)=\"navigate('user', '/account/settings')\" mat-menu-item>\n        <mat-icon class=\"material-icons-outlined\">settings</mat-icon>\n        <span>{{ 'COMMON.HEADER.MENU.USER.SETTINGS' | commonTranslate: lang }}</span>\n      </button>\n  </mat-menu>\n</mat-toolbar>\n\n", styles: [".header-icon{color:#009ef7;cursor:pointer;text-align:center;margin:0 4px}.header-separator{display:inline-block;height:25%}.global-search-separator{display:inline-block;height:70%;border-right:2px solid #D3DFEC}:host-context(.dark-theme){background-color:#2a2d3e}:host-context(.dark-theme) .global-search{background:#34384c}:host-context(.dark-theme) .global-search-input{background:#34384c}:host-context(.dark-theme) .global-search-separator{border-right:2px solid #2A2D3E}:host-context(.dark-theme) .header-separator{border-right:2px solid #111219}::ng-deep .dark-theme .mat-autocomplete-global-search{background:#2a2d3e!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search:focus:not(.mat-option-disabled){background:#212332!important;color:#fff!important}::ng-deep .dark-theme .mat-mdc-option.mat-option-global-search{color:#fff!important}::ng-deep .dark-theme .global-search-input::placeholder{color:#a1b7d4!important}:host-context(.light-theme){background-color:#fff}:host-context(.light-theme) .global-search{background:#eff3f6}:host-context(.light-theme) .global-search-input{background:#eff3f6}:host-context(.light-theme) .global-search-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .header-separator{border-right:2px solid #D3DFEC}:host-context(.light-theme) .global-search-input::placeholder{color:#445d7b!important}:host-context(.light-theme) .mat-toolbar{background-color:#fff}::ng-deep .light-theme .mat-mdc-option.mat-option-global-search:hover:not(.mdc-list-item--disabled){background:#d3dfec!important}.logo-unity{height:48px;width:48px}.global-search .header-icon{margin:0 10px}.global-search{display:flex;align-items:center;height:40px;background:#eff3f6;margin-left:5px;border-radius:8px;flex:1 1 0;width:auto;min-width:0}.global-search-input{background:#f3f6f9;border:none;margin-left:10px;font-size:14px!important}.global-search-input :focus{outline:none}.rapid-search-type-icon{font-size:1.4em;vertical-align:middle}.advanced-button{background:#7c87ff!important;color:#fff!important;width:90px;min-width:90px!important;height:24px!important;box-shadow:0 2px 6px #445d7b29,inset 0 2px 6px #ffffff14,inset 0 -2px 4px #445d7b0f;margin-right:5px;padding:0}.advanced-button .mat-icon{color:#fff!important;font-size:14px!important;height:unset;width:unset;margin-right:0}.connected-as{font-size:12px}.user-thumb{margin-right:16px;width:40px;height:40px}#env-dev,#env-uat,#env-sbx{background-color:#809ec1;color:#fff}.env{color:#fff;font-size:10px;border-radius:1px;padding:0 5px;line-height:16px;height:16px}.global-search-input::placeholder{font-style:italic!important;font-weight:700!important}.mat-option-global-search{height:30px!important;line-height:15px!important;padding:0 8px}.auto-complete-label{font-size:8px}::ng-deep .global-search .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .global-search .mat-mdc-form-field .mat-mdc-text-field-wrapper{background-color:transparent!important}::ng-deep .global-search .mat-mdc-form-field.mat-form-field-appearance-fill .mat-mdc-form-field-focus-overlay{opacity:0!important}::ng-deep .global-search .mdc-line-ripple{display:none!important}::ng-deep .global-search .mat-mdc-form-field-infix{min-height:40px!important;padding-top:8px!important;padding-bottom:8px!important}.max-width-0{flex:1 1 0%;max-width:0%}.max-width-5{flex:1 1 5%;max-width:5%}.max-width-10{flex:1 1 10%;max-width:10%}.max-width-15{flex:1 1 15%;max-width:15%}.max-width-20{flex:1 1 20%;max-width:20%}.max-width-25{flex:1 1 25%;max-width:25%}.max-width-30{flex:1 1 30%;max-width:30%}.max-width-35{flex:1 1 35%;max-width:35%}.max-width-40{flex:1 1 40%;max-width:40%}.max-width-45{flex:1 1 45%;max-width:45%}.max-width-50{flex:1 1 50%;max-width:50%}.max-width-55{flex:1 1 55%;max-width:55%}.max-width-60{flex:1 1 60%;max-width:60%}.max-width-65{flex:1 1 65%;max-width:65%}.max-width-70{flex:1 1 70%;max-width:70%}.max-width-75{flex:1 1 75%;max-width:75%}.max-width-80{flex:1 1 80%;max-width:80%}.max-width-85{flex:1 1 85%;max-width:85%}.max-width-90{flex:1 1 90%;max-width:90%}.max-width-95{flex:1 1 95%;max-width:95%}.max-width-100{flex:1 1 100%;max-width:100%}.spacer{flex:1 1 auto}.toolbar-header{height:64px;position:absolute;padding:0 16px!important;z-index:999}.menu-header{max-width:70%;overflow:hidden;max-height:60px}::ng-deep .settings-menu.mat-mdc-menu-panel .mat-mdc-menu-item .mat-icon{height:24px;width:24px;display:flex;justify-content:center;align-items:center;margin-right:15px;font-size:18px}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn .mat-mdc-menu-item-text{display:flex;justify-content:start;align-items:center}::ng-deep .settings-menu.mat-mdc-menu-panel .img-btn img{height:12px!important;width:auto!important;display:block!important;padding-left:3px;margin-right:17px!important}.theme-icon{font-size:24px!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$3.Router }, { type: LocalStorageEventsService }, { type: LocalStorageService }, { type: ToasterEventsService }, { type: i1$4.TranslateService }, { type: CommonApiService }, { type: SessionStorageService }, { type: PermissionsService }, { type: i9.OverlayContainer }, { type: i1.CookieService }, { type: LangService }, { type: ElasticsearchService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [WEB_CONFIG]