@memberjunction/ng-conversations 5.48.0 → 5.50.0

package/dist/lib/components/conversation/conversation-chat-area.component.js

@@ -56,9 +56,10 @@ const _c0 = ["scrollContainer"];
 const _c1 = ["messageInput"];
 const _c2 = (a0, a1, a2, a3, a4) => ({ $implicit: a0, state: a1, agentName: a2, avatarUrl: a3, mode: a4 });
 const _c3 = (a0, a1, a2, a3, a4) => ({ $implicit: a0, conversationTitle: a1, sharedBy: a2, artifactCount: a3, showArtifactIndicator: a4 });
-const _c4 = (a0, a1, a2) => ({ $implicit: a0, content: a1, visible: a2 });
-const _c5 = () => [];
-const _c6 = (a0, a1, a2, a3) => ({ $implicit: a0, greeting: a1, subtext: a2, suggestedPrompts: a3 });
+const _c4 = (a0, a1, a2) => ({ $implicit: a0, conversationId: a1, isProcessing: a2 });
+const _c5 = (a0, a1, a2) => ({ $implicit: a0, content: a1, visible: a2 });
+const _c6 = () => [];
+const _c7 = (a0, a1, a2, a3) => ({ $implicit: a0, greeting: a1, subtext: a2, suggestedPrompts: a3 });
 const _forTrack0 = ($index, $item) => $item.conversationId;
 const _forTrack1 = ($index, $item) => $item.artifactId;
 const _forTrack2 = ($index, $item) => $item.versionId;
@@ -66,20 +67,20 @@ function ConversationChatAreaComponent_Conditional_1_Conditional_1_ng_container_
     i0.ɵɵelementContainer(0);
 } }
 function ConversationChatAreaComponent_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_1_Conditional_1_ng_container_0_Template, 1, 0, "ng-container", 23);
+    i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_1_Conditional_1_ng_container_0_Template, 1, 0, "ng-container", 22);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngTemplateOutlet", ctx)("ngTemplateOutletContext", i0.ɵɵpureFunction5(2, _c2, ctx_r0.agentCharacterConfig, (ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.state) ?? "idle", ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.characterName, ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.avatarUrl, (ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.voiceStateMode) ?? "subtle"));
 } }
 function ConversationChatAreaComponent_Conditional_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-chat-agent-presence-default", 22);
+    i0.ɵɵelement(0, "mj-chat-agent-presence-default", 21);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("State", (ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.state) ?? "idle")("AgentName", ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.characterName)("AvatarUrl", ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.avatarUrl)("Mode", (ctx_r0.agentCharacterConfig == null ? null : ctx_r0.agentCharacterConfig.voiceStateMode) ?? "subtle");
 } }
 function ConversationChatAreaComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 21);
-    i0.ɵɵconditionalCreate(1, ConversationChatAreaComponent_Conditional_1_Conditional_1_Template, 1, 8, "ng-container")(2, ConversationChatAreaComponent_Conditional_1_Conditional_2_Template, 1, 4, "mj-chat-agent-presence-default", 22);
+    i0.ɵɵelementStart(0, "div", 20);
+    i0.ɵɵconditionalCreate(1, ConversationChatAreaComponent_Conditional_1_Conditional_1_Template, 1, 8, "ng-container")(2, ConversationChatAreaComponent_Conditional_1_Conditional_2_Template, 1, 4, "mj-chat-agent-presence-default", 21);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     let tmp_2_0;
@@ -92,20 +93,20 @@ function ConversationChatAreaComponent_Conditional_2_ng_container_0_Template(rf,
     i0.ɵɵelementContainer(0);
 } }
 function ConversationChatAreaComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_2_ng_container_0_Template, 1, 0, "ng-container", 23);
+    i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_2_ng_container_0_Template, 1, 0, "ng-container", 22);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵproperty("ngTemplateOutlet", ctx)("ngTemplateOutletContext", i0.ɵɵpureFunction5(2, _c3, ctx_r0.conversation, (ctx_r0.conversation == null ? null : ctx_r0.conversation.Name) ?? null, (ctx_r0.sharedByBadge == null ? null : ctx_r0.sharedByBadge.display) ?? null, ctx_r0.artifactCountDisplay, ctx_r0.showArtifactIndicator));
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 38);
+    i0.ɵɵelementStart(0, "button", 37);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.sidebarToggleClicked.emit()); });
-    i0.ɵɵelement(1, "i", 39);
+    i0.ɵɵelement(1, "i", 38);
     i0.ɵɵelementEnd();
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 26);
+    i0.ɵɵelementStart(0, "div", 25);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -114,8 +115,8 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_3_Template(rf,
     i0.ɵɵtextInterpolate(ctx_r0.conversation.Name || "");
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 27);
-    i0.ɵɵelement(1, "i", 40);
+    i0.ɵɵelementStart(0, "span", 26);
+    i0.ɵɵelement(1, "i", 39);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
@@ -127,9 +128,9 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_4_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 41);
+    i0.ɵɵelementStart(0, "button", 40);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.openProjectSelector()); });
-    i0.ɵɵelement(1, "i", 42);
+    i0.ɵɵelement(1, "i", 41);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
@@ -140,19 +141,19 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_5_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 43);
+    i0.ɵɵelementStart(0, "button", 42);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.viewTestRun(ctx_r0.conversation.TestRunID)); });
-    i0.ɵɵelement(1, "i", 44);
+    i0.ɵɵelement(1, "i", 43);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "Test");
     i0.ɵɵelementEnd()();
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 45);
+    i0.ɵɵelementStart(0, "button", 44);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.showPinsPanel = !ctx_r0.showPinsPanel); });
-    i0.ɵɵelement(1, "i", 46);
-    i0.ɵɵelementStart(2, "span", 47);
+    i0.ɵɵelement(1, "i", 45);
+    i0.ɵɵelementStart(2, "span", 46);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -163,10 +164,10 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_8_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_9_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 48);
+    i0.ɵɵelementStart(0, "button", 47);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_9_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.viewArtifacts()); });
-    i0.ɵɵelement(1, "i", 49);
-    i0.ɵɵelementStart(2, "span", 50);
+    i0.ɵɵelement(1, "i", 48);
+    i0.ɵɵelementStart(2, "span", 49);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -176,10 +177,10 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_9_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 51);
+    i0.ɵɵelementStart(0, "button", 50);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.toggleMembersModal()); });
-    i0.ɵɵelement(1, "i", 52);
-    i0.ɵɵelementStart(2, "span", 53);
+    i0.ɵɵelement(1, "i", 51);
+    i0.ɵɵelementStart(2, "span", 52);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -189,7 +190,7 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_10_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_11_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-conversation-mode-picker", 54);
+    i0.ɵɵelementStart(0, "mj-conversation-mode-picker", 53);
     i0.ɵɵlistener("PresetChanged", function ConversationChatAreaComponent_Conditional_3_Conditional_11_Template_mj_conversation_mode_picker_PresetChanged_0_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.OnAgentModePresetChanged($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -197,26 +198,33 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_11_Template(rf,
     i0.ɵɵproperty("AgentID", ctx_r0.ModePickerTargetAgentId)("Disabled", ctx_r0.isProcessing);
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-conversation-agent-picker", 35);
+    i0.ɵɵelement(0, "mj-conversation-agent-picker", 34);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("Conversation", ctx_r0.conversation)("CurrentUser", ctx_r0.currentUser)("Disabled", ctx_r0.isReadOnlyView);
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_13_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 55);
+    i0.ɵɵelementStart(0, "button", 54);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_13_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.exportConversation()); });
-    i0.ɵɵelement(1, "i", 56);
-    i0.ɵɵelementStart(2, "span", 57);
-    i0.ɵɵtext(3, "Export");
+    i0.ɵɵelement(1, "i");
+    i0.ɵɵelementStart(2, "span", 55);
+    i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("title", ctx_r0.exportButtonLabel + " conversation");
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r0.exportButtonIcon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r0.exportButtonLabel);
 } }
 function ConversationChatAreaComponent_Conditional_3_Conditional_14_Template(rf, ctx) { if (rf & 1) {
     const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 58);
+    i0.ɵɵelementStart(0, "button", 54);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_3_Conditional_14_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.shareConversation()); });
-    i0.ɵɵelement(1, "i", 40);
-    i0.ɵɵelementStart(2, "span", 57);
+    i0.ɵɵelement(1, "i", 39);
+    i0.ɵɵelementStart(2, "span", 55);
     i0.ɵɵtext(3, "Share");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -224,24 +232,35 @@ function ConversationChatAreaComponent_Conditional_3_Conditional_14_Template(rf,
     i0.ɵɵclassProp("shared", ctx_r0.isShared);
     i0.ɵɵproperty("title", ctx_r0.isShared ? "Manage sharing" : "Share conversation");
 } }
+function ConversationChatAreaComponent_Conditional_3_Conditional_15_ng_container_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0);
+} }
+function ConversationChatAreaComponent_Conditional_3_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_3_Conditional_15_ng_container_0_Template, 1, 0, "ng-container", 22);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngTemplateOutlet", ctx)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c4, ctx_r0.conversation, ctx_r0.conversationId, ctx_r0.isProcessing));
+} }
 function ConversationChatAreaComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 5)(1, "div", 24);
-    i0.ɵɵconditionalCreate(2, ConversationChatAreaComponent_Conditional_3_Conditional_2_Template, 2, 0, "button", 25);
-    i0.ɵɵconditionalCreate(3, ConversationChatAreaComponent_Conditional_3_Conditional_3_Template, 2, 1, "div", 26);
-    i0.ɵɵconditionalCreate(4, ConversationChatAreaComponent_Conditional_3_Conditional_4_Template, 4, 2, "span", 27);
-    i0.ɵɵconditionalCreate(5, ConversationChatAreaComponent_Conditional_3_Conditional_5_Template, 4, 1, "button", 28);
-    i0.ɵɵconditionalCreate(6, ConversationChatAreaComponent_Conditional_3_Conditional_6_Template, 4, 0, "button", 29);
+    i0.ɵɵelementStart(0, "div", 5)(1, "div", 23);
+    i0.ɵɵconditionalCreate(2, ConversationChatAreaComponent_Conditional_3_Conditional_2_Template, 2, 0, "button", 24);
+    i0.ɵɵconditionalCreate(3, ConversationChatAreaComponent_Conditional_3_Conditional_3_Template, 2, 1, "div", 25);
+    i0.ɵɵconditionalCreate(4, ConversationChatAreaComponent_Conditional_3_Conditional_4_Template, 4, 2, "span", 26);
+    i0.ɵɵconditionalCreate(5, ConversationChatAreaComponent_Conditional_3_Conditional_5_Template, 4, 1, "button", 27);
+    i0.ɵɵconditionalCreate(6, ConversationChatAreaComponent_Conditional_3_Conditional_6_Template, 4, 0, "button", 28);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 30);
-    i0.ɵɵconditionalCreate(8, ConversationChatAreaComponent_Conditional_3_Conditional_8_Template, 4, 3, "button", 31);
-    i0.ɵɵconditionalCreate(9, ConversationChatAreaComponent_Conditional_3_Conditional_9_Template, 4, 1, "button", 32);
-    i0.ɵɵconditionalCreate(10, ConversationChatAreaComponent_Conditional_3_Conditional_10_Template, 4, 1, "button", 33);
-    i0.ɵɵconditionalCreate(11, ConversationChatAreaComponent_Conditional_3_Conditional_11_Template, 1, 2, "mj-conversation-mode-picker", 34);
-    i0.ɵɵconditionalCreate(12, ConversationChatAreaComponent_Conditional_3_Conditional_12_Template, 1, 3, "mj-conversation-agent-picker", 35);
-    i0.ɵɵconditionalCreate(13, ConversationChatAreaComponent_Conditional_3_Conditional_13_Template, 4, 0, "button", 36);
-    i0.ɵɵconditionalCreate(14, ConversationChatAreaComponent_Conditional_3_Conditional_14_Template, 4, 3, "button", 37);
+    i0.ɵɵelementStart(7, "div", 29);
+    i0.ɵɵconditionalCreate(8, ConversationChatAreaComponent_Conditional_3_Conditional_8_Template, 4, 3, "button", 30);
+    i0.ɵɵconditionalCreate(9, ConversationChatAreaComponent_Conditional_3_Conditional_9_Template, 4, 1, "button", 31);
+    i0.ɵɵconditionalCreate(10, ConversationChatAreaComponent_Conditional_3_Conditional_10_Template, 4, 1, "button", 32);
+    i0.ɵɵconditionalCreate(11, ConversationChatAreaComponent_Conditional_3_Conditional_11_Template, 1, 2, "mj-conversation-mode-picker", 33);
+    i0.ɵɵconditionalCreate(12, ConversationChatAreaComponent_Conditional_3_Conditional_12_Template, 1, 3, "mj-conversation-agent-picker", 34);
+    i0.ɵɵconditionalCreate(13, ConversationChatAreaComponent_Conditional_3_Conditional_13_Template, 4, 4, "button", 35);
+    i0.ɵɵconditionalCreate(14, ConversationChatAreaComponent_Conditional_3_Conditional_14_Template, 4, 3, "button", 36);
+    i0.ɵɵconditionalCreate(15, ConversationChatAreaComponent_Conditional_3_Conditional_15_Template, 1, 6, "ng-container");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
+    let tmp_14_0;
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
     i0.ɵɵclassProp("with-sidebar-toggle", ctx_r0.showSidebarToggle);
@@ -256,7 +275,7 @@ function ConversationChatAreaComponent_Conditional_3_Template(rf, ctx) { if (rf
     i0.ɵɵadvance();
     i0.ɵɵconditional((ctx_r0.conversation == null ? null : ctx_r0.conversation.TestRunID) ? 6 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r0.pinnedMessages.length > 0 ? 8 : -1);
+    i0.ɵɵconditional(ctx_r0.allowPinning && ctx_r0.pinnedMessages.length > 0 ? 8 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r0.showArtifactIndicator && ctx_r0.artifactCountDisplay > 0 ? 9 : -1);
     i0.ɵɵadvance();
@@ -269,44 +288,52 @@ function ConversationChatAreaComponent_Conditional_3_Template(rf, ctx) { if (rf
     i0.ɵɵconditional(ctx_r0.showExportButton ? 13 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r0.showShareButton && ctx_r0.canShareConversation ? 14 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional((tmp_14_0 = ctx_r0.slotTemplate("headerActions")) ? 15 : -1, tmp_14_0);
 } }
 function ConversationChatAreaComponent_Conditional_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
 function ConversationChatAreaComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 7);
-    i0.ɵɵtemplate(1, ConversationChatAreaComponent_Conditional_5_ng_container_1_Template, 1, 0, "ng-container", 23);
+    i0.ɵɵtemplate(1, ConversationChatAreaComponent_Conditional_5_ng_container_1_Template, 1, 0, "ng-container", 22);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.slotTemplate("demonstrationSurface"))("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c4, ctx_r0.demonstrationSurfaceContent, ctx_r0.demonstrationSurfaceContent, ctx_r0.showDemonstrationSurface));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.slotTemplate("demonstrationSurface"))("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c5, ctx_r0.demonstrationSurfaceContent, ctx_r0.demonstrationSurfaceContent, ctx_r0.showDemonstrationSurface));
 } }
-function ConversationChatAreaComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 9);
-    i0.ɵɵelement(1, "mj-loading", 59);
+function ConversationChatAreaComponent_Conditional_7_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 56);
+    i0.ɵɵelement(1, "mj-loading", 57);
     i0.ɵɵelementEnd();
 } }
+function ConversationChatAreaComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, ConversationChatAreaComponent_Conditional_7_Conditional_0_Template, 2, 0, "div", 56);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(ctx_r0.showLoadingState ? 0 : -1);
+} }
 function ConversationChatAreaComponent_Conditional_8_Conditional_0_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
 function ConversationChatAreaComponent_Conditional_8_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_8_Conditional_0_ng_container_0_Template, 1, 0, "ng-container", 23);
+    i0.ɵɵtemplate(0, ConversationChatAreaComponent_Conditional_8_Conditional_0_ng_container_0_Template, 1, 0, "ng-container", 22);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx)("ngTemplateOutletContext", i0.ɵɵpureFunction4(3, _c6, ctx_r0.emptyStateConfig, (ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.greeting) ?? ctx_r0.emptyStateGreeting, ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.subtext, (ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.suggestedPrompts) ?? i0.ɵɵpureFunction0(2, _c5)));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx)("ngTemplateOutletContext", i0.ɵɵpureFunction4(3, _c7, ctx_r0.emptyStateConfig, (ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.greeting) ?? ctx_r0.emptyStateGreeting, ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.subtext, (ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.suggestedPrompts) ?? i0.ɵɵpureFunction0(2, _c6)));
 } }
 function ConversationChatAreaComponent_Conditional_8_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-conversation-empty-state", 61);
+    i0.ɵɵelementStart(0, "mj-conversation-empty-state", 59);
     i0.ɵɵlistener("initialDraftApplied", function ConversationChatAreaComponent_Conditional_8_Conditional_1_Template_mj_conversation_empty_state_initialDraftApplied_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.OnComposerDraftApplied()); })("DraftStateChanged", function ConversationChatAreaComponent_Conditional_8_Conditional_1_Template_mj_conversation_empty_state_DraftStateChanged_0_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.OnDraftStateChanged(null, $event)); })("ComposerBlurred", function ConversationChatAreaComponent_Conditional_8_Conditional_1_Template_mj_conversation_empty_state_ComposerBlurred_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.OnComposerBlurred()); })("sidebarToggleClicked", function ConversationChatAreaComponent_Conditional_8_Conditional_1_Template_mj_conversation_empty_state_sidebarToggleClicked_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.sidebarToggleClicked.emit()); })("messageSent", function ConversationChatAreaComponent_Conditional_8_Conditional_1_Template_mj_conversation_empty_state_messageSent_0_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onEmptyStateMessageSent($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("currentUser", ctx_r0.currentUser)("initialDraft", ctx_r0.GetInitialDraftFor(null))("disabled", ctx_r0.isProcessing)("showSidebarToggle", ctx_r0.showSidebarToggle)("overlayMode", ctx_r0.overlayMode)("greeting", (ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.greeting) ?? ctx_r0.emptyStateGreeting)("enableAttachments", ctx_r0.enableAttachments && ctx_r0.allowAttachments)("enableMentions", ctx_r0.allowMentions)("maxAttachments", ctx_r0.maxAttachments)("maxAttachmentSizeBytes", ctx_r0.maxAttachmentSizeBytes)("acceptedFileTypes", ctx_r0.acceptedFileTypes);
+    i0.ɵɵproperty("currentUser", ctx_r0.currentUser)("initialDraft", ctx_r0.GetInitialDraftFor(null))("disabled", ctx_r0.isProcessing)("showSidebarToggle", ctx_r0.showSidebarToggle)("overlayMode", ctx_r0.overlayMode)("greeting", (ctx_r0.emptyStateConfig == null ? null : ctx_r0.emptyStateConfig.greeting) ?? ctx_r0.emptyStateGreeting)("showSuggestedPrompts", ctx_r0.showSuggestedPrompts)("enableAttachments", ctx_r0.enableAttachments && ctx_r0.allowAttachments)("enableMentions", ctx_r0.allowMentions)("enableAgentMentions", ctx_r0.allowAgentMentions)("enableEntityMentions", ctx_r0.allowEntityMentions)("enableSkillCommands", ctx_r0.allowSkillCommands)("maxAttachments", ctx_r0.maxAttachments)("maxAttachmentSizeBytes", ctx_r0.maxAttachmentSizeBytes)("acceptedFileTypes", ctx_r0.acceptedFileTypes);
 } }
 function ConversationChatAreaComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, ConversationChatAreaComponent_Conditional_8_Conditional_0_Template, 1, 8, "ng-container")(1, ConversationChatAreaComponent_Conditional_8_Conditional_1_Template, 1, 11, "mj-conversation-empty-state", 60);
+    i0.ɵɵconditionalCreate(0, ConversationChatAreaComponent_Conditional_8_Conditional_0_Template, 1, 8, "ng-container")(1, ConversationChatAreaComponent_Conditional_8_Conditional_1_Template, 1, 15, "mj-conversation-empty-state", 58);
 } if (rf & 2) {
     let tmp_1_0;
     const ctx_r0 = i0.ɵɵnextContext();
@@ -314,19 +341,19 @@ function ConversationChatAreaComponent_Conditional_8_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
     const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 10);
-    i0.ɵɵelement(1, "div", 62);
-    i0.ɵɵelementStart(2, "div", 63)(3, "div", 64)(4, "mj-message-input", 65, 0);
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵelement(1, "div", 60);
+    i0.ɵɵelementStart(2, "div", 61)(3, "div", 62)(4, "mj-message-input", 63, 0);
     i0.ɵɵlistener("initialDraftApplied", function ConversationChatAreaComponent_Conditional_9_Template_mj_message_input_initialDraftApplied_4_listener() { i0.ɵɵrestoreView(_r12); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.OnComposerDraftApplied()); })("DraftStateChanged", function ConversationChatAreaComponent_Conditional_9_Template_mj_message_input_DraftStateChanged_4_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.OnDraftStateChanged(null, $event)); })("ComposerBlurred", function ConversationChatAreaComponent_Conditional_9_Template_mj_message_input_ComposerBlurred_4_listener() { i0.ɵɵrestoreView(_r12); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.OnComposerBlurred()); })("emptyStateSubmit", function ConversationChatAreaComponent_Conditional_9_Template_mj_message_input_emptyStateSubmit_4_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onEmptyStateMessageSent($event)); });
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance(4);
-    i0.ɵɵproperty("emptyStateMode", true)("initialDraft", ctx_r0.GetInitialDraftFor(null))("currentUser", ctx_r0.currentUser)("disabled", ctx_r0.isProcessing)("enableAttachments", ctx_r0.enableAttachments && ctx_r0.allowAttachments)("enableMentions", ctx_r0.allowMentions)("maxAttachments", ctx_r0.maxAttachments)("maxAttachmentSizeBytes", ctx_r0.maxAttachmentSizeBytes)("acceptedFileTypes", ctx_r0.acceptedFileTypes);
+    i0.ɵɵproperty("emptyStateMode", true)("initialDraft", ctx_r0.GetInitialDraftFor(null))("currentUser", ctx_r0.currentUser)("disabled", ctx_r0.isProcessing)("enableAttachments", ctx_r0.enableAttachments && ctx_r0.allowAttachments)("enableMentions", ctx_r0.allowMentions)("enableAgentMentions", ctx_r0.allowAgentMentions)("enableEntityMentions", ctx_r0.allowEntityMentions)("enableSkillCommands", ctx_r0.allowSkillCommands)("enablePlanMode", ctx_r0.allowPlanMode)("enableRealtime", ctx_r0.allowRealtime)("maxAttachments", ctx_r0.maxAttachments)("maxAttachmentSizeBytes", ctx_r0.maxAttachmentSizeBytes)("acceptedFileTypes", ctx_r0.acceptedFileTypes);
 } }
 function ConversationChatAreaComponent_Conditional_10_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 66);
-    i0.ɵɵelement(1, "mj-loading", 71);
+    i0.ɵɵelementStart(0, "div", 64);
+    i0.ɵɵelement(1, "mj-loading", 69);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
@@ -335,37 +362,37 @@ function ConversationChatAreaComponent_Conditional_10_Conditional_1_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_10_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 72);
+    i0.ɵɵelementStart(0, "span", 70);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_10_Conditional_5_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.scrollToBottomAnimate()); });
-    i0.ɵɵelement(1, "i", 73);
+    i0.ɵɵelement(1, "i", 71);
     i0.ɵɵelementEnd();
 } }
 function ConversationChatAreaComponent_Conditional_10_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 70);
-    i0.ɵɵelement(1, "mj-loading", 74);
+    i0.ɵɵelementStart(0, "div", 68);
+    i0.ɵɵelement(1, "mj-loading", 72);
     i0.ɵɵelementEnd();
 } }
 function ConversationChatAreaComponent_Conditional_10_Conditional_8_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 75);
