@fundamental-ngx/core 0.55.4 → 0.55.5

package/fesm2022/fundamental-ngx-core-shellbar.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { ViewChild, Input, ChangeDetectionStrategy, ViewEncapsulation, Component, InjectionToken, EventEmitter, Output, inject, isDevMode, Directive, ContentChild, ChangeDetectorRef, HostBinding, ContentChildren, DestroyRef, ElementRef, NgModule } from '@angular/core';
+import { ViewChild, Input, ChangeDetectionStrategy, ViewEncapsulation, Component, InjectionToken, inject, ElementRef, EventEmitter, Output, isDevMode, Directive, ContentChild, ChangeDetectorRef, ContentChildren, computed, DestroyRef, NgModule } from '@angular/core';
 import { ButtonComponent, FD_BUTTON_COMPONENT, defaultButtonType } from '@fundamental-ngx/core/button';
 import { ContentDensityDirective, contentDensityObserverProviders, ContentDensityMode, ContentDensityModule } from '@fundamental-ngx/core/content-density';
 import { IconComponent, FD_DEFAULT_ICON_FONT_FAMILY } from '@fundamental-ngx/core/icon';
@@ -12,9 +12,9 @@ import * as i1 from '@angular/cdk/portal';
 import { PortalModule, CdkPortalOutlet, DomPortal } from '@angular/cdk/portal';
 import { AvatarComponent } from '@fundamental-ngx/core/avatar';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
-import { resizeObservable } from '@fundamental-ngx/cdk/utils';
+import { ResizeObserverService, RtlService, ClickedDirective } from '@fundamental-ngx/cdk/utils';
 import equal from 'fast-deep-equal';
-import { BehaviorSubject, debounceTime, distinctUntilChanged } from 'rxjs';
+import { BehaviorSubject, distinctUntilChanged } from 'rxjs';
 
 /**
  * The component that represents a product menu.
@@ -52,7 +52,7 @@ class ProductMenuComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ProductMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ProductMenuComponent, isStandalone: true, selector: "fd-product-menu", inputs: { closeOnEscapeKey: "closeOnEscapeKey", closeOnOutsideClick: "closeOnOutsideClick", triggers: "triggers", placement: "placement", disabled: "disabled", fillControlMode: "fillControlMode", control: "control", items: "items", closePopoverOnSelect: "closePopoverOnSelect" }, viewQueries: [{ propertyName: "menu", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "@if (items && items.length > 0) {\n    <h1 class=\"fd-sr-only\">{{ control }}</h1>\n    <button\n        fd-button\n        fdType=\"transparent\"\n        class=\"fd-shellbar__button fd-shellbar__button--menu\"\n        glyph=\"slim-arrow-down\"\n        glyphPosition=\"after\"\n        fdCozy\n        [disabled]=\"disabled\"\n        [fdMenuTrigger]=\"menu\"\n    >\n        <span class=\"fd-shellbar__title\">{{ control }}</span>\n    </button>\n    <fd-menu\n        #menu\n        [placement]=\"placement\"\n        [triggers]=\"triggers\"\n        [fillControlMode]=\"fillControlMode\"\n        [closeOnEscapeKey]=\"closeOnEscapeKey\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        @for (item of items; track item) {\n            <li (click)=\"itemClicked(item, $event)\" fd-menu-item>\n                <a\n                    [attr.href]=\"item.link ? item.link : null\"\n                    [attr.target]=\"item.newTab ? '_blank' : null\"\n                    fd-menu-interactive\n                >\n                    <span fd-menu-title>{{ item.name }}</span>\n                    @if (item.glyph) {\n                        <fd-icon fd-menu-addon position=\"after\" [glyph]=\"item.glyph\"></fd-icon>\n                    }\n                </a>\n            </li>\n        }\n    </fd-menu>\n} @else {\n    <h1 class=\"fd-shellbar__title fd-product-menu__title\">\n        {{ control }}\n    </h1>\n}\n", styles: [".fd-sr-only{position:absolute;clip:rect(0,0,0,0);height:1px;width:1px;border:0;margin:-1px;padding:0;overflow:hidden;white-space:nowrap}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ProductMenuComponent, isStandalone: true, selector: "fd-product-menu", inputs: { closeOnEscapeKey: "closeOnEscapeKey", closeOnOutsideClick: "closeOnOutsideClick", triggers: "triggers", placement: "placement", disabled: "disabled", fillControlMode: "fillControlMode", control: "control", items: "items", closePopoverOnSelect: "closePopoverOnSelect" }, viewQueries: [{ propertyName: "menu", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "@if (items && items.length > 0) {\n    <div class=\"fd-shellbar__product\">\n        <h1 class=\"fd-sr-only\">{{ control }}</h1>\n        <button\n            fd-button\n            fdType=\"transparent\"\n            class=\"fd-shellbar__button fd-shellbar__button--menu\"\n            glyph=\"slim-arrow-down\"\n            glyphPosition=\"after\"\n            fdCozy\n            [disabled]=\"disabled\"\n            [fdMenuTrigger]=\"menu\"\n        >\n            <span class=\"fd-shellbar__title\">{{ control }}</span>\n        </button>\n        <fd-menu\n            #menu\n            [placement]=\"placement\"\n            [triggers]=\"triggers\"\n            [fillControlMode]=\"fillControlMode\"\n            [closeOnEscapeKey]=\"closeOnEscapeKey\"\n            [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        >\n            @for (item of items; track item) {\n                <li (click)=\"itemClicked(item, $event)\" fd-menu-item>\n                    <a\n                        [attr.href]=\"item.link ? item.link : null\"\n                        [attr.target]=\"item.newTab ? '_blank' : null\"\n                        fd-menu-interactive\n                    >\n                        <span fd-menu-title>{{ item.name }}</span>\n                        @if (item.glyph) {\n                            <fd-icon fd-menu-addon position=\"after\" [glyph]=\"item.glyph\"></fd-icon>\n                        }\n                    </a>\n                </li>\n            }\n        </fd-menu>\n    </div>\n} @else {\n    <div class=\"fd-shellbar__product\">\n        <h1 class=\"fd-shellbar__title fd-product-menu__title\">\n            {{ control }}\n        </h1>\n    </div>\n}\n", styles: [".fd-sr-only{position:absolute;clip:rect(0,0,0,0);height:1px;width:1px;border:0;margin:-1px;padding:0;overflow:hidden;white-space:nowrap}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ProductMenuComponent, decorators: [{
             type: Component,
@@ -65,7 +65,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         MenuTitleDirective,
                         MenuTriggerDirective,
                         IconComponent
-                    ], template: "@if (items && items.length > 0) {\n    <h1 class=\"fd-sr-only\">{{ control }}</h1>\n    <button\n        fd-button\n        fdType=\"transparent\"\n        class=\"fd-shellbar__button fd-shellbar__button--menu\"\n        glyph=\"slim-arrow-down\"\n        glyphPosition=\"after\"\n        fdCozy\n        [disabled]=\"disabled\"\n        [fdMenuTrigger]=\"menu\"\n    >\n        <span class=\"fd-shellbar__title\">{{ control }}</span>\n    </button>\n    <fd-menu\n        #menu\n        [placement]=\"placement\"\n        [triggers]=\"triggers\"\n        [fillControlMode]=\"fillControlMode\"\n        [closeOnEscapeKey]=\"closeOnEscapeKey\"\n        [closeOnOutsideClick]=\"closeOnOutsideClick\"\n    >\n        @for (item of items; track item) {\n            <li (click)=\"itemClicked(item, $event)\" fd-menu-item>\n                <a\n                    [attr.href]=\"item.link ? item.link : null\"\n                    [attr.target]=\"item.newTab ? '_blank' : null\"\n                    fd-menu-interactive\n                >\n                    <span fd-menu-title>{{ item.name }}</span>\n                    @if (item.glyph) {\n                        <fd-icon fd-menu-addon position=\"after\" [glyph]=\"item.glyph\"></fd-icon>\n                    }\n                </a>\n            </li>\n        }\n    </fd-menu>\n} @else {\n    <h1 class=\"fd-shellbar__title fd-product-menu__title\">\n        {{ control }}\n    </h1>\n}\n", styles: [".fd-sr-only{position:absolute;clip:rect(0,0,0,0);height:1px;width:1px;border:0;margin:-1px;padding:0;overflow:hidden;white-space:nowrap}\n"] }]
+                    ], template: "@if (items && items.length > 0) {\n    <div class=\"fd-shellbar__product\">\n        <h1 class=\"fd-sr-only\">{{ control }}</h1>\n        <button\n            fd-button\n            fdType=\"transparent\"\n            class=\"fd-shellbar__button fd-shellbar__button--menu\"\n            glyph=\"slim-arrow-down\"\n            glyphPosition=\"after\"\n            fdCozy\n            [disabled]=\"disabled\"\n            [fdMenuTrigger]=\"menu\"\n        >\n            <span class=\"fd-shellbar__title\">{{ control }}</span>\n        </button>\n        <fd-menu\n            #menu\n            [placement]=\"placement\"\n            [triggers]=\"triggers\"\n            [fillControlMode]=\"fillControlMode\"\n            [closeOnEscapeKey]=\"closeOnEscapeKey\"\n            [closeOnOutsideClick]=\"closeOnOutsideClick\"\n        >\n            @for (item of items; track item) {\n                <li (click)=\"itemClicked(item, $event)\" fd-menu-item>\n                    <a\n                        [attr.href]=\"item.link ? item.link : null\"\n                        [attr.target]=\"item.newTab ? '_blank' : null\"\n                        fd-menu-interactive\n                    >\n                        <span fd-menu-title>{{ item.name }}</span>\n                        @if (item.glyph) {\n                            <fd-icon fd-menu-addon position=\"after\" [glyph]=\"item.glyph\"></fd-icon>\n                        }\n                    </a>\n                </li>\n            }\n        </fd-menu>\n    </div>\n} @else {\n    <div class=\"fd-shellbar__product\">\n        <h1 class=\"fd-shellbar__title fd-product-menu__title\">\n            {{ control }}\n        </h1>\n    </div>\n}\n", styles: [".fd-sr-only{position:absolute;clip:rect(0,0,0,0);height:1px;width:1px;border:0;margin:-1px;padding:0;overflow:hidden;white-space:nowrap}\n"] }]
         }], propDecorators: { closeOnEscapeKey: [{
                 type: Input
             }], closeOnOutsideClick: [{
@@ -110,6 +110,8 @@ class ShellbarActionComponent {
     constructor() {
         /** Glyph font family */
         this.glyphFont = FD_DEFAULT_ICON_FONT_FAMILY;
