npm - @memberjunction/ng-dashboards - Versions diffs - 5.3.1 → 5.4.0 - Mend

@memberjunction/ng-dashboards 5.3.1 → 5.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (173) hide show

package/dist/DataExplorer/data-explorer-dashboard.component.js CHANGED Viewed

@@ -34,13 +34,13 @@ import * as i12 from "@angular/common";
 const _c0 = ["filterInput"];
 const _forTrack0 = ($index, $item) => $item.label;
 const _forTrack1 = ($index, $item) => $item.name;
-const _forTrack2 = ($index, $item) => $item.ID;
-const _forTrack3 = ($index, $item) => $item.entityId + "|" + $item.recordId;
-const _forTrack4 = ($index, $item) => $item.entityId;
-const _forTrack5 = ($index, $item) => $item.userFavoriteId;
+const _forTrack2 = ($index, $item) => $item.entityId + "|" + $item.recordId;
+const _forTrack3 = ($index, $item) => $item.ID;
+const _forTrack4 = ($index, $item) => $item.userFavoriteId;
+const _forTrack5 = ($index, $item) => $item.applicationId;
 function DataExplorerDashboardComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 22)(1, "mj-explorer-navigation-panel", 23);
+    i0.ɵɵelementStart(0, "div", 23)(1, "mj-explorer-navigation-panel", 24);
     i0.ɵɵlistener("entitySelected", function DataExplorerDashboardComponent_Conditional_1_Template_mj_explorer_navigation_panel_entitySelected_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onEntitySelected($event)); })("toggleCollapse", function DataExplorerDashboardComponent_Conditional_1_Template_mj_explorer_navigation_panel_toggleCollapse_1_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleNavigationPanel()); })("sectionToggled", function DataExplorerDashboardComponent_Conditional_1_Template_mj_explorer_navigation_panel_sectionToggled_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.stateService.toggleSection($event)); })("openRecord", function DataExplorerDashboardComponent_Conditional_1_Template_mj_explorer_navigation_panel_openRecord_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenRecordFromNav($event)); })("selectRecord", function DataExplorerDashboardComponent_Conditional_1_Template_mj_explorer_navigation_panel_selectRecord_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSelectRecordFromNav($event)); })("expandAndFocus", function DataExplorerDashboardComponent_Conditional_1_Template_mj_explorer_navigation_panel_expandAndFocus_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onExpandAndFocus($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -49,26 +49,26 @@ function DataExplorerDashboardComponent_Conditional_1_Template(rf, ctx) { if (rf
     i0.ɵɵclassProp("collapsed", ctx_r1.state.navigationPanelCollapsed);
     i0.ɵɵproperty("@slideInLeft", undefined);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("entities", ctx_r1.entities)("selectedEntityName", ctx_r1.state.selectedEntityName)("favorites", ctx_r1.state.favorites)("recentItems", ctx_r1.state.recentItems)("collapsed", ctx_r1.state.navigationPanelCollapsed)("allowedEntityNames", ctx_r1.allowedEntityNames)("favoritesSectionExpanded", ctx_r1.state.favoritesSectionExpanded)("recentSectionExpanded", ctx_r1.state.recentSectionExpanded)("entitiesSectionExpanded", ctx_r1.state.entitiesSectionExpanded)("viewsSectionExpanded", ctx_r1.state.viewsSectionExpanded);
+    i0.ɵɵproperty("entities", ctx_r1.entities)("appEntityGroups", ctx_r1.appEntityGroups)("selectedEntityName", ctx_r1.state.selectedEntityName)("favorites", ctx_r1.state.favorites)("recentItems", ctx_r1.state.recentItems)("collapsed", ctx_r1.state.navigationPanelCollapsed)("allowedEntityNames", ctx_r1.allowedEntityNames)("favoritesSectionExpanded", ctx_r1.state.favoritesSectionExpanded)("recentSectionExpanded", ctx_r1.state.recentSectionExpanded)("entitiesSectionExpanded", ctx_r1.state.entitiesSectionExpanded)("viewsSectionExpanded", ctx_r1.state.viewsSectionExpanded);
 } }
 function DataExplorerDashboardComponent_Conditional_3_For_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 28);
+    i0.ɵɵelement(0, "i", 29);
 } if (rf & 2) {
     const crumb_r5 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵclassMap(crumb_r5.icon);
 } }
 function DataExplorerDashboardComponent_Conditional_3_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 27);
+    i0.ɵɵelement(0, "i", 28);
 } }
 function DataExplorerDashboardComponent_Conditional_3_For_2_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 24);
+    i0.ɵɵelementStart(0, "span", 25);
     i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_3_For_2_Template_span_click_0_listener() { const ctx_r3 = i0.ɵɵrestoreView(_r3); const crumb_r5 = ctx_r3.$implicit; const ɵ$index_13_r6 = ctx_r3.$index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onBreadcrumbClick(crumb_r5, ɵ$index_13_r6)); });
-    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_3_For_2_Conditional_1_Template, 1, 2, "i", 25);
-    i0.ɵɵelementStart(2, "span", 26);
+    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_3_For_2_Conditional_1_Template, 1, 2, "i", 26);
+    i0.ɵɵelementStart(2, "span", 27);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(4, DataExplorerDashboardComponent_Conditional_3_For_2_Conditional_4_Template, 1, 0, "i", 27);
+    i0.ɵɵconditionalCreate(4, DataExplorerDashboardComponent_Conditional_3_For_2_Conditional_4_Template, 1, 0, "i", 28);
 } if (rf & 2) {
     const crumb_r5 = ctx.$implicit;
     const ɵ$index_13_r6 = ctx.$index;
@@ -92,7 +92,7 @@ function DataExplorerDashboardComponent_Conditional_3_Template(rf, ctx) { if (rf
     i0.ɵɵrepeater(ctx_r1.breadcrumbs);
 } }
 function DataExplorerDashboardComponent_Conditional_6_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 31);
+    i0.ɵɵelementStart(0, "span", 32);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "number");
     i0.ɵɵpipe(3, "number");
@@ -103,7 +103,7 @@ function DataExplorerDashboardComponent_Conditional_6_Conditional_3_Template(rf,
     i0.ɵɵtextInterpolate2("", i0.ɵɵpipeBind1(2, 2, ctx_r1.filteredRecordCount), " of ", i0.ɵɵpipeBind1(3, 4, ctx_r1.totalRecordCount), " records");
 } }
 function DataExplorerDashboardComponent_Conditional_6_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 31);
+    i0.ɵɵelementStart(0, "span", 32);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "number");
     i0.ɵɵelementEnd();
@@ -113,7 +113,7 @@ function DataExplorerDashboardComponent_Conditional_6_Conditional_4_Template(rf,
     i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind1(2, 1, ctx_r1.totalRecordCount), " records");
 } }
 function DataExplorerDashboardComponent_Conditional_6_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 35);
+    i0.ɵɵelementStart(0, "span", 36);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -123,18 +123,18 @@ function DataExplorerDashboardComponent_Conditional_6_Conditional_8_Template(rf,
 } }
 function DataExplorerDashboardComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelement(0, "i", 29);
-    i0.ɵɵelementStart(1, "h2", 30);
+    i0.ɵɵelement(0, "i", 30);
+    i0.ɵɵelementStart(1, "h2", 31);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(3, DataExplorerDashboardComponent_Conditional_6_Conditional_3_Template, 4, 6, "span", 31)(4, DataExplorerDashboardComponent_Conditional_6_Conditional_4_Template, 3, 3, "span", 31);
-    i0.ɵɵelementStart(5, "mj-view-selector", 32);
+    i0.ɵɵconditionalCreate(3, DataExplorerDashboardComponent_Conditional_6_Conditional_3_Template, 4, 6, "span", 32)(4, DataExplorerDashboardComponent_Conditional_6_Conditional_4_Template, 3, 3, "span", 32);
+    i0.ɵɵelementStart(5, "mj-view-selector", 33);
     i0.ɵɵlistener("viewSelected", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_viewSelected_5_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewSelected($event)); })("saveViewRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_saveViewRequested_5_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSaveViewRequested($event)); })("manageViewsRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_manageViewsRequested_5_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onManageViewsRequested()); })("openInTabRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_openInTabRequested_5_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenInTabRequested($event)); })("configureViewRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_configureViewRequested_5_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onConfigureViewRequested()); })("createNewRecordRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_createNewRecordRequested_5_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCreateNewRecord()); })("exportRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_exportRequested_5_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onExport()); })("duplicateViewRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_duplicateViewRequested_5_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDuplicateView($event)); })("quickSaveRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_quickSaveRequested_5_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onQuickSaveRequested($event)); })("revertRequested", function DataExplorerDashboardComponent_Conditional_6_Template_mj_view_selector_revertRequested_5_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onRevertView()); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "button", 33);
+    i0.ɵɵelementStart(6, "button", 34);
     i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_6_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onAddToListClick()); });
-    i0.ɵɵelement(7, "i", 34);
-    i0.ɵɵconditionalCreate(8, DataExplorerDashboardComponent_Conditional_6_Conditional_8_Template, 2, 1, "span", 35);
+    i0.ɵɵelement(7, "i", 35);
+    i0.ɵɵconditionalCreate(8, DataExplorerDashboardComponent_Conditional_6_Conditional_8_Template, 2, 1, "span", 36);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -152,17 +152,17 @@ function DataExplorerDashboardComponent_Conditional_6_Template(rf, ctx) { if (rf
     i0.ɵɵconditional(ctx_r1.hasSelectedRecords ? 8 : -1);
 } }
 function DataExplorerDashboardComponent_Conditional_7_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 29);
+    i0.ɵɵelement(0, "i", 30);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵclassMap(ctx_r1.displayIcon);
 } }
 function DataExplorerDashboardComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, DataExplorerDashboardComponent_Conditional_7_Conditional_0_Template, 1, 2, "i", 36);
-    i0.ɵɵelementStart(1, "h2", 30);
+    i0.ɵɵconditionalCreate(0, DataExplorerDashboardComponent_Conditional_7_Conditional_0_Template, 1, 2, "i", 37);
+    i0.ɵɵelementStart(1, "h2", 31);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 31);
+    i0.ɵɵelementStart(3, "span", 32);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -175,19 +175,19 @@ function DataExplorerDashboardComponent_Conditional_7_Template(rf, ctx) { if (rf
 } }
 function DataExplorerDashboardComponent_Conditional_9_Conditional_4_Template(rf, ctx) { if (rf & 1) {
     const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 40);
+    i0.ɵɵelementStart(0, "button", 41);
     i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_9_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onFilterTextChanged("")); });
-    i0.ɵɵelement(1, "i", 41);
+    i0.ɵɵelement(1, "i", 42);
     i0.ɵɵelementEnd();
 } }
 function DataExplorerDashboardComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 9);
-    i0.ɵɵelement(1, "i", 37);
-    i0.ɵɵelementStart(2, "input", 38, 0);
+    i0.ɵɵelement(1, "i", 38);
+    i0.ɵɵelementStart(2, "input", 39, 0);
     i0.ɵɵlistener("ngModelChange", function DataExplorerDashboardComponent_Conditional_9_Template_input_ngModelChange_2_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFilterTextChanged($event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, DataExplorerDashboardComponent_Conditional_9_Conditional_4_Template, 2, 0, "button", 39);
+    i0.ɵɵconditionalCreate(4, DataExplorerDashboardComponent_Conditional_9_Conditional_4_Template, 2, 0, "button", 40);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -196,102 +196,79 @@ function DataExplorerDashboardComponent_Conditional_9_Template(rf, ctx) { if (rf
     i0.ɵɵadvance(2);
     i0.ɵɵconditional(ctx_r1.debouncedFilterText ? 4 : -1);
 } }
-function DataExplorerDashboardComponent_Conditional_10_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_11_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 40);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_10_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.entityFilterText = ""); });
-    i0.ɵɵelement(1, "i", 41);
-    i0.ɵɵelementEnd();
-} }
-function DataExplorerDashboardComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 9);
-    i0.ɵɵelement(1, "i", 37);
-    i0.ɵɵelementStart(2, "input", 42, 0);
-    i0.ɵɵtwoWayListener("ngModelChange", function DataExplorerDashboardComponent_Conditional_10_Template_input_ngModelChange_2_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.entityFilterText, $event) || (ctx_r1.entityFilterText = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, DataExplorerDashboardComponent_Conditional_10_Conditional_4_Template, 2, 0, "button", 39);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(2);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.entityFilterText);
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.entityFilterText ? 4 : -1);
-} }
-function DataExplorerDashboardComponent_Conditional_12_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 49);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onViewModeChanged("timeline")); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onViewModeChanged("timeline")); });
     i0.ɵɵelement(1, "i", 50);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵclassProp("active", ctx_r1.state.viewMode === "timeline");
 } }
-function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
+function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r14 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 62);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.closeDateFieldDropdown()); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.closeDateFieldDropdown()); });
     i0.ɵɵelementEnd();
 } }
-function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "i", 63);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵclassProp("rotated", ctx_r1.isDateFieldDropdownOpen);
 } }
-function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_8_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_8_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "i", 68);
 } }
-function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_8_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
+function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_8_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r15 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 65);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_8_For_2_Template_div_click_0_listener() { const field_r18 = i0.ɵɵrestoreView(_r17).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.setTimelineDateField(field_r18.name)); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_8_For_2_Template_div_click_0_listener() { const field_r16 = i0.ɵɵrestoreView(_r15).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.setTimelineDateField(field_r16.name)); });
     i0.ɵɵelement(1, "i", 66);
     i0.ɵɵelementStart(2, "span", 67);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_8_For_2_Conditional_4_Template, 1, 0, "i", 68);
+    i0.ɵɵconditionalCreate(4, DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_8_For_2_Conditional_4_Template, 1, 0, "i", 68);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const field_r18 = ctx.$implicit;
+    const field_r16 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵclassProp("selected", field_r18.name === ctx_r1.effectiveTimelineDateField);
+    i0.ɵɵclassProp("selected", field_r16.name === ctx_r1.effectiveTimelineDateField);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(field_r18.displayName);
+    i0.ɵɵtextInterpolate(field_r16.displayName);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(field_r18.name === ctx_r1.effectiveTimelineDateField ? 4 : -1);
+    i0.ɵɵconditional(field_r16.name === ctx_r1.effectiveTimelineDateField ? 4 : -1);
 } }
-function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 58);
-    i0.ɵɵrepeaterCreate(1, DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_8_For_2_Template, 5, 4, "div", 64, _forTrack1);
+    i0.ɵɵrepeaterCreate(1, DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_8_For_2_Template, 5, 4, "div", 64, _forTrack1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.availableDateFields);
 } }
-function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
+function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    const _r13 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 51);
-    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_1_Template, 1, 0, "div", 52);
+    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_1_Template, 1, 0, "div", 52);
     i0.ɵɵelementStart(2, "div", 53)(3, "button", 54);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleDateFieldDropdown()); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleDateFieldDropdown()); });
     i0.ɵɵelement(4, "i", 55);
     i0.ɵɵelementStart(5, "span", 56);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(7, DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_7_Template, 1, 2, "i", 57);
+    i0.ɵɵconditionalCreate(7, DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_7_Template, 1, 2, "i", 57);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(8, DataExplorerDashboardComponent_Conditional_12_Conditional_6_Conditional_8_Template, 3, 0, "div", 58);
+    i0.ɵɵconditionalCreate(8, DataExplorerDashboardComponent_Conditional_11_Conditional_6_Conditional_8_Template, 3, 0, "div", 58);
     i0.ɵɵelementEnd()();
     i0.ɵɵelementStart(9, "div", 59)(10, "button", 60);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleTimelineOrientation()); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleTimelineOrientation()); });
     i0.ɵɵelement(11, "i");
     i0.ɵɵelementEnd()();
     i0.ɵɵelementStart(12, "div", 61)(13, "button", 60);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleTimelineSortOrder()); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Conditional_6_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleTimelineSortOrder()); });
     i0.ɵɵelement(14, "i");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -316,19 +293,19 @@ function DataExplorerDashboardComponent_Conditional_12_Conditional_6_Template(rf
     i0.ɵɵadvance();
     i0.ɵɵclassMap(ctx_r1.state.timelineSortOrder === "desc" ? "fa-solid fa-arrow-down-wide-short" : "fa-solid fa-arrow-up-wide-short");
 } }
-function DataExplorerDashboardComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    const _r13 = i0.ɵɵgetCurrentView();
+function DataExplorerDashboardComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 43)(1, "button", 44);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewModeChanged("grid")); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewModeChanged("grid")); });
     i0.ɵɵelement(2, "i", 45);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(3, "button", 46);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewModeChanged("cards")); });
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_11_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewModeChanged("cards")); });
     i0.ɵɵelement(4, "i", 47);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(5, DataExplorerDashboardComponent_Conditional_12_Conditional_5_Template, 2, 2, "button", 48);
+    i0.ɵɵconditionalCreate(5, DataExplorerDashboardComponent_Conditional_11_Conditional_5_Template, 2, 2, "button", 48);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_12_Conditional_6_Template, 15, 13);
+    i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_11_Conditional_6_Template, 15, 13);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
@@ -340,376 +317,424 @@ function DataExplorerDashboardComponent_Conditional_12_Template(rf, ctx) { if (r
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.state.viewMode === "timeline" && ctx_r1.entityHasDateFields ? 6 : -1);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 69);
-    i0.ɵɵelement(1, "mj-loading", 70);
+function DataExplorerDashboardComponent_Conditional_12_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 71);
+    i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.recentRecords.length + ctx_r1.favoriteRecords.length);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Conditional_5_For_4_Template(rf, ctx) { if (rf & 1) {
-    const _r20 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 93);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Conditional_5_For_4_Template_button_click_0_listener() { const entity_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(7); return i0.ɵɵresetView(ctx_r1.setRecentRecordsEntityFilter(entity_r21.entityId)); });
-    i0.ɵɵelement(1, "i");
+function DataExplorerDashboardComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 69);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_12_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleQuickAccessPanel()); });
+    i0.ɵɵelement(1, "i", 70);
+    i0.ɵɵconditionalCreate(2, DataExplorerDashboardComponent_Conditional_12_Conditional_2_Template, 2, 1, "span", 71);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const entity_r21 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(7);
-    i0.ɵɵclassProp("active", ctx_r1.recentRecordsEntityFilter === entity_r21.entityId);
-    i0.ɵɵproperty("title", entity_r21.entityName);
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(entity_r21.icon);
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("active", ctx_r1.state.quickAccessPanelOpen);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.recentRecords.length + ctx_r1.favoriteRecords.length > 0 ? 2 : -1);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_14_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 72);
+    i0.ɵɵelement(1, "mj-loading", 73);
+    i0.ɵɵelementEnd();
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 87)(1, "button", 90);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Conditional_5_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.setRecentRecordsEntityFilter(null)); });
-    i0.ɵɵelement(2, "i", 91);
+    i0.ɵɵelementStart(0, "button", 105);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.entityFilterText = ""); });
+    i0.ɵɵelement(1, "i", 42);
     i0.ɵɵelementEnd();
-    i0.ɵɵrepeaterCreate(3, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Conditional_5_For_4_Template, 2, 5, "button", 92, _forTrack4);
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 80);
+    i0.ɵɵtext(1, "/");
     i0.ɵɵelementEnd();
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(6);
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵtextInterpolate1(" across ", ctx_r1.applicationCount, " applications ");
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 111);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const entity_r21 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵclassProp("active", ctx_r1.recentRecordsEntityFilter === null);
-    i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(ctx_r1.uniqueRecentRecordEntities);
+    i0.ɵɵtextInterpolate(entity_r21.Description);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_For_8_Template(rf, ctx) { if (rf & 1) {
-    const _r22 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 94);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_For_8_Template_div_click_0_listener() { const record_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.onRecentRecordClick(record_r23)); });
-    i0.ɵɵelementStart(1, "div", 95);
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 107);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_For_2_Template_div_click_0_listener() { const entity_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onEntitySelected(entity_r21)); });
+    i0.ɵɵelementStart(1, "div", 108);
     i0.ɵɵelement(2, "i");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 96)(4, "span", 97);
+    i0.ɵɵelementStart(3, "div", 109)(4, "span", 110);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "span", 98);
-    i0.ɵɵtext(7);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "span", 99);
-    i0.ɵɵtext(9);
+    i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_For_2_Conditional_6_Template, 2, 1, "span", 111);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "button", 112);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_For_2_Template_button_click_7_listener($event) { const entity_r21 = i0.ɵɵrestoreView(_r20).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.toggleEntityFavorite(entity_r21, $event)); });
+    i0.ɵɵelement(8, "i");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const record_r23 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(6);
-    i0.ɵɵproperty("title", record_r23.entityName + " - " + record_r23.recordId);
+    const entity_r21 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵproperty("title", entity_r21.Description || entity_r21.DisplayNameOrName);
     i0.ɵɵadvance(2);
-    i0.ɵɵclassMap(ctx_r1.getEntityIconById(record_r23.entityId));
+    i0.ɵɵclassMap(ctx_r1.getEntityIcon(entity_r21));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(record_r23.recordName || record_r23.recordId);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(record_r23.entityName);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.formatRelativeTime(record_r23.latestAt));
+    i0.ɵɵtextInterpolate(entity_r21.DisplayNameOrName);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(entity_r21.Description ? 6 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("favorited", ctx_r1.isEntityFavorited(entity_r21));
+    i0.ɵɵproperty("title", ctx_r1.isEntityFavorited(entity_r21) ? "Remove from favorites" : "Add to favorites");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.isEntityFavorited(entity_r21) ? "fa-solid fa-star" : "fa-regular fa-star");
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 72)(1, "div", 85);
-    i0.ɵɵelement(2, "i", 86);
-    i0.ɵɵelementStart(3, "h3", 76);
-    i0.ɵɵtext(4, "Recent Records");
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 87);
+    i0.ɵɵrepeaterCreate(1, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_For_2_Template, 9, 10, "div", 106, _forTrack3);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(5, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Conditional_5_Template, 5, 2, "div", 87);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.flatFilteredEntities);
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_For_3_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 111);
+    i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 88);
-    i0.ɵɵrepeaterCreate(7, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_For_8_Template, 10, 6, "div", 89, _forTrack3);
-    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵadvance(5);
-    i0.ɵɵconditional(ctx_r1.showRecentRecordsEntityFilter ? 5 : -1);
-    i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(ctx_r1.filteredRecentRecords);
+    const entity_r25 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(entity_r25.Description);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_2_For_7_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_For_3_Template(rf, ctx) { if (rf & 1) {
     const _r24 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 94);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_2_For_7_Template_div_click_0_listener() { const record_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.onFavoriteRecordClick(record_r25)); });
-    i0.ɵɵelementStart(1, "div", 95);
+    i0.ɵɵelementStart(0, "div", 107);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_For_3_Template_div_click_0_listener() { const entity_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.onEntitySelected(entity_r25)); });
+    i0.ɵɵelementStart(1, "div", 108);
     i0.ɵɵelement(2, "i");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 96)(4, "span", 97);
+    i0.ɵɵelementStart(3, "div", 109)(4, "span", 110);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "span", 98);
-    i0.ɵɵtext(7);
-    i0.ɵɵelementEnd()()();
+    i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_For_3_Conditional_6_Template, 2, 1, "span", 111);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "button", 112);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_For_3_Template_button_click_7_listener($event) { const entity_r25 = i0.ɵɵrestoreView(_r24).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.toggleEntityFavorite(entity_r25, $event)); });
+    i0.ɵɵelement(8, "i");
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const record_r25 = ctx.$implicit;
+    const entity_r25 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(6);
-    i0.ɵɵproperty("title", record_r25.entityName + " - " + record_r25.recordId);
+    i0.ɵɵproperty("title", entity_r25.Description || entity_r25.DisplayNameOrName);
     i0.ɵɵadvance(2);
-    i0.ɵɵclassMap(ctx_r1.getEntityIconById(record_r25.entityId));
+    i0.ɵɵclassMap(ctx_r1.getEntityIcon(entity_r25));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(record_r25.recordName || record_r25.recordId);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(record_r25.entityName);
+    i0.ɵɵtextInterpolate(entity_r25.DisplayNameOrName);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(entity_r25.Description ? 6 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("favorited", ctx_r1.isEntityFavorited(entity_r25));
+    i0.ɵɵproperty("title", ctx_r1.isEntityFavorited(entity_r25) ? "Remove from favorites" : "Add to favorites");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.isEntityFavorited(entity_r25) ? "fa-solid fa-star" : "fa-regular fa-star");
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 72)(1, "div", 85);
-    i0.ɵɵelement(2, "i", 100);
-    i0.ɵɵelementStart(3, "h3", 76);
-    i0.ɵɵtext(4, "Favorite Records");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 88);
-    i0.ɵɵrepeaterCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_2_For_7_Template, 8, 5, "div", 89, _forTrack5);
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 119)(1, "div", 87);
+    i0.ɵɵrepeaterCreate(2, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_For_3_Template, 9, 10, "div", 106, _forTrack3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵadvance(6);
-    i0.ɵɵrepeater(ctx_r1.favoriteRecords);
+    const group_r23 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵrepeater(group_r23.entities);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 84);
-    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_1_Template, 9, 1, "div", 72);
-    i0.ɵɵconditionalCreate(2, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Conditional_2_Template, 8, 0, "div", 72);
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 113)(1, "div", 114);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Template_div_click_1_listener() { const group_r23 = i0.ɵɵrestoreView(_r22).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.toggleAppGroup(group_r23.applicationId)); });
+    i0.ɵɵelementStart(2, "div", 115);
+    i0.ɵɵelement(3, "i");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "span", 116);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "span", 117);
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(8, "i", 118);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(9, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Conditional_9_Template, 4, 0, "div", 119);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(4);
+    const group_r23 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵstyleProp("background", group_r23.applicationColor ? group_r23.applicationColor + "15" : null)("color", group_r23.applicationColor || null);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.recentRecords.length > 0 ? 1 : -1);
+    i0.ɵɵclassMap(group_r23.applicationIcon || "fa-solid fa-folder");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(group_r23.applicationName);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(group_r23.entities.length);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("expanded", group_r23.isExpanded);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.favoriteRecords.length > 0 ? 2 : -1);
+    i0.ɵɵconditional(group_r23.isExpanded ? 9 : -1);
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵrepeaterCreate(0, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_For_1_Template, 10, 11, "div", 113, _forTrack5);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵrepeater(ctx_r1.filteredAppEntityGroups);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_1_For_7_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_21_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 88);
+    i0.ɵɵelement(1, "i", 120);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("No entities match \"", ctx_r1.entityFilterText, "\"");
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_22_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 89);
+    i0.ɵɵelement(1, "i", 121);
+    i0.ɵɵelementStart(2, "h3");
+    i0.ɵɵtext(3, "No Entities Available");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p");
+    i0.ɵɵtext(5, "There are no entities configured for this application.");
+    i0.ɵɵelementEnd()();
+} }
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_40_Template(rf, ctx) { if (rf & 1) {
     const _r26 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 104);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_1_For_7_Template_div_click_0_listener() { const entity_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.onEntitySelected(entity_r27)); });
