@memberjunction/ng-explorer-core 5.47.0 → 5.48.0

package/dist/lib/shell/shell.component.js

@@ -6,10 +6,12 @@ import { LogStatus, LogError, StartupManager, CompositeKey } from '@memberjuncti
 import { MJEventType, MJGlobal, uuidv4, UUIDsEqual } from '@memberjunction/global';
 import { EventCodes, SharedService, SYSTEM_APP_ID } from '@memberjunction/ng-shared';
 import { MJNotificationService } from '@memberjunction/ng-notifications';
+import { IsOmnibarAvailable, IsOmnibarEnabledForUser, OMNIBAR_PROMO_DISMISSED_KEY, OMNIBAR_USER_SETTING_KEY } from '../omnibar/omnibar-user-setting';
+import { GetOmnibarShortcutLabel } from '../omnibar/omnibar-shortcut';
 import { getActiveTheme } from './loading-themes';
 import { TabContainerComponent } from './components/tabs/tab-container.component';
 import { BaseUserMenu, isUserMenuDivider } from '../user-menu';
-import { InstanceConfigEngine } from '@memberjunction/core-entities';
+import { InstanceConfigEngine, UserInfoEngine } from '@memberjunction/core-entities';
 import { PACKAGE_VERSION } from '@memberjunction/graphql-dataprovider';
 import { BaseAngularComponent } from '@memberjunction/ng-base-types';
 import * as i0 from "@angular/core";
@@ -34,13 +36,15 @@ import * as i18 from "./components/header/app-nav.component";
 import * as i19 from "./components/tabs/tab-container.component";
 import * as i20 from "./components/dialogs/app-access-dialog.component";
 import * as i21 from "../command-palette/command-palette.component";
+import * as i22 from "../omnibar/omnibar-palette.component";
 const _c0 = ["searchInput"];
-const _c1 = ["shellSearchComposite"];
-const _c2 = ["appAccessDialog"];
+const _c1 = ["omnibarPalette"];
+const _c2 = ["shellSearchComposite"];
+const _c3 = ["appAccessDialog"];
 const _forTrack0 = ($index, $item) => $item.ID;
 function ShellComponent_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 47);
+    i0.ɵɵelementStart(0, "button", 49);
     i0.ɵɵlistener("click", function ShellComponent_Conditional_5_For_2_Template_button_click_0_listener($event) { const app_r3 = i0.ɵɵrestoreView(_r2).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppClick(app_r3, $event)); })("dblclick", function ShellComponent_Conditional_5_For_2_Template_button_dblclick_0_listener($event) { const app_r3 = i0.ɵɵrestoreView(_r2).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppDblClick(app_r3, $event)); });
     i0.ɵɵelement(1, "i");
     i0.ɵɵelementEnd();
@@ -54,8 +58,8 @@ function ShellComponent_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵclassMap(app_r3.Icon);
 } }
 function ShellComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 8);
-    i0.ɵɵrepeaterCreate(1, ShellComponent_Conditional_5_For_2_Template, 2, 7, "button", 46, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵrepeaterCreate(1, ShellComponent_Conditional_5_For_2_Template, 2, 7, "button", 48, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
@@ -64,7 +68,7 @@ function ShellComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
 } }
 function ShellComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-app-switcher", 48);
+    i0.ɵɵelementStart(0, "mj-app-switcher", 50);
     i0.ɵɵlistener("appSelected", function ShellComponent_Conditional_6_Template_mj_app_switcher_appSelected_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onAppSwitch($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -73,25 +77,54 @@ function ShellComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
 } }
 function ShellComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-app-nav", 49);
+    i0.ɵɵelementStart(0, "mj-app-nav", 51);
     i0.ɵɵlistener("navItemClick", function ShellComponent_Conditional_7_Template_mj_app_nav_navItemClick_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemClick($event)); })("navItemDismiss", function ShellComponent_Conditional_7_Template_mj_app_nav_navItemDismiss_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemDismiss($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵproperty("app", ctx_r3.activeApp);
 } }
-function ShellComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_Conditional_10_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 11)(1, "mj-search-composite", 50, 2);
-    i0.ɵɵlistener("ResultSelected", function ShellComponent_Conditional_8_Template_mj_search_composite_ResultSelected_1_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.OnSearchResultSelected($event)); })("SearchSubmitted", function ShellComponent_Conditional_8_Template_mj_search_composite_SearchSubmitted_1_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.OnSearchSubmitted($event)); })("SeeAllRequested", function ShellComponent_Conditional_8_Template_mj_search_composite_SeeAllRequested_1_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.OnSeeAllSearch($event)); });
+    i0.ɵɵelementStart(0, "button", 53);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_10_Conditional_0_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnHeaderSearchClick()); });
+    i0.ɵɵelement(1, "i", 54);
+    i0.ɵɵelementStart(2, "span", 55);
+    i0.ɵɵtext(3, "Search everything");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "kbd", 56);
+    i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r3 = i0.ɵɵnextContext();
+    const ctx_r3 = i0.ɵɵnextContext(2);
+    i0.ɵɵattribute("aria-label", "Search everything (" + ctx_r3.OmnibarShortcutLabel + ")");
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r3.OmnibarShortcutLabel);
+} }
+function ShellComponent_Conditional_10_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 57)(1, "mj-search-composite", 58, 3);
+    i0.ɵɵlistener("ResultSelected", function ShellComponent_Conditional_10_Conditional_1_Template_mj_search_composite_ResultSelected_1_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnSearchResultSelected($event)); })("SearchSubmitted", function ShellComponent_Conditional_10_Conditional_1_Template_mj_search_composite_SearchSubmitted_1_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnSearchSubmitted($event)); })("SeeAllRequested", function ShellComponent_Conditional_10_Conditional_1_Template_mj_search_composite_SeeAllRequested_1_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnSeeAllSearch($event)); })("RecentRecordSelected", function ShellComponent_Conditional_10_Conditional_1_Template_mj_search_composite_RecentRecordSelected_1_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnSearchResultSelected($event)); })("PromoAccepted", function ShellComponent_Conditional_10_Conditional_1_Template_mj_search_composite_PromoAccepted_1_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnOmnibarPromoAccepted($event)); })("PromoDismissed", function ShellComponent_Conditional_10_Conditional_1_Template_mj_search_composite_PromoDismissed_1_listener() { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnOmnibarPromoDismissed()); });
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(3, "button", 59);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_10_Conditional_1_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.OnHeaderSearchClick()); });
+    i0.ɵɵelement(4, "i", 54);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r3 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ShowShortcutHint", true)("EnablePreview", ctx_r3.ShowSearchPreview)("EnableRecent", true)("MaxPreviewResults", 8);
+    i0.ɵɵproperty("ShowShortcutHint", true)("EnablePreview", ctx_r3.ShowSearchPreview)("EnableRecent", true)("MaxPreviewResults", 8)("ShowPromo", ctx_r3.ShowOmnibarPromo)("PromoText", ctx_r3.OmnibarPromoText);
+    i0.ɵɵadvance(2);
+    i0.ɵɵattribute("aria-label", "Search everything (" + ctx_r3.OmnibarShortcutLabel + ")");
+} }
+function ShellComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, ShellComponent_Conditional_10_Conditional_0_Template, 6, 2, "button", 52)(1, ShellComponent_Conditional_10_Conditional_1_Template, 5, 7);
+} if (rf & 2) {
+    const ctx_r3 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(ctx_r3.UseOmnibar ? 0 : 1);
 } }
 function ShellComponent_Conditional_11_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 53);
+    i0.ɵɵelementStart(0, "span", 62);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -100,57 +133,57 @@ function ShellComponent_Conditional_11_Conditional_3_Template(rf, ctx) { if (rf
     i0.ɵɵtextInterpolate(ctx_r3.activityRunningCount);
 } }
 function ShellComponent_Conditional_11_Conditional_4_For_8_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 65);
+    i0.ɵɵelementStart(0, "div", 74);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const a_r10 = i0.ɵɵnextContext().$implicit;
+    const a_r11 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(a_r10.Detail);
+    i0.ɵɵtextInterpolate(a_r11.Detail);
 } }
 function ShellComponent_Conditional_11_Conditional_4_For_8_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 66);
-    i0.ɵɵelement(1, "div", 67);
+    i0.ɵɵelementStart(0, "div", 75);
+    i0.ɵɵelement(1, "div", 76);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const a_r10 = i0.ɵɵnextContext().$implicit;
+    const a_r11 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵstyleProp("width", a_r10.Progress, "%");
+    i0.ɵɵstyleProp("width", a_r11.Progress, "%");
 } }
 function ShellComponent_Conditional_11_Conditional_4_For_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 61);
-    i0.ɵɵelement(1, "i", 62);
-    i0.ɵɵelementStart(2, "div", 63)(3, "div", 64);
+    i0.ɵɵelementStart(0, "div", 70);
+    i0.ɵɵelement(1, "i", 71);
+    i0.ɵɵelementStart(2, "div", 72)(3, "div", 73);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(5, ShellComponent_Conditional_11_Conditional_4_For_8_Conditional_5_Template, 2, 1, "div", 65);
-    i0.ɵɵconditionalCreate(6, ShellComponent_Conditional_11_Conditional_4_For_8_Conditional_6_Template, 2, 2, "div", 66);
+    i0.ɵɵconditionalCreate(5, ShellComponent_Conditional_11_Conditional_4_For_8_Conditional_5_Template, 2, 1, "div", 74);
+    i0.ɵɵconditionalCreate(6, ShellComponent_Conditional_11_Conditional_4_For_8_Conditional_6_Template, 2, 2, "div", 75);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const a_r10 = ctx.$implicit;
-    i0.ɵɵclassProp("is-error", a_r10.Status === "error");
+    const a_r11 = ctx.$implicit;
+    i0.ɵɵclassProp("is-error", a_r11.Status === "error");
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(a_r10.Status === "running" ? "fa-solid fa-spinner fa-spin" : a_r10.Status === "error" ? "fa-solid fa-circle-exclamation" : "fa-solid fa-circle-check");
+    i0.ɵɵclassMap(a_r11.Status === "running" ? "fa-solid fa-spinner fa-spin" : a_r11.Status === "error" ? "fa-solid fa-circle-exclamation" : "fa-solid fa-circle-check");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(a_r10.Label);
+    i0.ɵɵtextInterpolate(a_r11.Label);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(a_r10.Detail ? 5 : -1);
+    i0.ɵɵconditional(a_r11.Detail ? 5 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(a_r10.Status === "running" && a_r10.Progress != null ? 6 : -1);
+    i0.ɵɵconditional(a_r11.Status === "running" && a_r11.Progress != null ? 6 : -1);
 } }
 function ShellComponent_Conditional_11_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 55);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_11_Conditional_4_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r9); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(1, "div", 56)(2, "span");
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 64);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_11_Conditional_4_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r10); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(1, "div", 65)(2, "span");
     i0.ɵɵtext(3, "Activity");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "button", 57);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_11_Conditional_4_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r9); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.clearFinishedActivity()); });
-    i0.ɵɵelement(5, "i", 58);
+    i0.ɵɵelementStart(4, "button", 66);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_11_Conditional_4_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r10); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.clearFinishedActivity()); });
+    i0.ɵɵelement(5, "i", 67);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "div", 59);
-    i0.ɵɵrepeaterCreate(7, ShellComponent_Conditional_11_Conditional_4_For_8_Template, 7, 7, "div", 60, _forTrack0);
+    i0.ɵɵelementStart(6, "div", 68);
+    i0.ɵɵrepeaterCreate(7, ShellComponent_Conditional_11_Conditional_4_For_8_Template, 7, 7, "div", 69, _forTrack0);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext(2);
@@ -158,13 +191,13 @@ function ShellComponent_Conditional_11_Conditional_4_Template(rf, ctx) { if (rf
     i0.ɵɵrepeater(ctx_r3.activityItems);
 } }
 function ShellComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 14)(1, "button", 51);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_11_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.toggleActivity($event)); });
-    i0.ɵɵelement(2, "i", 52);
-    i0.ɵɵconditionalCreate(3, ShellComponent_Conditional_11_Conditional_3_Template, 2, 1, "span", 53);
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 14)(1, "button", 60);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_11_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.toggleActivity($event)); });
+    i0.ɵɵelement(2, "i", 61);
+    i0.ɵɵconditionalCreate(3, ShellComponent_Conditional_11_Conditional_3_Template, 2, 1, "span", 62);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, ShellComponent_Conditional_11_Conditional_4_Template, 9, 0, "div", 54);
+    i0.ɵɵconditionalCreate(4, ShellComponent_Conditional_11_Conditional_4_Template, 9, 0, "div", 63);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
@@ -185,23 +218,23 @@ function ShellComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate1(" ", ctx_r3.unreadNotificationCount > 99 ? "99+" : ctx_r3.unreadNotificationCount, " ");
 } }
 function ShellComponent_Conditional_15_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 47);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_15_For_2_Template_button_click_0_listener($event) { const app_r12 = i0.ɵɵrestoreView(_r11).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppClick(app_r12, $event)); })("dblclick", function ShellComponent_Conditional_15_For_2_Template_button_dblclick_0_listener($event) { const app_r12 = i0.ɵɵrestoreView(_r11).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppDblClick(app_r12, $event)); });
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 49);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_15_For_2_Template_button_click_0_listener($event) { const app_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppClick(app_r13, $event)); })("dblclick", function ShellComponent_Conditional_15_For_2_Template_button_dblclick_0_listener($event) { const app_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppDblClick(app_r13, $event)); });
     i0.ɵɵelement(1, "i");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const app_r12 = ctx.$implicit;
+    const app_r13 = ctx.$implicit;
     const ctx_r3 = i0.ɵɵnextContext(2);
-    i0.ɵɵstyleProp("--app-color", app_r12.GetColor());
-    i0.ɵɵclassProp("active", ctx_r3.IsActiveApp(app_r12));
-    i0.ɵɵproperty("title", app_r12.Name);
+    i0.ɵɵstyleProp("--app-color", app_r13.GetColor());
+    i0.ɵɵclassProp("active", ctx_r3.IsActiveApp(app_r13));
+    i0.ɵɵproperty("title", app_r13.Name);
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(app_r12.Icon);
+    i0.ɵɵclassMap(app_r13.Icon);
 } }
 function ShellComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 18);
-    i0.ɵɵrepeaterCreate(1, ShellComponent_Conditional_15_For_2_Template, 2, 7, "button", 46, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵrepeaterCreate(1, ShellComponent_Conditional_15_For_2_Template, 2, 7, "button", 48, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
@@ -224,161 +257,161 @@ function ShellComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵclassMap(ctx_r3.userIconClass || "fa-solid fa-user");
 } }
 function ShellComponent_Conditional_20_Conditional_1_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 72);
+    i0.ɵɵelementStart(0, "span", 81);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    let tmp_5_0;
+    let tmp_6_0;
     const ctx_r3 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", (tmp_5_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_5_0.email, " ");
+    i0.ɵɵtextInterpolate1(" ", (tmp_6_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_6_0.email, " ");
 } }
 function ShellComponent_Conditional_20_Conditional_1_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 73);
+    i0.ɵɵelementStart(0, "span", 82);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    let tmp_5_0;
+    let tmp_6_0;
     const ctx_r3 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate((tmp_5_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_5_0.subtitle);
+    i0.ɵɵtextInterpolate((tmp_6_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_6_0.subtitle);
 } }
 function ShellComponent_Conditional_20_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 69)(1, "div", 70)(2, "span", 71);
+    i0.ɵɵelementStart(0, "div", 78)(1, "div", 79)(2, "span", 80);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, ShellComponent_Conditional_20_Conditional_1_Conditional_4_Template, 2, 1, "span", 72);
-    i0.ɵɵconditionalCreate(5, ShellComponent_Conditional_20_Conditional_1_Conditional_5_Template, 2, 1, "span", 73);
+    i0.ɵɵconditionalCreate(4, ShellComponent_Conditional_20_Conditional_1_Conditional_4_Template, 2, 1, "span", 81);
+    i0.ɵɵconditionalCreate(5, ShellComponent_Conditional_20_Conditional_1_Conditional_5_Template, 2, 1, "span", 82);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(6, "div", 74);
+    i0.ɵɵelement(6, "div", 83);
 } if (rf & 2) {
-    let tmp_4_0;
     let tmp_5_0;
     let tmp_6_0;
+    let tmp_7_0;
     const ctx_r3 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(((tmp_4_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_4_0.name) || ctx_r3.userName);
+    i0.ɵɵtextInterpolate(((tmp_5_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_5_0.name) || ctx_r3.userName);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(((tmp_5_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_5_0.showUserEmail) && ((tmp_5_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_5_0.email) ? 4 : -1);
+    i0.ɵɵconditional(((tmp_6_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_6_0.showUserEmail) && ((tmp_6_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_6_0.email) ? 4 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(((tmp_6_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_6_0.subtitle) ? 5 : -1);
+    i0.ɵɵconditional(((tmp_7_0 = ctx_r3.getUserDisplayInfo()) == null ? null : tmp_7_0.subtitle) ? 5 : -1);
 } }
 function ShellComponent_Conditional_20_For_3_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "div", 74);
+    i0.ɵɵelement(0, "div", 83);
 } }
 function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    const _r13 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 77);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_0_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r13); const item_r14 = i0.ɵɵnextContext(); const ctx_r3 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r3.onUserMenuItemClick(item_r14.id)); });
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 86);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_0_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const item_r15 = i0.ɵɵnextContext(); const ctx_r3 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r3.onUserMenuItemClick(item_r15.id)); });
     i0.ɵɵelement(1, "i");
-    i0.ɵɵelementStart(2, "span", 78);
+    i0.ɵɵelementStart(2, "span", 87);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 79)(5, "div", 80);
-    i0.ɵɵelement(6, "i", 81);
+    i0.ɵɵelementStart(4, "div", 88)(5, "div", 89);
+    i0.ɵɵelement(6, "i", 90);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const item_r14 = i0.ɵɵnextContext();
+    const item_r15 = i0.ɵɵnextContext();
     const ctx_r3 = i0.ɵɵnextContext(4);
-    i0.ɵɵproperty("title", item_r14.tooltip || "");
+    i0.ɵɵproperty("title", item_r15.tooltip || "");
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(item_r14.icon);
+    i0.ɵɵclassMap(item_r15.icon);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r14.label);
+    i0.ɵɵtextInterpolate(item_r15.label);
     i0.ɵɵadvance();
     i0.ɵɵclassProp("dark", ctx_r3.IsDarkMode);
     i0.ɵɵadvance(2);
     i0.ɵɵclassMap(ctx_r3.IsDarkMode ? "fa-solid fa-moon" : "fa-solid fa-sun");
 } }
 function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 83);
+    i0.ɵɵelementStart(0, "span", 92);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const item_r14 = i0.ɵɵnextContext(2);
+    const item_r15 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(item_r14.shortcut);
+    i0.ɵɵtextInterpolate(item_r15.shortcut);
 } }
 function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 82);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r15); const item_r14 = i0.ɵɵnextContext(); const ctx_r3 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(item_r14.enabled && ctx_r3.onUserMenuItemClick(item_r14.id)); });
+    const _r16 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 91);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r16); const item_r15 = i0.ɵɵnextContext(); const ctx_r3 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(item_r15.enabled && ctx_r3.onUserMenuItemClick(item_r15.id)); });
     i0.ɵɵelement(1, "i");