+        /** @hidden */
+        this._elRef = inject(ElementRef);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarActionComponent, isStandalone: true, selector: "fd-shellbar-action", inputs: { glyph: "glyph", glyphFont: "glyphFont", callback: "callback", label: "label", notificationLabel: "notificationLabel", notificationCount: "notificationCount" }, providers: [
@@ -117,7 +119,7 @@ class ShellbarActionComponent {
                 provide: FD_SHELLBAR_ACTION_COMPONENT,
                 useExisting: ShellbarActionComponent
             }
-        ], ngImport: i0, template: "<div class=\"fd-shellbar__action fd-shellbar__action--desktop\">\n    <button\n        fd-button\n        fdType=\"transparent\"\n        class=\"fd-shellbar__button\"\n        fdCozy\n        [glyph]=\"glyph\"\n        [glyphFont]=\"glyphFont\"\n        (click)=\"callback ? callback($event) : ''\"\n    >\n        @if (notificationCount) {\n            <span class=\"fd-button__badge\" [attr.aria-label]=\"notificationLabel\">\n                {{ notificationCount }}\n            </span>\n        }\n    </button>\n</div>\n", dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], ngImport: i0, template: "<div class=\"fd-shellbar__action fd-shellbar__action\">\n    <button\n        fd-button\n        fdType=\"transparent\"\n        class=\"fd-shellbar__button\"\n        fdCozy\n        [glyph]=\"glyph\"\n        [glyphFont]=\"glyphFont\"\n        (click)=\"callback ? callback($event) : ''\"\n    >\n        @if (notificationCount) {\n            <span class=\"fd-button__badge\" [attr.aria-label]=\"notificationLabel\">\n                {{ notificationCount }}\n            </span>\n        }\n    </button>\n</div>\n", dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarActionComponent, decorators: [{
             type: Component,
@@ -126,7 +128,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                             provide: FD_SHELLBAR_ACTION_COMPONENT,
                             useExisting: ShellbarActionComponent
                         }
-                    ], imports: [ButtonComponent, ContentDensityDirective], template: "<div class=\"fd-shellbar__action fd-shellbar__action--desktop\">\n    <button\n        fd-button\n        fdType=\"transparent\"\n        class=\"fd-shellbar__button\"\n        fdCozy\n        [glyph]=\"glyph\"\n        [glyphFont]=\"glyphFont\"\n        (click)=\"callback ? callback($event) : ''\"\n    >\n        @if (notificationCount) {\n            <span class=\"fd-button__badge\" [attr.aria-label]=\"notificationLabel\">\n                {{ notificationCount }}\n            </span>\n        }\n    </button>\n</div>\n" }]
+                    ], imports: [ButtonComponent, ContentDensityDirective], template: "<div class=\"fd-shellbar__action fd-shellbar__action\">\n    <button\n        fd-button\n        fdType=\"transparent\"\n        class=\"fd-shellbar__button\"\n        fdCozy\n        [glyph]=\"glyph\"\n        [glyphFont]=\"glyphFont\"\n        (click)=\"callback ? callback($event) : ''\"\n    >\n        @if (notificationCount) {\n            <span class=\"fd-button__badge\" [attr.aria-label]=\"notificationLabel\">\n                {{ notificationCount }}\n            </span>\n        }\n    </button>\n</div>\n" }]
         }], propDecorators: { glyph: [{
                 type: Input
             }], glyphFont: [{
@@ -166,7 +168,7 @@ class ShellbarActionsMobileComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarActionsMobileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarActionsMobileComponent, isStandalone: true, selector: "fd-shellbar-actions-mobile", inputs: { shellbarActions: "shellbarActions", searchExists: "searchExists" }, outputs: { showSearch: "showSearch" }, ngImport: i0, template: "@if (shellbarActions.length > 0 || searchExists) {\n    <div class=\"fd-shellbar-collapse\">\n        <fd-action-sheet placement=\"bottom-end\" #actionSheet>\n            <fd-action-sheet-control>\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                    class=\"fd-shellbar__button\"\n                    [attr.aria-label]=\"'coreShellbar.collapsedItemMenuLabel' | fdTranslate\"\n                >\n                    @if (totalNotifications) {\n                        <span class=\"fd-button__badge\">\n                            {{ totalNotifications }}\n                        </span>\n                    }\n                </button>\n            </fd-action-sheet-control>\n            <fd-action-sheet-body>\n                @if (searchExists) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        glyph=\"search\"\n                        [label]=\"'coreShellbar.search' | fdTranslate\"\n                        (click)=\"showSearch.emit(); actionSheet.close()\"\n                    ></li>\n                }\n                @for (action of shellbarActions; track action) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        [glyph]=\"action.glyph\"\n                        [label]=\"action.label\"\n                        (click)=\"actionClicked(action, $event)\"\n                    >\n                        @if (action.notificationCount) {\n                            <span class=\"fd-button__badge\">{{ action.notificationCount }}</span>\n                        }\n                    </li>\n                }\n            </fd-action-sheet-body>\n        </fd-action-sheet>\n    </div>\n}\n", dependencies: [{ kind: "component", type: ActionSheetComponent, selector: "fd-action-sheet", inputs: ["mobile", "placement", "noArrow", "isOpen", "keyboardSupport", "triggers"], outputs: ["focusEscapeList", "isOpenChange"] }, { kind: "component", type: ActionSheetControlComponent, selector: "fd-action-sheet-control", outputs: ["clicked"] }, { kind: "component", type: ActionSheetItemComponent, selector: "[fd-action-sheet-item]", inputs: ["label", "glyph", "glyphFont", "negative", "isCloseButton", "disabled"], outputs: ["keyDown"] }, { kind: "component", type: ActionSheetBodyComponent, selector: "fd-action-sheet-body", inputs: ["actionSheetBodyId", "mobile", "ariaLabel", "ariaLabelledby"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarActionsMobileComponent, isStandalone: true, selector: "fd-shellbar-actions-mobile", inputs: { shellbarActions: "shellbarActions", searchExists: "searchExists", assistiveToolsCallback: "assistiveToolsCallback" }, outputs: { showSearch: "showSearch" }, ngImport: i0, template: "@if (shellbarActions.length > 0 || searchExists) {\n    <div class=\"fd-shellbar-collapse\">\n        <fd-action-sheet placement=\"bottom-end\" #actionSheet>\n            <fd-action-sheet-control>\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                    class=\"fd-shellbar__button\"\n                    [attr.aria-label]=\"'coreShellbar.collapsedItemMenuLabel' | fdTranslate\"\n                >\n                    @if (totalNotifications) {\n                        <span class=\"fd-button__badge\">\n                            {{ totalNotifications }}\n                        </span>\n                    }\n                </button>\n            </fd-action-sheet-control>\n            <fd-action-sheet-body>\n                @if (searchExists) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        glyph=\"search\"\n                        [label]=\"'coreShellbar.search' | fdTranslate\"\n                        (click)=\"showSearch.emit(); actionSheet.close()\"\n                    ></li>\n                }\n                @for (action of shellbarActions; track action) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        [glyph]=\"action.glyph\"\n                        [label]=\"action.label\"\n                        (click)=\"actionClicked(action, $event)\"\n                    >\n                        @if (action.notificationCount) {\n                            <span class=\"fd-button__badge\">{{ action.notificationCount }}</span>\n                        }\n                    </li>\n                }\n                @if (!!assistiveToolsCallback) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        glyph=\"sys-help\"\n                        [label]=\"'coreShellbar.assistiveTools' | fdTranslate\"\n                        (click)=\"assistiveToolsCallback($event)\"\n                    ></li>\n                }\n            </fd-action-sheet-body>\n        </fd-action-sheet>\n    </div>\n}\n", dependencies: [{ kind: "component", type: ActionSheetComponent, selector: "fd-action-sheet", inputs: ["mobile", "placement", "noArrow", "isOpen", "keyboardSupport", "triggers"], outputs: ["focusEscapeList", "isOpenChange"] }, { kind: "component", type: ActionSheetControlComponent, selector: "fd-action-sheet-control", outputs: ["clicked"] }, { kind: "component", type: ActionSheetItemComponent, selector: "[fd-action-sheet-item]", inputs: ["label", "glyph", "glyphFont", "negative", "isCloseButton", "disabled"], outputs: ["keyDown"] }, { kind: "component", type: ActionSheetBodyComponent, selector: "fd-action-sheet-body", inputs: ["actionSheetBodyId", "mobile", "ariaLabel", "ariaLabelledby"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarActionsMobileComponent, decorators: [{
             type: Component,
@@ -177,11 +179,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         ActionSheetBodyComponent,
                         ButtonComponent,
                         FdTranslatePipe
-                    ], template: "@if (shellbarActions.length > 0 || searchExists) {\n    <div class=\"fd-shellbar-collapse\">\n        <fd-action-sheet placement=\"bottom-end\" #actionSheet>\n            <fd-action-sheet-control>\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                    class=\"fd-shellbar__button\"\n                    [attr.aria-label]=\"'coreShellbar.collapsedItemMenuLabel' | fdTranslate\"\n                >\n                    @if (totalNotifications) {\n                        <span class=\"fd-button__badge\">\n                            {{ totalNotifications }}\n                        </span>\n                    }\n                </button>\n            </fd-action-sheet-control>\n            <fd-action-sheet-body>\n                @if (searchExists) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        glyph=\"search\"\n                        [label]=\"'coreShellbar.search' | fdTranslate\"\n                        (click)=\"showSearch.emit(); actionSheet.close()\"\n                    ></li>\n                }\n                @for (action of shellbarActions; track action) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        [glyph]=\"action.glyph\"\n                        [label]=\"action.label\"\n                        (click)=\"actionClicked(action, $event)\"\n                    >\n                        @if (action.notificationCount) {\n                            <span class=\"fd-button__badge\">{{ action.notificationCount }}</span>\n                        }\n                    </li>\n                }\n            </fd-action-sheet-body>\n        </fd-action-sheet>\n    </div>\n}\n" }]
+                    ], template: "@if (shellbarActions.length > 0 || searchExists) {\n    <div class=\"fd-shellbar-collapse\">\n        <fd-action-sheet placement=\"bottom-end\" #actionSheet>\n            <fd-action-sheet-control>\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    glyph=\"overflow\"\n                    class=\"fd-shellbar__button\"\n                    [attr.aria-label]=\"'coreShellbar.collapsedItemMenuLabel' | fdTranslate\"\n                >\n                    @if (totalNotifications) {\n                        <span class=\"fd-button__badge\">\n                            {{ totalNotifications }}\n                        </span>\n                    }\n                </button>\n            </fd-action-sheet-control>\n            <fd-action-sheet-body>\n                @if (searchExists) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        glyph=\"search\"\n                        [label]=\"'coreShellbar.search' | fdTranslate\"\n                        (click)=\"showSearch.emit(); actionSheet.close()\"\n                    ></li>\n                }\n                @for (action of shellbarActions; track action) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        [glyph]=\"action.glyph\"\n                        [label]=\"action.label\"\n                        (click)=\"actionClicked(action, $event)\"\n                    >\n                        @if (action.notificationCount) {\n                            <span class=\"fd-button__badge\">{{ action.notificationCount }}</span>\n                        }\n                    </li>\n                }\n                @if (!!assistiveToolsCallback) {\n                    <li\n                        fd-action-sheet-item\n                        tabindex=\"-1\"\n                        glyph=\"sys-help\"\n                        [label]=\"'coreShellbar.assistiveTools' | fdTranslate\"\n                        (click)=\"assistiveToolsCallback($event)\"\n                    ></li>\n                }\n            </fd-action-sheet-body>\n        </fd-action-sheet>\n    </div>\n}\n" }]
         }], propDecorators: { shellbarActions: [{
                 type: Input
             }], searchExists: [{
                 type: Input
+            }], assistiveToolsCallback: [{
+                type: Input
             }], showSearch: [{
                 type: Output
             }] } });
@@ -254,7 +258,7 @@ class ShellbarUserMenuComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarUserMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarUserMenuComponent, isStandalone: true, selector: "fd-shellbar-user-menu", inputs: { user: "user", userMenu: "userMenu", fillControlMode: "fillControlMode", placement: "placement", triggers: "triggers", closeOnEscapeKey: "closeOnEscapeKey", closeOnOutsideClick: "closeOnOutsideClick", disabled: "disabled", noArrow: "noArrow" }, outputs: { itemClicked: "itemClicked" }, queries: [{ propertyName: "_contentPassedMenu", first: true, predicate: MenuComponent, descendants: true }, { propertyName: "_shellbarUserMenuButton", first: true, predicate: ShellbarUserMenuButtonDirective, descendants: true }], viewQueries: [{ propertyName: "_menu", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "@if (user || _shellbarUserMenuButton) {\n    <div class=\"fd-shellbar__action fd-shellbar__action--show-always\">\n        <div class=\"fd-user-menu\">\n            @if (!_shellbarUserMenuButton) {\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    fdShellbarUserMenuButton\n                    [disabled]=\"disabled\"\n                    [fdMenuTrigger]=\"menu\"\n                >\n                    @if (!user.image) {\n                        <fd-avatar size=\"xs\" [colorAccent]=\"user.colorAccent\" [circle]=\"true\" [label]=\"user.fullName\">\n                        </fd-avatar>\n                    } @else {\n                        <fd-avatar\n                            [colorAccent]=\"user.colorAccent\"\n                            [circle]=\"true\"\n                            size=\"xs\"\n                            image=\"{{ user.image }}\"\n                        ></fd-avatar>\n                    }\n                </button>\n            } @else {\n                <ng-content select=\"[fdShellbarUserMenuButton]\"></ng-content>\n            }\n            @if (userMenu) {\n                <fd-menu\n                    [triggers]=\"triggers\"\n                    [placement]=\"placement\"\n                    [fillControlMode]=\"fillControlMode\"\n                    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n                    [noArrow]=\"noArrow\"\n                    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n                >\n                    @for (item of userMenu; track item) {\n                        <li fd-menu-item (click)=\"itemClick(item, $event)\">\n                            <div fd-menu-interactive>\n                                <span fd-menu-title>{{ item.text }}</span>\n                            </div>\n                        </li>\n                    }\n                </fd-menu>\n            }\n        </div>\n    </div>\n}\n", dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "ngmodule", type: PortalModule }, { kind: "component", type: MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: ShellbarUserMenuButtonDirective, selector: "[fd-button][fdShellbarUserMenuButton]", inputs: ["fdType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarUserMenuComponent, isStandalone: true, selector: "fd-shellbar-user-menu", inputs: { user: "user", userMenu: "userMenu", fillControlMode: "fillControlMode", placement: "placement", triggers: "triggers", closeOnEscapeKey: "closeOnEscapeKey", closeOnOutsideClick: "closeOnOutsideClick", disabled: "disabled", noArrow: "noArrow" }, outputs: { itemClicked: "itemClicked" }, host: { properties: { "style.order": "1" } }, queries: [{ propertyName: "_contentPassedMenu", first: true, predicate: MenuComponent, descendants: true }, { propertyName: "_shellbarUserMenuButton", first: true, predicate: ShellbarUserMenuButtonDirective, descendants: true }], viewQueries: [{ propertyName: "_menu", first: true, predicate: MenuComponent, descendants: true }], ngImport: i0, template: "@if (user || _shellbarUserMenuButton) {\n    <div class=\"fd-shellbar__action fd-shellbar__action--show-always\">\n        <div class=\"fd-user-menu\">\n            @if (!_shellbarUserMenuButton) {\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    fdShellbarUserMenuButton\n                    [disabled]=\"disabled\"\n                    [fdMenuTrigger]=\"menu\"\n                >\n                    @if (!user.image) {\n                        <fd-avatar size=\"xs\" [colorAccent]=\"user.colorAccent\" [circle]=\"true\" [label]=\"user.fullName\">\n                        </fd-avatar>\n                    } @else {\n                        <fd-avatar\n                            [colorAccent]=\"user.colorAccent\"\n                            [circle]=\"true\"\n                            size=\"xs\"\n                            image=\"{{ user.image }}\"\n                        ></fd-avatar>\n                    }\n                </button>\n            } @else {\n                <ng-content select=\"[fdShellbarUserMenuButton]\"></ng-content>\n            }\n            @if (userMenu) {\n                <fd-menu\n                    [triggers]=\"triggers\"\n                    [placement]=\"placement\"\n                    [fillControlMode]=\"fillControlMode\"\n                    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n                    [noArrow]=\"noArrow\"\n                    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n                >\n                    @for (item of userMenu; track item) {\n                        <li fd-menu-item (click)=\"itemClick(item, $event)\">\n                            <div fd-menu-interactive>\n                                <span fd-menu-title>{{ item.text }}</span>\n                            </div>\n                        </li>\n                    }\n                </fd-menu>\n            }\n        </div>\n    </div>\n}\n", dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "ngmodule", type: PortalModule }, { kind: "component", type: MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: ShellbarUserMenuButtonDirective, selector: "[fd-button][fdShellbarUserMenuButton]", inputs: ["fdType"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarUserMenuComponent, decorators: [{
             type: Component,
@@ -268,7 +272,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         MenuTriggerDirective,
                         AvatarComponent,
                         ShellbarUserMenuButtonDirective
-                    ], template: "@if (user || _shellbarUserMenuButton) {\n    <div class=\"fd-shellbar__action fd-shellbar__action--show-always\">\n        <div class=\"fd-user-menu\">\n            @if (!_shellbarUserMenuButton) {\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    fdShellbarUserMenuButton\n                    [disabled]=\"disabled\"\n                    [fdMenuTrigger]=\"menu\"\n                >\n                    @if (!user.image) {\n                        <fd-avatar size=\"xs\" [colorAccent]=\"user.colorAccent\" [circle]=\"true\" [label]=\"user.fullName\">\n                        </fd-avatar>\n                    } @else {\n                        <fd-avatar\n                            [colorAccent]=\"user.colorAccent\"\n                            [circle]=\"true\"\n                            size=\"xs\"\n                            image=\"{{ user.image }}\"\n                        ></fd-avatar>\n                    }\n                </button>\n            } @else {\n                <ng-content select=\"[fdShellbarUserMenuButton]\"></ng-content>\n            }\n            @if (userMenu) {\n                <fd-menu\n                    [triggers]=\"triggers\"\n                    [placement]=\"placement\"\n                    [fillControlMode]=\"fillControlMode\"\n                    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n                    [noArrow]=\"noArrow\"\n                    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n                >\n                    @for (item of userMenu; track item) {\n                        <li fd-menu-item (click)=\"itemClick(item, $event)\">\n                            <div fd-menu-interactive>\n                                <span fd-menu-title>{{ item.text }}</span>\n                            </div>\n                        </li>\n                    }\n                </fd-menu>\n            }\n        </div>\n    </div>\n}\n" }]
+                    ], host: {
+                        '[style.order]': '1' // ensures the user menu is placed at the end of the shellbar
+                    }, template: "@if (user || _shellbarUserMenuButton) {\n    <div class=\"fd-shellbar__action fd-shellbar__action--show-always\">\n        <div class=\"fd-user-menu\">\n            @if (!_shellbarUserMenuButton) {\n                <button\n                    fd-button\n                    fdType=\"transparent\"\n                    fdShellbarUserMenuButton\n                    [disabled]=\"disabled\"\n                    [fdMenuTrigger]=\"menu\"\n                >\n                    @if (!user.image) {\n                        <fd-avatar size=\"xs\" [colorAccent]=\"user.colorAccent\" [circle]=\"true\" [label]=\"user.fullName\">\n                        </fd-avatar>\n                    } @else {\n                        <fd-avatar\n                            [colorAccent]=\"user.colorAccent\"\n                            [circle]=\"true\"\n                            size=\"xs\"\n                            image=\"{{ user.image }}\"\n                        ></fd-avatar>\n                    }\n                </button>\n            } @else {\n                <ng-content select=\"[fdShellbarUserMenuButton]\"></ng-content>\n            }\n            @if (userMenu) {\n                <fd-menu\n                    [triggers]=\"triggers\"\n                    [placement]=\"placement\"\n                    [fillControlMode]=\"fillControlMode\"\n                    [closeOnEscapeKey]=\"closeOnEscapeKey\"\n                    [noArrow]=\"noArrow\"\n                    [closeOnOutsideClick]=\"closeOnOutsideClick\"\n                >\n                    @for (item of userMenu; track item) {\n                        <li fd-menu-item (click)=\"itemClick(item, $event)\">\n                            <div fd-menu-interactive>\n                                <span fd-menu-title>{{ item.text }}</span>\n                            </div>\n                        </li>\n                    }\n                </fd-menu>\n            }\n        </div>\n    </div>\n}\n" }]
         }], propDecorators: { user: [{
                 type: Input
             }], userMenu: [{
@@ -323,36 +329,32 @@ class ShellbarActionsComponent {
     constructor() {
         /** When set to true, popover list will be closed after selecting the option */
         this.closePopoverOnSelect = false;
+        /** Whether to show the assistive tools icon. */
+        this.assistiveTools = false;
         /**
          * Event emitted when search opened.
          */
         this.searchOpen = new EventEmitter();
         /** @hidden */
         this._addSearchIcon = false;
+        /** @hidden */
+        this._showMobileActions = false;
         /**
          * Whether to show the search field.
          */
         this.showSearch = false;
         /** @hidden */
+        this._elRef = inject(ElementRef);
+        /** @hidden */
         this._cd = inject(ChangeDetectorRef);
         /** @hidden */
-        this._shellbar = inject(FD_SHELLBAR_COMPONENT, {
-            optional: true
-        });
+        this._shellbar = inject(FD_SHELLBAR_COMPONENT);
         /** @hidden */
         this._toggleSearch = () => {
             this._setSearchVisibility(!this.showSearch);
         };
     }
     /** @hidden */
-    get _groupShrink() {
-        return !!this._shellbar?.groupFlex?.actions?.shrink;
-    }
-    /** @hidden */
-    get _groupBasisAuto() {
-        return !!this._shellbar?.groupFlex?.actions?.flexBasisAuto;
-    }
-    /** @hidden */
     get userItem() {
         if (this.userComponent) {
             return this.userComponent.user;
@@ -366,6 +368,14 @@ class ShellbarActionsComponent {
         this._portalOutlet?.dispose();
     }
     /** @hidden */
+    _handleOverflow(shouldOverflow) {
+        this._showMobileActions = shouldOverflow;
+        this.shellbarActions.forEach((action) => {
+            action._elRef.nativeElement.style.display = shouldOverflow ? 'none' : 'flex';
+        });
+        this._cd.detectChanges();
+    }
+    /** @hidden */
     _attachSearch(portal, searchComponent, size) {
         this._searchPortal = portal;
         this._addSearchIcon = true;
@@ -412,22 +422,35 @@ class ShellbarActionsComponent {
         if (focusSearch) {
             this._searchComponent?.focus();
         }
+        if (this._shellbar) {
+            this._shellbar._searchToggledFromActions();
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarActionsComponent, isStandalone: true, selector: "fd-shellbar-actions", inputs: { user: "user", userMenu: "userMenu", closePopoverOnSelect: "closePopoverOnSelect" }, outputs: { searchOpen: "searchOpen" }, host: { properties: { "class.fd-shellbar__group": "true", "class.fd-shellbar__group--actions": "true", "class.fd-shellbar__group--shrink": "this._groupShrink", "class.fd-shellbar__group--basis-auto": "this._groupBasisAuto" } }, queries: [{ propertyName: "userComponent", first: true, predicate: ShellbarUserMenuComponent, descendants: true }, { propertyName: "comboboxComponent", first: true, predicate: FD_COMBOBOX_COMPONENT, descendants: true }, { propertyName: "productSwitchComponent", first: true, predicate: FD_PRODUCT_SWITCH_COMPONENT, descendants: true }, { propertyName: "shellbarActions", predicate: FD_SHELLBAR_ACTION_COMPONENT }], viewQueries: [{ propertyName: "userComponentView", first: true, predicate: ShellbarUserMenuComponent, descendants: true }, { propertyName: "_portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true }], ngImport: i0, template: "@if (comboboxComponent) {\n    <div class=\"fd-shellbar__action fd-shellbar__action--desktop\">\n        <ng-content select=\"fd-combobox\"></ng-content>\n    </div>\n}\n<!-- If portal outlet placed outside div, it will be added to the end of the root container. So this div actually keeps outlet in desired place. -->\n<div class=\"fd-shellbar__action\" cdkPortalOutlet></div>\n<div class=\"fd-shellbar__action fd-shellbar__action--mobile\">\n    <fd-shellbar-actions-mobile\n        [shellbarActions]=\"shellbarActions\"\n        [searchExists]=\"!!_searchPortal\"\n        (showSearch)=\"_toggleSearch()\"\n    ></fd-shellbar-actions-mobile>\n</div>\n<div class=\"fd-shellbar__action fd-shellbar__action--desktop\">\n    <ng-content></ng-content>\n</div>\n@if (_addSearchIcon && !showSearch) {\n    <fd-shellbar-action glyph=\"search\" [callback]=\"_toggleSearch\"></fd-shellbar-action>\n}\n<ng-content select=\"fd-shellbar-action\"></ng-content>\n@if (userComponent || userItem) {\n    @if (!userComponent) {\n        <fd-shellbar-user-menu\n            placement=\"bottom-end\"\n            [user]=\"user\"\n            [userMenu]=\"userMenu\"\n            (itemClicked)=\"_triggerItems()\"\n        ></fd-shellbar-user-menu>\n    } @else {\n        <ng-content select=\"fd-shellbar-user-menu\"></ng-content>\n    }\n}\n@if (productSwitchComponent) {\n    <div class=\"fd-shellbar__action\">\n        <ng-content select=\"fd-product-switch\"></ng-content>\n    </div>\n}\n", dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: ShellbarActionsMobileComponent, selector: "fd-shellbar-actions-mobile", inputs: ["shellbarActions", "searchExists"], outputs: ["showSearch"] }, { kind: "component", type: ShellbarActionComponent, selector: "fd-shellbar-action", inputs: ["glyph", "glyphFont", "callback", "label", "notificationLabel", "notificationCount"] }, { kind: "component", type: ShellbarUserMenuComponent, selector: "fd-shellbar-user-menu", inputs: ["user", "userMenu", "fillControlMode", "placement", "triggers", "closeOnEscapeKey", "closeOnOutsideClick", "disabled", "noArrow"], outputs: ["itemClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarActionsComponent, isStandalone: true, selector: "fd-shellbar-actions", inputs: { user: "user", userMenu: "userMenu", closePopoverOnSelect: "closePopoverOnSelect", assistiveTools: "assistiveTools", assistiveToolsCallback: "assistiveToolsCallback" }, outputs: { searchOpen: "searchOpen" }, host: { properties: { "class.fd-shellbar__group": "true", "class.fd-shellbar__group--actions": "true" } }, queries: [{ propertyName: "userComponent", first: true, predicate: ShellbarUserMenuComponent, descendants: true }, { propertyName: "comboboxComponent", first: true, predicate: FD_COMBOBOX_COMPONENT, descendants: true }, { propertyName: "productSwitchComponent", first: true, predicate: FD_PRODUCT_SWITCH_COMPONENT, descendants: true }, { propertyName: "shellbarActions", predicate: FD_SHELLBAR_ACTION_COMPONENT }], viewQueries: [{ propertyName: "userComponentView", first: true, predicate: ShellbarUserMenuComponent, descendants: true }, { propertyName: "_portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true }], ngImport: i0, template: "@if (comboboxComponent) {\n    <div class=\"fd-shellbar__action\">\n        <ng-content select=\"fd-combobox\"></ng-content>\n    </div>\n}\n<!-- If portal outlet placed outside div, it will be added to the end of the root container. So this div actually keeps outlet in desired place. -->\n<div class=\"fd-shellbar__action\" cdkPortalOutlet></div>\n@if (_showMobileActions) {\n    <div class=\"fd-shellbar__action\">\n        <fd-shellbar-actions-mobile\n            [shellbarActions]=\"shellbarActions\"\n            [searchExists]=\"!!_searchPortal\"\n            (showSearch)=\"_toggleSearch()\"\n            [assistiveToolsCallback]=\"assistiveToolsCallback\"\n        ></fd-shellbar-actions-mobile>\n    </div>\n}\n<div class=\"fd-shellbar__action\">\n    <ng-content></ng-content>\n</div>\n@if (_addSearchIcon && !showSearch && !_showMobileActions) {\n    <fd-shellbar-action glyph=\"search\" [callback]=\"_toggleSearch\"></fd-shellbar-action>\n}\n<ng-content select=\"fd-shellbar-action\"></ng-content>\n@if (userComponent || userItem) {\n    @if (!userComponent) {\n        <fd-shellbar-user-menu\n            placement=\"bottom-end\"\n            [user]=\"user\"\n            [userMenu]=\"userMenu\"\n            (itemClicked)=\"_triggerItems()\"\n        ></fd-shellbar-user-menu>\n    } @else {\n        <ng-content select=\"fd-shellbar-user-menu\"></ng-content>\n    }\n}\n@if (productSwitchComponent) {\n    <div class=\"fd-shellbar__action\">\n        <ng-content select=\"fd-product-switch\"></ng-content>\n    </div>\n}\n@if (assistiveTools && !_showMobileActions) {\n    <fd-shellbar-action\n        glyph=\"sys-help\"\n        label=\"{{ 'coreShellbar.assistiveTools' | fdTranslate }}\"\n        [notificationCount]=\"0\"\n        notificationLabel=\"{{ 'coreShellbar.assistiveTools' | fdTranslate }}\"\n        [callback]=\"assistiveToolsCallback\"\n    >\n    </fd-shellbar-action>\n}\n", dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: ShellbarActionsMobileComponent, selector: "fd-shellbar-actions-mobile", inputs: ["shellbarActions", "searchExists", "assistiveToolsCallback"], outputs: ["showSearch"] }, { kind: "component", type: ShellbarActionComponent, selector: "fd-shellbar-action", inputs: ["glyph", "glyphFont", "callback", "label", "notificationLabel", "notificationCount"] }, { kind: "component", type: ShellbarUserMenuComponent, selector: "fd-shellbar-user-menu", inputs: ["user", "userMenu", "fillControlMode", "placement", "triggers", "closeOnEscapeKey", "closeOnOutsideClick", "disabled", "noArrow"], outputs: ["itemClicked"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarActionsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-shellbar-actions', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         '[class.fd-shellbar__group]': 'true',
                         '[class.fd-shellbar__group--actions]': 'true'
-                    }, imports: [PortalModule, ShellbarActionsMobileComponent, ShellbarActionComponent, ShellbarUserMenuComponent], template: "@if (comboboxComponent) {\n    <div class=\"fd-shellbar__action fd-shellbar__action--desktop\">\n        <ng-content select=\"fd-combobox\"></ng-content>\n    </div>\n}\n<!-- If portal outlet placed outside div, it will be added to the end of the root container. So this div actually keeps outlet in desired place. -->\n<div class=\"fd-shellbar__action\" cdkPortalOutlet></div>\n<div class=\"fd-shellbar__action fd-shellbar__action--mobile\">\n    <fd-shellbar-actions-mobile\n        [shellbarActions]=\"shellbarActions\"\n        [searchExists]=\"!!_searchPortal\"\n        (showSearch)=\"_toggleSearch()\"\n    ></fd-shellbar-actions-mobile>\n</div>\n<div class=\"fd-shellbar__action fd-shellbar__action--desktop\">\n    <ng-content></ng-content>\n</div>\n@if (_addSearchIcon && !showSearch) {\n    <fd-shellbar-action glyph=\"search\" [callback]=\"_toggleSearch\"></fd-shellbar-action>\n}\n<ng-content select=\"fd-shellbar-action\"></ng-content>\n@if (userComponent || userItem) {\n    @if (!userComponent) {\n        <fd-shellbar-user-menu\n            placement=\"bottom-end\"\n            [user]=\"user\"\n            [userMenu]=\"userMenu\"\n            (itemClicked)=\"_triggerItems()\"\n        ></fd-shellbar-user-menu>\n    } @else {\n        <ng-content select=\"fd-shellbar-user-menu\"></ng-content>\n    }\n}\n@if (productSwitchComponent) {\n    <div class=\"fd-shellbar__action\">\n        <ng-content select=\"fd-product-switch\"></ng-content>\n    </div>\n}\n" }]
+                    }, imports: [
+                        PortalModule,
+                        ShellbarActionsMobileComponent,
+                        ShellbarActionComponent,
+                        ShellbarUserMenuComponent,
+                        FdTranslatePipe
+                    ], template: "@if (comboboxComponent) {\n    <div class=\"fd-shellbar__action\">\n        <ng-content select=\"fd-combobox\"></ng-content>\n    </div>\n}\n<!-- If portal outlet placed outside div, it will be added to the end of the root container. So this div actually keeps outlet in desired place. -->\n<div class=\"fd-shellbar__action\" cdkPortalOutlet></div>\n@if (_showMobileActions) {\n    <div class=\"fd-shellbar__action\">\n        <fd-shellbar-actions-mobile\n            [shellbarActions]=\"shellbarActions\"\n            [searchExists]=\"!!_searchPortal\"\n            (showSearch)=\"_toggleSearch()\"\n            [assistiveToolsCallback]=\"assistiveToolsCallback\"\n        ></fd-shellbar-actions-mobile>\n    </div>\n}\n<div class=\"fd-shellbar__action\">\n    <ng-content></ng-content>\n</div>\n@if (_addSearchIcon && !showSearch && !_showMobileActions) {\n    <fd-shellbar-action glyph=\"search\" [callback]=\"_toggleSearch\"></fd-shellbar-action>\n}\n<ng-content select=\"fd-shellbar-action\"></ng-content>\n@if (userComponent || userItem) {\n    @if (!userComponent) {\n        <fd-shellbar-user-menu\n            placement=\"bottom-end\"\n            [user]=\"user\"\n            [userMenu]=\"userMenu\"\n            (itemClicked)=\"_triggerItems()\"\n        ></fd-shellbar-user-menu>\n    } @else {\n        <ng-content select=\"fd-shellbar-user-menu\"></ng-content>\n    }\n}\n@if (productSwitchComponent) {\n    <div class=\"fd-shellbar__action\">\n        <ng-content select=\"fd-product-switch\"></ng-content>\n    </div>\n}\n@if (assistiveTools && !_showMobileActions) {\n    <fd-shellbar-action\n        glyph=\"sys-help\"\n        label=\"{{ 'coreShellbar.assistiveTools' | fdTranslate }}\"\n        [notificationCount]=\"0\"\n        notificationLabel=\"{{ 'coreShellbar.assistiveTools' | fdTranslate }}\"\n        [callback]=\"assistiveToolsCallback\"\n    >\n    </fd-shellbar-action>\n}\n" }]
         }], propDecorators: { user: [{
                 type: Input
             }], userMenu: [{
                 type: Input
             }], closePopoverOnSelect: [{
                 type: Input
+            }], assistiveTools: [{
+                type: Input
+            }], assistiveToolsCallback: [{
+                type: Input
             }], searchOpen: [{
                 type: Output
             }], shellbarActions: [{
@@ -448,12 +471,136 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
             }], _portalOutlet: [{
                 type: ViewChild,
                 args: [CdkPortalOutlet]
-            }], _groupShrink: [{
-                type: HostBinding,
-                args: ['class.fd-shellbar__group--shrink']
-            }], _groupBasisAuto: [{
-                type: HostBinding,
-                args: ['class.fd-shellbar__group--basis-auto']
+            }] } });
+
+/**
+ * The component for shellbar branding.
+ */
+class ShellbarBrandingComponent {
+    /** @hidden */
+    constructor(_elRef) {
+        this._elRef = _elRef;
+        /** Whether the shellbar branding is interactive. */
+        this.interactiveBranding = false;
+        /** @hidden */
+        this._shellbar = inject(FD_SHELLBAR_COMPONENT);
+    }
+    /** @hidden */
+    hideTitleIfNeeded() {
+        if (this._shellbar._actionsExceedShellbarWidth()) {
+            const titleEl = this._elRef.nativeElement.querySelector('fd-shellbar-title');
+            if (titleEl) {
+                titleEl.style.display = 'none';
+            }
+        }
+    }
+    /** @hidden */
+    showTitle() {
+        const titleEl = this._elRef.nativeElement.querySelector('fd-shellbar-title');
+        if (titleEl) {
+            titleEl.style.display = 'flex';
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarBrandingComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: ShellbarBrandingComponent, isStandalone: true, selector: "fd-shellbar-branding", inputs: { interactiveBranding: "interactiveBranding" }, ngImport: i0, template: ` <div
+        class="fd-shellbar__branding"
+        [class.fd-shellbar__branding--non-interactive]="!interactiveBranding"
+    >
+        <ng-content></ng-content>
+    </div>`, isInline: true, styles: [".fd-shellbar__branding{padding-inline:0}.fd-shellbar__branding .fd-shellbar__title{padding-inline:.25rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarBrandingComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fd-shellbar-branding', template: ` <div
+        class="fd-shellbar__branding"
+        [class.fd-shellbar__branding--non-interactive]="!interactiveBranding"
+    >
+        <ng-content></ng-content>
+    </div>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, styles: [".fd-shellbar__branding{padding-inline:0}.fd-shellbar__branding .fd-shellbar__title{padding-inline:.25rem}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { interactiveBranding: [{
+                type: Input
+            }] } });
+
+/**
+ * Component representing the context area of the shellbar.
+ * It manages the visibility of its child elements based on the available width.
+ */
+class ShellbarContextAreaComponent {
+    /** @hidden */
+    constructor(el) {
+        this.el = el;
+        /** @hidden */
+        this._shellbar = inject(FD_SHELLBAR_COMPONENT);
+    }
+    /**
+     * Iteratively hides elements if the end of the actions exceed the end of the shellbar.
+     */
+    hideElementsIfNeeded() {
+        const elements = this._getElementsWithPriority();
+        while (this._shellbar._actionsExceedShellbarWidth()) {
+            const shownElements = elements.filter((el) => el.el.style.display !== 'none');
+            if (shownElements.length === 0) {
+                break;
+            }
+            shownElements[shownElements.length - 1].el.style.display = 'none';
+        }
+    }
+    /**
+     * Iteratively shows elements if they can be displayed in the shellbar without causing the actions
+     * to exceed the end of th eshellbar.
+     */
+    showElements() {
+        this._getElementsWithPriority().forEach((el) => {
+            el.el.style.display = '';
+        });
+    }
+    /**
+     * Retrieves the child elements with their respective priority values.
+     * The elements are sorted based on their priority, with elements having
+     * higher priority shown first.
+     */
+    _getElementsWithPriority() {
+        return [...this.el.nativeElement.childNodes]
+            .map((element, index) => {
+            const hasPriorityAttribute = element.hasAttribute && element.hasAttribute('fdShellbarHidePriority');
+            const priority = hasPriorityAttribute
+                ? parseInt(element.getAttribute('fdShellbarHidePriority'), 10)
+                : index + 1;
+            return { el: element, priority };
+        })
+            .sort((a, b) => a.priority - b.priority);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarContextAreaComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: ShellbarContextAreaComponent, isStandalone: true, selector: "fd-shellbar-context-area", host: { properties: { "class.fd-shellbar__group": "true", "class.fd-shellbar__group--context-area": "true" } }, ngImport: i0, template: ` <ng-content></ng-content>`, isInline: true, styles: [":host{min-width:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarContextAreaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fd-shellbar-context-area', standalone: true, template: ` <ng-content></ng-content>`, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        '[class.fd-shellbar__group]': 'true',
+                        '[class.fd-shellbar__group--context-area]': 'true'
+                    }, styles: [":host{min-width:0}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ElementRef }] });
+
+class ShellbarHidePriorityDirective {
+    constructor() {
+        /** @hidden */
+        this.elRef = inject(ElementRef);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarHidePriorityDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: ShellbarHidePriorityDirective, isStandalone: true, selector: "[fdShellbarHidePriority]", inputs: { priority: ["fdShellbarHidePriority", "priority"] }, host: { properties: { "style.flex-shrink": "0" } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarHidePriorityDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[fdShellbarHidePriority]',
+                    standalone: true,
+                    host: {
+                        '[style.flex-shrink]': '0'
+                    }
+                }]
+        }], propDecorators: { priority: [{
+                type: Input,
+                args: ['fdShellbarHidePriority']
             }] } });
 
 /**
@@ -480,6 +627,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                 }]
         }] });
 
+/**
+ * The shellbar separator component.
+ */
+class ShellbarSeparatorComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarSeparatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: ShellbarSeparatorComponent, isStandalone: true, selector: "fd-shellbar-separator", host: { classAttribute: "fd-shellbar__separator" }, ngImport: i0, template: ``, isInline: true, styles: [":host{display:flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarSeparatorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'fd-shellbar-separator', template: ``, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, host: {
+                        class: 'fd-shellbar__separator'
+                    }, styles: [":host{display:flex}\n"] }]
+        }] });
+
 class ShellbarSidenavDirective {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarSidenavDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: ShellbarSidenavDirective, isStandalone: true, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]", host: { classAttribute: "fd-shellbar__button" }, ngImport: i0 }); }
