@memberjunction/ng-explorer-core 2.128.0 → 2.129.0

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

@@ -1,11 +1,12 @@
 import { Component, ViewChild } from '@angular/core';
 import { NavigationEnd } from '@angular/router';
-import { firstValueFrom } from 'rxjs';
+import { firstValueFrom, combineLatest } from 'rxjs';
 import { filter } from 'rxjs/operators';
-import { Metadata } from '@memberjunction/core';
+import { Metadata, LogStatus, StartupManager } from '@memberjunction/core';
 import { MJEventType, MJGlobal, uuidv4 } from '@memberjunction/global';
 import { EventCodes, SYSTEM_APP_ID } from '@memberjunction/ng-shared';
 import { MJNotificationService } from '@memberjunction/ng-notifications';
+import { getActiveTheme } from './loading-themes';
 import * as i0 from "@angular/core";
 import * as i1 from "@memberjunction/ng-base-application";
 import * as i2 from "@memberjunction/ng-shared";
@@ -21,285 +22,187 @@ import * as i11 from "@memberjunction/ng-shared-generic";
 import * as i12 from "./components/header/app-switcher.component";
 import * as i13 from "./components/header/app-nav.component";
 import * as i14 from "./components/tabs/tab-container.component";
+import * as i15 from "./components/dialogs/app-access-dialog.component";
 const _c0 = ["searchInput"];
-function ShellComponent_div_0_div_5_button_1_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 42);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_5_button_1_Template_button_click_0_listener($event) { const app_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onNavBarAppClick(app_r4, $event)); })("dblclick", function ShellComponent_div_0_div_5_button_1_Template_button_dblclick_0_listener($event) { const app_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onNavBarAppDblClick(app_r4, $event)); });
+const _c1 = ["appAccessDialog"];
+function ShellComponent_div_5_button_1_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 44);
+    i0.ɵɵlistener("click", function ShellComponent_div_5_button_1_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_div_5_button_1_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();
 } if (rf & 2) {
-    const app_r4 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵstyleProp("--app-color", app_r4.GetColor());
-    i0.ɵɵclassProp("active", app_r4.ID === (ctx_r1.activeApp == null ? null : ctx_r1.activeApp.ID));
-    i0.ɵɵproperty("title", app_r4.Name);
+    const app_r3 = ctx.$implicit;
+    const ctx_r3 = i0.ɵɵnextContext(2);
+    i0.ɵɵstyleProp("--app-color", app_r3.GetColor());
+    i0.ɵɵclassProp("active", app_r3.ID === (ctx_r3.activeApp == null ? null : ctx_r3.activeApp.ID));
+    i0.ɵɵproperty("title", app_r3.Name);
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(app_r4.Icon);
+    i0.ɵɵclassMap(app_r3.Icon);
 } }
-function ShellComponent_div_0_div_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 40);
-    i0.ɵɵtemplate(1, ShellComponent_div_0_div_5_button_1_Template, 2, 7, "button", 41);
+function ShellComponent_div_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 42);
+    i0.ɵɵtemplate(1, ShellComponent_div_5_button_1_Template, 2, 7, "button", 43);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.leftOfSwitcherApps);
+    i0.ɵɵproperty("ngForOf", ctx_r3.leftOfSwitcherApps);
 } }
-function ShellComponent_div_0_mj_app_nav_7_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_mj_app_nav_7_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-app-nav", 43);
-    i0.ɵɵlistener("navItemClick", function ShellComponent_div_0_mj_app_nav_7_Template_mj_app_nav_navItemClick_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onNavItemClick($event)); });
+    i0.ɵɵelementStart(0, "mj-app-nav", 45);
+    i0.ɵɵlistener("navItemClick", function ShellComponent_mj_app_nav_7_Template_mj_app_nav_navItemClick_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemClick($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("app", ctx_r1.activeApp);
+    const ctx_r3 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("app", ctx_r3.activeApp);
 } }
-function ShellComponent_div_0_span_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 44);
+function ShellComponent_span_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 46);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.unreadNotificationCount > 99 ? "99+" : ctx_r1.unreadNotificationCount, " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r3.unreadNotificationCount > 99 ? "99+" : ctx_r3.unreadNotificationCount, " ");
 } }
-function ShellComponent_div_0_div_15_button_1_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_div_15_button_1_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 42);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_15_button_1_Template_button_click_0_listener($event) { const app_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onNavBarAppClick(app_r7, $event)); })("dblclick", function ShellComponent_div_0_div_15_button_1_Template_button_dblclick_0_listener($event) { const app_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onNavBarAppDblClick(app_r7, $event)); });
+    i0.ɵɵelementStart(0, "button", 44);
+    i0.ɵɵlistener("click", function ShellComponent_div_15_button_1_Template_button_click_0_listener($event) { const app_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppClick(app_r7, $event)); })("dblclick", function ShellComponent_div_15_button_1_Template_button_dblclick_0_listener($event) { const app_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r3 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r3.onNavBarAppDblClick(app_r7, $event)); });
     i0.ɵɵelement(1, "i");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const app_r7 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(3);
+    const ctx_r3 = i0.ɵɵnextContext(2);
     i0.ɵɵstyleProp("--app-color", app_r7.GetColor());
-    i0.ɵɵclassProp("active", app_r7.ID === (ctx_r1.activeApp == null ? null : ctx_r1.activeApp.ID));
+    i0.ɵɵclassProp("active", app_r7.ID === (ctx_r3.activeApp == null ? null : ctx_r3.activeApp.ID));
     i0.ɵɵproperty("title", app_r7.Name);
     i0.ɵɵadvance();
     i0.ɵɵclassMap(app_r7.Icon);
 } }
-function ShellComponent_div_0_div_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 45);
-    i0.ɵɵtemplate(1, ShellComponent_div_0_div_15_button_1_Template, 2, 7, "button", 41);
+function ShellComponent_div_15_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 47);
+    i0.ɵɵtemplate(1, ShellComponent_div_15_button_1_Template, 2, 7, "button", 43);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.leftOfUserMenuApps);
+    i0.ɵɵproperty("ngForOf", ctx_r3.leftOfUserMenuApps);
 } }
-function ShellComponent_div_0_ng_container_18_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_ng_container_18_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelement(1, "img", 46);
+    i0.ɵɵelement(1, "img", 48);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("src", ctx_r1.userImageURL, i0.ɵɵsanitizeUrl);
+    i0.ɵɵproperty("src", ctx_r3.userImageURL, i0.ɵɵsanitizeUrl);
 } }
-function ShellComponent_div_0_ng_template_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 47);
+function ShellComponent_ng_template_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 49);
     i0.ɵɵelement(1, "i");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵclassMap(ctx_r1.userIconClass || "fa-solid fa-user");
+    i0.ɵɵclassMap(ctx_r3.userIconClass || "fa-solid fa-user");
 } }
-function ShellComponent_div_0_div_21_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 58)(1, "span", 59);
+function ShellComponent_div_21_div_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 60)(1, "span", 61);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
+    const ctx_r3 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.userName);
+    i0.ɵɵtextInterpolate(ctx_r3.userName);
 } }
-function ShellComponent_div_0_div_21_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "div", 53);
+function ShellComponent_div_21_div_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "div", 55);
 } }
-function ShellComponent_div_0_div_21_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_div_21_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 48);
-    i0.ɵɵtemplate(1, ShellComponent_div_0_div_21_div_1_Template, 3, 1, "div", 49)(2, ShellComponent_div_0_div_21_div_2_Template, 1, 0, "div", 50);
-    i0.ɵɵelementStart(3, "div", 51);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_21_Template_div_click_3_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onSettings()); });
-    i0.ɵɵelement(4, "i", 52);
+    i0.ɵɵelementStart(0, "div", 50);
+    i0.ɵɵtemplate(1, ShellComponent_div_21_div_1_Template, 3, 1, "div", 51)(2, ShellComponent_div_21_div_2_Template, 1, 0, "div", 52);
+    i0.ɵɵelementStart(3, "div", 53);
+    i0.ɵɵlistener("click", function ShellComponent_div_21_Template_div_click_3_listener() { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onSettings()); });
+    i0.ɵɵelement(4, "i", 54);
     i0.ɵɵelementStart(5, "span");
     i0.ɵɵtext(6, "Settings");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(7, "div", 53);
-    i0.ɵɵelementStart(8, "div", 51);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_21_Template_div_click_8_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onLogLayout()); });
-    i0.ɵɵelement(9, "i", 54);
+    i0.ɵɵelement(7, "div", 55);
+    i0.ɵɵelementStart(8, "div", 53);
+    i0.ɵɵlistener("click", function ShellComponent_div_21_Template_div_click_8_listener() { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onLogLayout()); });
+    i0.ɵɵelement(9, "i", 56);
     i0.ɵɵelementStart(10, "span");
     i0.ɵɵtext(11, "Log Layout (Debug)");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(12, "div", 53);
-    i0.ɵɵelementStart(13, "div", 55);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_21_Template_div_click_13_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onResetLayout()); });
-    i0.ɵɵelement(14, "i", 56);
+    i0.ɵɵelement(12, "div", 55);
+    i0.ɵɵelementStart(13, "div", 57);
+    i0.ɵɵlistener("click", function ShellComponent_div_21_Template_div_click_13_listener() { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onResetLayout()); });
+    i0.ɵɵelement(14, "i", 58);
     i0.ɵɵelementStart(15, "span");
     i0.ɵɵtext(16, "Reset Layout");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(17, "div", 53);
-    i0.ɵɵelementStart(18, "div", 51);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_21_Template_div_click_18_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onLogout()); });
-    i0.ɵɵelement(19, "i", 57);
+    i0.ɵɵelement(17, "div", 55);
+    i0.ɵɵelementStart(18, "div", 53);
+    i0.ɵɵlistener("click", function ShellComponent_div_21_Template_div_click_18_listener() { i0.ɵɵrestoreView(_r8); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onLogout()); });
+    i0.ɵɵelement(19, "i", 59);
     i0.ɵɵelementStart(20, "span");
     i0.ɵɵtext(21, "Logout");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.userName);
+    i0.ɵɵproperty("ngIf", ctx_r3.userName);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.userName);
+    i0.ɵɵproperty("ngIf", ctx_r3.userName);
 } }
-function ShellComponent_div_0_div_22_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_div_22_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 60);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_22_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.closeSearch()); });
+    i0.ɵɵelementStart(0, "div", 62);
+    i0.ɵɵlistener("click", function ShellComponent_div_22_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.closeSearch()); });
     i0.ɵɵelementEnd();
 } }
-function ShellComponent_div_0_div_30_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_div_30_Template(rf, ctx) { if (rf & 1) {
     const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 61);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_div_30_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.closeMobileNav()); });
+    i0.ɵɵelementStart(0, "div", 63);
+    i0.ɵɵlistener("click", function ShellComponent_div_30_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.closeMobileNav()); });
     i0.ɵɵelementEnd();
 } }
-function ShellComponent_div_0_div_37_Template(rf, ctx) { if (rf & 1) {
+function ShellComponent_div_37_Template(rf, ctx) { if (rf & 1) {
     const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 62)(1, "div", 63);
+    i0.ɵɵelementStart(0, "div", 64)(1, "div", 65);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "mj-app-nav", 64);
-    i0.ɵɵlistener("navItemClick", function ShellComponent_div_0_div_37_Template_mj_app_nav_navItemClick_3_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onNavItemClick($event)); });
+    i0.ɵɵelementStart(3, "mj-app-nav", 66);
+    i0.ɵɵlistener("navItemClick", function ShellComponent_div_37_Template_mj_app_nav_navItemClick_3_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.onNavItemClick($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.activeApp.Name);
+    i0.ɵɵtextInterpolate(ctx_r3.activeApp.Name);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("app", ctx_r1.activeApp);
+    i0.ɵɵproperty("app", ctx_r3.activeApp);
 } }
-function ShellComponent_div_0_span_47_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 65);
+function ShellComponent_span_47_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 67);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.unreadNotificationCount > 99 ? "99+" : ctx_r1.unreadNotificationCount, " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r3.unreadNotificationCount > 99 ? "99+" : ctx_r3.unreadNotificationCount, " ");
 } }
