@memberjunction/ng-conversations 2.128.0 → 2.129.0

package/dist/lib/components/conversation/conversation-list.component.js

@@ -10,110 +10,155 @@ import * as i5 from "@angular/forms";
 import * as i6 from "@progress/kendo-angular-dialog";
 import * as i7 from "../notification/notification-badge.component";
 const _forTrack0 = ($index, $item) => $item.ID;
+function ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 19);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Conditional_0_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onUnpinSidebarClick($event)); });
+    i0.ɵɵelement(1, "i", 22);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "Unpin Sidebar");
+    i0.ɵɵelementEnd()();
+} }
+function ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 19);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Conditional_1_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onPinSidebarClick($event)); });
+    i0.ɵɵelement(1, "i", 23);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "Pin Sidebar");
+    i0.ɵɵelementEnd()();
+} }
+function ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Conditional_0_Template, 4, 0, "button", 21)(1, ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Conditional_1_Template, 4, 0, "button", 21);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵconditional(ctx_r1.isSidebarPinned ? 0 : 1);
+} }
+function ConversationListComponent_Conditional_4_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 18)(1, "button", 19);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_4_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onSelectConversationsClick($event)); });
+    i0.ɵɵelement(2, "i", 20);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4, "Select Conversations");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(5, ConversationListComponent_Conditional_4_Conditional_3_Conditional_5_Template, 2, 1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(5);
+    i0.ɵɵconditional(!ctx_r1.isMobileView ? 5 : -1);
+} }
 function ConversationListComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 16);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleSelectionMode()); });
-    i0.ɵɵelement(1, "i", 17);
+    i0.ɵɵelementStart(0, "div", 4)(1, "button", 16);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_4_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleHeaderMenu($event)); });
+    i0.ɵɵelement(2, "i", 17);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(3, ConversationListComponent_Conditional_4_Conditional_3_Template, 6, 1, "div", 18);
     i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r1.isHeaderMenuOpen ? 3 : -1);
 } }
 function ConversationListComponent_Conditional_10_For_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 20)(1, "input", 29);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_1_Template_input_click_1_listener($event) { i0.ɵɵrestoreView(_r6); const conversation_r5 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); $event.stopPropagation(); return i0.ɵɵresetView(ctx_r1.toggleConversationSelection(conversation_r5.ID)); });
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 26)(1, "input", 35);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_1_Template_input_click_1_listener($event) { i0.ɵɵrestoreView(_r9); const conversation_r8 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); $event.stopPropagation(); return i0.ɵɵresetView(ctx_r1.toggleConversationSelection(conversation_r8.ID)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const conversation_r5 = i0.ɵɵnextContext().$implicit;
+    const conversation_r8 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("checked", ctx_r1.selectedConversationIds.has(conversation_r5.ID));
+    i0.ɵɵproperty("checked", ctx_r1.selectedConversationIds.has(conversation_r8.ID));
 } }
 function ConversationListComponent_Conditional_10_For_9_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 22);
-    i0.ɵɵelement(1, "i", 30);
+    i0.ɵɵelementStart(0, "div", 28);
+    i0.ɵɵelement(1, "i", 36);
     i0.ɵɵelementEnd();
 } }
 function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 34);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r8); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(1, "button", 35);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r8); const conversation_r5 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.togglePin(conversation_r5, $event)); });
-    i0.ɵɵelement(2, "i", 36);
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 40);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r11); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(1, "button", 41);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r11); const conversation_r8 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.togglePin(conversation_r8, $event)); });
+    i0.ɵɵelement(2, "i", 23);
     i0.ɵɵelementStart(3, "span");
     i0.ɵɵtext(4, "Unpin");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "button", 35);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r8); const conversation_r5 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); ctx_r1.renameConversation(conversation_r5); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
-    i0.ɵɵelement(6, "i", 37);
+    i0.ɵɵelementStart(5, "button", 41);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r11); const conversation_r8 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); ctx_r1.renameConversation(conversation_r8); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
+    i0.ɵɵelement(6, "i", 42);
     i0.ɵɵelementStart(7, "span");
     i0.ɵɵtext(8, "Rename");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(9, "div", 38);
-    i0.ɵɵelementStart(10, "button", 39);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r8); const conversation_r5 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); ctx_r1.deleteConversation(conversation_r5); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
-    i0.ɵɵelement(11, "i", 40);
+    i0.ɵɵelement(9, "div", 43);
+    i0.ɵɵelementStart(10, "button", 44);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r11); const conversation_r8 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); ctx_r1.deleteConversation(conversation_r8); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
+    i0.ɵɵelement(11, "i", 45);
     i0.ɵɵelementStart(12, "span");
     i0.ɵɵtext(13, "Delete");
     i0.ɵɵelementEnd()()();
 } }
 function ConversationListComponent_Conditional_10_For_9_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 28)(1, "button", 31);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r7); const conversation_r5 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleMenu(conversation_r5.ID, $event)); });
-    i0.ɵɵelement(2, "i", 32);
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 34)(1, "button", 37);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Conditional_11_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r10); const conversation_r8 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleMenu(conversation_r8.ID, $event)); });
+    i0.ɵɵelement(2, "i", 38);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(3, ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template, 14, 0, "div", 33);
+    i0.ɵɵtemplate(3, ConversationListComponent_Conditional_10_For_9_Conditional_11_Conditional_3_Template, 14, 0, "div", 39);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const conversation_r5 = i0.ɵɵnextContext().$implicit;
+    const conversation_r8 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.openMenuConversationId === conversation_r5.ID ? 3 : -1);
+    i0.ɵɵconditional(ctx_r1.openMenuConversationId === conversation_r8.ID ? 3 : -1);
 } }
 function ConversationListComponent_Conditional_10_For_9_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 19);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Template_div_click_0_listener() { const conversation_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleConversationClick(conversation_r5)); });
-    i0.ɵɵtemplate(1, ConversationListComponent_Conditional_10_For_9_Conditional_1_Template, 2, 1, "div", 20);
-    i0.ɵɵelementStart(2, "div", 21);
-    i0.ɵɵtemplate(3, ConversationListComponent_Conditional_10_For_9_Conditional_3_Template, 2, 0, "div", 22);
-    i0.ɵɵelementStart(4, "div", 23);
-    i0.ɵɵelement(5, "mj-notification-badge", 24);
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 25);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_For_9_Template_div_click_0_listener() { const conversation_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleConversationClick(conversation_r8)); });
+    i0.ɵɵtemplate(1, ConversationListComponent_Conditional_10_For_9_Conditional_1_Template, 2, 1, "div", 26);
+    i0.ɵɵelementStart(2, "div", 27);
+    i0.ɵɵtemplate(3, ConversationListComponent_Conditional_10_For_9_Conditional_3_Template, 2, 0, "div", 28);
+    i0.ɵɵelementStart(4, "div", 29);
+    i0.ɵɵelement(5, "mj-notification-badge", 30);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "div", 25)(7, "div", 26);
+    i0.ɵɵelementStart(6, "div", 31)(7, "div", 32);
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "div", 27);
+    i0.ɵɵelementStart(9, "div", 33);
     i0.ɵɵtext(10);
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(11, ConversationListComponent_Conditional_10_For_9_Conditional_11_Template, 4, 1, "div", 28);
+    i0.ɵɵtemplate(11, ConversationListComponent_Conditional_10_For_9_Conditional_11_Template, 4, 1, "div", 34);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const conversation_r5 = ctx.$implicit;
+    const conversation_r8 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("active", conversation_r5.ID === ctx_r1.selectedConversationId)("renamed", conversation_r5.ID === ctx_r1.renamedConversationId);
+    i0.ɵɵclassProp("active", conversation_r8.ID === ctx_r1.selectedConversationId)("renamed", conversation_r8.ID === ctx_r1.renamedConversationId);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.isSelectionMode ? 1 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.hasActiveTasks(conversation_r5.ID) ? 3 : -1);
+    i0.ɵɵconditional(ctx_r1.hasActiveTasks(conversation_r8.ID) ? 3 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("conversationId", conversation_r5.ID);
+    i0.ɵɵproperty("conversationId", conversation_r8.ID);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("title", conversation_r5.Name + (conversation_r5.Description ? "\n" + conversation_r5.Description : ""));
+    i0.ɵɵproperty("title", conversation_r8.Name + (conversation_r8.Description ? "\n" + conversation_r8.Description : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(conversation_r5.Name);
+    i0.ɵɵtextInterpolate(conversation_r8.Name);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(conversation_r5.Description);
+    i0.ɵɵtextInterpolate(conversation_r8.Description);
     i0.ɵɵadvance();
     i0.ɵɵconditional(!ctx_r1.isSelectionMode ? 11 : -1);
 } }
 function ConversationListComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
+    const _r6 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 8)(1, "div", 10);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.togglePinned()); });
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_10_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.togglePinned()); });
     i0.ɵɵelementStart(2, "div", 11);
