open-chat-studio-widget 0.4.4 → 0.4.6

package/dist/components/open-chat-studio-widget.js

@@ -13,9 +13,9 @@ const GripDotsVerticalIcon = () => {
         h("circle", { cx: "16", cy: "12", r: "1.5" }),
         h("circle", { cx: "16", cy: "18", r: "1.5" })));
 };
-const PencilSquare = () => {
+const PlusWithCircleIcon = () => {
     return (h("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" },
-        h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" })));
+        h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M12 9v6m3-3H9m12 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" })));
 };
 const ArrowsPointingOutIcon = () => {
     return (h("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" },
@@ -25,6 +25,18 @@ const ArrowsPointingInIcon = () => {
     return (h("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" },
         h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M9 9V4.5M9 9H4.5M9 9 3.75 3.75M15 9h4.5M15 9V4.5M15 9l5.25-5.25M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 15h4.5M15 15v4.5m0-4.5 5.25 5.25" })));
 };
+const PaperClipIcon = () => {
+    return (h("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" },
+        h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m18.375 12.739-7.693 7.693a4.5 4.5 0 0 1-6.364-6.364l10.94-10.94A3 3 0 1 1 19.5 7.372L8.552 18.32m.009-.01-.01.01m5.699-9.941-7.81 7.81a1.5 1.5 0 0 0 2.112 2.13" })));
+};
+const CheckDocumentIcon = () => {
+    return (h("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" },
+        h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M10.125 2.25h-4.5c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125v-9M10.125 2.25h.375a9 9 0 0 1 9 9v.375M10.125 2.25A3.375 3.375 0 0 1 13.5 5.625v1.5c0 .621.504 1.125 1.125 1.125h1.5a3.375 3.375 0 0 1 3.375 3.375M9 15l2.25 2.25L15 12" })));
+};
+const XIcon = () => {
+    return (h("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", "stroke-width": "1.5", stroke: "currentColor" },
+        h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M6 18 18 6M6 6l12 12" })));
+};
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -4267,6 +4279,180 @@ function renderMarkdownSync(content) {
     }
 }
 
+var js_cookie = {exports: {}};
+
+/*! js-cookie v3.0.5 | MIT */
+
+(function (module, exports) {
+(function (global, factory) {
+  module.exports = factory() ;
+})(commonjsGlobal, (function () {
+  /* eslint-disable no-var */
+  function assign (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        target[key] = source[key];
+      }
+    }
+    return target
+  }
+  /* eslint-enable no-var */
+
+  /* eslint-disable no-var */
+  var defaultConverter = {
+    read: function (value) {
+      if (value[0] === '"') {
+        value = value.slice(1, -1);
+      }
+      return value.replace(/(%[\dA-F]{2})+/gi, decodeURIComponent)
+    },
+    write: function (value) {
+      return encodeURIComponent(value).replace(
+        /%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,
+        decodeURIComponent
+      )
+    }
+  };
+  /* eslint-enable no-var */
+
+  /* eslint-disable no-var */
+
+  function init (converter, defaultAttributes) {
+    function set (name, value, attributes) {
+      if (typeof document === 'undefined') {
+        return
+      }
+
+      attributes = assign({}, defaultAttributes, attributes);
+
+      if (typeof attributes.expires === 'number') {
+        attributes.expires = new Date(Date.now() + attributes.expires * 864e5);
+      }
+      if (attributes.expires) {
+        attributes.expires = attributes.expires.toUTCString();
+      }
+
+      name = encodeURIComponent(name)
+        .replace(/%(2[346B]|5E|60|7C)/g, decodeURIComponent)
+        .replace(/[()]/g, escape);
+
+      var stringifiedAttributes = '';
+      for (var attributeName in attributes) {
+        if (!attributes[attributeName]) {
+          continue
+        }
+
+        stringifiedAttributes += '; ' + attributeName;
+
+        if (attributes[attributeName] === true) {
+          continue
+        }
+
+        // Considers RFC 6265 section 5.2:
+        // ...
+        // 3.  If the remaining unparsed-attributes contains a %x3B (";")
+        //     character:
+        // Consume the characters of the unparsed-attributes up to,
+        // not including, the first %x3B (";") character.
+        // ...
+        stringifiedAttributes += '=' + attributes[attributeName].split(';')[0];
+      }
+
+      return (document.cookie =
+        name + '=' + converter.write(value, name) + stringifiedAttributes)
+    }
+
+    function get (name) {
+      if (typeof document === 'undefined' || (arguments.length && !name)) {
+        return
+      }
+
+      // To prevent the for loop in the first place assign an empty array
+      // in case there are no cookies at all.
+      var cookies = document.cookie ? document.cookie.split('; ') : [];
+      var jar = {};
+      for (var i = 0; i < cookies.length; i++) {
+        var parts = cookies[i].split('=');
+        var value = parts.slice(1).join('=');
+
+        try {
+          var found = decodeURIComponent(parts[0]);
+          jar[found] = converter.read(value, found);
+
+          if (name === found) {
+            break
+          }
+        } catch (e) {}
+      }
+
+      return name ? jar[name] : jar
+    }
+
+    return Object.create(
+      {
+        set,
+        get,
+        remove: function (name, attributes) {
+          set(
+            name,
+            '',
+            assign({}, attributes, {
+              expires: -1
+            })
+          );
+        },
+        withAttributes: function (attributes) {
+          return init(this.converter, assign({}, this.attributes, attributes))
+        },
+        withConverter: function (converter) {
+          return init(assign({}, this.converter, converter), this.attributes)
+        }
+      },
+      {
+        attributes: { value: Object.freeze(defaultAttributes) },
+        converter: { value: Object.freeze(converter) }
+      }
+    )
+  }
+
+  var api = init(defaultConverter, { path: '/' });
+  /* eslint-enable no-var */
+
+  return api;
+
+}));
+}(js_cookie));
+
+const Cookies = js_cookie.exports;
+
+/**
+ * Get CSRF token from cookies if the current domain matches the API base URL
+ */
+function getCSRFToken(apiBaseUrl) {
+    if (!currentDomainMatchesApiBaseUrl(apiBaseUrl)) {
+        return undefined;
+    }
+    return Cookies.get('csrftoken');
+}
+function currentDomainMatchesApiBaseUrl(apiBaseUrl) {
+    const currentDomain = window.location.hostname;
+    const apiDomain = getDomainFromUrl(apiBaseUrl);
+    if (!apiDomain) {
+        return false;
+    }
+    return currentDomain === apiDomain;
+}
+function getDomainFromUrl(url) {
+    try {
+        const urlObj = new URL(url);
+        return urlObj.hostname;
+    }
+    catch (error) {
+        return null;
+    }
+}
+
 /**
  * Convert a CSS percentage (60%) or pixel (10px) value to pixels.
  * @param value The CSS string value
@@ -4297,7 +4483,7 @@ const percentToFloat = (percentageString) => {
     return numericValue / 100;
 };
 
-const ocsChatCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}#ocs-chat-window{z-index:var(--chat-z-index);font-size:var(--chat-window-font-size)}.starter-question{border-radius:0.5rem;text-align:left;transition-duration:200ms;padding:var(--starter-question-padding, 0.75em);background-color:var(--starter-question-bg-color);border:1px solid var(--starter-question-border-color);color:var(--starter-question-text-color)}.starter-question:hover{background-color:var(--starter-question-bg-hover-color);border-color:var(--starter-question-border-hover-color)}.chat-btn-text,.chat-btn-icon{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));border-radius:0.5rem;border-width:0px;--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transition-property:all;transition-duration:200ms;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.chat-btn-text:hover,.chat-btn-icon:hover{--tw-scale-x:1.05;--tw-scale-y:1.05;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.chat-btn-text,.chat-btn-icon{background-color:var(--button-background-color, white);border:1px solid var(--button-border-color);z-index:var(--chat-z-index, 50);font-size:var(--button-font-size);padding:var(--button-padding, 0.75em)}.chat-btn-text:hover,.chat-btn-icon:hover{color:var(--button-text-color-hover, #1d4ed8);border:1px solid var(--button-border-color-hover)}.chat-btn-text{display:flex;align-items:center;gap:8px;color:var(--button-text-color, #111827)}.chat-btn-text span{white-space:nowrap;font-weight:500}.chat-btn-text img{width:var(--button-icon-size);height:var(--button-icon-size);flex-shrink:0;-o-object-fit:contain;object-fit:contain}.chat-btn-icon img{width:var(--button-icon-size);height:var(--button-icon-size);-o-object-fit:contain;object-fit:contain}.chat-btn-text.round,.chat-btn-icon.round{border-radius:9999px}.error-message{padding:var(--error-message-padding, 0.5em);color:var(--error-text-color)}.chat-window-fullscreen{position:fixed;inset:0px;z-index:9999;display:flex;height:100%;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:0px;border-width:0px;--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:200ms;background-color:var(--chat-window-bg-color);max-width:var(--chat-window-fullscreen-width)}.chat-window-normal{position:fixed;display:flex;height:100vh;min-height:300px;width:100vw;min-width:300px;max-width:1024px;flex-direction:column;overflow:hidden;border-radius:0.5rem}@media (min-width: 640px){.chat-window-normal{height:var(--chat-window-height);width:var(--chat-window-width)}}.chat-window-normal{background-color:var(--chat-window-bg-color);border:1px solid var(--chat-window-border-color)}.chat-window-dragging{cursor:grabbing;--tw-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.chat-window-normal:not(.chat-window-dragging){--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:200ms}.chat-header{display:flex;align-items:center;justify-content:space-between;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;padding:var(--header-padding, 0.5em);background-color:var(--header-bg-color);border-bottom:1px solid var(--header-border-color);font-size:var(--header-font-size)}.header-text{display:flex;align-items:center;justify-content:center;font-size:var(--header-text-font-size);color:var(--header-text-color)}.chat-header:hover,.chat-header:active{background-color:var(--header-bg-hover-color)}.chat-header-draggable{cursor:grab}.chat-header-dragging{cursor:grabbing}.drag-indicator{display:none}@media (min-width: 640px){.drag-indicator{display:flex}}.drag-dots{pointer-events:none;margin-left:2px;display:flex;gap:2px}.header-buttons{display:flex;align-items:center;gap:4px}.header-button{border-radius:0.375rem;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:200ms;padding:0.375em;color:var(--header-button-text-color)}.header-button svg{width:var(--header-button-icon-size);height:var(--header-button-icon-size)}.header-button:hover{background-color:var(--header-button-bg-hover-color)}.fullscreen-button{display:none}@media (min-width: 640px){.fullscreen-button{display:block}}.chat-content{display:flex;flex-grow:1;flex-direction:column;overflow:hidden}.loading-container{display:flex;flex-grow:1;align-items:center;justify-content:center}.loading-text{margin-left:2px;color:var(--loading-text-color)}.messages-container{flex-grow:1}.messages-container>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.messages-container{overflow-y:auto}.messages-container::-webkit-scrollbar{width:0.375rem}.messages-container::-webkit-scrollbar-track{border-radius:0.25rem;background-color:var(--scrollbar-track-color)}.messages-container::-webkit-scrollbar-thumb{border-radius:0.25rem;background-color:var(--scrollbar-thumb-color)}.messages-container::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover-color)}.messages-container{padding:var(--container-padding, 1em)}.message-row{display:flex}.message-row-user{justify-content:flex-end}.message-row-assistant{justify-content:flex-start}.message-bubble{border-radius:0.5rem;padding:var(--message-padding-y, 0.5em) var(--message-padding-x, 1em)}.message-bubble-user{background-color:var(--message-user-bg-color);color:var(--message-user-text-color)}.message-bubble-assistant{background-color:var(--message-assistant-bg-color);color:var(--message-assistant-text-color)}.message-bubble-system{background-color:var(--message-system-bg-color);color:var(--message-system-text-color)}.message-timestamp{margin-top:4px;opacity:0.7;font-size:var(--chat-window-font-size-sm)}.message-attachments{margin-top:8px}.message-attachments>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.25rem * var(--tw-space-y-reverse))}.attachment-link{display:block;text-decoration-line:underline}.attachment-link:hover{text-decoration-line:none}.welcome-messages>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.typing-indicator{height:0.375rem;width:100%;overflow:hidden}.typing-progress{height:100%;width:100%;transform-origin:0% 50%}@keyframes progress{0%{transform:translateX(0) scaleX(0)}10%{transform:translateX(0) scaleX(0.3)}50%{transform:translateX(100%) scaleX(0.3)}90%{transform:translateX(0) scaleX(0.3)}100%{transform:translateX(0) scaleX(0)}}.typing-progress{animation:progress 3s infinite linear;border-radius:0.5rem;background-color:var(--typing-progress-bg-color)}.typing-text{width:100%;justify-content:center;opacity:0.7;font-size:var(--chat-window-font-size-sm)}@keyframes dots{0%,20%{color:rgba(0,0,0,0);text-shadow:.25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0)}40%{color:black;text-shadow:.25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0)}60%{text-shadow:.25em 0 0 black, .5em 0 0 rgba(0,0,0,0)}80%,100%{text-shadow:.25em 0 0 black, .5em 0 0 black}}.typing-dots{animation:dots 1s steps(5, end) infinite}.typing-dots:after{content:' .'}.starter-questions>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.starter-questions{padding:var(--container-padding, 1em)}.starter-question-row{display:flex;justify-content:flex-end}.input-area{padding:var(--container-padding, 1em) var(--container-padding, 1em) 0 var(--container-padding, 1em);background-color:var(--input-bg-color);border-top:1px solid var(--input-border-color)}.input-container{display:flex;gap:8px}.message-textarea{flex-grow:1;resize:none;border-radius:0.375rem;border-width:1px;--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.message-textarea:focus{outline-color:#93c5fd}.message-textarea{padding:var(--input-textarea-padding-y, 0.5em) var(--input-textarea-padding-x, 0.75em);color:var(--input-text-color);border:1px solid var(--input-border-color)}.message-textarea:focus{outline-color:var(--input-outline-focus-color)}.send-button{border-radius:0.375rem;font-weight:500;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:200ms;padding:var(--send-button-padding-y, 0.5em) var(--send-button-padding-x, 1em)}.send-button-enabled{background-color:var(--send-button-bg-color);color:var(--send-button-text-color)}.send-button-enabled:hover{background-color:var(--send-button-bg-hover-color)}.send-button-disabled{cursor:not-allowed;background-color:var(--send-button-bg-disabled-color);color:var(--send-button-text-disabled-color)}.visible{visibility:visible}.static{position:static}.relative{position:relative}.flex{display:flex}.table{display:table}.w-full{width:100%}.transform{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.resize{resize:both}.items-center{align-items:center}.justify-center{justify-content:center}.border{border-width:1px}.py-\\[2px\\]{padding-top:2px;padding-bottom:2px}.text-\\[0\\.8em\\]{font-size:0.8em}.font-light{font-weight:300}.text-slate-500{--tw-text-opacity:1;color:rgb(100 116 139 / var(--tw-text-opacity, 1))}.underline{text-decoration-line:underline}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}:host{--chat-z-index:50;--container-padding:1em;--button-background-color:#ffffff;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:transparent;--button-border-color-hover:#d1d5db;--button-padding:0.5em;--button-font-size:0.875em;--button-icon-size:1.5em;--chat-window-height:60%;--chat-window-width:25%;--chat-window-fullscreen-width:80%;--chat-window-bg-color:#ffffff;--chat-window-border-color:#d1d5db;--chat-window-shadow-color:rgba(0, 0, 0, 0.1);--chat-window-font-size:0.875em;--chat-window-font-size-sm:0.75em;--header-bg-color:transparent;--header-bg-hover-color:#f9fafb;--header-border-color:#f3f4f6;--header-button-text-color:#6b7280;--header-button-bg-hover-color:#f3f4f6;--header-padding:0.5em;--header-font-size:1em;--header-text-font-size:1em;--header-text-color:#525762;--header-button-icon-size:1.5em;--starter-question-bg-color:transparent;--starter-question-bg-hover-color:#eff6ff;--starter-question-text-color:#3b82f6;--starter-question-border-color:#3b82f6;--starter-question-border-hover-color:#2563eb;--starter-question-padding:0.75em;--message-user-bg-color:#3b82f6;--message-user-text-color:#ffffff;--message-assistant-bg-color:#e5e7eb;--message-assistant-text-color:#1f2937;--message-system-bg-color:#f3f4f6;--message-system-text-color:#4b5563;--message-timestamp-color:rgba(255, 255, 255, 0.7);--message-timestamp-assistant-color:rgba(75, 85, 99, 0.7);--message-padding-x:1em;--message-padding-y:0.5em;--input-bg-color:transparent;--input-border-color:#d1d5db;--input-text-color:#111827;--input-placeholder-color:#6b7280;--input-outline-focus-color:#3b82f6;--input-textarea-padding-x:0.75em;--input-textarea-padding-y:0.5em;--send-button-bg-color:#3b82f6;--send-button-bg-hover-color:#2563eb;--send-button-text-color:#ffffff;--send-button-bg-disabled-color:#d1d5db;--send-button-text-disabled-color:#6b7280;--send-button-padding-x:1em;--send-button-padding-y:0.5em;--loading-text-color:#6b7280;--loading-spinner-track-color:#e5e7eb;--loading-spinner-fill-color:#3b82f6;--loading-spinner-size:1.25em;--typing-progress-bg-color:#ade3ff;--scrollbar-track-color:#f3f4f6;--scrollbar-thumb-color:#d1d5db;--scrollbar-thumb-hover-color:#9ca3af;--error-text-color:#ef4444;--error-message-padding:0.5em;--code-bg-user-color:color-mix(in srgb, var(--message-user-bg-color) 80%, white 20%);--code-text-user-color:var(--message-user-text-color);--code-border-user-color:color-mix(in srgb, var(--message-user-bg-color) 90%, black 10%);--code-bg-assistant-color:color-mix(in srgb, var(--message-assistant-bg-color) 50%, white 50%);--code-text-assistant-color:var(--message-assistant-text-color);--code-border-assistant-color:color-mix(in srgb, var(--message-assistant-bg-color) 90%, black 10%);display:block;position:fixed;right:20px;bottom:20px}textarea{max-height:8rem;min-height:2.5rem;resize:none;overflow-y:auto}textarea::-webkit-scrollbar{width:0.375rem}textarea::-webkit-scrollbar-track{border-radius:0.25rem;background-color:var(--scrollbar-track-color)}textarea::-webkit-scrollbar-thumb{border-radius:0.25rem;background-color:var(--scrollbar-thumb-color)}textarea::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover-color)}.loading-spinner{width:var(--loading-spinner-size);height:var(--loading-spinner-size)}@keyframes spin{to{transform:rotate(360deg)}}.loading-spinner{animation:spin 1s linear infinite;border-radius:9999px;border-width:2px;border-color:var(--loading-spinner-track-color);border-top-color:var(--loading-spinner-fill-color)}.overflow-y-auto::-webkit-scrollbar{width:0.375rem}.overflow-y-auto::-webkit-scrollbar-track{border-radius:0.25rem;background-color:var(--scrollbar-track-color)}.overflow-y-auto::-webkit-scrollbar-thumb{border-radius:0.25rem;background-color:var(--scrollbar-thumb-color)}.overflow-y-auto::-webkit-scrollbar-thumb:hover{background-color:var(--scrollbar-thumb-hover-color)}.chat-markdown{color:var(--tw-prose-body);max-width:65ch}.chat-markdown :where(p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.25em;margin-bottom:1.25em}.chat-markdown :where([class~=\"lead\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.chat-markdown :where(a):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.chat-markdown :where(strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-bold);font-weight:600}.chat-markdown :where(a strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(blockquote strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(thead th strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;padding-inline-start:1.625em}.chat-markdown :where(ol[type=\"A\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:upper-alpha}.chat-markdown :where(ol[type=\"a\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:lower-alpha}.chat-markdown :where(ol[type=\"A\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:upper-alpha}.chat-markdown :where(ol[type=\"a\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:lower-alpha}.chat-markdown :where(ol[type=\"I\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:upper-roman}.chat-markdown :where(ol[type=\"i\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:lower-roman}.chat-markdown :where(ol[type=\"I\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:upper-roman}.chat-markdown :where(ol[type=\"i\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:lower-roman}.chat-markdown :where(ol[type=\"1\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:decimal}.chat-markdown :where(ul):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;padding-inline-start:1.625em}.chat-markdown :where(ol>li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::marker{font-weight:400;color:var(--tw-prose-counters)}.chat-markdown :where(ul>li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::marker{color:var(--tw-prose-bullets)}.chat-markdown :where(dt):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.25em}.chat-markdown :where(hr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.chat-markdown :where(blockquote):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-weight:500;font-style:italic;color:var(--tw-prose-quotes);border-inline-start-width:0.25rem;border-inline-start-color:var(--tw-prose-quote-borders);quotes:\"\\201C\"\"\\201D\"\"\\2018\"\"\\2019\";margin-top:1.6em;margin-bottom:1.6em;padding-inline-start:1em}.chat-markdown :where(blockquote p:first-of-type):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before{content:open-quote}.chat-markdown :where(blockquote p:last-of-type):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after{content:close-quote}.chat-markdown :where(h1):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-headings);font-weight:800;font-size:2.25em;margin-top:0;margin-bottom:0.8888889em;line-height:1.1111111}.chat-markdown :where(h1 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-weight:900;color:inherit}.chat-markdown :where(h2):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-headings);font-weight:700;font-size:1.5em;margin-top:2em;margin-bottom:1em;line-height:1.3333333}.chat-markdown :where(h2 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-weight:800;color:inherit}.chat-markdown :where(h3):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-headings);font-weight:600;font-size:1.25em;margin-top:1.6em;margin-bottom:0.6em;line-height:1.6}.chat-markdown :where(h3 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-weight:700;color:inherit}.chat-markdown :where(h4):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.5em;margin-bottom:0.5em;line-height:1.5}.chat-markdown :where(h4 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-weight:700;color:inherit}.chat-markdown :where(img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:2em;margin-bottom:2em}.chat-markdown :where(picture):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){display:block;margin-top:2em;margin-bottom:2em}.chat-markdown :where(video):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:2em;margin-bottom:2em}.chat-markdown :where(kbd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-weight:500;font-family:inherit;color:var(--tw-prose-kbd);box-shadow:0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%), 0 3px 0 rgb(var(--tw-prose-kbd-shadows) / 10%);font-size:0.875em;border-radius:0.3125rem;padding-top:0.1875em;padding-inline-end:0.375em;padding-bottom:0.1875em;padding-inline-start:0.375em}.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-code);font-weight:600;font-size:0.875em}.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before{content:\"`\"}.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after{content:\"`\"}.chat-markdown :where(a code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(h1 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(h2 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit;font-size:0.875em}.chat-markdown :where(h3 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit;font-size:0.9em}.chat-markdown :where(h4 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(blockquote code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(thead th code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:inherit}.chat-markdown :where(pre):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-pre-code);background-color:var(--tw-prose-pre-bg);overflow-x:auto;font-weight:400;font-size:0.875em;line-height:1.7142857;margin-top:1.7142857em;margin-bottom:1.7142857em;border-radius:0.375rem;padding-top:0.8571429em;padding-inline-end:1.1428571em;padding-bottom:0.8571429em;padding-inline-start:1.1428571em}.chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){background-color:transparent;border-width:0;border-radius:0;padding:0;font-weight:inherit;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}.chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before{content:none}.chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after{content:none}.chat-markdown :where(table):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){width:100%;table-layout:auto;margin-top:2em;margin-bottom:2em;font-size:0.875em;line-height:1.7142857}.chat-markdown :where(thead):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.chat-markdown :where(thead th):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-headings);font-weight:600;vertical-align:bottom;padding-inline-end:0.5714286em;padding-bottom:0.5714286em;padding-inline-start:0.5714286em}.chat-markdown :where(tbody tr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.chat-markdown :where(tbody tr:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){border-bottom-width:0}.chat-markdown :where(tbody td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){vertical-align:baseline}.chat-markdown :where(tfoot):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.chat-markdown :where(tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){vertical-align:top}.chat-markdown :where(th,td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){text-align:start}.chat-markdown :where(figure>*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0;margin-bottom:0}.chat-markdown :where(figcaption):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){color:var(--tw-prose-captions);font-size:0.875em;line-height:1.4285714;margin-top:0.8571429em}.chat-markdown{--tw-prose-body:#374151;--tw-prose-headings:#111827;--tw-prose-lead:#4b5563;--tw-prose-links:#111827;--tw-prose-bold:#111827;--tw-prose-counters:#6b7280;--tw-prose-bullets:#d1d5db;--tw-prose-hr:#e5e7eb;--tw-prose-quotes:#111827;--tw-prose-quote-borders:#e5e7eb;--tw-prose-captions:#6b7280;--tw-prose-kbd:#111827;--tw-prose-kbd-shadows:17 24 39;--tw-prose-code:#111827;--tw-prose-pre-code:#e5e7eb;--tw-prose-pre-bg:#1f2937;--tw-prose-th-borders:#d1d5db;--tw-prose-td-borders:#e5e7eb;--tw-prose-invert-body:#d1d5db;--tw-prose-invert-headings:#fff;--tw-prose-invert-lead:#9ca3af;--tw-prose-invert-links:#fff;--tw-prose-invert-bold:#fff;--tw-prose-invert-counters:#9ca3af;--tw-prose-invert-bullets:#4b5563;--tw-prose-invert-hr:#374151;--tw-prose-invert-quotes:#f3f4f6;--tw-prose-invert-quote-borders:#374151;--tw-prose-invert-captions:#9ca3af;--tw-prose-invert-kbd:#fff;--tw-prose-invert-kbd-shadows:255 255 255;--tw-prose-invert-code:#fff;--tw-prose-invert-pre-code:#d1d5db;--tw-prose-invert-pre-bg:rgb(0 0 0 / 50%);--tw-prose-invert-th-borders:#4b5563;--tw-prose-invert-td-borders:#374151;font-size:1rem;line-height:1.75}.chat-markdown :where(picture>img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0;margin-bottom:0}.chat-markdown :where(li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.5em;margin-bottom:0.5em}.chat-markdown :where(ol>li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0.375em}.chat-markdown :where(ul>li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0.375em}.chat-markdown :where(.prose>ul>li p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.75em;margin-bottom:0.75em}.chat-markdown :where(.prose>ul>li>p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.25em}.chat-markdown :where(.prose>ul>li>p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-bottom:1.25em}.chat-markdown :where(.prose>ol>li>p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.25em}.chat-markdown :where(.prose>ol>li>p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-bottom:1.25em}.chat-markdown :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.75em;margin-bottom:0.75em}.chat-markdown :where(dl):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.25em;margin-bottom:1.25em}.chat-markdown :where(dd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.5em;padding-inline-start:1.625em}.chat-markdown :where(hr+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(h2+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(h3+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(h4+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(thead th:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0}.chat-markdown :where(thead th:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-end:0}.chat-markdown :where(tbody td,tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-top:0.5714286em;padding-inline-end:0.5714286em;padding-bottom:0.5714286em;padding-inline-start:0.5714286em}.chat-markdown :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0}.chat-markdown :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-end:0}.chat-markdown :where(figure):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:2em;margin-bottom:2em}.chat-markdown :where(.prose>:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(.prose>:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-bottom:0}.chat-markdown{font-size:0.875rem;line-height:1.7142857}.chat-markdown :where(p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.1428571em;margin-bottom:1.1428571em}.chat-markdown :where([class~=\"lead\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:1.2857143em;line-height:1.5555556;margin-top:0.8888889em;margin-bottom:0.8888889em}.chat-markdown :where(blockquote):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.3333333em;margin-bottom:1.3333333em;padding-inline-start:1.1111111em}.chat-markdown :where(h1):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:2.1428571em;margin-top:0;margin-bottom:0.8em;line-height:1.2}.chat-markdown :where(h2):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:1.4285714em;margin-top:1.6em;margin-bottom:0.8em;line-height:1.4}.chat-markdown :where(h3):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:1.2857143em;margin-top:1.5555556em;margin-bottom:0.4444444em;line-height:1.5555556}.chat-markdown :where(h4):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.4285714em;margin-bottom:0.5714286em;line-height:1.4285714}.chat-markdown :where(img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.7142857em;margin-bottom:1.7142857em}.chat-markdown :where(picture):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.7142857em;margin-bottom:1.7142857em}.chat-markdown :where(picture>img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0;margin-bottom:0}.chat-markdown :where(video):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.7142857em;margin-bottom:1.7142857em}.chat-markdown :where(kbd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:0.8571429em;border-radius:0.3125rem;padding-top:0.1428571em;padding-inline-end:0.3571429em;padding-bottom:0.1428571em;padding-inline-start:0.3571429em}.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:0.8571429em}.chat-markdown :where(h2 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:0.9em}.chat-markdown :where(h3 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:0.8888889em}.chat-markdown :where(pre):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:0.8571429em;line-height:1.6666667;margin-top:1.6666667em;margin-bottom:1.6666667em;border-radius:0.25rem;padding-top:0.6666667em;padding-inline-end:1em;padding-bottom:0.6666667em;padding-inline-start:1em}.chat-markdown :where(ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.1428571em;margin-bottom:1.1428571em;padding-inline-start:1.5714286em}.chat-markdown :where(ul):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.1428571em;margin-bottom:1.1428571em;padding-inline-start:1.5714286em}.chat-markdown :where(li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.2857143em;margin-bottom:0.2857143em}.chat-markdown :where(ol>li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0.4285714em}.chat-markdown :where(ul>li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0.4285714em}.chat-markdown :where(.prose-sm>ul>li p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.5714286em;margin-bottom:0.5714286em}.chat-markdown :where(.prose-sm>ul>li>p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.1428571em}.chat-markdown :where(.prose-sm>ul>li>p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-bottom:1.1428571em}.chat-markdown :where(.prose-sm>ol>li>p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.1428571em}.chat-markdown :where(.prose-sm>ol>li>p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-bottom:1.1428571em}.chat-markdown :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.5714286em;margin-bottom:0.5714286em}.chat-markdown :where(dl):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.1428571em;margin-bottom:1.1428571em}.chat-markdown :where(dt):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.1428571em}.chat-markdown :where(dd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0.2857143em;padding-inline-start:1.5714286em}.chat-markdown :where(hr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:2.8571429em;margin-bottom:2.8571429em}.chat-markdown :where(hr+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(h2+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(h3+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(h4+*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(table):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:0.8571429em;line-height:1.5}.chat-markdown :where(thead th):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-end:1em;padding-bottom:0.6666667em;padding-inline-start:1em}.chat-markdown :where(thead th:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0}.chat-markdown :where(thead th:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-end:0}.chat-markdown :where(tbody td,tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-top:0.6666667em;padding-inline-end:1em;padding-bottom:0.6666667em;padding-inline-start:1em}.chat-markdown :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-start:0}.chat-markdown :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){padding-inline-end:0}.chat-markdown :where(figure):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:1.7142857em;margin-bottom:1.7142857em}.chat-markdown :where(figure>*):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0;margin-bottom:0}.chat-markdown :where(figcaption):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){font-size:0.8571429em;line-height:1.3333333;margin-top:0.6666667em}.chat-markdown :where(.prose-sm>:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-top:0}.chat-markdown :where(.prose-sm>:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)){margin-bottom:0}.chat-markdown{--tw-prose-body:#374151;--tw-prose-headings:#111827;--tw-prose-lead:#4b5563;--tw-prose-links:#111827;--tw-prose-bold:#111827;--tw-prose-counters:#6b7280;--tw-prose-bullets:#d1d5db;--tw-prose-hr:#e5e7eb;--tw-prose-quotes:#111827;--tw-prose-quote-borders:#e5e7eb;--tw-prose-captions:#6b7280;--tw-prose-kbd:#111827;--tw-prose-kbd-shadows:17 24 39;--tw-prose-code:#111827;--tw-prose-pre-code:#e5e7eb;--tw-prose-pre-bg:#1f2937;--tw-prose-th-borders:#d1d5db;--tw-prose-td-borders:#e5e7eb;--tw-prose-invert-body:#d1d5db;--tw-prose-invert-headings:#fff;--tw-prose-invert-lead:#9ca3af;--tw-prose-invert-links:#fff;--tw-prose-invert-bold:#fff;--tw-prose-invert-counters:#9ca3af;--tw-prose-invert-bullets:#4b5563;--tw-prose-invert-hr:#374151;--tw-prose-invert-quotes:#f3f4f6;--tw-prose-invert-quote-borders:#374151;--tw-prose-invert-captions:#9ca3af;--tw-prose-invert-kbd:#fff;--tw-prose-invert-kbd-shadows:255 255 255;--tw-prose-invert-code:#fff;--tw-prose-invert-pre-code:#d1d5db;--tw-prose-invert-pre-bg:rgb(0 0 0 / 50%);--tw-prose-invert-th-borders:#4b5563;--tw-prose-invert-td-borders:#374151;max-width:none;font-size:1em;--tw-prose-body:var(--message-assistant-text-color);--tw-prose-headings:var(--message-assistant-text-color);--tw-prose-lead:var(--message-assistant-text-color);--tw-prose-links:var(--message-assistant-text-color);--tw-prose-bold:var(--message-assistant-text-color);--tw-prose-counters:var(--message-assistant-text-color);--tw-prose-bullets:var(--message-assistant-text-color);--tw-prose-hr:var(--message-assistant-text-color);--tw-prose-quotes:var(--message-assistant-text-color);--tw-prose-quote-borders:var(--message-assistant-text-color);--tw-prose-captions:var(--message-assistant-text-color);--tw-prose-kbd:var(--message-assistant-text-color);--tw-prose-kbd-shadows:var(--message-assistant-text-color);--tw-prose-code:var(--code-text-assistant-color);--tw-prose-pre-code:var(--code-text-assistant-color);--tw-prose-pre-bg:var(--code-bg-assistant-color);--tw-prose-th-borders:var(--message-assistant-text-color);--tw-prose-td-borders:var(--message-assistant-text-color);--tw-prose-invert-body:var(--message-user-text-color);--tw-prose-invert-headings:var(--message-user-text-color);--tw-prose-invert-lead:var(--message-user-text-color);--tw-prose-invert-links:var(--message-user-text-color);--tw-prose-invert-bold:var(--message-user-text-color);--tw-prose-invert-counters:var(--message-user-text-color);--tw-prose-invert-bullets:var(--message-user-text-color);--tw-prose-invert-hr:var(--message-user-text-color);--tw-prose-invert-quotes:var(--message-user-text-color);--tw-prose-invert-quote-borders:var(--message-user-text-color);--tw-prose-invert-captions:var(--message-user-text-color);--tw-prose-invert-kbd:var(--message-user-text-color);--tw-prose-invert-kbd-shadows:var(--message-user-text-color);--tw-prose-invert-code:var(--code-text-user-color);--tw-prose-invert-pre-code:var(--code-text-user-color);--tw-prose-invert-pre-bg:var(--code-bg-user-color);--tw-prose-invert-th-borders:var(--message-user-text-color);--tw-prose-invert-td-borders:var(--message-user-text-color)}.chat-markdown>*{margin-top:0.1em;margin-bottom:0.1em}.message-bubble-user .chat-markdown{--tw-prose-body:var(--tw-prose-invert-body);--tw-prose-headings:var(--tw-prose-invert-headings);--tw-prose-lead:var(--tw-prose-invert-lead);--tw-prose-links:var(--tw-prose-invert-links);--tw-prose-bold:var(--tw-prose-invert-bold);--tw-prose-counters:var(--tw-prose-invert-counters);--tw-prose-bullets:var(--tw-prose-invert-bullets);--tw-prose-hr:var(--tw-prose-invert-hr);--tw-prose-quotes:var(--tw-prose-invert-quotes);--tw-prose-quote-borders:var(--tw-prose-invert-quote-borders);--tw-prose-captions:var(--tw-prose-invert-captions);--tw-prose-kbd:var(--tw-prose-invert-kbd);--tw-prose-kbd-shadows:var(--tw-prose-invert-kbd-shadows);--tw-prose-code:var(--tw-prose-invert-code);--tw-prose-pre-code:var(--tw-prose-invert-pre-code);--tw-prose-pre-bg:var(--tw-prose-invert-pre-bg);--tw-prose-th-borders:var(--tw-prose-invert-th-borders);--tw-prose-td-borders:var(--tw-prose-invert-td-borders)}.message-bubble-user .chat-markdown pre{border:1px solid var(--code-border-user-color)}.message-bubble-assistant .chat-markdown pre{border:1px solid var(--code-border-assistant-color)}.loading:after{content:' .'}";
+const ocsChatCss = "*, ::before, ::after {\n  --tw-border-spacing-x: 0;\n  --tw-border-spacing-y: 0;\n  --tw-translate-x: 0;\n  --tw-translate-y: 0;\n  --tw-rotate: 0;\n  --tw-skew-x: 0;\n  --tw-skew-y: 0;\n  --tw-scale-x: 1;\n  --tw-scale-y: 1;\n  --tw-pan-x:  ;\n  --tw-pan-y:  ;\n  --tw-pinch-zoom:  ;\n  --tw-scroll-snap-strictness: proximity;\n  --tw-gradient-from-position:  ;\n  --tw-gradient-via-position:  ;\n  --tw-gradient-to-position:  ;\n  --tw-ordinal:  ;\n  --tw-slashed-zero:  ;\n  --tw-numeric-figure:  ;\n  --tw-numeric-spacing:  ;\n  --tw-numeric-fraction:  ;\n  --tw-ring-inset:  ;\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgb(59 130 246 / 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  --tw-blur:  ;\n  --tw-brightness:  ;\n  --tw-contrast:  ;\n  --tw-grayscale:  ;\n  --tw-hue-rotate:  ;\n  --tw-invert:  ;\n  --tw-saturate:  ;\n  --tw-sepia:  ;\n  --tw-drop-shadow:  ;\n  --tw-backdrop-blur:  ;\n  --tw-backdrop-brightness:  ;\n  --tw-backdrop-contrast:  ;\n  --tw-backdrop-grayscale:  ;\n  --tw-backdrop-hue-rotate:  ;\n  --tw-backdrop-invert:  ;\n  --tw-backdrop-opacity:  ;\n  --tw-backdrop-saturate:  ;\n  --tw-backdrop-sepia:  ;\n  --tw-contain-size:  ;\n  --tw-contain-layout:  ;\n  --tw-contain-paint:  ;\n  --tw-contain-style:  ;\n}\n\n::backdrop {\n  --tw-border-spacing-x: 0;\n  --tw-border-spacing-y: 0;\n  --tw-translate-x: 0;\n  --tw-translate-y: 0;\n  --tw-rotate: 0;\n  --tw-skew-x: 0;\n  --tw-skew-y: 0;\n  --tw-scale-x: 1;\n  --tw-scale-y: 1;\n  --tw-pan-x:  ;\n  --tw-pan-y:  ;\n  --tw-pinch-zoom:  ;\n  --tw-scroll-snap-strictness: proximity;\n  --tw-gradient-from-position:  ;\n  --tw-gradient-via-position:  ;\n  --tw-gradient-to-position:  ;\n  --tw-ordinal:  ;\n  --tw-slashed-zero:  ;\n  --tw-numeric-figure:  ;\n  --tw-numeric-spacing:  ;\n  --tw-numeric-fraction:  ;\n  --tw-ring-inset:  ;\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgb(59 130 246 / 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  --tw-blur:  ;\n  --tw-brightness:  ;\n  --tw-contrast:  ;\n  --tw-grayscale:  ;\n  --tw-hue-rotate:  ;\n  --tw-invert:  ;\n  --tw-saturate:  ;\n  --tw-sepia:  ;\n  --tw-drop-shadow:  ;\n  --tw-backdrop-blur:  ;\n  --tw-backdrop-brightness:  ;\n  --tw-backdrop-contrast:  ;\n  --tw-backdrop-grayscale:  ;\n  --tw-backdrop-hue-rotate:  ;\n  --tw-backdrop-invert:  ;\n  --tw-backdrop-opacity:  ;\n  --tw-backdrop-saturate:  ;\n  --tw-backdrop-sepia:  ;\n  --tw-contain-size:  ;\n  --tw-contain-layout:  ;\n  --tw-contain-paint:  ;\n  --tw-contain-style:  ;\n}/*\n! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n  box-sizing: border-box; /* 1 */\n  border-width: 0; /* 2 */\n  border-style: solid; /* 2 */\n  border-color: #e5e7eb; /* 2 */\n}\n\n::before,\n::after {\n  --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n  line-height: 1.5; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n  -moz-tab-size: 4; /* 3 */\n  -o-tab-size: 4;\n     tab-size: 4; /* 3 */\n  font-family: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n  font-feature-settings: normal; /* 5 */\n  font-variation-settings: normal; /* 6 */\n  -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n  margin: 0; /* 1 */\n  line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n  height: 0; /* 1 */\n  color: inherit; /* 2 */\n  border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n  font-feature-settings: normal; /* 2 */\n  font-variation-settings: normal; /* 3 */\n  font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n  font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n  text-indent: 0; /* 1 */\n  border-color: inherit; /* 2 */\n  border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-feature-settings: inherit; /* 1 */\n  font-variation-settings: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  font-weight: inherit; /* 1 */\n  line-height: inherit; /* 1 */\n  letter-spacing: inherit; /* 1 */\n  color: inherit; /* 1 */\n  margin: 0; /* 2 */\n  padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n  text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n  -webkit-appearance: button; /* 1 */\n  background-color: transparent; /* 2 */\n  background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n  outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n  box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n  vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n  display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\n\nfieldset {\n  margin: 0;\n  padding: 0;\n}\n\nlegend {\n  padding: 0;\n}\n\nol,\nul,\nmenu {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n  padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n  resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n  opacity: 1; /* 1 */\n  color: #9ca3af; /* 2 */\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1; /* 1 */\n  color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n  cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n  cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n   This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block; /* 1 */\n  vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden]:where(:not([hidden=\"until-found\"])) {\n  display: none;\n}\n#ocs-chat-window {\n    z-index: var(--chat-z-index);\n    font-size: var(--chat-window-font-size);\n  }\n.starter-question {\n  border-radius: 0.5rem;\n  text-align: left;\n  transition-duration: 200ms;\n    padding: 0.75em;\n    background-color: var(--starter-question-bg-color);\n    border: 1px solid var(--starter-question-border-color);\n    color: var(--starter-question-text-color);\n}\n.starter-question:hover {\n    background-color: var(--starter-question-bg-hover-color);\n    border-color: var(--starter-question-border-hover-color);\n  }\n.chat-btn-text,\n  .chat-btn-icon {\n  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n  border-radius: 0.5rem;\n  border-width: 0px;\n  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n  transition-property: all;\n  transition-duration: 200ms;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n.chat-btn-text:hover,\n  .chat-btn-icon:hover {\n  --tw-scale-x: 1.05;\n  --tw-scale-y: 1.05;\n  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.chat-btn-text,\n  .chat-btn-icon {\n    background-color: var(--button-background-color, white);\n    border: 1px solid var(--button-border-color);\n    z-index: var(--chat-z-index, 50);\n    font-size: var(--button-font-size);\n    padding: 0.5em;\n  }\n.chat-btn-text:hover, .chat-btn-icon:hover {\n    color: var(--button-text-color-hover, #1d4ed8);\n    border: 1px solid var(--button-border-color-hover);\n  }\n/* Button with text and icon */\n.chat-btn-text {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n    color: var(--button-text-color, #111827);\n}\n.chat-btn-text span {\n  white-space: nowrap;\n  font-weight: 500;\n}\n.chat-btn-text img {\n  flex-shrink: 0;\n  -o-object-fit: contain;\n     object-fit: contain;\n    width: var(--button-icon-size);\n    height: var(--button-icon-size);\n}\n/* Icon-only button */\n.chat-btn-icon {\n  }\n.chat-btn-icon img {\n  -o-object-fit: contain;\n     object-fit: contain;\n    width: var(--button-icon-size);\n    height: var(--button-icon-size);\n}\n.chat-btn-text.round,\n  .chat-btn-icon.round {\n  border-radius: 9999px;\n}\n/* Error message styling */\n.error-message {\n    padding: 0.5em;\n    color: var(--error-text-color);\n  }\n/* Chat window positioning classes */\n.chat-window-fullscreen {\n  position: fixed;\n  inset: 0px;\n  z-index: 9999;\n  display: flex;\n  height: 100%;\n  max-height: 100%;\n  width: 100%;\n  flex-direction: column;\n  overflow: hidden;\n  border-radius: 0px;\n  border-width: 0px;\n  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n  transition-property: box-shadow;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 200ms;\n    background-color: var(--chat-window-bg-color);\n    max-width: var(--chat-window-fullscreen-width);\n}\n.chat-window-normal {\n  position: fixed;\n  display: flex;\n  height: 100vh;\n  min-height: 300px;\n  width: 100vw;\n  min-width: 300px;\n  max-width: 1024px;\n  flex-direction: column;\n  overflow: hidden;\n  border-radius: 0.5rem;\n}\n@media (min-width: 640px) {\n\n  .chat-window-normal {\n    height: var(--chat-window-height);\n    width: var(--chat-window-width);\n  }\n}\n.chat-window-normal {\n    background-color: var(--chat-window-bg-color);\n    border: 1px solid var(--chat-window-border-color);\n  }\n.chat-window-dragging {\n  cursor: grabbing;\n  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.chat-window-normal:not(.chat-window-dragging) {\n  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n  transition-property: box-shadow;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 200ms;\n}\n/* Header/drag bar classes */\n.chat-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n    padding: 0.5em;\n    background-color: var(--header-bg-color);\n    border-bottom: 1px solid var(--header-border-color);\n    font-size: var(--header-font-size);\n}\n.header-text {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n    font-size: var(--header-text-font-size);\n    color: var(--header-text-color);\n}\n.chat-header:hover,\n  .chat-header:active {\n    background-color: var(--header-bg-hover-color);\n  }\n.chat-header-draggable {\n  cursor: grab;\n}\n.chat-header-dragging {\n  cursor: grabbing;\n}\n.drag-indicator {\n  display: none;\n}\n@media (min-width: 640px) {\n\n  .drag-indicator {\n    display: flex;\n  }\n}\n.drag-dots {\n  pointer-events: none;\n  margin-left: 2px;\n  display: flex;\n  gap: 2px;\n}\n.header-buttons {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n/* Header button classes */\n.header-button {\n  border-radius: 0.375rem;\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 200ms;\n    padding: 0.375em;\n    color: var(--header-button-text-color);\n}\n.header-button svg {\n    width: var(--header-button-icon-size);\n    height: var(--header-button-icon-size);\n  }\n.header-button:hover {\n    background-color: var(--header-button-bg-hover-color);\n  }\n.fullscreen-button {\n  display: none;\n}\n@media (min-width: 640px) {\n\n  .fullscreen-button {\n    display: block;\n  }\n}\n/* Chat content area */\n.chat-content {\n  display: flex;\n  flex-grow: 1;\n  flex-direction: column;\n  overflow: hidden;\n}\n/* Loading state */\n.loading-container {\n  display: flex;\n  flex-grow: 1;\n  align-items: center;\n  justify-content: center;\n}\n.loading-text {\n    margin-left: 2px;\n    color: var(--loading-text-color);\n  }\n/* Messages container */\n.messages-container {\n  flex-grow: 1;\n}\n.messages-container > :not([hidden]) ~ :not([hidden]) {\n  --tw-space-y-reverse: 0;\n  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.messages-container {\n  overflow-y: auto;\n}\n.messages-container::-webkit-scrollbar {\n  width: 0.375rem;\n}\n.messages-container::-webkit-scrollbar-track {\n  border-radius: 0.25rem;\n  background-color: var(--scrollbar-track-color);\n}\n.messages-container::-webkit-scrollbar-thumb {\n  border-radius: 0.25rem;\n  background-color: var(--scrollbar-thumb-color);\n}\n.messages-container::-webkit-scrollbar-thumb:hover {\n  background-color: var(--scrollbar-thumb-hover-color);\n}\n.messages-container {\n    padding: 1em;\n  }\n/* Message bubbles */\n.message-row {\n  display: flex;\n}\n.message-row-user {\n  justify-content: flex-end;\n}\n.message-row-assistant {\n  justify-content: flex-start;\n}\n.message-bubble {\n  border-radius: 0.5rem;\n    padding: 0.5em 1em;\n}\n.message-bubble-user {\n    background-color: var(--message-user-bg-color);\n    color: var(--message-user-text-color);\n  }\n.message-bubble-assistant {\n    background-color: var(--message-assistant-bg-color);\n    color: var(--message-assistant-text-color);\n  }\n.message-bubble-system {\n    background-color: var(--message-system-bg-color);\n    color: var(--message-system-text-color);\n  }\n.message-timestamp {\n  margin-top: 4px;\n  opacity: 0.7;\n    font-size: var(--chat-window-font-size-sm);\n}\n.message-attachments {\n  margin-top: 8px;\n}\n.message-attachments > :not([hidden]) ~ :not([hidden]) {\n  --tw-space-y-reverse: 0;\n  margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));\n  margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));\n}\n/* Welcome messages */\n.welcome-messages > :not([hidden]) ~ :not([hidden]) {\n  --tw-space-y-reverse: 0;\n  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n/* Typing indicator */\n.typing-indicator {\n  height: 0.375rem;\n  width: 100%;\n  overflow: hidden;\n}\n.typing-progress {\n  height: 100%;\n  width: 100%;\n  transform-origin: 0% 50%;\n}\n@keyframes progress {\n\n  0% {\n    transform:  translateX(0) scaleX(0);\n  }\n\n  10% {\n    transform: translateX(0) scaleX(0.3);\n  }\n\n  50% {\n    transform: translateX(100%) scaleX(0.3);\n  }\n\n  90% {\n    transform: translateX(0) scaleX(0.3);\n  }\n\n  100% {\n    transform: translateX(0) scaleX(0);\n  }\n}\n.typing-progress {\n  animation: progress 3s infinite linear;\n  border-radius: 0.5rem;\n    background-color: var(--typing-progress-bg-color);\n}\n.typing-text {\n  width: 100%;\n  justify-content: center;\n  opacity: 0.7;\n    font-size: var(--chat-window-font-size-sm);\n}\n@keyframes dots {\n\n  0%, 20% {\n    color: rgba(0,0,0,0);\n    text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0);\n  }\n\n  40% {\n    color: black;\n    text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0);\n  }\n\n  60% {\n    text-shadow: .25em 0 0 black, .5em 0 0 rgba(0,0,0,0);\n  }\n\n  80%, 100% {\n    text-shadow: .25em 0 0 black, .5em 0 0 black;\n  }\n}\n.typing-dots {\n  animation: dots 1s steps(5, end) infinite;\n}\n.typing-dots:after {\n  content: ' .';\n}\n/* Starter questions */\n.starter-questions > :not([hidden]) ~ :not([hidden]) {\n  --tw-space-y-reverse: 0;\n  margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n  margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\n.starter-questions {\n    padding: 1em;\n  }\n.starter-question-row {\n  display: flex;\n  justify-content: flex-end;\n}\n/* Input area */\n.input-area {\n    padding: 1em 1em 0 1em;\n    background-color: var(--input-bg-color);\n    border-top: 1px solid var(--input-border-color);\n  }\n.input-container {\n  display: flex;\n  gap: 8px;\n}\n.message-textarea {\n  flex-grow: 1;\n  resize: none;\n  border-radius: 0.375rem;\n  border-width: 1px;\n  --tw-border-opacity: 1;\n  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));\n}\n.message-textarea:focus {\n  outline-color: #93c5fd;\n}\n.message-textarea {\n    background-color: var(--input-bg-color);\n    padding: 0.5em 0.75em;\n    color: var(--input-text-color);\n    border: 1px solid var(--input-border-color);\n  }\n.message-textarea:focus {\n    outline-color: var(--input-outline-focus-color);\n  }\n.send-button {\n  border-radius: 0.375rem;\n  font-weight: 500;\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 200ms;\n    padding: 0.5em 1em;\n}\n.send-button-enabled {\n    background-color: var(--send-button-bg-color);\n    color: var(--send-button-text-color);\n  }\n.send-button-enabled:hover {\n    background-color: var(--send-button-bg-hover-color);\n  }\n.send-button-disabled {\n  cursor: not-allowed;\n    background-color: var(--send-button-bg-disabled-color);\n    color: var(--send-button-text-disabled-color);\n}\n/* Confirmation dialog */\n.confirmation-overlay {\n  position: fixed;\n  inset: 0px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n    background-color: var(--confirmation-overlay-bg-color);\n    z-index: 9999;\n}\n.confirmation-dialog {\n  margin-left: 1rem;\n  margin-right: 1rem;\n  width: 100%;\n  max-width: 24rem;\n    background-color: var(--confirmation-dialog-bg-color);\n    border: 1px solid var(--confirmation-dialog-border-color);\n    border-radius: 0.75em;\n    box-shadow: 0 0.625em 1.5625em var(--confirmation-dialog-shadow-color);\n}\n.confirmation-content {\n    padding: 1.5em;\n  }\n.confirmation-title {\n  margin-bottom: 0.5rem;\n  font-weight: 600;\n    color: var(--confirmation-title-color);\n    font-size: var(--confirmation-title-font-size);\n}\n.confirmation-message {\n  margin-bottom: 1rem;\n    color: var(--confirmation-message-color);\n    font-size: var(--confirmation-message-font-size);\n}\n.confirmation-buttons {\n  display: flex;\n  justify-content: flex-end;\n    gap: 0.75em;\n}\n.confirmation-button {\n  border-radius: 0.375rem;\n  font-weight: 500;\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 200ms;\n    padding: 0.5em 1em;\n}\n.confirmation-button-cancel {\n    background-color: var(--confirmation-button-cancel-bg-color);\n    color: var(--confirmation-button-cancel-text-color);\n  }\n.confirmation-button-cancel:hover {\n    background-color: var(--confirmation-button-cancel-bg-hover-color);\n  }\n.confirmation-button-confirm {\n    background-color: var(--confirmation-button-confirm-bg-color);\n    color: var(--confirmation-button-confirm-text-color);\n  }\n.confirmation-button-confirm:hover {\n    background-color: var(--confirmation-button-confirm-bg-hover-color);\n  }\n.\\!visible {\n  visibility: visible !important;\n}\n.visible {\n  visibility: visible;\n}\n.static {\n  position: static;\n}\n.relative {\n  position: relative;\n}\n.flex {\n  display: flex;\n}\n.table {\n  display: table;\n}\n.hidden {\n  display: none;\n}\n.w-full {\n  width: 100%;\n}\n.transform {\n  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.resize {\n  resize: both;\n}\n.items-center {\n  align-items: center;\n}\n.justify-center {\n  justify-content: center;\n}\n.gap-\\[0\\.5em\\] {\n  gap: 0.5em;\n}\n.space-y-\\[0\\.25em\\] > :not([hidden]) ~ :not([hidden]) {\n  --tw-space-y-reverse: 0;\n  margin-top: calc(0.25em * calc(1 - var(--tw-space-y-reverse)));\n  margin-bottom: calc(0.25em * var(--tw-space-y-reverse));\n}\n.border {\n  border-width: 1px;\n}\n.py-\\[2px\\] {\n  padding-top: 2px;\n  padding-bottom: 2px;\n}\n.text-\\[0\\.8em\\] {\n  font-size: 0.8em;\n}\n.font-light {\n  font-weight: 300;\n}\n.text-slate-500 {\n  --tw-text-opacity: 1;\n  color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\n.underline {\n  text-decoration-line: underline;\n}\n.shadow {\n  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.filter {\n  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n:host {\n  /**\n    * @prop --chat-z-index: Z-index for chat widget (50)\n    *\n    * @prop --button-background-color: Button background color (#ffffff)\n    * @prop --button-background-color-hover: Button background color on hover (#f3f4f6)\n    * @prop --button-text-color: Button text color (#111827)\n    * @prop --button-text-color-hover: Button text color on hover (#1d4ed8)\n    * @prop --button-border-color: Button border color (#6b7280)\n    * @prop --button-border-color-hover: Button border color on hover (#374151)\n    * @prop --button-font-size: Button text font size (0.875em)\n    * @prop --button-icon-size: Button icon size (1.5em)\n    *\n    * @prop --chat-window-height: Chat window height in pixels or percent (60%)\n    * @prop --chat-window-width: Chat window width in pixels or percent (25%)\n    * @prop --chat-window-fullscreen-width: Chat window fullscreen width in pixels or percent (80%)\n    * @prop --chat-window-bg-color: Chat window background color (#ffffff)\n    * @prop --chat-window-border-color: Chat window border color (#d1d5db)\n    * @prop --chat-window-shadow-color: Chat window shadow color (rgba(0, 0, 0, 0.1))\n    * @prop --chat-window-font-size: Default font size for text in the chat window (0.875em)\n    * @prop --chat-window-font-size-sm: Font size for small text in the chat window (0.75em)\n    *\n    * @prop --header-bg-color: Header background color (transparent)\n    * @prop --header-bg-hover-color: Header background color on hover (#f9fafb)\n    * @prop --header-border-color: Header border color (#f3f4f6)\n    * @prop --header-button-text-color: Header button text color (#6b7280)\n    * @prop --header-button-bg-hover-color: Header button background on hover (#f3f4f6)\n    * @prop --header-font-size: Header font size (1em)\n    * @prop --header-button-icon-size: Icon size for buttons in the header (1.5em)\n    * @prop --header-text-font-size: Font size for the text in the header (1em)\n    * @prop --header-text-color: Color for the text in the header (#525762)\n    *\n    * @prop --starter-question-bg-color: Starter question background color (transparent)\n    * @prop --starter-question-bg-hover-color: Starter question background on hover (#eff6ff)\n    * @prop --starter-question-text-color: Starter question text color (#3b82f6)\n    * @prop --starter-question-border-color: Starter question border color (#3b82f6)\n    * @prop --starter-question-border-hover-color: Starter question border on hover (#2563eb)\n    *\n    * @prop --message-user-bg-color: User message background color (#e4edfb)\n    * @prop --message-user-text-color: User message text color (#1f2937)\n    * @prop --message-user-link-color: User message link color (#155dfc)\n\n    * @prop --message-assistant-bg-color: Assistant message background color (#eae7e8)\n    * @prop --message-assistant-text-color: Assistant message text color (--message-user-text-color)\n    * @prop --message-assistant-link-color: Assistant message link color (--message-user-link-color)\n\n    * @prop --message-system-bg-color: System message background color (#fbe4f8)\n    * @prop --message-system-text-color: System message text color (--message-user-text-color)\n    * @prop --message-system-link-color: System message link color (--message-user-link-color)\n\n    * @prop --message-timestamp-color: User message timestamp color (rgba(255, 255, 255, 0.7))\n    * @prop --message-timestamp-assistant-color: Assistant message timestamp color (rgba(75, 85, 99, 0.7))\n    *\n    * @prop --input-bg-color: Input area background color (transparent)\n    * @prop --input-border-color: Input field border color (#d1d5db)\n    * @prop --input-text-color: Input text color (#111827)\n    * @prop --input-placeholder-color: Input placeholder text color (#6b7280)\n    * @prop --input-outline-focus-color: Input field focus ring color (#3b82f6)\n    *\n    * @prop --send-button-bg-color: Send button background color (#3b82f6)\n    * @prop --send-button-bg-hover-color: Send button background on hover (#2563eb)\n    * @prop --send-button-text-color: Send button text color (#ffffff)\n    * @prop --send-button-bg-disabled-color: Send button background when disabled (#d1d5db)\n    * @prop --send-button-text-disabled-color: Send button text when disabled (#6b7280)\n    *\n    * @prop --loading-text-color: Loading text color (#6b7280)\n    * @prop --loading-spinner-track-color: Loading spinner track color (#e5e7eb)\n    * @prop --loading-spinner-fill-color: Loading spinner fill color (#3b82f6)\n    * @prop --loading-spinner-size: Loading spinner size (1.25em)\n    *\n    * @prop --typing-progress-bg-color: Typing progress bar background color (#ade3ff)\n    *\n    * @prop --scrollbar-track-color: Scrollbar track color (#f3f4f6)\n    * @prop --scrollbar-thumb-color: Scrollbar thumb color (#d1d5db)\n    * @prop --scrollbar-thumb-hover-color: Scrollbar thumb hover color (#9ca3af)\n    *\n    * @prop --error-text-color: Error text color (#ef4444)\n    * @prop --success-text-color: Success text color (#10b981)\n    *\n    * @prop --code-bg-user-color: Code background in user messages (--message-user-bg-color + 20% white)\n    * @prop --code-text-user-color: Code text color in user messages (--message-user-text-color)\n    * @prop --code-border-user-color: Code border in user messages (--message-user-bg-color + 20% black)\n    * @prop --code-bg-assistant-color: Code background in assistant messages (--message-assistant-bg-color + 50% white)\n    * @prop --code-text-assistant-color: Code text color in assistant messages (--message-assistant-text-color)\n    * @prop --code-border-assistant-color: Code border in assistant messages (--message-assistant-bg-color + 10% black)\n    *\n    * @prop --confirmation-overlay-bg-color: Confirmation dialog overlay background color (rgba(0, 0, 0, 0.5))\n    * @prop --confirmation-dialog-bg-color: Confirmation dialog background color (uses --chat-window-bg-color)\n    * @prop --confirmation-dialog-border-color: Confirmation dialog border color (uses --chat-window-border-color)\n    * @prop --confirmation-dialog-shadow-color: Confirmation dialog shadow color (uses --chat-window-shadow-color)\n    * @prop --confirmation-title-color: Confirmation dialog title text color (uses #111827)\n    * @prop --confirmation-title-font-size: Confirmation dialog title font size (1.125em)\n    * @prop --confirmation-message-color: Confirmation dialog message text color (uses --loading-text-color)\n    * @prop --confirmation-message-font-size: Confirmation dialog message font size (uses 1em)\n    * @prop --confirmation-button-cancel-bg-color: Cancel button background color (uses --button-background-color-hover)\n    * @prop --confirmation-button-cancel-bg-hover-color: Cancel button background on hover (uses #e5e7eb)\n    * @prop --confirmation-button-cancel-text-color: Cancel button text color (uses --header-button-text-color)\n    * @prop --confirmation-button-confirm-bg-color: Confirm button background color (uses --error-text-color)\n    * @prop --confirmation-button-confirm-bg-hover-color: Confirm button background on hover (uses --error-text-color)\n    * @prop --confirmation-button-confirm-text-color: Confirm button text color (uses --send-button-text-color)\n    * @prop --file-attachment-button-bg-color: Attach file button background color (transparent)\n    * @prop --file-attachment-button-bg-hover-color: Attach file button background hover color (--header-button-bg-hover-color)\n    * @prop --file-attachment-button-text-color: Attach file button text color (--header-button-text-color)\n    * @prop --file-attachment-button-text-disabled-color: Attach file button disabled text color (--send-button-text-disabled-color)\n    *\n    * @prop --selected-files-bg-color: Selected files container background color (--chat-window-bg-color)\n    * @prop --selected-files-border-color: Selected files container border color (--header-border-color)\n    *\n    * @prop --selected-file-bg-color: Selected file item background color (--message-system-bg-color)\n    * @prop --selected-file-font-size: Selected file item font size (--chat-window-font-size-sm)\n    * @prop --selected-file-name-color: Selected file name color (--message-assistant-text-color)\n    * @prop --selected-file-size-color: Selected file size display color (--input-placeholder-color)\n    * @prop --selected-file-icon-size: Selected file item icon size (1.25em)\n    * @prop --selected-file-remove-icon-color: Selected file remove icon color (--error-text-color)\n    * @prop --selected-file-remove-icon-hover-color: Selected file remove icon hover (#dc2626)\n    *\n    * @prop --message-attachment-icon-size: Message attachment icon size (1em)\n    */\n  /* Global variables */\n  --chat-z-index: 50;\n\n  /* Button variables */\n  --button-background-color: #ffffff;\n  --button-background-color-hover: #f3f4f6;\n  --button-text-color: #111827;\n  --button-text-color-hover: #1d4ed8;\n  --button-border-color: #d1d5db;\n  --button-border-color-hover: #6b7280;\n  --button-font-size: 1em; /* text-sm */\n  --button-icon-size: 1.5em;\n\n  /* Chat window variables */\n  --chat-window-height: 60%;\n  --chat-window-width: 25%;\n  --chat-window-fullscreen-width: 80%;\n  --chat-window-bg-color: #ffffff;\n  --chat-window-border-color: #d1d5db;\n  --chat-window-shadow-color: rgba(0, 0, 0, 0.1);\n  --chat-window-font-size: 0.875em; /* text-sm */\n  --chat-window-font-size-sm: 0.75em; /* text-xs */\n\n  /* Header variables */\n  --header-bg-color: transparent;\n  --header-bg-hover-color: #f9fafb;\n  --header-border-color: #f3f4f6;\n  --header-button-text-color: #6b7280;\n  --header-button-bg-hover-color: #f3f4f6;\n  --header-font-size: 1em;\n  --header-text-font-size: 1em;\n  --header-text-color: #525762;\n  --header-button-icon-size: 1.5em;\n\n  /* Starter question variables */\n  --starter-question-bg-color: transparent;\n  --starter-question-bg-hover-color: #eff6ff;\n  --starter-question-text-color: #3b82f6;\n  --starter-question-border-color: #3b82f6;\n  --starter-question-border-hover-color: #2563eb;\n\n  /* Message bubble variables */\n  --message-user-bg-color: #e4edfb;\n  --message-user-text-color: #1f2937;\n  --message-user-link-color: #155dfc;\n\n  --message-assistant-bg-color: #eae7e8;\n  --message-assistant-text-color: var(--message-user-text-color);\n  --message-assistant-link-color: var(--message-user-link-color);\n\n  --message-system-bg-color: #fbe4f8;\n  --message-system-text-color: var(--message-user-text-color);\n  --message-system-link-color: var(--message-user-link-color);\n\n  --message-timestamp-color: rgba(255, 255, 255, 0.7);\n  --message-timestamp-assistant-color: rgba(75, 85, 99, 0.7);\n\n  /* Input area variables */\n  --input-bg-color: transparent;\n  --input-border-color: #d1d5db;\n  --input-text-color: #111827;\n  --input-placeholder-color: #6b7280;\n  --input-outline-focus-color: #3b82f6;\n\n  /* Send button variables */\n  --send-button-bg-color: #3b82f6;\n  --send-button-bg-hover-color: #2563eb;\n  --send-button-text-color: #ffffff;\n  --send-button-bg-disabled-color: #d1d5db;\n  --send-button-text-disabled-color: #6b7280;\n\n  /* Loading variables */\n  --loading-text-color: #6b7280;\n  --loading-spinner-track-color: #e5e7eb;\n  --loading-spinner-fill-color: #3b82f6;\n  --loading-spinner-size: 1.25em;\n\n  /* Typing indicator variables */\n  --typing-progress-bg-color: #ade3ff;\n\n  /* Scrollbar variables */\n  --scrollbar-track-color: #f3f4f6;\n  --scrollbar-thumb-color: #d1d5db;\n  --scrollbar-thumb-hover-color: #9ca3af;\n\n  /* Error variables */\n  --error-text-color: #ef4444;\n  --success-text-color: #10b981; /* Complementary green to existing blue palette */;\n\n  /* Markdown code variables */\n  --code-bg-user-color: color-mix(in srgb, var(--message-user-bg-color) 80%, white 20%);\n  --code-text-user-color: var(--message-user-text-color);\n  --code-border-user-color: color-mix(in srgb, var(--message-user-bg-color) 90%, black 10%);\n  --code-bg-assistant-color: color-mix(in srgb, var(--message-assistant-bg-color) 50%, white 50%);\n  --code-text-assistant-color: var(--message-assistant-text-color);\n  --code-border-assistant-color: color-mix(in srgb, var(--message-assistant-bg-color) 90%, black 10%);;\n\n  --confirmation-overlay-bg-color: rgba(0, 0, 0, 0.5);\n  --confirmation-dialog-bg-color: var(--chat-window-bg-color);\n  --confirmation-dialog-border-color: var(--chat-window-border-color);\n  --confirmation-dialog-shadow-color: var(--chat-window-shadow-color);\n  --confirmation-title-color: #111827;\n  --confirmation-title-font-size: 1.125em;\n  --confirmation-message-color: var(--loading-text-color);\n  --confirmation-message-font-size: 1em;\n  --confirmation-button-cancel-bg-color: var(--button-background-color-hover);\n  --confirmation-button-cancel-bg-hover-color: #e5e7eb;\n  --confirmation-button-cancel-text-color: var(--header-button-text-color);\n  --confirmation-button-confirm-bg-color: var(--error-text-color);\n  --confirmation-button-confirm-bg-hover-color: var(--error-text-color);\n  --confirmation-button-confirm-text-color: var(--send-button-text-color);\n\n  /* File upload variables */\n  --file-attachment-button-bg-color: transparent;\n  --file-attachment-button-bg-hover-color: var(--header-button-bg-hover-color); /* #f3f4f6 */\n  --file-attachment-button-text-color: var(--header-button-text-color); /* #6b7280 */\n  --file-attachment-button-text-disabled-color: var(--send-button-text-disabled-color); /* #6b7280 */\n\n  /* Selected files variables */\n  --selected-files-bg-color: var(--chat-window-bg-color); /* transparent */\n  --selected-files-border-color: var(--header-border-color); /* #f3f4f6 */\n\n  /* Selected file item variables */\n  --selected-file-bg-color: var(--message-system-bg-color); /* #f3f4f6 */\n\n  /* Selected file text variables */\n  --selected-file-font-size: var(--chat-window-font-size-sm);\n  --selected-file-name-color: var(--message-assistant-text-color); /* #1f2937 */\n  --selected-file-size-color: var(--input-placeholder-color); /* #6b7280 */\n\n  /* Selected file icon variables */\n  --selected-file-icon-size: 1.25em;\n  --selected-file-remove-icon-color: var(--error-text-color); /* #ef4444 */\n  --selected-file-remove-icon-hover-color: #dc2626; /* Darker red for hover */\n\n  /* Message attachment variables */\n  --message-attachment-icon-size: 1em;\n\n  display: block;\n  position: fixed;\n  right: 30px;\n  bottom: 30px;\n}\ntextarea {\n  max-height: 8rem;\n  min-height: 2.5rem;\n  resize: none;\n  overflow-y: auto;\n}\ntextarea::-webkit-scrollbar {\n  width: 0.375rem;\n}\ntextarea::-webkit-scrollbar-track {\n  border-radius: 0.25rem;\n  background-color: var(--scrollbar-track-color);\n}\ntextarea::-webkit-scrollbar-thumb {\n  border-radius: 0.25rem;\n  background-color: var(--scrollbar-thumb-color);\n}\ntextarea::-webkit-scrollbar-thumb:hover {\n  background-color: var(--scrollbar-thumb-hover-color);\n}\n@keyframes spin {\n\n  to {\n    transform: rotate(360deg);\n  }\n}\n.loading-spinner {\n  animation: spin 1s linear infinite;\n  border-radius: 9999px;\n  border-width: 2px;\n  border-color: var(--loading-spinner-track-color);\n  border-top-color: var(--loading-spinner-fill-color);\n  width: var(--loading-spinner-size);\n  height: var(--loading-spinner-size);\n}\n.overflow-y-auto::-webkit-scrollbar {\n  width: 0.375rem;\n}\n.overflow-y-auto::-webkit-scrollbar-track {\n  border-radius: 0.25rem;\n  background-color: var(--scrollbar-track-color);\n}\n.overflow-y-auto::-webkit-scrollbar-thumb {\n  border-radius: 0.25rem;\n  background-color: var(--scrollbar-thumb-color);\n}\n.overflow-y-auto::-webkit-scrollbar-thumb:hover {\n  background-color: var(--scrollbar-thumb-hover-color);\n}\n/* Markdown content styling for chat messages */\n.chat-markdown {\n  color: var(--tw-prose-body);\n  max-width: 65ch;\n}\n.chat-markdown :where(p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n}\n.chat-markdown :where([class~=\"lead\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-lead);\n  font-size: 1.25em;\n  line-height: 1.6;\n  margin-top: 1.2em;\n  margin-bottom: 1.2em;\n}\n.chat-markdown :where(a):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-links);\n  text-decoration: underline;\n  font-weight: 500;\n}\n.chat-markdown :where(strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-bold);\n  font-weight: 600;\n}\n.chat-markdown :where(a strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(blockquote strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(thead th strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: decimal;\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n  padding-inline-start: 1.625em;\n}\n.chat-markdown :where(ol[type=\"A\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-alpha;\n}\n.chat-markdown :where(ol[type=\"a\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-alpha;\n}\n.chat-markdown :where(ol[type=\"A\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-alpha;\n}\n.chat-markdown :where(ol[type=\"a\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-alpha;\n}\n.chat-markdown :where(ol[type=\"I\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-roman;\n}\n.chat-markdown :where(ol[type=\"i\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-roman;\n}\n.chat-markdown :where(ol[type=\"I\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-roman;\n}\n.chat-markdown :where(ol[type=\"i\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-roman;\n}\n.chat-markdown :where(ol[type=\"1\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: decimal;\n}\n.chat-markdown :where(ul):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: disc;\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n  padding-inline-start: 1.625em;\n}\n.chat-markdown :where(ol > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::marker {\n  font-weight: 400;\n  color: var(--tw-prose-counters);\n}\n.chat-markdown :where(ul > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::marker {\n  color: var(--tw-prose-bullets);\n}\n.chat-markdown :where(dt):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  margin-top: 1.25em;\n}\n.chat-markdown :where(hr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-color: var(--tw-prose-hr);\n  border-top-width: 1px;\n  margin-top: 3em;\n  margin-bottom: 3em;\n}\n.chat-markdown :where(blockquote):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 500;\n  font-style: italic;\n  color: var(--tw-prose-quotes);\n  border-inline-start-width: 0.25rem;\n  border-inline-start-color: var(--tw-prose-quote-borders);\n  quotes: \"\\201C\"\"\\201D\"\"\\2018\"\"\\2019\";\n  margin-top: 1.6em;\n  margin-bottom: 1.6em;\n  padding-inline-start: 1em;\n}\n.chat-markdown :where(blockquote p:first-of-type):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before {\n  content: open-quote;\n}\n.chat-markdown :where(blockquote p:last-of-type):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after {\n  content: close-quote;\n}\n.chat-markdown :where(h1):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 800;\n  font-size: 2.25em;\n  margin-top: 0;\n  margin-bottom: 0.8888889em;\n  line-height: 1.1111111;\n}\n.chat-markdown :where(h1 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 900;\n  color: inherit;\n}\n.chat-markdown :where(h2):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 700;\n  font-size: 1.5em;\n  margin-top: 2em;\n  margin-bottom: 1em;\n  line-height: 1.3333333;\n}\n.chat-markdown :where(h2 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 800;\n  color: inherit;\n}\n.chat-markdown :where(h3):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  font-size: 1.25em;\n  margin-top: 1.6em;\n  margin-bottom: 0.6em;\n  line-height: 1.6;\n}\n.chat-markdown :where(h3 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 700;\n  color: inherit;\n}\n.chat-markdown :where(h4):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  margin-top: 1.5em;\n  margin-bottom: 0.5em;\n  line-height: 1.5;\n}\n.chat-markdown :where(h4 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 700;\n  color: inherit;\n}\n.chat-markdown :where(img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.chat-markdown :where(picture):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  display: block;\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.chat-markdown :where(video):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.chat-markdown :where(kbd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 500;\n  font-family: inherit;\n  color: var(--tw-prose-kbd);\n  box-shadow: 0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%), 0 3px 0 rgb(var(--tw-prose-kbd-shadows) / 10%);\n  font-size: 0.875em;\n  border-radius: 0.3125rem;\n  padding-top: 0.1875em;\n  padding-inline-end: 0.375em;\n  padding-bottom: 0.1875em;\n  padding-inline-start: 0.375em;\n}\n.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-code);\n  font-weight: 600;\n  font-size: 0.875em;\n}\n.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before {\n  content: \"`\";\n}\n.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after {\n  content: \"`\";\n}\n.chat-markdown :where(a code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(h1 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(h2 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n  font-size: 0.875em;\n}\n.chat-markdown :where(h3 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n  font-size: 0.9em;\n}\n.chat-markdown :where(h4 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(blockquote code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(thead th code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.chat-markdown :where(pre):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-pre-code);\n  background-color: var(--tw-prose-pre-bg);\n  overflow-x: auto;\n  font-weight: 400;\n  font-size: 0.875em;\n  line-height: 1.7142857;\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n  border-radius: 0.375rem;\n  padding-top: 0.8571429em;\n  padding-inline-end: 1.1428571em;\n  padding-bottom: 0.8571429em;\n  padding-inline-start: 1.1428571em;\n}\n.chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  background-color: transparent;\n  border-width: 0;\n  border-radius: 0;\n  padding: 0;\n  font-weight: inherit;\n  color: inherit;\n  font-size: inherit;\n  font-family: inherit;\n  line-height: inherit;\n}\n.chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before {\n  content: none;\n}\n.chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after {\n  content: none;\n}\n.chat-markdown :where(table):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  width: 100%;\n  table-layout: auto;\n  margin-top: 2em;\n  margin-bottom: 2em;\n  font-size: 0.875em;\n  line-height: 1.7142857;\n}\n.chat-markdown :where(thead):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-bottom-width: 1px;\n  border-bottom-color: var(--tw-prose-th-borders);\n}\n.chat-markdown :where(thead th):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  vertical-align: bottom;\n  padding-inline-end: 0.5714286em;\n  padding-bottom: 0.5714286em;\n  padding-inline-start: 0.5714286em;\n}\n.chat-markdown :where(tbody tr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-bottom-width: 1px;\n  border-bottom-color: var(--tw-prose-td-borders);\n}\n.chat-markdown :where(tbody tr:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-bottom-width: 0;\n}\n.chat-markdown :where(tbody td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  vertical-align: baseline;\n}\n.chat-markdown :where(tfoot):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-top-width: 1px;\n  border-top-color: var(--tw-prose-th-borders);\n}\n.chat-markdown :where(tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  vertical-align: top;\n}\n.chat-markdown :where(th, td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  text-align: start;\n}\n.chat-markdown :where(figure > *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.chat-markdown :where(figcaption):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-captions);\n  font-size: 0.875em;\n  line-height: 1.4285714;\n  margin-top: 0.8571429em;\n}\n.chat-markdown {\n  --tw-prose-body: #374151;\n  --tw-prose-headings: #111827;\n  --tw-prose-lead: #4b5563;\n  --tw-prose-links: #111827;\n  --tw-prose-bold: #111827;\n  --tw-prose-counters: #6b7280;\n  --tw-prose-bullets: #d1d5db;\n  --tw-prose-hr: #e5e7eb;\n  --tw-prose-quotes: #111827;\n  --tw-prose-quote-borders: #e5e7eb;\n  --tw-prose-captions: #6b7280;\n  --tw-prose-kbd: #111827;\n  --tw-prose-kbd-shadows: 17 24 39;\n  --tw-prose-code: #111827;\n  --tw-prose-pre-code: #e5e7eb;\n  --tw-prose-pre-bg: #1f2937;\n  --tw-prose-th-borders: #d1d5db;\n  --tw-prose-td-borders: #e5e7eb;\n  --tw-prose-invert-body: #d1d5db;\n  --tw-prose-invert-headings: #fff;\n  --tw-prose-invert-lead: #9ca3af;\n  --tw-prose-invert-links: #fff;\n  --tw-prose-invert-bold: #fff;\n  --tw-prose-invert-counters: #9ca3af;\n  --tw-prose-invert-bullets: #4b5563;\n  --tw-prose-invert-hr: #374151;\n  --tw-prose-invert-quotes: #f3f4f6;\n  --tw-prose-invert-quote-borders: #374151;\n  --tw-prose-invert-captions: #9ca3af;\n  --tw-prose-invert-kbd: #fff;\n  --tw-prose-invert-kbd-shadows: 255 255 255;\n  --tw-prose-invert-code: #fff;\n  --tw-prose-invert-pre-code: #d1d5db;\n  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n  --tw-prose-invert-th-borders: #4b5563;\n  --tw-prose-invert-td-borders: #374151;\n  font-size: 1rem;\n  line-height: 1.75;\n}\n.chat-markdown :where(picture > img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.chat-markdown :where(li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5em;\n  margin-bottom: 0.5em;\n}\n.chat-markdown :where(ol > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.375em;\n}\n.chat-markdown :where(ul > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.375em;\n}\n.chat-markdown :where(.prose > ul > li p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.75em;\n  margin-bottom: 0.75em;\n}\n.chat-markdown :where(.prose > ul > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n}\n.chat-markdown :where(.prose > ul > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.25em;\n}\n.chat-markdown :where(.prose > ol > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n}\n.chat-markdown :where(.prose > ol > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.25em;\n}\n.chat-markdown :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.75em;\n  margin-bottom: 0.75em;\n}\n.chat-markdown :where(dl):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n}\n.chat-markdown :where(dd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5em;\n  padding-inline-start: 1.625em;\n}\n.chat-markdown :where(hr + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(h2 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(h3 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(h4 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(thead th:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.chat-markdown :where(thead th:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.chat-markdown :where(tbody td, tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-top: 0.5714286em;\n  padding-inline-end: 0.5714286em;\n  padding-bottom: 0.5714286em;\n  padding-inline-start: 0.5714286em;\n}\n.chat-markdown :where(tbody td:first-child, tfoot td:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.chat-markdown :where(tbody td:last-child, tfoot td:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.chat-markdown :where(figure):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.chat-markdown :where(.prose > :first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(.prose > :last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 0;\n}\n.chat-markdown {\n  font-size: 0.875rem;\n  line-height: 1.7142857;\n}\n.chat-markdown :where(p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n}\n.chat-markdown :where([class~=\"lead\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 1.2857143em;\n  line-height: 1.5555556;\n  margin-top: 0.8888889em;\n  margin-bottom: 0.8888889em;\n}\n.chat-markdown :where(blockquote):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.3333333em;\n  margin-bottom: 1.3333333em;\n  padding-inline-start: 1.1111111em;\n}\n.chat-markdown :where(h1):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 2.1428571em;\n  margin-top: 0;\n  margin-bottom: 0.8em;\n  line-height: 1.2;\n}\n.chat-markdown :where(h2):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 1.4285714em;\n  margin-top: 1.6em;\n  margin-bottom: 0.8em;\n  line-height: 1.4;\n}\n.chat-markdown :where(h3):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 1.2857143em;\n  margin-top: 1.5555556em;\n  margin-bottom: 0.4444444em;\n  line-height: 1.5555556;\n}\n.chat-markdown :where(h4):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.4285714em;\n  margin-bottom: 0.5714286em;\n  line-height: 1.4285714;\n}\n.chat-markdown :where(img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.chat-markdown :where(picture):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.chat-markdown :where(picture > img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.chat-markdown :where(video):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.chat-markdown :where(kbd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  border-radius: 0.3125rem;\n  padding-top: 0.1428571em;\n  padding-inline-end: 0.3571429em;\n  padding-bottom: 0.1428571em;\n  padding-inline-start: 0.3571429em;\n}\n.chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n}\n.chat-markdown :where(h2 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.9em;\n}\n.chat-markdown :where(h3 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8888889em;\n}\n.chat-markdown :where(pre):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  line-height: 1.6666667;\n  margin-top: 1.6666667em;\n  margin-bottom: 1.6666667em;\n  border-radius: 0.25rem;\n  padding-top: 0.6666667em;\n  padding-inline-end: 1em;\n  padding-bottom: 0.6666667em;\n  padding-inline-start: 1em;\n}\n.chat-markdown :where(ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n  padding-inline-start: 1.5714286em;\n}\n.chat-markdown :where(ul):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n  padding-inline-start: 1.5714286em;\n}\n.chat-markdown :where(li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.2857143em;\n  margin-bottom: 0.2857143em;\n}\n.chat-markdown :where(ol > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.4285714em;\n}\n.chat-markdown :where(ul > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.4285714em;\n}\n.chat-markdown :where(.prose-sm > ul > li p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5714286em;\n  margin-bottom: 0.5714286em;\n}\n.chat-markdown :where(.prose-sm > ul > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n}\n.chat-markdown :where(.prose-sm > ul > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.1428571em;\n}\n.chat-markdown :where(.prose-sm > ol > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n}\n.chat-markdown :where(.prose-sm > ol > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.1428571em;\n}\n.chat-markdown :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5714286em;\n  margin-bottom: 0.5714286em;\n}\n.chat-markdown :where(dl):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n}\n.chat-markdown :where(dt):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n}\n.chat-markdown :where(dd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.2857143em;\n  padding-inline-start: 1.5714286em;\n}\n.chat-markdown :where(hr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2.8571429em;\n  margin-bottom: 2.8571429em;\n}\n.chat-markdown :where(hr + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(h2 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(h3 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(h4 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(table):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  line-height: 1.5;\n}\n.chat-markdown :where(thead th):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 1em;\n  padding-bottom: 0.6666667em;\n  padding-inline-start: 1em;\n}\n.chat-markdown :where(thead th:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.chat-markdown :where(thead th:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.chat-markdown :where(tbody td, tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-top: 0.6666667em;\n  padding-inline-end: 1em;\n  padding-bottom: 0.6666667em;\n  padding-inline-start: 1em;\n}\n.chat-markdown :where(tbody td:first-child, tfoot td:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.chat-markdown :where(tbody td:last-child, tfoot td:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.chat-markdown :where(figure):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.chat-markdown :where(figure > *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.chat-markdown :where(figcaption):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  line-height: 1.3333333;\n  margin-top: 0.6666667em;\n}\n.chat-markdown :where(.prose-sm > :first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.chat-markdown :where(.prose-sm > :last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 0;\n}\n.chat-markdown {\n  --tw-prose-body: #374151;\n  --tw-prose-headings: #111827;\n  --tw-prose-lead: #4b5563;\n  --tw-prose-links: #111827;\n  --tw-prose-bold: #111827;\n  --tw-prose-counters: #6b7280;\n  --tw-prose-bullets: #d1d5db;\n  --tw-prose-hr: #e5e7eb;\n  --tw-prose-quotes: #111827;\n  --tw-prose-quote-borders: #e5e7eb;\n  --tw-prose-captions: #6b7280;\n  --tw-prose-kbd: #111827;\n  --tw-prose-kbd-shadows: 17 24 39;\n  --tw-prose-code: #111827;\n  --tw-prose-pre-code: #e5e7eb;\n  --tw-prose-pre-bg: #1f2937;\n  --tw-prose-th-borders: #d1d5db;\n  --tw-prose-td-borders: #e5e7eb;\n  --tw-prose-invert-body: #d1d5db;\n  --tw-prose-invert-headings: #fff;\n  --tw-prose-invert-lead: #9ca3af;\n  --tw-prose-invert-links: #fff;\n  --tw-prose-invert-bold: #fff;\n  --tw-prose-invert-counters: #9ca3af;\n  --tw-prose-invert-bullets: #4b5563;\n  --tw-prose-invert-hr: #374151;\n  --tw-prose-invert-quotes: #f3f4f6;\n  --tw-prose-invert-quote-borders: #374151;\n  --tw-prose-invert-captions: #9ca3af;\n  --tw-prose-invert-kbd: #fff;\n  --tw-prose-invert-kbd-shadows: 255 255 255;\n  --tw-prose-invert-code: #fff;\n  --tw-prose-invert-pre-code: #d1d5db;\n  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n  --tw-prose-invert-th-borders: #4b5563;\n  --tw-prose-invert-td-borders: #374151;\n  max-width: none;\n}\n.chat-markdown :is(:where(a):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))) {\n  text-decoration-line: none;\n}\n.chat-markdown :is(:where(a):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))):hover {\n  text-decoration-line: underline;\n}\n.chat-markdown {\n  font-size: 1em;\n}\n/* override spacing */\n.chat-markdown > * {\n  margin-top: 0.1em;\n  margin-bottom: 0.1em;\n}\n.message-bubble-assistant .chat-markdown {\n  color: var(--tw-prose-body);\n  max-width: 65ch;\n}\n.message-bubble-assistant .chat-markdown :where(p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n}\n.message-bubble-assistant .chat-markdown :where([class~=\"lead\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-lead);\n  font-size: 1.25em;\n  line-height: 1.6;\n  margin-top: 1.2em;\n  margin-bottom: 1.2em;\n}\n.message-bubble-assistant .chat-markdown :where(a):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-links);\n  text-decoration: underline;\n  font-weight: 500;\n}\n.message-bubble-assistant .chat-markdown :where(strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-bold);\n  font-weight: 600;\n}\n.message-bubble-assistant .chat-markdown :where(a strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(blockquote strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(thead th strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: decimal;\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n  padding-inline-start: 1.625em;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"A\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-alpha;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"a\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-alpha;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"A\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-alpha;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"a\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-alpha;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"I\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-roman;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"i\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-roman;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"I\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: upper-roman;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"i\" s]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: lower-roman;\n}\n.message-bubble-assistant .chat-markdown :where(ol[type=\"1\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: decimal;\n}\n.message-bubble-assistant .chat-markdown :where(ul):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  list-style-type: disc;\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n  padding-inline-start: 1.625em;\n}\n.message-bubble-assistant .chat-markdown :where(ol > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::marker {\n  font-weight: 400;\n  color: var(--tw-prose-counters);\n}\n.message-bubble-assistant .chat-markdown :where(ul > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::marker {\n  color: var(--tw-prose-bullets);\n}\n.message-bubble-assistant .chat-markdown :where(dt):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  margin-top: 1.25em;\n}\n.message-bubble-assistant .chat-markdown :where(hr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-color: var(--tw-prose-hr);\n  border-top-width: 1px;\n  margin-top: 3em;\n  margin-bottom: 3em;\n}\n.message-bubble-assistant .chat-markdown :where(blockquote):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 500;\n  font-style: italic;\n  color: var(--tw-prose-quotes);\n  border-inline-start-width: 0.25rem;\n  border-inline-start-color: var(--tw-prose-quote-borders);\n  quotes: \"\\201C\"\"\\201D\"\"\\2018\"\"\\2019\";\n  margin-top: 1.6em;\n  margin-bottom: 1.6em;\n  padding-inline-start: 1em;\n}\n.message-bubble-assistant .chat-markdown :where(blockquote p:first-of-type):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before {\n  content: open-quote;\n}\n.message-bubble-assistant .chat-markdown :where(blockquote p:last-of-type):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after {\n  content: close-quote;\n}\n.message-bubble-assistant .chat-markdown :where(h1):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 800;\n  font-size: 2.25em;\n  margin-top: 0;\n  margin-bottom: 0.8888889em;\n  line-height: 1.1111111;\n}\n.message-bubble-assistant .chat-markdown :where(h1 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 900;\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(h2):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 700;\n  font-size: 1.5em;\n  margin-top: 2em;\n  margin-bottom: 1em;\n  line-height: 1.3333333;\n}\n.message-bubble-assistant .chat-markdown :where(h2 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 800;\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(h3):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  font-size: 1.25em;\n  margin-top: 1.6em;\n  margin-bottom: 0.6em;\n  line-height: 1.6;\n}\n.message-bubble-assistant .chat-markdown :where(h3 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 700;\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(h4):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  margin-top: 1.5em;\n  margin-bottom: 0.5em;\n  line-height: 1.5;\n}\n.message-bubble-assistant .chat-markdown :where(h4 strong):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 700;\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.message-bubble-assistant .chat-markdown :where(picture):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  display: block;\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.message-bubble-assistant .chat-markdown :where(video):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.message-bubble-assistant .chat-markdown :where(kbd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-weight: 500;\n  font-family: inherit;\n  color: var(--tw-prose-kbd);\n  box-shadow: 0 0 0 1px rgb(var(--tw-prose-kbd-shadows) / 10%), 0 3px 0 rgb(var(--tw-prose-kbd-shadows) / 10%);\n  font-size: 0.875em;\n  border-radius: 0.3125rem;\n  padding-top: 0.1875em;\n  padding-inline-end: 0.375em;\n  padding-bottom: 0.1875em;\n  padding-inline-start: 0.375em;\n}\n.message-bubble-assistant .chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-code);\n  font-weight: 600;\n  font-size: 0.875em;\n}\n.message-bubble-assistant .chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before {\n  content: \"`\";\n}\n.message-bubble-assistant .chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after {\n  content: \"`\";\n}\n.message-bubble-assistant .chat-markdown :where(a code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(h1 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(h2 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n  font-size: 0.875em;\n}\n.message-bubble-assistant .chat-markdown :where(h3 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n  font-size: 0.9em;\n}\n.message-bubble-assistant .chat-markdown :where(h4 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(blockquote code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(thead th code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(pre):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-pre-code);\n  background-color: var(--tw-prose-pre-bg);\n  overflow-x: auto;\n  font-weight: 400;\n  font-size: 0.875em;\n  line-height: 1.7142857;\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n  border-radius: 0.375rem;\n  padding-top: 0.8571429em;\n  padding-inline-end: 1.1428571em;\n  padding-bottom: 0.8571429em;\n  padding-inline-start: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  background-color: transparent;\n  border-width: 0;\n  border-radius: 0;\n  padding: 0;\n  font-weight: inherit;\n  color: inherit;\n  font-size: inherit;\n  font-family: inherit;\n  line-height: inherit;\n}\n.message-bubble-assistant .chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::before {\n  content: none;\n}\n.message-bubble-assistant .chat-markdown :where(pre code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))::after {\n  content: none;\n}\n.message-bubble-assistant .chat-markdown :where(table):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  width: 100%;\n  table-layout: auto;\n  margin-top: 2em;\n  margin-bottom: 2em;\n  font-size: 0.875em;\n  line-height: 1.7142857;\n}\n.message-bubble-assistant .chat-markdown :where(thead):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-bottom-width: 1px;\n  border-bottom-color: var(--tw-prose-th-borders);\n}\n.message-bubble-assistant .chat-markdown :where(thead th):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-headings);\n  font-weight: 600;\n  vertical-align: bottom;\n  padding-inline-end: 0.5714286em;\n  padding-bottom: 0.5714286em;\n  padding-inline-start: 0.5714286em;\n}\n.message-bubble-assistant .chat-markdown :where(tbody tr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-bottom-width: 1px;\n  border-bottom-color: var(--tw-prose-td-borders);\n}\n.message-bubble-assistant .chat-markdown :where(tbody tr:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-bottom-width: 0;\n}\n.message-bubble-assistant .chat-markdown :where(tbody td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  vertical-align: baseline;\n}\n.message-bubble-assistant .chat-markdown :where(tfoot):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  border-top-width: 1px;\n  border-top-color: var(--tw-prose-th-borders);\n}\n.message-bubble-assistant .chat-markdown :where(tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  vertical-align: top;\n}\n.message-bubble-assistant .chat-markdown :where(th, td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  text-align: start;\n}\n.message-bubble-assistant .chat-markdown :where(figure > *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.message-bubble-assistant .chat-markdown :where(figcaption):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  color: var(--tw-prose-captions);\n  font-size: 0.875em;\n  line-height: 1.4285714;\n  margin-top: 0.8571429em;\n}\n.message-bubble-assistant .chat-markdown {\n  --tw-prose-body: #374151;\n  --tw-prose-headings: #111827;\n  --tw-prose-lead: #4b5563;\n  --tw-prose-links: #111827;\n  --tw-prose-bold: #111827;\n  --tw-prose-counters: #6b7280;\n  --tw-prose-bullets: #d1d5db;\n  --tw-prose-hr: #e5e7eb;\n  --tw-prose-quotes: #111827;\n  --tw-prose-quote-borders: #e5e7eb;\n  --tw-prose-captions: #6b7280;\n  --tw-prose-kbd: #111827;\n  --tw-prose-kbd-shadows: 17 24 39;\n  --tw-prose-code: #111827;\n  --tw-prose-pre-code: #e5e7eb;\n  --tw-prose-pre-bg: #1f2937;\n  --tw-prose-th-borders: #d1d5db;\n  --tw-prose-td-borders: #e5e7eb;\n  --tw-prose-invert-body: #d1d5db;\n  --tw-prose-invert-headings: #fff;\n  --tw-prose-invert-lead: #9ca3af;\n  --tw-prose-invert-links: #fff;\n  --tw-prose-invert-bold: #fff;\n  --tw-prose-invert-counters: #9ca3af;\n  --tw-prose-invert-bullets: #4b5563;\n  --tw-prose-invert-hr: #374151;\n  --tw-prose-invert-quotes: #f3f4f6;\n  --tw-prose-invert-quote-borders: #374151;\n  --tw-prose-invert-captions: #9ca3af;\n  --tw-prose-invert-kbd: #fff;\n  --tw-prose-invert-kbd-shadows: 255 255 255;\n  --tw-prose-invert-code: #fff;\n  --tw-prose-invert-pre-code: #d1d5db;\n  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n  --tw-prose-invert-th-borders: #4b5563;\n  --tw-prose-invert-td-borders: #374151;\n  font-size: 1rem;\n  line-height: 1.75;\n}\n.message-bubble-assistant .chat-markdown :where(picture > img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.message-bubble-assistant .chat-markdown :where(li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5em;\n  margin-bottom: 0.5em;\n}\n.message-bubble-assistant .chat-markdown :where(ol > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.375em;\n}\n.message-bubble-assistant .chat-markdown :where(ul > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.375em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose > ul > li p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.75em;\n  margin-bottom: 0.75em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose > ul > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose > ul > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.25em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose > ol > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose > ol > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.25em;\n}\n.message-bubble-assistant .chat-markdown :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.75em;\n  margin-bottom: 0.75em;\n}\n.message-bubble-assistant .chat-markdown :where(dl):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.25em;\n  margin-bottom: 1.25em;\n}\n.message-bubble-assistant .chat-markdown :where(dd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5em;\n  padding-inline-start: 1.625em;\n}\n.message-bubble-assistant .chat-markdown :where(hr + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(h2 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(h3 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(h4 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(thead th:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.message-bubble-assistant .chat-markdown :where(thead th:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.message-bubble-assistant .chat-markdown :where(tbody td, tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-top: 0.5714286em;\n  padding-inline-end: 0.5714286em;\n  padding-bottom: 0.5714286em;\n  padding-inline-start: 0.5714286em;\n}\n.message-bubble-assistant .chat-markdown :where(tbody td:first-child, tfoot td:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.message-bubble-assistant .chat-markdown :where(tbody td:last-child, tfoot td:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.message-bubble-assistant .chat-markdown :where(figure):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2em;\n  margin-bottom: 2em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose > :first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(.prose > :last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 0;\n}\n.message-bubble-assistant .chat-markdown {\n  font-size: 0.875rem;\n  line-height: 1.7142857;\n}\n.message-bubble-assistant .chat-markdown :where(p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where([class~=\"lead\"]):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 1.2857143em;\n  line-height: 1.5555556;\n  margin-top: 0.8888889em;\n  margin-bottom: 0.8888889em;\n}\n.message-bubble-assistant .chat-markdown :where(blockquote):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.3333333em;\n  margin-bottom: 1.3333333em;\n  padding-inline-start: 1.1111111em;\n}\n.message-bubble-assistant .chat-markdown :where(h1):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 2.1428571em;\n  margin-top: 0;\n  margin-bottom: 0.8em;\n  line-height: 1.2;\n}\n.message-bubble-assistant .chat-markdown :where(h2):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 1.4285714em;\n  margin-top: 1.6em;\n  margin-bottom: 0.8em;\n  line-height: 1.4;\n}\n.message-bubble-assistant .chat-markdown :where(h3):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 1.2857143em;\n  margin-top: 1.5555556em;\n  margin-bottom: 0.4444444em;\n  line-height: 1.5555556;\n}\n.message-bubble-assistant .chat-markdown :where(h4):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.4285714em;\n  margin-bottom: 0.5714286em;\n  line-height: 1.4285714;\n}\n.message-bubble-assistant .chat-markdown :where(img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.message-bubble-assistant .chat-markdown :where(picture):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.message-bubble-assistant .chat-markdown :where(picture > img):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.message-bubble-assistant .chat-markdown :where(video):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.message-bubble-assistant .chat-markdown :where(kbd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  border-radius: 0.3125rem;\n  padding-top: 0.1428571em;\n  padding-inline-end: 0.3571429em;\n  padding-bottom: 0.1428571em;\n  padding-inline-start: 0.3571429em;\n}\n.message-bubble-assistant .chat-markdown :where(code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n}\n.message-bubble-assistant .chat-markdown :where(h2 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.9em;\n}\n.message-bubble-assistant .chat-markdown :where(h3 code):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8888889em;\n}\n.message-bubble-assistant .chat-markdown :where(pre):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  line-height: 1.6666667;\n  margin-top: 1.6666667em;\n  margin-bottom: 1.6666667em;\n  border-radius: 0.25rem;\n  padding-top: 0.6666667em;\n  padding-inline-end: 1em;\n  padding-bottom: 0.6666667em;\n  padding-inline-start: 1em;\n}\n.message-bubble-assistant .chat-markdown :where(ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n  padding-inline-start: 1.5714286em;\n}\n.message-bubble-assistant .chat-markdown :where(ul):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n  padding-inline-start: 1.5714286em;\n}\n.message-bubble-assistant .chat-markdown :where(li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.2857143em;\n  margin-bottom: 0.2857143em;\n}\n.message-bubble-assistant .chat-markdown :where(ol > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.4285714em;\n}\n.message-bubble-assistant .chat-markdown :where(ul > li):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0.4285714em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose-sm > ul > li p):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5714286em;\n  margin-bottom: 0.5714286em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose-sm > ul > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose-sm > ul > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose-sm > ol > li > p:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose-sm > ol > li > p:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.5714286em;\n  margin-bottom: 0.5714286em;\n}\n.message-bubble-assistant .chat-markdown :where(dl):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n  margin-bottom: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where(dt):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.1428571em;\n}\n.message-bubble-assistant .chat-markdown :where(dd):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0.2857143em;\n  padding-inline-start: 1.5714286em;\n}\n.message-bubble-assistant .chat-markdown :where(hr):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 2.8571429em;\n  margin-bottom: 2.8571429em;\n}\n.message-bubble-assistant .chat-markdown :where(hr + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(h2 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(h3 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(h4 + *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(table):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  line-height: 1.5;\n}\n.message-bubble-assistant .chat-markdown :where(thead th):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 1em;\n  padding-bottom: 0.6666667em;\n  padding-inline-start: 1em;\n}\n.message-bubble-assistant .chat-markdown :where(thead th:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.message-bubble-assistant .chat-markdown :where(thead th:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.message-bubble-assistant .chat-markdown :where(tbody td, tfoot td):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-top: 0.6666667em;\n  padding-inline-end: 1em;\n  padding-bottom: 0.6666667em;\n  padding-inline-start: 1em;\n}\n.message-bubble-assistant .chat-markdown :where(tbody td:first-child, tfoot td:first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-start: 0;\n}\n.message-bubble-assistant .chat-markdown :where(tbody td:last-child, tfoot td:last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  padding-inline-end: 0;\n}\n.message-bubble-assistant .chat-markdown :where(figure):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 1.7142857em;\n  margin-bottom: 1.7142857em;\n}\n.message-bubble-assistant .chat-markdown :where(figure > *):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n  margin-bottom: 0;\n}\n.message-bubble-assistant .chat-markdown :where(figcaption):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  font-size: 0.8571429em;\n  line-height: 1.3333333;\n  margin-top: 0.6666667em;\n}\n.message-bubble-assistant .chat-markdown :where(.prose-sm > :first-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-top: 0;\n}\n.message-bubble-assistant .chat-markdown :where(.prose-sm > :last-child):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *)) {\n  margin-bottom: 0;\n}\n.message-bubble-assistant .chat-markdown {\n  --tw-prose-body: #374151;\n  --tw-prose-headings: #111827;\n  --tw-prose-lead: #4b5563;\n  --tw-prose-links: #111827;\n  --tw-prose-bold: #111827;\n  --tw-prose-counters: #6b7280;\n  --tw-prose-bullets: #d1d5db;\n  --tw-prose-hr: #e5e7eb;\n  --tw-prose-quotes: #111827;\n  --tw-prose-quote-borders: #e5e7eb;\n  --tw-prose-captions: #6b7280;\n  --tw-prose-kbd: #111827;\n  --tw-prose-kbd-shadows: 17 24 39;\n  --tw-prose-code: #111827;\n  --tw-prose-pre-code: #e5e7eb;\n  --tw-prose-pre-bg: #1f2937;\n  --tw-prose-th-borders: #d1d5db;\n  --tw-prose-td-borders: #e5e7eb;\n  --tw-prose-invert-body: #d1d5db;\n  --tw-prose-invert-headings: #fff;\n  --tw-prose-invert-lead: #9ca3af;\n  --tw-prose-invert-links: #fff;\n  --tw-prose-invert-bold: #fff;\n  --tw-prose-invert-counters: #9ca3af;\n  --tw-prose-invert-bullets: #4b5563;\n  --tw-prose-invert-hr: #374151;\n  --tw-prose-invert-quotes: #f3f4f6;\n  --tw-prose-invert-quote-borders: #374151;\n  --tw-prose-invert-captions: #9ca3af;\n  --tw-prose-invert-kbd: #fff;\n  --tw-prose-invert-kbd-shadows: 255 255 255;\n  --tw-prose-invert-code: #fff;\n  --tw-prose-invert-pre-code: #d1d5db;\n  --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n  --tw-prose-invert-th-borders: #4b5563;\n  --tw-prose-invert-td-borders: #374151;\n  max-width: none;\n}\n.message-bubble-assistant .chat-markdown :is(:where(a):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))) {\n  text-decoration-line: none;\n}\n.message-bubble-assistant .chat-markdown :is(:where(a):not(:where([class~=\"not-prose\"],[class~=\"not-prose\"] *))):hover {\n  text-decoration-line: underline;\n}\n.message-bubble-assistant .chat-markdown {\n  --tw-prose-body: var(--message-assistant-text-color);\n  --tw-prose-headings: var(--message-assistant-text-color);\n  --tw-prose-lead: var(--message-assistant-text-color);\n  --tw-prose-links: var(--message-assistant-link-color);\n  --tw-prose-bold: var(--message-assistant-text-color);\n  --tw-prose-counters: var(--message-assistant-text-color);\n  --tw-prose-bullets: var(--message-assistant-text-color);\n  --tw-prose-hr: var(--message-assistant-text-color);\n  --tw-prose-quotes: var(--message-assistant-text-color);\n  --tw-prose-quote-borders: var(--message-assistant-text-color);\n  --tw-prose-captions: var(--message-assistant-text-color);\n  --tw-prose-kbd: var(--message-assistant-text-color);\n  --tw-prose-kbd-shadows: var(--message-assistant-text-color);\n  --tw-prose-code: var(--code-text-assistant-color);\n  --tw-prose-pre-code: var(--code-text-assistant-color);\n  --tw-prose-pre-bg: var(--code-bg-assistant-color);\n  --tw-prose-th-borders: var(--message-assistant-text-color);\n  --tw-prose-td-borders: var(--message-assistant-text-color);\n}\n.message-bubble-user .chat-markdown {\n  --tw-prose-body: var(--message-user-text-color);\n  --tw-prose-headings: var(--message-user-text-color);\n  --tw-prose-lead: var(--message-user-text-color);\n  --tw-prose-links: var(--message-user-link-color);\n  --tw-prose-bold: var(--message-user-text-color);\n  --tw-prose-counters: var(--message-user-text-color);\n  --tw-prose-bullets: var(--message-user-text-color);\n  --tw-prose-hr: var(--message-user-text-color);\n  --tw-prose-quotes: var(--message-user-text-color);\n  --tw-prose-quote-borders: var(--message-user-text-color);\n  --tw-prose-captions: var(--message-user-text-color);\n  --tw-prose-kbd: var(--message-user-text-color);\n  --tw-prose-kbd-shadows: var(--message-user-text-color);\n  --tw-prose-code: var(--code-text-user-color);\n  --tw-prose-pre-code: var(--code-text-user-color);\n  --tw-prose-pre-bg: var(--code-bg-user-color);\n  --tw-prose-th-borders: var(--message-user-text-color);\n  --tw-prose-td-borders: var(--message-user-text-color);\n}\n.message-bubble-system .chat-markdown {\n  --tw-prose-body: var(--message-system-text-color);\n  --tw-prose-headings: var(--message-system-text-color);\n  --tw-prose-lead: var(--message-system-text-color);\n  --tw-prose-links: var(--message-system-link-color);\n  --tw-prose-bold: var(--message-system-text-color);\n  --tw-prose-counters: var(--message-system-text-color);\n  --tw-prose-bullets: var(--message-system-text-color);\n  --tw-prose-hr: var(--message-system-text-color);\n  --tw-prose-quotes: var(--message-system-text-color);\n  --tw-prose-quote-borders: var(--message-system-text-color);\n  --tw-prose-captions: var(--message-system-text-color);\n  --tw-prose-kbd: var(--message-system-text-color);\n  --tw-prose-kbd-shadows: var(--message-system-text-color);\n  --tw-prose-code: var(--message-system-text-color);\n  --tw-prose-pre-code: var(--message-system-text-color);\n  --tw-prose-pre-bg: var(--message-system-text-color);\n  --tw-prose-th-borders: var(--message-system-text-color);\n  --tw-prose-td-borders: var(--message-system-text-color);\n}\n.message-bubble-user .chat-markdown pre {\n  border: 1px solid var(--code-border-user-color);\n}\n.message-bubble-assistant .chat-markdown pre {\n  border: 1px solid var(--code-border-assistant-color);\n}\n.loading:after {\n  content: ' .';\n}\n/* File Upload Button */\n.file-attachment-button {\n  border-radius: 0.375rem;\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 200ms;\n}\n.file-attachment-button:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n.file-attachment-button {\n  padding: 0.375em;\n  background-color: var(--file-attachment-button-bg-color);\n  color: var(--file-attachment-button-text-color);\n}\n.file-attachment-button svg {\n  width: 1.5em;\n  height: 1.5em;\n}\n.file-attachment-button:hover:not(:disabled) {\n  background-color: var(--file-attachment-button-bg-hover-color);\n}\n.file-attachment-button:disabled {\n  color: var(--file-attachment-button-text-disabled-color);\n}\n/* Selected Files Container */\n.selected-files-container {\n  padding: 1em 1em 0.5em 1em;\n  background-color: var(--selected-files-bg-color);\n  border-top: 1px solid var(--selected-files-border-color);\n}\n/* Selected File Item */\n.selected-file-item {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  background-color: var(--selected-file-bg-color);\n  border-radius: 0.375em;\n  padding: 0.25em 0.5em;\n  font-size: var(--selected-file-font-size);\n  color: var(--selected-file-name-color);\n}\n.selected-file-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.selected-file-icon svg {\n  width: var(--selected-file-icon-size);\n  height: var(--selected-file-icon-size);\n}\n.selected-file-size {\n  color: var(--selected-file-size-color);\n}\n.selected-file-error {\n  color: var(--error-text-color);\n}\n.selected-file-success-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--success-text-color);\n  width: var(--selected-file-icon-size);\n  height: var(--selected-file-icon-size);\n}\n.selected-file-remove-button {\n  font-weight: 700;\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 200ms;\n  color: var(--selected-file-remove-icon-color);\n  padding: 0.375em;\n}\n.selected-file-remove-button svg {\n  width: var(--selected-file-icon-size);\n  height: var(--selected-file-icon-size);\n}\n.selected-file-remove-button:hover {\n  color: var(--selected-file-remove-icon-hover-color);\n}\n/* Message Attachments */\n.message-attachments {\n  margin-top: 0.5em;\n}\n.message-attachments > :not([hidden]) ~ :not([hidden]) {\n  --tw-space-y-reverse: 0;\n  margin-top: calc(0.25em * calc(1 - var(--tw-space-y-reverse)));\n  margin-bottom: calc(0.25em * var(--tw-space-y-reverse));\n}\n.message-attachments {\n  font-size: var(--chat-window-font-size-sm);\n}\n.message-attachment-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--message-attachment-icon-size);\n  height: var(--message-attachment-icon-size);\n}\n/* Update Send Button for Upload State */\n.send-button-disabled {\n  cursor: not-allowed;\n  background-color: var(--send-button-bg-disabled-color);\n  color: var(--send-button-text-disabled-color);\n}\n";
 const OpenChatStudioWidgetStyle0 = ocsChatCss;
 
 const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLElement {
@@ -4313,6 +4499,10 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
          * The shape of the chat button. 'round' makes it circular, 'square' keeps it rectangular.
          */
         this.buttonShape = 'square';
+        /**
+         * The message to display in the new chat confirmation dialog.
+         */
+        this.newChatConfirmationMessage = "Starting a new chat will clear your current conversation. Continue?";
         /**
          * Whether the chat widget is visible on load.
          */
@@ -4334,24 +4524,34 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
          * Allow the user to make the chat window full screen.
          */
         this.allowFullScreen = true;
-        this.loaded = false;
+        /**
+         * Allow the user to attach files to their messages.
+         */
+        this.allowAttachments = false;
+        /**
+         * The text to display while the assistant is typing/preparing a response.
+         */
+        this.typingIndicatorText = "Preparing response";
         this.error = "";
         this.messages = [];
         this.isLoading = false;
         this.isTyping = false;
         this.messageInput = "";
-        this.isTaskPolling = false;
+        this.currentPollTaskId = "";
         this.isDragging = false;
         this.dragOffset = { x: 0, y: 0 };
         this.windowPosition = { x: 0, y: 0 };
         this.fullscreenPosition = { x: 0 };
-        this.showStarterQuestions = true;
         this.parsedWelcomeMessages = [];
         this.parsedStarterQuestions = [];
         this.isFullscreen = false;
+        this.showNewChatConfirmation = false;
+        this.selectedFiles = [];
+        this.isUploadingFiles = false;
         this.chatWindowHeight = 600;
         this.chatWindowWidth = 450;
         this.chatWindowFullscreenWidth = 1024;
+        this.positionInitialized = false;
         this.handleMouseDown = (event) => {
             if (!this.isFullscreen && window.innerWidth < OcsChat.MOBILE_BREAKPOINT)
                 return;
@@ -4396,11 +4596,11 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
             this.endDrag();
         };
         this.handleWindowResize = () => {
+            this.positionInitialized = false;
             this.initializePosition();
         };
     }
     componentWillLoad() {
-        this.loaded = this.visible;
         if (!this.chatbotId) {
             this.error = 'Chatbot ID is required';
             return;
@@ -4411,13 +4611,22 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
             if (sessionId && messages) {
                 this.sessionId = sessionId;
                 this.messages = messages;
-                this.showStarterQuestions = messages.length === 0;
             }
         }
         this.parseWelcomeMessages();
         this.parseStarterQuestions();
     }
     componentDidLoad() {
+        const computedStyle = getComputedStyle(this.host);
+        const windowHeightVar = computedStyle.getPropertyValue('--chat-window-height');
+        const windowWidthVar = computedStyle.getPropertyValue('--chat-window-width');
+        const fullscreenWidthVar = computedStyle.getPropertyValue('--chat-window-fullscreen-width');
+        this.chatWindowHeight = varToPixels(windowHeightVar, window.innerHeight, this.chatWindowHeight);
+        this.chatWindowWidth = varToPixels(windowWidthVar, window.innerWidth, this.chatWindowWidth);
+        this.chatWindowFullscreenWidth = varToPixels(fullscreenWidthVar, window.innerWidth, this.chatWindowFullscreenWidth);
+        if (this.visible) {
+            this.initializePosition();
+        }
         // Only auto-start session if we don't have an existing one
         if (this.visible && !this.sessionId) {
             this.startSession();
@@ -4426,14 +4635,6 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
             // Resume polling for existing session
             this.startPolling();
         }
-        const computedStyle = getComputedStyle(this.host);
-        const windowHeightVar = computedStyle.getPropertyValue('--chat-window-height');
-        const windowWidthVar = computedStyle.getPropertyValue('--chat-window-width');
-        const fullscreenWidthVar = computedStyle.getPropertyValue('--chat-window-fullscreen-width');
-        this.chatWindowHeight = varToPixels(windowHeightVar, window.innerHeight, this.chatWindowHeight);
-        this.chatWindowWidth = varToPixels(windowWidthVar, window.innerWidth, this.chatWindowWidth);
-        this.chatWindowFullscreenWidth = varToPixels(fullscreenWidthVar, window.innerWidth, this.chatWindowFullscreenWidth);
-        this.initializePosition();
         window.addEventListener('resize', this.handleWindowResize);
     }
     disconnectedCallback() {
@@ -4441,6 +4642,26 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         this.removeEventListeners();
         window.removeEventListener('resize', this.handleWindowResize);
     }
+    addErrorMessage(errorText) {
+        const errorMessage = {
+            created_at: new Date().toISOString(),
+            role: 'system',
+            content: `**Error:** ${errorText}\nPlease try again.`,
+            attachments: []
+        };
+        this.messages = [...this.messages, errorMessage];
+        this.saveSessionToStorage();
+        this.scrollToBottom();
+    }
+    handleError(errorText) {
+        // show as system message
+        this.addErrorMessage(errorText);
+        // Clear any loading/typing states
+        this.isLoading = false;
+        this.isTyping = false;
+        this.isUploadingFiles = false;
+        this.currentPollTaskId = '';
+    }
     parseJSONProp(propValue, propName) {
         try {
             if (propValue) {
@@ -4465,19 +4686,28 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         this.parsedStarterQuestions = this.parseJSONProp(this.starterQuestions, 'starter questions');
     }
     cleanup() {
-        if (this.pollingInterval) {
-            clearInterval(this.pollingInterval);
-            this.pollingInterval = undefined;
+        if (this.pollingIntervalRef) {
+            clearInterval(this.pollingIntervalRef);
+            this.pollingIntervalRef = undefined;
         }
-        this.isTaskPolling = false;
+        this.currentPollTaskId = '';
     }
     getApiBaseUrl() {
         return this.apiBaseUrl || window.location.origin;
     }
+    getApiHeaders() {
+        const headers = {
+            'Content-Type': 'application/json',
+        };
+        const csrfToken = getCSRFToken(this.getApiBaseUrl());
+        if (csrfToken) {
+            headers['X-CSRFToken'] = csrfToken;
+        }
+        return headers;
+    }
     async startSession() {
         try {
             this.isLoading = true;
-            this.error = '';
             const userId = this.getOrGenerateUserId();
             const requestBody = {
                 chatbot_id: this.chatbotId,
@@ -4492,13 +4722,12 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
             }
             const response = await fetch(`${this.getApiBaseUrl()}/api/chat/start/`, {
                 method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                },
+                headers: this.getApiHeaders(),
                 body: JSON.stringify(requestBody)
             });
             if (!response.ok) {
-                throw new Error(`Failed to start session: ${response.statusText}`);
+                this.handleError(`Failed to start session: ${response.statusText}`);
+                return;
             }
             const data = await response.json();
             this.sessionId = data.session_id;
@@ -4506,24 +4735,99 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
             // Handle seed message if present
             if (data.seed_message_task_id) {
                 this.isTyping = true; // Show typing indicator for seed message
-                await this.pollTaskResponse(data.seed_message_task_id);
+                this.currentPollTaskId = data.seed_message_task_id;
+                await this.pollTaskResponse();
             }
             // Start polling for messages
             this.startPolling();
         }
         catch (error) {
-            this.error = error instanceof Error ? error.message : 'Failed to start chat session';
+            this.handleError('Failed to start chat session');
         }
         finally {
             this.isLoading = false;
         }
     }
+    markPendingFilesWithError(errorMessage) {
+        this.selectedFiles = this.selectedFiles.map(sf => {
+            if (!sf.error && !sf.uploaded) {
+                return Object.assign(Object.assign({}, sf), { error: errorMessage });
+            }
+            return sf;
+        });
+    }
+    async uploadFiles() {
+        if (this.selectedFiles.length === 0 || !this.sessionId || !this.allowAttachments) {
+            return [];
+        }
+        this.isUploadingFiles = true;
+        const uploadedIds = [];
+        try {
+            const formData = new FormData();
+            // Add all files to form data
+            for (const selectedFile of this.selectedFiles) {
+                if (!selectedFile.error && !selectedFile.uploaded) {
+                    formData.append('files', selectedFile.file);
+                }
+                else if (selectedFile.uploaded) {
+                    uploadedIds.push(selectedFile.uploaded.id);
+                }
+            }
+            // Add user ID and name to the form data
+            const userId = this.getOrGenerateUserId();
+            formData.append('participant_remote_id', userId);
+            if (this.userName) {
+                formData.append('participant_name', this.userName);
+            }
+            // Only upload if there are new files
+            if (formData.has('files')) {
+                const response = await fetch(`${this.getApiBaseUrl()}/api/chat/${this.sessionId}/upload/`, {
+                    method: 'POST',
+                    body: formData,
+                });
+                if (!response.ok) {
+                    const errorData = await response.json();
+                    const errorMessage = errorData.error || 'Failed to upload files';
+                    this.markPendingFilesWithError(errorMessage);
+                    return uploadedIds;
+                }
+                const data = await response.json();
+                // Update selected files with upload results
+                let fileIndex = 0;
+                this.selectedFiles = this.selectedFiles.map(sf => {
+                    if (!sf.error && !sf.uploaded) {
+                        return Object.assign(Object.assign({}, sf), { uploaded: data.files[fileIndex++] });
+                    }
+                    return sf;
+                });
+                uploadedIds.push(...data.files.map((f) => f.id));
+            }
+            return uploadedIds;
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error ? error.message : 'Failed to upload files';
+            this.markPendingFilesWithError(errorMessage);
+            return uploadedIds;
+        }
+        finally {
+            this.isUploadingFiles = false;
+        }
+    }
     async sendMessage(message) {
         if (!this.sessionId || !message.trim())
             return;
-        // Hide starter questions on any user interaction
-        this.showStarterQuestions = false;
         try {
+            let attachmentIds = [];
+            if (this.allowAttachments && this.selectedFiles.length > 0) {
+                attachmentIds = await this.uploadFiles();
+                // Check if any files have errors after upload attempt
+                const hasErrors = this.selectedFiles.some(sf => sf.error);
+                if (hasErrors) {
+                    // Don't send the message, let user fix file issues first
+                    this.handleError('Please remove or fix file errors before sending your message.');
+                    return;
+                }
+            }
             // If this is the first user message and there are welcome messages,
             // add them to chat history as assistant messages
             if (this.messages.length === 0 && this.parsedWelcomeMessages.length > 0) {
@@ -4536,25 +4840,36 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
                 }));
                 this.messages = [...this.messages, ...welcomeMessages];
             }
-            // Add user message immediately
+            // Add user message immediately with attachments info
             const userMessage = {
                 created_at: new Date().toISOString(),
                 role: 'user',
                 content: message.trim(),
-                attachments: []
+                attachments: this.allowAttachments ? this.selectedFiles
+                    .filter(sf => !sf.error && sf.uploaded)
+                    .map(sf => ({
+                    name: sf.file.name,
+                    content_type: sf.file.type,
+                    size: sf.file.size,
+                })) : []
             };
             this.messages = [...this.messages, userMessage];
             this.saveSessionToStorage();
             this.messageInput = '';
+            if (this.allowAttachments) {
+                this.selectedFiles = []; // Clear selected files after sending
+            }
             this.scrollToBottom();
             // Start typing indicator - it will stay on during task polling
             this.isTyping = true;
+            const requestBody = { message: message.trim() };
+            if (this.allowAttachments && attachmentIds.length > 0) {
+                requestBody.attachment_ids = attachmentIds;
+            }
             const response = await fetch(`${this.getApiBaseUrl()}/api/chat/${this.sessionId}/message/`, {
                 method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({ message: message.trim() })
+                headers: this.getApiHeaders(),
+                body: JSON.stringify(requestBody)
             });
             if (!response.ok) {
                 throw new Error(`Failed to send message: ${response.statusText}`);
@@ -4564,27 +4879,28 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
                 throw new Error(data.error || 'Failed to send message');
             }
             // Poll for the response - typing indicator will be managed in pollTaskResponse
-            await this.pollTaskResponse(data.task_id);
+            this.currentPollTaskId = data.task_id;
+            await this.pollTaskResponse();
         }
         catch (error) {
-            this.error = error instanceof Error ? error.message : 'Failed to send message';
-            // Clear typing indicator on error
-            this.isTyping = false;
+            const errorText = error instanceof Error ? error.message : 'Failed to send message';
+            this.handleError(errorText);
         }
     }
     handleStarterQuestionClick(question) {
         this.sendMessage(question);
     }
-    async pollTaskResponse(taskId) {
-        if (!this.sessionId)
+    async pollTaskResponse() {
+        if (!this.sessionId || !this.currentPollTaskId)
             return;
         // Stop message polling while task polling is active
-        this.isTaskPolling = true;
         this.pauseMessagePolling();
         let attempts = 0;
         const poll = async () => {
+            if (!this.sessionId || !this.currentPollTaskId)
+                return;
             try {
-                const response = await fetch(`${this.getApiBaseUrl()}/api/chat/${this.sessionId}/${taskId}/poll/`);
+                const response = await fetch(`${this.getApiBaseUrl()}/api/chat/${this.sessionId}/${this.currentPollTaskId}/poll/`);
                 if (!response.ok) {
                     throw new Error(`Failed to poll task: ${response.statusText}`);
                 }
@@ -4598,7 +4914,7 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
                     this.scrollToBottom();
                     // Task polling complete, clear typing indicator and resume message polling
                     this.isTyping = false;
-                    this.isTaskPolling = false;
+                    this.currentPollTaskId = '';
                     this.resumeMessagePolling();
                     this.focusInput();
                     return;
@@ -4608,36 +4924,47 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
                     setTimeout(poll, OcsChat.TASK_POLLING_INTERVAL_MS);
                 }
                 else if (attempts >= OcsChat.TASK_POLLING_MAX_ATTEMPTS) {
-                    // Task polling timed out, clear typing indicator and resume message polling
+                    // Task polling timed out - add timeout message and resume polling
+                    const timeoutMessage = {
+                        created_at: new Date().toISOString(),
+                        role: 'system',
+                        content: 'The response is taking longer than expected. The system may be experiencing delays. Please try sending your message again.',
+                        attachments: []
+                    };
+                    this.messages = [...this.messages, timeoutMessage];
+                    this.saveSessionToStorage();
+                    this.scrollToBottom();
+                    // Clear typing indicator and resume message polling
                     this.isTyping = false;
-                    this.isTaskPolling = false;
+                    this.currentPollTaskId = '';
                     this.resumeMessagePolling();
+                    this.focusInput();
                 }
             }
             catch (error) {
-                this.error = error instanceof Error ? error.message : 'Failed to get response';
-                // Error in task polling, clear typing indicator and resume message polling
-                this.isTyping = false;
-                this.isTaskPolling = false;
+                const errorText = error instanceof Error ? error.message : 'Failed to get response';
+                this.handleError(errorText);
+                // Clear states and resume polling
+                this.currentPollTaskId = '';
                 this.resumeMessagePolling();
             }
         };
         await poll();
     }
     startPolling() {
-        if (this.pollingInterval)
+        if (this.pollingIntervalRef)
             return;
-        this.pollingInterval = setInterval(async () => {
+        this.pollingIntervalRef = setInterval(async () => {
             // Only poll for messages if not currently polling for a task
-            if (!this.isTaskPolling) {
+            if (!this.currentPollTaskId) {
                 await this.pollForMessages();
             }
         }, OcsChat.MESSAGE_POLLING_INTERVAL_MS);
     }
     pauseMessagePolling() {
-        if (this.pollingInterval) {
-            clearInterval(this.pollingInterval);
-            this.pollingInterval = undefined;
+        if (this.pollingIntervalRef) {
+            clearInterval(this.pollingIntervalRef);
+            this.pollingIntervalRef = undefined;
         }
     }
     resumeMessagePolling() {
@@ -4662,15 +4989,11 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
                 this.scrollToBottom();
                 this.focusInput();
             }
-            this.lastPollTime = new Date();
         }
-        catch (error) {
+        catch (_a) {
             // Silently fail for polling
         }
     }
-    clearError() {
-        this.error = '';
-    }
     scrollToBottom() {
         setTimeout(() => {
             if (this.messageListRef) {
@@ -4693,22 +5016,90 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
     }
     handleInputChange(event) {
         this.messageInput = event.target.value;
-        // Hide starter questions when user starts typing
-        if (this.messageInput.trim().length > 0) {
-            this.showStarterQuestions = false;
+    }
+    handleFileSelect(event) {
+        var _a;
+        if (!this.allowAttachments)
+            return;
+        const input = event.target;
+        if (!input.files || input.files.length === 0)
+            return;
+        const newFiles = [];
+        let totalSize = this.selectedFiles.reduce((sum, f) => sum + f.file.size, 0);
+        for (let i = 0; i < input.files.length; i++) {
+            const file = input.files[i];
+            const ext = '.' + ((_a = file.name.split('.').pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase());
+            if (!OcsChat.SUPPORTED_FILE_EXTENSIONS.includes(ext)) {
+                newFiles.push({
+                    file,
+                    error: `File type ${ext} not supported`
+                });
+                continue;
+            }
+            const fileSizeMB = file.size / (1024 * 1024);
+            if (fileSizeMB > OcsChat.MAX_FILE_SIZE_MB) {
+                newFiles.push({
+                    file,
+                    error: `File exceeds ${OcsChat.MAX_FILE_SIZE_MB}MB limit`
+                });
+                continue;
+            }
+            totalSize += file.size;
+            const totalSizeMB = totalSize / (1024 * 1024);
+            if (totalSizeMB > OcsChat.MAX_TOTAL_SIZE_MB) {
+                newFiles.push({
+                    file,
+                    error: `Total size exceeds ${OcsChat.MAX_TOTAL_SIZE_MB}MB limit`
+                });
+                continue;
+            }
+            newFiles.push({ file });
+        }
+        this.selectedFiles = [...this.selectedFiles, ...newFiles];
+        input.value = '';
+    }
+    removeSelectedFile(index) {
+        if (!this.allowAttachments)
+            return;
+        this.selectedFiles = this.selectedFiles.filter((_, i) => i !== index);
+    }
+    formatFileSize(bytes) {
+        if (bytes === 0)
+            return '0 KB';
+        const k = 1024;
+        if (bytes < k * k) {
+            // Less than 1MB, show in KB
+            return Math.round(bytes / k * 100) / 100 + ' KB';
+        }
+        else {
+            return Math.round(bytes / (k * k) * 100) / 100 + ' MB';
         }
     }
     formatTime(dateString) {
         const date = new Date(dateString);
         return date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
     }
-    async load() {
+    toggleWindowVisibility() {
         this.visible = !this.visible;
-        this.loaded = true;
-        if (this.visible && !this.sessionId) {
-            this.clearError();
+    }
+    /**
+     * Watch for changes to the `visible` attribute and update accordingly.
+     *
+     * @param visible - The new value for the field.
+     */
+    async visibilityHandler(visible) {
+        if (visible) {
+            this.initializePosition();
+        }
+        if (visible && !this.sessionId) {
             await this.startSession();
         }
+        else if (!visible) {
+            this.pauseMessagePolling();
+        }
+        else {
+            this.resumeMessagePolling();
+        }
     }
     setPosition(position) {
         if (position === this.position)
@@ -4728,6 +5119,7 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         const actualChatWidth = Math.min(windowWidth, this.chatWindowFullscreenWidth);
         const centeredX = (windowWidth - actualChatWidth) / 2;
         const maxOffset = (windowWidth - actualChatWidth) / 2;
+        console.log(windowWidth, actualChatWidth, centeredX, maxOffset);
         return { windowWidth, actualChatWidth, centeredX, maxOffset };
     }
     getPositionStyles() {
@@ -4746,6 +5138,10 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         };
     }
     initializePosition() {
+        if (this.positionInitialized) {
+            return;
+        }
+        this.positionInitialized = true;
         const windowWidth = window.innerWidth;
         const windowHeight = window.innerHeight;
         const chatWidth = windowWidth < OcsChat.MOBILE_BREAKPOINT ? windowWidth : this.chatWindowWidth;
@@ -4860,10 +5256,10 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         const iconSrc = hasCustomIcon ? this.iconUrl : this.getDefaultIconUrl();
         const buttonClasses = this.getButtonClasses();
         if (hasText) {
-            return (h("button", { class: buttonClasses, onClick: () => this.load(), "aria-label": `Open chat - ${this.buttonText}`, title: this.buttonText }, h("img", { src: iconSrc, alt: "" }), h("span", null, this.buttonText)));
+            return (h("button", { class: buttonClasses, onClick: () => this.toggleWindowVisibility(), "aria-label": `Open chat - ${this.buttonText}`, title: this.buttonText }, h("img", { src: iconSrc, alt: "" }), h("span", null, this.buttonText)));
         }
         else {
-            return (h("button", { class: buttonClasses, onClick: () => this.load(), "aria-label": "Open chat", title: "Open chat" }, h("img", { src: iconSrc, alt: "Chat" })));
+            return (h("button", { class: buttonClasses, onClick: () => this.toggleWindowVisibility(), "aria-label": "Open chat", title: "Open chat" }, h("img", { src: iconSrc, alt: "Chat" })));
         }
     }
     getStorageKeys() {
@@ -4967,13 +5363,25 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
             return false;
         }
     }
-    async startNewChat() {
+    showConfirmationDialog() {
+        this.showNewChatConfirmation = true;
+    }
+    hideConfirmationDialog() {
+        this.showNewChatConfirmation = false;
+    }
+    async confirmNewChat() {
+        this.hideConfirmationDialog();
+        await this.actuallyStartNewChat();
+    }
+    async actuallyStartNewChat() {
         this.clearSessionStorage();
         this.sessionId = undefined;
         this.messages = [];
-        this.showStarterQuestions = true;
         this.isTyping = false;
-        this.error = '';
+        this.currentPollTaskId = '';
+        if (this.allowAttachments) {
+            this.selectedFiles = [];
+        }
         this.cleanup();
         await this.startSession();
     }
@@ -4983,18 +5391,27 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         this.fullscreenPosition = { x: 0 };
     }
     render() {
-        if (this.error) {
+        // Only show error state for critical errors that prevent the widget from functioning
+        if (this.error && !this.sessionId) {
             return (h(Host, null, h("p", { class: "error-message" }, this.error)));
         }
-        return (h(Host, null, this.renderButton(), this.visible && (h("div", { ref: (el) => this.chatWindowRef = el, id: "ocs-chat-window", class: this.getPositionClasses(), style: this.getPositionStyles() }, h("div", { class: `chat-header ${this.isDragging ? 'chat-header-dragging' : 'chat-header-draggable'}`, onMouseDown: this.handleMouseDown, onTouchStart: this.handleTouchStart }, h("div", { class: "drag-indicator" }, h("div", { class: "drag-dots header-button" }, h(GripDotsVerticalIcon, null))), h("div", { class: "header-text" }, this.headerText), h("div", { class: "header-buttons" }, this.allowFullScreen && h("button", { class: "header-button fullscreen-button", onClick: () => this.toggleFullscreen(), title: this.isFullscreen ? "Exit fullscreen" : "Enter fullscreen", "aria-label": this.isFullscreen ? "Exit fullscreen" : "Enter fullscreen" }, this.isFullscreen ? h(ArrowsPointingInIcon, null) : h(ArrowsPointingOutIcon, null)), this.sessionId && this.messages.length > 0 && (h("button", { class: "header-button", onClick: () => this.startNewChat(), title: "Start new chat", "aria-label": "Start new chat" }, h(PencilSquare, null))), h("button", { class: "header-button", onClick: () => this.visible = false, "aria-label": "Close" }, h(XMarkIcon, null)))), h("div", { class: "chat-content" }, this.isLoading && !this.sessionId && (h("div", { class: "loading-container" }, h("div", { class: "loading-spinner" }), h("span", { class: "loading-text" }, "Starting chat..."))), this.sessionId && (h("div", { ref: (el) => this.messageListRef = el, class: "messages-container" }, this.messages.length === 0 && !this.isTyping && this.parsedWelcomeMessages.length > 0 && (h("div", { class: "welcome-messages" }, this.parsedWelcomeMessages.map((message, index) => (h("div", { key: `welcome-${index}`, class: "message-row message-row-assistant" }, h("div", { class: "message-bubble message-bubble-assistant" }, h("div", { class: "chat-markdown", innerHTML: renderMarkdownSync(message) }))))))), this.messages.map((message, index) => (h("div", { key: index, class: `message-row ${message.role === 'user' ? 'message-row-user' : 'message-row-assistant'}` }, h("div", { class: `message-bubble ${message.role === 'user'
+        return (h(Host, null, this.renderButton(), this.visible && (h("div", { ref: (el) => this.chatWindowRef = el, id: "ocs-chat-window", class: this.getPositionClasses(), style: this.getPositionStyles() }, h("div", { class: `chat-header ${this.isDragging ? 'chat-header-dragging' : 'chat-header-draggable'}`, onMouseDown: this.handleMouseDown, onTouchStart: this.handleTouchStart }, h("div", { class: "drag-indicator" }, h("div", { class: "drag-dots header-button" }, h(GripDotsVerticalIcon, null))), h("div", { class: "header-text" }, this.headerText), h("div", { class: "header-buttons" }, this.messages.length > 0 && (h("button", { class: "header-button", onClick: () => this.showConfirmationDialog(), title: "Start new chat", "aria-label": "Start new chat" }, h(PlusWithCircleIcon, null))), this.allowFullScreen && h("button", { class: "header-button fullscreen-button", onClick: () => this.toggleFullscreen(), title: this.isFullscreen ? "Exit fullscreen" : "Enter fullscreen", "aria-label": this.isFullscreen ? "Exit fullscreen" : "Enter fullscreen" }, this.isFullscreen ? h(ArrowsPointingInIcon, null) : h(ArrowsPointingOutIcon, null)), h("button", { class: "header-button", onClick: () => this.visible = false, "aria-label": "Close" }, h(XMarkIcon, null)))), this.showNewChatConfirmation && (h("div", { class: "confirmation-overlay" }, h("div", { class: "confirmation-dialog" }, h("div", { class: "confirmation-content" }, h("h3", { class: "confirmation-title" }, "Start New Chat"), h("p", { class: "confirmation-message" }, this.newChatConfirmationMessage), h("div", { class: "confirmation-buttons" }, h("button", { class: "confirmation-button confirmation-button-cancel", onClick: () => this.hideConfirmationDialog() }, "Cancel"), h("button", { class: "confirmation-button confirmation-button-confirm", onClick: () => this.confirmNewChat() }, "Continue")))))), h("div", { class: "chat-content" }, this.isLoading && !this.sessionId && (h("div", { class: "loading-container" }, h("div", { class: "loading-spinner" }), h("span", { class: "loading-text" }, "Starting chat..."))), (h("div", { ref: (el) => this.messageListRef = el, class: "messages-container" }, this.messages.length === 0 && this.parsedWelcomeMessages.length > 0 && (h("div", { class: "welcome-messages" }, this.parsedWelcomeMessages.map((message, index) => (h("div", { key: `welcome-${index}`, class: "message-row message-row-assistant" }, h("div", { class: "message-bubble message-bubble-assistant" }, h("div", { class: "chat-markdown", innerHTML: renderMarkdownSync(message) }))))))), this.messages.map((message, index) => (h("div", { key: index, class: `message-row ${message.role === 'user' ? 'message-row-user' : 'message-row-assistant'}` }, h("div", { class: `message-bubble ${message.role === 'user'
                 ? 'message-bubble-user'
                 : message.role === 'assistant'
                     ? 'message-bubble-assistant'
-                    : 'message-bubble-system'}` }, h("div", { class: "chat-markdown", innerHTML: renderMarkdownSync(message.content) }), message.attachments && message.attachments.length > 0 && (h("div", { class: "message-attachments" }, message.attachments.map((attachment, attachmentIndex) => (h("a", { key: attachmentIndex, href: attachment.content_url, target: "_blank", rel: "noopener noreferrer", class: "attachment-link" }, "\uD83D\uDCCE ", attachment.name))))), h("div", { class: "message-timestamp" }, this.formatTime(message.created_at)))))), this.isTyping && (h("div", null, h("div", { class: "typing-indicator" }, h("div", { class: "typing-progress" })), h("div", { class: "typing-text" }, h("span", null, "Preparing response"), h("span", { class: "typing-dots" })))))), this.sessionId && this.showStarterQuestions && this.messages.length === 0 && !this.isTyping && (h("div", { class: "starter-questions" }, this.parsedStarterQuestions.map((question, index) => (h("div", { key: `starter-${index}`, class: "starter-question-row" }, h("button", { class: "starter-question", onClick: () => this.handleStarterQuestionClick(question) }, question)))))), this.sessionId && (h("div", { class: "input-area" }, h("div", { class: "input-container" }, h("textarea", { ref: (el) => this.textareaRef = el, class: "message-textarea", rows: 1, placeholder: "Type your message...", value: this.messageInput, onInput: (e) => this.handleInputChange(e), onKeyPress: (e) => this.handleKeyPress(e), disabled: this.isTyping }), h("button", { class: `send-button ${!this.isTyping && !!this.messageInput.trim()
+                    : 'message-bubble-system'}` }, h("div", { class: "chat-markdown", innerHTML: renderMarkdownSync(message.content) }), message.attachments && message.attachments.length > 0 && (h("div", { class: "message-attachments" }, message.attachments.map((attachment, attachmentIndex) => (h("div", { key: attachmentIndex, class: "flex items-center gap-[0.5em]" }, h("span", { class: "message-attachment-icon" }, h(PaperClipIcon, null)), h("span", { class: "message-attachment-name" }, attachment.name)))))), h("div", { class: "message-timestamp" }, this.formatTime(message.created_at)))))), this.isTyping && (h("div", null, h("div", { class: "typing-indicator" }, h("div", { class: "typing-progress" })), h("div", { class: "typing-text" }, h("span", null, this.typingIndicatorText), h("span", { class: "typing-dots" })))))), this.messages.length === 0 && this.parsedStarterQuestions.length > 0 && (h("div", { class: "starter-questions" }, this.parsedStarterQuestions.map((question, index) => (h("div", { key: `starter-${index}`, class: "starter-question-row" }, h("button", { class: "starter-question", onClick: () => this.handleStarterQuestionClick(question) }, question)))))), this.allowAttachments && this.selectedFiles.length > 0 && (h("div", { class: "selected-files-container" }, h("div", { class: "space-y-[0.25em]" }, this.selectedFiles.map((selectedFile, index) => (h("div", { key: index, class: "selected-file-item" }, h("div", { class: "flex items-center gap-[0.5em]" }, h("span", { class: "selected-file-icon" }, h(PaperClipIcon, null)), h("span", null, selectedFile.file.name), h("span", { class: "selected-file-size" }, "(", this.formatFileSize(selectedFile.file.size), ")"), selectedFile.error && (h("span", { class: "selected-file-error" }, selectedFile.error)), selectedFile.uploaded && (h("span", { class: "selected-file-success-icon" }, h(CheckDocumentIcon, null)))), h("button", { onClick: () => this.removeSelectedFile(index), class: "selected-file-remove-button", "aria-label": "Remove file" }, h(XIcon, null)))))))), this.sessionId && (h("div", { class: "input-area" }, h("div", { class: "input-container" }, h("textarea", { ref: (el) => this.textareaRef = el, class: "message-textarea", rows: 1, placeholder: "Type your message...", value: this.messageInput, onInput: (e) => this.handleInputChange(e), onKeyPress: (e) => this.handleKeyPress(e), disabled: this.isTyping || this.isUploadingFiles }), this.allowAttachments && (h("input", { ref: (el) => {
+                // Unclear why but after removing all attachments this is being set to `null`.
+                if (el) {
+                    this.fileInputRef = el;
+                }
+            }, id: "ocs-file-input", type: "file", multiple: true, accept: OcsChat.SUPPORTED_FILE_EXTENSIONS.join(','), onChange: (e) => this.handleFileSelect(e), class: "hidden" })), this.allowAttachments && (h("button", { class: "file-attachment-button", onClick: () => { var _a; return (_a = this.fileInputRef) === null || _a === void 0 ? void 0 : _a.click(); }, disabled: this.isTyping || this.isUploadingFiles, title: "Attach files", "aria-label": "Attach files" }, h(PaperClipIcon, null))), h("button", { class: `send-button ${!this.isTyping && !!this.messageInput.trim()
                 ? 'send-button-enabled'
-                : 'send-button-disabled'}`, onClick: () => this.sendMessage(this.messageInput), disabled: this.isTyping || !this.messageInput.trim() }, "Send")))), h("div", { class: "flex items-center justify-center text-[0.8em] font-light w-full text-slate-500 py-[2px]" }, h("p", null, "Powered by ", h("a", { class: "underline", href: "https://www.dimagi.com", target: "_blank" }, "Dimagi"))))))));
+                : 'send-button-disabled'}`, onClick: () => this.sendMessage(this.messageInput), disabled: this.isTyping || this.isUploadingFiles || !this.messageInput.trim() }, this.isUploadingFiles ? 'Uploading...' : 'Send')))), h("div", { class: "flex items-center justify-center text-[0.8em] font-light w-full text-slate-500 py-[2px]" }, h("p", null, "Powered by ", h("a", { class: "underline", href: "https://www.dimagi.com", target: "_blank" }, "Dimagi"))))))));
     }
     get host() { return this; }
+    static get watchers() { return {
+        "visible": ["visibilityHandler"]
+    }; }
     static get style() { return OpenChatStudioWidgetStyle0; }
 }, [1, "open-chat-studio-widget", {
         "chatbotId": [1, "chatbot-id"],
@@ -5003,6 +5420,7 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         "iconUrl": [1, "icon-url"],
         "buttonShape": [1, "button-shape"],
         "headerText": [1, "header-text"],
+        "newChatConfirmationMessage": [1, "new-chat-confirmation-message"],
         "visible": [1028],
         "position": [1025],
         "welcomeMessages": [1, "welcome-messages"],
@@ -5012,27 +5430,30 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
         "persistentSession": [4, "persistent-session"],
         "persistentSessionExpire": [2, "persistent-session-expire"],
         "allowFullScreen": [4, "allow-full-screen"],
-        "loaded": [32],
+        "allowAttachments": [4, "allow-attachments"],
+        "typingIndicatorText": [1, "typing-indicator-text"],
         "error": [32],
         "messages": [32],
         "sessionId": [32],
         "isLoading": [32],
         "isTyping": [32],
         "messageInput": [32],
-        "pollingInterval": [32],
-        "lastPollTime": [32],
-        "isTaskPolling": [32],
+        "currentPollTaskId": [32],
         "isDragging": [32],
         "dragOffset": [32],
         "windowPosition": [32],
         "fullscreenPosition": [32],
-        "showStarterQuestions": [32],
         "parsedWelcomeMessages": [32],
         "parsedStarterQuestions": [32],
         "generatedUserId": [32],
-        "isFullscreen": [32]
+        "isFullscreen": [32],
+        "showNewChatConfirmation": [32],
+        "selectedFiles": [32],
+        "isUploadingFiles": [32]
+    }, undefined, {
+        "visible": ["visibilityHandler"]
     }]);
-OcsChat.TASK_POLLING_MAX_ATTEMPTS = 30;
+OcsChat.TASK_POLLING_MAX_ATTEMPTS = 120;
 OcsChat.TASK_POLLING_INTERVAL_MS = 1000;
 OcsChat.MESSAGE_POLLING_INTERVAL_MS = 30000;
 OcsChat.SCROLL_DELAY_MS = 100;
@@ -5040,6 +5461,10 @@ OcsChat.FOCUS_DELAY_MS = 100;
 OcsChat.MOBILE_BREAKPOINT = 640;
 OcsChat.WINDOW_MARGIN = 20;
 OcsChat.LOCALSTORAGE_TEST_KEY = '__ocs_test__';
+OcsChat.MAX_FILE_SIZE_MB = 50;
+OcsChat.MAX_TOTAL_SIZE_MB = 50;
+OcsChat.SUPPORTED_FILE_EXTENSIONS = ['.txt', '.pdf', '.doc', '.docx', '.xls', '.xlsx', '.csv', '.jpg', '.jpeg',
+    '.png', '.gif', '.bmp', '.webp', '.svg', '.mp4', '.mov', '.avi', '.mp3', '.wav'];
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;