-    i0.ɵɵelement(1, "i", 77);
+    i0.ɵɵelementStart(0, "div", 73);
+    i0.ɵɵelement(1, "i", 75);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3, "You have view-only access to this conversation.");
     i0.ɵɵelementEnd()();
 } }
 function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template(rf, ctx) { if (rf & 1) {
     const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-message-input", 78, 2);
+    i0.ɵɵelementStart(0, "mj-message-input", 76, 2);
     i0.ɵɵlistener("DraftStateChanged", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_DraftStateChanged_0_listener($event) { const inputRef_r16 = i0.ɵɵrestoreView(_r15).$implicit; const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.OnDraftStateChanged(inputRef_r16.conversationId, $event)); })("ComposerBlurred", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_ComposerBlurred_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.OnComposerBlurred()); })("initialMessageAutoSendStarted", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_initialMessageAutoSendStarted_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onInitialMessageAutoSendStarted($event)); })("initialMessageAutoSendFailed", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_initialMessageAutoSendFailed_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onInitialMessageAutoSendFailed($event)); })("messageSent", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_messageSent_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onMessageSent($event)); })("agentResponse", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_agentResponse_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onAgentResponse($event)); })("agentRunDetected", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_agentRunDetected_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onAgentRunDetected($event)); })("agentRunUpdate", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_agentRunUpdate_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onAgentRunUpdate($event)); })("messageComplete", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_messageComplete_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onMessageComplete($event)); })("artifactCreated", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_artifactCreated_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onArtifactCreated($event)); })("conversationRenamed", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_conversationRenamed_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onConversationRenamed($event)); })("intentCheckStarted", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_intentCheckStarted_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onIntentCheckStarted($event)); })("intentCheckCompleted", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_intentCheckCompleted_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onIntentCheckCompleted($event)); })("beforeAgentTurn", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_beforeAgentTurn_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.beforeAgentTurn.emit($event)); })("afterAgentTurn", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_afterAgentTurn_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.afterAgentTurn.emit($event)); })("uploadStateChanged", function ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template_mj_message_input_uploadStateChanged_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.onUploadStateChanged($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const inputRef_r16 = ctx.$implicit;
     const ctx_r0 = i0.ɵɵnextContext(3);
-    i0.ɵɵproperty("hidden", inputRef_r16.conversationId !== ctx_r0.conversationId)("initialDraft", ctx_r0.GetInitialDraftFor(inputRef_r16.conversationId))("conversationId", inputRef_r16.conversationId)("conversationName", inputRef_r16.conversationName)("currentUser", ctx_r0.currentUser)("conversationHistory", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.messages : i0.ɵɵpureFunction0(23, _c5))("artifactsByDetailId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.artifactsByDetailId : ctx_r0.emptyArtifactsMap)("systemArtifactsByDetailId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.systemArtifactsByDetailId : ctx_r0.emptyArtifactsMap)("agentRunsByDetailId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.agentRunsByDetailId : ctx_r0.emptyAgentRunsMap)("appContext", ctx_r0.appContext)("applicationId", ctx_r0.applicationId)("defaultAgentId", ctx_r0.defaultAgentId)("conversationDefaultAgentId", inputRef_r16.conversationId === ctx_r0.conversationId ? (ctx_r0.conversation == null ? null : ctx_r0.conversation.DefaultAgentID) ?? null : null)("agentConfigurationPresetId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.ActiveAgentConfigurationPresetId : null)("inProgressMessageIds", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.inProgressMessageIds : ctx_r0.emptyInProgressIds)("disabled", ctx_r0.isProcessing || ctx_r0.isReadOnlyView)("enableAttachments", ctx_r0.enableAttachments && ctx_r0.allowAttachments)("enableMentions", ctx_r0.allowMentions)("maxAttachments", ctx_r0.maxAttachments)("maxAttachmentSizeBytes", ctx_r0.maxAttachmentSizeBytes)("acceptedFileTypes", ctx_r0.acceptedFileTypes)("initialMessage", ctx_r0.shouldDeliverPendingMessageTo(inputRef_r16.conversationId) ? ctx_r0.pendingMessage : null)("initialAttachments", ctx_r0.shouldDeliverPendingMessageTo(inputRef_r16.conversationId) ? ctx_r0.pendingAttachments : null);
+    i0.ɵɵproperty("hidden", inputRef_r16.conversationId !== ctx_r0.conversationId)("initialDraft", ctx_r0.GetInitialDraftFor(inputRef_r16.conversationId))("conversationId", inputRef_r16.conversationId)("conversationName", inputRef_r16.conversationName)("currentUser", ctx_r0.currentUser)("conversationHistory", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.messages : i0.ɵɵpureFunction0(28, _c6))("artifactsByDetailId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.artifactsByDetailId : ctx_r0.emptyArtifactsMap)("systemArtifactsByDetailId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.systemArtifactsByDetailId : ctx_r0.emptyArtifactsMap)("agentRunsByDetailId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.agentRunsByDetailId : ctx_r0.emptyAgentRunsMap)("appContext", ctx_r0.appContext)("applicationId", ctx_r0.applicationId)("defaultAgentId", ctx_r0.defaultAgentId)("conversationDefaultAgentId", inputRef_r16.conversationId === ctx_r0.conversationId ? (ctx_r0.conversation == null ? null : ctx_r0.conversation.DefaultAgentID) ?? null : null)("agentConfigurationPresetId", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.ActiveAgentConfigurationPresetId : null)("inProgressMessageIds", inputRef_r16.conversationId === ctx_r0.conversationId ? ctx_r0.inProgressMessageIds : ctx_r0.emptyInProgressIds)("disabled", ctx_r0.isProcessing || ctx_r0.isReadOnlyView)("enableAttachments", ctx_r0.enableAttachments && ctx_r0.allowAttachments)("enableMentions", ctx_r0.allowMentions)("enableAgentMentions", ctx_r0.allowAgentMentions)("enableEntityMentions", ctx_r0.allowEntityMentions)("enableSkillCommands", ctx_r0.allowSkillCommands)("enablePlanMode", ctx_r0.allowPlanMode)("enableRealtime", ctx_r0.allowRealtime)("maxAttachments", ctx_r0.maxAttachments)("maxAttachmentSizeBytes", ctx_r0.maxAttachmentSizeBytes)("acceptedFileTypes", ctx_r0.acceptedFileTypes)("initialMessage", ctx_r0.shouldDeliverPendingMessageTo(inputRef_r16.conversationId) ? ctx_r0.pendingMessage : null)("initialAttachments", ctx_r0.shouldDeliverPendingMessageTo(inputRef_r16.conversationId) ? ctx_r0.pendingAttachments : null);
 } }
 function ConversationChatAreaComponent_Conditional_10_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, ConversationChatAreaComponent_Conditional_10_Conditional_8_Conditional_0_Template, 4, 0, "div", 75);
-    i0.ɵɵelementStart(1, "div", 64);
-    i0.ɵɵrepeaterCreate(2, ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template, 2, 24, "mj-message-input", 76, _forTrack0);
+    i0.ɵɵconditionalCreate(0, ConversationChatAreaComponent_Conditional_10_Conditional_8_Conditional_0_Template, 4, 0, "div", 73);
+    i0.ɵɵelementStart(1, "div", 62);
+    i0.ɵɵrepeaterCreate(2, ConversationChatAreaComponent_Conditional_10_Conditional_8_For_3_Template, 2, 29, "mj-message-input", 74, _forTrack0);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
@@ -375,24 +402,24 @@ function ConversationChatAreaComponent_Conditional_10_Conditional_8_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     const _r13 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 10);
-    i0.ɵɵconditionalCreate(1, ConversationChatAreaComponent_Conditional_10_Conditional_1_Template, 2, 1, "div", 66);
-    i0.ɵɵelementStart(2, "div", 67, 1);
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵconditionalCreate(1, ConversationChatAreaComponent_Conditional_10_Conditional_1_Template, 2, 1, "div", 64);
+    i0.ɵɵelementStart(2, "div", 65, 1);
     i0.ɵɵlistener("scroll", function ConversationChatAreaComponent_Conditional_10_Template_div_scroll_2_listener() { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.checkScroll()); });
-    i0.ɵɵelementStart(4, "mj-conversation-message-list", 68);
+    i0.ɵɵelementStart(4, "mj-conversation-message-list", 66);
     i0.ɵɵlistener("realtimeSessionOpenRequested", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_realtimeSessionOpenRequested_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.OpenRealtimeSessionReview($event)); })("replyInThread", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_replyInThread_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onReplyInThread($event)); })("viewThread", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_viewThread_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onViewThread($event)); })("deleteMessage", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_deleteMessage_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onDeleteMessage($event)); })("retryMessage", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_retryMessage_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onRetryMessage($event)); })("testFeedbackMessage", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_testFeedbackMessage_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onTestFeedbackMessage($event)); })("artifactClicked", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_artifactClicked_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onArtifactClicked($event)); })("messageEdited", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_messageEdited_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onMessageEdited($event)); })("openEntityRecord", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_openEntityRecord_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onOpenEntityRecord($event)); })("suggestedResponseSelected", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_suggestedResponseSelected_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSuggestedResponseSelected($event)); })("attachmentClicked", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_attachmentClicked_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onAttachmentClicked($event)); })("diagnosticRequested", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_diagnosticRequested_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onDiagnosticRequested($event)); })("messagePinToggled", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_messagePinToggled_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onMessagePinToggled($event)); })("beforeResponseFormSubmitted", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_beforeResponseFormSubmitted_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.beforeResponseFormSubmitted.emit($event)); })("afterResponseFormSubmitted", function ConversationChatAreaComponent_Conditional_10_Template_mj_conversation_message_list_afterResponseFormSubmitted_4_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.afterResponseFormSubmitted.emit($event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(5, ConversationChatAreaComponent_Conditional_10_Conditional_5_Template, 2, 0, "span", 69);
+    i0.ɵɵconditionalCreate(5, ConversationChatAreaComponent_Conditional_10_Conditional_5_Template, 2, 0, "span", 67);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 63);
-    i0.ɵɵconditionalCreate(7, ConversationChatAreaComponent_Conditional_10_Conditional_7_Template, 2, 0, "div", 70)(8, ConversationChatAreaComponent_Conditional_10_Conditional_8_Template, 4, 1);
+    i0.ɵɵelementStart(6, "div", 61);
+    i0.ɵɵconditionalCreate(7, ConversationChatAreaComponent_Conditional_10_Conditional_7_Template, 2, 0, "div", 68)(8, ConversationChatAreaComponent_Conditional_10_Conditional_8_Template, 4, 1);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r0.isUploadingAttachments ? 1 : -1);
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("messages", ctx_r0.messages)("conversation", ctx_r0.conversation)("currentUser", ctx_r0.currentUser)("isProcessing", ctx_r0.isProcessing)("artifactMap", ctx_r0.effectiveArtifactsMap)("agentRunMap", ctx_r0.agentRunsByDetailId)("ratingsMap", ctx_r0.ratingsByDetailId)("userAvatarMap", ctx_r0.userAvatarMap)("attachmentsMap", ctx_r0.attachmentsByDetailId)("messageRendererTemplate", ctx_r0.slotTemplate("messageRenderer"))("messageExtraTemplate", ctx_r0.slotTemplate("messageExtra"))("sessionMetaMap", ctx_r0.realtimeSessionMetaMap);
+    i0.ɵɵproperty("showEmptyFill", ctx_r0.showEmptyFill)("showDateNavigation", ctx_r0.showDateNavigation)("showAgentRunDetails", ctx_r0.showAgentRunDetails)("showReactions", ctx_r0.showReactions)("showMessageRating", ctx_r0.showMessageRating)("allowPinning", ctx_r0.allowPinning)("allowMessageEdit", ctx_r0.allowMessageEdit)("allowMessageDelete", ctx_r0.allowMessageDelete)("assistantDisplayName", ctx_r0.assistantDisplayName)("assistantAvatarUrl", ctx_r0.assistantAvatarUrl)("messages", ctx_r0.messages)("conversation", ctx_r0.conversation)("currentUser", ctx_r0.currentUser)("isProcessing", ctx_r0.isProcessing)("artifactMap", ctx_r0.effectiveArtifactsMap)("agentRunMap", ctx_r0.agentRunsByDetailId)("ratingsMap", ctx_r0.ratingsByDetailId)("userAvatarMap", ctx_r0.userAvatarMap)("attachmentsMap", ctx_r0.attachmentsByDetailId)("messageRendererTemplate", ctx_r0.slotTemplate("messageRenderer"))("messageExtraTemplate", ctx_r0.slotTemplate("messageExtra"))("sessionMetaMap", ctx_r0.realtimeSessionMetaMap);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r0.showScrollToBottomIcon && ctx_r0.messages && ctx_r0.messages.length > 0 ? 5 : -1);
     i0.ɵɵadvance(2);
@@ -400,14 +427,14 @@ function ConversationChatAreaComponent_Conditional_10_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_11_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r18 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 82);
+    i0.ɵɵelementStart(0, "div", 80);
     i0.ɵɵlistener("mousedown", function ConversationChatAreaComponent_Conditional_11_Conditional_0_Template_div_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r18); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onResizeStart($event)); })("touchstart", function ConversationChatAreaComponent_Conditional_11_Conditional_0_Template_div_touchstart_0_listener($event) { i0.ɵɵrestoreView(_r18); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onResizeTouchStart($event)); });
     i0.ɵɵelementEnd();
 } }
 function ConversationChatAreaComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
     const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵconditionalCreate(0, ConversationChatAreaComponent_Conditional_11_Conditional_0_Template, 1, 0, "div", 79);
-    i0.ɵɵelementStart(1, "div", 80)(2, "mj-artifact-viewer-panel", 81);
+    i0.ɵɵconditionalCreate(0, ConversationChatAreaComponent_Conditional_11_Conditional_0_Template, 1, 0, "div", 77);
+    i0.ɵɵelementStart(1, "div", 78)(2, "mj-artifact-viewer-panel", 79);
     i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_closed_2_listener() { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onCloseArtifactPanel()); })("saveToCollectionRequested", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_saveToCollectionRequested_2_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSaveToCollectionRequested($event)); })("navigateToLink", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_navigateToLink_2_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onArtifactLinkNavigation($event)); })("shareRequested", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_shareRequested_2_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onArtifactShareRequested($event)); })("maximizeToggled", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_maximizeToggled_2_listener() { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.toggleMaximizeArtifactPane()); })("openEntityRecord", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_openEntityRecord_2_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onOpenEntityRecord($event)); })("navigationRequest", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_navigationRequest_2_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onNavigationRequest($event)); })("analyzeRequested", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_analyzeRequested_2_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.OnAnalyzeArtifact($event)); })("applyFormRequested", function ConversationChatAreaComponent_Conditional_11_Template_mj_artifact_viewer_panel_applyFormRequested_2_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.OnApplyFormRequested($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -421,7 +448,7 @@ function ConversationChatAreaComponent_Conditional_11_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
     const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-pinned-messages-panel", 83);
+    i0.ɵɵelementStart(0, "mj-pinned-messages-panel", 81);
     i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_13_Template_mj_pinned_messages_panel_closed_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.showPinsPanel = false); })("jumpRequested", function ConversationChatAreaComponent_Conditional_13_Template_mj_pinned_messages_panel_jumpRequested_0_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onJumpToMessage($event)); })("unpinRequested", function ConversationChatAreaComponent_Conditional_13_Template_mj_pinned_messages_panel_unpinRequested_0_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onUnpinFromPanel($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -430,13 +457,13 @@ function ConversationChatAreaComponent_Conditional_13_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_14_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     const _r21 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 86);
+    i0.ɵɵelementStart(0, "button", 84);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_14_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.RealtimeSession.SetMinimized(false)); });
-    i0.ɵɵelement(1, "span", 87)(2, "i", 88);
-    i0.ɵɵelementStart(3, "span", 89)(4, "span", 90);
+    i0.ɵɵelement(1, "span", 85)(2, "i", 86);
+    i0.ɵɵelementStart(3, "span", 87)(4, "span", 88);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "span", 91);
+    i0.ɵɵelementStart(6, "span", 89);
     i0.ɵɵtext(7, "Tap to return");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -446,11 +473,11 @@ function ConversationChatAreaComponent_Conditional_14_Conditional_2_Template(rf,
 } }
 function ConversationChatAreaComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
     const _r20 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-realtime-session-overlay", 84);
+    i0.ɵɵelementStart(0, "mj-realtime-session-overlay", 82);
     i0.ɵɵpipe(1, "async");
     i0.ɵɵlistener("NavigateRequest", function ConversationChatAreaComponent_Conditional_14_Template_mj_realtime_session_overlay_NavigateRequest_0_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onRealtimeNavigateRequest($event)); })("StartLiveRequested", function ConversationChatAreaComponent_Conditional_14_Template_mj_realtime_session_overlay_StartLiveRequested_0_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onReviewStartLive($event)); })("ReviewClosed", function ConversationChatAreaComponent_Conditional_14_Template_mj_realtime_session_overlay_ReviewClosed_0_listener() { i0.ɵɵrestoreView(_r20); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onReviewClosed()); });
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(2, ConversationChatAreaComponent_Conditional_14_Conditional_2_Template, 8, 1, "button", 85);
+    i0.ɵɵconditionalCreate(2, ConversationChatAreaComponent_Conditional_14_Conditional_2_Template, 8, 1, "button", 83);
     i0.ɵɵpipe(3, "async");
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -460,7 +487,7 @@ function ConversationChatAreaComponent_Conditional_14_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
     const _r22 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-thread-panel", 92);
+    i0.ɵɵelementStart(0, "mj-thread-panel", 90);
     i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_16_Template_mj_thread_panel_closed_0_listener() { i0.ɵɵrestoreView(_r22); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onLocalThreadClosed()); })("replyAdded", function ConversationChatAreaComponent_Conditional_16_Template_mj_thread_panel_replyAdded_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onThreadReplyAdded($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -469,18 +496,18 @@ function ConversationChatAreaComponent_Conditional_16_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
     const _r23 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 93);
+    i0.ɵɵelementStart(0, "div", 91);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_20_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.showProjectSelector = false); });
-    i0.ɵɵelementStart(1, "div", 94);
+    i0.ɵɵelementStart(1, "div", 92);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_20_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r23); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(2, "div", 95)(3, "h3");
+    i0.ɵɵelementStart(2, "div", 93)(3, "h3");
     i0.ɵɵtext(4, "Assign Project");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "button", 96);
+    i0.ɵɵelementStart(5, "button", 94);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_20_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r23); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.showProjectSelector = false); });
-    i0.ɵɵelement(6, "i", 97);
+    i0.ɵɵelement(6, "i", 95);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 98)(8, "mj-project-selector", 99);
+    i0.ɵɵelementStart(7, "div", 96)(8, "mj-project-selector", 97);
     i0.ɵɵlistener("projectSelected", function ConversationChatAreaComponent_Conditional_20_Template_mj_project_selector_projectSelected_8_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onProjectSelected($event)); });
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -490,9 +517,9 @@ function ConversationChatAreaComponent_Conditional_20_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_21_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     const _r25 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 106);
+    i0.ɵɵelementStart(0, "button", 104);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_21_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r25); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.toggleSystemArtifacts()); });
-    i0.ɵɵelement(1, "i", 107);
+    i0.ɵɵelement(1, "i", 105);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
@@ -503,7 +530,7 @@ function ConversationChatAreaComponent_Conditional_21_Conditional_6_Template(rf,
     i0.ɵɵtextInterpolate1("", ctx_r0.showSystemArtifacts ? "Hide" : "Show", " System");
 } }
 function ConversationChatAreaComponent_Conditional_21_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-empty-state", 104);
+    i0.ɵɵelement(0, "mj-empty-state", 102);
 } }
 function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
@@ -516,9 +543,9 @@ function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_9_Templ
 } }
 function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     const _r28 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 119);
+    i0.ɵɵelementStart(0, "button", 117);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_10_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r28); const artifact_r27 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.toggleArtifactExpansion(artifact_r27.artifactId, $event)); });
-    i0.ɵɵelement(1, "i", 120);
+    i0.ɵɵelement(1, "i", 118);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const artifact_r27 = i0.ɵɵnextContext().$implicit;
@@ -528,15 +555,15 @@ function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_10_Temp
 } }
 function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_For_2_Template(rf, ctx) { if (rf & 1) {
     const _r29 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 122);
+    i0.ɵɵelementStart(0, "div", 120);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_For_2_Template_div_click_0_listener($event) { const version_r30 = i0.ɵɵrestoreView(_r29).$implicit; const artifact_r27 = i0.ɵɵnextContext(2).$implicit; const ctx_r0 = i0.ɵɵnextContext(2); ctx_r0.openArtifactFromModal(artifact_r27.artifactId, version_r30.versionNumber); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(1, "span", 123);
+    i0.ɵɵelementStart(1, "span", 121);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 124);
+    i0.ɵɵelementStart(3, "span", 122);
     i0.ɵɵtext(4, "Open this version");
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(5, "i", 125);
+    i0.ɵɵelement(5, "i", 123);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const version_r30 = ctx.$implicit;
@@ -544,8 +571,8 @@ function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_For_
     i0.ɵɵtextInterpolate1("v", version_r30.versionNumber);
 } }
 function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 118);
-    i0.ɵɵrepeaterCreate(1, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_For_2_Template, 6, 1, "div", 121, _forTrack2);
+    i0.ɵɵelementStart(0, "div", 116);
+    i0.ɵɵrepeaterCreate(1, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_For_2_Template, 6, 1, "div", 119, _forTrack2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const artifact_r27 = i0.ɵɵnextContext().$implicit;
@@ -554,22 +581,22 @@ function ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_Temp
 } }
 function ConversationChatAreaComponent_Conditional_21_For_12_Template(rf, ctx) { if (rf & 1) {
     const _r26 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 108)(1, "div", 109);
+    i0.ɵɵelementStart(0, "div", 106)(1, "div", 107);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_21_For_12_Template_div_click_1_listener() { const artifact_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.openArtifactFromModal(artifact_r27.artifactId)); });
-    i0.ɵɵelementStart(2, "div", 110);
-    i0.ɵɵelement(3, "i", 111);
+    i0.ɵɵelementStart(2, "div", 108);
+    i0.ɵɵelement(3, "i", 109);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 112)(5, "div", 113);
+    i0.ɵɵelementStart(4, "div", 110)(5, "div", 111);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 114);
+    i0.ɵɵelementStart(7, "div", 112);
     i0.ɵɵconditionalCreate(8, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_8_Template, 1, 1)(9, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_9_Template, 1, 0);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(10, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_10_Template, 2, 4, "button", 115);
-    i0.ɵɵelementStart(11, "div", 116);
-    i0.ɵɵelement(12, "i", 117);
+    i0.ɵɵconditionalCreate(10, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_10_Template, 2, 4, "button", 113);
+    i0.ɵɵelementStart(11, "div", 114);
+    i0.ɵɵelement(12, "i", 115);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(13, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_Template, 3, 0, "div", 118);
+    i0.ɵɵconditionalCreate(13, ConversationChatAreaComponent_Conditional_21_For_12_Conditional_13_Template, 3, 0, "div", 116);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const artifact_r27 = ctx.$implicit;
@@ -586,22 +613,22 @@ function ConversationChatAreaComponent_Conditional_21_For_12_Template(rf, ctx) {
 } }
 function ConversationChatAreaComponent_Conditional_21_Template(rf, ctx) { if (rf & 1) {
     const _r24 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 93);
+    i0.ɵɵelementStart(0, "div", 91);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_21_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r24); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.showArtifactsModal = false); });
-    i0.ɵɵelementStart(1, "div", 100);
+    i0.ɵɵelementStart(1, "div", 98);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_21_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r24); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(2, "div", 95)(3, "h3");
+    i0.ɵɵelementStart(2, "div", 93)(3, "h3");
     i0.ɵɵtext(4, "Conversation Artifacts");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 101);
-    i0.ɵɵconditionalCreate(6, ConversationChatAreaComponent_Conditional_21_Conditional_6_Template, 4, 3, "button", 102);
-    i0.ɵɵelementStart(7, "button", 96);
+    i0.ɵɵelementStart(5, "div", 99);
+    i0.ɵɵconditionalCreate(6, ConversationChatAreaComponent_Conditional_21_Conditional_6_Template, 4, 3, "button", 100);
+    i0.ɵɵelementStart(7, "button", 94);
     i0.ɵɵlistener("click", function ConversationChatAreaComponent_Conditional_21_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r24); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.showArtifactsModal = false); });