-    i0.ɵɵelementStart(2, "span", 78);
+    i0.ɵɵelementStart(2, "span", 87);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Conditional_4_Template, 2, 1, "span", 83);
+    i0.ɵɵconditionalCreate(4, ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Conditional_4_Template, 2, 1, "span", 92);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const item_r14 = i0.ɵɵnextContext();
-    i0.ɵɵstyleProp("color", item_r14.color || null);
-    i0.ɵɵclassProp("disabled", !item_r14.enabled)("danger", item_r14.cssClass === "danger");
-    i0.ɵɵproperty("title", item_r14.tooltip || "");
+    const item_r15 = i0.ɵɵnextContext();
+    i0.ɵɵstyleProp("color", item_r15.color || null);
+    i0.ɵɵclassProp("disabled", !item_r15.enabled)("danger", item_r15.cssClass === "danger");
+    i0.ɵɵproperty("title", item_r15.tooltip || "");
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(item_r14.icon);
+    i0.ɵɵclassMap(item_r15.icon);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r14.label);
+    i0.ɵɵtextInterpolate(item_r15.label);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(item_r14.shortcut ? 4 : -1);
+    i0.ɵɵconditional(item_r15.shortcut ? 4 : -1);
 } }
 function ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_0_Template, 7, 8, "div", 75)(1, ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Template, 5, 11, "div", 76);
+    i0.ɵɵconditionalCreate(0, ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_0_Template, 7, 8, "div", 84)(1, ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Conditional_1_Template, 5, 11, "div", 85);
 } if (rf & 2) {
     i0.ɵɵconditional(ctx.id === "toggle-theme" ? 0 : 1);
 } }
 function ShellComponent_Conditional_20_For_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵconditionalCreate(0, ShellComponent_Conditional_20_For_3_Conditional_1_Conditional_0_Template, 2, 1);
 } if (rf & 2) {
-    let tmp_14_0;
-    const element_r16 = i0.ɵɵnextContext().$implicit;
+    let tmp_15_0;
+    const element_r17 = i0.ɵɵnextContext().$implicit;
     const ctx_r3 = i0.ɵɵnextContext(2);
-    i0.ɵɵconditional((tmp_14_0 = ctx_r3.asMenuItem(element_r16)) ? 0 : -1, tmp_14_0);
+    i0.ɵɵconditional((tmp_15_0 = ctx_r3.asMenuItem(element_r17)) ? 0 : -1, tmp_15_0);
 } }
 function ShellComponent_Conditional_20_For_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, ShellComponent_Conditional_20_For_3_Conditional_0_Template, 1, 0, "div", 74);
+    i0.ɵɵconditionalCreate(0, ShellComponent_Conditional_20_For_3_Conditional_0_Template, 1, 0, "div", 83);
     i0.ɵɵconditionalCreate(1, ShellComponent_Conditional_20_For_3_Conditional_1_Template, 1, 1);
 } if (rf & 2) {
-    const element_r16 = ctx.$implicit;
+    const element_r17 = ctx.$implicit;
     const ctx_r3 = i0.ɵɵnextContext(2);
-    i0.ɵɵconditional(ctx_r3.isMenuDivider(element_r16) ? 0 : -1);
+    i0.ɵɵconditional(ctx_r3.isMenuDivider(element_r17) ? 0 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(!ctx_r3.isMenuDivider(element_r16) ? 1 : -1);
+    i0.ɵɵconditional(!ctx_r3.isMenuDivider(element_r17) ? 1 : -1);
 } }
 function ShellComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 68);
+    i0.ɵɵelementStart(0, "div", 77);
     i0.ɵɵconditionalCreate(1, ShellComponent_Conditional_20_Conditional_1_Template, 7, 3);
     i0.ɵɵrepeaterCreate(2, ShellComponent_Conditional_20_For_3_Template, 2, 2, null, null, i0.ɵɵrepeaterTrackByIdentity);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    let tmp_3_0;
     let tmp_4_0;
     let tmp_5_0;
+    let tmp_6_0;
     const ctx_r3 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("menu-fade", ((tmp_3_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_3_0.animationStyle) === "fade")("menu-slide", ((tmp_4_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_4_0.animationStyle) === "slide");
+    i0.ɵɵclassProp("menu-fade", ((tmp_4_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_4_0.animationStyle) === "fade")("menu-slide", ((tmp_5_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_5_0.animationStyle) === "slide");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(((tmp_5_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_5_0.showUserName) ? 1 : -1);
+    i0.ɵɵconditional(((tmp_6_0 = ctx_r3.getUserMenuOptions()) == null ? null : tmp_6_0.showUserName) ? 1 : -1);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r3.userMenuElements);
 } }
 function ShellComponent_Conditional_21_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 84);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_21_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.closeSearch()); });
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 93);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_21_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.closeSearch()); });
     i0.ɵɵelementEnd();
 } }
 function ShellComponent_Conditional_29_Template(rf, ctx) { if (rf & 1) {
-    const _r18 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 85);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_29_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.closeMobileNav()); });
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 94);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_29_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.closeMobileNav()); });
     i0.ɵɵelementEnd();
 } }
 function ShellComponent_Conditional_36_Template(rf, ctx) { if (rf & 1) {
-    const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 36)(1, "div", 86);
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 36)(1, "div", 95);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "mj-app-nav", 87);
-    i0.ɵɵlistener("navItemClick", function ShellComponent_Conditional_36_Template_mj_app_nav_navItemClick_3_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemClick($event)); })("navItemDismiss", function ShellComponent_Conditional_36_Template_mj_app_nav_navItemDismiss_3_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemDismiss($event)); });
+    i0.ɵɵelementStart(3, "mj-app-nav", 96);
+    i0.ɵɵlistener("navItemClick", function ShellComponent_Conditional_36_Template_mj_app_nav_navItemClick_3_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemClick($event)); })("navItemDismiss", function ShellComponent_Conditional_36_Template_mj_app_nav_navItemDismiss_3_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemDismiss($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
@@ -397,22 +430,22 @@ function ShellComponent_Conditional_46_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate1(" ", ctx_r3.unreadNotificationCount > 99 ? "99+" : ctx_r3.unreadNotificationCount, " ");
 } }
 function ShellComponent_Conditional_48_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    const _r20 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 89)(1, "p", 91);
-    i0.ɵɵelement(2, "i", 92);
+    const _r21 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 98)(1, "p", 100);
+    i0.ɵɵelement(2, "i", 101);
     i0.ɵɵtext(3, " Taking longer than expected ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "p", 93);
+    i0.ɵɵelementStart(4, "p", 102);
     i0.ɵɵtext(5, " This can happen after updates or due to cached data issues. ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "button", 94);
-    i0.ɵɵlistener("click", function ShellComponent_Conditional_48_Conditional_2_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r20); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.ResetApplication()); });
-    i0.ɵɵelement(7, "i", 95);
+    i0.ɵɵelementStart(6, "button", 103);
+    i0.ɵɵlistener("click", function ShellComponent_Conditional_48_Conditional_2_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r21); const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.ResetApplication()); });
+    i0.ɵɵelement(7, "i", 104);
     i0.ɵɵtext(8, " Reset ");
     i0.ɵɵelementEnd()();
 } }
 function ShellComponent_Conditional_48_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 90);
+    i0.ɵɵelementStart(0, "div", 99);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -422,8 +455,8 @@ function ShellComponent_Conditional_48_Conditional_3_Template(rf, ctx) { if (rf
 } }
 function ShellComponent_Conditional_48_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 42);
-    i0.ɵɵelement(1, "mj-loading", 88);
-    i0.ɵɵconditionalCreate(2, ShellComponent_Conditional_48_Conditional_2_Template, 9, 0, "div", 89)(3, ShellComponent_Conditional_48_Conditional_3_Template, 2, 1, "div", 90);
+    i0.ɵɵelement(1, "mj-loading", 97);
+    i0.ɵɵconditionalCreate(2, ShellComponent_Conditional_48_Conditional_2_Template, 9, 0, "div", 98)(3, ShellComponent_Conditional_48_Conditional_3_Template, 2, 1, "div", 99);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r3 = i0.ɵɵnextContext();
@@ -432,10 +465,21 @@ function ShellComponent_Conditional_48_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r3.ShowResetOption ? 2 : 3);
 } }