-function ShellComponent_div_0_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 4)(1, "header", 5);
-    i0.ɵɵelement(2, "div", 6);
-    i0.ɵɵelementStart(3, "button", 7);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleMobileNav()); });
-    i0.ɵɵelement(4, "i", 8);
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(5, ShellComponent_div_0_div_5_Template, 2, 1, "div", 9);
-    i0.ɵɵelementStart(6, "mj-app-switcher", 10);
-    i0.ɵɵlistener("appSelected", function ShellComponent_div_0_Template_mj_app_switcher_appSelected_6_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onAppSwitch($event)); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(7, ShellComponent_div_0_mj_app_nav_7_Template, 1, 1, "mj-app-nav", 11);
-    i0.ɵɵelement(8, "div", 12);
-    i0.ɵɵelementStart(9, "div", 13)(10, "button", 14);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleSearch()); });
-    i0.ɵɵelement(11, "i", 15);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "button", 16);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.showNotifications()); });
-    i0.ɵɵelement(13, "i", 17);
-    i0.ɵɵtemplate(14, ShellComponent_div_0_span_14_Template, 2, 1, "span", 18);
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(15, ShellComponent_div_0_div_15_Template, 2, 1, "div", 19);
-    i0.ɵɵelementStart(16, "div", 20)(17, "button", 21);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_17_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleUserMenu($event)); });
-    i0.ɵɵtemplate(18, ShellComponent_div_0_ng_container_18_Template, 2, 1, "ng-container", 22)(19, ShellComponent_div_0_ng_template_19_Template, 2, 2, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(21, ShellComponent_div_0_div_21_Template, 22, 2, "div", 23);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵtemplate(22, ShellComponent_div_0_div_22_Template, 1, 0, "div", 24);
-    i0.ɵɵelementStart(23, "div", 25)(24, "div", 26);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_div_click_24_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(25, "kendo-dropdownlist", 27);
-    i0.ɵɵtwoWayListener("ngModelChange", function ShellComponent_div_0_Template_kendo_dropdownlist_ngModelChange_25_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.selectedEntity, $event) || (ctx_r1.selectedEntity = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(26, "input", 28, 1);
-    i0.ɵɵlistener("keydown.enter", function ShellComponent_div_0_Template_input_keydown_enter_26_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSearch($event)); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(28, "button", 29);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_28_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSearch($event)); });
-    i0.ɵɵelement(29, "i", 15);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵtemplate(30, ShellComponent_div_0_div_30_Template, 1, 0, "div", 30);
-    i0.ɵɵelementStart(31, "div", 31)(32, "div", 32)(33, "span");
-    i0.ɵɵtext(34, "Navigation");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(35, "button", 33);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_35_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeMobileNav()); });
-    i0.ɵɵelement(36, "i", 34);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(37, ShellComponent_div_0_div_37_Template, 4, 2, "div", 35);
-    i0.ɵɵelementStart(38, "div", 36)(39, "button", 37);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_39_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.toggleSearch(); return i0.ɵɵresetView(ctx_r1.closeMobileNav()); });
-    i0.ɵɵelement(40, "i", 15);
-    i0.ɵɵelementStart(41, "span");
-    i0.ɵɵtext(42, "Search");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(43, "button", 38);
-    i0.ɵɵlistener("click", function ShellComponent_div_0_Template_button_click_43_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.showNotifications(); return i0.ɵɵresetView(ctx_r1.closeMobileNav()); });
-    i0.ɵɵelement(44, "i", 17);
-    i0.ɵɵelementStart(45, "span");
-    i0.ɵɵtext(46, "Notifications");
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(47, ShellComponent_div_0_span_47_Template, 2, 1, "span", 39);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelement(48, "mj-tab-container");
+function ShellComponent_div_49_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 68);
+    i0.ɵɵelement(1, "mj-loading", 69);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const iconAvatar_r12 = i0.ɵɵreference(20);
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("tabs-visible", ctx_r1.tabBarVisible);
-    i0.ɵɵadvance(5);
-    i0.ɵɵproperty("ngIf", ctx_r1.leftOfSwitcherApps.length > 0);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("activeApp", ctx_r1.activeApp)("isViewingSystemTab", ctx_r1.isViewingSystemTab)("loadingAppId", ctx_r1.loadingAppId);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.activeApp);
-    i0.ɵɵadvance(7);
-    i0.ɵɵproperty("ngIf", ctx_r1.unreadNotificationCount > 0);
+    const ctx_r3 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.leftOfUserMenuApps.length > 0);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngIf", ctx_r1.userImageURL)("ngIfElse", iconAvatar_r12);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngIf", ctx_r1.userMenuVisible);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.isSearchOpen);
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("open", ctx_r1.isSearchOpen);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("data", ctx_r1.searchableEntities);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.selectedEntity);
-    i0.ɵɵadvance(5);
-    i0.ɵɵproperty("ngIf", ctx_r1.mobileNavOpen);
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("open", ctx_r1.mobileNavOpen);
-    i0.ɵɵadvance(6);
-    i0.ɵɵproperty("ngIf", ctx_r1.activeApp);
-    i0.ɵɵadvance(10);
-    i0.ɵɵproperty("ngIf", ctx_r1.unreadNotificationCount > 0);
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("hide-tab-bar", !ctx_r1.tabBarVisible);
-} }
-function ShellComponent_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 66);
-    i0.ɵɵelement(1, "mj-loading", 67);
-    i0.ɵɵelementEnd();
+    i0.ɵɵproperty("text", ctx_r3.currentLoadingText)("textColor", ctx_r3.currentLoadingTextColor)("logoColor", ctx_r3.currentLoadingColor)("logoGradient", ctx_r3.currentLoadingGradient)("animation", ctx_r3.currentLoadingAnimation);
 } }
 /**
  * Main shell component for the new Explorer UX.
@@ -330,12 +233,33 @@ export class ShellComponent {
     activeApp = null;
     loading = true;
     initialized = false;
+    waitingForFirstResource = false;
     tabBarVisible = true; // Controlled by workspace manager
     userMenuVisible = false; // User avatar context menu
     mobileNavOpen = false; // Mobile navigation drawer
     unreadNotificationCount = 0; // Notification badge count
     isViewingSystemTab = false; // True when viewing a resource tab (not associated with a registered app)
     loadingAppId = null; // ID of app currently being loaded (for app switcher loading indicator)
+    // Loading animation state
+    loadingMessageInterval = null;
+    loadingMessageIndex = 0;
+    usedMessageIndices = [];
+    usedGradientIndices = [];
+    messageCycleCount = 0; // Track message cycles for color changes
+    activeTheme;
+    messageIntervalMs = 2500; // 2.5 seconds per message
+    colorChangeEveryNMessages = 2; // Change color every 2 messages (5 seconds)
+    // All available animation types (used for random selection when theme doesn't specify)
+    allAnimationTypes = ['pulse', 'spin', 'bounce', 'pulse-spin'];
+    // Animation sequencing
+    animationSequence = [];
+    currentAnimationIndex = 0;
+    animationSequenceTimeout = null;
+    currentLoadingText;
+    currentLoadingColor;
+    currentLoadingTextColor;
+    currentLoadingGradient;
+    currentLoadingAnimation = 'pulse';
     // User avatar state
     userImageURL = '';
     userIconClass = null;
@@ -345,6 +269,9 @@ export class ShellComponent {
     searchableEntities = [];
     selectedEntity = null;
     searchInput;
+    // App access dialog
+    appAccessDialog;
+    pendingAppPath = null; // Store the app path we tried to access
     /**
      * Get Nav Bar apps positioned to the left of the app switcher
      * Filters out apps that have HideNavBarIconWhenActive=true and are currently active
@@ -375,6 +302,30 @@ export class ShellComponent {
         this.settingsDialogService = settingsDialogService;
         this.viewContainerRef = viewContainerRef;
         this.titleService = titleService;
+        // Initialize theme immediately so loading UI shows correct colors from the start
+        this.activeTheme = getActiveTheme();
+        // Initialize animation based on theme configuration
+        this.initializeAnimationFromTheme();
+        // Set first message
+        this.currentLoadingText = this.activeTheme.messages[0];
+        if (this.activeTheme.staticColors) {
+            // Standard theme: keep MJ blue, no gradient
+            this.currentLoadingColor = this.activeTheme.colors[0];
+            this.currentLoadingTextColor = '#757575'; // Default gray text
+            this.currentLoadingGradient = null;
+        }
+        else {
+            // Themed period: use theme colors and first gradient from the start
+            this.currentLoadingColor = this.activeTheme.colors[0];
+            this.currentLoadingTextColor = this.activeTheme.colors[0];
+            // Set initial gradient if theme has gradients
+            if (this.activeTheme.gradients && this.activeTheme.gradients.length > 0) {
+                this.currentLoadingGradient = this.activeTheme.gradients[0];
+            }
+            else {
+                this.currentLoadingGradient = null;
+            }
+        }
     }
     async ngOnInit() {
         try {
@@ -400,8 +351,11 @@ export class ShellComponent {
         }
     }
     async initializeShell() {
+        // Start the loading animation with cycling messages
+        this.startLoadingAnimation();
         // Initialize application manager (subscribes to LoggedIn event)
         this.appManager.Initialize();
+        await StartupManager.Instance.Startup();
         // Get current user
         const md = new Metadata();
         const user = md.CurrentUser;
@@ -446,38 +400,51 @@ export class ShellComponent {
             }
         }));
         // Subscribe to applications loading - set app based on URL or default to first
-        this.subscriptions.push(this.appManager.Applications.subscribe(async (apps) => {
-            if (apps.length > 0) {
-                // Check if URL specifies an app by parsing the browser URL
-                const currentUrl = this.router.url;
-                const appMatch = currentUrl.match(/\/app\/([^\/]+)/);
-                if (appMatch) {
-                    const routeAppPath = decodeURIComponent(appMatch[1]);
-                    // Find the app from the URL by Path (or Name for backwards compatibility)
-                    const urlApp = this.appManager.GetAppByPath(routeAppPath);
-                    if (urlApp) {
-                        // Set the app from URL - takes precedence over workspace restoration
-                        await this.appManager.SetActiveApp(urlApp.ID);
-                        // If the URL is just /app/:appName (no nav item), create default tab
-                        const hasNavItem = currentUrl.match(/\/app\/[^\/]+\/[^\/]+/);
-                        if (!hasNavItem) {
-                            const existingTabs = this.workspaceManager.GetAppTabs(urlApp.ID);
-                            if (existingTabs.length === 0) {
-                                const tabRequest = await urlApp.CreateDefaultTab();
-                                if (tabRequest) {
-                                    this.tabService.OpenTab(tabRequest);
-                                }
+        // Use combineLatest to wait for loading to complete before deciding there are no apps
+        this.subscriptions.push(combineLatest([this.appManager.Applications, this.appManager.Loading]).subscribe(async ([apps, isLoading]) => {
+            // Don't make decisions while still loading - wait for load to complete
+            if (isLoading) {
+                return;
+            }
+            // Handle the case where user has no apps at all (only after loading is complete)
+            if (apps.length === 0) {
+                await this.handleNoAppsAvailable();
+                return;
+            }
+            // Check if URL specifies an app by parsing the browser URL
+            const currentUrl = this.router.url;
+            const appMatch = currentUrl.match(/\/app\/([^\/]+)/);
+            if (appMatch) {
+                const routeAppPath = decodeURIComponent(appMatch[1]);
+                // Find the app from the URL by Path (or Name for backwards compatibility)
+                const urlApp = this.appManager.GetAppByPath(routeAppPath);
+                if (urlApp) {
+                    // Set the app from URL - takes precedence over workspace restoration
+                    await this.appManager.SetActiveApp(urlApp.ID);
+                    // If the URL is just /app/:appName (no nav item), create default tab
+                    const hasNavItem = currentUrl.match(/\/app\/[^\/]+\/[^\/]+/);
+                    if (!hasNavItem) {
+                        const existingTabs = this.workspaceManager.GetAppTabs(urlApp.ID);
+                        if (existingTabs.length === 0) {
+                            const tabRequest = await urlApp.CreateDefaultTab();
+                            if (tabRequest) {
+                                this.tabService.OpenTab(tabRequest);
                             }
                         }
-                        return;
                     }
+                    return;
                 }
-                // Set default app if URL doesn't specify one AND no app is active yet
-                const currentActiveApp = this.appManager.GetActiveApp();
-                if (!appMatch && !currentActiveApp) {
-                    await this.appManager.SetActiveApp(apps[0].ID);
+                else {
+                    // App not found in user's list - check why and show appropriate dialog
+                    await this.handleAppAccessError(routeAppPath, apps);
+                    return;
                 }
             }
+            // Set default app if URL doesn't specify one AND no app is active yet
+            const currentActiveApp = this.appManager.GetActiveApp();
+            if (!appMatch && !currentActiveApp) {
+                await this.appManager.SetActiveApp(apps[0].ID);
+            }
         }));
         // Subscribe to tab open requests from TabService
         this.subscriptions.push(this.tabService.TabRequests.subscribe(async (request) => {
@@ -532,7 +499,7 @@ export class ShellComponent {
         // Load searchable entities for search functionality
         await this.loadSearchableEntities();
         this.initialized = true;
-        this.loading = false;
+        this.waitingForFirstResource = true;
     }
     /**
      * Handle deep links from URL
@@ -943,7 +910,228 @@ export class ShellComponent {
     ngAfterViewInit() {
         // Layout initialization happens in TabContainerComponent
     }
+    /**
+     * Called when the first resource component finishes loading.
+     * We accept subsequent calls to this method in ordre to ensure we are
+     * not forever showing animation for loading - this can happen if there is
+     * a race condition in components we DO NOT control, so while the naming
+     * is intended to imply the goal it doesn't "hurt" to have this work this way
+     */
+    onFirstResourceLoadComplete() {
+        this.waitingForFirstResource = false;
+        this.loading = false;
+        this.stopLoadingAnimation();
+        this.cdr.detectChanges();
+    }
+    /**
+     * Start the loading message cycling animation.
+     * Messages cycle every 2.5 seconds without repeating until all are used.
+     * Colors change every 5 seconds (every 2nd message cycle).
+     * For themed periods: use theme colors/gradients from the start.
+     * For standard theme: keep MJ blue throughout (no color changes).
+     * Animation is randomly selected from pulse, spin, and pulse-spin.
+     * Theme is selected based on current date and user's browser locale.
+     */
+    startLoadingAnimation() {
+        // Select the appropriate theme based on date and locale
+        this.activeTheme = getActiveTheme();
+        console.log(`🎨 Loading theme: ${this.activeTheme.name}`);
+        // Reset state
+        this.usedMessageIndices = [0]; // Mark first message as used
+        this.usedGradientIndices = [];
+        this.loadingMessageIndex = 0;
+        this.messageCycleCount = 0;
+        // Initialize display with first message and initial color/gradient
+        this.initializeLoadingDisplay();
+        // Initialize animation based on theme configuration
+        this.initializeAnimationFromTheme();
+        // Start the animation sequence (if there are multiple steps)
+        this.startAnimationSequence();
+        // Start cycling every 2.5 seconds
+        this.loadingMessageInterval = setInterval(() => {
+            this.cycleToNextMessage();
+            this.cdr.detectChanges();
+        }, this.messageIntervalMs);
+    }
+    /**
+     * Stop the loading message cycling animation.
+     */
+    stopLoadingAnimation() {
+        if (this.loadingMessageInterval) {
+            clearInterval(this.loadingMessageInterval);
+            this.loadingMessageInterval = null;
+        }
+        // Also clear any animation sequence timeout
+        if (this.animationSequenceTimeout) {
+            clearTimeout(this.animationSequenceTimeout);
+            this.animationSequenceTimeout = null;
+        }
+    }
+    /**
+     * Initialize the loading display with first message and initial color/gradient.
+     * For themed periods, applies theme styling from the start.
+     * For standard theme, keeps MJ blue throughout.
+     */
+    initializeLoadingDisplay() {
+        // Set first message
+        this.currentLoadingText = this.activeTheme.messages[0];
+        if (this.activeTheme.staticColors) {
+            // Standard theme: keep MJ blue, no gradient
+            this.currentLoadingColor = this.activeTheme.colors[0];
+            this.currentLoadingTextColor = '#757575'; // Default gray text
+            this.currentLoadingGradient = null;
+        }
+        else {
+            // Themed period: use theme colors and first gradient from the start
+            this.currentLoadingColor = this.activeTheme.colors[0];
+            this.currentLoadingTextColor = this.activeTheme.colors[0];
+            // Set initial gradient if theme has gradients
+            if (this.activeTheme.gradients && this.activeTheme.gradients.length > 0) {
+                this.currentLoadingGradient = this.activeTheme.gradients[0];
+                this.usedGradientIndices = [0];
+            }
+            else {
+                this.currentLoadingGradient = null;
+            }
+        }
+    }
+    /**
+     * Cycle to the next loading message, avoiding repeats until all are used.
+     * Colors change every colorChangeEveryNMessages cycles (5 seconds).
+     * For standard theme, colors remain static.
+     */
+    cycleToNextMessage() {
+        const messages = this.activeTheme.messages;
+        this.messageCycleCount++;
+        // If we've used all messages, reset the used list (but exclude current to avoid immediate repeat)
+        if (this.usedMessageIndices.length >= messages.length) {
+            this.usedMessageIndices = [this.loadingMessageIndex];
+        }
+        // Find a random unused message index
+        const availableIndices = messages
+            .map((_, i) => i)
+            .filter(i => !this.usedMessageIndices.includes(i));
+        if (availableIndices.length > 0) {
+            const randomIndex = availableIndices[Math.floor(Math.random() * availableIndices.length)];
+            this.usedMessageIndices.push(randomIndex);
+            this.loadingMessageIndex = randomIndex;
+            // Update the message
+            this.currentLoadingText = this.activeTheme.messages[randomIndex];
+            // Check if it's time to change colors (every 2nd message = every 5 seconds)
+            // But only for non-static themes
+            if (!this.activeTheme.staticColors && this.messageCycleCount % this.colorChangeEveryNMessages === 0) {
+                this.cycleToNextColor();
+            }
+        }
+    }
+    /**
+     * Cycle to the next color/gradient from the theme.
+     * Alternates through gradients if available.
+     */
+    cycleToNextColor() {
+        // Cycle to next gradient if available
+        if (this.activeTheme.gradients && this.activeTheme.gradients.length > 0) {
+            const gradients = this.activeTheme.gradients;
+            // If we've used all gradients, reset (but exclude current to avoid immediate repeat)
+            if (this.usedGradientIndices.length >= gradients.length) {
+                const lastUsed = this.usedGradientIndices[this.usedGradientIndices.length - 1];
+                this.usedGradientIndices = [lastUsed];
+            }
+            // Find next gradient (simple rotation for gradients)
+            const currentIndex = this.usedGradientIndices[this.usedGradientIndices.length - 1] ?? -1;
+            const nextIndex = (currentIndex + 1) % gradients.length;
+            this.usedGradientIndices.push(nextIndex);
+            this.currentLoadingGradient = gradients[nextIndex];
+        }
+        // Also cycle text color through theme colors
+        const colors = this.activeTheme.colors;
+        if (colors.length > 1) {
+            // Get a random color from the theme for text
+            const randomIndex = Math.floor(Math.random() * colors.length);
+            this.currentLoadingColor = colors[randomIndex];
+            this.currentLoadingTextColor = colors[randomIndex];
+        }
+    }
+    /**
+     * Initialize animation configuration from the current theme.
+     * Converts the theme's animation config (string or array) to a normalized sequence.
+     */
+    initializeAnimationFromTheme() {
+        this.currentAnimationIndex = 0;
+        const themeAnimations = this.activeTheme.animations;
+        if (!themeAnimations) {
+            // No animation config - use random selection for non-standard themes
+            if (this.activeTheme.id === 'standard') {
+                // Standard theme defaults to pulse only
+                this.animationSequence = [{ type: 'pulse' }];
+            }
+            else {
+                // Random selection for themed holidays without explicit config
+                const randomType = this.allAnimationTypes[Math.floor(Math.random() * this.allAnimationTypes.length)];
+                this.animationSequence = [{ type: randomType }];
+            }
+        }
+        else if (typeof themeAnimations === 'string') {
+            // Single animation type specified
+            this.animationSequence = [{ type: themeAnimations }];
+        }
+        else {
+            // Array of animation steps
+            this.animationSequence = themeAnimations;
+        }
+        // Set initial animation
+        if (this.animationSequence.length > 0) {
+            this.currentLoadingAnimation = this.animationSequence[0].type;
+        }
+    }
+    /**
+     * Start the animation sequence, scheduling transitions between animation steps.
+     */
+    startAnimationSequence() {
+        // Clear any existing timeout
+        if (this.animationSequenceTimeout) {
+            clearTimeout(this.animationSequenceTimeout);
+            this.animationSequenceTimeout = null;
+        }
+        this.currentAnimationIndex = 0;
+        this.scheduleNextAnimationStep();
+    }
+    /**
+     * Schedule the transition to the next animation step based on current step's duration.
+     */
+    scheduleNextAnimationStep() {
+        if (this.animationSequence.length <= 1) {
+            // Only one step - no transitions needed
+            return;
+        }
+        const currentStep = this.animationSequence[this.currentAnimationIndex];
+        const durationMs = currentStep.durationMs;
+        // If no duration specified (or 0), this step runs indefinitely
+        if (!durationMs || durationMs <= 0) {
+            return;
+        }
+        // Schedule transition to next step
+        this.animationSequenceTimeout = setTimeout(() => {
+            this.transitionToNextAnimation();
+        }, durationMs);
+    }
+    /**
+     * Transition to the next animation in the sequence.
+     */
+    transitionToNextAnimation() {
+        this.currentAnimationIndex++;
+        if (this.currentAnimationIndex >= this.animationSequence.length) {
+            // Sequence complete - stay on last animation
+            return;
+        }
+        const nextStep = this.animationSequence[this.currentAnimationIndex];
+        this.currentLoadingAnimation = nextStep.type;
+        this.cdr.detectChanges();
+        // Schedule the next transition if this step has a duration
+        this.scheduleNextAnimationStep();
+    }
     ngOnDestroy() {
+        this.stopLoadingAnimation();
         this.subscriptions.forEach(sub => sub.unsubscribe());
         this.layoutManager.Destroy();
     }