-    i0.ɵɵelementStart(1, "div", 105);
+    i0.ɵɵelementStart(0, "div", 122);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_40_Template_div_click_0_listener() { const record_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onRecentRecordClick(record_r27)); });
+    i0.ɵɵelementStart(1, "div", 123);
     i0.ɵɵelement(2, "i");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 106)(4, "span", 107);
+    i0.ɵɵelementStart(3, "div", 124)(4, "div", 125);
     i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 126);
+    i0.ɵɵtext(7);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "button", 108);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_1_For_7_Template_button_click_6_listener($event) { const entity_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.toggleEntityFavorite(entity_r27, $event)); });
-    i0.ɵɵelement(7, "i");
+    i0.ɵɵelementStart(8, "span", 127);
+    i0.ɵɵtext(9);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const entity_r27 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(6);
-    i0.ɵɵproperty("title", entity_r27.Description || entity_r27.DisplayNameOrName);
+    const record_r27 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(2);
-    i0.ɵɵclassMap(ctx_r1.getEntityIcon(entity_r27));
+    i0.ɵɵclassMap(ctx_r1.getEntityIconById(record_r27.entityId));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(entity_r27.DisplayNameOrName);
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("favorited", ctx_r1.isEntityFavorited(entity_r27));
-    i0.ɵɵproperty("title", ctx_r1.isEntityFavorited(entity_r27) ? "Remove from favorites" : "Add to favorites");
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(ctx_r1.isEntityFavorited(entity_r27) ? "fa-solid fa-star" : "fa-regular fa-star");
+    i0.ɵɵtextInterpolate(record_r27.recordName || record_r27.recordId);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(record_r27.entityName);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.formatRelativeTime(record_r27.latestAt));
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 72)(1, "div", 85);
-    i0.ɵɵelement(2, "i", 101);
-    i0.ɵɵelementStart(3, "h3", 76);
-    i0.ɵɵtext(4, "Recent Entities");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 102);
-    i0.ɵɵrepeaterCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_1_For_7_Template, 8, 9, "div", 103, _forTrack2);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵadvance(6);
-    i0.ɵɵrepeater(ctx_r1.recentEntities);
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_41_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 102);
+    i0.ɵɵtext(1, "No recent records");
+    i0.ɵɵelementEnd();
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_2_For_7_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_52_Template(rf, ctx) { if (rf & 1) {
     const _r28 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 104);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_2_For_7_Template_div_click_0_listener() { const entity_r29 = i0.ɵɵrestoreView(_r28).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.onEntitySelected(entity_r29)); });
-    i0.ɵɵelementStart(1, "div", 105);
+    i0.ɵɵelementStart(0, "div", 122);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_52_Template_div_click_0_listener() { const entity_r29 = i0.ɵɵrestoreView(_r28).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onEntitySelected(entity_r29)); });
+    i0.ɵɵelementStart(1, "div", 123);
     i0.ɵɵelement(2, "i");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 106)(4, "span", 107);
+    i0.ɵɵelementStart(3, "div", 124)(4, "div", 125);
     i0.ɵɵtext(5);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "button", 109);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_2_For_7_Template_button_click_6_listener($event) { const entity_r29 = i0.ɵɵrestoreView(_r28).$implicit; const ctx_r1 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r1.toggleEntityFavorite(entity_r29, $event)); });
-    i0.ɵɵelement(7, "i", 110);
-    i0.ɵɵelementEnd()();
+    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const entity_r29 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(6);
-    i0.ɵɵproperty("title", entity_r29.Description || entity_r29.DisplayNameOrName);
+    const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(2);
     i0.ɵɵclassMap(ctx_r1.getEntityIcon(entity_r29));
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(entity_r29.DisplayNameOrName);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 72)(1, "div", 85);
-    i0.ɵɵelement(2, "i", 100);
-    i0.ɵɵelementStart(3, "h3", 76);
-    i0.ɵɵtext(4, "Favorite Entities");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 102);
-    i0.ɵɵrepeaterCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_2_For_7_Template, 8, 4, "div", 103, _forTrack2);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵadvance(6);
-    i0.ɵɵrepeater(ctx_r1.favoriteEntities);
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 84);
-    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_1_Template, 8, 0, "div", 72);
-    i0.ɵɵconditionalCreate(2, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Conditional_2_Template, 8, 0, "div", 72);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.recentEntities.length > 0 ? 1 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.favoriteEntities.length > 0 ? 2 : -1);
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 83);
-    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_1_Template, 3, 2, "div", 84);
-    i0.ɵɵconditionalCreate(2, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Conditional_2_Template, 3, 2, "div", 84);
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_53_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 102);
+    i0.ɵɵtext(1, "No recent entities");
     i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵclassProp("single-column", !ctx_r1.hasRecordsColumnContent || !ctx_r1.hasEntitiesColumnContent);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.hasRecordsColumnContent ? 1 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.hasEntitiesColumnContent ? 2 : -1);
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtext(0, " All Entities ");
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtext(0, " Common Entities ");
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 77);
-    i0.ɵɵtext(1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1("", ctx_r1.filteredEntities.length, " matching");
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_64_Template(rf, ctx) { if (rf & 1) {
     const _r30 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 78)(1, "button", 60);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_9_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r30); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleShowAllEntities()); });
-    i0.ɵɵtext(2, " Common ");
+    i0.ɵɵelementStart(0, "div", 122);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_64_Template_div_click_0_listener() { const record_r31 = i0.ɵɵrestoreView(_r30).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onFavoriteRecordClick(record_r31)); });
+    i0.ɵɵelementStart(1, "div", 123);
+    i0.ɵɵelement(2, "i");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 60);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_9_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r30); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleShowAllEntities()); });
-    i0.ɵɵtext(4, " All ");
-    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(3, "div", 124)(4, "div", 125);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 126);
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd()()();
 } if (rf & 2) {
+    const record_r31 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("active", !ctx_r1.state.showAllEntities);
-    i0.ɵɵproperty("title", i0.ɵɵinterpolate1("Show common entities (", ctx_r1.commonEntitiesCount, ")"));
     i0.ɵɵadvance(2);
-    i0.ɵɵclassProp("active", ctx_r1.state.showAllEntities);
-    i0.ɵɵproperty("title", i0.ɵɵinterpolate1("Show all entities (", ctx_r1.allEntitiesCount, ")"));
+    i0.ɵɵclassMap(ctx_r1.getEntityIconById(record_r31.entityId));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(record_r31.recordName || record_r31.recordId);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(record_r31.entityName);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_12_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 115);
-    i0.ɵɵtext(1);
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_65_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 102);
+    i0.ɵɵtext(1, "No favorite records");
     i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const entity_r32 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(entity_r32.Description);
 } }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_12_Template(rf, ctx) { if (rf & 1) {
-    const _r31 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 111);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_12_Template_div_click_0_listener() { const entity_r32 = i0.ɵɵrestoreView(_r31).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onEntitySelected(entity_r32)); });
-    i0.ɵɵelementStart(1, "div", 112);
-    i0.ɵɵelement(2, "i");
+function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 74)(1, "div", 75)(2, "div", 76);
+    i0.ɵɵelement(3, "i", 77);
+    i0.ɵɵelementStart(4, "input", 78, 0);
+    i0.ɵɵtwoWayListener("ngModelChange", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template_input_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.entityFilterText, $event) || (ctx_r1.entityFilterText = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 113)(4, "h4", 114);
-    i0.ɵɵtext(5);
+    i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_6_Template, 2, 0, "button", 79)(7, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_7_Template, 2, 0, "span", 80);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_12_Conditional_6_Template, 2, 1, "p", 115);
+    i0.ɵɵelementStart(8, "div", 81)(9, "span", 82);
+    i0.ɵɵtext(10);
+    i0.ɵɵconditionalCreate(11, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_11_Template, 1, 1);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "button", 108);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_12_Template_button_click_7_listener($event) { const entity_r32 = i0.ɵɵrestoreView(_r31).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleEntityFavorite(entity_r32, $event)); });
-    i0.ɵɵelement(8, "i");
+    i0.ɵɵelementStart(12, "div", 83)(13, "button", 84);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.setHomeViewMode("all")); });
+    i0.ɵɵtext(14, " All Entities ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "button", 84);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template_button_click_15_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.setHomeViewMode("favorites")); });
+    i0.ɵɵelement(16, "i", 85);
+    i0.ɵɵtext(17, " My Favorites ");
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵelementStart(18, "div", 86);
+    i0.ɵɵconditionalCreate(19, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_19_Template, 3, 0, "div", 87)(20, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_20_Template, 2, 0);
+    i0.ɵɵconditionalCreate(21, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_21_Template, 4, 1, "div", 88);
+    i0.ɵɵconditionalCreate(22, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_22_Template, 6, 0, "div", 89);
     i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const entity_r32 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵproperty("title", entity_r32.Description || entity_r32.DisplayNameOrName);
-    i0.ɵɵadvance(2);
-    i0.ɵɵclassMap(ctx_r1.getEntityIcon(entity_r32));
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(entity_r32.DisplayNameOrName);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(entity_r32.Description ? 6 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("favorited", ctx_r1.isEntityFavorited(entity_r32));
-    i0.ɵɵproperty("title", ctx_r1.isEntityFavorited(entity_r32) ? "Remove from favorites" : "Add to favorites");
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(ctx_r1.isEntityFavorited(entity_r32) ? "fa-solid fa-star" : "fa-regular fa-star");
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 81);
-    i0.ɵɵelement(1, "i", 116);
-    i0.ɵɵelementStart(2, "h3");
-    i0.ɵɵtext(3, "No Matching Entities");
+    i0.ɵɵelementStart(23, "div", 90)(24, "div", 91)(25, "h3");
+    i0.ɵɵtext(26, "Quick Access");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "p");
-    i0.ɵɵtext(5);
+    i0.ɵɵelementStart(27, "button", 92);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template_button_click_27_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleQuickAccessPanel()); });
+    i0.ɵɵelement(28, "i", 93);
     i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵadvance(5);
-    i0.ɵɵtextInterpolate1("No entities match \"", ctx_r1.entityFilterText, "\"");
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 82);
-    i0.ɵɵelement(1, "i", 117);
-    i0.ɵɵelementStart(2, "h3");
-    i0.ɵɵtext(3, "No Entities Available");
+    i0.ɵɵelementStart(29, "div", 94)(30, "div", 95)(31, "div", 96);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template_div_click_31_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleQuickAccessSection("recentRecords")); });
+    i0.ɵɵelement(32, "i", 97);
+    i0.ɵɵelementStart(33, "span");
+    i0.ɵɵtext(34, "Recent Records");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "p");
-    i0.ɵɵtext(5, "There are no entities configured for this application.");
+    i0.ɵɵelementStart(35, "span", 98);
+    i0.ɵɵtext(36);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(37, "i", 99);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(38, "div", 100);
+    i0.ɵɵrepeaterCreate(39, DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_40_Template, 10, 5, "div", 101, _forTrack2);
+    i0.ɵɵconditionalCreate(41, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_41_Template, 2, 0, "div", 102);
     i0.ɵɵelementEnd()();
-} }
-function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_0_Template, 3, 4, "div", 71);
-    i0.ɵɵelementStart(1, "div", 72)(2, "div", 73)(3, "div", 74);
-    i0.ɵɵelement(4, "i", 75);
-    i0.ɵɵelementStart(5, "h3", 76);
-    i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_6_Template, 1, 0)(7, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_7_Template, 1, 0);
+    i0.ɵɵelementStart(42, "div", 95)(43, "div", 96);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template_div_click_43_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleQuickAccessSection("recentEntities")); });
+    i0.ɵɵelement(44, "i", 103);
+    i0.ɵɵelementStart(45, "span");
+    i0.ɵɵtext(46, "Recent Entities");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(47, "span", 98);
+    i0.ɵɵtext(48);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(8, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_8_Template, 2, 1, "span", 77);
+    i0.ɵɵelement(49, "i", 99);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(9, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_9_Template, 5, 8, "div", 78);
+    i0.ɵɵelementStart(50, "div", 100);
+    i0.ɵɵrepeaterCreate(51, DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_52_Template, 6, 3, "div", 101, _forTrack3);
+    i0.ɵɵconditionalCreate(53, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_53_Template, 2, 0, "div", 102);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(54, "div", 95)(55, "div", 96);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template_div_click_55_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleQuickAccessSection("favoriteRecords")); });
+    i0.ɵɵelement(56, "i", 104);
+    i0.ɵɵelementStart(57, "span");
+    i0.ɵɵtext(58, "Favorite Records");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "div", 79);
-    i0.ɵɵrepeaterCreate(11, DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_12_Template, 9, 10, "div", 80, _forTrack2);
+    i0.ɵɵelementStart(59, "span", 98);
+    i0.ɵɵtext(60);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(13, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_13_Template, 6, 1, "div", 81);
-    i0.ɵɵconditionalCreate(14, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_14_Template, 6, 0, "div", 82);
+    i0.ɵɵelement(61, "i", 99);
     i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(62, "div", 100);
+    i0.ɵɵrepeaterCreate(63, DataExplorerDashboardComponent_Conditional_14_Conditional_2_For_64_Template, 8, 4, "div", 101, _forTrack4);
+    i0.ɵɵconditionalCreate(65, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Conditional_65_Template, 2, 0, "div", 102);
+    i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵconditional(ctx_r1.hasTopSectionContent ? 0 : -1);
-    i0.ɵɵadvance(6);
-    i0.ɵɵconditional(ctx_r1.state.showAllEntities || !ctx_r1.showCommonAllToggle ? 6 : 7);
+    i0.ɵɵclassProp("panel-open", ctx_r1.state.quickAccessPanelOpen);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.entityFilterText);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.entityFilterText && ctx_r1.filteredEntities.length !== ctx_r1.entities.length ? 8 : -1);
+    i0.ɵɵconditional(ctx_r1.entityFilterText ? 6 : 7);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.filteredEntityCount, " entities ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.showCommonAllToggle ? 9 : -1);
+    i0.ɵɵconditional(ctx_r1.applicationCount > 0 ? 11 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.state.homeViewMode === "all");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.state.homeViewMode === "favorites");
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional((ctx_r1.entityFilter == null ? null : ctx_r1.entityFilter.applicationId) ? 19 : 20);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.filteredEntityCount === 0 && ctx_r1.entities.length > 0 ? 21 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.entities.length === 0 ? 22 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("open", ctx_r1.state.quickAccessPanelOpen);
+    i0.ɵɵadvance(7);
+    i0.ɵɵclassProp("collapsed", !ctx_r1.isQuickAccessSectionExpanded("recentRecords"));
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(ctx_r1.quickAccessRecentRecords.length);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r1.quickAccessRecentRecords);
     i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(ctx_r1.filteredEntities);
+    i0.ɵɵconditional(ctx_r1.quickAccessRecentRecords.length === 0 ? 41 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("collapsed", !ctx_r1.isQuickAccessSectionExpanded("recentEntities"));
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(ctx_r1.quickAccessRecentEntities.length);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r1.quickAccessRecentEntities);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.filteredEntities.length === 0 && ctx_r1.entities.length > 0 ? 13 : -1);
+    i0.ɵɵconditional(ctx_r1.quickAccessRecentEntities.length === 0 ? 53 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.entities.length === 0 ? 14 : -1);
+    i0.ɵɵclassProp("collapsed", !ctx_r1.isQuickAccessSectionExpanded("favoriteRecords"));
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(ctx_r1.quickAccessFavoriteRecords.length);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r1.quickAccessFavoriteRecords);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.quickAccessFavoriteRecords.length === 0 ? 65 : -1);
 } }
 function DataExplorerDashboardComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 12);
-    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_14_Conditional_1_Template, 2, 0, "div", 69)(2, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template, 15, 6);
+    i0.ɵɵelementStart(0, "div", 13);
+    i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_14_Conditional_1_Template, 2, 0, "div", 72)(2, DataExplorerDashboardComponent_Conditional_14_Conditional_2_Template, 66, 27);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -717,24 +742,24 @@ function DataExplorerDashboardComponent_Conditional_14_Template(rf, ctx) { if (r
     i0.ɵɵconditional(ctx_r1.isLoadingEntities ? 1 : 2);
 } }
 function DataExplorerDashboardComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
-    const _r33 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-entity-viewer", 118, 1);
-    i0.ɵɵlistener("viewModeChange", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_viewModeChange_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewModeChanged($event)); })("filterTextChange", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_filterTextChange_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFilterTextChanged($event)); })("recordSelected", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_recordSelected_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewerRecordSelected($event)); })("recordOpened", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_recordOpened_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewerRecordOpened($event)); })("dataLoaded", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_dataLoaded_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDataLoaded($event)); })("filteredCountChanged", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_filteredCountChanged_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFilteredCountChanged($event)); })("gridStateChanged", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_gridStateChanged_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onGridStateChanged($event)); })("selectionChanged", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_selectionChanged_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSelectionChanged($event)); })("addToListRequested", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_addToListRequested_0_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onAddToListRequested($event)); });
+    const _r32 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-entity-viewer", 128, 1);
+    i0.ɵɵlistener("viewModeChange", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_viewModeChange_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewModeChanged($event)); })("filterTextChange", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_filterTextChange_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFilterTextChanged($event)); })("recordSelected", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_recordSelected_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewerRecordSelected($event)); })("recordOpened", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_recordOpened_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onViewerRecordOpened($event)); })("dataLoaded", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_dataLoaded_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDataLoaded($event)); })("filteredCountChanged", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_filteredCountChanged_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onFilteredCountChanged($event)); })("gridStateChanged", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_gridStateChanged_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onGridStateChanged($event)); })("selectionChanged", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_selectionChanged_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSelectionChanged($event)); })("addToListRequested", function DataExplorerDashboardComponent_Conditional_15_Template_mj_entity_viewer_addToListRequested_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onAddToListRequested($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("entity", ctx_r1.selectedEntity)("viewEntity", ctx_r1.selectedViewEntity)("viewMode", ctx_r1.state.viewMode)("filterText", ctx_r1.debouncedFilterText)("selectedRecordId", ctx_r1.state.selectedRecordId)("config", ctx_r1.viewerConfig)("gridState", ctx_r1.currentGridState)("timelineConfig", ctx_r1.currentTimelineConfig)("gridSelectionMode", "checkbox")("showGridToolbar", false)("showAddToListButton", false);
 } }
 function DataExplorerDashboardComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
-    const _r34 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 119)(1, "div", 120)(2, "button", 121);
-    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_16_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openListManagementDialog()); });
-    i0.ɵɵelement(3, "i", 34);
+    const _r33 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 129)(1, "div", 130)(2, "button", 131);
+    i0.ɵɵlistener("click", function DataExplorerDashboardComponent_Conditional_16_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openListManagementDialog()); });
+    i0.ɵɵelement(3, "i", 35);
     i0.ɵɵelementStart(4, "span");
     i0.ɵɵtext(5, "Add to List");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(6, "mj-entity-record-detail-panel", 122);
