@memberjunction/ng-explorer-settings 6.1.0-edge.4 → 6.1.0-edge.6

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 (29) hide show
  1. package/dist/lib/application-management/application-dialog/application-dialog.component.js +2 -2
  2. package/dist/lib/application-management/application-dialog/application-dialog.component.js.map +1 -1
  3. package/dist/lib/application-management/application-management.component.js +4 -4
  4. package/dist/lib/application-management/application-management.component.js.map +1 -1
  5. package/dist/lib/entity-permissions/entity-permissions.component.js +3 -3
  6. package/dist/lib/entity-permissions/entity-permissions.component.js.map +1 -1
  7. package/dist/lib/entity-permissions/permission-dialog/permission-dialog.component.js +1 -1
  8. package/dist/lib/entity-permissions/permission-dialog/permission-dialog.component.js.map +1 -1
  9. package/dist/lib/notification-preferences/notification-preferences.component.js +1 -1
  10. package/dist/lib/role-management/role-dialog/role-dialog.component.js +1 -1
  11. package/dist/lib/role-management/role-dialog/role-dialog.component.js.map +1 -1
  12. package/dist/lib/role-management/role-management.component.js +4 -4
  13. package/dist/lib/role-management/role-management.component.js.map +1 -1
  14. package/dist/lib/settings/settings.component.js +1 -1
  15. package/dist/lib/shared/settings-card.component.js +1 -1
  16. package/dist/lib/sql-logging/sql-logging.component.js +3 -3
  17. package/dist/lib/sql-logging/sql-logging.component.js.map +1 -1
  18. package/dist/lib/user-app-config/user-app-config-content.component.js +1 -1
  19. package/dist/lib/user-app-config/user-app-config.component.js +1 -1
  20. package/dist/lib/user-management/user-dialog/user-dialog.component.d.ts +2 -0
  21. package/dist/lib/user-management/user-dialog/user-dialog.component.d.ts.map +1 -1
  22. package/dist/lib/user-management/user-dialog/user-dialog.component.js +25 -4
  23. package/dist/lib/user-management/user-dialog/user-dialog.component.js.map +1 -1
  24. package/dist/lib/user-management/user-management.component.d.ts +5 -0
  25. package/dist/lib/user-management/user-management.component.d.ts.map +1 -1
  26. package/dist/lib/user-management/user-management.component.js +61 -9
  27. package/dist/lib/user-management/user-management.component.js.map +1 -1
  28. package/dist/lib/user-profile-settings/user-profile-settings.component.js +1 -1
  29. package/package.json +26 -26
package/dist/lib/role-management/role-management.component.js CHANGED
@@ -42,7 +42,7 @@ function RoleManagementComponent_Conditional_15_Template(rf, ctx) { if (rf & 1)
42
42
  function RoleManagementComponent_Conditional_16_For_2_Conditional_20_Template(rf, ctx) { if (rf & 1) {
43
43
  const _r5 = i0.ɵɵgetCurrentView();
44
44
  i0.ɵɵelementStart(0, "div", 41)(1, "div", 42);
45
- i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_16_For_2_Conditional_20_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r5); return i0.ɵɵresetView($event.stopPropagation()); });
45
+ i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_16_For_2_Conditional_20_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
46
46
  i0.ɵɵelementStart(2, "span", 33);
47
47
  i0.ɵɵtext(3);
48
48
  i0.ɵɵelementEnd();
@@ -126,7 +126,7 @@ function RoleManagementComponent_Conditional_16_For_2_Template(rf, ctx) { if (rf
126
126
  i0.ɵɵtext(12);
127
127
  i0.ɵɵelementEnd();
128
128
  i0.ɵɵelementStart(13, "div", 34);
129
- i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_16_For_2_Template_div_click_13_listener($event) { i0.ɵɵrestoreView(_r3); return i0.ɵɵresetView($event.stopPropagation()); });
129
+ i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_16_For_2_Template_div_click_13_listener($event) { return $event.stopPropagation(); });
130
130
  i0.ɵɵelementStart(14, "button", 35);
131
131
  i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_16_For_2_Template_button_click_14_listener() { const role_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.editRole(role_r4)); });
132
132
  i0.ɵɵelement(15, "i", 36);
@@ -200,7 +200,7 @@ function RoleManagementComponent_Conditional_18_Template(rf, ctx) { if (rf & 1)
200
200
  i0.ɵɵelementStart(0, "div", 57);
201
201
  i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_18_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.showDeleteConfirm = false); });
202
202
  i0.ɵɵelementStart(1, "div", 58);