-    i0.ɵɵelement(8, "i", 97);
+    i0.ɵɵelement(8, "i", 95);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(9, "div", 103);
-    i0.ɵɵconditionalCreate(10, ConversationChatAreaComponent_Conditional_21_Conditional_10_Template, 1, 0, "mj-empty-state", 104);
-    i0.ɵɵrepeaterCreate(11, ConversationChatAreaComponent_Conditional_21_For_12_Template, 14, 8, "div", 105, _forTrack1);
+    i0.ɵɵelementStart(9, "div", 101);
+    i0.ɵɵconditionalCreate(10, ConversationChatAreaComponent_Conditional_21_Conditional_10_Template, 1, 0, "mj-empty-state", 102);
+    i0.ɵɵrepeaterCreate(11, ConversationChatAreaComponent_Conditional_21_For_12_Template, 14, 8, "div", 103, _forTrack1);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -614,7 +641,7 @@ function ConversationChatAreaComponent_Conditional_21_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_22_Template(rf, ctx) { if (rf & 1) {
     const _r31 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-artifact-collection-picker-modal", 126);
+    i0.ɵɵelementStart(0, "mj-artifact-collection-picker-modal", 124);
     i0.ɵɵlistener("completed", function ConversationChatAreaComponent_Conditional_22_Template_mj_artifact_collection_picker_modal_completed_0_listener($event) { i0.ɵɵrestoreView(_r31); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onCollectionPickerCompleted($event)); })("cancelled", function ConversationChatAreaComponent_Conditional_22_Template_mj_artifact_collection_picker_modal_cancelled_0_listener() { i0.ɵɵrestoreView(_r31); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onCollectionPickerCancelled()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -623,7 +650,7 @@ function ConversationChatAreaComponent_Conditional_22_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_23_Template(rf, ctx) { if (rf & 1) {
     const _r32 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-test-feedback-dialog", 127);
+    i0.ɵɵelementStart(0, "mj-test-feedback-dialog", 125);
     i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_23_Template_mj_test_feedback_dialog_closed_0_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onTestFeedbackDialogClosed($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -632,7 +659,7 @@ function ConversationChatAreaComponent_Conditional_23_Template(rf, ctx) { if (rf
 } }
 function ConversationChatAreaComponent_Conditional_24_Template(rf, ctx) { if (rf & 1) {
     const _r33 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-image-viewer", 128);
+    i0.ɵɵelementStart(0, "mj-image-viewer", 126);
     i0.ɵɵlistener("closed", function ConversationChatAreaComponent_Conditional_24_Template_mj_image_viewer_closed_0_listener() { i0.ɵɵrestoreView(_r33); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onImageViewerClosed()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -642,7 +669,7 @@ function ConversationChatAreaComponent_Conditional_24_Template(rf, ctx) { if (rf
 /** `MJ: Resource Types.ID` for Conversations. */
 const CONVERSATIONS_RESOURCE_TYPE_ID = '81D4BC3D-9FEB-EF11-B01A-286B35C04427';
 /** Default width (percentage) for the artifact viewer pane */
-const DEFAULT_ARTIFACT_PANE_WIDTH = 40;
+export const DEFAULT_ARTIFACT_PANE_WIDTH = 40;
 export class ConversationChatAreaComponent extends BaseAngularComponent {
     agentStateService;
     conversationAgentService;
@@ -694,12 +721,22 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
      */
     suppressNewConversationEmptyState = false;
     /**
-     * Host-level cap for @-mention autocomplete (agents and users).
-     * Defaults true. Hosts addressing a single fixed agent (e.g. Form Builder
-     * cockpit pinned to the Form Builder agent) should set false so the user
-     * can't accidentally redirect a turn to a different agent.
+     * Host-level MASTER cap for the composer's mention/command triggers.
+     * Defaults true. When false, ALL triggers (@ agents, # entities, / skills)
+     * are off regardless of the per-type flags below. Hosts addressing a single
+     * fixed agent (e.g. Form Builder cockpit) can set false wholesale.
      */
     allowMentions = true;
+    /**
+     * Per-type caps under {@link allowMentions}, all default true. Let a host keep
+     * one trigger while dropping another — e.g. a white-label surface pinned to a
+     * default agent that wants to offer `/` skill-commands but NOT `@` agent
+     * mentions (an `@` overrides the pinned default agent in message routing).
+     * Effective only when `allowMentions` is also true.
+     */
+    allowAgentMentions = true;
+    allowEntityMentions = true;
+    allowSkillCommands = true;
     /**
      * Host-level cap for attachments. Defaults true. When false, the host
      * disables attachments regardless of agent modality support — useful for
@@ -708,6 +745,62 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
      * agent's modality support, computed at runtime.
      */
     allowAttachments = true;
+    /**
+     * Host-level cap for the composer's Plan Mode toggle. Defaults true
+     * (current behavior). White-labeled / end-user hosts that don't expose
+     * plan-mode workflows set false to remove the button entirely.
+     */
+    allowPlanMode = true;
+    /**
+     * Host-level cap for the composer's realtime voice-call launcher (and its
+     * options caret). Defaults true (current behavior). Hosts with no voice
+     * experience set false to remove the buttons entirely.
+     */
+    allowRealtime = true;
+    /**
+     * Whether the message list renders its built-in "No messages yet" filler
+     * when a conversation has zero messages. Defaults true. Hosts that render
+     * their own empty-state chrome around the chat area set false.
+     */
+    showEmptyFill = true;
+    /**
+     * Whether the built-in centered loading indicator renders while a
+     * conversation loads. Defaults true. When false the pane stays blank
+     * during the load (the loading branch still short-circuits rendering, so
+     * no premature empty-state flash). Hosts with their own loading chrome
+     * set false.
+     */
+    showLoadingState = true;
+    // --- Additional host-level feature gates (all default true; false removes the
+    //     affordance entirely). Forwarded to the message list / message items / empty
+    //     state so white-labeled end-user surfaces can pare the chat down through the
+    //     component contract instead of CSS on internal class names. ---
+    /** Show the per-message agent run-detail grid (run ID, step/token counts, $ cost). */
+    showAgentRunDetails = true;
+    /** Show the per-message reaction buttons (like / comment). */
+    showReactions = true;
+    /** Show the per-message thumbs rating control on completed AI messages. */
+    showMessageRating = true;
+    /** Allow pinning messages (per-message pin button, the header pin chip, and the pinned-messages panel). */
+    allowPinning = true;
+    /** Allow editing the user's own messages (per-message edit button). */
+    allowMessageEdit = true;
+    /** Allow deleting the user's own messages (per-message delete button). */
+    allowMessageDelete = true;
+    /** Show the empty-state's built-in suggested-prompt chips (and the @mention tip). */
+    showSuggestedPrompts = true;
+    /** Show the message list's sticky date header + jump-to-date navigation. */
+    showDateNavigation = true;
+    // --- Assistant identity overrides (both default null = engine-resolved agent
+    //     identity, today's behavior). White-label hosts brand the AI side of the
+    //     message feed — the persona NAME shown on AI messages and an IMAGE avatar
+    //     replacing the Font Awesome agent icon — through the component contract
+    //     instead of ::ng-deep on .message-sender / .avatar-circle internals.
+    //     Complements agentCharacterConfig, which covers only the presence strip. ---
+    /** Display name for AI messages (e.g. a per-tenant persona). Null = the agent record's name. */
+    assistantDisplayName = null;
+    /** Image URL for the AI message avatar. Null = the agent's Font Awesome icon. */
+    assistantAvatarUrl = null;
     _isNewConversation = false;
     set isNewConversation(value) {
         this._isNewConversation = value;
@@ -784,6 +877,17 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
     overlayMode = false;
     /** Show the Export button in the conversation header. Default true. */
     showExportButton = true;
+    /** Label for the header Export button (white-label hosts relabel it, e.g. "Download"). */
+    exportButtonLabel = 'Export';
+    /** Font Awesome class(es) for the header Export button's icon. */
+    exportButtonIcon = 'fas fa-download';
+    /**
+     * Branding applied to exported files (theme tokens / logo / title) — forwarded
+     * to the export modal, where it also defaults the "Include branding" checkbox
+     * on. See `ExportBranding` in the export service. Null (default) keeps the
+     * stock unthemed export.
+     */
+    exportBranding = null;
     /** Show the Share button in the conversation header. Default true. */
     showShareButton = true;
     /** Show the artifact count indicator in the conversation header. Default true. */
@@ -1688,7 +1792,17 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
         this.isUploadingAttachments = false;
         this.uploadingMessage = '';
         this.intentCheckMessage = null;
+        // Reset width along with the flag — otherwise a pane maximized in the
+        // previous conversation leaves artifactPaneWidth at 100, and the next
+        // artifact opens overflowing the viewport (chat area still visible).
+        // Guarded so a non-maximized user-dragged width survives the switch.
+        if (this.isArtifactPaneMaximized) {
+            this.resetArtifactPaneSizing();
+        }
+    }
+    resetArtifactPaneSizing() {
         this.isArtifactPaneMaximized = false;
+        this.artifactPaneWidth = DEFAULT_ARTIFACT_PANE_WIDTH;
     }
     async onConversationChanged(conversationId) {
         // Prevent double-loading if we're already loading this same conversation
@@ -3046,8 +3160,7 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
         this.canShareSelectedArtifact = false;
         this.canEditSelectedArtifact = false;
         // Reset maximize state and width when closing so the next artifact opens at default size
-        this.isArtifactPaneMaximized = false;
-        this.artifactPaneWidth = DEFAULT_ARTIFACT_PANE_WIDTH;
+        this.resetArtifactPaneSizing();
         this.cdr.detectChanges();
     }
     toggleMaximizeArtifactPane() {
@@ -4194,39 +4307,39 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.artifactViewerComponent = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.emptyStateComponent = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.messageInputComponents = _t);
-        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser", conversationId: "conversationId", conversation: "conversation", threadId: "threadId", suppressNewConversationEmptyState: "suppressNewConversationEmptyState", allowMentions: "allowMentions", allowAttachments: "allowAttachments", isNewConversation: "isNewConversation", pendingMessage: "pendingMessage", pendingMessageConversationId: "pendingMessageConversationId", pendingAttachments: "pendingAttachments", pendingArtifactId: "pendingArtifactId", pendingArtifactVersionNumber: "pendingArtifactVersionNumber", pendingArtifactConversationId: "pendingArtifactConversationId", overlayMode: "overlayMode", showExportButton: "showExportButton", showShareButton: "showShareButton", showArtifactIndicator: "showArtifactIndicator", appContext: "appContext", defaultAgentId: "defaultAgentId", applicationScope: "applicationScope", applicationId: "applicationId", linkedEntityId: "linkedEntityId", linkedRecordId: "linkedRecordId", showAgentPicker: "showAgentPicker", showAgentModePicker: "showAgentModePicker", emptyStateGreeting: "emptyStateGreeting", showSidebarToggle: "showSidebarToggle", showAgentCharacter: "showAgentCharacter", agentCharacterConfig: "agentCharacterConfig", emptyStateConfig: "emptyStateConfig", showDemonstrationSurface: "showDemonstrationSurface", demonstrationSurfaceContent: "demonstrationSurfaceContent", composerDraft: "composerDraft", composerAgentMention: "composerAgentMention" }, outputs: { beforeAgentTurn: "beforeAgentTurn", afterAgentTurn: "afterAgentTurn", beforeToolInvoked: "beforeToolInvoked", afterToolInvoked: "afterToolInvoked", beforeResponseFormSubmitted: "beforeResponseFormSubmitted", afterResponseFormSubmitted: "afterResponseFormSubmitted", sessionStarted: "sessionStarted", sessionChannelStateChanged: "sessionChannelStateChanged", sessionEnded: "sessionEnded", conversationRenamed: "conversationRenamed", openEntityRecord: "openEntityRecord", realtimeConversationReady: "realtimeConversationReady", navigationRequest: "navigationRequest", taskClicked: "taskClicked", artifactLinkClicked: "artifactLinkClicked", sidebarToggleClicked: "sidebarToggleClicked", conversationCreated: "conversationCreated", threadOpened: "threadOpened", threadClosed: "threadClosed", pendingArtifactConsumed: "pendingArtifactConsumed", pendingMessageConsumed: "pendingMessageConsumed", pendingMessageRequested: "pendingMessageRequested", composerDraftConsumed: "composerDraftConsumed", composerAgentMentionConsumed: "composerAgentMentionConsumed" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 25, vars: 33, consts: [["emptyStateInput", ""], ["scrollContainer", ""], ["messageInput", ""], [1, "chat-area"], [1, "chat-agent-presence", 3, "chat-agent-presence--prominent"], [1, "chat-header"], [1, "chat-content-area"], [1, "chat-demonstration-stage"], [1, "chat-messages-pane"], [1, "conversation-loading-state"], [1, "chat-messages-wrapper"], [3, "saved", "cancelled", "isOpen", "artifact", "currentUser"], [3, "pinnedMessages"], [3, "parentMessageId", "conversationId", "currentUser"], [3, "cancelled", "exported", "isVisible", "conversation", "currentUser"], [3, "Result", "Visible", "Context", "Adapter"], [3, "cancelled", "membersChanged", "isVisible", "conversation", "currentUser"], [1, "modal-overlay"], [3, "isOpen", "environmentId", "currentUser", "excludeCollectionIds", "artifactVersionId", "artifactName", "artifactVersionNumber"], [3, "data", "visible"], [3, "imageUrl", "alt", "fileName", "visible"], [1, "chat-agent-presence"], [3, "State", "AgentName", "AvatarUrl", "Mode"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "chat-info"], ["title", "Show conversations", 1, "sidebar-toggle-btn"], [1, "chat-title"], [1, "shared-by-badge", 3, "title"], ["title", "Assign to project", 1, "project-tag"], ["title", "View Test Run", 1, "test-indicator"], [1, "chat-actions", "chat-actions-buttons"], ["title", "View pinned messages", 1, "pin-chip", 3, "active"], ["title", "View artifacts", 1, "artifact-indicator"], ["title", "View members", 1, "chat-members"], [3, "AgentID", "Disabled"], [3, "Conversation", "CurrentUser", "Disabled"], ["mjButton", "", "variant", "flat", "size", "sm", "title", "Export conversation"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "shared", "title"], ["title", "Show conversations", 1, "sidebar-toggle-btn", 3, "click"], [1, "fas", "fa-table-columns"], [1, "fas", "fa-share-nodes"], ["title", "Assign to project", 1, "project-tag", 3, "click"], [1, "fas", "fa-folder"], ["title", "View Test Run", 1, "test-indicator", 3, "click"], [1, "fas", "fa-flask"], ["title", "View pinned messages", 1, "pin-chip", 3, "click"], [1, "fas", "fa-thumbtack"], [1, "pin-chip-count"], ["title", "View artifacts", 1, "artifact-indicator", 3, "click"], [1, "fas", "fa-cube"], [1, "artifact-badge"], ["title", "View members", 1, "chat-members", 3, "click"], [1, "fas", "fa-users"], [1, "members-badge"], [3, "PresetChanged", "AgentID", "Disabled"], ["mjButton", "", "variant", "flat", "size", "sm", "title", "Export conversation", 3, "click"], [1, "fas", "fa-download"], [1, "btn-label"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "click", "title"], ["text", "Loading conversation...", "size", "large"], [3, "currentUser", "initialDraft", "disabled", "showSidebarToggle", "overlayMode", "greeting", "enableAttachments", "enableMentions", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes"], [3, "initialDraftApplied", "DraftStateChanged", "ComposerBlurred", "sidebarToggleClicked", "messageSent", "currentUser", "initialDraft", "disabled", "showSidebarToggle", "overlayMode", "greeting", "enableAttachments", "enableMentions", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes"], [1, "chat-messages-container"], [1, "chat-input-container"], [1, "message-input-container-wrapper"], [3, "initialDraftApplied", "DraftStateChanged", "ComposerBlurred", "emptyStateSubmit", "emptyStateMode", "initialDraft", "currentUser", "disabled", "enableAttachments", "enableMentions", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes"], [1, "upload-indicator-overlay"], [1, "chat-messages-container", 3, "scroll"], [3, "realtimeSessionOpenRequested", "replyInThread", "viewThread", "deleteMessage", "retryMessage", "testFeedbackMessage", "artifactClicked", "messageEdited", "openEntityRecord", "suggestedResponseSelected", "attachmentClicked", "diagnosticRequested", "messagePinToggled", "beforeResponseFormSubmitted", "afterResponseFormSubmitted", "messages", "conversation", "currentUser", "isProcessing", "artifactMap", "agentRunMap", "ratingsMap", "userAvatarMap", "attachmentsMap", "messageRendererTemplate", "messageExtraTemplate", "sessionMetaMap"], [1, "scroll-to-bottom-icon", 2, "left", "50%"], [1, "loading-peripheral-placeholder"], ["size", "medium", 3, "text"], [1, "scroll-to-bottom-icon", 2, "left", "50%", 3, "click"], [1, "fas", "fa-arrow-down"], ["text", "Loading conversation data...", "size", "medium"], ["role", "status", 1, "read-only-banner"], [3, "hidden", "initialDraft", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "appContext", "applicationId", "defaultAgentId", "conversationDefaultAgentId", "agentConfigurationPresetId", "inProgressMessageIds", "disabled", "enableAttachments", "enableMentions", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes", "initialMessage", "initialAttachments"], [1, "fas", "fa-eye"], [3, "DraftStateChanged", "ComposerBlurred", "initialMessageAutoSendStarted", "initialMessageAutoSendFailed", "messageSent", "agentResponse", "agentRunDetected", "agentRunUpdate", "messageComplete", "artifactCreated", "conversationRenamed", "intentCheckStarted", "intentCheckCompleted", "beforeAgentTurn", "afterAgentTurn", "uploadStateChanged", "hidden", "initialDraft", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "appContext", "applicationId", "defaultAgentId", "conversationDefaultAgentId", "agentConfigurationPresetId", "inProgressMessageIds", "disabled", "enableAttachments", "enableMentions", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes", "initialMessage", "initialAttachments"], [1, "resize-handle"], [1, "chat-artifact-pane"], [3, "closed", "saveToCollectionRequested", "navigateToLink", "shareRequested", "maximizeToggled", "openEntityRecord", "navigationRequest", "analyzeRequested", "applyFormRequested", "artifactId", "currentUser", "environmentId", "versionNumber", "viewContext", "canShare", "canEdit", "isMaximized", "refreshTrigger"], [1, "resize-handle", 3, "mousedown", "touchstart"], [3, "closed", "jumpRequested", "unpinRequested", "pinnedMessages"], [3, "NavigateRequest", "StartLiveRequested", "ReviewClosed", "AgentName", "Hidden", "CurrentUser", "EnvironmentID", "ReviewData", "Chrome", "Compact", "ShowDevLinks", "ShowDensityPicker"], ["type", "button", "title", "Return to the live call", "aria-label", "Return to the live call", 1, "voice-call-pill"], ["type", "button", "title", "Return to the live call", "aria-label", "Return to the live call", 1, "voice-call-pill", 3, "click"], ["aria-hidden", "true", 1, "voice-call-pill__pulse"], ["aria-hidden", "true", 1, "fa-solid", "fa-phone-volume"], [1, "voice-call-pill__text"], [1, "voice-call-pill__name"], [1, "voice-call-pill__hint"], [3, "closed", "replyAdded", "parentMessageId", "conversationId", "currentUser"], [1, "modal-overlay", 3, "click"], [1, "modal-content", "project-selector-modal", 3, "click"], [1, "modal-header"], [1, "modal-close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "modal-body"], [3, "projectSelected", "environmentId", "currentUser", "selectedProjectId"], [1, "modal-content", "artifacts-modal", 3, "click"], [1, "modal-header-actions"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "active"], [1, "modal-body", "artifacts-grid"], ["Icon", "fa-solid fa-cube", "Title", "No artifacts in this conversation yet", 1, "artifacts-empty-fill"], [1, "artifact-modal-card", 3, "expanded", "system-artifact"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "click"], [1, "fas", "fa-cog"], [1, "artifact-modal-card"], [1, "artifact-card-header", 3, "click"], [1, "artifact-modal-icon"], [1, "fas", "fa-file-code"], [1, "artifact-modal-info"], [1, "artifact-modal-title"], [1, "artifact-modal-meta"], [1, "expand-btn"], [1, "artifact-modal-action"], [1, "fas", "fa-external-link-alt"], [1, "artifact-versions-list"], [1, "expand-btn", 3, "click"], [1, "fas"], [1, "artifact-version-item"], [1, "artifact-version-item", 3, "click"], [1, "version-badge"], [1, "version-open-text"], [1, "fas", "fa-arrow-right"], [3, "completed", "cancelled", "isOpen", "environmentId", "currentUser", "excludeCollectionIds", "artifactVersionId", "artifactName", "artifactVersionNumber"], [3, "closed", "data", "visible"], [3, "closed", "imageUrl", "alt", "fileName", "visible"]], template: function ConversationChatAreaComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser", conversationId: "conversationId", conversation: "conversation", threadId: "threadId", suppressNewConversationEmptyState: "suppressNewConversationEmptyState", allowMentions: "allowMentions", allowAgentMentions: "allowAgentMentions", allowEntityMentions: "allowEntityMentions", allowSkillCommands: "allowSkillCommands", allowAttachments: "allowAttachments", allowPlanMode: "allowPlanMode", allowRealtime: "allowRealtime", showEmptyFill: "showEmptyFill", showLoadingState: "showLoadingState", showAgentRunDetails: "showAgentRunDetails", showReactions: "showReactions", showMessageRating: "showMessageRating", allowPinning: "allowPinning", allowMessageEdit: "allowMessageEdit", allowMessageDelete: "allowMessageDelete", showSuggestedPrompts: "showSuggestedPrompts", showDateNavigation: "showDateNavigation", assistantDisplayName: "assistantDisplayName", assistantAvatarUrl: "assistantAvatarUrl", isNewConversation: "isNewConversation", pendingMessage: "pendingMessage", pendingMessageConversationId: "pendingMessageConversationId", pendingAttachments: "pendingAttachments", pendingArtifactId: "pendingArtifactId", pendingArtifactVersionNumber: "pendingArtifactVersionNumber", pendingArtifactConversationId: "pendingArtifactConversationId", overlayMode: "overlayMode", showExportButton: "showExportButton", exportButtonLabel: "exportButtonLabel", exportButtonIcon: "exportButtonIcon", exportBranding: "exportBranding", showShareButton: "showShareButton", showArtifactIndicator: "showArtifactIndicator", appContext: "appContext", defaultAgentId: "defaultAgentId", applicationScope: "applicationScope", applicationId: "applicationId", linkedEntityId: "linkedEntityId", linkedRecordId: "linkedRecordId", showAgentPicker: "showAgentPicker", showAgentModePicker: "showAgentModePicker", emptyStateGreeting: "emptyStateGreeting", showSidebarToggle: "showSidebarToggle", showAgentCharacter: "showAgentCharacter", agentCharacterConfig: "agentCharacterConfig", emptyStateConfig: "emptyStateConfig", showDemonstrationSurface: "showDemonstrationSurface", demonstrationSurfaceContent: "demonstrationSurfaceContent", composerDraft: "composerDraft", composerAgentMention: "composerAgentMention" }, outputs: { beforeAgentTurn: "beforeAgentTurn", afterAgentTurn: "afterAgentTurn", beforeToolInvoked: "beforeToolInvoked", afterToolInvoked: "afterToolInvoked", beforeResponseFormSubmitted: "beforeResponseFormSubmitted", afterResponseFormSubmitted: "afterResponseFormSubmitted", sessionStarted: "sessionStarted", sessionChannelStateChanged: "sessionChannelStateChanged", sessionEnded: "sessionEnded", conversationRenamed: "conversationRenamed", openEntityRecord: "openEntityRecord", realtimeConversationReady: "realtimeConversationReady", navigationRequest: "navigationRequest", taskClicked: "taskClicked", artifactLinkClicked: "artifactLinkClicked", sidebarToggleClicked: "sidebarToggleClicked", conversationCreated: "conversationCreated", threadOpened: "threadOpened", threadClosed: "threadClosed", pendingArtifactConsumed: "pendingArtifactConsumed", pendingMessageConsumed: "pendingMessageConsumed", pendingMessageRequested: "pendingMessageRequested", composerDraftConsumed: "composerDraftConsumed", composerAgentMentionConsumed: "composerAgentMentionConsumed" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 25, vars: 34, consts: [["emptyStateInput", ""], ["scrollContainer", ""], ["messageInput", ""], [1, "chat-area"], [1, "chat-agent-presence", 3, "chat-agent-presence--prominent"], [1, "chat-header"], [1, "chat-content-area"], [1, "chat-demonstration-stage"], [1, "chat-messages-pane"], [1, "chat-messages-wrapper"], [3, "saved", "cancelled", "isOpen", "artifact", "currentUser"], [3, "pinnedMessages"], [3, "parentMessageId", "conversationId", "currentUser"], [3, "cancelled", "exported", "branding", "isVisible", "conversation", "currentUser"], [3, "Result", "Visible", "Context", "Adapter"], [3, "cancelled", "membersChanged", "isVisible", "conversation", "currentUser"], [1, "modal-overlay"], [3, "isOpen", "environmentId", "currentUser", "excludeCollectionIds", "artifactVersionId", "artifactName", "artifactVersionNumber"], [3, "data", "visible"], [3, "imageUrl", "alt", "fileName", "visible"], [1, "chat-agent-presence"], [3, "State", "AgentName", "AvatarUrl", "Mode"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "chat-info"], ["title", "Show conversations", 1, "sidebar-toggle-btn"], [1, "chat-title"], [1, "shared-by-badge", 3, "title"], ["title", "Assign to project", 1, "project-tag"], ["title", "View Test Run", 1, "test-indicator"], [1, "chat-actions", "chat-actions-buttons"], ["title", "View pinned messages", 1, "pin-chip", 3, "active"], ["title", "View artifacts", 1, "artifact-indicator"], ["title", "View members", 1, "chat-members"], [3, "AgentID", "Disabled"], [3, "Conversation", "CurrentUser", "Disabled"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "title"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "shared", "title"], ["title", "Show conversations", 1, "sidebar-toggle-btn", 3, "click"], [1, "fas", "fa-table-columns"], [1, "fas", "fa-share-nodes"], ["title", "Assign to project", 1, "project-tag", 3, "click"], [1, "fas", "fa-folder"], ["title", "View Test Run", 1, "test-indicator", 3, "click"], [1, "fas", "fa-flask"], ["title", "View pinned messages", 1, "pin-chip", 3, "click"], [1, "fas", "fa-thumbtack"], [1, "pin-chip-count"], ["title", "View artifacts", 1, "artifact-indicator", 3, "click"], [1, "fas", "fa-cube"], [1, "artifact-badge"], ["title", "View members", 1, "chat-members", 3, "click"], [1, "fas", "fa-users"], [1, "members-badge"], [3, "PresetChanged", "AgentID", "Disabled"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "click", "title"], [1, "btn-label"], [1, "conversation-loading-state"], ["text", "Loading conversation...", "size", "large"], [3, "currentUser", "initialDraft", "disabled", "showSidebarToggle", "overlayMode", "greeting", "showSuggestedPrompts", "enableAttachments", "enableMentions", "enableAgentMentions", "enableEntityMentions", "enableSkillCommands", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes"], [3, "initialDraftApplied", "DraftStateChanged", "ComposerBlurred", "sidebarToggleClicked", "messageSent", "currentUser", "initialDraft", "disabled", "showSidebarToggle", "overlayMode", "greeting", "showSuggestedPrompts", "enableAttachments", "enableMentions", "enableAgentMentions", "enableEntityMentions", "enableSkillCommands", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes"], [1, "chat-messages-container"], [1, "chat-input-container"], [1, "message-input-container-wrapper"], [3, "initialDraftApplied", "DraftStateChanged", "ComposerBlurred", "emptyStateSubmit", "emptyStateMode", "initialDraft", "currentUser", "disabled", "enableAttachments", "enableMentions", "enableAgentMentions", "enableEntityMentions", "enableSkillCommands", "enablePlanMode", "enableRealtime", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes"], [1, "upload-indicator-overlay"], [1, "chat-messages-container", 3, "scroll"], [3, "realtimeSessionOpenRequested", "replyInThread", "viewThread", "deleteMessage", "retryMessage", "testFeedbackMessage", "artifactClicked", "messageEdited", "openEntityRecord", "suggestedResponseSelected", "attachmentClicked", "diagnosticRequested", "messagePinToggled", "beforeResponseFormSubmitted", "afterResponseFormSubmitted", "showEmptyFill", "showDateNavigation", "showAgentRunDetails", "showReactions", "showMessageRating", "allowPinning", "allowMessageEdit", "allowMessageDelete", "assistantDisplayName", "assistantAvatarUrl", "messages", "conversation", "currentUser", "isProcessing", "artifactMap", "agentRunMap", "ratingsMap", "userAvatarMap", "attachmentsMap", "messageRendererTemplate", "messageExtraTemplate", "sessionMetaMap"], [1, "scroll-to-bottom-icon", 2, "left", "50%"], [1, "loading-peripheral-placeholder"], ["size", "medium", 3, "text"], [1, "scroll-to-bottom-icon", 2, "left", "50%", 3, "click"], [1, "fas", "fa-arrow-down"], ["text", "Loading conversation data...", "size", "medium"], ["role", "status", 1, "read-only-banner"], [3, "hidden", "initialDraft", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "appContext", "applicationId", "defaultAgentId", "conversationDefaultAgentId", "agentConfigurationPresetId", "inProgressMessageIds", "disabled", "enableAttachments", "enableMentions", "enableAgentMentions", "enableEntityMentions", "enableSkillCommands", "enablePlanMode", "enableRealtime", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes", "initialMessage", "initialAttachments"], [1, "fas", "fa-eye"], [3, "DraftStateChanged", "ComposerBlurred", "initialMessageAutoSendStarted", "initialMessageAutoSendFailed", "messageSent", "agentResponse", "agentRunDetected", "agentRunUpdate", "messageComplete", "artifactCreated", "conversationRenamed", "intentCheckStarted", "intentCheckCompleted", "beforeAgentTurn", "afterAgentTurn", "uploadStateChanged", "hidden", "initialDraft", "conversationId", "conversationName", "currentUser", "conversationHistory", "artifactsByDetailId", "systemArtifactsByDetailId", "agentRunsByDetailId", "appContext", "applicationId", "defaultAgentId", "conversationDefaultAgentId", "agentConfigurationPresetId", "inProgressMessageIds", "disabled", "enableAttachments", "enableMentions", "enableAgentMentions", "enableEntityMentions", "enableSkillCommands", "enablePlanMode", "enableRealtime", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes", "initialMessage", "initialAttachments"], [1, "resize-handle"], [1, "chat-artifact-pane"], [3, "closed", "saveToCollectionRequested", "navigateToLink", "shareRequested", "maximizeToggled", "openEntityRecord", "navigationRequest", "analyzeRequested", "applyFormRequested", "artifactId", "currentUser", "environmentId", "versionNumber", "viewContext", "canShare", "canEdit", "isMaximized", "refreshTrigger"], [1, "resize-handle", 3, "mousedown", "touchstart"], [3, "closed", "jumpRequested", "unpinRequested", "pinnedMessages"], [3, "NavigateRequest", "StartLiveRequested", "ReviewClosed", "AgentName", "Hidden", "CurrentUser", "EnvironmentID", "ReviewData", "Chrome", "Compact", "ShowDevLinks", "ShowDensityPicker"], ["type", "button", "title", "Return to the live call", "aria-label", "Return to the live call", 1, "voice-call-pill"], ["type", "button", "title", "Return to the live call", "aria-label", "Return to the live call", 1, "voice-call-pill", 3, "click"], ["aria-hidden", "true", 1, "voice-call-pill__pulse"], ["aria-hidden", "true", 1, "fa-solid", "fa-phone-volume"], [1, "voice-call-pill__text"], [1, "voice-call-pill__name"], [1, "voice-call-pill__hint"], [3, "closed", "replyAdded", "parentMessageId", "conversationId", "currentUser"], [1, "modal-overlay", 3, "click"], [1, "modal-content", "project-selector-modal", 3, "click"], [1, "modal-header"], [1, "modal-close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "modal-body"], [3, "projectSelected", "environmentId", "currentUser", "selectedProjectId"], [1, "modal-content", "artifacts-modal", 3, "click"], [1, "modal-header-actions"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "active"], [1, "modal-body", "artifacts-grid"], ["Icon", "fa-solid fa-cube", "Title", "No artifacts in this conversation yet", 1, "artifacts-empty-fill"], [1, "artifact-modal-card", 3, "expanded", "system-artifact"], ["title", "Toggle system artifacts visibility", 1, "toggle-system-btn", 3, "click"], [1, "fas", "fa-cog"], [1, "artifact-modal-card"], [1, "artifact-card-header", 3, "click"], [1, "artifact-modal-icon"], [1, "fas", "fa-file-code"], [1, "artifact-modal-info"], [1, "artifact-modal-title"], [1, "artifact-modal-meta"], [1, "expand-btn"], [1, "artifact-modal-action"], [1, "fas", "fa-external-link-alt"], [1, "artifact-versions-list"], [1, "expand-btn", 3, "click"], [1, "fas"], [1, "artifact-version-item"], [1, "artifact-version-item", 3, "click"], [1, "version-badge"], [1, "version-open-text"], [1, "fas", "fa-arrow-right"], [3, "completed", "cancelled", "isOpen", "environmentId", "currentUser", "excludeCollectionIds", "artifactVersionId", "artifactName", "artifactVersionNumber"], [3, "closed", "data", "visible"], [3, "closed", "imageUrl", "alt", "fileName", "visible"]], template: function ConversationChatAreaComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 3);
             i0.ɵɵconditionalCreate(1, ConversationChatAreaComponent_Conditional_1_Template, 3, 3, "div", 4);
-            i0.ɵɵconditionalCreate(2, ConversationChatAreaComponent_Conditional_2_Template, 1, 8, "ng-container")(3, ConversationChatAreaComponent_Conditional_3_Template, 15, 14, "div", 5);
+            i0.ɵɵconditionalCreate(2, ConversationChatAreaComponent_Conditional_2_Template, 1, 8, "ng-container")(3, ConversationChatAreaComponent_Conditional_3_Template, 16, 15, "div", 5);
             i0.ɵɵelementStart(4, "div", 6);
             i0.ɵɵconditionalCreate(5, ConversationChatAreaComponent_Conditional_5_Template, 2, 6, "div", 7);
             i0.ɵɵelementStart(6, "div", 8);
-            i0.ɵɵconditionalCreate(7, ConversationChatAreaComponent_Conditional_7_Template, 2, 0, "div", 9)(8, ConversationChatAreaComponent_Conditional_8_Template, 2, 1)(9, ConversationChatAreaComponent_Conditional_9_Template, 6, 9, "div", 10)(10, ConversationChatAreaComponent_Conditional_10_Template, 9, 15, "div", 10);
+            i0.ɵɵconditionalCreate(7, ConversationChatAreaComponent_Conditional_7_Template, 1, 1)(8, ConversationChatAreaComponent_Conditional_8_Template, 2, 1)(9, ConversationChatAreaComponent_Conditional_9_Template, 6, 14, "div", 9)(10, ConversationChatAreaComponent_Conditional_10_Template, 9, 25, "div", 9);
             i0.ɵɵelementEnd();
             i0.ɵɵconditionalCreate(11, ConversationChatAreaComponent_Conditional_11_Template, 3, 14);
-            i0.ɵɵelementStart(12, "mj-artifact-share-modal", 11);
+            i0.ɵɵelementStart(12, "mj-artifact-share-modal", 10);
             i0.ɵɵlistener("saved", function ConversationChatAreaComponent_Template_mj_artifact_share_modal_saved_12_listener() { return ctx.onArtifactShared(); })("cancelled", function ConversationChatAreaComponent_Template_mj_artifact_share_modal_cancelled_12_listener() { return ctx.onArtifactShareModalClose(); });
             i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(13, ConversationChatAreaComponent_Conditional_13_Template, 1, 1, "mj-pinned-messages-panel", 12);
+            i0.ɵɵconditionalCreate(13, ConversationChatAreaComponent_Conditional_13_Template, 1, 1, "mj-pinned-messages-panel", 11);
             i0.ɵɵelementEnd();
             i0.ɵɵconditionalCreate(14, ConversationChatAreaComponent_Conditional_14_Template, 4, 14);
             i0.ɵɵpipe(15, "async");
             i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(16, ConversationChatAreaComponent_Conditional_16_Template, 1, 3, "mj-thread-panel", 13);
-            i0.ɵɵelementStart(17, "mj-export-modal", 14);
+            i0.ɵɵconditionalCreate(16, ConversationChatAreaComponent_Conditional_16_Template, 1, 3, "mj-thread-panel", 12);
+            i0.ɵɵelementStart(17, "mj-export-modal", 13);
             i0.ɵɵlistener("cancelled", function ConversationChatAreaComponent_Template_mj_export_modal_cancelled_17_listener() { return ctx.onExportModalCancelled(); })("exported", function ConversationChatAreaComponent_Template_mj_export_modal_exported_17_listener() { return ctx.onExportModalComplete(); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(18, "mj-resource-share-dialog", 15);
+            i0.ɵɵelementStart(18, "mj-resource-share-dialog", 14);
             i0.ɵɵlistener("Result", function ConversationChatAreaComponent_Template_mj_resource_share_dialog_Result_18_listener($event) { return ctx.onShareDialogResult($event); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(19, "mj-members-modal", 16);
+            i0.ɵɵelementStart(19, "mj-members-modal", 15);
             i0.ɵɵlistener("cancelled", function ConversationChatAreaComponent_Template_mj_members_modal_cancelled_19_listener() { return ctx.showMembersModal = false; })("membersChanged", function ConversationChatAreaComponent_Template_mj_members_modal_membersChanged_19_listener() { return ctx.showMembersModal = false; });
             i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(20, ConversationChatAreaComponent_Conditional_20_Template, 9, 3, "div", 17);
-            i0.ɵɵconditionalCreate(21, ConversationChatAreaComponent_Conditional_21_Template, 13, 2, "div", 17);
-            i0.ɵɵconditionalCreate(22, ConversationChatAreaComponent_Conditional_22_Template, 1, 7, "mj-artifact-collection-picker-modal", 18);
-            i0.ɵɵconditionalCreate(23, ConversationChatAreaComponent_Conditional_23_Template, 1, 2, "mj-test-feedback-dialog", 19);
-            i0.ɵɵconditionalCreate(24, ConversationChatAreaComponent_Conditional_24_Template, 1, 4, "mj-image-viewer", 20);
+            i0.ɵɵconditionalCreate(20, ConversationChatAreaComponent_Conditional_20_Template, 9, 3, "div", 16);
+            i0.ɵɵconditionalCreate(21, ConversationChatAreaComponent_Conditional_21_Template, 13, 2, "div", 16);
+            i0.ɵɵconditionalCreate(22, ConversationChatAreaComponent_Conditional_22_Template, 1, 7, "mj-artifact-collection-picker-modal", 17);
+            i0.ɵɵconditionalCreate(23, ConversationChatAreaComponent_Conditional_23_Template, 1, 2, "mj-test-feedback-dialog", 18);
+            i0.ɵɵconditionalCreate(24, ConversationChatAreaComponent_Conditional_24_Template, 1, 4, "mj-image-viewer", 19);
         } if (rf & 2) {
             let tmp_1_0;
             i0.ɵɵadvance();
@@ -4246,13 +4359,13 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
             i0.ɵɵadvance();
             i0.ɵɵproperty("isOpen", ctx.isArtifactShareModalOpen)("artifact", ctx.artifactToShare)("currentUser", ctx.currentUser);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.showPinsPanel ? 13 : -1);
+            i0.ɵɵconditional(ctx.allowPinning && ctx.showPinsPanel ? 13 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(i0.ɵɵpipeBind1(15, 31, ctx.RealtimeSession.Active$) || ctx.RealtimeReview ? 14 : -1);
+            i0.ɵɵconditional(i0.ɵɵpipeBind1(15, 32, ctx.RealtimeSession.Active$) || ctx.RealtimeReview ? 14 : -1);
             i0.ɵɵadvance(2);
             i0.ɵɵconditional(ctx.threadId ? 16 : -1);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("isVisible", ctx.showExportModal)("conversation", ctx.conversation || undefined)("currentUser", ctx.currentUser);
+            i0.ɵɵproperty("branding", ctx.exportBranding)("isVisible", ctx.showExportModal)("conversation", ctx.conversation || undefined)("currentUser", ctx.currentUser);
             i0.ɵɵadvance();
             i0.ɵɵproperty("Visible", ctx.showShareModal)("Context", ctx.shareContext)("Adapter", ctx.shareAdapter);
             i0.ɵɵadvance();
@@ -4271,7 +4384,7 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConversationChatAreaComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-conversation-chat-area', template: "<div class=\"chat-area\">\n  <!-- agentPresence slot \u2014 sticky top, anchored with the header. Per Matt's\n       06-10 design: persistent presence indicator (Sid's face + live voice\n       state). Off by default; opt in via [showAgentCharacter]. When a\n       consumer projects an `mjChatSlot=\"agentPresence\"` template, it\n       replaces the default presence component. -->\n  @if (showAgentCharacter) {\n    <div class=\"chat-agent-presence\" [class.chat-agent-presence--prominent]=\"agentCharacterConfig?.voiceStateMode === 'prominent'\">\n      @if (slotTemplate('agentPresence'); as t) {\n        <ng-container *ngTemplateOutlet=\"t; context: {\n          $implicit: agentCharacterConfig,\n          state: agentCharacterConfig?.state ?? 'idle',\n          agentName: agentCharacterConfig?.characterName,\n          avatarUrl: agentCharacterConfig?.avatarUrl,\n          mode: agentCharacterConfig?.voiceStateMode ?? 'subtle'\n        }\"></ng-container>\n      } @else {\n        <mj-chat-agent-presence-default\n          [State]=\"agentCharacterConfig?.state ?? 'idle'\"\n          [AgentName]=\"agentCharacterConfig?.characterName\"\n          [AvatarUrl]=\"agentCharacterConfig?.avatarUrl\"\n          [Mode]=\"agentCharacterConfig?.voiceStateMode ?? 'subtle'\">\n        </mj-chat-agent-presence-default>\n      }\n    </div>\n  }\n\n  <!-- header slot \u2014 replaces the entire chat-header chrome (title, badges,\n       export/share/agent-picker buttons). When projected, the consumer owns\n       the entire header rendering; the default chrome below is bypassed\n       wholesale. Context exposes the minimal IMJChatHeaderComponent shape;\n       consumers needing more app state should bind to chat-area inputs\n       directly via @ViewChild or wrap the whole component. -->\n  @if (slotTemplate('header'); as t) {\n    <ng-container *ngTemplateOutlet=\"t; context: {\n      $implicit: conversation,\n      conversationTitle: conversation?.Name ?? null,\n      sharedBy: sharedByBadge?.display ?? null,\n      artifactCount: artifactCountDisplay,\n      showArtifactIndicator: showArtifactIndicator\n    }\"></ng-container>\n  } @else if (conversation || HasPreConversationHeader) {\n    <!-- Default header \u2014 also renders BEFORE a conversation exists when the\n         embedder has pre-conversation chrome to surface (currently just the\n         mode picker \u2014 agent / share / export / members / artifacts all\n         require a conversation row and stay hidden). Lets embedded surfaces\n         like the Form Builder cockpit show the mode picker above the\n         empty-state on a fresh chat instead of waiting for the first\n         message to round-trip. -->\n    <div class=\"chat-header\">\n      <div class=\"chat-info\" [class.with-sidebar-toggle]=\"showSidebarToggle\">\n        @if (showSidebarToggle) {\n          <button class=\"sidebar-toggle-btn\"\n            (click)=\"sidebarToggleClicked.emit()\"\n            title=\"Show conversations\">\n            <i class=\"fas fa-table-columns\"></i>\n          </button>\n        }\n        @if (conversation) {\n          <div class=\"chat-title\">{{ conversation.Name || '' }}</div>\n        }\n        @if (sharedByBadge) {\n          <span class=\"shared-by-badge\" [title]=\"sharedByBadge.fullTooltip\">\n            <i class=\"fas fa-share-nodes\"></i>\n            <span>Shared by {{ sharedByBadge.display }}</span>\n          </span>\n        }\n        @if (conversation?.ProjectID) {\n          <button class=\"project-tag\" (click)=\"openProjectSelector()\" title=\"Assign to project\">\n            <i class=\"fas fa-folder\"></i>\n            <span>{{ conversation!.Project || 'Project' }}</span>\n          </button>\n        }\n        @if (conversation?.TestRunID) {\n          <button class=\"test-indicator\" (click)=\"viewTestRun(conversation!.TestRunID!)\" title=\"View Test Run\">\n            <i class=\"fas fa-flask\"></i>\n            <span>Test</span>\n          </button>\n        }\n      </div>\n      <div class=\"chat-actions chat-actions-buttons\">\n        @if (pinnedMessages.length > 0) {\n          <button class=\"pin-chip\" [class.active]=\"showPinsPanel\" (click)=\"showPinsPanel = !showPinsPanel\" title=\"View pinned messages\">\n            <i class=\"fas fa-thumbtack\"></i>\n            <span class=\"pin-chip-count\">{{ pinnedMessages.length }}</span>\n          </button>\n        }\n        @if (showArtifactIndicator && artifactCountDisplay > 0) {\n          <button class=\"artifact-indicator\" (click)=\"viewArtifacts()\" title=\"View artifacts\">\n            <i class=\"fas fa-cube\"></i>\n            <span class=\"artifact-badge\">{{ artifactCountDisplay }}</span>\n          </button>\n        }\n        @if (memberCount > 1) {\n          <button class=\"chat-members\" (click)=\"toggleMembersModal()\" title=\"View members\">\n            <i class=\"fas fa-users\"></i>\n            <span class=\"members-badge\">{{ memberCount }}</span>\n          </button>\n        }\n        @if (!overlayMode && showAgentModePicker && ModePickerTargetAgentId) {\n          <!-- Per-agent mode/quality picker (Draft / Standard / High).\n               Targets the agent the next non-mention message will route\n               to. Auto-hides when that agent has fewer than 2 configured\n               presets. Choice persists per-user, per-agent via\n               UserInfoEngine; emits the picked configuration ID up so\n               <mj-message-input> can forward it on the next route.\n               Hidden in overlayMode (the compact chat overlay): the\n               mode dropdown wastes the narrow top-right space there. -->\n          <mj-conversation-mode-picker\n            [AgentID]=\"ModePickerTargetAgentId\"\n            [Disabled]=\"isProcessing\"\n            (PresetChanged)=\"OnAgentModePresetChanged($event)\">\n          </mj-conversation-mode-picker>\n        }\n        @if (showAgentPicker && conversation) {\n          <!-- Per-conversation default-agent pin. When set, non-mention\n               messages route to this agent instead of Sage. Persists to\n               MJConversationEntity.DefaultAgentID. Hidden when no\n               conversation is loaded or when the embedder disables it. -->\n          <mj-conversation-agent-picker\n            [Conversation]=\"conversation\"\n            [CurrentUser]=\"currentUser\"\n            [Disabled]=\"isReadOnlyView\">\n          </mj-conversation-agent-picker>\n        }\n        @if (showExportButton) {\n          <button mjButton variant=\"flat\" size=\"sm\" (click)=\"exportConversation()\" title=\"Export conversation\">\n            <i class=\"fas fa-download\"></i>\n            <span class=\"btn-label\">Export</span>\n          </button>\n        }\n        @if (showShareButton && canShareConversation) {\n          <button mjButton variant=\"flat\" size=\"sm\"\n            [class.shared]=\"isShared\"\n            (click)=\"shareConversation()\"\n            [title]=\"isShared ? 'Manage sharing' : 'Share conversation'\">\n            <i class=\"fas fa-share-nodes\"></i>\n            <span class=\"btn-label\">Share</span>\n          </button>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Messages and Artifact Split Layout \u2014 restructures into [stage | rail]\n       when isDemonstrationActive (per Matt's 06-10 design). The .demonstration-mode\n       class drives the CSS Grid switch; the stage container renders only when the\n       slot is projected AND the host opts in via [showDemonstrationSurface]. -->\n  <div class=\"chat-content-area\" [class.demonstration-mode]=\"isDemonstrationActive\">\n    <!-- demonstrationSurface stage \u2014 takes the main pane; messages shrink to\n         a side rail (or move below on mobile). Off unless both\n         [showDemonstrationSurface] is true AND a slot template is projected. -->\n    @if (isDemonstrationActive) {\n      <div class=\"chat-demonstration-stage\">\n        <ng-container *ngTemplateOutlet=\"slotTemplate('demonstrationSurface'); context: {\n          $implicit: demonstrationSurfaceContent,\n          content: demonstrationSurfaceContent,\n          visible: showDemonstrationSurface\n        }\"></ng-container>\n      </div>\n    }\n\n    <!-- Messages Pane -->\n    <div class=\"chat-messages-pane\"\n      [class.full-width]=\"!showArtifactPanel\"\n      [class.hidden]=\"isArtifactPaneMaximized\">\n      @if (isLoadingConversation) {\n        <!-- Loading State - Show centered spinner while conversation loads (checked FIRST to prevent empty state flash) -->\n        <div class=\"conversation-loading-state\">\n          <mj-loading text=\"Loading conversation...\" size=\"large\"></mj-loading>\n        </div>\n      } @else if ((isNewConversation || !conversationId) && !suppressNewConversationEmptyState) {\n        <!-- emptyState slot \u2014 when a consumer projects mjChatSlot=\"emptyState\",\n             they take over the entire empty-state region (including any send\n             affordance \u2014 the slot interface doesn't include a sendMessage\n             output, so consumers handle send via their own input). When no\n             slot is projected, the rich built-in <mj-conversation-empty-state>\n             renders with its own greeting, prompt chips, and message input.\n             emptyStateConfig (when supplied) takes precedence over the legacy\n             [emptyStateGreeting] string for backwards compatibility. -->\n        @if (slotTemplate('emptyState'); as t) {\n          <ng-container *ngTemplateOutlet=\"t; context: {\n            $implicit: emptyStateConfig,\n            greeting: emptyStateConfig?.greeting ?? emptyStateGreeting,\n            subtext: emptyStateConfig?.subtext,\n            suggestedPrompts: emptyStateConfig?.suggestedPrompts ?? []\n          }\"></ng-container>\n        } @else {\n          <mj-conversation-empty-state\n            [currentUser]=\"currentUser\"\n            [initialDraft]=\"GetInitialDraftFor(null)\"\n            (initialDraftApplied)=\"OnComposerDraftApplied()\"\n            (DraftStateChanged)=\"OnDraftStateChanged(null, $event)\"\n            (ComposerBlurred)=\"OnComposerBlurred()\"\n            [disabled]=\"isProcessing\"\n            [showSidebarToggle]=\"showSidebarToggle\"\n            [overlayMode]=\"overlayMode\"\n            [greeting]=\"emptyStateConfig?.greeting ?? emptyStateGreeting\"\n            [enableAttachments]=\"enableAttachments && allowAttachments\"\n            [enableMentions]=\"allowMentions\"\n            [maxAttachments]=\"maxAttachments\"\n            [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n            [acceptedFileTypes]=\"acceptedFileTypes\"\n            (sidebarToggleClicked)=\"sidebarToggleClicked.emit()\"\n            (messageSent)=\"onEmptyStateMessageSent($event)\">\n          </mj-conversation-empty-state>\n        }\n      } @else if ((isNewConversation || !conversationId) && suppressNewConversationEmptyState) {\n        <!-- Pre-conversation normal-view: empty message list + emptyStateMode input.\n             Used when host (e.g. Form Builder cockpit) wants the header + mode picker\n             visible on first open instead of the centered welcome card. First send\n             routes through onEmptyStateMessageSent which creates the conversation. -->\n        <div class=\"chat-messages-wrapper\">\n          <div class=\"chat-messages-container\"></div>\n          <div class=\"chat-input-container\">\n            <div class=\"message-input-container-wrapper\">\n              <mj-message-input\n                #emptyStateInput\n                [emptyStateMode]=\"true\"\n                [initialDraft]=\"GetInitialDraftFor(null)\"\n                (initialDraftApplied)=\"OnComposerDraftApplied()\"\n            (DraftStateChanged)=\"OnDraftStateChanged(null, $event)\"\n            (ComposerBlurred)=\"OnComposerBlurred()\"\n                [currentUser]=\"currentUser\"\n                [disabled]=\"isProcessing\"\n                [enableAttachments]=\"enableAttachments && allowAttachments\"\n                [enableMentions]=\"allowMentions\"\n                [maxAttachments]=\"maxAttachments\"\n                [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n                [acceptedFileTypes]=\"acceptedFileTypes\"\n                (emptyStateSubmit)=\"onEmptyStateMessageSent($event)\">\n              </mj-message-input>\n            </div>\n          </div>\n        </div>\n      } @else {\n        <!-- Normal Message View -->\n        <div class=\"chat-messages-wrapper\">\n          <!-- Upload Indicator Overlay (centered in conversation area) -->\n          @if (isUploadingAttachments) {\n            <div class=\"upload-indicator-overlay\">\n              <mj-loading [text]=\"uploadingMessage\" size=\"medium\"></mj-loading>\n            </div>\n          }\n          <div class=\"chat-messages-container\" #scrollContainer (scroll)=\"checkScroll()\">\n            <mj-conversation-message-list\n              [messages]=\"messages\"\n              [conversation]=\"conversation\"\n              [currentUser]=\"currentUser\"\n              [isProcessing]=\"isProcessing\"\n              [artifactMap]=\"effectiveArtifactsMap\"\n              [agentRunMap]=\"agentRunsByDetailId\"\n              [ratingsMap]=\"ratingsByDetailId\"\n              [userAvatarMap]=\"userAvatarMap\"\n              [attachmentsMap]=\"attachmentsByDetailId\"\n              [messageRendererTemplate]=\"slotTemplate('messageRenderer')\"\n              [messageExtraTemplate]=\"slotTemplate('messageExtra')\"\n              [sessionMetaMap]=\"realtimeSessionMetaMap\"\n              (realtimeSessionOpenRequested)=\"OpenRealtimeSessionReview($event)\"\n              (replyInThread)=\"onReplyInThread($event)\"\n              (viewThread)=\"onViewThread($event)\"\n              (deleteMessage)=\"onDeleteMessage($event)\"\n              (retryMessage)=\"onRetryMessage($event)\"\n              (testFeedbackMessage)=\"onTestFeedbackMessage($event)\"\n              (artifactClicked)=\"onArtifactClicked($event)\"\n              (messageEdited)=\"onMessageEdited($event)\"\n              (openEntityRecord)=\"onOpenEntityRecord($event)\"\n              (suggestedResponseSelected)=\"onSuggestedResponseSelected($event)\"\n              (attachmentClicked)=\"onAttachmentClicked($event)\"\n              (diagnosticRequested)=\"onDiagnosticRequested($event)\"\n              (messagePinToggled)=\"onMessagePinToggled($event)\"\n              (beforeResponseFormSubmitted)=\"beforeResponseFormSubmitted.emit($event)\"\n              (afterResponseFormSubmitted)=\"afterResponseFormSubmitted.emit($event)\">\n            </mj-conversation-message-list>\n\n            <!-- Scroll to Bottom Icon (positioned within scroll container for proper centering) -->\n            @if (showScrollToBottomIcon && messages && messages.length > 0) {\n              <span class=\"scroll-to-bottom-icon\" style=\"left: 50%;\"\n                (click)=\"scrollToBottomAnimate()\">\n                <i class=\"fas fa-arrow-down\"></i>\n              </span>\n            }\n          </div>\n\n          <!-- Fixed Input Area -->\n          <div class=\"chat-input-container\">\n            @if (isLoadingPeripheralData) {\n              <!-- Loading State -->\n              <div class=\"loading-peripheral-placeholder\">\n                <mj-loading text=\"Loading conversation data...\" size=\"medium\"></mj-loading>\n              </div>\n            } @else {\n              @if (isReadOnlyView) {\n                <div class=\"read-only-banner\" role=\"status\">\n                  <i class=\"fas fa-eye\"></i>\n                  <span>You have view-only access to this conversation.</span>\n                </div>\n              }\n              <!-- Input Component - Multiple instances cached, only one visible -->\n              <div class=\"message-input-container-wrapper\">\n                @for (inputRef of getCachedInputs(); track inputRef.conversationId) {\n                  <mj-message-input\n                    #messageInput\n                    [hidden]=\"inputRef.conversationId !== conversationId\"\n                    [initialDraft]=\"GetInitialDraftFor(inputRef.conversationId)\"\n                    (DraftStateChanged)=\"OnDraftStateChanged(inputRef.conversationId, $event)\"\n                    (ComposerBlurred)=\"OnComposerBlurred()\"\n                    [conversationId]=\"inputRef.conversationId\"\n                    [conversationName]=\"inputRef.conversationName\"\n                    [currentUser]=\"currentUser\"\n                    [conversationHistory]=\"inputRef.conversationId === conversationId ? messages : []\"\n                    [artifactsByDetailId]=\"inputRef.conversationId === conversationId ? artifactsByDetailId : emptyArtifactsMap\"\n                    [systemArtifactsByDetailId]=\"inputRef.conversationId === conversationId ? systemArtifactsByDetailId : emptyArtifactsMap\"\n                    [agentRunsByDetailId]=\"inputRef.conversationId === conversationId ? agentRunsByDetailId : emptyAgentRunsMap\"\n                    [appContext]=\"appContext\"\n                    [applicationId]=\"applicationId\"\n                    [defaultAgentId]=\"defaultAgentId\"\n                    [conversationDefaultAgentId]=\"inputRef.conversationId === conversationId ? (conversation?.DefaultAgentID ?? null) : null\"\n                    [agentConfigurationPresetId]=\"inputRef.conversationId === conversationId ? ActiveAgentConfigurationPresetId : null\"\n                    [inProgressMessageIds]=\"inputRef.conversationId === conversationId ? inProgressMessageIds : emptyInProgressIds\"\n                    [disabled]=\"isProcessing || isReadOnlyView\"\n                    [enableAttachments]=\"enableAttachments && allowAttachments\"\n                    [enableMentions]=\"allowMentions\"\n                    [maxAttachments]=\"maxAttachments\"\n                    [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n                    [acceptedFileTypes]=\"acceptedFileTypes\"\n                    [initialMessage]=\"shouldDeliverPendingMessageTo(inputRef.conversationId) ? pendingMessage : null\"\n                    [initialAttachments]=\"shouldDeliverPendingMessageTo(inputRef.conversationId) ? pendingAttachments : null\"\n                    (initialMessageAutoSendStarted)=\"onInitialMessageAutoSendStarted($event)\"\n                    (initialMessageAutoSendFailed)=\"onInitialMessageAutoSendFailed($event)\"\n                    (messageSent)=\"onMessageSent($event)\"\n                    (agentResponse)=\"onAgentResponse($event)\"\n                    (agentRunDetected)=\"onAgentRunDetected($event)\"\n                    (agentRunUpdate)=\"onAgentRunUpdate($event)\"\n                    (messageComplete)=\"onMessageComplete($event)\"\n                    (artifactCreated)=\"onArtifactCreated($event)\"\n                    (conversationRenamed)=\"onConversationRenamed($event)\"\n                    (intentCheckStarted)=\"onIntentCheckStarted($event)\"\n                    (intentCheckCompleted)=\"onIntentCheckCompleted($event)\"\n                    (beforeAgentTurn)=\"beforeAgentTurn.emit($event)\"\n                    (afterAgentTurn)=\"afterAgentTurn.emit($event)\"\n                    (uploadStateChanged)=\"onUploadStateChanged($event)\">\n                  </mj-message-input>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      }\n    </div>\n\n    <!-- Artifact Viewer Pane -->\n    @if (showArtifactPanel && selectedArtifactId) {\n      @if (!isArtifactPaneMaximized) {\n        <div class=\"resize-handle\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n      }\n      <div class=\"chat-artifact-pane\"\n        [style.width.%]=\"artifactPaneWidth\"\n        [class.maximized]=\"isArtifactPaneMaximized\">\n        <mj-artifact-viewer-panel\n          [artifactId]=\"selectedArtifactId\"\n          [currentUser]=\"currentUser\"\n          [environmentId]=\"environmentId\"\n          [versionNumber]=\"selectedVersionNumber\"\n          [viewContext]=\"'conversation'\"\n          [canShare]=\"canShareSelectedArtifact\"\n          [canEdit]=\"canEditSelectedArtifact\"\n          [isMaximized]=\"isArtifactPaneMaximized\"\n          [refreshTrigger]=\"artifactViewerRefresh$\"\n          (closed)=\"onCloseArtifactPanel()\"\n          (saveToCollectionRequested)=\"onSaveToCollectionRequested($event)\"\n          (navigateToLink)=\"onArtifactLinkNavigation($event)\"\n          (shareRequested)=\"onArtifactShareRequested($event)\"\n          (maximizeToggled)=\"toggleMaximizeArtifactPane()\"\n          (openEntityRecord)=\"onOpenEntityRecord($event)\"\n          (navigationRequest)=\"onNavigationRequest($event)\"\n          (analyzeRequested)=\"OnAnalyzeArtifact($event)\"\n          (applyFormRequested)=\"OnApplyFormRequested($event)\">\n        </mj-artifact-viewer-panel>\n      </div>\n    }\n\n    <!-- Artifact Share Modal -->\n    <mj-artifact-share-modal\n      [isOpen]=\"isArtifactShareModalOpen\"\n      [artifact]=\"artifactToShare\"\n      [currentUser]=\"currentUser\"\n      (saved)=\"onArtifactShared()\"\n      (cancelled)=\"onArtifactShareModalClose()\">\n    </mj-artifact-share-modal>\n\n    <!-- Pinned Messages Panel (overlay) -->\n    @if (showPinsPanel) {\n      <mj-pinned-messages-panel\n        [pinnedMessages]=\"pinnedMessages\"\n        (closed)=\"showPinsPanel = false\"\n        (jumpRequested)=\"onJumpToMessage($event)\"\n        (unpinRequested)=\"onUnpinFromPanel($event)\">\n      </mj-pinned-messages-panel>\n    }\n  </div>\n\n  <!-- Live voice \"call mode\" overlay \u2014 fills this conversation panel in place\n       (header + thread + composer) while a realtime session is active. When the\n       call is MINIMIZED (e.g. a dev link navigated to a record) the overlay HIDES\n       (not destroyed \u2014 its merged session state must survive), the session stays\n       fully live, and a floating \"on call\" pill offers the way back.\n       ALSO hosted in SESSION REVIEW mode (RealtimeReview set, no live call): the\n       overlay renders what went down in a PAST session, with a \"Start live session\"\n       button that resumes it as a new call. -->\n  @if ((RealtimeSession.Active$ | async) || RealtimeReview) {\n    <mj-realtime-session-overlay\n      [AgentName]=\"realtimeOverlayAgentName\"\n      [Hidden]=\"(RealtimeSession.Minimized$ | async) === true\"\n      [CurrentUser]=\"currentUser\"\n      [EnvironmentID]=\"environmentId\"\n      [ReviewData]=\"RealtimeReview\"\n      [Chrome]=\"overlayMode ? 'orb' : 'auto'\"\n      [Compact]=\"overlayMode\"\n      [ShowDevLinks]=\"!overlayMode\"\n      [ShowDensityPicker]=\"!overlayMode\"\n      (NavigateRequest)=\"onRealtimeNavigateRequest($event)\"\n      (StartLiveRequested)=\"onReviewStartLive($event)\"\n      (ReviewClosed)=\"onReviewClosed()\">\n    </mj-realtime-session-overlay>\n    @if (RealtimeSession.Minimized$ | async) {\n      <button type=\"button\" class=\"voice-call-pill\" (click)=\"RealtimeSession.SetMinimized(false)\"\n              title=\"Return to the live call\" aria-label=\"Return to the live call\">\n        <span class=\"voice-call-pill__pulse\" aria-hidden=\"true\"></span>\n        <i class=\"fa-solid fa-phone-volume\" aria-hidden=\"true\"></i>\n        <span class=\"voice-call-pill__text\">\n          <span class=\"voice-call-pill__name\">On call \u00B7 {{ RealtimeSession.CurrentAgentName }}</span>\n          <span class=\"voice-call-pill__hint\">Tap to return</span>\n        </span>\n      </button>\n    }\n  }\n</div>\n\n<!-- Thread Panel -->\n@if (threadId) {\n  <mj-thread-panel\n    [parentMessageId]=\"threadId\"\n    [conversationId]=\"conversationId || ''\"\n    [currentUser]=\"currentUser\"\n    (closed)=\"onLocalThreadClosed()\"\n    (replyAdded)=\"onThreadReplyAdded($event)\">\n  </mj-thread-panel>\n}\n\n<!-- Export Modal -->\n<mj-export-modal\n  [isVisible]=\"showExportModal\"\n  [conversation]=\"conversation || undefined\"\n  [currentUser]=\"currentUser\"\n  (cancelled)=\"onExportModalCancelled()\"\n  (exported)=\"onExportModalComplete()\">\n</mj-export-modal>\n\n<!-- Share Dialog (generic, shared with dashboards) -->\n<mj-resource-share-dialog\n  [Visible]=\"showShareModal\"\n  [Context]=\"shareContext\"\n  [Adapter]=\"shareAdapter\"\n  (Result)=\"onShareDialogResult($event)\">\n</mj-resource-share-dialog>\n\n<!-- Members Modal -->\n<mj-members-modal\n  [isVisible]=\"showMembersModal\"\n  [conversation]=\"conversation || undefined\"\n  [currentUser]=\"currentUser\"\n  (cancelled)=\"showMembersModal = false\"\n  (membersChanged)=\"showMembersModal = false\">\n</mj-members-modal>\n\n<!-- Project Selector Modal -->\n@if (showProjectSelector && conversation) {\n  <div class=\"modal-overlay\" (click)=\"showProjectSelector = false\">\n    <div class=\"modal-content project-selector-modal\" (click)=\"$event.stopPropagation()\">\n      <div class=\"modal-header\">\n        <h3>Assign Project</h3>\n        <button class=\"modal-close-btn\" (click)=\"showProjectSelector = false\">\n          <i class=\"fas fa-times\"></i>\n        </button>\n      </div>\n      <div class=\"modal-body\">\n        <mj-project-selector\n          [environmentId]=\"environmentId\"\n          [currentUser]=\"currentUser\"\n          [selectedProjectId]=\"conversation.ProjectID\"\n          (projectSelected)=\"onProjectSelected($event)\">\n        </mj-project-selector>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Artifacts Modal -->\n@if (showArtifactsModal) {\n  <div class=\"modal-overlay\" (click)=\"showArtifactsModal = false\">\n    <div class=\"modal-content artifacts-modal\" (click)=\"$event.stopPropagation()\">\n      <div class=\"modal-header\">\n        <h3>Conversation Artifacts</h3>\n        <div class=\"modal-header-actions\">\n          @if (hasSystemArtifacts) {\n            <button class=\"toggle-system-btn\"\n              [class.active]=\"showSystemArtifacts\"\n              (click)=\"toggleSystemArtifacts()\"\n              title=\"Toggle system artifacts visibility\">\n              <i class=\"fas fa-cog\"></i>\n              <span>{{ showSystemArtifacts ? 'Hide' : 'Show' }} System</span>\n            </button>\n          }\n          <button class=\"modal-close-btn\" (click)=\"showArtifactsModal = false\">\n            <i class=\"fas fa-times\"></i>\n          </button>\n        </div>\n      </div>\n      <div class=\"modal-body artifacts-grid\">\n        @if (artifactsByDetailId.size === 0) {\n          <mj-empty-state\n            class=\"artifacts-empty-fill\"\n            Icon=\"fa-solid fa-cube\"\n            Title=\"No artifacts in this conversation yet\" />\n        }\n        @for (artifact of getArtifactsArray(); track artifact.artifactId) {\n          <div class=\"artifact-modal-card\"\n            [class.expanded]=\"expandedArtifactId === artifact.artifactId\"\n            [class.system-artifact]=\"artifact.visibility === 'System Only'\">\n            <!-- Main card header - click to open latest version -->\n            <div class=\"artifact-card-header\" (click)=\"openArtifactFromModal(artifact.artifactId)\">\n              <div class=\"artifact-modal-icon\">\n                <i class=\"fas fa-file-code\"></i>\n              </div>\n              <div class=\"artifact-modal-info\">\n                <div class=\"artifact-modal-title\">{{artifact.name}}</div>\n                <div class=\"artifact-modal-meta\">\n                  @if (artifact.versionCount > 1) {\n                    {{artifact.versionCount}} versions\n                  } @else {\n                    1 version\n                  }\n                </div>\n              </div>\n              @if (artifact.versionCount > 1) {\n                <button class=\"expand-btn\" (click)=\"toggleArtifactExpansion(artifact.artifactId, $event)\">\n                  <i class=\"fas\" [class.fa-chevron-down]=\"expandedArtifactId !== artifact.artifactId\"\n                  [class.fa-chevron-up]=\"expandedArtifactId === artifact.artifactId\"></i>\n                </button>\n              }\n              <div class=\"artifact-modal-action\">\n                <i class=\"fas fa-external-link-alt\"></i>\n              </div>\n            </div>\n\n            <!-- Expanded version list -->\n            @if (expandedArtifactId === artifact.artifactId && artifact.versionCount > 1) {\n              <div class=\"artifact-versions-list\">\n                @for (version of artifact.versions; track version.versionId) {\n                  <div class=\"artifact-version-item\" (click)=\"openArtifactFromModal(artifact.artifactId, version.versionNumber); $event.stopPropagation()\">\n                    <span class=\"version-badge\">v{{version.versionNumber}}</span>\n                    <span class=\"version-open-text\">Open this version</span>\n                    <i class=\"fas fa-arrow-right\"></i>\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Collection Picker Modal -->\n@if (showCollectionPicker) {\n  <mj-artifact-collection-picker-modal\n    [isOpen]=\"showCollectionPicker\"\n    [environmentId]=\"environmentId\"\n    [currentUser]=\"currentUser\"\n    [excludeCollectionIds]=\"collectionPickerExcludedIds\"\n    [artifactVersionId]=\"collectionPickerVersionId\"\n    [artifactName]=\"collectionPickerArtifactName\"\n    [artifactVersionNumber]=\"collectionPickerVersionNumber\"\n    (completed)=\"onCollectionPickerCompleted($event)\"\n    (cancelled)=\"onCollectionPickerCancelled()\">\n  </mj-artifact-collection-picker-modal>\n}\n\n<!-- Test Feedback Dialog -->\n@if (testFeedbackDialogData) {\n  <mj-test-feedback-dialog\n    [data]=\"testFeedbackDialogData\"\n    [visible]=\"showTestFeedbackDialog\"\n    (closed)=\"onTestFeedbackDialogClosed($event)\">\n  </mj-test-feedback-dialog>\n}\n\n<!-- Image Viewer Modal -->\n@if (showImageViewer) {\n  <mj-image-viewer\n    [imageUrl]=\"selectedImageUrl\"\n    [alt]=\"selectedImageAlt\"\n    [fileName]=\"selectedImageFileName\"\n    [visible]=\"showImageViewer\"\n    (closed)=\"onImageViewerClosed()\">\n  </mj-image-viewer>\n}\n", styles: [":host {\n  display: flex;\n  width: 100%;\n  height: 100%;\n}\n\n.chat-area {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  /* Positioned context for the in-place realtime \"call mode\" overlay (absolute inset:0) */\n  position: relative;\n}\n\n.chat-header {\n  flex-shrink: 0;\n  padding: 12px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 16px;\n  background: var(--mj-bg-surface-card);\n  z-index: 10;\n  box-shadow: var(--mj-shadow-sm);\n}\n\n/* agentPresence slot \u2014 sticky top, anchored with the header. Per Matt's\n   06-10 placement design: persistent presence indicator above the messages.\n   Renders only when [showAgentCharacter] is true, so existing embeds see no\n   layout change. The prominent variant grows toward a centered presence\n   (per Matt: \"can grow larger toward a centered presence\"). */\n.chat-agent-presence {\n  flex-shrink: 0;\n  padding: 8px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n  display: flex;\n  align-items: center;\n  z-index: 11;\n}\n\n.chat-agent-presence--prominent {\n  padding: 16px 20px;\n  justify-content: center;\n}\n\n.chat-info {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n\n/* Sidebar toggle button in header */\n.sidebar-toggle-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  background: transparent;\n  border: none;\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  flex-shrink: 0;\n}\n\n.sidebar-toggle-btn:hover {\n  background: color-mix(in srgb, var(--mj-text-primary) 8%, transparent);\n}\n\n.sidebar-toggle-btn:active {\n  background: color-mix(in srgb, var(--mj-text-primary) 12%, transparent);\n}\n\n.sidebar-toggle-btn i {\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: color 0.15s ease;\n}\n\n.sidebar-toggle-btn:hover i {\n  color: var(--mj-text-primary);\n}\n\n.chat-title {\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.shared-by-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 3px 10px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n  color: var(--mj-brand-primary);\n  border-radius: 999px;\n  font-size: 12px;\n  font-weight: 500;\n  flex-shrink: 0;\n  max-width: 240px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.shared-by-badge i {\n  font-size: 10px;\n}\n\n.shared-by-badge span {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.project-tag {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 12px;\n}\n\n.project-tag:hover {\n  background: var(--mj-border-default);\n  border-color: var(--mj-text-muted);\n}\n\n.project-tag i {\n  font-size: 10px;\n}\n\n.test-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: color-mix(in srgb, var(--mj-status-warning) 10%, var(--mj-bg-surface));\n  border: 1px solid var(--mj-status-warning);\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--mj-status-warning);\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 8px;\n}\n\n.test-indicator:hover {\n  background: color-mix(in srgb, var(--mj-status-warning) 20%, var(--mj-bg-surface));\n  border-color: var(--mj-status-warning);\n}\n\n.test-indicator i {\n  font-size: 10px;\n}\n\n/* Pinned messages chip in chat header */\n.pin-chip {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n  padding: 5px 10px;\n  background: color-mix(in srgb, var(--mj-status-warning) 12%, var(--mj-bg-surface));\n  border: 1px solid color-mix(in srgb, var(--mj-status-warning) 45%, transparent);\n  border-radius: 20px;\n  color: var(--mj-status-warning-text, var(--mj-status-warning));\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s;\n}\n\n.pin-chip i {\n  font-size: 11px;\n}\n\n.pin-chip:hover,\n.pin-chip.active {\n  background: color-mix(in srgb, var(--mj-status-warning) 20%, var(--mj-bg-surface));\n  border-color: var(--mj-status-warning);\n}\n\n.pin-chip-count {\n  font-size: 12px;\n  font-weight: 700;\n}\n\n.chat-members,\n.artifact-indicator {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  padding: 6px 8px;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.chat-members:hover,\n.artifact-indicator:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n/* Badge overlay for artifact and member counts */\n.artifact-badge,\n.members-badge {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n}\n\n.members-badge {\n  background: var(--mj-brand-primary);\n}\n\n.ambient-agent-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n  animation: pulse 2s ease-in-out infinite;\n}\n\n.ambient-agent-indicator i {\n  color: var(--mj-brand-primary);\n}\n\n@keyframes pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\n}\n.chat-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.action-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  cursor: pointer;\n  border-radius: 6px;\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n  transition: all 150ms ease;\n}\n\n.action-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.share-btn.shared {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-color: var(--mj-brand-primary-hover);\n  color: var(--mj-brand-primary-hover);\n}\n\n.share-btn.shared:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary-hover);\n}\n\n.chat-content-area {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: row;\n  position: relative;\n}\n\n.chat-messages-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  min-width: min(300px, 100%); /* Respect container bounds while maintaining minimum */\n  overflow: hidden;\n  transition: width 0.3s ease;\n}\n\n.chat-messages-pane.full-width {\n  width: 100%;\n}\n\n.chat-messages-pane:not(.full-width) {\n  flex: 1;\n}\n\n.chat-messages-pane.hidden {\n  display: none;\n}\n\n.resize-handle {\n  width: 4px;\n  background: transparent;\n  cursor: col-resize;\n  flex-shrink: 0;\n  position: relative;\n  transition: background-color 0.2s;\n}\n\n.resize-handle:hover {\n  background: var(--mj-brand-primary);\n}\n\n.resize-handle::before {\n  content: \"\";\n  position: absolute;\n  left: -4px;\n  right: -4px;\n  top: 0;\n  bottom: 0;\n}\n\n.chat-artifact-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-surface-sunken);\n  overflow: hidden;\n  flex-shrink: 0;\n}\n\n.chat-artifact-pane.maximized {\n  width: 100% !important;\n}\n\n.chat-artifact-pane > mj-artifact-viewer-panel {\n  display: flex;\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.chat-messages-wrapper {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  overflow: hidden;\n  position: relative; /* For upload overlay positioning */\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   demonstrationSurface layout-mode (Matt's 06-10 placement design)\n   \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   When .chat-content-area gets .demonstration-mode, the layout flips\n   from \"messages pane (+ optional artifact pane)\" to \"stage + side rail\":\n     - stage (.chat-demonstration-stage) \u2014 left, flexible, holds the\n       consumer's projected demonstrationSurface slot template\n     - rail (.chat-messages-pane) \u2014 right, fixed-width 320px, holds the\n       messages list + composer (\"the conversation as a companion rail\")\n   On mobile (\u2264768px) the same two stack vertically (stage above, rail\n   below) per Matt's note about mobile. The rail intentionally keeps the\n   composer inside it \u2014 Matt's design refers to the conversation rail\n   inclusively (messages + composer together), not as separate regions.\n*/\n.chat-demonstration-stage {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  background: var(--mj-bg-surface);\n  border-right: 1px solid var(--mj-border-default);\n  flex: 1;\n  min-width: 0;\n}\n\n.chat-content-area.demonstration-mode .chat-messages-pane,\n.chat-content-area.demonstration-mode .chat-messages-pane.full-width {\n  flex: 0 0 320px;\n  width: 320px;\n  min-width: 0;\n}\n\n@media (max-width: 768px) {\n  .chat-content-area.demonstration-mode {\n    flex-direction: column;\n  }\n\n  .chat-content-area.demonstration-mode .chat-demonstration-stage {\n    flex: 1 1 60%;\n    border-right: none;\n    border-bottom: 1px solid var(--mj-border-default);\n    height: auto;\n  }\n\n  .chat-content-area.demonstration-mode .chat-messages-pane,\n  .chat-content-area.demonstration-mode .chat-messages-pane.full-width {\n    flex: 1 1 40%;\n    width: 100%;\n    height: auto;\n  }\n}\n\n/* Upload indicator overlay - centered in conversation area */\n.upload-indicator-overlay {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 1rem 1.5rem;\n  background: color-mix(in srgb, var(--mj-bg-surface-card) 95%, transparent);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-md);\n  z-index: 100;\n  pointer-events: none;\n}\n\n.chat-messages-container {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  background: var(--mj-bg-surface-card);\n  min-height: 0;\n  position: relative;\n}\n\n.scroll-to-bottom-icon {\n  position: sticky;\n  bottom: 21px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 40px;\n  height: 40px;\n  margin-top: -40px;\n  margin-left: auto;\n  margin-right: auto;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  box-shadow: var(--mj-shadow-md);\n  transition: all 0.2s ease;\n  z-index: 100;\n  pointer-events: auto;\n}\n\n.scroll-to-bottom-icon:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-color: var(--mj-brand-primary);\n  transform: translateX(-50%) translateY(-2px);\n  box-shadow: color-mix(in srgb, var(--mj-brand-primary) 20%, transparent) 0 4px 12px;\n}\n\n.scroll-to-bottom-icon i {\n  color: var(--mj-text-secondary);\n  font-size: 16px;\n  transition: color 0.2s;\n}\n\n.scroll-to-bottom-icon:hover i {\n  color: var(--mj-brand-primary);\n}\n\n.chat-input-container {\n  flex-shrink: 0;\n  background: var(--mj-bg-surface-card);\n  padding: 0 1.25rem 1.25rem 1.25rem;\n  overflow: visible;\n}\n\n.read-only-banner {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin: 0 1.25rem 0.5rem 1.25rem;\n  padding: 8px 12px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  font-size: 12px;\n}\n\n.read-only-banner i {\n  color: var(--mj-brand-primary);\n  font-size: 12px;\n}\n\n.loading-peripheral-placeholder {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 140px;\n  padding: 24px;\n  background: color-mix(in srgb, var(--mj-bg-surface-card) 50%, transparent);\n  backdrop-filter: blur(2px);\n  border-radius: 12px;\n  margin: 12px;\n  animation: fadeIn 0.2s ease-in-out;\n}\n\n.modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n}\n\n.modal-content {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-md);\n  max-width: 90vw;\n  max-height: 90vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.project-selector-modal {\n  width: 600px;\n  height: 500px;\n}\n\n.modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.modal-header h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n}\n\n.modal-header-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.toggle-system-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  padding: 6px 12px;\n  border-radius: 6px;\n  font-size: 13px;\n  font-weight: 500;\n  transition: all 0.2s;\n}\n\n.toggle-system-btn:hover {\n  background: var(--mj-border-default);\n  border-color: var(--mj-border-default);\n  color: var(--mj-text-primary);\n}\n\n.toggle-system-btn.active {\n  background: var(--mj-brand-primary);\n  border-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n.toggle-system-btn.active:hover {\n  background: var(--mj-brand-primary-hover);\n  border-color: var(--mj-brand-primary-hover);\n}\n\n.toggle-system-btn i {\n  font-size: 12px;\n}\n\n.modal-close-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.2s;\n}\n\n.modal-close-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.modal-body {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n}\n\n.artifacts-modal {\n  width: 700px;\n  max-height: 600px;\n}\n\n.artifacts-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 16px;\n}\n\n/* Empty-state spans the full artifacts grid */\n.artifacts-empty-fill {\n  grid-column: 1/-1;\n}\n\n.artifact-modal-card {\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-surface-card);\n  border: 1.5px solid var(--mj-border-default);\n  border-radius: 12px;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  overflow: hidden;\n}\n\n.artifact-modal-card.expanded {\n  border-color: var(--mj-brand-primary);\n}\n\n.artifact-modal-card.system-artifact {\n  opacity: 0.85;\n  border-color: var(--mj-border-default);\n  border-style: dashed;\n  position: relative;\n}\n\n.artifact-modal-card.system-artifact::before {\n  content: \"SYSTEM\";\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  font-size: 9px;\n  font-weight: 600;\n  color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-sunken);\n  padding: 2px 6px;\n  border-radius: 3px;\n  letter-spacing: 0.5px;\n  z-index: 10;\n}\n\n.artifact-modal-card.system-artifact:hover {\n  border-color: var(--mj-text-muted);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.artifact-card-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px;\n  cursor: pointer;\n}\n\n.artifact-card-header:hover {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.artifact-modal-card:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: var(--mj-shadow-md);\n  transform: translateY(-2px);\n}\n\n.artifact-modal-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-radius: 10px;\n  color: var(--mj-brand-primary);\n  flex-shrink: 0;\n}\n\n.artifact-modal-icon i {\n  font-size: 18px;\n}\n\n.artifact-modal-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.artifact-modal-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  margin-bottom: 4px;\n}\n\n.artifact-modal-meta {\n  font-size: 12px;\n  color: var(--mj-text-secondary);\n}\n\n.artifact-modal-action {\n  color: var(--mj-text-muted);\n  transition: color 0.2s;\n}\n\n.artifact-modal-card:hover .artifact-modal-action {\n  color: var(--mj-brand-primary);\n}\n\n.expand-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  border-radius: 6px;\n  transition: all 0.2s;\n}\n.expand-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-brand-primary);\n}\n\n.artifact-versions-list {\n  display: flex;\n  flex-direction: column;\n  padding: 0 1rem 1rem 1rem;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.artifact-version-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px 12px 68px;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.artifact-version-item:hover {\n  background: var(--mj-bg-surface-sunken);\n}\n.artifact-version-item .version-badge {\n  display: inline-block;\n  padding: 4px 8px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  font-size: 12px;\n  font-weight: 600;\n  font-family: monospace;\n  border-radius: 4px;\n}\n.artifact-version-item .version-open-text {\n  flex: 1;\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n}\n.artifact-version-item i {\n  color: var(--mj-text-muted);\n  font-size: 12px;\n}\n.artifact-version-item:hover .version-badge {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n.artifact-version-item:hover .version-open-text {\n  color: var(--mj-brand-primary);\n}\n.artifact-version-item:hover i {\n  color: var(--mj-brand-primary);\n}\n\n.loading-peripheral-content {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px 24px;\n  background: var(--mj-bg-surface-card);\n  border: 2px solid var(--mj-border-default);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-md);\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n}\n.loading-peripheral-content i {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.conversation-loading-state {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n}\n\n.loading-content {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding-top: 20px;\n  gap: 16px;\n  color: var(--mj-text-secondary);\n  font-size: 15px;\n}\n.loading-content i {\n  font-size: 32px;\n  color: var(--mj-brand-primary);\n}\n.loading-content span {\n  font-weight: 500;\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n  .chat-header {\n    padding: 8px 12px;\n    gap: 6px;\n    flex-direction: row;\n    flex-wrap: wrap;\n    align-items: center;\n    position: relative;\n  }\n  .chat-info {\n    flex-direction: row;\n    align-items: center;\n    gap: 8px;\n    flex: 1;\n    min-width: 0;\n    order: 1;\n  }\n  .chat-title {\n    font-size: 15px;\n    font-weight: 700;\n    width: auto;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    flex: 1;\n    min-width: 0;\n  }\n  .project-tag {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n    display: none; /* Hide on mobile to save space */\n  }\n  .test-indicator {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n  }\n  /* Action buttons - icon only on mobile */\n  .chat-actions-buttons {\n    order: 2;\n    flex-shrink: 0;\n  }\n  .chat-actions-buttons .action-btn {\n    padding: 6px 8px;\n    min-width: auto;\n  }\n  .chat-actions-buttons .action-btn .btn-label {\n    display: none;\n  }\n  .chat-actions {\n    flex-wrap: nowrap;\n  }\n  .chat-members,\n  .artifact-indicator {\n    padding: 5px 7px;\n    font-size: 13px;\n  }\n  .action-btn {\n    padding: 6px 8px;\n    font-size: 12px;\n  }\n  .ambient-agent-indicator {\n    font-size: 12px;\n    padding: 4px 8px;\n  }\n  .project-selector-modal {\n    width: min(95vw, 600px);\n    height: auto;\n  }\n  .artifacts-modal {\n    width: min(95vw, 700px);\n  }\n  .artifacts-grid {\n    grid-template-columns: 1fr;\n  }\n  .chat-input-container {\n    padding: 0 0.75rem 0.75rem 0.75rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 16px;\n    width: 36px;\n    height: 36px;\n  }\n  /* Artifact pane - full width overlay on mobile, overlapping header */\n  .chat-content-area {\n    position: relative;\n  }\n  .chat-artifact-pane {\n    position: fixed;\n    left: 0;\n    right: 0;\n    top: 56px; /* 48px nav + 8px dark strip above blue border */\n    bottom: 0;\n    width: 100% !important;\n    z-index: 100;\n    background: var(--mj-bg-surface-card);\n  }\n  .resize-handle {\n    display: none;\n  }\n}\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n  .chat-header {\n    padding: 6px 8px;\n    gap: 4px;\n  }\n  .chat-title {\n    font-size: 14px;\n    font-weight: 700;\n  }\n  .project-tag {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n    display: none;\n  }\n  .test-indicator {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n  }\n  .chat-members,\n  .artifact-indicator {\n    padding: 4px 8px;\n    font-size: 11px;\n  }\n  .action-btn {\n    padding: 5px 7px;\n    font-size: 11px;\n  }\n  .ambient-agent-indicator {\n    font-size: 11px;\n    padding: 3px 6px;\n  }\n  .project-selector-modal,\n  .artifacts-modal {\n    width: 100vw;\n    height: 100vh;\n    border-radius: 0;\n  }\n  .chat-input-container {\n    padding: 0 0.5rem 0.5rem 0.5rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 12px;\n    width: 32px;\n    height: 32px;\n  }\n  .scroll-to-bottom-icon i {\n    font-size: 14px;\n  }\n}\n\n/* Artifact Picker Panel */\n.artifact-picker-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: var(--mj-bg-overlay);\n  z-index: 999;\n}\n\n.artifact-picker-panel {\n  position: fixed;\n  right: 0;\n  top: 0;\n  width: 360px;\n  height: 100%;\n  background: var(--mj-bg-surface);\n  border-left: 1px solid var(--mj-border-default);\n  z-index: 1000;\n  display: flex;\n  flex-direction: column;\n  box-shadow: -4px 0 12px rgba(0, 0, 0, 0.1);\n  animation: slideInRight 0.2s ease-out;\n}\n\n@keyframes slideInRight {\n  from { transform: translateX(100%); }\n  to { transform: translateX(0); }\n}\n\n.artifact-picker-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.artifact-picker-header h3 {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.artifact-picker-close {\n  background: none;\n  border: none;\n  cursor: pointer;\n  padding: 4px 8px;\n  color: var(--mj-text-muted);\n  border-radius: 4px;\n}\n\n.artifact-picker-close:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n}\n\n.artifact-picker-body {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px;\n}\n\n.artifact-picker-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 20px;\n  text-align: center;\n  color: var(--mj-text-muted);\n  gap: 8px;\n}\n\n.artifact-picker-hint {\n  font-size: 12px;\n  color: var(--mj-text-disabled);\n}\n\n.artifact-picker-list {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.artifact-picker-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: 6px;\n  background: var(--mj-bg-surface-card);\n  cursor: pointer;\n  text-align: left;\n  width: 100%;\n  transition: background 0.15s, border-color 0.15s;\n}\n\n.artifact-picker-item:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-brand-primary);\n}\n\n.artifact-picker-item i {\n  font-size: 20px;\n  width: 24px;\n  text-align: center;\n  flex-shrink: 0;\n}\n\n.artifact-picker-item i.fa-file-pdf { color: var(--mj-status-error); }\n.artifact-picker-item i.fa-file-excel { color: var(--mj-status-success); }\n.artifact-picker-item i.fa-file-word { color: var(--mj-brand-primary); }\n.artifact-picker-item i.fa-file { color: var(--mj-text-muted); }\n\n.artifact-picker-item-info {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.artifact-picker-item-name {\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.artifact-picker-item-meta {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n/* ---------- Floating \"on call\" pill (minimized realtime voice session) ----------\n   Shown bottom-right of the chat panel while the live call overlay is minimized\n   (e.g. after a gear-gated dev link navigated to a record). The mic + session stay\n   live; tapping the pill restores the full call overlay. */\n.voice-call-pill {\n  position: absolute;\n  right: 18px;\n  bottom: 18px;\n  z-index: 49; /* just under the full call overlay (z-index 50) */\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 9px 16px 9px 13px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-elevated, var(--mj-bg-surface));\n  color: var(--mj-text-primary);\n  font-family: inherit;\n  cursor: pointer;\n  box-shadow: 0 8px 24px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;\n}\n.voice-call-pill:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 10px 28px color-mix(in srgb, var(--mj-brand-primary) 28%, transparent);\n  transform: translateY(-1px);\n}\n.voice-call-pill i {\n  font-size: 14px;\n  color: var(--mj-brand-primary);\n}\n.voice-call-pill__pulse {\n  width: 9px;\n  height: 9px;\n  border-radius: 50%;\n  background: var(--mj-status-success);\n  flex-shrink: 0;\n  animation: voice-pill-pulse 1.6s ease-in-out infinite;\n}\n.voice-call-pill__text {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  line-height: 1.25;\n}\n.voice-call-pill__name {\n  font-size: 12.5px;\n  font-weight: 700;\n}\n.voice-call-pill__hint {\n  font-size: 10.5px;\n  color: var(--mj-text-muted);\n}\n@keyframes voice-pill-pulse {\n  0%, 100% {\n    box-shadow: 0 0 0 0 color-mix(in srgb, var(--mj-status-success) 45%, transparent);\n  }\n  50% {\n    box-shadow: 0 0 0 5px color-mix(in srgb, var(--mj-status-success) 0%, transparent);\n  }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-conversation-chat-area', template: "<div class=\"chat-area\">\n  <!-- agentPresence slot \u2014 sticky top, anchored with the header. Per Matt's\n       06-10 design: persistent presence indicator (Sid's face + live voice\n       state). Off by default; opt in via [showAgentCharacter]. When a\n       consumer projects an `mjChatSlot=\"agentPresence\"` template, it\n       replaces the default presence component. -->\n  @if (showAgentCharacter) {\n    <div class=\"chat-agent-presence\" [class.chat-agent-presence--prominent]=\"agentCharacterConfig?.voiceStateMode === 'prominent'\">\n      @if (slotTemplate('agentPresence'); as t) {\n        <ng-container *ngTemplateOutlet=\"t; context: {\n          $implicit: agentCharacterConfig,\n          state: agentCharacterConfig?.state ?? 'idle',\n          agentName: agentCharacterConfig?.characterName,\n          avatarUrl: agentCharacterConfig?.avatarUrl,\n          mode: agentCharacterConfig?.voiceStateMode ?? 'subtle'\n        }\"></ng-container>\n      } @else {\n        <mj-chat-agent-presence-default\n          [State]=\"agentCharacterConfig?.state ?? 'idle'\"\n          [AgentName]=\"agentCharacterConfig?.characterName\"\n          [AvatarUrl]=\"agentCharacterConfig?.avatarUrl\"\n          [Mode]=\"agentCharacterConfig?.voiceStateMode ?? 'subtle'\">\n        </mj-chat-agent-presence-default>\n      }\n    </div>\n  }\n\n  <!-- header slot \u2014 replaces the entire chat-header chrome (title, badges,\n       export/share/agent-picker buttons). When projected, the consumer owns\n       the entire header rendering; the default chrome below is bypassed\n       wholesale. Context exposes the minimal IMJChatHeaderComponent shape;\n       consumers needing more app state should bind to chat-area inputs\n       directly via @ViewChild or wrap the whole component. -->\n  @if (slotTemplate('header'); as t) {\n    <ng-container *ngTemplateOutlet=\"t; context: {\n      $implicit: conversation,\n      conversationTitle: conversation?.Name ?? null,\n      sharedBy: sharedByBadge?.display ?? null,\n      artifactCount: artifactCountDisplay,\n      showArtifactIndicator: showArtifactIndicator\n    }\"></ng-container>\n  } @else if (conversation || HasPreConversationHeader) {\n    <!-- Default header \u2014 also renders BEFORE a conversation exists when the\n         embedder has pre-conversation chrome to surface (currently just the\n         mode picker \u2014 agent / share / export / members / artifacts all\n         require a conversation row and stay hidden). Lets embedded surfaces\n         like the Form Builder cockpit show the mode picker above the\n         empty-state on a fresh chat instead of waiting for the first\n         message to round-trip. -->\n    <div class=\"chat-header\">\n      <div class=\"chat-info\" [class.with-sidebar-toggle]=\"showSidebarToggle\">\n        @if (showSidebarToggle) {\n          <button class=\"sidebar-toggle-btn\"\n            (click)=\"sidebarToggleClicked.emit()\"\n            title=\"Show conversations\">\n            <i class=\"fas fa-table-columns\"></i>\n          </button>\n        }\n        @if (conversation) {\n          <div class=\"chat-title\">{{ conversation.Name || '' }}</div>\n        }\n        @if (sharedByBadge) {\n          <span class=\"shared-by-badge\" [title]=\"sharedByBadge.fullTooltip\">\n            <i class=\"fas fa-share-nodes\"></i>\n            <span>Shared by {{ sharedByBadge.display }}</span>\n          </span>\n        }\n        @if (conversation?.ProjectID) {\n          <button class=\"project-tag\" (click)=\"openProjectSelector()\" title=\"Assign to project\">\n            <i class=\"fas fa-folder\"></i>\n            <span>{{ conversation!.Project || 'Project' }}</span>\n          </button>\n        }\n        @if (conversation?.TestRunID) {\n          <button class=\"test-indicator\" (click)=\"viewTestRun(conversation!.TestRunID!)\" title=\"View Test Run\">\n            <i class=\"fas fa-flask\"></i>\n            <span>Test</span>\n          </button>\n        }\n      </div>\n      <div class=\"chat-actions chat-actions-buttons\">\n        @if (allowPinning && pinnedMessages.length > 0) {\n          <button class=\"pin-chip\" [class.active]=\"showPinsPanel\" (click)=\"showPinsPanel = !showPinsPanel\" title=\"View pinned messages\">\n            <i class=\"fas fa-thumbtack\"></i>\n            <span class=\"pin-chip-count\">{{ pinnedMessages.length }}</span>\n          </button>\n        }\n        @if (showArtifactIndicator && artifactCountDisplay > 0) {\n          <button class=\"artifact-indicator\" (click)=\"viewArtifacts()\" title=\"View artifacts\">\n            <i class=\"fas fa-cube\"></i>\n            <span class=\"artifact-badge\">{{ artifactCountDisplay }}</span>\n          </button>\n        }\n        @if (memberCount > 1) {\n          <button class=\"chat-members\" (click)=\"toggleMembersModal()\" title=\"View members\">\n            <i class=\"fas fa-users\"></i>\n            <span class=\"members-badge\">{{ memberCount }}</span>\n          </button>\n        }\n        @if (!overlayMode && showAgentModePicker && ModePickerTargetAgentId) {\n          <!-- Per-agent mode/quality picker (Draft / Standard / High).\n               Targets the agent the next non-mention message will route\n               to. Auto-hides when that agent has fewer than 2 configured\n               presets. Choice persists per-user, per-agent via\n               UserInfoEngine; emits the picked configuration ID up so\n               <mj-message-input> can forward it on the next route.\n               Hidden in overlayMode (the compact chat overlay): the\n               mode dropdown wastes the narrow top-right space there. -->\n          <mj-conversation-mode-picker\n            [AgentID]=\"ModePickerTargetAgentId\"\n            [Disabled]=\"isProcessing\"\n            (PresetChanged)=\"OnAgentModePresetChanged($event)\">\n          </mj-conversation-mode-picker>\n        }\n        @if (showAgentPicker && conversation) {\n          <!-- Per-conversation default-agent pin. When set, non-mention\n               messages route to this agent instead of Sage. Persists to\n               MJConversationEntity.DefaultAgentID. Hidden when no\n               conversation is loaded or when the embedder disables it. -->\n          <mj-conversation-agent-picker\n            [Conversation]=\"conversation\"\n            [CurrentUser]=\"currentUser\"\n            [Disabled]=\"isReadOnlyView\">\n          </mj-conversation-agent-picker>\n        }\n        @if (showExportButton) {\n          <button mjButton variant=\"flat\" size=\"sm\" (click)=\"exportConversation()\" [title]=\"exportButtonLabel + ' conversation'\">\n            <i [class]=\"exportButtonIcon\"></i>\n            <span class=\"btn-label\">{{ exportButtonLabel }}</span>\n          </button>\n        }\n        @if (showShareButton && canShareConversation) {\n          <button mjButton variant=\"flat\" size=\"sm\"\n            [class.shared]=\"isShared\"\n            (click)=\"shareConversation()\"\n            [title]=\"isShared ? 'Manage sharing' : 'Share conversation'\">\n            <i class=\"fas fa-share-nodes\"></i>\n            <span class=\"btn-label\">Share</span>\n          </button>\n        }\n        <!-- headerActions slot \u2014 ADDITIVE host buttons rendered after the stock\n             actions (unlike the `header` slot, which replaces the whole header\n             and therefore never reaches this branch). For visual parity,\n             projected buttons should use mjButton variant=\"flat\" size=\"sm\". -->\n        @if (slotTemplate('headerActions'); as t) {\n          <ng-container *ngTemplateOutlet=\"t; context: {\n            $implicit: conversation,\n            conversationId: conversationId,\n            isProcessing: isProcessing\n          }\"></ng-container>\n        }\n      </div>\n    </div>\n  }\n\n  <!-- Messages and Artifact Split Layout \u2014 restructures into [stage | rail]\n       when isDemonstrationActive (per Matt's 06-10 design). The .demonstration-mode\n       class drives the CSS Grid switch; the stage container renders only when the\n       slot is projected AND the host opts in via [showDemonstrationSurface]. -->\n  <div class=\"chat-content-area\" [class.demonstration-mode]=\"isDemonstrationActive\">\n    <!-- demonstrationSurface stage \u2014 takes the main pane; messages shrink to\n         a side rail (or move below on mobile). Off unless both\n         [showDemonstrationSurface] is true AND a slot template is projected. -->\n    @if (isDemonstrationActive) {\n      <div class=\"chat-demonstration-stage\">\n        <ng-container *ngTemplateOutlet=\"slotTemplate('demonstrationSurface'); context: {\n          $implicit: demonstrationSurfaceContent,\n          content: demonstrationSurfaceContent,\n          visible: showDemonstrationSurface\n        }\"></ng-container>\n      </div>\n    }\n\n    <!-- Messages Pane -->\n    <div class=\"chat-messages-pane\"\n      [class.full-width]=\"!showArtifactPanel\"\n      [class.hidden]=\"isArtifactPaneMaximized\">\n      @if (isLoadingConversation) {\n        <!-- Loading State - checked FIRST to prevent empty state flash. The branch\n             always short-circuits the panes below; showLoadingState only controls\n             whether the built-in spinner renders (hosts with their own loading\n             chrome set it false and get a blank pane instead). -->\n        @if (showLoadingState) {\n          <div class=\"conversation-loading-state\">\n            <mj-loading text=\"Loading conversation...\" size=\"large\"></mj-loading>\n          </div>\n        }\n      } @else if ((isNewConversation || !conversationId) && !suppressNewConversationEmptyState) {\n        <!-- emptyState slot \u2014 when a consumer projects mjChatSlot=\"emptyState\",\n             they take over the entire empty-state region (including any send\n             affordance \u2014 the slot interface doesn't include a sendMessage\n             output, so consumers handle send via their own input). When no\n             slot is projected, the rich built-in <mj-conversation-empty-state>\n             renders with its own greeting, prompt chips, and message input.\n             emptyStateConfig (when supplied) takes precedence over the legacy\n             [emptyStateGreeting] string for backwards compatibility. -->\n        @if (slotTemplate('emptyState'); as t) {\n          <ng-container *ngTemplateOutlet=\"t; context: {\n            $implicit: emptyStateConfig,\n            greeting: emptyStateConfig?.greeting ?? emptyStateGreeting,\n            subtext: emptyStateConfig?.subtext,\n            suggestedPrompts: emptyStateConfig?.suggestedPrompts ?? []\n          }\"></ng-container>\n        } @else {\n          <mj-conversation-empty-state\n            [currentUser]=\"currentUser\"\n            [initialDraft]=\"GetInitialDraftFor(null)\"\n            (initialDraftApplied)=\"OnComposerDraftApplied()\"\n            (DraftStateChanged)=\"OnDraftStateChanged(null, $event)\"\n            (ComposerBlurred)=\"OnComposerBlurred()\"\n            [disabled]=\"isProcessing\"\n            [showSidebarToggle]=\"showSidebarToggle\"\n            [overlayMode]=\"overlayMode\"\n            [greeting]=\"emptyStateConfig?.greeting ?? emptyStateGreeting\"\n            [showSuggestedPrompts]=\"showSuggestedPrompts\"\n            [enableAttachments]=\"enableAttachments && allowAttachments\"\n            [enableMentions]=\"allowMentions\"\n            [enableAgentMentions]=\"allowAgentMentions\"\n            [enableEntityMentions]=\"allowEntityMentions\"\n            [enableSkillCommands]=\"allowSkillCommands\"\n            [maxAttachments]=\"maxAttachments\"\n            [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n            [acceptedFileTypes]=\"acceptedFileTypes\"\n            (sidebarToggleClicked)=\"sidebarToggleClicked.emit()\"\n            (messageSent)=\"onEmptyStateMessageSent($event)\">\n          </mj-conversation-empty-state>\n        }\n      } @else if ((isNewConversation || !conversationId) && suppressNewConversationEmptyState) {\n        <!-- Pre-conversation normal-view: empty message list + emptyStateMode input.\n             Used when host (e.g. Form Builder cockpit) wants the header + mode picker\n             visible on first open instead of the centered welcome card. First send\n             routes through onEmptyStateMessageSent which creates the conversation. -->\n        <div class=\"chat-messages-wrapper\">\n          <div class=\"chat-messages-container\"></div>\n          <div class=\"chat-input-container\">\n            <div class=\"message-input-container-wrapper\">\n              <mj-message-input\n                #emptyStateInput\n                [emptyStateMode]=\"true\"\n                [initialDraft]=\"GetInitialDraftFor(null)\"\n                (initialDraftApplied)=\"OnComposerDraftApplied()\"\n            (DraftStateChanged)=\"OnDraftStateChanged(null, $event)\"\n            (ComposerBlurred)=\"OnComposerBlurred()\"\n                [currentUser]=\"currentUser\"\n                [disabled]=\"isProcessing\"\n                [enableAttachments]=\"enableAttachments && allowAttachments\"\n                [enableMentions]=\"allowMentions\"\n                [enableAgentMentions]=\"allowAgentMentions\"\n                [enableEntityMentions]=\"allowEntityMentions\"\n                [enableSkillCommands]=\"allowSkillCommands\"\n                [enablePlanMode]=\"allowPlanMode\"\n                [enableRealtime]=\"allowRealtime\"\n                [maxAttachments]=\"maxAttachments\"\n                [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n                [acceptedFileTypes]=\"acceptedFileTypes\"\n                (emptyStateSubmit)=\"onEmptyStateMessageSent($event)\">\n              </mj-message-input>\n            </div>\n          </div>\n        </div>\n      } @else {\n        <!-- Normal Message View -->\n        <div class=\"chat-messages-wrapper\">\n          <!-- Upload Indicator Overlay (centered in conversation area) -->\n          @if (isUploadingAttachments) {\n            <div class=\"upload-indicator-overlay\">\n              <mj-loading [text]=\"uploadingMessage\" size=\"medium\"></mj-loading>\n            </div>\n          }\n          <div class=\"chat-messages-container\" #scrollContainer (scroll)=\"checkScroll()\">\n            <mj-conversation-message-list\n              [showEmptyFill]=\"showEmptyFill\"\n              [showDateNavigation]=\"showDateNavigation\"\n              [showAgentRunDetails]=\"showAgentRunDetails\"\n              [showReactions]=\"showReactions\"\n              [showMessageRating]=\"showMessageRating\"\n              [allowPinning]=\"allowPinning\"\n              [allowMessageEdit]=\"allowMessageEdit\"\n              [allowMessageDelete]=\"allowMessageDelete\"\n              [assistantDisplayName]=\"assistantDisplayName\"\n              [assistantAvatarUrl]=\"assistantAvatarUrl\"\n              [messages]=\"messages\"\n              [conversation]=\"conversation\"\n              [currentUser]=\"currentUser\"\n              [isProcessing]=\"isProcessing\"\n              [artifactMap]=\"effectiveArtifactsMap\"\n              [agentRunMap]=\"agentRunsByDetailId\"\n              [ratingsMap]=\"ratingsByDetailId\"\n              [userAvatarMap]=\"userAvatarMap\"\n              [attachmentsMap]=\"attachmentsByDetailId\"\n              [messageRendererTemplate]=\"slotTemplate('messageRenderer')\"\n              [messageExtraTemplate]=\"slotTemplate('messageExtra')\"\n              [sessionMetaMap]=\"realtimeSessionMetaMap\"\n              (realtimeSessionOpenRequested)=\"OpenRealtimeSessionReview($event)\"\n              (replyInThread)=\"onReplyInThread($event)\"\n              (viewThread)=\"onViewThread($event)\"\n              (deleteMessage)=\"onDeleteMessage($event)\"\n              (retryMessage)=\"onRetryMessage($event)\"\n              (testFeedbackMessage)=\"onTestFeedbackMessage($event)\"\n              (artifactClicked)=\"onArtifactClicked($event)\"\n              (messageEdited)=\"onMessageEdited($event)\"\n              (openEntityRecord)=\"onOpenEntityRecord($event)\"\n              (suggestedResponseSelected)=\"onSuggestedResponseSelected($event)\"\n              (attachmentClicked)=\"onAttachmentClicked($event)\"\n              (diagnosticRequested)=\"onDiagnosticRequested($event)\"\n              (messagePinToggled)=\"onMessagePinToggled($event)\"\n              (beforeResponseFormSubmitted)=\"beforeResponseFormSubmitted.emit($event)\"\n              (afterResponseFormSubmitted)=\"afterResponseFormSubmitted.emit($event)\">\n            </mj-conversation-message-list>\n\n            <!-- Scroll to Bottom Icon (positioned within scroll container for proper centering) -->\n            @if (showScrollToBottomIcon && messages && messages.length > 0) {\n              <span class=\"scroll-to-bottom-icon\" style=\"left: 50%;\"\n                (click)=\"scrollToBottomAnimate()\">\n                <i class=\"fas fa-arrow-down\"></i>\n              </span>\n            }\n          </div>\n\n          <!-- Fixed Input Area -->\n          <div class=\"chat-input-container\">\n            @if (isLoadingPeripheralData) {\n              <!-- Loading State -->\n              <div class=\"loading-peripheral-placeholder\">\n                <mj-loading text=\"Loading conversation data...\" size=\"medium\"></mj-loading>\n              </div>\n            } @else {\n              @if (isReadOnlyView) {\n                <div class=\"read-only-banner\" role=\"status\">\n                  <i class=\"fas fa-eye\"></i>\n                  <span>You have view-only access to this conversation.</span>\n                </div>\n              }\n              <!-- Input Component - Multiple instances cached, only one visible -->\n              <div class=\"message-input-container-wrapper\">\n                @for (inputRef of getCachedInputs(); track inputRef.conversationId) {\n                  <mj-message-input\n                    #messageInput\n                    [hidden]=\"inputRef.conversationId !== conversationId\"\n                    [initialDraft]=\"GetInitialDraftFor(inputRef.conversationId)\"\n                    (DraftStateChanged)=\"OnDraftStateChanged(inputRef.conversationId, $event)\"\n                    (ComposerBlurred)=\"OnComposerBlurred()\"\n                    [conversationId]=\"inputRef.conversationId\"\n                    [conversationName]=\"inputRef.conversationName\"\n                    [currentUser]=\"currentUser\"\n                    [conversationHistory]=\"inputRef.conversationId === conversationId ? messages : []\"\n                    [artifactsByDetailId]=\"inputRef.conversationId === conversationId ? artifactsByDetailId : emptyArtifactsMap\"\n                    [systemArtifactsByDetailId]=\"inputRef.conversationId === conversationId ? systemArtifactsByDetailId : emptyArtifactsMap\"\n                    [agentRunsByDetailId]=\"inputRef.conversationId === conversationId ? agentRunsByDetailId : emptyAgentRunsMap\"\n                    [appContext]=\"appContext\"\n                    [applicationId]=\"applicationId\"\n                    [defaultAgentId]=\"defaultAgentId\"\n                    [conversationDefaultAgentId]=\"inputRef.conversationId === conversationId ? (conversation?.DefaultAgentID ?? null) : null\"\n                    [agentConfigurationPresetId]=\"inputRef.conversationId === conversationId ? ActiveAgentConfigurationPresetId : null\"\n                    [inProgressMessageIds]=\"inputRef.conversationId === conversationId ? inProgressMessageIds : emptyInProgressIds\"\n                    [disabled]=\"isProcessing || isReadOnlyView\"\n                    [enableAttachments]=\"enableAttachments && allowAttachments\"\n                    [enableMentions]=\"allowMentions\"\n                    [enableAgentMentions]=\"allowAgentMentions\"\n                    [enableEntityMentions]=\"allowEntityMentions\"\n                    [enableSkillCommands]=\"allowSkillCommands\"\n                    [enablePlanMode]=\"allowPlanMode\"\n                    [enableRealtime]=\"allowRealtime\"\n                    [maxAttachments]=\"maxAttachments\"\n                    [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n                    [acceptedFileTypes]=\"acceptedFileTypes\"\n                    [initialMessage]=\"shouldDeliverPendingMessageTo(inputRef.conversationId) ? pendingMessage : null\"\n                    [initialAttachments]=\"shouldDeliverPendingMessageTo(inputRef.conversationId) ? pendingAttachments : null\"\n                    (initialMessageAutoSendStarted)=\"onInitialMessageAutoSendStarted($event)\"\n                    (initialMessageAutoSendFailed)=\"onInitialMessageAutoSendFailed($event)\"\n                    (messageSent)=\"onMessageSent($event)\"\n                    (agentResponse)=\"onAgentResponse($event)\"\n                    (agentRunDetected)=\"onAgentRunDetected($event)\"\n                    (agentRunUpdate)=\"onAgentRunUpdate($event)\"\n                    (messageComplete)=\"onMessageComplete($event)\"\n                    (artifactCreated)=\"onArtifactCreated($event)\"\n                    (conversationRenamed)=\"onConversationRenamed($event)\"\n                    (intentCheckStarted)=\"onIntentCheckStarted($event)\"\n                    (intentCheckCompleted)=\"onIntentCheckCompleted($event)\"\n                    (beforeAgentTurn)=\"beforeAgentTurn.emit($event)\"\n                    (afterAgentTurn)=\"afterAgentTurn.emit($event)\"\n                    (uploadStateChanged)=\"onUploadStateChanged($event)\">\n                  </mj-message-input>\n                }\n              </div>\n            }\n          </div>\n        </div>\n      }\n    </div>\n\n    <!-- Artifact Viewer Pane -->\n    @if (showArtifactPanel && selectedArtifactId) {\n      @if (!isArtifactPaneMaximized) {\n        <div class=\"resize-handle\" (mousedown)=\"onResizeStart($event)\" (touchstart)=\"onResizeTouchStart($event)\"></div>\n      }\n      <div class=\"chat-artifact-pane\"\n        [style.width.%]=\"artifactPaneWidth\"\n        [class.maximized]=\"isArtifactPaneMaximized\">\n        <mj-artifact-viewer-panel\n          [artifactId]=\"selectedArtifactId\"\n          [currentUser]=\"currentUser\"\n          [environmentId]=\"environmentId\"\n          [versionNumber]=\"selectedVersionNumber\"\n          [viewContext]=\"'conversation'\"\n          [canShare]=\"canShareSelectedArtifact\"\n          [canEdit]=\"canEditSelectedArtifact\"\n          [isMaximized]=\"isArtifactPaneMaximized\"\n          [refreshTrigger]=\"artifactViewerRefresh$\"\n          (closed)=\"onCloseArtifactPanel()\"\n          (saveToCollectionRequested)=\"onSaveToCollectionRequested($event)\"\n          (navigateToLink)=\"onArtifactLinkNavigation($event)\"\n          (shareRequested)=\"onArtifactShareRequested($event)\"\n          (maximizeToggled)=\"toggleMaximizeArtifactPane()\"\n          (openEntityRecord)=\"onOpenEntityRecord($event)\"\n          (navigationRequest)=\"onNavigationRequest($event)\"\n          (analyzeRequested)=\"OnAnalyzeArtifact($event)\"\n          (applyFormRequested)=\"OnApplyFormRequested($event)\">\n        </mj-artifact-viewer-panel>\n      </div>\n    }\n\n    <!-- Artifact Share Modal -->\n    <mj-artifact-share-modal\n      [isOpen]=\"isArtifactShareModalOpen\"\n      [artifact]=\"artifactToShare\"\n      [currentUser]=\"currentUser\"\n      (saved)=\"onArtifactShared()\"\n      (cancelled)=\"onArtifactShareModalClose()\">\n    </mj-artifact-share-modal>\n\n    <!-- Pinned Messages Panel (overlay) -->\n    @if (allowPinning && showPinsPanel) {\n      <mj-pinned-messages-panel\n        [pinnedMessages]=\"pinnedMessages\"\n        (closed)=\"showPinsPanel = false\"\n        (jumpRequested)=\"onJumpToMessage($event)\"\n        (unpinRequested)=\"onUnpinFromPanel($event)\">\n      </mj-pinned-messages-panel>\n    }\n  </div>\n\n  <!-- Live voice \"call mode\" overlay \u2014 fills this conversation panel in place\n       (header + thread + composer) while a realtime session is active. When the\n       call is MINIMIZED (e.g. a dev link navigated to a record) the overlay HIDES\n       (not destroyed \u2014 its merged session state must survive), the session stays\n       fully live, and a floating \"on call\" pill offers the way back.\n       ALSO hosted in SESSION REVIEW mode (RealtimeReview set, no live call): the\n       overlay renders what went down in a PAST session, with a \"Start live session\"\n       button that resumes it as a new call. -->\n  @if ((RealtimeSession.Active$ | async) || RealtimeReview) {\n    <mj-realtime-session-overlay\n      [AgentName]=\"realtimeOverlayAgentName\"\n      [Hidden]=\"(RealtimeSession.Minimized$ | async) === true\"\n      [CurrentUser]=\"currentUser\"\n      [EnvironmentID]=\"environmentId\"\n      [ReviewData]=\"RealtimeReview\"\n      [Chrome]=\"overlayMode ? 'orb' : 'auto'\"\n      [Compact]=\"overlayMode\"\n      [ShowDevLinks]=\"!overlayMode\"\n      [ShowDensityPicker]=\"!overlayMode\"\n      (NavigateRequest)=\"onRealtimeNavigateRequest($event)\"\n      (StartLiveRequested)=\"onReviewStartLive($event)\"\n      (ReviewClosed)=\"onReviewClosed()\">\n    </mj-realtime-session-overlay>\n    @if (RealtimeSession.Minimized$ | async) {\n      <button type=\"button\" class=\"voice-call-pill\" (click)=\"RealtimeSession.SetMinimized(false)\"\n              title=\"Return to the live call\" aria-label=\"Return to the live call\">\n        <span class=\"voice-call-pill__pulse\" aria-hidden=\"true\"></span>\n        <i class=\"fa-solid fa-phone-volume\" aria-hidden=\"true\"></i>\n        <span class=\"voice-call-pill__text\">\n          <span class=\"voice-call-pill__name\">On call \u00B7 {{ RealtimeSession.CurrentAgentName }}</span>\n          <span class=\"voice-call-pill__hint\">Tap to return</span>\n        </span>\n      </button>\n    }\n  }\n</div>\n\n<!-- Thread Panel -->\n@if (threadId) {\n  <mj-thread-panel\n    [parentMessageId]=\"threadId\"\n    [conversationId]=\"conversationId || ''\"\n    [currentUser]=\"currentUser\"\n    (closed)=\"onLocalThreadClosed()\"\n    (replyAdded)=\"onThreadReplyAdded($event)\">\n  </mj-thread-panel>\n}\n\n<!-- Export Modal -->\n<!-- [branding] is bound BEFORE [isVisible] deliberately: Angular sets inputs in\n     template order within a change-detection pass, and the modal's isVisible setter\n     reads `branding` to default its \"Include branding\" checkbox on a fresh open. -->\n<mj-export-modal\n  [branding]=\"exportBranding\"\n  [isVisible]=\"showExportModal\"\n  [conversation]=\"conversation || undefined\"\n  [currentUser]=\"currentUser\"\n  (cancelled)=\"onExportModalCancelled()\"\n  (exported)=\"onExportModalComplete()\">\n</mj-export-modal>\n\n<!-- Share Dialog (generic, shared with dashboards) -->\n<mj-resource-share-dialog\n  [Visible]=\"showShareModal\"\n  [Context]=\"shareContext\"\n  [Adapter]=\"shareAdapter\"\n  (Result)=\"onShareDialogResult($event)\">\n</mj-resource-share-dialog>\n\n<!-- Members Modal -->\n<mj-members-modal\n  [isVisible]=\"showMembersModal\"\n  [conversation]=\"conversation || undefined\"\n  [currentUser]=\"currentUser\"\n  (cancelled)=\"showMembersModal = false\"\n  (membersChanged)=\"showMembersModal = false\">\n</mj-members-modal>\n\n<!-- Project Selector Modal -->\n@if (showProjectSelector && conversation) {\n  <div class=\"modal-overlay\" (click)=\"showProjectSelector = false\">\n    <div class=\"modal-content project-selector-modal\" (click)=\"$event.stopPropagation()\">\n      <div class=\"modal-header\">\n        <h3>Assign Project</h3>\n        <button class=\"modal-close-btn\" (click)=\"showProjectSelector = false\">\n          <i class=\"fas fa-times\"></i>\n        </button>\n      </div>\n      <div class=\"modal-body\">\n        <mj-project-selector\n          [environmentId]=\"environmentId\"\n          [currentUser]=\"currentUser\"\n          [selectedProjectId]=\"conversation.ProjectID\"\n          (projectSelected)=\"onProjectSelected($event)\">\n        </mj-project-selector>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Artifacts Modal -->\n@if (showArtifactsModal) {\n  <div class=\"modal-overlay\" (click)=\"showArtifactsModal = false\">\n    <div class=\"modal-content artifacts-modal\" (click)=\"$event.stopPropagation()\">\n      <div class=\"modal-header\">\n        <h3>Conversation Artifacts</h3>\n        <div class=\"modal-header-actions\">\n          @if (hasSystemArtifacts) {\n            <button class=\"toggle-system-btn\"\n              [class.active]=\"showSystemArtifacts\"\n              (click)=\"toggleSystemArtifacts()\"\n              title=\"Toggle system artifacts visibility\">\n              <i class=\"fas fa-cog\"></i>\n              <span>{{ showSystemArtifacts ? 'Hide' : 'Show' }} System</span>\n            </button>\n          }\n          <button class=\"modal-close-btn\" (click)=\"showArtifactsModal = false\">\n            <i class=\"fas fa-times\"></i>\n          </button>\n        </div>\n      </div>\n      <div class=\"modal-body artifacts-grid\">\n        @if (artifactsByDetailId.size === 0) {\n          <mj-empty-state\n            class=\"artifacts-empty-fill\"\n            Icon=\"fa-solid fa-cube\"\n            Title=\"No artifacts in this conversation yet\" />\n        }\n        @for (artifact of getArtifactsArray(); track artifact.artifactId) {\n          <div class=\"artifact-modal-card\"\n            [class.expanded]=\"expandedArtifactId === artifact.artifactId\"\n            [class.system-artifact]=\"artifact.visibility === 'System Only'\">\n            <!-- Main card header - click to open latest version -->\n            <div class=\"artifact-card-header\" (click)=\"openArtifactFromModal(artifact.artifactId)\">\n              <div class=\"artifact-modal-icon\">\n                <i class=\"fas fa-file-code\"></i>\n              </div>\n              <div class=\"artifact-modal-info\">\n                <div class=\"artifact-modal-title\">{{artifact.name}}</div>\n                <div class=\"artifact-modal-meta\">\n                  @if (artifact.versionCount > 1) {\n                    {{artifact.versionCount}} versions\n                  } @else {\n                    1 version\n                  }\n                </div>\n              </div>\n              @if (artifact.versionCount > 1) {\n                <button class=\"expand-btn\" (click)=\"toggleArtifactExpansion(artifact.artifactId, $event)\">\n                  <i class=\"fas\" [class.fa-chevron-down]=\"expandedArtifactId !== artifact.artifactId\"\n                  [class.fa-chevron-up]=\"expandedArtifactId === artifact.artifactId\"></i>\n                </button>\n              }\n              <div class=\"artifact-modal-action\">\n                <i class=\"fas fa-external-link-alt\"></i>\n              </div>\n            </div>\n\n            <!-- Expanded version list -->\n            @if (expandedArtifactId === artifact.artifactId && artifact.versionCount > 1) {\n              <div class=\"artifact-versions-list\">\n                @for (version of artifact.versions; track version.versionId) {\n                  <div class=\"artifact-version-item\" (click)=\"openArtifactFromModal(artifact.artifactId, version.versionNumber); $event.stopPropagation()\">\n                    <span class=\"version-badge\">v{{version.versionNumber}}</span>\n                    <span class=\"version-open-text\">Open this version</span>\n                    <i class=\"fas fa-arrow-right\"></i>\n                  </div>\n                }\n              </div>\n            }\n          </div>\n        }\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Collection Picker Modal -->\n@if (showCollectionPicker) {\n  <mj-artifact-collection-picker-modal\n    [isOpen]=\"showCollectionPicker\"\n    [environmentId]=\"environmentId\"\n    [currentUser]=\"currentUser\"\n    [excludeCollectionIds]=\"collectionPickerExcludedIds\"\n    [artifactVersionId]=\"collectionPickerVersionId\"\n    [artifactName]=\"collectionPickerArtifactName\"\n    [artifactVersionNumber]=\"collectionPickerVersionNumber\"\n    (completed)=\"onCollectionPickerCompleted($event)\"\n    (cancelled)=\"onCollectionPickerCancelled()\">\n  </mj-artifact-collection-picker-modal>\n}\n\n<!-- Test Feedback Dialog -->\n@if (testFeedbackDialogData) {\n  <mj-test-feedback-dialog\n    [data]=\"testFeedbackDialogData\"\n    [visible]=\"showTestFeedbackDialog\"\n    (closed)=\"onTestFeedbackDialogClosed($event)\">\n  </mj-test-feedback-dialog>\n}\n\n<!-- Image Viewer Modal -->\n@if (showImageViewer) {\n  <mj-image-viewer\n    [imageUrl]=\"selectedImageUrl\"\n    [alt]=\"selectedImageAlt\"\n    [fileName]=\"selectedImageFileName\"\n    [visible]=\"showImageViewer\"\n    (closed)=\"onImageViewerClosed()\">\n  </mj-image-viewer>\n}\n", styles: [":host {\n  display: flex;\n  width: 100%;\n  height: 100%;\n}\n\n.chat-area {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  /* Positioned context for the in-place realtime \"call mode\" overlay (absolute inset:0) */\n  position: relative;\n}\n\n.chat-header {\n  flex-shrink: 0;\n  padding: 12px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 16px;\n  background: var(--mj-bg-surface-card);\n  z-index: 10;\n  box-shadow: var(--mj-shadow-sm);\n}\n\n/* agentPresence slot \u2014 sticky top, anchored with the header. Per Matt's\n   06-10 placement design: persistent presence indicator above the messages.\n   Renders only when [showAgentCharacter] is true, so existing embeds see no\n   layout change. The prominent variant grows toward a centered presence\n   (per Matt: \"can grow larger toward a centered presence\"). */\n.chat-agent-presence {\n  flex-shrink: 0;\n  padding: 8px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n  display: flex;\n  align-items: center;\n  z-index: 11;\n}\n\n.chat-agent-presence--prominent {\n  padding: 16px 20px;\n  justify-content: center;\n}\n\n.chat-info {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n\n/* Sidebar toggle button in header */\n.sidebar-toggle-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  background: transparent;\n  border: none;\n  border-radius: 6px;\n  cursor: pointer;\n  transition: all 0.15s ease;\n  flex-shrink: 0;\n}\n\n.sidebar-toggle-btn:hover {\n  background: color-mix(in srgb, var(--mj-text-primary) 8%, transparent);\n}\n\n.sidebar-toggle-btn:active {\n  background: color-mix(in srgb, var(--mj-text-primary) 12%, transparent);\n}\n\n.sidebar-toggle-btn i {\n  color: var(--mj-text-secondary);\n  font-size: 18px;\n  transition: color 0.15s ease;\n}\n\n.sidebar-toggle-btn:hover i {\n  color: var(--mj-text-primary);\n}\n\n.chat-title {\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.shared-by-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 3px 10px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n  color: var(--mj-brand-primary);\n  border-radius: 999px;\n  font-size: 12px;\n  font-weight: 500;\n  flex-shrink: 0;\n  max-width: 240px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.shared-by-badge i {\n  font-size: 10px;\n}\n\n.shared-by-badge span {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.project-tag {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--mj-text-muted);\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 12px;\n}\n\n.project-tag:hover {\n  background: var(--mj-border-default);\n  border-color: var(--mj-text-muted);\n}\n\n.project-tag i {\n  font-size: 10px;\n}\n\n.test-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: color-mix(in srgb, var(--mj-status-warning) 10%, var(--mj-bg-surface));\n  border: 1px solid var(--mj-status-warning);\n  border-radius: 16px;\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--mj-status-warning);\n  cursor: pointer;\n  transition: all 0.2s;\n  height: 28px;\n  margin-left: 8px;\n}\n\n.test-indicator:hover {\n  background: color-mix(in srgb, var(--mj-status-warning) 20%, var(--mj-bg-surface));\n  border-color: var(--mj-status-warning);\n}\n\n.test-indicator i {\n  font-size: 10px;\n}\n\n/* Pinned messages chip in chat header */\n.pin-chip {\n  display: flex;\n  align-items: center;\n  gap: 5px;\n  padding: 5px 10px;\n  background: color-mix(in srgb, var(--mj-status-warning) 12%, var(--mj-bg-surface));\n  border: 1px solid color-mix(in srgb, var(--mj-status-warning) 45%, transparent);\n  border-radius: 20px;\n  color: var(--mj-status-warning-text, var(--mj-status-warning));\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.15s;\n}\n\n.pin-chip i {\n  font-size: 11px;\n}\n\n.pin-chip:hover,\n.pin-chip.active {\n  background: color-mix(in srgb, var(--mj-status-warning) 20%, var(--mj-bg-surface));\n  border-color: var(--mj-status-warning);\n}\n\n.pin-chip-count {\n  font-size: 12px;\n  font-weight: 700;\n}\n\n.chat-members,\n.artifact-indicator {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  padding: 6px 8px;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.chat-members:hover,\n.artifact-indicator:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n/* Badge overlay for artifact and member counts */\n.artifact-badge,\n.members-badge {\n  position: absolute;\n  top: -6px;\n  right: -6px;\n  min-width: 16px;\n  height: 16px;\n  padding: 0 4px;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  border-radius: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n}\n\n.members-badge {\n  background: var(--mj-brand-primary);\n}\n\n.ambient-agent-indicator {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 6px 12px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 6px;\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n  animation: pulse 2s ease-in-out infinite;\n}\n\n.ambient-agent-indicator i {\n  color: var(--mj-brand-primary);\n}\n\n@keyframes pulse {\n  0%, 100% {\n    opacity: 1;\n  }\n  50% {\n    opacity: 0.7;\n  }\n}\n.chat-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.action-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 8px 12px;\n  background: transparent;\n  border: 1px solid var(--mj-border-default);\n  cursor: pointer;\n  border-radius: 6px;\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n  transition: all 150ms ease;\n}\n\n.action-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.share-btn.shared {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-color: var(--mj-brand-primary-hover);\n  color: var(--mj-brand-primary-hover);\n}\n\n.share-btn.shared:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary-hover);\n}\n\n.chat-content-area {\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: row;\n  position: relative;\n}\n\n.chat-messages-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  min-width: min(300px, 100%); /* Respect container bounds while maintaining minimum */\n  overflow: hidden;\n  transition: width 0.3s ease;\n}\n\n.chat-messages-pane.full-width {\n  width: 100%;\n}\n\n.chat-messages-pane:not(.full-width) {\n  flex: 1;\n}\n\n.chat-messages-pane.hidden {\n  display: none;\n}\n\n.resize-handle {\n  width: 4px;\n  background: transparent;\n  cursor: col-resize;\n  flex-shrink: 0;\n  position: relative;\n  transition: background-color 0.2s;\n}\n\n.resize-handle:hover {\n  background: var(--mj-brand-primary);\n}\n\n.resize-handle::before {\n  content: \"\";\n  position: absolute;\n  left: -4px;\n  right: -4px;\n  top: 0;\n  bottom: 0;\n}\n\n.chat-artifact-pane {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-surface-sunken);\n  overflow: hidden;\n  flex-shrink: 0;\n}\n\n.chat-artifact-pane.maximized {\n  width: 100% !important;\n}\n\n.chat-artifact-pane > mj-artifact-viewer-panel {\n  display: flex;\n  flex: 1;\n  min-height: 0;\n  overflow: hidden;\n}\n\n.chat-messages-wrapper {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  overflow: hidden;\n  position: relative; /* For upload overlay positioning */\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   demonstrationSurface layout-mode (Matt's 06-10 placement design)\n   \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   When .chat-content-area gets .demonstration-mode, the layout flips\n   from \"messages pane (+ optional artifact pane)\" to \"stage + side rail\":\n     - stage (.chat-demonstration-stage) \u2014 left, flexible, holds the\n       consumer's projected demonstrationSurface slot template\n     - rail (.chat-messages-pane) \u2014 right, fixed-width 320px, holds the\n       messages list + composer (\"the conversation as a companion rail\")\n   On mobile (\u2264768px) the same two stack vertically (stage above, rail\n   below) per Matt's note about mobile. The rail intentionally keeps the\n   composer inside it \u2014 Matt's design refers to the conversation rail\n   inclusively (messages + composer together), not as separate regions.\n*/\n.chat-demonstration-stage {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  background: var(--mj-bg-surface);\n  border-right: 1px solid var(--mj-border-default);\n  flex: 1;\n  min-width: 0;\n}\n\n.chat-content-area.demonstration-mode .chat-messages-pane,\n.chat-content-area.demonstration-mode .chat-messages-pane.full-width {\n  flex: 0 0 320px;\n  width: 320px;\n  min-width: 0;\n}\n\n@media (max-width: 768px) {\n  .chat-content-area.demonstration-mode {\n    flex-direction: column;\n  }\n\n  .chat-content-area.demonstration-mode .chat-demonstration-stage {\n    flex: 1 1 60%;\n    border-right: none;\n    border-bottom: 1px solid var(--mj-border-default);\n    height: auto;\n  }\n\n  .chat-content-area.demonstration-mode .chat-messages-pane,\n  .chat-content-area.demonstration-mode .chat-messages-pane.full-width {\n    flex: 1 1 40%;\n    width: 100%;\n    height: auto;\n  }\n}\n\n/* Upload indicator overlay - centered in conversation area */\n.upload-indicator-overlay {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 1rem 1.5rem;\n  background: color-mix(in srgb, var(--mj-bg-surface-card) 95%, transparent);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-md);\n  z-index: 100;\n  pointer-events: none;\n}\n\n.chat-messages-container {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  background: var(--mj-bg-surface-card);\n  min-height: 0;\n  position: relative;\n}\n\n.scroll-to-bottom-icon {\n  position: sticky;\n  bottom: 21px;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 40px;\n  height: 40px;\n  margin-top: -40px;\n  margin-left: auto;\n  margin-right: auto;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  box-shadow: var(--mj-shadow-md);\n  transition: all 0.2s ease;\n  z-index: 100;\n  pointer-events: auto;\n}\n\n.scroll-to-bottom-icon:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-color: var(--mj-brand-primary);\n  transform: translateX(-50%) translateY(-2px);\n  box-shadow: color-mix(in srgb, var(--mj-brand-primary) 20%, transparent) 0 4px 12px;\n}\n\n.scroll-to-bottom-icon i {\n  color: var(--mj-text-secondary);\n  font-size: 16px;\n  transition: color 0.2s;\n}\n\n.scroll-to-bottom-icon:hover i {\n  color: var(--mj-brand-primary);\n}\n\n.chat-input-container {\n  flex-shrink: 0;\n  background: var(--mj-bg-surface-card);\n  padding: 0 1.25rem 1.25rem 1.25rem;\n  overflow: visible;\n}\n\n.read-only-banner {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  margin: 0 1.25rem 0.5rem 1.25rem;\n  padding: 8px 12px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, transparent);\n  color: var(--mj-text-secondary);\n  border-radius: 6px;\n  font-size: 12px;\n}\n\n.read-only-banner i {\n  color: var(--mj-brand-primary);\n  font-size: 12px;\n}\n\n.loading-peripheral-placeholder {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 140px;\n  padding: 24px;\n  background: color-mix(in srgb, var(--mj-bg-surface-card) 50%, transparent);\n  backdrop-filter: blur(2px);\n  border-radius: 12px;\n  margin: 12px;\n  animation: fadeIn 0.2s ease-in-out;\n}\n\n.modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n}\n\n.modal-content {\n  background: var(--mj-bg-surface-card);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-md);\n  max-width: 90vw;\n  max-height: 90vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.project-selector-modal {\n  width: 600px;\n  height: 500px;\n}\n\n.modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.modal-header h3 {\n  margin: 0;\n  font-size: 18px;\n  font-weight: 600;\n}\n\n.modal-header-actions {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.toggle-system-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  padding: 6px 12px;\n  border-radius: 6px;\n  font-size: 13px;\n  font-weight: 500;\n  transition: all 0.2s;\n}\n\n.toggle-system-btn:hover {\n  background: var(--mj-border-default);\n  border-color: var(--mj-border-default);\n  color: var(--mj-text-primary);\n}\n\n.toggle-system-btn.active {\n  background: var(--mj-brand-primary);\n  border-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n.toggle-system-btn.active:hover {\n  background: var(--mj-brand-primary-hover);\n  border-color: var(--mj-brand-primary-hover);\n}\n\n.toggle-system-btn i {\n  font-size: 12px;\n}\n\n.modal-close-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  padding: 4px 8px;\n  border-radius: 4px;\n  transition: all 0.2s;\n}\n\n.modal-close-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.modal-body {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n}\n\n.artifacts-modal {\n  width: 700px;\n  max-height: 600px;\n}\n\n.artifacts-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 16px;\n}\n\n/* Empty-state spans the full artifacts grid */\n.artifacts-empty-fill {\n  grid-column: 1/-1;\n}\n\n.artifact-modal-card {\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-surface-card);\n  border: 1.5px solid var(--mj-border-default);\n  border-radius: 12px;\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  overflow: hidden;\n}\n\n.artifact-modal-card.expanded {\n  border-color: var(--mj-brand-primary);\n}\n\n.artifact-modal-card.system-artifact {\n  opacity: 0.85;\n  border-color: var(--mj-border-default);\n  border-style: dashed;\n  position: relative;\n}\n\n.artifact-modal-card.system-artifact::before {\n  content: \"SYSTEM\";\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  font-size: 9px;\n  font-weight: 600;\n  color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-sunken);\n  padding: 2px 6px;\n  border-radius: 3px;\n  letter-spacing: 0.5px;\n  z-index: 10;\n}\n\n.artifact-modal-card.system-artifact:hover {\n  border-color: var(--mj-text-muted);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.artifact-card-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px;\n  cursor: pointer;\n}\n\n.artifact-card-header:hover {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.artifact-modal-card:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: var(--mj-shadow-md);\n  transform: translateY(-2px);\n}\n\n.artifact-modal-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-radius: 10px;\n  color: var(--mj-brand-primary);\n  flex-shrink: 0;\n}\n\n.artifact-modal-icon i {\n  font-size: 18px;\n}\n\n.artifact-modal-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.artifact-modal-title {\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  margin-bottom: 4px;\n}\n\n.artifact-modal-meta {\n  font-size: 12px;\n  color: var(--mj-text-secondary);\n}\n\n.artifact-modal-action {\n  color: var(--mj-text-muted);\n  transition: color 0.2s;\n}\n\n.artifact-modal-card:hover .artifact-modal-action {\n  color: var(--mj-brand-primary);\n}\n\n.expand-btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 32px;\n  height: 32px;\n  border: none;\n  background: transparent;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  border-radius: 6px;\n  transition: all 0.2s;\n}\n.expand-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-brand-primary);\n}\n\n.artifact-versions-list {\n  display: flex;\n  flex-direction: column;\n  padding: 0 1rem 1rem 1rem;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.artifact-version-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px 16px 12px 68px;\n  cursor: pointer;\n  transition: background 0.15s;\n}\n.artifact-version-item:hover {\n  background: var(--mj-bg-surface-sunken);\n}\n.artifact-version-item .version-badge {\n  display: inline-block;\n  padding: 4px 8px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  font-size: 12px;\n  font-weight: 600;\n  font-family: monospace;\n  border-radius: 4px;\n}\n.artifact-version-item .version-open-text {\n  flex: 1;\n  font-size: 13px;\n  color: var(--mj-text-secondary);\n}\n.artifact-version-item i {\n  color: var(--mj-text-muted);\n  font-size: 12px;\n}\n.artifact-version-item:hover .version-badge {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n.artifact-version-item:hover .version-open-text {\n  color: var(--mj-brand-primary);\n}\n.artifact-version-item:hover i {\n  color: var(--mj-brand-primary);\n}\n\n.loading-peripheral-content {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 16px 24px;\n  background: var(--mj-bg-surface-card);\n  border: 2px solid var(--mj-border-default);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-md);\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  font-weight: 500;\n}\n.loading-peripheral-content i {\n  font-size: 20px;\n  color: var(--mj-brand-primary);\n}\n\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n.conversation-loading-state {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n}\n\n.loading-content {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding-top: 20px;\n  gap: 16px;\n  color: var(--mj-text-secondary);\n  font-size: 15px;\n}\n.loading-content i {\n  font-size: 32px;\n  color: var(--mj-brand-primary);\n}\n.loading-content span {\n  font-weight: 500;\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n  .chat-header {\n    padding: 8px 12px;\n    gap: 6px;\n    flex-direction: row;\n    flex-wrap: wrap;\n    align-items: center;\n    position: relative;\n  }\n  .chat-info {\n    flex-direction: row;\n    align-items: center;\n    gap: 8px;\n    flex: 1;\n    min-width: 0;\n    order: 1;\n  }\n  .chat-title {\n    font-size: 15px;\n    font-weight: 700;\n    width: auto;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    flex: 1;\n    min-width: 0;\n  }\n  .project-tag {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n    display: none; /* Hide on mobile to save space */\n  }\n  .test-indicator {\n    margin-left: 0;\n    font-size: 10px;\n    padding: 3px 8px;\n    height: 24px;\n  }\n  /* Action buttons - icon only on mobile */\n  .chat-actions-buttons {\n    order: 2;\n    flex-shrink: 0;\n  }\n  .chat-actions-buttons .action-btn {\n    padding: 6px 8px;\n    min-width: auto;\n  }\n  .chat-actions-buttons .action-btn .btn-label {\n    display: none;\n  }\n  .chat-actions {\n    flex-wrap: nowrap;\n  }\n  .chat-members,\n  .artifact-indicator {\n    padding: 5px 7px;\n    font-size: 13px;\n  }\n  .action-btn {\n    padding: 6px 8px;\n    font-size: 12px;\n  }\n  .ambient-agent-indicator {\n    font-size: 12px;\n    padding: 4px 8px;\n  }\n  .project-selector-modal {\n    width: min(95vw, 600px);\n    height: auto;\n  }\n  .artifacts-modal {\n    width: min(95vw, 700px);\n  }\n  .artifacts-grid {\n    grid-template-columns: 1fr;\n  }\n  .chat-input-container {\n    padding: 0 0.75rem 0.75rem 0.75rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 16px;\n    width: 36px;\n    height: 36px;\n  }\n  /* Artifact pane - full width overlay on mobile, overlapping header */\n  .chat-content-area {\n    position: relative;\n  }\n  .chat-artifact-pane {\n    position: fixed;\n    left: 0;\n    right: 0;\n    top: 56px; /* 48px nav + 8px dark strip above blue border */\n    bottom: 0;\n    width: 100% !important;\n    z-index: 100;\n    background: var(--mj-bg-surface-card);\n  }\n  .resize-handle {\n    display: none;\n  }\n}\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n  .chat-header {\n    padding: 6px 8px;\n    gap: 4px;\n  }\n  .chat-title {\n    font-size: 14px;\n    font-weight: 700;\n  }\n  .project-tag {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n    display: none;\n  }\n  .test-indicator {\n    font-size: 9px;\n    padding: 2px 6px;\n    height: 20px;\n  }\n  .chat-members,\n  .artifact-indicator {\n    padding: 4px 8px;\n    font-size: 11px;\n  }\n  .action-btn {\n    padding: 5px 7px;\n    font-size: 11px;\n  }\n  .ambient-agent-indicator {\n    font-size: 11px;\n    padding: 3px 6px;\n  }\n  .project-selector-modal,\n  .artifacts-modal {\n    width: 100vw;\n    height: 100vh;\n    border-radius: 0;\n  }\n  .chat-input-container {\n    padding: 0 0.5rem 0.5rem 0.5rem;\n  }\n  .scroll-to-bottom-icon {\n    bottom: 12px;\n    width: 32px;\n    height: 32px;\n  }\n  .scroll-to-bottom-icon i {\n    font-size: 14px;\n  }\n}\n\n/* Artifact Picker Panel */\n.artifact-picker-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: var(--mj-bg-overlay);\n  z-index: 999;\n}\n\n.artifact-picker-panel {\n  position: fixed;\n  right: 0;\n  top: 0;\n  width: 360px;\n  height: 100%;\n  background: var(--mj-bg-surface);\n  border-left: 1px solid var(--mj-border-default);\n  z-index: 1000;\n  display: flex;\n  flex-direction: column;\n  box-shadow: -4px 0 12px rgba(0, 0, 0, 0.1);\n  animation: slideInRight 0.2s ease-out;\n}\n\n@keyframes slideInRight {\n  from { transform: translateX(100%); }\n  to { transform: translateX(0); }\n}\n\n.artifact-picker-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.artifact-picker-header h3 {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.artifact-picker-close {\n  background: none;\n  border: none;\n  cursor: pointer;\n  padding: 4px 8px;\n  color: var(--mj-text-muted);\n  border-radius: 4px;\n}\n\n.artifact-picker-close:hover {\n  background: var(--mj-bg-surface-hover);\n  color: var(--mj-text-primary);\n}\n\n.artifact-picker-body {\n  flex: 1;\n  overflow-y: auto;\n  padding: 12px;\n}\n\n.artifact-picker-empty {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 20px;\n  text-align: center;\n  color: var(--mj-text-muted);\n  gap: 8px;\n}\n\n.artifact-picker-hint {\n  font-size: 12px;\n  color: var(--mj-text-disabled);\n}\n\n.artifact-picker-list {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.artifact-picker-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 10px 12px;\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: 6px;\n  background: var(--mj-bg-surface-card);\n  cursor: pointer;\n  text-align: left;\n  width: 100%;\n  transition: background 0.15s, border-color 0.15s;\n}\n\n.artifact-picker-item:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-brand-primary);\n}\n\n.artifact-picker-item i {\n  font-size: 20px;\n  width: 24px;\n  text-align: center;\n  flex-shrink: 0;\n}\n\n.artifact-picker-item i.fa-file-pdf { color: var(--mj-status-error); }\n.artifact-picker-item i.fa-file-excel { color: var(--mj-status-success); }\n.artifact-picker-item i.fa-file-word { color: var(--mj-brand-primary); }\n.artifact-picker-item i.fa-file { color: var(--mj-text-muted); }\n\n.artifact-picker-item-info {\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n}\n\n.artifact-picker-item-name {\n  font-size: 13px;\n  font-weight: 500;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.artifact-picker-item-meta {\n  font-size: 11px;\n  color: var(--mj-text-muted);\n}\n\n/* ---------- Floating \"on call\" pill (minimized realtime voice session) ----------\n   Shown bottom-right of the chat panel while the live call overlay is minimized\n   (e.g. after a gear-gated dev link navigated to a record). The mic + session stay\n   live; tapping the pill restores the full call overlay. */\n.voice-call-pill {\n  position: absolute;\n  right: 18px;\n  bottom: 18px;\n  z-index: 49; /* just under the full call overlay (z-index 50) */\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 9px 16px 9px 13px;\n  border-radius: var(--mj-radius-full, 9999px);\n  border: 1px solid var(--mj-border-strong);\n  background: var(--mj-bg-surface-elevated, var(--mj-bg-surface));\n  color: var(--mj-text-primary);\n  font-family: inherit;\n  cursor: pointer;\n  box-shadow: 0 8px 24px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;\n}\n.voice-call-pill:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 10px 28px color-mix(in srgb, var(--mj-brand-primary) 28%, transparent);\n  transform: translateY(-1px);\n}\n.voice-call-pill i {\n  font-size: 14px;\n  color: var(--mj-brand-primary);\n}\n.voice-call-pill__pulse {\n  width: 9px;\n  height: 9px;\n  border-radius: 50%;\n  background: var(--mj-status-success);\n  flex-shrink: 0;\n  animation: voice-pill-pulse 1.6s ease-in-out infinite;\n}\n.voice-call-pill__text {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  line-height: 1.25;\n}\n.voice-call-pill__name {\n  font-size: 12.5px;\n  font-weight: 700;\n}\n.voice-call-pill__hint {\n  font-size: 10.5px;\n  color: var(--mj-text-muted);\n}\n@keyframes voice-pill-pulse {\n  0%, 100% {\n    box-shadow: 0 0 0 0 color-mix(in srgb, var(--mj-status-success) 45%, transparent);\n  }\n  50% {\n    box-shadow: 0 0 0 5px color-mix(in srgb, var(--mj-status-success) 0%, transparent);\n  }\n}\n"] }]
     }], () => [{ type: i1.AgentStateService }, { type: i2.ConversationAgentService }, { type: i3.ActiveTasksService }, { type: i0.ChangeDetectorRef }, { type: i4.ArtifactPermissionService }, { type: i5.ConversationAttachmentService }, { type: i6.ConversationStreamingService }, { type: i7.DialogService }, { type: i8.ConversationBridgeService }, { type: i9.AnalyzeArtifactService }, { type: i10.UICommandHandlerService }, { type: i9.InteractiveFormApplyService }, { type: i11.AgentClientService }], { environmentId: [{
             type: Input
         }], currentUser: [{
@@ -4286,8 +4399,42 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
             type: Input
         }], allowMentions: [{
             type: Input
+        }], allowAgentMentions: [{
+            type: Input
+        }], allowEntityMentions: [{
+            type: Input
+        }], allowSkillCommands: [{
+            type: Input
         }], allowAttachments: [{
             type: Input
+        }], allowPlanMode: [{
+            type: Input
+        }], allowRealtime: [{
+            type: Input
+        }], showEmptyFill: [{
+            type: Input
+        }], showLoadingState: [{
+            type: Input
+        }], showAgentRunDetails: [{
+            type: Input
+        }], showReactions: [{
+            type: Input
+        }], showMessageRating: [{
+            type: Input
+        }], allowPinning: [{
+            type: Input
+        }], allowMessageEdit: [{
+            type: Input
+        }], allowMessageDelete: [{
+            type: Input
+        }], showSuggestedPrompts: [{
+            type: Input
+        }], showDateNavigation: [{
+            type: Input
+        }], assistantDisplayName: [{
+            type: Input
+        }], assistantAvatarUrl: [{
+            type: Input
         }], isNewConversation: [{
             type: Input
         }], pendingMessage: [{
@@ -4306,6 +4453,12 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
             type: Input
         }], showExportButton: [{
             type: Input
+        }], exportButtonLabel: [{
+            type: Input
+        }], exportButtonIcon: [{
+            type: Input
+        }], exportBranding: [{
+            type: Input
         }], showShareButton: [{
             type: Input
         }], showArtifactIndicator: [{
@@ -4408,5 +4561,5 @@ export class ConversationChatAreaComponent extends BaseAngularComponent {
             type: ContentChildren,
             args: [ChatSlotDirective]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConversationChatAreaComponent, { className: "ConversationChatAreaComponent", filePath: "src/lib/components/conversation/conversation-chat-area.component.ts", lineNumber: 98 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConversationChatAreaComponent, { className: "ConversationChatAreaComponent", filePath: "src/lib/components/conversation/conversation-chat-area.component.ts", lineNumber: 99 }); })();
 //# sourceMappingURL=conversation-chat-area.component.js.map