@@ -1315,26 +1503,356 @@ export class ShellComponent {
             IsPinned: false
         });
     }
+    // ========================================
+    // APP ACCESS ERROR HANDLING
+    // ========================================
+    /**
+     * Handle app access error by showing the appropriate dialog based on the access check result.
+     * IMPORTANT: This keeps the loading screen visible and does NOT navigate to any app
+     * until the user makes a decision in the dialog.
+     * @param appPath The app path from the URL that the user tried to access
+     * @param availableApps The list of apps the user has access to (for fallback)
+     */
+    async handleAppAccessError(appPath, availableApps) {
+        // Prevent showing the dialog multiple times for the same app path
+        // This can happen when the applications$ observable emits multiple times during reload
+        if (this.pendingAppPath === appPath) {
+            return;
+        }
+        const accessResult = this.appManager.CheckAppAccess(appPath);
+        this.pendingAppPath = appPath;
+        LogStatus(`App access check for "${appPath}": ${accessResult.status} - ${accessResult.message}`);
+        const dialogConfig = this.mapAccessResultToDialogConfig(accessResult);
+        // IMPORTANT: Keep loading screen visible while dialog is shown
+        // Do NOT set any active app or create any tabs yet
+        // The loading screen stays visible because we haven't called onFirstResourceLoadComplete
+        // Show the dialog on top of the loading screen
+        // Use setTimeout to ensure the dialog component is ready after view init
+        setTimeout(() => {
+            if (this.appAccessDialog) {
+                this.appAccessDialog.show(dialogConfig);
+            }
+            else {
+                // Fallback if dialog not available - redirect to first app
+                console.warn('App access dialog not available, redirecting to first app');
+                this.redirectToFirstApp(availableApps);
+            }
+        }, 0);
+    }
+    /**
+     * Map an AppAccessResult to the dialog configuration
+     */
+    mapAccessResultToDialogConfig(accessResult) {
+        switch (accessResult.status) {
+            case 'not_found':
+                return {
+                    type: 'not_found',
+                    appName: accessResult.appName
+                };
+            case 'inactive':
+                return {
+                    type: 'inactive',
+                    appName: accessResult.appName,
+                    appId: accessResult.appId
+                };
+            case 'not_installed':
+                return {
+                    type: 'not_installed',
+                    appName: accessResult.appName,
+                    appId: accessResult.appId
+                };
+            case 'disabled':
+                return {
+                    type: 'disabled',
+                    appName: accessResult.appName,
+                    appId: accessResult.appId
+                };
+            default:
+                // 'accessible' shouldn't reach here, but handle it as a generic error
+                return {
+                    type: 'no_access',
+                    appName: accessResult.appName
+                };
+        }
+    }
+    /**
+     * Handle when user has no apps available at all
+     */
+    async handleNoAppsAvailable() {
+        LogStatus('User has no applications available');
+        // Stop loading animation and show the dialog
+        this.stopLoadingAnimation();
+        this.loading = false;
+        this.cdr.detectChanges();
+        setTimeout(() => {
+            if (this.appAccessDialog) {
+                this.appAccessDialog.show({ type: 'no_apps' });
+            }
+        }, 0);
+    }
+    /**
+     * Handle Golden Layout initialization failure
+     */
+    handleLayoutError() {
+        LogStatus('Golden Layout initialization failed');
+        const availableApps = this.appManager.GetAllApps();
+        if (availableApps.length > 0) {
+            setTimeout(() => {
+                if (this.appAccessDialog) {
+                    this.appAccessDialog.show({ type: 'layout_error' });
+                }
+                else {
+                    // Direct redirect if dialog not available
+                    this.redirectToFirstApp(availableApps);
+                }
+            }, 0);
+        }
+    }
+    /**
+     * Handle dialog result (install, enable, or redirect)
+     */
+    async onAppAccessDialogResult(result) {
+        const availableApps = this.appManager.GetAllApps();
+        switch (result.action) {
+            case 'install':
+                if (result.appId) {
+                    await this.installAndNavigateToApp(result.appId);
+                }
+                break;
+            case 'enable':
+                if (result.appId) {
+                    await this.enableAndNavigateToApp(result.appId);
+                }
+                break;
+            case 'redirect':
+            case 'dismissed':
+            default:
+                this.redirectToFirstApp(availableApps);
+                break;
+        }
+    }
+    /**
+     * Install an app for the user and navigate to it
+     */
+    async installAndNavigateToApp(appId) {
+        // Clear pendingAppPath to allow fresh handling after installation
+        this.pendingAppPath = null;
+        try {
+            const userApp = await this.appManager.InstallAppForUser(appId);
+            if (userApp) {
+                // App installed successfully - navigate to it
+                const app = this.appManager.GetAppById(appId);
+                if (app) {
+                    await this.navigateToApp(app);
+                    this.appAccessDialog?.completeProcessing();
+                }
+                else {
+                    // Fallback - reload might be needed
+                    console.warn(`[ShellComponent] App ${appId} not found after install, redirecting to first app`);
+                    this.appAccessDialog?.completeProcessing();
+                    this.redirectToFirstApp(this.appManager.GetAllApps());
+                }
+            }
+            else {
+                // Installation failed
+                console.error('[ShellComponent] Installation failed');
+                this.appAccessDialog?.completeProcessing();
+                this.redirectToFirstApp(this.appManager.GetAllApps());
+            }
+        }
+        catch (error) {
+            console.error('Error installing app:', error);
+            this.appAccessDialog?.completeProcessing();
+            this.redirectToFirstApp(this.appManager.GetAllApps());
+        }
+    }
+    /**
+     * Enable a disabled app for the user and navigate to it
+     */
+    async enableAndNavigateToApp(appId) {
+        try {
+            const success = await this.appManager.EnableAppForUser(appId);
+            if (success) {
+                // App enabled successfully - navigate to it
+                const app = this.appManager.GetAppById(appId);
+                if (app) {
+                    await this.navigateToApp(app);
+                    this.appAccessDialog?.completeProcessing();
+                }
+                else {
+                    this.appAccessDialog?.completeProcessing();
+                    this.redirectToFirstApp(this.appManager.GetAllApps());
+                }
+            }
+            else {
+                this.appAccessDialog?.completeProcessing();
+                this.redirectToFirstApp(this.appManager.GetAllApps());
+            }
+        }
+        catch (error) {
+            console.error('Error enabling app:', error);
+            this.appAccessDialog?.completeProcessing();
+            this.redirectToFirstApp(this.appManager.GetAllApps());
+        }
+    }
+    /**
+     * Navigate to a specific app and create its default tab
+     */
+    async navigateToApp(app) {
+        await this.appManager.SetActiveApp(app.ID);
+        const existingTabs = this.workspaceManager.GetAppTabs(app.ID);
+        if (existingTabs.length === 0) {
+            const tabRequest = await app.CreateDefaultTab();
+            if (tabRequest) {
+                this.tabService.OpenTab(tabRequest);
+            }
+        }
+        // Update URL to reflect the new app
+        const appPath = app.Path || app.Name;
+        this.router.navigateByUrl(`/app/${encodeURIComponent(appPath)}`, { replaceUrl: true });
+    }
+    /**
+     * Redirect to the first available app (fallback)
+     */
+    async redirectToFirstApp(apps) {
+        if (apps.length > 0) {
+            const firstApp = apps[0];
+            await this.navigateToApp(firstApp);
+        }
+        else {
+            // No apps available - this shouldn't happen, but handle gracefully
+            this.loading = false;
+            this.cdr.detectChanges();
+        }
+    }
     static ɵfac = function ShellComponent_Factory(t) { return new (t || 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.SettingsDialogService), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(i2.TitleService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ShellComponent, selectors: [["mj-shell"]], viewQuery: function ShellComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0, 5);
+            i0.ɵɵviewQuery(_c1, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.searchInput = _t.first);
-        } }, decls: 2, vars: 2, consts: [["iconAvatar", ""], ["searchInput", ""], ["class", "shell-container", "kendoDialogContainer", "", 3, "tabs-visible", 4, "ngIf"], ["class", "shell-loading", 4, "ngIf"], ["kendoDialogContainer", "", 1, "shell-container"], [1, "shell-header"], ["title", "MemberJunction", 1, "mj-logo"], ["title", "Menu", 1, "hamburger-btn", 3, "click"], [1, "fa-solid", "fa-bars"], ["class", "nav-bar-apps left-of-switcher", 4, "ngIf"], [3, "appSelected", "activeApp", "isViewingSystemTab", "loadingAppId"], ["class", "desktop-nav", 3, "app", "navItemClick", 4, "ngIf"], [1, "spacer"], [1, "header-actions"], ["title", "Search", 1, "icon-btn", "desktop-only", "search-toggle-btn", 3, "click"], [1, "fa-solid", "fa-search"], ["title", "Notifications", 1, "icon-btn", "desktop-only", "notification-btn", 3, "click"], [1, "fa-solid", "fa-bell"], ["class", "notification-badge", 4, "ngIf"], ["class", "nav-bar-apps left-of-user-menu", 4, "ngIf"], [1, "user-menu"], [1, "avatar-btn", 3, "click"], [4, "ngIf", "ngIfElse"], ["class", "user-context-menu", 4, "ngIf"], ["class", "search-popup-overlay", 3, "click", 4, "ngIf"], [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...", "kendoTextBox", "", 1, "search-input", 3, "keydown.enter"], ["title", "Search", 1, "search-submit-btn", 3, "click"], ["class", "mobile-nav-overlay", 3, "click", 4, "ngIf"], [1, "mobile-nav-drawer"], [1, "mobile-nav-header"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], ["class", "mobile-nav-content", 4, "ngIf"], [1, "mobile-nav-footer"], ["title", "Search", 1, "mobile-nav-action", 3, "click"], ["title", "Notifications", 1, "mobile-nav-action", 3, "click"], ["class", "notification-badge-mobile", 4, "ngIf"], [1, "nav-bar-apps", "left-of-switcher"], ["class", "nav-bar-app-btn", 3, "active", "title", "--app-color", "click", "dblclick", 4, "ngFor", "ngForOf"], [1, "nav-bar-app-btn", 3, "click", "dblclick", "title"], [1, "desktop-nav", 3, "navItemClick", "app"], [1, "notification-badge"], [1, "nav-bar-apps", "left-of-user-menu"], ["alt", "User avatar", 1, "avatar-img", 3, "src"], [1, "icon-fallback"], [1, "user-context-menu"], ["class", "user-menu-header", 4, "ngIf"], ["class", "user-menu-divider", 4, "ngIf"], [1, "user-menu-item", 3, "click"], [1, "fa-solid", "fa-gear"], [1, "user-menu-divider"], [1, "fa-solid", "fa-code"], [1, "user-menu-item", "danger", 3, "click"], [1, "fa-solid", "fa-rotate-left"], [1, "fa-solid", "fa-sign-out-alt"], [1, "user-menu-header"], [1, "user-name"], [1, "search-popup-overlay", 3, "click"], [1, "mobile-nav-overlay", 3, "click"], [1, "mobile-nav-content"], [1, "mobile-nav-section-title"], [3, "navItemClick", "app"], [1, "notification-badge-mobile"], [1, "shell-loading"], ["text", "Loading workspace...", "size", "large"]], template: function ShellComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, ShellComponent_div_0_Template, 49, 24, "div", 2)(1, ShellComponent_div_1_Template, 2, 0, "div", 3);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.appAccessDialog = _t.first);
+        } }, decls: 52, vars: 27, consts: [["iconAvatar", ""], ["searchInput", ""], ["appAccessDialog", ""], ["kendoDialogContainer", "", 1, "shell-container"], [1, "shell-header"], ["title", "MemberJunction", 1, "mj-logo"], ["title", "Menu", 1, "hamburger-btn", 3, "click"], [1, "fa-solid", "fa-bars"], ["class", "nav-bar-apps left-of-switcher", 4, "ngIf"], [3, "appSelected", "activeApp", "isViewingSystemTab", "loadingAppId"], ["class", "desktop-nav", 3, "app", "navItemClick", 4, "ngIf"], [1, "spacer"], [1, "header-actions"], ["title", "Search", 1, "icon-btn", "desktop-only", "search-toggle-btn", 3, "click"], [1, "fa-solid", "fa-search"], ["title", "Notifications", 1, "icon-btn", "desktop-only", "notification-btn", 3, "click"], [1, "fa-solid", "fa-bell"], ["class", "notification-badge", 4, "ngIf"], ["class", "nav-bar-apps left-of-user-menu", 4, "ngIf"], [1, "user-menu"], [1, "avatar-btn", 3, "click"], [4, "ngIf", "ngIfElse"], ["class", "user-context-menu", 4, "ngIf"], ["class", "search-popup-overlay", 3, "click", 4, "ngIf"], [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...", "kendoTextBox", "", 1, "search-input", 3, "keydown.enter"], ["title", "Search", 1, "search-submit-btn", 3, "click"], ["class", "mobile-nav-overlay", 3, "click", 4, "ngIf"], [1, "mobile-nav-drawer"], [1, "mobile-nav-header"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], ["class", "mobile-nav-content", 4, "ngIf"], [1, "mobile-nav-footer"], ["title", "Search", 1, "mobile-nav-action", 3, "click"], ["title", "Notifications", 1, "mobile-nav-action", 3, "click"], ["class", "notification-badge-mobile", 4, "ngIf"], [3, "firstResourceLoadComplete", "layoutInitError"], ["class", "shell-loading", 4, "ngIf"], [3, "result"], [1, "nav-bar-apps", "left-of-switcher"], ["class", "nav-bar-app-btn", 3, "active", "title", "--app-color", "click", "dblclick", 4, "ngFor", "ngForOf"], [1, "nav-bar-app-btn", 3, "click", "dblclick", "title"], [1, "desktop-nav", 3, "navItemClick", "app"], [1, "notification-badge"], [1, "nav-bar-apps", "left-of-user-menu"], ["alt", "User avatar", 1, "avatar-img", 3, "src"], [1, "icon-fallback"], [1, "user-context-menu"], ["class", "user-menu-header", 4, "ngIf"], ["class", "user-menu-divider", 4, "ngIf"], [1, "user-menu-item", 3, "click"], [1, "fa-solid", "fa-gear"], [1, "user-menu-divider"], [1, "fa-solid", "fa-code"], [1, "user-menu-item", "danger", 3, "click"], [1, "fa-solid", "fa-rotate-left"], [1, "fa-solid", "fa-sign-out-alt"], [1, "user-menu-header"], [1, "user-name"], [1, "search-popup-overlay", 3, "click"], [1, "mobile-nav-overlay", 3, "click"], [1, "mobile-nav-content"], [1, "mobile-nav-section-title"], [3, "navItemClick", "app"], [1, "notification-badge-mobile"], [1, "shell-loading"], ["size", "large", 3, "text", "textColor", "logoColor", "logoGradient", "animation"]], 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.ɵɵlistener("click", function ShellComponent_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.toggleMobileNav()); });
+            i0.ɵɵelement(4, "i", 7);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(5, ShellComponent_div_5_Template, 2, 1, "div", 8);
+            i0.ɵɵelementStart(6, "mj-app-switcher", 9);
+            i0.ɵɵlistener("appSelected", function ShellComponent_Template_mj_app_switcher_appSelected_6_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onAppSwitch($event)); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(7, ShellComponent_mj_app_nav_7_Template, 1, 1, "mj-app-nav", 10);
+            i0.ɵɵelement(8, "div", 11);
+            i0.ɵɵelementStart(9, "div", 12)(10, "button", 13);
+            i0.ɵɵlistener("click", function ShellComponent_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.toggleSearch()); });
+            i0.ɵɵelement(11, "i", 14);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(12, "button", 15);
+            i0.ɵɵlistener("click", function ShellComponent_Template_button_click_12_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.showNotifications()); });
+            i0.ɵɵelement(13, "i", 16);
+            i0.ɵɵtemplate(14, ShellComponent_span_14_Template, 2, 1, "span", 17);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(15, ShellComponent_div_15_Template, 2, 1, "div", 18);
+            i0.ɵɵelementStart(16, "div", 19)(17, "button", 20);
+            i0.ɵɵlistener("click", function ShellComponent_Template_button_click_17_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.toggleUserMenu($event)); });
+            i0.ɵɵtemplate(18, ShellComponent_ng_container_18_Template, 2, 1, "ng-container", 21)(19, ShellComponent_ng_template_19_Template, 2, 2, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(21, ShellComponent_div_21_Template, 22, 2, "div", 22);
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵtemplate(22, ShellComponent_div_22_Template, 1, 0, "div", 23);
+            i0.ɵɵelementStart(23, "div", 24)(24, "div", 25);
+            i0.ɵɵlistener("click", function ShellComponent_Template_div_click_24_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView($event.stopPropagation()); });
+            i0.ɵɵelementStart(25, "kendo-dropdownlist", 26);
+            i0.ɵɵtwoWayListener("ngModelChange", function ShellComponent_Template_kendo_dropdownlist_ngModelChange_25_listener($event) { i0.ɵɵrestoreView(_r1); i0.ɵɵtwoWayBindingSet(ctx.selectedEntity, $event) || (ctx.selectedEntity = $event); return i0.ɵɵresetView($event); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(26, "input", 27, 1);
+            i0.ɵɵlistener("keydown.enter", function ShellComponent_Template_input_keydown_enter_26_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onSearch($event)); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(28, "button", 28);
+            i0.ɵɵlistener("click", function ShellComponent_Template_button_click_28_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onSearch($event)); });
+            i0.ɵɵelement(29, "i", 14);
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵtemplate(30, ShellComponent_div_30_Template, 1, 0, "div", 29);
+            i0.ɵɵelementStart(31, "div", 30)(32, "div", 31)(33, "span");
+            i0.ɵɵtext(34, "Navigation");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(35, "button", 32);
+            i0.ɵɵlistener("click", function ShellComponent_Template_button_click_35_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.closeMobileNav()); });
+            i0.ɵɵelement(36, "i", 33);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵtemplate(37, ShellComponent_div_37_Template, 4, 2, "div", 34);
+            i0.ɵɵelementStart(38, "div", 35)(39, "button", 36);
+            i0.ɵɵlistener("click", function ShellComponent_Template_button_click_39_listener() { i0.ɵɵrestoreView(_r1); ctx.toggleSearch(); return i0.ɵɵresetView(ctx.closeMobileNav()); });
+            i0.ɵɵelement(40, "i", 14);
+            i0.ɵɵelementStart(41, "span");
+            i0.ɵɵtext(42, "Search");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(43, "button", 37);
+            i0.ɵɵlistener("click", function ShellComponent_Template_button_click_43_listener() { i0.ɵɵrestoreView(_r1); ctx.showNotifications(); return i0.ɵɵresetView(ctx.closeMobileNav()); });
+            i0.ɵɵelement(44, "i", 16);
+            i0.ɵɵelementStart(45, "span");
+            i0.ɵɵtext(46, "Notifications");
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(47, ShellComponent_span_47_Template, 2, 1, "span", 38);
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(48, "mj-tab-container", 39);
+            i0.ɵɵlistener("firstResourceLoadComplete", function ShellComponent_Template_mj_tab_container_firstResourceLoadComplete_48_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onFirstResourceLoadComplete()); })("layoutInitError", function ShellComponent_Template_mj_tab_container_layoutInitError_48_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.handleLayoutError()); });
+            i0.ɵɵelementEnd()();
+            i0.ɵɵtemplate(49, ShellComponent_div_49_Template, 2, 5, "div", 40);
+            i0.ɵɵelementStart(50, "mj-app-access-dialog", 41, 2);
+            i0.ɵɵlistener("result", function ShellComponent_Template_mj_app_access_dialog_result_50_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onAppAccessDialogResult($event)); });
+            i0.ɵɵelementEnd();
         } if (rf & 2) {
-            i0.ɵɵproperty("ngIf", !ctx.loading);
+            const iconAvatar_r12 = i0.ɵɵreference(20);
+            i0.ɵɵclassProp("hidden", ctx.loading)("tabs-visible", ctx.tabBarVisible);
+            i0.ɵɵadvance(5);
+            i0.ɵɵproperty("ngIf", ctx.leftOfSwitcherApps.length > 0);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("activeApp", ctx.activeApp)("isViewingSystemTab", ctx.isViewingSystemTab)("loadingAppId", ctx.loadingAppId);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.activeApp);
+            i0.ɵɵadvance(7);
+            i0.ɵɵproperty("ngIf", ctx.unreadNotificationCount > 0);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.leftOfUserMenuApps.length > 0);
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("ngIf", ctx.userImageURL)("ngIfElse", iconAvatar_r12);
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("ngIf", ctx.userMenuVisible);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.isSearchOpen);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("open", ctx.isSearchOpen);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("data", ctx.searchableEntities);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.selectedEntity);
+            i0.ɵɵadvance(5);
+            i0.ɵɵproperty("ngIf", ctx.mobileNavOpen);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("open", ctx.mobileNavOpen);
+            i0.ɵɵadvance(6);
+            i0.ɵɵproperty("ngIf", ctx.activeApp);
+            i0.ɵɵadvance(10);
+            i0.ɵɵproperty("ngIf", ctx.unreadNotificationCount > 0);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("hide-tab-bar", !ctx.tabBarVisible);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.loading);
-        } }, dependencies: [i7.NgForOf, i7.NgIf, i8.NgControlStatus, i8.NgModel, i9.DropDownListComponent, i10.TextBoxDirective, i11.LoadingComponent, i12.AppSwitcherComponent, i13.AppNavComponent, i14.TabContainerComponent], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100vh;\n  width: 100%;\n  overflow: hidden;\n}\n\n\n\n.mj-logo[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 18px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='230' height='128' viewBox='0 0 230 128'%3E%3Cpath d='M0 0 C1.197 0.668 2.394 1.336 3.592 2.004 C12.234 6.837 20.792 11.805 29.327 16.824 C37.26 21.476 45.269 25.98 53.312 30.438 C53.91 30.769 54.507 31.1 55.122 31.441 C61.234 34.87 61.234 34.87 67.438 38.125 C69.709 37.16 69.709 37.16 72.258 35.652 C73.255 35.09 74.253 34.527 75.281 33.948 C76.364 33.325 77.447 32.703 78.562 32.062 C79.685 31.426 80.808 30.789 81.965 30.133 C90.435 25.322 98.84 20.401 107.239 15.469 C118.242 9.027 129.394 2.857 140.566 -3.286 C142.41 -4.306 144.248 -5.338 146.079 -6.382 C146.869 -6.832 147.659 -7.282 148.473 -7.746 C149.148 -8.136 149.824 -8.526 150.52 -8.927 C156.448 -11.856 163.036 -11.676 169.188 -9.625 C175.638 -6.152 178.915 -2.712 181.438 4.125 C181.951 7.259 181.946 10.308 181.892 13.479 C181.892 14.377 181.893 15.276 181.893 16.201 C181.891 19.145 181.86 22.088 181.828 25.031 C181.821 27.082 181.815 29.134 181.811 31.185 C181.796 36.564 181.757 41.943 181.712 47.322 C181.671 52.819 181.653 58.316 181.633 63.812 C181.59 74.584 181.522 85.354 181.438 96.125 C178.573 94.739 175.729 93.326 172.901 91.867 C170.644 90.732 168.349 89.671 166.018 88.7 C162.628 87.127 160.12 85.736 157.438 83.125 C155.741 78.082 155.893 73.244 156.047 68.004 C156.047 66.534 156.041 65.064 156.031 63.595 C156.018 59.745 156.076 55.899 156.15 52.049 C156.213 48.114 156.207 44.18 156.207 40.244 C156.217 32.536 156.303 24.832 156.438 17.125 C152.485 19.335 148.534 21.546 144.582 23.758 C143.476 24.376 142.37 24.995 141.231 25.632 C131.895 30.857 122.601 36.151 113.321 41.472 C107.737 44.673 102.15 47.868 96.562 51.062 C95.965 51.404 95.367 51.746 94.751 52.098 C86.826 56.629 78.889 61.14 70.938 65.625 C62.527 70.37 54.133 75.144 45.75 79.938 C45.166 80.271 44.581 80.605 43.979 80.95 C37.987 84.375 31.996 87.803 26.011 91.241 C14.366 97.93 2.707 104.594 -9.062 111.062 C-9.97 111.565 -10.878 112.067 -11.814 112.585 C-12.649 113.04 -13.484 113.496 -14.344 113.965 C-15.066 114.36 -15.789 114.756 -16.533 115.164 C-22.269 117.881 -28.602 117.949 -34.625 116.125 C-39.398 114.15 -42.881 110.491 -45.562 106.125 C-45.562 104.805 -45.562 103.485 -45.562 102.125 C-45.022 101.835 -44.481 101.545 -43.924 101.246 C-32.122 94.897 -20.456 88.363 -8.907 81.566 C-0.017 76.35 8.975 71.333 18.003 66.362 C24.427 62.82 30.777 59.186 37.065 55.408 C39.438 54.125 39.438 54.125 41.438 54.125 C41.438 53.465 41.438 52.805 41.438 52.125 C40.704 51.843 39.971 51.561 39.216 51.271 C36.702 50.234 34.368 49.093 31.98 47.797 C30.7 47.102 30.7 47.102 29.395 46.394 C28.481 45.892 27.567 45.391 26.625 44.875 C25.666 44.351 24.707 43.826 23.719 43.286 C14.477 38.202 5.37 32.897 -3.719 27.547 C-8.103 24.968 -12.509 22.431 -16.928 19.911 C-17.89 19.362 -17.89 19.362 -18.871 18.802 C-20.435 17.909 -21.999 17.017 -23.562 16.125 C-23.525 16.942 -23.487 17.759 -23.448 18.601 C-23.106 26.338 -22.848 34.071 -22.682 41.814 C-22.593 45.794 -22.474 49.768 -22.28 53.745 C-21.06 79.461 -21.06 79.461 -25.205 85.53 C-29.148 89.11 -33.517 90.996 -38.581 92.49 C-41.159 93.316 -43.282 94.688 -45.562 96.125 C-46.222 96.125 -46.882 96.125 -47.562 96.125 C-47.655 84.546 -47.726 72.967 -47.77 61.388 C-47.791 56.01 -47.819 50.633 -47.864 45.256 C-47.908 40.062 -47.932 34.869 -47.942 29.675 C-47.949 27.698 -47.964 25.721 -47.985 23.744 C-48.015 20.965 -48.018 18.187 -48.017 15.408 C-48.031 14.599 -48.045 13.79 -48.06 12.956 C-48.013 6.348 -46.391 0.196 -41.823 -4.764 C-27.895 -17.466 -13.817 -7.747 0 0 Z' fill='%23264FAF' transform='translate(47.5625,10.875)'/%3E%3Cpath d='M0 0 C2.051 0.961 2.051 0.961 4.098 2.16 C5.278 2.843 5.278 2.843 6.481 3.541 C7.333 4.043 8.185 4.545 9.062 5.062 C10.954 6.16 12.846 7.258 14.738 8.355 C16.255 9.24 16.255 9.24 17.803 10.142 C22.848 13.074 27.913 15.969 32.979 18.863 C34.753 19.877 36.525 20.892 38.297 21.907 C44.243 25.311 50.205 28.681 56.203 31.992 C57.347 32.625 58.491 33.258 59.669 33.911 C61.837 35.108 64.008 36.299 66.183 37.484 C67.154 38.02 68.125 38.557 69.125 39.109 C69.973 39.573 70.821 40.037 71.695 40.515 C74.149 42.096 76.015 43.87 78 46 C74.984 51.808 72.395 55.457 66.25 58.25 C54.159 61.04 44.857 55.778 34.625 49.75 C32.781 48.681 30.938 47.612 29.094 46.543 C28.114 45.972 27.134 45.402 26.125 44.814 C21.068 41.878 15.989 38.98 10.91 36.082 C9.13 35.065 7.35 34.048 5.57 33.03 C-5.598 26.648 -16.794 20.315 -28 14 C-28 13.34 -28 12.68 -28 12 C-24.284 9.789 -20.551 7.61 -16.812 5.438 C-15.757 4.809 -14.702 4.181 -13.615 3.533 C-12.083 2.649 -12.083 2.649 -10.52 1.746 C-9.582 1.196 -8.645 0.646 -7.679 0.08 C-4.518 -1.194 -3.196 -1.069 0 0 Z' fill='%23264FAF' transform='translate(150,69)'/%3E%3C/svg%3E\");\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: 100vh;\n  width: 100%;\n  overflow: hidden;\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: white;\n  border-bottom: 1px solid #e0e0e0;\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n  flex-shrink: 0;\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: #757575;\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: #616161;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn[_ngcontent-%COMP%]:hover {\n  background: #f5f5f5;\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: #e53935;\n  color: white;\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 #e0e0e0;\n  background: #f5f5f5;\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: #1976d2;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .icon-fallback[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #757575;\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: #fafafa;\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-name[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 14px;\n  color: #424242;\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: white;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\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: #424242;\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: #757575;\n  font-size: 14px;\n}\n\n.user-menu-item[_ngcontent-%COMP%]:hover {\n  background: #f5f5f5;\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%] {\n  color: #c62828;\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #c62828;\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]:hover {\n  background: #ffebee;\n}\n\n.user-menu-divider[_ngcontent-%COMP%] {\n  height: 1px;\n  background: #e0e0e0;\n  margin: 4px 0;\n}\n\n.shell-loading[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100vh;\n  background: #fafafa;\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: #616161;\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn[_ngcontent-%COMP%]:hover {\n  background: #f5f5f5;\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: white;\n  box-shadow: 2px 0 12px rgba(0, 0, 0, 0.15);\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 #e0e0e0;\n  background: #fafafa;\n}\n.mobile-nav-header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 16px;\n  color: #424242;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header[_ngcontent-%COMP%]   .close-btn[_ngcontent-%COMP%]:hover {\n  background: #e0e0e0;\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: #9e9e9e;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer[_ngcontent-%COMP%] {\n  border-top: 1px solid #e0e0e0;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action[_ngcontent-%COMP%] {\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: #616161;\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: #f5f5f5;\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  .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: #ffffff;\n  border-bottom: 1px solid #e0e0e0;\n  padding: 12px 16px;\n}\n\n  .settings-fullscreen-window .k-window-title {\n  font-size: 18px;\n  font-weight: 600;\n  color: #212121;\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: #f5f5f5;\n}\n\n  .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: #fafafa;\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.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: fixed;\n  top: 60px; \n\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);\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 #d4d4d4;\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: #1976d2;\n  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.1);\n}\n\n.search-submit-btn[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: #1976d2;\n  color: white;\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: #1565c0;\n}\n\n.search-submit-btn[_ngcontent-%COMP%]:active {\n  background: #0d47a1;\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: #e53935;\n  color: white;\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}"] });
+        } }, dependencies: [i7.NgForOf, i7.NgIf, i8.NgControlStatus, i8.NgModel, i9.DropDownListComponent, i10.TextBoxDirective, i11.LoadingComponent, i12.AppSwitcherComponent, i13.AppNavComponent, i14.TabContainerComponent, i15.AppAccessDialogComponent], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100vh;\n  width: 100%;\n  overflow: hidden;\n}\n\n\n\n.mj-logo[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 18px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='230' height='128' viewBox='0 0 230 128'%3E%3Cpath d='M0 0 C1.197 0.668 2.394 1.336 3.592 2.004 C12.234 6.837 20.792 11.805 29.327 16.824 C37.26 21.476 45.269 25.98 53.312 30.438 C53.91 30.769 54.507 31.1 55.122 31.441 C61.234 34.87 61.234 34.87 67.438 38.125 C69.709 37.16 69.709 37.16 72.258 35.652 C73.255 35.09 74.253 34.527 75.281 33.948 C76.364 33.325 77.447 32.703 78.562 32.062 C79.685 31.426 80.808 30.789 81.965 30.133 C90.435 25.322 98.84 20.401 107.239 15.469 C118.242 9.027 129.394 2.857 140.566 -3.286 C142.41 -4.306 144.248 -5.338 146.079 -6.382 C146.869 -6.832 147.659 -7.282 148.473 -7.746 C149.148 -8.136 149.824 -8.526 150.52 -8.927 C156.448 -11.856 163.036 -11.676 169.188 -9.625 C175.638 -6.152 178.915 -2.712 181.438 4.125 C181.951 7.259 181.946 10.308 181.892 13.479 C181.892 14.377 181.893 15.276 181.893 16.201 C181.891 19.145 181.86 22.088 181.828 25.031 C181.821 27.082 181.815 29.134 181.811 31.185 C181.796 36.564 181.757 41.943 181.712 47.322 C181.671 52.819 181.653 58.316 181.633 63.812 C181.59 74.584 181.522 85.354 181.438 96.125 C178.573 94.739 175.729 93.326 172.901 91.867 C170.644 90.732 168.349 89.671 166.018 88.7 C162.628 87.127 160.12 85.736 157.438 83.125 C155.741 78.082 155.893 73.244 156.047 68.004 C156.047 66.534 156.041 65.064 156.031 63.595 C156.018 59.745 156.076 55.899 156.15 52.049 C156.213 48.114 156.207 44.18 156.207 40.244 C156.217 32.536 156.303 24.832 156.438 17.125 C152.485 19.335 148.534 21.546 144.582 23.758 C143.476 24.376 142.37 24.995 141.231 25.632 C131.895 30.857 122.601 36.151 113.321 41.472 C107.737 44.673 102.15 47.868 96.562 51.062 C95.965 51.404 95.367 51.746 94.751 52.098 C86.826 56.629 78.889 61.14 70.938 65.625 C62.527 70.37 54.133 75.144 45.75 79.938 C45.166 80.271 44.581 80.605 43.979 80.95 C37.987 84.375 31.996 87.803 26.011 91.241 C14.366 97.93 2.707 104.594 -9.062 111.062 C-9.97 111.565 -10.878 112.067 -11.814 112.585 C-12.649 113.04 -13.484 113.496 -14.344 113.965 C-15.066 114.36 -15.789 114.756 -16.533 115.164 C-22.269 117.881 -28.602 117.949 -34.625 116.125 C-39.398 114.15 -42.881 110.491 -45.562 106.125 C-45.562 104.805 -45.562 103.485 -45.562 102.125 C-45.022 101.835 -44.481 101.545 -43.924 101.246 C-32.122 94.897 -20.456 88.363 -8.907 81.566 C-0.017 76.35 8.975 71.333 18.003 66.362 C24.427 62.82 30.777 59.186 37.065 55.408 C39.438 54.125 39.438 54.125 41.438 54.125 C41.438 53.465 41.438 52.805 41.438 52.125 C40.704 51.843 39.971 51.561 39.216 51.271 C36.702 50.234 34.368 49.093 31.98 47.797 C30.7 47.102 30.7 47.102 29.395 46.394 C28.481 45.892 27.567 45.391 26.625 44.875 C25.666 44.351 24.707 43.826 23.719 43.286 C14.477 38.202 5.37 32.897 -3.719 27.547 C-8.103 24.968 -12.509 22.431 -16.928 19.911 C-17.89 19.362 -17.89 19.362 -18.871 18.802 C-20.435 17.909 -21.999 17.017 -23.562 16.125 C-23.525 16.942 -23.487 17.759 -23.448 18.601 C-23.106 26.338 -22.848 34.071 -22.682 41.814 C-22.593 45.794 -22.474 49.768 -22.28 53.745 C-21.06 79.461 -21.06 79.461 -25.205 85.53 C-29.148 89.11 -33.517 90.996 -38.581 92.49 C-41.159 93.316 -43.282 94.688 -45.562 96.125 C-46.222 96.125 -46.882 96.125 -47.562 96.125 C-47.655 84.546 -47.726 72.967 -47.77 61.388 C-47.791 56.01 -47.819 50.633 -47.864 45.256 C-47.908 40.062 -47.932 34.869 -47.942 29.675 C-47.949 27.698 -47.964 25.721 -47.985 23.744 C-48.015 20.965 -48.018 18.187 -48.017 15.408 C-48.031 14.599 -48.045 13.79 -48.06 12.956 C-48.013 6.348 -46.391 0.196 -41.823 -4.764 C-27.895 -17.466 -13.817 -7.747 0 0 Z' fill='%23264FAF' transform='translate(47.5625,10.875)'/%3E%3Cpath d='M0 0 C2.051 0.961 2.051 0.961 4.098 2.16 C5.278 2.843 5.278 2.843 6.481 3.541 C7.333 4.043 8.185 4.545 9.062 5.062 C10.954 6.16 12.846 7.258 14.738 8.355 C16.255 9.24 16.255 9.24 17.803 10.142 C22.848 13.074 27.913 15.969 32.979 18.863 C34.753 19.877 36.525 20.892 38.297 21.907 C44.243 25.311 50.205 28.681 56.203 31.992 C57.347 32.625 58.491 33.258 59.669 33.911 C61.837 35.108 64.008 36.299 66.183 37.484 C67.154 38.02 68.125 38.557 69.125 39.109 C69.973 39.573 70.821 40.037 71.695 40.515 C74.149 42.096 76.015 43.87 78 46 C74.984 51.808 72.395 55.457 66.25 58.25 C54.159 61.04 44.857 55.778 34.625 49.75 C32.781 48.681 30.938 47.612 29.094 46.543 C28.114 45.972 27.134 45.402 26.125 44.814 C21.068 41.878 15.989 38.98 10.91 36.082 C9.13 35.065 7.35 34.048 5.57 33.03 C-5.598 26.648 -16.794 20.315 -28 14 C-28 13.34 -28 12.68 -28 12 C-24.284 9.789 -20.551 7.61 -16.812 5.438 C-15.757 4.809 -14.702 4.181 -13.615 3.533 C-12.083 2.649 -12.083 2.649 -10.52 1.746 C-9.582 1.196 -8.645 0.646 -7.679 0.08 C-4.518 -1.194 -3.196 -1.069 0 0 Z' fill='%23264FAF' transform='translate(150,69)'/%3E%3C/svg%3E\");\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: 100vh;\n  width: 100%;\n  overflow: hidden;\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: white;\n  border-bottom: 1px solid #e0e0e0;\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n  flex-shrink: 0;\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: #757575;\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: #616161;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn[_ngcontent-%COMP%]:hover {\n  background: #f5f5f5;\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: #e53935;\n  color: white;\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 #e0e0e0;\n  background: #f5f5f5;\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: #1976d2;\n}\n\n.user-menu[_ngcontent-%COMP%]   .avatar-btn[_ngcontent-%COMP%]   .icon-fallback[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #757575;\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: #fafafa;\n}\n\n.user-menu-header[_ngcontent-%COMP%]   .user-name[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 14px;\n  color: #424242;\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: white;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\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: #424242;\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: #757575;\n  font-size: 14px;\n}\n\n.user-menu-item[_ngcontent-%COMP%]:hover {\n  background: #f5f5f5;\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%] {\n  color: #c62828;\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #c62828;\n}\n\n.user-menu-item.danger[_ngcontent-%COMP%]:hover {\n  background: #ffebee;\n}\n\n.user-menu-divider[_ngcontent-%COMP%] {\n  height: 1px;\n  background: #e0e0e0;\n  margin: 4px 0;\n}\n\n.shell-loading[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100vh;\n  background: #fafafa;\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: #616161;\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn[_ngcontent-%COMP%]:hover {\n  background: #f5f5f5;\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: white;\n  box-shadow: 2px 0 12px rgba(0, 0, 0, 0.15);\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 #e0e0e0;\n  background: #fafafa;\n}\n.mobile-nav-header[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n  font-weight: 600;\n  font-size: 16px;\n  color: #424242;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header[_ngcontent-%COMP%]   .close-btn[_ngcontent-%COMP%]:hover {\n  background: #e0e0e0;\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: #9e9e9e;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer[_ngcontent-%COMP%] {\n  border-top: 1px solid #e0e0e0;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action[_ngcontent-%COMP%] {\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: #616161;\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: #f5f5f5;\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  .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: #ffffff;\n  border-bottom: 1px solid #e0e0e0;\n  padding: 12px 16px;\n}\n\n  .settings-fullscreen-window .k-window-title {\n  font-size: 18px;\n  font-weight: 600;\n  color: #212121;\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: #f5f5f5;\n}\n\n  .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: #fafafa;\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.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: fixed;\n  top: 60px; \n\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);\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 #d4d4d4;\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: #1976d2;\n  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.1);\n}\n\n.search-submit-btn[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: #1976d2;\n  color: white;\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: #1565c0;\n}\n\n.search-submit-btn[_ngcontent-%COMP%]:active {\n  background: #0d47a1;\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: #e53935;\n  color: white;\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}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ShellComponent, [{
         type: Component,
-        args: [{ selector: 'mj-shell', template: "<div class=\"shell-container\" *ngIf=\"!loading\" [class.tabs-visible]=\"tabBarVisible\" kendoDialogContainer>\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    <div class=\"nav-bar-apps left-of-switcher\" *ngIf=\"leftOfSwitcherApps.length > 0\">\n      <button *ngFor=\"let app of leftOfSwitcherApps\"\n              class=\"nav-bar-app-btn\"\n              [class.active]=\"app.ID === activeApp?.ID\"\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    </div>\n\n    <!-- App Switcher -->\n    <mj-app-switcher\n      [activeApp]=\"activeApp\"\n      [isViewingSystemTab]=\"isViewingSystemTab\"\n      [loadingAppId]=\"loadingAppId\"\n      (appSelected)=\"onAppSwitch($event)\">\n    </mj-app-switcher>\n\n    <!-- App Navigation (desktop only) -->\n    <mj-app-nav\n      *ngIf=\"activeApp\"\n      class=\"desktop-nav\"\n      [app]=\"activeApp\"\n      (navItemClick)=\"onNavItemClick($event)\">\n    </mj-app-nav>\n\n    <!-- Spacer -->\n    <div class=\"spacer\"></div>\n\n    <!-- Actions (search, notifications, user menu) -->\n    <div class=\"header-actions\">\n      <button class=\"icon-btn desktop-only search-toggle-btn\" title=\"Search\" (click)=\"toggleSearch()\">\n        <i class=\"fa-solid fa-search\"></i>\n      </button>\n      <button class=\"icon-btn desktop-only notification-btn\" title=\"Notifications\" (click)=\"showNotifications()\">\n        <i class=\"fa-solid fa-bell\"></i>\n        <span class=\"notification-badge\" *ngIf=\"unreadNotificationCount > 0\">\n          {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n        </span>\n      </button>\n\n      <!-- Nav Bar Apps: Left of User Menu -->\n      <div class=\"nav-bar-apps left-of-user-menu\" *ngIf=\"leftOfUserMenuApps.length > 0\">\n        <button *ngFor=\"let app of leftOfUserMenuApps\"\n                class=\"nav-bar-app-btn\"\n                [class.active]=\"app.ID === activeApp?.ID\"\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      </div>\n\n      <div class=\"user-menu\">\n        <button class=\"avatar-btn\" (click)=\"toggleUserMenu($event)\">\n          <ng-container *ngIf=\"userImageURL; else iconAvatar\">\n            <img [src]=\"userImageURL\" alt=\"User avatar\" class=\"avatar-img\" />\n          </ng-container>\n          <ng-template #iconAvatar>\n            <div class=\"icon-fallback\">\n              <i [class]=\"userIconClass || 'fa-solid fa-user'\"></i>\n            </div>\n          </ng-template>\n        </button>\n        <!-- User Context Menu -->\n        <div class=\"user-context-menu\" *ngIf=\"userMenuVisible\">\n          <div class=\"user-menu-header\" *ngIf=\"userName\">\n            <span class=\"user-name\">{{ userName }}</span>\n          </div>\n          <div class=\"user-menu-divider\" *ngIf=\"userName\"></div>\n          <div class=\"user-menu-item\" (click)=\"onSettings()\">\n            <i class=\"fa-solid fa-gear\"></i>\n            <span>Settings</span>\n          </div>\n          <div class=\"user-menu-divider\"></div>\n          <div class=\"user-menu-item\" (click)=\"onLogLayout()\">\n            <i class=\"fa-solid fa-code\"></i>\n            <span>Log Layout (Debug)</span>\n          </div>\n          <div class=\"user-menu-divider\"></div>\n          <div class=\"user-menu-item danger\" (click)=\"onResetLayout()\">\n            <i class=\"fa-solid fa-rotate-left\"></i>\n            <span>Reset Layout</span>\n          </div>\n          <div class=\"user-menu-divider\"></div>\n          <div class=\"user-menu-item\" (click)=\"onLogout()\">\n            <i class=\"fa-solid fa-sign-out-alt\"></i>\n            <span>Logout</span>\n          </div>\n        </div>\n      </div>\n    </div>\n  </header>\n\n  <!-- Search Popup -->\n  <div class=\"search-popup-overlay\" *ngIf=\"isSearchOpen\" (click)=\"closeSearch()\"></div>\n  <div class=\"search-popup\" [class.open]=\"isSearchOpen\">\n    <div class=\"search-popup-content\" (click)=\"$event.stopPropagation()\">\n      <kendo-dropdownlist\n        [data]=\"searchableEntities\"\n        textField=\"Name\"\n        valueField=\"ID\"\n        class=\"search-entity-dropdown\"\n        [(ngModel)]=\"selectedEntity\">\n      </kendo-dropdownlist>\n      <input\n        type=\"text\"\n        #searchInput\n        placeholder=\"Search...\"\n        kendoTextBox\n        class=\"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  <div class=\"mobile-nav-overlay\" *ngIf=\"mobileNavOpen\" (click)=\"closeMobileNav()\"></div>\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    <div class=\"mobile-nav-content\" *ngIf=\"activeApp\">\n      <div class=\"mobile-nav-section-title\">{{ activeApp.Name }}</div>\n      <mj-app-nav\n        [app]=\"activeApp\"\n        (navItemClick)=\"onNavItemClick($event)\">\n      </mj-app-nav>\n    </div>\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        <span class=\"notification-badge-mobile\" *ngIf=\"unreadNotificationCount > 0\">\n          {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n        </span>\n      </button>\n    </div>\n  </div>\n\n  <!-- Tab Container - with dynamic tab bar visibility -->\n  <mj-tab-container [class.hide-tab-bar]=\"!tabBarVisible\"></mj-tab-container>\n</div>\n\n<!-- Loading State -->\n<div class=\"shell-loading\" *ngIf=\"loading\">\n  <mj-loading text=\"Loading workspace...\" size=\"large\"></mj-loading>\n</div>\n", styles: [":host {\n  display: block;\n  height: 100vh;\n  width: 100%;\n  overflow: hidden;\n}\n\n/* MJ Logo - inline SVG as data URI from MJ-Mark-Only-Transparent.svg */\n.mj-logo {\n  width: 32px;\n  height: 18px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='230' height='128' viewBox='0 0 230 128'%3E%3Cpath d='M0 0 C1.197 0.668 2.394 1.336 3.592 2.004 C12.234 6.837 20.792 11.805 29.327 16.824 C37.26 21.476 45.269 25.98 53.312 30.438 C53.91 30.769 54.507 31.1 55.122 31.441 C61.234 34.87 61.234 34.87 67.438 38.125 C69.709 37.16 69.709 37.16 72.258 35.652 C73.255 35.09 74.253 34.527 75.281 33.948 C76.364 33.325 77.447 32.703 78.562 32.062 C79.685 31.426 80.808 30.789 81.965 30.133 C90.435 25.322 98.84 20.401 107.239 15.469 C118.242 9.027 129.394 2.857 140.566 -3.286 C142.41 -4.306 144.248 -5.338 146.079 -6.382 C146.869 -6.832 147.659 -7.282 148.473 -7.746 C149.148 -8.136 149.824 -8.526 150.52 -8.927 C156.448 -11.856 163.036 -11.676 169.188 -9.625 C175.638 -6.152 178.915 -2.712 181.438 4.125 C181.951 7.259 181.946 10.308 181.892 13.479 C181.892 14.377 181.893 15.276 181.893 16.201 C181.891 19.145 181.86 22.088 181.828 25.031 C181.821 27.082 181.815 29.134 181.811 31.185 C181.796 36.564 181.757 41.943 181.712 47.322 C181.671 52.819 181.653 58.316 181.633 63.812 C181.59 74.584 181.522 85.354 181.438 96.125 C178.573 94.739 175.729 93.326 172.901 91.867 C170.644 90.732 168.349 89.671 166.018 88.7 C162.628 87.127 160.12 85.736 157.438 83.125 C155.741 78.082 155.893 73.244 156.047 68.004 C156.047 66.534 156.041 65.064 156.031 63.595 C156.018 59.745 156.076 55.899 156.15 52.049 C156.213 48.114 156.207 44.18 156.207 40.244 C156.217 32.536 156.303 24.832 156.438 17.125 C152.485 19.335 148.534 21.546 144.582 23.758 C143.476 24.376 142.37 24.995 141.231 25.632 C131.895 30.857 122.601 36.151 113.321 41.472 C107.737 44.673 102.15 47.868 96.562 51.062 C95.965 51.404 95.367 51.746 94.751 52.098 C86.826 56.629 78.889 61.14 70.938 65.625 C62.527 70.37 54.133 75.144 45.75 79.938 C45.166 80.271 44.581 80.605 43.979 80.95 C37.987 84.375 31.996 87.803 26.011 91.241 C14.366 97.93 2.707 104.594 -9.062 111.062 C-9.97 111.565 -10.878 112.067 -11.814 112.585 C-12.649 113.04 -13.484 113.496 -14.344 113.965 C-15.066 114.36 -15.789 114.756 -16.533 115.164 C-22.269 117.881 -28.602 117.949 -34.625 116.125 C-39.398 114.15 -42.881 110.491 -45.562 106.125 C-45.562 104.805 -45.562 103.485 -45.562 102.125 C-45.022 101.835 -44.481 101.545 -43.924 101.246 C-32.122 94.897 -20.456 88.363 -8.907 81.566 C-0.017 76.35 8.975 71.333 18.003 66.362 C24.427 62.82 30.777 59.186 37.065 55.408 C39.438 54.125 39.438 54.125 41.438 54.125 C41.438 53.465 41.438 52.805 41.438 52.125 C40.704 51.843 39.971 51.561 39.216 51.271 C36.702 50.234 34.368 49.093 31.98 47.797 C30.7 47.102 30.7 47.102 29.395 46.394 C28.481 45.892 27.567 45.391 26.625 44.875 C25.666 44.351 24.707 43.826 23.719 43.286 C14.477 38.202 5.37 32.897 -3.719 27.547 C-8.103 24.968 -12.509 22.431 -16.928 19.911 C-17.89 19.362 -17.89 19.362 -18.871 18.802 C-20.435 17.909 -21.999 17.017 -23.562 16.125 C-23.525 16.942 -23.487 17.759 -23.448 18.601 C-23.106 26.338 -22.848 34.071 -22.682 41.814 C-22.593 45.794 -22.474 49.768 -22.28 53.745 C-21.06 79.461 -21.06 79.461 -25.205 85.53 C-29.148 89.11 -33.517 90.996 -38.581 92.49 C-41.159 93.316 -43.282 94.688 -45.562 96.125 C-46.222 96.125 -46.882 96.125 -47.562 96.125 C-47.655 84.546 -47.726 72.967 -47.77 61.388 C-47.791 56.01 -47.819 50.633 -47.864 45.256 C-47.908 40.062 -47.932 34.869 -47.942 29.675 C-47.949 27.698 -47.964 25.721 -47.985 23.744 C-48.015 20.965 -48.018 18.187 -48.017 15.408 C-48.031 14.599 -48.045 13.79 -48.06 12.956 C-48.013 6.348 -46.391 0.196 -41.823 -4.764 C-27.895 -17.466 -13.817 -7.747 0 0 Z' fill='%23264FAF' transform='translate(47.5625,10.875)'/%3E%3Cpath d='M0 0 C2.051 0.961 2.051 0.961 4.098 2.16 C5.278 2.843 5.278 2.843 6.481 3.541 C7.333 4.043 8.185 4.545 9.062 5.062 C10.954 6.16 12.846 7.258 14.738 8.355 C16.255 9.24 16.255 9.24 17.803 10.142 C22.848 13.074 27.913 15.969 32.979 18.863 C34.753 19.877 36.525 20.892 38.297 21.907 C44.243 25.311 50.205 28.681 56.203 31.992 C57.347 32.625 58.491 33.258 59.669 33.911 C61.837 35.108 64.008 36.299 66.183 37.484 C67.154 38.02 68.125 38.557 69.125 39.109 C69.973 39.573 70.821 40.037 71.695 40.515 C74.149 42.096 76.015 43.87 78 46 C74.984 51.808 72.395 55.457 66.25 58.25 C54.159 61.04 44.857 55.778 34.625 49.75 C32.781 48.681 30.938 47.612 29.094 46.543 C28.114 45.972 27.134 45.402 26.125 44.814 C21.068 41.878 15.989 38.98 10.91 36.082 C9.13 35.065 7.35 34.048 5.57 33.03 C-5.598 26.648 -16.794 20.315 -28 14 C-28 13.34 -28 12.68 -28 12 C-24.284 9.789 -20.551 7.61 -16.812 5.438 C-15.757 4.809 -14.702 4.181 -13.615 3.533 C-12.083 2.649 -12.083 2.649 -10.52 1.746 C-9.582 1.196 -8.645 0.646 -7.679 0.08 C-4.518 -1.194 -3.196 -1.069 0 0 Z' fill='%23264FAF' transform='translate(150,69)'/%3E%3C/svg%3E\");\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: 100vh;\n  width: 100%;\n  overflow: hidden;\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: white;\n  border-bottom: 1px solid #e0e0e0;\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n  flex-shrink: 0;\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: #757575;\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: #616161;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn:hover {\n  background: #f5f5f5;\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: #e53935;\n  color: white;\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 #e0e0e0;\n  background: #f5f5f5;\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: #1976d2;\n}\n\n.user-menu .avatar-btn .icon-fallback i {\n  color: #757575;\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: #fafafa;\n}\n\n.user-menu-header .user-name {\n  font-weight: 600;\n  font-size: 14px;\n  color: #424242;\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: white;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\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: #424242;\n  transition: background 0.15s;\n}\n\n.user-menu-item i {\n  width: 18px;\n  text-align: center;\n  color: #757575;\n  font-size: 14px;\n}\n\n.user-menu-item:hover {\n  background: #f5f5f5;\n}\n\n.user-menu-item.danger {\n  color: #c62828;\n}\n\n.user-menu-item.danger i {\n  color: #c62828;\n}\n\n.user-menu-item.danger:hover {\n  background: #ffebee;\n}\n\n.user-menu-divider {\n  height: 1px;\n  background: #e0e0e0;\n  margin: 4px 0;\n}\n\n.shell-loading {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100vh;\n  background: #fafafa;\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: #616161;\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn:hover {\n  background: #f5f5f5;\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: white;\n  box-shadow: 2px 0 12px rgba(0, 0, 0, 0.15);\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 #e0e0e0;\n  background: #fafafa;\n}\n.mobile-nav-header span {\n  font-weight: 600;\n  font-size: 16px;\n  color: #424242;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header .close-btn:hover {\n  background: #e0e0e0;\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: #9e9e9e;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer {\n  border-top: 1px solid #e0e0e0;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action {\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: #616161;\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: #f5f5f5;\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\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: #ffffff;\n  border-bottom: 1px solid #e0e0e0;\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: #212121;\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: #f5f5f5;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: #fafafa;\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   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: fixed;\n  top: 60px; /* Below header */\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);\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 #d4d4d4;\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: #1976d2;\n  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.1);\n}\n\n.search-submit-btn {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: #1976d2;\n  color: white;\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: #1565c0;\n}\n\n.search-submit-btn:active {\n  background: #0d47a1;\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: #e53935;\n  color: white;\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}"] }]
+        args: [{ selector: 'mj-shell', template: "<div class=\"shell-container\" [class.hidden]=\"loading\" [class.tabs-visible]=\"tabBarVisible\" kendoDialogContainer>\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    <div class=\"nav-bar-apps left-of-switcher\" *ngIf=\"leftOfSwitcherApps.length > 0\">\n      <button *ngFor=\"let app of leftOfSwitcherApps\"\n              class=\"nav-bar-app-btn\"\n              [class.active]=\"app.ID === activeApp?.ID\"\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    </div>\n\n    <!-- App Switcher -->\n    <mj-app-switcher\n      [activeApp]=\"activeApp\"\n      [isViewingSystemTab]=\"isViewingSystemTab\"\n      [loadingAppId]=\"loadingAppId\"\n      (appSelected)=\"onAppSwitch($event)\">\n    </mj-app-switcher>\n\n    <!-- App Navigation (desktop only) -->\n    <mj-app-nav\n      *ngIf=\"activeApp\"\n      class=\"desktop-nav\"\n      [app]=\"activeApp\"\n      (navItemClick)=\"onNavItemClick($event)\">\n    </mj-app-nav>\n\n    <!-- Spacer -->\n    <div class=\"spacer\"></div>\n\n    <!-- Actions (search, notifications, user menu) -->\n    <div class=\"header-actions\">\n      <button class=\"icon-btn desktop-only search-toggle-btn\" title=\"Search\" (click)=\"toggleSearch()\">\n        <i class=\"fa-solid fa-search\"></i>\n      </button>\n      <button class=\"icon-btn desktop-only notification-btn\" title=\"Notifications\" (click)=\"showNotifications()\">\n        <i class=\"fa-solid fa-bell\"></i>\n        <span class=\"notification-badge\" *ngIf=\"unreadNotificationCount > 0\">\n          {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n        </span>\n      </button>\n\n      <!-- Nav Bar Apps: Left of User Menu -->\n      <div class=\"nav-bar-apps left-of-user-menu\" *ngIf=\"leftOfUserMenuApps.length > 0\">\n        <button *ngFor=\"let app of leftOfUserMenuApps\"\n                class=\"nav-bar-app-btn\"\n                [class.active]=\"app.ID === activeApp?.ID\"\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      </div>\n\n      <div class=\"user-menu\">\n        <button class=\"avatar-btn\" (click)=\"toggleUserMenu($event)\">\n          <ng-container *ngIf=\"userImageURL; else iconAvatar\">\n            <img [src]=\"userImageURL\" alt=\"User avatar\" class=\"avatar-img\" />\n          </ng-container>\n          <ng-template #iconAvatar>\n            <div class=\"icon-fallback\">\n              <i [class]=\"userIconClass || 'fa-solid fa-user'\"></i>\n            </div>\n          </ng-template>\n        </button>\n        <!-- User Context Menu -->\n        <div class=\"user-context-menu\" *ngIf=\"userMenuVisible\">\n          <div class=\"user-menu-header\" *ngIf=\"userName\">\n            <span class=\"user-name\">{{ userName }}</span>\n          </div>\n          <div class=\"user-menu-divider\" *ngIf=\"userName\"></div>\n          <div class=\"user-menu-item\" (click)=\"onSettings()\">\n            <i class=\"fa-solid fa-gear\"></i>\n            <span>Settings</span>\n          </div>\n          <div class=\"user-menu-divider\"></div>\n          <div class=\"user-menu-item\" (click)=\"onLogLayout()\">\n            <i class=\"fa-solid fa-code\"></i>\n            <span>Log Layout (Debug)</span>\n          </div>\n          <div class=\"user-menu-divider\"></div>\n          <div class=\"user-menu-item danger\" (click)=\"onResetLayout()\">\n            <i class=\"fa-solid fa-rotate-left\"></i>\n            <span>Reset Layout</span>\n          </div>\n          <div class=\"user-menu-divider\"></div>\n          <div class=\"user-menu-item\" (click)=\"onLogout()\">\n            <i class=\"fa-solid fa-sign-out-alt\"></i>\n            <span>Logout</span>\n          </div>\n        </div>\n      </div>\n    </div>\n  </header>\n\n  <!-- Search Popup -->\n  <div class=\"search-popup-overlay\" *ngIf=\"isSearchOpen\" (click)=\"closeSearch()\"></div>\n  <div class=\"search-popup\" [class.open]=\"isSearchOpen\">\n    <div class=\"search-popup-content\" (click)=\"$event.stopPropagation()\">\n      <kendo-dropdownlist\n        [data]=\"searchableEntities\"\n        textField=\"Name\"\n        valueField=\"ID\"\n        class=\"search-entity-dropdown\"\n        [(ngModel)]=\"selectedEntity\">\n      </kendo-dropdownlist>\n      <input\n        type=\"text\"\n        #searchInput\n        placeholder=\"Search...\"\n        kendoTextBox\n        class=\"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  <div class=\"mobile-nav-overlay\" *ngIf=\"mobileNavOpen\" (click)=\"closeMobileNav()\"></div>\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    <div class=\"mobile-nav-content\" *ngIf=\"activeApp\">\n      <div class=\"mobile-nav-section-title\">{{ activeApp.Name }}</div>\n      <mj-app-nav\n        [app]=\"activeApp\"\n        (navItemClick)=\"onNavItemClick($event)\">\n      </mj-app-nav>\n    </div>\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        <span class=\"notification-badge-mobile\" *ngIf=\"unreadNotificationCount > 0\">\n          {{ unreadNotificationCount > 99 ? '99+' : unreadNotificationCount }}\n        </span>\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<div class=\"shell-loading\" *ngIf=\"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</div>\n\n<!-- App Access Error Dialog -->\n<mj-app-access-dialog\n  #appAccessDialog\n  (result)=\"onAppAccessDialogResult($event)\">\n</mj-app-access-dialog>\n", styles: [":host {\n  display: block;\n  height: 100vh;\n  width: 100%;\n  overflow: hidden;\n}\n\n/* MJ Logo - inline SVG as data URI from MJ-Mark-Only-Transparent.svg */\n.mj-logo {\n  width: 32px;\n  height: 18px;\n  background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='230' height='128' viewBox='0 0 230 128'%3E%3Cpath d='M0 0 C1.197 0.668 2.394 1.336 3.592 2.004 C12.234 6.837 20.792 11.805 29.327 16.824 C37.26 21.476 45.269 25.98 53.312 30.438 C53.91 30.769 54.507 31.1 55.122 31.441 C61.234 34.87 61.234 34.87 67.438 38.125 C69.709 37.16 69.709 37.16 72.258 35.652 C73.255 35.09 74.253 34.527 75.281 33.948 C76.364 33.325 77.447 32.703 78.562 32.062 C79.685 31.426 80.808 30.789 81.965 30.133 C90.435 25.322 98.84 20.401 107.239 15.469 C118.242 9.027 129.394 2.857 140.566 -3.286 C142.41 -4.306 144.248 -5.338 146.079 -6.382 C146.869 -6.832 147.659 -7.282 148.473 -7.746 C149.148 -8.136 149.824 -8.526 150.52 -8.927 C156.448 -11.856 163.036 -11.676 169.188 -9.625 C175.638 -6.152 178.915 -2.712 181.438 4.125 C181.951 7.259 181.946 10.308 181.892 13.479 C181.892 14.377 181.893 15.276 181.893 16.201 C181.891 19.145 181.86 22.088 181.828 25.031 C181.821 27.082 181.815 29.134 181.811 31.185 C181.796 36.564 181.757 41.943 181.712 47.322 C181.671 52.819 181.653 58.316 181.633 63.812 C181.59 74.584 181.522 85.354 181.438 96.125 C178.573 94.739 175.729 93.326 172.901 91.867 C170.644 90.732 168.349 89.671 166.018 88.7 C162.628 87.127 160.12 85.736 157.438 83.125 C155.741 78.082 155.893 73.244 156.047 68.004 C156.047 66.534 156.041 65.064 156.031 63.595 C156.018 59.745 156.076 55.899 156.15 52.049 C156.213 48.114 156.207 44.18 156.207 40.244 C156.217 32.536 156.303 24.832 156.438 17.125 C152.485 19.335 148.534 21.546 144.582 23.758 C143.476 24.376 142.37 24.995 141.231 25.632 C131.895 30.857 122.601 36.151 113.321 41.472 C107.737 44.673 102.15 47.868 96.562 51.062 C95.965 51.404 95.367 51.746 94.751 52.098 C86.826 56.629 78.889 61.14 70.938 65.625 C62.527 70.37 54.133 75.144 45.75 79.938 C45.166 80.271 44.581 80.605 43.979 80.95 C37.987 84.375 31.996 87.803 26.011 91.241 C14.366 97.93 2.707 104.594 -9.062 111.062 C-9.97 111.565 -10.878 112.067 -11.814 112.585 C-12.649 113.04 -13.484 113.496 -14.344 113.965 C-15.066 114.36 -15.789 114.756 -16.533 115.164 C-22.269 117.881 -28.602 117.949 -34.625 116.125 C-39.398 114.15 -42.881 110.491 -45.562 106.125 C-45.562 104.805 -45.562 103.485 -45.562 102.125 C-45.022 101.835 -44.481 101.545 -43.924 101.246 C-32.122 94.897 -20.456 88.363 -8.907 81.566 C-0.017 76.35 8.975 71.333 18.003 66.362 C24.427 62.82 30.777 59.186 37.065 55.408 C39.438 54.125 39.438 54.125 41.438 54.125 C41.438 53.465 41.438 52.805 41.438 52.125 C40.704 51.843 39.971 51.561 39.216 51.271 C36.702 50.234 34.368 49.093 31.98 47.797 C30.7 47.102 30.7 47.102 29.395 46.394 C28.481 45.892 27.567 45.391 26.625 44.875 C25.666 44.351 24.707 43.826 23.719 43.286 C14.477 38.202 5.37 32.897 -3.719 27.547 C-8.103 24.968 -12.509 22.431 -16.928 19.911 C-17.89 19.362 -17.89 19.362 -18.871 18.802 C-20.435 17.909 -21.999 17.017 -23.562 16.125 C-23.525 16.942 -23.487 17.759 -23.448 18.601 C-23.106 26.338 -22.848 34.071 -22.682 41.814 C-22.593 45.794 -22.474 49.768 -22.28 53.745 C-21.06 79.461 -21.06 79.461 -25.205 85.53 C-29.148 89.11 -33.517 90.996 -38.581 92.49 C-41.159 93.316 -43.282 94.688 -45.562 96.125 C-46.222 96.125 -46.882 96.125 -47.562 96.125 C-47.655 84.546 -47.726 72.967 -47.77 61.388 C-47.791 56.01 -47.819 50.633 -47.864 45.256 C-47.908 40.062 -47.932 34.869 -47.942 29.675 C-47.949 27.698 -47.964 25.721 -47.985 23.744 C-48.015 20.965 -48.018 18.187 -48.017 15.408 C-48.031 14.599 -48.045 13.79 -48.06 12.956 C-48.013 6.348 -46.391 0.196 -41.823 -4.764 C-27.895 -17.466 -13.817 -7.747 0 0 Z' fill='%23264FAF' transform='translate(47.5625,10.875)'/%3E%3Cpath d='M0 0 C2.051 0.961 2.051 0.961 4.098 2.16 C5.278 2.843 5.278 2.843 6.481 3.541 C7.333 4.043 8.185 4.545 9.062 5.062 C10.954 6.16 12.846 7.258 14.738 8.355 C16.255 9.24 16.255 9.24 17.803 10.142 C22.848 13.074 27.913 15.969 32.979 18.863 C34.753 19.877 36.525 20.892 38.297 21.907 C44.243 25.311 50.205 28.681 56.203 31.992 C57.347 32.625 58.491 33.258 59.669 33.911 C61.837 35.108 64.008 36.299 66.183 37.484 C67.154 38.02 68.125 38.557 69.125 39.109 C69.973 39.573 70.821 40.037 71.695 40.515 C74.149 42.096 76.015 43.87 78 46 C74.984 51.808 72.395 55.457 66.25 58.25 C54.159 61.04 44.857 55.778 34.625 49.75 C32.781 48.681 30.938 47.612 29.094 46.543 C28.114 45.972 27.134 45.402 26.125 44.814 C21.068 41.878 15.989 38.98 10.91 36.082 C9.13 35.065 7.35 34.048 5.57 33.03 C-5.598 26.648 -16.794 20.315 -28 14 C-28 13.34 -28 12.68 -28 12 C-24.284 9.789 -20.551 7.61 -16.812 5.438 C-15.757 4.809 -14.702 4.181 -13.615 3.533 C-12.083 2.649 -12.083 2.649 -10.52 1.746 C-9.582 1.196 -8.645 0.646 -7.679 0.08 C-4.518 -1.194 -3.196 -1.069 0 0 Z' fill='%23264FAF' transform='translate(150,69)'/%3E%3C/svg%3E\");\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: 100vh;\n  width: 100%;\n  overflow: hidden;\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: white;\n  border-bottom: 1px solid #e0e0e0;\n  display: flex;\n  align-items: center;\n  padding: 0 16px;\n  gap: 16px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);\n  flex-shrink: 0;\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: #757575;\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: #616161;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n\n.icon-btn:hover {\n  background: #f5f5f5;\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: #e53935;\n  color: white;\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 #e0e0e0;\n  background: #f5f5f5;\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: #1976d2;\n}\n\n.user-menu .avatar-btn .icon-fallback i {\n  color: #757575;\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: #fafafa;\n}\n\n.user-menu-header .user-name {\n  font-weight: 600;\n  font-size: 14px;\n  color: #424242;\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: white;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);\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: #424242;\n  transition: background 0.15s;\n}\n\n.user-menu-item i {\n  width: 18px;\n  text-align: center;\n  color: #757575;\n  font-size: 14px;\n}\n\n.user-menu-item:hover {\n  background: #f5f5f5;\n}\n\n.user-menu-item.danger {\n  color: #c62828;\n}\n\n.user-menu-item.danger i {\n  color: #c62828;\n}\n\n.user-menu-item.danger:hover {\n  background: #ffebee;\n}\n\n.user-menu-divider {\n  height: 1px;\n  background: #e0e0e0;\n  margin: 4px 0;\n}\n\n.shell-loading {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100vh;\n  background: #fafafa;\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: #616161;\n  font-size: 20px;\n  transition: background 0.15s;\n}\n.hamburger-btn:hover {\n  background: #f5f5f5;\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: white;\n  box-shadow: 2px 0 12px rgba(0, 0, 0, 0.15);\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 #e0e0e0;\n  background: #fafafa;\n}\n.mobile-nav-header span {\n  font-weight: 600;\n  font-size: 16px;\n  color: #424242;\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: #757575;\n  font-size: 18px;\n  transition: background 0.15s;\n}\n.mobile-nav-header .close-btn:hover {\n  background: #e0e0e0;\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: #9e9e9e;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.mobile-nav-footer {\n  border-top: 1px solid #e0e0e0;\n  padding: 12px 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-nav-action {\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: #616161;\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: #f5f5f5;\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\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: #ffffff;\n  border-bottom: 1px solid #e0e0e0;\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: #212121;\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: #f5f5f5;\n}\n\n::ng-deep .settings-fullscreen-window .k-window-content {\n  padding: 0;\n  overflow: auto;\n  background: #fafafa;\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   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: fixed;\n  top: 60px; /* Below header */\n  right: 16px;\n  width: 480px;\n  max-width: calc(100vw - 32px);\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);\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 #d4d4d4;\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: #1976d2;\n  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.1);\n}\n\n.search-submit-btn {\n  width: 40px;\n  height: 40px;\n  border-radius: 8px;\n  border: none;\n  background: #1976d2;\n  color: white;\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: #1565c0;\n}\n\n.search-submit-btn:active {\n  background: #0d47a1;\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: #e53935;\n  color: white;\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}"] }]
     }], () => [{ 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.SettingsDialogService }, { type: i0.ViewContainerRef }, { type: i2.TitleService }], { searchInput: [{
             type: ViewChild,
             args: ['searchInput']
+        }], appAccessDialog: [{
+            type: ViewChild,
+            args: ['appAccessDialog']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ShellComponent, { className: "ShellComponent", filePath: "src/lib/shell/shell.component.ts", lineNumber: 36 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ShellComponent, { className: "ShellComponent", filePath: "src/lib/shell/shell.component.ts", lineNumber: 40 }); })();
 //# sourceMappingURL=shell.component.js.map