203
- i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_18_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r7); return i0.ɵɵresetView($event.stopPropagation()); });
203
+ i0.ɵɵlistener("click", function RoleManagementComponent_Conditional_18_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
204
204
  i0.ɵɵelementStart(2, "div", 59)(3, "h3", 60);
205
205
  i0.ɵɵelement(4, "i", 61);
206
206
  i0.ɵɵtext(5, " Confirm Delete ");
@@ -728,7 +728,7 @@ let RoleManagementComponent = class RoleManagementComponent extends BaseDashboar
728
728
  i0.ɵɵproperty("data", ctx.roleDialogData)("visible", ctx.showRoleDialog);
729
729
  i0.ɵɵadvance();
730
730
  i0.ɵɵconditional(ctx.showDeleteConfirm && ctx.selectedRole ? 18 : -1);
731
- } }, dependencies: [i1.LoadingComponent, i2.MJButtonDirective, i2.MJPageHeaderInteriorComponent, i2.MJPageBodyInteriorComponent, i2.MJPageSearchComponent, i2.MJFilterPopoverComponent, i2.MJFilterPanelComponent, i2.MJRefreshButtonComponent, i2.MJStatBadgeComponent, i2.MJEmptyStateComponent, i2.MJAlertComponent, i3.RoleDialogComponent, i4.DatePipe], styles: ["\n\n\n\n\n\n\n\n\n\n\n[_nghost-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n overflow: hidden;\n}\n\n\n\n\n\n.sticky-header[_ngcontent-%COMP%] {\n flex-shrink: 0;\n background: var(--mj-bg-page);\n border-bottom: 1px solid var(--mj-border-default);\n box-shadow: var(--mj-shadow-sm);\n z-index: 10;\n}\n\n\n\n\n\n.scrollable-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n -webkit-overflow-scrolling: touch;\n padding: 1rem;\n background: var(--mj-bg-surface-sunken);\n}\n\n@media (min-width: 768px) {\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 1.5rem 2rem;\n }\n}\n\n@media (min-width: 1024px) {\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 2rem;\n }\n}\n\n@media (min-width: 1440px) {\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 2rem 2.5rem;\n }\n}\n\n\n\n\n\n.action-buttons[_ngcontent-%COMP%] {\n flex-shrink: 0;\n display: flex;\n gap: 0.75rem;\n justify-content: flex-end;\n padding: 0.75rem 1rem;\n background: var(--mj-bg-page);\n}\n\n@media (min-width: 768px) {\n .action-buttons[_ngcontent-%COMP%] {\n padding: 1rem 1.5rem;\n }\n}\n\n@media (max-width: 639px) {\n .action-buttons[_ngcontent-%COMP%] {\n justify-content: center;\n flex-wrap: wrap;\n }\n}\n\n\n\n\n\n.mj-grid-4[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 0.5rem;\n padding: 0 1rem 0.75rem 1rem;\n background: var(--mj-bg-page);\n}\n\n@media (min-width: 768px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n grid-template-columns: repeat(4, 1fr);\n padding: 0 1.5rem 1rem 1.5rem;\n gap: 0.75rem;\n }\n}\n\n@media (min-width: 1024px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n gap: 1rem;\n }\n}\n\n\n\n.mj-card[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-card);\n border-radius: var(--mj-radius-lg);\n padding: 1rem;\n box-shadow: var(--mj-shadow-sm);\n display: flex;\n align-items: center;\n gap: 1rem;\n border: 1px solid var(--mj-border-default);\n cursor: default;\n pointer-events: none;\n}\n\n@media (min-width: 768px) {\n .mj-card[_ngcontent-%COMP%] {\n padding: 1rem 1.25rem;\n }\n}\n\n\n\n\n\n.stat-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border-radius: var(--mj-radius-lg);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.25rem;\n flex-shrink: 0;\n}\n\n@media (min-width: 768px) {\n .stat-icon[_ngcontent-%COMP%] {\n width: 52px;\n height: 52px;\n font-size: 1.375rem;\n }\n}\n\n.stat-icon-total[_ngcontent-%COMP%] {\n background: var(--mj-color-accent-300);\n color: var(--mj-brand-primary);\n}\n\n.stat-icon-active[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-status-success);\n}\n\n\n\n\n\n.stat-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.stat-content[_ngcontent-%COMP%] .stat-value[_ngcontent-%COMP%] {\n font-size: 1.75rem;\n font-weight: 700;\n color: var(--mj-text-primary);\n line-height: 1;\n letter-spacing: -0.02em;\n}\n\n@media (min-width: 768px) {\n .stat-content[_ngcontent-%COMP%] .stat-value[_ngcontent-%COMP%] {\n font-size: 2rem;\n }\n}\n\n.stat-content[_ngcontent-%COMP%] .stat-label[_ngcontent-%COMP%] {\n font-size: 0.75rem;\n font-weight: 500;\n color: var(--mj-text-secondary);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n margin-top: 0.25rem;\n}\n\n@media (min-width: 768px) {\n .stat-content[_ngcontent-%COMP%] .stat-label[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n }\n}\n\n\n\n\n\n.filters-section[_ngcontent-%COMP%] {\n flex-shrink: 0;\n background: var(--mj-bg-surface-card);\n margin: 0 1rem 0.75rem 1rem;\n padding: 0.75rem;\n border-radius: var(--mj-radius-lg);\n border: 1px solid var(--mj-border-default);\n}\n\n@media (min-width: 768px) {\n .filters-section[_ngcontent-%COMP%] {\n margin: 0 1.5rem 1rem 1.5rem;\n padding: 1rem 1.25rem;\n }\n}\n\n.filters-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 1rem;\n align-items: flex-end;\n flex-wrap: wrap;\n}\n\n@media (min-width: 768px) {\n .filters-row[_ngcontent-%COMP%] {\n gap: 1.5rem;\n }\n}\n\n.mj-filter-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.mj-filter-label[_ngcontent-%COMP%] {\n font-size: 0.75rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n}\n\n.mj-filter-buttons[_ngcontent-%COMP%] {\n display: flex;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-full);\n padding: 4px;\n gap: 2px;\n}\n\n\n\n\n\n.mj-search[_ngcontent-%COMP%] {\n position: relative;\n flex: 1;\n min-width: 200px;\n}\n\n@media (min-width: 640px) {\n .mj-search[_ngcontent-%COMP%] {\n min-width: 280px;\n }\n}\n\n@media (min-width: 1024px) {\n .mj-search[_ngcontent-%COMP%] {\n min-width: 400px;\n max-width: 600px;\n }\n}\n\n@media (min-width: 1440px) {\n .mj-search[_ngcontent-%COMP%] {\n min-width: 500px;\n max-width: 800px;\n }\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-icon[_ngcontent-%COMP%] {\n position: absolute;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n color: var(--mj-text-secondary);\n font-size: 1rem;\n pointer-events: none;\n transition: color 0.2s ease;\n}\n\n@media (min-width: 1024px) {\n .mj-search[_ngcontent-%COMP%] .mj-search-icon[_ngcontent-%COMP%] {\n left: 1.25rem;\n font-size: 1.125rem;\n }\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%] {\n width: 100%;\n padding: 0.875rem 1rem 0.875rem 2.75rem;\n border: 2px solid var(--mj-border-default);\n border-radius: var(--mj-radius-full);\n font-size: 1rem;\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n min-height: 44px;\n}\n\n@media (min-width: 1024px) {\n .mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%] {\n padding: 1rem 1.25rem 1rem 3.25rem;\n font-size: 1.0625rem;\n }\n}\n\n@media (min-width: 1440px) {\n .mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%] {\n padding: 1.125rem 1.5rem 1.125rem 3.5rem;\n }\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%]::placeholder {\n color: var(--mj-text-secondary);\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface);\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: var(--mj-brand-primary);\n box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.2);\n background: var(--mj-bg-page);\n}\n\n.mj-search[_ngcontent-%COMP%]:focus-within .mj-search-icon[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n\n\n\n\n.content-area[_ngcontent-%COMP%] {\n flex: 1 1 auto;\n overflow: visible;\n position: relative;\n background: var(--mj-bg-page);\n border-radius: var(--mj-radius-xl);\n box-shadow: var(--mj-shadow-sm);\n padding: 1rem;\n border: 1px solid var(--mj-border-default);\n}\n\n@media (min-width: 768px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 1.5rem;\n }\n}\n\n\n\n\n\n.expand-btn[_ngcontent-%COMP%] {\n padding: 0.625rem;\n border: none;\n background: transparent;\n color: var(--mj-text-secondary);\n font-size: 1rem;\n cursor: pointer;\n transition: all 0.2s ease;\n border-radius: var(--mj-radius-full);\n min-width: 44px;\n min-height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.expand-btn[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n}\n\n.expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1);\n}\n\n\n\n\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.375rem 0.875rem;\n border-radius: var(--mj-radius-full);\n font-size: 0.75rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.03em;\n}\n\n.status-badge.status-active[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-color-success-800);\n border: 1px solid var(--mj-status-success);\n}\n\n.status-badge.status-inactive[_ngcontent-%COMP%] {\n background: var(--mj-color-error-100);\n color: var(--mj-status-error);\n border: 1px solid var(--mj-status-error);\n}\n\n.status-badge[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.625rem;\n}\n\n\n\n\n\n.mobile-actions-bar[_ngcontent-%COMP%] {\n display: none;\n}\n\n.mobile-action-buttons[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.5rem;\n}\n\n\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 4rem 2rem;\n}\n\n.empty-state[_ngcontent-%COMP%] .empty-icon[_ngcontent-%COMP%] {\n font-size: 4rem;\n color: var(--mj-border-default);\n margin-bottom: 1.5rem;\n}\n\n.empty-state[_ngcontent-%COMP%] .empty-text[_ngcontent-%COMP%] {\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 0.5rem 0;\n}\n\n.empty-state[_ngcontent-%COMP%] .empty-subtext[_ngcontent-%COMP%] {\n font-size: 1rem;\n color: var(--mj-text-secondary);\n margin: 0;\n}\n\n\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 4rem 2rem;\n}\n\n\n\n\n\n.error-container[_ngcontent-%COMP%] {\n text-align: center;\n padding: 4rem 2rem;\n}\n\n.error-container[_ngcontent-%COMP%] .error-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 1rem;\n}\n\n.error-container[_ngcontent-%COMP%] .error-icon[_ngcontent-%COMP%] {\n font-size: 3.5rem;\n color: var(--mj-status-error);\n margin-bottom: 1rem;\n}\n\n.error-container[_ngcontent-%COMP%] .error-message[_ngcontent-%COMP%] {\n font-size: 1.0625rem;\n color: var(--mj-text-primary);\n margin: 0 0 1.5rem 0;\n}\n\n\n\n\n\n.modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.4);\n backdrop-filter: blur(4px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n padding: 1rem;\n animation: _ngcontent-%COMP%_fadeIn 0.2s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.modal-dialog[_ngcontent-%COMP%] {\n background: var(--mj-bg-page);\n border-radius: var(--mj-radius-2xl);\n box-shadow: var(--mj-shadow-2xl);\n max-width: 500px;\n width: 100%;\n max-height: 90vh;\n overflow: hidden;\n animation: _ngcontent-%COMP%_slideUp 0.3s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.modal-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1.5rem;\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.modal-header[_ngcontent-%COMP%] .modal-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n font-size: 1.375rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0;\n}\n\n.modal-header[_ngcontent-%COMP%] .modal-close[_ngcontent-%COMP%] {\n padding: 0.625rem;\n border: none;\n background: transparent;\n color: var(--mj-text-secondary);\n font-size: 1.25rem;\n cursor: pointer;\n border-radius: var(--mj-radius-full);\n transition: all 0.2s ease;\n min-width: 44px;\n min-height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.modal-header[_ngcontent-%COMP%] .modal-close[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n}\n\n.modal-body[_ngcontent-%COMP%] {\n padding: 1.5rem;\n}\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 1rem;\n color: var(--mj-text-primary);\n margin: 0 0 1rem 0;\n line-height: 1.5;\n}\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%]:last-child {\n margin-bottom: 0;\n}\n\n.modal-footer[_ngcontent-%COMP%] {\n display: flex;\n justify-content: flex-start;\n gap: 0.75rem;\n padding: 1.5rem;\n border-top: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-sunken);\n}\n\n@media (max-width: 639px) {\n .modal-dialog[_ngcontent-%COMP%] {\n width: 95%;\n max-height: 85vh;\n }\n\n .modal-header[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .modal-header[_ngcontent-%COMP%] .modal-title[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n }\n\n .modal-body[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .modal-footer[_ngcontent-%COMP%] {\n padding: 1rem;\n flex-direction: column;\n }\n\n}\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n.filter-button[_ngcontent-%COMP%] {\n display: none;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n padding: 0.75rem 1.25rem;\n border: 2px solid var(--mj-border-default);\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n border-radius: var(--mj-radius-full);\n font-size: 0.875rem;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n min-height: 44px;\n min-width: 44px;\n}\n\n.filter-button[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface);\n}\n\n.filter-button[_ngcontent-%COMP%]:active {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n border-color: var(--mj-brand-primary);\n}\n\n.filter-button[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n}\n\n\n\n\n\n.filter-modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.4);\n backdrop-filter: blur(4px);\n display: flex;\n align-items: flex-end;\n justify-content: center;\n z-index: 1000;\n animation: _ngcontent-%COMP%_fadeIn 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n padding: 0;\n}\n\n.filter-modal[_ngcontent-%COMP%] {\n background: var(--mj-bg-page);\n border-radius: var(--mj-radius-2xl) var(--mj-radius-2xl) 0 0;\n box-shadow: var(--mj-shadow-2xl);\n width: 100%;\n max-height: 80vh;\n overflow: hidden;\n animation: _ngcontent-%COMP%_slideUpFromBottom 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n display: flex;\n flex-direction: column;\n}\n\n.filter-modal-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1.25rem 1.5rem;\n border-bottom: 1px solid var(--mj-border-default);\n flex-shrink: 0;\n}\n\n.filter-modal-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0;\n}\n\n.filter-modal-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-size: 1.375rem;\n}\n\n.filter-modal-close[_ngcontent-%COMP%] {\n padding: 0.625rem;\n border: none;\n background: transparent;\n color: var(--mj-text-secondary);\n font-size: 1.25rem;\n cursor: pointer;\n border-radius: var(--mj-radius-full);\n transition: all 0.2s ease;\n min-width: 44px;\n min-height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.filter-modal-close[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n}\n\n.filter-modal-body[_ngcontent-%COMP%] {\n padding: 1.5rem;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n flex: 1;\n}\n\n.filter-modal-footer[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.75rem;\n padding: 1.25rem 1.5rem;\n border-top: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-sunken);\n flex-shrink: 0;\n}\n\n.filter-modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%] {\n flex: 1;\n margin: 0;\n}\n\n\n\n.filter-options-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n.filter-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n}\n\n.filter-group-label[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n margin: 0;\n}\n\n.filter-group-options[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.filter-option[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n padding: 0.875rem 1rem;\n background: var(--mj-bg-surface-sunken);\n border: 2px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg);\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n min-height: 56px;\n}\n\n.filter-option[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface-sunken);\n}\n\n.filter-option.selected[_ngcontent-%COMP%] {\n background: var(--mj-color-accent-300);\n border-color: var(--mj-brand-primary);\n color: var(--mj-brand-primary);\n}\n\n.filter-option[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%], \n.filter-option[_ngcontent-%COMP%] input[type=\"radio\"][_ngcontent-%COMP%] {\n width: 20px;\n height: 20px;\n cursor: pointer;\n accent-color: var(--mj-brand-primary);\n flex-shrink: 0;\n}\n\n.filter-option-label[_ngcontent-%COMP%] {\n flex: 1;\n font-size: 1rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.filter-option.selected[_ngcontent-%COMP%] .filter-option-label[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-weight: 600;\n}\n\n\n\n\n\n.text-danger[_ngcontent-%COMP%] {\n color: var(--mj-status-error);\n}\n\n.text-warning[_ngcontent-%COMP%] {\n color: var(--mj-color-warning-500);\n}\n\n.text-success[_ngcontent-%COMP%] {\n color: var(--mj-status-success);\n}\n\n\n\n\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes _ngcontent-%COMP%_slideUp {\n from {\n transform: translateY(20px);\n opacity: 0;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes _ngcontent-%COMP%_slideUpFromBottom {\n from {\n transform: translateY(100%);\n opacity: 0;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n\n\n\n\n.mj-search-input[_ngcontent-%COMP%]:focus-visible, \nbutton[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n\n\n\n\n@media (prefers-reduced-motion: reduce) {\n *[_ngcontent-%COMP%], \n *[_ngcontent-%COMP%]::before, \n *[_ngcontent-%COMP%]::after {\n animation-duration: 0.01ms !important;\n animation-iteration-count: 1 !important;\n transition-duration: 0.01ms !important;\n }\n}", "\n\n\n\n\n\n\n\n\n\n\n\n\n.status-chips[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: var(--mj-space-2);\n flex-shrink: 0;\n}\n\n\n\n\n\n.mj-grid-4[_ngcontent-%COMP%] {\n gap: 0.75rem;\n padding: 0 1rem 1rem 1rem;\n}\n\n@media (min-width: 768px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n padding: 0 1.5rem 1.25rem 1.5rem;\n gap: 1rem;\n }\n}\n\n@media (min-width: 1024px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n gap: 1.25rem;\n }\n}\n\n\n\n.mj-card[_ngcontent-%COMP%] {\n box-shadow: none;\n}\n\n@media (min-width: 768px) {\n .mj-card[_ngcontent-%COMP%] {\n padding: 1.125rem 1.25rem;\n }\n}\n\n\n\n.stat-icon-system[_ngcontent-%COMP%] {\n background: var(--mj-color-warning-50);\n color: var(--mj-color-warning-700);\n}\n\n.stat-icon-custom[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-status-success);\n}\n\n.stat-icon-active[_ngcontent-%COMP%] {\n background: var(--mj-color-accent-300);\n color: var(--mj-brand-primary);\n}\n\n\n\n\n\n.roles-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n\n\n\n\n.role-card[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-card);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-xl);\n overflow: hidden;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.role-card[_ngcontent-%COMP%]:hover {\n box-shadow: var(--mj-shadow-md);\n border-color: var(--mj-brand-primary);\n}\n\n.role-card.expanded[_ngcontent-%COMP%] {\n box-shadow: var(--mj-shadow-lg);\n border-color: var(--mj-brand-primary);\n}\n\n.role-card.expanded[_ngcontent-%COMP%] .expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n transform: rotate(180deg);\n}\n\n.role-header[_ngcontent-%COMP%] {\n padding: 1.25rem 1.5rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n background: var(--mj-bg-surface);\n transition: background-color 0.2s ease;\n}\n\n.role-header[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-sunken);\n}\n\n.role-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n flex: 1;\n min-width: 0;\n}\n\n.role-icon-wrapper[_ngcontent-%COMP%] {\n width: 52px;\n height: 52px;\n border-radius: var(--mj-radius-lg);\n background: var(--mj-color-accent-300);\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mj-brand-primary);\n font-size: 1.375rem;\n flex-shrink: 0;\n}\n\n.role-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.role-details[_ngcontent-%COMP%] .role-name[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 0.25rem 0;\n word-break: break-word;\n overflow-wrap: break-word;\n}\n\n.role-details[_ngcontent-%COMP%] .role-description[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n color: var(--mj-text-secondary);\n margin: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n@media (max-width: 639px) {\n .role-details[_ngcontent-%COMP%] .role-description[_ngcontent-%COMP%] {\n white-space: normal;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n }\n}\n\n.role-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n flex-shrink: 0;\n}\n\n\n\n\n\n.role-type-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.375rem 0.875rem;\n border-radius: var(--mj-radius-full);\n font-size: 0.75rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.03em;\n}\n\n.role-type-badge.badge-system[_ngcontent-%COMP%] {\n background: var(--mj-color-warning-50);\n color: var(--mj-color-warning-800);\n border: 1px solid var(--mj-color-warning-500);\n}\n\n.role-type-badge.badge-custom[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-color-success-800);\n border: 1px solid var(--mj-status-success);\n}\n\n\n\n\n\n.role-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.375rem;\n}\n\n\n\n.expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n\n\n\n\n.role-content[_ngcontent-%COMP%] {\n padding: 1.5rem;\n background: var(--mj-bg-surface);\n border-top: 1px solid var(--mj-border-default);\n animation: slideDown 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.role-stats[_ngcontent-%COMP%] {\n display: flex;\n gap: 2rem;\n margin-bottom: 1.5rem;\n flex-wrap: wrap;\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.9375rem;\n padding: 0.5rem 1rem;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-md);\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-size: 1rem;\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] .stat-label[_ngcontent-%COMP%] {\n color: var(--mj-text-secondary);\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] .stat-value[_ngcontent-%COMP%] {\n color: var(--mj-text-primary);\n font-weight: 600;\n}\n\n\n\n\n\n.permissions-preview[_ngcontent-%COMP%] {\n padding: 1.25rem;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-lg);\n border: 1px solid var(--mj-border-default);\n}\n\n.permissions-preview[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.625rem;\n font-size: 1rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 0.5rem 0;\n}\n\n.permissions-preview[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-size: 1.125rem;\n}\n\n.permissions-preview[_ngcontent-%COMP%] .permissions-note[_ngcontent-%COMP%] {\n font-size: 0.9375rem;\n color: var(--mj-text-secondary);\n margin: 0;\n}\n\n\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n line-height: 1.6;\n}\n\n\n\n.modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n\n\n\n\n\n@media (min-width: 1440px) {\n .role-management-container[_ngcontent-%COMP%] {\n margin: 0 auto;\n }\n\n .action-buttons[_ngcontent-%COMP%] {\n padding: 1rem 2rem;\n }\n\n .mj-grid-4[_ngcontent-%COMP%] {\n padding: 0 2rem 1.25rem 2rem;\n gap: 1.5rem;\n }\n\n}\n\n\n\n\n\n@media (max-width: 639px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n display: none !important;\n }\n\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n\n .modal-backdrop[_ngcontent-%COMP%] {\n padding: 0.5rem;\n }\n\n .modal-dialog[_ngcontent-%COMP%] {\n border-radius: var(--mj-radius-xl);\n max-height: 95vh;\n }\n\n .roles-list[_ngcontent-%COMP%] {\n gap: 0.75rem;\n }\n\n .role-card[_ngcontent-%COMP%] {\n border-radius: var(--mj-radius-lg);\n overflow: hidden;\n }\n\n .role-header[_ngcontent-%COMP%] {\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 0.75rem;\n padding: 1rem;\n }\n\n .role-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n flex-direction: row;\n align-items: flex-start;\n gap: 0.875rem;\n }\n\n .role-icon-wrapper[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n font-size: 1rem;\n flex-shrink: 0;\n }\n\n .role-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n }\n\n .role-details[_ngcontent-%COMP%] .role-name[_ngcontent-%COMP%] {\n font-size: 1rem;\n line-height: 1.3;\n margin-bottom: 0.125rem;\n }\n\n .role-details[_ngcontent-%COMP%] .role-description[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n }\n\n .role-meta[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n padding-top: 0;\n border-top: none;\n width: auto;\n }\n\n .role-meta[_ngcontent-%COMP%] .role-type-badge[_ngcontent-%COMP%] {\n display: none;\n }\n\n .role-meta[_ngcontent-%COMP%] .role-actions[_ngcontent-%COMP%] {\n display: none;\n }\n\n .expand-btn[_ngcontent-%COMP%] {\n flex-shrink: 0;\n min-width: 40px;\n min-height: 40px;\n padding: 0.5rem;\n }\n\n .expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n }\n\n .mobile-actions-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.75rem;\n padding: 0.875rem;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-lg);\n margin-bottom: 1rem;\n }\n\n .mobile-actions-bar[_ngcontent-%COMP%] .role-type-badge[_ngcontent-%COMP%] {\n padding: 0.375rem 0.75rem;\n font-size: 0.6875rem;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.5rem;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] .mj-btn-sm[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.5rem 0.875rem;\n min-height: 36px;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] .mj-btn-sm[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] .btn-label[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n font-weight: 500;\n }\n\n .role-stats[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 0.5rem;\n margin-bottom: 1rem;\n }\n\n .role-content[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .permissions-preview[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .loading-container[_ngcontent-%COMP%] {\n padding: 3rem 1.5rem;\n }\n}\n\n\n\n@media (max-width: 374px) {\n .action-buttons[_ngcontent-%COMP%] {\n padding: 0.375rem 0.5rem;\n }\n\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 0.5rem;\n }\n\n .role-header[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n}"] });
731
+ } }, dependencies: [i1.LoadingComponent, i2.MJButtonDirective, i2.MJPageHeaderInteriorComponent, i2.MJPageBodyInteriorComponent, i2.MJPageSearchComponent, i2.MJFilterPopoverComponent, i2.MJFilterPanelComponent, i2.MJRefreshButtonComponent, i2.MJStatBadgeComponent, i2.MJEmptyStateComponent, i2.MJAlertComponent, i3.RoleDialogComponent, i4.DatePipe], styles: ["\n\n\n\n\n\n\n\n\n[_nghost-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n overflow: hidden;\n}\n\n\n\n\n.sticky-header[_ngcontent-%COMP%] {\n flex-shrink: 0;\n background: var(--mj-bg-page);\n border-bottom: 1px solid var(--mj-border-default);\n box-shadow: var(--mj-shadow-sm);\n z-index: 10;\n}\n\n\n\n\n.scrollable-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n -webkit-overflow-scrolling: touch;\n padding: 1rem;\n background: var(--mj-bg-surface-sunken);\n}\n\n@media (min-width: 768px) {\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 1.5rem 2rem;\n }\n}\n\n@media (min-width: 1024px) {\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 2rem;\n }\n}\n\n@media (min-width: 1440px) {\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 2rem 2.5rem;\n }\n}\n\n\n\n\n.action-buttons[_ngcontent-%COMP%] {\n flex-shrink: 0;\n display: flex;\n gap: 0.75rem;\n justify-content: flex-end;\n padding: 0.75rem 1rem;\n background: var(--mj-bg-page);\n}\n\n@media (min-width: 768px) {\n .action-buttons[_ngcontent-%COMP%] {\n padding: 1rem 1.5rem;\n }\n}\n\n@media (max-width: 639px) {\n .action-buttons[_ngcontent-%COMP%] {\n justify-content: center;\n flex-wrap: wrap;\n }\n}\n\n\n\n\n.mj-grid-4[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 0.5rem;\n padding: 0 1rem 0.75rem 1rem;\n background: var(--mj-bg-page);\n}\n\n@media (min-width: 768px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n grid-template-columns: repeat(4, 1fr);\n padding: 0 1.5rem 1rem 1.5rem;\n gap: 0.75rem;\n }\n}\n\n@media (min-width: 1024px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n gap: 1rem;\n }\n}\n\n\n.mj-card[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-card);\n border-radius: var(--mj-radius-lg);\n padding: 1rem;\n box-shadow: var(--mj-shadow-sm);\n display: flex;\n align-items: center;\n gap: 1rem;\n border: 1px solid var(--mj-border-default);\n cursor: default;\n pointer-events: none;\n}\n\n@media (min-width: 768px) {\n .mj-card[_ngcontent-%COMP%] {\n padding: 1rem 1.25rem;\n }\n}\n\n\n\n\n.stat-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border-radius: var(--mj-radius-lg);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.25rem;\n flex-shrink: 0;\n}\n\n@media (min-width: 768px) {\n .stat-icon[_ngcontent-%COMP%] {\n width: 52px;\n height: 52px;\n font-size: 1.375rem;\n }\n}\n\n.stat-icon-total[_ngcontent-%COMP%] {\n background: var(--mj-color-accent-300);\n color: var(--mj-brand-primary);\n}\n\n.stat-icon-active[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-status-success);\n}\n\n\n\n\n.stat-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.stat-content[_ngcontent-%COMP%] .stat-value[_ngcontent-%COMP%] {\n font-size: 1.75rem;\n font-weight: 700;\n color: var(--mj-text-primary);\n line-height: 1;\n letter-spacing: -0.02em;\n}\n\n@media (min-width: 768px) {\n .stat-content[_ngcontent-%COMP%] .stat-value[_ngcontent-%COMP%] {\n font-size: 2rem;\n }\n}\n\n.stat-content[_ngcontent-%COMP%] .stat-label[_ngcontent-%COMP%] {\n font-size: 0.75rem;\n font-weight: 500;\n color: var(--mj-text-secondary);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n margin-top: 0.25rem;\n}\n\n@media (min-width: 768px) {\n .stat-content[_ngcontent-%COMP%] .stat-label[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n }\n}\n\n\n\n\n.filters-section[_ngcontent-%COMP%] {\n flex-shrink: 0;\n background: var(--mj-bg-surface-card);\n margin: 0 1rem 0.75rem 1rem;\n padding: 0.75rem;\n border-radius: var(--mj-radius-lg);\n border: 1px solid var(--mj-border-default);\n}\n\n@media (min-width: 768px) {\n .filters-section[_ngcontent-%COMP%] {\n margin: 0 1.5rem 1rem 1.5rem;\n padding: 1rem 1.25rem;\n }\n}\n\n.filters-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 1rem;\n align-items: flex-end;\n flex-wrap: wrap;\n}\n\n@media (min-width: 768px) {\n .filters-row[_ngcontent-%COMP%] {\n gap: 1.5rem;\n }\n}\n\n.mj-filter-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.mj-filter-label[_ngcontent-%COMP%] {\n font-size: 0.75rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n}\n\n.mj-filter-buttons[_ngcontent-%COMP%] {\n display: flex;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-full);\n padding: 4px;\n gap: 2px;\n}\n\n\n\n\n.mj-search[_ngcontent-%COMP%] {\n position: relative;\n flex: 1;\n min-width: 200px;\n}\n\n@media (min-width: 640px) {\n .mj-search[_ngcontent-%COMP%] {\n min-width: 280px;\n }\n}\n\n@media (min-width: 1024px) {\n .mj-search[_ngcontent-%COMP%] {\n min-width: 400px;\n max-width: 600px;\n }\n}\n\n@media (min-width: 1440px) {\n .mj-search[_ngcontent-%COMP%] {\n min-width: 500px;\n max-width: 800px;\n }\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-icon[_ngcontent-%COMP%] {\n position: absolute;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n color: var(--mj-text-secondary);\n font-size: 1rem;\n pointer-events: none;\n transition: color 0.2s ease;\n}\n\n@media (min-width: 1024px) {\n .mj-search[_ngcontent-%COMP%] .mj-search-icon[_ngcontent-%COMP%] {\n left: 1.25rem;\n font-size: 1.125rem;\n }\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%] {\n width: 100%;\n padding: 0.875rem 1rem 0.875rem 2.75rem;\n border: 2px solid var(--mj-border-default);\n border-radius: var(--mj-radius-full);\n font-size: 1rem;\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n min-height: 44px;\n}\n\n@media (min-width: 1024px) {\n .mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%] {\n padding: 1rem 1.25rem 1rem 3.25rem;\n font-size: 1.0625rem;\n }\n}\n\n@media (min-width: 1440px) {\n .mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%] {\n padding: 1.125rem 1.5rem 1.125rem 3.5rem;\n }\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%]::placeholder {\n color: var(--mj-text-secondary);\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface);\n}\n\n.mj-search[_ngcontent-%COMP%] .mj-search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: var(--mj-brand-primary);\n box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.2);\n background: var(--mj-bg-page);\n}\n\n.mj-search[_ngcontent-%COMP%]:focus-within .mj-search-icon[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n\n\n\n.content-area[_ngcontent-%COMP%] {\n flex: 1 1 auto;\n overflow: visible;\n position: relative;\n background: var(--mj-bg-page);\n border-radius: var(--mj-radius-xl);\n box-shadow: var(--mj-shadow-sm);\n padding: 1rem;\n border: 1px solid var(--mj-border-default);\n}\n\n@media (min-width: 768px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 1.5rem;\n }\n}\n\n\n\n\n.expand-btn[_ngcontent-%COMP%] {\n padding: 0.625rem;\n border: none;\n background: transparent;\n color: var(--mj-text-secondary);\n font-size: 1rem;\n cursor: pointer;\n transition: all 0.2s ease;\n border-radius: var(--mj-radius-full);\n min-width: 44px;\n min-height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.expand-btn[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n}\n\n.expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n transition: transform 0.3s cubic-bezier(0, 0, 0.2, 1);\n}\n\n\n\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.375rem 0.875rem;\n border-radius: var(--mj-radius-full);\n font-size: 0.75rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.03em;\n}\n\n.status-badge.status-active[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-color-success-800);\n border: 1px solid var(--mj-status-success);\n}\n\n.status-badge.status-inactive[_ngcontent-%COMP%] {\n background: var(--mj-color-error-100);\n color: var(--mj-status-error);\n border: 1px solid var(--mj-status-error);\n}\n\n.status-badge[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.625rem;\n}\n\n\n\n\n.mobile-actions-bar[_ngcontent-%COMP%] {\n display: none;\n}\n\n.mobile-action-buttons[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.5rem;\n}\n\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 4rem 2rem;\n}\n\n.empty-state[_ngcontent-%COMP%] .empty-icon[_ngcontent-%COMP%] {\n font-size: 4rem;\n color: var(--mj-border-default);\n margin-bottom: 1.5rem;\n}\n\n.empty-state[_ngcontent-%COMP%] .empty-text[_ngcontent-%COMP%] {\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 0.5rem 0;\n}\n\n.empty-state[_ngcontent-%COMP%] .empty-subtext[_ngcontent-%COMP%] {\n font-size: 1rem;\n color: var(--mj-text-secondary);\n margin: 0;\n}\n\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 4rem 2rem;\n}\n\n\n\n\n.error-container[_ngcontent-%COMP%] {\n text-align: center;\n padding: 4rem 2rem;\n}\n\n.error-container[_ngcontent-%COMP%] .error-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 1rem;\n}\n\n.error-container[_ngcontent-%COMP%] .error-icon[_ngcontent-%COMP%] {\n font-size: 3.5rem;\n color: var(--mj-status-error);\n margin-bottom: 1rem;\n}\n\n.error-container[_ngcontent-%COMP%] .error-message[_ngcontent-%COMP%] {\n font-size: 1.0625rem;\n color: var(--mj-text-primary);\n margin: 0 0 1.5rem 0;\n}\n\n\n\n\n.modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n inset: 0;\n background: rgba(0, 0, 0, 0.4);\n backdrop-filter: blur(4px);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n padding: 1rem;\n animation: _ngcontent-%COMP%_fadeIn 0.2s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.modal-dialog[_ngcontent-%COMP%] {\n background: var(--mj-bg-page);\n border-radius: var(--mj-radius-2xl);\n box-shadow: var(--mj-shadow-2xl);\n max-width: 500px;\n width: 100%;\n max-height: 90vh;\n overflow: hidden;\n animation: _ngcontent-%COMP%_slideUp 0.3s cubic-bezier(0, 0, 0.2, 1);\n}\n\n.modal-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1.5rem;\n border-bottom: 1px solid var(--mj-border-default);\n}\n\n.modal-header[_ngcontent-%COMP%] .modal-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n font-size: 1.375rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0;\n}\n\n.modal-header[_ngcontent-%COMP%] .modal-close[_ngcontent-%COMP%] {\n padding: 0.625rem;\n border: none;\n background: transparent;\n color: var(--mj-text-secondary);\n font-size: 1.25rem;\n cursor: pointer;\n border-radius: var(--mj-radius-full);\n transition: all 0.2s ease;\n min-width: 44px;\n min-height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.modal-header[_ngcontent-%COMP%] .modal-close[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n}\n\n.modal-body[_ngcontent-%COMP%] {\n padding: 1.5rem;\n}\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 1rem;\n color: var(--mj-text-primary);\n margin: 0 0 1rem 0;\n line-height: 1.5;\n}\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%]:last-child {\n margin-bottom: 0;\n}\n\n.modal-footer[_ngcontent-%COMP%] {\n display: flex;\n justify-content: flex-start;\n gap: 0.75rem;\n padding: 1.5rem;\n border-top: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-sunken);\n}\n\n@media (max-width: 639px) {\n .modal-dialog[_ngcontent-%COMP%] {\n width: 95%;\n max-height: 85vh;\n }\n\n .modal-header[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .modal-header[_ngcontent-%COMP%] .modal-title[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n }\n\n .modal-body[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .modal-footer[_ngcontent-%COMP%] {\n padding: 1rem;\n flex-direction: column;\n }\n\n}\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n.filter-button[_ngcontent-%COMP%] {\n display: none;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n padding: 0.75rem 1.25rem;\n border: 2px solid var(--mj-border-default);\n background: var(--mj-bg-page);\n color: var(--mj-text-primary);\n border-radius: var(--mj-radius-full);\n font-size: 0.875rem;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n min-height: 44px;\n min-width: 44px;\n}\n\n.filter-button[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface);\n}\n\n.filter-button[_ngcontent-%COMP%]:active {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n border-color: var(--mj-brand-primary);\n}\n\n.filter-button[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n}\n\n\n\n\n.filter-modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.4);\n backdrop-filter: blur(4px);\n display: flex;\n align-items: flex-end;\n justify-content: center;\n z-index: 1000;\n animation: _ngcontent-%COMP%_fadeIn 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n padding: 0;\n}\n\n.filter-modal[_ngcontent-%COMP%] {\n background: var(--mj-bg-page);\n border-radius: var(--mj-radius-2xl) var(--mj-radius-2xl) 0 0;\n box-shadow: var(--mj-shadow-2xl);\n width: 100%;\n max-height: 80vh;\n overflow: hidden;\n animation: _ngcontent-%COMP%_slideUpFromBottom 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n display: flex;\n flex-direction: column;\n}\n\n.filter-modal-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 1.25rem 1.5rem;\n border-bottom: 1px solid var(--mj-border-default);\n flex-shrink: 0;\n}\n\n.filter-modal-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0;\n}\n\n.filter-modal-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-size: 1.375rem;\n}\n\n.filter-modal-close[_ngcontent-%COMP%] {\n padding: 0.625rem;\n border: none;\n background: transparent;\n color: var(--mj-text-secondary);\n font-size: 1.25rem;\n cursor: pointer;\n border-radius: var(--mj-radius-full);\n transition: all 0.2s ease;\n min-width: 44px;\n min-height: 44px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.filter-modal-close[_ngcontent-%COMP%]:hover {\n background: var(--mj-brand-primary);\n color: var(--mj-brand-on-primary);\n}\n\n.filter-modal-body[_ngcontent-%COMP%] {\n padding: 1.5rem;\n overflow-y: auto;\n -webkit-overflow-scrolling: touch;\n flex: 1;\n}\n\n.filter-modal-footer[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.75rem;\n padding: 1.25rem 1.5rem;\n border-top: 1px solid var(--mj-border-default);\n background: var(--mj-bg-surface-sunken);\n flex-shrink: 0;\n}\n\n.filter-modal-footer[_ngcontent-%COMP%] button[_ngcontent-%COMP%] {\n flex: 1;\n margin: 0;\n}\n\n\n.filter-options-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n.filter-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n}\n\n.filter-group-label[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n text-transform: uppercase;\n letter-spacing: 0.05em;\n margin: 0;\n}\n\n.filter-group-options[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.filter-option[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n padding: 0.875rem 1rem;\n background: var(--mj-bg-surface-sunken);\n border: 2px solid var(--mj-border-default);\n border-radius: var(--mj-radius-lg);\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n min-height: 56px;\n}\n\n.filter-option[_ngcontent-%COMP%]:hover {\n border-color: var(--mj-brand-primary);\n background: var(--mj-bg-surface-sunken);\n}\n\n.filter-option.selected[_ngcontent-%COMP%] {\n background: var(--mj-color-accent-300);\n border-color: var(--mj-brand-primary);\n color: var(--mj-brand-primary);\n}\n\n.filter-option[_ngcontent-%COMP%] input[type=\"checkbox\"][_ngcontent-%COMP%], \n.filter-option[_ngcontent-%COMP%] input[type=\"radio\"][_ngcontent-%COMP%] {\n width: 20px;\n height: 20px;\n cursor: pointer;\n accent-color: var(--mj-brand-primary);\n flex-shrink: 0;\n}\n\n.filter-option-label[_ngcontent-%COMP%] {\n flex: 1;\n font-size: 1rem;\n font-weight: 500;\n color: var(--mj-text-primary);\n}\n\n.filter-option.selected[_ngcontent-%COMP%] .filter-option-label[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-weight: 600;\n}\n\n\n\n\n.text-danger[_ngcontent-%COMP%] {\n color: var(--mj-status-error);\n}\n\n.text-warning[_ngcontent-%COMP%] {\n color: var(--mj-color-warning-500);\n}\n\n.text-success[_ngcontent-%COMP%] {\n color: var(--mj-status-success);\n}\n\n\n\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes _ngcontent-%COMP%_slideUp {\n from {\n transform: translateY(20px);\n opacity: 0;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes _ngcontent-%COMP%_slideUpFromBottom {\n from {\n transform: translateY(100%);\n opacity: 0;\n }\n to {\n transform: translateY(0);\n opacity: 1;\n }\n}\n\n\n\n\n.mj-search-input[_ngcontent-%COMP%]:focus-visible, \nbutton[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n\n\n\n@media (prefers-reduced-motion: reduce) {\n *[_ngcontent-%COMP%], \n *[_ngcontent-%COMP%]::before, \n *[_ngcontent-%COMP%]::after {\n animation-duration: 0.01ms !important;\n animation-iteration-count: 1 !important;\n transition-duration: 0.01ms !important;\n }\n}", "\n\n\n\n\n\n\n\n\n\n.status-chips[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: var(--mj-space-2);\n flex-shrink: 0;\n}\n\n\n\n\n.mj-grid-4[_ngcontent-%COMP%] {\n gap: 0.75rem;\n padding: 0 1rem 1rem 1rem;\n}\n\n@media (min-width: 768px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n padding: 0 1.5rem 1.25rem 1.5rem;\n gap: 1rem;\n }\n}\n\n@media (min-width: 1024px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n gap: 1.25rem;\n }\n}\n\n\n.mj-card[_ngcontent-%COMP%] {\n box-shadow: none;\n}\n\n@media (min-width: 768px) {\n .mj-card[_ngcontent-%COMP%] {\n padding: 1.125rem 1.25rem;\n }\n}\n\n\n.stat-icon-system[_ngcontent-%COMP%] {\n background: var(--mj-color-warning-50);\n color: var(--mj-color-warning-700);\n}\n\n.stat-icon-custom[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-status-success);\n}\n\n.stat-icon-active[_ngcontent-%COMP%] {\n background: var(--mj-color-accent-300);\n color: var(--mj-brand-primary);\n}\n\n\n\n\n.roles-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n\n\n\n.role-card[_ngcontent-%COMP%] {\n background: var(--mj-bg-surface-card);\n border: 1px solid var(--mj-border-default);\n border-radius: var(--mj-radius-xl);\n overflow: hidden;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.role-card[_ngcontent-%COMP%]:hover {\n box-shadow: var(--mj-shadow-md);\n border-color: var(--mj-brand-primary);\n}\n\n.role-card.expanded[_ngcontent-%COMP%] {\n box-shadow: var(--mj-shadow-lg);\n border-color: var(--mj-brand-primary);\n}\n\n.role-card.expanded[_ngcontent-%COMP%] .expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n transform: rotate(180deg);\n}\n\n.role-header[_ngcontent-%COMP%] {\n padding: 1.25rem 1.5rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n background: var(--mj-bg-surface);\n transition: background-color 0.2s ease;\n}\n\n.role-header[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-sunken);\n}\n\n.role-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n flex: 1;\n min-width: 0;\n}\n\n.role-icon-wrapper[_ngcontent-%COMP%] {\n width: 52px;\n height: 52px;\n border-radius: var(--mj-radius-lg);\n background: var(--mj-color-accent-300);\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--mj-brand-primary);\n font-size: 1.375rem;\n flex-shrink: 0;\n}\n\n.role-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.role-details[_ngcontent-%COMP%] .role-name[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 0.25rem 0;\n word-break: break-word;\n overflow-wrap: break-word;\n}\n\n.role-details[_ngcontent-%COMP%] .role-description[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n color: var(--mj-text-secondary);\n margin: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n@media (max-width: 639px) {\n .role-details[_ngcontent-%COMP%] .role-description[_ngcontent-%COMP%] {\n white-space: normal;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n }\n}\n\n.role-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n flex-shrink: 0;\n}\n\n\n\n\n.role-type-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.375rem 0.875rem;\n border-radius: var(--mj-radius-full);\n font-size: 0.75rem;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.03em;\n}\n\n.role-type-badge.badge-system[_ngcontent-%COMP%] {\n background: var(--mj-color-warning-50);\n color: var(--mj-color-warning-800);\n border: 1px solid var(--mj-color-warning-500);\n}\n\n.role-type-badge.badge-custom[_ngcontent-%COMP%] {\n background: var(--mj-color-success-100);\n color: var(--mj-color-success-800);\n border: 1px solid var(--mj-status-success);\n}\n\n\n\n\n.role-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.375rem;\n}\n\n\n.expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n\n\n\n.role-content[_ngcontent-%COMP%] {\n padding: 1.5rem;\n background: var(--mj-bg-surface);\n border-top: 1px solid var(--mj-border-default);\n animation: slideDown 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.role-stats[_ngcontent-%COMP%] {\n display: flex;\n gap: 2rem;\n margin-bottom: 1.5rem;\n flex-wrap: wrap;\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.9375rem;\n padding: 0.5rem 1rem;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-md);\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-size: 1rem;\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] .stat-label[_ngcontent-%COMP%] {\n color: var(--mj-text-secondary);\n}\n\n.role-stats[_ngcontent-%COMP%] .stat-item[_ngcontent-%COMP%] .stat-value[_ngcontent-%COMP%] {\n color: var(--mj-text-primary);\n font-weight: 600;\n}\n\n\n\n\n.permissions-preview[_ngcontent-%COMP%] {\n padding: 1.25rem;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-lg);\n border: 1px solid var(--mj-border-default);\n}\n\n.permissions-preview[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.625rem;\n font-size: 1rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 0.5rem 0;\n}\n\n.permissions-preview[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n font-size: 1.125rem;\n}\n\n.permissions-preview[_ngcontent-%COMP%] .permissions-note[_ngcontent-%COMP%] {\n font-size: 0.9375rem;\n color: var(--mj-text-secondary);\n margin: 0;\n}\n\n\n.modal-body[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n line-height: 1.6;\n}\n\n\n.modal-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n\n\n\n\n@media (min-width: 1440px) {\n .role-management-container[_ngcontent-%COMP%] {\n margin: 0 auto;\n }\n\n .action-buttons[_ngcontent-%COMP%] {\n padding: 1rem 2rem;\n }\n\n .mj-grid-4[_ngcontent-%COMP%] {\n padding: 0 2rem 1.25rem 2rem;\n gap: 1.5rem;\n }\n\n}\n\n\n\n\n@media (max-width: 639px) {\n .mj-grid-4[_ngcontent-%COMP%] {\n display: none !important;\n }\n\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n\n .modal-backdrop[_ngcontent-%COMP%] {\n padding: 0.5rem;\n }\n\n .modal-dialog[_ngcontent-%COMP%] {\n border-radius: var(--mj-radius-xl);\n max-height: 95vh;\n }\n\n .roles-list[_ngcontent-%COMP%] {\n gap: 0.75rem;\n }\n\n .role-card[_ngcontent-%COMP%] {\n border-radius: var(--mj-radius-lg);\n overflow: hidden;\n }\n\n .role-header[_ngcontent-%COMP%] {\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 0.75rem;\n padding: 1rem;\n }\n\n .role-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n flex-direction: row;\n align-items: flex-start;\n gap: 0.875rem;\n }\n\n .role-icon-wrapper[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n font-size: 1rem;\n flex-shrink: 0;\n }\n\n .role-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n }\n\n .role-details[_ngcontent-%COMP%] .role-name[_ngcontent-%COMP%] {\n font-size: 1rem;\n line-height: 1.3;\n margin-bottom: 0.125rem;\n }\n\n .role-details[_ngcontent-%COMP%] .role-description[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n -webkit-line-clamp: 1;\n line-clamp: 1;\n }\n\n .role-meta[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n padding-top: 0;\n border-top: none;\n width: auto;\n }\n\n .role-meta[_ngcontent-%COMP%] .role-type-badge[_ngcontent-%COMP%] {\n display: none;\n }\n\n .role-meta[_ngcontent-%COMP%] .role-actions[_ngcontent-%COMP%] {\n display: none;\n }\n\n .expand-btn[_ngcontent-%COMP%] {\n flex-shrink: 0;\n min-width: 40px;\n min-height: 40px;\n padding: 0.5rem;\n }\n\n .expand-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n }\n\n .mobile-actions-bar[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.75rem;\n padding: 0.875rem;\n background: var(--mj-bg-surface-sunken);\n border-radius: var(--mj-radius-lg);\n margin-bottom: 1rem;\n }\n\n .mobile-actions-bar[_ngcontent-%COMP%] .role-type-badge[_ngcontent-%COMP%] {\n padding: 0.375rem 0.75rem;\n font-size: 0.6875rem;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.5rem;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] .mj-btn-sm[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n padding: 0.5rem 0.875rem;\n min-height: 36px;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] .mj-btn-sm[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n }\n\n .mobile-action-buttons[_ngcontent-%COMP%] .btn-label[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n font-weight: 500;\n }\n\n .role-stats[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 0.5rem;\n margin-bottom: 1rem;\n }\n\n .role-content[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .permissions-preview[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n\n .loading-container[_ngcontent-%COMP%] {\n padding: 3rem 1.5rem;\n }\n}\n\n\n@media (max-width: 374px) {\n .action-buttons[_ngcontent-%COMP%] {\n padding: 0.375rem 0.5rem;\n }\n\n .scrollable-content[_ngcontent-%COMP%] {\n padding: 0.5rem;\n }\n\n .role-header[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n}"] });
732
732
  };