-function ShellComponent_Conditional_52_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 45)(1, "div", 96);
-    i0.ɵɵelement(2, "mj-loading", 97);
-    i0.ɵɵelementStart(3, "span", 98);
+function ShellComponent_Conditional_54_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-search-overlay", 105);
+    i0.ɵɵtwoWayListener("IsOpenChange", function ShellComponent_Conditional_54_Template_mj_search_overlay_IsOpenChange_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r3 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r3.LegacySearchOpen, $event) || (ctx_r3.LegacySearchOpen = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("ResultSelected", function ShellComponent_Conditional_54_Template_mj_search_overlay_ResultSelected_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.OnOverlayResultSelected($event)); })("SeeAllRequested", function ShellComponent_Conditional_54_Template_mj_search_overlay_SeeAllRequested_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.OnOverlaySeeAll($event)); })("PromoAccepted", function ShellComponent_Conditional_54_Template_mj_search_overlay_PromoAccepted_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.OnOmnibarPromoAccepted($event)); })("PromoDismissed", function ShellComponent_Conditional_54_Template_mj_search_overlay_PromoDismissed_0_listener() { i0.ɵɵrestoreView(_r22); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.OnOmnibarPromoDismissed()); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r3 = i0.ɵɵnextContext();
+    i0.ɵɵtwoWayProperty("IsOpen", ctx_r3.LegacySearchOpen);
+    i0.ɵɵproperty("EnableGlobalShortcut", false)("ShowPromo", ctx_r3.ShowOmnibarPromo)("PromoText", ctx_r3.OmnibarPromoText);
+} }
+function ShellComponent_Conditional_55_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 47)(1, "div", 106);
+    i0.ɵɵelement(2, "mj-loading", 107);
+    i0.ɵɵelementStart(3, "span", 108);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -539,8 +583,10 @@ export class ShellComponent extends BaseAngularComponent {
     searchableEntities = [];
     selectedEntity = null;
     searchInput;
-    // Universal search bar
-    shellSearchComposite;
+    // Legacy universal search overlay (omnibar-off MOBILE path) — opened by the
+    // mobile search icon or Ctrl/Cmd+K when the inline composite isn't visible.
+    // Desktop omnibar-off uses the inline header composite instead.
+    LegacySearchOpen = false;
     // Instance configuration feature flags
     get ShowSearchBar() {
         return InstanceConfigEngine.Instance.GetBoolean('Shell.SearchBar.Enabled', true);
@@ -548,6 +594,79 @@ export class ShellComponent extends BaseAngularComponent {
     get ShowSearchPreview() {
         return InstanceConfigEngine.Instance.GetBoolean('Shell.SearchBar.EnablePreview', true);
     }
+    /**
+     * Two-layer gate for the unified Ctrl+K command palette (omnibar):
+     * the 'Shell.Omnibar.Enabled' Instance Config row is the master AVAILABILITY
+     * switch (default TRUE; false = legacy trio for everyone), and each user
+     * opts in personally via My Profile → Command Palette (a UserInfoEngine
+     * setting, so the choice follows them across devices). ON = the header shows
+     * the palette affordance and Ctrl+K / Ctrl+/ open the palette; OFF = the
+     * legacy trio (search composite + app command palette + search popup) behaves
+     * exactly as before. Both reads are synchronous cache hits.
+     */
+    get UseOmnibar() {
+        return IsOmnibarEnabledForUser();
+    }
+    /** Platform-correct summon-shortcut label ('⌘K' on Mac, 'Ctrl+K' elsewhere). */
+    get OmnibarShortcutLabel() {
+        return GetOmnibarShortcutLabel();
+    }
+    /**
+     * Whether the legacy search surfaces advertise the omnibar: the instance makes
+     * it available, the user hasn't opted in yet, and they haven't dismissed the
+     * promo. Fail-closed (never advertise during boot / permission constraints).
+     */
+    get ShowOmnibarPromo() {
+        try {
+            return IsOmnibarAvailable()
+                && !IsOmnibarEnabledForUser()
+                && UserInfoEngine.Instance.GetSetting(OMNIBAR_PROMO_DISMISSED_KEY) !== 'true';
+        }
+        catch {
+            return false;
+        }
+    }
+    /** Promo copy shown in the legacy search surfaces. */
+    OmnibarPromoText = 'Try the new command palette — search, jump to records, switch apps, and message agents from one box.';
+    /**
+     * Promo accepted: opt the user in (same UserInfoEngine setting as the My
+     * Profile toggle, so it follows them across devices), then open the palette
+     * pre-seeded with whatever they were just searching — same query, new
+     * surface, immediate demonstration.
+     */
+    OnOmnibarPromoAccepted(query) {
+        // Demonstration first, persistence second: close the legacy surface and open
+        // the palette with the carried query IMMEDIATELY (the palette element renders
+        // unconditionally, so it doesn't need the setting to have landed). Awaiting
+        // the server write first read as a dead click on slow links.
+        this.LegacySearchOpen = false;
+        this.cdr.detectChanges();
+        this.OpenOmnibar(query?.trim() ?? '');
+        void UserInfoEngine.Instance.SetSetting(OMNIBAR_USER_SETTING_KEY, 'true').then((saved) => {
+            if (!saved) {
+                LogError('Omnibar promo opt-in failed to persist — palette will open for this session only');
+            }
+        });
+    }
+    /** Promo dismissed: persist server-side so it never shows again, on any device. */
+    OnOmnibarPromoDismissed() {
+        UserInfoEngine.Instance.SetSettingDebounced(OMNIBAR_PROMO_DISMISSED_KEY, 'true');
+    }
+    /** Palette footer gear → My Profile (where the Command Palette section lives). */
+    OnPaletteSettingsRequested() {
+        this.profileDialogService.open(this.viewContainerRef, {
+            avatarUrl: this.userImageURL || null,
+            avatarIconClass: this.userIconClass || null
+        });
+    }
+    omnibarPalette;
+    /** Legacy inline search composite (omnibar-off desktop). Structural typing keeps
+        the shell decoupled from the ng-search component class. */
+    shellSearchComposite;
+    /** Header affordance click → open the palette. */
+    OpenOmnibar(initialQuery = '') {
+        this.omnibarPalette?.Open(initialQuery);
+    }
     // Tab container reference for thumbnail capture
     tabContainerRef;
     // App access dialog
@@ -2561,19 +2680,27 @@ export class ShellComponent extends BaseAngularComponent {
      * Cmd+/ (Mac) or Ctrl+/ (Windows) opens the command palette
      */
     handleGlobalKeyboardShortcuts(event) {
-        // Skip if user is typing in an input/textarea
+        // Skip if user is typing in an input/textarea — EXCEPT when the omnibar is on:
+        // a modal palette is summonable from anywhere (incl. the chat composer), like
+        // Slack/Linear. The legacy path keeps the guard (its binding steals focus).
         const target = event.target;
-        if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable) {
+        const inEditable = target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable;
+        if (inEditable && !this.UseOmnibar) {
             return;
         }
         // Platform detection
         const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
         const isCtrlOrCmd = isMac ? event.metaKey : event.ctrlKey;
-        // Cmd+/ or Ctrl+/ opens command palette
+        // Cmd+/ or Ctrl+/ opens the palette (omnibar '/' mode when enabled, legacy otherwise)
         if (isCtrlOrCmd && event.key === '/') {
             event.preventDefault();
             event.stopPropagation();
-            this.commandPaletteService.Open();
+            if (this.UseOmnibar) {
+                this.OpenOmnibar('/');
+            }
+            else {
+                this.commandPaletteService.Open();
+            }
         }
     }
     /**
@@ -2679,6 +2806,10 @@ export class ShellComponent extends BaseAngularComponent {
      * Toggle search popup visibility
      */
     toggleSearch() {
+        if (this.UseOmnibar) {
+            this.OpenOmnibar();
+            return;
+        }
         this.isSearchOpen = !this.isSearchOpen;
         // Focus on search input when opened
         if (this.isSearchOpen) {
@@ -2729,17 +2860,41 @@ export class ShellComponent extends BaseAngularComponent {
     // UNIVERSAL SEARCH EVENT HANDLERS
     // ========================================
     OnGlobalKeydown(event) {
+        // Ctrl/Cmd+K summons search. Omnibar: the modal palette opens from anywhere,
+        // even while typing (explicit chord, Slack/Linear semantics). Legacy: the
+        // chord FOCUSES the inline header composite on desktop (results attach
+        // beneath it), so keep the don't-steal-focus-mid-typing guard; on mobile
+        // (no composite rendered) it opens the Spotlight overlay instead.
         const target = event.target;
-        if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable)
+        const inEditable = target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable;
+        if (inEditable && !this.UseOmnibar) {
             return;
+        }
         const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
         const isCtrlOrCmd = isMac ? event.metaKey : event.ctrlKey;
         if (isCtrlOrCmd && event.key === 'k') {
             event.preventDefault();
             event.stopPropagation();
-            if (this.shellSearchComposite?.Focus) {
-                this.shellSearchComposite.Focus();
-            }
+            this.OnHeaderSearchClick();
+        }
+    }
+    /** Header search affordance / Ctrl+K: route to whichever search surface applies.
+        The mobile check matters: below the breakpoint the composite is CSS-hidden
+        (.desktop-only) but its ViewChild still exists — focusing an invisible input
+        would silently eat the interaction. */
+    OnHeaderSearchClick() {
+        const isMobile = window.matchMedia('(max-width: 768px)').matches;
+        if (this.UseOmnibar) {
+            this.OpenOmnibar();
+        }
+        else if (!isMobile && this.shellSearchComposite?.Focus) {
+            // Omnibar-off desktop: the inline composite is on screen — focus it and
+            // let its attached suggest dropdown do the work.
+            this.shellSearchComposite.Focus();
+        }
+        else {
+            // Omnibar-off mobile: no visible inline composite — open the Spotlight overlay.
+            this.LegacySearchOpen = true;
         }
     }
     OnSearchResultSelected(result) {
@@ -2755,6 +2910,19 @@ export class ShellComponent extends BaseAngularComponent {
         const pkey = new CompositeKey([{ FieldName: 'ID', Value: result.RecordID }]);
         this.navigationService.OpenEntityRecord(result.EntityName, pkey);
     }
+    /** Legacy search overlay selection → same navigation path as the old composite. */
+    OnOverlayResultSelected(event) {
+        this.LegacySearchOpen = false;
+        this.OnSearchResultSelected(event.Result);
+    }
+    /** Legacy search overlay "See all results" → the full Search Results workspace
+        (same destination as the omnibar's see-all row). */
+    OnOverlaySeeAll(query) {
+        this.LegacySearchOpen = false;
+        this.navigationService.OpenSearch(query);
+    }
+    /** Inline composite submit (Enter) → full Search Results workspace, carrying the
+        composite's relevance/scope selections. */
     OnSearchSubmitted(query) {
         if (query && query.trim().length >= 2) {
             const minRelevance = this.shellSearchComposite?.MinRelevancePercent;
@@ -2767,6 +2935,7 @@ export class ShellComponent extends BaseAngularComponent {
             this.navigationService.OpenSearch(query, Object.keys(opts).length > 0 ? opts : undefined);
         }
     }
+    /** Inline composite's suggest-dropdown "See all N results" footer. */
     OnSeeAllSearch(query) {
         this.OnSearchSubmitted(query);
     }
@@ -3106,29 +3275,30 @@ export class ShellComponent extends BaseAngularComponent {
     }
     static ɵfac = function ShellComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ShellComponent)(i0.ɵɵdirectiveInject(i1.ApplicationManager), i0.ɵɵdirectiveInject(i1.WorkspaceStateManager), i0.ɵɵdirectiveInject(i1.GoldenLayoutManager), i0.ɵɵdirectiveInject(i1.TabService), i0.ɵɵdirectiveInject(i2.NavigationService), i0.ɵɵdirectiveInject(i3.ActivatedRoute), i0.ɵɵdirectiveInject(i3.Router), i0.ɵɵdirectiveInject(i4.MJAuthBase), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i5.UserAvatarService), i0.ɵɵdirectiveInject(i6.UserSharingCenterDialogService), i0.ɵɵdirectiveInject(i7.AboutDialogService), i0.ɵɵdirectiveInject(i8.ProfileDialogService), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(i2.TitleService), i0.ɵɵdirectiveInject(i2.DeveloperModeService), i0.ɵɵdirectiveInject(i9.StartupValidationService), i0.ɵɵdirectiveInject(i10.CommandPaletteService), i0.ɵɵdirectiveInject(i2.ThemeService), i0.ɵɵdirectiveInject(i2.HomeAppPinService), i0.ɵɵdirectiveInject(i11.FileOpenService), i0.ɵɵdirectiveInject(i12.FeedbackDialogService), i0.ɵɵdirectiveInject(i12.FeedbackService), i0.ɵɵdirectiveInject(i2.ActivityService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ShellComponent, selectors: [["mj-shell"]], viewQuery: function ShellComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0, 5)(_c1, 5)(TabContainerComponent, 5)(_c2, 5);
+            i0.ɵɵviewQuery(_c0, 5)(_c1, 5)(_c2, 5)(TabContainerComponent, 5)(_c3, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.searchInput = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.omnibarPalette = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.shellSearchComposite = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tabContainerRef = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.appAccessDialog = _t.first);
         } }, hostBindings: function ShellComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("keydown", function ShellComponent_keydown_HostBindingHandler($event) { return ctx.OnGlobalKeydown($event); }, i0.ɵɵresolveDocument)("click", function ShellComponent_click_HostBindingHandler() { return ctx.onDocumentClickCloseActivity(); }, i0.ɵɵresolveDocument);
-        } }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 53, vars: 27, consts: [["searchInput", ""], ["appAccessDialog", ""], ["shellSearchComposite", ""], [1, "shell-container"], [1, "shell-header"], ["title", "MemberJunction", 1, "mj-logo"], ["title", "Menu", 1, "hamburger-btn", 3, "click"], [1, "fa-solid", "fa-bars"], [1, "nav-bar-apps", "left-of-switcher"], [3, "activeApp", "isViewingSystemTab", "loadingAppId"], [1, "desktop-nav", 3, "app"], [1, "shell-search-bar", "desktop-only"], [1, "spacer"], [1, "header-actions"], [1, "activity-wrap"], ["title", "Notifications", 1, "icon-btn", "desktop-only", "notification-btn", 3, "click"], [1, "fa-solid", "fa-bell"], [1, "notification-badge"], [1, "nav-bar-apps", "left-of-user-menu"], [1, "user-menu"], [1, "avatar-btn", 3, "click"], ["alt", "User avatar", 1, "avatar-img", 3, "src"], [1, "icon-fallback"], [1, "user-context-menu", 3, "menu-fade", "menu-slide"], [1, "search-popup-overlay"], [1, "search-popup"], [1, "search-popup-content", 3, "click"], ["TextField", "Name", "ValueField", "ID", 1, "search-entity-dropdown", 3, "ngModelChange", "Data", "ngModel"], ["type", "text", "placeholder", "Search...", 1, "mj-input", "search-input", 3, "keydown.enter"], ["title", "Search", 1, "search-submit-btn", 3, "click"], [1, "fa-solid", "fa-search"], [1, "mobile-nav-overlay"], [1, "mobile-nav-drawer"], [1, "mobile-nav-header"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "mobile-nav-content"], [1, "mobile-nav-footer"], ["title", "Search", 1, "mobile-nav-action", 3, "click"], ["title", "Notifications", 1, "mobile-nav-action", 3, "click"], [1, "notification-badge-mobile"], [3, "firstResourceLoadComplete", "layoutInitError"], [1, "shell-loading"], [3, "result"], [3, "AppSelected"], [1, "pin-progress-backdrop"], [1, "nav-bar-app-btn", 3, "active", "title", "--app-color"], [1, "nav-bar-app-btn", 3, "click", "dblclick", "title"], [3, "appSelected", "activeApp", "isViewingSystemTab", "loadingAppId"], [1, "desktop-nav", 3, "navItemClick", "navItemDismiss", "app"], ["Placeholder", "Search everything...", 3, "ResultSelected", "SearchSubmitted", "SeeAllRequested", "ShowShortcutHint", "EnablePreview", "EnableRecent", "MaxPreviewResults"], ["title", "Activity", 1, "icon-btn", "desktop-only", "activity-btn", 3, "click"], [1, "fa-solid", "fa-wave-square"], [1, "activity-badge"], [1, "activity-drawer"], [1, "activity-drawer", 3, "click"], [1, "activity-drawer-head"], ["title", "Clear finished", 1, "activity-clear", 3, "click"], [1, "fa-solid", "fa-broom"], [1, "activity-list"], [1, "activity-row", 3, "is-error"], [1, "activity-row"], [1, "activity-row-icon"], [1, "activity-row-body"], [1, "activity-row-label"], [1, "activity-row-detail"], [1, "activity-bar"], [1, "activity-bar-fill"], [1, "user-context-menu"], [1, "user-menu-header"], [1, "user-info"], [1, "user-name"], [1, "user-email"], [1, "user-subtitle"], [1, "user-menu-divider"], [1, "user-menu-item", "theme-toggle-item", 3, "title"], [1, "user-menu-item", 3, "disabled", "danger", "color", "title"], [1, "user-menu-item", "theme-toggle-item", 3, "click", "title"], [1, "menu-label"], [1, "theme-toggle-track"], [1, "theme-toggle-thumb"], [1, "theme-toggle-icon"], [1, "user-menu-item", 3, "click", "title"], [1, "menu-shortcut"], [1, "search-popup-overlay", 3, "click"], [1, "mobile-nav-overlay", 3, "click"], [1, "mobile-nav-section-title"], [3, "navItemClick", "navItemDismiss", "app"], ["size", "large", 3, "text", "textColor", "logoColor", "logoGradient", "animation"], [1, "loading-reset-panel"], [1, "loading-version"], [1, "loading-reset-message"], [1, "fa-regular", "fa-clock"], [1, "loading-reset-hint"], [1, "loading-reset-btn", 3, "click"], [1, "fa-solid", "fa-arrows-rotate"], [1, "pin-progress-modal"], ["size", "small", 3, "showText"], [1, "pin-progress-text"]], template: function ShellComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 56, vars: 28, consts: [["searchInput", ""], ["appAccessDialog", ""], ["omnibarPalette", ""], ["shellSearchComposite", ""], [1, "shell-container"], [1, "shell-header"], ["title", "MemberJunction", 1, "mj-logo"], ["title", "Menu", 1, "hamburger-btn", 3, "click"], [1, "fa-solid", "fa-bars"], [1, "nav-bar-apps", "left-of-switcher"], [3, "activeApp", "isViewingSystemTab", "loadingAppId"], [1, "desktop-nav", 3, "app"], [1, "spacer"], [1, "header-actions"], [1, "activity-wrap"], ["title", "Notifications", 1, "icon-btn", "desktop-only", "notification-btn", 3, "click"], [1, "fa-solid", "fa-bell"], [1, "notification-badge"], [1, "nav-bar-apps", "left-of-user-menu"], [1, "user-menu"], [1, "avatar-btn", 3, "click"], ["alt", "User avatar", 1, "avatar-img", 3, "src"], [1, "icon-fallback"], [1, "user-context-menu", 3, "menu-fade", "menu-slide"], [1, "search-popup-overlay"], [1, "search-popup"], [1, "search-popup-content", 3, "click"], ["TextField", "Name", "ValueField", "ID", 1, "search-entity-dropdown", 3, "ngModelChange", "Data", "ngModel"], ["type", "text", "placeholder", "Search...", 1, "mj-input", "search-input", 3, "keydown.enter"], ["title", "Search", 1, "search-submit-btn", 3, "click"], [1, "fa-solid", "fa-search"], [1, "mobile-nav-overlay"], [1, "mobile-nav-drawer"], [1, "mobile-nav-header"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "mobile-nav-content"], [1, "mobile-nav-footer"], ["title", "Search", 1, "mobile-nav-action", 3, "click"], ["title", "Notifications", 1, "mobile-nav-action", 3, "click"], [1, "notification-badge-mobile"], [3, "firstResourceLoadComplete", "layoutInitError"], [1, "shell-loading"], [3, "result"], [3, "AppSelected"], [3, "SettingsRequested"], ["Placeholder", "Search everything...", 3, "IsOpen", "EnableGlobalShortcut", "ShowPromo", "PromoText"], [1, "pin-progress-backdrop"], [1, "nav-bar-app-btn", 3, "active", "title", "--app-color"], [1, "nav-bar-app-btn", 3, "click", "dblclick", "title"], [3, "appSelected", "activeApp", "isViewingSystemTab", "loadingAppId"], [1, "desktop-nav", 3, "navItemClick", "navItemDismiss", "app"], ["title", "Search everything", 1, "search-btn"], ["title", "Search everything", 1, "search-btn", 3, "click"], [1, "fa-solid", "fa-magnifying-glass"], [1, "search-btn-text", "desktop-only"], ["aria-hidden", "true", 1, "search-btn-kbd", "desktop-only"], [1, "shell-search-bar", "desktop-only"], ["Placeholder", "Search everything...", 3, "ResultSelected", "SearchSubmitted", "SeeAllRequested", "RecentRecordSelected", "PromoAccepted", "PromoDismissed", "ShowShortcutHint", "EnablePreview", "EnableRecent", "MaxPreviewResults", "ShowPromo", "PromoText"], ["title", "Search everything", 1, "search-btn", "search-btn-mobile", 3, "click"], ["title", "Activity", 1, "icon-btn", "desktop-only", "activity-btn", 3, "click"], [1, "fa-solid", "fa-wave-square"], [1, "activity-badge"], [1, "activity-drawer"], [1, "activity-drawer", 3, "click"], [1, "activity-drawer-head"], ["title", "Clear finished", 1, "activity-clear", 3, "click"], [1, "fa-solid", "fa-broom"], [1, "activity-list"], [1, "activity-row", 3, "is-error"], [1, "activity-row"], [1, "activity-row-icon"], [1, "activity-row-body"], [1, "activity-row-label"], [1, "activity-row-detail"], [1, "activity-bar"], [1, "activity-bar-fill"], [1, "user-context-menu"], [1, "user-menu-header"], [1, "user-info"], [1, "user-name"], [1, "user-email"], [1, "user-subtitle"], [1, "user-menu-divider"], [1, "user-menu-item", "theme-toggle-item", 3, "title"], [1, "user-menu-item", 3, "disabled", "danger", "color", "title"], [1, "user-menu-item", "theme-toggle-item", 3, "click", "title"], [1, "menu-label"], [1, "theme-toggle-track"], [1, "theme-toggle-thumb"], [1, "theme-toggle-icon"], [1, "user-menu-item", 3, "click", "title"], [1, "menu-shortcut"], [1, "search-popup-overlay", 3, "click"], [1, "mobile-nav-overlay", 3, "click"], [1, "mobile-nav-section-title"], [3, "navItemClick", "navItemDismiss", "app"], ["size", "large", 3, "text", "textColor", "logoColor", "logoGradient", "animation"], [1, "loading-reset-panel"], [1, "loading-version"], [1, "loading-reset-message"], [1, "fa-regular", "fa-clock"], [1, "loading-reset-hint"], [1, "loading-reset-btn", 3, "click"], [1, "fa-solid", "fa-arrows-rotate"], ["Placeholder", "Search everything...", 3, "IsOpenChange", "ResultSelected", "SeeAllRequested", "PromoAccepted", "PromoDismissed", "IsOpen", "EnableGlobalShortcut", "ShowPromo", "PromoText"], [1, "pin-progress-modal"], ["size", "small", 3, "showText"], [1, "pin-progress-text"]], template: function ShellComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
-            i0.ɵɵelementStart(0, "div", 3)(1, "header", 4);
-            i0.ɵɵelement(2, "div", 5);
-            i0.ɵɵelementStart(3, "button", 6);
+            i0.ɵɵelementStart(0, "div", 4)(1, "header", 5);
+            i0.ɵɵelement(2, "div", 6);
+            i0.ɵɵelementStart(3, "button", 7);
             i0.ɵɵlistener("click", function ShellComponent_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.toggleMobileNav()); });
-            i0.ɵɵelement(4, "i", 7);
+            i0.ɵɵelement(4, "i", 8);
             i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(5, ShellComponent_Conditional_5_Template, 3, 0, "div", 8);
-            i0.ɵɵconditionalCreate(6, ShellComponent_Conditional_6_Template, 1, 3, "mj-app-switcher", 9);
-            i0.ɵɵconditionalCreate(7, ShellComponent_Conditional_7_Template, 1, 1, "mj-app-nav", 10);
-            i0.ɵɵconditionalCreate(8, ShellComponent_Conditional_8_Template, 3, 4, "div", 11);
-            i0.ɵɵelement(9, "div", 12);
-            i0.ɵɵelementStart(10, "div", 13);
+            i0.ɵɵconditionalCreate(5, ShellComponent_Conditional_5_Template, 3, 0, "div", 9);
+            i0.ɵɵconditionalCreate(6, ShellComponent_Conditional_6_Template, 1, 3, "mj-app-switcher", 10);
+            i0.ɵɵconditionalCreate(7, ShellComponent_Conditional_7_Template, 1, 1, "mj-app-nav", 11);
+            i0.ɵɵelement(8, "div", 12);
+            i0.ɵɵelementStart(9, "div", 13);
+            i0.ɵɵconditionalCreate(10, ShellComponent_Conditional_10_Template, 2, 1);
             i0.ɵɵconditionalCreate(11, ShellComponent_Conditional_11_Template, 5, 4, "div", 14);
             i0.ɵɵelementStart(12, "button", 15);
             i0.ɵɵlistener("click", function ShellComponent_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.showNotifications()); });
@@ -3188,7 +3358,11 @@ export class ShellComponent extends BaseAngularComponent {
             i0.ɵɵelementStart(51, "mj-command-palette", 44);
             i0.ɵɵlistener("AppSelected", function ShellComponent_Template_mj_command_palette_AppSelected_51_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onAppSwitch($event)); });
             i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(52, ShellComponent_Conditional_52_Template, 5, 2, "div", 45);
+            i0.ɵɵelementStart(52, "mj-omnibar-palette", 45, 2);
+            i0.ɵɵlistener("SettingsRequested", function ShellComponent_Template_mj_omnibar_palette_SettingsRequested_52_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.OnPaletteSettingsRequested()); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(54, ShellComponent_Conditional_54_Template, 1, 4, "mj-search-overlay", 46);
+            i0.ɵɵconditionalCreate(55, ShellComponent_Conditional_55_Template, 5, 2, "div", 47);
         } if (rf & 2) {
             i0.ɵɵclassProp("hidden", ctx.loading)("tabs-visible", ctx.tabBarVisible);
             i0.ɵɵadvance(5);
@@ -3197,9 +3371,9 @@ export class ShellComponent extends BaseAngularComponent {
             i0.ɵɵconditional(!ctx.appSwitchingLocked ? 6 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.activeApp ? 7 : -1);
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.ShowSearchBar ? 8 : -1);
             i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.ShowSearchBar ? 10 : -1);
+            i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.activityItems.length > 0 ? 11 : -1);
             i0.ɵɵadvance(3);
             i0.ɵɵconditional(ctx.unreadNotificationCount > 0 ? 14 : -1);
@@ -3228,16 +3402,21 @@ export class ShellComponent extends BaseAngularComponent {
             i0.ɵɵclassProp("hide-tab-bar", !ctx.tabBarVisible);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.loading ? 48 : -1);
