@m6d/cortex-client 1.6.0 → 1.7.0

package/fesm2022/m6d-cortex-client.mjs

@@ -1553,6 +1553,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
 var translate_new$1 = "New";
 var translate_threads$1 = "Threads";
 var translate_n_conversations$1 = "{{count}} conversations";
+var translate_no_threads_yet$1 = "No threads yet";
+var translate_start_a_new_conversation$1 = "Start a new conversation";
 var translate_untitled$1 = "Untitled";
 var translate_new_chat$1 = "New Chat";
 var translate_normal$1 = "Normal";
@@ -1642,6 +1644,8 @@ var en = {
 	translate_new: translate_new$1,
 	translate_threads: translate_threads$1,
 	translate_n_conversations: translate_n_conversations$1,
+	translate_no_threads_yet: translate_no_threads_yet$1,
+	translate_start_a_new_conversation: translate_start_a_new_conversation$1,
 	translate_untitled: translate_untitled$1,
 	translate_new_chat: translate_new_chat$1,
 	translate_normal: translate_normal$1,
@@ -1732,6 +1736,8 @@ var en = {
 var translate_new = "جديد";
 var translate_threads = "المحادثات";
 var translate_n_conversations = "{{count}} محادثات";
+var translate_no_threads_yet = "لا توجد محادثات بعد";
+var translate_start_a_new_conversation = "ابدأ محادثة جديدة";
 var translate_untitled = "بدون عنوان";
 var translate_new_chat = "محادثة جديدة";
 var translate_normal = "عادي";
@@ -1821,6 +1827,8 @@ var ar = {
 	translate_new: translate_new,
 	translate_threads: translate_threads,
 	translate_n_conversations: translate_n_conversations,
+	translate_no_threads_yet: translate_no_threads_yet,
+	translate_start_a_new_conversation: translate_start_a_new_conversation,
 	translate_untitled: translate_untitled,
 	translate_new_chat: translate_new_chat,
 	translate_normal: translate_normal,
@@ -1980,7 +1988,7 @@ class CortexChatWidgetComponent {
                 fallbackLang: 'en',
                 loader: provideTranslateLoader(CortexClientTranslateLoader),
             }),
-        ], ngImport: i0, template: "<div class=\"cortex-widget__container\">\n  <!-- SCREEN 1: THREADS -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n    [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n  >\n    <!-- Threads header -->\n    <div class=\"cortex-widget__threads-header\">\n      <div>\n        <h2 class=\"cortex-widget__threads-title\">\n          {{ 'translate_threads' | translate }}\n        </h2>\n        <p class=\"cortex-widget__threads-count\">\n          {{\n            'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n          }}\n        </p>\n      </div>\n      <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n          <path\n            d=\"M8 3v10M3 8h10\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n          />\n        </svg>\n        {{ 'translate_new' | translate }}\n      </button>\n    </div>\n\n    <!-- Threads list -->\n    <div class=\"cortex-widget__threads-list\">\n      <!-- Threads loading skeleton -->\n      @if (chatService.threads() === undefined) {\n        @for (i of [1, 2, 3, 4]; track i) {\n          <div class=\"cortex-widget__thread-skeleton\">\n            <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n            <div class=\"cortex-widget__thread-skeleton-lines\">\n              <div\n                class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n                [style.width]=\"40 + i * 12 + '%'\"\n              ></div>\n            </div>\n          </div>\n        }\n      } @else {\n        @for (thread of chatService.threads(); track thread.id) {\n          <button\n            (click)=\"selectThread(thread)\"\n            class=\"cortex-widget__thread-item\"\n            [class.cortex-widget__thread-item--active]=\"\n              thread.id === chatService.selectedThread()?.id\n            \"\n          >\n            <!-- Thread icon -->\n            <div\n              class=\"cortex-widget__thread-icon\"\n              [class.cortex-widget__thread-icon--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n\n            <!-- Thread info -->\n            <div class=\"cortex-widget__thread-info\">\n              <div class=\"cortex-widget__thread-title-row\">\n                <p\n                  class=\"cortex-widget__thread-title\"\n                  [class.cortex-widget__thread-title--active]=\"\n                    thread.id === chatService.selectedThread()?.id\n                  \"\n                >\n                  {{ thread.title ?? ('translate_untitled' | translate) }}\n                </p>\n\n                @if (thread.isRunning) {\n                  <span\n                    class=\"cortex-widget__thread-running\"\n                    [class.cortex-widget__thread-running--active]=\"\n                      thread.id === chatService.selectedThread()?.id\n                    \"\n                  >\n                    <span class=\"cortex-widget__thread-running-dot\"></span>\n                    {{ 'translate_running' | translate }}\n                  </span>\n                }\n              </div>\n            </div>\n\n            <!-- Delete button -->\n            <button\n              (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n              class=\"cortex-widget__thread-delete\"\n              [class.cortex-widget__thread-delete--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M4 4l8 8M12 4l-8 8\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </button>\n\n            <!-- Arrow -->\n            <svg\n              class=\"cortex-widget__thread-arrow\"\n              [class.cortex-widget__thread-arrow--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n              width=\"10\"\n              height=\"10\"\n              viewBox=\"0 0 16 16\"\n              fill=\"none\"\n            >\n              <path\n                d=\"M6 4l4 4-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.5\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n        }\n\n        @if (!chatService.threads()?.length) {\n          <div class=\"cortex-widget__threads-empty\">\n            <div class=\"cortex-widget__threads-empty-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__threads-empty-svg\"\n              >\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n            <p class=\"cortex-widget__threads-empty-title\">No threads yet</p>\n            <p class=\"cortex-widget__threads-empty-subtitle\">Start a new conversation</p>\n          </div>\n        }\n      }\n    </div>\n  </div>\n\n  <!-- SCREEN 2: CHAT -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n    [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n  >\n    <!-- Chat header -->\n    <div class=\"cortex-widget__chat-header\">\n      <!-- Back button -->\n      <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n        <svg\n          width=\"14\"\n          height=\"14\"\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n          class=\"cortex-widget__back-icon\"\n        >\n          <path\n            d=\"M10 3L5 8l5 5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </svg>\n      </button>\n\n      <!-- Title -->\n      <div class=\"cortex-widget__chat-title-wrap\">\n        <p class=\"cortex-widget__chat-title\">\n          {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n        </p>\n      </div>\n\n      <!-- Debug toggle -->\n      @if (config().showDebugButton) {\n        <button\n          (click)=\"toggleDebugMode()\"\n          class=\"cortex-widget__debug-btn\"\n          [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n          [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n        >\n          {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n        </button>\n      }\n    </div>\n\n    <!-- Messages loading skeleton -->\n    @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n      <div class=\"cortex-widget__messages-skeleton\">\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n          </div>\n        </div>\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n          </div>\n        </div>\n      </div>\n    } @else {\n      <!-- Messages area -->\n      <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n    }\n\n    <!-- Agent working indicator -->\n    @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__working\">\n        <div class=\"cortex-widget__working-dots\">\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n        </div>\n        <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n      </div>\n    }\n\n    <!-- Chat input (hidden during pending tool calls) -->\n    @if (!chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__input-area\">\n        <div\n          class=\"cortex-widget__input-box\"\n          [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n          [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n        >\n          <textarea\n            (keydown)=\"onKeydown($event)\"\n            [(ngModel)]=\"text\"\n            [placeholder]=\"\n              chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n            \"\n            [disabled]=\"chatService.isAgentWorking()\"\n            rows=\"1\"\n            class=\"cortex-widget__textarea\"\n            [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n          ></textarea>\n          @if (chatService.isAgentWorking()) {\n            <!-- Stop button -->\n            <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n              <!-- Pulsing ring -->\n              <span class=\"cortex-stop-btn__ring\"></span>\n              <!-- Stop icon (rounded square) -->\n              <svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                class=\"cortex-stop-btn__icon\"\n              >\n                <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n              </svg>\n            </button>\n          } @else {\n            <!-- Send button -->\n            <button\n              (click)=\"send()\"\n              class=\"cortex-widget__send-btn\"\n              [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n              [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n            >\n              <svg\n                width=\"14\"\n                height=\"14\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__send-icon\"\n              >\n                <path\n                  d=\"M3 8h10M9 4l4 4-4 4\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.5\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n              </svg>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title-row{display:flex;align-items:center;gap:.5rem;min-width:0}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-running{flex-shrink:0;display:inline-flex;align-items:center;gap:.3125rem;padding:.2rem .45rem;border-radius:999px;background:#0e74901a;color:#0f766e;font-size:.625rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.cortex-widget__thread-running--active{background:#f1f5f929;color:#e2e8f0}.cortex-widget__thread-running-dot{width:.375rem;height:.375rem;border-radius:999px;background:currentColor;box-shadow:0 0 .45rem currentColor;animation:cortex-thread-running-pulse 1.4s ease-in-out infinite}@keyframes cortex-thread-running-pulse{0%,to{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1)}}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-end}.cortex-widget__msg-skel--assistant{align-items:flex-start}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-right-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}@keyframes cortex-working-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes cortex-dot-wave{0%,60%,to{transform:translateY(0) scale(1);opacity:.45}30%{transform:translateY(-5px) scale(1.2);opacity:1}}@keyframes cortex-working-shimmer{0%{background-position:-200% center}to{background-position:200% center}}.cortex-widget__working{flex-shrink:0;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;animation:cortex-working-slide-in .25s ease-out both}.cortex-widget__working-dots{display:flex;align-items:center;gap:4px}.cortex-working-dot{display:block;width:6px;height:6px;border-radius:9999px;background:#22c55e;animation:cortex-dot-wave 1.4s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.75rem;font-weight:500;letter-spacing:.01em;color:#16a34a}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"], dependencies: [{ kind: "component", type: MessageListComponent, selector: "cortex-message-list", inputs: ["debugMode"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+        ], ngImport: i0, template: "<div class=\"cortex-widget__container\">\n  <!-- SCREEN 1: THREADS -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n    [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n  >\n    <!-- Threads header -->\n    <div class=\"cortex-widget__threads-header\">\n      <div>\n        <h2 class=\"cortex-widget__threads-title\">\n          {{ 'translate_threads' | translate }}\n        </h2>\n        <p class=\"cortex-widget__threads-count\">\n          {{\n            'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n          }}\n        </p>\n      </div>\n      <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n          <path\n            d=\"M8 3v10M3 8h10\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n          />\n        </svg>\n        {{ 'translate_new' | translate }}\n      </button>\n    </div>\n\n    <!-- Threads list -->\n    <div class=\"cortex-widget__threads-list\">\n      <!-- Threads loading skeleton -->\n      @if (chatService.threads() === undefined) {\n        @for (i of [1, 2, 3, 4]; track i) {\n          <div class=\"cortex-widget__thread-skeleton\">\n            <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n            <div class=\"cortex-widget__thread-skeleton-lines\">\n              <div\n                class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n                [style.width]=\"40 + i * 12 + '%'\"\n              ></div>\n            </div>\n          </div>\n        }\n      } @else {\n        @for (thread of chatService.threads(); track thread.id) {\n          <button\n            (click)=\"selectThread(thread)\"\n            class=\"cortex-widget__thread-item\"\n            [class.cortex-widget__thread-item--active]=\"\n              thread.id === chatService.selectedThread()?.id\n            \"\n          >\n            <!-- Thread icon -->\n            <div\n              class=\"cortex-widget__thread-icon\"\n              [class.cortex-widget__thread-icon--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n\n            <!-- Thread info -->\n            <div class=\"cortex-widget__thread-info\">\n              <div class=\"cortex-widget__thread-title-row\">\n                <p\n                  class=\"cortex-widget__thread-title\"\n                  [class.cortex-widget__thread-title--active]=\"\n                    thread.id === chatService.selectedThread()?.id\n                  \"\n                >\n                  {{ thread.title ?? ('translate_untitled' | translate) }}\n                </p>\n\n                @if (thread.isRunning) {\n                  <span\n                    class=\"cortex-widget__thread-running\"\n                    [class.cortex-widget__thread-running--active]=\"\n                      thread.id === chatService.selectedThread()?.id\n                    \"\n                  >\n                    <span class=\"cortex-widget__thread-running-dot\"></span>\n                    {{ 'translate_running' | translate }}\n                  </span>\n                }\n              </div>\n            </div>\n\n            <!-- Delete button -->\n            <button\n              (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n              class=\"cortex-widget__thread-delete\"\n              [class.cortex-widget__thread-delete--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M4 4l8 8M12 4l-8 8\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </button>\n\n            <!-- Arrow -->\n            <svg\n              class=\"cortex-widget__thread-arrow\"\n              [class.cortex-widget__thread-arrow--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n              width=\"10\"\n              height=\"10\"\n              viewBox=\"0 0 16 16\"\n              fill=\"none\"\n            >\n              <path\n                d=\"M6 4l4 4-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.5\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n        }\n\n        @if (!chatService.threads()?.length) {\n          <div class=\"cortex-widget__threads-empty\">\n            <div class=\"cortex-widget__threads-empty-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__threads-empty-svg\"\n              >\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n            <p class=\"cortex-widget__threads-empty-title\">\n              {{ 'translate_no_threads_yet' | translate }}\n            </p>\n            <p class=\"cortex-widget__threads-empty-subtitle\">\n              {{ 'translate_start_a_new_conversation' | translate }}\n            </p>\n          </div>\n        }\n      }\n    </div>\n  </div>\n\n  <!-- SCREEN 2: CHAT -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n    [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n  >\n    <!-- Chat header -->\n    <div class=\"cortex-widget__chat-header\">\n      <!-- Back button -->\n      <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n        <svg\n          width=\"14\"\n          height=\"14\"\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n          class=\"cortex-widget__back-icon\"\n        >\n          <path\n            d=\"M10 3L5 8l5 5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </svg>\n      </button>\n\n      <!-- Title -->\n      <div class=\"cortex-widget__chat-title-wrap\">\n        <p class=\"cortex-widget__chat-title\">\n          {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n        </p>\n      </div>\n\n      <!-- Debug toggle -->\n      @if (config().showDebugButton) {\n        <button\n          (click)=\"toggleDebugMode()\"\n          class=\"cortex-widget__debug-btn\"\n          [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n          [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n        >\n          {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n        </button>\n      }\n    </div>\n\n    <!-- Messages loading skeleton -->\n    @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n      <div class=\"cortex-widget__messages-skeleton\">\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n          </div>\n        </div>\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n          </div>\n        </div>\n      </div>\n    } @else {\n      <!-- Messages area -->\n      <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n    }\n\n    <!-- Agent working indicator -->\n    @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__working\">\n        <div class=\"cortex-widget__working-dots\">\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n        </div>\n        <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n      </div>\n    }\n\n    <!-- Chat input (hidden during pending tool calls) -->\n    @if (!chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__input-area\">\n        <div\n          class=\"cortex-widget__input-box\"\n          [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n          [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n        >\n          <textarea\n            (keydown)=\"onKeydown($event)\"\n            [(ngModel)]=\"text\"\n            [placeholder]=\"\n              chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n            \"\n            [disabled]=\"chatService.isAgentWorking()\"\n            rows=\"1\"\n            class=\"cortex-widget__textarea\"\n            [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n          ></textarea>\n          @if (chatService.isAgentWorking()) {\n            <!-- Stop button -->\n            <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n              <!-- Pulsing ring -->\n              <span class=\"cortex-stop-btn__ring\"></span>\n              <!-- Stop icon (rounded square) -->\n              <svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                class=\"cortex-stop-btn__icon\"\n              >\n                <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n              </svg>\n            </button>\n          } @else {\n            <!-- Send button -->\n            <button\n              (click)=\"send()\"\n              class=\"cortex-widget__send-btn\"\n              [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n              [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n            >\n              <svg\n                width=\"14\"\n                height=\"14\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__send-icon\"\n              >\n                <path\n                  d=\"M3 8h10M9 4l4 4-4 4\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.5\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n              </svg>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title-row{display:flex;align-items:center;gap:.5rem;min-width:0}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-running{flex-shrink:0;display:inline-flex;align-items:center;gap:.3125rem;padding:.2rem .45rem;border-radius:999px;background:#0e74901a;color:#0f766e;font-size:.625rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.cortex-widget__thread-running--active{background:#f1f5f929;color:#e2e8f0}.cortex-widget__thread-running-dot{width:.375rem;height:.375rem;border-radius:999px;background:currentColor;box-shadow:0 0 .45rem currentColor;animation:cortex-thread-running-pulse 1.4s ease-in-out infinite}@keyframes cortex-thread-running-pulse{0%,to{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1)}}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-end}.cortex-widget__msg-skel--assistant{align-items:flex-start}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-right-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}@keyframes cortex-working-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes cortex-dot-wave{0%,60%,to{transform:translateY(0) scale(1);opacity:.45}30%{transform:translateY(-5px) scale(1.2);opacity:1}}@keyframes cortex-working-shimmer{0%{background-position:-200% center}to{background-position:200% center}}.cortex-widget__working{flex-shrink:0;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;animation:cortex-working-slide-in .25s ease-out both}.cortex-widget__working-dots{display:flex;align-items:center;gap:4px}.cortex-working-dot{display:block;width:6px;height:6px;border-radius:9999px;background:#22c55e;animation:cortex-dot-wave 1.4s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.75rem;font-weight:500;letter-spacing:.01em;color:#16a34a}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"], dependencies: [{ kind: "component", type: MessageListComponent, selector: "cortex-message-list", inputs: ["debugMode"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: CortexChatWidgetComponent, decorators: [{
             type: Component,
@@ -1996,7 +2004,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
                             fallbackLang: 'en',
                             loader: provideTranslateLoader(CortexClientTranslateLoader),
                         }),
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'cortex-widget' }, template: "<div class=\"cortex-widget__container\">\n  <!-- SCREEN 1: THREADS -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n    [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n  >\n    <!-- Threads header -->\n    <div class=\"cortex-widget__threads-header\">\n      <div>\n        <h2 class=\"cortex-widget__threads-title\">\n          {{ 'translate_threads' | translate }}\n        </h2>\n        <p class=\"cortex-widget__threads-count\">\n          {{\n            'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n          }}\n        </p>\n      </div>\n      <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n          <path\n            d=\"M8 3v10M3 8h10\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n          />\n        </svg>\n        {{ 'translate_new' | translate }}\n      </button>\n    </div>\n\n    <!-- Threads list -->\n    <div class=\"cortex-widget__threads-list\">\n      <!-- Threads loading skeleton -->\n      @if (chatService.threads() === undefined) {\n        @for (i of [1, 2, 3, 4]; track i) {\n          <div class=\"cortex-widget__thread-skeleton\">\n            <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n            <div class=\"cortex-widget__thread-skeleton-lines\">\n              <div\n                class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n                [style.width]=\"40 + i * 12 + '%'\"\n              ></div>\n            </div>\n          </div>\n        }\n      } @else {\n        @for (thread of chatService.threads(); track thread.id) {\n          <button\n            (click)=\"selectThread(thread)\"\n            class=\"cortex-widget__thread-item\"\n            [class.cortex-widget__thread-item--active]=\"\n              thread.id === chatService.selectedThread()?.id\n            \"\n          >\n            <!-- Thread icon -->\n            <div\n              class=\"cortex-widget__thread-icon\"\n              [class.cortex-widget__thread-icon--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n\n            <!-- Thread info -->\n            <div class=\"cortex-widget__thread-info\">\n              <div class=\"cortex-widget__thread-title-row\">\n                <p\n                  class=\"cortex-widget__thread-title\"\n                  [class.cortex-widget__thread-title--active]=\"\n                    thread.id === chatService.selectedThread()?.id\n                  \"\n                >\n                  {{ thread.title ?? ('translate_untitled' | translate) }}\n                </p>\n\n                @if (thread.isRunning) {\n                  <span\n                    class=\"cortex-widget__thread-running\"\n                    [class.cortex-widget__thread-running--active]=\"\n                      thread.id === chatService.selectedThread()?.id\n                    \"\n                  >\n                    <span class=\"cortex-widget__thread-running-dot\"></span>\n                    {{ 'translate_running' | translate }}\n                  </span>\n                }\n              </div>\n            </div>\n\n            <!-- Delete button -->\n            <button\n              (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n              class=\"cortex-widget__thread-delete\"\n              [class.cortex-widget__thread-delete--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M4 4l8 8M12 4l-8 8\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </button>\n\n            <!-- Arrow -->\n            <svg\n              class=\"cortex-widget__thread-arrow\"\n              [class.cortex-widget__thread-arrow--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n              width=\"10\"\n              height=\"10\"\n              viewBox=\"0 0 16 16\"\n              fill=\"none\"\n            >\n              <path\n                d=\"M6 4l4 4-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.5\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n        }\n\n        @if (!chatService.threads()?.length) {\n          <div class=\"cortex-widget__threads-empty\">\n            <div class=\"cortex-widget__threads-empty-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__threads-empty-svg\"\n              >\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n            <p class=\"cortex-widget__threads-empty-title\">No threads yet</p>\n            <p class=\"cortex-widget__threads-empty-subtitle\">Start a new conversation</p>\n          </div>\n        }\n      }\n    </div>\n  </div>\n\n  <!-- SCREEN 2: CHAT -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n    [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n  >\n    <!-- Chat header -->\n    <div class=\"cortex-widget__chat-header\">\n      <!-- Back button -->\n      <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n        <svg\n          width=\"14\"\n          height=\"14\"\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n          class=\"cortex-widget__back-icon\"\n        >\n          <path\n            d=\"M10 3L5 8l5 5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </svg>\n      </button>\n\n      <!-- Title -->\n      <div class=\"cortex-widget__chat-title-wrap\">\n        <p class=\"cortex-widget__chat-title\">\n          {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n        </p>\n      </div>\n\n      <!-- Debug toggle -->\n      @if (config().showDebugButton) {\n        <button\n          (click)=\"toggleDebugMode()\"\n          class=\"cortex-widget__debug-btn\"\n          [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n          [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n        >\n          {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n        </button>\n      }\n    </div>\n\n    <!-- Messages loading skeleton -->\n    @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n      <div class=\"cortex-widget__messages-skeleton\">\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n          </div>\n        </div>\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n          </div>\n        </div>\n      </div>\n    } @else {\n      <!-- Messages area -->\n      <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n    }\n\n    <!-- Agent working indicator -->\n    @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__working\">\n        <div class=\"cortex-widget__working-dots\">\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n        </div>\n        <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n      </div>\n    }\n\n    <!-- Chat input (hidden during pending tool calls) -->\n    @if (!chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__input-area\">\n        <div\n          class=\"cortex-widget__input-box\"\n          [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n          [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n        >\n          <textarea\n            (keydown)=\"onKeydown($event)\"\n            [(ngModel)]=\"text\"\n            [placeholder]=\"\n              chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n            \"\n            [disabled]=\"chatService.isAgentWorking()\"\n            rows=\"1\"\n            class=\"cortex-widget__textarea\"\n            [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n          ></textarea>\n          @if (chatService.isAgentWorking()) {\n            <!-- Stop button -->\n            <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n              <!-- Pulsing ring -->\n              <span class=\"cortex-stop-btn__ring\"></span>\n              <!-- Stop icon (rounded square) -->\n              <svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                class=\"cortex-stop-btn__icon\"\n              >\n                <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n              </svg>\n            </button>\n          } @else {\n            <!-- Send button -->\n            <button\n              (click)=\"send()\"\n              class=\"cortex-widget__send-btn\"\n              [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n              [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n            >\n              <svg\n                width=\"14\"\n                height=\"14\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__send-icon\"\n              >\n                <path\n                  d=\"M3 8h10M9 4l4 4-4 4\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.5\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n              </svg>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title-row{display:flex;align-items:center;gap:.5rem;min-width:0}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-running{flex-shrink:0;display:inline-flex;align-items:center;gap:.3125rem;padding:.2rem .45rem;border-radius:999px;background:#0e74901a;color:#0f766e;font-size:.625rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.cortex-widget__thread-running--active{background:#f1f5f929;color:#e2e8f0}.cortex-widget__thread-running-dot{width:.375rem;height:.375rem;border-radius:999px;background:currentColor;box-shadow:0 0 .45rem currentColor;animation:cortex-thread-running-pulse 1.4s ease-in-out infinite}@keyframes cortex-thread-running-pulse{0%,to{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1)}}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-end}.cortex-widget__msg-skel--assistant{align-items:flex-start}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-right-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}@keyframes cortex-working-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes cortex-dot-wave{0%,60%,to{transform:translateY(0) scale(1);opacity:.45}30%{transform:translateY(-5px) scale(1.2);opacity:1}}@keyframes cortex-working-shimmer{0%{background-position:-200% center}to{background-position:200% center}}.cortex-widget__working{flex-shrink:0;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;animation:cortex-working-slide-in .25s ease-out both}.cortex-widget__working-dots{display:flex;align-items:center;gap:4px}.cortex-working-dot{display:block;width:6px;height:6px;border-radius:9999px;background:#22c55e;animation:cortex-dot-wave 1.4s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.75rem;font-weight:500;letter-spacing:.01em;color:#16a34a}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'cortex-widget' }, template: "<div class=\"cortex-widget__container\">\n  <!-- SCREEN 1: THREADS -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'threads'\"\n    [class.cortex-widget__screen--left]=\"screen() !== 'threads'\"\n  >\n    <!-- Threads header -->\n    <div class=\"cortex-widget__threads-header\">\n      <div>\n        <h2 class=\"cortex-widget__threads-title\">\n          {{ 'translate_threads' | translate }}\n        </h2>\n        <p class=\"cortex-widget__threads-count\">\n          {{\n            'translate_n_conversations' | translate: { count: chatService.threads()?.length ?? 0 }\n          }}\n        </p>\n      </div>\n      <button (click)=\"newChat()\" class=\"cortex-widget__new-chat-btn\">\n        <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n          <path\n            d=\"M8 3v10M3 8h10\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n          />\n        </svg>\n        {{ 'translate_new' | translate }}\n      </button>\n    </div>\n\n    <!-- Threads list -->\n    <div class=\"cortex-widget__threads-list\">\n      <!-- Threads loading skeleton -->\n      @if (chatService.threads() === undefined) {\n        @for (i of [1, 2, 3, 4]; track i) {\n          <div class=\"cortex-widget__thread-skeleton\">\n            <div class=\"cortex-skeleton cortex-widget__thread-skeleton-icon\"></div>\n            <div class=\"cortex-widget__thread-skeleton-lines\">\n              <div\n                class=\"cortex-skeleton cortex-widget__thread-skeleton-line\"\n                [style.width]=\"40 + i * 12 + '%'\"\n              ></div>\n            </div>\n          </div>\n        }\n      } @else {\n        @for (thread of chatService.threads(); track thread.id) {\n          <button\n            (click)=\"selectThread(thread)\"\n            class=\"cortex-widget__thread-item\"\n            [class.cortex-widget__thread-item--active]=\"\n              thread.id === chatService.selectedThread()?.id\n            \"\n          >\n            <!-- Thread icon -->\n            <div\n              class=\"cortex-widget__thread-icon\"\n              [class.cortex-widget__thread-icon--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n\n            <!-- Thread info -->\n            <div class=\"cortex-widget__thread-info\">\n              <div class=\"cortex-widget__thread-title-row\">\n                <p\n                  class=\"cortex-widget__thread-title\"\n                  [class.cortex-widget__thread-title--active]=\"\n                    thread.id === chatService.selectedThread()?.id\n                  \"\n                >\n                  {{ thread.title ?? ('translate_untitled' | translate) }}\n                </p>\n\n                @if (thread.isRunning) {\n                  <span\n                    class=\"cortex-widget__thread-running\"\n                    [class.cortex-widget__thread-running--active]=\"\n                      thread.id === chatService.selectedThread()?.id\n                    \"\n                  >\n                    <span class=\"cortex-widget__thread-running-dot\"></span>\n                    {{ 'translate_running' | translate }}\n                  </span>\n                }\n              </div>\n            </div>\n\n            <!-- Delete button -->\n            <button\n              (click)=\"$event.stopPropagation(); chatService.deleteThread(thread.id).subscribe()\"\n              class=\"cortex-widget__thread-delete\"\n              [class.cortex-widget__thread-delete--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n            >\n              <svg width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\">\n                <path\n                  d=\"M4 4l8 8M12 4l-8 8\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </button>\n\n            <!-- Arrow -->\n            <svg\n              class=\"cortex-widget__thread-arrow\"\n              [class.cortex-widget__thread-arrow--active]=\"\n                thread.id === chatService.selectedThread()?.id\n              \"\n              width=\"10\"\n              height=\"10\"\n              viewBox=\"0 0 16 16\"\n              fill=\"none\"\n            >\n              <path\n                d=\"M6 4l4 4-4 4\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.5\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n        }\n\n        @if (!chatService.threads()?.length) {\n          <div class=\"cortex-widget__threads-empty\">\n            <div class=\"cortex-widget__threads-empty-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__threads-empty-svg\"\n              >\n                <path\n                  d=\"M2.5 4.5h11M2.5 8h7M2.5 11.5h9\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.3\"\n                  stroke-linecap=\"round\"\n                />\n              </svg>\n            </div>\n            <p class=\"cortex-widget__threads-empty-title\">\n              {{ 'translate_no_threads_yet' | translate }}\n            </p>\n            <p class=\"cortex-widget__threads-empty-subtitle\">\n              {{ 'translate_start_a_new_conversation' | translate }}\n            </p>\n          </div>\n        }\n      }\n    </div>\n  </div>\n\n  <!-- SCREEN 2: CHAT -->\n  <div\n    class=\"cortex-widget__screen\"\n    [class.cortex-widget__screen--active]=\"screen() === 'chat'\"\n    [class.cortex-widget__screen--right]=\"screen() !== 'chat'\"\n  >\n    <!-- Chat header -->\n    <div class=\"cortex-widget__chat-header\">\n      <!-- Back button -->\n      <button (click)=\"goBack()\" class=\"cortex-widget__back-btn\">\n        <svg\n          width=\"14\"\n          height=\"14\"\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n          class=\"cortex-widget__back-icon\"\n        >\n          <path\n            d=\"M10 3L5 8l5 5\"\n            stroke=\"currentColor\"\n            stroke-width=\"1.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n          />\n        </svg>\n      </button>\n\n      <!-- Title -->\n      <div class=\"cortex-widget__chat-title-wrap\">\n        <p class=\"cortex-widget__chat-title\">\n          {{ chatService.selectedThread()?.title ?? ('translate_new_chat' | translate) }}\n        </p>\n      </div>\n\n      <!-- Debug toggle -->\n      @if (config().showDebugButton) {\n        <button\n          (click)=\"toggleDebugMode()\"\n          class=\"cortex-widget__debug-btn\"\n          [class.cortex-widget__debug-btn--on]=\"debugMode()\"\n          [class.cortex-widget__debug-btn--off]=\"!debugMode()\"\n        >\n          {{ debugMode() ? ('translate_debug' | translate) : ('translate_normal' | translate) }}\n        </button>\n      }\n    </div>\n\n    <!-- Messages loading skeleton -->\n    @if (chatService.isLoadingMessages() && !chatService.isAgentWorking()) {\n      <div class=\"cortex-widget__messages-skeleton\">\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 13rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 9rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 16rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 18rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 12rem\"></div>\n          </div>\n        </div>\n        <!-- User message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--user\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--user\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 11rem\"></div>\n          </div>\n        </div>\n        <!-- Assistant message skeleton -->\n        <div class=\"cortex-widget__msg-skel cortex-widget__msg-skel--assistant\">\n          <div class=\"cortex-widget__msg-skel-bubble cortex-widget__msg-skel-bubble--assistant\">\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 14rem\"></div>\n            <div class=\"cortex-skeleton cortex-widget__msg-skel-line\" style=\"width: 15rem\"></div>\n          </div>\n        </div>\n      </div>\n    } @else {\n      <!-- Messages area -->\n      <cortex-message-list class=\"cortex-widget__messages\" [debugMode]=\"debugMode()\" />\n    }\n\n    <!-- Agent working indicator -->\n    @if (chatService.isAgentWorking() && !chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__working\">\n        <div class=\"cortex-widget__working-dots\">\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n          <span class=\"cortex-working-dot\"></span>\n        </div>\n        <span class=\"cortex-widget__working-text\">{{ 'translate_thinking' | translate }}</span>\n      </div>\n    }\n\n    <!-- Chat input (hidden during pending tool calls) -->\n    @if (!chatService.hasPendingToolCalls()) {\n      <div class=\"cortex-widget__input-area\">\n        <div\n          class=\"cortex-widget__input-box\"\n          [class.cortex-widget__input-box--disabled]=\"chatService.isAgentWorking()\"\n          [class.cortex-widget__input-box--enabled]=\"!chatService.isAgentWorking()\"\n        >\n          <textarea\n            (keydown)=\"onKeydown($event)\"\n            [(ngModel)]=\"text\"\n            [placeholder]=\"\n              chatService.isAgentWorking() ? '' : ('translate_type_a_message' | translate)\n            \"\n            [disabled]=\"chatService.isAgentWorking()\"\n            rows=\"1\"\n            class=\"cortex-widget__textarea\"\n            [class.cortex-widget__textarea--disabled]=\"chatService.isAgentWorking()\"\n          ></textarea>\n          @if (chatService.isAgentWorking()) {\n            <!-- Stop button -->\n            <button (click)=\"chatService.abort()\" class=\"cortex-stop-btn\">\n              <!-- Pulsing ring -->\n              <span class=\"cortex-stop-btn__ring\"></span>\n              <!-- Stop icon (rounded square) -->\n              <svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                class=\"cortex-stop-btn__icon\"\n              >\n                <rect x=\"1\" y=\"1\" width=\"10\" height=\"10\" rx=\"2.5\" fill=\"currentColor\" />\n              </svg>\n            </button>\n          } @else {\n            <!-- Send button -->\n            <button\n              (click)=\"send()\"\n              class=\"cortex-widget__send-btn\"\n              [class.cortex-widget__send-btn--empty]=\"!text().trim()\"\n              [class.cortex-widget__send-btn--ready]=\"!!text().trim()\"\n            >\n              <svg\n                width=\"14\"\n                height=\"14\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                class=\"cortex-widget__send-icon\"\n              >\n                <path\n                  d=\"M3 8h10M9 4l4 4-4 4\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.5\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                />\n              </svg>\n            </button>\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n", styles: [".cortex-widget{display:block}.cortex-widget__container{width:100%;height:100%;position:relative;overflow:hidden}.cortex-widget__screen{position:absolute;inset:0;display:flex;flex-direction:column;transition:transform .3s ease-out}.cortex-widget__screen--active{transform:translate(0)}.cortex-widget__screen--left{transform:translate(-100%)}[dir=rtl] .cortex-widget__screen--left,.cortex-widget__screen--right{transform:translate(100%)}[dir=rtl] .cortex-widget__screen--right{transform:translate(-100%)}.cortex-widget__threads-header{flex-shrink:0;padding:1.25rem 1.25rem 1rem;display:flex;align-items:center;justify-content:space-between}.cortex-widget__threads-title{font-size:.9375rem;font-weight:600;color:#1e293b;letter-spacing:-.01em;margin:0}.cortex-widget__threads-count{font-size:.6875rem;color:#94a3b8;margin-top:.125rem;margin-bottom:0}.cortex-widget__new-chat-btn{display:inline-flex;align-items:center;gap:.375rem;font-size:.75rem;font-weight:500;color:#f1f5f9;background:#1e293b;padding:.375rem .75rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__new-chat-btn:hover{background:#334155}.cortex-widget__new-chat-btn:active{background:#0f172a}.cortex-widget__threads-list{flex:1;overflow-y:auto;padding:0 .75rem .75rem}.cortex-widget__thread-skeleton{display:flex;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:.125rem}.cortex-widget__thread-skeleton-icon{flex-shrink:0;width:2rem;height:2rem}.cortex-widget__thread-skeleton-lines{flex:1;display:flex;flex-direction:column;gap:.375rem}.cortex-widget__thread-skeleton-line{height:.875rem}@keyframes cortex-skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.cortex-skeleton{background:linear-gradient(90deg,#e2e8f0,#f1f5f9,#e2e8f0 80%);background-size:200% 100%;animation:cortex-skeleton-shimmer 1.8s ease-in-out infinite;border-radius:6px}.cortex-widget__thread-item{width:100%;text-align:start;padding:.75rem;border-radius:.5rem;display:flex;align-items:center;gap:.75rem;transition:background-color .15s;cursor:pointer;margin-bottom:.125rem;border:0;background:transparent;color:#475569}.cortex-widget__thread-item:hover{background:#f1f5f9}.cortex-widget__thread-item:active{background:#e8ecf1}.cortex-widget__thread-item--active{background:#e2e8f0;color:#f1f5f9}.cortex-widget__thread-icon{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:600;background:#e2e8f0;color:#64748b}[dir=rtl] .cortex-widget__thread-icon{transform:rotate(180deg)}.cortex-widget__thread-icon--active{background:#334155;color:#cbd5e1}.cortex-widget__thread-info{min-width:0;flex:1}.cortex-widget__thread-title-row{display:flex;align-items:center;gap:.5rem;min-width:0}.cortex-widget__thread-title{font-size:.8125rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.25;margin:0;color:#334155}.cortex-widget__thread-title--active{color:#f1f5f9}.cortex-widget__thread-running{flex-shrink:0;display:inline-flex;align-items:center;gap:.3125rem;padding:.2rem .45rem;border-radius:999px;background:#0e74901a;color:#0f766e;font-size:.625rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.cortex-widget__thread-running--active{background:#f1f5f929;color:#e2e8f0}.cortex-widget__thread-running-dot{width:.375rem;height:.375rem;border-radius:999px;background:currentColor;box-shadow:0 0 .45rem currentColor;animation:cortex-thread-running-pulse 1.4s ease-in-out infinite}@keyframes cortex-thread-running-pulse{0%,to{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1)}}.cortex-widget__thread-delete{flex-shrink:0;opacity:0;width:1.75rem;height:1.75rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .15s;background:transparent;border:0;color:#94a3b8}.cortex-widget__thread-item:hover>.cortex-widget__thread-delete{opacity:1}.cortex-widget__thread-delete:hover{background:#e2e8f0}.cortex-widget__thread-delete--active:hover{background:#475569}.cortex-widget__thread-arrow{flex-shrink:0;transition:color .15s;color:#cbd5e1}[dir=rtl] .cortex-widget__thread-arrow{transform:rotate(180deg)}.cortex-widget__thread-item:hover>.cortex-widget__thread-arrow{color:#94a3b8}.cortex-widget__thread-arrow--active{color:#64748b}.cortex-widget__threads-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 0;text-align:center}.cortex-widget__threads-empty-icon{width:2.5rem;height:2.5rem;border-radius:.5rem;background:#e2e8f0;display:flex;align-items:center;justify-content:center;margin-bottom:.75rem}.cortex-widget__threads-empty-svg{color:#94a3b8}.cortex-widget__threads-empty-title{font-size:.8125rem;color:#94a3b8;font-weight:500;margin:0}.cortex-widget__threads-empty-subtitle{font-size:.6875rem;color:#a5afbd;margin-top:.25rem;margin-bottom:0}.cortex-widget__chat-header{flex-shrink:0;height:3rem;padding:0 1rem;display:flex;align-items:center;gap:.75rem;border-bottom:1px solid #e2e8f0;background:#fff}.cortex-widget__back-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.375rem;display:flex;align-items:center;justify-content:center;color:#94a3b8;background:transparent;border:0;cursor:pointer;transition:color .15s,background-color .15s}.cortex-widget__back-btn:hover{color:#475569;background:#f1f5f9}[dir=rtl] .cortex-widget__back-icon{transform:rotate(180deg)}.cortex-widget__chat-title-wrap{min-width:0;flex:1}.cortex-widget__chat-title{font-size:.8125rem;font-weight:500;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.cortex-widget__debug-btn{flex-shrink:0;font-size:.6875rem;font-weight:500;padding:.25rem .625rem;border-radius:.375rem;border:0;cursor:pointer;transition:background-color .15s}.cortex-widget__debug-btn--on{background:#fef3c7;color:#d97706}.cortex-widget__debug-btn--on:hover{background:#fde68a}.cortex-widget__debug-btn--off{background:#f1f5f9;color:#94a3b8}.cortex-widget__debug-btn--off:hover{background:#e2e8f0}.cortex-widget__messages-skeleton{flex:1;overflow:hidden;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel{width:100%;display:flex;flex-direction:column}.cortex-widget__msg-skel--user{align-items:flex-end}.cortex-widget__msg-skel--assistant{align-items:flex-start}.cortex-widget__msg-skel-bubble{max-width:80%;padding:1rem;border-radius:1rem;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:.5rem}.cortex-widget__msg-skel-bubble--user{background:#f8fafc;border-bottom-right-radius:0}.cortex-widget__msg-skel-bubble--assistant{background:#f1f5f9;border-bottom-left-radius:0}.cortex-widget__msg-skel-line{height:.75rem}.cortex-widget__messages{flex:1;overflow:hidden}@keyframes cortex-working-slide-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes cortex-dot-wave{0%,60%,to{transform:translateY(0) scale(1);opacity:.45}30%{transform:translateY(-5px) scale(1.2);opacity:1}}@keyframes cortex-working-shimmer{0%{background-position:-200% center}to{background-position:200% center}}.cortex-widget__working{flex-shrink:0;padding:.5rem 1rem;display:flex;align-items:center;gap:.5rem;animation:cortex-working-slide-in .25s ease-out both}.cortex-widget__working-dots{display:flex;align-items:center;gap:4px}.cortex-working-dot{display:block;width:6px;height:6px;border-radius:9999px;background:#22c55e;animation:cortex-dot-wave 1.4s ease-in-out infinite}.cortex-working-dot:nth-child(2){animation-delay:.15s}.cortex-working-dot:nth-child(3){animation-delay:.3s}.cortex-widget__working-text{font-size:.75rem;font-weight:500;letter-spacing:.01em;color:#16a34a}.cortex-widget__input-area{flex-shrink:0;padding:.75rem;background:#fff;border-top:1px solid #e2e8f0}.cortex-widget__input-box{display:flex;align-items:flex-end;gap:.5rem;border-radius:.75rem;border:1px solid #e2e8f0;padding:.375rem;transition:border-color .15s,background-color .15s}.cortex-widget__input-box--disabled{background:#f1f5f9}.cortex-widget__input-box--enabled{background:#f8fafc}.cortex-widget__input-box--enabled:focus-within{border-color:#cbd5e1;background:#fff}.cortex-widget__textarea{flex:1;background:transparent;resize:none;border:0;outline:none;font-size:.8125rem;padding:.375rem .5rem;min-height:28px;max-height:120px;line-height:1.375;color:#334155}.cortex-widget__textarea::placeholder{color:#a5afbd}.cortex-widget__textarea--disabled{color:#94a3b8;cursor:not-allowed}.cortex-widget__textarea:disabled{cursor:not-allowed;border:0}@keyframes cortex-stop-pulse-ring{0%{opacity:.45;transform:scale(1)}50%{opacity:.15;transform:scale(1.12)}to{opacity:.45;transform:scale(1)}}@keyframes cortex-stop-fade-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.cortex-stop-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;background:#e11d48;color:#fff;border:0;animation:cortex-stop-fade-in .2s ease-out both;transition:background .15s ease}.cortex-stop-btn:hover{background:#be123c}.cortex-stop-btn:active{transform:scale(.92)}.cortex-stop-btn__ring{position:absolute;inset:0;border-radius:.5rem;background:#e11d48;animation:cortex-stop-pulse-ring 2s ease-in-out infinite;pointer-events:none}.cortex-stop-btn__icon{position:relative;z-index:1}.cortex-widget__send-btn{flex-shrink:0;width:2rem;height:2rem;border-radius:.5rem;display:flex;align-items:center;justify-content:center;border:0;transition:background-color .15s}.cortex-widget__send-btn--empty{background:#e2e8f0;color:#94a3b8}.cortex-widget__send-btn--ready{background:#1e293b;color:#fff;cursor:pointer}.cortex-widget__send-btn--ready:hover{background:#334155}[dir=rtl] .cortex-widget__send-icon{transform:rotate(180deg)}\n"] }]
         }], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }, { type: i0.Output, args: ["textChange"] }] } });
 
 /*