-    i0.ɵɵlistener("close", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_close_6_listener() { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDetailPanelClosed()); })("openRecord", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_openRecord_6_listener($event) { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenRecord($event)); })("navigateToRelated", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_navigateToRelated_6_listener($event) { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onNavigateToRelated($event)); })("openRelatedRecord", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_openRelatedRecord_6_listener($event) { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenRelatedRecord($event)); })("openForeignKeyRecord", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_openForeignKeyRecord_6_listener($event) { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenForeignKeyRecord($event)); });
+    i0.ɵɵelementStart(6, "mj-entity-record-detail-panel", 132);
+    i0.ɵɵlistener("close", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_close_6_listener() { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDetailPanelClosed()); })("openRecord", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_openRecord_6_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenRecord($event)); })("navigateToRelated", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_navigateToRelated_6_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onNavigateToRelated($event)); })("openRelatedRecord", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_openRelatedRecord_6_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenRelatedRecord($event)); })("openForeignKeyRecord", function DataExplorerDashboardComponent_Conditional_16_Template_mj_entity_record_detail_panel_openForeignKeyRecord_6_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onOpenForeignKeyRecord($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -743,9 +768,9 @@ function DataExplorerDashboardComponent_Conditional_16_Template(rf, ctx) { if (r
     i0.ɵɵproperty("entity", ctx_r1.detailPanelEntity)("record", ctx_r1.selectedRecord);
 } }
 function DataExplorerDashboardComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
-    const _r35 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-list-management-dialog", 123);
-    i0.ɵɵlistener("complete", function DataExplorerDashboardComponent_Conditional_20_Template_mj_list_management_dialog_complete_0_listener($event) { i0.ɵɵrestoreView(_r35); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onListManagementComplete($event)); })("cancel", function DataExplorerDashboardComponent_Conditional_20_Template_mj_list_management_dialog_cancel_0_listener() { i0.ɵɵrestoreView(_r35); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onListManagementCancel()); });
+    const _r34 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-list-management-dialog", 133);
+    i0.ɵɵlistener("complete", function DataExplorerDashboardComponent_Conditional_20_Template_mj_list_management_dialog_complete_0_listener($event) { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onListManagementComplete($event)); })("cancel", function DataExplorerDashboardComponent_Conditional_20_Template_mj_list_management_dialog_cancel_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onListManagementCancel()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -802,6 +827,8 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
     allEntities = [];
     // Filtered entities based on entityFilter
     entities = [];
+    // Application entity groups for the home view (Concept D)
+    appEntityGroups = [];
     // Entity IDs for the current application (loaded when applicationId filter is set)
     applicationEntityIds = new Set();
     selectedEntity = null;
@@ -862,36 +889,72 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
     async GetResourceDisplayName(data) {
         return "Data Explorer";
     }
+    // ========================================
+    // Concept D: Application Groups + Search-First
+    // ========================================
     /**
-     * Filtered entities based on entityFilterText (for home screen)
-     * Excludes entities shown in recent or favorites sections
-     * Applies Common/All toggle filtering
+     * Get app entity groups filtered by current entityFilterText and homeViewMode.
+     * When searching, auto-expands groups that contain matches.
      */
-    get filteredEntities() {
-        // Get IDs of entities in recent and favorites to exclude
-        const recentEntityIds = new Set(this.state.recentEntityAccesses.map(r => r.entityId));
-        const favoriteEntityIds = new Set(this.state.favoriteEntities.map(f => f.entityId));
-        let result = this.entities.filter(e => {
-            // Exclude entities shown in recent or favorites sections
-            if (recentEntityIds.has(e.ID) || favoriteEntityIds.has(e.ID)) {
-                return false;
-            }
-            // Apply Common/All toggle filter (only if we have DefaultForNewUser info)
-            if (!this.state.showAllEntities && this.stateService.DefaultEntityIds.size > 0) {
-                if (!this.stateService.DefaultEntityIds.has(e.ID)) {
-                    return false;
-                }
-            }
-            return true;
-        });
-        // Apply text filter
-        if (this.entityFilterText && this.entityFilterText.trim() !== '') {
-            const filter = this.entityFilterText.toLowerCase().trim();
-            result = result.filter(e => e.Name.toLowerCase().includes(filter) ||
-                (e.Description && e.Description.toLowerCase().includes(filter)));
+    get filteredAppEntityGroups() {
+        const filterText = this.entityFilterText.toLowerCase().trim();
+        const showFavoritesOnly = this.state.homeViewMode === 'favorites';
+        return this.appEntityGroups
+            .map(group => this.filterGroupEntities(group, filterText, showFavoritesOnly))
+            .filter(group => group.entities.length > 0);
+    }
+    /**
+     * Filter a single group's entities by text and favorites mode.
+     * Returns a new group with filtered entities and auto-expansion when searching.
+     */
+    filterGroupEntities(group, filterText, showFavoritesOnly) {
+        let filtered = group.entities;
+        if (showFavoritesOnly) {
+            filtered = filtered.filter(e => this.isEntityFavorited(e));
+        }
+        if (filterText) {
+            filtered = filtered.filter(e => e.Name.toLowerCase().includes(filterText) ||
+                e.DisplayNameOrName.toLowerCase().includes(filterText) ||
+                (e.Description && e.Description.toLowerCase().includes(filterText)));
+        }
+        return {
+            ...group,
+            entities: filtered,
+            isExpanded: filterText ? true : group.isExpanded
+        };
+    }
+    /**
+     * Get a flat filtered entity list for single-application mode.
+     * Used when entityFilter.applicationId is set, bypassing app grouping.
+     */
+    get flatFilteredEntities() {
+        let result = this.entities;
+        if (this.state.homeViewMode === 'favorites') {
+            result = result.filter(e => this.isEntityFavorited(e));
+        }
+        const filterText = this.entityFilterText.toLowerCase().trim();
+        if (filterText) {
+            result = result.filter(e => e.Name.toLowerCase().includes(filterText) ||
+                e.DisplayNameOrName.toLowerCase().includes(filterText) ||
+                (e.Description && e.Description.toLowerCase().includes(filterText)));
         }
         return result;
     }
+    /**
+     * Total count of entities matching current filters (across all groups or flat list)
+     */
+    get filteredEntityCount() {
+        if (this.entityFilter?.applicationId) {
+            return this.flatFilteredEntities.length;
+        }
+        return this.filteredAppEntityGroups.reduce((sum, g) => sum + g.entities.length, 0);
+    }
+    /**
+     * Count of applications that have at least one visible entity
+     */
+    get applicationCount() {
+        return this.appEntityGroups.filter(g => g.entities.length > 0).length;
+    }
     /**
      * Get recent entities for home screen display (max 5)
      */
@@ -910,45 +973,28 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
             .filter((e) => e !== undefined);
     }
     /**
-     * Check if we should show the Common/All toggle
-     * Only show if we have DefaultForNewUser information
+     * Recent records limited to 3 for the quick access panel
      */
-    get showCommonAllToggle() {
-        return this.stateService.DefaultEntityIds.size > 0;
+    get quickAccessRecentRecords() {
+        return this.recentRecords.slice(0, 3);
     }
     /**
-     * Total count of all entities (for display)
+     * Recent entities limited to 3 for the quick access panel
      */
-    get allEntitiesCount() {
-        return this.entities.length;
+    get quickAccessRecentEntities() {
+        return this.recentEntities.slice(0, 3);
     }
     /**
-     * Count of common (DefaultForNewUser) entities
+     * Favorite records limited to 3 for the quick access panel
      */
-    get commonEntitiesCount() {
-        return this.entities.filter(e => this.stateService.DefaultEntityIds.has(e.ID)).length;
+    get quickAccessFavoriteRecords() {
+        return this.favoriteRecords.slice(0, 3);
     }
     /**
-     * Check if we have any content for the top two-column section
-     * (recent/favorite entities OR recent/favorite records)
+     * Check if a quick access section is expanded
      */
-    get hasTopSectionContent() {
-        return this.recentEntities.length > 0 ||
-            this.favoriteEntities.length > 0 ||
-            this.recentRecords.length > 0 ||
-            this.favoriteRecords.length > 0;
-    }
-    /**
-     * Check if the left column (records column) has content
-     */
-    get hasRecordsColumnContent() {
-        return this.recentRecords.length > 0 || this.favoriteRecords.length > 0;
-    }
-    /**
-     * Check if the right column (entities column) has content
-     */
-    get hasEntitiesColumnContent() {
-        return this.recentEntities.length > 0 || this.favoriteEntities.length > 0;
+    isQuickAccessSectionExpanded(sectionId) {
+        return this.state.quickAccessSections[sectionId] !== false;
     }
     /**
      * Get unique entities from recent records for the filter strip.
@@ -1369,6 +1415,8 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
             }
             // Apply filter to get the final entity list
             this.entities = this.applyEntityFilter(this.allEntities);
+            // Build application groups for the home view (Concept D)
+            this.buildAppEntityGroups();
             // Only restore entity from persisted state if there's no URL state
             // This prevents race conditions where persisted entity triggers data load
             // before URL state can override it
@@ -3004,6 +3052,110 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
     toggleShowAllEntities() {
         this.stateService.toggleShowAllEntities();
     }
+    // ========================================
+    // Concept D: Application Groups + Quick Access Panel
+    // ========================================
+    /**
+     * Toggle an application group's expanded/collapsed state
+     */
+    toggleAppGroup(groupId) {
+        this.stateService.toggleAppGroupExpanded(groupId);
+        // Update local cache for immediate UI response
+        const group = this.appEntityGroups.find(g => g.applicationId === groupId);
+        if (group) {
+            group.isExpanded = !group.isExpanded;
+        }
+        this.cdr.detectChanges();
+    }
+    /**
+     * Set the home view mode (all vs favorites)
+     */
+    setHomeViewMode(mode) {
+        this.stateService.setHomeViewMode(mode);
+    }
+    /**
+     * Toggle the quick access (right) panel
+     */
+    toggleQuickAccessPanel() {
+        this.stateService.toggleQuickAccessPanel();
+    }
+    /**
+     * Toggle a section in the quick access panel
+     */
+    toggleQuickAccessSection(sectionId) {
+        this.stateService.toggleQuickAccessSection(sectionId);
+    }
+    /**
+     * Build application entity groups from metadata.
+     * Groups entities by their first application membership.
+     * Entities not in any application go into "System & Other".
+     */
+    buildAppEntityGroups() {
+        // Skip grouping when filtered to a single application
+        if (this.entityFilter?.applicationId) {
+            this.appEntityGroups = [];
+            return;
+        }
+        const applications = this.metadata.Applications;
+        const entityIdToApp = new Map();
+        const groupMap = new Map();
+        // Build entity -> first application mapping
+        for (const app of applications) {
+            for (const appEntity of app.ApplicationEntities) {
+                if (!entityIdToApp.has(appEntity.EntityID)) {
+                    entityIdToApp.set(appEntity.EntityID, app);
+                }
+            }
+        }
+        // Assign each visible entity to its group
+        const ungroupedEntities = [];
+        for (const entity of this.entities) {
+            const app = entityIdToApp.get(entity.ID);
+            if (app) {
+                this.addEntityToGroup(groupMap, app, entity);
+            }
+            else {
+                ungroupedEntities.push(entity);
+            }
+        }
+        // Convert map to sorted array
+        const groups = Array.from(groupMap.values())
+            .sort((a, b) => a.applicationName.localeCompare(b.applicationName));
+        // Add "System & Other" catch-all if there are ungrouped entities
+        if (ungroupedEntities.length > 0) {
+            groups.push({
+                applicationId: '__system_other__',
+                applicationName: 'System & Other',
+                applicationIcon: 'fa-solid fa-ellipsis',
+                applicationColor: '#9e9e9e',
+                entities: ungroupedEntities,
+                isExpanded: this.state.expandedAppGroups.includes('__system_other__')
+            });
+        }
+        // Apply expanded state from persisted state
+        for (const group of groups) {
+            group.isExpanded = this.state.expandedAppGroups.includes(group.applicationId);
+        }
+        this.appEntityGroups = groups;
+    }
+    /**
+     * Add an entity to its application group in the map, creating the group if needed
+     */
+    addEntityToGroup(groupMap, app, entity) {
+        let group = groupMap.get(app.ID);
+        if (!group) {
+            group = {
+                applicationId: app.ID,
+                applicationName: app.Name,
+                applicationIcon: app.Icon || 'fa-solid fa-cube',
+                applicationColor: app.Color,
+                entities: [],
+                isExpanded: false
+            };
+            groupMap.set(app.ID, group);
+        }
+        group.entities.push(entity);
+    }
     /**
      * Handle clicking on a recent record from home screen.
      * Navigates to the entity and sets up pending selection to select the record
@@ -3264,41 +3416,42 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.viewConfigPanelRef = _t.first);
         } }, hostBindings: function DataExplorerDashboardComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("keydown", function DataExplorerDashboardComponent_keydown_HostBindingHandler($event) { return ctx.handleKeyboardShortcut($event); }, i0.ɵɵresolveDocument);
-        } }, inputs: { entityFilter: "entityFilter", deepLink: "deepLink", contextName: "contextName", contextIcon: "contextIcon" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 24, vars: 36, consts: [["filterInput", ""], ["entityViewer", ""], [1, "data-explorer-container"], [1, "navigation-panel", 3, "collapsed", "width"], [1, "content-area"], [1, "breadcrumb-bar"], [1, "content-header"], [1, "header-left"], [1, "header-center"], [1, "smart-filter-container"], [1, "header-right"], [1, "content-body"], [1, "entity-home-view"], [3, "entity", "viewEntity", "viewMode", "filterText", "selectedRecordId", "config", "gridState", "timelineConfig", "gridSelectionMode", "showGridToolbar", "showAddToListButton"], [1, "detail-panel", 3, "width"], [3, "close", "save", "saveDefaults", "delete", "duplicate", "openFilterDialogRequest", "entity", "viewEntity", "isOpen", "currentGridState", "externalFilterState", "isSaving", "DefaultSaveAsNew"], [3, "close", "apply", "isOpen", "fields", "filter", "disabled"], [3, "closed", "visible", "config"], [3, "config", "visible"], [3, "Save", "Close", "OpenAdvanced", "IsOpen", "ViewEntity", "EntityName", "Summary", "IsSaving", "DefaultSaveAsNew"], [3, "Duplicate", "Cancel", "IsOpen", "SourceViewName", "Summary"], [3, "Action", "Cancel", "IsOpen", "ViewName"], [1, "navigation-panel"], [3, "entitySelected", "toggleCollapse", "sectionToggled", "openRecord", "selectRecord", "expandAndFocus", "entities", "selectedEntityName", "favorites", "recentItems", "collapsed", "allowedEntityNames", "favoritesSectionExpanded", "recentSectionExpanded", "entitiesSectionExpanded", "viewsSectionExpanded"], [1, "breadcrumb-item", 3, "click", "title"], [1, "breadcrumb-icon", 3, "class"], [1, "breadcrumb-label"], [1, "fa-solid", "fa-chevron-right", "breadcrumb-separator"], [1, "breadcrumb-icon"], [1, "entity-icon"], [1, "entity-title"], [1, "record-count"], [3, "viewSelected", "saveViewRequested", "manageViewsRequested", "openInTabRequested", "configureViewRequested", "createNewRecordRequested", "exportRequested", "duplicateViewRequested", "quickSaveRequested", "revertRequested", "entity", "selectedViewId", "viewModified"], [1, "header-action-btn", 3, "click", "disabled", "title"], [1, "fa-solid", "fa-list-check"], [1, "selection-badge"], [1, "entity-icon", 3, "class"], [1, "fa-solid", "fa-search", "filter-icon"], ["type", "text", "placeholder", "Filter records... (press / to focus)", 1, "smart-filter-input", 3, "ngModelChange", "ngModel"], [1, "clear-filter-btn"], [1, "clear-filter-btn", 3, "click"], [1, "fa-solid", "fa-times"], ["type", "text", "placeholder", "Filter entities... (press / to focus)", 1, "smart-filter-input", 3, "ngModelChange", "ngModel"], [1, "view-mode-toggle"], ["title", "Grid View", 1, "toggle-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["title", "Cards View", 1, "toggle-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["title", "Timeline View", 1, "toggle-btn", 3, "active"], ["title", "Timeline View", 1, "toggle-btn", 3, "click"], [1, "fa-solid", "fa-timeline"], [1, "date-field-selector-container"], [1, "date-field-backdrop"], [1, "date-field-selector-wrapper"], [1, "date-field-selector-button", 3, "click", "disabled"], [1, "fa-solid", "fa-calendar-days", "date-field-icon"], [1, "date-field-name"], [1, "fa-solid", "fa-chevron-down", "date-field-arrow", 3, "rotated"], [1, "date-field-dropdown-panel"], [1, "timeline-orientation-toggle"], [1, "toggle-btn", 3, "click", "title"], [1, "timeline-sort-toggle"], [1, "date-field-backdrop", 3, "click"], [1, "fa-solid", "fa-chevron-down", "date-field-arrow"], [1, "date-field-dropdown-item", 3, "selected"], [1, "date-field-dropdown-item", 3, "click"], [1, "fa-regular", "fa-calendar", "item-icon"], [1, "item-name"], [1, "fa-solid", "fa-check", "selected-check"], [1, "loading-state"], ["text", "Loading entities...", "size", "medium"], [1, "home-two-column-layout", 3, "single-column"], [1, "home-section"], [1, "section-header-with-toggle"], [1, "section-header-left"], [1, "fa-solid", "fa-database", "section-icon"], [1, "section-title"], [1, "section-count"], [1, "inline-toggle"], [1, "entity-card-grid"], [1, "entity-card", 3, "title"], [1, "empty-state", "small"], [1, "empty-state"], [1, "home-two-column-layout"], [1, "home-column"], [1, "section-header"], [1, "fa-solid", "fa-history", "section-icon"], [1, "entity-filter-strip"], [1, "recent-records-list"], [1, "recent-record-item", 3, "title"], ["title", "Show all entities", 1, "entity-filter-btn", 3, "click"], [1, "fa-solid", "fa-layer-group"], [1, "entity-filter-btn", 3, "active", "title"], [1, "entity-filter-btn", 3, "click", "title"], [1, "recent-record-item", 3, "click", "title"], [1, "recent-record-icon"], [1, "recent-record-content"], [1, "recent-record-name"], [1, "recent-record-entity"], [1, "recent-record-time"], [1, "fa-solid", "fa-star", "section-icon"], [1, "fa-solid", "fa-clock", "section-icon"], [1, "entity-list"], [1, "entity-list-item", 3, "title"], [1, "entity-list-item", 3, "click", "title"], [1, "entity-list-icon"], [1, "entity-list-content"], [1, "entity-list-name"], [1, "favorite-btn", 3, "click", "title"], ["title", "Remove from favorites", 1, "favorite-btn", "favorited", 3, "click"], [1, "fa-solid", "fa-star"], [1, "entity-card", 3, "click", "title"], [1, "entity-card-icon"], [1, "entity-card-content"], [1, "entity-card-title"], [1, "entity-card-description"], [1, "fa-solid", "fa-search", "empty-icon"], [1, "fa-solid", "fa-database", "empty-icon"], [3, "viewModeChange", "filterTextChange", "recordSelected", "recordOpened", "dataLoaded", "filteredCountChanged", "gridStateChanged", "selectionChanged", "addToListRequested", "entity", "viewEntity", "viewMode", "filterText", "selectedRecordId", "config", "gridState", "timelineConfig", "gridSelectionMode", "showGridToolbar", "showAddToListButton"], [1, "detail-panel"], [1, "detail-panel-actions"], ["title", "Add to List", 1, "detail-action-btn", 3, "click"], [3, "close", "openRecord", "navigateToRelated", "openRelatedRecord", "openForeignKeyRecord", "entity", "record"], [3, "complete", "cancel", "config", "visible"]], template: function DataExplorerDashboardComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { entityFilter: "entityFilter", deepLink: "deepLink", contextName: "contextName", contextIcon: "contextIcon" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 24, vars: 37, consts: [["filterInput", ""], ["entityViewer", ""], [1, "data-explorer-container"], [1, "navigation-panel", 3, "collapsed", "width"], [1, "content-area"], [1, "breadcrumb-bar"], [1, "content-header"], [1, "header-left"], [1, "header-center"], [1, "smart-filter-container"], [1, "header-right"], ["title", "Recents & Favorites", 1, "header-action-btn", 3, "active"], [1, "content-body"], [1, "home-view-concept-d"], [3, "entity", "viewEntity", "viewMode", "filterText", "selectedRecordId", "config", "gridState", "timelineConfig", "gridSelectionMode", "showGridToolbar", "showAddToListButton"], [1, "detail-panel", 3, "width"], [3, "close", "save", "saveDefaults", "delete", "duplicate", "openFilterDialogRequest", "entity", "viewEntity", "isOpen", "currentGridState", "externalFilterState", "isSaving", "DefaultSaveAsNew"], [3, "close", "apply", "isOpen", "fields", "filter", "disabled"], [3, "closed", "visible", "config"], [3, "config", "visible"], [3, "Save", "Close", "OpenAdvanced", "IsOpen", "ViewEntity", "EntityName", "Summary", "IsSaving", "DefaultSaveAsNew"], [3, "Duplicate", "Cancel", "IsOpen", "SourceViewName", "Summary"], [3, "Action", "Cancel", "IsOpen", "ViewName"], [1, "navigation-panel"], [3, "entitySelected", "toggleCollapse", "sectionToggled", "openRecord", "selectRecord", "expandAndFocus", "entities", "appEntityGroups", "selectedEntityName", "favorites", "recentItems", "collapsed", "allowedEntityNames", "favoritesSectionExpanded", "recentSectionExpanded", "entitiesSectionExpanded", "viewsSectionExpanded"], [1, "breadcrumb-item", 3, "click", "title"], [1, "breadcrumb-icon", 3, "class"], [1, "breadcrumb-label"], [1, "fa-solid", "fa-chevron-right", "breadcrumb-separator"], [1, "breadcrumb-icon"], [1, "entity-icon"], [1, "entity-title"], [1, "record-count"], [3, "viewSelected", "saveViewRequested", "manageViewsRequested", "openInTabRequested", "configureViewRequested", "createNewRecordRequested", "exportRequested", "duplicateViewRequested", "quickSaveRequested", "revertRequested", "entity", "selectedViewId", "viewModified"], [1, "header-action-btn", 3, "click", "disabled", "title"], [1, "fa-solid", "fa-list-check"], [1, "selection-badge"], [1, "entity-icon", 3, "class"], [1, "fa-solid", "fa-search", "filter-icon"], ["type", "text", "placeholder", "Filter records... (press / to focus)", 1, "smart-filter-input", 3, "ngModelChange", "ngModel"], [1, "clear-filter-btn"], [1, "clear-filter-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "view-mode-toggle"], ["title", "Grid View", 1, "toggle-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["title", "Cards View", 1, "toggle-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["title", "Timeline View", 1, "toggle-btn", 3, "active"], ["title", "Timeline View", 1, "toggle-btn", 3, "click"], [1, "fa-solid", "fa-timeline"], [1, "date-field-selector-container"], [1, "date-field-backdrop"], [1, "date-field-selector-wrapper"], [1, "date-field-selector-button", 3, "click", "disabled"], [1, "fa-solid", "fa-calendar-days", "date-field-icon"], [1, "date-field-name"], [1, "fa-solid", "fa-chevron-down", "date-field-arrow", 3, "rotated"], [1, "date-field-dropdown-panel"], [1, "timeline-orientation-toggle"], [1, "toggle-btn", 3, "click", "title"], [1, "timeline-sort-toggle"], [1, "date-field-backdrop", 3, "click"], [1, "fa-solid", "fa-chevron-down", "date-field-arrow"], [1, "date-field-dropdown-item", 3, "selected"], [1, "date-field-dropdown-item", 3, "click"], [1, "fa-regular", "fa-calendar", "item-icon"], [1, "item-name"], [1, "fa-solid", "fa-check", "selected-check"], ["title", "Recents & Favorites", 1, "header-action-btn", 3, "click"], [1, "fa-solid", "fa-clock-rotate-left"], [1, "qa-badge"], [1, "loading-state"], ["text", "Loading entities...", "size", "medium"], [1, "home-main-area"], [1, "search-hero"], [1, "search-hero-container"], [1, "fa-solid", "fa-magnifying-glass", "search-hero-icon"], ["type", "text", "placeholder", "Search entities...", 1, "search-hero-input", 3, "ngModelChange", "ngModel"], [1, "search-hero-clear"], [1, "search-hero-shortcut"], [1, "search-meta-row"], [1, "search-entity-count"], [1, "pill-toggle"], [1, "pill-btn", 3, "click"], [1, "fa-solid", "fa-star"], [1, "entity-groups-area"], [1, "entity-item-grid"], [1, "home-no-results"], [1, "empty-state"], [1, "quick-access-panel"], [1, "qa-header"], [1, "qa-close-btn", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "qa-body"], [1, "qa-section"], [1, "qa-section-header", 3, "click"], [1, "fa-solid", "fa-clock-rotate-left", "qa-section-icon"], [1, "qa-section-count"], [1, "fa-solid", "fa-chevron-down", "qa-section-chevron"], [1, "qa-section-body"], [1, "qa-item"], [1, "qa-empty"], [1, "fa-solid", "fa-table", "qa-section-icon"], [1, "fa-solid", "fa-star", "qa-section-icon", 2, "color", "#f59e0b"], [1, "search-hero-clear", 3, "click"], [1, "entity-item", 3, "title"], [1, "entity-item", 3, "click", "title"], [1, "entity-item-icon"], [1, "entity-item-text"], [1, "entity-item-name"], [1, "entity-item-desc"], [1, "entity-item-fav", 3, "click", "title"], [1, "app-group"], [1, "app-group-header", 3, "click"], [1, "app-group-icon"], [1, "app-group-name"], [1, "app-group-count"], [1, "fa-solid", "fa-chevron-right", "app-group-chevron"], [1, "app-group-entities"], [1, "fa-solid", "fa-magnifying-glass"], [1, "fa-solid", "fa-database", "empty-icon"], [1, "qa-item", 3, "click"], [1, "qa-item-icon"], [1, "qa-item-info"], [1, "qa-item-name"], [1, "qa-item-meta"], [1, "qa-item-time"], [3, "viewModeChange", "filterTextChange", "recordSelected", "recordOpened", "dataLoaded", "filteredCountChanged", "gridStateChanged", "selectionChanged", "addToListRequested", "entity", "viewEntity", "viewMode", "filterText", "selectedRecordId", "config", "gridState", "timelineConfig", "gridSelectionMode", "showGridToolbar", "showAddToListButton"], [1, "detail-panel"], [1, "detail-panel-actions"], ["title", "Add to List", 1, "detail-action-btn", 3, "click"], [3, "close", "openRecord", "navigateToRelated", "openRelatedRecord", "openForeignKeyRecord", "entity", "record"], [3, "complete", "cancel", "config", "visible"]], template: function DataExplorerDashboardComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2);
-            i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_1_Template, 2, 15, "div", 3);
+            i0.ɵɵconditionalCreate(1, DataExplorerDashboardComponent_Conditional_1_Template, 2, 16, "div", 3);
             i0.ɵɵelementStart(2, "div", 4);
             i0.ɵɵconditionalCreate(3, DataExplorerDashboardComponent_Conditional_3_Template, 3, 0, "div", 5);
             i0.ɵɵelementStart(4, "div", 6)(5, "div", 7);
             i0.ɵɵconditionalCreate(6, DataExplorerDashboardComponent_Conditional_6_Template, 9, 12)(7, DataExplorerDashboardComponent_Conditional_7_Template, 5, 3);
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(8, "div", 8);
-            i0.ɵɵconditionalCreate(9, DataExplorerDashboardComponent_Conditional_9_Template, 5, 2, "div", 9)(10, DataExplorerDashboardComponent_Conditional_10_Template, 5, 2, "div", 9);
+            i0.ɵɵconditionalCreate(9, DataExplorerDashboardComponent_Conditional_9_Template, 5, 2, "div", 9);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(11, "div", 10);
-            i0.ɵɵconditionalCreate(12, DataExplorerDashboardComponent_Conditional_12_Template, 7, 6);
+            i0.ɵɵelementStart(10, "div", 10);
+            i0.ɵɵconditionalCreate(11, DataExplorerDashboardComponent_Conditional_11_Template, 7, 6);
+            i0.ɵɵconditionalCreate(12, DataExplorerDashboardComponent_Conditional_12_Template, 3, 3, "button", 11);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(13, "div", 11);
-            i0.ɵɵconditionalCreate(14, DataExplorerDashboardComponent_Conditional_14_Template, 3, 1, "div", 12)(15, DataExplorerDashboardComponent_Conditional_15_Template, 2, 11, "mj-entity-viewer", 13);
+            i0.ɵɵelementStart(13, "div", 12);
+            i0.ɵɵconditionalCreate(14, DataExplorerDashboardComponent_Conditional_14_Template, 3, 1, "div", 13)(15, DataExplorerDashboardComponent_Conditional_15_Template, 2, 11, "mj-entity-viewer", 14);
             i0.ɵɵelementEnd()();
-            i0.ɵɵconditionalCreate(16, DataExplorerDashboardComponent_Conditional_16_Template, 7, 4, "div", 14);
-            i0.ɵɵelementStart(17, "mj-view-config-panel", 15);
+            i0.ɵɵconditionalCreate(16, DataExplorerDashboardComponent_Conditional_16_Template, 7, 4, "div", 15);
+            i0.ɵɵelementStart(17, "mj-view-config-panel", 16);
             i0.ɵɵlistener("close", function DataExplorerDashboardComponent_Template_mj_view_config_panel_close_17_listener() { return ctx.onCloseViewConfigPanel(); })("save", function DataExplorerDashboardComponent_Template_mj_view_config_panel_save_17_listener($event) { return ctx.onSaveView($event); })("saveDefaults", function DataExplorerDashboardComponent_Template_mj_view_config_panel_saveDefaults_17_listener($event) { return ctx.onSaveDefaultViewSettings($event); })("delete", function DataExplorerDashboardComponent_Template_mj_view_config_panel_delete_17_listener() { return ctx.onDeleteView(); })("duplicate", function DataExplorerDashboardComponent_Template_mj_view_config_panel_duplicate_17_listener() { return ctx.onDuplicateFromPanel(); })("openFilterDialogRequest", function DataExplorerDashboardComponent_Template_mj_view_config_panel_openFilterDialogRequest_17_listener($event) { return ctx.onOpenFilterDialogRequest($event); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(18, "mj-filter-dialog", 16);
+            i0.ɵɵelementStart(18, "mj-filter-dialog", 17);
             i0.ɵɵlistener("close", function DataExplorerDashboardComponent_Template_mj_filter_dialog_close_18_listener() { return ctx.onCloseFilterDialog(); })("apply", function DataExplorerDashboardComponent_Template_mj_filter_dialog_apply_18_listener($event) { return ctx.onFilterApplied($event); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(19, "mj-export-dialog", 17);
+            i0.ɵɵelementStart(19, "mj-export-dialog", 18);
             i0.ɵɵlistener("closed", function DataExplorerDashboardComponent_Template_mj_export_dialog_closed_19_listener($event) { return ctx.onExportDialogClosed($event); });
             i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(20, DataExplorerDashboardComponent_Conditional_20_Template, 1, 2, "mj-list-management-dialog", 18);
-            i0.ɵɵelementStart(21, "mj-quick-save-dialog", 19);
+            i0.ɵɵconditionalCreate(20, DataExplorerDashboardComponent_Conditional_20_Template, 1, 2, "mj-list-management-dialog", 19);
+            i0.ɵɵelementStart(21, "mj-quick-save-dialog", 20);
             i0.ɵɵlistener("Save", function DataExplorerDashboardComponent_Template_mj_quick_save_dialog_Save_21_listener($event) { return ctx.onQuickSave($event); })("Close", function DataExplorerDashboardComponent_Template_mj_quick_save_dialog_Close_21_listener() { return ctx.onQuickSaveClose(); })("OpenAdvanced", function DataExplorerDashboardComponent_Template_mj_quick_save_dialog_OpenAdvanced_21_listener() { return ctx.onQuickSaveOpenAdvanced(); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(22, "mj-duplicate-view-dialog", 20);
+            i0.ɵɵelementStart(22, "mj-duplicate-view-dialog", 21);
             i0.ɵɵlistener("Duplicate", function DataExplorerDashboardComponent_Template_mj_duplicate_view_dialog_Duplicate_22_listener($event) { return ctx.onDuplicateConfirmed($event); })("Cancel", function DataExplorerDashboardComponent_Template_mj_duplicate_view_dialog_Cancel_22_listener() { return ctx.onDuplicateCancel(); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(23, "mj-shared-view-warning-dialog", 21);
+            i0.ɵɵelementStart(23, "mj-shared-view-warning-dialog", 22);
             i0.ɵɵlistener("Action", function DataExplorerDashboardComponent_Template_mj_shared_view_warning_dialog_Action_23_listener($event) { return ctx.onSharedViewAction($event); })("Cancel", function DataExplorerDashboardComponent_Template_mj_shared_view_warning_dialog_Cancel_23_listener() { return ctx.onSharedViewWarningCancel(); });
             i0.ɵɵelementEnd()();
         } if (rf & 2) {
@@ -3311,9 +3464,11 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
             i0.ɵɵadvance(2);
             i0.ɵɵconditional(ctx.selectedEntity ? 6 : 7);
             i0.ɵɵadvance(3);
-            i0.ɵɵconditional(ctx.selectedEntity ? 9 : 10);
-            i0.ɵɵadvance(3);
-            i0.ɵɵconditional(ctx.selectedEntity ? 12 : -1);
+            i0.ɵɵconditional(ctx.selectedEntity ? 9 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.selectedEntity ? 11 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.selectedEntity ? 12 : -1);
             i0.ɵɵadvance();
             i0.ɵɵclassProp("home-content", ctx.isAtHomeLevel);
             i0.ɵɵadvance();
@@ -3334,7 +3489,7 @@ let DataExplorerDashboardComponent = class DataExplorerDashboardComponent extend
             i0.ɵɵproperty("IsOpen", ctx.showDuplicateDialog)("SourceViewName", ctx.duplicateSourceViewName)("Summary", ctx.duplicateSummary);
             i0.ɵɵadvance();
             i0.ɵɵproperty("IsOpen", ctx.showSharedViewWarning)("ViewName", (ctx.selectedViewEntity == null ? null : ctx.selectedViewEntity.Name) ?? "");
-        } }, dependencies: [i6.DefaultValueAccessor, i6.NgControlStatus, i6.NgModel, i7.EntityViewerComponent, i7.EntityRecordDetailPanelComponent, i7.ViewConfigPanelComponent, i7.QuickSaveDialogComponent, i7.DuplicateViewDialogComponent, i7.SharedViewWarningDialogComponent, i3.LoadingComponent, i8.ListManagementDialogComponent, i5.ExportDialogComponent, i9.NavigationPanelComponent, i10.ViewSelectorComponent, i11.FilterDialogComponent, i12.DecimalPipe], styles: [".data-explorer-container[_ngcontent-%COMP%] {\n  display: flex;\n  height: 100%;\n  width: 100%;\n  background: #f5f7fa;\n  overflow: hidden;\n}\n\n.navigation-panel[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-right: 1px solid #e0e0e0;\n  transition: width 0.2s ease-in-out;\n  overflow: hidden;\n  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04);\n}\n.navigation-panel.collapsed[_ngcontent-%COMP%] {\n  width: 48px;\n}\n\n.content-area[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-width: 0;\n  overflow: hidden;\n  background: #f5f7fa;\n}\n\n\n\n.breadcrumb-bar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 24px;\n  background: white;\n  border-bottom: 1px solid #eee;\n  flex-shrink: 0;\n  font-size: 13px;\n  min-height: 40px;\n}\n\n.breadcrumb-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  color: #666;\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.15s ease;\n  max-width: 200px;\n}\n\n.breadcrumb-item.clickable[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.breadcrumb-item.clickable[_ngcontent-%COMP%]:hover {\n  background: #f0f0f0;\n  color: #1976d2;\n}\n\n.breadcrumb-item.current[_ngcontent-%COMP%] {\n  color: #1a1a1a;\n  font-weight: 500;\n  cursor: default;\n}\n\n.breadcrumb-icon[_ngcontent-%COMP%] {\n  font-size: 12px;\n  flex-shrink: 0;\n}\n\n.breadcrumb-label[_ngcontent-%COMP%] {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.breadcrumb-separator[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: #ccc;\n  flex-shrink: 0;\n}\n\n.content-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 24px;\n  background: white;\n  border-bottom: 1px solid #e0e0e0;\n  flex-shrink: 0;\n  gap: 24px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);\n}\n\n.header-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n  flex-wrap: wrap;\n}\n\n\n\n.header-left[_ngcontent-%COMP%]     mj-view-selector {\n  margin-left: 8px;\n}\n\n.entity-icon[_ngcontent-%COMP%] {\n  font-size: 20px;\n  color: #1976d2;\n}\n\n.entity-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #1a1a1a;\n}\n\n.record-count[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: #666;\n  font-weight: 500;\n}\n\n.header-center[_ngcontent-%COMP%] {\n  flex: 1;\n  max-width: 600px;\n}\n\n.smart-filter-container[_ngcontent-%COMP%] {\n  position: relative;\n  width: 100%;\n}\n\n.smart-filter-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 10px 40px 10px 16px;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  font-size: 14px;\n  background: #fafafa;\n  transition: all 0.15s ease;\n}\n.smart-filter-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: #1976d2;\n  background: white;\n  box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.1);\n}\n.smart-filter-input[_ngcontent-%COMP%]::placeholder {\n  color: #999;\n}\n\n.clear-filter-btn[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #757575;\n  transition: all 0.15s ease;\n}\n.clear-filter-btn[_ngcontent-%COMP%]:hover {\n  background: #e0e0e0;\n  color: #424242;\n}\n\n.header-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.view-mode-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.toggle-btn[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 6px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n}\n.toggle-btn[_ngcontent-%COMP%]:hover {\n  color: #333;\n}\n.toggle-btn.active[_ngcontent-%COMP%] {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n\n\n.header-action-btn[_ngcontent-%COMP%] {\n  position: relative;\n  width: 36px;\n  height: 36px;\n  border: 1px solid #e0e0e0;\n  background: white;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n  margin-left: 8px;\n}\n.header-action-btn[_ngcontent-%COMP%]:hover:not(.disabled) {\n  border-color: #1976d2;\n  color: #1976d2;\n  background: #f5f9ff;\n}\n.header-action-btn.disabled[_ngcontent-%COMP%] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.header-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 14px;\n}\n.selection-badge[_ngcontent-%COMP%] {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: #1976d2;\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  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n\n\n.date-field-selector-container[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n\n.date-field-backdrop[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 999;\n  background: transparent;\n}\n\n.date-field-selector-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n}\n\n.date-field-selector-button[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 12px;\n  background: var(--background-alt, #f5f5f5);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 6px;\n  cursor: pointer;\n  font-size: 13px;\n  color: var(--text-primary, #333);\n  transition: all 0.15s ease;\n  min-width: 120px;\n  max-width: 200px;\n}\n\n.date-field-selector-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: var(--background-hover, #e8e8e8);\n  border-color: var(--border-color-hover, #ccc);\n}\n\n.date-field-selector-button[_ngcontent-%COMP%]:disabled {\n  cursor: default;\n  opacity: 0.8;\n}\n\n.date-field-selector-button.open[_ngcontent-%COMP%] {\n  background: var(--background-active, #e0e0e0);\n  border-color: var(--primary-color, #007bff);\n}\n\n.date-field-icon[_ngcontent-%COMP%] {\n  color: var(--text-secondary, #666);\n  font-size: 12px;\n}\n\n.date-field-name[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: left;\n}\n\n.date-field-arrow[_ngcontent-%COMP%] {\n  color: var(--text-secondary, #666);\n  font-size: 10px;\n  transition: transform 0.2s ease;\n}\n\n.date-field-arrow.rotated[_ngcontent-%COMP%] {\n  transform: rotate(180deg);\n}\n\n.date-field-dropdown-panel[_ngcontent-%COMP%] {\n  position: absolute;\n  top: calc(100% + 4px);\n  left: 0;\n  min-width: 180px;\n  max-width: 280px;\n  max-height: 300px;\n  overflow-y: auto;\n  background: var(--background-panel, #fff);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  z-index: 1000;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  cursor: pointer;\n  transition: background 0.1s ease;\n  font-size: 13px;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]:hover {\n  background: var(--background-hover, #f5f5f5);\n}\n\n.date-field-dropdown-item.selected[_ngcontent-%COMP%] {\n  background: var(--primary-light, #e6f0ff);\n}\n\n.date-field-dropdown-item.selected[_ngcontent-%COMP%]:hover {\n  background: var(--primary-light-hover, #d6e4f9);\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]   .item-icon[_ngcontent-%COMP%] {\n  color: var(--text-secondary, #666);\n  font-size: 13px;\n  width: 16px;\n  text-align: center;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]   .item-name[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]   .selected-check[_ngcontent-%COMP%] {\n  color: var(--primary-color, #007bff);\n  font-size: 12px;\n}\n\n\n\n.timeline-orientation-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.content-body[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n  padding: 20px 24px;\n  display: flex;\n  flex-direction: column;\n}\n\n.loading-container[_ngcontent-%COMP%], \n.loading-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  gap: 16px;\n  background: white;\n  border-radius: 8px;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n  font-size: 32px;\n  color: #1976d2;\n}\n\n.loading-message[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  color: #666;\n}\n\n.empty-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  text-align: center;\n  color: #757575;\n  background: white;\n  border-radius: 8px;\n  padding: 40px;\n}\n\n.empty-icon[_ngcontent-%COMP%] {\n  font-size: 64px;\n  color: #e0e0e0;\n  margin-bottom: 24px;\n}\n\n.empty-state[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 8px 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #333;\n}\n\n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  max-width: 400px;\n  color: #666;\n}\n\n\n\n.entity-home-view[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: auto;\n  padding: 4px;\n}\n\n.entity-card-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 16px;\n  padding: 0;\n}\n\n.entity-card[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  gap: 16px;\n  padding: 20px;\n  background: white;\n  border-radius: 10px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  border: 1px solid #e8e8e8;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);\n  border-color: #1976d2;\n}\n\n.entity-card[_ngcontent-%COMP%]:active {\n  transform: translateY(0);\n}\n\n.entity-card-icon[_ngcontent-%COMP%] {\n  width: 48px;\n  height: 48px;\n  border-radius: 10px;\n  background: linear-gradient(135deg, #e3f2fd, #bbdefb);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.entity-card-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 20px;\n  color: #1976d2;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover   .entity-card-icon[_ngcontent-%COMP%] {\n  background: linear-gradient(135deg, #1976d2, #1565c0);\n}\n\n.entity-card[_ngcontent-%COMP%]:hover   .entity-card-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: white;\n}\n\n.entity-card-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.entity-card-title[_ngcontent-%COMP%] {\n  margin: 0 0 6px 0;\n  font-size: 15px;\n  font-weight: 600;\n  color: #1a1a1a;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.entity-card-description[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 13px;\n  color: #666;\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.detail-panel[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-left: 1px solid #e0e0e0;\n  box-shadow: -4px 0 16px rgba(0, 0, 0, 0.08);\n  overflow: hidden;\n  animation: _ngcontent-%COMP%_slideIn 0.2s ease-out;\n  display: flex;\n  flex-direction: column;\n}\n\n.detail-panel[_ngcontent-%COMP%]   mj-entity-record-detail-panel[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n@keyframes _ngcontent-%COMP%_slideIn {\n  from {\n    transform: translateX(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n\n\n\n.detail-panel-actions[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border-bottom: 1px solid #e2e8f0;\n}\n\n.detail-action-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border: none;\n  border-radius: 6px;\n  background: white;\n  color: #475569;\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n}\n\n.detail-action-btn[_ngcontent-%COMP%]:hover {\n  background: #3b82f6;\n  color: white;\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2);\n}\n\n.detail-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n[_nghost-%COMP%]     mj-explorer-grid-view, \n[_nghost-%COMP%]     mj-explorer-cards-view {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n\n\n\n\n\n\n\n\n.content-header.home-header[_ngcontent-%COMP%] {\n  border-bottom: none;\n  background: transparent;\n  box-shadow: none;\n  padding: 24px 24px 16px;\n}\n\n.content-body.home-content[_ngcontent-%COMP%] {\n  padding-top: 0;\n}\n\n\n\n.filter-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #999;\n  font-size: 14px;\n  pointer-events: none;\n}\n\n.smart-filter-container[_ngcontent-%COMP%]   .smart-filter-input[_ngcontent-%COMP%] {\n  padding-left: 40px;\n}\n\n\n\n\n\n\n.home-section[_ngcontent-%COMP%] {\n  margin-bottom: 28px;\n}\n\n.section-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  margin-bottom: 14px;\n  padding-left: 4px;\n}\n\n.section-icon[_ngcontent-%COMP%] {\n  font-size: 14px;\n  color: #1976d2;\n  width: 20px;\n  text-align: center;\n}\n\n.section-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  font-weight: 600;\n  color: #333;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.section-count[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: #888;\n  font-weight: 500;\n  margin-left: 8px;\n}\n\n\n\n\n\n\n.home-two-column-layout[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 24px;\n  margin-bottom: 28px;\n}\n\n\n\n.home-two-column-layout.single-column[_ngcontent-%COMP%] {\n  grid-template-columns: 1fr;\n}\n\n.home-column[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n\n\n.section-header-with-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 14px;\n  padding-left: 4px;\n}\n\n.section-header-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n\n\n.inline-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 6px;\n  padding: 2px;\n}\n\n.inline-toggle[_ngcontent-%COMP%]   .toggle-btn[_ngcontent-%COMP%] {\n  width: auto;\n  height: 26px;\n  padding: 0 10px;\n  border: none;\n  background: transparent;\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  font-size: 11px;\n  font-weight: 500;\n  transition: all 0.15s ease;\n}\n\n.inline-toggle[_ngcontent-%COMP%]   .toggle-btn[_ngcontent-%COMP%]:hover {\n  color: #333;\n}\n\n.inline-toggle[_ngcontent-%COMP%]   .toggle-btn.active[_ngcontent-%COMP%] {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n\n\n\n\n\n.entity-card-row[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n  padding: 0;\n}\n\n.entity-card.compact[_ngcontent-%COMP%] {\n  flex: 0 0 auto;\n  width: auto;\n  min-width: 180px;\n  max-width: 280px;\n  padding: 12px 16px;\n  gap: 12px;\n}\n\n.entity-card.compact[_ngcontent-%COMP%]   .entity-card-icon[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border-radius: 8px;\n}\n\n.entity-card.compact[_ngcontent-%COMP%]   .entity-card-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n\n.entity-card.compact[_ngcontent-%COMP%]   .entity-card-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n}\n\n.entity-card.compact[_ngcontent-%COMP%]   .entity-card-content[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n}\n\n\n\n\n\n\n.favorite-btn[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #ccc;\n  transition: all 0.15s ease;\n  margin-left: auto;\n}\n\n.favorite-btn[_ngcontent-%COMP%]:hover {\n  background: rgba(255, 193, 7, 0.1);\n  color: #ffc107;\n  transform: scale(1.1);\n}\n\n.favorite-btn.favorited[_ngcontent-%COMP%] {\n  color: #ffc107;\n}\n\n.favorite-btn.favorited[_ngcontent-%COMP%]:hover {\n  background: rgba(255, 193, 7, 0.15);\n  color: #ffb300;\n}\n\n.entity-card[_ngcontent-%COMP%]   .favorite-btn[_ngcontent-%COMP%] {\n  opacity: 0;\n  transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease, transform 0.15s ease;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover   .favorite-btn[_ngcontent-%COMP%] {\n  opacity: 1;\n}\n\n.entity-card[_ngcontent-%COMP%]   .favorite-btn.favorited[_ngcontent-%COMP%] {\n  opacity: 1;\n}\n\n\n\n\n\n\n.recent-records-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  background: white;\n  border-radius: 10px;\n  padding: 8px;\n  border: 1px solid #e8e8e8;\n}\n\n.recent-record-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.recent-record-item[_ngcontent-%COMP%]:hover {\n  background: #f5f7fa;\n}\n\n.recent-record-icon[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n  background: linear-gradient(135deg, #e8f5e9, #c8e6c9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.recent-record-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 14px;\n  color: #4caf50;\n}\n\n.recent-record-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.recent-record-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 500;\n  color: #1a1a1a;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.recent-record-entity[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: #888;\n}\n\n.recent-record-time[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: #aaa;\n  flex-shrink: 0;\n}\n\n\n\n\n\n\n.entity-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  background: white;\n  border-radius: 10px;\n  padding: 8px;\n  border: 1px solid #e8e8e8;\n}\n\n.entity-list-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.entity-list-item[_ngcontent-%COMP%]:hover {\n  background: #f5f7fa;\n}\n\n.entity-list-icon[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n  background: linear-gradient(135deg, #e3f2fd, #bbdefb);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.entity-list-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 14px;\n  color: #1976d2;\n}\n\n.entity-list-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.entity-list-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 500;\n  color: #1a1a1a;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.entity-list-item[_ngcontent-%COMP%]   .favorite-btn[_ngcontent-%COMP%] {\n  opacity: 0;\n  transition: opacity 0.15s ease;\n}\n\n.entity-list-item[_ngcontent-%COMP%]:hover   .favorite-btn[_ngcontent-%COMP%] {\n  opacity: 1;\n}\n\n.entity-list-item[_ngcontent-%COMP%]   .favorite-btn.favorited[_ngcontent-%COMP%] {\n  opacity: 1;\n}\n\n\n\n\n\n\n.entity-filter-strip[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 4px;\n  margin-left: auto;\n  background: #f0f0f0;\n  border-radius: 6px;\n  padding: 3px;\n}\n\n.entity-filter-btn[_ngcontent-%COMP%] {\n  width: 28px;\n  height: 26px;\n  border: none;\n  background: transparent;\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  font-size: 12px;\n  transition: all 0.15s ease;\n}\n\n.entity-filter-btn[_ngcontent-%COMP%]:hover {\n  color: #333;\n  background: rgba(0, 0, 0, 0.05);\n}\n\n.entity-filter-btn.active[_ngcontent-%COMP%] {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n\n\n\n\n\n.view-mode-toggle[_ngcontent-%COMP%]   .toggle-btn[_ngcontent-%COMP%] {\n  width: auto;\n  padding: 0 12px;\n  gap: 6px;\n}\n\n.toggle-label[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 500;\n}\n\n\n\n\n\n\n.empty-state.small[_ngcontent-%COMP%] {\n  height: auto;\n  padding: 32px;\n  background: #fafafa;\n}\n\n.empty-state.small[_ngcontent-%COMP%]   .empty-icon[_ngcontent-%COMP%] {\n  font-size: 40px;\n  margin-bottom: 16px;\n}\n\n.empty-state.small[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n\n.empty-state.small[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  font-size: 13px;\n}\n\n\n\n\n\n\n@media (max-width: 1200px) {\n  .entity-card-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));\n  }\n}\n\n@media (max-width: 900px) {\n  .content-header[_ngcontent-%COMP%] {\n    flex-wrap: wrap;\n    gap: 12px;\n  }\n\n  .header-center[_ngcontent-%COMP%] {\n    order: 3;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n\n  .entity-card.compact[_ngcontent-%COMP%] {\n    min-width: 160px;\n  }\n\n  \n\n  .home-two-column-layout[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n    gap: 20px;\n  }\n}\n\n@media (max-width: 600px) {\n  .data-explorer-container[_ngcontent-%COMP%] {\n    flex-direction: column;\n  }\n\n  .navigation-panel[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .content-header[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n  }\n\n  .content-body[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n  }\n\n  .entity-card-grid[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n    gap: 12px;\n  }\n\n  .entity-card[_ngcontent-%COMP%] {\n    padding: 16px;\n  }\n\n  .entity-card.compact[_ngcontent-%COMP%] {\n    min-width: 100%;\n    max-width: 100%;\n  }\n\n  .entity-card-row[_ngcontent-%COMP%] {\n    flex-direction: column;\n  }\n\n  .view-mode-toggle[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .section-title[_ngcontent-%COMP%] {\n    font-size: 13px;\n  }\n\n  .home-section[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n  }\n}"], data: { animation: [
+        } }, dependencies: [i6.DefaultValueAccessor, i6.NgControlStatus, i6.NgModel, i7.EntityViewerComponent, i7.EntityRecordDetailPanelComponent, i7.ViewConfigPanelComponent, i7.QuickSaveDialogComponent, i7.DuplicateViewDialogComponent, i7.SharedViewWarningDialogComponent, i3.LoadingComponent, i8.ListManagementDialogComponent, i5.ExportDialogComponent, i9.NavigationPanelComponent, i10.ViewSelectorComponent, i11.FilterDialogComponent, i12.DecimalPipe], styles: [".data-explorer-container[_ngcontent-%COMP%] {\n  display: flex;\n  height: 100%;\n  width: 100%;\n  background: #f5f7fa;\n  overflow: hidden;\n}\n\n.navigation-panel[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-right: 1px solid #e0e0e0;\n  transition: width 0.2s ease-in-out;\n  overflow: hidden;\n  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04);\n}\n.navigation-panel.collapsed[_ngcontent-%COMP%] {\n  width: 48px;\n}\n\n.content-area[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-width: 0;\n  overflow: hidden;\n  background: #f5f7fa;\n}\n\n\n\n.breadcrumb-bar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 24px;\n  background: white;\n  border-bottom: 1px solid #eee;\n  flex-shrink: 0;\n  font-size: 13px;\n  min-height: 40px;\n}\n\n.breadcrumb-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  color: #666;\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.15s ease;\n  max-width: 200px;\n}\n\n.breadcrumb-item.clickable[_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.breadcrumb-item.clickable[_ngcontent-%COMP%]:hover {\n  background: #f0f0f0;\n  color: #1976d2;\n}\n\n.breadcrumb-item.current[_ngcontent-%COMP%] {\n  color: #1a1a1a;\n  font-weight: 500;\n  cursor: default;\n}\n\n.breadcrumb-icon[_ngcontent-%COMP%] {\n  font-size: 12px;\n  flex-shrink: 0;\n}\n\n.breadcrumb-label[_ngcontent-%COMP%] {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.breadcrumb-separator[_ngcontent-%COMP%] {\n  font-size: 10px;\n  color: #ccc;\n  flex-shrink: 0;\n}\n\n.content-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 24px;\n  background: white;\n  border-bottom: 1px solid #e0e0e0;\n  flex-shrink: 0;\n  gap: 24px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);\n}\n\n.header-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n  flex-wrap: wrap;\n}\n\n\n\n.header-left[_ngcontent-%COMP%]     mj-view-selector {\n  margin-left: 8px;\n}\n\n.entity-icon[_ngcontent-%COMP%] {\n  font-size: 20px;\n  color: #1976d2;\n}\n\n.entity-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #1a1a1a;\n}\n\n.record-count[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: #666;\n  font-weight: 500;\n}\n\n.header-center[_ngcontent-%COMP%] {\n  flex: 1;\n  max-width: 600px;\n}\n\n.smart-filter-container[_ngcontent-%COMP%] {\n  position: relative;\n  width: 100%;\n}\n\n.smart-filter-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 10px 40px 10px 16px;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  font-size: 14px;\n  background: #fafafa;\n  transition: all 0.15s ease;\n}\n.smart-filter-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: #1976d2;\n  background: white;\n  box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.1);\n}\n.smart-filter-input[_ngcontent-%COMP%]::placeholder {\n  color: #999;\n}\n\n.clear-filter-btn[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #757575;\n  transition: all 0.15s ease;\n}\n.clear-filter-btn[_ngcontent-%COMP%]:hover {\n  background: #e0e0e0;\n  color: #424242;\n}\n\n.header-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.view-mode-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.toggle-btn[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 6px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n}\n.toggle-btn[_ngcontent-%COMP%]:hover {\n  color: #333;\n}\n.toggle-btn.active[_ngcontent-%COMP%] {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n\n\n.header-action-btn[_ngcontent-%COMP%] {\n  position: relative;\n  width: 36px;\n  height: 36px;\n  border: 1px solid #e0e0e0;\n  background: white;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n  margin-left: 8px;\n}\n.header-action-btn[_ngcontent-%COMP%]:hover:not(.disabled) {\n  border-color: #1976d2;\n  color: #1976d2;\n  background: #f5f9ff;\n}\n.header-action-btn.disabled[_ngcontent-%COMP%] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.header-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 14px;\n}\n.selection-badge[_ngcontent-%COMP%] {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: #1976d2;\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  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n\n\n.date-field-selector-container[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n\n.date-field-backdrop[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 999;\n  background: transparent;\n}\n\n.date-field-selector-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n}\n\n.date-field-selector-button[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 12px;\n  background: var(--background-alt, #f5f5f5);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 6px;\n  cursor: pointer;\n  font-size: 13px;\n  color: var(--text-primary, #333);\n  transition: all 0.15s ease;\n  min-width: 120px;\n  max-width: 200px;\n}\n\n.date-field-selector-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: var(--background-hover, #e8e8e8);\n  border-color: var(--border-color-hover, #ccc);\n}\n\n.date-field-selector-button[_ngcontent-%COMP%]:disabled {\n  cursor: default;\n  opacity: 0.8;\n}\n\n.date-field-selector-button.open[_ngcontent-%COMP%] {\n  background: var(--background-active, #e0e0e0);\n  border-color: var(--primary-color, #007bff);\n}\n\n.date-field-icon[_ngcontent-%COMP%] {\n  color: var(--text-secondary, #666);\n  font-size: 12px;\n}\n\n.date-field-name[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: left;\n}\n\n.date-field-arrow[_ngcontent-%COMP%] {\n  color: var(--text-secondary, #666);\n  font-size: 10px;\n  transition: transform 0.2s ease;\n}\n\n.date-field-arrow.rotated[_ngcontent-%COMP%] {\n  transform: rotate(180deg);\n}\n\n.date-field-dropdown-panel[_ngcontent-%COMP%] {\n  position: absolute;\n  top: calc(100% + 4px);\n  left: 0;\n  min-width: 180px;\n  max-width: 280px;\n  max-height: 300px;\n  overflow-y: auto;\n  background: var(--background-panel, #fff);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  z-index: 1000;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  cursor: pointer;\n  transition: background 0.1s ease;\n  font-size: 13px;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]:hover {\n  background: var(--background-hover, #f5f5f5);\n}\n\n.date-field-dropdown-item.selected[_ngcontent-%COMP%] {\n  background: var(--primary-light, #e6f0ff);\n}\n\n.date-field-dropdown-item.selected[_ngcontent-%COMP%]:hover {\n  background: var(--primary-light-hover, #d6e4f9);\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]   .item-icon[_ngcontent-%COMP%] {\n  color: var(--text-secondary, #666);\n  font-size: 13px;\n  width: 16px;\n  text-align: center;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]   .item-name[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.date-field-dropdown-item[_ngcontent-%COMP%]   .selected-check[_ngcontent-%COMP%] {\n  color: var(--primary-color, #007bff);\n  font-size: 12px;\n}\n\n\n\n.timeline-orientation-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.content-body[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow: hidden;\n  padding: 20px 24px;\n  display: flex;\n  flex-direction: column;\n}\n\n.loading-container[_ngcontent-%COMP%], \n.loading-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  gap: 16px;\n  background: white;\n  border-radius: 8px;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n  font-size: 32px;\n  color: #1976d2;\n}\n\n.loading-message[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  color: #666;\n}\n\n.empty-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  text-align: center;\n  color: #757575;\n  background: white;\n  border-radius: 8px;\n  padding: 40px;\n}\n\n.empty-icon[_ngcontent-%COMP%] {\n  font-size: 64px;\n  color: #e0e0e0;\n  margin-bottom: 24px;\n}\n\n.empty-state[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 8px 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #333;\n}\n\n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 14px;\n  max-width: 400px;\n  color: #666;\n}\n\n\n\n\n\n\n.home-view-concept-d[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  overflow: hidden;\n}\n\n.home-main-area[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  transition: margin-right 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.home-main-area.panel-open[_ngcontent-%COMP%] {\n  margin-right: 320px;\n}\n\n\n\n\n\n\n.search-hero[_ngcontent-%COMP%] {\n  background: linear-gradient(180deg, white 0%, #f5f7fa 100%);\n  padding: 36px 40px 24px;\n  text-align: center;\n}\n\n.search-hero-container[_ngcontent-%COMP%] {\n  position: relative;\n  max-width: 600px;\n  margin: 0 auto;\n}\n\n.search-hero-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 14px 18px 14px 44px;\n  font-size: 15px;\n  border: 2px solid #e5e7eb;\n  border-radius: 12px;\n  background: white;\n  color: #111827;\n  outline: none;\n  transition: all 0.2s;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);\n  font-family: inherit;\n}\n\n.search-hero-input[_ngcontent-%COMP%]:focus {\n  border-color: #1976d2;\n  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1), 0 0 0 4px rgba(25, 118, 210, 0.08);\n}\n\n.search-hero-input[_ngcontent-%COMP%]::placeholder {\n  color: #9ca3af;\n}\n\n.search-hero-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #9ca3af;\n  font-size: 15px;\n  pointer-events: none;\n}\n\n.search-hero-shortcut[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  background: #f5f7fa;\n  border: 1px solid #e5e7eb;\n  padding: 2px 7px;\n  border-radius: 5px;\n  font-size: 12px;\n  color: #9ca3af;\n}\n\n.search-hero-clear[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #757575;\n  transition: all 0.15s ease;\n}\n\n.search-hero-clear[_ngcontent-%COMP%]:hover {\n  background: #e0e0e0;\n  color: #424242;\n}\n\n\n\n.search-meta-row[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  margin-top: 16px;\n}\n\n.search-entity-count[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: #9ca3af;\n}\n\n.pill-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 6px;\n}\n\n.pill-btn[_ngcontent-%COMP%] {\n  padding: 6px 16px;\n  border-radius: 20px;\n  border: 1px solid #e5e7eb;\n  background: white;\n  font-size: 13px;\n  color: #6b7280;\n  cursor: pointer;\n  transition: all 0.15s;\n  font-family: inherit;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.pill-btn[_ngcontent-%COMP%]:hover {\n  border-color: #1976d2;\n  color: #1976d2;\n}\n\n.pill-btn.active[_ngcontent-%COMP%] {\n  background: #1976d2;\n  color: white;\n  border-color: #1976d2;\n}\n\n.pill-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 11px;\n}\n\n\n\n\n\n\n.entity-groups-area[_ngcontent-%COMP%] {\n  padding: 12px 40px 60px;\n  max-width: 1200px;\n  margin: 0 auto;\n}\n\n.app-group[_ngcontent-%COMP%] {\n  margin-bottom: 4px;\n}\n\n.app-group-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 14px;\n  cursor: pointer;\n  border-radius: 8px;\n  transition: background 0.12s;\n  user-select: none;\n}\n\n.app-group-header[_ngcontent-%COMP%]:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n\n.app-group-icon[_ngcontent-%COMP%] {\n  width: 38px;\n  height: 38px;\n  border-radius: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 17px;\n  flex-shrink: 0;\n  background: #eff6ff;\n  color: #2563eb;\n}\n\n.app-group-name[_ngcontent-%COMP%] {\n  font-size: 21px;\n  font-weight: 600;\n  flex: 1;\n}\n\n.app-group-count[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: #9ca3af;\n  background: #f5f7fa;\n  padding: 2px 9px;\n  border-radius: 10px;\n}\n\n.app-group-chevron[_ngcontent-%COMP%] {\n  color: #9ca3af;\n  font-size: 12px;\n  transition: transform 0.2s;\n}\n\n.app-group-chevron.expanded[_ngcontent-%COMP%] {\n  transform: rotate(90deg);\n}\n\n.app-group-entities[_ngcontent-%COMP%] {\n  padding: 4px 14px 10px 60px;\n}\n\n\n\n\n\n\n.entity-item-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));\n  gap: 12px;\n}\n\n.entity-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  gap: 12px;\n  padding: 10px 14px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.12s;\n  border: 1px solid #f0f1f3;\n  background: white;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover {\n  border-color: #bfdbfe;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);\n  background: #eff6ff;\n}\n\n.entity-item-icon[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  color: #6b7280;\n  background: #f5f7fa;\n  flex-shrink: 0;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover   .entity-item-icon[_ngcontent-%COMP%] {\n  background: #dbeafe;\n  color: #2563eb;\n}\n\n.entity-item-text[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.entity-item-name[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.entity-item-desc[_ngcontent-%COMP%] {\n  font-size: 12px;\n  color: #9ca3af;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  line-height: 1.3;\n}\n\n.entity-item-fav[_ngcontent-%COMP%] {\n  color: #9ca3af;\n  opacity: 0;\n  transition: opacity 0.12s;\n  font-size: 11px;\n  cursor: pointer;\n  flex-shrink: 0;\n  background: none;\n  border: none;\n  padding: 4px;\n  align-self: center;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover   .entity-item-fav[_ngcontent-%COMP%] {\n  opacity: 1;\n}\n\n.entity-item-fav.favorited[_ngcontent-%COMP%] {\n  opacity: 1;\n  color: #f59e0b;\n}\n\n\n\n\n\n\n.quick-access-panel[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  right: 0;\n  width: 320px;\n  height: 100%;\n  background: white;\n  border-left: 1px solid #e5e7eb;\n  z-index: 50;\n  transform: translateX(100%);\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  display: flex;\n  flex-direction: column;\n}\n\n.quick-access-panel.open[_ngcontent-%COMP%] {\n  transform: translateX(0);\n}\n\n.qa-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 16px;\n  border-bottom: 1px solid #e5e7eb;\n}\n\n.qa-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  font-size: 14px;\n  font-weight: 600;\n  margin: 0;\n}\n\n.qa-close-btn[_ngcontent-%COMP%] {\n  background: none;\n  border: none;\n  color: #9ca3af;\n  cursor: pointer;\n  font-size: 14px;\n  padding: 4px;\n  border-radius: 4px;\n}\n\n.qa-close-btn[_ngcontent-%COMP%]:hover {\n  background: #f5f7fa;\n}\n\n.qa-body[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n}\n\n.qa-section[_ngcontent-%COMP%] {\n  border-bottom: 1px solid #f0f1f3;\n}\n\n.qa-section-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 16px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.8px;\n  color: #9ca3af;\n  cursor: pointer;\n  user-select: none;\n}\n\n.qa-section-header[_ngcontent-%COMP%]   .qa-section-icon[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n.qa-section-header[_ngcontent-%COMP%]   .qa-section-count[_ngcontent-%COMP%] {\n  background: #f5f7fa;\n  padding: 0 6px;\n  border-radius: 8px;\n  font-size: 10px;\n  margin-left: auto;\n}\n\n.qa-section-header[_ngcontent-%COMP%]   .qa-section-chevron[_ngcontent-%COMP%] {\n  font-size: 10px;\n  transition: transform 0.15s;\n}\n\n.qa-section.collapsed[_ngcontent-%COMP%]   .qa-section-chevron[_ngcontent-%COMP%] {\n  transform: rotate(-90deg);\n}\n\n.qa-section-body[_ngcontent-%COMP%] {\n  padding: 0 8px 8px;\n}\n\n.qa-section.collapsed[_ngcontent-%COMP%]   .qa-section-body[_ngcontent-%COMP%] {\n  display: none;\n}\n\n.qa-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 8px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: background 0.08s;\n}\n\n.qa-item[_ngcontent-%COMP%]:hover {\n  background: #f5f7fa;\n}\n\n.qa-item-icon[_ngcontent-%COMP%] {\n  width: 28px;\n  height: 28px;\n  border-radius: 6px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 12px;\n  background: #f5f7fa;\n  color: #6b7280;\n  flex-shrink: 0;\n}\n\n.qa-item-info[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.qa-item-name[_ngcontent-%COMP%] {\n  font-size: 13px;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.qa-item-meta[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: #9ca3af;\n}\n\n.qa-item-time[_ngcontent-%COMP%] {\n  font-size: 11px;\n  color: #9ca3af;\n  white-space: nowrap;\n}\n\n.qa-empty[_ngcontent-%COMP%] {\n  padding: 20px 16px;\n  text-align: center;\n  color: #9ca3af;\n  font-size: 13px;\n}\n\n\n\n.qa-badge[_ngcontent-%COMP%] {\n  background: #1976d2;\n  color: white;\n  font-size: 10px;\n  font-weight: 600;\n  padding: 0 5px;\n  border-radius: 8px;\n  min-width: 16px;\n  text-align: center;\n}\n\n\n\n.home-no-results[_ngcontent-%COMP%] {\n  text-align: center;\n  padding: 40px 20px;\n  color: #9ca3af;\n}\n\n.home-no-results[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 28px;\n  margin-bottom: 10px;\n  display: block;\n}\n\n.home-no-results[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  font-size: 14px;\n  margin: 0;\n}\n\n.detail-panel[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-left: 1px solid #e0e0e0;\n  box-shadow: -4px 0 16px rgba(0, 0, 0, 0.08);\n  overflow: hidden;\n  animation: _ngcontent-%COMP%_slideIn 0.2s ease-out;\n  display: flex;\n  flex-direction: column;\n}\n\n.detail-panel[_ngcontent-%COMP%]   mj-entity-record-detail-panel[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n@keyframes _ngcontent-%COMP%_slideIn {\n  from {\n    transform: translateX(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n\n\n\n.detail-panel-actions[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border-bottom: 1px solid #e2e8f0;\n}\n\n.detail-action-btn[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border: none;\n  border-radius: 6px;\n  background: white;\n  color: #475569;\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n}\n\n.detail-action-btn[_ngcontent-%COMP%]:hover {\n  background: #3b82f6;\n  color: white;\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2);\n}\n\n.detail-action-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n[_nghost-%COMP%]     mj-explorer-grid-view, \n[_nghost-%COMP%]     mj-explorer-cards-view {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n\n\n\n\n\n\n\n\n.content-header.home-header[_ngcontent-%COMP%] {\n  border-bottom: none;\n  background: transparent;\n  box-shadow: none;\n  padding: 16px 24px 8px;\n}\n\n.content-body.home-content[_ngcontent-%COMP%] {\n  padding: 0;\n}\n\n\n\n.filter-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #999;\n  font-size: 14px;\n  pointer-events: none;\n}\n\n.smart-filter-container[_ngcontent-%COMP%]   .smart-filter-input[_ngcontent-%COMP%] {\n  padding-left: 40px;\n}\n\n\n\n\n\n\n.view-mode-toggle[_ngcontent-%COMP%]   .toggle-btn[_ngcontent-%COMP%] {\n  width: auto;\n  padding: 0 12px;\n  gap: 6px;\n}\n\n.toggle-label[_ngcontent-%COMP%] {\n  font-size: 12px;\n  font-weight: 500;\n}\n\n\n\n\n\n\n.empty-state.small[_ngcontent-%COMP%] {\n  height: auto;\n  padding: 32px;\n  background: #fafafa;\n}\n\n.empty-state.small[_ngcontent-%COMP%]   .empty-icon[_ngcontent-%COMP%] {\n  font-size: 40px;\n  margin-bottom: 16px;\n}\n\n.empty-state.small[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n\n.empty-state.small[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  font-size: 13px;\n}\n\n\n\n\n\n\n@media (max-width: 1200px) {\n  .entity-item-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n  }\n}\n\n@media (max-width: 900px) {\n  .content-header[_ngcontent-%COMP%] {\n    flex-wrap: wrap;\n    gap: 12px;\n  }\n\n  .header-center[_ngcontent-%COMP%] {\n    order: 3;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n\n  .search-hero[_ngcontent-%COMP%] {\n    padding: 24px 16px 16px;\n  }\n\n  .entity-groups-area[_ngcontent-%COMP%] {\n    padding: 8px 16px 40px;\n  }\n\n  .app-group-entities[_ngcontent-%COMP%] {\n    padding-left: 36px;\n  }\n\n  .home-main-area.panel-open[_ngcontent-%COMP%] {\n    margin-right: 0;\n  }\n\n  .quick-access-panel[_ngcontent-%COMP%] {\n    width: 100%;\n  }\n}\n\n@media (max-width: 600px) {\n  .data-explorer-container[_ngcontent-%COMP%] {\n    flex-direction: column;\n  }\n\n  .navigation-panel[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .content-header[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n  }\n\n  .content-body[_ngcontent-%COMP%] {\n    padding: 12px 16px;\n  }\n\n  .entity-item-grid[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .view-mode-toggle[_ngcontent-%COMP%] {\n    display: none;\n  }\n\n  .app-group-name[_ngcontent-%COMP%] {\n    font-size: 17px;\n  }\n\n  .entity-item-name[_ngcontent-%COMP%] {\n    font-size: 14px;\n  }\n}"], data: { animation: [
                 trigger('slideInLeft', [
                     transition(':enter', [
                         style({ transform: 'translateX(-100%)', opacity: 0 }),
@@ -3362,7 +3517,7 @@ export { DataExplorerDashboardComponent };
                             animate('200ms ease-in', style({ transform: 'translateX(-100%)', opacity: 0 }))
                         ])
                     ])
-                ], template: "<div class=\"data-explorer-container\">\n  <!-- Navigation Panel (Left) - Hidden at home level, animated -->\n  @if (!isAtHomeLevel) {\n    <div\n      class=\"navigation-panel\"\n      [class.collapsed]=\"state.navigationPanelCollapsed\"\n      [style.width.px]=\"state.navigationPanelCollapsed ? 48 : state.navigationPanelWidth\"\n      [@slideInLeft]>\n\n      <mj-explorer-navigation-panel\n        [entities]=\"entities\"\n        [selectedEntityName]=\"state.selectedEntityName\"\n        [favorites]=\"state.favorites\"\n        [recentItems]=\"state.recentItems\"\n        [collapsed]=\"state.navigationPanelCollapsed\"\n        [allowedEntityNames]=\"allowedEntityNames\"\n        [favoritesSectionExpanded]=\"state.favoritesSectionExpanded\"\n        [recentSectionExpanded]=\"state.recentSectionExpanded\"\n        [entitiesSectionExpanded]=\"state.entitiesSectionExpanded\"\n        [viewsSectionExpanded]=\"state.viewsSectionExpanded\"\n        (entitySelected)=\"onEntitySelected($event)\"\n        (toggleCollapse)=\"toggleNavigationPanel()\"\n        (sectionToggled)=\"stateService.toggleSection($event)\"\n        (openRecord)=\"onOpenRecordFromNav($event)\"\n        (selectRecord)=\"onSelectRecordFromNav($event)\"\n        (expandAndFocus)=\"onExpandAndFocus($event)\">\n      </mj-explorer-navigation-panel>\n    </div>\n  }\n\n  <!-- Main Content Area -->\n  <div class=\"content-area\">\n    <!-- Breadcrumb Bar - Hidden at home level -->\n    @if (!isAtHomeLevel && breadcrumbs.length > 0) {\n      <div class=\"breadcrumb-bar\">\n        @for (crumb of breadcrumbs; track crumb.label; let i = $index; let last = $last) {\n          <span\n            class=\"breadcrumb-item\"\n            [class.clickable]=\"!last\"\n            [class.current]=\"last\"\n            (click)=\"onBreadcrumbClick(crumb, i)\"\n            [title]=\"crumb.label\">\n            @if (crumb.icon) {\n              <i [class]=\"crumb.icon\" class=\"breadcrumb-icon\"></i>\n            }\n            <span class=\"breadcrumb-label\">{{ crumb.label }}</span>\n          </span>\n          @if (!last) {\n            <i class=\"fa-solid fa-chevron-right breadcrumb-separator\"></i>\n          }\n        }\n      </div>\n    }\n\n    <!-- Header -->\n    <div class=\"content-header\" [class.home-header]=\"isAtHomeLevel\">\n      <div class=\"header-left\">\n        @if (selectedEntity) {\n          <i [class]=\"getEntityIcon(selectedEntity)\" class=\"entity-icon\"></i>\n          <h2 class=\"entity-title\">{{ selectedEntity.DisplayNameOrName }}</h2>\n          @if (debouncedFilterText && filteredRecordCount !== totalRecordCount) {\n            <span class=\"record-count\">{{ filteredRecordCount | number }} of {{ totalRecordCount | number }} records</span>\n          } @else {\n            <span class=\"record-count\">{{ totalRecordCount | number }} records</span>\n          }\n\n          <!-- View Selector -->\n          <mj-view-selector\n            [entity]=\"selectedEntity\"\n            [selectedViewId]=\"state.selectedViewId\"\n            [viewModified]=\"state.viewModified\"\n            (viewSelected)=\"onViewSelected($event)\"\n            (saveViewRequested)=\"onSaveViewRequested($event)\"\n            (manageViewsRequested)=\"onManageViewsRequested()\"\n            (openInTabRequested)=\"onOpenInTabRequested($event)\"\n            (configureViewRequested)=\"onConfigureViewRequested()\"\n            (createNewRecordRequested)=\"onCreateNewRecord()\"\n            (exportRequested)=\"onExport()\"\n            (duplicateViewRequested)=\"onDuplicateView($event)\"\n            (quickSaveRequested)=\"onQuickSaveRequested($event)\"\n            (revertRequested)=\"onRevertView()\">\n          </mj-view-selector>\n\n          <!-- Add to List Button -->\n          <button\n            class=\"header-action-btn\"\n            [class.disabled]=\"!hasSelectedRecords\"\n            [disabled]=\"!hasSelectedRecords\"\n            (click)=\"onAddToListClick()\"\n            [title]=\"hasSelectedRecords ? 'Add ' + selectedRecords.length + ' selected record(s) to a list' : 'Select records to add to a list'\">\n            <i class=\"fa-solid fa-list-check\"></i>\n            @if (hasSelectedRecords) {\n              <span class=\"selection-badge\">{{ selectedRecords.length }}</span>\n            }\n          </button>\n        } @else {\n          @if (displayIcon) {\n            <i [class]=\"displayIcon\" class=\"entity-icon\"></i>\n          }\n          <h2 class=\"entity-title\">{{ displayTitle }}</h2>\n          <span class=\"record-count\">{{ entities.length }} entities available</span>\n        }\n      </div>\n\n      <div class=\"header-center\">\n        @if (selectedEntity) {\n          <div class=\"smart-filter-container\">\n            <i class=\"fa-solid fa-search filter-icon\"></i>\n            <input\n              #filterInput\n              type=\"text\"\n              class=\"smart-filter-input\"\n              placeholder=\"Filter records... (press / to focus)\"\n              [ngModel]=\"debouncedFilterText\"\n              (ngModelChange)=\"onFilterTextChanged($event)\"\n            />\n            @if (debouncedFilterText) {\n              <button class=\"clear-filter-btn\" (click)=\"onFilterTextChanged('')\">\n                <i class=\"fa-solid fa-times\"></i>\n              </button>\n            }\n          </div>\n        } @else {\n          <!-- Entity filter for home screen -->\n          <div class=\"smart-filter-container\">\n            <i class=\"fa-solid fa-search filter-icon\"></i>\n            <input\n              #filterInput\n              type=\"text\"\n              class=\"smart-filter-input\"\n              placeholder=\"Filter entities... (press / to focus)\"\n              [(ngModel)]=\"entityFilterText\"\n            />\n            @if (entityFilterText) {\n              <button class=\"clear-filter-btn\" (click)=\"entityFilterText = ''\">\n                <i class=\"fa-solid fa-times\"></i>\n              </button>\n            }\n          </div>\n        }\n      </div>\n\n      <div class=\"header-right\">\n        @if (selectedEntity) {\n          <!-- View Mode Toggle -->\n          <div class=\"view-mode-toggle\">\n            <button\n              class=\"toggle-btn\"\n              [class.active]=\"state.viewMode === 'grid'\"\n              (click)=\"onViewModeChanged('grid')\"\n              title=\"Grid View\">\n              <i class=\"fa-solid fa-list\"></i>\n            </button>\n            <button\n              class=\"toggle-btn\"\n              [class.active]=\"state.viewMode === 'cards'\"\n              (click)=\"onViewModeChanged('cards')\"\n              title=\"Cards View\">\n              <i class=\"fa-solid fa-grip\"></i>\n            </button>\n            @if (entityHasDateFields) {\n              <button\n                class=\"toggle-btn\"\n                [class.active]=\"state.viewMode === 'timeline'\"\n                (click)=\"onViewModeChanged('timeline')\"\n                title=\"Timeline View\">\n                <i class=\"fa-solid fa-timeline\"></i>\n              </button>\n            }\n          </div>\n\n          <!-- Timeline Controls (only shown when timeline view is active) -->\n          @if (state.viewMode === 'timeline' && entityHasDateFields) {\n            <!-- Date Field Selector -->\n            <div class=\"date-field-selector-container\">\n              <!-- Backdrop for closing dropdown -->\n              @if (isDateFieldDropdownOpen) {\n                <div class=\"date-field-backdrop\" (click)=\"closeDateFieldDropdown()\"></div>\n              }\n\n              <div class=\"date-field-selector-wrapper\">\n                <button\n                  class=\"date-field-selector-button\"\n                  [class.open]=\"isDateFieldDropdownOpen\"\n                  [disabled]=\"availableDateFields.length <= 1\"\n                  (click)=\"toggleDateFieldDropdown()\">\n                  <i class=\"fa-solid fa-calendar-days date-field-icon\"></i>\n                  <span class=\"date-field-name\">{{ effectiveTimelineDateFieldDisplayName }}</span>\n                  @if (availableDateFields.length > 1) {\n                    <i class=\"fa-solid fa-chevron-down date-field-arrow\" [class.rotated]=\"isDateFieldDropdownOpen\"></i>\n                  }\n                </button>\n\n                @if (isDateFieldDropdownOpen && availableDateFields.length > 1) {\n                  <div class=\"date-field-dropdown-panel\">\n                    @for (field of availableDateFields; track field.name) {\n                      <div\n                        class=\"date-field-dropdown-item\"\n                        [class.selected]=\"field.name === effectiveTimelineDateField\"\n                        (click)=\"setTimelineDateField(field.name)\">\n                        <i class=\"fa-regular fa-calendar item-icon\"></i>\n                        <span class=\"item-name\">{{ field.displayName }}</span>\n                        @if (field.name === effectiveTimelineDateField) {\n                          <i class=\"fa-solid fa-check selected-check\"></i>\n                        }\n                      </div>\n                    }\n                  </div>\n                }\n              </div>\n            </div>\n\n            <!-- Orientation Toggle -->\n            <div class=\"timeline-orientation-toggle\">\n              <button\n                class=\"toggle-btn\"\n                (click)=\"toggleTimelineOrientation()\"\n                [title]=\"state.timelineOrientation === 'vertical' ? 'Switch to Horizontal' : 'Switch to Vertical'\">\n                <i [class]=\"state.timelineOrientation === 'vertical' ? 'fa-solid fa-ellipsis-vertical' : 'fa-solid fa-ellipsis'\"></i>\n              </button>\n            </div>\n\n            <!-- Sort Order Toggle -->\n            <div class=\"timeline-sort-toggle\">\n              <button\n                class=\"toggle-btn\"\n                (click)=\"toggleTimelineSortOrder()\"\n                [title]=\"state.timelineSortOrder === 'desc' ? 'Showing Newest First (click for Oldest First)' : 'Showing Oldest First (click for Newest First)'\">\n                <i [class]=\"state.timelineSortOrder === 'desc' ? 'fa-solid fa-arrow-down-wide-short' : 'fa-solid fa-arrow-up-wide-short'\"></i>\n              </button>\n            </div>\n          }\n        }\n        <!-- Common/All toggle moved to inline with All Entities section header -->\n      </div>\n    </div>\n\n    <!-- Content Body - Using mj-entity-viewer composite -->\n    <div class=\"content-body\" [class.home-content]=\"isAtHomeLevel\">\n      @if (!selectedEntity) {\n        <!-- Entity Home View - Two-Column Layout -->\n        <div class=\"entity-home-view\">\n          @if (isLoadingEntities) {\n            <div class=\"loading-state\">\n              <mj-loading text=\"Loading entities...\" size=\"medium\"></mj-loading>\n            </div>\n          } @else {\n            <!-- Two-Column Layout: Records (left) | Entities (right) -->\n            @if (hasTopSectionContent) {\n              <div class=\"home-two-column-layout\" [class.single-column]=\"!hasRecordsColumnContent || !hasEntitiesColumnContent\">\n                <!-- Left Column: Recent & Favorite Records (most actionable) -->\n                @if (hasRecordsColumnContent) {\n                <div class=\"home-column\">\n                  <!-- Recent Records Section -->\n                  @if (recentRecords.length > 0) {\n                    <div class=\"home-section\">\n                      <div class=\"section-header\">\n                        <i class=\"fa-solid fa-history section-icon\"></i>\n                        <h3 class=\"section-title\">Recent Records</h3>\n                        <!-- Entity filter strip - only show with 2+ entities -->\n                        @if (showRecentRecordsEntityFilter) {\n                          <div class=\"entity-filter-strip\">\n                            <button\n                              class=\"entity-filter-btn\"\n                              [class.active]=\"recentRecordsEntityFilter === null\"\n                              (click)=\"setRecentRecordsEntityFilter(null)\"\n                              title=\"Show all entities\">\n                              <i class=\"fa-solid fa-layer-group\"></i>\n                            </button>\n                            @for (entity of uniqueRecentRecordEntities; track entity.entityId) {\n                              <button\n                                class=\"entity-filter-btn\"\n                                [class.active]=\"recentRecordsEntityFilter === entity.entityId\"\n                                (click)=\"setRecentRecordsEntityFilter(entity.entityId)\"\n                                [title]=\"entity.entityName\">\n                                <i [class]=\"entity.icon\"></i>\n                              </button>\n                            }\n                          </div>\n                        }\n                      </div>\n                      <div class=\"recent-records-list\">\n                        @for (record of filteredRecentRecords; track record.entityId + '|' + record.recordId) {\n                          <div\n                            class=\"recent-record-item\"\n                            (click)=\"onRecentRecordClick(record)\"\n                            [title]=\"record.entityName + ' - ' + record.recordId\">\n                            <div class=\"recent-record-icon\">\n                              <i [class]=\"getEntityIconById(record.entityId)\"></i>\n                            </div>\n                            <div class=\"recent-record-content\">\n                              <span class=\"recent-record-name\">{{ record.recordName || record.recordId }}</span>\n                              <span class=\"recent-record-entity\">{{ record.entityName }}</span>\n                            </div>\n                            <span class=\"recent-record-time\">{{ formatRelativeTime(record.latestAt) }}</span>\n                          </div>\n                        }\n                      </div>\n                    </div>\n                  }\n\n                  <!-- Favorite Records Section -->\n                  @if (favoriteRecords.length > 0) {\n                    <div class=\"home-section\">\n                      <div class=\"section-header\">\n                        <i class=\"fa-solid fa-star section-icon\"></i>\n                        <h3 class=\"section-title\">Favorite Records</h3>\n                      </div>\n                      <div class=\"recent-records-list\">\n                        @for (record of favoriteRecords; track record.userFavoriteId) {\n                          <div\n                            class=\"recent-record-item\"\n                            (click)=\"onFavoriteRecordClick(record)\"\n                            [title]=\"record.entityName + ' - ' + record.recordId\">\n                            <div class=\"recent-record-icon\">\n                              <i [class]=\"getEntityIconById(record.entityId)\"></i>\n                            </div>\n                            <div class=\"recent-record-content\">\n                              <span class=\"recent-record-name\">{{ record.recordName || record.recordId }}</span>\n                              <span class=\"recent-record-entity\">{{ record.entityName }}</span>\n                            </div>\n                          </div>\n                        }\n                      </div>\n                    </div>\n                  }\n                </div>\n                }\n\n                <!-- Right Column: Recent & Favorite Entities -->\n                @if (hasEntitiesColumnContent) {\n                <div class=\"home-column\">\n                  <!-- Recent Entities Section (list format) -->\n                  @if (recentEntities.length > 0) {\n                    <div class=\"home-section\">\n                      <div class=\"section-header\">\n                        <i class=\"fa-solid fa-clock section-icon\"></i>\n                        <h3 class=\"section-title\">Recent Entities</h3>\n                      </div>\n                      <div class=\"entity-list\">\n                        @for (entity of recentEntities; track entity.ID) {\n                          <div\n                            class=\"entity-list-item\"\n                            (click)=\"onEntitySelected(entity)\"\n                            [title]=\"entity.Description || entity.DisplayNameOrName\">\n                            <div class=\"entity-list-icon\">\n                              <i [class]=\"getEntityIcon(entity)\"></i>\n                            </div>\n                            <div class=\"entity-list-content\">\n                              <span class=\"entity-list-name\">{{ entity.DisplayNameOrName }}</span>\n                            </div>\n                            <button\n                              class=\"favorite-btn\"\n                              [class.favorited]=\"isEntityFavorited(entity)\"\n                              (click)=\"toggleEntityFavorite(entity, $event)\"\n                              [title]=\"isEntityFavorited(entity) ? 'Remove from favorites' : 'Add to favorites'\">\n                              <i [class]=\"isEntityFavorited(entity) ? 'fa-solid fa-star' : 'fa-regular fa-star'\"></i>\n                            </button>\n                          </div>\n                        }\n                      </div>\n                    </div>\n                  }\n\n                  <!-- Favorite Entities Section (list format) -->\n                  @if (favoriteEntities.length > 0) {\n                    <div class=\"home-section\">\n                      <div class=\"section-header\">\n                        <i class=\"fa-solid fa-star section-icon\"></i>\n                        <h3 class=\"section-title\">Favorite Entities</h3>\n                      </div>\n                      <div class=\"entity-list\">\n                        @for (entity of favoriteEntities; track entity.ID) {\n                          <div\n                            class=\"entity-list-item\"\n                            (click)=\"onEntitySelected(entity)\"\n                            [title]=\"entity.Description || entity.DisplayNameOrName\">\n                            <div class=\"entity-list-icon\">\n                              <i [class]=\"getEntityIcon(entity)\"></i>\n                            </div>\n                            <div class=\"entity-list-content\">\n                              <span class=\"entity-list-name\">{{ entity.DisplayNameOrName }}</span>\n                            </div>\n                            <button\n                              class=\"favorite-btn favorited\"\n                              (click)=\"toggleEntityFavorite(entity, $event)\"\n                              title=\"Remove from favorites\">\n                              <i class=\"fa-solid fa-star\"></i>\n                            </button>\n                          </div>\n                        }\n                      </div>\n                    </div>\n                  }\n                </div>\n                }\n              </div>\n            }\n\n            <!-- All/Common Entities Section - Full Width -->\n            <div class=\"home-section\">\n              <div class=\"section-header-with-toggle\">\n                <div class=\"section-header-left\">\n                  <i class=\"fa-solid fa-database section-icon\"></i>\n                  <h3 class=\"section-title\">\n                    @if (state.showAllEntities || !showCommonAllToggle) {\n                      All Entities\n                    } @else {\n                      Common Entities\n                    }\n                  </h3>\n                  @if (entityFilterText && filteredEntities.length !== entities.length) {\n                    <span class=\"section-count\">{{ filteredEntities.length }} matching</span>\n                  }\n                </div>\n                @if (showCommonAllToggle) {\n                  <div class=\"inline-toggle\">\n                    <button\n                      class=\"toggle-btn\"\n                      [class.active]=\"!state.showAllEntities\"\n                      (click)=\"toggleShowAllEntities()\"\n                      title=\"Show common entities ({{ commonEntitiesCount }})\">\n                      Common\n                    </button>\n                    <button\n                      class=\"toggle-btn\"\n                      [class.active]=\"state.showAllEntities\"\n                      (click)=\"toggleShowAllEntities()\"\n                      title=\"Show all entities ({{ allEntitiesCount }})\">\n                      All\n                    </button>\n                  </div>\n                }\n              </div>\n              <div class=\"entity-card-grid\">\n                @for (entity of filteredEntities; track entity.ID) {\n                  <div\n                    class=\"entity-card\"\n                    (click)=\"onEntitySelected(entity)\"\n                    [title]=\"entity.Description || entity.DisplayNameOrName\">\n                    <div class=\"entity-card-icon\">\n                      <i [class]=\"getEntityIcon(entity)\"></i>\n                    </div>\n                    <div class=\"entity-card-content\">\n                      <h4 class=\"entity-card-title\">{{ entity.DisplayNameOrName }}</h4>\n                      @if (entity.Description) {\n                        <p class=\"entity-card-description\">{{ entity.Description }}</p>\n                      }\n                    </div>\n                    <button\n                      class=\"favorite-btn\"\n                      [class.favorited]=\"isEntityFavorited(entity)\"\n                      (click)=\"toggleEntityFavorite(entity, $event)\"\n                      [title]=\"isEntityFavorited(entity) ? 'Remove from favorites' : 'Add to favorites'\">\n                      <i [class]=\"isEntityFavorited(entity) ? 'fa-solid fa-star' : 'fa-regular fa-star'\"></i>\n                    </button>\n                  </div>\n                }\n              </div>\n              @if (filteredEntities.length === 0 && entities.length > 0) {\n                <div class=\"empty-state small\">\n                  <i class=\"fa-solid fa-search empty-icon\"></i>\n                  <h3>No Matching Entities</h3>\n                  <p>No entities match \"{{ entityFilterText }}\"</p>\n                </div>\n              }\n              @if (entities.length === 0) {\n                <div class=\"empty-state\">\n                  <i class=\"fa-solid fa-database empty-icon\"></i>\n                  <h3>No Entities Available</h3>\n                  <p>There are no entities configured for this application.</p>\n                </div>\n              }\n            </div>\n          }\n        </div>\n      } @else {\n        <mj-entity-viewer\n          #entityViewer\n          [entity]=\"selectedEntity\"\n          [viewEntity]=\"selectedViewEntity\"\n          [viewMode]=\"state.viewMode\"\n          [filterText]=\"debouncedFilterText\"\n          [selectedRecordId]=\"state.selectedRecordId\"\n          [config]=\"viewerConfig\"\n          [gridState]=\"currentGridState\"\n          [timelineConfig]=\"currentTimelineConfig\"\n          [gridSelectionMode]=\"'checkbox'\"\n          [showGridToolbar]=\"false\"\n          [showAddToListButton]=\"false\"\n          (viewModeChange)=\"onViewModeChanged($event)\"\n          (filterTextChange)=\"onFilterTextChanged($event)\"\n          (recordSelected)=\"onViewerRecordSelected($event)\"\n          (recordOpened)=\"onViewerRecordOpened($event)\"\n          (dataLoaded)=\"onDataLoaded($event)\"\n          (filteredCountChanged)=\"onFilteredCountChanged($event)\"\n          (gridStateChanged)=\"onGridStateChanged($event)\"\n          (selectionChanged)=\"onSelectionChanged($event)\"\n          (addToListRequested)=\"onAddToListRequested($event)\">\n        </mj-entity-viewer>\n      }\n    </div>\n  </div>\n\n  <!-- Detail Panel (Right - Slide In) -->\n  @if (state.detailPanelOpen && selectedRecord) {\n    <div class=\"detail-panel\" [style.width.px]=\"state.detailPanelWidth\">\n      <!-- Detail Panel Actions Bar -->\n      <div class=\"detail-panel-actions\">\n        <button\n          class=\"detail-action-btn\"\n          (click)=\"openListManagementDialog()\"\n          title=\"Add to List\">\n          <i class=\"fa-solid fa-list-check\"></i>\n          <span>Add to List</span>\n        </button>\n      </div>\n      <mj-entity-record-detail-panel\n        [entity]=\"detailPanelEntity\"\n        [record]=\"selectedRecord\"\n        (close)=\"onDetailPanelClosed()\"\n        (openRecord)=\"onOpenRecord($event)\"\n        (navigateToRelated)=\"onNavigateToRelated($event)\"\n        (openRelatedRecord)=\"onOpenRelatedRecord($event)\"\n        (openForeignKeyRecord)=\"onOpenForeignKeyRecord($event)\">\n      </mj-entity-record-detail-panel>\n    </div>\n  }\n\n  <!-- View Configuration Panel -->\n  <mj-view-config-panel\n    [entity]=\"selectedEntity\"\n    [viewEntity]=\"selectedViewEntity\"\n    [isOpen]=\"state.viewConfigPanelOpen\"\n    [currentGridState]=\"currentGridState\"\n    [externalFilterState]=\"filterDialogState\"\n    [isSaving]=\"isSavingView\"\n    [DefaultSaveAsNew]=\"defaultSaveAsNew\"\n    (close)=\"onCloseViewConfigPanel()\"\n    (save)=\"onSaveView($event)\"\n    (saveDefaults)=\"onSaveDefaultViewSettings($event)\"\n    (delete)=\"onDeleteView()\"\n    (duplicate)=\"onDuplicateFromPanel()\"\n    (openFilterDialogRequest)=\"onOpenFilterDialogRequest($event)\">\n  </mj-view-config-panel>\n\n  <!-- Filter Dialog (rendered at dashboard level for full viewport width) -->\n  <mj-filter-dialog\n    [isOpen]=\"isFilterDialogOpen\"\n    [fields]=\"filterDialogFields\"\n    [filter]=\"filterDialogState\"\n    [disabled]=\"filterDialogDisabled\"\n    (close)=\"onCloseFilterDialog()\"\n    (apply)=\"onFilterApplied($event)\">\n  </mj-filter-dialog>\n\n  <!-- Export Dialog -->\n  <mj-export-dialog\n    [visible]=\"showExportDialog\"\n    [config]=\"exportDialogConfig\"\n    (closed)=\"onExportDialogClosed($event)\">\n  </mj-export-dialog>\n\n  <!-- List Management Dialog -->\n  @if (showListManagementDialog && listManagementConfig) {\n    <mj-list-management-dialog\n      [config]=\"listManagementConfig\"\n      [visible]=\"showListManagementDialog\"\n      (complete)=\"onListManagementComplete($event)\"\n      (cancel)=\"onListManagementCancel()\">\n    </mj-list-management-dialog>\n  }\n\n  <!-- Quick Save Dialog (F-001) -->\n  <mj-quick-save-dialog\n    [IsOpen]=\"showQuickSaveDialog\"\n    [ViewEntity]=\"selectedViewEntity\"\n    [EntityName]=\"selectedEntity?.DisplayNameOrName ?? ''\"\n    [Summary]=\"quickSaveSummary\"\n    [IsSaving]=\"isSavingView\"\n    [DefaultSaveAsNew]=\"defaultSaveAsNew\"\n    (Save)=\"onQuickSave($event)\"\n    (Close)=\"onQuickSaveClose()\"\n    (OpenAdvanced)=\"onQuickSaveOpenAdvanced()\">\n  </mj-quick-save-dialog>\n\n  <!-- Duplicate View Dialog (F-005) -->\n  <mj-duplicate-view-dialog\n    [IsOpen]=\"showDuplicateDialog\"\n    [SourceViewName]=\"duplicateSourceViewName\"\n    [Summary]=\"duplicateSummary\"\n    (Duplicate)=\"onDuplicateConfirmed($event)\"\n    (Cancel)=\"onDuplicateCancel()\">\n  </mj-duplicate-view-dialog>\n\n  <!-- Shared View Warning Dialog (view-creation-flow Scenario 5) -->\n  <mj-shared-view-warning-dialog\n    [IsOpen]=\"showSharedViewWarning\"\n    [ViewName]=\"selectedViewEntity?.Name ?? ''\"\n    (Action)=\"onSharedViewAction($event)\"\n    (Cancel)=\"onSharedViewWarningCancel()\">\n  </mj-shared-view-warning-dialog>\n</div>\n", styles: [".data-explorer-container {\n  display: flex;\n  height: 100%;\n  width: 100%;\n  background: #f5f7fa;\n  overflow: hidden;\n}\n\n.navigation-panel {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-right: 1px solid #e0e0e0;\n  transition: width 0.2s ease-in-out;\n  overflow: hidden;\n  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04);\n}\n.navigation-panel.collapsed {\n  width: 48px;\n}\n\n.content-area {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-width: 0;\n  overflow: hidden;\n  background: #f5f7fa;\n}\n\n/* Breadcrumb Bar */\n.breadcrumb-bar {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 24px;\n  background: white;\n  border-bottom: 1px solid #eee;\n  flex-shrink: 0;\n  font-size: 13px;\n  min-height: 40px;\n}\n\n.breadcrumb-item {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  color: #666;\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.15s ease;\n  max-width: 200px;\n}\n\n.breadcrumb-item.clickable {\n  cursor: pointer;\n}\n\n.breadcrumb-item.clickable:hover {\n  background: #f0f0f0;\n  color: #1976d2;\n}\n\n.breadcrumb-item.current {\n  color: #1a1a1a;\n  font-weight: 500;\n  cursor: default;\n}\n\n.breadcrumb-icon {\n  font-size: 12px;\n  flex-shrink: 0;\n}\n\n.breadcrumb-label {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.breadcrumb-separator {\n  font-size: 10px;\n  color: #ccc;\n  flex-shrink: 0;\n}\n\n.content-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 24px;\n  background: white;\n  border-bottom: 1px solid #e0e0e0;\n  flex-shrink: 0;\n  gap: 24px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);\n}\n\n.header-left {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n  flex-wrap: wrap;\n}\n\n/* View Selector within header */\n.header-left ::ng-deep mj-view-selector {\n  margin-left: 8px;\n}\n\n.entity-icon {\n  font-size: 20px;\n  color: #1976d2;\n}\n\n.entity-title {\n  margin: 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #1a1a1a;\n}\n\n.record-count {\n  font-size: 13px;\n  color: #666;\n  font-weight: 500;\n}\n\n.header-center {\n  flex: 1;\n  max-width: 600px;\n}\n\n.smart-filter-container {\n  position: relative;\n  width: 100%;\n}\n\n.smart-filter-input {\n  width: 100%;\n  padding: 10px 40px 10px 16px;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  font-size: 14px;\n  background: #fafafa;\n  transition: all 0.15s ease;\n}\n.smart-filter-input:focus {\n  outline: none;\n  border-color: #1976d2;\n  background: white;\n  box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.1);\n}\n.smart-filter-input::placeholder {\n  color: #999;\n}\n\n.clear-filter-btn {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #757575;\n  transition: all 0.15s ease;\n}\n.clear-filter-btn:hover {\n  background: #e0e0e0;\n  color: #424242;\n}\n\n.header-right {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.view-mode-toggle {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.toggle-btn {\n  width: 36px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 6px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n}\n.toggle-btn:hover {\n  color: #333;\n}\n.toggle-btn.active {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n/* Header Action Button (Add to List, etc.) */\n.header-action-btn {\n  position: relative;\n  width: 36px;\n  height: 36px;\n  border: 1px solid #e0e0e0;\n  background: white;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n  margin-left: 8px;\n}\n.header-action-btn:hover:not(.disabled) {\n  border-color: #1976d2;\n  color: #1976d2;\n  background: #f5f9ff;\n}\n.header-action-btn.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.header-action-btn i {\n  font-size: 14px;\n}\n.selection-badge {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: #1976d2;\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  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n/* Timeline Date Field Selector - Styled Dropdown */\n.date-field-selector-container {\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n\n.date-field-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 999;\n  background: transparent;\n}\n\n.date-field-selector-wrapper {\n  position: relative;\n}\n\n.date-field-selector-button {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 12px;\n  background: var(--background-alt, #f5f5f5);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 6px;\n  cursor: pointer;\n  font-size: 13px;\n  color: var(--text-primary, #333);\n  transition: all 0.15s ease;\n  min-width: 120px;\n  max-width: 200px;\n}\n\n.date-field-selector-button:hover:not(:disabled) {\n  background: var(--background-hover, #e8e8e8);\n  border-color: var(--border-color-hover, #ccc);\n}\n\n.date-field-selector-button:disabled {\n  cursor: default;\n  opacity: 0.8;\n}\n\n.date-field-selector-button.open {\n  background: var(--background-active, #e0e0e0);\n  border-color: var(--primary-color, #007bff);\n}\n\n.date-field-icon {\n  color: var(--text-secondary, #666);\n  font-size: 12px;\n}\n\n.date-field-name {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: left;\n}\n\n.date-field-arrow {\n  color: var(--text-secondary, #666);\n  font-size: 10px;\n  transition: transform 0.2s ease;\n}\n\n.date-field-arrow.rotated {\n  transform: rotate(180deg);\n}\n\n.date-field-dropdown-panel {\n  position: absolute;\n  top: calc(100% + 4px);\n  left: 0;\n  min-width: 180px;\n  max-width: 280px;\n  max-height: 300px;\n  overflow-y: auto;\n  background: var(--background-panel, #fff);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  z-index: 1000;\n}\n\n.date-field-dropdown-item {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  cursor: pointer;\n  transition: background 0.1s ease;\n  font-size: 13px;\n}\n\n.date-field-dropdown-item:hover {\n  background: var(--background-hover, #f5f5f5);\n}\n\n.date-field-dropdown-item.selected {\n  background: var(--primary-light, #e6f0ff);\n}\n\n.date-field-dropdown-item.selected:hover {\n  background: var(--primary-light-hover, #d6e4f9);\n}\n\n.date-field-dropdown-item .item-icon {\n  color: var(--text-secondary, #666);\n  font-size: 13px;\n  width: 16px;\n  text-align: center;\n}\n\n.date-field-dropdown-item .item-name {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.date-field-dropdown-item .selected-check {\n  color: var(--primary-color, #007bff);\n  font-size: 12px;\n}\n\n/* Timeline Orientation Toggle */\n.timeline-orientation-toggle {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.content-body {\n  flex: 1;\n  overflow: hidden;\n  padding: 20px 24px;\n  display: flex;\n  flex-direction: column;\n}\n\n.loading-container,\n.loading-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  gap: 16px;\n  background: white;\n  border-radius: 8px;\n}\n\n.loading-spinner {\n  font-size: 32px;\n  color: #1976d2;\n}\n\n.loading-message {\n  margin: 0;\n  font-size: 14px;\n  color: #666;\n}\n\n.empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  text-align: center;\n  color: #757575;\n  background: white;\n  border-radius: 8px;\n  padding: 40px;\n}\n\n.empty-icon {\n  font-size: 64px;\n  color: #e0e0e0;\n  margin-bottom: 24px;\n}\n\n.empty-state h3 {\n  margin: 0 0 8px 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #333;\n}\n\n.empty-state p {\n  margin: 0;\n  font-size: 14px;\n  max-width: 400px;\n  color: #666;\n}\n\n/* Entity Home View - Card Grid */\n.entity-home-view {\n  flex: 1;\n  overflow: auto;\n  padding: 4px;\n}\n\n.entity-card-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 16px;\n  padding: 0;\n}\n\n.entity-card {\n  display: flex;\n  align-items: flex-start;\n  gap: 16px;\n  padding: 20px;\n  background: white;\n  border-radius: 10px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  border: 1px solid #e8e8e8;\n}\n\n.entity-card:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);\n  border-color: #1976d2;\n}\n\n.entity-card:active {\n  transform: translateY(0);\n}\n\n.entity-card-icon {\n  width: 48px;\n  height: 48px;\n  border-radius: 10px;\n  background: linear-gradient(135deg, #e3f2fd, #bbdefb);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.entity-card-icon i {\n  font-size: 20px;\n  color: #1976d2;\n}\n\n.entity-card:hover .entity-card-icon {\n  background: linear-gradient(135deg, #1976d2, #1565c0);\n}\n\n.entity-card:hover .entity-card-icon i {\n  color: white;\n}\n\n.entity-card-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.entity-card-title {\n  margin: 0 0 6px 0;\n  font-size: 15px;\n  font-weight: 600;\n  color: #1a1a1a;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.entity-card-description {\n  margin: 0;\n  font-size: 13px;\n  color: #666;\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.detail-panel {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-left: 1px solid #e0e0e0;\n  box-shadow: -4px 0 16px rgba(0, 0, 0, 0.08);\n  overflow: hidden;\n  animation: slideIn 0.2s ease-out;\n  display: flex;\n  flex-direction: column;\n}\n\n.detail-panel mj-entity-record-detail-panel {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n@keyframes slideIn {\n  from {\n    transform: translateX(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n\n/* Detail Panel Actions Bar */\n.detail-panel-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border-bottom: 1px solid #e2e8f0;\n}\n\n.detail-action-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border: none;\n  border-radius: 6px;\n  background: white;\n  color: #475569;\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n}\n\n.detail-action-btn:hover {\n  background: #3b82f6;\n  color: white;\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2);\n}\n\n.detail-action-btn i {\n  font-size: 12px;\n}\n\n:host ::ng-deep mj-explorer-grid-view,\n:host ::ng-deep mj-explorer-cards-view {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n\n/* ============================================\n   HOME SCREEN STYLES\n   ============================================ */\n\n/* Home-level header adjustments */\n.content-header.home-header {\n  border-bottom: none;\n  background: transparent;\n  box-shadow: none;\n  padding: 24px 24px 16px;\n}\n\n.content-body.home-content {\n  padding-top: 0;\n}\n\n/* Smart filter with search icon */\n.filter-icon {\n  position: absolute;\n  left: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #999;\n  font-size: 14px;\n  pointer-events: none;\n}\n\n.smart-filter-container .smart-filter-input {\n  padding-left: 40px;\n}\n\n/* ============================================\n   HOME SECTIONS\n   ============================================ */\n\n.home-section {\n  margin-bottom: 28px;\n}\n\n.section-header {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  margin-bottom: 14px;\n  padding-left: 4px;\n}\n\n.section-icon {\n  font-size: 14px;\n  color: #1976d2;\n  width: 20px;\n  text-align: center;\n}\n\n.section-title {\n  margin: 0;\n  font-size: 14px;\n  font-weight: 600;\n  color: #333;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.section-count {\n  font-size: 12px;\n  color: #888;\n  font-weight: 500;\n  margin-left: 8px;\n}\n\n/* ============================================\n   TWO-COLUMN LAYOUT (Entities left, Records right)\n   ============================================ */\n\n.home-two-column-layout {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 24px;\n  margin-bottom: 28px;\n}\n\n/* When only one column has content, let it take full width */\n.home-two-column-layout.single-column {\n  grid-template-columns: 1fr;\n}\n\n.home-column {\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n/* Section header with inline toggle */\n.section-header-with-toggle {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 14px;\n  padding-left: 4px;\n}\n\n.section-header-left {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n/* Inline Common/All toggle (compact) */\n.inline-toggle {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 6px;\n  padding: 2px;\n}\n\n.inline-toggle .toggle-btn {\n  width: auto;\n  height: 26px;\n  padding: 0 10px;\n  border: none;\n  background: transparent;\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  font-size: 11px;\n  font-weight: 500;\n  transition: all 0.15s ease;\n}\n\n.inline-toggle .toggle-btn:hover {\n  color: #333;\n}\n\n.inline-toggle .toggle-btn.active {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n/* ============================================\n   COMPACT ENTITY CARDS (Recent/Favorites rows)\n   ============================================ */\n\n.entity-card-row {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n  padding: 0;\n}\n\n.entity-card.compact {\n  flex: 0 0 auto;\n  width: auto;\n  min-width: 180px;\n  max-width: 280px;\n  padding: 12px 16px;\n  gap: 12px;\n}\n\n.entity-card.compact .entity-card-icon {\n  width: 36px;\n  height: 36px;\n  border-radius: 8px;\n}\n\n.entity-card.compact .entity-card-icon i {\n  font-size: 16px;\n}\n\n.entity-card.compact .entity-card-title {\n  margin: 0;\n  font-size: 14px;\n}\n\n.entity-card.compact .entity-card-content {\n  display: flex;\n  align-items: center;\n}\n\n/* ============================================\n   FAVORITE BUTTON\n   ============================================ */\n\n.favorite-btn {\n  flex-shrink: 0;\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #ccc;\n  transition: all 0.15s ease;\n  margin-left: auto;\n}\n\n.favorite-btn:hover {\n  background: rgba(255, 193, 7, 0.1);\n  color: #ffc107;\n  transform: scale(1.1);\n}\n\n.favorite-btn.favorited {\n  color: #ffc107;\n}\n\n.favorite-btn.favorited:hover {\n  background: rgba(255, 193, 7, 0.15);\n  color: #ffb300;\n}\n\n.entity-card .favorite-btn {\n  opacity: 0;\n  transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease, transform 0.15s ease;\n}\n\n.entity-card:hover .favorite-btn {\n  opacity: 1;\n}\n\n.entity-card .favorite-btn.favorited {\n  opacity: 1;\n}\n\n/* ============================================\n   RECENT RECORDS LIST\n   ============================================ */\n\n.recent-records-list {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  background: white;\n  border-radius: 10px;\n  padding: 8px;\n  border: 1px solid #e8e8e8;\n}\n\n.recent-record-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.recent-record-item:hover {\n  background: #f5f7fa;\n}\n\n.recent-record-icon {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n  background: linear-gradient(135deg, #e8f5e9, #c8e6c9);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.recent-record-icon i {\n  font-size: 14px;\n  color: #4caf50;\n}\n\n.recent-record-content {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.recent-record-name {\n  font-size: 14px;\n  font-weight: 500;\n  color: #1a1a1a;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.recent-record-entity {\n  font-size: 12px;\n  color: #888;\n}\n\n.recent-record-time {\n  font-size: 11px;\n  color: #aaa;\n  flex-shrink: 0;\n}\n\n/* ============================================\n   ENTITY LIST (for Recent/Favorite Entities)\n   ============================================ */\n\n.entity-list {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  background: white;\n  border-radius: 10px;\n  padding: 8px;\n  border: 1px solid #e8e8e8;\n}\n\n.entity-list-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.entity-list-item:hover {\n  background: #f5f7fa;\n}\n\n.entity-list-icon {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n  background: linear-gradient(135deg, #e3f2fd, #bbdefb);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.entity-list-icon i {\n  font-size: 14px;\n  color: #1976d2;\n}\n\n.entity-list-content {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.entity-list-name {\n  font-size: 14px;\n  font-weight: 500;\n  color: #1a1a1a;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.entity-list-item .favorite-btn {\n  opacity: 0;\n  transition: opacity 0.15s ease;\n}\n\n.entity-list-item:hover .favorite-btn {\n  opacity: 1;\n}\n\n.entity-list-item .favorite-btn.favorited {\n  opacity: 1;\n}\n\n/* ============================================\n   ENTITY FILTER STRIP (for Recent Records)\n   ============================================ */\n\n.entity-filter-strip {\n  display: flex;\n  gap: 4px;\n  margin-left: auto;\n  background: #f0f0f0;\n  border-radius: 6px;\n  padding: 3px;\n}\n\n.entity-filter-btn {\n  width: 28px;\n  height: 26px;\n  border: none;\n  background: transparent;\n  border-radius: 4px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  font-size: 12px;\n  transition: all 0.15s ease;\n}\n\n.entity-filter-btn:hover {\n  color: #333;\n  background: rgba(0, 0, 0, 0.05);\n}\n\n.entity-filter-btn.active {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n/* ============================================\n   COMMON/ALL TOGGLE WITH LABELS\n   ============================================ */\n\n.view-mode-toggle .toggle-btn {\n  width: auto;\n  padding: 0 12px;\n  gap: 6px;\n}\n\n.toggle-label {\n  font-size: 12px;\n  font-weight: 500;\n}\n\n/* ============================================\n   EMPTY STATE VARIANTS\n   ============================================ */\n\n.empty-state.small {\n  height: auto;\n  padding: 32px;\n  background: #fafafa;\n}\n\n.empty-state.small .empty-icon {\n  font-size: 40px;\n  margin-bottom: 16px;\n}\n\n.empty-state.small h3 {\n  font-size: 16px;\n}\n\n.empty-state.small p {\n  font-size: 13px;\n}\n\n/* ============================================\n   RESPONSIVE STYLES\n   ============================================ */\n\n@media (max-width: 1200px) {\n  .entity-card-grid {\n    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));\n  }\n}\n\n@media (max-width: 900px) {\n  .content-header {\n    flex-wrap: wrap;\n    gap: 12px;\n  }\n\n  .header-center {\n    order: 3;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n\n  .entity-card.compact {\n    min-width: 160px;\n  }\n\n  /* Stack two-column layout on smaller screens */\n  .home-two-column-layout {\n    grid-template-columns: 1fr;\n    gap: 20px;\n  }\n}\n\n@media (max-width: 600px) {\n  .data-explorer-container {\n    flex-direction: column;\n  }\n\n  .navigation-panel {\n    display: none;\n  }\n\n  .content-header {\n    padding: 12px 16px;\n  }\n\n  .content-body {\n    padding: 12px 16px;\n  }\n\n  .entity-card-grid {\n    grid-template-columns: 1fr;\n    gap: 12px;\n  }\n\n  .entity-card {\n    padding: 16px;\n  }\n\n  .entity-card.compact {\n    min-width: 100%;\n    max-width: 100%;\n  }\n\n  .entity-card-row {\n    flex-direction: column;\n  }\n\n  .view-mode-toggle {\n    display: none;\n  }\n\n  .section-title {\n    font-size: 13px;\n  }\n\n  .home-section {\n    margin-bottom: 20px;\n  }\n}\n"] }]
+                ], template: "<div class=\"data-explorer-container\">\n  <!-- Navigation Panel (Left) - Hidden at home level, animated -->\n  @if (!isAtHomeLevel) {\n    <div\n      class=\"navigation-panel\"\n      [class.collapsed]=\"state.navigationPanelCollapsed\"\n      [style.width.px]=\"state.navigationPanelCollapsed ? 48 : state.navigationPanelWidth\"\n      [@slideInLeft]>\n\n      <mj-explorer-navigation-panel\n        [entities]=\"entities\"\n        [appEntityGroups]=\"appEntityGroups\"\n        [selectedEntityName]=\"state.selectedEntityName\"\n        [favorites]=\"state.favorites\"\n        [recentItems]=\"state.recentItems\"\n        [collapsed]=\"state.navigationPanelCollapsed\"\n        [allowedEntityNames]=\"allowedEntityNames\"\n        [favoritesSectionExpanded]=\"state.favoritesSectionExpanded\"\n        [recentSectionExpanded]=\"state.recentSectionExpanded\"\n        [entitiesSectionExpanded]=\"state.entitiesSectionExpanded\"\n        [viewsSectionExpanded]=\"state.viewsSectionExpanded\"\n        (entitySelected)=\"onEntitySelected($event)\"\n        (toggleCollapse)=\"toggleNavigationPanel()\"\n        (sectionToggled)=\"stateService.toggleSection($event)\"\n        (openRecord)=\"onOpenRecordFromNav($event)\"\n        (selectRecord)=\"onSelectRecordFromNav($event)\"\n        (expandAndFocus)=\"onExpandAndFocus($event)\">\n      </mj-explorer-navigation-panel>\n    </div>\n  }\n\n  <!-- Main Content Area -->\n  <div class=\"content-area\">\n    <!-- Breadcrumb Bar - Hidden at home level -->\n    @if (!isAtHomeLevel && breadcrumbs.length > 0) {\n      <div class=\"breadcrumb-bar\">\n        @for (crumb of breadcrumbs; track crumb.label; let i = $index; let last = $last) {\n          <span\n            class=\"breadcrumb-item\"\n            [class.clickable]=\"!last\"\n            [class.current]=\"last\"\n            (click)=\"onBreadcrumbClick(crumb, i)\"\n            [title]=\"crumb.label\">\n            @if (crumb.icon) {\n              <i [class]=\"crumb.icon\" class=\"breadcrumb-icon\"></i>\n            }\n            <span class=\"breadcrumb-label\">{{ crumb.label }}</span>\n          </span>\n          @if (!last) {\n            <i class=\"fa-solid fa-chevron-right breadcrumb-separator\"></i>\n          }\n        }\n      </div>\n    }\n\n    <!-- Header -->\n    <div class=\"content-header\" [class.home-header]=\"isAtHomeLevel\">\n      <div class=\"header-left\">\n        @if (selectedEntity) {\n          <i [class]=\"getEntityIcon(selectedEntity)\" class=\"entity-icon\"></i>\n          <h2 class=\"entity-title\">{{ selectedEntity.DisplayNameOrName }}</h2>\n          @if (debouncedFilterText && filteredRecordCount !== totalRecordCount) {\n            <span class=\"record-count\">{{ filteredRecordCount | number }} of {{ totalRecordCount | number }} records</span>\n          } @else {\n            <span class=\"record-count\">{{ totalRecordCount | number }} records</span>\n          }\n\n          <!-- View Selector -->\n          <mj-view-selector\n            [entity]=\"selectedEntity\"\n            [selectedViewId]=\"state.selectedViewId\"\n            [viewModified]=\"state.viewModified\"\n            (viewSelected)=\"onViewSelected($event)\"\n            (saveViewRequested)=\"onSaveViewRequested($event)\"\n            (manageViewsRequested)=\"onManageViewsRequested()\"\n            (openInTabRequested)=\"onOpenInTabRequested($event)\"\n            (configureViewRequested)=\"onConfigureViewRequested()\"\n            (createNewRecordRequested)=\"onCreateNewRecord()\"\n            (exportRequested)=\"onExport()\"\n            (duplicateViewRequested)=\"onDuplicateView($event)\"\n            (quickSaveRequested)=\"onQuickSaveRequested($event)\"\n            (revertRequested)=\"onRevertView()\">\n          </mj-view-selector>\n\n          <!-- Add to List Button -->\n          <button\n            class=\"header-action-btn\"\n            [class.disabled]=\"!hasSelectedRecords\"\n            [disabled]=\"!hasSelectedRecords\"\n            (click)=\"onAddToListClick()\"\n            [title]=\"hasSelectedRecords ? 'Add ' + selectedRecords.length + ' selected record(s) to a list' : 'Select records to add to a list'\">\n            <i class=\"fa-solid fa-list-check\"></i>\n            @if (hasSelectedRecords) {\n              <span class=\"selection-badge\">{{ selectedRecords.length }}</span>\n            }\n          </button>\n        } @else {\n          @if (displayIcon) {\n            <i [class]=\"displayIcon\" class=\"entity-icon\"></i>\n          }\n          <h2 class=\"entity-title\">{{ displayTitle }}</h2>\n          <span class=\"record-count\">{{ entities.length }} entities available</span>\n        }\n      </div>\n\n      <div class=\"header-center\">\n        @if (selectedEntity) {\n          <div class=\"smart-filter-container\">\n            <i class=\"fa-solid fa-search filter-icon\"></i>\n            <input\n              #filterInput\n              type=\"text\"\n              class=\"smart-filter-input\"\n              placeholder=\"Filter records... (press / to focus)\"\n              [ngModel]=\"debouncedFilterText\"\n              (ngModelChange)=\"onFilterTextChanged($event)\"\n            />\n            @if (debouncedFilterText) {\n              <button class=\"clear-filter-btn\" (click)=\"onFilterTextChanged('')\">\n                <i class=\"fa-solid fa-times\"></i>\n              </button>\n            }\n          </div>\n        }\n        <!-- Home-level search moved to search hero section -->\n      </div>\n\n      <div class=\"header-right\">\n        @if (selectedEntity) {\n          <!-- View Mode Toggle -->\n          <div class=\"view-mode-toggle\">\n            <button\n              class=\"toggle-btn\"\n              [class.active]=\"state.viewMode === 'grid'\"\n              (click)=\"onViewModeChanged('grid')\"\n              title=\"Grid View\">\n              <i class=\"fa-solid fa-list\"></i>\n            </button>\n            <button\n              class=\"toggle-btn\"\n              [class.active]=\"state.viewMode === 'cards'\"\n              (click)=\"onViewModeChanged('cards')\"\n              title=\"Cards View\">\n              <i class=\"fa-solid fa-grip\"></i>\n            </button>\n            @if (entityHasDateFields) {\n              <button\n                class=\"toggle-btn\"\n                [class.active]=\"state.viewMode === 'timeline'\"\n                (click)=\"onViewModeChanged('timeline')\"\n                title=\"Timeline View\">\n                <i class=\"fa-solid fa-timeline\"></i>\n              </button>\n            }\n          </div>\n\n          <!-- Timeline Controls (only shown when timeline view is active) -->\n          @if (state.viewMode === 'timeline' && entityHasDateFields) {\n            <!-- Date Field Selector -->\n            <div class=\"date-field-selector-container\">\n              <!-- Backdrop for closing dropdown -->\n              @if (isDateFieldDropdownOpen) {\n                <div class=\"date-field-backdrop\" (click)=\"closeDateFieldDropdown()\"></div>\n              }\n\n              <div class=\"date-field-selector-wrapper\">\n                <button\n                  class=\"date-field-selector-button\"\n                  [class.open]=\"isDateFieldDropdownOpen\"\n                  [disabled]=\"availableDateFields.length <= 1\"\n                  (click)=\"toggleDateFieldDropdown()\">\n                  <i class=\"fa-solid fa-calendar-days date-field-icon\"></i>\n                  <span class=\"date-field-name\">{{ effectiveTimelineDateFieldDisplayName }}</span>\n                  @if (availableDateFields.length > 1) {\n                    <i class=\"fa-solid fa-chevron-down date-field-arrow\" [class.rotated]=\"isDateFieldDropdownOpen\"></i>\n                  }\n                </button>\n\n                @if (isDateFieldDropdownOpen && availableDateFields.length > 1) {\n                  <div class=\"date-field-dropdown-panel\">\n                    @for (field of availableDateFields; track field.name) {\n                      <div\n                        class=\"date-field-dropdown-item\"\n                        [class.selected]=\"field.name === effectiveTimelineDateField\"\n                        (click)=\"setTimelineDateField(field.name)\">\n                        <i class=\"fa-regular fa-calendar item-icon\"></i>\n                        <span class=\"item-name\">{{ field.displayName }}</span>\n                        @if (field.name === effectiveTimelineDateField) {\n                          <i class=\"fa-solid fa-check selected-check\"></i>\n                        }\n                      </div>\n                    }\n                  </div>\n                }\n              </div>\n            </div>\n\n            <!-- Orientation Toggle -->\n            <div class=\"timeline-orientation-toggle\">\n              <button\n                class=\"toggle-btn\"\n                (click)=\"toggleTimelineOrientation()\"\n                [title]=\"state.timelineOrientation === 'vertical' ? 'Switch to Horizontal' : 'Switch to Vertical'\">\n                <i [class]=\"state.timelineOrientation === 'vertical' ? 'fa-solid fa-ellipsis-vertical' : 'fa-solid fa-ellipsis'\"></i>\n              </button>\n            </div>\n\n            <!-- Sort Order Toggle -->\n            <div class=\"timeline-sort-toggle\">\n              <button\n                class=\"toggle-btn\"\n                (click)=\"toggleTimelineSortOrder()\"\n                [title]=\"state.timelineSortOrder === 'desc' ? 'Showing Newest First (click for Oldest First)' : 'Showing Oldest First (click for Newest First)'\">\n                <i [class]=\"state.timelineSortOrder === 'desc' ? 'fa-solid fa-arrow-down-wide-short' : 'fa-solid fa-arrow-up-wide-short'\"></i>\n              </button>\n            </div>\n          }\n        }\n        @if (!selectedEntity) {\n          <!-- Quick Access panel toggle -->\n          <button\n            class=\"header-action-btn\"\n            [class.active]=\"state.quickAccessPanelOpen\"\n            (click)=\"toggleQuickAccessPanel()\"\n            title=\"Recents & Favorites\">\n            <i class=\"fa-solid fa-clock-rotate-left\"></i>\n            @if (recentRecords.length + favoriteRecords.length > 0) {\n              <span class=\"qa-badge\">{{ recentRecords.length + favoriteRecords.length }}</span>\n            }\n          </button>\n        }\n      </div>\n    </div>\n\n    <!-- Content Body - Using mj-entity-viewer composite -->\n    <div class=\"content-body\" [class.home-content]=\"isAtHomeLevel\">\n      @if (!selectedEntity) {\n        <!-- Concept D: Application Groups + Search-First Home View -->\n        <div class=\"home-view-concept-d\">\n          @if (isLoadingEntities) {\n            <div class=\"loading-state\">\n              <mj-loading text=\"Loading entities...\" size=\"medium\"></mj-loading>\n            </div>\n          } @else {\n            <div class=\"home-main-area\" [class.panel-open]=\"state.quickAccessPanelOpen\">\n              <!-- Search Hero -->\n              <div class=\"search-hero\">\n                <div class=\"search-hero-container\">\n                  <i class=\"fa-solid fa-magnifying-glass search-hero-icon\"></i>\n                  <input\n                    #filterInput\n                    type=\"text\"\n                    class=\"search-hero-input\"\n                    placeholder=\"Search entities...\"\n                    [(ngModel)]=\"entityFilterText\"\n                  />\n                  @if (entityFilterText) {\n                    <button class=\"search-hero-clear\" (click)=\"entityFilterText = ''\">\n                      <i class=\"fa-solid fa-times\"></i>\n                    </button>\n                  } @else {\n                    <span class=\"search-hero-shortcut\">/</span>\n                  }\n                </div>\n\n                <!-- Meta row: entity count + All/Favorites pills -->\n                <div class=\"search-meta-row\">\n                  <span class=\"search-entity-count\">\n                    {{ filteredEntityCount }} entities\n                    @if (applicationCount > 0) {\n                      across {{ applicationCount }} applications\n                    }\n                  </span>\n                  <div class=\"pill-toggle\">\n                    <button\n                      class=\"pill-btn\"\n                      [class.active]=\"state.homeViewMode === 'all'\"\n                      (click)=\"setHomeViewMode('all')\">\n                      All Entities\n                    </button>\n                    <button\n                      class=\"pill-btn\"\n                      [class.active]=\"state.homeViewMode === 'favorites'\"\n                      (click)=\"setHomeViewMode('favorites')\">\n                      <i class=\"fa-solid fa-star\"></i> My Favorites\n                    </button>\n                  </div>\n                </div>\n              </div>\n\n              <!-- Entity Groups Area -->\n              <div class=\"entity-groups-area\">\n                @if (entityFilter?.applicationId) {\n                  <!-- Single-app mode: flat entity grid (no grouping) -->\n                  <div class=\"entity-item-grid\">\n                    @for (entity of flatFilteredEntities; track entity.ID) {\n                      <div\n                        class=\"entity-item\"\n                        (click)=\"onEntitySelected(entity)\"\n                        [title]=\"entity.Description || entity.DisplayNameOrName\">\n                        <div class=\"entity-item-icon\">\n                          <i [class]=\"getEntityIcon(entity)\"></i>\n                        </div>\n                        <div class=\"entity-item-text\">\n                          <span class=\"entity-item-name\">{{ entity.DisplayNameOrName }}</span>\n                          @if (entity.Description) {\n                            <span class=\"entity-item-desc\">{{ entity.Description }}</span>\n                          }\n                        </div>\n                        <button\n                          class=\"entity-item-fav\"\n                          [class.favorited]=\"isEntityFavorited(entity)\"\n                          (click)=\"toggleEntityFavorite(entity, $event)\"\n                          [title]=\"isEntityFavorited(entity) ? 'Remove from favorites' : 'Add to favorites'\">\n                          <i [class]=\"isEntityFavorited(entity) ? 'fa-solid fa-star' : 'fa-regular fa-star'\"></i>\n                        </button>\n                      </div>\n                    }\n                  </div>\n                } @else {\n                  <!-- Multi-app mode: grouped by application -->\n                  @for (group of filteredAppEntityGroups; track group.applicationId) {\n                    <div class=\"app-group\">\n                      <div class=\"app-group-header\" (click)=\"toggleAppGroup(group.applicationId)\">\n                        <div\n                          class=\"app-group-icon\"\n                          [style.background]=\"group.applicationColor ? group.applicationColor + '15' : null\"\n                          [style.color]=\"group.applicationColor || null\">\n                          <i [class]=\"group.applicationIcon || 'fa-solid fa-folder'\"></i>\n                        </div>\n                        <span class=\"app-group-name\">{{ group.applicationName }}</span>\n                        <span class=\"app-group-count\">{{ group.entities.length }}</span>\n                        <i class=\"fa-solid fa-chevron-right app-group-chevron\"\n                           [class.expanded]=\"group.isExpanded\"></i>\n                      </div>\n                      @if (group.isExpanded) {\n                        <div class=\"app-group-entities\">\n                          <div class=\"entity-item-grid\">\n                            @for (entity of group.entities; track entity.ID) {\n                              <div\n                                class=\"entity-item\"\n                                (click)=\"onEntitySelected(entity)\"\n                                [title]=\"entity.Description || entity.DisplayNameOrName\">\n                                <div class=\"entity-item-icon\">\n                                  <i [class]=\"getEntityIcon(entity)\"></i>\n                                </div>\n                                <div class=\"entity-item-text\">\n                                  <span class=\"entity-item-name\">{{ entity.DisplayNameOrName }}</span>\n                                  @if (entity.Description) {\n                                    <span class=\"entity-item-desc\">{{ entity.Description }}</span>\n                                  }\n                                </div>\n                                <button\n                                  class=\"entity-item-fav\"\n                                  [class.favorited]=\"isEntityFavorited(entity)\"\n                                  (click)=\"toggleEntityFavorite(entity, $event)\"\n                                  [title]=\"isEntityFavorited(entity) ? 'Remove from favorites' : 'Add to favorites'\">\n                                  <i [class]=\"isEntityFavorited(entity) ? 'fa-solid fa-star' : 'fa-regular fa-star'\"></i>\n                                </button>\n                              </div>\n                            }\n                          </div>\n                        </div>\n                      }\n                    </div>\n                  }\n                }\n\n                <!-- No results -->\n                @if (filteredEntityCount === 0 && entities.length > 0) {\n                  <div class=\"home-no-results\">\n                    <i class=\"fa-solid fa-magnifying-glass\"></i>\n                    <p>No entities match \"{{ entityFilterText }}\"</p>\n                  </div>\n                }\n                @if (entities.length === 0) {\n                  <div class=\"empty-state\">\n                    <i class=\"fa-solid fa-database empty-icon\"></i>\n                    <h3>No Entities Available</h3>\n                    <p>There are no entities configured for this application.</p>\n                  </div>\n                }\n              </div>\n            </div>\n\n            <!-- Quick Access Panel (right slide-in) -->\n            <div class=\"quick-access-panel\" [class.open]=\"state.quickAccessPanelOpen\">\n              <div class=\"qa-header\">\n                <h3>Quick Access</h3>\n                <button class=\"qa-close-btn\" (click)=\"toggleQuickAccessPanel()\">\n                  <i class=\"fa-solid fa-xmark\"></i>\n                </button>\n              </div>\n              <div class=\"qa-body\">\n                <!-- Recent Records (max 3) -->\n                <div class=\"qa-section\" [class.collapsed]=\"!isQuickAccessSectionExpanded('recentRecords')\">\n                  <div class=\"qa-section-header\" (click)=\"toggleQuickAccessSection('recentRecords')\">\n                    <i class=\"fa-solid fa-clock-rotate-left qa-section-icon\"></i>\n                    <span>Recent Records</span>\n                    <span class=\"qa-section-count\">{{ quickAccessRecentRecords.length }}</span>\n                    <i class=\"fa-solid fa-chevron-down qa-section-chevron\"></i>\n                  </div>\n                  <div class=\"qa-section-body\">\n                    @for (record of quickAccessRecentRecords; track record.entityId + '|' + record.recordId) {\n                      <div class=\"qa-item\" (click)=\"onRecentRecordClick(record)\">\n                        <div class=\"qa-item-icon\">\n                          <i [class]=\"getEntityIconById(record.entityId)\"></i>\n                        </div>\n                        <div class=\"qa-item-info\">\n                          <div class=\"qa-item-name\">{{ record.recordName || record.recordId }}</div>\n                          <div class=\"qa-item-meta\">{{ record.entityName }}</div>\n                        </div>\n                        <span class=\"qa-item-time\">{{ formatRelativeTime(record.latestAt) }}</span>\n                      </div>\n                    }\n                    @if (quickAccessRecentRecords.length === 0) {\n                      <div class=\"qa-empty\">No recent records</div>\n                    }\n                  </div>\n                </div>\n\n                <!-- Recent Entities (max 3) -->\n                <div class=\"qa-section\" [class.collapsed]=\"!isQuickAccessSectionExpanded('recentEntities')\">\n                  <div class=\"qa-section-header\" (click)=\"toggleQuickAccessSection('recentEntities')\">\n                    <i class=\"fa-solid fa-table qa-section-icon\"></i>\n                    <span>Recent Entities</span>\n                    <span class=\"qa-section-count\">{{ quickAccessRecentEntities.length }}</span>\n                    <i class=\"fa-solid fa-chevron-down qa-section-chevron\"></i>\n                  </div>\n                  <div class=\"qa-section-body\">\n                    @for (entity of quickAccessRecentEntities; track entity.ID) {\n                      <div class=\"qa-item\" (click)=\"onEntitySelected(entity)\">\n                        <div class=\"qa-item-icon\">\n                          <i [class]=\"getEntityIcon(entity)\"></i>\n                        </div>\n                        <div class=\"qa-item-info\">\n                          <div class=\"qa-item-name\">{{ entity.DisplayNameOrName }}</div>\n                        </div>\n                      </div>\n                    }\n                    @if (quickAccessRecentEntities.length === 0) {\n                      <div class=\"qa-empty\">No recent entities</div>\n                    }\n                  </div>\n                </div>\n\n                <!-- Favorite Records (max 3) -->\n                <div class=\"qa-section\" [class.collapsed]=\"!isQuickAccessSectionExpanded('favoriteRecords')\">\n                  <div class=\"qa-section-header\" (click)=\"toggleQuickAccessSection('favoriteRecords')\">\n                    <i class=\"fa-solid fa-star qa-section-icon\" style=\"color: #f59e0b;\"></i>\n                    <span>Favorite Records</span>\n                    <span class=\"qa-section-count\">{{ quickAccessFavoriteRecords.length }}</span>\n                    <i class=\"fa-solid fa-chevron-down qa-section-chevron\"></i>\n                  </div>\n                  <div class=\"qa-section-body\">\n                    @for (record of quickAccessFavoriteRecords; track record.userFavoriteId) {\n                      <div class=\"qa-item\" (click)=\"onFavoriteRecordClick(record)\">\n                        <div class=\"qa-item-icon\">\n                          <i [class]=\"getEntityIconById(record.entityId)\"></i>\n                        </div>\n                        <div class=\"qa-item-info\">\n                          <div class=\"qa-item-name\">{{ record.recordName || record.recordId }}</div>\n                          <div class=\"qa-item-meta\">{{ record.entityName }}</div>\n                        </div>\n                      </div>\n                    }\n                    @if (quickAccessFavoriteRecords.length === 0) {\n                      <div class=\"qa-empty\">No favorite records</div>\n                    }\n                  </div>\n                </div>\n              </div>\n            </div>\n          }\n        </div>\n      } @else {\n        <mj-entity-viewer\n          #entityViewer\n          [entity]=\"selectedEntity\"\n          [viewEntity]=\"selectedViewEntity\"\n          [viewMode]=\"state.viewMode\"\n          [filterText]=\"debouncedFilterText\"\n          [selectedRecordId]=\"state.selectedRecordId\"\n          [config]=\"viewerConfig\"\n          [gridState]=\"currentGridState\"\n          [timelineConfig]=\"currentTimelineConfig\"\n          [gridSelectionMode]=\"'checkbox'\"\n          [showGridToolbar]=\"false\"\n          [showAddToListButton]=\"false\"\n          (viewModeChange)=\"onViewModeChanged($event)\"\n          (filterTextChange)=\"onFilterTextChanged($event)\"\n          (recordSelected)=\"onViewerRecordSelected($event)\"\n          (recordOpened)=\"onViewerRecordOpened($event)\"\n          (dataLoaded)=\"onDataLoaded($event)\"\n          (filteredCountChanged)=\"onFilteredCountChanged($event)\"\n          (gridStateChanged)=\"onGridStateChanged($event)\"\n          (selectionChanged)=\"onSelectionChanged($event)\"\n          (addToListRequested)=\"onAddToListRequested($event)\">\n        </mj-entity-viewer>\n      }\n    </div>\n  </div>\n\n  <!-- Detail Panel (Right - Slide In) -->\n  @if (state.detailPanelOpen && selectedRecord) {\n    <div class=\"detail-panel\" [style.width.px]=\"state.detailPanelWidth\">\n      <!-- Detail Panel Actions Bar -->\n      <div class=\"detail-panel-actions\">\n        <button\n          class=\"detail-action-btn\"\n          (click)=\"openListManagementDialog()\"\n          title=\"Add to List\">\n          <i class=\"fa-solid fa-list-check\"></i>\n          <span>Add to List</span>\n        </button>\n      </div>\n      <mj-entity-record-detail-panel\n        [entity]=\"detailPanelEntity\"\n        [record]=\"selectedRecord\"\n        (close)=\"onDetailPanelClosed()\"\n        (openRecord)=\"onOpenRecord($event)\"\n        (navigateToRelated)=\"onNavigateToRelated($event)\"\n        (openRelatedRecord)=\"onOpenRelatedRecord($event)\"\n        (openForeignKeyRecord)=\"onOpenForeignKeyRecord($event)\">\n      </mj-entity-record-detail-panel>\n    </div>\n  }\n\n  <!-- View Configuration Panel -->\n  <mj-view-config-panel\n    [entity]=\"selectedEntity\"\n    [viewEntity]=\"selectedViewEntity\"\n    [isOpen]=\"state.viewConfigPanelOpen\"\n    [currentGridState]=\"currentGridState\"\n    [externalFilterState]=\"filterDialogState\"\n    [isSaving]=\"isSavingView\"\n    [DefaultSaveAsNew]=\"defaultSaveAsNew\"\n    (close)=\"onCloseViewConfigPanel()\"\n    (save)=\"onSaveView($event)\"\n    (saveDefaults)=\"onSaveDefaultViewSettings($event)\"\n    (delete)=\"onDeleteView()\"\n    (duplicate)=\"onDuplicateFromPanel()\"\n    (openFilterDialogRequest)=\"onOpenFilterDialogRequest($event)\">\n  </mj-view-config-panel>\n\n  <!-- Filter Dialog (rendered at dashboard level for full viewport width) -->\n  <mj-filter-dialog\n    [isOpen]=\"isFilterDialogOpen\"\n    [fields]=\"filterDialogFields\"\n    [filter]=\"filterDialogState\"\n    [disabled]=\"filterDialogDisabled\"\n    (close)=\"onCloseFilterDialog()\"\n    (apply)=\"onFilterApplied($event)\">\n  </mj-filter-dialog>\n\n  <!-- Export Dialog -->\n  <mj-export-dialog\n    [visible]=\"showExportDialog\"\n    [config]=\"exportDialogConfig\"\n    (closed)=\"onExportDialogClosed($event)\">\n  </mj-export-dialog>\n\n  <!-- List Management Dialog -->\n  @if (showListManagementDialog && listManagementConfig) {\n    <mj-list-management-dialog\n      [config]=\"listManagementConfig\"\n      [visible]=\"showListManagementDialog\"\n      (complete)=\"onListManagementComplete($event)\"\n      (cancel)=\"onListManagementCancel()\">\n    </mj-list-management-dialog>\n  }\n\n  <!-- Quick Save Dialog (F-001) -->\n  <mj-quick-save-dialog\n    [IsOpen]=\"showQuickSaveDialog\"\n    [ViewEntity]=\"selectedViewEntity\"\n    [EntityName]=\"selectedEntity?.DisplayNameOrName ?? ''\"\n    [Summary]=\"quickSaveSummary\"\n    [IsSaving]=\"isSavingView\"\n    [DefaultSaveAsNew]=\"defaultSaveAsNew\"\n    (Save)=\"onQuickSave($event)\"\n    (Close)=\"onQuickSaveClose()\"\n    (OpenAdvanced)=\"onQuickSaveOpenAdvanced()\">\n  </mj-quick-save-dialog>\n\n  <!-- Duplicate View Dialog (F-005) -->\n  <mj-duplicate-view-dialog\n    [IsOpen]=\"showDuplicateDialog\"\n    [SourceViewName]=\"duplicateSourceViewName\"\n    [Summary]=\"duplicateSummary\"\n    (Duplicate)=\"onDuplicateConfirmed($event)\"\n    (Cancel)=\"onDuplicateCancel()\">\n  </mj-duplicate-view-dialog>\n\n  <!-- Shared View Warning Dialog (view-creation-flow Scenario 5) -->\n  <mj-shared-view-warning-dialog\n    [IsOpen]=\"showSharedViewWarning\"\n    [ViewName]=\"selectedViewEntity?.Name ?? ''\"\n    (Action)=\"onSharedViewAction($event)\"\n    (Cancel)=\"onSharedViewWarningCancel()\">\n  </mj-shared-view-warning-dialog>\n</div>\n", styles: [".data-explorer-container {\n  display: flex;\n  height: 100%;\n  width: 100%;\n  background: #f5f7fa;\n  overflow: hidden;\n}\n\n.navigation-panel {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-right: 1px solid #e0e0e0;\n  transition: width 0.2s ease-in-out;\n  overflow: hidden;\n  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04);\n}\n.navigation-panel.collapsed {\n  width: 48px;\n}\n\n.content-area {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-width: 0;\n  overflow: hidden;\n  background: #f5f7fa;\n}\n\n/* Breadcrumb Bar */\n.breadcrumb-bar {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 24px;\n  background: white;\n  border-bottom: 1px solid #eee;\n  flex-shrink: 0;\n  font-size: 13px;\n  min-height: 40px;\n}\n\n.breadcrumb-item {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  color: #666;\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.15s ease;\n  max-width: 200px;\n}\n\n.breadcrumb-item.clickable {\n  cursor: pointer;\n}\n\n.breadcrumb-item.clickable:hover {\n  background: #f0f0f0;\n  color: #1976d2;\n}\n\n.breadcrumb-item.current {\n  color: #1a1a1a;\n  font-weight: 500;\n  cursor: default;\n}\n\n.breadcrumb-icon {\n  font-size: 12px;\n  flex-shrink: 0;\n}\n\n.breadcrumb-label {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.breadcrumb-separator {\n  font-size: 10px;\n  color: #ccc;\n  flex-shrink: 0;\n}\n\n.content-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 24px;\n  background: white;\n  border-bottom: 1px solid #e0e0e0;\n  flex-shrink: 0;\n  gap: 24px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);\n}\n\n.header-left {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n  flex-wrap: wrap;\n}\n\n/* View Selector within header */\n.header-left ::ng-deep mj-view-selector {\n  margin-left: 8px;\n}\n\n.entity-icon {\n  font-size: 20px;\n  color: #1976d2;\n}\n\n.entity-title {\n  margin: 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #1a1a1a;\n}\n\n.record-count {\n  font-size: 13px;\n  color: #666;\n  font-weight: 500;\n}\n\n.header-center {\n  flex: 1;\n  max-width: 600px;\n}\n\n.smart-filter-container {\n  position: relative;\n  width: 100%;\n}\n\n.smart-filter-input {\n  width: 100%;\n  padding: 10px 40px 10px 16px;\n  border: 1px solid #e0e0e0;\n  border-radius: 8px;\n  font-size: 14px;\n  background: #fafafa;\n  transition: all 0.15s ease;\n}\n.smart-filter-input:focus {\n  outline: none;\n  border-color: #1976d2;\n  background: white;\n  box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.1);\n}\n.smart-filter-input::placeholder {\n  color: #999;\n}\n\n.clear-filter-btn {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #757575;\n  transition: all 0.15s ease;\n}\n.clear-filter-btn:hover {\n  background: #e0e0e0;\n  color: #424242;\n}\n\n.header-right {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-shrink: 0;\n}\n\n.view-mode-toggle {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.toggle-btn {\n  width: 36px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  border-radius: 6px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n}\n.toggle-btn:hover {\n  color: #333;\n}\n.toggle-btn.active {\n  background: white;\n  color: #1976d2;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n}\n\n/* Header Action Button (Add to List, etc.) */\n.header-action-btn {\n  position: relative;\n  width: 36px;\n  height: 36px;\n  border: 1px solid #e0e0e0;\n  background: white;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #666;\n  transition: all 0.15s ease;\n  margin-left: 8px;\n}\n.header-action-btn:hover:not(.disabled) {\n  border-color: #1976d2;\n  color: #1976d2;\n  background: #f5f9ff;\n}\n.header-action-btn.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.header-action-btn i {\n  font-size: 14px;\n}\n.selection-badge {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 18px;\n  height: 18px;\n  padding: 0 5px;\n  background: #1976d2;\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  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);\n}\n\n/* Timeline Date Field Selector - Styled Dropdown */\n.date-field-selector-container {\n  display: flex;\n  align-items: center;\n  position: relative;\n}\n\n.date-field-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 999;\n  background: transparent;\n}\n\n.date-field-selector-wrapper {\n  position: relative;\n}\n\n.date-field-selector-button {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 12px;\n  background: var(--background-alt, #f5f5f5);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 6px;\n  cursor: pointer;\n  font-size: 13px;\n  color: var(--text-primary, #333);\n  transition: all 0.15s ease;\n  min-width: 120px;\n  max-width: 200px;\n}\n\n.date-field-selector-button:hover:not(:disabled) {\n  background: var(--background-hover, #e8e8e8);\n  border-color: var(--border-color-hover, #ccc);\n}\n\n.date-field-selector-button:disabled {\n  cursor: default;\n  opacity: 0.8;\n}\n\n.date-field-selector-button.open {\n  background: var(--background-active, #e0e0e0);\n  border-color: var(--primary-color, #007bff);\n}\n\n.date-field-icon {\n  color: var(--text-secondary, #666);\n  font-size: 12px;\n}\n\n.date-field-name {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: left;\n}\n\n.date-field-arrow {\n  color: var(--text-secondary, #666);\n  font-size: 10px;\n  transition: transform 0.2s ease;\n}\n\n.date-field-arrow.rotated {\n  transform: rotate(180deg);\n}\n\n.date-field-dropdown-panel {\n  position: absolute;\n  top: calc(100% + 4px);\n  left: 0;\n  min-width: 180px;\n  max-width: 280px;\n  max-height: 300px;\n  overflow-y: auto;\n  background: var(--background-panel, #fff);\n  border: 1px solid var(--border-color, #e0e0e0);\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  z-index: 1000;\n}\n\n.date-field-dropdown-item {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  cursor: pointer;\n  transition: background 0.1s ease;\n  font-size: 13px;\n}\n\n.date-field-dropdown-item:hover {\n  background: var(--background-hover, #f5f5f5);\n}\n\n.date-field-dropdown-item.selected {\n  background: var(--primary-light, #e6f0ff);\n}\n\n.date-field-dropdown-item.selected:hover {\n  background: var(--primary-light-hover, #d6e4f9);\n}\n\n.date-field-dropdown-item .item-icon {\n  color: var(--text-secondary, #666);\n  font-size: 13px;\n  width: 16px;\n  text-align: center;\n}\n\n.date-field-dropdown-item .item-name {\n  flex: 1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.date-field-dropdown-item .selected-check {\n  color: var(--primary-color, #007bff);\n  font-size: 12px;\n}\n\n/* Timeline Orientation Toggle */\n.timeline-orientation-toggle {\n  display: flex;\n  background: #f0f0f0;\n  border-radius: 8px;\n  padding: 3px;\n}\n\n.content-body {\n  flex: 1;\n  overflow: hidden;\n  padding: 20px 24px;\n  display: flex;\n  flex-direction: column;\n}\n\n.loading-container,\n.loading-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  gap: 16px;\n  background: white;\n  border-radius: 8px;\n}\n\n.loading-spinner {\n  font-size: 32px;\n  color: #1976d2;\n}\n\n.loading-message {\n  margin: 0;\n  font-size: 14px;\n  color: #666;\n}\n\n.empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  text-align: center;\n  color: #757575;\n  background: white;\n  border-radius: 8px;\n  padding: 40px;\n}\n\n.empty-icon {\n  font-size: 64px;\n  color: #e0e0e0;\n  margin-bottom: 24px;\n}\n\n.empty-state h3 {\n  margin: 0 0 8px 0;\n  font-size: 20px;\n  font-weight: 600;\n  color: #333;\n}\n\n.empty-state p {\n  margin: 0;\n  font-size: 14px;\n  max-width: 400px;\n  color: #666;\n}\n\n/* ============================================\n   CONCEPT D: HOME VIEW LAYOUT\n   ============================================ */\n\n.home-view-concept-d {\n  flex: 1;\n  display: flex;\n  overflow: hidden;\n}\n\n.home-main-area {\n  flex: 1;\n  overflow-y: auto;\n  transition: margin-right 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.home-main-area.panel-open {\n  margin-right: 320px;\n}\n\n/* ============================================\n   SEARCH HERO\n   ============================================ */\n\n.search-hero {\n  background: linear-gradient(180deg, white 0%, #f5f7fa 100%);\n  padding: 36px 40px 24px;\n  text-align: center;\n}\n\n.search-hero-container {\n  position: relative;\n  max-width: 600px;\n  margin: 0 auto;\n}\n\n.search-hero-input {\n  width: 100%;\n  padding: 14px 18px 14px 44px;\n  font-size: 15px;\n  border: 2px solid #e5e7eb;\n  border-radius: 12px;\n  background: white;\n  color: #111827;\n  outline: none;\n  transition: all 0.2s;\n  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);\n  font-family: inherit;\n}\n\n.search-hero-input:focus {\n  border-color: #1976d2;\n  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1), 0 0 0 4px rgba(25, 118, 210, 0.08);\n}\n\n.search-hero-input::placeholder {\n  color: #9ca3af;\n}\n\n.search-hero-icon {\n  position: absolute;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #9ca3af;\n  font-size: 15px;\n  pointer-events: none;\n}\n\n.search-hero-shortcut {\n  position: absolute;\n  right: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  background: #f5f7fa;\n  border: 1px solid #e5e7eb;\n  padding: 2px 7px;\n  border-radius: 5px;\n  font-size: 12px;\n  color: #9ca3af;\n}\n\n.search-hero-clear {\n  position: absolute;\n  right: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  width: 28px;\n  height: 28px;\n  border: none;\n  background: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #757575;\n  transition: all 0.15s ease;\n}\n\n.search-hero-clear:hover {\n  background: #e0e0e0;\n  color: #424242;\n}\n\n/* Meta row: entity count + pills */\n.search-meta-row {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  margin-top: 16px;\n}\n\n.search-entity-count {\n  font-size: 13px;\n  color: #9ca3af;\n}\n\n.pill-toggle {\n  display: flex;\n  gap: 6px;\n}\n\n.pill-btn {\n  padding: 6px 16px;\n  border-radius: 20px;\n  border: 1px solid #e5e7eb;\n  background: white;\n  font-size: 13px;\n  color: #6b7280;\n  cursor: pointer;\n  transition: all 0.15s;\n  font-family: inherit;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.pill-btn:hover {\n  border-color: #1976d2;\n  color: #1976d2;\n}\n\n.pill-btn.active {\n  background: #1976d2;\n  color: white;\n  border-color: #1976d2;\n}\n\n.pill-btn i {\n  font-size: 11px;\n}\n\n/* ============================================\n   APPLICATION GROUPS\n   ============================================ */\n\n.entity-groups-area {\n  padding: 12px 40px 60px;\n  max-width: 1200px;\n  margin: 0 auto;\n}\n\n.app-group {\n  margin-bottom: 4px;\n}\n\n.app-group-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 14px;\n  cursor: pointer;\n  border-radius: 8px;\n  transition: background 0.12s;\n  user-select: none;\n}\n\n.app-group-header:hover {\n  background: rgba(0, 0, 0, 0.025);\n}\n\n.app-group-icon {\n  width: 38px;\n  height: 38px;\n  border-radius: 10px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 17px;\n  flex-shrink: 0;\n  background: #eff6ff;\n  color: #2563eb;\n}\n\n.app-group-name {\n  font-size: 21px;\n  font-weight: 600;\n  flex: 1;\n}\n\n.app-group-count {\n  font-size: 12px;\n  color: #9ca3af;\n  background: #f5f7fa;\n  padding: 2px 9px;\n  border-radius: 10px;\n}\n\n.app-group-chevron {\n  color: #9ca3af;\n  font-size: 12px;\n  transition: transform 0.2s;\n}\n\n.app-group-chevron.expanded {\n  transform: rotate(90deg);\n}\n\n.app-group-entities {\n  padding: 4px 14px 10px 60px;\n}\n\n/* ============================================\n   ENTITY ITEM GRID (pills)\n   ============================================ */\n\n.entity-item-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));\n  gap: 12px;\n}\n\n.entity-item {\n  display: flex;\n  align-items: flex-start;\n  gap: 12px;\n  padding: 10px 14px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.12s;\n  border: 1px solid #f0f1f3;\n  background: white;\n}\n\n.entity-item:hover {\n  border-color: #bfdbfe;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);\n  background: #eff6ff;\n}\n\n.entity-item-icon {\n  width: 32px;\n  height: 32px;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 14px;\n  color: #6b7280;\n  background: #f5f7fa;\n  flex-shrink: 0;\n}\n\n.entity-item:hover .entity-item-icon {\n  background: #dbeafe;\n  color: #2563eb;\n}\n\n.entity-item-text {\n  flex: 1;\n  min-width: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.entity-item-name {\n  font-size: 14px;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.entity-item-desc {\n  font-size: 12px;\n  color: #9ca3af;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  line-height: 1.3;\n}\n\n.entity-item-fav {\n  color: #9ca3af;\n  opacity: 0;\n  transition: opacity 0.12s;\n  font-size: 11px;\n  cursor: pointer;\n  flex-shrink: 0;\n  background: none;\n  border: none;\n  padding: 4px;\n  align-self: center;\n}\n\n.entity-item:hover .entity-item-fav {\n  opacity: 1;\n}\n\n.entity-item-fav.favorited {\n  opacity: 1;\n  color: #f59e0b;\n}\n\n/* ============================================\n   QUICK ACCESS PANEL (right slide-in)\n   ============================================ */\n\n.quick-access-panel {\n  position: fixed;\n  top: 0;\n  right: 0;\n  width: 320px;\n  height: 100%;\n  background: white;\n  border-left: 1px solid #e5e7eb;\n  z-index: 50;\n  transform: translateX(100%);\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  display: flex;\n  flex-direction: column;\n}\n\n.quick-access-panel.open {\n  transform: translateX(0);\n}\n\n.qa-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 16px;\n  border-bottom: 1px solid #e5e7eb;\n}\n\n.qa-header h3 {\n  font-size: 14px;\n  font-weight: 600;\n  margin: 0;\n}\n\n.qa-close-btn {\n  background: none;\n  border: none;\n  color: #9ca3af;\n  cursor: pointer;\n  font-size: 14px;\n  padding: 4px;\n  border-radius: 4px;\n}\n\n.qa-close-btn:hover {\n  background: #f5f7fa;\n}\n\n.qa-body {\n  flex: 1;\n  overflow-y: auto;\n}\n\n.qa-section {\n  border-bottom: 1px solid #f0f1f3;\n}\n\n.qa-section-header {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 16px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.8px;\n  color: #9ca3af;\n  cursor: pointer;\n  user-select: none;\n}\n\n.qa-section-header .qa-section-icon {\n  font-size: 12px;\n}\n\n.qa-section-header .qa-section-count {\n  background: #f5f7fa;\n  padding: 0 6px;\n  border-radius: 8px;\n  font-size: 10px;\n  margin-left: auto;\n}\n\n.qa-section-header .qa-section-chevron {\n  font-size: 10px;\n  transition: transform 0.15s;\n}\n\n.qa-section.collapsed .qa-section-chevron {\n  transform: rotate(-90deg);\n}\n\n.qa-section-body {\n  padding: 0 8px 8px;\n}\n\n.qa-section.collapsed .qa-section-body {\n  display: none;\n}\n\n.qa-item {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 8px;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: background 0.08s;\n}\n\n.qa-item:hover {\n  background: #f5f7fa;\n}\n\n.qa-item-icon {\n  width: 28px;\n  height: 28px;\n  border-radius: 6px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 12px;\n  background: #f5f7fa;\n  color: #6b7280;\n  flex-shrink: 0;\n}\n\n.qa-item-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.qa-item-name {\n  font-size: 13px;\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.qa-item-meta {\n  font-size: 11px;\n  color: #9ca3af;\n}\n\n.qa-item-time {\n  font-size: 11px;\n  color: #9ca3af;\n  white-space: nowrap;\n}\n\n.qa-empty {\n  padding: 20px 16px;\n  text-align: center;\n  color: #9ca3af;\n  font-size: 13px;\n}\n\n/* Quick Access toggle button badge */\n.qa-badge {\n  background: #1976d2;\n  color: white;\n  font-size: 10px;\n  font-weight: 600;\n  padding: 0 5px;\n  border-radius: 8px;\n  min-width: 16px;\n  text-align: center;\n}\n\n/* No results state for home view */\n.home-no-results {\n  text-align: center;\n  padding: 40px 20px;\n  color: #9ca3af;\n}\n\n.home-no-results i {\n  font-size: 28px;\n  margin-bottom: 10px;\n  display: block;\n}\n\n.home-no-results p {\n  font-size: 14px;\n  margin: 0;\n}\n\n.detail-panel {\n  flex-shrink: 0;\n  height: 100%;\n  background: white;\n  border-left: 1px solid #e0e0e0;\n  box-shadow: -4px 0 16px rgba(0, 0, 0, 0.08);\n  overflow: hidden;\n  animation: slideIn 0.2s ease-out;\n  display: flex;\n  flex-direction: column;\n}\n\n.detail-panel mj-entity-record-detail-panel {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n@keyframes slideIn {\n  from {\n    transform: translateX(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n\n/* Detail Panel Actions Bar */\n.detail-panel-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 12px;\n  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);\n  border-bottom: 1px solid #e2e8f0;\n}\n\n.detail-action-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  border: none;\n  border-radius: 6px;\n  background: white;\n  color: #475569;\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);\n}\n\n.detail-action-btn:hover {\n  background: #3b82f6;\n  color: white;\n  transform: translateY(-1px);\n  box-shadow: 0 2px 4px rgba(59, 130, 246, 0.2);\n}\n\n.detail-action-btn i {\n  font-size: 12px;\n}\n\n:host ::ng-deep mj-explorer-grid-view,\n:host ::ng-deep mj-explorer-cards-view {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n}\n\n/* ============================================\n   HOME SCREEN STYLES\n   ============================================ */\n\n/* Home-level header adjustments */\n.content-header.home-header {\n  border-bottom: none;\n  background: transparent;\n  box-shadow: none;\n  padding: 16px 24px 8px;\n}\n\n.content-body.home-content {\n  padding: 0;\n}\n\n/* Smart filter with search icon (entity-level filter) */\n.filter-icon {\n  position: absolute;\n  left: 14px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: #999;\n  font-size: 14px;\n  pointer-events: none;\n}\n\n.smart-filter-container .smart-filter-input {\n  padding-left: 40px;\n}\n\n/* ============================================\n   VIEW MODE TOGGLE OVERRIDES\n   ============================================ */\n\n.view-mode-toggle .toggle-btn {\n  width: auto;\n  padding: 0 12px;\n  gap: 6px;\n}\n\n.toggle-label {\n  font-size: 12px;\n  font-weight: 500;\n}\n\n/* ============================================\n   EMPTY STATE VARIANTS\n   ============================================ */\n\n.empty-state.small {\n  height: auto;\n  padding: 32px;\n  background: #fafafa;\n}\n\n.empty-state.small .empty-icon {\n  font-size: 40px;\n  margin-bottom: 16px;\n}\n\n.empty-state.small h3 {\n  font-size: 16px;\n}\n\n.empty-state.small p {\n  font-size: 13px;\n}\n\n/* ============================================\n   RESPONSIVE STYLES\n   ============================================ */\n\n@media (max-width: 1200px) {\n  .entity-item-grid {\n    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));\n  }\n}\n\n@media (max-width: 900px) {\n  .content-header {\n    flex-wrap: wrap;\n    gap: 12px;\n  }\n\n  .header-center {\n    order: 3;\n    flex-basis: 100%;\n    max-width: 100%;\n  }\n\n  .search-hero {\n    padding: 24px 16px 16px;\n  }\n\n  .entity-groups-area {\n    padding: 8px 16px 40px;\n  }\n\n  .app-group-entities {\n    padding-left: 36px;\n  }\n\n  .home-main-area.panel-open {\n    margin-right: 0;\n  }\n\n  .quick-access-panel {\n    width: 100%;\n  }\n}\n\n@media (max-width: 600px) {\n  .data-explorer-container {\n    flex-direction: column;\n  }\n\n  .navigation-panel {\n    display: none;\n  }\n\n  .content-header {\n    padding: 12px 16px;\n  }\n\n  .content-body {\n    padding: 12px 16px;\n  }\n\n  .entity-item-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .view-mode-toggle {\n    display: none;\n  }\n\n  .app-group-name {\n    font-size: 17px;\n  }\n\n  .entity-item-name {\n    font-size: 14px;\n  }\n}\n"] }]
     }], () => [{ type: i1.ExplorerStateService }, { type: i0.ChangeDetectorRef }, { type: i2.Router }, { type: i3.RecentAccessService }, { type: i4.NavigationService }, { type: i5.ExportService }, { type: i0.NgZone }], { filterInputRef: [{
             type: ViewChild,
             args: ['filterInput']