@@ -496,6 +657,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
         }] });
 
 /**
+ * @deprecated The shellbar subtitle component has been deprecated as of 0.54.2.
+ *
  * The component that represents a shellbar subtitle.
  * The subtitle is optional and should be used rarely.
  * ```html
@@ -545,9 +708,19 @@ class ShellbarComponent {
          * will add the corresponding class.
          */
         this.sideNav = false;
+        /** Whether to show the navigation button. */
+        this.showNavigationButton = false;
+        /** Whether to show the back button. */
+        this.showBackButton = false;
+        /** Emitted event when navigation button is clicked. */
+        this.navigationButtonClicked = new EventEmitter();
+        /** Emitted event when back button is clicked. */
+        this.backButtonClicked = new EventEmitter();
         /** @hidden */
         this._showMobileSearch = false;
         /** @hidden */
+        this._rtl$ = computed(() => !!this._rtlService?.rtlSignal());
+        /** @hidden */
         this._currentSize$ = new BehaviorSubject(this._currentSize);
         /** @hidden */
         this._breakpointSize = 'm';
@@ -562,6 +735,12 @@ class ShellbarComponent {
             l: 600,
             xl: 1240
         });
+        /** @hidden */
+        this._resizeObserverService = inject(ResizeObserverService);
+        /** @hidden */
+        this._rtlService = inject(RtlService, {
+            optional: true
+        });
     }
     /** Size of Shellbar component 's' | 'm' | 'l' | 'xl' */
     set size(value) {
@@ -657,9 +836,11 @@ class ShellbarComponent {
     }
     /** @hidden */
     ngAfterViewInit() {
-        resizeObservable(this._shellbar.nativeElement)
-            .pipe(debounceTime(10), takeUntilDestroyed(this._destroyRef))
+        this._resizeObserverService
+            .observe(this._shellbar.nativeElement)
+            .pipe(takeUntilDestroyed(this._destroyRef))
             .subscribe(() => this._setCurrentBreakpoint());
+        requestAnimationFrame(() => this._setCurrentBreakpoint());
         this._setSearchComponentListeners();
     }
     /** @hidden */
@@ -694,6 +875,41 @@ class ShellbarComponent {
         return retVal;
     }
     /** @hidden */
+    _getShellbarEnd() {
+        const shellbarEl = this._shellbar.nativeElement;
+        const end = this._rtl$() ? shellbarEl.getBoundingClientRect().left : shellbarEl.getBoundingClientRect().right;
+        let shellbarPadding = parseInt(window.getComputedStyle(shellbarEl).paddingInline, 10);
+        if (this._rtl$()) {
+            shellbarPadding = shellbarPadding * -1;
+        }
+        return end - shellbarPadding;
+    }
+    /** @hidden */
+    _getActionsEnd() {
+        const end = this._rtl$()
+            ? this._actions?._elRef.nativeElement.getBoundingClientRect().left
+            : this._actions?._elRef.nativeElement.getBoundingClientRect().right;
+        return end;
+    }
+    /** @hidden */
+    _actionsExceedShellbarWidth() {
+        return this._rtl$()
+            ? this._getActionsEnd() < this._getShellbarEnd()
+            : this._getActionsEnd() > this._getShellbarEnd();
+    }
+    /** @hidden */
+    _searchToggledFromActions() {
+        this._setCurrentBreakpoint();
+    }
+    /** @hidden */
+    _navigationClicked(event) {
+        this.navigationButtonClicked.emit(event);
+    }
+    /** @hidden */
+    _backClicked(event) {
+        this.backButtonClicked.emit(event);
+    }
+    /** @hidden */
     _setSearchComponentListeners() {
         this._actions?.searchOpen.pipe(takeUntilDestroyed(this._destroyRef)).subscribe((showSearch) => {
             this._showMobileSearch = showSearch;
@@ -717,7 +933,7 @@ class ShellbarComponent {
     }
     _placeSearch() {
         const size = this._currentSize$.value;
-        if (size === 'xl' || (size === 's' && this._showMobileSearch)) {
+        if ((size === 'xl' && !this.contextArea) || (size === 's' && this._showMobileSearch)) {
             this._attachSearch();
         }
         else {
@@ -727,17 +943,49 @@ class ShellbarComponent {
     /** @hidden */
     _setCurrentBreakpoint() {
         if (this._shellbar) {
-            const { width } = this._shellbar.nativeElement.getBoundingClientRect();
+            this._handleOverflow();
+            const width = this._shellbar.nativeElement.getBoundingClientRect().width;
             const breakpoint = this._breakpoints.find((item) => width >= item.min && width < item.max + 1);
-            if (!breakpoint || breakpoint.size === this._currentSize) {
-                return;
+            if (breakpoint && breakpoint.size !== this._currentSize) {
+                this._breakpointSize = breakpoint.size;
+                this._currentSize$.next(this._currentSize);
             }
-            this._breakpointSize = breakpoint.size;
-            this._currentSize$.next(this._currentSize);
             this._cd.detectChanges();
         }
     }
     /** @hidden */
+    _handleOverflow() {
+        if (this._shellbar) {
+            this._resetOverflow();
+            if (this._actions) {
+                if (this._actionsExceedShellbarWidth()) {
+                    this._actions._handleOverflow(true);
+                }
+                if (this.branding) {
+                    this.branding.hideTitleIfNeeded();
+                }
+                if (this.contextArea) {
+                    this.contextArea.hideElementsIfNeeded();
+                }
+                if (this._showMobileSearch && this._actionsExceedShellbarWidth()) {
+                    this._closeMobileSearch();
+                }
+            }
+        }
+    }
+    /** @hidden */
+    _resetOverflow() {
+        if (this.contextArea) {
+            this.contextArea.showElements();
+        }
+        if (this.branding) {
+            this.branding.showTitle();
+        }
+        if (this._actions) {
+            this._actions._handleOverflow(false);
+        }
+    }
+    /** @hidden */
     _normalizeBreakpoints(breakpoints) {
         const keys = Object.keys(breakpoints);
         const normalizedBreakpoints = [];
@@ -772,7 +1020,7 @@ class ShellbarComponent {
         this._actions?._attachSearch(this._searchPortal, this._searchComponent, this._currentSize);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarComponent, isStandalone: true, selector: "fd-shellbar", inputs: { size: "size", breakpoints: "breakpoints", sideNav: "sideNav", groupFlex: "groupFlex" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: ShellbarComponent, isStandalone: true, selector: "fd-shellbar", inputs: { size: "size", breakpoints: "breakpoints", sideNav: "sideNav", groupFlex: "groupFlex", showNavigationButton: "showNavigationButton", showBackButton: "showBackButton" }, outputs: { navigationButtonClicked: "navigationButtonClicked", backButtonClicked: "backButtonClicked" }, providers: [
             contentDensityObserverProviders({
                 supportedContentDensity: [ContentDensityMode.COZY],
                 restrictChildContentDensity: true
@@ -781,7 +1029,7 @@ class ShellbarComponent {
                 provide: FD_SHELLBAR_COMPONENT,
                 useExisting: ShellbarComponent
             }
-        ], queries: [{ propertyName: "comboboxComponent", first: true, predicate: FD_COMBOBOX_COMPONENT, descendants: true }, { propertyName: "searchComponent", first: true, predicate: FD_SHELLBAR_SEARCH_COMPONENT, descendants: true }, { propertyName: "_actions", first: true, predicate: ShellbarActionsComponent, descendants: true }, { propertyName: "buttons", predicate: FD_BUTTON_COMPONENT, read: ElementRef }], viewQueries: [{ propertyName: "_searchPortalOutlet", first: true, predicate: ["searchPortalOutlet"], descendants: true, read: CdkPortalOutlet }, { propertyName: "_shellbar", first: true, predicate: ["shellbar"], descendants: true }], ngImport: i0, template: "<div\n    class=\"fd-shellbar\"\n    [class]=\"'fd-shellbar--' + _currentSize + _getSideNavClass()\"\n    [class.fd-shellbar--side-nav]=\"sideNav === true\"\n    #shellbar\n>\n    @if (!_hideAllComponents) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--product\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.product?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.product?.flexBasisAuto\"\n        >\n            <ng-content select=\"[fd-shellbar-side-nav]\"></ng-content>\n            <ng-content select=\"fd-shellbar-logo\"></ng-content>\n            @if (!_hideTitleComponents) {\n                <ng-content select=\"fd-shellbar-title\"></ng-content>\n                <div class=\"fd-shellbar__product\">\n                    <ng-content select=\"fd-product-menu\"></ng-content>\n                </div>\n                <ng-content select=\"fd-shellbar-subtitle\"></ng-content>\n            }\n        </div>\n    }\n    <div hidden>\n        <ng-content></ng-content>\n    </div>\n    @if (searchComponent) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--center fd-shellbar__group--mobile-flex\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.search?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.search?.flexBasisAuto\"\n        >\n            <div class=\"fd-shellbar__action fd-shellbar__action--grow\">\n                <ng-container cdkPortalOutlet #searchPortalOutlet></ng-container>\n            </div>\n            @if (_currentSize === 'xl' || _hideAllComponents) {\n                <div class=\"fd-shellbar__action fd-shellbar__action--mobile fd-shellbar__action--shrink\">\n                    <button class=\"fd-button fd-button--transparent\" (click)=\"_closeMobileSearch()\">\n                        {{ 'coreShellbar.cancel' | fdTranslate }}\n                    </button>\n                </div>\n            }\n        </div>\n    }\n    @if (!_hideAllComponents) {\n        <ng-content select=\"fd-shellbar-actions\"></ng-content>\n    }\n</div>\n", styles: [".fd-shellbar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;background-color:var(--sapShellColor);-webkit-box-shadow:var(--fdShellbar_Shadow);box-shadow:var(--fdShellbar_Shadow);color:var(--sapShell_TextColor);height:var(--fdShellbar_Height);justify-content:space-between;padding-block:0;padding-inline:1rem;position:relative}.fd-shellbar:after,.fd-shellbar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex:1 1 0px;flex:1 1 0;gap:.5rem}.fd-shellbar__group:after,.fd-shellbar__group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__group--shrink{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.fd-shellbar__group--basis-auto{-ms-flex-preferred-size:auto;flex-basis:auto}.fd-shellbar__group--product{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.fd-shellbar__group--center,.fd-shellbar__group--copilot{-webkit-box-ordinal-group:3;-ms-flex-order:2;display:none;order:2;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-block:0;margin-inline:.5rem}.fd-shellbar__group--center .fd-shellbar__action,.fd-shellbar__group--copilot .fd-shellbar__action{width:100%}@media (width >= 1440px){.fd-shellbar__group--center,.fd-shellbar__group--copilot{display:inline-block}}.fd-shellbar__group--actions{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.fd-shellbar__subtitle,.fd-shellbar__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapShell_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-shellbar__subtitle:after,.fd-shellbar__subtitle:before,.fd-shellbar__title:after,.fd-shellbar__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo,.fd-shellbar__product,.fd-shellbar__subtitle{display:inline-block;vertical-align:middle}.fd-shellbar__logo,.fd-shellbar__title{position:relative}.fd-shellbar__logo.is-focus,.fd-shellbar__logo:focus,.fd-shellbar__title.is-focus,.fd-shellbar__title:focus{outline:none;pointer-events:all}.fd-shellbar__logo.is-focus:before,.fd-shellbar__logo:focus:before,.fd-shellbar__title.is-focus:before,.fd-shellbar__title:focus:before{border:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdShellbar_Button_Outline_Color);border-radius:calc(var(--sapButton_BorderCornerRadius) - .125rem);content:\"\";display:block;inset:-.25rem;pointer-events:none;position:absolute}.fd-shellbar__title{font-weight:700;vertical-align:middle}.fd-shellbar__subtitle{font-size:var(--sapFontSmallSize)}.fd-shellbar__logo{background-repeat:no-repeat;background-size:contain;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:2rem;padding-block:0;padding-inline:0}.fd-shellbar__logo:after,.fd-shellbar__logo:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo>*{display:block;line-height:0;max-height:2.5rem;width:auto}.fd-shellbar__logo--image-replaced{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0iTGF5ZXIgMSIgdmlld0JveD0iMCAwIDQxMi4zOCAyMDQiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjIwNi4xOSIgeDI9IjIwNi4xOSIgeTI9IjIwNCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzAwYjhmMSIvPjxzdG9wIG9mZnNldD0iLjAyIiBzdG9wLWNvbG9yPSIjMDFiNmYwIi8+PHN0b3Agb2Zmc2V0PSIuMzEiIHN0b3AtY29sb3I9IiMwZDkwZDkiLz48c3RvcCBvZmZzZXQ9Ii41OCIgc3RvcC1jb2xvcj0iIzE3NzVjOCIvPjxzdG9wIG9mZnNldD0iLjgyIiBzdG9wLWNvbG9yPSIjMWM2NWJmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMWU1ZmJiIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHRpdGxlPlNBUF9ncmFkX1Jfc2Nybl9aZWljaGVuZmzDpGNoZSAxPC90aXRsZT48cGF0aCBkPSJNMCAyMDRoMjA4LjQxTDQxMi4zOCAwSDB6IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDp1cmwoI2EpIi8+PHBhdGggZD0iTTI0NC43MyAzOC4zNmgtNDAuNnY5Ni41MmwtMzUuNDYtOTYuNTVoLTM1LjE2bC0zMC4yNyA4MC43MkMxMDAgOTguNyA3OSA5MS42NyA2Mi40IDg2LjQgNTEuNDYgODIuODkgMzkuODUgNzcuNzIgNDAgNzJjLjA5LTQuNjggNi4yMy05IDE4LjM4LTguMzggOC4xNy40MyAxNS4zNyAxLjA5IDI5LjcxIDhsMTQuMS0yNC41NUM4OS4wNiA0MC40MiA3MSAzNi4yMSA1Ni4xNyAzNi4xOWgtLjA5Yy0xNy4yOCAwLTMxLjY4IDUuNi00MC42IDE0LjgzQTM0LjIzIDM0LjIzIDAgMCAwIDUuNzcgNzQuN0M1LjU0IDg3LjE1IDEwLjExIDk2IDE5LjcxIDEwM2M4LjEgNS45NCAxOC40NiA5Ljc5IDI3LjYgMTIuNjIgMTEuMjcgMy40OSAyMC40NyA2LjUzIDIwLjM2IDEzQTkuNTcgOS41NyAwIDAgMSA2NSAxMzVjLTIuODEgMi45LTcuMTMgNC0xMy4wOSA0LjEtMTEuNDkuMjQtMjAtMS41Ni0zMy42MS05LjU5TDUuNzcgMTU0LjQyYTkzLjc3IDkzLjc3IDAgMCAwIDQ2IDEyLjIyaDIuMTFjMTQuMjQtLjI1IDI1Ljc0LTQuMzEgMzQuOTItMTEuNzEuNTMtLjQxIDEtLjg0IDEuNDktMS4yOGwtNC4xMiAxMC44NUgxMjNsNi4xOS0xOC44MmE2Ny41IDY3LjUgMCAwIDAgMjEuNjggMy40MyA2OC4zIDY4LjMgMCAwIDAgMjEuMTYtMy4yNWw2IDE4LjY0aDYwLjE0di0zOWgxMy4xMWMzMS43MSAwIDUwLjQ2LTE2LjE1IDUwLjQ2LTQzLjIgMC0zMC4xMS0xOC4yMi00My45NC01Ny4wMS00My45NE0xNTAuOTEgMTIxYTM2LjkgMzYuOSAwIDAgMS0xMy0yLjI4bDEyLjg3LTQwLjU5aC4yMmwxMi42NSA0MC43MWEzOC41IDM4LjUgMCAwIDEtMTIuNzQgMi4xNm05Ni4yLTIzLjMzaC04Ljk0VjY0LjkxaDguOTRjMTEuOTMgMCAyMS40NCA0IDIxLjQ0IDE2LjE0IDAgMTIuNi05LjUxIDE2LjU3LTIxLjQ0IDE2LjU3IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZmZmIi8+PC9zdmc+);height:1.5rem;width:3rem}.fd-shellbar .fd-shellbar__group{--fdShellbar_Button_Active_Background:var(--sapShell_Active_Background);--fdShellbar_Button_Active_Color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__action{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__action:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__action:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-shellbar__group .fd-shellbar__action>*{vertical-align:middle}.fd-shellbar .fd-shellbar__group .fd-shellbar__action--grow{-webkit-box-flex:1;-ms-flex:1;flex:1}.fd-shellbar .fd-shellbar__group .fd-shellbar__action--shrink{-webkit-box-flex:0;-ms-flex:0;flex:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field{--fdSelect_Text_Content_Color:var(--fdShellbar_Select_Content_Color);--fdInputGroup_Input_Border:var(--fdShellbar_Input_Border);--fdInputGroup_Input_Color:var(--fdShellbar_Input_Color);--fdInputGroup_Input_Placeholder_Color:var(--fdShellbar_Input_Placeholder_Color);--fdInputGroup_Input_Placeholder_Style:var(--fdShellbar_Input_Placeholder_Style);--fdInputGroup_Background:none;--fdInputGroup_Background_Color:var(--fdShellbar_Input_Background);--fdInputGroup_Hover_Background:none;--fdInput_Group_Button_Box_Shadow:none;--fdInput_Box_Shadow_Hover:none;border:var(--fdShellbar_Search_Border);border-radius:var(--fdShellbar_Input_Border_Radius);-webkit-box-shadow:none;box-shadow:none;cursor:text;position:relative}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper{display:var(--fdShellbar_Helper_Display)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper:before{border-radius:var(--fdShellbar_Input_Border_Radius);-webkit-box-shadow:var(--sapField_Shadow);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute;z-index:20}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper:after{border-radius:0;-webkit-box-shadow:var(--fdShellbar_Helper_Bottom_Shadow);box-shadow:var(--fdShellbar_Helper_Bottom_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input{padding-inline:var(--fdShellbar_Search_Input_X_Padding);position:relative}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:hover{--fdInputGroup_Hover_Input_Background:var(--fdShellbar_Input_Hover_Background);--fdInputGroup_Addon_Background:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-hover~.fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:hover~.fd-shellbar__search-field-addon{--fdInputGroup_Addon_Background:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-hover~.fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:hover~.fd-shellbar__search-field-helper:after{-webkit-box-shadow:inset 0 -.0625rem 0 var(--sapField_Hover_BorderColor);box-shadow:inset 0 -.0625rem 0 var(--sapField_Hover_BorderColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:focus{z-index:5;--fdInputGroup_Input_Color:var(--fdShellbar_Input_Focus_Color);--fdInputGroup_Input_Background:var(--fdShellbar_Input_Focus_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:-moz-placeholder-shown~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:-ms-input-placeholder~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:placeholder-shown~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-moz-placeholder-shown)~.fd-shellbar__search-submit>*{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Background);--fdButtonColor:var(--fdShellbar_Search_Active_Button_Color);--fdButtonIconColor:var(--fdShellbar_Search_Active_Button_Color);--fdShellbar_Button_Active_Background:var(--fdButtonBackgroundColor);--fdShellbar_Button_Active_Color:var(--fdShellbar_Search_Active_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>*{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Background);--fdButtonColor:var(--fdShellbar_Search_Active_Button_Color);--fdButtonIconColor:var(--fdShellbar_Search_Active_Button_Color);--fdShellbar_Button_Active_Background:var(--fdButtonBackgroundColor);--fdShellbar_Button_Active_Color:var(--fdShellbar_Search_Active_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:placeholder-shown)~.fd-shellbar__search-submit>*{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Background);--fdButtonColor:var(--fdShellbar_Search_Active_Button_Color);--fdButtonIconColor:var(--fdShellbar_Search_Active_Button_Color);--fdShellbar_Button_Active_Background:var(--fdButtonBackgroundColor);--fdShellbar_Button_Active_Color:var(--fdShellbar_Search_Active_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-moz-placeholder-shown)~.fd-shellbar__search-submit>:hover{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>:hover{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:placeholder-shown)~.fd-shellbar__search-submit>:hover{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input--select{font-style:normal}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input--select{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-box-flex:0;-ms-flex:0 1;flex:0 1}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button{--fdButton_Outline_Offset:0;--fdButton_Focus_Border_Radius:var(--fdShellbar_Input_Border_Radius);border-radius:var(--fdShellbar_Input_Border_Radius);border-width:var(--fdShellbar_Input_Addon_Border_Width);height:var(--fdShellbar_Input_Addon_Dimension);min-width:var(--fdShellbar_Input_Addon_Dimension)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:hover{border-left:var(--fdShellbar_Button_Left_Border);--fdButtonBackgroundColor:var(--fdShellbar_Search_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-hover[dir=rtl],.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:hover[dir=rtl],[dir=rtl] .fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-hover,[dir=rtl] .fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:hover{border-left-style:none;border-right:var(--fdShellbar_Button_Left_Border)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-active,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:active{border-color:var(--fdShellbar_Button_Active_Border_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category{-ms-flex-negative:0;flex-shrink:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover{--fdInputGroup_Addon_Background:var(--fdShellbar_Input_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover~.fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover~.fd-shellbar__search-field-input,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover~.fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover~.fd-shellbar__search-field-input{--fdInputGroup_Addon_Background:var(--fdShellbar_Input_Background);--fdInputGroup_Input_Background:var(--fdShellbar_Input_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover .fd-shellbar__search-category,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover .fd-shellbar__search-category{background-color:var(--fdShellbar_Search_Category_Button_Hover_Background);-webkit-box-shadow:var(--sapContent_Interaction_Shadow);box-shadow:var(--sapContent_Interaction_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover .fd-shellbar__search-dropdown{background-color:transparent}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category>*{-webkit-margin-end:var(--fdShellbar_Search_Category_Offset_Right);margin-block:0;margin-inline-end:var(--fdShellbar_Search_Category_Offset_Right)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown{background-color:var(--fdShellbar_Input_Background);outline:none;position:static;--fdInput_Group_Button_Background:transparent;--fdInput_Group_Button_Text_Color:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:focus{z-index:5}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-focus:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:focus:after{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category{--fdSelect_Background:transparent;--fdSelect_Hover_Background:transparent;--fdSelect_Focus_Background:transparent;--fdSelect_Background_Color:var(--fdShellbar_Input_Background);--fdSelect_Hover_Background_Color:var(--fdShellbar_Input_Background);border:var(--fdShellbar_Search_Category_Border);border-radius:0;border-width:var(--fdShellbar_Search_Category_Border_width);height:var(--fdShellbar_Input_Addon_Dimension);margin-block:0;margin-inline:0;min-height:var(--fdShellbar_Input_Addon_Dimension);position:relative;-webkit-margin-start:var(--fdShellbar_Search_Category_Offset_Left);margin-inline-start:var(--fdShellbar_Search_Category_Offset_Left)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:after{-webkit-box-shadow:none;box-shadow:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:before{background:var(--sapShell_InteractiveBorderColor);bottom:0;content:\"\";display:var(--fdShellbar_Search_Separator_Display);position:absolute;right:0;top:0;width:.0625rem}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category[dir=rtl]:before,[dir=rtl] .fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:before{left:0;right:auto}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:focus{z-index:5;--fdSelect_Text_Content_Color:var(--sapButton_Active_TextColor);--fdShellbar_Input_Background:var(--fdShellbar_Search_Category_Button_Hover_Background);--fdSelect_Focus_Background:var(--fdShellbar_Search_Container_Hover_Background);border-radius:var(--fdShellbar_Input_Border_Radius);outline-color:var(--sapButton_Lite_Active_BorderColor);outline-offset:-.0625rem;outline-width:.0625rem}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-focus .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:focus .fd-shellbar__search-dropdown{--fdInput_Group_Button_Text_Color:var(--sapButton_Active_TextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-focus:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:focus:before{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover{--fdInputGroup_Hover_Background_Color:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-helper:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-helper:before{-webkit-box-shadow:var(--sapField_Hover_Shadow);box-shadow:var(--sapField_Hover_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-helper:after{-webkit-box-shadow:var(--fdShellbar_Hover_Helper_Bottom_Shadow);box-shadow:var(--fdShellbar_Hover_Helper_Bottom_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category{--fdSelect_Background_Color:var(--fdShellbar_Search_Container_Hover_Background);--fdSelect_Hover_Background_Color:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover{border-radius:var(--fdShellbar_Input_Border_Radius)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover:before{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category:not(:hover) .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category:not(:hover) .fd-shellbar__search-dropdown{background-color:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus{background-color:var(--fdShellbar_Active_Background);-webkit-box-shadow:var(--fdShellbar_Active_Shadow);box-shadow:var(--fdShellbar_Active_Shadow);outline:none;z-index:5}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-helper:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-helper:before{outline:var(--fdShellbar_Search_Active_Outline);outline-offset:-.125rem}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-helper:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-helper:before{-webkit-box-shadow:none;box-shadow:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-addon{--fdInputGroup_Addon_Background:var(--fdShellbar_Search_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-category,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-category{background-color:var(--fdShellbar_Search_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-category .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-category .fd-shellbar__search-dropdown{background-color:var(--fdShellbar_Search_Hover_Category_Button_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button{border:solid var(--sapButton_BorderWidth) var(--fdButtonBorderColor);outline-color:var(--fdShellbar_Button_Outline_Color);--fdButtonBackgroundColor:var(--sapButton_Lite_Background);--fdButtonBorderColor:var(--sapButton_Lite_BorderColor);--fdButtonColor:var(--fdShellbar_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_InteractiveTextColor))}.fd-shellbar .fd-shellbar__group .fd-shellbar__button .fd-shellbar__title{color:inherit}.fd-shellbar .fd-shellbar__group .fd-shellbar__button:not(.fd-shellbar .fd-shellbar__group .fd-shellbar__button--menu){padding-block:0;padding-inline:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover{--fdButtonBorderColor:var(--fdShellbar_Button_Hover_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_Input_Hover_Background);--fdButtonIconColor:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover.is-disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover:disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover[aria-disabled=true],.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover.is-disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover:disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover[aria-disabled=true]{--fdButtonBackgroundColor:$fd-shellbar-background}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-active,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:active{--fdButtonBorderColor:var(--fdShellbar_Button_Active_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_Button_Active_Background);--fdButtonColor:var(--fdShellbar_Button_Active_Color);--fdButtonIconColor:var(--fdShellbar_Button_Active_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-active:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:active:after{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__button--menu .fd-shellbar__title{margin-block:0;margin-inline:0}.fd-shellbar--s,.fd-shellbar--sm{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--s .fd-shellbar__subtitle,.fd-shellbar--s .fd-shellbar__title,.fd-shellbar--sm .fd-shellbar__subtitle,.fd-shellbar--sm .fd-shellbar__title{display:none}.fd-shellbar--s .fd-shellbar__group--mobile-flex,.fd-shellbar--sm .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--s .fd-shellbar__action--mobile,.fd-shellbar--sm .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--s .fd-shellbar__action--desktop,.fd-shellbar--sm .fd-shellbar__action--desktop{display:none}.fd-shellbar--s .fd-shellbar__action-combobox--mobile,.fd-shellbar--sm .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--s .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--s .fd-shellbar__button--menu[class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}.fd-shellbar--l,.fd-shellbar--lg,.fd-shellbar--m,.fd-shellbar--md{padding-block:0;padding-inline:2rem}.fd-shellbar--l .fd-shellbar__subtitle,.fd-shellbar--l .fd-shellbar__title,.fd-shellbar--lg .fd-shellbar__subtitle,.fd-shellbar--lg .fd-shellbar__title,.fd-shellbar--m .fd-shellbar__subtitle,.fd-shellbar--m .fd-shellbar__title,.fd-shellbar--md .fd-shellbar__subtitle,.fd-shellbar--md .fd-shellbar__title,.fd-shellbar--xl .fd-shellbar__subtitle,.fd-shellbar--xl .fd-shellbar__title{display:inline-block}.fd-shellbar--l .fd-shellbar__action--mobile,.fd-shellbar--lg .fd-shellbar__action--mobile,.fd-shellbar--m .fd-shellbar__action--mobile,.fd-shellbar--md .fd-shellbar__action--mobile,.fd-shellbar--xl .fd-shellbar__action--mobile{display:none}.fd-shellbar--l .fd-shellbar__action--desktop,.fd-shellbar--lg .fd-shellbar__action--desktop,.fd-shellbar--m .fd-shellbar__action--desktop,.fd-shellbar--md .fd-shellbar__action--desktop,.fd-shellbar--xl .fd-shellbar__action--desktop{display:inline-block}.fd-shellbar--xl{padding-block:0;padding-inline:3rem}.fd-shellbar--side-nav.fd-shellbar--l,.fd-shellbar--side-nav.fd-shellbar--lg,.fd-shellbar--side-nav.fd-shellbar--m,.fd-shellbar--side-nav.fd-shellbar--md,.fd-shellbar--side-nav.fd-shellbar--s,.fd-shellbar--side-nav.fd-shellbar--sm,.fd-shellbar--side-nav.fd-shellbar--xl{padding-block:0;padding-inline:0}@media (width <= 599px){.fd-shellbar--responsive-paddings{padding-inline:1rem}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1440px){.fd-shellbar--responsive-paddings{padding-inline:3rem}}@media (width <= 599px){.fd-shellbar--responsive-paddings{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--responsive-paddings .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--responsive-paddings .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1440px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}.fd-shellbar--cx-side-nav{box-shadow:var(--sapContent_Shadow0);padding-left:.5rem;z-index:1}[dir=rtl] .fd-shellbar--cx-side-nav,.fd-shellbar--cx-side-nav[dir=rtl]{padding-left:2rem;padding-right:.5rem}fd-shellbar-actions .fd-shellbar__search-field{min-width:15rem}.fd-shellbar__action.fd-shellbar__action--desktop:empty{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor: var(--sapShell_TextColor)}\n/*! Bundled license information:\n\nfundamental-styles/dist/shellbar.css:\n  (*!\n   * Fundamental Library Styles v0.38.0\n   * Copyright (c) 2024 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], queries: [{ propertyName: "comboboxComponent", first: true, predicate: FD_COMBOBOX_COMPONENT, descendants: true }, { propertyName: "contextArea", first: true, predicate: ShellbarContextAreaComponent, descendants: true }, { propertyName: "branding", first: true, predicate: ShellbarBrandingComponent, descendants: true }, { propertyName: "_actions", first: true, predicate: ShellbarActionsComponent, descendants: true }, { propertyName: "searchComponent", first: true, predicate: FD_SHELLBAR_SEARCH_COMPONENT, descendants: true }, { propertyName: "buttons", predicate: FD_BUTTON_COMPONENT, read: ElementRef }], viewQueries: [{ propertyName: "_searchPortalOutlet", first: true, predicate: ["searchPortalOutlet"], descendants: true, read: CdkPortalOutlet }, { propertyName: "_shellbar", first: true, predicate: ["shellbar"], descendants: true }], ngImport: i0, template: "<div\n    class=\"fd-shellbar\"\n    [class]=\"'fd-shellbar--' + _currentSize + _getSideNavClass()\"\n    [class.fd-shellbar--side-nav]=\"sideNav === true\"\n    [class.fd-shellbar--has-context-area]=\"!!contextArea\"\n    #shellbar\n>\n    @if (!_hideAllComponents) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--product\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.product?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.product?.flexBasisAuto\"\n        >\n            @if (showNavigationButton && !_showMobileSearch) {\n                <button\n                    class=\"fd-shellbar__action\"\n                    fd-button\n                    fdType=\"transparent\"\n                    glyph=\"menu2\"\n                    (fdkClicked)=\"_navigationClicked($event)\"\n                ></button>\n            }\n            @if (showBackButton && !_showMobileSearch) {\n                <button\n                    class=\"fd-shellbar__action\"\n                    fd-button\n                    fdType=\"transparent\"\n                    [glyph]=\"_rtl$() ? 'slim-arrow-right' : 'nav-back'\"\n                    (fdkClicked)=\"_backClicked($event)\"\n                ></button>\n            }\n            <ng-content select=\"fd-shellbar-branding\"></ng-content>\n            <ng-content select=\"[fd-shellbar-side-nav]\"></ng-content>\n            <ng-content select=\"fd-shellbar-logo\"></ng-content>\n            @if (!_hideTitleComponents) {\n                <ng-content select=\"fd-shellbar-title\"></ng-content>\n                <ng-content select=\"fd-product-menu\"></ng-content>\n                <ng-content select=\"fd-shellbar-subtitle\"></ng-content>\n                <ng-content select=\"fd-shellbar-separator\"></ng-content>\n            }\n        </div>\n        <ng-content select=\"fd-shellbar-context-area\"></ng-content>\n    }\n    <div hidden>\n        <ng-content></ng-content>\n    </div>\n    @if (searchComponent) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--center fd-shellbar__group--mobile-flex\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.search?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.search?.flexBasisAuto\"\n        >\n            <div class=\"fd-shellbar__action fd-shellbar__action--grow\">\n                <ng-container cdkPortalOutlet #searchPortalOutlet></ng-container>\n            </div>\n            @if (_hideAllComponents) {\n                <div class=\"fd-shellbar__action fd-shellbar__action--mobile fd-shellbar__action--shrink\">\n                    <button class=\"fd-button fd-button--transparent\" (click)=\"_closeMobileSearch()\">\n                        {{ 'coreShellbar.cancel' | fdTranslate }}\n                    </button>\n                </div>\n            }\n        </div>\n    }\n    @if (!_hideAllComponents) {\n        <ng-content select=\"fd-shellbar-actions\"></ng-content>\n    }\n</div>\n", styles: [".fd-shellbar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:1rem;-webkit-box-pack:justify;-ms-flex-pack:justify;background:var(--sapShellColor);border:0 inset var(--sapShell_BorderColor);-webkit-box-shadow:var(--sapShell_Shadow);box-shadow:var(--sapShell_Shadow);height:3.25rem;justify-content:space-between;padding-block:0;padding-inline:var(--fdShellbar_Inline_Padding,1rem)}.fd-shellbar:after,.fd-shellbar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__branding{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdShellBar_Branding_Background,var(--sapButton_Lite_Background));border:var(--sapButton_BorderWidth) solid var(--fdShellBar_Branding_Border_Color,var(--sapButton_Lite_BorderColor));border-radius:.375rem;cursor:var(--fdShellBar_Branding_Cursor,pointer);gap:.25rem;height:2.25rem;padding-block:.125rem;padding-inline:.25rem .5rem}.fd-shellbar__branding:after,.fd-shellbar__branding:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__branding.is-hover,.fd-shellbar__branding:hover{--fdShellBar_Branding_Background:var(--fdShellbar_Branding_Hover_Background);--fdShellBar_Branding_Border_Color:var(--fdShellbar_Branding_Hover_Border_Color)}.fd-shellbar__branding.is-active,.fd-shellbar__branding:active{--fdShellBar_Branding_Background:var(--fdShellbar_Branding_Active_Background);--fdShellBar_Branding_Border_Color:var(--fdShellbar_Branding_Active_Border_Color)}.fd-shellbar__branding.is-active.is-focus,.fd-shellbar__branding.is-active:focus,.fd-shellbar__branding:active.is-focus,.fd-shellbar__branding:active:focus{outline:none;z-index:5}.fd-shellbar__branding.is-focus,.fd-shellbar__branding:focus{outline:var(--sapContent_FocusStyle) var(--sapContent_FocusWidth) var(--fdShellbar_Button_Outline_Color);outline-offset:-.125rem;z-index:5}.fd-shellbar__branding--non-interactive{--fdShellBar_Branding_Cursor:auto}.fd-shellbar__branding--non-interactive.is-active,.fd-shellbar__branding--non-interactive.is-focus,.fd-shellbar__branding--non-interactive.is-hover,.fd-shellbar__branding--non-interactive:active,.fd-shellbar__branding--non-interactive:focus,.fd-shellbar__branding--non-interactive:hover{--fdShellBar_Branding_Background:var(--sapButton_Lite_Background);--fdShellBar_Branding_Border_Color:var(--sapButton_Lite_BorderColor)}.fd-shellbar__branding--non-interactive.is-focus,.fd-shellbar__branding--non-interactive:focus{outline:none;z-index:5}.fd-shellbar__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdShellbar_Title_Color);font-family:var(--sapFontFamily);font-family:var(--sapFontSemiboldFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader5Size);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-shellbar__title:after,.fd-shellbar__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdShellbar_Subtitle_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-shellbar__subtitle:after,.fd-shellbar__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__product{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-shellbar__product:after,.fd-shellbar__product:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo{background-repeat:no-repeat;background-size:contain;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;margin-inline:.25rem;max-height:2rem;padding-block:0;padding-inline:0;position:relative;vertical-align:middle}.fd-shellbar__logo:after,.fd-shellbar__logo:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo>*{display:block;line-height:0;max-height:2rem;width:auto}.fd-shellbar__logo--image-replaced{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0iTGF5ZXIgMSIgdmlld0JveD0iMCAwIDQxMi4zOCAyMDQiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjIwNi4xOSIgeDI9IjIwNi4xOSIgeTI9IjIwNCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzAwYjhmMSIvPjxzdG9wIG9mZnNldD0iLjAyIiBzdG9wLWNvbG9yPSIjMDFiNmYwIi8+PHN0b3Agb2Zmc2V0PSIuMzEiIHN0b3AtY29sb3I9IiMwZDkwZDkiLz48c3RvcCBvZmZzZXQ9Ii41OCIgc3RvcC1jb2xvcj0iIzE3NzVjOCIvPjxzdG9wIG9mZnNldD0iLjgyIiBzdG9wLWNvbG9yPSIjMWM2NWJmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMWU1ZmJiIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHRpdGxlPlNBUF9ncmFkX1Jfc2Nybl9aZWljaGVuZmzDpGNoZSAxPC90aXRsZT48cGF0aCBkPSJNMCAyMDRoMjA4LjQxTDQxMi4zOCAwSDB6IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDp1cmwoI2EpIi8+PHBhdGggZD0iTTI0NC43MyAzOC4zNmgtNDAuNnY5Ni41MmwtMzUuNDYtOTYuNTVoLTM1LjE2bC0zMC4yNyA4MC43MkMxMDAgOTguNyA3OSA5MS42NyA2Mi40IDg2LjQgNTEuNDYgODIuODkgMzkuODUgNzcuNzIgNDAgNzJjLjA5LTQuNjggNi4yMy05IDE4LjM4LTguMzggOC4xNy40MyAxNS4zNyAxLjA5IDI5LjcxIDhsMTQuMS0yNC41NUM4OS4wNiA0MC40MiA3MSAzNi4yMSA1Ni4xNyAzNi4xOWgtLjA5Yy0xNy4yOCAwLTMxLjY4IDUuNi00MC42IDE0LjgzQTM0LjIzIDM0LjIzIDAgMCAwIDUuNzcgNzQuN0M1LjU0IDg3LjE1IDEwLjExIDk2IDE5LjcxIDEwM2M4LjEgNS45NCAxOC40NiA5Ljc5IDI3LjYgMTIuNjIgMTEuMjcgMy40OSAyMC40NyA2LjUzIDIwLjM2IDEzQTkuNTcgOS41NyAwIDAgMSA2NSAxMzVjLTIuODEgMi45LTcuMTMgNC0xMy4wOSA0LjEtMTEuNDkuMjQtMjAtMS41Ni0zMy42MS05LjU5TDUuNzcgMTU0LjQyYTkzLjc3IDkzLjc3IDAgMCAwIDQ2IDEyLjIyaDIuMTFjMTQuMjQtLjI1IDI1Ljc0LTQuMzEgMzQuOTItMTEuNzEuNTMtLjQxIDEtLjg0IDEuNDktMS4yOGwtNC4xMiAxMC44NUgxMjNsNi4xOS0xOC44MmE2Ny41IDY3LjUgMCAwIDAgMjEuNjggMy40MyA2OC4zIDY4LjMgMCAwIDAgMjEuMTYtMy4yNWw2IDE4LjY0aDYwLjE0di0zOWgxMy4xMWMzMS43MSAwIDUwLjQ2LTE2LjE1IDUwLjQ2LTQzLjIgMC0zMC4xMS0xOC4yMi00My45NC01Ny4wMS00My45NE0xNTAuOTEgMTIxYTM2LjkgMzYuOSAwIDAgMS0xMy0yLjI4bDEyLjg3LTQwLjU5aC4yMmwxMi42NSA0MC43MWEzOC41IDM4LjUgMCAwIDEtMTIuNzQgMi4xNm05Ni4yLTIzLjMzaC04Ljk0VjY0LjkxaDguOTRjMTEuOTMgMCAyMS40NCA0IDIxLjQ0IDE2LjE0IDAgMTIuNi05LjUxIDE2LjU3LTIxLjQ0IDE2LjU3IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZmZmIi8+PC9zdmc+);height:1.5rem;width:3rem}.fd-shellbar__separator{background-color:var(--sapToolbar_SeparatorColor);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:1rem;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;width:.0625rem}.fd-shellbar__separator:after,.fd-shellbar__separator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__spacer{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-flex:1;-ms-flex:1 auto;flex:1 auto}.fd-shellbar__spacer:after,.fd-shellbar__spacer:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-popover__control:focus-visible{outline:none}.fd-shellbar .fd-shellbar__button{--fdButtonBackgroundColor:var(--sapButton_Lite_Background);--fdButtonBorderColor:var(--sapButton_Lite_BorderColor);--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__button>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_InteractiveTextColor))}.fd-shellbar .fd-shellbar__button.fd-user-menu__control{padding-inline:0}.fd-shellbar .fd-shellbar__button.is-hover,.fd-shellbar .fd-shellbar__button:hover{--fdButtonBackgroundColor:var(--sapShell_Hover_Background);--fdButtonBorderColor:var(--fdShellbar_Button_Hover_Border_Color);--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__button.is-hover>[class*=sap-icon],.fd-shellbar .fd-shellbar__button:hover>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_InteractiveTextColor))}.fd-shellbar .fd-shellbar__button.is-active,.fd-shellbar .fd-shellbar__button:active{--fdButtonBackgroundColor:var(--sapShell_Active_Background);--fdButtonBorderColor:var(--fdShellbar_Button_Active_Border_Color);--fdButtonColor:var(--sapShell_Active_TextColor;)}.fd-shellbar .fd-shellbar__button.is-active>[class*=sap-icon],.fd-shellbar .fd-shellbar__button:active>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_Active_TextColor))}.fd-shellbar .fd-shellbar__button.is-toggled{--fdButtonBackgroundColor:var(--sapShell_Selected_Background);--fdButtonBorderColor:var(--fdShellbar_Button_Active_Border_Color);--fdButtonColor:var(--sapShell_Selected_TextColor;)}.fd-shellbar .fd-shellbar__button.is-toggled>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_Selected_TextColor))}.fd-shellbar .fd-shellbar__button.is-focus,.fd-shellbar .fd-shellbar__button:focus{z-index:5}.fd-shellbar .fd-shellbar__button.is-focus:after,.fd-shellbar .fd-shellbar__button:focus:after{border-color:var(--fdShellbar_Button_Outline_Color)}.fd-shellbar .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__button:has(.fd-shellbar__avatar--circle){border-radius:20rem;--fdButton_Height:fit-content;--fdButton_Clickable_Height:fit-content;--fdButton_Min_Width:fit-content;--fdButton_Focus_Border_Radius:20rem}.fd-shellbar .fd-shellbar__button--menu .fd-shellbar__title{margin-block:0;margin-inline:0}.fd-shellbar .fd-shellbar__action{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-shellbar .fd-shellbar__action:after,.fd-shellbar .fd-shellbar__action:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-shellbar__action>*{vertical-align:middle}.fd-shellbar .fd-shellbar__action--grow{-webkit-box-flex:1;-ms-flex:1;flex:1}.fd-shellbar .fd-shellbar__action--shrink{-webkit-box-flex:0;-ms-flex:0;flex:0}.fd-shellbar .fd-shellbar__action:has(.fd-product-switch){-webkit-margin-start:.5rem;margin-inline-start:.5rem}.fd-shellbar .fd-shellbar__search-field{background-color:var(--fdShellbar_SearchField_Background_Color,var(--sapShell_InteractiveBackground));border:none;border-radius:var(--fdShellbar_SearchField_Border_Radius);-webkit-box-shadow:var(--fdShellbar_SearchField_Box_Shadow,var(--fdShellbar_SearchField_Shadow));box-shadow:var(--fdShellbar_SearchField_Box_Shadow,var(--fdShellbar_SearchField_Shadow));max-width:25rem;min-width:25rem}.fd-shellbar .fd-shellbar__search-field:has(.fd-shellbar__search-field-category){max-width:36rem}.fd-shellbar .fd-shellbar__search-field.is-hover,.fd-shellbar .fd-shellbar__search-field:hover{--fdShellbar_SearchField_Box_Shadow:var(--sapField_Hover_Shadow);--fdShellbar_SearchField_Background_Color:var(--fdShellbar_SearchField_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field.is-focus,.fd-shellbar .fd-shellbar__search-field:focus{outline:none;z-index:5}.fd-shellbar .fd-shellbar__search-field.is-active,.fd-shellbar .fd-shellbar__search-field.is-focus,.fd-shellbar .fd-shellbar__search-field:active,.fd-shellbar .fd-shellbar__search-field:focus{--fdShellbar_SearchField_Background_Color:var(--fdShellbar_SearchField_Background_Color_Active)}.fd-shellbar .fd-shellbar__search-field:has(input:focus){--fdShellbar_SearchField_Background_Color:var(--fdShellbar_SearchField_Background_Color_Active);background:none;-webkit-box-shadow:var(--fdShellbar_Active_Shadow);box-shadow:var(--fdShellbar_Active_Shadow)}.fd-shellbar .fd-shellbar__search-field:has(button:hover){--fdShellbar_SearchField_Background_Color:var(--sapShell_InteractiveBackground)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input{border-radius:var(--fdShellbar_SearchField_Input_Border_Radius);padding-inline:var(--fdInputGroup_Input_Padding,.875rem .25rem);width:15rem;--fdInputGroup_Input_Color:var(--fdShellbar_SearchField_Input_Text_Color);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border);--fdInputGroup_Input_Background:var(--fdShellbar_SearchField_Input_Background_Regular)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:-moz-placeholder~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:-ms-input-placeholder~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:placeholder-shown~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::-webkit-input-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::-moz-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:-ms-input-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::-ms-input-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:hover{--fdInputGroup_Hover_Input_Background:var(--fdShellbar_SearchField_Input_Background_Hover);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border_Hover);border:var(--fdInputGroup_Input_Border)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-active,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:active{--fdInputGroup_Input_Background:var(--fdShellbar_SearchField_Input_Background_Active);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border_Active);--fdInputGroup_Input_Padding:var(--fdShellbar_SearchField_Input_Padding_Inline)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus{z-index:5;--fdInputGroup_Input_Background:var(--fdShellbar_SearchField_Input_Background_Focus);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border_Active);--fdInputGroup_Input_Padding:var(--fdShellbar_SearchField_Input_Padding_Inline);outline:var(--fdShellbar_SearchField_Input_Outline);outline-offset:var(--fdShellbar_SearchField_Input_Outline_Offset)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>*,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>*{--fdButtonColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonIconColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>*,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>*{--fdButtonColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonIconColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:placeholder-shown)~.fd-shellbar__search-submit>*,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:placeholder-shown)~.fd-shellbar__search-submit>*{--fdButtonColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonIconColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>:hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>:hover{--fdButtonColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonIconColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color_Hover);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>:hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>:hover{--fdButtonColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonIconColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color_Hover);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:placeholder-shown)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:placeholder-shown)~.fd-shellbar__search-submit>:hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:placeholder-shown)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:placeholder-shown)~.fd-shellbar__search-submit>:hover{--fdButtonColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonIconColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color_Hover);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon{margin-inline:var(--fdShellbar_SearchField_Addon_Margin_Inline);max-width:var(--fdShellbar_SearchField_Button_Width);min-width:var(--fdShellbar_SearchField_Button_Width);width:var(--fdShellbar_SearchField_Button_Width)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button{height:var(--fdShellbar_SearchField_Button_Height);max-height:var(--fdShellbar_SearchField_Button_Height);max-width:var(--fdShellbar_SearchField_Button_Width);min-height:var(--fdShellbar_SearchField_Button_Height);min-width:var(--fdShellbar_SearchField_Button_Width);width:var(--fdShellbar_SearchField_Button_Width);--fdButton_Focus_Border_Radius:var(--fdShellbar_SearchField_Button_Border_Radius);border-radius:var(--fdShellbar_SearchField_Button_Border_Radius)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button.is-focus,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button:focus{z-index:5}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button.is-focus:after,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button:focus:after{inset:var(--fdShellbar_SearchField_Button_Focus_Inset)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category{position:relative;-webkit-margin-end:var(--fdShell_Search_Field_Category_Margin_End);margin-inline-end:var(--fdShell_Search_Field_Category_Margin_End)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category:after{background-color:var(--sapShell_InteractiveBorderColor);content:\"\";display:var(--fdShell_Search_Field_Category_Divider_Display);height:1.5rem;position:absolute;right:-.5rem;width:.0625rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category[dir=rtl]:after,[dir=rtl] .fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category:after{left:-.5rem;right:auto}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select{-webkit-margin-start:.375rem;margin-inline-start:.375rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__control:after{-webkit-box-shadow:none;box-shadow:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__control.is-focus,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__control:focus{outline:none;z-index:5}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__text-content{color:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown{border-radius:var(--fdShell_Search_Dropdown_Button_Radius);color:var(--sapShell_InteractiveTextColor);height:var(--fdShell_Search_Dropdown_Height);max-width:2.125rem;min-width:2.125rem;width:2.125rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown>[class*=sap-icon]{max-width:1rem;min-width:1rem;width:1rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:hover{background-color:var(--sapShell_Hover_Background);-webkit-box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);color:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-active,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:active{color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category{background:none;border:var(--fdShell_Search_Category_Border);border-radius:var(--fdShell_Search_Dropdown_Border_Radius);gap:.25rem;height:var(--fdShell_Search_Dropdown_Height);margin-inline:0;max-width:18rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:hover{background-color:var(--fdShell_Search_Dropdown_Hover_Background);border:var(--fdShell_Search_Category_Border);-webkit-box-shadow:var(--sapField_Hover_Shadow);box-shadow:var(--sapField_Hover_Shadow)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-active,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:active{background-color:var(--fdShell_Search_Dropdown_Active_Background)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-active .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:active .fd-shellbar__search-dropdown{-webkit-box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-expanded,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category[aria-expanded=true]{background-color:var(--fdShell_Search_Dropdown_Active_Background);-webkit-box-shadow:var(--sapField_Hover_Shadow);box-shadow:var(--sapField_Hover_Shadow)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-expanded .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category[aria-expanded=true] .fd-shellbar__search-dropdown{background-color:var(--sapShell_Active_Background);-webkit-box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category--collapsed .fd-select__text-content{display:none}.fd-shellbar .fd-shellbar__group{--fdShellbar_Button_Active_Background:var(--sapShell_Active_Background);--fdShellbar_Button_Active_Color:var(--sapShell_Active_TextColor);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem}.fd-shellbar .fd-shellbar__group:after,.fd-shellbar .fd-shellbar__group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-shellbar__group--shrink{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.fd-shellbar .fd-shellbar__group--basis-auto{-ms-flex-preferred-size:auto;flex-basis:auto}.fd-shellbar .fd-shellbar__group--product{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-shellbar .fd-shellbar__group--center,.fd-shellbar .fd-shellbar__group--copilot{-webkit-box-ordinal-group:3;-ms-flex-order:2;display:none;order:2;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-block:0;margin-inline:.5rem}.fd-shellbar .fd-shellbar__group--center .fd-shellbar__action,.fd-shellbar .fd-shellbar__group--copilot .fd-shellbar__action{width:100%}@media (width >= 1440px){.fd-shellbar .fd-shellbar__group--center,.fd-shellbar .fd-shellbar__group--copilot{display:inline-block}}.fd-shellbar .fd-shellbar__group--context-area{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-ordinal-group:3;-ms-flex-order:2;gap:.5rem;order:2}.fd-shellbar .fd-shellbar__group--actions{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-ordinal-group:4;-ms-flex-order:3;gap:.5rem;order:3}.fd-shellbar .fd-shellbar__group--full-width{width:100%}.fd-shellbar .fd-shellbar__toolbar{padding-inline:0}.fd-shellbar--s,.fd-shellbar--sm{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--s .fd-shellbar__subtitle,.fd-shellbar--s .fd-shellbar__title,.fd-shellbar--sm .fd-shellbar__subtitle,.fd-shellbar--sm .fd-shellbar__title{display:none}.fd-shellbar--s .fd-shellbar__group--mobile-flex,.fd-shellbar--sm .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--s .fd-shellbar__action--mobile,.fd-shellbar--sm .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--s .fd-shellbar__action--desktop,.fd-shellbar--sm .fd-shellbar__action--desktop{display:none}.fd-shellbar--s .fd-shellbar__action:has(.fd-shellbar__search-field),.fd-shellbar--sm .fd-shellbar__action:has(.fd-shellbar__search-field){width:100%}.fd-shellbar--s .fd-shellbar__action-combobox--mobile,.fd-shellbar--sm .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--s .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--s .fd-shellbar__button--menu[class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}.fd-shellbar--s .fd-shellbar__search-field,.fd-shellbar--sm .fd-shellbar__search-field{width:100%}.fd-shellbar--l,.fd-shellbar--lg,.fd-shellbar--m,.fd-shellbar--md{padding-block:0;padding-inline:2rem}.fd-shellbar--l .fd-shellbar__subtitle,.fd-shellbar--l .fd-shellbar__title,.fd-shellbar--lg .fd-shellbar__subtitle,.fd-shellbar--lg .fd-shellbar__title,.fd-shellbar--m .fd-shellbar__subtitle,.fd-shellbar--m .fd-shellbar__title,.fd-shellbar--md .fd-shellbar__subtitle,.fd-shellbar--md .fd-shellbar__title,.fd-shellbar--xl .fd-shellbar__subtitle,.fd-shellbar--xl .fd-shellbar__title{display:inline-block}.fd-shellbar--l .fd-shellbar__action--mobile,.fd-shellbar--lg .fd-shellbar__action--mobile,.fd-shellbar--m .fd-shellbar__action--mobile,.fd-shellbar--md .fd-shellbar__action--mobile,.fd-shellbar--xl .fd-shellbar__action--mobile{display:none}.fd-shellbar--l .fd-shellbar__action--desktop,.fd-shellbar--lg .fd-shellbar__action--desktop,.fd-shellbar--m .fd-shellbar__action--desktop,.fd-shellbar--md .fd-shellbar__action--desktop,.fd-shellbar--xl .fd-shellbar__action--desktop{display:inline-block}.fd-shellbar--xl,.fd-shellbar--xxl{padding-block:0;padding-inline:3rem}.fd-shellbar--side-nav{--fdShellbar_Inline_Padding:.875rem 1rem}.fd-shellbar--side-nav.fd-shellbar--l,.fd-shellbar--side-nav.fd-shellbar--lg,.fd-shellbar--side-nav.fd-shellbar--m,.fd-shellbar--side-nav.fd-shellbar--md,.fd-shellbar--side-nav.fd-shellbar--s,.fd-shellbar--side-nav.fd-shellbar--sm,.fd-shellbar--side-nav.fd-shellbar--xl{padding-inline:.875rem 1rem}@media (width <= 599px){.fd-shellbar--responsive-paddings{padding-inline:1rem}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1440px){.fd-shellbar--responsive-paddings{padding-inline:3rem}}@media (width <= 599px){.fd-shellbar--responsive-paddings{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action:has(.fd-shellbar__search-field){width:100%}.fd-shellbar--responsive-paddings .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--responsive-paddings .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--responsive-paddings .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}.fd-shellbar--responsive-paddings .fd-shellbar__search-field{width:100%}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1440px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}.fd-shellbar-overlay{background:var(--sapBlockLayer_Background);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;left:0;line-height:normal;margin-block:0;margin-inline:0;opacity:.3;padding-block:0;padding-inline:0;position:absolute;right:0;top:0;width:100%}.fd-shellbar-overlay:after,.fd-shellbar-overlay:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar--cx-side-nav{box-shadow:var(--sapContent_Shadow0);padding-left:.5rem;z-index:1}[dir=rtl] .fd-shellbar--cx-side-nav,.fd-shellbar--cx-side-nav[dir=rtl]{padding-left:2rem;padding-right:.5rem}.fd-shellbar__action.fd-shellbar__action--desktop:empty{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor: var(--sapShell_TextColor)}.fd-shellbar{gap:.5rem}.fd-shellbar .fd-shellbar__search-field{min-width:auto}.fd-shellbar.fd-shellbar--has-context-area{justify-content:start}.fd-shellbar.fd-shellbar--has-context-area .fd-shellbar__group--actions{margin-right:0;margin-left:auto}[dir=rtl] .fd-shellbar.fd-shellbar--has-context-area .fd-shellbar__group--actions,.fd-shellbar.fd-shellbar--has-context-area .fd-shellbar__group--actions[dir=rtl]{margin-right:auto;margin-left:0}.fd-shellbar__title{vertical-align:middle}.fd-shellbar--s .fd-shellbar__branding,.fd-shellbar--m .fd-shellbar__branding{gap:0}.fd-shellbar--s .fd-shellbar__separator,.fd-shellbar--m .fd-shellbar__separator{display:none}.fd-shellbar .fd-shellbar__group--context-area{flex:none}.fd-shellbar .fd-shellbar__group--context-area .fd-object-status{white-space:nowrap;overflow:hidden}.fd-shellbar.fd-shellbar--s .fd-shellbar__group--actions{gap:.125rem}.fd-shellbar.fd-shellbar--s .fd-shellbar__search-field{max-width:12.5rem}.fd-shellbar:not(.fd-shellbar--xl) .fd-shellbar__search-field .fd-shellbar__search-field-input{width:auto}.fd-shellbar.fd-shellbar--m fd-shellbar-actions .fd-shellbar__search-field{max-width:15rem}.fd-shellbar.fd-shellbar--m fd-shellbar-actions .fd-shellbar__search-field .fd-shellbar__search-field-input{max-width:6rem}.fd-button.fd-shellbar__button.fd-shellbar__button--user-menu{padding:0!important}\n/*! Bundled license information:\n\nfundamental-styles/dist/shellbar.css:\n  (*!\n   * Fundamental Library Styles v0.39.2\n   * Copyright (c) 2025 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: ClickedDirective, selector: "[fdkClicked]", outputs: ["fdkClicked"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarComponent, decorators: [{
             type: Component,
@@ -794,7 +1042,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                             provide: FD_SHELLBAR_COMPONENT,
                             useExisting: ShellbarComponent
                         }
-                    ], imports: [PortalModule, FdTranslatePipe], template: "<div\n    class=\"fd-shellbar\"\n    [class]=\"'fd-shellbar--' + _currentSize + _getSideNavClass()\"\n    [class.fd-shellbar--side-nav]=\"sideNav === true\"\n    #shellbar\n>\n    @if (!_hideAllComponents) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--product\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.product?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.product?.flexBasisAuto\"\n        >\n            <ng-content select=\"[fd-shellbar-side-nav]\"></ng-content>\n            <ng-content select=\"fd-shellbar-logo\"></ng-content>\n            @if (!_hideTitleComponents) {\n                <ng-content select=\"fd-shellbar-title\"></ng-content>\n                <div class=\"fd-shellbar__product\">\n                    <ng-content select=\"fd-product-menu\"></ng-content>\n                </div>\n                <ng-content select=\"fd-shellbar-subtitle\"></ng-content>\n            }\n        </div>\n    }\n    <div hidden>\n        <ng-content></ng-content>\n    </div>\n    @if (searchComponent) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--center fd-shellbar__group--mobile-flex\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.search?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.search?.flexBasisAuto\"\n        >\n            <div class=\"fd-shellbar__action fd-shellbar__action--grow\">\n                <ng-container cdkPortalOutlet #searchPortalOutlet></ng-container>\n            </div>\n            @if (_currentSize === 'xl' || _hideAllComponents) {\n                <div class=\"fd-shellbar__action fd-shellbar__action--mobile fd-shellbar__action--shrink\">\n                    <button class=\"fd-button fd-button--transparent\" (click)=\"_closeMobileSearch()\">\n                        {{ 'coreShellbar.cancel' | fdTranslate }}\n                    </button>\n                </div>\n            }\n        </div>\n    }\n    @if (!_hideAllComponents) {\n        <ng-content select=\"fd-shellbar-actions\"></ng-content>\n    }\n</div>\n", styles: [".fd-shellbar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;background-color:var(--sapShellColor);-webkit-box-shadow:var(--fdShellbar_Shadow);box-shadow:var(--fdShellbar_Shadow);color:var(--sapShell_TextColor);height:var(--fdShellbar_Height);justify-content:space-between;padding-block:0;padding-inline:1rem;position:relative}.fd-shellbar:after,.fd-shellbar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex:1;-ms-flex:1 1 0px;flex:1 1 0;gap:.5rem}.fd-shellbar__group:after,.fd-shellbar__group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__group--shrink{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.fd-shellbar__group--basis-auto{-ms-flex-preferred-size:auto;flex-basis:auto}.fd-shellbar__group--product{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.fd-shellbar__group--center,.fd-shellbar__group--copilot{-webkit-box-ordinal-group:3;-ms-flex-order:2;display:none;order:2;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-block:0;margin-inline:.5rem}.fd-shellbar__group--center .fd-shellbar__action,.fd-shellbar__group--copilot .fd-shellbar__action{width:100%}@media (width >= 1440px){.fd-shellbar__group--center,.fd-shellbar__group--copilot{display:inline-block}}.fd-shellbar__group--actions{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3}.fd-shellbar__subtitle,.fd-shellbar__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapShell_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-shellbar__subtitle:after,.fd-shellbar__subtitle:before,.fd-shellbar__title:after,.fd-shellbar__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo,.fd-shellbar__product,.fd-shellbar__subtitle{display:inline-block;vertical-align:middle}.fd-shellbar__logo,.fd-shellbar__title{position:relative}.fd-shellbar__logo.is-focus,.fd-shellbar__logo:focus,.fd-shellbar__title.is-focus,.fd-shellbar__title:focus{outline:none;pointer-events:all}.fd-shellbar__logo.is-focus:before,.fd-shellbar__logo:focus:before,.fd-shellbar__title.is-focus:before,.fd-shellbar__title:focus:before{border:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--fdShellbar_Button_Outline_Color);border-radius:calc(var(--sapButton_BorderCornerRadius) - .125rem);content:\"\";display:block;inset:-.25rem;pointer-events:none;position:absolute}.fd-shellbar__title{font-weight:700;vertical-align:middle}.fd-shellbar__subtitle{font-size:var(--sapFontSmallSize)}.fd-shellbar__logo{background-repeat:no-repeat;background-size:contain;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;max-height:2rem;padding-block:0;padding-inline:0}.fd-shellbar__logo:after,.fd-shellbar__logo:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo>*{display:block;line-height:0;max-height:2.5rem;width:auto}.fd-shellbar__logo--image-replaced{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0iTGF5ZXIgMSIgdmlld0JveD0iMCAwIDQxMi4zOCAyMDQiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjIwNi4xOSIgeDI9IjIwNi4xOSIgeTI9IjIwNCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzAwYjhmMSIvPjxzdG9wIG9mZnNldD0iLjAyIiBzdG9wLWNvbG9yPSIjMDFiNmYwIi8+PHN0b3Agb2Zmc2V0PSIuMzEiIHN0b3AtY29sb3I9IiMwZDkwZDkiLz48c3RvcCBvZmZzZXQ9Ii41OCIgc3RvcC1jb2xvcj0iIzE3NzVjOCIvPjxzdG9wIG9mZnNldD0iLjgyIiBzdG9wLWNvbG9yPSIjMWM2NWJmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMWU1ZmJiIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHRpdGxlPlNBUF9ncmFkX1Jfc2Nybl9aZWljaGVuZmzDpGNoZSAxPC90aXRsZT48cGF0aCBkPSJNMCAyMDRoMjA4LjQxTDQxMi4zOCAwSDB6IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDp1cmwoI2EpIi8+PHBhdGggZD0iTTI0NC43MyAzOC4zNmgtNDAuNnY5Ni41MmwtMzUuNDYtOTYuNTVoLTM1LjE2bC0zMC4yNyA4MC43MkMxMDAgOTguNyA3OSA5MS42NyA2Mi40IDg2LjQgNTEuNDYgODIuODkgMzkuODUgNzcuNzIgNDAgNzJjLjA5LTQuNjggNi4yMy05IDE4LjM4LTguMzggOC4xNy40MyAxNS4zNyAxLjA5IDI5LjcxIDhsMTQuMS0yNC41NUM4OS4wNiA0MC40MiA3MSAzNi4yMSA1Ni4xNyAzNi4xOWgtLjA5Yy0xNy4yOCAwLTMxLjY4IDUuNi00MC42IDE0LjgzQTM0LjIzIDM0LjIzIDAgMCAwIDUuNzcgNzQuN0M1LjU0IDg3LjE1IDEwLjExIDk2IDE5LjcxIDEwM2M4LjEgNS45NCAxOC40NiA5Ljc5IDI3LjYgMTIuNjIgMTEuMjcgMy40OSAyMC40NyA2LjUzIDIwLjM2IDEzQTkuNTcgOS41NyAwIDAgMSA2NSAxMzVjLTIuODEgMi45LTcuMTMgNC0xMy4wOSA0LjEtMTEuNDkuMjQtMjAtMS41Ni0zMy42MS05LjU5TDUuNzcgMTU0LjQyYTkzLjc3IDkzLjc3IDAgMCAwIDQ2IDEyLjIyaDIuMTFjMTQuMjQtLjI1IDI1Ljc0LTQuMzEgMzQuOTItMTEuNzEuNTMtLjQxIDEtLjg0IDEuNDktMS4yOGwtNC4xMiAxMC44NUgxMjNsNi4xOS0xOC44MmE2Ny41IDY3LjUgMCAwIDAgMjEuNjggMy40MyA2OC4zIDY4LjMgMCAwIDAgMjEuMTYtMy4yNWw2IDE4LjY0aDYwLjE0di0zOWgxMy4xMWMzMS43MSAwIDUwLjQ2LTE2LjE1IDUwLjQ2LTQzLjIgMC0zMC4xMS0xOC4yMi00My45NC01Ny4wMS00My45NE0xNTAuOTEgMTIxYTM2LjkgMzYuOSAwIDAgMS0xMy0yLjI4bDEyLjg3LTQwLjU5aC4yMmwxMi42NSA0MC43MWEzOC41IDM4LjUgMCAwIDEtMTIuNzQgMi4xNm05Ni4yLTIzLjMzaC04Ljk0VjY0LjkxaDguOTRjMTEuOTMgMCAyMS40NCA0IDIxLjQ0IDE2LjE0IDAgMTIuNi05LjUxIDE2LjU3LTIxLjQ0IDE2LjU3IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZmZmIi8+PC9zdmc+);height:1.5rem;width:3rem}.fd-shellbar .fd-shellbar__group{--fdShellbar_Button_Active_Background:var(--sapShell_Active_Background);--fdShellbar_Button_Active_Color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__action{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__action:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__action:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-shellbar__group .fd-shellbar__action>*{vertical-align:middle}.fd-shellbar .fd-shellbar__group .fd-shellbar__action--grow{-webkit-box-flex:1;-ms-flex:1;flex:1}.fd-shellbar .fd-shellbar__group .fd-shellbar__action--shrink{-webkit-box-flex:0;-ms-flex:0;flex:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field{--fdSelect_Text_Content_Color:var(--fdShellbar_Select_Content_Color);--fdInputGroup_Input_Border:var(--fdShellbar_Input_Border);--fdInputGroup_Input_Color:var(--fdShellbar_Input_Color);--fdInputGroup_Input_Placeholder_Color:var(--fdShellbar_Input_Placeholder_Color);--fdInputGroup_Input_Placeholder_Style:var(--fdShellbar_Input_Placeholder_Style);--fdInputGroup_Background:none;--fdInputGroup_Background_Color:var(--fdShellbar_Input_Background);--fdInputGroup_Hover_Background:none;--fdInput_Group_Button_Box_Shadow:none;--fdInput_Box_Shadow_Hover:none;border:var(--fdShellbar_Search_Border);border-radius:var(--fdShellbar_Input_Border_Radius);-webkit-box-shadow:none;box-shadow:none;cursor:text;position:relative}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper{display:var(--fdShellbar_Helper_Display)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper:before{border-radius:var(--fdShellbar_Input_Border_Radius);-webkit-box-shadow:var(--sapField_Shadow);box-shadow:var(--sapField_Shadow);content:\"\";inset:0;pointer-events:none;position:absolute;z-index:20}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-helper:after{border-radius:0;-webkit-box-shadow:var(--fdShellbar_Helper_Bottom_Shadow);box-shadow:var(--fdShellbar_Helper_Bottom_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input{padding-inline:var(--fdShellbar_Search_Input_X_Padding);position:relative}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:hover{--fdInputGroup_Hover_Input_Background:var(--fdShellbar_Input_Hover_Background);--fdInputGroup_Addon_Background:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-hover~.fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:hover~.fd-shellbar__search-field-addon{--fdInputGroup_Addon_Background:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-hover~.fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:hover~.fd-shellbar__search-field-helper:after{-webkit-box-shadow:inset 0 -.0625rem 0 var(--sapField_Hover_BorderColor);box-shadow:inset 0 -.0625rem 0 var(--sapField_Hover_BorderColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:focus{z-index:5;--fdInputGroup_Input_Color:var(--fdShellbar_Input_Focus_Color);--fdInputGroup_Input_Background:var(--fdShellbar_Input_Focus_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:-moz-placeholder-shown~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:-ms-input-placeholder~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:placeholder-shown~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-moz-placeholder-shown)~.fd-shellbar__search-submit>*{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Background);--fdButtonColor:var(--fdShellbar_Search_Active_Button_Color);--fdButtonIconColor:var(--fdShellbar_Search_Active_Button_Color);--fdShellbar_Button_Active_Background:var(--fdButtonBackgroundColor);--fdShellbar_Button_Active_Color:var(--fdShellbar_Search_Active_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>*{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Background);--fdButtonColor:var(--fdShellbar_Search_Active_Button_Color);--fdButtonIconColor:var(--fdShellbar_Search_Active_Button_Color);--fdShellbar_Button_Active_Background:var(--fdButtonBackgroundColor);--fdShellbar_Button_Active_Color:var(--fdShellbar_Search_Active_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:placeholder-shown)~.fd-shellbar__search-submit>*{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Background);--fdButtonColor:var(--fdShellbar_Search_Active_Button_Color);--fdButtonIconColor:var(--fdShellbar_Search_Active_Button_Color);--fdShellbar_Button_Active_Background:var(--fdButtonBackgroundColor);--fdShellbar_Button_Active_Color:var(--fdShellbar_Search_Active_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-moz-placeholder-shown)~.fd-shellbar__search-submit>:hover{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>:hover{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input:not(:placeholder-shown)~.fd-shellbar__search-submit>:hover{--fdButtonBackgroundColor:var(--fdShellbar_Search_Active_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input--select{font-style:normal}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-input--select{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-box-flex:0;-ms-flex:0 1;flex:0 1}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button{--fdButton_Outline_Offset:0;--fdButton_Focus_Border_Radius:var(--fdShellbar_Input_Border_Radius);border-radius:var(--fdShellbar_Input_Border_Radius);border-width:var(--fdShellbar_Input_Addon_Border_Width);height:var(--fdShellbar_Input_Addon_Dimension);min-width:var(--fdShellbar_Input_Addon_Dimension)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:hover{border-left:var(--fdShellbar_Button_Left_Border);--fdButtonBackgroundColor:var(--fdShellbar_Search_Button_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-hover[dir=rtl],.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:hover[dir=rtl],[dir=rtl] .fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-hover,[dir=rtl] .fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:hover{border-left-style:none;border-right:var(--fdShellbar_Button_Left_Border)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button.is-active,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field-addon .fd-shellbar__button:active{border-color:var(--fdShellbar_Button_Active_Border_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category{-ms-flex-negative:0;flex-shrink:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover{--fdInputGroup_Addon_Background:var(--fdShellbar_Input_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover~.fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover~.fd-shellbar__search-field-input,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover~.fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover~.fd-shellbar__search-field-input{--fdInputGroup_Addon_Background:var(--fdShellbar_Input_Background);--fdInputGroup_Input_Background:var(--fdShellbar_Input_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover .fd-shellbar__search-category,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover .fd-shellbar__search-category{background-color:var(--fdShellbar_Search_Category_Button_Hover_Background);-webkit-box-shadow:var(--sapContent_Interaction_Shadow);box-shadow:var(--sapContent_Interaction_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category.is-hover .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category:hover .fd-shellbar__search-dropdown{background-color:transparent}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category>*{-webkit-margin-end:var(--fdShellbar_Search_Category_Offset_Right);margin-block:0;margin-inline-end:var(--fdShellbar_Search_Category_Offset_Right)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown{background-color:var(--fdShellbar_Input_Background);outline:none;position:static;--fdInput_Group_Button_Background:transparent;--fdInput_Group_Button_Text_Color:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:focus{z-index:5}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-focus:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:focus:after{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category{--fdSelect_Background:transparent;--fdSelect_Hover_Background:transparent;--fdSelect_Focus_Background:transparent;--fdSelect_Background_Color:var(--fdShellbar_Input_Background);--fdSelect_Hover_Background_Color:var(--fdShellbar_Input_Background);border:var(--fdShellbar_Search_Category_Border);border-radius:0;border-width:var(--fdShellbar_Search_Category_Border_width);height:var(--fdShellbar_Input_Addon_Dimension);margin-block:0;margin-inline:0;min-height:var(--fdShellbar_Input_Addon_Dimension);position:relative;-webkit-margin-start:var(--fdShellbar_Search_Category_Offset_Left);margin-inline-start:var(--fdShellbar_Search_Category_Offset_Left)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:after{-webkit-box-shadow:none;box-shadow:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:before{background:var(--sapShell_InteractiveBorderColor);bottom:0;content:\"\";display:var(--fdShellbar_Search_Separator_Display);position:absolute;right:0;top:0;width:.0625rem}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category[dir=rtl]:before,[dir=rtl] .fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:before{left:0;right:auto}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:focus{z-index:5;--fdSelect_Text_Content_Color:var(--sapButton_Active_TextColor);--fdShellbar_Input_Background:var(--fdShellbar_Search_Category_Button_Hover_Background);--fdSelect_Focus_Background:var(--fdShellbar_Search_Container_Hover_Background);border-radius:var(--fdShellbar_Input_Border_Radius);outline-color:var(--sapButton_Lite_Active_BorderColor);outline-offset:-.0625rem;outline-width:.0625rem}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-focus .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:focus .fd-shellbar__search-dropdown{--fdInput_Group_Button_Text_Color:var(--sapButton_Active_TextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-focus:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:focus:before{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover{--fdInputGroup_Hover_Background_Color:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-helper:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-helper:before{-webkit-box-shadow:var(--sapField_Hover_Shadow);box-shadow:var(--sapField_Hover_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-helper:after{-webkit-box-shadow:var(--fdShellbar_Hover_Helper_Bottom_Shadow);box-shadow:var(--fdShellbar_Hover_Helper_Bottom_Shadow)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category{--fdSelect_Background_Color:var(--fdShellbar_Search_Container_Hover_Background);--fdSelect_Hover_Background_Color:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover{border-radius:var(--fdShellbar_Input_Border_Radius)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category .fd-shellbar__search-category:hover:before{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-hover .fd-shellbar__search-field-category:not(:hover) .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:hover .fd-shellbar__search-field-category:not(:hover) .fd-shellbar__search-dropdown{background-color:var(--fdShellbar_Search_Container_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus{background-color:var(--fdShellbar_Active_Background);-webkit-box-shadow:var(--fdShellbar_Active_Shadow);box-shadow:var(--fdShellbar_Active_Shadow);outline:none;z-index:5}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-helper:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-helper:before{outline:var(--fdShellbar_Search_Active_Outline);outline-offset:-.125rem}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-helper:before,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-helper:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-helper:before{-webkit-box-shadow:none;box-shadow:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-addon,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-addon{--fdInputGroup_Addon_Background:var(--fdShellbar_Search_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-category,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-category{background-color:var(--fdShellbar_Search_Hover_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field.is-focus .fd-shellbar__search-field-category .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__group .fd-shellbar__search-field:focus .fd-shellbar__search-field-category .fd-shellbar__search-dropdown{background-color:var(--fdShellbar_Search_Hover_Category_Button_Background)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button{border:solid var(--sapButton_BorderWidth) var(--fdButtonBorderColor);outline-color:var(--fdShellbar_Button_Outline_Color);--fdButtonBackgroundColor:var(--sapButton_Lite_Background);--fdButtonBorderColor:var(--sapButton_Lite_BorderColor);--fdButtonColor:var(--fdShellbar_Button_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_InteractiveTextColor))}.fd-shellbar .fd-shellbar__group .fd-shellbar__button .fd-shellbar__title{color:inherit}.fd-shellbar .fd-shellbar__group .fd-shellbar__button:not(.fd-shellbar .fd-shellbar__group .fd-shellbar__button--menu){padding-block:0;padding-inline:0}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover{--fdButtonBorderColor:var(--fdShellbar_Button_Hover_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_Input_Hover_Background);--fdButtonIconColor:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover.is-disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover:disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-hover[aria-disabled=true],.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover.is-disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover:disabled,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:hover[aria-disabled=true]{--fdButtonBackgroundColor:$fd-shellbar-background}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-active,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:active{--fdButtonBorderColor:var(--fdShellbar_Button_Active_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_Button_Active_Background);--fdButtonColor:var(--fdShellbar_Button_Active_Color);--fdButtonIconColor:var(--fdShellbar_Button_Active_Color)}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.is-active:after,.fd-shellbar .fd-shellbar__group .fd-shellbar__button:active:after{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__button--menu .fd-shellbar__title{margin-block:0;margin-inline:0}.fd-shellbar--s,.fd-shellbar--sm{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--s .fd-shellbar__subtitle,.fd-shellbar--s .fd-shellbar__title,.fd-shellbar--sm .fd-shellbar__subtitle,.fd-shellbar--sm .fd-shellbar__title{display:none}.fd-shellbar--s .fd-shellbar__group--mobile-flex,.fd-shellbar--sm .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--s .fd-shellbar__action--mobile,.fd-shellbar--sm .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--s .fd-shellbar__action--desktop,.fd-shellbar--sm .fd-shellbar__action--desktop{display:none}.fd-shellbar--s .fd-shellbar__action-combobox--mobile,.fd-shellbar--sm .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--s .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--s .fd-shellbar__button--menu[class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}.fd-shellbar--l,.fd-shellbar--lg,.fd-shellbar--m,.fd-shellbar--md{padding-block:0;padding-inline:2rem}.fd-shellbar--l .fd-shellbar__subtitle,.fd-shellbar--l .fd-shellbar__title,.fd-shellbar--lg .fd-shellbar__subtitle,.fd-shellbar--lg .fd-shellbar__title,.fd-shellbar--m .fd-shellbar__subtitle,.fd-shellbar--m .fd-shellbar__title,.fd-shellbar--md .fd-shellbar__subtitle,.fd-shellbar--md .fd-shellbar__title,.fd-shellbar--xl .fd-shellbar__subtitle,.fd-shellbar--xl .fd-shellbar__title{display:inline-block}.fd-shellbar--l .fd-shellbar__action--mobile,.fd-shellbar--lg .fd-shellbar__action--mobile,.fd-shellbar--m .fd-shellbar__action--mobile,.fd-shellbar--md .fd-shellbar__action--mobile,.fd-shellbar--xl .fd-shellbar__action--mobile{display:none}.fd-shellbar--l .fd-shellbar__action--desktop,.fd-shellbar--lg .fd-shellbar__action--desktop,.fd-shellbar--m .fd-shellbar__action--desktop,.fd-shellbar--md .fd-shellbar__action--desktop,.fd-shellbar--xl .fd-shellbar__action--desktop{display:inline-block}.fd-shellbar--xl{padding-block:0;padding-inline:3rem}.fd-shellbar--side-nav.fd-shellbar--l,.fd-shellbar--side-nav.fd-shellbar--lg,.fd-shellbar--side-nav.fd-shellbar--m,.fd-shellbar--side-nav.fd-shellbar--md,.fd-shellbar--side-nav.fd-shellbar--s,.fd-shellbar--side-nav.fd-shellbar--sm,.fd-shellbar--side-nav.fd-shellbar--xl{padding-block:0;padding-inline:0}@media (width <= 599px){.fd-shellbar--responsive-paddings{padding-inline:1rem}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1440px){.fd-shellbar--responsive-paddings{padding-inline:3rem}}@media (width <= 599px){.fd-shellbar--responsive-paddings{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--responsive-paddings .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--responsive-paddings .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1440px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}.fd-shellbar--cx-side-nav{box-shadow:var(--sapContent_Shadow0);padding-left:.5rem;z-index:1}[dir=rtl] .fd-shellbar--cx-side-nav,.fd-shellbar--cx-side-nav[dir=rtl]{padding-left:2rem;padding-right:.5rem}fd-shellbar-actions .fd-shellbar__search-field{min-width:15rem}.fd-shellbar__action.fd-shellbar__action--desktop:empty{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor: var(--sapShell_TextColor)}\n/*! Bundled license information:\n\nfundamental-styles/dist/shellbar.css:\n  (*!\n   * Fundamental Library Styles v0.38.0\n   * Copyright (c) 2024 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
+                    ], imports: [PortalModule, FdTranslatePipe, ButtonComponent, ClickedDirective], template: "<div\n    class=\"fd-shellbar\"\n    [class]=\"'fd-shellbar--' + _currentSize + _getSideNavClass()\"\n    [class.fd-shellbar--side-nav]=\"sideNav === true\"\n    [class.fd-shellbar--has-context-area]=\"!!contextArea\"\n    #shellbar\n>\n    @if (!_hideAllComponents) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--product\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.product?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.product?.flexBasisAuto\"\n        >\n            @if (showNavigationButton && !_showMobileSearch) {\n                <button\n                    class=\"fd-shellbar__action\"\n                    fd-button\n                    fdType=\"transparent\"\n                    glyph=\"menu2\"\n                    (fdkClicked)=\"_navigationClicked($event)\"\n                ></button>\n            }\n            @if (showBackButton && !_showMobileSearch) {\n                <button\n                    class=\"fd-shellbar__action\"\n                    fd-button\n                    fdType=\"transparent\"\n                    [glyph]=\"_rtl$() ? 'slim-arrow-right' : 'nav-back'\"\n                    (fdkClicked)=\"_backClicked($event)\"\n                ></button>\n            }\n            <ng-content select=\"fd-shellbar-branding\"></ng-content>\n            <ng-content select=\"[fd-shellbar-side-nav]\"></ng-content>\n            <ng-content select=\"fd-shellbar-logo\"></ng-content>\n            @if (!_hideTitleComponents) {\n                <ng-content select=\"fd-shellbar-title\"></ng-content>\n                <ng-content select=\"fd-product-menu\"></ng-content>\n                <ng-content select=\"fd-shellbar-subtitle\"></ng-content>\n                <ng-content select=\"fd-shellbar-separator\"></ng-content>\n            }\n        </div>\n        <ng-content select=\"fd-shellbar-context-area\"></ng-content>\n    }\n    <div hidden>\n        <ng-content></ng-content>\n    </div>\n    @if (searchComponent) {\n        <div\n            class=\"fd-shellbar__group fd-shellbar__group--center fd-shellbar__group--mobile-flex\"\n            [class.fd-shellbar__group--shrink]=\"groupFlex?.search?.shrink\"\n            [class.fd-shellbar__group--basis-auto]=\"groupFlex?.search?.flexBasisAuto\"\n        >\n            <div class=\"fd-shellbar__action fd-shellbar__action--grow\">\n                <ng-container cdkPortalOutlet #searchPortalOutlet></ng-container>\n            </div>\n            @if (_hideAllComponents) {\n                <div class=\"fd-shellbar__action fd-shellbar__action--mobile fd-shellbar__action--shrink\">\n                    <button class=\"fd-button fd-button--transparent\" (click)=\"_closeMobileSearch()\">\n                        {{ 'coreShellbar.cancel' | fdTranslate }}\n                    </button>\n                </div>\n            }\n        </div>\n    }\n    @if (!_hideAllComponents) {\n        <ng-content select=\"fd-shellbar-actions\"></ng-content>\n    }\n</div>\n", styles: [".fd-shellbar{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:1rem;-webkit-box-pack:justify;-ms-flex-pack:justify;background:var(--sapShellColor);border:0 inset var(--sapShell_BorderColor);-webkit-box-shadow:var(--sapShell_Shadow);box-shadow:var(--sapShell_Shadow);height:3.25rem;justify-content:space-between;padding-block:0;padding-inline:var(--fdShellbar_Inline_Padding,1rem)}.fd-shellbar:after,.fd-shellbar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__branding{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdShellBar_Branding_Background,var(--sapButton_Lite_Background));border:var(--sapButton_BorderWidth) solid var(--fdShellBar_Branding_Border_Color,var(--sapButton_Lite_BorderColor));border-radius:.375rem;cursor:var(--fdShellBar_Branding_Cursor,pointer);gap:.25rem;height:2.25rem;padding-block:.125rem;padding-inline:.25rem .5rem}.fd-shellbar__branding:after,.fd-shellbar__branding:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__branding.is-hover,.fd-shellbar__branding:hover{--fdShellBar_Branding_Background:var(--fdShellbar_Branding_Hover_Background);--fdShellBar_Branding_Border_Color:var(--fdShellbar_Branding_Hover_Border_Color)}.fd-shellbar__branding.is-active,.fd-shellbar__branding:active{--fdShellBar_Branding_Background:var(--fdShellbar_Branding_Active_Background);--fdShellBar_Branding_Border_Color:var(--fdShellbar_Branding_Active_Border_Color)}.fd-shellbar__branding.is-active.is-focus,.fd-shellbar__branding.is-active:focus,.fd-shellbar__branding:active.is-focus,.fd-shellbar__branding:active:focus{outline:none;z-index:5}.fd-shellbar__branding.is-focus,.fd-shellbar__branding:focus{outline:var(--sapContent_FocusStyle) var(--sapContent_FocusWidth) var(--fdShellbar_Button_Outline_Color);outline-offset:-.125rem;z-index:5}.fd-shellbar__branding--non-interactive{--fdShellBar_Branding_Cursor:auto}.fd-shellbar__branding--non-interactive.is-active,.fd-shellbar__branding--non-interactive.is-focus,.fd-shellbar__branding--non-interactive.is-hover,.fd-shellbar__branding--non-interactive:active,.fd-shellbar__branding--non-interactive:focus,.fd-shellbar__branding--non-interactive:hover{--fdShellBar_Branding_Background:var(--sapButton_Lite_Background);--fdShellBar_Branding_Border_Color:var(--sapButton_Lite_BorderColor)}.fd-shellbar__branding--non-interactive.is-focus,.fd-shellbar__branding--non-interactive:focus{outline:none;z-index:5}.fd-shellbar__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdShellbar_Title_Color);font-family:var(--sapFontFamily);font-family:var(--sapFontSemiboldFamily);font-size:var(--sapFontSize);font-size:var(--sapFontHeader5Size);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-shellbar__title:after,.fd-shellbar__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__subtitle{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdShellbar_Subtitle_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontSmallSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;white-space:nowrap}.fd-shellbar__subtitle:after,.fd-shellbar__subtitle:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__product{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-shellbar__product:after,.fd-shellbar__product:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo{background-repeat:no-repeat;background-size:contain;border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:inline-block;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;margin-inline:.25rem;max-height:2rem;padding-block:0;padding-inline:0;position:relative;vertical-align:middle}.fd-shellbar__logo:after,.fd-shellbar__logo:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__logo>*{display:block;line-height:0;max-height:2rem;width:auto}.fd-shellbar__logo--image-replaced{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0iTGF5ZXIgMSIgdmlld0JveD0iMCAwIDQxMi4zOCAyMDQiPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgeDE9IjIwNi4xOSIgeDI9IjIwNi4xOSIgeTI9IjIwNCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iIzAwYjhmMSIvPjxzdG9wIG9mZnNldD0iLjAyIiBzdG9wLWNvbG9yPSIjMDFiNmYwIi8+PHN0b3Agb2Zmc2V0PSIuMzEiIHN0b3AtY29sb3I9IiMwZDkwZDkiLz48c3RvcCBvZmZzZXQ9Ii41OCIgc3RvcC1jb2xvcj0iIzE3NzVjOCIvPjxzdG9wIG9mZnNldD0iLjgyIiBzdG9wLWNvbG9yPSIjMWM2NWJmIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMWU1ZmJiIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHRpdGxlPlNBUF9ncmFkX1Jfc2Nybl9aZWljaGVuZmzDpGNoZSAxPC90aXRsZT48cGF0aCBkPSJNMCAyMDRoMjA4LjQxTDQxMi4zOCAwSDB6IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDp1cmwoI2EpIi8+PHBhdGggZD0iTTI0NC43MyAzOC4zNmgtNDAuNnY5Ni41MmwtMzUuNDYtOTYuNTVoLTM1LjE2bC0zMC4yNyA4MC43MkMxMDAgOTguNyA3OSA5MS42NyA2Mi40IDg2LjQgNTEuNDYgODIuODkgMzkuODUgNzcuNzIgNDAgNzJjLjA5LTQuNjggNi4yMy05IDE4LjM4LTguMzggOC4xNy40MyAxNS4zNyAxLjA5IDI5LjcxIDhsMTQuMS0yNC41NUM4OS4wNiA0MC40MiA3MSAzNi4yMSA1Ni4xNyAzNi4xOWgtLjA5Yy0xNy4yOCAwLTMxLjY4IDUuNi00MC42IDE0LjgzQTM0LjIzIDM0LjIzIDAgMCAwIDUuNzcgNzQuN0M1LjU0IDg3LjE1IDEwLjExIDk2IDE5LjcxIDEwM2M4LjEgNS45NCAxOC40NiA5Ljc5IDI3LjYgMTIuNjIgMTEuMjcgMy40OSAyMC40NyA2LjUzIDIwLjM2IDEzQTkuNTcgOS41NyAwIDAgMSA2NSAxMzVjLTIuODEgMi45LTcuMTMgNC0xMy4wOSA0LjEtMTEuNDkuMjQtMjAtMS41Ni0zMy42MS05LjU5TDUuNzcgMTU0LjQyYTkzLjc3IDkzLjc3IDAgMCAwIDQ2IDEyLjIyaDIuMTFjMTQuMjQtLjI1IDI1Ljc0LTQuMzEgMzQuOTItMTEuNzEuNTMtLjQxIDEtLjg0IDEuNDktMS4yOGwtNC4xMiAxMC44NUgxMjNsNi4xOS0xOC44MmE2Ny41IDY3LjUgMCAwIDAgMjEuNjggMy40MyA2OC4zIDY4LjMgMCAwIDAgMjEuMTYtMy4yNWw2IDE4LjY0aDYwLjE0di0zOWgxMy4xMWMzMS43MSAwIDUwLjQ2LTE2LjE1IDUwLjQ2LTQzLjIgMC0zMC4xMS0xOC4yMi00My45NC01Ny4wMS00My45NE0xNTAuOTEgMTIxYTM2LjkgMzYuOSAwIDAgMS0xMy0yLjI4bDEyLjg3LTQwLjU5aC4yMmwxMi42NSA0MC43MWEzOC41IDM4LjUgMCAwIDEtMTIuNzQgMi4xNm05Ni4yLTIzLjMzaC04Ljk0VjY0LjkxaDguOTRjMTEuOTMgMCAyMS40NCA0IDIxLjQ0IDE2LjE0IDAgMTIuNi05LjUxIDE2LjU3LTIxLjQ0IDE2LjU3IiBzdHlsZT0iZmlsbC1ydWxlOmV2ZW5vZGQ7ZmlsbDojZmZmIi8+PC9zdmc+);height:1.5rem;width:3rem}.fd-shellbar__separator{background-color:var(--sapToolbar_SeparatorColor);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:1rem;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;width:.0625rem}.fd-shellbar__separator:after,.fd-shellbar__separator:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar__spacer{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-flex:1;-ms-flex:1 auto;flex:1 auto}.fd-shellbar__spacer:after,.fd-shellbar__spacer:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-popover__control:focus-visible{outline:none}.fd-shellbar .fd-shellbar__button{--fdButtonBackgroundColor:var(--sapButton_Lite_Background);--fdButtonBorderColor:var(--sapButton_Lite_BorderColor);--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__button>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_InteractiveTextColor))}.fd-shellbar .fd-shellbar__button.fd-user-menu__control{padding-inline:0}.fd-shellbar .fd-shellbar__button.is-hover,.fd-shellbar .fd-shellbar__button:hover{--fdButtonBackgroundColor:var(--sapShell_Hover_Background);--fdButtonBorderColor:var(--fdShellbar_Button_Hover_Border_Color);--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__button.is-hover>[class*=sap-icon],.fd-shellbar .fd-shellbar__button:hover>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_InteractiveTextColor))}.fd-shellbar .fd-shellbar__button.is-active,.fd-shellbar .fd-shellbar__button:active{--fdButtonBackgroundColor:var(--sapShell_Active_Background);--fdButtonBorderColor:var(--fdShellbar_Button_Active_Border_Color);--fdButtonColor:var(--sapShell_Active_TextColor;)}.fd-shellbar .fd-shellbar__button.is-active>[class*=sap-icon],.fd-shellbar .fd-shellbar__button:active>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_Active_TextColor))}.fd-shellbar .fd-shellbar__button.is-toggled{--fdButtonBackgroundColor:var(--sapShell_Selected_Background);--fdButtonBorderColor:var(--fdShellbar_Button_Active_Border_Color);--fdButtonColor:var(--sapShell_Selected_TextColor;)}.fd-shellbar .fd-shellbar__button.is-toggled>[class*=sap-icon]{color:var(--fdButtonIconColor,var(--sapShell_Selected_TextColor))}.fd-shellbar .fd-shellbar__button.is-focus,.fd-shellbar .fd-shellbar__button:focus{z-index:5}.fd-shellbar .fd-shellbar__button.is-focus:after,.fd-shellbar .fd-shellbar__button:focus:after{border-color:var(--fdShellbar_Button_Outline_Color)}.fd-shellbar .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor:var(--sapShell_TextColor)}.fd-shellbar .fd-shellbar__button:has(.fd-shellbar__avatar--circle){border-radius:20rem;--fdButton_Height:fit-content;--fdButton_Clickable_Height:fit-content;--fdButton_Min_Width:fit-content;--fdButton_Focus_Border_Radius:20rem}.fd-shellbar .fd-shellbar__button--menu .fd-shellbar__title{margin-block:0;margin-inline:0}.fd-shellbar .fd-shellbar__action{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-shellbar .fd-shellbar__action:after,.fd-shellbar .fd-shellbar__action:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-shellbar__action>*{vertical-align:middle}.fd-shellbar .fd-shellbar__action--grow{-webkit-box-flex:1;-ms-flex:1;flex:1}.fd-shellbar .fd-shellbar__action--shrink{-webkit-box-flex:0;-ms-flex:0;flex:0}.fd-shellbar .fd-shellbar__action:has(.fd-product-switch){-webkit-margin-start:.5rem;margin-inline-start:.5rem}.fd-shellbar .fd-shellbar__search-field{background-color:var(--fdShellbar_SearchField_Background_Color,var(--sapShell_InteractiveBackground));border:none;border-radius:var(--fdShellbar_SearchField_Border_Radius);-webkit-box-shadow:var(--fdShellbar_SearchField_Box_Shadow,var(--fdShellbar_SearchField_Shadow));box-shadow:var(--fdShellbar_SearchField_Box_Shadow,var(--fdShellbar_SearchField_Shadow));max-width:25rem;min-width:25rem}.fd-shellbar .fd-shellbar__search-field:has(.fd-shellbar__search-field-category){max-width:36rem}.fd-shellbar .fd-shellbar__search-field.is-hover,.fd-shellbar .fd-shellbar__search-field:hover{--fdShellbar_SearchField_Box_Shadow:var(--sapField_Hover_Shadow);--fdShellbar_SearchField_Background_Color:var(--fdShellbar_SearchField_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field.is-focus,.fd-shellbar .fd-shellbar__search-field:focus{outline:none;z-index:5}.fd-shellbar .fd-shellbar__search-field.is-active,.fd-shellbar .fd-shellbar__search-field.is-focus,.fd-shellbar .fd-shellbar__search-field:active,.fd-shellbar .fd-shellbar__search-field:focus{--fdShellbar_SearchField_Background_Color:var(--fdShellbar_SearchField_Background_Color_Active)}.fd-shellbar .fd-shellbar__search-field:has(input:focus){--fdShellbar_SearchField_Background_Color:var(--fdShellbar_SearchField_Background_Color_Active);background:none;-webkit-box-shadow:var(--fdShellbar_Active_Shadow);box-shadow:var(--fdShellbar_Active_Shadow)}.fd-shellbar .fd-shellbar__search-field:has(button:hover){--fdShellbar_SearchField_Background_Color:var(--sapShell_InteractiveBackground)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input{border-radius:var(--fdShellbar_SearchField_Input_Border_Radius);padding-inline:var(--fdInputGroup_Input_Padding,.875rem .25rem);width:15rem;--fdInputGroup_Input_Color:var(--fdShellbar_SearchField_Input_Text_Color);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border);--fdInputGroup_Input_Background:var(--fdShellbar_SearchField_Input_Background_Regular)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:-moz-placeholder~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:-ms-input-placeholder~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:placeholder-shown~.fd-shellbar__search-cancel{display:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::-webkit-input-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::-moz-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:-ms-input-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::-ms-input-placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input::placeholder{color:var(--fdShellbar_SearchField_Input_Placeholder_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:hover{--fdInputGroup_Hover_Input_Background:var(--fdShellbar_SearchField_Input_Background_Hover);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border_Hover);border:var(--fdInputGroup_Input_Border)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-active,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:active{--fdInputGroup_Input_Background:var(--fdShellbar_SearchField_Input_Background_Active);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border_Active);--fdInputGroup_Input_Padding:var(--fdShellbar_SearchField_Input_Padding_Inline)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus{z-index:5;--fdInputGroup_Input_Background:var(--fdShellbar_SearchField_Input_Background_Focus);--fdInputGroup_Input_Border:var(--fdShellbar_SearchField_Input_Border_Active);--fdInputGroup_Input_Padding:var(--fdShellbar_SearchField_Input_Padding_Inline);outline:var(--fdShellbar_SearchField_Input_Outline);outline-offset:var(--fdShellbar_SearchField_Input_Outline_Offset)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>*,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>*{--fdButtonColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonIconColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>*,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>*{--fdButtonColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonIconColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:placeholder-shown)~.fd-shellbar__search-submit>*,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:placeholder-shown)~.fd-shellbar__search-submit>*{--fdButtonColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonIconColor:var(--fdShellbar_SearchField_Submit_Button_Color);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>:hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-moz-placeholder)~.fd-shellbar__search-submit>:hover{--fdButtonColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonIconColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color_Hover);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>:hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:-ms-input-placeholder)~.fd-shellbar__search-submit>:hover{--fdButtonColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonIconColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color_Hover);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:placeholder-shown)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input.is-focus:not(:placeholder-shown)~.fd-shellbar__search-submit>:hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:placeholder-shown)~.fd-shellbar__search-submit>.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-input:focus:not(:placeholder-shown)~.fd-shellbar__search-submit>:hover{--fdButtonColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonIconColor:var(--sapButton_Emphasized_Hover_TextColor);--fdButtonBorderColor:var(--fdShellbar_SearchField_Submit_Button_Border_Color_Hover);--fdButtonBackgroundColor:var(--fdShellbar_SearchField_Submit_Button_Background_Color_Hover)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon{margin-inline:var(--fdShellbar_SearchField_Addon_Margin_Inline);max-width:var(--fdShellbar_SearchField_Button_Width);min-width:var(--fdShellbar_SearchField_Button_Width);width:var(--fdShellbar_SearchField_Button_Width)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button{height:var(--fdShellbar_SearchField_Button_Height);max-height:var(--fdShellbar_SearchField_Button_Height);max-width:var(--fdShellbar_SearchField_Button_Width);min-height:var(--fdShellbar_SearchField_Button_Height);min-width:var(--fdShellbar_SearchField_Button_Width);width:var(--fdShellbar_SearchField_Button_Width);--fdButton_Focus_Border_Radius:var(--fdShellbar_SearchField_Button_Border_Radius);border-radius:var(--fdShellbar_SearchField_Button_Border_Radius)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button.is-focus,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button:focus{z-index:5}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button.is-focus:after,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-addon .fd-shellbar__button:focus:after{inset:var(--fdShellbar_SearchField_Button_Focus_Inset)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category{position:relative;-webkit-margin-end:var(--fdShell_Search_Field_Category_Margin_End);margin-inline-end:var(--fdShell_Search_Field_Category_Margin_End)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category:after{background-color:var(--sapShell_InteractiveBorderColor);content:\"\";display:var(--fdShell_Search_Field_Category_Divider_Display);height:1.5rem;position:absolute;right:-.5rem;width:.0625rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category[dir=rtl]:after,[dir=rtl] .fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category:after{left:-.5rem;right:auto}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select{-webkit-margin-start:.375rem;margin-inline-start:.375rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__control:after{-webkit-box-shadow:none;box-shadow:none}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__control.is-focus,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__control:focus{outline:none;z-index:5}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-select .fd-select__text-content{color:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown{border-radius:var(--fdShell_Search_Dropdown_Button_Radius);color:var(--sapShell_InteractiveTextColor);height:var(--fdShell_Search_Dropdown_Height);max-width:2.125rem;min-width:2.125rem;width:2.125rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown>[class*=sap-icon]{max-width:1rem;min-width:1rem;width:1rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:hover{background-color:var(--sapShell_Hover_Background);-webkit-box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);color:var(--sapShell_InteractiveTextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown.is-active,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-dropdown:active{color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category{background:none;border:var(--fdShell_Search_Category_Border);border-radius:var(--fdShell_Search_Dropdown_Border_Radius);gap:.25rem;height:var(--fdShell_Search_Dropdown_Height);margin-inline:0;max-width:18rem}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-hover,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:hover{background-color:var(--fdShell_Search_Dropdown_Hover_Background);border:var(--fdShell_Search_Category_Border);-webkit-box-shadow:var(--sapField_Hover_Shadow);box-shadow:var(--sapField_Hover_Shadow)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-active,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:active{background-color:var(--fdShell_Search_Dropdown_Active_Background)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-active .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category:active .fd-shellbar__search-dropdown{-webkit-box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-expanded,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category[aria-expanded=true]{background-color:var(--fdShell_Search_Dropdown_Active_Background);-webkit-box-shadow:var(--sapField_Hover_Shadow);box-shadow:var(--sapField_Hover_Shadow)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category.is-expanded .fd-shellbar__search-dropdown,.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category[aria-expanded=true] .fd-shellbar__search-dropdown{background-color:var(--sapShell_Active_Background);-webkit-box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);box-shadow:var(--fdShell_Search_Dropdown_Box_Shadow_Hover);color:var(--sapShell_Active_TextColor)}.fd-shellbar .fd-shellbar__search-field .fd-shellbar__search-field-category .fd-shellbar__search-category--collapsed .fd-select__text-content{display:none}.fd-shellbar .fd-shellbar__group{--fdShellbar_Button_Active_Background:var(--sapShell_Active_Background);--fdShellbar_Button_Active_Color:var(--sapShell_Active_TextColor);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem}.fd-shellbar .fd-shellbar__group:after,.fd-shellbar .fd-shellbar__group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar .fd-shellbar__group--shrink{-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:0}.fd-shellbar .fd-shellbar__group--basis-auto{-ms-flex-preferred-size:auto;flex-basis:auto}.fd-shellbar .fd-shellbar__group--product{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.fd-shellbar .fd-shellbar__group--center,.fd-shellbar .fd-shellbar__group--copilot{-webkit-box-ordinal-group:3;-ms-flex-order:2;display:none;order:2;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-block:0;margin-inline:.5rem}.fd-shellbar .fd-shellbar__group--center .fd-shellbar__action,.fd-shellbar .fd-shellbar__group--copilot .fd-shellbar__action{width:100%}@media (width >= 1440px){.fd-shellbar .fd-shellbar__group--center,.fd-shellbar .fd-shellbar__group--copilot{display:inline-block}}.fd-shellbar .fd-shellbar__group--context-area{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-ordinal-group:3;-ms-flex-order:2;gap:.5rem;order:2}.fd-shellbar .fd-shellbar__group--actions{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-ordinal-group:4;-ms-flex-order:3;gap:.5rem;order:3}.fd-shellbar .fd-shellbar__group--full-width{width:100%}.fd-shellbar .fd-shellbar__toolbar{padding-inline:0}.fd-shellbar--s,.fd-shellbar--sm{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--s .fd-shellbar__subtitle,.fd-shellbar--s .fd-shellbar__title,.fd-shellbar--sm .fd-shellbar__subtitle,.fd-shellbar--sm .fd-shellbar__title{display:none}.fd-shellbar--s .fd-shellbar__group--mobile-flex,.fd-shellbar--sm .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--s .fd-shellbar__action--mobile,.fd-shellbar--sm .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--s .fd-shellbar__action--desktop,.fd-shellbar--sm .fd-shellbar__action--desktop{display:none}.fd-shellbar--s .fd-shellbar__action:has(.fd-shellbar__search-field),.fd-shellbar--sm .fd-shellbar__action:has(.fd-shellbar__search-field){width:100%}.fd-shellbar--s .fd-shellbar__action-combobox--mobile,.fd-shellbar--sm .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--s .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--s .fd-shellbar__button--menu[class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--sm .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}.fd-shellbar--s .fd-shellbar__search-field,.fd-shellbar--sm .fd-shellbar__search-field{width:100%}.fd-shellbar--l,.fd-shellbar--lg,.fd-shellbar--m,.fd-shellbar--md{padding-block:0;padding-inline:2rem}.fd-shellbar--l .fd-shellbar__subtitle,.fd-shellbar--l .fd-shellbar__title,.fd-shellbar--lg .fd-shellbar__subtitle,.fd-shellbar--lg .fd-shellbar__title,.fd-shellbar--m .fd-shellbar__subtitle,.fd-shellbar--m .fd-shellbar__title,.fd-shellbar--md .fd-shellbar__subtitle,.fd-shellbar--md .fd-shellbar__title,.fd-shellbar--xl .fd-shellbar__subtitle,.fd-shellbar--xl .fd-shellbar__title{display:inline-block}.fd-shellbar--l .fd-shellbar__action--mobile,.fd-shellbar--lg .fd-shellbar__action--mobile,.fd-shellbar--m .fd-shellbar__action--mobile,.fd-shellbar--md .fd-shellbar__action--mobile,.fd-shellbar--xl .fd-shellbar__action--mobile{display:none}.fd-shellbar--l .fd-shellbar__action--desktop,.fd-shellbar--lg .fd-shellbar__action--desktop,.fd-shellbar--m .fd-shellbar__action--desktop,.fd-shellbar--md .fd-shellbar__action--desktop,.fd-shellbar--xl .fd-shellbar__action--desktop{display:inline-block}.fd-shellbar--xl,.fd-shellbar--xxl{padding-block:0;padding-inline:3rem}.fd-shellbar--side-nav{--fdShellbar_Inline_Padding:.875rem 1rem}.fd-shellbar--side-nav.fd-shellbar--l,.fd-shellbar--side-nav.fd-shellbar--lg,.fd-shellbar--side-nav.fd-shellbar--m,.fd-shellbar--side-nav.fd-shellbar--md,.fd-shellbar--side-nav.fd-shellbar--s,.fd-shellbar--side-nav.fd-shellbar--sm,.fd-shellbar--side-nav.fd-shellbar--xl{padding-inline:.875rem 1rem}@media (width <= 599px){.fd-shellbar--responsive-paddings{padding-inline:1rem}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings{padding-inline:2rem}}@media (width >= 1440px){.fd-shellbar--responsive-paddings{padding-inline:3rem}}@media (width <= 599px){.fd-shellbar--responsive-paddings{--fdSelect_Text_Content_Display:none;--fdSelect_Min_Width:1rem}.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__group--mobile-flex{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action:has(.fd-shellbar__search-field){width:100%}.fd-shellbar--responsive-paddings .fd-shellbar__action-combobox--mobile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--sapShellColor);height:100%;left:0;margin-block:0;margin-inline:0;padding-block:0;padding-inline:.3rem;position:absolute;width:100%;z-index:7}.fd-shellbar--responsive-paddings .fd-shellbar__button--menu [class*=sap-icon],.fd-shellbar--responsive-paddings .fd-shellbar__button--menu[class*=sap-icon]{margin-block:0!important;margin-inline:0!important}.fd-shellbar--responsive-paddings .fd-shellbar__search-field{width:100%}}@media (width >= 600px) and (width <= 1023px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1024px) and (width <= 1439px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}@media (width >= 1440px){.fd-shellbar--responsive-paddings .fd-shellbar__subtitle,.fd-shellbar--responsive-paddings .fd-shellbar__title{display:inline-block}.fd-shellbar--responsive-paddings .fd-shellbar__action--mobile{display:none}.fd-shellbar--responsive-paddings .fd-shellbar__action--desktop{display:inline-block}}.fd-shellbar-overlay{background:var(--sapBlockLayer_Background);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:100%;left:0;line-height:normal;margin-block:0;margin-inline:0;opacity:.3;padding-block:0;padding-inline:0;position:absolute;right:0;top:0;width:100%}.fd-shellbar-overlay:after,.fd-shellbar-overlay:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-shellbar--cx-side-nav{box-shadow:var(--sapContent_Shadow0);padding-left:.5rem;z-index:1}[dir=rtl] .fd-shellbar--cx-side-nav,.fd-shellbar--cx-side-nav[dir=rtl]{padding-left:2rem;padding-right:.5rem}.fd-shellbar__action.fd-shellbar__action--desktop:empty{display:none}.fd-shellbar .fd-shellbar__group .fd-shellbar__button.fd-shellbar__button--menu{--fdButtonColor: var(--sapShell_TextColor)}.fd-shellbar{gap:.5rem}.fd-shellbar .fd-shellbar__search-field{min-width:auto}.fd-shellbar.fd-shellbar--has-context-area{justify-content:start}.fd-shellbar.fd-shellbar--has-context-area .fd-shellbar__group--actions{margin-right:0;margin-left:auto}[dir=rtl] .fd-shellbar.fd-shellbar--has-context-area .fd-shellbar__group--actions,.fd-shellbar.fd-shellbar--has-context-area .fd-shellbar__group--actions[dir=rtl]{margin-right:auto;margin-left:0}.fd-shellbar__title{vertical-align:middle}.fd-shellbar--s .fd-shellbar__branding,.fd-shellbar--m .fd-shellbar__branding{gap:0}.fd-shellbar--s .fd-shellbar__separator,.fd-shellbar--m .fd-shellbar__separator{display:none}.fd-shellbar .fd-shellbar__group--context-area{flex:none}.fd-shellbar .fd-shellbar__group--context-area .fd-object-status{white-space:nowrap;overflow:hidden}.fd-shellbar.fd-shellbar--s .fd-shellbar__group--actions{gap:.125rem}.fd-shellbar.fd-shellbar--s .fd-shellbar__search-field{max-width:12.5rem}.fd-shellbar:not(.fd-shellbar--xl) .fd-shellbar__search-field .fd-shellbar__search-field-input{width:auto}.fd-shellbar.fd-shellbar--m fd-shellbar-actions .fd-shellbar__search-field{max-width:15rem}.fd-shellbar.fd-shellbar--m fd-shellbar-actions .fd-shellbar__search-field .fd-shellbar__search-field-input{max-width:6rem}.fd-button.fd-shellbar__button.fd-shellbar__button--user-menu{padding:0!important}\n/*! Bundled license information:\n\nfundamental-styles/dist/shellbar.css:\n  (*!\n   * Fundamental Library Styles v0.39.2\n   * Copyright (c) 2025 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
         }], propDecorators: { size: [{
                 type: Input
             }], breakpoints: [{
@@ -803,15 +1051,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                 type: Input
             }], groupFlex: [{
                 type: Input
+            }], showNavigationButton: [{
+                type: Input
+            }], showBackButton: [{
+                type: Input
+            }], navigationButtonClicked: [{
+                type: Output
+            }], backButtonClicked: [{
+                type: Output
             }], comboboxComponent: [{
                 type: ContentChild,
                 args: [FD_COMBOBOX_COMPONENT, { static: false }]
             }], buttons: [{
                 type: ContentChildren,
                 args: [FD_BUTTON_COMPONENT, { read: ElementRef }]
-            }], searchComponent: [{
+            }], contextArea: [{
                 type: ContentChild,
-                args: [FD_SHELLBAR_SEARCH_COMPONENT, { descendants: true, static: false }]
+                args: [ShellbarContextAreaComponent]
+            }], branding: [{
+                type: ContentChild,
+                args: [ShellbarBrandingComponent]
             }], _actions: [{
                 type: ContentChild,
                 args: [ShellbarActionsComponent]
@@ -821,6 +1080,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
             }], _shellbar: [{
                 type: ViewChild,
                 args: ['shellbar']
+            }], searchComponent: [{
+                type: ContentChild,
+                args: [FD_SHELLBAR_SEARCH_COMPONENT, { descendants: true, static: false }]
             }] } });
 
 class ShellbarModule {
@@ -834,7 +1096,13 @@ class ShellbarModule {
             ShellbarLogoComponent,
             ShellbarTitleComponent,
             ShellbarUserMenuComponent,
-            ShellbarSidenavDirective], exports: [ShellbarComponent,
+            ShellbarSidenavDirective,
+            ShellbarUserMenuButtonDirective,
+            ShellbarSidenavDirective,
+            ShellbarBrandingComponent,
+            ShellbarContextAreaComponent,
+            ShellbarSeparatorComponent,
+            ShellbarHidePriorityDirective], exports: [ShellbarComponent,
             ProductMenuComponent,
             ShellbarSubtitleComponent,
             ShellbarActionsComponent,
@@ -844,6 +1112,12 @@ class ShellbarModule {
             ShellbarTitleComponent,
             ShellbarUserMenuComponent,
             ShellbarSidenavDirective,
+            ShellbarUserMenuButtonDirective,
+            ShellbarSidenavDirective,
+            ShellbarBrandingComponent,
+            ShellbarContextAreaComponent,
+            ShellbarSeparatorComponent,
+            ShellbarHidePriorityDirective,
             ContentDensityModule] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ShellbarModule, imports: [ShellbarComponent,
             ProductMenuComponent,
@@ -865,7 +1139,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         ShellbarLogoComponent,
                         ShellbarTitleComponent,
                         ShellbarUserMenuComponent,
-                        ShellbarSidenavDirective
+                        ShellbarSidenavDirective,
+                        ShellbarUserMenuButtonDirective,
+                        ShellbarSidenavDirective,
+                        ShellbarBrandingComponent,
+                        ShellbarContextAreaComponent,
+                        ShellbarSeparatorComponent,
+                        ShellbarHidePriorityDirective
                     ],
                     exports: [
                         ShellbarComponent,
@@ -878,6 +1158,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
                         ShellbarTitleComponent,
                         ShellbarUserMenuComponent,
                         ShellbarSidenavDirective,
+                        ShellbarUserMenuButtonDirective,
+                        ShellbarSidenavDirective,
+                        ShellbarBrandingComponent,
+                        ShellbarContextAreaComponent,
+                        ShellbarSeparatorComponent,
+                        ShellbarHidePriorityDirective,
                         ContentDensityModule
                     ]
                 }]
@@ -887,5 +1173,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { FD_SHELLBAR_ACTION_COMPONENT, FD_SHELLBAR_COMPONENT, FD_SHELLBAR_SEARCH_COMPONENT, FD_SHELLBAR_SEARCH_CONFIG, ProductMenuComponent, ShellbarActionComponent, ShellbarActionsComponent, ShellbarActionsMobileComponent, ShellbarComponent, ShellbarLogoComponent, ShellbarModule, ShellbarSidenavDirective, ShellbarSubtitleComponent, ShellbarTitleComponent, ShellbarUserMenuButtonDirective, ShellbarUserMenuComponent };
+export { FD_SHELLBAR_ACTION_COMPONENT, FD_SHELLBAR_COMPONENT, FD_SHELLBAR_SEARCH_COMPONENT, FD_SHELLBAR_SEARCH_CONFIG, ProductMenuComponent, ShellbarActionComponent, ShellbarActionsComponent, ShellbarActionsMobileComponent, ShellbarBrandingComponent, ShellbarComponent, ShellbarContextAreaComponent, ShellbarHidePriorityDirective, ShellbarLogoComponent, ShellbarModule, ShellbarSeparatorComponent, ShellbarSidenavDirective, ShellbarSubtitleComponent, ShellbarTitleComponent, ShellbarUserMenuButtonDirective, ShellbarUserMenuComponent };
 //# sourceMappingURL=fundamental-ngx-core-shellbar.mjs.map