-    i0.ɵɵelement(3, "i", 12)(4, "i", 18);
+    i0.ɵɵelement(3, "i", 12)(4, "i", 24);
     i0.ɵɵelementStart(5, "span");
     i0.ɵɵtext(6, "Pinned");
     i0.ɵɵelementEnd()()();
@@ -130,124 +175,124 @@ function ConversationListComponent_Conditional_10_Template(rf, ctx) { if (rf & 1
     i0.ɵɵrepeater(ctx_r1.pinnedConversations);
 } }
 function ConversationListComponent_For_19_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 20)(1, "input", 29);
-    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_1_Template_input_click_1_listener($event) { i0.ɵɵrestoreView(_r11); const conversation_r10 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); $event.stopPropagation(); return i0.ɵɵresetView(ctx_r1.toggleConversationSelection(conversation_r10.ID)); });
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 26)(1, "input", 35);
+    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_1_Template_input_click_1_listener($event) { i0.ɵɵrestoreView(_r14); const conversation_r13 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); $event.stopPropagation(); return i0.ɵɵresetView(ctx_r1.toggleConversationSelection(conversation_r13.ID)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const conversation_r10 = i0.ɵɵnextContext().$implicit;
+    const conversation_r13 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("checked", ctx_r1.selectedConversationIds.has(conversation_r10.ID));
+    i0.ɵɵproperty("checked", ctx_r1.selectedConversationIds.has(conversation_r13.ID));
 } }
 function ConversationListComponent_For_19_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 22);
-    i0.ɵɵelement(1, "i", 30);
+    i0.ɵɵelementStart(0, "div", 28);
+    i0.ɵɵelement(1, "i", 36);
     i0.ɵɵelementEnd();
 } }
 function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r13 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 34);
-    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r13); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelementStart(1, "button", 35);
-    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r13); const conversation_r10 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.togglePin(conversation_r10, $event)); });
-    i0.ɵɵelement(2, "i", 36);
+    const _r16 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 40);
+    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r16); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(1, "button", 41);
+    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r16); const conversation_r13 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.togglePin(conversation_r13, $event)); });
+    i0.ɵɵelement(2, "i", 23);
     i0.ɵɵelementStart(3, "span");
     i0.ɵɵtext(4, "Pin");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "button", 35);
-    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r13); const conversation_r10 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.renameConversation(conversation_r10); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
-    i0.ɵɵelement(6, "i", 37);
+    i0.ɵɵelementStart(5, "button", 41);
+    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r16); const conversation_r13 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.renameConversation(conversation_r13); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
+    i0.ɵɵelement(6, "i", 42);
     i0.ɵɵelementStart(7, "span");
     i0.ɵɵtext(8, "Rename");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelement(9, "div", 38);
-    i0.ɵɵelementStart(10, "button", 39);
-    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r13); const conversation_r10 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.deleteConversation(conversation_r10); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
-    i0.ɵɵelement(11, "i", 40);
+    i0.ɵɵelement(9, "div", 43);
+    i0.ɵɵelementStart(10, "button", 44);
+    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Conditional_3_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r16); const conversation_r13 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.deleteConversation(conversation_r13); return i0.ɵɵresetView(ctx_r1.closeMenu()); });
+    i0.ɵɵelement(11, "i", 45);
     i0.ɵɵelementStart(12, "span");
     i0.ɵɵtext(13, "Delete");
     i0.ɵɵelementEnd()()();
 } }
 function ConversationListComponent_For_19_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 28)(1, "button", 31);
-    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r12); const conversation_r10 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleMenu(conversation_r10.ID, $event)); });
-    i0.ɵɵelement(2, "i", 32);
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 34)(1, "button", 37);
+    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Conditional_11_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r15); const conversation_r13 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleMenu(conversation_r13.ID, $event)); });
+    i0.ɵɵelement(2, "i", 38);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(3, ConversationListComponent_For_19_Conditional_11_Conditional_3_Template, 14, 0, "div", 33);
+    i0.ɵɵtemplate(3, ConversationListComponent_For_19_Conditional_11_Conditional_3_Template, 14, 0, "div", 39);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const conversation_r10 = i0.ɵɵnextContext().$implicit;
+    const conversation_r13 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.openMenuConversationId === conversation_r10.ID ? 3 : -1);
+    i0.ɵɵconditional(ctx_r1.openMenuConversationId === conversation_r13.ID ? 3 : -1);
 } }
 function ConversationListComponent_For_19_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 19);
-    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Template_div_click_0_listener() { const conversation_r10 = i0.ɵɵrestoreView(_r9).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleConversationClick(conversation_r10)); });
-    i0.ɵɵtemplate(1, ConversationListComponent_For_19_Conditional_1_Template, 2, 1, "div", 20);
-    i0.ɵɵelementStart(2, "div", 21);
-    i0.ɵɵtemplate(3, ConversationListComponent_For_19_Conditional_3_Template, 2, 0, "div", 22);
-    i0.ɵɵelementStart(4, "div", 23);
-    i0.ɵɵelement(5, "mj-notification-badge", 24);
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 25);
+    i0.ɵɵlistener("click", function ConversationListComponent_For_19_Template_div_click_0_listener() { const conversation_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleConversationClick(conversation_r13)); });
+    i0.ɵɵtemplate(1, ConversationListComponent_For_19_Conditional_1_Template, 2, 1, "div", 26);
+    i0.ɵɵelementStart(2, "div", 27);
+    i0.ɵɵtemplate(3, ConversationListComponent_For_19_Conditional_3_Template, 2, 0, "div", 28);
+    i0.ɵɵelementStart(4, "div", 29);
+    i0.ɵɵelement(5, "mj-notification-badge", 30);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "div", 25)(7, "div", 26);
+    i0.ɵɵelementStart(6, "div", 31)(7, "div", 32);
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "div", 27);
+    i0.ɵɵelementStart(9, "div", 33);
     i0.ɵɵtext(10);
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(11, ConversationListComponent_For_19_Conditional_11_Template, 4, 1, "div", 28);
+    i0.ɵɵtemplate(11, ConversationListComponent_For_19_Conditional_11_Template, 4, 1, "div", 34);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const conversation_r10 = ctx.$implicit;
+    const conversation_r13 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("active", conversation_r10.ID === ctx_r1.selectedConversationId)("renamed", conversation_r10.ID === ctx_r1.renamedConversationId);
+    i0.ɵɵclassProp("active", conversation_r13.ID === ctx_r1.selectedConversationId)("renamed", conversation_r13.ID === ctx_r1.renamedConversationId);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.isSelectionMode ? 1 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.hasActiveTasks(conversation_r10.ID) ? 3 : -1);
+    i0.ɵɵconditional(ctx_r1.hasActiveTasks(conversation_r13.ID) ? 3 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("conversationId", conversation_r10.ID);
+    i0.ɵɵproperty("conversationId", conversation_r13.ID);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("title", conversation_r10.Name + (conversation_r10.Description ? "\n" + conversation_r10.Description : ""));
+    i0.ɵɵproperty("title", conversation_r13.Name + (conversation_r13.Description ? "\n" + conversation_r13.Description : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(conversation_r10.Name);
+    i0.ɵɵtextInterpolate(conversation_r13.Name);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(conversation_r10.Description);
+    i0.ɵɵtextInterpolate(conversation_r13.Description);
     i0.ɵɵadvance();
     i0.ɵɵconditional(!ctx_r1.isSelectionMode ? 11 : -1);
 } }
 function ConversationListComponent_Conditional_20_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 47);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.selectAll()); });
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 52);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Conditional_4_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.selectAll()); });
     i0.ɵɵtext(1, "Select All");
     i0.ɵɵelementEnd();
 } }
 function ConversationListComponent_Conditional_20_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 47);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.deselectAll()); });
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 52);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.deselectAll()); });
     i0.ɵɵtext(1, "Deselect All");
     i0.ɵɵelementEnd();
 } }
 function ConversationListComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 15)(1, "div", 41)(2, "span", 42);
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 15)(1, "div", 46)(2, "span", 47);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(4, ConversationListComponent_Conditional_20_Conditional_4_Template, 2, 0, "button", 43)(5, ConversationListComponent_Conditional_20_Conditional_5_Template, 2, 0, "button", 43);
+    i0.ɵɵtemplate(4, ConversationListComponent_Conditional_20_Conditional_4_Template, 2, 0, "button", 48)(5, ConversationListComponent_Conditional_20_Conditional_5_Template, 2, 0, "button", 48);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 44)(7, "button", 45);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.bulkDeleteConversations()); });
-    i0.ɵɵelement(8, "i", 40);
+    i0.ɵɵelementStart(6, "div", 49)(7, "button", 50);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.bulkDeleteConversations()); });
+    i0.ɵɵelement(8, "i", 45);
     i0.ɵɵtext(9);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 46);
