@memberjunction/ng-explorer-core 5.31.0 → 5.33.0

package/dist/lib/profile/profile-dialog.component.js

@@ -0,0 +1,722 @@
+import { Component, EventEmitter, Input, Output, ChangeDetectorRef, inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { UUIDsEqual } from '@memberjunction/global';
+import { UserInfoEngine } from '@memberjunction/core-entities';
+import { MJAuthBase } from '@memberjunction/ng-auth-services';
+import { BaseAngularComponent } from '@memberjunction/ng-base-types';
+import { ThemeService, SharedService } from '@memberjunction/ng-shared';
+import { ExplorerSettingsModule } from '@memberjunction/ng-explorer-settings';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-explorer-settings";
+const _forTrack0 = ($index, $item) => $item.label;
+const _forTrack1 = ($index, $item) => $item.key;
+const _forTrack2 = ($index, $item) => $item.id;
+function ProfileDialogComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "img", 44);
+    i0.ɵɵlistener("error", function ProfileDialogComponent_Conditional_8_Template_img_error_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnAvatarLoadError()); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("src", ctx_r1.AvatarUrl, i0.ɵɵsanitizeUrl);
+} }
+function ProfileDialogComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 8);
+    i0.ɵɵelement(1, "i");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.AvatarIconClass);
+} }
+function ProfileDialogComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.UserInitials);
+} }
+function ProfileDialogComponent_Conditional_18_For_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i");
+} if (rf & 2) {
+    const chip_r3 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵclassMap(chip_r3.icon);
+} }
+function ProfileDialogComponent_Conditional_18_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 46);
+    i0.ɵɵconditionalCreate(1, ProfileDialogComponent_Conditional_18_For_2_Conditional_1_Template, 1, 2, "i", 47);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const chip_r3 = ctx.$implicit;
+    i0.ɵɵclassMap("mj-profile__chip--" + chip_r3.tone);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(chip_r3.icon ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", chip_r3.label, " ");
+} }
+function ProfileDialogComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 15);
+    i0.ɵɵrepeaterCreate(1, ProfileDialogComponent_Conditional_18_For_2_Template, 3, 4, "span", 45, _forTrack0);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.RoleChips);
+} }
+function ProfileDialogComponent_Conditional_28_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 23);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" \u00B7 ", ctx_r1.MemberSince);
+} }
+function ProfileDialogComponent_Conditional_42_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 29);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1("", ctx_r1.UnreadCount, " unread");
+} }
+function ProfileDialogComponent_Conditional_43_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 30);
+    i0.ɵɵelement(1, "i", 48);
+    i0.ɵɵtext(2, " Loading\u2026 ");
+    i0.ɵɵelementEnd();
+} }
+function ProfileDialogComponent_Conditional_44_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 48);
+} }
+function ProfileDialogComponent_Conditional_44_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 55);
+    i0.ɵɵelement(1, "span", 56);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ch_r5 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵclassProp("mj-profile__switch--on", ch_r5.enabled);
+} }
+function ProfileDialogComponent_Conditional_44_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 50);
+    i0.ɵɵlistener("click", function ProfileDialogComponent_Conditional_44_For_2_Template_button_click_0_listener() { const ch_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleChannel(ch_r5)); });
+    i0.ɵɵelementStart(1, "div", 51);
+    i0.ɵɵelement(2, "i");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 52);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 53);
+    i0.ɵɵconditionalCreate(6, ProfileDialogComponent_Conditional_44_For_2_Conditional_6_Template, 1, 0, "i", 48)(7, ProfileDialogComponent_Conditional_44_For_2_Conditional_7_Template, 2, 2, "span", 54);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ch_r5 = ctx.$implicit;
+    i0.ɵɵclassProp("mj-profile__channel--on", ch_r5.enabled);
+    i0.ɵɵproperty("disabled", ch_r5.saving);
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassMap(ch_r5.icon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ch_r5.label);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ch_r5.saving ? 6 : 7);
+} }
+function ProfileDialogComponent_Conditional_44_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 31);
+    i0.ɵɵrepeaterCreate(1, ProfileDialogComponent_Conditional_44_For_2_Template, 8, 7, "button", 49, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.Channels);
+} }
+function ProfileDialogComponent_Conditional_59_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-user-profile-settings");
+} }
+function ProfileDialogComponent_Conditional_60_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 62);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const theme_r7 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(theme_r7.description);
+} }
+function ProfileDialogComponent_Conditional_60_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 63);
+} }
+function ProfileDialogComponent_Conditional_60_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 64);
+} }
+function ProfileDialogComponent_Conditional_60_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 58);
+    i0.ɵɵlistener("click", function ProfileDialogComponent_Conditional_60_For_2_Template_button_click_0_listener() { const theme_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.SelectTheme(theme_r7.id)); });
+    i0.ɵɵelementStart(1, "div", 59);
+    i0.ɵɵelement(2, "i");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 60)(4, "div", 61);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(6, ProfileDialogComponent_Conditional_60_For_2_Conditional_6_Template, 2, 1, "div", 62);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(7, ProfileDialogComponent_Conditional_60_For_2_Conditional_7_Template, 1, 0, "i", 63)(8, ProfileDialogComponent_Conditional_60_For_2_Conditional_8_Template, 1, 0, "i", 64);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const theme_r7 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("mj-profile__theme--active", theme_r7.id === ctx_r1.ThemePreference)("mj-profile__theme--saving", ctx_r1.SavingTheme === theme_r7.id);
+    i0.ɵɵproperty("disabled", !!ctx_r1.SavingTheme);
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap("mj-profile__theme-swatch--" + theme_r7.swatch);
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(theme_r7.icon);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(theme_r7.name);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(theme_r7.description ? 6 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.SavingTheme === theme_r7.id ? 7 : theme_r7.id === ctx_r1.ThemePreference ? 8 : -1);
+} }
+function ProfileDialogComponent_Conditional_60_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 43);
+    i0.ɵɵrepeaterCreate(1, ProfileDialogComponent_Conditional_60_For_2_Template, 9, 12, "button", 57, _forTrack2);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.ThemeOptions);
+} }
+/**
+ * "Identity Card" profile dialog with slide-in detail panels for editing
+ * profile photo and switching theme. Replaces the legacy multi-tab Settings
+ * dialog entirely. Brand-aligned with the About dialog.
+ */
+export class ProfileDialogComponent extends BaseAngularComponent {
+    CloseRequested = new EventEmitter();
+    AvatarUrl = null;
+    AvatarIconClass = null;
+    UserName = '';
+    UserEmail = '';
+    UserInitials = '?';
+    AccountType = '';
+    AccountStatus = '';
+    MemberSince = '';
+    ThemeLabel = '';
+    RoleChips = [];
+    LoadingNotifications = true;
+    Channels = [
+        { key: 'InApp', label: 'In-app', icon: 'fa-solid fa-bell', enabled: false, saving: false },
+        { key: 'Email', label: 'Email', icon: 'fa-solid fa-envelope', enabled: false, saving: false },
+        { key: 'SMS', label: 'SMS', icon: 'fa-solid fa-mobile', enabled: false, saving: false }
+    ];
+    UnreadCount = 0;
+    // Slide-in panel state
+    ActivePanel = 'none';
+    ThemeOptions = [];
+    ThemePreference = '';
+    SavingTheme = null;
+    get PanelTitle() {
+        switch (this.ActivePanel) {
+            case 'photo': return 'Profile photo';
+            case 'theme': return 'Theme';
+            default: return '';
+        }
+    }
+    authBase = inject(MJAuthBase);
+    themeService = inject(ThemeService);
+    sharedService = inject(SharedService);
+    cdr = inject(ChangeDetectorRef);
+    themeSub;
+    ngOnInit() {
+        this.populateIdentity();
+        this.populateThemeOptions();
+        this.loadNotifications();
+        this.themeSub = this.themeService.Preference$.subscribe(pref => {
+            this.ThemePreference = pref;
+            this.ThemeLabel = this.computeThemeLabel();
+            this.cdr.markForCheck();
+        });
+    }
+    ngOnDestroy() {
+        this.themeSub?.unsubscribe();
+    }
+    OnCloseClick() {
+        if (this.ActivePanel !== 'none') {
+            this.ClosePanel();
+            return;
+        }
+        this.CloseRequested.emit();
+    }
+    OnAvatarLoadError() {
+        this.AvatarUrl = null;
+        this.cdr.markForCheck();
+    }
+    OpenPanel(panel) {
+        this.ActivePanel = panel;
+    }
+    ClosePanel() {
+        this.ActivePanel = 'none';
+    }
+    async OnSignOut() {
+        try {
+            localStorage.removeItem('auth');
+            localStorage.removeItem('claims');
+            await this.authBase.logout();
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : 'Unknown error';
+            this.sharedService.CreateSimpleNotification(`Sign out failed: ${msg}`, 'error', 3000);
+        }
+    }
+    async SelectTheme(themeId) {
+        if (this.SavingTheme)
+            return;
+        if (themeId === this.ThemePreference)
+            return;
+        this.SavingTheme = themeId;
+        this.cdr.markForCheck();
+        try {
+            await this.themeService.SetTheme(themeId);
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : 'Unknown error';
+            this.sharedService.CreateSimpleNotification(`Theme change failed: ${msg}`, 'error', 3000);
+        }
+        finally {
+            this.SavingTheme = null;
+            this.cdr.markForCheck();
+        }
+    }
+    async ToggleChannel(channel) {
+        if (channel.saving)
+            return;
+        const newState = !channel.enabled;
+        channel.saving = true;
+        this.cdr.markForCheck();
+        const provider = this.ProviderToUse;
+        const currentUser = provider?.CurrentUser;
+        if (!provider || !currentUser) {
+            channel.saving = false;
+            return;
+        }
+        try {
+            const transGroup = await provider.CreateTransactionGroup();
+            const types = UserInfoEngine.Instance.NotificationTypes;
+            const preferences = UserInfoEngine.Instance.NotificationPreferences;
+            for (const type of types) {
+                if (type.AllowUserPreference === false)
+                    continue;
+                let pref = preferences.find(p => UUIDsEqual(p.NotificationTypeID, type.ID));
+                if (!pref) {
+                    pref = await provider.GetEntityObject('MJ: User Notification Preferences');
+                    pref.UserID = currentUser.ID;
+                    pref.NotificationTypeID = type.ID;
+                    pref.InAppEnabled = type.DefaultInApp ?? true;
+                    pref.EmailEnabled = type.DefaultEmail ?? false;
+                    pref.SMSEnabled = type.DefaultSMS ?? false;
+                }
+                if (channel.key === 'InApp')
+                    pref.InAppEnabled = newState;
+                else if (channel.key === 'Email')
+                    pref.EmailEnabled = newState;
+                else
+                    pref.SMSEnabled = newState;
+                pref.Enabled = pref.InAppEnabled || pref.EmailEnabled || pref.SMSEnabled;
+                pref.TransactionGroup = transGroup;
+                pref.Save();
+            }
+            const success = await transGroup.Submit();
+            if (success) {
+                channel.enabled = newState;
+                this.sharedService.CreateSimpleNotification(`${channel.label} notifications ${newState ? 'enabled' : 'disabled'}`, 'success', 2000);
+            }
+            else {
+                throw new Error('Save failed');
+            }
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : 'Unknown error';
+            this.sharedService.CreateSimpleNotification(`Update failed: ${msg}`, 'error', 3000);
+            await this.loadNotifications();
+        }
+        finally {
+            channel.saving = false;
+            this.cdr.markForCheck();
+        }
+    }
+    // ---------- private helpers ----------
+    populateIdentity() {
+        const provider = this.ProviderToUse;
+        const user = provider?.CurrentUser;
+        if (user) {
+            const name = user.Name || `${user.FirstName ?? ''} ${user.LastName ?? ''}`.trim();
+            this.UserName = name || 'User';
+            this.UserEmail = user.Email || '';
+            this.UserInitials = this.computeInitials(this.UserName);
+            this.AccountType = user.Type || 'User';
+            this.AccountStatus = user.IsActive ? 'Active' : 'Inactive';
+            this.MemberSince = this.formatMemberSince(user.__mj_CreatedAt);
+            this.RoleChips = this.computeRoleChips(user.UserRoles);
+        }
+        this.ThemePreference = this.themeService.Preference;
+        this.ThemeLabel = this.computeThemeLabel();
+    }
+    populateThemeOptions() {
+        const themes = this.themeService.AvailableThemes ?? [];
+        this.ThemeOptions = themes.map(t => ({
+            id: t.Id,
+            name: t.Name,
+            description: t.Description ?? (t.BaseTheme === 'dark' ? 'Dark interface' : 'Light interface'),
+            icon: t.BaseTheme === 'dark' ? 'fa-solid fa-moon' : 'fa-solid fa-sun',
+            swatch: t.BaseTheme
+        }));
+        this.ThemeOptions.push({
+            id: 'system',
+            name: 'System',
+            description: 'Follow your operating system',
+            icon: 'fa-solid fa-desktop',
+            swatch: 'system'
+        });
+    }
+    async loadNotifications() {
+        this.LoadingNotifications = true;
+        try {
+            this.UnreadCount = UserInfoEngine.Instance.UnreadNotificationCount ?? 0;
+            const preferences = UserInfoEngine.Instance.NotificationPreferences;
+            const types = UserInfoEngine.Instance.NotificationTypes;
+            let inApp, email, sms;
+            if (preferences.length === 0 && types.length > 0) {
+                inApp = types.some(t => t.DefaultInApp ?? true);
+                email = types.some(t => t.DefaultEmail ?? false);
+                sms = types.some(t => t.DefaultSMS ?? false);
+            }
+            else {
+                inApp = preferences.some(p => p.InAppEnabled);
+                email = preferences.some(p => p.EmailEnabled);
+                sms = preferences.some(p => p.SMSEnabled);
+            }
+            this.Channels[0].enabled = inApp;
+            this.Channels[1].enabled = email;
+            this.Channels[2].enabled = sms;
+        }
+        catch {
+            // non-fatal; leave defaults
+        }
+        finally {
+            this.LoadingNotifications = false;
+            this.cdr.markForCheck();
+        }
+    }
+    computeInitials(name) {
+        const parts = name.trim().split(/\s+/).filter(Boolean);
+        if (parts.length === 0)
+            return '?';
+        if (parts.length === 1)
+            return parts[0].slice(0, 2).toUpperCase();
+        return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
+    }
+    computeRoleChips(roles) {
+        if (!roles || roles.length === 0)
+            return [];
+        return roles
+            .map(r => r.Role)
+            .filter((n) => !!n)
+            .map(roleName => {
+            const lower = roleName.toLowerCase();
+            if (lower.includes('admin'))
+                return { label: roleName, tone: 'admin', icon: 'fa-solid fa-shield' };
+            if (lower.includes('developer') || lower.includes('integration'))
+                return { label: roleName, tone: 'dev', icon: 'fa-solid fa-code' };
+            return { label: roleName, tone: '', icon: null };
+        });
+    }
+    formatMemberSince(date) {
+        if (!date)
+            return '';
+        const d = date instanceof Date ? date : new Date(date);
+        if (isNaN(d.getTime()))
+            return '';
+        return d.toLocaleDateString(undefined, { month: 'short', year: 'numeric' });
+    }
+    computeThemeLabel() {
+        const applied = this.themeService.AppliedTheme;
+        const preference = this.themeService.Preference;
+        const def = this.themeService.GetThemeDefinition(applied);
+        const themeName = def?.Name ?? applied;
+        return preference === 'system' ? `${themeName} · System` : themeName;
+    }
+    static ɵfac = /*@__PURE__*/ (() => { let ɵProfileDialogComponent_BaseFactory; return function ProfileDialogComponent_Factory(__ngFactoryType__) { return (ɵProfileDialogComponent_BaseFactory || (ɵProfileDialogComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ProfileDialogComponent)))(__ngFactoryType__ || ProfileDialogComponent); }; })();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ProfileDialogComponent, selectors: [["mj-profile-dialog"]], inputs: { AvatarUrl: "AvatarUrl", AvatarIconClass: "AvatarIconClass" }, outputs: { CloseRequested: "CloseRequested" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 61, vars: 16, consts: [["role", "document", 1, "mj-profile"], ["type", "button", "aria-label", "Close", 1, "mj-profile__close", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "mj-profile__main"], [1, "mj-profile__hero"], [1, "mj-profile__hero-title"], [1, "mj-profile__avatar-zone"], ["alt", "", 1, "mj-profile__avatar", "mj-profile__avatar--img", 3, "src"], [1, "mj-profile__avatar", "mj-profile__avatar--icon"], [1, "mj-profile__avatar"], ["type", "button", "title", "Change photo", 1, "mj-profile__avatar-edit", 3, "click"], [1, "fa-solid", "fa-camera"], [1, "mj-profile__identity"], [1, "mj-profile__name"], [1, "mj-profile__email"], [1, "mj-profile__chips"], [1, "mj-profile__field-list"], [1, "mj-profile__field"], [1, "mj-profile__field-icon"], [1, "fa-solid", "fa-id-badge"], [1, "mj-profile__field-body"], [1, "mj-profile__field-label"], [1, "mj-profile__field-value"], [1, "mj-profile__field-muted"], ["type", "button", 1, "mj-profile__field", "mj-profile__field--button", 3, "click"], [1, "fa-solid", "fa-palette"], [1, "fa-solid", "fa-chevron-right", "mj-profile__field-chev"], [1, "mj-profile__section"], [1, "mj-profile__section-head"], [1, "mj-profile__unread"], [1, "mj-profile__channels-loading"], [1, "mj-profile__channels"], [1, "mj-profile__footer"], ["type", "button", 1, "mj-profile__btn", "mj-profile__btn--danger", 3, "click"], [1, "fa-solid", "fa-arrow-right-from-bracket"], [1, "mj-profile__spacer"], ["type", "button", 1, "mj-profile__btn", "mj-profile__btn--primary", 3, "click"], [1, "mj-profile__panel"], [1, "mj-profile__panel-header"], ["type", "button", "aria-label", "Back", 1, "mj-profile__panel-back", 3, "click"], [1, "fa-solid", "fa-arrow-left"], [1, "mj-profile__panel-title"], [1, "mj-profile__panel-body"], [1, "mj-profile__themes"], ["alt", "", 1, "mj-profile__avatar", "mj-profile__avatar--img", 3, "error", "src"], [1, "mj-profile__chip", 3, "class"], [1, "mj-profile__chip"], [3, "class"], [1, "fa-solid", "fa-spinner", "fa-spin"], ["type", "button", 1, "mj-profile__channel", 3, "mj-profile__channel--on", "disabled"], ["type", "button", 1, "mj-profile__channel", 3, "click", "disabled"], [1, "mj-profile__channel-icon"], [1, "mj-profile__channel-label"], [1, "mj-profile__channel-state"], [1, "mj-profile__switch", 3, "mj-profile__switch--on"], [1, "mj-profile__switch"], [1, "mj-profile__switch-knob"], ["type", "button", 1, "mj-profile__theme", 3, "mj-profile__theme--active", "mj-profile__theme--saving", "disabled"], ["type", "button", 1, "mj-profile__theme", 3, "click", "disabled"], [1, "mj-profile__theme-swatch"], [1, "mj-profile__theme-info"], [1, "mj-profile__theme-name"], [1, "mj-profile__theme-desc"], [1, "fa-solid", "fa-spinner", "fa-spin", "mj-profile__theme-check"], [1, "fa-solid", "fa-check", "mj-profile__theme-check"]], template: function ProfileDialogComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "button", 1);
+            i0.ɵɵlistener("click", function ProfileDialogComponent_Template_button_click_1_listener() { return ctx.OnCloseClick(); });
+            i0.ɵɵelement(2, "i", 2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "div", 3)(4, "div", 4)(5, "h3", 5);
+            i0.ɵɵtext(6, "My Profile");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(7, "div", 6);
+            i0.ɵɵconditionalCreate(8, ProfileDialogComponent_Conditional_8_Template, 1, 1, "img", 7)(9, ProfileDialogComponent_Conditional_9_Template, 2, 2, "div", 8)(10, ProfileDialogComponent_Conditional_10_Template, 2, 1, "div", 9);
+            i0.ɵɵelementStart(11, "button", 10);
+            i0.ɵɵlistener("click", function ProfileDialogComponent_Template_button_click_11_listener() { return ctx.OpenPanel("photo"); });
+            i0.ɵɵelement(12, "i", 11);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(13, "div", 12)(14, "h2", 13);
+            i0.ɵɵtext(15);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(16, "p", 14);
+            i0.ɵɵtext(17);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(18, ProfileDialogComponent_Conditional_18_Template, 3, 0, "div", 15);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(19, "div", 16)(20, "div", 17)(21, "div", 18);
+            i0.ɵɵelement(22, "i", 19);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(23, "div", 20)(24, "div", 21);
+            i0.ɵɵtext(25, "Account");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(26, "div", 22);
+            i0.ɵɵtext(27);
+            i0.ɵɵconditionalCreate(28, ProfileDialogComponent_Conditional_28_Template, 2, 1, "span", 23);
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(29, "button", 24);
+            i0.ɵɵlistener("click", function ProfileDialogComponent_Template_button_click_29_listener() { return ctx.OpenPanel("theme"); });
+            i0.ɵɵelementStart(30, "div", 18);
+            i0.ɵɵelement(31, "i", 25);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(32, "div", 20)(33, "div", 21);
+            i0.ɵɵtext(34, "Theme");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(35, "div", 22);
+            i0.ɵɵtext(36);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelement(37, "i", 26);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(38, "div", 27)(39, "div", 28)(40, "h4");
+            i0.ɵɵtext(41, "Notifications");
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(42, ProfileDialogComponent_Conditional_42_Template, 2, 1, "span", 29);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(43, ProfileDialogComponent_Conditional_43_Template, 3, 0, "div", 30)(44, ProfileDialogComponent_Conditional_44_Template, 3, 0, "div", 31);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(45, "div", 32)(46, "button", 33);
+            i0.ɵɵlistener("click", function ProfileDialogComponent_Template_button_click_46_listener() { return ctx.OnSignOut(); });
+            i0.ɵɵelement(47, "i", 34);
+            i0.ɵɵtext(48, " Sign out ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelement(49, "span", 35);
+            i0.ɵɵelementStart(50, "button", 36);
+            i0.ɵɵlistener("click", function ProfileDialogComponent_Template_button_click_50_listener() { return ctx.OnCloseClick(); });
+            i0.ɵɵtext(51, " Done ");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(52, "div", 37)(53, "div", 38)(54, "button", 39);
+            i0.ɵɵlistener("click", function ProfileDialogComponent_Template_button_click_54_listener() { return ctx.ClosePanel(); });
+            i0.ɵɵelement(55, "i", 40);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(56, "h3", 41);
+            i0.ɵɵtext(57);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(58, "div", 42);
+            i0.ɵɵconditionalCreate(59, ProfileDialogComponent_Conditional_59_Template, 1, 0, "mj-user-profile-settings")(60, ProfileDialogComponent_Conditional_60_Template, 3, 0, "div", 43);
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            i0.ɵɵclassProp("mj-profile--panel-open", ctx.ActivePanel !== "none");
+            i0.ɵɵadvance(8);
+            i0.ɵɵconditional(ctx.AvatarUrl ? 8 : ctx.AvatarIconClass ? 9 : 10);
+            i0.ɵɵadvance(7);
+            i0.ɵɵtextInterpolate(ctx.UserName);
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.UserEmail);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.RoleChips.length > 0 ? 18 : -1);
+            i0.ɵɵadvance(9);
+            i0.ɵɵtextInterpolate2(" ", ctx.AccountType, " \u00B7 ", ctx.AccountStatus, " ");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.MemberSince ? 28 : -1);
+            i0.ɵɵadvance(8);
+            i0.ɵɵtextInterpolate(ctx.ThemeLabel);
+            i0.ɵɵadvance(6);
+            i0.ɵɵconditional(ctx.UnreadCount > 0 ? 42 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.LoadingNotifications ? 43 : 44);
+            i0.ɵɵadvance(9);
+            i0.ɵɵclassProp("mj-profile__panel--open", ctx.ActivePanel !== "none");
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.PanelTitle);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.ActivePanel === "photo" ? 59 : ctx.ActivePanel === "theme" ? 60 : -1);
+        } }, dependencies: [CommonModule, ExplorerSettingsModule, i1.UserProfileSettingsComponent], styles: ["[_nghost-%COMP%] {\n    display: block;\n    width: 100%;\n    height: 100%;\n}\n.mj-profile[_ngcontent-%COMP%] {\n    display: block;\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    height: 100%;\n    min-height: 0;\n    position: relative;\n    font-family: inherit;\n    overflow: hidden;\n}\n.mj-profile__close[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 12px; right: 12px;\n    width: 36px; height: 36px;\n    border: none; border-radius: 8px;\n    background: rgba(255, 255, 255, 0.18);\n    backdrop-filter: blur(8px);\n    color: #fff;\n    cursor: pointer;\n    font-size: 16px;\n    display: flex; align-items: center; justify-content: center;\n    transition: background 0.15s, opacity 0.2s;\n    z-index: 4;\n}\n.mj-profile__close[_ngcontent-%COMP%]:hover { background: rgba(255, 255, 255, 0.3); }\n.mj-profile--panel-open[_ngcontent-%COMP%]   .mj-profile__close[_ngcontent-%COMP%] { opacity: 0; pointer-events: none; }\n\n\n\n.mj-profile__main[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.mj-profile--panel-open[_ngcontent-%COMP%]   .mj-profile__main[_ngcontent-%COMP%] {\n    transform: translateX(-12%);\n    pointer-events: none;\n}\n\n.mj-profile__hero[_ngcontent-%COMP%] {\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    padding: 22px 24px 56px;\n    position: relative;\n    overflow: hidden;\n    flex-shrink: 0;\n}\n.mj-profile__hero[_ngcontent-%COMP%]::before {\n    content: '';\n    position: absolute;\n    inset: -50%;\n    background: radial-gradient(circle, rgba(255, 255, 255, 0.10) 0%, transparent 60%);\n    animation: _ngcontent-%COMP%_mj-profile-rotate 24s linear infinite;\n    pointer-events: none;\n}\n@media (prefers-reduced-motion: reduce) {\n    .mj-profile__hero[_ngcontent-%COMP%]::before { animation: none; }\n}\n@keyframes _ngcontent-%COMP%_mj-profile-rotate { to { transform: rotate(360deg); } }\n\n.mj-profile__hero-title[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 12px;\n    font-weight: 700;\n    text-transform: uppercase;\n    letter-spacing: 1.2px;\n    opacity: 0.85;\n    position: relative;\n    z-index: 1;\n}\n\n.mj-profile__avatar-zone[_ngcontent-%COMP%] {\n    position: relative;\n    width: 96px;\n    height: 96px;\n    margin: -48px auto 12px;\n    z-index: 2;\n}\n.mj-profile__avatar[_ngcontent-%COMP%] {\n    width: 96px;\n    height: 96px;\n    border-radius: 50%;\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 32px;\n    font-weight: 700;\n    border: 4px solid var(--mj-bg-surface);\n    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);\n    object-fit: cover;\n    overflow: hidden;\n}\nimg.mj-profile__avatar[_ngcontent-%COMP%] { background: var(--mj-bg-surface-card); }\n.mj-profile__avatar--icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 36px; }\n\n.mj-profile__avatar-edit[_ngcontent-%COMP%] {\n    position: absolute;\n    bottom: 2px; right: 2px;\n    width: 30px; height: 30px;\n    border-radius: 50%;\n    background: var(--mj-bg-surface);\n    color: var(--mj-brand-primary);\n    border: 2px solid var(--mj-bg-surface);\n    cursor: pointer;\n    display: flex; align-items: center; justify-content: center;\n    font-size: 12px;\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);\n    transition: transform 0.15s;\n}\n.mj-profile__avatar-edit[_ngcontent-%COMP%]:hover { transform: scale(1.1); }\n\n.mj-profile__identity[_ngcontent-%COMP%] {\n    text-align: center;\n    padding: 0 24px 16px;\n    flex-shrink: 0;\n}\n.mj-profile__name[_ngcontent-%COMP%] {\n    margin: 0 0 4px;\n    font-size: 22px;\n    font-weight: 700;\n    letter-spacing: -0.4px;\n    color: var(--mj-text-primary);\n}\n.mj-profile__email[_ngcontent-%COMP%] {\n    margin: 0 0 12px;\n    color: var(--mj-text-muted);\n    font-size: 13px;\n    word-break: break-all;\n}\n.mj-profile__chips[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n    justify-content: center;\n}\n.mj-profile__chip[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 3px 9px;\n    border-radius: 100px;\n    font-size: 11px;\n    font-weight: 600;\n    background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n    color: var(--mj-brand-primary);\n}\n.mj-profile__chip--admin[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, #f59e0b 14%, transparent);\n    color: #b45309;\n}\n.mj-profile__chip--dev[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, #10b981 14%, transparent);\n    color: #047857;\n}\n\n.mj-profile__field-list[_ngcontent-%COMP%] {\n    padding: 0 24px;\n    flex-shrink: 0;\n}\n.mj-profile__field[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    padding: 12px 0;\n    gap: 14px;\n    border-top: 1px solid var(--mj-border-subtle);\n    width: 100%;\n    text-align: left;\n    background: transparent;\n    border-left: none;\n    border-right: none;\n    border-bottom: none;\n    font-family: inherit;\n    color: inherit;\n}\n.mj-profile__field[_ngcontent-%COMP%]:first-child { border-top: none; }\n.mj-profile__field--button[_ngcontent-%COMP%] {\n    cursor: pointer;\n    transition: background 0.12s;\n    margin: 0 -8px;\n    padding-left: 8px;\n    padding-right: 8px;\n    border-radius: 8px;\n    border-top: none;\n}\n.mj-profile__field--button[_ngcontent-%COMP%]    + .mj-profile__field--button[_ngcontent-%COMP%] { margin-top: 0; }\n.mj-profile__field--button[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); }\n.mj-profile__field--button[_ngcontent-%COMP%]:hover   .mj-profile__field-chev[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n.mj-profile__field-icon[_ngcontent-%COMP%] {\n    width: 32px; height: 32px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 8px;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 12px;\n    flex-shrink: 0;\n}\n.mj-profile__field-body[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n.mj-profile__field-label[_ngcontent-%COMP%] {\n    font-size: 10.5px;\n    color: var(--mj-text-muted);\n    text-transform: uppercase;\n    font-weight: 600;\n    letter-spacing: 0.5px;\n}\n.mj-profile__field-value[_ngcontent-%COMP%] {\n    font-size: 13px;\n    color: var(--mj-text-primary);\n    margin-top: 2px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n.mj-profile__field-muted[_ngcontent-%COMP%] { color: var(--mj-text-muted); }\n.mj-profile__field-chev[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: 11px;\n    transition: color 0.15s;\n}\n\n.mj-profile__section[_ngcontent-%COMP%] {\n    padding: 16px 24px 8px;\n    flex: 1;\n    min-height: 0;\n    overflow-y: auto;\n}\n.mj-profile__section-head[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-bottom: 10px;\n}\n.mj-profile__section-head[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 11px;\n    font-weight: 700;\n    color: var(--mj-text-muted);\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n}\n.mj-profile__unread[_ngcontent-%COMP%] {\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--mj-brand-primary);\n    background: color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    padding: 2px 8px;\n    border-radius: 100px;\n}\n.mj-profile__channels-loading[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: 12.5px;\n    padding: 12px;\n    text-align: center;\n}\n.mj-profile__channels[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.mj-profile__channel[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 10px 14px;\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-subtle);\n    border-radius: 10px;\n    cursor: pointer;\n    transition: all 0.15s;\n    font-family: inherit;\n    text-align: left;\n    width: 100%;\n}\n.mj-profile__channel[_ngcontent-%COMP%]:hover:not(:disabled) {\n    border-color: var(--mj-border-default);\n    background: var(--mj-bg-surface-hover);\n}\n.mj-profile__channel[_ngcontent-%COMP%]:disabled { cursor: wait; opacity: 0.7; }\n.mj-profile__channel-icon[_ngcontent-%COMP%] {\n    width: 32px; height: 32px;\n    border-radius: 8px;\n    background: var(--mj-bg-surface-sunken);\n    color: var(--mj-text-secondary);\n    display: flex; align-items: center; justify-content: center;\n    font-size: 13px;\n    flex-shrink: 0;\n    transition: all 0.15s;\n}\n.mj-profile__channel--on[_ngcontent-%COMP%]   .mj-profile__channel-icon[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-brand-primary) 14%, transparent);\n    color: var(--mj-brand-primary);\n}\n.mj-profile__channel-label[_ngcontent-%COMP%] {\n    flex: 1;\n    font-size: 13.5px;\n    font-weight: 500;\n    color: var(--mj-text-primary);\n}\n.mj-profile__channel-state[_ngcontent-%COMP%] {\n    flex-shrink: 0;\n    color: var(--mj-text-muted);\n    font-size: 13px;\n    min-width: 36px;\n    display: flex; justify-content: flex-end; align-items: center;\n}\n\n.mj-profile__switch[_ngcontent-%COMP%] {\n    width: 36px;\n    height: 20px;\n    background: var(--mj-border-strong);\n    border-radius: 100px;\n    position: relative;\n    transition: background 0.2s;\n    display: inline-block;\n}\n.mj-profile__switch-knob[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 2px; left: 2px;\n    width: 16px; height: 16px;\n    background: white;\n    border-radius: 50%;\n    transition: transform 0.2s;\n    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);\n}\n.mj-profile__switch--on[_ngcontent-%COMP%] { background: var(--mj-brand-primary); }\n.mj-profile__switch--on[_ngcontent-%COMP%]   .mj-profile__switch-knob[_ngcontent-%COMP%] { transform: translateX(16px); }\n\n.mj-profile__footer[_ngcontent-%COMP%] {\n    border-top: 1px solid var(--mj-border-subtle);\n    padding: 14px 20px;\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    flex-shrink: 0;\n}\n.mj-profile__spacer[_ngcontent-%COMP%] { flex: 1; }\n.mj-profile__btn[_ngcontent-%COMP%] {\n    padding: 9px 16px;\n    border-radius: 8px;\n    border: 1px solid var(--mj-border-default);\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    cursor: pointer;\n    font-size: 13px;\n    font-weight: 500;\n    font-family: inherit;\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    transition: all 0.15s;\n}\n.mj-profile__btn[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); border-color: var(--mj-border-strong); }\n.mj-profile__btn--primary[_ngcontent-%COMP%] {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-brand-primary);\n}\n.mj-profile__btn--primary[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-brand-primary) 88%, black);\n    border-color: color-mix(in srgb, var(--mj-brand-primary) 88%, black);\n}\n.mj-profile__btn--danger[_ngcontent-%COMP%] {\n    color: var(--mj-status-error);\n    border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-border-default));\n}\n.mj-profile__btn--danger[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-status-error) 8%, transparent);\n    border-color: var(--mj-status-error);\n}\n\n\n\n.mj-profile__panel[_ngcontent-%COMP%] {\n    position: absolute;\n    inset: 0;\n    background: var(--mj-bg-surface);\n    transform: translateX(100%);\n    transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);\n    display: flex;\n    flex-direction: column;\n    z-index: 3;\n}\n.mj-profile__panel--open[_ngcontent-%COMP%] {\n    transform: translateX(0);\n    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.06);\n}\n.mj-profile__panel-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 14px 18px;\n    border-bottom: 1px solid var(--mj-border-subtle);\n    background: var(--mj-bg-surface-card);\n    flex-shrink: 0;\n}\n.mj-profile__panel-back[_ngcontent-%COMP%] {\n    width: 34px; height: 34px;\n    border-radius: 8px;\n    border: 1px solid var(--mj-border-default);\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    cursor: pointer;\n    display: flex; align-items: center; justify-content: center;\n    font-size: 13px;\n    transition: all 0.15s;\n    font-family: inherit;\n}\n.mj-profile__panel-back[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-brand-primary);\n    color: var(--mj-brand-primary);\n}\n.mj-profile__panel-title[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 15px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    letter-spacing: -0.2px;\n}\n.mj-profile__panel-body[_ngcontent-%COMP%] {\n    flex: 1;\n    min-height: 0;\n    overflow-y: auto;\n    padding: 16px 20px 20px;\n}\n\n\n\n.mj-profile__themes[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.mj-profile__theme[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 14px;\n    padding: 12px 14px;\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-subtle);\n    border-radius: 10px;\n    cursor: pointer;\n    transition: all 0.15s;\n    text-align: left;\n    width: 100%;\n    font-family: inherit;\n}\n.mj-profile__theme[_ngcontent-%COMP%]:hover:not(:disabled) {\n    border-color: var(--mj-brand-primary);\n    background: var(--mj-bg-surface-hover);\n}\n.mj-profile__theme[_ngcontent-%COMP%]:disabled { cursor: wait; opacity: 0.7; }\n.mj-profile__theme--active[_ngcontent-%COMP%] {\n    border-color: var(--mj-brand-primary);\n    background: color-mix(in srgb, var(--mj-brand-primary) 5%, var(--mj-bg-surface-card));\n}\n.mj-profile__theme-swatch[_ngcontent-%COMP%] {\n    width: 40px; height: 40px;\n    border-radius: 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 16px;\n    flex-shrink: 0;\n    border: 1px solid var(--mj-border-default);\n}\n.mj-profile__theme-swatch--light[_ngcontent-%COMP%] {\n    background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);\n    color: #f59e0b;\n}\n.mj-profile__theme-swatch--dark[_ngcontent-%COMP%] {\n    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);\n    color: #94a3b8;\n    border-color: #334155;\n}\n.mj-profile__theme-swatch--system[_ngcontent-%COMP%] {\n    background: linear-gradient(135deg, #ffffff 0%, #ffffff 49%, #1e293b 51%, #0f172a 100%);\n    color: var(--mj-text-secondary);\n}\n.mj-profile__theme-info[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n.mj-profile__theme-name[_ngcontent-%COMP%] {\n    font-size: 13.5px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n}\n.mj-profile__theme-desc[_ngcontent-%COMP%] {\n    font-size: 11.5px;\n    color: var(--mj-text-muted);\n    margin-top: 2px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n.mj-profile__theme-check[_ngcontent-%COMP%] {\n    color: var(--mj-brand-primary);\n    font-size: 14px;\n    flex-shrink: 0;\n}\n\n@media (max-width: 480px) {\n    .mj-profile__hero[_ngcontent-%COMP%] { padding: 20px 18px 48px; }\n    .mj-profile__avatar-zone[_ngcontent-%COMP%] { width: 88px; height: 88px; margin-top: -44px; }\n    .mj-profile__avatar[_ngcontent-%COMP%] { width: 88px; height: 88px; font-size: 28px; }\n    .mj-profile__name[_ngcontent-%COMP%] { font-size: 19px; }\n    .mj-profile__field-list[_ngcontent-%COMP%], \n   .mj-profile__section[_ngcontent-%COMP%] { padding-left: 18px; padding-right: 18px; }\n    .mj-profile__footer[_ngcontent-%COMP%] { padding: 12px 16px; }\n    .mj-profile--panel-open[_ngcontent-%COMP%]   .mj-profile__main[_ngcontent-%COMP%] { transform: translateX(-20%); }\n    .mj-profile__panel-body[_ngcontent-%COMP%] { padding: 14px 16px 16px; }\n}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ProfileDialogComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-profile-dialog', standalone: true, imports: [CommonModule, ExplorerSettingsModule], template: `
+<div class="mj-profile" [class.mj-profile--panel-open]="ActivePanel !== 'none'" role="document">
+    <button class="mj-profile__close" type="button" aria-label="Close" (click)="OnCloseClick()">
+        <i class="fa-solid fa-xmark"></i>
+    </button>
+
+    <!-- ===== MAIN VIEW ===== -->
+    <div class="mj-profile__main">
+        <div class="mj-profile__hero">
+            <h3 class="mj-profile__hero-title">My Profile</h3>
+        </div>
+
+        <div class="mj-profile__avatar-zone">
+            @if (AvatarUrl) {
+                <img class="mj-profile__avatar mj-profile__avatar--img"
+                     [src]="AvatarUrl" alt="" (error)="OnAvatarLoadError()" />
+            } @else if (AvatarIconClass) {
+                <div class="mj-profile__avatar mj-profile__avatar--icon">
+                    <i [class]="AvatarIconClass"></i>
+                </div>
+            } @else {
+                <div class="mj-profile__avatar">{{ UserInitials }}</div>
+            }
+            <button class="mj-profile__avatar-edit" type="button" title="Change photo"
+                    (click)="OpenPanel('photo')">
+                <i class="fa-solid fa-camera"></i>
+            </button>
+        </div>
+
+        <div class="mj-profile__identity">
+            <h2 class="mj-profile__name">{{ UserName }}</h2>
+            <p class="mj-profile__email">{{ UserEmail }}</p>
+            @if (RoleChips.length > 0) {
+                <div class="mj-profile__chips">
+                    @for (chip of RoleChips; track chip.label) {
+                        <span class="mj-profile__chip" [class]="'mj-profile__chip--' + chip.tone">
+                            @if (chip.icon) { <i [class]="chip.icon"></i> }
+                            {{ chip.label }}
+                        </span>
+                    }
+                </div>
+            }
+        </div>
+
+        <div class="mj-profile__field-list">
+            <div class="mj-profile__field">
+                <div class="mj-profile__field-icon"><i class="fa-solid fa-id-badge"></i></div>
+                <div class="mj-profile__field-body">
+                    <div class="mj-profile__field-label">Account</div>
+                    <div class="mj-profile__field-value">
+                        {{ AccountType }} · {{ AccountStatus }}
+                        @if (MemberSince) {
+                            <span class="mj-profile__field-muted"> · {{ MemberSince }}</span>
+                        }
+                    </div>
+                </div>
+            </div>
+
+            <button class="mj-profile__field mj-profile__field--button" type="button" (click)="OpenPanel('theme')">
+                <div class="mj-profile__field-icon"><i class="fa-solid fa-palette"></i></div>
+                <div class="mj-profile__field-body">
+                    <div class="mj-profile__field-label">Theme</div>
+                    <div class="mj-profile__field-value">{{ ThemeLabel }}</div>
+                </div>
+                <i class="fa-solid fa-chevron-right mj-profile__field-chev"></i>
+            </button>
+        </div>
+
+        <div class="mj-profile__section">
+            <div class="mj-profile__section-head">
+                <h4>Notifications</h4>
+                @if (UnreadCount > 0) {
+                    <span class="mj-profile__unread">{{ UnreadCount }} unread</span>
+                }
+            </div>
+            @if (LoadingNotifications) {
+                <div class="mj-profile__channels-loading">
+                    <i class="fa-solid fa-spinner fa-spin"></i> Loading…
+                </div>
+            } @else {
+                <div class="mj-profile__channels">
+                    @for (ch of Channels; track ch.key) {
+                        <button type="button"
+                                class="mj-profile__channel"
+                                [class.mj-profile__channel--on]="ch.enabled"
+                                [disabled]="ch.saving"
+                                (click)="ToggleChannel(ch)">
+                            <div class="mj-profile__channel-icon"><i [class]="ch.icon"></i></div>
+                            <div class="mj-profile__channel-label">{{ ch.label }}</div>
+                            <div class="mj-profile__channel-state">
+                                @if (ch.saving) {
+                                    <i class="fa-solid fa-spinner fa-spin"></i>
+                                } @else {
+                                    <span class="mj-profile__switch" [class.mj-profile__switch--on]="ch.enabled">
+                                        <span class="mj-profile__switch-knob"></span>
+                                    </span>
+                                }
+                            </div>
+                        </button>
+                    }
+                </div>
+            }
+        </div>
+
+        <div class="mj-profile__footer">
+            <button class="mj-profile__btn mj-profile__btn--danger" type="button" (click)="OnSignOut()">
+                <i class="fa-solid fa-arrow-right-from-bracket"></i>
+                Sign out
+            </button>
+            <span class="mj-profile__spacer"></span>
+            <button class="mj-profile__btn mj-profile__btn--primary" type="button" (click)="OnCloseClick()">
+                Done
+            </button>
+        </div>
+    </div>
+
+    <!-- ===== SLIDE-IN PANEL ===== -->
+    <div class="mj-profile__panel" [class.mj-profile__panel--open]="ActivePanel !== 'none'">
+        <div class="mj-profile__panel-header">
+            <button class="mj-profile__panel-back" type="button" aria-label="Back" (click)="ClosePanel()">
+                <i class="fa-solid fa-arrow-left"></i>
+            </button>
+            <h3 class="mj-profile__panel-title">{{ PanelTitle }}</h3>
+        </div>
+        <div class="mj-profile__panel-body">
+            @if (ActivePanel === 'photo') {
+                <mj-user-profile-settings></mj-user-profile-settings>
+            } @else if (ActivePanel === 'theme') {
+                <div class="mj-profile__themes">
+                    @for (theme of ThemeOptions; track theme.id) {
+                        <button type="button"
+                                class="mj-profile__theme"
+                                [class.mj-profile__theme--active]="theme.id === ThemePreference"
+                                [class.mj-profile__theme--saving]="SavingTheme === theme.id"
+                                [disabled]="!!SavingTheme"
+                                (click)="SelectTheme(theme.id)">
+                            <div class="mj-profile__theme-swatch" [class]="'mj-profile__theme-swatch--' + theme.swatch">
+                                <i [class]="theme.icon"></i>
+                            </div>
+                            <div class="mj-profile__theme-info">
+                                <div class="mj-profile__theme-name">{{ theme.name }}</div>
+                                @if (theme.description) {
+                                    <div class="mj-profile__theme-desc">{{ theme.description }}</div>
+                                }
+                            </div>
+                            @if (SavingTheme === theme.id) {
+                                <i class="fa-solid fa-spinner fa-spin mj-profile__theme-check"></i>
+                            } @else if (theme.id === ThemePreference) {
+                                <i class="fa-solid fa-check mj-profile__theme-check"></i>
+                            }
+                        </button>
+                    }
+                </div>
+            }
+        </div>
+    </div>
+</div>
+    `, styles: ["\n:host {\n    display: block;\n    width: 100%;\n    height: 100%;\n}\n.mj-profile {\n    display: block;\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    height: 100%;\n    min-height: 0;\n    position: relative;\n    font-family: inherit;\n    overflow: hidden;\n}\n.mj-profile__close {\n    position: absolute;\n    top: 12px; right: 12px;\n    width: 36px; height: 36px;\n    border: none; border-radius: 8px;\n    background: rgba(255, 255, 255, 0.18);\n    backdrop-filter: blur(8px);\n    color: #fff;\n    cursor: pointer;\n    font-size: 16px;\n    display: flex; align-items: center; justify-content: center;\n    transition: background 0.15s, opacity 0.2s;\n    z-index: 4;\n}\n.mj-profile__close:hover { background: rgba(255, 255, 255, 0.3); }\n.mj-profile--panel-open .mj-profile__close { opacity: 0; pointer-events: none; }\n\n/* ============ MAIN VIEW ============ */\n.mj-profile__main {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.mj-profile--panel-open .mj-profile__main {\n    transform: translateX(-12%);\n    pointer-events: none;\n}\n\n.mj-profile__hero {\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    padding: 22px 24px 56px;\n    position: relative;\n    overflow: hidden;\n    flex-shrink: 0;\n}\n.mj-profile__hero::before {\n    content: '';\n    position: absolute;\n    inset: -50%;\n    background: radial-gradient(circle, rgba(255, 255, 255, 0.10) 0%, transparent 60%);\n    animation: mj-profile-rotate 24s linear infinite;\n    pointer-events: none;\n}\n@media (prefers-reduced-motion: reduce) {\n    .mj-profile__hero::before { animation: none; }\n}\n@keyframes mj-profile-rotate { to { transform: rotate(360deg); } }\n\n.mj-profile__hero-title {\n    margin: 0;\n    font-size: 12px;\n    font-weight: 700;\n    text-transform: uppercase;\n    letter-spacing: 1.2px;\n    opacity: 0.85;\n    position: relative;\n    z-index: 1;\n}\n\n.mj-profile__avatar-zone {\n    position: relative;\n    width: 96px;\n    height: 96px;\n    margin: -48px auto 12px;\n    z-index: 2;\n}\n.mj-profile__avatar {\n    width: 96px;\n    height: 96px;\n    border-radius: 50%;\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 32px;\n    font-weight: 700;\n    border: 4px solid var(--mj-bg-surface);\n    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);\n    object-fit: cover;\n    overflow: hidden;\n}\nimg.mj-profile__avatar { background: var(--mj-bg-surface-card); }\n.mj-profile__avatar--icon i { font-size: 36px; }\n\n.mj-profile__avatar-edit {\n    position: absolute;\n    bottom: 2px; right: 2px;\n    width: 30px; height: 30px;\n    border-radius: 50%;\n    background: var(--mj-bg-surface);\n    color: var(--mj-brand-primary);\n    border: 2px solid var(--mj-bg-surface);\n    cursor: pointer;\n    display: flex; align-items: center; justify-content: center;\n    font-size: 12px;\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);\n    transition: transform 0.15s;\n}\n.mj-profile__avatar-edit:hover { transform: scale(1.1); }\n\n.mj-profile__identity {\n    text-align: center;\n    padding: 0 24px 16px;\n    flex-shrink: 0;\n}\n.mj-profile__name {\n    margin: 0 0 4px;\n    font-size: 22px;\n    font-weight: 700;\n    letter-spacing: -0.4px;\n    color: var(--mj-text-primary);\n}\n.mj-profile__email {\n    margin: 0 0 12px;\n    color: var(--mj-text-muted);\n    font-size: 13px;\n    word-break: break-all;\n}\n.mj-profile__chips {\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n    justify-content: center;\n}\n.mj-profile__chip {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 3px 9px;\n    border-radius: 100px;\n    font-size: 11px;\n    font-weight: 600;\n    background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n    color: var(--mj-brand-primary);\n}\n.mj-profile__chip--admin {\n    background: color-mix(in srgb, #f59e0b 14%, transparent);\n    color: #b45309;\n}\n.mj-profile__chip--dev {\n    background: color-mix(in srgb, #10b981 14%, transparent);\n    color: #047857;\n}\n\n.mj-profile__field-list {\n    padding: 0 24px;\n    flex-shrink: 0;\n}\n.mj-profile__field {\n    display: flex;\n    align-items: center;\n    padding: 12px 0;\n    gap: 14px;\n    border-top: 1px solid var(--mj-border-subtle);\n    width: 100%;\n    text-align: left;\n    background: transparent;\n    border-left: none;\n    border-right: none;\n    border-bottom: none;\n    font-family: inherit;\n    color: inherit;\n}\n.mj-profile__field:first-child { border-top: none; }\n.mj-profile__field--button {\n    cursor: pointer;\n    transition: background 0.12s;\n    margin: 0 -8px;\n    padding-left: 8px;\n    padding-right: 8px;\n    border-radius: 8px;\n    border-top: none;\n}\n.mj-profile__field--button + .mj-profile__field--button { margin-top: 0; }\n.mj-profile__field--button:hover { background: var(--mj-bg-surface-hover); }\n.mj-profile__field--button:hover .mj-profile__field-chev { color: var(--mj-brand-primary); }\n.mj-profile__field-icon {\n    width: 32px; height: 32px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 8px;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 12px;\n    flex-shrink: 0;\n}\n.mj-profile__field-body { flex: 1; min-width: 0; }\n.mj-profile__field-label {\n    font-size: 10.5px;\n    color: var(--mj-text-muted);\n    text-transform: uppercase;\n    font-weight: 600;\n    letter-spacing: 0.5px;\n}\n.mj-profile__field-value {\n    font-size: 13px;\n    color: var(--mj-text-primary);\n    margin-top: 2px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n.mj-profile__field-muted { color: var(--mj-text-muted); }\n.mj-profile__field-chev {\n    color: var(--mj-text-muted);\n    font-size: 11px;\n    transition: color 0.15s;\n}\n\n.mj-profile__section {\n    padding: 16px 24px 8px;\n    flex: 1;\n    min-height: 0;\n    overflow-y: auto;\n}\n.mj-profile__section-head {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-bottom: 10px;\n}\n.mj-profile__section-head h4 {\n    margin: 0;\n    font-size: 11px;\n    font-weight: 700;\n    color: var(--mj-text-muted);\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n}\n.mj-profile__unread {\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--mj-brand-primary);\n    background: color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    padding: 2px 8px;\n    border-radius: 100px;\n}\n.mj-profile__channels-loading {\n    color: var(--mj-text-muted);\n    font-size: 12.5px;\n    padding: 12px;\n    text-align: center;\n}\n.mj-profile__channels {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.mj-profile__channel {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 10px 14px;\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-subtle);\n    border-radius: 10px;\n    cursor: pointer;\n    transition: all 0.15s;\n    font-family: inherit;\n    text-align: left;\n    width: 100%;\n}\n.mj-profile__channel:hover:not(:disabled) {\n    border-color: var(--mj-border-default);\n    background: var(--mj-bg-surface-hover);\n}\n.mj-profile__channel:disabled { cursor: wait; opacity: 0.7; }\n.mj-profile__channel-icon {\n    width: 32px; height: 32px;\n    border-radius: 8px;\n    background: var(--mj-bg-surface-sunken);\n    color: var(--mj-text-secondary);\n    display: flex; align-items: center; justify-content: center;\n    font-size: 13px;\n    flex-shrink: 0;\n    transition: all 0.15s;\n}\n.mj-profile__channel--on .mj-profile__channel-icon {\n    background: color-mix(in srgb, var(--mj-brand-primary) 14%, transparent);\n    color: var(--mj-brand-primary);\n}\n.mj-profile__channel-label {\n    flex: 1;\n    font-size: 13.5px;\n    font-weight: 500;\n    color: var(--mj-text-primary);\n}\n.mj-profile__channel-state {\n    flex-shrink: 0;\n    color: var(--mj-text-muted);\n    font-size: 13px;\n    min-width: 36px;\n    display: flex; justify-content: flex-end; align-items: center;\n}\n\n.mj-profile__switch {\n    width: 36px;\n    height: 20px;\n    background: var(--mj-border-strong);\n    border-radius: 100px;\n    position: relative;\n    transition: background 0.2s;\n    display: inline-block;\n}\n.mj-profile__switch-knob {\n    position: absolute;\n    top: 2px; left: 2px;\n    width: 16px; height: 16px;\n    background: white;\n    border-radius: 50%;\n    transition: transform 0.2s;\n    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);\n}\n.mj-profile__switch--on { background: var(--mj-brand-primary); }\n.mj-profile__switch--on .mj-profile__switch-knob { transform: translateX(16px); }\n\n.mj-profile__footer {\n    border-top: 1px solid var(--mj-border-subtle);\n    padding: 14px 20px;\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    flex-shrink: 0;\n}\n.mj-profile__spacer { flex: 1; }\n.mj-profile__btn {\n    padding: 9px 16px;\n    border-radius: 8px;\n    border: 1px solid var(--mj-border-default);\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    cursor: pointer;\n    font-size: 13px;\n    font-weight: 500;\n    font-family: inherit;\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    transition: all 0.15s;\n}\n.mj-profile__btn:hover { background: var(--mj-bg-surface-hover); border-color: var(--mj-border-strong); }\n.mj-profile__btn--primary {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-brand-primary);\n}\n.mj-profile__btn--primary:hover {\n    background: color-mix(in srgb, var(--mj-brand-primary) 88%, black);\n    border-color: color-mix(in srgb, var(--mj-brand-primary) 88%, black);\n}\n.mj-profile__btn--danger {\n    color: var(--mj-status-error);\n    border-color: color-mix(in srgb, var(--mj-status-error) 30%, var(--mj-border-default));\n}\n.mj-profile__btn--danger:hover {\n    background: color-mix(in srgb, var(--mj-status-error) 8%, transparent);\n    border-color: var(--mj-status-error);\n}\n\n/* ============ SLIDE-IN PANEL ============ */\n.mj-profile__panel {\n    position: absolute;\n    inset: 0;\n    background: var(--mj-bg-surface);\n    transform: translateX(100%);\n    transition: transform 0.32s cubic-bezier(0.4, 0, 0.2, 1);\n    display: flex;\n    flex-direction: column;\n    z-index: 3;\n}\n.mj-profile__panel--open {\n    transform: translateX(0);\n    box-shadow: -8px 0 24px rgba(0, 0, 0, 0.06);\n}\n.mj-profile__panel-header {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 14px 18px;\n    border-bottom: 1px solid var(--mj-border-subtle);\n    background: var(--mj-bg-surface-card);\n    flex-shrink: 0;\n}\n.mj-profile__panel-back {\n    width: 34px; height: 34px;\n    border-radius: 8px;\n    border: 1px solid var(--mj-border-default);\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    cursor: pointer;\n    display: flex; align-items: center; justify-content: center;\n    font-size: 13px;\n    transition: all 0.15s;\n    font-family: inherit;\n}\n.mj-profile__panel-back:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-brand-primary);\n    color: var(--mj-brand-primary);\n}\n.mj-profile__panel-title {\n    margin: 0;\n    font-size: 15px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    letter-spacing: -0.2px;\n}\n.mj-profile__panel-body {\n    flex: 1;\n    min-height: 0;\n    overflow-y: auto;\n    padding: 16px 20px 20px;\n}\n\n/* Theme picker */\n.mj-profile__themes {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n.mj-profile__theme {\n    display: flex;\n    align-items: center;\n    gap: 14px;\n    padding: 12px 14px;\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-subtle);\n    border-radius: 10px;\n    cursor: pointer;\n    transition: all 0.15s;\n    text-align: left;\n    width: 100%;\n    font-family: inherit;\n}\n.mj-profile__theme:hover:not(:disabled) {\n    border-color: var(--mj-brand-primary);\n    background: var(--mj-bg-surface-hover);\n}\n.mj-profile__theme:disabled { cursor: wait; opacity: 0.7; }\n.mj-profile__theme--active {\n    border-color: var(--mj-brand-primary);\n    background: color-mix(in srgb, var(--mj-brand-primary) 5%, var(--mj-bg-surface-card));\n}\n.mj-profile__theme-swatch {\n    width: 40px; height: 40px;\n    border-radius: 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 16px;\n    flex-shrink: 0;\n    border: 1px solid var(--mj-border-default);\n}\n.mj-profile__theme-swatch--light {\n    background: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);\n    color: #f59e0b;\n}\n.mj-profile__theme-swatch--dark {\n    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);\n    color: #94a3b8;\n    border-color: #334155;\n}\n.mj-profile__theme-swatch--system {\n    background: linear-gradient(135deg, #ffffff 0%, #ffffff 49%, #1e293b 51%, #0f172a 100%);\n    color: var(--mj-text-secondary);\n}\n.mj-profile__theme-info { flex: 1; min-width: 0; }\n.mj-profile__theme-name {\n    font-size: 13.5px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n}\n.mj-profile__theme-desc {\n    font-size: 11.5px;\n    color: var(--mj-text-muted);\n    margin-top: 2px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n.mj-profile__theme-check {\n    color: var(--mj-brand-primary);\n    font-size: 14px;\n    flex-shrink: 0;\n}\n\n@media (max-width: 480px) {\n    .mj-profile__hero { padding: 20px 18px 48px; }\n    .mj-profile__avatar-zone { width: 88px; height: 88px; margin-top: -44px; }\n    .mj-profile__avatar { width: 88px; height: 88px; font-size: 28px; }\n    .mj-profile__name { font-size: 19px; }\n    .mj-profile__field-list,\n    .mj-profile__section { padding-left: 18px; padding-right: 18px; }\n    .mj-profile__footer { padding: 12px 16px; }\n    .mj-profile--panel-open .mj-profile__main { transform: translateX(-20%); }\n    .mj-profile__panel-body { padding: 14px 16px 16px; }\n}\n    "] }]
+    }], null, { CloseRequested: [{
+            type: Output
+        }], AvatarUrl: [{
+            type: Input
+        }], AvatarIconClass: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ProfileDialogComponent, { className: "ProfileDialogComponent", filePath: "src/lib/profile/profile-dialog.component.ts", lineNumber: 720 }); })();
+//# sourceMappingURL=profile-dialog.component.js.map