733
733
  RoleManagementComponent = __decorate([
734
734
  RegisterClass(BaseDashboard, 'RoleManagement')
package/dist/lib/role-management/role-management.component.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"role-management.component.js","sourceRoot":"","sources":["../../../src/lib/role-management/role-management.component.ts","../../../src/lib/role-management/role-management.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, OnDestroy, ChangeDetectorRef, NgZone } from '@angular/core';\nimport { Subject, BehaviorSubject } from 'rxjs';\nimport { takeUntil, debounceTime, distinctUntilChanged } from 'rxjs/operators';\nimport { RunView, Metadata, CompositeKey } from '@memberjunction/core';\nimport { ResourceData, MJRoleEntity, MJEntityPermissionEntity } from '@memberjunction/core-entities';\nimport { BaseDashboard } from '@memberjunction/ng-shared';\nimport { RegisterClass, UUIDsEqual } from '@memberjunction/global';\nimport { FilterFieldConfig } from '@memberjunction/ng-ui-components';\nimport { RoleDialogData, RoleDialogResult } from './role-dialog/role-dialog.component';\nimport {\n buildRoleManagementAgentContext,\n isValidRoleTypeFilter,\n resolveRoleByIDOrName,\n RoleManagementAgentContextInput,\n RolePermissionSummary,\n} from './role-management-agent-context';\n\ninterface RoleStats {\n totalRoles: number;\n systemRoles: number;\n customRoles: number;\n activeRoles: number;\n}\n\ninterface FilterOptions {\n type: 'all' | 'system' | 'custom';\n search: string;\n}\n\n@Component({\n standalone: false,\n selector: 'mj-role-management',\n templateUrl: './role-management.component.html',\n styleUrls: ['../shared/styles/_admin-patterns.css', './role-management.component.css']\n})\n@RegisterClass(BaseDashboard, 'RoleManagement')\nexport class RoleManagementComponent extends BaseDashboard implements OnDestroy {\n // State management\n public roles: MJRoleEntity[] = [];\n public filteredRoles: MJRoleEntity[] = [];\n public selectedRole: MJRoleEntity | null = null;\n public isLoading = false;\n public error: string | null = null;\n\n // Dialog state\n public showRoleDialog = false;\n public roleDialogData: RoleDialogData | null = null;\n\n // Stats\n public stats: RoleStats = {\n totalRoles: 0,\n systemRoles: 0,\n customRoles: 0,\n activeRoles: 0\n };\n\n // Filters\n public filters$ = new BehaviorSubject<FilterOptions>({\n type: 'all',\n search: ''\n });\n\n // UI State\n public showCreateDialog = false;\n public showEditDialog = false;\n public showDeleteConfirm = false;\n public expandedRoleId: string | null = null;\n\n // Role permissions (simplified view)\n public rolePermissions: Map<string, string[]> = new Map();\n\n // Read-only entity-permission summary per role id (lazily loaded on selection),\n // used only to surface a non-sensitive count summary to the agent context.\n private permissionSummaryCache = new Map<string, RolePermissionSummary>();\n private selectedRolePermissionSummary: RolePermissionSummary | null = null;\n\n protected override destroy$ = new Subject<void>();\n private get metadata() { return this.ProviderToUse; }\n constructor(private cdr: ChangeDetectorRef, private ngZone: NgZone) {\n super();\n }\n\n async GetResourceDisplayName(data: ResourceData): Promise<string> {\n return \"Role Management\"\n }\n\n protected initDashboard(): void {\n this.setupFilterSubscription();\n this.registerAgentClientTools();\n }\n\n protected loadData(): void {\n this.loadInitialData();\n }\n\n // ================================================================\n // AI Agent Context & Client Tools\n //\n // 🚨 SAFETY BOUNDARY — READ-ONLY / GOVERNANCE SURFACE 🚨\n // Role Management is a security-sensitive admin surface. The agent context\n // and client tools registered here are strictly READ-ONLY / navigational:\n // type filter, free-text search, SELECTING a role (view, with a read-only\n // permission-count summary), clearing filters, refreshing, and navigating to\n // a role's record for viewing. The mutating operations on this component —\n // create/edit/delete roles — AND any permission-grant/revoke surface are\n // DELIBERATELY NOT exposed to the agent; they remain human-initiated. The\n // permission summary published here is COUNTS ONLY (how many entities the role\n // can read/create/update/delete) — never a grant control. Context exposes only\n // counts, active filter selection, and on-screen display names.\n // ================================================================\n\n /**\n * Publish the current role-management state to the AI agent. Re-invoked on\n * every meaningful state change (data load, filter, selection). Shaped by the\n * pure {@link buildRoleManagementAgentContext} helper (unit-tested in isolation).\n */\n private publishAgentContext(): void {\n const selected = this.expandedRoleId\n ? this.roles.find(r => UUIDsEqual(r.ID, this.expandedRoleId!)) ?? null\n : null;\n const input: RoleManagementAgentContextInput = {\n TotalRoleCount: this.roles.length,\n FilteredRoleCount: this.filteredRoles.length,\n SystemRoleCount: this.stats.systemRoles,\n CustomRoleCount: this.stats.customRoles,\n TypeFilter: this.filters$.value.type,\n SearchText: this.filters$.value.search,\n SelectedRoleId: selected?.ID ?? null,\n SelectedRoleName: selected?.Name ?? null,\n VisibleRoleNames: this.filteredRoles.map(r => r.Name ?? '').filter(n => n !== ''),\n SelectedRolePermissions: selected ? this.selectedRolePermissionSummary : null,\n };\n this.navigationService.SetAgentContext(this, buildRoleManagementAgentContext(input));\n }\n\n /**\n * Register the read-only / navigational client tools the agent may invoke.\n * Every Handler is tolerant: validates input and returns\n * `{ Success: false, ErrorMessage }` rather than throwing.\n */\n private registerAgentClientTools(): void {\n this.navigationService.SetAgentClientTools(this, [\n {\n Name: 'FilterRolesByType',\n Description: 'Filter the role list by type. Valid values: all, system, custom.',\n ParameterSchema: { type: 'object', properties: { type: { type: 'string', enum: ['all', 'system', 'custom'] } }, required: ['type'] },\n Handler: async (params: Record<string, unknown>) => this.handleFilterByTypeTool(params),\n },\n {\n Name: 'SearchRoles',\n Description: 'Free-text search across role name and description.',\n ParameterSchema: { type: 'object', properties: { searchText: { type: 'string' } }, required: ['searchText'] },\n Handler: async (params: Record<string, unknown>) => this.handleSearchTool(params),\n },\n {\n Name: 'SelectRole',\n Description: 'Select a role for VIEWING by ID or name (exact ID → exact name → partial match). Read-only — does not edit the role. Loads a read-only permission-count summary into SelectedRolePermissions.',\n ParameterSchema: { type: 'object', properties: { role: { type: 'string' } }, required: ['role'] },\n Handler: async (params: Record<string, unknown>) => this.handleSelectRoleTool(params),\n },\n {\n Name: 'NavigateToRoleRecord',\n Description: 'Open the record for a role (by ID or name) in a tab for VIEWING. Read-only navigation — does not edit the role.',\n ParameterSchema: { type: 'object', properties: { role: { type: 'string' } }, required: ['role'] },\n Handler: async (params: Record<string, unknown>) => this.handleNavigateToRoleRecordTool(params),\n },\n {\n Name: 'ClearRoleFilters',\n Description: 'Clear all role filters (type and search) and show the full list.',\n ParameterSchema: { type: 'object', properties: {} },\n Handler: async () => this.handleClearFiltersTool(),\n },\n {\n Name: 'RefreshRoles',\n Description: 'Reload the role list from the server. Read-only — does not mutate any data.',\n ParameterSchema: { type: 'object', properties: {} },\n Handler: async () => this.handleRefreshTool(),\n },\n ]);\n }\n\n private handleFilterByTypeTool(params: Record<string, unknown>): { Success: boolean; ErrorMessage?: string } {\n const type = params?.['type'];\n if (!isValidRoleTypeFilter(type)) {\n return { Success: false, ErrorMessage: `Invalid type \"${String(type)}\". Expected one of: all, system, custom.` };\n }\n this.onTypeFilterChange(type);\n this.publishAgentContext();\n return { Success: true };\n }\n\n private handleSearchTool(params: Record<string, unknown>): { Success: boolean; ErrorMessage?: string } {\n const searchText = params?.['searchText'];\n if (typeof searchText !== 'string') {\n return { Success: false, ErrorMessage: 'searchText must be a string.' };\n }\n this.updateFilter({ search: searchText });\n this.publishAgentContext();\n return { Success: true };\n }\n\n private async handleSelectRoleTool(params: Record<string, unknown>): Promise<{ Success: boolean; ErrorMessage?: string }> {\n const raw = String(params?.['role'] ?? '');\n const resolved = resolveRoleByIDOrName(raw, this.roles.map(r => ({ ID: r.ID, Name: r.Name ?? '' })));\n if (!resolved.ok) {\n return { Success: false, ErrorMessage: resolved.error };\n }\n this.expandedRoleId = resolved.match.ID;\n this.selectedRolePermissionSummary = await this.loadPermissionSummary(resolved.match.ID);\n this.cdr.markForCheck();\n this.publishAgentContext();\n return { Success: true };\n }\n\n private handleNavigateToRoleRecordTool(params: Record<string, unknown>): { Success: boolean; ErrorMessage?: string } {\n const raw = String(params?.['role'] ?? '');\n const resolved = resolveRoleByIDOrName(raw, this.roles.map(r => ({ ID: r.ID, Name: r.Name ?? '' })));\n if (!resolved.ok) {\n return { Success: false, ErrorMessage: resolved.error };\n }\n this.navigationService.OpenEntityRecord('MJ: Roles', CompositeKey.FromID(resolved.match.ID));\n return { Success: true };\n }\n\n /**\n * Lazily load and cache the READ-ONLY entity-permission count summary for a role.\n * Surfaces only how broadly the role is granted access — never a grant control.\n */\n private async loadPermissionSummary(roleId: string): Promise<RolePermissionSummary> {\n const cached = this.permissionSummaryCache.get(roleId);\n if (cached) {\n return cached;\n }\n const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n const result = await rv.RunView<MJEntityPermissionEntity>({\n EntityName: 'MJ: Entity Permissions',\n ExtraFilter: `RoleID='${roleId.replace(/'/g, \"''\")}'`,\n ResultType: 'entity_object'\n });\n const rows = result.Success ? result.Results : [];\n const summary: RolePermissionSummary = {\n EntityCount: rows.length,\n ReadCount: rows.filter(p => p.CanRead).length,\n CreateCount: rows.filter(p => p.CanCreate).length,\n UpdateCount: rows.filter(p => p.CanUpdate).length,\n DeleteCount: rows.filter(p => p.CanDelete).length,\n };\n this.permissionSummaryCache.set(roleId, summary);\n return summary;\n }\n\n private handleClearFiltersTool(): { Success: boolean } {\n this.resetAllFiltersAndSearch();\n this.publishAgentContext();\n return { Success: true };\n }\n\n private async handleRefreshTool(): Promise<{ Success: boolean; ErrorMessage?: string }> {\n try {\n this.permissionSummaryCache.clear();\n this.selectedRolePermissionSummary = null;\n await this.loadInitialData();\n this.publishAgentContext();\n return { Success: true };\n } catch (e) {\n return { Success: false, ErrorMessage: e instanceof Error ? e.message : 'Refresh failed.' };\n }\n }\n\n override ngOnDestroy(): void {\n this.destroy$.next();\n this.destroy$.complete();\n super.ngOnDestroy();\n }\n \n public async loadInitialData(): Promise<void> {\n try {\n this.isLoading = true;\n this.error = null;\n \n // Load roles\n const roles = await this.loadRoles();\n this.roles = roles;\n this.calculateStats();\n this.applyFilters();\n \n } catch (error) {\n console.error('Error loading role data:', error);\n this.error = 'Failed to load role data. Please try again.';\n } finally {\n this.ngZone.run(() => {\n this.isLoading = false;\n this.cdr.markForCheck();\n this.publishAgentContext();\n });\n }\n }\n\n private async loadRoles(): Promise<MJRoleEntity[]> {\n const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n const result = await rv.RunView<MJRoleEntity>({\n EntityName: 'MJ: Roles',\n ResultType: 'entity_object',\n OrderBy: 'Name ASC'\n });\n \n return result.Success ? result.Results : [];\n }\n \n private setupFilterSubscription(): void {\n this.filters$\n .pipe(\n debounceTime(300),\n distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b)),\n takeUntil(this.destroy$)\n )\n .subscribe(() => {\n this.applyFilters();\n this.publishAgentContext();\n });\n }\n\n private applyFilters(): void {\n const filters = this.filters$.value;\n let filtered = [...this.roles];\n \n // Apply type filter\n if (filters.type !== 'all') {\n filtered = filtered.filter(role => {\n const isSystem = this.isSystemRole(role);\n return filters.type === 'system' ? isSystem : !isSystem;\n });\n }\n \n // Apply search filter\n if (filters.search) {\n const searchLower = filters.search.toLowerCase();\n filtered = filtered.filter(role =>\n role.Name?.toLowerCase().includes(searchLower) ||\n role.Description?.toLowerCase().includes(searchLower)\n );\n }\n \n this.filteredRoles = filtered;\n }\n \n private calculateStats(): void {\n const systemRoles = this.roles.filter(r => this.isSystemRole(r));\n \n this.stats = {\n totalRoles: this.roles.length,\n systemRoles: systemRoles.length,\n customRoles: this.roles.length - systemRoles.length,\n activeRoles: this.roles.length // All roles are considered active for now\n };\n }\n \n public isSystemRole(role: MJRoleEntity): boolean {\n // System roles typically have certain naming patterns or flags\n const systemRoleNames = ['Administrator', 'User', 'Guest', 'Developer'];\n return systemRoleNames.includes(role.Name || '');\n }\n \n // Public methods for template\n public onTypeFilterChange(type: 'all' | 'system' | 'custom'): void {\n this.updateFilter({ type });\n }\n \n public updateFilter(partial: Partial<FilterOptions>): void {\n this.filters$.next({\n ...this.filters$.value,\n ...partial\n });\n // Discrete changes (chips) apply immediately. Text search still goes\n // through the 300ms debounce in setupFilterSubscription.\n if (!('search' in partial)) {\n this.applyFilters();\n this.cdr.markForCheck();\n }\n }\n\n // -- Concise chrome: one Filter popover (Type) + applied-filter chips -------\n\n public get filterFields(): FilterFieldConfig[] {\n return [\n {\n key: 'type',\n type: 'chips',\n label: 'Type',\n chipOptions: [\n { text: 'All', value: 'all' },\n { text: 'System', value: 'system' },\n { text: 'Custom', value: 'custom' },\n ],\n },\n ];\n }\n\n public get filterValues(): Record<string, unknown> {\n return { type: this.filters$.value.type };\n }\n\n /** Total active filters (Type) — drives the Filter button badge. */\n public get TotalActiveFilterCount(): number {\n return this.filters$.value.type !== 'all' ? 1 : 0;\n }\n\n public onFilterPanelChange(values: Record<string, unknown>): void {\n if ('type' in values) {\n this.updateFilter({ type: (values['type'] as FilterOptions['type']) || 'all' });\n }\n }\n\n /** Clear all filters (Type); search persists. */\n public clearAllAppliedFilters(): void {\n this.updateFilter({ type: 'all' });\n }\n\n /** True when search and/or panel filters are narrowing the list — gates the\n * no-results empty-state \"Reset filters\" CTA. */\n public get IsListNarrowed(): boolean {\n return this.filters$.value.search !== '' || this.TotalActiveFilterCount > 0;\n }\n\n /** Reset everything narrowing the list (search + Type) and refresh\n * immediately. Wired to the no-results empty-state CTA. Unlike\n * clearAllAppliedFilters(), this also clears the search box. */\n public resetAllFiltersAndSearch(): void {\n this.filters$.next({ type: 'all', search: '' });\n this.applyFilters();\n this.cdr.markForCheck();\n }\n \n public toggleRoleExpansion(roleId: string): void {\n this.expandedRoleId = this.expandedRoleId === roleId ? null : roleId;\n if (this.expandedRoleId) {\n // Lazy-load the read-only permission summary so the agent context reflects\n // the user's current selection; fire-and-forget (re-publishes on completion).\n void this.loadPermissionSummary(this.expandedRoleId).then(summary => {\n this.selectedRolePermissionSummary = summary;\n this.publishAgentContext();\n });\n } else {\n this.selectedRolePermissionSummary = null;\n }\n this.publishAgentContext();\n }\n \n public isRoleExpanded(roleId: string): boolean {\n return this.expandedRoleId === roleId;\n }\n \n public createNewRole(): void {\n this.roleDialogData = {\n mode: 'create'\n };\n this.showRoleDialog = true;\n }\n \n public editRole(role: MJRoleEntity): void {\n this.roleDialogData = {\n role: role,\n mode: 'edit'\n };\n this.showRoleDialog = true;\n }\n \n public confirmDeleteRole(role: MJRoleEntity): void {\n this.selectedRole = role;\n this.showDeleteConfirm = true;\n }\n \n public async deleteRole(): Promise<void> {\n if (!this.selectedRole) return;\n \n try {\n // Load role entity to delete\n const role = await this.metadata.GetEntityObject<MJRoleEntity>('MJ: Roles');\n const loadResult = await role.Load(this.selectedRole.ID);\n \n if (loadResult) {\n const deleteResult = await role.Delete();\n if (deleteResult) {\n this.showDeleteConfirm = false;\n this.selectedRole = null;\n await this.loadInitialData();\n } else {\n throw new Error(role.LatestResult?.Message || 'Failed to delete role');\n }\n } else {\n throw new Error('Role not found or permission denied');\n }\n } catch (error: unknown) {\n console.error('Error deleting role:', error);\n this.ngZone.run(() => {\n this.error = error instanceof Error ? error.message : 'Failed to delete role';\n this.cdr.markForCheck();\n });\n }\n }\n \n public getRoleIcon(role: MJRoleEntity): string {\n if (this.isSystemRole(role)) {\n return 'fa-shield-halved';\n }\n return 'fa-user-tag';\n }\n \n public getRoleTypeLabel(role: MJRoleEntity): string {\n return this.isSystemRole(role) ? 'System' : 'Custom';\n }\n \n public getRoleTypeClass(role: MJRoleEntity): string {\n return this.isSystemRole(role) ? 'badge-system' : 'badge-custom';\n }\n \n public refreshData(): void {\n this.loadInitialData();\n }\n\n public onRoleDialogResult(result: RoleDialogResult): void {\n this.showRoleDialog = false;\n this.roleDialogData = null;\n \n if (result.action === 'save') {\n // Refresh the role list to show changes\n this.loadInitialData();\n }\n }\n}","<!--\n Interior chrome — <mj-page-header-interior> is the body-level sibling of\n <mj-page-header>. Same slot conventions ([toolbar] / [meta] / [actions]);\n different visual shape (single-row card). See Section 10 of\n explorer-chrome-conventions.\n-->\n<mj-page-header-interior\n AriaLabel=\"Filter roles\"\n Title=\"Roles\"\n Subtitle=\"Define system and custom roles for permissions\">\n <!-- X-of-Y filtered count earns its meta spot per chrome conventions §2.\n Partition badges (system/custom) stay dropped — they mirror the\n System/Custom filter chips in [toolbar]. -->\n <div meta>\n <mj-stat-badge\n [Count]=\"filteredRoles.length\"\n [Total]=\"roles.length\"\n Label=\"roles\">\n </mj-stat-badge>\n </div>\n <div toolbar>\n <!-- Concise-chrome control bar: search · Filter. Type lives behind the one\n Filter button; applied filters show as removable chips below the card.\n On mobile the popover docks as a bottom sheet. -->\n <mj-page-search\n Placeholder=\"Search roles by name or description...\"\n [Value]=\"filters$.value.search\"\n (ValueChange)=\"updateFilter({ search: $event })\">\n </mj-page-search>\n <mj-filter-popover\n Label=\"Filters\"\n Icon=\"fa-solid fa-filter\"\n [ActiveCount]=\"TotalActiveFilterCount\"\n [ShowClearAll]=\"TotalActiveFilterCount > 0\"\n (ClearAllRequested)=\"clearAllAppliedFilters()\">\n <mj-filter-panel\n [Fields]=\"filterFields\"\n [Values]=\"filterValues\"\n (ValuesChange)=\"onFilterPanelChange($event)\"\n (Reset)=\"clearAllAppliedFilters()\">\n </mj-filter-panel>\n </mj-filter-popover>\n </div>\n <div actions>\n <mj-refresh-button [Loading]=\"isLoading\" (Clicked)=\"refreshData()\"></mj-refresh-button>\n <button mjButton variant=\"primary\" size=\"sm\" (click)=\"createNewRole()\" aria-label=\"Add new role\">\n <i class=\"fa-solid fa-plus\"></i> <span class=\"mj-action-label\">Add Role</span>\n </button>\n </div>\n</mj-page-header-interior>\n\n<!-- Scrollable Content Section — owned by <mj-page-body-interior>. -->\n<mj-page-body-interior>\n <!-- Loading State -->\n @if (isLoading) {\n <div class=\"loading-container\" role=\"status\" aria-live=\"polite\" aria-busy=\"true\">\n <mj-loading text=\"Loading roles...\" size=\"medium\"></mj-loading>\n </div>\n }\n\n <!-- Error State -->\n @if (error && !isLoading) {\n <div class=\"error-container\" role=\"alert\" aria-live=\"assertive\">\n <div class=\"error-content\">\n <i class=\"fa-solid fa-exclamation-triangle error-icon\" aria-hidden=\"true\"></i>\n <p class=\"error-message\">{{ error }}</p>\n <button mjButton variant=\"primary\" (click)=\"loadInitialData()\" aria-label=\"Retry loading roles\">\n <i class=\"fa-solid fa-refresh\" aria-hidden=\"true\"></i>\n Try Again\n </button>\n </div>\n </div>\n }\n\n <!-- Roles List -->\n @if (!isLoading && !error) {\n <div class=\"roles-list\" role=\"list\" aria-label=\"Roles list\">\n @for (role of filteredRoles; track role.ID) {\n <div\n class=\"role-card\"\n [class.expanded]=\"isRoleExpanded(role.ID)\"\n role=\"listitem\"\n [attr.aria-expanded]=\"isRoleExpanded(role.ID)\"\n >\n <div\n class=\"role-header\"\n (click)=\"toggleRoleExpansion(role.ID)\"\n tabindex=\"0\"\n (keydown.enter)=\"toggleRoleExpansion(role.ID)\"\n (keydown.space)=\"toggleRoleExpansion(role.ID); $event.preventDefault()\"\n role=\"button\"\n [attr.aria-label]=\"'Toggle details for ' + role.Name\"\n >\n <div class=\"role-info\">\n <div class=\"role-icon-wrapper\" aria-hidden=\"true\">\n <i [class]=\"'fa-solid ' + getRoleIcon(role)\"></i>\n </div>\n <div class=\"role-details\">\n <h3 class=\"role-name\">{{ role.Name }}</h3>\n <p class=\"role-description\">{{ role.Description || 'No description available' }}</p>\n </div>\n </div>\n\n <div class=\"role-meta\">\n <span class=\"role-type-badge\" [class]=\"getRoleTypeClass(role)\">\n {{ getRoleTypeLabel(role) }}\n </span>\n <div class=\"role-actions\" (click)=\"$event.stopPropagation()\">\n <button\n mjButton variant=\"flat\" size=\"sm\"\n (click)=\"editRole(role)\"\n title=\"Edit\"\n [attr.aria-label]=\"'Edit ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-edit\" aria-hidden=\"true\"></i>\n </button>\n <button\n mjButton variant=\"danger\" size=\"sm\"\n (click)=\"confirmDeleteRole(role)\"\n title=\"Delete\"\n [attr.aria-label]=\"'Delete ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-trash\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <button class=\"expand-btn\" aria-label=\"Toggle details\">\n <i class=\"fa-solid fa-chevron-down\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n\n @if (isRoleExpanded(role.ID)) {\n <div class=\"role-content\">\n <!-- Mobile-only actions bar -->\n <div class=\"mobile-actions-bar\" (click)=\"$event.stopPropagation()\">\n <span class=\"role-type-badge\" [class]=\"getRoleTypeClass(role)\">\n {{ getRoleTypeLabel(role) }}\n </span>\n <div class=\"mobile-action-buttons\">\n <button\n mjButton variant=\"flat\" size=\"sm\"\n (click)=\"editRole(role)\"\n title=\"Edit\"\n [attr.aria-label]=\"'Edit ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-edit\" aria-hidden=\"true\"></i>\n <span class=\"btn-label\">Edit</span>\n </button>\n <button\n mjButton variant=\"danger\" size=\"sm\"\n (click)=\"confirmDeleteRole(role)\"\n title=\"Delete\"\n [attr.aria-label]=\"'Delete ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-trash\" aria-hidden=\"true\"></i>\n <span class=\"btn-label\">Delete</span>\n </button>\n </div>\n </div>\n\n <div class=\"role-stats\">\n <div class=\"stat-item\">\n <i class=\"fa-solid fa-users\" aria-hidden=\"true\"></i>\n <span class=\"stat-label\">Users:</span>\n <span class=\"stat-value\">0</span>\n </div>\n <div class=\"stat-item\">\n <i class=\"fa-solid fa-calendar\" aria-hidden=\"true\"></i>\n <span class=\"stat-label\">Created:</span>\n <span class=\"stat-value\">{{ role.__mj_CreatedAt | date:'short' }}</span>\n </div>\n <div class=\"stat-item\">\n <i class=\"fa-solid fa-clock\" aria-hidden=\"true\"></i>\n <span class=\"stat-label\">Updated:</span>\n <span class=\"stat-value\">{{ role.__mj_UpdatedAt | date:'short' }}</span>\n </div>\n </div>\n\n <div class=\"permissions-preview\">\n <h4 class=\"section-title\">\n <i class=\"fa-solid fa-key\" aria-hidden=\"true\"></i>\n Permissions Preview\n </h4>\n <p class=\"permissions-note\">Full permission management available in the Permissions tab</p>\n </div>\n </div>\n }\n </div>\n }\n\n @if (filteredRoles.length === 0) {\n <mj-empty-state\n [Variant]=\"IsListNarrowed ? 'no-results' : 'empty'\"\n Icon=\"fa-solid fa-user-tag\"\n Title=\"No roles found\"\n Message=\"Try adjusting your filters or create a new role\"\n [ActionText]=\"IsListNarrowed ? 'Reset filters' : ''\"\n ActionIcon=\"fa-solid fa-rotate-left\"\n (Action)=\"resetAllFiltersAndSearch()\" />\n }\n </div>\n }\n </mj-page-body-interior>\n\n <!-- Role Create/Edit Dialog -->\n <mj-role-dialog\n [data]=\"roleDialogData\"\n [visible]=\"showRoleDialog\"\n (result)=\"onRoleDialogResult($event)\">\n </mj-role-dialog>\n\n <!-- Delete Confirmation Dialog -->\n @if (showDeleteConfirm && selectedRole) {\n <div\n class=\"modal-backdrop\"\n (click)=\"showDeleteConfirm = false\"\n role=\"presentation\"\n >\n <div\n class=\"modal-dialog\"\n (click)=\"$event.stopPropagation()\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=\"delete-dialog-title\"\n aria-describedby=\"delete-dialog-desc\"\n >\n <div class=\"modal-header\">\n <h3 class=\"modal-title\" id=\"delete-dialog-title\">\n <i class=\"fa-solid fa-exclamation-triangle text-danger\" aria-hidden=\"true\"></i>\n Confirm Delete\n </h3>\n <button\n class=\"modal-close\"\n (click)=\"showDeleteConfirm = false\"\n aria-label=\"Close dialog\"\n >\n <i class=\"fa-solid fa-times\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <div class=\"modal-body\" id=\"delete-dialog-desc\">\n <p>Are you sure you want to delete the role <strong>{{ selectedRole.Name }}</strong>?</p>\n <mj-alert Variant=\"warning\" Message=\"This will affect all users assigned to this role.\" />\n </div>\n <div class=\"modal-footer\">\n <!-- Primary action (Delete) on LEFT per MD3 design guide -->\n <button mjButton variant=\"danger\" (click)=\"deleteRole()\" [disabled]=\"isLoading\">\n @if (isLoading) {\n <i class=\"fa-solid fa-spinner fa-spin\" aria-hidden=\"true\"></i>\n Deleting...\n } @else {\n <i class=\"fa-solid fa-trash\" aria-hidden=\"true\"></i>\n Delete Role\n }\n </button>\n <button mjButton (click)=\"showDeleteConfirm = false\">\n Cancel\n </button>\n </div>\n </div>\n </div>\n }\n\n"]}
1
+ {"version":3,"file":"role-management.component.js","sourceRoot":"","sources":["../../../src/lib/role-management/role-management.component.ts","../../../src/lib/role-management/role-management.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, OnDestroy, ChangeDetectorRef, NgZone } from '@angular/core';\nimport { Subject, BehaviorSubject } from 'rxjs';\nimport { takeUntil, debounceTime, distinctUntilChanged } from 'rxjs/operators';\nimport { RunView, Metadata, CompositeKey } from '@memberjunction/core';\nimport { ResourceData, MJRoleEntity, MJEntityPermissionEntity } from '@memberjunction/core-entities';\nimport { BaseDashboard } from '@memberjunction/ng-shared';\nimport { RegisterClass, UUIDsEqual } from '@memberjunction/global';\nimport { FilterFieldConfig } from '@memberjunction/ng-ui-components';\nimport { RoleDialogData, RoleDialogResult } from './role-dialog/role-dialog.component';\nimport {\n buildRoleManagementAgentContext,\n isValidRoleTypeFilter,\n resolveRoleByIDOrName,\n RoleManagementAgentContextInput,\n RolePermissionSummary,\n} from './role-management-agent-context';\n\ninterface RoleStats {\n totalRoles: number;\n systemRoles: number;\n customRoles: number;\n activeRoles: number;\n}\n\ninterface FilterOptions {\n type: 'all' | 'system' | 'custom';\n search: string;\n}\n\n@Component({\n standalone: false,\n selector: 'mj-role-management',\n templateUrl: './role-management.component.html',\n styleUrls: ['../shared/styles/_admin-patterns.css', './role-management.component.css']\n})\n@RegisterClass(BaseDashboard, 'RoleManagement')\nexport class RoleManagementComponent extends BaseDashboard implements OnDestroy {\n // State management\n public roles: MJRoleEntity[] = [];\n public filteredRoles: MJRoleEntity[] = [];\n public selectedRole: MJRoleEntity | null = null;\n public isLoading = false;\n public error: string | null = null;\n\n // Dialog state\n public showRoleDialog = false;\n public roleDialogData: RoleDialogData | null = null;\n\n // Stats\n public stats: RoleStats = {\n totalRoles: 0,\n systemRoles: 0,\n customRoles: 0,\n activeRoles: 0\n };\n\n // Filters\n public filters$ = new BehaviorSubject<FilterOptions>({\n type: 'all',\n search: ''\n });\n\n // UI State\n public showCreateDialog = false;\n public showEditDialog = false;\n public showDeleteConfirm = false;\n public expandedRoleId: string | null = null;\n\n // Role permissions (simplified view)\n public rolePermissions: Map<string, string[]> = new Map();\n\n // Read-only entity-permission summary per role id (lazily loaded on selection),\n // used only to surface a non-sensitive count summary to the agent context.\n private permissionSummaryCache = new Map<string, RolePermissionSummary>();\n private selectedRolePermissionSummary: RolePermissionSummary | null = null;\n\n protected override destroy$ = new Subject<void>();\n private get metadata() { return this.ProviderToUse; }\n constructor(private cdr: ChangeDetectorRef, private ngZone: NgZone) {\n super();\n }\n\n async GetResourceDisplayName(data: ResourceData): Promise<string> {\n return \"Role Management\"\n }\n\n protected initDashboard(): void {\n this.setupFilterSubscription();\n this.registerAgentClientTools();\n }\n\n protected loadData(): void {\n this.loadInitialData();\n }\n\n // ================================================================\n // AI Agent Context & Client Tools\n //\n // 🚨 SAFETY BOUNDARY — READ-ONLY / GOVERNANCE SURFACE 🚨\n // Role Management is a security-sensitive admin surface. The agent context\n // and client tools registered here are strictly READ-ONLY / navigational:\n // type filter, free-text search, SELECTING a role (view, with a read-only\n // permission-count summary), clearing filters, refreshing, and navigating to\n // a role's record for viewing. The mutating operations on this component —\n // create/edit/delete roles — AND any permission-grant/revoke surface are\n // DELIBERATELY NOT exposed to the agent; they remain human-initiated. The\n // permission summary published here is COUNTS ONLY (how many entities the role\n // can read/create/update/delete) — never a grant control. Context exposes only\n // counts, active filter selection, and on-screen display names.\n // ================================================================\n\n /**\n * Publish the current role-management state to the AI agent. Re-invoked on\n * every meaningful state change (data load, filter, selection). Shaped by the\n * pure {@link buildRoleManagementAgentContext} helper (unit-tested in isolation).\n */\n private publishAgentContext(): void {\n const selected = this.expandedRoleId\n ? this.roles.find(r => UUIDsEqual(r.ID, this.expandedRoleId!)) ?? null\n : null;\n const input: RoleManagementAgentContextInput = {\n TotalRoleCount: this.roles.length,\n FilteredRoleCount: this.filteredRoles.length,\n SystemRoleCount: this.stats.systemRoles,\n CustomRoleCount: this.stats.customRoles,\n TypeFilter: this.filters$.value.type,\n SearchText: this.filters$.value.search,\n SelectedRoleId: selected?.ID ?? null,\n SelectedRoleName: selected?.Name ?? null,\n VisibleRoleNames: this.filteredRoles.map(r => r.Name ?? '').filter(n => n !== ''),\n SelectedRolePermissions: selected ? this.selectedRolePermissionSummary : null,\n };\n this.navigationService.SetAgentContext(this, buildRoleManagementAgentContext(input));\n }\n\n /**\n * Register the read-only / navigational client tools the agent may invoke.\n * Every Handler is tolerant: validates input and returns\n * `{ Success: false, ErrorMessage }` rather than throwing.\n */\n private registerAgentClientTools(): void {\n this.navigationService.SetAgentClientTools(this, [\n {\n Name: 'FilterRolesByType',\n Description: 'Filter the role list by type. Valid values: all, system, custom.',\n ParameterSchema: { type: 'object', properties: { type: { type: 'string', enum: ['all', 'system', 'custom'] } }, required: ['type'] },\n Handler: async (params: Record<string, unknown>) => this.handleFilterByTypeTool(params),\n },\n {\n Name: 'SearchRoles',\n Description: 'Free-text search across role name and description.',\n ParameterSchema: { type: 'object', properties: { searchText: { type: 'string' } }, required: ['searchText'] },\n Handler: async (params: Record<string, unknown>) => this.handleSearchTool(params),\n },\n {\n Name: 'SelectRole',\n Description: 'Select a role for VIEWING by ID or name (exact ID → exact name → partial match). Read-only — does not edit the role. Loads a read-only permission-count summary into SelectedRolePermissions.',\n ParameterSchema: { type: 'object', properties: { role: { type: 'string' } }, required: ['role'] },\n Handler: async (params: Record<string, unknown>) => this.handleSelectRoleTool(params),\n },\n {\n Name: 'NavigateToRoleRecord',\n Description: 'Open the record for a role (by ID or name) in a tab for VIEWING. Read-only navigation — does not edit the role.',\n ParameterSchema: { type: 'object', properties: { role: { type: 'string' } }, required: ['role'] },\n Handler: async (params: Record<string, unknown>) => this.handleNavigateToRoleRecordTool(params),\n },\n {\n Name: 'ClearRoleFilters',\n Description: 'Clear all role filters (type and search) and show the full list.',\n ParameterSchema: { type: 'object', properties: {} },\n Handler: async () => this.handleClearFiltersTool(),\n },\n {\n Name: 'RefreshRoles',\n Description: 'Reload the role list from the server. Read-only — does not mutate any data.',\n ParameterSchema: { type: 'object', properties: {} },\n Handler: async () => this.handleRefreshTool(),\n },\n ]);\n }\n\n private handleFilterByTypeTool(params: Record<string, unknown>): { Success: boolean; ErrorMessage?: string } {\n const type = params?.['type'];\n if (!isValidRoleTypeFilter(type)) {\n return { Success: false, ErrorMessage: `Invalid type \"${String(type)}\". Expected one of: all, system, custom.` };\n }\n this.onTypeFilterChange(type);\n this.publishAgentContext();\n return { Success: true };\n }\n\n private handleSearchTool(params: Record<string, unknown>): { Success: boolean; ErrorMessage?: string } {\n const searchText = params?.['searchText'];\n if (typeof searchText !== 'string') {\n return { Success: false, ErrorMessage: 'searchText must be a string.' };\n }\n this.updateFilter({ search: searchText });\n this.publishAgentContext();\n return { Success: true };\n }\n\n private async handleSelectRoleTool(params: Record<string, unknown>): Promise<{ Success: boolean; ErrorMessage?: string }> {\n const raw = String(params?.['role'] ?? '');\n const resolved = resolveRoleByIDOrName(raw, this.roles.map(r => ({ ID: r.ID, Name: r.Name ?? '' })));\n if (!resolved.ok) {\n return { Success: false, ErrorMessage: resolved.error };\n }\n this.expandedRoleId = resolved.match.ID;\n this.selectedRolePermissionSummary = await this.loadPermissionSummary(resolved.match.ID);\n this.cdr.markForCheck();\n this.publishAgentContext();\n return { Success: true };\n }\n\n private handleNavigateToRoleRecordTool(params: Record<string, unknown>): { Success: boolean; ErrorMessage?: string } {\n const raw = String(params?.['role'] ?? '');\n const resolved = resolveRoleByIDOrName(raw, this.roles.map(r => ({ ID: r.ID, Name: r.Name ?? '' })));\n if (!resolved.ok) {\n return { Success: false, ErrorMessage: resolved.error };\n }\n this.navigationService.OpenEntityRecord('MJ: Roles', CompositeKey.FromID(resolved.match.ID));\n return { Success: true };\n }\n\n /**\n * Lazily load and cache the READ-ONLY entity-permission count summary for a role.\n * Surfaces only how broadly the role is granted access — never a grant control.\n */\n private async loadPermissionSummary(roleId: string): Promise<RolePermissionSummary> {\n const cached = this.permissionSummaryCache.get(roleId);\n if (cached) {\n return cached;\n }\n const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n const result = await rv.RunView<MJEntityPermissionEntity>({\n EntityName: 'MJ: Entity Permissions',\n ExtraFilter: `RoleID='${roleId.replace(/'/g, \"''\")}'`,\n ResultType: 'entity_object'\n });\n const rows = result.Success ? result.Results : [];\n const summary: RolePermissionSummary = {\n EntityCount: rows.length,\n ReadCount: rows.filter(p => p.CanRead).length,\n CreateCount: rows.filter(p => p.CanCreate).length,\n UpdateCount: rows.filter(p => p.CanUpdate).length,\n DeleteCount: rows.filter(p => p.CanDelete).length,\n };\n this.permissionSummaryCache.set(roleId, summary);\n return summary;\n }\n\n private handleClearFiltersTool(): { Success: boolean } {\n this.resetAllFiltersAndSearch();\n this.publishAgentContext();\n return { Success: true };\n }\n\n private async handleRefreshTool(): Promise<{ Success: boolean; ErrorMessage?: string }> {\n try {\n this.permissionSummaryCache.clear();\n this.selectedRolePermissionSummary = null;\n await this.loadInitialData();\n this.publishAgentContext();\n return { Success: true };\n } catch (e) {\n return { Success: false, ErrorMessage: e instanceof Error ? e.message : 'Refresh failed.' };\n }\n }\n\n override ngOnDestroy(): void {\n this.destroy$.next();\n this.destroy$.complete();\n super.ngOnDestroy();\n }\n \n public async loadInitialData(): Promise<void> {\n try {\n this.isLoading = true;\n this.error = null;\n \n // Load roles\n const roles = await this.loadRoles();\n this.roles = roles;\n this.calculateStats();\n this.applyFilters();\n \n } catch (error) {\n console.error('Error loading role data:', error);\n this.error = 'Failed to load role data. Please try again.';\n } finally {\n this.ngZone.run(() => {\n this.isLoading = false;\n this.cdr.markForCheck();\n this.publishAgentContext();\n });\n }\n }\n\n private async loadRoles(): Promise<MJRoleEntity[]> {\n const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n const result = await rv.RunView<MJRoleEntity>({\n EntityName: 'MJ: Roles',\n ResultType: 'entity_object',\n OrderBy: 'Name ASC'\n });\n \n return result.Success ? result.Results : [];\n }\n \n private setupFilterSubscription(): void {\n this.filters$\n .pipe(\n debounceTime(300),\n distinctUntilChanged((a, b) => JSON.stringify(a) === JSON.stringify(b)),\n takeUntil(this.destroy$)\n )\n .subscribe(() => {\n this.applyFilters();\n this.publishAgentContext();\n });\n }\n\n private applyFilters(): void {\n const filters = this.filters$.value;\n let filtered = [...this.roles];\n \n // Apply type filter\n if (filters.type !== 'all') {\n filtered = filtered.filter(role => {\n const isSystem = this.isSystemRole(role);\n return filters.type === 'system' ? isSystem : !isSystem;\n });\n }\n \n // Apply search filter\n if (filters.search) {\n const searchLower = filters.search.toLowerCase();\n filtered = filtered.filter(role =>\n role.Name?.toLowerCase().includes(searchLower) ||\n role.Description?.toLowerCase().includes(searchLower)\n );\n }\n \n this.filteredRoles = filtered;\n }\n \n private calculateStats(): void {\n const systemRoles = this.roles.filter(r => this.isSystemRole(r));\n \n this.stats = {\n totalRoles: this.roles.length,\n systemRoles: systemRoles.length,\n customRoles: this.roles.length - systemRoles.length,\n activeRoles: this.roles.length // All roles are considered active for now\n };\n }\n \n public isSystemRole(role: MJRoleEntity): boolean {\n // System roles typically have certain naming patterns or flags\n const systemRoleNames = ['Administrator', 'User', 'Guest', 'Developer'];\n return systemRoleNames.includes(role.Name || '');\n }\n \n // Public methods for template\n public onTypeFilterChange(type: 'all' | 'system' | 'custom'): void {\n this.updateFilter({ type });\n }\n \n public updateFilter(partial: Partial<FilterOptions>): void {\n this.filters$.next({\n ...this.filters$.value,\n ...partial\n });\n // Discrete changes (chips) apply immediately. Text search still goes\n // through the 300ms debounce in setupFilterSubscription.\n if (!('search' in partial)) {\n this.applyFilters();\n this.cdr.markForCheck();\n }\n }\n\n // -- Concise chrome: one Filter popover (Type) + applied-filter chips -------\n\n public get filterFields(): FilterFieldConfig[] {\n return [\n {\n key: 'type',\n type: 'chips',\n label: 'Type',\n chipOptions: [\n { text: 'All', value: 'all' },\n { text: 'System', value: 'system' },\n { text: 'Custom', value: 'custom' },\n ],\n },\n ];\n }\n\n public get filterValues(): Record<string, unknown> {\n return { type: this.filters$.value.type };\n }\n\n /** Total active filters (Type) — drives the Filter button badge. */\n public get TotalActiveFilterCount(): number {\n return this.filters$.value.type !== 'all' ? 1 : 0;\n }\n\n public onFilterPanelChange(values: Record<string, unknown>): void {\n if ('type' in values) {\n this.updateFilter({ type: (values['type'] as FilterOptions['type']) || 'all' });\n }\n }\n\n /** Clear all filters (Type); search persists. */\n public clearAllAppliedFilters(): void {\n this.updateFilter({ type: 'all' });\n }\n\n /** True when search and/or panel filters are narrowing the list — gates the\n * no-results empty-state \"Reset filters\" CTA. */\n public get IsListNarrowed(): boolean {\n return this.filters$.value.search !== '' || this.TotalActiveFilterCount > 0;\n }\n\n /** Reset everything narrowing the list (search + Type) and refresh\n * immediately. Wired to the no-results empty-state CTA. Unlike\n * clearAllAppliedFilters(), this also clears the search box. */\n public resetAllFiltersAndSearch(): void {\n this.filters$.next({ type: 'all', search: '' });\n this.applyFilters();\n this.cdr.markForCheck();\n }\n \n public toggleRoleExpansion(roleId: string): void {\n this.expandedRoleId = this.expandedRoleId === roleId ? null : roleId;\n if (this.expandedRoleId) {\n // Lazy-load the read-only permission summary so the agent context reflects\n // the user's current selection; fire-and-forget (re-publishes on completion).\n void this.loadPermissionSummary(this.expandedRoleId).then(summary => {\n this.selectedRolePermissionSummary = summary;\n this.publishAgentContext();\n });\n } else {\n this.selectedRolePermissionSummary = null;\n }\n this.publishAgentContext();\n }\n \n public isRoleExpanded(roleId: string): boolean {\n return this.expandedRoleId === roleId;\n }\n \n public createNewRole(): void {\n this.roleDialogData = {\n mode: 'create'\n };\n this.showRoleDialog = true;\n }\n \n public editRole(role: MJRoleEntity): void {\n this.roleDialogData = {\n role: role,\n mode: 'edit'\n };\n this.showRoleDialog = true;\n }\n \n public confirmDeleteRole(role: MJRoleEntity): void {\n this.selectedRole = role;\n this.showDeleteConfirm = true;\n }\n \n public async deleteRole(): Promise<void> {\n if (!this.selectedRole) return;\n \n try {\n // Load role entity to delete\n const role = await this.metadata.GetEntityObject<MJRoleEntity>('MJ: Roles');\n const loadResult = await role.Load(this.selectedRole.ID);\n \n if (loadResult) {\n const deleteResult = await role.Delete();\n if (deleteResult) {\n this.showDeleteConfirm = false;\n this.selectedRole = null;\n await this.loadInitialData();\n } else {\n throw new Error(role.LatestResult?.Message || 'Failed to delete role');\n }\n } else {\n throw new Error('Role not found or permission denied');\n }\n } catch (error: unknown) {\n console.error('Error deleting role:', error);\n this.ngZone.run(() => {\n this.error = error instanceof Error ? error.message : 'Failed to delete role';\n this.cdr.markForCheck();\n });\n }\n }\n \n public getRoleIcon(role: MJRoleEntity): string {\n if (this.isSystemRole(role)) {\n return 'fa-shield-halved';\n }\n return 'fa-user-tag';\n }\n \n public getRoleTypeLabel(role: MJRoleEntity): string {\n return this.isSystemRole(role) ? 'System' : 'Custom';\n }\n \n public getRoleTypeClass(role: MJRoleEntity): string {\n return this.isSystemRole(role) ? 'badge-system' : 'badge-custom';\n }\n \n public refreshData(): void {\n this.loadInitialData();\n }\n\n public onRoleDialogResult(result: RoleDialogResult): void {\n this.showRoleDialog = false;\n this.roleDialogData = null;\n \n if (result.action === 'save') {\n // Refresh the role list to show changes\n this.loadInitialData();\n }\n }\n}","<!--\n Interior chrome — <mj-page-header-interior> is the body-level sibling of\n <mj-page-header>. Same slot conventions ([toolbar] / [meta] / [actions]);\n different visual shape (single-row card). See Section 10 of\n explorer-chrome-conventions.\n-->\n<mj-page-header-interior\n AriaLabel=\"Filter roles\"\n Title=\"Roles\"\n Subtitle=\"Define system and custom roles for permissions\">\n <!-- X-of-Y filtered count earns its meta spot per chrome conventions §2.\n Partition badges (system/custom) stay dropped — they mirror the\n System/Custom filter chips in [toolbar]. -->\n <div meta>\n <mj-stat-badge\n [Count]=\"filteredRoles.length\"\n [Total]=\"roles.length\"\n Label=\"roles\">\n </mj-stat-badge>\n </div>\n <div toolbar>\n <!-- Concise-chrome control bar: search · Filter. Type lives behind the one\n Filter button; applied filters show as removable chips below the card.\n On mobile the popover docks as a bottom sheet. -->\n <mj-page-search\n Placeholder=\"Search roles by name or description...\"\n [Value]=\"filters$.value.search\"\n (ValueChange)=\"updateFilter({ search: $event })\">\n </mj-page-search>\n <mj-filter-popover\n Label=\"Filters\"\n Icon=\"fa-solid fa-filter\"\n [ActiveCount]=\"TotalActiveFilterCount\"\n [ShowClearAll]=\"TotalActiveFilterCount > 0\"\n (ClearAllRequested)=\"clearAllAppliedFilters()\">\n <mj-filter-panel\n [Fields]=\"filterFields\"\n [Values]=\"filterValues\"\n (ValuesChange)=\"onFilterPanelChange($event)\"\n (Reset)=\"clearAllAppliedFilters()\">\n </mj-filter-panel>\n </mj-filter-popover>\n </div>\n <div actions>\n <mj-refresh-button [Loading]=\"isLoading\" (Clicked)=\"refreshData()\"></mj-refresh-button>\n <button mjButton variant=\"primary\" size=\"sm\" (click)=\"createNewRole()\" aria-label=\"Add new role\">\n <i class=\"fa-solid fa-plus\"></i> <span class=\"mj-action-label\">Add Role</span>\n </button>\n </div>\n</mj-page-header-interior>\n\n<!-- Scrollable Content Section — owned by <mj-page-body-interior>. -->\n<mj-page-body-interior>\n <!-- Loading State -->\n @if (isLoading) {\n <div class=\"loading-container\" role=\"status\" aria-live=\"polite\" aria-busy=\"true\">\n <mj-loading text=\"Loading roles...\" size=\"medium\"></mj-loading>\n </div>\n }\n\n <!-- Error State -->\n @if (error && !isLoading) {\n <div class=\"error-container\" role=\"alert\" aria-live=\"assertive\">\n <div class=\"error-content\">\n <i class=\"fa-solid fa-exclamation-triangle error-icon\" aria-hidden=\"true\"></i>\n <p class=\"error-message\">{{ error }}</p>\n <button mjButton variant=\"primary\" (click)=\"loadInitialData()\" aria-label=\"Retry loading roles\">\n <i class=\"fa-solid fa-refresh\" aria-hidden=\"true\"></i>\n Try Again\n </button>\n </div>\n </div>\n }\n\n <!-- Roles List -->\n @if (!isLoading && !error) {\n <div class=\"roles-list\" role=\"list\" aria-label=\"Roles list\">\n @for (role of filteredRoles; track role.ID) {\n <div\n class=\"role-card\"\n [class.expanded]=\"isRoleExpanded(role.ID)\"\n role=\"listitem\"\n [attr.aria-expanded]=\"isRoleExpanded(role.ID)\"\n >\n <div\n class=\"role-header\"\n (click)=\"toggleRoleExpansion(role.ID)\"\n tabindex=\"0\"\n (keydown.enter)=\"toggleRoleExpansion(role.ID)\"\n (keydown.space)=\"toggleRoleExpansion(role.ID); $event.preventDefault()\"\n role=\"button\"\n [attr.aria-label]=\"'Toggle details for ' + role.Name\"\n >\n <div class=\"role-info\">\n <div class=\"role-icon-wrapper\" aria-hidden=\"true\">\n <i [class]=\"'fa-solid ' + getRoleIcon(role)\"></i>\n </div>\n <div class=\"role-details\">\n <h3 class=\"role-name\">{{ role.Name }}</h3>\n <p class=\"role-description\">{{ role.Description || 'No description available' }}</p>\n </div>\n </div>\n\n <div class=\"role-meta\">\n <span class=\"role-type-badge\" [class]=\"getRoleTypeClass(role)\">\n {{ getRoleTypeLabel(role) }}\n </span>\n <div class=\"role-actions\" (click)=\"$event.stopPropagation()\">\n <button\n mjButton variant=\"flat\" size=\"sm\"\n (click)=\"editRole(role)\"\n title=\"Edit\"\n [attr.aria-label]=\"'Edit ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-edit\" aria-hidden=\"true\"></i>\n </button>\n <button\n mjButton variant=\"danger\" size=\"sm\"\n (click)=\"confirmDeleteRole(role)\"\n title=\"Delete\"\n [attr.aria-label]=\"'Delete ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-trash\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <button class=\"expand-btn\" aria-label=\"Toggle details\">\n <i class=\"fa-solid fa-chevron-down\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n\n @if (isRoleExpanded(role.ID)) {\n <div class=\"role-content\">\n <!-- Mobile-only actions bar -->\n <div class=\"mobile-actions-bar\" (click)=\"$event.stopPropagation()\">\n <span class=\"role-type-badge\" [class]=\"getRoleTypeClass(role)\">\n {{ getRoleTypeLabel(role) }}\n </span>\n <div class=\"mobile-action-buttons\">\n <button\n mjButton variant=\"flat\" size=\"sm\"\n (click)=\"editRole(role)\"\n title=\"Edit\"\n [attr.aria-label]=\"'Edit ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-edit\" aria-hidden=\"true\"></i>\n <span class=\"btn-label\">Edit</span>\n </button>\n <button\n mjButton variant=\"danger\" size=\"sm\"\n (click)=\"confirmDeleteRole(role)\"\n title=\"Delete\"\n [attr.aria-label]=\"'Delete ' + role.Name\"\n [disabled]=\"isSystemRole(role)\"\n >\n <i class=\"fa-solid fa-trash\" aria-hidden=\"true\"></i>\n <span class=\"btn-label\">Delete</span>\n </button>\n </div>\n </div>\n\n <div class=\"role-stats\">\n <div class=\"stat-item\">\n <i class=\"fa-solid fa-users\" aria-hidden=\"true\"></i>\n <span class=\"stat-label\">Users:</span>\n <span class=\"stat-value\">0</span>\n </div>\n <div class=\"stat-item\">\n <i class=\"fa-solid fa-calendar\" aria-hidden=\"true\"></i>\n <span class=\"stat-label\">Created:</span>\n <span class=\"stat-value\">{{ role.__mj_CreatedAt | date:'short' }}</span>\n </div>\n <div class=\"stat-item\">\n <i class=\"fa-solid fa-clock\" aria-hidden=\"true\"></i>\n <span class=\"stat-label\">Updated:</span>\n <span class=\"stat-value\">{{ role.__mj_UpdatedAt | date:'short' }}</span>\n </div>\n </div>\n\n <div class=\"permissions-preview\">\n <h4 class=\"section-title\">\n <i class=\"fa-solid fa-key\" aria-hidden=\"true\"></i>\n Permissions Preview\n </h4>\n <p class=\"permissions-note\">Full permission management available in the Permissions tab</p>\n </div>\n </div>\n }\n </div>\n }\n\n @if (filteredRoles.length === 0) {\n <mj-empty-state\n [Variant]=\"IsListNarrowed ? 'no-results' : 'empty'\"\n Icon=\"fa-solid fa-user-tag\"\n Title=\"No roles found\"\n Message=\"Try adjusting your filters or create a new role\"\n [ActionText]=\"IsListNarrowed ? 'Reset filters' : ''\"\n ActionIcon=\"fa-solid fa-rotate-left\"\n (Action)=\"resetAllFiltersAndSearch()\" />\n }\n </div>\n }\n </mj-page-body-interior>\n\n <!-- Role Create/Edit Dialog -->\n <mj-role-dialog\n [data]=\"roleDialogData\"\n [visible]=\"showRoleDialog\"\n (result)=\"onRoleDialogResult($event)\">\n </mj-role-dialog>\n\n <!-- Delete Confirmation Dialog -->\n @if (showDeleteConfirm && selectedRole) {\n <div\n class=\"modal-backdrop\"\n (click)=\"showDeleteConfirm = false\"\n role=\"presentation\"\n >\n <div\n class=\"modal-dialog\"\n (click)=\"$event.stopPropagation()\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby=\"delete-dialog-title\"\n aria-describedby=\"delete-dialog-desc\"\n >\n <div class=\"modal-header\">\n <h3 class=\"modal-title\" id=\"delete-dialog-title\">\n <i class=\"fa-solid fa-exclamation-triangle text-danger\" aria-hidden=\"true\"></i>\n Confirm Delete\n </h3>\n <button\n class=\"modal-close\"\n (click)=\"showDeleteConfirm = false\"\n aria-label=\"Close dialog\"\n >\n <i class=\"fa-solid fa-times\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <div class=\"modal-body\" id=\"delete-dialog-desc\">\n <p>Are you sure you want to delete the role <strong>{{ selectedRole.Name }}</strong>?</p>\n <mj-alert Variant=\"warning\" Message=\"This will affect all users assigned to this role.\" />\n </div>\n <div class=\"modal-footer\">\n <!-- Primary action (Delete) on LEFT per MD3 design guide -->\n <button mjButton variant=\"danger\" (click)=\"deleteRole()\" [disabled]=\"isLoading\">\n @if (isLoading) {\n <i class=\"fa-solid fa-spinner fa-spin\" aria-hidden=\"true\"></i>\n Deleting...\n } @else {\n <i class=\"fa-solid fa-trash\" aria-hidden=\"true\"></i>\n Delete Role\n }\n </button>\n <button mjButton (click)=\"showDeleteConfirm = false\">\n Cancel\n </button>\n </div>\n </div>\n </div>\n }\n\n"]}
package/dist/lib/settings/settings.component.js CHANGED
@@ -560,7 +560,7 @@ let SettingsComponent = class SettingsComponent extends BaseNavigationComponent
560
560
  i0.ɵɵconditional(ctx.error && !ctx.isLoading ? 2 : -1);
561
561
  i0.ɵɵadvance();
562
562
  i0.ɵɵconditional(!ctx.isLoading && !ctx.error ? 3 : -1);
563
- } }, dependencies: [i2.LoadingComponent, i3.NotificationPreferencesComponent, i4.GeneralSettingsComponent, i5.ApplicationSettingsComponent, i6.AppearanceSettingsComponent], styles: ["\n\n\n\n\n\n\n\n\n\n\n\n\n[_nghost-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n overflow: hidden;\n}\n\n@media (max-width: 768px) {\n [_nghost-%COMP%] {\n height: auto;\n min-height: 100vh;\n overflow: visible;\n }\n}\n\n\n\n.mj-page-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n@media (max-width: 768px) {\n .mj-page-container[_ngcontent-%COMP%] {\n overflow-y: visible;\n overflow-x: hidden;\n height: auto;\n min-height: 100vh;\n }\n}\n\n\n\n\n\n\n@keyframes _ngcontent-%COMP%_shimmer {\n 0% {\n background-position: -200% 0;\n }\n 100% {\n background-position: 200% 0;\n }\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes _ngcontent-%COMP%_spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n\n\n\n\n\n.settings-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: var(--mj-bg-page);\n overflow-y: auto;\n position: relative;\n}\n\n\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 2rem;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: 1rem;\n}\n\n\n\n\n\n.error-container[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 2rem;\n}\n\n.error-content[_ngcontent-%COMP%] {\n text-align: center;\n max-width: 400px;\n}\n\n.error-content[_ngcontent-%COMP%] .error-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-status-error);\n margin-bottom: 1rem;\n}\n\n.error-content[_ngcontent-%COMP%] .error-message[_ngcontent-%COMP%] {\n color: var(--mj-text-primary);\n margin-bottom: 1.5rem;\n font-size: 1rem;\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n padding: 0.75rem 1.5rem;\n font-size: 0.875rem;\n font-weight: 500;\n border: none;\n border-radius: 20px;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n white-space: nowrap;\n min-height: 44px;\n background-color: var(--mj-brand-primary);\n color: var(--mj-bg-surface);\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: var(--mj-brand-primary);\n transform: translateY(-1px);\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.08);\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n}\n\n\n\n\n\n\n.settings-content[_ngcontent-%COMP%] {\n display: flex;\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n flex-direction: column;\n width: 100%;\n min-height: 0;\n}\n\n@media (max-width: 768px) {\n .settings-content[_ngcontent-%COMP%] {\n overflow-y: visible;\n overflow-x: hidden;\n height: auto;\n min-height: 0;\n flex: none;\n }\n}\n\n.desktop-layout[_ngcontent-%COMP%] {\n display: flex !important;\n height: 100%;\n width: 100%;\n}\n\n.settings-content[_ngcontent-%COMP%] .desktop-layout[_ngcontent-%COMP%] {\n display: flex !important;\n height: 100%;\n width: 100%;\n}\n\n\n\n\n\n\n.side-navigation[_ngcontent-%COMP%] {\n width: 280px;\n background: var(--mj-bg-surface);\n border-right: 1px solid var(--mj-border-default);\n overflow-y: auto;\n flex-shrink: 0;\n box-shadow: var(--mj-shadow-sm);\n}\n\n\n\n.nav-search[_ngcontent-%COMP%] {\n position: relative;\n padding: 1rem;\n border-bottom: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n}\n\n.nav-search-icon[_ngcontent-%COMP%] {\n position: absolute;\n left: 1.75rem;\n top: 50%;\n transform: translateY(-50%);\n color: var(--mj-text-muted);\n font-size: 1rem;\n pointer-events: none;\n z-index: 1;\n}\n\n.nav-search-input[_ngcontent-%COMP%] {\n width: 100%;\n padding: 0.75rem 2.75rem 0.75rem 2.5rem;\n border: 1px solid var(--mj-border-default);\n border-radius: 9999px;\n font-size: 0.875rem;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n}\n\n.nav-search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: var(--mj-brand-primary);\n background-color: var(--mj-bg-surface);\n box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.nav-search-input[_ngcontent-%COMP%]::placeholder {\n color: var(--mj-text-muted);\n}\n\n.nav-search-clear[_ngcontent-%COMP%] {\n position: absolute;\n right: 1.25rem;\n top: 50%;\n transform: translateY(-50%);\n padding: 0.25rem;\n background: transparent;\n border: none;\n color: var(--mj-text-muted);\n cursor: pointer;\n border-radius: 9999px;\n min-width: 32px;\n min-height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n z-index: 1;\n}\n\n.nav-search-clear[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n}\n\n.nav-search-clear[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n.nav-list[_ngcontent-%COMP%] {\n list-style: none;\n margin: 0;\n padding: 1rem 0;\n}\n\n.nav-item[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n align-items: center;\n padding: 1rem 1.5rem;\n margin: 0.25rem 0.75rem;\n border-radius: 12px;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n color: var(--mj-text-muted);\n font-size: 1rem;\n border: 2px solid transparent;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n transform: translateX(4px);\n}\n\n.nav-item[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n\n\n.nav-item[aria-controls=\"panel-general\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-brand-primary);\n --item-container: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-users\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-warning);\n --item-container: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-roles\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-success);\n --item-container: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-applications\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-brand-primary);\n --item-container: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-permissions\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-error);\n --item-container: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-advanced\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-warning);\n --item-container: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n}\n\n.nav-item.active[_ngcontent-%COMP%] {\n background-color: var(--item-container);\n color: var(--item-color);\n font-weight: 600;\n border-color: var(--item-color);\n box-shadow: var(--mj-shadow-sm);\n}\n\n.nav-item[_ngcontent-%COMP%]:hover:not(.active) {\n border-color: var(--item-color);\n background-color: var(--mj-bg-surface-card);\n}\n\n.nav-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n width: 20px;\n margin-right: 0.75rem;\n font-size: 1.1rem;\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-label[_ngcontent-%COMP%] {\n flex: 1;\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge[_ngcontent-%COMP%] {\n padding: 0.125rem 0.5rem;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 600;\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-primary[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-danger[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n color: var(--mj-status-error);\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-warning[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n color: var(--mj-status-success);\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-success[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n color: var(--mj-status-warning);\n}\n\n\n\n.nav-item.disabled[_ngcontent-%COMP%] {\n opacity: 0.6;\n cursor: not-allowed;\n}\n\n.nav-item.disabled[_ngcontent-%COMP%]:hover {\n background-color: transparent;\n transform: none;\n}\n\n\n\n.coming-soon-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n padding: 0.125rem 0.5rem;\n border-radius: 9999px;\n font-size: 0.625rem;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n color: var(--mj-status-success);\n border: 1px solid var(--mj-border-default);\n}\n\n\n\n.nav-rail-item.disabled[_ngcontent-%COMP%] {\n opacity: 0.6;\n cursor: not-allowed;\n}\n\n.nav-rail-item.disabled[_ngcontent-%COMP%]:hover {\n background-color: transparent;\n}\n\n\n\n\n\n\n.content-area[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n min-height: 0;\n background: var(--mj-bg-surface);\n}\n\n@media (max-width: 768px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n}\n\n.tab-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n max-width: 100%;\n min-height: 0;\n box-sizing: border-box;\n overflow-x: hidden;\n padding: 1.5rem 2rem;\n}\n\n@media (max-width: 768px) {\n .tab-content[_ngcontent-%COMP%] {\n height: auto;\n min-height: 0;\n overflow-y: visible;\n overflow-x: hidden;\n padding: 0.5rem;\n }\n}\n\n\n\n\n\n.section-title[_ngcontent-%COMP%] {\n font-size: 1.5rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 1rem 0;\n padding-bottom: 0.75rem;\n border-bottom: 3px solid var(--mj-border-default);\n display: flex;\n align-items: center;\n gap: 0.75rem;\n}\n\n.section-title[_ngcontent-%COMP%]::before {\n content: \"\";\n width: 4px;\n height: 2rem;\n background: var(--mj-brand-primary);\n border-radius: 2px;\n}\n\n.section-description[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n margin: 0 0 1.5rem 0;\n font-size: 1rem;\n padding: 1rem 1.25rem;\n background-color: var(--mj-bg-surface-sunken);\n border-radius: 12px;\n}\n\n\n\n\n\n.settings-grid[_ngcontent-%COMP%], \n.mj-grid[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n margin-top: 1.5rem;\n}\n\n.mj-grid-responsive[_ngcontent-%COMP%] {\n \n\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n@media (max-width: 768px) {\n .settings-grid[_ngcontent-%COMP%], \n .mj-grid[_ngcontent-%COMP%], \n .mj-grid-responsive[_ngcontent-%COMP%] {\n gap: 1rem;\n margin-top: 0.5rem;\n }\n}\n\n\n\n\n\n.general-settings[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%] {\n margin-bottom: 0.25rem;\n}\n\n.users-settings[_ngcontent-%COMP%] .section-description[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] .section-description[_ngcontent-%COMP%] {\n margin-bottom: 0.5rem;\n}\n\n\n\n\n\n.card-content[_ngcontent-%COMP%] {\n padding: 1rem;\n color: var(--mj-text-muted);\n font-size: 0.875rem;\n}\n\n.card-content[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0 0 1rem 0;\n line-height: 1.6;\n}\n\n\n\n\n\n.beta-warning[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.75rem;\n padding: 0.75rem 1.25rem;\n background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n color: var(--mj-status-warning);\n border-radius: 12px;\n font-size: 0.875rem;\n font-weight: 600;\n margin-bottom: 1.5rem;\n max-width: 100%;\n box-sizing: border-box;\n border: 2px solid var(--mj-status-warning);\n box-shadow: 0 2px 8px rgba(255, 111, 0, 0.2);\n}\n\n.beta-warning[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n@media (max-width: 768px) {\n .beta-warning[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n padding: 0.5rem 0.75rem;\n margin-bottom: 0.75rem;\n }\n}\n\n\n\n\n\n\n.mobile-layout[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n width: 100%;\n max-width: 100vw;\n overflow: visible;\n box-sizing: border-box;\n}\n\n\n\n.mobile-header[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 0.5rem;\n background-color: var(--mj-bg-surface-sunken);\n border-bottom: 1px solid var(--mj-border-default);\n z-index: 100;\n box-sizing: border-box;\n}\n\n.mobile-header-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n min-width: 48px;\n border-radius: 9999px;\n background: transparent;\n color: var(--mj-text-primary);\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.mobile-header-icon[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.mobile-header-icon[_ngcontent-%COMP%]:active {\n transform: scale(0.95);\n}\n\n.mobile-header-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.25rem;\n}\n\n.mobile-header-title[_ngcontent-%COMP%] {\n flex: 1;\n text-align: center;\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0;\n padding: 0 0.5rem;\n}\n\n.mobile-header-spacer[_ngcontent-%COMP%] {\n width: 48px;\n min-width: 48px;\n}\n\n\n\n.mobile-nav-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n inset: 0;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 1000;\n animation: _ngcontent-%COMP%_fadeIn 0.2s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n\n\n.mobile-nav-rail[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n width: 280px;\n max-width: 80vw;\n background-color: var(--mj-bg-surface);\n border-right: 1px solid var(--mj-border-default);\n display: flex;\n flex-direction: column;\n z-index: 1001;\n transform: translateX(-100%);\n transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n box-shadow: var(--mj-shadow-lg);\n overflow: hidden;\n}\n\n.mobile-nav-rail.open[_ngcontent-%COMP%] {\n transform: translateX(0);\n}\n\n\n\n.nav-rail-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n padding: 1rem 1.5rem;\n min-height: 64px;\n border-bottom: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface-sunken);\n flex-shrink: 0;\n}\n\n.nav-rail-title[_ngcontent-%COMP%] {\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n\n\n.nav-rail-items[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n padding: 0.5rem;\n gap: 0.25rem;\n overflow-y: auto;\n overflow-x: hidden;\n flex: 1;\n}\n\n\n\n.nav-rail-close-item[_ngcontent-%COMP%] {\n margin-top: auto;\n border-top: 1px solid var(--mj-border-default);\n padding-top: 0.75rem !important;\n margin-top: 0.5rem;\n background-color: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface)) !important;\n color: var(--mj-status-error) !important;\n}\n\n.nav-rail-close-item[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-status-error) !important;\n color: var(--mj-bg-surface) !important;\n}\n\n.nav-rail-close-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.5rem;\n}\n\n\n\n.nav-rail-item[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 1rem;\n width: 100%;\n padding: 0.875rem 1rem;\n background: transparent;\n border: none;\n border-radius: 12px;\n color: var(--mj-text-muted);\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n text-align: left;\n min-height: 56px;\n}\n\n.nav-rail-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.5rem;\n width: 24px;\n text-align: center;\n flex-shrink: 0;\n transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.nav-rail-label[_ngcontent-%COMP%] {\n font-size: 1rem;\n font-weight: 500;\n flex: 1;\n}\n\n.nav-rail-item[_ngcontent-%COMP%]:hover:not(.active) {\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n}\n\n.nav-rail-item.active[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n\n.nav-rail-item.active[_ngcontent-%COMP%] .nav-rail-label[_ngcontent-%COMP%] {\n font-weight: 600;\n}\n\n.nav-rail-item[_ngcontent-%COMP%]:active {\n transform: scale(0.98);\n}\n\n.nav-rail-item[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n\n\n.rail-badge[_ngcontent-%COMP%] {\n min-width: 20px;\n height: 20px;\n padding: 0 6px;\n border-radius: 9999px;\n font-size: 11px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.rail-badge.badge-primary[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary);\n color: var(--mj-bg-surface);\n}\n\n.rail-badge.badge-danger[_ngcontent-%COMP%] {\n background-color: var(--mj-status-error);\n color: var(--mj-bg-surface);\n}\n\n.rail-badge.badge-warning[_ngcontent-%COMP%] {\n background-color: var(--mj-status-success);\n color: var(--mj-bg-surface);\n}\n\n.rail-badge.badge-success[_ngcontent-%COMP%] {\n background-color: var(--mj-status-warning);\n color: var(--mj-text-primary);\n}\n\n\n\n.mobile-content[_ngcontent-%COMP%] {\n width: 100%;\n max-width: 100vw;\n overflow-y: visible;\n overflow-x: hidden;\n padding: 72px 0.75rem 2rem 0.75rem;\n min-width: 0;\n box-sizing: border-box;\n -webkit-overflow-scrolling: touch;\n flex: 1;\n}\n\n\n\n@media (max-width: 374px) {\n .mobile-nav-rail[_ngcontent-%COMP%] {\n width: 260px;\n }\n\n .mobile-content[_ngcontent-%COMP%] {\n padding: 64px 0.5rem 1.5rem 0.5rem;\n }\n\n .mobile-header[_ngcontent-%COMP%] {\n height: 52px;\n padding: 0 0.25rem;\n }\n\n .mobile-header-icon[_ngcontent-%COMP%] {\n width: 44px;\n height: 44px;\n min-width: 44px;\n }\n\n .mobile-header-spacer[_ngcontent-%COMP%] {\n width: 44px;\n min-width: 44px;\n }\n\n .mobile-header-title[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n }\n}\n\n\n\n\n\n\n.advanced-tabs[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.5rem;\n border-bottom: 2px solid var(--mj-border-default);\n margin-bottom: 1rem;\n margin-top: 1rem;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: thin;\n -webkit-overflow-scrolling: touch;\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.75rem 1rem;\n background: transparent;\n border: none;\n border-bottom: 3px solid transparent;\n color: var(--mj-text-muted);\n font-size: 0.875rem;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n position: relative;\n min-height: 44px;\n white-space: nowrap;\n flex-shrink: 0;\n}\n\n\n\n@media (max-width: 768px) {\n .advanced-tabs[_ngcontent-%COMP%] {\n gap: 0;\n margin-bottom: 1rem;\n margin-top: 1rem;\n border-bottom: none;\n border: 1px solid var(--mj-border-strong);\n border-radius: 9999px;\n padding: 0;\n background-color: var(--mj-bg-surface-sunken);\n overflow-x: hidden;\n width: 100%;\n max-width: 100%;\n box-sizing: border-box;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] {\n flex: 1;\n padding: 0.625rem 0.5rem;\n font-size: 0.75rem;\n border-bottom: none;\n border-radius: 0;\n border-right: 1px solid var(--mj-border-strong);\n min-width: 0;\n justify-content: center;\n text-align: center;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:last-child {\n border-right: none;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:first-child {\n border-radius: 9999px 0 0 9999px;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:last-child {\n border-radius: 0 9999px 9999px 0;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn.active[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n color: var(--mj-status-warning);\n border-bottom: none;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n }\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface-sunken);\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: -2px;\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn.active[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n border-bottom-color: var(--mj-brand-primary);\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn.active[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n}\n\n\n\n\n\n\n.advanced-tab-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: visible;\n overflow-x: hidden;\n min-height: 0;\n position: relative;\n background: var(--mj-bg-surface);\n border-radius: 16px;\n padding: 0;\n width: 100%;\n max-width: 100%;\n box-sizing: border-box;\n}\n\n\n\n@media (max-width: 768px) {\n .advanced-tab-content[_ngcontent-%COMP%] {\n height: auto;\n min-height: 200px;\n overflow-y: visible;\n }\n}\n\n.performance-settings[_ngcontent-%COMP%], \n.developer-settings[_ngcontent-%COMP%] {\n padding: 2rem;\n}\n\n.performance-settings[_ngcontent-%COMP%] h3[_ngcontent-%COMP%], \n.developer-settings[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 1rem 0;\n font-size: 1.25rem;\n color: var(--mj-text-primary);\n}\n\n.performance-settings[_ngcontent-%COMP%] p[_ngcontent-%COMP%], \n.developer-settings[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: 1rem;\n}\n\n\n\n\n\n\n.general-settings[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%], \n.applications-settings[_ngcontent-%COMP%], \n.permissions-settings[_ngcontent-%COMP%], \n.advanced-settings[_ngcontent-%COMP%] {\n animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n width: 100%;\n max-width: 100%;\n height: auto;\n min-height: 100%;\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n overflow-y: visible;\n overflow-x: hidden;\n box-sizing: border-box;\n}\n\n\n\n@media (max-width: 768px) {\n .general-settings[_ngcontent-%COMP%], \n .users-settings[_ngcontent-%COMP%], \n .roles-settings[_ngcontent-%COMP%], \n .applications-settings[_ngcontent-%COMP%], \n .permissions-settings[_ngcontent-%COMP%], \n .advanced-settings[_ngcontent-%COMP%] {\n gap: 0.75rem;\n height: auto;\n min-height: auto;\n }\n\n .section-title[_ngcontent-%COMP%] {\n margin-bottom: 0.5rem;\n font-size: 1.375rem;\n }\n\n .section-description[_ngcontent-%COMP%] {\n margin-bottom: 0.75rem;\n }\n}\n\n\n\n.general-settings[_ngcontent-%COMP%] > mj-settings-card[_ngcontent-%COMP%], \n.general-settings[_ngcontent-%COMP%] > .mj-grid[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] > mj-user-management[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] > mj-role-management[_ngcontent-%COMP%], \n.applications-settings[_ngcontent-%COMP%] > mj-application-management[_ngcontent-%COMP%], \n.permissions-settings[_ngcontent-%COMP%] > mj-entity-permissions[_ngcontent-%COMP%], \n.advanced-settings[_ngcontent-%COMP%] > .advanced-tabs[_ngcontent-%COMP%], \n.advanced-settings[_ngcontent-%COMP%] > .advanced-tab-content[_ngcontent-%COMP%] {\n flex-shrink: 0;\n width: 100%;\n max-width: 100%;\n box-sizing: border-box;\n}\n\n\n\n@media (max-width: 768px) {\n .users-settings[_ngcontent-%COMP%] > mj-user-management[_ngcontent-%COMP%], \n .roles-settings[_ngcontent-%COMP%] > mj-role-management[_ngcontent-%COMP%], \n .applications-settings[_ngcontent-%COMP%] > mj-application-management[_ngcontent-%COMP%], \n .permissions-settings[_ngcontent-%COMP%] > mj-entity-permissions[_ngcontent-%COMP%], \n .advanced-settings[_ngcontent-%COMP%] > .advanced-tab-content[_ngcontent-%COMP%] {\n flex: none;\n height: auto !important;\n min-height: 0;\n max-height: none !important;\n overflow-y: visible !important;\n overflow-x: hidden;\n }\n}\n\n\n\n.general-settings[_ngcontent-%COMP%] > .section-title[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] > .section-title[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] > .section-title[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] > .section-description[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] > .section-description[_ngcontent-%COMP%] {\n flex-shrink: 0;\n flex-grow: 0;\n}\n\n\n\n\n\n\n@media (prefers-reduced-motion: reduce) {\n .general-settings[_ngcontent-%COMP%], \n .users-settings[_ngcontent-%COMP%], \n .roles-settings[_ngcontent-%COMP%], \n .applications-settings[_ngcontent-%COMP%], \n .permissions-settings[_ngcontent-%COMP%], \n .advanced-settings[_ngcontent-%COMP%] {\n animation: none;\n }\n\n .nav-tab[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n .nav-item[_ngcontent-%COMP%], \n .tab-btn[_ngcontent-%COMP%], \n .search-input[_ngcontent-%COMP%], \n .retry-button[_ngcontent-%COMP%], \n .search-result-item[_ngcontent-%COMP%] {\n transition: none;\n }\n}\n\n\n\n\n\n@media (max-width: 640px) {\n .side-navigation[_ngcontent-%COMP%] {\n width: 200px;\n }\n\n .nav-item[_ngcontent-%COMP%] {\n padding: 0.75rem 1rem;\n }\n}\n\n@media (max-width: 1024px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 1.5rem;\n }\n}\n\n\n\n@media (max-width: 768px) {\n .mobile-layout[_ngcontent-%COMP%] mj-user-management[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-role-management[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-application-management[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-entity-permissions[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-sql-logging[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-settings-card[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-user-profile-settings[_ngcontent-%COMP%] {\n display: block;\n height: auto !important;\n max-height: none !important;\n overflow: visible !important;\n }\n\n \n\n .mobile-layout[_ngcontent-%COMP%] .general-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .users-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .roles-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .applications-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .permissions-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .advanced-settings[_ngcontent-%COMP%] {\n height: auto !important;\n min-height: 0 !important;\n max-height: none !important;\n }\n\n \n\n .mobile-layout[_ngcontent-%COMP%] .mj-grid[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .mj-grid-responsive[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .card-content[_ngcontent-%COMP%] {\n height: auto !important;\n min-height: 0 !important;\n }\n}\n\n@media (min-width: 1440px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 2.5rem 3rem;\n }\n\n .side-navigation[_ngcontent-%COMP%] {\n width: 280px;\n }\n}\n\n\n\n\n\n@media (max-width: 768px) {\n \n\n body[_ngcontent-%COMP%] {\n position: relative;\n overflow-y: visible;\n -webkit-overflow-scrolling: touch;\n }\n\n \n\n .mobile-layout[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] > *[_ngcontent-%COMP%], \n .mobile-content[_ngcontent-%COMP%] > *[_ngcontent-%COMP%], \n .tab-content[_ngcontent-%COMP%] > *[_ngcontent-%COMP%] {\n -webkit-overflow-scrolling: touch;\n }\n\n \n\n .mobile-layout[_ngcontent-%COMP%] *[_ngcontent-%COMP%] {\n box-sizing: border-box;\n }\n}"] });
563
+ } }, dependencies: [i2.LoadingComponent, i3.NotificationPreferencesComponent, i4.GeneralSettingsComponent, i5.ApplicationSettingsComponent, i6.AppearanceSettingsComponent], styles: ["\n\n\n\n\n\n\n\n\n\n[_nghost-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n overflow: hidden;\n}\n\n@media (max-width: 768px) {\n [_nghost-%COMP%] {\n height: auto;\n min-height: 100vh;\n overflow: visible;\n }\n}\n\n\n.mj-page-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n@media (max-width: 768px) {\n .mj-page-container[_ngcontent-%COMP%] {\n overflow-y: visible;\n overflow-x: hidden;\n height: auto;\n min-height: 100vh;\n }\n}\n\n\n\n\n\n@keyframes _ngcontent-%COMP%_shimmer {\n 0% {\n background-position: -200% 0;\n }\n 100% {\n background-position: 200% 0;\n }\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n transform: translateY(10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n@keyframes _ngcontent-%COMP%_spin {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n\n\n\n\n.settings-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n background-color: var(--mj-bg-page);\n overflow-y: auto;\n position: relative;\n}\n\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 2rem;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: 1rem;\n}\n\n\n\n\n.error-container[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 2rem;\n}\n\n.error-content[_ngcontent-%COMP%] {\n text-align: center;\n max-width: 400px;\n}\n\n.error-content[_ngcontent-%COMP%] .error-icon[_ngcontent-%COMP%] {\n font-size: 3rem;\n color: var(--mj-status-error);\n margin-bottom: 1rem;\n}\n\n.error-content[_ngcontent-%COMP%] .error-message[_ngcontent-%COMP%] {\n color: var(--mj-text-primary);\n margin-bottom: 1.5rem;\n font-size: 1rem;\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n padding: 0.75rem 1.5rem;\n font-size: 0.875rem;\n font-weight: 500;\n border: none;\n border-radius: 20px;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n white-space: nowrap;\n min-height: 44px;\n background-color: var(--mj-brand-primary);\n color: var(--mj-bg-surface);\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%]:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background-color: var(--mj-brand-primary);\n transform: translateY(-1px);\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.08);\n}\n\n.error-content[_ngcontent-%COMP%] .retry-button[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n}\n\n\n\n\n\n.settings-content[_ngcontent-%COMP%] {\n display: flex;\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n flex-direction: column;\n width: 100%;\n min-height: 0;\n}\n\n@media (max-width: 768px) {\n .settings-content[_ngcontent-%COMP%] {\n overflow-y: visible;\n overflow-x: hidden;\n height: auto;\n min-height: 0;\n flex: none;\n }\n}\n\n.desktop-layout[_ngcontent-%COMP%] {\n display: flex !important;\n height: 100%;\n width: 100%;\n}\n\n.settings-content[_ngcontent-%COMP%] .desktop-layout[_ngcontent-%COMP%] {\n display: flex !important;\n height: 100%;\n width: 100%;\n}\n\n\n\n\n\n.side-navigation[_ngcontent-%COMP%] {\n width: 280px;\n background: var(--mj-bg-surface);\n border-right: 1px solid var(--mj-border-default);\n overflow-y: auto;\n flex-shrink: 0;\n box-shadow: var(--mj-shadow-sm);\n}\n\n\n.nav-search[_ngcontent-%COMP%] {\n position: relative;\n padding: 1rem;\n border-bottom: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface);\n}\n\n.nav-search-icon[_ngcontent-%COMP%] {\n position: absolute;\n left: 1.75rem;\n top: 50%;\n transform: translateY(-50%);\n color: var(--mj-text-muted);\n font-size: 1rem;\n pointer-events: none;\n z-index: 1;\n}\n\n.nav-search-input[_ngcontent-%COMP%] {\n width: 100%;\n padding: 0.75rem 2.75rem 0.75rem 2.5rem;\n border: 1px solid var(--mj-border-default);\n border-radius: 9999px;\n font-size: 0.875rem;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n}\n\n.nav-search-input[_ngcontent-%COMP%]:focus {\n outline: none;\n border-color: var(--mj-brand-primary);\n background-color: var(--mj-bg-surface);\n box-shadow: 0 0 0 2px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.nav-search-input[_ngcontent-%COMP%]::placeholder {\n color: var(--mj-text-muted);\n}\n\n.nav-search-clear[_ngcontent-%COMP%] {\n position: absolute;\n right: 1.25rem;\n top: 50%;\n transform: translateY(-50%);\n padding: 0.25rem;\n background: transparent;\n border: none;\n color: var(--mj-text-muted);\n cursor: pointer;\n border-radius: 9999px;\n min-width: 32px;\n min-height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n z-index: 1;\n}\n\n.nav-search-clear[_ngcontent-%COMP%]:hover {\n background: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n}\n\n.nav-search-clear[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n.nav-list[_ngcontent-%COMP%] {\n list-style: none;\n margin: 0;\n padding: 1rem 0;\n}\n\n.nav-item[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n align-items: center;\n padding: 1rem 1.5rem;\n margin: 0.25rem 0.75rem;\n border-radius: 12px;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n color: var(--mj-text-muted);\n font-size: 1rem;\n border: 2px solid transparent;\n}\n\n.nav-item[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n transform: translateX(4px);\n}\n\n.nav-item[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n\n.nav-item[aria-controls=\"panel-general\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-brand-primary);\n --item-container: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-users\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-warning);\n --item-container: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-roles\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-success);\n --item-container: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-applications\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-brand-primary);\n --item-container: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-permissions\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-error);\n --item-container: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n}\n\n.nav-item[aria-controls=\"panel-advanced\"][_ngcontent-%COMP%] {\n --item-color: var(--mj-status-warning);\n --item-container: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n}\n\n.nav-item.active[_ngcontent-%COMP%] {\n background-color: var(--item-container);\n color: var(--item-color);\n font-weight: 600;\n border-color: var(--item-color);\n box-shadow: var(--mj-shadow-sm);\n}\n\n.nav-item[_ngcontent-%COMP%]:hover:not(.active) {\n border-color: var(--item-color);\n background-color: var(--mj-bg-surface-card);\n}\n\n.nav-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n width: 20px;\n margin-right: 0.75rem;\n font-size: 1.1rem;\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-label[_ngcontent-%COMP%] {\n flex: 1;\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge[_ngcontent-%COMP%] {\n padding: 0.125rem 0.5rem;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 600;\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-primary[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-danger[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n color: var(--mj-status-error);\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-warning[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n color: var(--mj-status-success);\n}\n\n.nav-item[_ngcontent-%COMP%] .nav-badge.badge-success[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n color: var(--mj-status-warning);\n}\n\n\n.nav-item.disabled[_ngcontent-%COMP%] {\n opacity: 0.6;\n cursor: not-allowed;\n}\n\n.nav-item.disabled[_ngcontent-%COMP%]:hover {\n background-color: transparent;\n transform: none;\n}\n\n\n.coming-soon-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n padding: 0.125rem 0.5rem;\n border-radius: 9999px;\n font-size: 0.625rem;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n color: var(--mj-status-success);\n border: 1px solid var(--mj-border-default);\n}\n\n\n.nav-rail-item.disabled[_ngcontent-%COMP%] {\n opacity: 0.6;\n cursor: not-allowed;\n}\n\n.nav-rail-item.disabled[_ngcontent-%COMP%]:hover {\n background-color: transparent;\n}\n\n\n\n\n\n.content-area[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 0;\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n min-height: 0;\n background: var(--mj-bg-surface);\n}\n\n@media (max-width: 768px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n}\n\n.tab-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n max-width: 100%;\n min-height: 0;\n box-sizing: border-box;\n overflow-x: hidden;\n padding: 1.5rem 2rem;\n}\n\n@media (max-width: 768px) {\n .tab-content[_ngcontent-%COMP%] {\n height: auto;\n min-height: 0;\n overflow-y: visible;\n overflow-x: hidden;\n padding: 0.5rem;\n }\n}\n\n\n\n\n.section-title[_ngcontent-%COMP%] {\n font-size: 1.5rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0 0 1rem 0;\n padding-bottom: 0.75rem;\n border-bottom: 3px solid var(--mj-border-default);\n display: flex;\n align-items: center;\n gap: 0.75rem;\n}\n\n.section-title[_ngcontent-%COMP%]::before {\n content: \"\";\n width: 4px;\n height: 2rem;\n background: var(--mj-brand-primary);\n border-radius: 2px;\n}\n\n.section-description[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n margin: 0 0 1.5rem 0;\n font-size: 1rem;\n padding: 1rem 1.25rem;\n background-color: var(--mj-bg-surface-sunken);\n border-radius: 12px;\n}\n\n\n\n\n.settings-grid[_ngcontent-%COMP%], \n.mj-grid[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n margin-top: 1.5rem;\n}\n\n.mj-grid-responsive[_ngcontent-%COMP%] {\n \n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n@media (max-width: 768px) {\n .settings-grid[_ngcontent-%COMP%], \n .mj-grid[_ngcontent-%COMP%], \n .mj-grid-responsive[_ngcontent-%COMP%] {\n gap: 1rem;\n margin-top: 0.5rem;\n }\n}\n\n\n\n\n.general-settings[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] .section-title[_ngcontent-%COMP%] {\n margin-bottom: 0.25rem;\n}\n\n.users-settings[_ngcontent-%COMP%] .section-description[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] .section-description[_ngcontent-%COMP%] {\n margin-bottom: 0.5rem;\n}\n\n\n\n\n.card-content[_ngcontent-%COMP%] {\n padding: 1rem;\n color: var(--mj-text-muted);\n font-size: 0.875rem;\n}\n\n.card-content[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0 0 1rem 0;\n line-height: 1.6;\n}\n\n\n\n\n.beta-warning[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.75rem;\n padding: 0.75rem 1.25rem;\n background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n color: var(--mj-status-warning);\n border-radius: 12px;\n font-size: 0.875rem;\n font-weight: 600;\n margin-bottom: 1.5rem;\n max-width: 100%;\n box-sizing: border-box;\n border: 2px solid var(--mj-status-warning);\n box-shadow: 0 2px 8px rgba(255, 111, 0, 0.2);\n}\n\n.beta-warning[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n@media (max-width: 768px) {\n .beta-warning[_ngcontent-%COMP%] {\n font-size: 0.8125rem;\n padding: 0.5rem 0.75rem;\n margin-bottom: 0.75rem;\n }\n}\n\n\n\n\n\n.mobile-layout[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n width: 100%;\n max-width: 100vw;\n overflow: visible;\n box-sizing: border-box;\n}\n\n\n.mobile-header[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 0.5rem;\n background-color: var(--mj-bg-surface-sunken);\n border-bottom: 1px solid var(--mj-border-default);\n z-index: 100;\n box-sizing: border-box;\n}\n\n.mobile-header-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n min-width: 48px;\n border-radius: 9999px;\n background: transparent;\n color: var(--mj-text-primary);\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.mobile-header-icon[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-bg-surface-sunken);\n}\n\n.mobile-header-icon[_ngcontent-%COMP%]:active {\n transform: scale(0.95);\n}\n\n.mobile-header-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.25rem;\n}\n\n.mobile-header-title[_ngcontent-%COMP%] {\n flex: 1;\n text-align: center;\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n margin: 0;\n padding: 0 0.5rem;\n}\n\n.mobile-header-spacer[_ngcontent-%COMP%] {\n width: 48px;\n min-width: 48px;\n}\n\n\n.mobile-nav-backdrop[_ngcontent-%COMP%] {\n position: fixed;\n inset: 0;\n background-color: rgba(0, 0, 0, 0.5);\n z-index: 1000;\n animation: _ngcontent-%COMP%_fadeIn 0.2s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n\n.mobile-nav-rail[_ngcontent-%COMP%] {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n width: 280px;\n max-width: 80vw;\n background-color: var(--mj-bg-surface);\n border-right: 1px solid var(--mj-border-default);\n display: flex;\n flex-direction: column;\n z-index: 1001;\n transform: translateX(-100%);\n transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n box-shadow: var(--mj-shadow-lg);\n overflow: hidden;\n}\n\n.mobile-nav-rail.open[_ngcontent-%COMP%] {\n transform: translateX(0);\n}\n\n\n.nav-rail-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n padding: 1rem 1.5rem;\n min-height: 64px;\n border-bottom: 1px solid var(--mj-border-default);\n background-color: var(--mj-bg-surface-sunken);\n flex-shrink: 0;\n}\n\n.nav-rail-title[_ngcontent-%COMP%] {\n font-size: 1.25rem;\n font-weight: 600;\n color: var(--mj-text-primary);\n}\n\n\n.nav-rail-items[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n padding: 0.5rem;\n gap: 0.25rem;\n overflow-y: auto;\n overflow-x: hidden;\n flex: 1;\n}\n\n\n.nav-rail-close-item[_ngcontent-%COMP%] {\n margin-top: auto;\n border-top: 1px solid var(--mj-border-default);\n padding-top: 0.75rem !important;\n margin-top: 0.5rem;\n background-color: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface)) !important;\n color: var(--mj-status-error) !important;\n}\n\n.nav-rail-close-item[_ngcontent-%COMP%]:hover {\n background-color: var(--mj-status-error) !important;\n color: var(--mj-bg-surface) !important;\n}\n\n.nav-rail-close-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.5rem;\n}\n\n\n.nav-rail-item[_ngcontent-%COMP%] {\n position: relative;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 1rem;\n width: 100%;\n padding: 0.875rem 1rem;\n background: transparent;\n border: none;\n border-radius: 12px;\n color: var(--mj-text-muted);\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n text-align: left;\n min-height: 56px;\n}\n\n.nav-rail-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.5rem;\n width: 24px;\n text-align: center;\n flex-shrink: 0;\n transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n.nav-rail-label[_ngcontent-%COMP%] {\n font-size: 1rem;\n font-weight: 500;\n flex: 1;\n}\n\n.nav-rail-item[_ngcontent-%COMP%]:hover:not(.active) {\n background-color: var(--mj-bg-surface-sunken);\n color: var(--mj-text-primary);\n}\n\n.nav-rail-item.active[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n color: var(--mj-brand-primary);\n}\n\n.nav-rail-item.active[_ngcontent-%COMP%] .nav-rail-label[_ngcontent-%COMP%] {\n font-weight: 600;\n}\n\n.nav-rail-item[_ngcontent-%COMP%]:active {\n transform: scale(0.98);\n}\n\n.nav-rail-item[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: 2px;\n}\n\n\n.rail-badge[_ngcontent-%COMP%] {\n min-width: 20px;\n height: 20px;\n padding: 0 6px;\n border-radius: 9999px;\n font-size: 11px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.rail-badge.badge-primary[_ngcontent-%COMP%] {\n background-color: var(--mj-brand-primary);\n color: var(--mj-bg-surface);\n}\n\n.rail-badge.badge-danger[_ngcontent-%COMP%] {\n background-color: var(--mj-status-error);\n color: var(--mj-bg-surface);\n}\n\n.rail-badge.badge-warning[_ngcontent-%COMP%] {\n background-color: var(--mj-status-success);\n color: var(--mj-bg-surface);\n}\n\n.rail-badge.badge-success[_ngcontent-%COMP%] {\n background-color: var(--mj-status-warning);\n color: var(--mj-text-primary);\n}\n\n\n.mobile-content[_ngcontent-%COMP%] {\n width: 100%;\n max-width: 100vw;\n overflow-y: visible;\n overflow-x: hidden;\n padding: 72px 0.75rem 2rem 0.75rem;\n min-width: 0;\n box-sizing: border-box;\n -webkit-overflow-scrolling: touch;\n flex: 1;\n}\n\n\n@media (max-width: 374px) {\n .mobile-nav-rail[_ngcontent-%COMP%] {\n width: 260px;\n }\n\n .mobile-content[_ngcontent-%COMP%] {\n padding: 64px 0.5rem 1.5rem 0.5rem;\n }\n\n .mobile-header[_ngcontent-%COMP%] {\n height: 52px;\n padding: 0 0.25rem;\n }\n\n .mobile-header-icon[_ngcontent-%COMP%] {\n width: 44px;\n height: 44px;\n min-width: 44px;\n }\n\n .mobile-header-spacer[_ngcontent-%COMP%] {\n width: 44px;\n min-width: 44px;\n }\n\n .mobile-header-title[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n }\n}\n\n\n\n\n\n.advanced-tabs[_ngcontent-%COMP%] {\n display: flex;\n gap: 0.5rem;\n border-bottom: 2px solid var(--mj-border-default);\n margin-bottom: 1rem;\n margin-top: 1rem;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: thin;\n -webkit-overflow-scrolling: touch;\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.75rem 1rem;\n background: transparent;\n border: none;\n border-bottom: 3px solid transparent;\n color: var(--mj-text-muted);\n font-size: 0.875rem;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n position: relative;\n min-height: 44px;\n white-space: nowrap;\n flex-shrink: 0;\n}\n\n\n@media (max-width: 768px) {\n .advanced-tabs[_ngcontent-%COMP%] {\n gap: 0;\n margin-bottom: 1rem;\n margin-top: 1rem;\n border-bottom: none;\n border: 1px solid var(--mj-border-strong);\n border-radius: 9999px;\n padding: 0;\n background-color: var(--mj-bg-surface-sunken);\n overflow-x: hidden;\n width: 100%;\n max-width: 100%;\n box-sizing: border-box;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] {\n flex: 1;\n padding: 0.625rem 0.5rem;\n font-size: 0.75rem;\n border-bottom: none;\n border-radius: 0;\n border-right: 1px solid var(--mj-border-strong);\n min-width: 0;\n justify-content: center;\n text-align: center;\n white-space: nowrap;\n overflow: hidden;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:last-child {\n border-right: none;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:first-child {\n border-radius: 9999px 0 0 9999px;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:last-child {\n border-radius: 0 9999px 9999px 0;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn.active[_ngcontent-%COMP%] {\n background-color: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n color: var(--mj-status-warning);\n border-bottom: none;\n }\n\n .advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 0.875rem;\n }\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:hover {\n color: var(--mj-text-primary);\n background: var(--mj-bg-surface-sunken);\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--mj-brand-primary);\n outline-offset: -2px;\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn.active[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n border-bottom-color: var(--mj-brand-primary);\n background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn.active[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: var(--mj-brand-primary);\n}\n\n.advanced-tabs[_ngcontent-%COMP%] .tab-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.125rem;\n}\n\n\n\n\n\n.advanced-tab-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: visible;\n overflow-x: hidden;\n min-height: 0;\n position: relative;\n background: var(--mj-bg-surface);\n border-radius: 16px;\n padding: 0;\n width: 100%;\n max-width: 100%;\n box-sizing: border-box;\n}\n\n\n@media (max-width: 768px) {\n .advanced-tab-content[_ngcontent-%COMP%] {\n height: auto;\n min-height: 200px;\n overflow-y: visible;\n }\n}\n\n.performance-settings[_ngcontent-%COMP%], \n.developer-settings[_ngcontent-%COMP%] {\n padding: 2rem;\n}\n\n.performance-settings[_ngcontent-%COMP%] h3[_ngcontent-%COMP%], \n.developer-settings[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 1rem 0;\n font-size: 1.25rem;\n color: var(--mj-text-primary);\n}\n\n.performance-settings[_ngcontent-%COMP%] p[_ngcontent-%COMP%], \n.developer-settings[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n color: var(--mj-text-muted);\n font-size: 1rem;\n}\n\n\n\n\n\n.general-settings[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%], \n.applications-settings[_ngcontent-%COMP%], \n.permissions-settings[_ngcontent-%COMP%], \n.advanced-settings[_ngcontent-%COMP%] {\n animation: _ngcontent-%COMP%_fadeIn 0.3s ease-out;\n width: 100%;\n max-width: 100%;\n height: auto;\n min-height: 100%;\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n overflow-y: visible;\n overflow-x: hidden;\n box-sizing: border-box;\n}\n\n\n@media (max-width: 768px) {\n .general-settings[_ngcontent-%COMP%], \n .users-settings[_ngcontent-%COMP%], \n .roles-settings[_ngcontent-%COMP%], \n .applications-settings[_ngcontent-%COMP%], \n .permissions-settings[_ngcontent-%COMP%], \n .advanced-settings[_ngcontent-%COMP%] {\n gap: 0.75rem;\n height: auto;\n min-height: auto;\n }\n\n .section-title[_ngcontent-%COMP%] {\n margin-bottom: 0.5rem;\n font-size: 1.375rem;\n }\n\n .section-description[_ngcontent-%COMP%] {\n margin-bottom: 0.75rem;\n }\n}\n\n\n.general-settings[_ngcontent-%COMP%] > mj-settings-card[_ngcontent-%COMP%], \n.general-settings[_ngcontent-%COMP%] > .mj-grid[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] > mj-user-management[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] > mj-role-management[_ngcontent-%COMP%], \n.applications-settings[_ngcontent-%COMP%] > mj-application-management[_ngcontent-%COMP%], \n.permissions-settings[_ngcontent-%COMP%] > mj-entity-permissions[_ngcontent-%COMP%], \n.advanced-settings[_ngcontent-%COMP%] > .advanced-tabs[_ngcontent-%COMP%], \n.advanced-settings[_ngcontent-%COMP%] > .advanced-tab-content[_ngcontent-%COMP%] {\n flex-shrink: 0;\n width: 100%;\n max-width: 100%;\n box-sizing: border-box;\n}\n\n\n@media (max-width: 768px) {\n .users-settings[_ngcontent-%COMP%] > mj-user-management[_ngcontent-%COMP%], \n .roles-settings[_ngcontent-%COMP%] > mj-role-management[_ngcontent-%COMP%], \n .applications-settings[_ngcontent-%COMP%] > mj-application-management[_ngcontent-%COMP%], \n .permissions-settings[_ngcontent-%COMP%] > mj-entity-permissions[_ngcontent-%COMP%], \n .advanced-settings[_ngcontent-%COMP%] > .advanced-tab-content[_ngcontent-%COMP%] {\n flex: none;\n height: auto !important;\n min-height: 0;\n max-height: none !important;\n overflow-y: visible !important;\n overflow-x: hidden;\n }\n}\n\n\n.general-settings[_ngcontent-%COMP%] > .section-title[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] > .section-title[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] > .section-title[_ngcontent-%COMP%], \n.users-settings[_ngcontent-%COMP%] > .section-description[_ngcontent-%COMP%], \n.roles-settings[_ngcontent-%COMP%] > .section-description[_ngcontent-%COMP%] {\n flex-shrink: 0;\n flex-grow: 0;\n}\n\n\n\n\n\n@media (prefers-reduced-motion: reduce) {\n .general-settings[_ngcontent-%COMP%], \n .users-settings[_ngcontent-%COMP%], \n .roles-settings[_ngcontent-%COMP%], \n .applications-settings[_ngcontent-%COMP%], \n .permissions-settings[_ngcontent-%COMP%], \n .advanced-settings[_ngcontent-%COMP%] {\n animation: none;\n }\n\n .nav-tab[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n .nav-item[_ngcontent-%COMP%], \n .tab-btn[_ngcontent-%COMP%], \n .search-input[_ngcontent-%COMP%], \n .retry-button[_ngcontent-%COMP%], \n .search-result-item[_ngcontent-%COMP%] {\n transition: none;\n }\n}\n\n\n\n\n@media (max-width: 640px) {\n .side-navigation[_ngcontent-%COMP%] {\n width: 200px;\n }\n\n .nav-item[_ngcontent-%COMP%] {\n padding: 0.75rem 1rem;\n }\n}\n\n@media (max-width: 1024px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 1.5rem;\n }\n}\n\n\n@media (max-width: 768px) {\n .mobile-layout[_ngcontent-%COMP%] mj-user-management[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-role-management[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-application-management[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-entity-permissions[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-sql-logging[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-settings-card[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] mj-user-profile-settings[_ngcontent-%COMP%] {\n display: block;\n height: auto !important;\n max-height: none !important;\n overflow: visible !important;\n }\n\n \n .mobile-layout[_ngcontent-%COMP%] .general-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .users-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .roles-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .applications-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .permissions-settings[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .advanced-settings[_ngcontent-%COMP%] {\n height: auto !important;\n min-height: 0 !important;\n max-height: none !important;\n }\n\n \n .mobile-layout[_ngcontent-%COMP%] .mj-grid[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .mj-grid-responsive[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] .card-content[_ngcontent-%COMP%] {\n height: auto !important;\n min-height: 0 !important;\n }\n}\n\n@media (min-width: 1440px) {\n .content-area[_ngcontent-%COMP%] {\n padding: 2.5rem 3rem;\n }\n\n .side-navigation[_ngcontent-%COMP%] {\n width: 280px;\n }\n}\n\n\n\n\n@media (max-width: 768px) {\n \n body[_ngcontent-%COMP%] {\n position: relative;\n overflow-y: visible;\n -webkit-overflow-scrolling: touch;\n }\n\n \n .mobile-layout[_ngcontent-%COMP%], \n .mobile-layout[_ngcontent-%COMP%] > *[_ngcontent-%COMP%], \n .mobile-content[_ngcontent-%COMP%] > *[_ngcontent-%COMP%], \n .tab-content[_ngcontent-%COMP%] > *[_ngcontent-%COMP%] {\n -webkit-overflow-scrolling: touch;\n }\n\n \n .mobile-layout[_ngcontent-%COMP%] *[_ngcontent-%COMP%] {\n box-sizing: border-box;\n }\n}"] });
564
564
  };
565
565
  SettingsComponent = __decorate([
566
566
  RegisterClass(BaseNavigationComponent, 'Settings')