-    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleSelectionMode()); });
+    i0.ɵɵelementStart(10, "button", 51);
+    i0.ɵɵlistener("click", function ConversationListComponent_Conditional_20_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleSelectionMode()); });
     i0.ɵɵtext(11, " Cancel ");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -271,8 +316,12 @@ export class ConversationListComponent {
     currentUser;
     selectedConversationId = null;
     renamedConversationId = null;
+    isSidebarPinned = true; // Whether sidebar is pinned (stays open after selection)
+    isMobileView = false; // Whether we're on mobile (no pin options)
     conversationSelected = new EventEmitter();
     newConversationRequested = new EventEmitter();
+    pinSidebarRequested = new EventEmitter(); // Request to pin sidebar
+    unpinSidebarRequested = new EventEmitter(); // Request to unpin (collapse) sidebar
     directMessagesExpanded = true;
     pinnedExpanded = true;
     openMenuConversationId = null;
@@ -280,6 +329,7 @@ export class ConversationListComponent {
     isSelectionMode = false;
     selectedConversationIds = new Set();
     searchQuery = '';
+    isHeaderMenuOpen = false;
     destroy$ = new Subject();
     constructor(conversationData, dialogService, notificationService, activeTasksService, cdr) {
         this.conversationData = conversationData;
@@ -316,10 +366,35 @@ export class ConversationListComponent {
         this.destroy$.complete();
     }
     onDocumentClick() {
-        // Close menu when clicking outside
+        // Close menus when clicking outside
         if (this.openMenuConversationId) {
             this.closeMenu();
         }
+        if (this.isHeaderMenuOpen) {
+            this.closeHeaderMenu();
+        }
+    }
+    toggleHeaderMenu(event) {
+        event.stopPropagation();
+        this.isHeaderMenuOpen = !this.isHeaderMenuOpen;
+    }
+    closeHeaderMenu() {
+        this.isHeaderMenuOpen = false;
+    }
+    onSelectConversationsClick(event) {
+        event.stopPropagation();
+        this.toggleSelectionMode();
+        this.closeHeaderMenu();
+    }
+    onPinSidebarClick(event) {
+        event.stopPropagation();
+        this.closeHeaderMenu();
+        this.pinSidebarRequested.emit();
+    }
+    onUnpinSidebarClick(event) {
+        event.stopPropagation();
+        this.closeHeaderMenu();
+        this.unpinSidebarRequested.emit();
     }
     toggleDirectMessages() {
         this.directMessagesExpanded = !this.directMessagesExpanded;
@@ -464,11 +539,11 @@ export class ConversationListComponent {
     static ɵfac = function ConversationListComponent_Factory(t) { return new (t || ConversationListComponent)(i0.ɵɵdirectiveInject(i1.ConversationDataService), i0.ɵɵdirectiveInject(i2.DialogService), i0.ɵɵdirectiveInject(i3.NotificationService), i0.ɵɵdirectiveInject(i4.ActiveTasksService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConversationListComponent, selectors: [["mj-conversation-list"]], hostBindings: function ConversationListComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("click", function ConversationListComponent_click_HostBindingHandler() { return ctx.onDocumentClick(); }, false, i0.ɵɵresolveDocument);
-        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser", selectedConversationId: "selectedConversationId", renamedConversationId: "renamedConversationId" }, outputs: { conversationSelected: "conversationSelected", newConversationRequested: "newConversationRequested" }, decls: 21, vars: 8, consts: [["kendoDialogContainer", "", 1, "conversation-list"], [1, "list-header"], [1, "header-top"], ["type", "text", "placeholder", "Search conversations...", 1, "search-input", 3, "ngModelChange", "ngModel"], ["title", "Select conversations", 1, "btn-select"], ["title", "New Conversation", 1, "btn-new-conversation", 3, "click"], [1, "fas", "fa-plus"], [1, "list-content"], [1, "sidebar-section", "pinned-section"], [1, "sidebar-section"], [1, "section-header", 3, "click"], [1, "section-title"], [1, "fas", "fa-chevron-right"], [1, "chat-list"], [1, "conversation-item", 3, "active", "renamed"], [1, "selection-action-bar"], ["title", "Select conversations", 1, "btn-select", 3, "click"], [1, "fas", "fa-check-square"], [1, "fas", "fa-thumbtack", "section-icon"], [1, "conversation-item", 3, "click"], [1, "conversation-checkbox"], [1, "conversation-icon-wrapper"], [1, "conversation-icon", "has-tasks"], [1, "badge-overlay"], [3, "conversationId"], [1, "conversation-info", 3, "title"], [1, "conversation-name"], [1, "conversation-preview"], [1, "conversation-actions"], ["type", "checkbox", 3, "click", "checked"], [1, "fas", "fa-spinner", "fa-pulse"], ["title", "More options", 1, "menu-btn", 3, "click"], [1, "fas", "fa-ellipsis"], [1, "context-menu"], [1, "context-menu", 3, "click"], [1, "menu-item", 3, "click"], [1, "fas", "fa-thumbtack"], [1, "fas", "fa-edit"], [1, "menu-divider"], [1, "menu-item", "danger", 3, "click"], [1, "fas", "fa-trash"], [1, "selection-info"], [1, "selection-count"], [1, "link-btn"], [1, "selection-actions"], [1, "btn-delete-bulk", 3, "click", "disabled"], [1, "btn-cancel", 3, "click"], [1, "link-btn", 3, "click"]], template: function ConversationListComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { environmentId: "environmentId", currentUser: "currentUser", selectedConversationId: "selectedConversationId", renamedConversationId: "renamedConversationId", isSidebarPinned: "isSidebarPinned", isMobileView: "isMobileView" }, outputs: { conversationSelected: "conversationSelected", newConversationRequested: "newConversationRequested", pinSidebarRequested: "pinSidebarRequested", unpinSidebarRequested: "unpinSidebarRequested" }, decls: 21, vars: 8, consts: [["kendoDialogContainer", "", 1, "conversation-list"], [1, "list-header"], [1, "header-top"], ["type", "text", "placeholder", "Search conversations...", 1, "search-input", 3, "ngModelChange", "ngModel"], [1, "header-menu-container"], ["title", "New Conversation", 1, "btn-new-conversation", 3, "click"], [1, "fas", "fa-plus"], [1, "list-content"], [1, "sidebar-section", "pinned-section"], [1, "sidebar-section"], [1, "section-header", 3, "click"], [1, "section-title"], [1, "fas", "fa-chevron-right"], [1, "chat-list"], [1, "conversation-item", 3, "active", "renamed"], [1, "selection-action-bar"], ["title", "Options", 1, "btn-menu", 3, "click"], [1, "fas", "fa-ellipsis-v"], [1, "header-dropdown-menu"], [1, "dropdown-item", 3, "click"], [1, "fas", "fa-check-square"], [1, "dropdown-item"], [1, "fas", "fa-thumbtack-slash"], [1, "fas", "fa-thumbtack"], [1, "fas", "fa-thumbtack", "section-icon"], [1, "conversation-item", 3, "click"], [1, "conversation-checkbox"], [1, "conversation-icon-wrapper"], [1, "conversation-icon", "has-tasks"], [1, "badge-overlay"], [3, "conversationId"], [1, "conversation-info", 3, "title"], [1, "conversation-name"], [1, "conversation-preview"], [1, "conversation-actions"], ["type", "checkbox", 3, "click", "checked"], [1, "fas", "fa-spinner", "fa-pulse"], ["title", "More options", 1, "menu-btn", 3, "click"], [1, "fas", "fa-ellipsis"], [1, "context-menu"], [1, "context-menu", 3, "click"], [1, "menu-item", 3, "click"], [1, "fas", "fa-edit"], [1, "menu-divider"], [1, "menu-item", "danger", 3, "click"], [1, "fas", "fa-trash"], [1, "selection-info"], [1, "selection-count"], [1, "link-btn"], [1, "selection-actions"], [1, "btn-delete-bulk", 3, "click", "disabled"], [1, "btn-cancel", 3, "click"], [1, "link-btn", 3, "click"]], template: function ConversationListComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "input", 3);
             i0.ɵɵtwoWayListener("ngModelChange", function ConversationListComponent_Template_input_ngModelChange_3_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.searchQuery, $event) || (ctx.searchQuery = $event); return $event; });
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(4, ConversationListComponent_Conditional_4_Template, 2, 0, "button", 4);
+            i0.ɵɵtemplate(4, ConversationListComponent_Conditional_4_Template, 4, 1, "div", 4);
             i0.ɵɵelementEnd()();
             i0.ɵɵelementStart(5, "button", 5);
             i0.ɵɵlistener("click", function ConversationListComponent_Template_button_click_5_listener() { return ctx.createNewConversation(); });
@@ -505,7 +580,7 @@ export class ConversationListComponent {
             i0.ɵɵrepeater(ctx.unpinnedConversations);
             i0.ɵɵadvance(2);
             i0.ɵɵconditional(ctx.isSelectionMode ? 20 : -1);
-        } }, dependencies: [i5.DefaultValueAccessor, i5.NgControlStatus, i5.NgModel, i6.DialogContainerDirective, i7.NotificationBadgeComponent], styles: ["[_nghost-%COMP%] { display: block; height: 100%; }\n    .conversation-list[_ngcontent-%COMP%] { display: flex; flex-direction: column; height: 100%; background: #092340; }\n    .list-header[_ngcontent-%COMP%] { padding: 8px; border-bottom: 1px solid rgba(255,255,255,0.1); }\n    .search-input[_ngcontent-%COMP%] {\n      width: 100%;\n      padding: 8px 12px;\n      background: rgba(255,255,255,0.1);\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: white;\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input[_ngcontent-%COMP%]::placeholder { color: rgba(255,255,255,0.5); }\n    .search-input[_ngcontent-%COMP%]:focus { outline: none; background: rgba(255,255,255,0.15); border-color: #0076B6; }\n    .btn-new-conversation[_ngcontent-%COMP%] {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: #0076B6;\n      color: white;\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation[_ngcontent-%COMP%]:hover { background: #005A8C; }\n    .btn-new-conversation[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n    .list-content[_ngcontent-%COMP%] { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    \n\n    .sidebar-section[_ngcontent-%COMP%] { margin-bottom: 20px; }\n    .pinned-section[_ngcontent-%COMP%]   .section-header[_ngcontent-%COMP%] {\n      background: rgba(255, 193, 7, 0.08);\n      border-radius: 4px;\n      margin: 0 4px;\n    }\n    .pinned-section[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   .section-icon[_ngcontent-%COMP%] {\n      color: #FFC107;\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header[_ngcontent-%COMP%] {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: rgba(255, 255, 255, 0.7);\n      font-size: 13px;\n      font-weight: 500;\n      transition: color 0.2s;\n      user-select: none;\n    }\n    .section-header[_ngcontent-%COMP%]:hover { color: white; }\n    .section-title[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      transition: transform 0.2s;\n    }\n    .section-header.expanded[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { transform: rotate(90deg); }\n    .chat-list[_ngcontent-%COMP%] {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded[_ngcontent-%COMP%] { display: block; }\n\n    .conversation-item[_ngcontent-%COMP%] {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: rgba(255,255,255,0.7);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover { background: rgba(255,255,255,0.08); color: white; }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; }\n    .conversation-item.active[_ngcontent-%COMP%] { background: #0076B6; color: white; }\n    .conversation-icon-wrapper[_ngcontent-%COMP%] { position: relative; flex-shrink: 0; }\n    .conversation-icon[_ngcontent-%COMP%] { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks[_ngcontent-%COMP%] { color: #fb923c; }\n    .badge-overlay[_ngcontent-%COMP%] { position: absolute; top: -4px; right: -4px; }\n    .conversation-info[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n    .conversation-name[_ngcontent-%COMP%] { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-preview[_ngcontent-%COMP%] { font-size: 12px; color: rgba(255,255,255,0.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-preview[_ngcontent-%COMP%] { color: rgba(255,255,255,0.8); }\n    .conversation-meta[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    \n\n    .project-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: rgba(255, 255, 255, 0.1);\n      color: rgba(255, 255, 255, 0.6);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .project-badge[_ngcontent-%COMP%] {\n      background-color: rgba(255, 255, 255, 0.15);\n      color: rgba(255, 255, 255, 0.8);\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .project-badge[_ngcontent-%COMP%] {\n      background-color: rgba(255, 255, 255, 0.2);\n      color: white;\n    }\n\n    .conversation-actions[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-actions[_ngcontent-%COMP%]    > *[_ngcontent-%COMP%] { pointer-events: auto; }\n    .pinned-icon[_ngcontent-%COMP%] { color: #AAE7FD; font-size: 12px; }\n\n    \n\n    .task-indicator[_ngcontent-%COMP%] {\n      color: #fb923c;\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: _ngcontent-%COMP%_pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes _ngcontent-%COMP%_pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px #fb923c);\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px #fb923c);\n      }\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .task-indicator[_ngcontent-%COMP%] {\n      color: #fbbf24;\n    }\n\n    .menu-btn[_ngcontent-%COMP%] {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      background: #092340 !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.15) !important;\n      color: white;\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .menu-btn[_ngcontent-%COMP%] {\n      background: #005A8C !important;\n      color: white;\n    }\n    .menu-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n\n    .context-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: 100%;\n      right: 0;\n      margin-top: 4px;\n      min-width: 160px;\n      background: #0A2742;\n      border: 1px solid rgba(255,255,255,0.15);\n      border-radius: 8px;\n      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n      z-index: 1001;\n      overflow: hidden;\n      pointer-events: auto;\n    }\n\n    .menu-item[_ngcontent-%COMP%] {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: rgba(255,255,255,0.85);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      width: 16px;\n      font-size: 13px;\n      color: rgba(255,255,255,0.6);\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: white;\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%] {\n      color: rgba(239, 68, 68, 0.9);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover {\n      background: rgba(239, 68, 68, 0.15);\n      color: #ff6b6b;\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: rgba(239, 68, 68, 0.8);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: #ff6b6b;\n    }\n\n    .menu-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: rgba(255,255,255,0.1);\n      margin: 4px 0;\n    }\n\n    \n\n    .conversation-item.renamed[_ngcontent-%COMP%] {\n      animation: _ngcontent-%COMP%_renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    @keyframes _ngcontent-%COMP%_renameHighlight {\n      0% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.4), rgba(147, 51, 234, 0.4));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px rgba(59, 130, 246, 0.5);\n      }\n      25% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.35), rgba(147, 51, 234, 0.35));\n        box-shadow: 0 0 15px rgba(59, 130, 246, 0.4);\n      }\n      50% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.3), rgba(59, 130, 246, 0.3));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px rgba(16, 185, 129, 0.3);\n      }\n      75% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.2), rgba(59, 130, 246, 0.2));\n        box-shadow: 0 0 5px rgba(16, 185, 129, 0.2);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    \n\n    .header-top[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    }\n\n    .btn-select[_ngcontent-%COMP%] {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n      border-color: rgba(255,255,255,0.3);\n    }\n\n    .conversation-checkbox[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      margin-right: 8px;\n      flex-shrink: 0;\n    }\n\n    .conversation-checkbox[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n      width: 18px;\n      height: 18px;\n      cursor: pointer;\n      accent-color: #0076B6;\n    }\n\n    .selection-action-bar[_ngcontent-%COMP%] {\n      position: sticky;\n      bottom: 0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      background: #0A2742;\n      border-top: 1px solid rgba(255,255,255,0.15);\n      gap: 12px;\n      flex-wrap: wrap;\n      flex-shrink: 0;\n    }\n\n    .selection-info[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      color: rgba(255,255,255,0.9);\n      font-size: 14px;\n      font-weight: 500;\n      flex: 1 1 auto;\n      min-width: 150px;\n    }\n\n    .selection-count[_ngcontent-%COMP%] {\n      color: white;\n    }\n\n    .link-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: #AAE7FD;\n      cursor: pointer;\n      font-size: 13px;\n      text-decoration: underline;\n      padding: 0;\n      transition: color 0.2s;\n    }\n\n    .link-btn[_ngcontent-%COMP%]:hover {\n      color: white;\n    }\n\n    .selection-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      flex: 0 0 auto;\n    }\n\n    .btn-cancel[_ngcontent-%COMP%] {\n      padding: 8px 16px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 500;\n      transition: all 0.2s;\n    }\n\n    .btn-cancel[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      background: #DC2626;\n      border: none;\n      border-radius: 6px;\n      color: white;\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 600;\n      transition: all 0.2s;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: #B91C1C;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 12px;\n    }"] });
+        } }, dependencies: [i5.DefaultValueAccessor, i5.NgControlStatus, i5.NgModel, i6.DialogContainerDirective, i7.NotificationBadgeComponent], styles: ["[_nghost-%COMP%] { display: block; height: 100%; }\n    .conversation-list[_ngcontent-%COMP%] { display: flex; flex-direction: column; height: 100%; background: #092340; }\n    .list-header[_ngcontent-%COMP%] { padding: 8px; border-bottom: 1px solid rgba(255,255,255,0.1); }\n    .search-input[_ngcontent-%COMP%] {\n      width: 100%;\n      padding: 8px 12px;\n      background: rgba(255,255,255,0.1);\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: white;\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input[_ngcontent-%COMP%]::placeholder { color: rgba(255,255,255,0.5); }\n    .search-input[_ngcontent-%COMP%]:focus { outline: none; background: rgba(255,255,255,0.15); border-color: #0076B6; }\n    .btn-new-conversation[_ngcontent-%COMP%] {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: #0076B6;\n      color: white;\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation[_ngcontent-%COMP%]:hover { background: #005A8C; }\n    .btn-new-conversation[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n    .list-content[_ngcontent-%COMP%] { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    \n\n    .sidebar-section[_ngcontent-%COMP%] { margin-bottom: 20px; }\n    .pinned-section[_ngcontent-%COMP%]   .section-header[_ngcontent-%COMP%] {\n      background: rgba(255, 193, 7, 0.08);\n      border-radius: 4px;\n      margin: 0 4px;\n    }\n    .pinned-section[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   .section-icon[_ngcontent-%COMP%] {\n      color: #FFC107;\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header[_ngcontent-%COMP%] {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: rgba(255, 255, 255, 0.7);\n      font-size: 13px;\n      font-weight: 500;\n      transition: color 0.2s;\n      user-select: none;\n    }\n    .section-header[_ngcontent-%COMP%]:hover { color: white; }\n    .section-title[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 10px;\n      transition: transform 0.2s;\n    }\n    .section-header.expanded[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { transform: rotate(90deg); }\n    .chat-list[_ngcontent-%COMP%] {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded[_ngcontent-%COMP%] { display: block; }\n\n    .conversation-item[_ngcontent-%COMP%] {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: rgba(255,255,255,0.7);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover { background: rgba(255,255,255,0.08); color: white; }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; }\n    .conversation-item.active[_ngcontent-%COMP%] { background: #0076B6; color: white; }\n    .conversation-icon-wrapper[_ngcontent-%COMP%] { position: relative; flex-shrink: 0; }\n    .conversation-icon[_ngcontent-%COMP%] { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks[_ngcontent-%COMP%] { color: #fb923c; }\n    .badge-overlay[_ngcontent-%COMP%] { position: absolute; top: -4px; right: -4px; }\n    .conversation-info[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n    .conversation-name[_ngcontent-%COMP%] { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-preview[_ngcontent-%COMP%] { font-size: 12px; color: rgba(255,255,255,0.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-preview[_ngcontent-%COMP%] { color: rgba(255,255,255,0.8); }\n    .conversation-meta[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    \n\n    .project-badge[_ngcontent-%COMP%] {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: rgba(255, 255, 255, 0.1);\n      color: rgba(255, 255, 255, 0.6);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .project-badge[_ngcontent-%COMP%] {\n      background-color: rgba(255, 255, 255, 0.15);\n      color: rgba(255, 255, 255, 0.8);\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .project-badge[_ngcontent-%COMP%] {\n      background-color: rgba(255, 255, 255, 0.2);\n      color: white;\n    }\n\n    .conversation-actions[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item[_ngcontent-%COMP%]:hover   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-item.active[_ngcontent-%COMP%]   .conversation-actions[_ngcontent-%COMP%] { opacity: 1; pointer-events: auto; }\n    .conversation-actions[_ngcontent-%COMP%]    > *[_ngcontent-%COMP%] { pointer-events: auto; }\n    .pinned-icon[_ngcontent-%COMP%] { color: #AAE7FD; font-size: 12px; }\n\n    \n\n    .task-indicator[_ngcontent-%COMP%] {\n      color: #fb923c;\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: _ngcontent-%COMP%_pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes _ngcontent-%COMP%_pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px #fb923c);\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px #fb923c);\n      }\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .task-indicator[_ngcontent-%COMP%] {\n      color: #fbbf24;\n    }\n\n    .menu-btn[_ngcontent-%COMP%] {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      background: #092340 !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.15) !important;\n      color: white;\n    }\n    .conversation-item.active[_ngcontent-%COMP%]   .menu-btn[_ngcontent-%COMP%] {\n      background: #005A8C !important;\n      color: white;\n    }\n    .menu-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 14px; }\n\n    .context-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: 100%;\n      right: 0;\n      margin-top: 4px;\n      min-width: 160px;\n      background: #0A2742;\n      border: 1px solid rgba(255,255,255,0.15);\n      border-radius: 8px;\n      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n      z-index: 1001;\n      overflow: hidden;\n      pointer-events: auto;\n    }\n\n    .menu-item[_ngcontent-%COMP%] {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: rgba(255,255,255,0.85);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .menu-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      width: 16px;\n      font-size: 13px;\n      color: rgba(255,255,255,0.6);\n    }\n\n    .menu-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: white;\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%] {\n      color: rgba(239, 68, 68, 0.9);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover {\n      background: rgba(239, 68, 68, 0.15);\n      color: #ff6b6b;\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: rgba(239, 68, 68, 0.8);\n    }\n\n    .menu-item.danger[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: #ff6b6b;\n    }\n\n    .menu-divider[_ngcontent-%COMP%] {\n      height: 1px;\n      background: rgba(255,255,255,0.1);\n      margin: 4px 0;\n    }\n\n    \n\n    .conversation-item.renamed[_ngcontent-%COMP%] {\n      animation: _ngcontent-%COMP%_renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    @keyframes _ngcontent-%COMP%_renameHighlight {\n      0% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.4), rgba(147, 51, 234, 0.4));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px rgba(59, 130, 246, 0.5);\n      }\n      25% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.35), rgba(147, 51, 234, 0.35));\n        box-shadow: 0 0 15px rgba(59, 130, 246, 0.4);\n      }\n      50% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.3), rgba(59, 130, 246, 0.3));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px rgba(16, 185, 129, 0.3);\n      }\n      75% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.2), rgba(59, 130, 246, 0.2));\n        box-shadow: 0 0 5px rgba(16, 185, 129, 0.2);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    \n\n    .header-top[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    }\n\n    \n\n    .header-menu-container[_ngcontent-%COMP%] {\n      position: relative;\n      flex-shrink: 0;\n    }\n\n    .btn-menu[_ngcontent-%COMP%] {\n      width: 32px;\n      height: 32px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .btn-menu[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n      border-color: rgba(255,255,255,0.3);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%] {\n      position: absolute;\n      top: calc(100% + 4px);\n      right: 0;\n      min-width: 200px;\n      background: #0A2742;\n      border: 1px solid rgba(255,255,255,0.15);\n      border-radius: 8px;\n      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n      z-index: 1001;\n      overflow: hidden;\n      padding: 4px 0;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%] {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: rgba(255,255,255,0.85);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      width: 16px;\n      font-size: 13px;\n      color: rgba(255,255,255,0.6);\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]:hover   i[_ngcontent-%COMP%] {\n      color: white;\n    }\n\n    .header-dropdown-menu[_ngcontent-%COMP%]   .dropdown-item[_ngcontent-%COMP%]   .shortcut[_ngcontent-%COMP%] {\n      margin-left: auto;\n      font-size: 11px;\n      color: rgba(255,255,255,0.4);\n      font-family: system-ui, -apple-system, sans-serif;\n    }\n\n    .btn-select[_ngcontent-%COMP%] {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n      border-color: rgba(255,255,255,0.3);\n    }\n\n    .conversation-checkbox[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      margin-right: 8px;\n      flex-shrink: 0;\n    }\n\n    .conversation-checkbox[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n      width: 18px;\n      height: 18px;\n      cursor: pointer;\n      accent-color: #0076B6;\n    }\n\n    .selection-action-bar[_ngcontent-%COMP%] {\n      position: sticky;\n      bottom: 0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      background: #0A2742;\n      border-top: 1px solid rgba(255,255,255,0.15);\n      gap: 12px;\n      flex-wrap: wrap;\n      flex-shrink: 0;\n    }\n\n    .selection-info[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      color: rgba(255,255,255,0.9);\n      font-size: 14px;\n      font-weight: 500;\n      flex: 1 1 auto;\n      min-width: 150px;\n    }\n\n    .selection-count[_ngcontent-%COMP%] {\n      color: white;\n    }\n\n    .link-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: #AAE7FD;\n      cursor: pointer;\n      font-size: 13px;\n      text-decoration: underline;\n      padding: 0;\n      transition: color 0.2s;\n    }\n\n    .link-btn[_ngcontent-%COMP%]:hover {\n      color: white;\n    }\n\n    .selection-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 8px;\n      flex: 0 0 auto;\n    }\n\n    .btn-cancel[_ngcontent-%COMP%] {\n      padding: 8px 16px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 500;\n      transition: all 0.2s;\n    }\n\n    .btn-cancel[_ngcontent-%COMP%]:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      background: #DC2626;\n      border: none;\n      border-radius: 6px;\n      color: white;\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 600;\n      transition: all 0.2s;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: #B91C1C;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .btn-delete-bulk[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 12px;\n    }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConversationListComponent, [{
         type: Component,
@@ -519,9 +594,32 @@ export class ConversationListComponent {
             placeholder="Search conversations..."
             [(ngModel)]="searchQuery">
           @if (!isSelectionMode) {
-            <button class="btn-select" (click)="toggleSelectionMode()" title="Select conversations">
-              <i class="fas fa-check-square"></i> 
-            </button>
+            <div class="header-menu-container">
+              <button class="btn-menu" (click)="toggleHeaderMenu($event)" title="Options">
+                <i class="fas fa-ellipsis-v"></i>
+              </button>
+              @if (isHeaderMenuOpen) {
+                <div class="header-dropdown-menu">
+                  <button class="dropdown-item" (click)="onSelectConversationsClick($event)">
+                    <i class="fas fa-check-square"></i>
+                    <span>Select Conversations</span>
+                  </button>
+                  @if (!isMobileView) {
+                    @if (isSidebarPinned) {
+                      <button class="dropdown-item" (click)="onUnpinSidebarClick($event)">
+                        <i class="fas fa-thumbtack-slash"></i>
+                        <span>Unpin Sidebar</span>
+                      </button>
+                    } @else {
+                      <button class="dropdown-item" (click)="onPinSidebarClick($event)">
+                        <i class="fas fa-thumbtack"></i>
+                        <span>Pin Sidebar</span>
+                      </button>
+                    }
+                  }
+                </div>
+              }
+            </div>
           }
         </div>
       </div>
@@ -687,7 +785,7 @@ export class ConversationListComponent {
         </div>
       }
     </div>
-  `, styles: ["\n    :host { display: block; height: 100%; }\n    .conversation-list { display: flex; flex-direction: column; height: 100%; background: #092340; }\n    .list-header { padding: 8px; border-bottom: 1px solid rgba(255,255,255,0.1); }\n    .search-input {\n      width: 100%;\n      padding: 8px 12px;\n      background: rgba(255,255,255,0.1);\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: white;\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input::placeholder { color: rgba(255,255,255,0.5); }\n    .search-input:focus { outline: none; background: rgba(255,255,255,0.15); border-color: #0076B6; }\n    .btn-new-conversation {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: #0076B6;\n      color: white;\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation:hover { background: #005A8C; }\n    .btn-new-conversation i { font-size: 14px; }\n    .list-content { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    /* Collapsible Sections */\n    .sidebar-section { margin-bottom: 20px; }\n    .pinned-section .section-header {\n      background: rgba(255, 193, 7, 0.08);\n      border-radius: 4px;\n      margin: 0 4px;\n    }\n    .pinned-section .section-title .section-icon {\n      color: #FFC107;\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: rgba(255, 255, 255, 0.7);\n      font-size: 13px;\n      font-weight: 500;\n      transition: color 0.2s;\n      user-select: none;\n    }\n    .section-header:hover { color: white; }\n    .section-title {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title i {\n      font-size: 10px;\n      transition: transform 0.2s;\n    }\n    .section-header.expanded .section-title i { transform: rotate(90deg); }\n    .chat-list {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded { display: block; }\n\n    .conversation-item {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: rgba(255,255,255,0.7);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item:hover { background: rgba(255,255,255,0.08); color: white; }\n    .conversation-item:hover .conversation-actions { opacity: 1; }\n    .conversation-item.active { background: #0076B6; color: white; }\n    .conversation-icon-wrapper { position: relative; flex-shrink: 0; }\n    .conversation-icon { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks { color: #fb923c; }\n    .badge-overlay { position: absolute; top: -4px; right: -4px; }\n    .conversation-info { flex: 1; min-width: 0; }\n    .conversation-name { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-preview { font-size: 12px; color: rgba(255,255,255,0.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active .conversation-preview { color: rgba(255,255,255,0.8); }\n    .conversation-meta { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    /* Project Badge */\n    .project-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: rgba(255, 255, 255, 0.1);\n      color: rgba(255, 255, 255, 0.6);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item:hover .project-badge {\n      background-color: rgba(255, 255, 255, 0.15);\n      color: rgba(255, 255, 255, 0.8);\n    }\n    .conversation-item.active .project-badge {\n      background-color: rgba(255, 255, 255, 0.2);\n      color: white;\n    }\n\n    .conversation-actions {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item:hover .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-item.active .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-actions > * { pointer-events: auto; }\n    .pinned-icon { color: #AAE7FD; font-size: 12px; }\n\n    /* Task Indicator */\n    .task-indicator {\n      color: #fb923c;\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px #fb923c);\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px #fb923c);\n      }\n    }\n    .conversation-item.active .task-indicator {\n      color: #fbbf24;\n    }\n\n    .menu-btn {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      background: #092340 !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn:hover {\n      background: rgba(255,255,255,0.15) !important;\n      color: white;\n    }\n    .conversation-item.active .menu-btn {\n      background: #005A8C !important;\n      color: white;\n    }\n    .menu-btn i { font-size: 14px; }\n\n    .context-menu {\n      position: absolute;\n      top: 100%;\n      right: 0;\n      margin-top: 4px;\n      min-width: 160px;\n      background: #0A2742;\n      border: 1px solid rgba(255,255,255,0.15);\n      border-radius: 8px;\n      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n      z-index: 1001;\n      overflow: hidden;\n      pointer-events: auto;\n    }\n\n    .menu-item {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: rgba(255,255,255,0.85);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .menu-item i {\n      width: 16px;\n      font-size: 13px;\n      color: rgba(255,255,255,0.6);\n    }\n\n    .menu-item:hover i {\n      color: white;\n    }\n\n    .menu-item.danger {\n      color: rgba(239, 68, 68, 0.9);\n    }\n\n    .menu-item.danger:hover {\n      background: rgba(239, 68, 68, 0.15);\n      color: #ff6b6b;\n    }\n\n    .menu-item.danger i {\n      color: rgba(239, 68, 68, 0.8);\n    }\n\n    .menu-item.danger:hover i {\n      color: #ff6b6b;\n    }\n\n    .menu-divider {\n      height: 1px;\n      background: rgba(255,255,255,0.1);\n      margin: 4px 0;\n    }\n\n    /* Rename Animation */\n    .conversation-item.renamed {\n      animation: renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    @keyframes renameHighlight {\n      0% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.4), rgba(147, 51, 234, 0.4));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px rgba(59, 130, 246, 0.5);\n      }\n      25% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.35), rgba(147, 51, 234, 0.35));\n        box-shadow: 0 0 15px rgba(59, 130, 246, 0.4);\n      }\n      50% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.3), rgba(59, 130, 246, 0.3));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px rgba(16, 185, 129, 0.3);\n      }\n      75% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.2), rgba(59, 130, 246, 0.2));\n        box-shadow: 0 0 5px rgba(16, 185, 129, 0.2);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    /* Selection Mode Styles */\n    .header-top {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    }\n\n    .btn-select {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n      border-color: rgba(255,255,255,0.3);\n    }\n\n    .conversation-checkbox {\n      display: flex;\n      align-items: center;\n      margin-right: 8px;\n      flex-shrink: 0;\n    }\n\n    .conversation-checkbox input[type=\"checkbox\"] {\n      width: 18px;\n      height: 18px;\n      cursor: pointer;\n      accent-color: #0076B6;\n    }\n\n    .selection-action-bar {\n      position: sticky;\n      bottom: 0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      background: #0A2742;\n      border-top: 1px solid rgba(255,255,255,0.15);\n      gap: 12px;\n      flex-wrap: wrap;\n      flex-shrink: 0;\n    }\n\n    .selection-info {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      color: rgba(255,255,255,0.9);\n      font-size: 14px;\n      font-weight: 500;\n      flex: 1 1 auto;\n      min-width: 150px;\n    }\n\n    .selection-count {\n      color: white;\n    }\n\n    .link-btn {\n      background: none;\n      border: none;\n      color: #AAE7FD;\n      cursor: pointer;\n      font-size: 13px;\n      text-decoration: underline;\n      padding: 0;\n      transition: color 0.2s;\n    }\n\n    .link-btn:hover {\n      color: white;\n    }\n\n    .selection-actions {\n      display: flex;\n      gap: 8px;\n      flex: 0 0 auto;\n    }\n\n    .btn-cancel {\n      padding: 8px 16px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 500;\n      transition: all 0.2s;\n    }\n\n    .btn-cancel:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .btn-delete-bulk {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      background: #DC2626;\n      border: none;\n      border-radius: 6px;\n      color: white;\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 600;\n      transition: all 0.2s;\n    }\n\n    .btn-delete-bulk:hover:not(:disabled) {\n      background: #B91C1C;\n    }\n\n    .btn-delete-bulk:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .btn-delete-bulk i {\n      font-size: 12px;\n    }\n  "] }]
+  `, styles: ["\n    :host { display: block; height: 100%; }\n    .conversation-list { display: flex; flex-direction: column; height: 100%; background: #092340; }\n    .list-header { padding: 8px; border-bottom: 1px solid rgba(255,255,255,0.1); }\n    .search-input {\n      width: 100%;\n      padding: 8px 12px;\n      background: rgba(255,255,255,0.1);\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: white;\n      font-size: 13px;\n      transition: all 0.2s;\n    }\n    .search-input::placeholder { color: rgba(255,255,255,0.5); }\n    .search-input:focus { outline: none; background: rgba(255,255,255,0.15); border-color: #0076B6; }\n    .btn-new-conversation {\n      width: calc(100% - 16px);\n      margin: 8px;\n      padding: 10px;\n      background: #0076B6;\n      color: white;\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n      font-size: 14px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      transition: background 0.2s;\n      flex-shrink: 0;\n    }\n    .btn-new-conversation:hover { background: #005A8C; }\n    .btn-new-conversation i { font-size: 14px; }\n    .list-content { flex: 1; min-height: 0; overflow-y: auto; padding: 4px 0; }\n\n    /* Collapsible Sections */\n    .sidebar-section { margin-bottom: 20px; }\n    .pinned-section .section-header {\n      background: rgba(255, 193, 7, 0.08);\n      border-radius: 4px;\n      margin: 0 4px;\n    }\n    .pinned-section .section-title .section-icon {\n      color: #FFC107;\n      font-size: 11px;\n      margin-left: 2px;\n    }\n    .section-header {\n      padding: 4px 16px;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      cursor: pointer;\n      color: rgba(255, 255, 255, 0.7);\n      font-size: 13px;\n      font-weight: 500;\n      transition: color 0.2s;\n      user-select: none;\n    }\n    .section-header:hover { color: white; }\n    .section-title {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .section-title i {\n      font-size: 10px;\n      transition: transform 0.2s;\n    }\n    .section-header.expanded .section-title i { transform: rotate(90deg); }\n    .chat-list {\n      padding: 4px 0;\n      display: none;\n    }\n    .chat-list.expanded { display: block; }\n\n    .conversation-item {\n      padding: 6px 5px 6px 16px;\n      cursor: pointer;\n      display: flex;\n      gap: 8px;\n      align-items: center;\n      transition: all 0.2s;\n      position: relative;\n      color: rgba(255,255,255,0.7);\n      font-size: 14px;\n      min-height: 45px;\n    }\n    .conversation-item:hover { background: rgba(255,255,255,0.08); color: white; }\n    .conversation-item:hover .conversation-actions { opacity: 1; }\n    .conversation-item.active { background: #0076B6; color: white; }\n    .conversation-icon-wrapper { position: relative; flex-shrink: 0; }\n    .conversation-icon { font-size: 12px; width: 16px; text-align: center; }\n    .conversation-icon.has-tasks { color: #fb923c; }\n    .badge-overlay { position: absolute; top: -4px; right: -4px; }\n    .conversation-info { flex: 1; min-width: 0; }\n    .conversation-name { font-weight: 600; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-preview { font-size: 12px; color: rgba(255,255,255,0.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n    .conversation-item.active .conversation-preview { color: rgba(255,255,255,0.8); }\n    .conversation-meta { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }\n\n    /* Project Badge */\n    .project-badge {\n      display: inline-block;\n      padding: 2px 6px;\n      border-radius: 10px;\n      font-size: 10px;\n      font-weight: 600;\n      margin-left: auto;\n      background-color: rgba(255, 255, 255, 0.1);\n      color: rgba(255, 255, 255, 0.6);\n      white-space: nowrap;\n      max-width: 80px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n    .conversation-item:hover .project-badge {\n      background-color: rgba(255, 255, 255, 0.15);\n      color: rgba(255, 255, 255, 0.8);\n    }\n    .conversation-item.active .project-badge {\n      background-color: rgba(255, 255, 255, 0.2);\n      color: white;\n    }\n\n    .conversation-actions {\n      position: absolute;\n      right: 5px;\n      top: 50%;\n      transform: translateY(-50%);\n      display: flex;\n      align-items: center;\n      opacity: 0;\n      pointer-events: none;\n      transition: opacity 0.2s;\n      z-index: 10;\n    }\n    .conversation-item:hover .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-item.active .conversation-actions { opacity: 1; pointer-events: auto; }\n    .conversation-actions > * { pointer-events: auto; }\n    .pinned-icon { color: #AAE7FD; font-size: 12px; }\n\n    /* Task Indicator */\n    .task-indicator {\n      color: #fb923c;\n      font-size: 12px;\n      margin-right: 8px;\n      flex-shrink: 0;\n      animation: pulse-glow 2s ease-in-out infinite;\n    }\n    @keyframes pulse-glow {\n      0%, 100% {\n        opacity: 1;\n        filter: drop-shadow(0 0 2px #fb923c);\n      }\n      50% {\n        opacity: 0.6;\n        filter: drop-shadow(0 0 4px #fb923c);\n      }\n    }\n    .conversation-item.active .task-indicator {\n      color: #fbbf24;\n    }\n\n    .menu-btn {\n      width: 28px;\n      height: 28px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      background: #092340 !important;\n      border: none;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n    .menu-btn:hover {\n      background: rgba(255,255,255,0.15) !important;\n      color: white;\n    }\n    .conversation-item.active .menu-btn {\n      background: #005A8C !important;\n      color: white;\n    }\n    .menu-btn i { font-size: 14px; }\n\n    .context-menu {\n      position: absolute;\n      top: 100%;\n      right: 0;\n      margin-top: 4px;\n      min-width: 160px;\n      background: #0A2742;\n      border: 1px solid rgba(255,255,255,0.15);\n      border-radius: 8px;\n      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n      z-index: 1001;\n      overflow: hidden;\n      pointer-events: auto;\n    }\n\n    .menu-item {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: rgba(255,255,255,0.85);\n      font-size: 14px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .menu-item:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .menu-item i {\n      width: 16px;\n      font-size: 13px;\n      color: rgba(255,255,255,0.6);\n    }\n\n    .menu-item:hover i {\n      color: white;\n    }\n\n    .menu-item.danger {\n      color: rgba(239, 68, 68, 0.9);\n    }\n\n    .menu-item.danger:hover {\n      background: rgba(239, 68, 68, 0.15);\n      color: #ff6b6b;\n    }\n\n    .menu-item.danger i {\n      color: rgba(239, 68, 68, 0.8);\n    }\n\n    .menu-item.danger:hover i {\n      color: #ff6b6b;\n    }\n\n    .menu-divider {\n      height: 1px;\n      background: rgba(255,255,255,0.1);\n      margin: 4px 0;\n    }\n\n    /* Rename Animation */\n    .conversation-item.renamed {\n      animation: renameHighlight 1500ms cubic-bezier(0.4, 0, 0.2, 1);\n    }\n\n    @keyframes renameHighlight {\n      0% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.4), rgba(147, 51, 234, 0.4));\n        transform: scale(1.03);\n        box-shadow: 0 0 20px rgba(59, 130, 246, 0.5);\n      }\n      25% {\n        background: linear-gradient(90deg, rgba(59, 130, 246, 0.35), rgba(147, 51, 234, 0.35));\n        box-shadow: 0 0 15px rgba(59, 130, 246, 0.4);\n      }\n      50% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.3), rgba(59, 130, 246, 0.3));\n        transform: scale(1.02);\n        box-shadow: 0 0 10px rgba(16, 185, 129, 0.3);\n      }\n      75% {\n        background: linear-gradient(90deg, rgba(16, 185, 129, 0.2), rgba(59, 130, 246, 0.2));\n        box-shadow: 0 0 5px rgba(16, 185, 129, 0.2);\n      }\n      100% {\n        background: transparent;\n        transform: scale(1);\n        box-shadow: none;\n      }\n    }\n\n    /* Selection Mode Styles */\n    .header-top {\n      display: flex;\n      gap: 8px;\n      align-items: center;\n    }\n\n    /* Header menu button and dropdown */\n    .header-menu-container {\n      position: relative;\n      flex-shrink: 0;\n    }\n\n    .btn-menu {\n      width: 32px;\n      height: 32px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .btn-menu:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n      border-color: rgba(255,255,255,0.3);\n    }\n\n    .header-dropdown-menu {\n      position: absolute;\n      top: calc(100% + 4px);\n      right: 0;\n      min-width: 200px;\n      background: #0A2742;\n      border: 1px solid rgba(255,255,255,0.15);\n      border-radius: 8px;\n      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);\n      z-index: 1001;\n      overflow: hidden;\n      padding: 4px 0;\n    }\n\n    .header-dropdown-menu .dropdown-item {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      padding: 10px 14px;\n      background: transparent;\n      border: none;\n      color: rgba(255,255,255,0.85);\n      font-size: 13px;\n      text-align: left;\n      cursor: pointer;\n      transition: all 0.15s;\n    }\n\n    .header-dropdown-menu .dropdown-item:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .header-dropdown-menu .dropdown-item i {\n      width: 16px;\n      font-size: 13px;\n      color: rgba(255,255,255,0.6);\n    }\n\n    .header-dropdown-menu .dropdown-item:hover i {\n      color: white;\n    }\n\n    .header-dropdown-menu .dropdown-item .shortcut {\n      margin-left: auto;\n      font-size: 11px;\n      color: rgba(255,255,255,0.4);\n      font-family: system-ui, -apple-system, sans-serif;\n    }\n\n    .btn-select {\n      padding: 8px 12px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      font-size: 13px;\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n      white-space: nowrap;\n      flex-shrink: 0;\n    }\n\n    .btn-select:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n      border-color: rgba(255,255,255,0.3);\n    }\n\n    .conversation-checkbox {\n      display: flex;\n      align-items: center;\n      margin-right: 8px;\n      flex-shrink: 0;\n    }\n\n    .conversation-checkbox input[type=\"checkbox\"] {\n      width: 18px;\n      height: 18px;\n      cursor: pointer;\n      accent-color: #0076B6;\n    }\n\n    .selection-action-bar {\n      position: sticky;\n      bottom: 0;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      background: #0A2742;\n      border-top: 1px solid rgba(255,255,255,0.15);\n      gap: 12px;\n      flex-wrap: wrap;\n      flex-shrink: 0;\n    }\n\n    .selection-info {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      color: rgba(255,255,255,0.9);\n      font-size: 14px;\n      font-weight: 500;\n      flex: 1 1 auto;\n      min-width: 150px;\n    }\n\n    .selection-count {\n      color: white;\n    }\n\n    .link-btn {\n      background: none;\n      border: none;\n      color: #AAE7FD;\n      cursor: pointer;\n      font-size: 13px;\n      text-decoration: underline;\n      padding: 0;\n      transition: color 0.2s;\n    }\n\n    .link-btn:hover {\n      color: white;\n    }\n\n    .selection-actions {\n      display: flex;\n      gap: 8px;\n      flex: 0 0 auto;\n    }\n\n    .btn-cancel {\n      padding: 8px 16px;\n      background: transparent;\n      border: 1px solid rgba(255,255,255,0.2);\n      border-radius: 6px;\n      color: rgba(255,255,255,0.7);\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 500;\n      transition: all 0.2s;\n    }\n\n    .btn-cancel:hover {\n      background: rgba(255,255,255,0.1);\n      color: white;\n    }\n\n    .btn-delete-bulk {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      background: #DC2626;\n      border: none;\n      border-radius: 6px;\n      color: white;\n      cursor: pointer;\n      font-size: 13px;\n      font-weight: 600;\n      transition: all 0.2s;\n    }\n\n    .btn-delete-bulk:hover:not(:disabled) {\n      background: #B91C1C;\n    }\n\n    .btn-delete-bulk:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n\n    .btn-delete-bulk i {\n      font-size: 12px;\n    }\n  "] }]
     }], () => [{ type: i1.ConversationDataService }, { type: i2.DialogService }, { type: i3.NotificationService }, { type: i4.ActiveTasksService }, { type: i0.ChangeDetectorRef }], { environmentId: [{
             type: Input
         }], currentUser: [{
@@ -696,13 +794,21 @@ export class ConversationListComponent {
             type: Input
         }], renamedConversationId: [{
             type: Input
+        }], isSidebarPinned: [{
+            type: Input
+        }], isMobileView: [{
+            type: Input
         }], conversationSelected: [{
             type: Output
         }], newConversationRequested: [{
             type: Output
+        }], pinSidebarRequested: [{
+            type: Output
+        }], unpinSidebarRequested: [{
+            type: Output
         }], onDocumentClick: [{
             type: HostListener,
             args: ['document:click']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConversationListComponent, { className: "ConversationListComponent", filePath: "src/lib/components/conversation/conversation-list.component.ts", lineNumber: 621 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConversationListComponent, { className: "ConversationListComponent", filePath: "src/lib/components/conversation/conversation-list.component.ts", lineNumber: 721 }); })();
 //# sourceMappingURL=conversation-list.component.js.map