-            i0.ɵɵadvance(4);
-            i0.ɵɵconditional(ctx.PinProgressVisible ? 52 : -1);
-        } }, dependencies: [i13.NgControlStatus, i13.NgModel, i14.MJDropdownComponent, i15.LoadingComponent, i16.SearchCompositeComponent, i17.AppSwitcherComponent, i18.AppNavComponent, i19.TabContainerComponent, i20.AppAccessDialogComponent, i21.CommandPaletteComponent], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n}\n\n\n\n.mj-logo[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 18px;\n  background-image: var(--mj-logo-mark);\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: contain;\n  flex-shrink: 0;\n}\n\n.shell-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  position: relative;\n}\n\n\n\n\n.shell-container.hidden[_ngcontent-%COMP%] {\n  visibility: hidden;\n  position: absolute;\n  pointer-events: none;\n}\n\nmj-tab-container[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  transition: all 0.2s ease-in-out;\n}\n\n\n\nmj-tab-container.hide-tab-bar[_ngcontent-%COMP%]     .lm_header {\n  display: none;\n}\n\n\n\nmj-tab-container[_ngcontent-%COMP%]:not(.hide-tab-bar)     .lm_header {\n  opacity: 1;\n  max-height: 40px;\n  transition: opacity 0.2s ease-in-out, max-height 0.2s ease-in-out;\n}\n\n\n\nmj-tab-container.hide-tab-bar[_ngcontent-%COMP%]     .lm_content {\n  height: 100% !important;\n}\n\n\n\nmj-tab-container[_ngcontent-%COMP%]     .lm_stack {\n  transition: all 0.2s ease-in-out;\n}\n\n.shell-header[_ngcontent-%COMP%] {\n  height: 60px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: var(--mj-shadow-sm);\n  flex-shrink: 0;\n  \n\n\n  position: relative;\n  z-index: 500;\n}\n\n\n\n.nav-bar-apps[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.nav-bar-apps.left-of-switcher[_ngcontent-%COMP%] {\n  \n\n  \n\n}\n\n.nav-bar-apps.left-of-user-menu[_ngcontent-%COMP%] {\n  margin-right: 8px;\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%] {\n  --app-color: var(--mj-text-muted);\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: all 0.15s ease;\n  position: relative;\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%]:hover {\n  background: color-mix(in srgb, var(--app-color) 15%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--app-color) 20%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active[_ngcontent-%COMP%]::after {\n  content: '';\n  position: absolute;\n  bottom: 6px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 16px;\n  height: 3px;\n  background: var(--app-color);\n  border-radius: 2px;\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  transition: transform 0.15s ease;\n  margin-top: 2px; \n\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n  transform: scale(1.1);\n}\n\n.spacer[_ngcontent-%COMP%] {\n  flex: 1;\n}\n\n.header-actions[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.icon-btn[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n\n\n.notification-btn[_ngcontent-%COMP%] {\n  position: relative;\n}\n\n.notification-badge[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 4px;\n  right: 4px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n.user-menu[_ngcontent-%COMP%] {\n  position: relative;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: box-shadow 0.15s, transform 0.15s;\n  padding: 0;\n  overflow: hidden;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]:hover {\n  transform: scale(1.05);\n}\n\n\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .icon-fallback[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  border: 2px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-hover);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: border-color 0.15s;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]:hover   .icon-fallback[_ngcontent-%COMP%] {\n  border-color: var(--mj-brand-primary);\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .icon-fallback[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  font-size: 16px;\n}\n\n\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .avatar-img[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  object-fit: cover;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]:hover   .avatar-img[_ngcontent-%COMP%] {\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);\n}\n\n\n\n.user-menu-header[_ngcontent-%COMP%] {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-info[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-name[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-email[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--mj-text-muted);\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-subtitle[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n\n\n.user-context-menu[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  margin-top: 8px;\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-lg);\n  min-width: 180px;\n  z-index: 10000;\n  overflow: hidden;\n}\n\n.user-menu-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  cursor: pointer;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  transition: background 0.15s;\n}\n\n.user-menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  width: 18px;\n  text-align: center;\n  color: var(--mj-text-muted);\n  font-size: 14px;\n}\n\n.user-menu-item[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%] {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]:hover {\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface-elevated));\n}\n\n.user-menu-divider[_ngcontent-%COMP%] {\n  height: 1px;\n  background: var(--mj-border-default);\n  margin: 4px 0;\n}\n\n\n\n.user-menu-item.disabled[_ngcontent-%COMP%] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.user-menu-item.disabled[_ngcontent-%COMP%]:hover {\n  background: transparent;\n}\n\n\n\n.theme-toggle-item[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.theme-toggle-track[_ngcontent-%COMP%] {\n  position: relative;\n  width: 40px;\n  height: 22px;\n  border-radius: 11px;\n  background: var(--mj-bg-surface-active);\n  margin-left: auto;\n  transition: background 0.2s ease;\n  flex-shrink: 0;\n}\n\n.theme-toggle-track.dark[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n}\n\n.theme-toggle-thumb[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  background: var(--mj-bg-surface);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: transform 0.2s ease;\n}\n\n.theme-toggle-track.dark[_ngcontent-%COMP%]   .theme-toggle-thumb[_ngcontent-%COMP%] {\n  transform: translateX(18px);\n}\n\n.theme-toggle-icon[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n}\n\n.theme-toggle-track.dark[_ngcontent-%COMP%]   .theme-toggle-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-inverse);\n}\n\n\n\n.user-menu-item[_ngcontent-%COMP%]   .menu-shortcut[_ngcontent-%COMP%] {\n  margin-left: auto;\n  font-size: 11px;\n  color: var(--mj-text-disabled);\n  font-family: monospace;\n}\n\n\n\n.user-context-menu.menu-fade[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_menuFadeIn 0.15s ease-out;\n}\n\n.user-context-menu.menu-slide[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_menuSlideIn 0.2s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_menuFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes _ngcontent-%COMP%_menuSlideIn {\n  from {\n    opacity: 0;\n    transform: translateY(-16px) scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n\n.shell-loading[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 99999;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 15vh;\n  background: var(--mj-bg-page);\n}\n\n.loading-version[_ngcontent-%COMP%] {\n  margin-top: var(--mj-space-8, 24px);\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  letter-spacing: 0.4px;\n  opacity: 0.6;\n  user-select: none;\n}\n\n\n\n.loading-reset-panel[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--mj-space-3);\n  margin-top: var(--mj-space-10);\n  padding: var(--mj-space-8);\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-md);\n  max-width: 420px;\n  animation: _ngcontent-%COMP%_resetPanelFadeIn 0.4s ease-out;\n}\n\n.loading-reset-message[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.loading-reset-message[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-lg);\n  color: var(--mj-status-warning);\n}\n\n.loading-reset-hint[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  text-align: center;\n  line-height: var(--mj-leading-relaxed);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin-top: var(--mj-space-3);\n  padding: var(--mj-space-3) var(--mj-space-6);\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-medium);\n  font-family: var(--mj-font-family);\n  color: var(--mj-text-inverse);\n  background: var(--mj-brand-primary);\n  border: 1px solid var(--mj-brand-primary);\n  border-radius: var(--mj-radius-md);\n  cursor: pointer;\n  transition: var(--mj-transition-colors);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary-hover);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary-hover);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%]:active {\n  background: var(--mj-brand-primary-active);\n  color: var(--mj-text-inverse);\n  transform: scale(0.98);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n}\n\n@keyframes _ngcontent-%COMP%_resetPanelFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(12px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n\n\n.hamburger-btn[_ngcontent-%COMP%] {\n  display: none;\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n\n\n.mobile-nav-overlay[_ngcontent-%COMP%] {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  z-index: 9998;\n}\n\n\n\n.mobile-nav-drawer[_ngcontent-%COMP%] {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 280px;\n  max-width: 85vw;\n  background: var(--mj-bg-surface);\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 9999;\n  flex-direction: column;\n  transform: translateX(-100%);\n  transition: transform 0.3s ease;\n}\n.mobile-nav-drawer.open[_ngcontent-%COMP%] {\n  transform: translateX(0);\n}\n\n.mobile-nav-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n}\n.mobile-nav-header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 16px;\n  color: var(--mj-text-primary);\n}\n.mobile-nav-header[_ngcontent-%COMP%]   .close-btn[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header[_ngcontent-%COMP%]   .close-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-active);\n}\n\n.mobile-nav-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px 0;\n}\n\n.mobile-nav-section-title[_ngcontent-%COMP%] {\n  padding: 8px 20px;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--mj-text-disabled);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer[_ngcontent-%COMP%] {\n  border-top: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  border-radius: 8px;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  transition: background 0.15s;\n  width: 100%;\n  text-align: left;\n}\n.mobile-nav-action[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n.mobile-nav-action[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n  width: 20px;\n  text-align: center;\n}\n\n\n\n@media (max-width: 768px) {\n  .hamburger-btn[_ngcontent-%COMP%] {\n    display: flex;\n  }\n\n  .desktop-nav[_ngcontent-%COMP%] {\n    display: none !important;\n  }\n\n  .desktop-only[_ngcontent-%COMP%] {\n    display: none !important;\n  }\n\n  .mobile-nav-overlay[_ngcontent-%COMP%] {\n    display: block;\n  }\n\n  .mobile-nav-drawer[_ngcontent-%COMP%] {\n    display: flex;\n  }\n\n  .shell-header[_ngcontent-%COMP%] {\n    padding: 0 12px;\n    gap: 8px;\n  }\n\n  \n\n\n\n  .header-actions[_ngcontent-%COMP%] {\n    flex-direction: row;\n    flex-wrap: nowrap;\n  }\n  .header-actions[_ngcontent-%COMP%]   .user-menu[_ngcontent-%COMP%], \n   .header-actions[_ngcontent-%COMP%]   .nav-bar-apps[_ngcontent-%COMP%] {\n    flex-shrink: 0;\n  }\n}\n\n\n\n  .settings-fullscreen-window {\n  \n\n  box-shadow: none !important;\n  border: none !important;\n}\n\n  .settings-fullscreen-window .k-window-titlebar {\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n}\n\n  .settings-fullscreen-window .k-window-title {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n  .settings-fullscreen-window .k-window-titlebar-actions {\n  gap: 4px;\n}\n\n  .settings-fullscreen-window .k-window-titlebar-action {\n  width: 32px;\n  height: 32px;\n  border-radius: 6px;\n}\n\n  .settings-fullscreen-window .k-window-titlebar-action:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n  .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: var(--mj-bg-page);\n}\n\n\n\n  .settings-fullscreen-window .k-window-titlebar-action[title=\"Minimize\"], \n  .settings-fullscreen-window .k-window-titlebar-action[title=\"Maximize\"], \n  .settings-fullscreen-window .k-window-titlebar-action .k-i-window-minimize, \n  .settings-fullscreen-window .k-window-titlebar-action .k-i-window-maximize, \n  .settings-fullscreen-window .k-window-titlebar-action .k-i-window {\n  display: none !important;\n}\n\n\n\n\n\n.shell-search-bar[_ngcontent-%COMP%] {\n    flex: 0 1 420px;\n    min-width: 200px;\n    max-width: 520px;\n    margin: 0 12px;\n    position: relative;\n    z-index: 99999;\n}\n@media (max-width: 768px) {\n    .shell-search-bar[_ngcontent-%COMP%] { display: none; }\n}\n\n\n\n\n\n\n.search-popup-overlay[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.3);\n  z-index: 9999;\n  animation: _ngcontent-%COMP%_fadeIn 0.15s ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n.search-popup[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 60px; \n\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: var(--mj-bg-surface-elevated);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 10000;\n  opacity: 0;\n  transform: translateY(-10px);\n  pointer-events: none;\n  transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.search-popup.open[_ngcontent-%COMP%] {\n  opacity: 1;\n  transform: translateY(0);\n  pointer-events: all;\n}\n\n.search-popup-content[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px;\n}\n\n.search-entity-dropdown[_ngcontent-%COMP%] {\n  min-width: 140px;\n  max-width: 180px;\n  flex-shrink: 0;\n}\n\n.search-input[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n  height: 40px;\n  padding: 8px 12px;\n  font-size: 14px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 4px;\n  outline: none;\n  display: block !important;\n  box-sizing: border-box;\n}\n\n.search-input[_ngcontent-%COMP%]:focus {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.search-submit-btn[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 16px;\n  transition: background 0.15s;\n  flex-shrink: 0;\n}\n\n.search-submit-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary-hover);\n}\n\n.search-submit-btn[_ngcontent-%COMP%]:active {\n  background: var(--mj-brand-primary-hover);\n}\n\n\n\n.notification-badge-mobile[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 11px;\n  font-weight: 600;\n  border-radius: 9px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n\n\n@media (max-width: 768px) {\n  .search-popup[_ngcontent-%COMP%] {\n    top: 60px;\n    left: 16px;\n    right: 16px;\n    width: auto;\n    max-width: none;\n  }\n\n  .search-popup-content[_ngcontent-%COMP%] {\n    flex-wrap: wrap;\n  }\n\n  .search-entity-dropdown[_ngcontent-%COMP%] {\n    width: 100%;\n  }\n\n  .search-input[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n  }\n}\n\n\n\n\n\n.pin-progress-backdrop[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-text-primary) 40%, transparent);\n  z-index: 100000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  animation: _ngcontent-%COMP%_pinBackdropIn 0.2s ease;\n}\n\n@keyframes _ngcontent-%COMP%_pinBackdropIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n.pin-progress-modal[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-xl);\n  padding: 28px 40px;\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  box-shadow: 0 16px 48px color-mix(in srgb, var(--mj-text-primary) 30%, transparent);\n  animation: _ngcontent-%COMP%_pinModalIn 0.25s ease;\n}\n\n@keyframes _ngcontent-%COMP%_pinModalIn {\n  from { opacity: 0; transform: scale(0.9) translateY(8px); }\n  to { opacity: 1; transform: scale(1) translateY(0); }\n}\n\n.pin-progress-text[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n  white-space: nowrap;\n}\n\n\n\n\n.activity-wrap[_ngcontent-%COMP%] { position: relative; display: inline-flex; }\n.activity-btn[_ngcontent-%COMP%] { position: relative; }\n.activity-btn[_ngcontent-%COMP%]   .activity-pulse[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n.activity-badge[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 2px;\n    right: 2px;\n    min-width: 16px;\n    height: 16px;\n    padding: 0 4px;\n    border-radius: 8px;\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    font-size: 10px;\n    font-weight: 700;\n    line-height: 16px;\n    text-align: center;\n}\n.activity-drawer[_ngcontent-%COMP%] {\n    position: absolute;\n    top: calc(100% + 8px);\n    right: 0;\n    width: 320px;\n    max-height: 420px;\n    display: flex;\n    flex-direction: column;\n    background: var(--mj-bg-surface-elevated);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 10px;\n    box-shadow: 0 8px 28px color-mix(in srgb, var(--mj-text-primary) 18%, transparent);\n    z-index: 1000;\n    overflow: hidden;\n}\n.activity-drawer-head[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 12px;\n    font-weight: 700;\n    font-size: 0.85rem;\n    color: var(--mj-text-primary);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n.activity-clear[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    color: var(--mj-text-muted);\n    cursor: pointer;\n    font-size: 0.8rem;\n    padding: 4px 6px;\n    border-radius: 6px;\n}\n.activity-clear[_ngcontent-%COMP%]:hover { color: var(--mj-text-primary); background: var(--mj-bg-surface-hover); }\n.activity-list[_ngcontent-%COMP%] { overflow-y: auto; padding: 6px; }\n.activity-row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 10px;\n    padding: 9px 8px;\n    border-radius: 8px;\n}\n.activity-row[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); }\n.activity-row-icon[_ngcontent-%COMP%] { margin-top: 2px; color: var(--mj-brand-primary); font-size: 0.85rem; }\n.activity-row.is-error[_ngcontent-%COMP%]   .activity-row-icon[_ngcontent-%COMP%] { color: var(--mj-status-error); }\n.activity-row-body[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n.activity-row-label[_ngcontent-%COMP%] { font-size: 0.82rem; font-weight: 600; color: var(--mj-text-primary); }\n.activity-row-detail[_ngcontent-%COMP%] { font-size: 0.72rem; color: var(--mj-text-muted); margin-top: 1px; }\n.activity-bar[_ngcontent-%COMP%] {\n    margin-top: 6px;\n    height: 4px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 2px;\n    overflow: hidden;\n}\n.activity-bar-fill[_ngcontent-%COMP%] { height: 100%; background: var(--mj-brand-primary); transition: width 0.3s ease; }"] });
+            i0.ɵɵadvance(6);
+            i0.ɵɵconditional(ctx.ShowSearchBar && !ctx.UseOmnibar ? 54 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.PinProgressVisible ? 55 : -1);
+        } }, dependencies: [i13.NgControlStatus, i13.NgModel, i14.MJDropdownComponent, i15.LoadingComponent, i16.SearchOverlayComponent, i16.SearchCompositeComponent, i17.AppSwitcherComponent, i18.AppNavComponent, i19.TabContainerComponent, i20.AppAccessDialogComponent, i21.CommandPaletteComponent, i22.OmnibarPaletteComponent], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n}\n\n\n\n.mj-logo[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 18px;\n  background-image: var(--mj-logo-mark);\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: contain;\n  flex-shrink: 0;\n}\n\n.shell-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  position: relative;\n}\n\n\n\n\n.shell-container.hidden[_ngcontent-%COMP%] {\n  visibility: hidden;\n  position: absolute;\n  pointer-events: none;\n}\n\nmj-tab-container[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  transition: all 0.2s ease-in-out;\n}\n\n\n\nmj-tab-container.hide-tab-bar[_ngcontent-%COMP%]     .lm_header {\n  display: none;\n}\n\n\n\nmj-tab-container[_ngcontent-%COMP%]:not(.hide-tab-bar)     .lm_header {\n  opacity: 1;\n  max-height: 40px;\n  transition: opacity 0.2s ease-in-out, max-height 0.2s ease-in-out;\n}\n\n\n\nmj-tab-container.hide-tab-bar[_ngcontent-%COMP%]     .lm_content {\n  height: 100% !important;\n}\n\n\n\nmj-tab-container[_ngcontent-%COMP%]     .lm_stack {\n  transition: all 0.2s ease-in-out;\n}\n\n.shell-header[_ngcontent-%COMP%] {\n  height: 60px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: var(--mj-shadow-sm);\n  flex-shrink: 0;\n  \n\n\n  position: relative;\n  z-index: 500;\n}\n\n\n\n.nav-bar-apps[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.nav-bar-apps.left-of-switcher[_ngcontent-%COMP%] {\n  \n\n  \n\n}\n\n.nav-bar-apps.left-of-user-menu[_ngcontent-%COMP%] {\n  margin-right: 8px;\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%] {\n  --app-color: var(--mj-text-muted);\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: all 0.15s ease;\n  position: relative;\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%]:hover {\n  background: color-mix(in srgb, var(--app-color) 15%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--app-color) 20%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active[_ngcontent-%COMP%]::after {\n  content: '';\n  position: absolute;\n  bottom: 6px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 16px;\n  height: 3px;\n  background: var(--app-color);\n  border-radius: 2px;\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  transition: transform 0.15s ease;\n  margin-top: 2px; \n\n}\n\n.nav-bar-app-btn[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n  transform: scale(1.1);\n}\n\n.spacer[_ngcontent-%COMP%] {\n  flex: 1;\n}\n\n.header-actions[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.icon-btn[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n\n\n\n\n\n.search-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  width: 260px;\n  height: 36px;\n  padding: 0 var(--mj-space-2-5) 0 var(--mj-space-3-5);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  font-size: var(--mj-text-sm);\n  font-family: inherit;\n  cursor: pointer;\n  transition: var(--mj-transition-colors);\n}\n\n.search-btn[_ngcontent-%COMP%]:hover {\n  border-color: var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n}\n\n.search-btn[_ngcontent-%COMP%]:focus-visible {\n  outline: none;\n  border-color: var(--mj-border-focus);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n\n\n\n.search-btn-mobile[_ngcontent-%COMP%] {\n  display: none;\n}\n\n\n\n\n.shell-search-bar[_ngcontent-%COMP%] {\n  position: relative;\n  width: 260px;\n  z-index: 99999;\n}\n\n\n\n\n\n.shell-search-bar[_ngcontent-%COMP%]     .suggest-dropdown {\n  left: auto;\n  right: 0;\n  width: min(560px, calc(100vw - var(--mj-space-6)));\n}\n\n.search-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  flex-shrink: 0;\n}\n\n.search-btn[_ngcontent-%COMP%]   .search-btn-text[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n  text-align: left;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n\n\n\n\n.search-btn[_ngcontent-%COMP%]   .search-btn-kbd[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  white-space: nowrap;\n  font-family: inherit;\n  font-size: 10.5px;\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-muted);\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong);\n  border-bottom-width: 2px;\n  border-radius: 5px;\n  padding: 1.5px var(--mj-space-1-5);\n}\n\n\n\n.notification-btn[_ngcontent-%COMP%] {\n  position: relative;\n}\n\n.notification-badge[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 4px;\n  right: 4px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n.user-menu[_ngcontent-%COMP%] {\n  position: relative;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: box-shadow 0.15s, transform 0.15s;\n  padding: 0;\n  overflow: hidden;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]:hover {\n  transform: scale(1.05);\n}\n\n\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .icon-fallback[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  border: 2px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-hover);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: border-color 0.15s;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]:hover   .icon-fallback[_ngcontent-%COMP%] {\n  border-color: var(--mj-brand-primary);\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .icon-fallback[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  font-size: 16px;\n}\n\n\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .avatar-img[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  object-fit: cover;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]:hover   .avatar-img[_ngcontent-%COMP%] {\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);\n}\n\n\n\n.user-menu-header[_ngcontent-%COMP%] {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-info[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-name[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-email[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: var(--mj-text-muted);\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-subtitle[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n\n\n.user-context-menu[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  margin-top: 8px;\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-lg);\n  min-width: 180px;\n  z-index: 10000;\n  overflow: hidden;\n}\n\n.user-menu-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  cursor: pointer;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  transition: background 0.15s;\n}\n\n.user-menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  width: 18px;\n  text-align: center;\n  color: var(--mj-text-muted);\n  font-size: 14px;\n}\n\n.user-menu-item[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%] {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]:hover {\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface-elevated));\n}\n\n.user-menu-divider[_ngcontent-%COMP%] {\n  height: 1px;\n  background: var(--mj-border-default);\n  margin: 4px 0;\n}\n\n\n\n.user-menu-item.disabled[_ngcontent-%COMP%] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.user-menu-item.disabled[_ngcontent-%COMP%]:hover {\n  background: transparent;\n}\n\n\n\n.theme-toggle-item[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.theme-toggle-track[_ngcontent-%COMP%] {\n  position: relative;\n  width: 40px;\n  height: 22px;\n  border-radius: 11px;\n  background: var(--mj-bg-surface-active);\n  margin-left: auto;\n  transition: background 0.2s ease;\n  flex-shrink: 0;\n}\n\n.theme-toggle-track.dark[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n}\n\n.theme-toggle-thumb[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  background: var(--mj-bg-surface);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: transform 0.2s ease;\n}\n\n.theme-toggle-track.dark[_ngcontent-%COMP%]   .theme-toggle-thumb[_ngcontent-%COMP%] {\n  transform: translateX(18px);\n}\n\n.theme-toggle-icon[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n}\n\n.theme-toggle-track.dark[_ngcontent-%COMP%]   .theme-toggle-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-inverse);\n}\n\n\n\n.user-menu-item[_ngcontent-%COMP%]   .menu-shortcut[_ngcontent-%COMP%] {\n  margin-left: auto;\n  font-size: 11px;\n  color: var(--mj-text-disabled);\n  font-family: monospace;\n}\n\n\n\n.user-context-menu.menu-fade[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_menuFadeIn 0.15s ease-out;\n}\n\n.user-context-menu.menu-slide[_ngcontent-%COMP%] {\n  animation: _ngcontent-%COMP%_menuSlideIn 0.2s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_menuFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes _ngcontent-%COMP%_menuSlideIn {\n  from {\n    opacity: 0;\n    transform: translateY(-16px) scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n\n.shell-loading[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 99999;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 15vh;\n  background: var(--mj-bg-page);\n}\n\n.loading-version[_ngcontent-%COMP%] {\n  margin-top: var(--mj-space-8, 24px);\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  letter-spacing: 0.4px;\n  opacity: 0.6;\n  user-select: none;\n}\n\n\n\n.loading-reset-panel[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--mj-space-3);\n  margin-top: var(--mj-space-10);\n  padding: var(--mj-space-8);\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-md);\n  max-width: 420px;\n  animation: _ngcontent-%COMP%_resetPanelFadeIn 0.4s ease-out;\n}\n\n.loading-reset-message[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.loading-reset-message[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-lg);\n  color: var(--mj-status-warning);\n}\n\n.loading-reset-hint[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  text-align: center;\n  line-height: var(--mj-leading-relaxed);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin-top: var(--mj-space-3);\n  padding: var(--mj-space-3) var(--mj-space-6);\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-medium);\n  font-family: var(--mj-font-family);\n  color: var(--mj-text-inverse);\n  background: var(--mj-brand-primary);\n  border: 1px solid var(--mj-brand-primary);\n  border-radius: var(--mj-radius-md);\n  cursor: pointer;\n  transition: var(--mj-transition-colors);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary-hover);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary-hover);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%]:active {\n  background: var(--mj-brand-primary-active);\n  color: var(--mj-text-inverse);\n  transform: scale(0.98);\n}\n\n.loading-reset-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n}\n\n@keyframes _ngcontent-%COMP%_resetPanelFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(12px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n\n\n.hamburger-btn[_ngcontent-%COMP%] {\n  display: none;\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n\n\n.mobile-nav-overlay[_ngcontent-%COMP%] {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  z-index: 9998;\n}\n\n\n\n.mobile-nav-drawer[_ngcontent-%COMP%] {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 280px;\n  max-width: 85vw;\n  background: var(--mj-bg-surface);\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 9999;\n  flex-direction: column;\n  transform: translateX(-100%);\n  transition: transform 0.3s ease;\n}\n.mobile-nav-drawer.open[_ngcontent-%COMP%] {\n  transform: translateX(0);\n}\n\n.mobile-nav-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n}\n.mobile-nav-header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 16px;\n  color: var(--mj-text-primary);\n}\n.mobile-nav-header[_ngcontent-%COMP%]   .close-btn[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header[_ngcontent-%COMP%]   .close-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-active);\n}\n\n.mobile-nav-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px 0;\n}\n\n.mobile-nav-section-title[_ngcontent-%COMP%] {\n  padding: 8px 20px;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--mj-text-disabled);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer[_ngcontent-%COMP%] {\n  border-top: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  border-radius: 8px;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  transition: background 0.15s;\n  width: 100%;\n  text-align: left;\n}\n.mobile-nav-action[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n.mobile-nav-action[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n  width: 20px;\n  text-align: center;\n}\n\n\n\n@media (max-width: 768px) {\n  .hamburger-btn[_ngcontent-%COMP%] {\n    display: flex;\n  }\n\n  .desktop-nav[_ngcontent-%COMP%] {\n    display: none !important;\n  }\n\n  .desktop-only[_ngcontent-%COMP%] {\n    display: none !important;\n  }\n\n  .mobile-nav-overlay[_ngcontent-%COMP%] {\n    display: block;\n  }\n\n  .mobile-nav-drawer[_ngcontent-%COMP%] {\n    display: flex;\n  }\n\n  .shell-header[_ngcontent-%COMP%] {\n    padding: 0 12px;\n    gap: 8px;\n  }\n\n  \n\n\n\n  .header-actions[_ngcontent-%COMP%] {\n    flex-direction: row;\n    flex-wrap: nowrap;\n  }\n  .header-actions[_ngcontent-%COMP%]   .user-menu[_ngcontent-%COMP%], \n   .header-actions[_ngcontent-%COMP%]   .nav-bar-apps[_ngcontent-%COMP%], \n   .header-actions[_ngcontent-%COMP%]   .search-btn[_ngcontent-%COMP%] {\n    flex-shrink: 0;\n  }\n\n  \n\n\n\n\n  .search-btn[_ngcontent-%COMP%] {\n    display: flex;\n    width: 40px;\n    height: 40px;\n    padding: 0;\n    justify-content: center;\n    border: none;\n    border-radius: 50%;\n    background: none;\n  }\n  .search-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-lg);\n  }\n  .search-btn[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    border: none;\n  }\n}\n\n\n\n  .settings-fullscreen-window {\n  \n\n  box-shadow: none !important;\n  border: none !important;\n}\n\n  .settings-fullscreen-window .k-window-titlebar {\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n}\n\n  .settings-fullscreen-window .k-window-title {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n  .settings-fullscreen-window .k-window-titlebar-actions {\n  gap: 4px;\n}\n\n  .settings-fullscreen-window .k-window-titlebar-action {\n  width: 32px;\n  height: 32px;\n  border-radius: 6px;\n}\n\n  .settings-fullscreen-window .k-window-titlebar-action:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n  .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: var(--mj-bg-page);\n}\n\n\n\n  .settings-fullscreen-window .k-window-titlebar-action[title=\"Minimize\"], \n  .settings-fullscreen-window .k-window-titlebar-action[title=\"Maximize\"], \n  .settings-fullscreen-window .k-window-titlebar-action .k-i-window-minimize, \n  .settings-fullscreen-window .k-window-titlebar-action .k-i-window-maximize, \n  .settings-fullscreen-window .k-window-titlebar-action .k-i-window {\n  display: none !important;\n}\n\n\n\n\n\n\n\n\n\n\n\n.search-popup-overlay[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.3);\n  z-index: 9999;\n  animation: _ngcontent-%COMP%_fadeIn 0.15s ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n.search-popup[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 60px; \n\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: var(--mj-bg-surface-elevated);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 10000;\n  opacity: 0;\n  transform: translateY(-10px);\n  pointer-events: none;\n  transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.search-popup.open[_ngcontent-%COMP%] {\n  opacity: 1;\n  transform: translateY(0);\n  pointer-events: all;\n}\n\n.search-popup-content[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px;\n}\n\n.search-entity-dropdown[_ngcontent-%COMP%] {\n  min-width: 140px;\n  max-width: 180px;\n  flex-shrink: 0;\n}\n\n.search-input[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n  height: 40px;\n  padding: 8px 12px;\n  font-size: 14px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 4px;\n  outline: none;\n  display: block !important;\n  box-sizing: border-box;\n}\n\n.search-input[_ngcontent-%COMP%]:focus {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.search-submit-btn[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 16px;\n  transition: background 0.15s;\n  flex-shrink: 0;\n}\n\n.search-submit-btn[_ngcontent-%COMP%]:hover {\n  background: var(--mj-brand-primary-hover);\n}\n\n.search-submit-btn[_ngcontent-%COMP%]:active {\n  background: var(--mj-brand-primary-hover);\n}\n\n\n\n.notification-badge-mobile[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 11px;\n  font-weight: 600;\n  border-radius: 9px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n\n\n@media (max-width: 768px) {\n  .search-popup[_ngcontent-%COMP%] {\n    top: 60px;\n    left: 16px;\n    right: 16px;\n    width: auto;\n    max-width: none;\n  }\n\n  .search-popup-content[_ngcontent-%COMP%] {\n    flex-wrap: wrap;\n  }\n\n  .search-entity-dropdown[_ngcontent-%COMP%] {\n    width: 100%;\n  }\n\n  .search-input[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n  }\n}\n\n\n\n\n\n.pin-progress-backdrop[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-text-primary) 40%, transparent);\n  z-index: 100000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  animation: _ngcontent-%COMP%_pinBackdropIn 0.2s ease;\n}\n\n@keyframes _ngcontent-%COMP%_pinBackdropIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n.pin-progress-modal[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-xl);\n  padding: 28px 40px;\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  box-shadow: 0 16px 48px color-mix(in srgb, var(--mj-text-primary) 30%, transparent);\n  animation: _ngcontent-%COMP%_pinModalIn 0.25s ease;\n}\n\n@keyframes _ngcontent-%COMP%_pinModalIn {\n  from { opacity: 0; transform: scale(0.9) translateY(8px); }\n  to { opacity: 1; transform: scale(1) translateY(0); }\n}\n\n.pin-progress-text[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n  white-space: nowrap;\n}\n\n\n\n\n.activity-wrap[_ngcontent-%COMP%] { position: relative; display: inline-flex; }\n.activity-btn[_ngcontent-%COMP%] { position: relative; }\n.activity-btn[_ngcontent-%COMP%]   .activity-pulse[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n.activity-badge[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 2px;\n    right: 2px;\n    min-width: 16px;\n    height: 16px;\n    padding: 0 4px;\n    border-radius: 8px;\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    font-size: 10px;\n    font-weight: 700;\n    line-height: 16px;\n    text-align: center;\n}\n.activity-drawer[_ngcontent-%COMP%] {\n    position: absolute;\n    top: calc(100% + 8px);\n    right: 0;\n    width: 320px;\n    max-height: 420px;\n    display: flex;\n    flex-direction: column;\n    background: var(--mj-bg-surface-elevated);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 10px;\n    box-shadow: 0 8px 28px color-mix(in srgb, var(--mj-text-primary) 18%, transparent);\n    z-index: 1000;\n    overflow: hidden;\n}\n.activity-drawer-head[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 12px;\n    font-weight: 700;\n    font-size: 0.85rem;\n    color: var(--mj-text-primary);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n.activity-clear[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    color: var(--mj-text-muted);\n    cursor: pointer;\n    font-size: 0.8rem;\n    padding: 4px 6px;\n    border-radius: 6px;\n}\n.activity-clear[_ngcontent-%COMP%]:hover { color: var(--mj-text-primary); background: var(--mj-bg-surface-hover); }\n.activity-list[_ngcontent-%COMP%] { overflow-y: auto; padding: 6px; }\n.activity-row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 10px;\n    padding: 9px 8px;\n    border-radius: 8px;\n}\n.activity-row[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); }\n.activity-row-icon[_ngcontent-%COMP%] { margin-top: 2px; color: var(--mj-brand-primary); font-size: 0.85rem; }\n.activity-row.is-error[_ngcontent-%COMP%]   .activity-row-icon[_ngcontent-%COMP%] { color: var(--mj-status-error); }\n.activity-row-body[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n.activity-row-label[_ngcontent-%COMP%] { font-size: 0.82rem; font-weight: 600; color: var(--mj-text-primary); }\n.activity-row-detail[_ngcontent-%COMP%] { font-size: 0.72rem; color: var(--mj-text-muted); margin-top: 1px; }\n.activity-bar[_ngcontent-%COMP%] {\n    margin-top: 6px;\n    height: 4px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 2px;\n    overflow: hidden;\n}\n.activity-bar-fill[_ngcontent-%COMP%] { height: 100%; background: var(--mj-brand-primary); transition: width 0.3s ease; }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ShellComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-shell', template: "<div class=\"shell-container\" [class.hidden]=\"loading\" [class.tabs-visible]=\"tabBarVisible\">\n  <!-- Header -->\n  <header class=\"shell-header\">\n    <!-- MJ Logo -->\n    <div class=\"mj-logo\" title=\"MemberJunction\"></div>\n\n    <!-- Mobile Hamburger Button -->\n    <button class=\"hamburger-btn\" (click)=\"toggleMobileNav()\" title=\"Menu\">\n      <i class=\"fa-solid fa-bars\"></i>\n    </button>\n\n    <!-- Nav Bar Apps: Left of App Switcher -->\n    @if (leftOfSwitcherApps.length > 0 && !appSwitchingLocked) {\n      <div class=\"nav-bar-apps left-of-switcher\">\n        @for (app of leftOfSwitcherApps; track app) {\n          <button\n            class=\"nav-bar-app-btn\"\n            [class.active]=\"IsActiveApp(app)\"\n            [title]=\"app.Name\"\n            [style.--app-color]=\"app.GetColor()\"\n            (click)=\"onNavBarAppClick(app, $event)\"\n            (dblclick)=\"onNavBarAppDblClick(app, $event)\">\n            <i [class]=\"app.Icon\"></i>\n          </button>\n        }\n      </div>\n    }\n\n    <!-- App Switcher (hidden for app-locked sessions, e.g. magic-link) -->\n    @if (!appSwitchingLocked) {\n      <mj-app-switcher\n        [activeApp]=\"activeApp\"\n        [isViewingSystemTab]=\"isViewingSystemTab\"\n        [loadingAppId]=\"loadingAppId\"\n        (appSelected)=\"onAppSwitch($event)\">\n      </mj-app-switcher>\n    }\n\n    <!-- App Navigation (desktop only) -->\n    @if (activeApp) {\n      <mj-app-nav\n        class=\"desktop-nav\"\n        [app]=\"activeApp\"\n        (navItemClick)=\"onNavItemClick($event)\"\n        (navItemDismiss)=\"onNavItemDismiss($event)\">\n      </mj-app-nav>\n    }\n\n    <!-- Universal Search Bar -->\n    @if (ShowSearchBar) {\n      <div class=\"shell-search-bar desktop-only\">\n        <mj-search-composite\n          #shellSearchComposite\n          Placeholder=\"Search everything...\"\n          [ShowShortcutHint]=\"true\"\n          [EnablePreview]=\"ShowSearchPreview\"\n          [EnableRecent]=\"true\"\n          [MaxPreviewResults]=\"8\"\n          (ResultSelected)=\"OnSearchResultSelected($event)\"\n          (SearchSubmitted)=\"OnSearchSubmitted($event)\"\n          (SeeAllRequested)=\"OnSeeAllSearch($event)\">\n        </mj-search-composite>\n      </div>\n    }\n    <!-- Spacer -->\n    <div class=\"spacer\"></div>\n    <!-- Actions (activity, notifications, user menu) -->\n    <div class=\"header-actions\">\n      <!-- Global Activity indicator -->\n      @if (activityItems.length > 0) {\n        <div class=\"activity-wrap\">\n          <button class=\"icon-btn desktop-only activity-btn\" title=\"Activity\" (click)=\"toggleActivity($event)\">\n            <i class=\"fa-solid fa-wave-square\" [class.activity-pulse]=\"activityRunningCount > 0\"></i>\n            @if (activityRunningCount > 0) {\n              <span class=\"activity-badge\">{{ activityRunningCount }}</span>\n            }\n          </button>\n          @if (activityOpen) {\n            <div class=\"activity-drawer\" (click)=\"$event.stopPropagation()\">\n              <div class=\"activity-drawer-head\">\n                <span>Activity</span>\n                <button class=\"activity-clear\" (click)=\"clearFinishedActivity()\" title=\"Clear finished\">\n                  <i class=\"fa-solid fa-broom\"></i>\n                </button>\n              </div>\n              <div class=\"activity-list\">\n                @for (a of activityItems; track a.ID) {\n                  <div class=\"activity-row\" [class.is-error]=\"a.Status === 'error'\">\n                    <i class=\"activity-row-icon\"\n                       [class]=\"a.Status === 'running' ? 'fa-solid fa-spinner fa-spin'\n                              : a.Status === 'error' ? 'fa-solid fa-circle-exclamation'\n                              : 'fa-solid fa-circle-check'\"></i>\n                    <div class=\"activity-row-body\">\n                      <div class=\"activity-row-label\">{{ a.Label }}</div>\n                      @if (a.Detail) { <div class=\"activity-row-detail\">{{ a.Detail }}</div> }\n                      @if (a.Status === 'running' && a.Progress != null) {\n                        <div class=\"activity-bar\"><div class=\"activity-bar-fill\" [style.width.%]=\"a.Progress\"></div></div>\n                      }\n                    </div>\n                  </div>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      }\n      <button class=\"icon-btn desktop-only notification-btn\" title=\"Notifications\" (click)=\"showNotifications()\">\n        <i class=\"fa-solid fa-bell\"></i>\n        @if (unreadNotificationCount > 0) {\n          <span class=\"notification-badge\">\n            {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n          </span>\n        }\n      </button>\n      <!-- Nav Bar Apps: Left of User Menu -->\n      @if (leftOfUserMenuApps.length > 0) {\n        <div class=\"nav-bar-apps left-of-user-menu\">\n          @for (app of leftOfUserMenuApps; track app) {\n            <button\n              class=\"nav-bar-app-btn\"\n              [class.active]=\"IsActiveApp(app)\"\n              [title]=\"app.Name\"\n              [style.--app-color]=\"app.GetColor()\"\n              (click)=\"onNavBarAppClick(app, $event)\"\n              (dblclick)=\"onNavBarAppDblClick(app, $event)\">\n              <i [class]=\"app.Icon\"></i>\n            </button>\n          }\n        </div>\n      }\n\n      <div class=\"user-menu\">\n        <button class=\"avatar-btn\" (click)=\"toggleUserMenu($event)\">\n          @if (userImageURL) {\n            <img [src]=\"userImageURL\" alt=\"User avatar\" class=\"avatar-img\" />\n          } @else {\n            <div class=\"icon-fallback\">\n              <i [class]=\"userIconClass || 'fa-solid fa-user'\"></i>\n            </div>\n          }\n        </button>\n        <!-- User Context Menu (Dynamic) -->\n        @if (userMenuVisible) {\n          <div class=\"user-context-menu\"\n            [class.menu-fade]=\"getUserMenuOptions()?.animationStyle === 'fade'\"\n            [class.menu-slide]=\"getUserMenuOptions()?.animationStyle === 'slide'\">\n            <!-- User Header -->\n            @if (getUserMenuOptions()?.showUserName) {\n              <div class=\"user-menu-header\">\n                <div class=\"user-info\">\n                  <span class=\"user-name\">{{ getUserDisplayInfo()?.name || userName }}</span>\n                  @if (getUserMenuOptions()?.showUserEmail && getUserDisplayInfo()?.email) {\n                    <span class=\"user-email\">\n                      {{ getUserDisplayInfo()?.email }}\n                    </span>\n                  }\n                  @if (getUserDisplayInfo()?.subtitle) {\n                    <span class=\"user-subtitle\">{{ getUserDisplayInfo()?.subtitle }}</span>\n                  }\n                </div>\n              </div>\n              <div class=\"user-menu-divider\"></div>\n            }\n            <!-- Dynamic Menu Items -->\n            @for (element of userMenuElements; track element) {\n              <!-- Divider -->\n              @if (isMenuDivider(element)) {\n                <div class=\"user-menu-divider\"></div>\n              }\n              <!-- Menu Item -->\n              @if (!isMenuDivider(element)) {\n                @if (asMenuItem(element); as item) {\n                  @if (item.id === 'toggle-theme') {\n                    <div class=\"user-menu-item theme-toggle-item\"\n                      [title]=\"item.tooltip || ''\"\n                      (click)=\"onUserMenuItemClick(item.id)\">\n                      <i [class]=\"item.icon\"></i>\n                      <span class=\"menu-label\">{{ item.label }}</span>\n                      <div class=\"theme-toggle-track\" [class.dark]=\"IsDarkMode\">\n                        <div class=\"theme-toggle-thumb\">\n                          <i [class]=\"IsDarkMode ? 'fa-solid fa-moon' : 'fa-solid fa-sun'\" class=\"theme-toggle-icon\"></i>\n                        </div>\n                      </div>\n                    </div>\n                  } @else {\n                    <div class=\"user-menu-item\"\n                      [class.disabled]=\"!item.enabled\"\n                      [class.danger]=\"item.cssClass === 'danger'\"\n                      [style.color]=\"item.color || null\"\n                      [title]=\"item.tooltip || ''\"\n                      (click)=\"item.enabled && onUserMenuItemClick(item.id)\">\n                      <i [class]=\"item.icon\"></i>\n                      <span class=\"menu-label\">{{ item.label }}</span>\n                      @if (item.shortcut) {\n                        <span class=\"menu-shortcut\">{{ item.shortcut }}</span>\n                      }\n                    </div>\n                  }\n                }\n              }\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </header>\n\n  <!-- Search Popup -->\n  @if (isSearchOpen) {\n    <div class=\"search-popup-overlay\" (click)=\"closeSearch()\"></div>\n  }\n  <div class=\"search-popup\" [class.open]=\"isSearchOpen\">\n    <div class=\"search-popup-content\" (click)=\"$event.stopPropagation()\">\n      <mj-dropdown\n        [Data]=\"searchableEntities\"\n        TextField=\"Name\"\n        ValueField=\"ID\"\n        class=\"search-entity-dropdown\"\n        [(ngModel)]=\"selectedEntity\">\n      </mj-dropdown>\n      <input\n        type=\"text\"\n        #searchInput\n        placeholder=\"Search...\"\n        class=\"mj-input search-input\"\n        (keydown.enter)=\"onSearch($event)\"\n        />\n      <button class=\"search-submit-btn\" (click)=\"onSearch($event)\" title=\"Search\">\n        <i class=\"fa-solid fa-search\"></i>\n      </button>\n    </div>\n  </div>\n\n  <!-- Mobile Navigation Drawer -->\n  @if (mobileNavOpen) {\n    <div class=\"mobile-nav-overlay\" (click)=\"closeMobileNav()\"></div>\n  }\n  <div class=\"mobile-nav-drawer\" [class.open]=\"mobileNavOpen\">\n    <div class=\"mobile-nav-header\">\n      <span>Navigation</span>\n      <button class=\"close-btn\" (click)=\"closeMobileNav()\">\n        <i class=\"fa-solid fa-xmark\"></i>\n      </button>\n    </div>\n    @if (activeApp) {\n      <div class=\"mobile-nav-content\">\n        <div class=\"mobile-nav-section-title\">{{ activeApp.Name }}</div>\n        <mj-app-nav\n          [app]=\"activeApp\"\n          (navItemClick)=\"onNavItemClick($event)\"\n          (navItemDismiss)=\"onNavItemDismiss($event)\">\n        </mj-app-nav>\n      </div>\n    }\n    <div class=\"mobile-nav-footer\">\n      <button class=\"mobile-nav-action\" title=\"Search\" (click)=\"toggleSearch(); closeMobileNav()\">\n        <i class=\"fa-solid fa-search\"></i>\n        <span>Search</span>\n      </button>\n      <button class=\"mobile-nav-action\" title=\"Notifications\" (click)=\"showNotifications(); closeMobileNav()\">\n        <i class=\"fa-solid fa-bell\"></i>\n        <span>Notifications</span>\n        @if (unreadNotificationCount > 0) {\n          <span class=\"notification-badge-mobile\">\n            {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n          </span>\n        }\n      </button>\n    </div>\n  </div>\n\n  <!-- Tab Container - with dynamic tab bar visibility -->\n  <mj-tab-container\n    [class.hide-tab-bar]=\"!tabBarVisible\"\n    (firstResourceLoadComplete)=\"onFirstResourceLoadComplete()\"\n    (layoutInitError)=\"handleLayoutError()\">\n  </mj-tab-container>\n</div>\n\n<!-- Loading State -->\n@if (loading) {\n  <div class=\"shell-loading\">\n    <mj-loading\n      [text]=\"currentLoadingText\"\n      [textColor]=\"currentLoadingTextColor\"\n      [logoColor]=\"currentLoadingColor\"\n      [logoGradient]=\"currentLoadingGradient\"\n      [animation]=\"currentLoadingAnimation\"\n      size=\"large\">\n    </mj-loading>\n    @if (ShowResetOption) {\n      <div class=\"loading-reset-panel\">\n        <p class=\"loading-reset-message\">\n          <i class=\"fa-regular fa-clock\"></i>\n          Taking longer than expected\n        </p>\n        <p class=\"loading-reset-hint\">\n          This can happen after updates or due to cached data issues.\n        </p>\n        <button class=\"loading-reset-btn\" (click)=\"ResetApplication()\">\n          <i class=\"fa-solid fa-arrows-rotate\"></i>\n          Reset\n        </button>\n      </div>\n    } @else {\n      <div class=\"loading-version\">MemberJunction \u00B7 v{{ MJVersion }}</div>\n    }\n  </div>\n}\n\n<!-- App Access Error Dialog -->\n<mj-app-access-dialog\n  #appAccessDialog\n  (result)=\"onAppAccessDialogResult($event)\">\n</mj-app-access-dialog>\n\n<!-- Command Palette -->\n<mj-command-palette (AppSelected)=\"onAppSwitch($event)\"></mj-command-palette>\n\n<!-- Pin Progress Overlay -->\n@if (PinProgressVisible) {\n  <div class=\"pin-progress-backdrop\">\n    <div class=\"pin-progress-modal\">\n      <mj-loading [showText]=\"false\" size=\"small\"></mj-loading>\n      <span class=\"pin-progress-text\">{{ PinProgressText }}</span>\n    </div>\n  </div>\n}\n", styles: [":host {\n  display: block;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n}\n\n/* MJ Logo - uses design token for theme switching & white-labeling */\n.mj-logo {\n  width: 32px;\n  height: 18px;\n  background-image: var(--mj-logo-mark);\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: contain;\n  flex-shrink: 0;\n}\n\n.shell-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  position: relative;\n}\n\n/* Hide shell container while loading - allows tab container to render and load\n   first resource in background while shell loading indicator is visible */\n.shell-container.hidden {\n  visibility: hidden;\n  position: absolute;\n  pointer-events: none;\n}\n\nmj-tab-container {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  transition: all 0.2s ease-in-out;\n}\n\n/* Hide Golden Layout tab headers when only one tab */\nmj-tab-container.hide-tab-bar ::ng-deep .lm_header {\n  display: none;\n}\n\n/* Show tab headers when multiple tabs */\nmj-tab-container:not(.hide-tab-bar) ::ng-deep .lm_header {\n  opacity: 1;\n  max-height: 40px;\n  transition: opacity 0.2s ease-in-out, max-height 0.2s ease-in-out;\n}\n\n/* Adjust content area height when tabs hidden */\nmj-tab-container.hide-tab-bar ::ng-deep .lm_content {\n  height: 100% !important;\n}\n\n/* Ensure smooth transitions */\nmj-tab-container ::ng-deep .lm_stack {\n  transition: all 0.2s ease-in-out;\n}\n\n.shell-header {\n  height: 60px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: var(--mj-shadow-sm);\n  flex-shrink: 0;\n  /* Creates a stacking context so children (search bar z-index: 99999, dropdown)\n     are contained within this level. Modal overlays (z-index: 1000+) sit above. */\n  position: relative;\n  z-index: 500;\n}\n\n/* Nav Bar Apps - permanent app icons in the header */\n.nav-bar-apps {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.nav-bar-apps.left-of-switcher {\n  /* No extra margin - header gap handles spacing */\n  /* This prevents the app switcher from shifting when icons are hidden */\n}\n\n.nav-bar-apps.left-of-user-menu {\n  margin-right: 8px;\n}\n\n.nav-bar-app-btn {\n  --app-color: var(--mj-text-muted);\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: all 0.15s ease;\n  position: relative;\n}\n\n.nav-bar-app-btn:hover {\n  background: color-mix(in srgb, var(--app-color) 15%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active {\n  background: color-mix(in srgb, var(--app-color) 20%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active::after {\n  content: '';\n  position: absolute;\n  bottom: 6px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 16px;\n  height: 3px;\n  background: var(--app-color);\n  border-radius: 2px;\n}\n\n.nav-bar-app-btn i {\n  transition: transform 0.15s ease;\n  margin-top: 2px; /* Align with app switcher icon */\n}\n\n.nav-bar-app-btn:hover i {\n  transform: scale(1.1);\n}\n\n.spacer {\n  flex: 1;\n}\n\n.header-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.icon-btn {\n  width: 40px;\n  height: 40px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n/* Notification button with badge */\n.notification-btn {\n  position: relative;\n}\n\n.notification-badge {\n  position: absolute;\n  top: 4px;\n  right: 4px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n.user-menu {\n  position: relative;\n}\n\n.user-menu .avatar-btn {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: box-shadow 0.15s, transform 0.15s;\n  padding: 0;\n  overflow: hidden;\n}\n\n.user-menu .avatar-btn:hover {\n  transform: scale(1.05);\n}\n\n/* Icon fallback styling - shows gray circle with icon */\n.user-menu .avatar-btn .icon-fallback {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  border: 2px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-hover);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: border-color 0.15s;\n}\n\n.user-menu .avatar-btn:hover .icon-fallback {\n  border-color: var(--mj-brand-primary);\n}\n\n.user-menu .avatar-btn .icon-fallback i {\n  color: var(--mj-text-muted);\n  font-size: 16px;\n}\n\n/* Avatar image - replaces the gray circle entirely */\n.user-menu .avatar-btn .avatar-img {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  object-fit: cover;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);\n}\n\n.user-menu .avatar-btn:hover .avatar-img {\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);\n}\n\n/* User Menu Header */\n.user-menu-header {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.user-menu-header .user-info {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.user-menu-header .user-name {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n.user-menu-header .user-email {\n  font-size: 12px;\n  color: var(--mj-text-muted);\n}\n\n.user-menu-header .user-subtitle {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n/* User Context Menu */\n.user-context-menu {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  margin-top: 8px;\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-lg);\n  min-width: 180px;\n  z-index: 10000;\n  overflow: hidden;\n}\n\n.user-menu-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  cursor: pointer;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  transition: background 0.15s;\n}\n\n.user-menu-item i {\n  width: 18px;\n  text-align: center;\n  color: var(--mj-text-muted);\n  font-size: 14px;\n}\n\n.user-menu-item:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.user-menu-item.danger {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger i {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger:hover {\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface-elevated));\n}\n\n.user-menu-divider {\n  height: 1px;\n  background: var(--mj-border-default);\n  margin: 4px 0;\n}\n\n/* Menu item disabled state */\n.user-menu-item.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.user-menu-item.disabled:hover {\n  background: transparent;\n}\n\n/* Theme Toggle Switch */\n.theme-toggle-item {\n  cursor: pointer;\n}\n\n.theme-toggle-track {\n  position: relative;\n  width: 40px;\n  height: 22px;\n  border-radius: 11px;\n  background: var(--mj-bg-surface-active);\n  margin-left: auto;\n  transition: background 0.2s ease;\n  flex-shrink: 0;\n}\n\n.theme-toggle-track.dark {\n  background: var(--mj-brand-primary);\n}\n\n.theme-toggle-thumb {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  background: var(--mj-bg-surface);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: transform 0.2s ease;\n}\n\n.theme-toggle-track.dark .theme-toggle-thumb {\n  transform: translateX(18px);\n}\n\n.theme-toggle-icon {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n}\n\n.theme-toggle-track.dark .theme-toggle-icon {\n  color: var(--mj-text-inverse);\n}\n\n/* Menu shortcut hint */\n.user-menu-item .menu-shortcut {\n  margin-left: auto;\n  font-size: 11px;\n  color: var(--mj-text-disabled);\n  font-family: monospace;\n}\n\n/* Menu animations */\n.user-context-menu.menu-fade {\n  animation: menuFadeIn 0.15s ease-out;\n}\n\n.user-context-menu.menu-slide {\n  animation: menuSlideIn 0.2s ease-out;\n}\n\n@keyframes menuFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes menuSlideIn {\n  from {\n    opacity: 0;\n    transform: translateY(-16px) scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n\n.shell-loading {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 99999;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 15vh;\n  background: var(--mj-bg-page);\n}\n\n.loading-version {\n  margin-top: var(--mj-space-8, 24px);\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  letter-spacing: 0.4px;\n  opacity: 0.6;\n  user-select: none;\n}\n\n/* Loading Recovery Reset Panel */\n.loading-reset-panel {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--mj-space-3);\n  margin-top: var(--mj-space-10);\n  padding: var(--mj-space-8);\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-md);\n  max-width: 420px;\n  animation: resetPanelFadeIn 0.4s ease-out;\n}\n\n.loading-reset-message {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.loading-reset-message i {\n  font-size: var(--mj-text-lg);\n  color: var(--mj-status-warning);\n}\n\n.loading-reset-hint {\n  margin: 0;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  text-align: center;\n  line-height: var(--mj-leading-relaxed);\n}\n\n.loading-reset-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin-top: var(--mj-space-3);\n  padding: var(--mj-space-3) var(--mj-space-6);\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-medium);\n  font-family: var(--mj-font-family);\n  color: var(--mj-text-inverse);\n  background: var(--mj-brand-primary);\n  border: 1px solid var(--mj-brand-primary);\n  border-radius: var(--mj-radius-md);\n  cursor: pointer;\n  transition: var(--mj-transition-colors);\n}\n\n.loading-reset-btn:hover {\n  background: var(--mj-brand-primary-hover);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary-hover);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.loading-reset-btn:active {\n  background: var(--mj-brand-primary-active);\n  color: var(--mj-text-inverse);\n  transform: scale(0.98);\n}\n\n.loading-reset-btn i {\n  font-size: var(--mj-text-sm);\n}\n\n@keyframes resetPanelFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(12px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* Hamburger button - hidden on desktop */\n.hamburger-btn {\n  display: none;\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n/* Mobile Navigation Overlay */\n.mobile-nav-overlay {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  z-index: 9998;\n}\n\n/* Mobile Navigation Drawer */\n.mobile-nav-drawer {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 280px;\n  max-width: 85vw;\n  background: var(--mj-bg-surface);\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 9999;\n  flex-direction: column;\n  transform: translateX(-100%);\n  transition: transform 0.3s ease;\n}\n.mobile-nav-drawer.open {\n  transform: translateX(0);\n}\n\n.mobile-nav-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n}\n.mobile-nav-header span {\n  font-weight: 600;\n  font-size: 16px;\n  color: var(--mj-text-primary);\n}\n.mobile-nav-header .close-btn {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header .close-btn:hover {\n  background: var(--mj-bg-surface-active);\n}\n\n.mobile-nav-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px 0;\n}\n\n.mobile-nav-section-title {\n  padding: 8px 20px;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--mj-text-disabled);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer {\n  border-top: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  border-radius: 8px;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  transition: background 0.15s;\n  width: 100%;\n  text-align: left;\n}\n.mobile-nav-action:hover {\n  background: var(--mj-bg-surface-hover);\n}\n.mobile-nav-action i {\n  font-size: 16px;\n  width: 20px;\n  text-align: center;\n}\n\n/* Mobile Responsive Styles */\n@media (max-width: 768px) {\n  .hamburger-btn {\n    display: flex;\n  }\n\n  .desktop-nav {\n    display: none !important;\n  }\n\n  .desktop-only {\n    display: none !important;\n  }\n\n  .mobile-nav-overlay {\n    display: block;\n  }\n\n  .mobile-nav-drawer {\n    display: flex;\n  }\n\n  .shell-header {\n    padding: 0 12px;\n    gap: 8px;\n  }\n\n  /* Keep the right-edge cluster (chat/nav-bar app icons + avatar) on one row.\n     Without pinning this, the icons can wrap and the avatar drops onto a second\n     line, stacking under the chat icon. */\n  .header-actions {\n    flex-direction: row;\n    flex-wrap: nowrap;\n  }\n  .header-actions .user-menu,\n  .header-actions .nav-bar-apps {\n    flex-shrink: 0;\n  }\n}\n\n/* Settings Full-Screen Window Styles */\n::ng-deep .settings-fullscreen-window {\n  /* Remove window chrome for full-screen feel */\n  box-shadow: none !important;\n  border: none !important;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar {\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-title {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar-actions {\n  gap: 4px;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action {\n  width: 32px;\n  height: 32px;\n  border-radius: 6px;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n::ng-deep .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: var(--mj-bg-page);\n}\n\n/* Hide minimize/maximize buttons - only show close */\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action[title=\"Minimize\"],\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action[title=\"Maximize\"],\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action .k-i-window-minimize,\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action .k-i-window-maximize,\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action .k-i-window {\n  display: none !important;\n}\n\n/* ========================================\n   UNIVERSAL SEARCH BAR\n   ======================================== */\n.shell-search-bar {\n    flex: 0 1 420px;\n    min-width: 200px;\n    max-width: 520px;\n    margin: 0 12px;\n    position: relative;\n    z-index: 99999;\n}\n@media (max-width: 768px) {\n    .shell-search-bar { display: none; }\n}\n\n/* ========================================\n   SEARCH POPUP\n   ======================================== */\n\n.search-popup-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.3);\n  z-index: 9999;\n  animation: fadeIn 0.15s ease;\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n.search-popup {\n  position: absolute;\n  top: 60px; /* Below header */\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: var(--mj-bg-surface-elevated);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 10000;\n  opacity: 0;\n  transform: translateY(-10px);\n  pointer-events: none;\n  transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.search-popup.open {\n  opacity: 1;\n  transform: translateY(0);\n  pointer-events: all;\n}\n\n.search-popup-content {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px;\n}\n\n.search-entity-dropdown {\n  min-width: 140px;\n  max-width: 180px;\n  flex-shrink: 0;\n}\n\n.search-input {\n  flex: 1;\n  min-width: 0;\n  height: 40px;\n  padding: 8px 12px;\n  font-size: 14px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 4px;\n  outline: none;\n  display: block !important;\n  box-sizing: border-box;\n}\n\n.search-input:focus {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.search-submit-btn {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 16px;\n  transition: background 0.15s;\n  flex-shrink: 0;\n}\n\n.search-submit-btn:hover {\n  background: var(--mj-brand-primary-hover);\n}\n\n.search-submit-btn:active {\n  background: var(--mj-brand-primary-hover);\n}\n\n/* Mobile notification badge */\n.notification-badge-mobile {\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 11px;\n  font-weight: 600;\n  border-radius: 9px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n/* Mobile-specific search popup adjustments */\n@media (max-width: 768px) {\n  .search-popup {\n    top: 60px;\n    left: 16px;\n    right: 16px;\n    width: auto;\n    max-width: none;\n  }\n\n  .search-popup-content {\n    flex-wrap: wrap;\n  }\n\n  .search-entity-dropdown {\n    width: 100%;\n  }\n\n  .search-input {\n    flex: 1;\n    min-width: 0;\n  }\n}\n\n/* ========================================\n   PIN PROGRESS OVERLAY\n   ======================================== */\n.pin-progress-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-text-primary) 40%, transparent);\n  z-index: 100000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  animation: pinBackdropIn 0.2s ease;\n}\n\n@keyframes pinBackdropIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n.pin-progress-modal {\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-xl);\n  padding: 28px 40px;\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  box-shadow: 0 16px 48px color-mix(in srgb, var(--mj-text-primary) 30%, transparent);\n  animation: pinModalIn 0.25s ease;\n}\n\n@keyframes pinModalIn {\n  from { opacity: 0; transform: scale(0.9) translateY(8px); }\n  to { opacity: 1; transform: scale(1) translateY(0); }\n}\n\n.pin-progress-text {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n  white-space: nowrap;\n}\n/* ============================================================\n   Global Activity indicator (P3)\n   ============================================================ */\n.activity-wrap { position: relative; display: inline-flex; }\n.activity-btn { position: relative; }\n.activity-btn .activity-pulse { color: var(--mj-brand-primary); }\n.activity-badge {\n    position: absolute;\n    top: 2px;\n    right: 2px;\n    min-width: 16px;\n    height: 16px;\n    padding: 0 4px;\n    border-radius: 8px;\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    font-size: 10px;\n    font-weight: 700;\n    line-height: 16px;\n    text-align: center;\n}\n.activity-drawer {\n    position: absolute;\n    top: calc(100% + 8px);\n    right: 0;\n    width: 320px;\n    max-height: 420px;\n    display: flex;\n    flex-direction: column;\n    background: var(--mj-bg-surface-elevated);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 10px;\n    box-shadow: 0 8px 28px color-mix(in srgb, var(--mj-text-primary) 18%, transparent);\n    z-index: 1000;\n    overflow: hidden;\n}\n.activity-drawer-head {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 12px;\n    font-weight: 700;\n    font-size: 0.85rem;\n    color: var(--mj-text-primary);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n.activity-clear {\n    background: none;\n    border: none;\n    color: var(--mj-text-muted);\n    cursor: pointer;\n    font-size: 0.8rem;\n    padding: 4px 6px;\n    border-radius: 6px;\n}\n.activity-clear:hover { color: var(--mj-text-primary); background: var(--mj-bg-surface-hover); }\n.activity-list { overflow-y: auto; padding: 6px; }\n.activity-row {\n    display: flex;\n    gap: 10px;\n    padding: 9px 8px;\n    border-radius: 8px;\n}\n.activity-row:hover { background: var(--mj-bg-surface-hover); }\n.activity-row-icon { margin-top: 2px; color: var(--mj-brand-primary); font-size: 0.85rem; }\n.activity-row.is-error .activity-row-icon { color: var(--mj-status-error); }\n.activity-row-body { flex: 1; min-width: 0; }\n.activity-row-label { font-size: 0.82rem; font-weight: 600; color: var(--mj-text-primary); }\n.activity-row-detail { font-size: 0.72rem; color: var(--mj-text-muted); margin-top: 1px; }\n.activity-bar {\n    margin-top: 6px;\n    height: 4px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 2px;\n    overflow: hidden;\n}\n.activity-bar-fill { height: 100%; background: var(--mj-brand-primary); transition: width 0.3s ease; }\n"] }]
+        args: [{ standalone: false, selector: 'mj-shell', template: "<div class=\"shell-container\" [class.hidden]=\"loading\" [class.tabs-visible]=\"tabBarVisible\">\n  <!-- Header -->\n  <header class=\"shell-header\">\n    <!-- MJ Logo -->\n    <div class=\"mj-logo\" title=\"MemberJunction\"></div>\n\n    <!-- Mobile Hamburger Button -->\n    <button class=\"hamburger-btn\" (click)=\"toggleMobileNav()\" title=\"Menu\">\n      <i class=\"fa-solid fa-bars\"></i>\n    </button>\n\n    <!-- Nav Bar Apps: Left of App Switcher -->\n    @if (leftOfSwitcherApps.length > 0 && !appSwitchingLocked) {\n      <div class=\"nav-bar-apps left-of-switcher\">\n        @for (app of leftOfSwitcherApps; track app) {\n          <button\n            class=\"nav-bar-app-btn\"\n            [class.active]=\"IsActiveApp(app)\"\n            [title]=\"app.Name\"\n            [style.--app-color]=\"app.GetColor()\"\n            (click)=\"onNavBarAppClick(app, $event)\"\n            (dblclick)=\"onNavBarAppDblClick(app, $event)\">\n            <i [class]=\"app.Icon\"></i>\n          </button>\n        }\n      </div>\n    }\n\n    <!-- App Switcher (hidden for app-locked sessions, e.g. magic-link) -->\n    @if (!appSwitchingLocked) {\n      <mj-app-switcher\n        [activeApp]=\"activeApp\"\n        [isViewingSystemTab]=\"isViewingSystemTab\"\n        [loadingAppId]=\"loadingAppId\"\n        (appSelected)=\"onAppSwitch($event)\">\n      </mj-app-switcher>\n    }\n\n    <!-- App Navigation (desktop only) -->\n    @if (activeApp) {\n      <mj-app-nav\n        class=\"desktop-nav\"\n        [app]=\"activeApp\"\n        (navItemClick)=\"onNavItemClick($event)\"\n        (navItemDismiss)=\"onNavItemDismiss($event)\">\n      </mj-app-nav>\n    }\n\n    <!-- Spacer -->\n    <div class=\"spacer\"></div>\n    <!-- Actions (activity, notifications, user menu) -->\n    <div class=\"header-actions\">\n      <!-- Universal Search \u2014 right-anchored with the action cluster, static width\n           (2026-07 review consensus: visible when space permits, never resizes).\n           Omnibar ON: a button styled as an input \u2014 clicking (or Ctrl/Cmd+K) opens\n           the modal palette; typing happens there. Collapses to the icon circle at\n           the mobile breakpoint.\n           Omnibar OFF: a REAL inline input (mj-search-composite) \u2014 results attach\n           beneath it as a suggest dropdown with a \"See all results\" footer. On\n           mobile the composite hides and an icon button opens the Spotlight\n           overlay instead (same slot, same collapse point). -->\n      @if (ShowSearchBar) {\n        @if (UseOmnibar) {\n          <button class=\"search-btn\" title=\"Search everything\"\n            [attr.aria-label]=\"'Search everything (' + OmnibarShortcutLabel + ')'\"\n            (click)=\"OnHeaderSearchClick()\">\n            <i class=\"fa-solid fa-magnifying-glass\"></i>\n            <span class=\"search-btn-text desktop-only\">Search everything</span>\n            <kbd class=\"search-btn-kbd desktop-only\" aria-hidden=\"true\">{{ OmnibarShortcutLabel }}</kbd>\n          </button>\n        } @else {\n          <div class=\"shell-search-bar desktop-only\">\n            <mj-search-composite\n              #shellSearchComposite\n              Placeholder=\"Search everything...\"\n              [ShowShortcutHint]=\"true\"\n              [EnablePreview]=\"ShowSearchPreview\"\n              [EnableRecent]=\"true\"\n              [MaxPreviewResults]=\"8\"\n              [ShowPromo]=\"ShowOmnibarPromo\"\n              [PromoText]=\"OmnibarPromoText\"\n              (ResultSelected)=\"OnSearchResultSelected($event)\"\n              (SearchSubmitted)=\"OnSearchSubmitted($event)\"\n              (SeeAllRequested)=\"OnSeeAllSearch($event)\"\n              (RecentRecordSelected)=\"OnSearchResultSelected($event)\"\n              (PromoAccepted)=\"OnOmnibarPromoAccepted($event)\"\n              (PromoDismissed)=\"OnOmnibarPromoDismissed()\">\n            </mj-search-composite>\n          </div>\n          <button class=\"search-btn search-btn-mobile\" title=\"Search everything\"\n            [attr.aria-label]=\"'Search everything (' + OmnibarShortcutLabel + ')'\"\n            (click)=\"OnHeaderSearchClick()\">\n            <i class=\"fa-solid fa-magnifying-glass\"></i>\n          </button>\n        }\n      }\n      <!-- Global Activity indicator -->\n      @if (activityItems.length > 0) {\n        <div class=\"activity-wrap\">\n          <button class=\"icon-btn desktop-only activity-btn\" title=\"Activity\" (click)=\"toggleActivity($event)\">\n            <i class=\"fa-solid fa-wave-square\" [class.activity-pulse]=\"activityRunningCount > 0\"></i>\n            @if (activityRunningCount > 0) {\n              <span class=\"activity-badge\">{{ activityRunningCount }}</span>\n            }\n          </button>\n          @if (activityOpen) {\n            <div class=\"activity-drawer\" (click)=\"$event.stopPropagation()\">\n              <div class=\"activity-drawer-head\">\n                <span>Activity</span>\n                <button class=\"activity-clear\" (click)=\"clearFinishedActivity()\" title=\"Clear finished\">\n                  <i class=\"fa-solid fa-broom\"></i>\n                </button>\n              </div>\n              <div class=\"activity-list\">\n                @for (a of activityItems; track a.ID) {\n                  <div class=\"activity-row\" [class.is-error]=\"a.Status === 'error'\">\n                    <i class=\"activity-row-icon\"\n                       [class]=\"a.Status === 'running' ? 'fa-solid fa-spinner fa-spin'\n                              : a.Status === 'error' ? 'fa-solid fa-circle-exclamation'\n                              : 'fa-solid fa-circle-check'\"></i>\n                    <div class=\"activity-row-body\">\n                      <div class=\"activity-row-label\">{{ a.Label }}</div>\n                      @if (a.Detail) { <div class=\"activity-row-detail\">{{ a.Detail }}</div> }\n                      @if (a.Status === 'running' && a.Progress != null) {\n                        <div class=\"activity-bar\"><div class=\"activity-bar-fill\" [style.width.%]=\"a.Progress\"></div></div>\n                      }\n                    </div>\n                  </div>\n                }\n              </div>\n            </div>\n          }\n        </div>\n      }\n      <button class=\"icon-btn desktop-only notification-btn\" title=\"Notifications\" (click)=\"showNotifications()\">\n        <i class=\"fa-solid fa-bell\"></i>\n        @if (unreadNotificationCount > 0) {\n          <span class=\"notification-badge\">\n            {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n          </span>\n        }\n      </button>\n      <!-- Nav Bar Apps: Left of User Menu -->\n      @if (leftOfUserMenuApps.length > 0) {\n        <div class=\"nav-bar-apps left-of-user-menu\">\n          @for (app of leftOfUserMenuApps; track app) {\n            <button\n              class=\"nav-bar-app-btn\"\n              [class.active]=\"IsActiveApp(app)\"\n              [title]=\"app.Name\"\n              [style.--app-color]=\"app.GetColor()\"\n              (click)=\"onNavBarAppClick(app, $event)\"\n              (dblclick)=\"onNavBarAppDblClick(app, $event)\">\n              <i [class]=\"app.Icon\"></i>\n            </button>\n          }\n        </div>\n      }\n\n      <div class=\"user-menu\">\n        <button class=\"avatar-btn\" (click)=\"toggleUserMenu($event)\">\n          @if (userImageURL) {\n            <img [src]=\"userImageURL\" alt=\"User avatar\" class=\"avatar-img\" />\n          } @else {\n            <div class=\"icon-fallback\">\n              <i [class]=\"userIconClass || 'fa-solid fa-user'\"></i>\n            </div>\n          }\n        </button>\n        <!-- User Context Menu (Dynamic) -->\n        @if (userMenuVisible) {\n          <div class=\"user-context-menu\"\n            [class.menu-fade]=\"getUserMenuOptions()?.animationStyle === 'fade'\"\n            [class.menu-slide]=\"getUserMenuOptions()?.animationStyle === 'slide'\">\n            <!-- User Header -->\n            @if (getUserMenuOptions()?.showUserName) {\n              <div class=\"user-menu-header\">\n                <div class=\"user-info\">\n                  <span class=\"user-name\">{{ getUserDisplayInfo()?.name || userName }}</span>\n                  @if (getUserMenuOptions()?.showUserEmail && getUserDisplayInfo()?.email) {\n                    <span class=\"user-email\">\n                      {{ getUserDisplayInfo()?.email }}\n                    </span>\n                  }\n                  @if (getUserDisplayInfo()?.subtitle) {\n                    <span class=\"user-subtitle\">{{ getUserDisplayInfo()?.subtitle }}</span>\n                  }\n                </div>\n              </div>\n              <div class=\"user-menu-divider\"></div>\n            }\n            <!-- Dynamic Menu Items -->\n            @for (element of userMenuElements; track element) {\n              <!-- Divider -->\n              @if (isMenuDivider(element)) {\n                <div class=\"user-menu-divider\"></div>\n              }\n              <!-- Menu Item -->\n              @if (!isMenuDivider(element)) {\n                @if (asMenuItem(element); as item) {\n                  @if (item.id === 'toggle-theme') {\n                    <div class=\"user-menu-item theme-toggle-item\"\n                      [title]=\"item.tooltip || ''\"\n                      (click)=\"onUserMenuItemClick(item.id)\">\n                      <i [class]=\"item.icon\"></i>\n                      <span class=\"menu-label\">{{ item.label }}</span>\n                      <div class=\"theme-toggle-track\" [class.dark]=\"IsDarkMode\">\n                        <div class=\"theme-toggle-thumb\">\n                          <i [class]=\"IsDarkMode ? 'fa-solid fa-moon' : 'fa-solid fa-sun'\" class=\"theme-toggle-icon\"></i>\n                        </div>\n                      </div>\n                    </div>\n                  } @else {\n                    <div class=\"user-menu-item\"\n                      [class.disabled]=\"!item.enabled\"\n                      [class.danger]=\"item.cssClass === 'danger'\"\n                      [style.color]=\"item.color || null\"\n                      [title]=\"item.tooltip || ''\"\n                      (click)=\"item.enabled && onUserMenuItemClick(item.id)\">\n                      <i [class]=\"item.icon\"></i>\n                      <span class=\"menu-label\">{{ item.label }}</span>\n                      @if (item.shortcut) {\n                        <span class=\"menu-shortcut\">{{ item.shortcut }}</span>\n                      }\n                    </div>\n                  }\n                }\n              }\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </header>\n\n  <!-- Search Popup -->\n  @if (isSearchOpen) {\n    <div class=\"search-popup-overlay\" (click)=\"closeSearch()\"></div>\n  }\n  <div class=\"search-popup\" [class.open]=\"isSearchOpen\">\n    <div class=\"search-popup-content\" (click)=\"$event.stopPropagation()\">\n      <mj-dropdown\n        [Data]=\"searchableEntities\"\n        TextField=\"Name\"\n        ValueField=\"ID\"\n        class=\"search-entity-dropdown\"\n        [(ngModel)]=\"selectedEntity\">\n      </mj-dropdown>\n      <input\n        type=\"text\"\n        #searchInput\n        placeholder=\"Search...\"\n        class=\"mj-input search-input\"\n        (keydown.enter)=\"onSearch($event)\"\n        />\n      <button class=\"search-submit-btn\" (click)=\"onSearch($event)\" title=\"Search\">\n        <i class=\"fa-solid fa-search\"></i>\n      </button>\n    </div>\n  </div>\n\n  <!-- Mobile Navigation Drawer -->\n  @if (mobileNavOpen) {\n    <div class=\"mobile-nav-overlay\" (click)=\"closeMobileNav()\"></div>\n  }\n  <div class=\"mobile-nav-drawer\" [class.open]=\"mobileNavOpen\">\n    <div class=\"mobile-nav-header\">\n      <span>Navigation</span>\n      <button class=\"close-btn\" (click)=\"closeMobileNav()\">\n        <i class=\"fa-solid fa-xmark\"></i>\n      </button>\n    </div>\n    @if (activeApp) {\n      <div class=\"mobile-nav-content\">\n        <div class=\"mobile-nav-section-title\">{{ activeApp.Name }}</div>\n        <mj-app-nav\n          [app]=\"activeApp\"\n          (navItemClick)=\"onNavItemClick($event)\"\n          (navItemDismiss)=\"onNavItemDismiss($event)\">\n        </mj-app-nav>\n      </div>\n    }\n    <div class=\"mobile-nav-footer\">\n      <button class=\"mobile-nav-action\" title=\"Search\" (click)=\"toggleSearch(); closeMobileNav()\">\n        <i class=\"fa-solid fa-search\"></i>\n        <span>Search</span>\n      </button>\n      <button class=\"mobile-nav-action\" title=\"Notifications\" (click)=\"showNotifications(); closeMobileNav()\">\n        <i class=\"fa-solid fa-bell\"></i>\n        <span>Notifications</span>\n        @if (unreadNotificationCount > 0) {\n          <span class=\"notification-badge-mobile\">\n            {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n          </span>\n        }\n      </button>\n    </div>\n  </div>\n\n  <!-- Tab Container - with dynamic tab bar visibility -->\n  <mj-tab-container\n    [class.hide-tab-bar]=\"!tabBarVisible\"\n    (firstResourceLoadComplete)=\"onFirstResourceLoadComplete()\"\n    (layoutInitError)=\"handleLayoutError()\">\n  </mj-tab-container>\n</div>\n\n<!-- Loading State -->\n@if (loading) {\n  <div class=\"shell-loading\">\n    <mj-loading\n      [text]=\"currentLoadingText\"\n      [textColor]=\"currentLoadingTextColor\"\n      [logoColor]=\"currentLoadingColor\"\n      [logoGradient]=\"currentLoadingGradient\"\n      [animation]=\"currentLoadingAnimation\"\n      size=\"large\">\n    </mj-loading>\n    @if (ShowResetOption) {\n      <div class=\"loading-reset-panel\">\n        <p class=\"loading-reset-message\">\n          <i class=\"fa-regular fa-clock\"></i>\n          Taking longer than expected\n        </p>\n        <p class=\"loading-reset-hint\">\n          This can happen after updates or due to cached data issues.\n        </p>\n        <button class=\"loading-reset-btn\" (click)=\"ResetApplication()\">\n          <i class=\"fa-solid fa-arrows-rotate\"></i>\n          Reset\n        </button>\n      </div>\n    } @else {\n      <div class=\"loading-version\">MemberJunction \u00B7 v{{ MJVersion }}</div>\n    }\n  </div>\n}\n\n<!-- App Access Error Dialog -->\n<mj-app-access-dialog\n  #appAccessDialog\n  (result)=\"onAppAccessDialogResult($event)\">\n</mj-app-access-dialog>\n\n<!-- Command Palette -->\n<mj-command-palette (AppSelected)=\"onAppSwitch($event)\"></mj-command-palette>\n\n<!-- Unified command palette (Shell.Omnibar.Enabled) -->\n<mj-omnibar-palette #omnibarPalette (SettingsRequested)=\"OnPaletteSettingsRequested()\"></mj-omnibar-palette>\n\n<!-- Legacy universal search as a Spotlight-style overlay \u2014 omnibar-off MOBILE only\n     (on desktop the inline header composite owns the experience; this opens from\n     the mobile icon or Ctrl/Cmd+K when the composite isn't visible).\n     The shell owns the Ctrl/Cmd+K chord, so the overlay's own global shortcut is off. -->\n@if (ShowSearchBar && !UseOmnibar) {\n  <mj-search-overlay\n    [(IsOpen)]=\"LegacySearchOpen\"\n    Placeholder=\"Search everything...\"\n    [EnableGlobalShortcut]=\"false\"\n    [ShowPromo]=\"ShowOmnibarPromo\"\n    [PromoText]=\"OmnibarPromoText\"\n    (ResultSelected)=\"OnOverlayResultSelected($event)\"\n    (SeeAllRequested)=\"OnOverlaySeeAll($event)\"\n    (PromoAccepted)=\"OnOmnibarPromoAccepted($event)\"\n    (PromoDismissed)=\"OnOmnibarPromoDismissed()\">\n  </mj-search-overlay>\n}\n\n<!-- Pin Progress Overlay -->\n@if (PinProgressVisible) {\n  <div class=\"pin-progress-backdrop\">\n    <div class=\"pin-progress-modal\">\n      <mj-loading [showText]=\"false\" size=\"small\"></mj-loading>\n      <span class=\"pin-progress-text\">{{ PinProgressText }}</span>\n    </div>\n  </div>\n}\n", styles: [":host {\n  display: block;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n}\n\n/* MJ Logo - uses design token for theme switching & white-labeling */\n.mj-logo {\n  width: 32px;\n  height: 18px;\n  background-image: var(--mj-logo-mark);\n  background-repeat: no-repeat;\n  background-position: center;\n  background-size: contain;\n  flex-shrink: 0;\n}\n\n.shell-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: 100%;\n  overflow: hidden;\n  position: relative;\n}\n\n/* Hide shell container while loading - allows tab container to render and load\n   first resource in background while shell loading indicator is visible */\n.shell-container.hidden {\n  visibility: hidden;\n  position: absolute;\n  pointer-events: none;\n}\n\nmj-tab-container {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  transition: all 0.2s ease-in-out;\n}\n\n/* Hide Golden Layout tab headers when only one tab */\nmj-tab-container.hide-tab-bar ::ng-deep .lm_header {\n  display: none;\n}\n\n/* Show tab headers when multiple tabs */\nmj-tab-container:not(.hide-tab-bar) ::ng-deep .lm_header {\n  opacity: 1;\n  max-height: 40px;\n  transition: opacity 0.2s ease-in-out, max-height 0.2s ease-in-out;\n}\n\n/* Adjust content area height when tabs hidden */\nmj-tab-container.hide-tab-bar ::ng-deep .lm_content {\n  height: 100% !important;\n}\n\n/* Ensure smooth transitions */\nmj-tab-container ::ng-deep .lm_stack {\n  transition: all 0.2s ease-in-out;\n}\n\n.shell-header {\n  height: 60px;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: var(--mj-shadow-sm);\n  flex-shrink: 0;\n  /* Creates a stacking context so children (search bar z-index: 99999, dropdown)\n     are contained within this level. Modal overlays (z-index: 1000+) sit above. */\n  position: relative;\n  z-index: 500;\n}\n\n/* Nav Bar Apps - permanent app icons in the header */\n.nav-bar-apps {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.nav-bar-apps.left-of-switcher {\n  /* No extra margin - header gap handles spacing */\n  /* This prevents the app switcher from shifting when icons are hidden */\n}\n\n.nav-bar-apps.left-of-user-menu {\n  margin-right: 8px;\n}\n\n.nav-bar-app-btn {\n  --app-color: var(--mj-text-muted);\n  width: 40px;\n  height: 40px;\n  border-radius: 10px;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: all 0.15s ease;\n  position: relative;\n}\n\n.nav-bar-app-btn:hover {\n  background: color-mix(in srgb, var(--app-color) 15%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active {\n  background: color-mix(in srgb, var(--app-color) 20%, transparent);\n  color: var(--app-color);\n}\n\n.nav-bar-app-btn.active::after {\n  content: '';\n  position: absolute;\n  bottom: 6px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 16px;\n  height: 3px;\n  background: var(--app-color);\n  border-radius: 2px;\n}\n\n.nav-bar-app-btn i {\n  transition: transform 0.15s ease;\n  margin-top: 2px; /* Align with app switcher icon */\n}\n\n.nav-bar-app-btn:hover i {\n  transform: scale(1.1);\n}\n\n.spacer {\n  flex: 1;\n}\n\n.header-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.icon-btn {\n  width: 40px;\n  height: 40px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n/* Universal search: a static-width bar styled as an input, anchored on the\n   right with the action cluster. Deliberately NOT resizable on hover/focus \u2014\n   chrome that shifts on interaction was rejected in the 2026-07 review. It's a\n   button (typing happens in the overlay it opens), so no focus/caret styling. */\n.search-btn {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  width: 260px;\n  height: 36px;\n  padding: 0 var(--mj-space-2-5) 0 var(--mj-space-3-5);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  font-size: var(--mj-text-sm);\n  font-family: inherit;\n  cursor: pointer;\n  transition: var(--mj-transition-colors);\n}\n\n.search-btn:hover {\n  border-color: var(--mj-border-strong);\n  background: var(--mj-bg-surface-card);\n  color: var(--mj-text-secondary);\n}\n\n.search-btn:focus-visible {\n  outline: none;\n  border-color: var(--mj-border-focus);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n/* Omnibar-off mobile trigger: hidden on desktop (the inline composite renders\n   instead); the 768px block flips it on as the icon circle. */\n.search-btn-mobile {\n  display: none;\n}\n\n/* Omnibar-off desktop: the inline search composite, same slot + width as the\n   omnibar bar so the opt-in toggle doesn't move the header. */\n.shell-search-bar {\n  position: relative;\n  width: 260px;\n  z-index: 99999;\n}\n\n/* The suggest dropdown needs more width than its 260px anchor. Pin it to the\n   anchor's right edge and let it grow leftward \u2014 the bar is right-anchored, so\n   leftward growth stays on screen. */\n.shell-search-bar ::ng-deep .suggest-dropdown {\n  left: auto;\n  right: 0;\n  width: min(560px, calc(100vw - var(--mj-space-6)));\n}\n\n.search-btn i {\n  font-size: var(--mj-text-sm);\n  flex-shrink: 0;\n}\n\n.search-btn .search-btn-text {\n  flex: 1;\n  min-width: 0;\n  text-align: left;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n/* kbd chip: deliberately mirrors the omnibar palette's .ob-kbd chrome\n   (10.5px / 5px radius / bottom-heavy border) so the affordance and the\n   surface it summons read as one system. */\n.search-btn .search-btn-kbd {\n  flex-shrink: 0;\n  white-space: nowrap;\n  font-family: inherit;\n  font-size: 10.5px;\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-muted);\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong);\n  border-bottom-width: 2px;\n  border-radius: 5px;\n  padding: 1.5px var(--mj-space-1-5);\n}\n\n/* Notification button with badge */\n.notification-btn {\n  position: relative;\n}\n\n.notification-badge {\n  position: absolute;\n  top: 4px;\n  right: 4px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n.user-menu {\n  position: relative;\n}\n\n.user-menu .avatar-btn {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: box-shadow 0.15s, transform 0.15s;\n  padding: 0;\n  overflow: hidden;\n}\n\n.user-menu .avatar-btn:hover {\n  transform: scale(1.05);\n}\n\n/* Icon fallback styling - shows gray circle with icon */\n.user-menu .avatar-btn .icon-fallback {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  border: 2px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-hover);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: border-color 0.15s;\n}\n\n.user-menu .avatar-btn:hover .icon-fallback {\n  border-color: var(--mj-brand-primary);\n}\n\n.user-menu .avatar-btn .icon-fallback i {\n  color: var(--mj-text-muted);\n  font-size: 16px;\n}\n\n/* Avatar image - replaces the gray circle entirely */\n.user-menu .avatar-btn .avatar-img {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  object-fit: cover;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);\n}\n\n.user-menu .avatar-btn:hover .avatar-img {\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);\n}\n\n/* User Menu Header */\n.user-menu-header {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.user-menu-header .user-info {\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.user-menu-header .user-name {\n  font-weight: 600;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n.user-menu-header .user-email {\n  font-size: 12px;\n  color: var(--mj-text-muted);\n}\n\n.user-menu-header .user-subtitle {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  font-style: italic;\n}\n\n/* User Context Menu */\n.user-context-menu {\n  position: absolute;\n  top: 100%;\n  right: 0;\n  margin-top: 8px;\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-lg);\n  min-width: 180px;\n  z-index: 10000;\n  overflow: hidden;\n}\n\n.user-menu-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  cursor: pointer;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  transition: background 0.15s;\n}\n\n.user-menu-item i {\n  width: 18px;\n  text-align: center;\n  color: var(--mj-text-muted);\n  font-size: 14px;\n}\n\n.user-menu-item:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.user-menu-item.danger {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger i {\n  color: var(--mj-status-error);\n}\n\n.user-menu-item.danger:hover {\n  background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface-elevated));\n}\n\n.user-menu-divider {\n  height: 1px;\n  background: var(--mj-border-default);\n  margin: 4px 0;\n}\n\n/* Menu item disabled state */\n.user-menu-item.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.user-menu-item.disabled:hover {\n  background: transparent;\n}\n\n/* Theme Toggle Switch */\n.theme-toggle-item {\n  cursor: pointer;\n}\n\n.theme-toggle-track {\n  position: relative;\n  width: 40px;\n  height: 22px;\n  border-radius: 11px;\n  background: var(--mj-bg-surface-active);\n  margin-left: auto;\n  transition: background 0.2s ease;\n  flex-shrink: 0;\n}\n\n.theme-toggle-track.dark {\n  background: var(--mj-brand-primary);\n}\n\n.theme-toggle-thumb {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 18px;\n  height: 18px;\n  border-radius: 50%;\n  background: var(--mj-bg-surface);\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: transform 0.2s ease;\n}\n\n.theme-toggle-track.dark .theme-toggle-thumb {\n  transform: translateX(18px);\n}\n\n.theme-toggle-icon {\n  font-size: 10px;\n  color: var(--mj-text-muted);\n}\n\n.theme-toggle-track.dark .theme-toggle-icon {\n  color: var(--mj-text-inverse);\n}\n\n/* Menu shortcut hint */\n.user-menu-item .menu-shortcut {\n  margin-left: auto;\n  font-size: 11px;\n  color: var(--mj-text-disabled);\n  font-family: monospace;\n}\n\n/* Menu animations */\n.user-context-menu.menu-fade {\n  animation: menuFadeIn 0.15s ease-out;\n}\n\n.user-context-menu.menu-slide {\n  animation: menuSlideIn 0.2s ease-out;\n}\n\n@keyframes menuFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(-8px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes menuSlideIn {\n  from {\n    opacity: 0;\n    transform: translateY(-16px) scale(0.95);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0) scale(1);\n  }\n}\n\n.shell-loading {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  z-index: 99999;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding-bottom: 15vh;\n  background: var(--mj-bg-page);\n}\n\n.loading-version {\n  margin-top: var(--mj-space-8, 24px);\n  font-size: 11px;\n  color: var(--mj-text-muted);\n  letter-spacing: 0.4px;\n  opacity: 0.6;\n  user-select: none;\n}\n\n/* Loading Recovery Reset Panel */\n.loading-reset-panel {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--mj-space-3);\n  margin-top: var(--mj-space-10);\n  padding: var(--mj-space-8);\n  background: var(--mj-bg-surface-elevated);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-md);\n  max-width: 420px;\n  animation: resetPanelFadeIn 0.4s ease-out;\n}\n\n.loading-reset-message {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.loading-reset-message i {\n  font-size: var(--mj-text-lg);\n  color: var(--mj-status-warning);\n}\n\n.loading-reset-hint {\n  margin: 0;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  text-align: center;\n  line-height: var(--mj-leading-relaxed);\n}\n\n.loading-reset-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  margin-top: var(--mj-space-3);\n  padding: var(--mj-space-3) var(--mj-space-6);\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-medium);\n  font-family: var(--mj-font-family);\n  color: var(--mj-text-inverse);\n  background: var(--mj-brand-primary);\n  border: 1px solid var(--mj-brand-primary);\n  border-radius: var(--mj-radius-md);\n  cursor: pointer;\n  transition: var(--mj-transition-colors);\n}\n\n.loading-reset-btn:hover {\n  background: var(--mj-brand-primary-hover);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary-hover);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.loading-reset-btn:active {\n  background: var(--mj-brand-primary-active);\n  color: var(--mj-text-inverse);\n  transform: scale(0.98);\n}\n\n.loading-reset-btn i {\n  font-size: var(--mj-text-sm);\n}\n\n@keyframes resetPanelFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(12px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n/* Hamburger button - hidden on desktop */\n.hamburger-btn {\n  display: none;\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-secondary);\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n/* Mobile Navigation Overlay */\n.mobile-nav-overlay {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  z-index: 9998;\n}\n\n/* Mobile Navigation Drawer */\n.mobile-nav-drawer {\n  display: none;\n  position: fixed;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  width: 280px;\n  max-width: 85vw;\n  background: var(--mj-bg-surface);\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 9999;\n  flex-direction: column;\n  transform: translateX(-100%);\n  transition: transform 0.3s ease;\n}\n.mobile-nav-drawer.open {\n  transform: translateX(0);\n}\n\n.mobile-nav-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n}\n.mobile-nav-header span {\n  font-weight: 600;\n  font-size: 16px;\n  color: var(--mj-text-primary);\n}\n.mobile-nav-header .close-btn {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  border: none;\n  background: none;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-muted);\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header .close-btn:hover {\n  background: var(--mj-bg-surface-active);\n}\n\n.mobile-nav-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px 0;\n}\n\n.mobile-nav-section-title {\n  padding: 8px 20px;\n  font-size: 12px;\n  font-weight: 600;\n  color: var(--mj-text-disabled);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer {\n  border-top: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px;\n  border: none;\n  background: none;\n  cursor: pointer;\n  border-radius: 8px;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n  transition: background 0.15s;\n  width: 100%;\n  text-align: left;\n}\n.mobile-nav-action:hover {\n  background: var(--mj-bg-surface-hover);\n}\n.mobile-nav-action i {\n  font-size: 16px;\n  width: 20px;\n  text-align: center;\n}\n\n/* Mobile Responsive Styles */\n@media (max-width: 768px) {\n  .hamburger-btn {\n    display: flex;\n  }\n\n  .desktop-nav {\n    display: none !important;\n  }\n\n  .desktop-only {\n    display: none !important;\n  }\n\n  .mobile-nav-overlay {\n    display: block;\n  }\n\n  .mobile-nav-drawer {\n    display: flex;\n  }\n\n  .shell-header {\n    padding: 0 12px;\n    gap: 8px;\n  }\n\n  /* Keep the right-edge cluster (chat/nav-bar app icons + avatar) on one row.\n     Without pinning this, the icons can wrap and the avatar drops onto a second\n     line, stacking under the chat icon. */\n  .header-actions {\n    flex-direction: row;\n    flex-wrap: nowrap;\n  }\n  .header-actions .user-menu,\n  .header-actions .nav-bar-apps,\n  .header-actions .search-btn {\n    flex-shrink: 0;\n  }\n\n  /* Search bar collapses to the icon-only circle on small viewports \u2014\n     the placeholder text + kbd chip are already hidden via .desktop-only.\n     The omnibar-off mobile trigger (.search-btn-mobile) becomes visible here;\n     its .desktop-only composite sibling is hidden by the rule above. */\n  .search-btn {\n    display: flex;\n    width: 40px;\n    height: 40px;\n    padding: 0;\n    justify-content: center;\n    border: none;\n    border-radius: 50%;\n    background: none;\n  }\n  .search-btn i {\n    font-size: var(--mj-text-lg);\n  }\n  .search-btn:hover {\n    background: var(--mj-bg-surface-hover);\n    border: none;\n  }\n}\n\n/* Settings Full-Screen Window Styles */\n::ng-deep .settings-fullscreen-window {\n  /* Remove window chrome for full-screen feel */\n  box-shadow: none !important;\n  border: none !important;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar {\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 12px 16px;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-title {\n  font-size: 18px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar-actions {\n  gap: 4px;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action {\n  width: 32px;\n  height: 32px;\n  border-radius: 6px;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n::ng-deep .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: var(--mj-bg-page);\n}\n\n/* Hide minimize/maximize buttons - only show close */\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action[title=\"Minimize\"],\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action[title=\"Maximize\"],\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action .k-i-window-minimize,\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action .k-i-window-maximize,\n::ng-deep .settings-fullscreen-window .k-window-titlebar-action .k-i-window {\n  display: none !important;\n}\n\n/* Universal search is a right-anchored bar affordance in header-actions\n   (2026-07 design review round 2): both experiences still open as overlays \u2014\n   the bar is a trigger, not an inline input. Icon-only under 768px. */\n\n/* ========================================\n   SEARCH POPUP\n   ======================================== */\n\n.search-popup-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.3);\n  z-index: 9999;\n  animation: fadeIn 0.15s ease;\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n.search-popup {\n  position: absolute;\n  top: 60px; /* Below header */\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: var(--mj-bg-surface-elevated);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-xl);\n  z-index: 10000;\n  opacity: 0;\n  transform: translateY(-10px);\n  pointer-events: none;\n  transition: opacity 0.2s ease, transform 0.2s ease;\n}\n\n.search-popup.open {\n  opacity: 1;\n  transform: translateY(0);\n  pointer-events: all;\n}\n\n.search-popup-content {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 12px;\n}\n\n.search-entity-dropdown {\n  min-width: 140px;\n  max-width: 180px;\n  flex-shrink: 0;\n}\n\n.search-input {\n  flex: 1;\n  min-width: 0;\n  height: 40px;\n  padding: 8px 12px;\n  font-size: 14px;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 4px;\n  outline: none;\n  display: block !important;\n  box-sizing: border-box;\n}\n\n.search-input:focus {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.search-submit-btn {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 16px;\n  transition: background 0.15s;\n  flex-shrink: 0;\n}\n\n.search-submit-btn:hover {\n  background: var(--mj-brand-primary-hover);\n}\n\n.search-submit-btn:active {\n  background: var(--mj-brand-primary-hover);\n}\n\n/* Mobile notification badge */\n.notification-badge-mobile {\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n  font-size: 11px;\n  font-weight: 600;\n  border-radius: 9px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n/* Mobile-specific search popup adjustments */\n@media (max-width: 768px) {\n  .search-popup {\n    top: 60px;\n    left: 16px;\n    right: 16px;\n    width: auto;\n    max-width: none;\n  }\n\n  .search-popup-content {\n    flex-wrap: wrap;\n  }\n\n  .search-entity-dropdown {\n    width: 100%;\n  }\n\n  .search-input {\n    flex: 1;\n    min-width: 0;\n  }\n}\n\n/* ========================================\n   PIN PROGRESS OVERLAY\n   ======================================== */\n.pin-progress-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-text-primary) 40%, transparent);\n  z-index: 100000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  animation: pinBackdropIn 0.2s ease;\n}\n\n@keyframes pinBackdropIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n.pin-progress-modal {\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-xl);\n  padding: 28px 40px;\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  box-shadow: 0 16px 48px color-mix(in srgb, var(--mj-text-primary) 30%, transparent);\n  animation: pinModalIn 0.25s ease;\n}\n\n@keyframes pinModalIn {\n  from { opacity: 0; transform: scale(0.9) translateY(8px); }\n  to { opacity: 1; transform: scale(1) translateY(0); }\n}\n\n.pin-progress-text {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n  white-space: nowrap;\n}\n/* ============================================================\n   Global Activity indicator (P3)\n   ============================================================ */\n.activity-wrap { position: relative; display: inline-flex; }\n.activity-btn { position: relative; }\n.activity-btn .activity-pulse { color: var(--mj-brand-primary); }\n.activity-badge {\n    position: absolute;\n    top: 2px;\n    right: 2px;\n    min-width: 16px;\n    height: 16px;\n    padding: 0 4px;\n    border-radius: 8px;\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    font-size: 10px;\n    font-weight: 700;\n    line-height: 16px;\n    text-align: center;\n}\n.activity-drawer {\n    position: absolute;\n    top: calc(100% + 8px);\n    right: 0;\n    width: 320px;\n    max-height: 420px;\n    display: flex;\n    flex-direction: column;\n    background: var(--mj-bg-surface-elevated);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 10px;\n    box-shadow: 0 8px 28px color-mix(in srgb, var(--mj-text-primary) 18%, transparent);\n    z-index: 1000;\n    overflow: hidden;\n}\n.activity-drawer-head {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px 12px;\n    font-weight: 700;\n    font-size: 0.85rem;\n    color: var(--mj-text-primary);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n.activity-clear {\n    background: none;\n    border: none;\n    color: var(--mj-text-muted);\n    cursor: pointer;\n    font-size: 0.8rem;\n    padding: 4px 6px;\n    border-radius: 6px;\n}\n.activity-clear:hover { color: var(--mj-text-primary); background: var(--mj-bg-surface-hover); }\n.activity-list { overflow-y: auto; padding: 6px; }\n.activity-row {\n    display: flex;\n    gap: 10px;\n    padding: 9px 8px;\n    border-radius: 8px;\n}\n.activity-row:hover { background: var(--mj-bg-surface-hover); }\n.activity-row-icon { margin-top: 2px; color: var(--mj-brand-primary); font-size: 0.85rem; }\n.activity-row.is-error .activity-row-icon { color: var(--mj-status-error); }\n.activity-row-body { flex: 1; min-width: 0; }\n.activity-row-label { font-size: 0.82rem; font-weight: 600; color: var(--mj-text-primary); }\n.activity-row-detail { font-size: 0.72rem; color: var(--mj-text-muted); margin-top: 1px; }\n.activity-bar {\n    margin-top: 6px;\n    height: 4px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 2px;\n    overflow: hidden;\n}\n.activity-bar-fill { height: 100%; background: var(--mj-brand-primary); transition: width 0.3s ease; }\n\n"] }]
     }], () => [{ type: i1.ApplicationManager }, { type: i1.WorkspaceStateManager }, { type: i1.GoldenLayoutManager }, { type: i1.TabService }, { type: i2.NavigationService }, { type: i3.ActivatedRoute }, { type: i3.Router }, { type: i4.MJAuthBase }, { type: i0.ChangeDetectorRef }, { type: i5.UserAvatarService }, { type: i6.UserSharingCenterDialogService }, { type: i7.AboutDialogService }, { type: i8.ProfileDialogService }, { type: i0.ViewContainerRef }, { type: i2.TitleService }, { type: i2.DeveloperModeService }, { type: i9.StartupValidationService }, { type: i10.CommandPaletteService }, { type: i2.ThemeService }, { type: i2.HomeAppPinService }, { type: i11.FileOpenService }, { type: i12.FeedbackDialogService }, { type: i12.FeedbackService }, { type: i2.ActivityService }], { searchInput: [{
             type: ViewChild,
             args: ['searchInput']
+        }], omnibarPalette: [{
+            type: ViewChild,
+            args: ['omnibarPalette']
         }], shellSearchComposite: [{
             type: ViewChild,
             args: ['shellSearchComposite']
@@ -3257,5 +3436,5 @@ export class ShellComponent extends BaseAngularComponent {
             type: HostListener,
             args: ['document:click']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ShellComponent, { className: "ShellComponent", filePath: "src/lib/shell/shell.component.ts", lineNumber: 53 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ShellComponent, { className: "ShellComponent", filePath: "src/lib/shell/shell.component.ts", lineNumber: 55 }); })();
 //# sourceMappingURL=shell.component.js.map