@chatwidgetai/chat-widget 0.1.4 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -6,6 +6,9 @@ var react = require('react');
6
6
  /**
7
7
  * API Client for Widget Communication
8
8
  * Handles all HTTP requests to the widget API
9
+ *
10
+ * Note: No API key required - widget ID acts as the access token.
11
+ * The widget ID should be kept confidential by the site owner.
9
12
  */
10
13
  class ApiError extends Error {
11
14
  constructor(message, status, options) {
@@ -90,7 +93,6 @@ class WidgetApiClient {
90
93
  const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/config`, {
91
94
  method: 'GET',
92
95
  headers: {
93
- 'Authorization': `Bearer ${this.config.apiKey}`,
94
96
  'Content-Type': 'application/json',
95
97
  },
96
98
  });
@@ -113,9 +115,6 @@ class WidgetApiClient {
113
115
  const query = params.toString() ? `?${params.toString()}` : '';
114
116
  const response = await fetch(`${baseUrl}${query}`, {
115
117
  method: 'GET',
116
- headers: {
117
- 'Authorization': `Bearer ${this.config.apiKey}`,
118
- },
119
118
  });
120
119
  if (!response.ok) {
121
120
  throw await buildApiError(response, 'Failed to load conversation');
@@ -131,9 +130,6 @@ class WidgetApiClient {
131
130
  formData.append('conversationId', conversationId);
132
131
  const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/upload`, {
133
132
  method: 'POST',
134
- headers: {
135
- 'Authorization': `Bearer ${this.config.apiKey}`,
136
- },
137
133
  body: formData,
138
134
  });
139
135
  if (!response.ok) {
@@ -150,7 +146,6 @@ class WidgetApiClient {
150
146
  const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/chat`, {
151
147
  method: 'POST',
152
148
  headers: {
153
- 'Authorization': `Bearer ${this.config.apiKey}`,
154
149
  'Content-Type': 'application/json',
155
150
  },
156
151
  body: JSON.stringify({
@@ -173,7 +168,6 @@ class WidgetApiClient {
173
168
  const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/agent`, {
174
169
  method: 'POST',
175
170
  headers: {
176
- 'Authorization': `Bearer ${this.config.apiKey}`,
177
171
  'Content-Type': 'application/json',
178
172
  },
179
173
  body: JSON.stringify({
@@ -208,7 +202,6 @@ class WidgetApiClient {
208
202
  const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/feedback`, {
209
203
  method: 'POST',
210
204
  headers: {
211
- 'Authorization': `Bearer ${this.config.apiKey}`,
212
205
  'Content-Type': 'application/json',
213
206
  },
214
207
  body: JSON.stringify({
@@ -235,7 +228,6 @@ class WidgetApiClient {
235
228
  const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/validate`, {
236
229
  method: 'POST',
237
230
  headers: {
238
- 'Authorization': `Bearer ${this.config.apiKey}`,
239
231
  'Content-Type': 'application/json',
240
232
  },
241
233
  body: JSON.stringify({
@@ -404,7 +396,7 @@ function deriveErrorInfo(error) {
404
396
  return { message: 'Something went wrong. Please try again.' };
405
397
  }
406
398
  function useChat(options) {
407
- const { widgetId, apiKey, apiUrl, onMessage, onError, } = options;
399
+ const { widgetId, apiUrl, onMessage, onError, } = options;
408
400
  const [state, setState] = react.useState({
409
401
  messages: [],
410
402
  isOpen: false,
@@ -414,7 +406,7 @@ function useChat(options) {
414
406
  conversationId: '', // Will be set after loading conversation
415
407
  config: null,
416
408
  });
417
- const apiClient = react.useRef(new WidgetApiClient({ widgetId, apiKey, apiUrl }));
409
+ const apiClient = react.useRef(new WidgetApiClient({ widgetId, apiUrl }));
418
410
  // Load configuration on mount and hydrate with existing conversation if available
419
411
  react.useEffect(() => {
420
412
  let isMounted = true;
@@ -473,7 +465,7 @@ function useChat(options) {
473
465
  console.log('[useChat] Effect cleanup, unmounting component');
474
466
  isMounted = false;
475
467
  };
476
- }, [widgetId, apiKey, apiUrl, onError]);
468
+ }, [widgetId, apiUrl, onError]);
477
469
  // Save conversation when messages change
478
470
  react.useEffect(() => {
479
471
  const persistConversation = state.config?.behavior.persistConversation ?? true;
@@ -21367,6 +21359,10 @@ function defaultUrlTransform(value) {
21367
21359
  return ''
21368
21360
  }
21369
21361
 
21362
+ // SVG Icon components
21363
+ const ThumbsUpIcon = () => (jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3" }) }));
21364
+ const ThumbsDownIcon = () => (jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17" }) }));
21365
+ const CheckIcon = () => (jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }));
21370
21366
  const FeedbackButtons = ({ messageId, currentFeedback, onFeedback, }) => {
21371
21367
  const [isSubmitting, setIsSubmitting] = react.useState(false);
21372
21368
  const [submitted, setSubmitted] = react.useState(false);
@@ -21387,9 +21383,9 @@ const FeedbackButtons = ({ messageId, currentFeedback, onFeedback, }) => {
21387
21383
  }
21388
21384
  };
21389
21385
  if (submitted) {
21390
- return (jsxRuntime.jsxs("div", { className: "ai-chat-feedback ai-chat-feedback-submitted", children: [jsxRuntime.jsx("span", { className: "ai-chat-feedback-checkmark", children: "\u2713" }), jsxRuntime.jsx("span", { className: "ai-chat-feedback-text", children: "Feedback submitted" })] }));
21386
+ return (jsxRuntime.jsxs("div", { className: "ai-chat-feedback ai-chat-feedback-submitted", children: [jsxRuntime.jsx("span", { className: "ai-chat-feedback-checkmark", children: jsxRuntime.jsx(CheckIcon, {}) }), jsxRuntime.jsx("span", { className: "ai-chat-feedback-text", children: "Thanks for feedback" })] }));
21391
21387
  }
21392
- return (jsxRuntime.jsxs("div", { className: "ai-chat-feedback", children: [jsxRuntime.jsx("button", { className: `ai-chat-feedback-button ${currentFeedback === 'positive' ? 'active' : ''}`, onClick: () => handleFeedback('positive'), disabled: isSubmitting || !!currentFeedback, "aria-label": "Helpful", title: "This was helpful", children: "\uD83D\uDC4D" }), jsxRuntime.jsx("button", { className: `ai-chat-feedback-button ${currentFeedback === 'negative' ? 'active' : ''}`, onClick: () => handleFeedback('negative'), disabled: isSubmitting || !!currentFeedback, "aria-label": "Not helpful", title: "This was not helpful", children: "\uD83D\uDC4E" })] }));
21388
+ return (jsxRuntime.jsxs("div", { className: "ai-chat-feedback", children: [jsxRuntime.jsx("button", { className: `ai-chat-feedback-button ${currentFeedback === 'positive' ? 'active' : ''}`, onClick: () => handleFeedback('positive'), disabled: isSubmitting || !!currentFeedback, "aria-label": "Helpful", title: "This was helpful", children: jsxRuntime.jsx(ThumbsUpIcon, {}) }), jsxRuntime.jsx("button", { className: `ai-chat-feedback-button ${currentFeedback === 'negative' ? 'active' : ''}`, onClick: () => handleFeedback('negative'), disabled: isSubmitting || !!currentFeedback, "aria-label": "Not helpful", title: "This was not helpful", children: jsxRuntime.jsx(ThumbsDownIcon, {}) })] }));
21393
21389
  };
21394
21390
 
21395
21391
  const Sources = ({ sources, displayMode = 'with-score' }) => {
@@ -21423,10 +21419,21 @@ const Message = ({ message, showTimestamp = true, enableFeedback = true, showSou
21423
21419
  // Only render assistant bubble if there's textual content
21424
21420
  return jsxRuntime.jsx(Markdown, { children: aiContent });
21425
21421
  };
21422
+ const formatToolName = (name) => {
21423
+ // Remove common prefixes like "action_" or "tool_"
21424
+ let formatted = name.replace(/^(action_|tool_)/, '');
21425
+ // Convert snake_case to Title Case
21426
+ formatted = formatted
21427
+ .split('_')
21428
+ .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
21429
+ .join(' ');
21430
+ return formatted;
21431
+ };
21426
21432
  const renderTool = () => {
21427
21433
  const tool = message.message;
21428
- const toolName = (toolCallNameById && toolCallNameById[tool.tool_call_id]) || 'Tool';
21429
- return (jsxRuntime.jsxs("div", { className: "ai-chat-tool-message", title: toolName, children: [jsxRuntime.jsxs("span", { className: "tool-finished", children: [jsxRuntime.jsx("span", { className: "tool-icon", children: "\uD83D\uDD27" }), jsxRuntime.jsx("span", { className: "tool-check", children: "\u2713" })] }), jsxRuntime.jsx("span", { className: "tool-name", children: toolName })] }));
21434
+ const rawToolName = (toolCallNameById && toolCallNameById[tool.tool_call_id]) || 'Tool';
21435
+ const displayName = formatToolName(rawToolName);
21436
+ return (jsxRuntime.jsxs("div", { className: "ai-chat-tool-message", title: rawToolName, children: [jsxRuntime.jsx("span", { className: "tool-finished", children: jsxRuntime.jsx("span", { className: "tool-check", children: "\u2713" }) }), jsxRuntime.jsx("span", { className: "tool-name", children: displayName })] }));
21430
21437
  };
21431
21438
  // If assistant message has no content (e.g., only started a tool), render nothing at all
21432
21439
  if (isAssistant && !aiHasContent) {
@@ -21435,7 +21442,7 @@ const Message = ({ message, showTimestamp = true, enableFeedback = true, showSou
21435
21442
  const showTimestampForThis = showTimestamp && !isTool && !(isAssistant && !aiHasContent);
21436
21443
  return (jsxRuntime.jsxs("div", { className: `ai-chat-message ${messageClass}`, children: [isTool ? (
21437
21444
  // Render tool call completion as a standalone, non-bubble event
21438
- renderTool()) : (jsxRuntime.jsx("div", { className: "ai-chat-message-content", children: isAssistant ? (renderAssistant()) : isSystem ? (jsxRuntime.jsxs("div", { className: "ai-chat-system-message", children: [jsxRuntime.jsx("span", { className: "system-icon", children: "\u2139\uFE0F" }), message.message.content] })) : (userMessage) })), showTimestampForThis && (jsxRuntime.jsx("div", { className: "ai-chat-message-timestamp", children: formatTime(message.timestamp) })), isAssistant && aiHasContent && showSources && message.sources && message.sources.length > 0 && (jsxRuntime.jsx(Sources, { sources: message.sources, displayMode: sourceDisplayMode })), isAssistant && aiHasContent && enableFeedback && onFeedback && (jsxRuntime.jsx(FeedbackButtons, { messageId: message.id, currentFeedback: message.feedback, onFeedback: onFeedback }))] }));
21445
+ renderTool()) : (jsxRuntime.jsx("div", { className: "ai-chat-message-content", children: isAssistant ? (renderAssistant()) : isSystem ? (jsxRuntime.jsxs("div", { className: "ai-chat-system-message", children: [jsxRuntime.jsx("span", { className: "system-icon", children: "\u2139\uFE0F" }), message.message.content] })) : (userMessage) })), showTimestampForThis && (jsxRuntime.jsxs("div", { className: "ai-chat-message-meta", children: [jsxRuntime.jsx("span", { className: "ai-chat-message-timestamp", children: formatTime(message.timestamp) }), isAssistant && aiHasContent && enableFeedback && onFeedback && (jsxRuntime.jsx(FeedbackButtons, { messageId: message.id, currentFeedback: message.feedback, onFeedback: onFeedback }))] })), isAssistant && aiHasContent && showSources && message.sources && message.sources.length > 0 && (jsxRuntime.jsx(Sources, { sources: message.sources, displayMode: sourceDisplayMode }))] }));
21439
21446
  };
21440
21447
 
21441
21448
  const TypingIndicator = () => {
@@ -21546,13 +21553,14 @@ const MessageInput = ({ onSend, placeholder = 'Type your message...', disabled =
21546
21553
  textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;
21547
21554
  }
21548
21555
  };
21549
- console.log('[MessageInput] separateFromChat:', separateFromChat, 'class:', separateFromChat ? 'separate' : 'integrated');
21556
+ const canSend = value.trim() || selectedFiles.length > 0;
21550
21557
  return (jsxRuntime.jsxs("div", { className: `ai-chat-input-container ${separateFromChat ? 'separate' : 'integrated'}`, children: [selectedFiles.length > 0 && (jsxRuntime.jsx("div", { className: "ai-chat-file-list", children: selectedFiles.map((file, index) => {
21551
21558
  const ext = getFileExtension(file.name);
21552
- return (jsxRuntime.jsxs("div", { className: "ai-chat-file-item", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-extension", children: ext }), jsxRuntime.jsxs("div", { className: "ai-chat-file-info", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-name", children: file.name }), jsxRuntime.jsx("span", { className: "ai-chat-file-size", children: formatFileSize(file.size) })] }), jsxRuntime.jsx("button", { className: "ai-chat-file-remove", onClick: () => handleRemoveFile(index), "aria-label": "Remove file", children: "\u00D7" })] }, index));
21553
- }) })), jsxRuntime.jsxs("div", { className: "ai-chat-input-wrapper", children: [enableFileUpload && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", onChange: handleFileSelect, style: { display: 'none' }, multiple: true, accept: ALLOWED_EXTENSIONS.join(','), "aria-label": "File input" }), jsxRuntime.jsx("button", { className: "ai-chat-file-button", onClick: () => fileInputRef.current?.click(), disabled: disabled, "aria-label": "Attach file", children: jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) }) })] })), jsxRuntime.jsx("textarea", { ref: textareaRef, className: "ai-chat-input", value: value, onChange: handleChange, onKeyDown: handleKeyDown, placeholder: placeholder, disabled: disabled, rows: 1, "aria-label": "Message input" }), jsxRuntime.jsx("button", { className: "ai-chat-send-button", onClick: handleSend, disabled: disabled || (!value.trim() && selectedFiles.length === 0), "aria-label": "Send message", children: jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("line", { x1: "22", y1: "2", x2: "11", y2: "13" }), jsxRuntime.jsx("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })] }) })] })] }));
21559
+ return (jsxRuntime.jsxs("div", { className: "ai-chat-file-item", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-extension", children: ext }), jsxRuntime.jsxs("div", { className: "ai-chat-file-info", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-name", children: file.name }), jsxRuntime.jsx("span", { className: "ai-chat-file-size", children: formatFileSize(file.size) })] }), jsxRuntime.jsx("button", { className: "ai-chat-file-remove", onClick: () => handleRemoveFile(index), "aria-label": "Remove file", children: jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M18 6L6 18M6 6l12 12" }) }) })] }, index));
21560
+ }) })), jsxRuntime.jsxs("div", { className: "ai-chat-input-wrapper", children: [enableFileUpload && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", onChange: handleFileSelect, style: { display: 'none' }, multiple: true, accept: ALLOWED_EXTENSIONS.join(','), "aria-label": "File input" }), jsxRuntime.jsx("button", { className: "ai-chat-file-button", onClick: () => fileInputRef.current?.click(), disabled: disabled, "aria-label": "Attach file", children: jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) }) })] })), jsxRuntime.jsx("textarea", { ref: textareaRef, className: "ai-chat-input", value: value, onChange: handleChange, onKeyDown: handleKeyDown, placeholder: placeholder, disabled: disabled, rows: 1, "aria-label": "Message input" }), jsxRuntime.jsx("button", { className: `ai-chat-send-button ${canSend ? 'active' : ''}`, onClick: handleSend, disabled: disabled || !canSend, "aria-label": "Send message", children: jsxRuntime.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M22 2L11 13" }), jsxRuntime.jsx("path", { d: "M22 2L15 22L11 13L2 9L22 2Z" })] }) })] })] }));
21554
21561
  };
21555
21562
 
21563
+ const ArrowIcon = () => (jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M5 12h14M12 5l7 7-7 7" }) }));
21556
21564
  const SuggestedQuestions = ({ questions, onQuestionClick, }) => {
21557
21565
  if (!questions || questions.length === 0) {
21558
21566
  return null;
@@ -21562,9 +21570,10 @@ const SuggestedQuestions = ({ questions, onQuestionClick, }) => {
21562
21570
  if (validQuestions.length === 0) {
21563
21571
  return null;
21564
21572
  }
21565
- return (jsxRuntime.jsxs("div", { className: "ai-chat-suggested-questions", children: [jsxRuntime.jsx("div", { className: "ai-chat-suggested-questions-label", children: "Suggested questions:" }), jsxRuntime.jsx("div", { className: "ai-chat-suggested-questions-list", children: validQuestions.map((question, index) => (jsxRuntime.jsxs("button", { className: "ai-chat-suggested-question", onClick: () => onQuestionClick(question), type: "button", children: [jsxRuntime.jsx("span", { className: "ai-chat-suggested-question-icon", children: "\uD83D\uDCA1" }), jsxRuntime.jsx("span", { className: "ai-chat-suggested-question-text", children: question })] }, index))) })] }));
21573
+ return (jsxRuntime.jsx("div", { className: "ai-chat-suggested-questions", children: jsxRuntime.jsx("div", { className: "ai-chat-suggested-questions-list", children: validQuestions.slice(0, 3).map((question, index) => (jsxRuntime.jsxs("button", { className: "ai-chat-suggested-question", onClick: () => onQuestionClick(question), type: "button", children: [jsxRuntime.jsx("span", { className: "ai-chat-suggested-question-text", children: question }), jsxRuntime.jsx("span", { className: "ai-chat-suggested-question-icon", children: jsxRuntime.jsx(ArrowIcon, {}) })] }, index))) }) }));
21566
21574
  };
21567
21575
 
21576
+ const MinimizeIcon = () => (jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M5 12h14" }) }));
21568
21577
  const ChatWindow = ({ messages, isLoading, isTyping, error, config, onSendMessage, onClose, onFeedback, }) => {
21569
21578
  console.log('[ChatWindow] Rendering ChatWindow component');
21570
21579
  const appearance = config?.appearance;
@@ -21601,7 +21610,8 @@ const ChatWindow = ({ messages, isLoading, isTyping, error, config, onSendMessag
21601
21610
  setShowSuggestedQuestions(false);
21602
21611
  onSendMessage(question);
21603
21612
  };
21604
- return (jsxRuntime.jsxs("div", { className: `ai-chat-window size-${size}`, role: "dialog", "aria-label": "Chat window", children: [jsxRuntime.jsxs("div", { className: "ai-chat-header", children: [jsxRuntime.jsxs("div", { className: "ai-chat-header-content", children: [appearance?.logo && (jsxRuntime.jsx("img", { src: appearance.logo, alt: "Logo", className: "ai-chat-logo" })), jsxRuntime.jsx("div", { className: "ai-chat-title", children: headerTitle })] }), jsxRuntime.jsx("button", { className: "ai-chat-close-button", onClick: onClose, "aria-label": "Close chat", children: jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })] }) })] }), error && (jsxRuntime.jsx("div", { className: "ai-chat-error", role: "alert", children: error })), maxMessages && userMessageCount >= maxMessages - 2 && !isLimitReached && (jsxRuntime.jsxs("div", { className: "ai-chat-warning", role: "alert", children: [maxMessages - userMessageCount, " message", maxMessages - userMessageCount !== 1 ? 's' : '', " remaining in this session"] })), isLimitReached && (jsxRuntime.jsxs("div", { className: "ai-chat-error", role: "alert", children: ["Message limit reached (", maxMessages, " messages per session). Please start a new conversation."] })), jsxRuntime.jsx(MessageList, { messages: messages, isTyping: isTyping, showTypingIndicator: behavior?.showTypingIndicator, showTimestamps: behavior?.showTimestamps, enableFeedback: behavior?.enableFeedback, showSources: behavior?.showSources, sourceDisplayMode: behavior?.sourceDisplayMode, welcomeTitle: welcomeTitle, welcomeMessage: welcomeMessage, onFeedback: onFeedback }), showSuggestedQuestions && behavior?.suggestedQuestions && behavior.suggestedQuestions.length > 0 && (jsxRuntime.jsx(SuggestedQuestions, { questions: behavior.suggestedQuestions, onQuestionClick: handleQuestionClick })), jsxRuntime.jsx(MessageInput, { onSend: onSendMessage, placeholder: isLimitReached ? 'Message limit reached' : inputPlaceholder, disabled: isLoading || isLimitReached, enableFileUpload: behavior?.enableFileUpload, separateFromChat: themeConfig?.footer?.separateFromChat })] }));
21613
+ const hasMessages = messages.length > 0;
21614
+ return (jsxRuntime.jsxs("div", { className: `ai-chat-window size-${size}`, role: "dialog", "aria-label": "Chat window", children: [jsxRuntime.jsxs("div", { className: "ai-chat-header", children: [jsxRuntime.jsxs("div", { className: "ai-chat-header-content", children: [appearance?.logo && (jsxRuntime.jsx("img", { src: appearance.logo, alt: "Logo", className: "ai-chat-logo" })), jsxRuntime.jsx("div", { className: "ai-chat-title", children: headerTitle })] }), jsxRuntime.jsx("button", { className: "ai-chat-close-button", onClick: onClose, "aria-label": "Minimize chat", children: jsxRuntime.jsx(MinimizeIcon, {}) })] }), error && (jsxRuntime.jsx("div", { className: "ai-chat-error", role: "alert", children: error })), maxMessages && userMessageCount >= maxMessages - 2 && !isLimitReached && (jsxRuntime.jsxs("div", { className: "ai-chat-warning", role: "alert", children: [maxMessages - userMessageCount, " message", maxMessages - userMessageCount !== 1 ? 's' : '', " remaining"] })), isLimitReached && (jsxRuntime.jsx("div", { className: "ai-chat-error", role: "alert", children: "Message limit reached. Please start a new conversation." })), jsxRuntime.jsx(MessageList, { messages: messages, isTyping: isTyping, showTypingIndicator: behavior?.showTypingIndicator, showTimestamps: behavior?.showTimestamps, enableFeedback: behavior?.enableFeedback, showSources: behavior?.showSources, sourceDisplayMode: behavior?.sourceDisplayMode, welcomeTitle: welcomeTitle, welcomeMessage: welcomeMessage, onFeedback: onFeedback }), showSuggestedQuestions && !hasMessages && behavior?.suggestedQuestions && behavior.suggestedQuestions.length > 0 && (jsxRuntime.jsx(SuggestedQuestions, { questions: behavior.suggestedQuestions, onQuestionClick: handleQuestionClick })), jsxRuntime.jsx(MessageInput, { onSend: onSendMessage, placeholder: isLimitReached ? 'Message limit reached' : inputPlaceholder, disabled: isLoading || isLimitReached, enableFileUpload: behavior?.enableFileUpload, separateFromChat: themeConfig?.footer?.separateFromChat })] }));
21605
21615
  };
21606
21616
 
21607
21617
  /**
@@ -21839,11 +21849,386 @@ function applyAppearanceStyles(appearance, theme = 'light') {
21839
21849
  return styles;
21840
21850
  }
21841
21851
 
21852
+ /**
21853
+ * Color Utilities for Widget Theme System
21854
+ * Handles color manipulation and auto light/dark detection
21855
+ */
21856
+ /**
21857
+ * Parse hex color to RGB values
21858
+ */
21859
+ function hexToRgb(hex) {
21860
+ const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
21861
+ return result
21862
+ ? {
21863
+ r: parseInt(result[1], 16),
21864
+ g: parseInt(result[2], 16),
21865
+ b: parseInt(result[3], 16),
21866
+ }
21867
+ : null;
21868
+ }
21869
+ /**
21870
+ * Convert RGB to hex
21871
+ */
21872
+ function rgbToHex(r, g, b) {
21873
+ return '#' + [r, g, b].map(x => {
21874
+ const hex = Math.max(0, Math.min(255, Math.round(x))).toString(16);
21875
+ return hex.length === 1 ? '0' + hex : hex;
21876
+ }).join('');
21877
+ }
21878
+ /**
21879
+ * Calculate relative luminance of a color (0-1)
21880
+ * Used to determine if a color is light or dark
21881
+ */
21882
+ function getLuminance(hex) {
21883
+ const rgb = hexToRgb(hex);
21884
+ if (!rgb)
21885
+ return 0.5;
21886
+ const { r, g, b } = rgb;
21887
+ const [rs, gs, bs] = [r, g, b].map(c => {
21888
+ c = c / 255;
21889
+ return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
21890
+ });
21891
+ return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;
21892
+ }
21893
+ /**
21894
+ * Determine if a color is considered "light" (luminance > 0.5)
21895
+ */
21896
+ function isLightColor(hex) {
21897
+ return getLuminance(hex) > 0.5;
21898
+ }
21899
+ /**
21900
+ * Lighten a color by a percentage
21901
+ */
21902
+ function lighten(hex, percent) {
21903
+ const rgb = hexToRgb(hex);
21904
+ if (!rgb)
21905
+ return hex;
21906
+ const { r, g, b } = rgb;
21907
+ const amount = 255 * (percent / 100);
21908
+ return rgbToHex(r + amount, g + amount, b + amount);
21909
+ }
21910
+ /**
21911
+ * Darken a color by a percentage
21912
+ */
21913
+ function darken(hex, percent) {
21914
+ const rgb = hexToRgb(hex);
21915
+ if (!rgb)
21916
+ return hex;
21917
+ const { r, g, b } = rgb;
21918
+ const factor = 1 - (percent / 100);
21919
+ return rgbToHex(r * factor, g * factor, b * factor);
21920
+ }
21921
+ /**
21922
+ * Create a color with alpha transparency
21923
+ */
21924
+ function withAlpha(hex, alpha) {
21925
+ const rgb = hexToRgb(hex);
21926
+ if (!rgb)
21927
+ return hex;
21928
+ return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${alpha})`;
21929
+ }
21930
+ /**
21931
+ * Get contrasting text color (black or white) for a background
21932
+ */
21933
+ function getContrastText(backgroundColor) {
21934
+ return isLightColor(backgroundColor) ? '#1f2937' : '#ffffff';
21935
+ }
21936
+ /**
21937
+ * Generate a complete color palette from an accent color for light mode
21938
+ */
21939
+ function generateLightPalette(accentColor) {
21940
+ return {
21941
+ // Accent variations
21942
+ accent: accentColor,
21943
+ accentHover: darken(accentColor, 10),
21944
+ accentSubtle: withAlpha(accentColor, 0.1),
21945
+ // Backgrounds
21946
+ background: '#ffffff',
21947
+ backgroundSubtle: '#f9fafb',
21948
+ backgroundMuted: '#f3f4f6',
21949
+ // Text
21950
+ text: '#1f2937',
21951
+ textMuted: '#6b7280',
21952
+ textSubtle: '#9ca3af',
21953
+ // Borders
21954
+ border: '#e5e7eb',
21955
+ borderSubtle: '#f3f4f6',
21956
+ // Message bubbles
21957
+ userBubble: accentColor,
21958
+ userBubbleText: getContrastText(accentColor),
21959
+ assistantBubble: '#f3f4f6',
21960
+ assistantBubbleText: '#1f2937',
21961
+ // Input
21962
+ inputBackground: '#ffffff',
21963
+ inputBorder: '#d1d5db',
21964
+ inputBorderFocus: accentColor,
21965
+ // Shadow
21966
+ shadow: 'rgba(0, 0, 0, 0.1)',
21967
+ };
21968
+ }
21969
+ /**
21970
+ * Generate a complete color palette from an accent color for dark mode
21971
+ */
21972
+ function generateDarkPalette(accentColor) {
21973
+ // Lighten accent for better visibility on dark backgrounds
21974
+ const adjustedAccent = isLightColor(accentColor) ? accentColor : lighten(accentColor, 15);
21975
+ return {
21976
+ // Accent variations
21977
+ accent: adjustedAccent,
21978
+ accentHover: lighten(adjustedAccent, 10),
21979
+ accentSubtle: withAlpha(adjustedAccent, 0.15),
21980
+ // Backgrounds
21981
+ background: '#1a1a2e',
21982
+ backgroundSubtle: '#16213e',
21983
+ backgroundMuted: '#0f3460',
21984
+ // Text
21985
+ text: '#f9fafb',
21986
+ textMuted: '#d1d5db',
21987
+ textSubtle: '#9ca3af',
21988
+ // Borders
21989
+ border: '#374151',
21990
+ borderSubtle: '#1f2937',
21991
+ // Message bubbles
21992
+ userBubble: adjustedAccent,
21993
+ userBubbleText: getContrastText(adjustedAccent),
21994
+ assistantBubble: '#0f3460',
21995
+ assistantBubbleText: '#f9fafb',
21996
+ // Input
21997
+ inputBackground: '#16213e',
21998
+ inputBorder: '#374151',
21999
+ inputBorderFocus: adjustedAccent,
22000
+ // Shadow
22001
+ shadow: 'rgba(0, 0, 0, 0.3)',
22002
+ };
22003
+ }
22004
+
22005
+ /**
22006
+ * Generate Theme Styles
22007
+ * Creates CSS custom properties from accent color and theme mode
22008
+ */
22009
+ /**
22010
+ * Generate all CSS custom properties for the widget
22011
+ */
22012
+ function generateThemeStyles(appearance, theme) {
22013
+ const palette = theme === 'dark'
22014
+ ? generateDarkPalette(appearance.accentColor)
22015
+ : generateLightPalette(appearance.accentColor);
22016
+ // Liquid glass design - frosted glass with transparency
22017
+ const isLight = theme === 'light';
22018
+ return {
22019
+ // ========================================================================
22020
+ // BUTTON (FAB) - Liquid Glass Style
22021
+ // ========================================================================
22022
+ '--button-color': palette.accent,
22023
+ '--button-opacity': '1',
22024
+ '--button-size': '56px',
22025
+ '--button-icon-color': palette.userBubbleText,
22026
+ '--button-border-radius': '50%',
22027
+ '--button-border-width': '0px',
22028
+ '--button-border-color': palette.accent,
22029
+ '--button-border-opacity': '1',
22030
+ '--button-backdrop-blur': '20px',
22031
+ '--button-shadow': `0 4px 24px rgba(0, 0, 0, 0.15), 0 2px 8px rgba(0, 0, 0, 0.1)`,
22032
+ // ========================================================================
22033
+ // CARD/WINDOW - Frosted Glass
22034
+ // ========================================================================
22035
+ '--card-background': isLight ? 'rgba(255, 255, 255, 0.88)' : 'rgba(15, 20, 25, 0.92)',
22036
+ '--card-opacity': '1',
22037
+ '--card-border-radius': '28px',
22038
+ '--card-border-width': '1px',
22039
+ '--card-border-color': isLight ? 'rgba(0, 0, 0, 0.06)' : 'rgba(255, 255, 255, 0.06)',
22040
+ '--card-border-color-rgba': isLight ? 'rgba(0, 0, 0, 0.06)' : 'rgba(255, 255, 255, 0.06)',
22041
+ '--card-border-opacity': '1',
22042
+ '--card-backdrop-blur': '24px',
22043
+ '--card-shadow': isLight
22044
+ ? '0 25px 50px -12px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.05)'
22045
+ : '0 25px 50px -12px rgba(0,0,0,0.5), 0 0 0 1px rgba(255,255,255,0.1)',
22046
+ // ========================================================================
22047
+ // HEADER - Transparent with pure blur (no color)
22048
+ // ========================================================================
22049
+ '--header-background': 'transparent',
22050
+ '--header-opacity': '1',
22051
+ '--header-text-color': palette.accent,
22052
+ '--header-border-bottom-width': '0px',
22053
+ '--header-border-bottom-color': 'transparent',
22054
+ '--header-border-bottom-opacity': '0',
22055
+ '--header-backdrop-blur': '16px',
22056
+ // ========================================================================
22057
+ // CHAT AREA - Transparent
22058
+ // ========================================================================
22059
+ '--chat-background': 'transparent',
22060
+ '--chat-opacity': '1',
22061
+ '--welcome-color': palette.text,
22062
+ '--message-text-color': palette.text,
22063
+ // ========================================================================
22064
+ // MESSAGE BUBBLES - Glass style
22065
+ // ========================================================================
22066
+ '--bubble-user-color': palette.userBubble,
22067
+ '--bubble-user-opacity': '1',
22068
+ '--user-message-text': palette.userBubbleText,
22069
+ '--bubble-assistant-color': isLight ? 'rgba(255, 255, 255, 0.8)' : 'rgba(255, 255, 255, 0.1)',
22070
+ '--bubble-assistant-opacity': '1',
22071
+ '--assistant-message-text': isLight ? palette.text : '#f0f0f0',
22072
+ '--bubble-border-radius': '20px',
22073
+ '--bubble-border-width': isLight ? '1px' : '1px',
22074
+ '--bubble-border-color': isLight ? 'rgba(0, 0, 0, 0.05)' : 'rgba(255, 255, 255, 0.08)',
22075
+ '--bubble-border-opacity': '1',
22076
+ '--bubble-opacity': '1',
22077
+ // ========================================================================
22078
+ // FOOTER/INPUT - Glass style
22079
+ // ========================================================================
22080
+ '--footer-background': isLight ? 'rgba(255, 255, 255, 0.85)' : 'rgba(30, 30, 40, 0.8)',
22081
+ '--footer-opacity': '1',
22082
+ '--footer-border-top-width': '1px',
22083
+ '--footer-border-top-color': isLight ? 'rgba(255, 255, 255, 0.5)' : 'rgba(255, 255, 255, 0.08)',
22084
+ '--footer-border-top-opacity': '1',
22085
+ '--footer-backdrop-blur': '20px',
22086
+ '--input-background': isLight ? 'rgba(255, 255, 255, 0.9)' : 'rgba(255, 255, 255, 0.08)',
22087
+ '--input-background-opacity': '1',
22088
+ '--input-border-radius': '28px',
22089
+ '--input-border-width': '1.5px',
22090
+ '--input-border-color': isLight ? 'rgba(0, 0, 0, 0.08)' : 'rgba(255, 255, 255, 0.1)',
22091
+ '--input-border-opacity': '1',
22092
+ '--input-shadow': `inset 0 1px 3px rgba(0, 0, 0, 0.04), 0 2px 8px rgba(0, 0, 0, 0.04)`,
22093
+ '--send-button-background': palette.accent,
22094
+ '--send-button-opacity': '1',
22095
+ '--send-button-border-radius': '50%',
22096
+ '--send-button-border-width': '0px',
22097
+ '--send-button-border-color': palette.accent,
22098
+ '--send-button-border-opacity': '1',
22099
+ // ========================================================================
22100
+ // HOVER STATES
22101
+ // ========================================================================
22102
+ '--hover-button-scale': '1.08',
22103
+ '--hover-button-opacity': '1',
22104
+ '--hover-input-border-color': palette.accent,
22105
+ '--hover-send-button-opacity': '1',
22106
+ '--hover-close-button-opacity': '1',
22107
+ // ========================================================================
22108
+ // ACTIVE STATES
22109
+ // ========================================================================
22110
+ '--active-input-border-color': palette.accent,
22111
+ '--active-input-shadow': `0 0 0 4px ${withAlpha(palette.accent, 0.15)}`,
22112
+ // ========================================================================
22113
+ // GENERAL
22114
+ // ========================================================================
22115
+ '--primary-color': palette.accent,
22116
+ '--background-color': palette.background,
22117
+ '--text-color': palette.text,
22118
+ '--border-color': palette.border,
22119
+ // ========================================================================
22120
+ // GLASS EFFECTS
22121
+ // ========================================================================
22122
+ '--glass-blur': '20px',
22123
+ '--glass-saturation': '180%',
22124
+ };
22125
+ }
22126
+
22127
+ /**
22128
+ * Auto Theme Detector
22129
+ * Detects whether the widget should use light or dark mode
22130
+ * based on the background behind it
22131
+ */
22132
+ /**
22133
+ * Sample the background color behind an element
22134
+ * Uses multiple sampling points for accuracy
22135
+ */
22136
+ function sampleBackgroundColor(element) {
22137
+ const rect = element.getBoundingClientRect();
22138
+ const centerX = rect.left + rect.width / 2;
22139
+ const centerY = rect.top + rect.height / 2;
22140
+ // Try to get the element behind our widget
22141
+ // Temporarily hide the element to sample what's behind
22142
+ const originalVisibility = element.style.visibility;
22143
+ element.style.visibility = 'hidden';
22144
+ // Sample the center point
22145
+ const elementBehind = document.elementFromPoint(centerX, centerY);
22146
+ // Restore visibility
22147
+ element.style.visibility = originalVisibility;
22148
+ if (!elementBehind) {
22149
+ return '#ffffff'; // Default to white
22150
+ }
22151
+ // Get computed background color
22152
+ const computedStyle = window.getComputedStyle(elementBehind);
22153
+ let bgColor = computedStyle.backgroundColor;
22154
+ // If transparent, walk up the DOM tree
22155
+ if (bgColor === 'rgba(0, 0, 0, 0)' || bgColor === 'transparent') {
22156
+ let parent = elementBehind.parentElement;
22157
+ while (parent) {
22158
+ const parentStyle = window.getComputedStyle(parent);
22159
+ bgColor = parentStyle.backgroundColor;
22160
+ if (bgColor !== 'rgba(0, 0, 0, 0)' && bgColor !== 'transparent') {
22161
+ break;
22162
+ }
22163
+ parent = parent.parentElement;
22164
+ }
22165
+ }
22166
+ // If still transparent, check body/html
22167
+ if (bgColor === 'rgba(0, 0, 0, 0)' || bgColor === 'transparent') {
22168
+ const bodyStyle = window.getComputedStyle(document.body);
22169
+ bgColor = bodyStyle.backgroundColor;
22170
+ if (bgColor === 'rgba(0, 0, 0, 0)' || bgColor === 'transparent') {
22171
+ return '#ffffff'; // Default to white
22172
+ }
22173
+ }
22174
+ return rgbaToHex(bgColor);
22175
+ }
22176
+ /**
22177
+ * Convert rgba/rgb string to hex
22178
+ */
22179
+ function rgbaToHex(rgba) {
22180
+ // Handle rgb(r, g, b) or rgba(r, g, b, a)
22181
+ const match = rgba.match(/rgba?\((\d+),\s*(\d+),\s*(\d+)/);
22182
+ if (!match)
22183
+ return '#ffffff';
22184
+ const r = parseInt(match[1]);
22185
+ const g = parseInt(match[2]);
22186
+ const b = parseInt(match[3]);
22187
+ return '#' + [r, g, b].map(x => {
22188
+ const hex = x.toString(16);
22189
+ return hex.length === 1 ? '0' + hex : hex;
22190
+ }).join('');
22191
+ }
22192
+ /**
22193
+ * Determine if the background is dark
22194
+ */
22195
+ function isBackgroundDark(backgroundColor) {
22196
+ const luminance = getLuminance(backgroundColor);
22197
+ return luminance < 0.5;
22198
+ }
22199
+ /**
22200
+ * Auto-detect theme based on background
22201
+ */
22202
+ function detectTheme(element) {
22203
+ const bgColor = sampleBackgroundColor(element);
22204
+ return isBackgroundDark(bgColor) ? 'dark' : 'light';
22205
+ }
22206
+ /**
22207
+ * Create a MutationObserver to watch for theme changes
22208
+ */
22209
+ function createThemeObserver(element, callback) {
22210
+ const observer = new MutationObserver(() => {
22211
+ const theme = detectTheme(element);
22212
+ callback(theme);
22213
+ });
22214
+ // Observe body for class/style changes (common for theme switching)
22215
+ observer.observe(document.body, {
22216
+ attributes: true,
22217
+ attributeFilter: ['class', 'style', 'data-theme'],
22218
+ });
22219
+ // Also observe html element
22220
+ observer.observe(document.documentElement, {
22221
+ attributes: true,
22222
+ attributeFilter: ['class', 'style', 'data-theme'],
22223
+ });
22224
+ return observer;
22225
+ }
22226
+
21842
22227
  function styleInject(css, ref) {
21843
22228
  if ( ref === void 0 ) ref = {};
21844
22229
  var insertAt = ref.insertAt;
21845
22230
 
21846
- if (typeof document === 'undefined') { return; }
22231
+ if (!css || typeof document === 'undefined') { return; }
21847
22232
 
21848
22233
  var head = document.head || document.getElementsByTagName('head')[0];
21849
22234
  var style = document.createElement('style');
@@ -21866,7 +22251,10 @@ function styleInject(css, ref) {
21866
22251
  }
21867
22252
  }
21868
22253
 
21869
- var css_248z = ".ai-chat-widget{--primary-color:#07f;--background-color:#fff;--text-color:#1f2937;--border-color:#e5e7eb;--user-message-bg:var(--primary-color);--user-message-text:#fff;--assistant-message-bg:#f3f4f6;--assistant-message-text:#374151;--input-bg:#fff;--input-border:#d1d5db;--shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--button-color:#07f;--button-size:56px;--button-border-radius:28px;--button-border-width:0px;--button-border-color:#07f;--button-opacity:1;--button-backdrop-blur:0px;--button-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--card-background:#fff;--card-border-radius:16px;--card-border-width:0px;--card-border-color:#e5e7eb;--card-opacity:1;--card-backdrop-blur:0px;--card-shadow:0 25px 50px -12px rgba(0,0,0,.25);--header-background:#07f;--header-text-color:#fff;--header-font-size:18px;--header-border-bottom-width:0px;--header-border-bottom-color:#e5e7eb;--header-opacity:1;--header-backdrop-blur:0px;--chat-background:#fff;--chat-opacity:1;--chat-backdrop-blur:0px;--welcome-font-size:16px;--welcome-color:#1f2937;--welcome-opacity:1;--bubble-user-color:#07f;--bubble-assistant-color:#f3f4f6;--bubble-border-radius:16px;--bubble-border-width:0px;--bubble-border-color:#e5e7eb;--bubble-opacity:1;--typing-animation-color:#f3f4f6;--typing-animation-opacity:1;--typing-animation-border-width:0px;--typing-animation-border-color:#e5e7eb;--typing-animation-border-radius:16px;--footer-background:#fff;--footer-border-top-width:1px;--footer-border-top-color:#e5e7eb;--footer-opacity:1;--footer-backdrop-blur:0px;--input-background:#fff;--input-border-radius:24px;--input-border-width:1.5px;--input-border-color:#d1d5db;--input-opacity:1;--input-shadow:0 1px 2px 0 rgba(0,0,0,.05);--send-button-background:#07f;--send-button-border-radius:20px;--send-button-border-width:0px;--send-button-border-color:#07f;--send-button-opacity:1;--hover-button-scale:1.05;--hover-button-opacity:0.9;--hover-input-border-color:#9ca3af;--hover-send-button-opacity:0.85;--hover-close-button-opacity:1;--active-input-border-color:#07f;--active-input-shadow:0 0 0 3px rgba(0,119,255,.1);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.ai-chat-widget.dark{--background-color:#001d3d;--text-color:#f9fafb;--border-color:#374151;--assistant-message-bg:#036;--assistant-message-text:#e5e7eb;--input-bg:#002855;--input-border:#374151}.ai-chat-widget.dark .ai-chat-message.system .ai-chat-message-content{background-color:#78350f;color:#fef3c7}.ai-chat-widget.dark .ai-chat-message.tool .ai-chat-message-content{background-color:#1e3a8a;color:#dbeafe}.ai-chat-widget-container{font-size:14px;line-height:1.5;position:fixed;z-index:9999}.ai-chat-widget-container.bottom-right{bottom:20px;right:20px}.ai-chat-widget-container.bottom-left{bottom:20px;left:20px}.ai-chat-widget-container.top-right{right:20px;top:20px}.ai-chat-widget-container.top-left{left:20px;top:20px}.ai-chat-button{align-items:center;backdrop-filter:blur(var(--button-backdrop-blur));-webkit-backdrop-filter:blur(var(--button-backdrop-blur));background-color:var(--button-color);border:var(--button-border-width) solid var(--button-border-color);border-radius:var(--button-border-radius);box-shadow:var(--button-shadow);color:#fff;cursor:pointer;display:flex;height:var(--button-size);justify-content:center;opacity:var(--button-opacity);transition:all .3s cubic-bezier(.4,0,.2,1);width:var(--button-size)}.ai-chat-button:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);opacity:var(--hover-button-opacity);transform:scale(var(--hover-button-scale))}.ai-chat-button:active{transform:scale(.95)}.ai-chat-button-svg{height:50%;min-height:24px;min-width:24px;width:50%}.ai-chat-button-icon{font-size:1.5em;line-height:1}.ai-chat-window{border-radius:var(--card-border-radius);box-shadow:0 0 0 var(--card-border-width) var(--card-border-color-rgba,var(--card-border-color)),var(--card-shadow);display:flex;flex-direction:column;overflow:hidden;position:absolute}.ai-chat-window>*{position:relative;z-index:1}.ai-chat-window:before{backdrop-filter:blur(var(--card-backdrop-blur));-webkit-backdrop-filter:blur(var(--card-backdrop-blur));background-color:var(--card-background);border-radius:var(--card-border-radius);content:\"\";inset:0;opacity:var(--card-opacity);pointer-events:none;position:absolute;z-index:0}.ai-chat-widget-container.bottom-right .ai-chat-window{bottom:0;right:0}.ai-chat-widget-container.bottom-left .ai-chat-window{bottom:0;left:0}.ai-chat-widget-container.top-right .ai-chat-window{right:0;top:0}.ai-chat-widget-container.top-left .ai-chat-window{left:0;top:0}.ai-chat-window.size-small{height:500px;width:380px}.ai-chat-window.size-medium{height:650px;width:440px}.ai-chat-window.size-large{height:750px;width:520px}.ai-chat-header{align-items:center;border-bottom:var(--header-border-bottom-width) solid var(--header-border-bottom-color);box-shadow:0 2px 8px rgba(0,0,0,.1);color:var(--header-text-color);display:flex;justify-content:space-between;padding:20px;position:relative}.ai-chat-header:before{backdrop-filter:blur(var(--header-backdrop-blur));-webkit-backdrop-filter:blur(var(--header-backdrop-blur));background-color:var(--header-background);content:\"\";inset:0;opacity:var(--header-opacity);pointer-events:none;position:absolute;z-index:0}.ai-chat-header>*{position:relative;z-index:1}.ai-chat-header-content{align-items:center;display:flex;flex:1;gap:12px}.ai-chat-logo{border-radius:50%;height:32px;object-fit:cover;width:32px}.ai-chat-title{color:var(--header-text-color);font-size:var(--header-font-size);font-weight:600;letter-spacing:-.01em}.ai-chat-close-button{align-items:center;background:none;border:none;border-radius:8px;color:var(--header-text-color);cursor:pointer;display:flex;justify-content:center;opacity:.9;padding:8px;transition:all .2s ease}.ai-chat-close-button:hover{background-color:hsla(0,0%,100%,.15);opacity:var(--hover-close-button-opacity);transform:scale(1.05)}.ai-chat-messages{background-color:var(--chat-background);display:flex;flex:1;flex-direction:column;gap:16px;overflow-x:hidden;overflow-y:auto;padding:20px;position:relative}.ai-chat-window:has(.ai-chat-input-container.integrated) .ai-chat-messages{padding-bottom:100px}.ai-chat-messages:before{backdrop-filter:blur(var(--chat-backdrop-blur));-webkit-backdrop-filter:blur(var(--chat-backdrop-blur));background-color:var(--chat-background);bottom:0;content:\"\";left:0;opacity:var(--chat-opacity);pointer-events:none;position:absolute;right:0;top:0;z-index:0}.ai-chat-messages>*{position:relative;z-index:1}.ai-chat-messages::-webkit-scrollbar{width:6px}.ai-chat-messages::-webkit-scrollbar-track{background:transparent}.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:var(--input-border)}.ai-chat-message{animation:slideIn .2s ease-out;display:flex;flex-direction:column;gap:4px}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.ai-chat-message.user{align-items:flex-end}.ai-chat-message.assistant{align-items:flex-start}.ai-chat-message.system{align-items:center}.ai-chat-message.tool{align-items:flex-start}.ai-chat-message-content{word-wrap:break-word;border:var(--bubble-border-width) solid var(--bubble-border-color);border-radius:var(--bubble-border-radius);font-size:15px;line-height:1.6;max-width:80%;opacity:var(--bubble-opacity);padding:12px 16px}.ai-chat-message.user .ai-chat-message-content{background-color:var(--bubble-user-color);border-bottom-right-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.1);color:var(--user-message-text)}.ai-chat-message.assistant .ai-chat-message-content{background-color:var(--bubble-assistant-color);border-bottom-left-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.05);color:var(--assistant-message-text)}.ai-chat-message.system .ai-chat-message-content{background-color:#fef3c7;border-radius:8px;color:#92400e;font-size:12px;font-style:italic;max-width:90%;text-align:center}.ai-chat-message.tool .ai-chat-message-content{background-color:#dbeafe;border-bottom-left-radius:4px;color:#1e40af;font-family:Courier New,monospace;font-size:13px}.ai-chat-tool-indicators{display:flex;gap:6px;margin-top:6px}.tool-indicator{align-items:center;background:#dbeafe;border-radius:50%;color:#1e40af;display:inline-flex;height:18px;justify-content:center;overflow:hidden;position:relative;width:18px}.tool-indicator .icon{font-size:12px;line-height:1;z-index:1}.tool-indicator.started:after{animation:ai-spin 1s linear infinite;border:2px solid rgba(30,64,175,.25);border-radius:50%;border-top-color:#1e40af;content:\"\";inset:0;position:absolute}@keyframes ai-spin{to{transform:rotate(1turn)}}.ai-chat-tool-message{background:linear-gradient(135deg,#ecfdf5,#d1fae5);border:1px solid #a7f3d0;border-radius:9999px;box-shadow:0 1px 2px rgba(0,0,0,.04),0 1px 8px rgba(16,185,129,.08);color:#065f46;gap:10px;padding:6px 12px}.ai-chat-tool-message,.tool-finished{align-items:center;display:inline-flex}.tool-finished{background:rgba(16,185,129,.12);border-radius:50%;color:#059669;height:22px;justify-content:center;position:relative;width:22px}.tool-finished .tool-icon{font-size:14px}.tool-finished .tool-check{align-items:center;background:#10b981;border-radius:50%;bottom:-3px;box-shadow:0 1px 2px rgba(0,0,0,.12);color:#fff;display:inline-flex;font-size:10px;height:14px;justify-content:center;position:absolute;right:-3px;width:14px}.tool-name{font-size:12px;font-weight:600}.ai-chat-message-timestamp{color:rgba(0,0,0,.6);filter:invert(1) grayscale(1) contrast(1.2);font-size:11px;mix-blend-mode:difference;padding:0 4px}.ai-chat-welcome{color:var(--welcome-color);opacity:var(--welcome-opacity);padding:48px 24px;text-align:center}.ai-chat-welcome-title{color:var(--welcome-color);font-size:calc(var(--welcome-font-size)*1.5);font-weight:700;letter-spacing:-.02em;margin-bottom:12px}.ai-chat-welcome-text{color:var(--welcome-color);font-size:var(--welcome-font-size);line-height:1.6}.ai-chat-typing{align-items:center;background-color:var(--assistant-message-bg);border-radius:12px;border-bottom-left-radius:4px;display:flex;gap:4px;max-width:80px;padding:10px 14px}.ai-chat-typing-dot{animation:typingBounce 1.4s infinite;background-color:#9ca3af;border-radius:50%;height:8px;width:8px}.ai-chat-typing-dot:nth-child(2){animation-delay:.2s}.ai-chat-typing-dot:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-8px)}}.ai-chat-input-container{padding:20px;position:relative}.ai-chat-input-container.separate{border-top:var(--footer-border-top-width) solid var(--footer-border-top-color)}.ai-chat-input-container.integrated{bottom:0;left:0;padding-bottom:calc(20px + var(--card-border-width));position:absolute;right:0;z-index:10}.ai-chat-input-container.separate:before{backdrop-filter:blur(var(--footer-backdrop-blur));-webkit-backdrop-filter:blur(var(--footer-backdrop-blur));background-color:var(--footer-background);content:\"\";inset:0;opacity:var(--footer-opacity);pointer-events:none;position:absolute;z-index:0}.ai-chat-input-container>*{position:relative;z-index:1}.ai-chat-input-wrapper{align-items:center;background-color:var(--input-background);border:var(--input-border-width) solid var(--input-border-color);border-radius:var(--input-border-radius);display:flex;gap:0;opacity:var(--input-opacity);padding:6px 6px 6px 16px;transition:all .2s ease}.ai-chat-input-wrapper:hover{border-color:var(--hover-input-border-color)}.ai-chat-input-wrapper:focus-within{border-color:var(--active-input-border-color);box-shadow:var(--active-input-shadow)}.ai-chat-input{background-color:transparent;border:none;border-radius:0;color:var(--text-color);flex:1;font-family:inherit;font-size:15px;max-height:120px;min-height:40px;outline:none;padding:10px 0;resize:none}.ai-chat-input::placeholder{color:#9ca3af}.ai-chat-send-button{align-items:center;background-color:var(--send-button-background);border:var(--send-button-border-width) solid var(--send-button-border-color);border-radius:var(--send-button-border-radius);color:#fff;cursor:pointer;display:flex;flex-shrink:0;font-weight:500;height:40px;justify-content:center;min-width:40px;opacity:var(--send-button-opacity);padding:0;transition:all .2s ease;width:40px}.ai-chat-send-button:hover:not(:disabled){opacity:var(--hover-send-button-opacity);transform:scale(1.05)}.ai-chat-send-button:active:not(:disabled){transform:scale(.98)}.ai-chat-send-button:disabled{cursor:not-allowed;opacity:.5}.ai-chat-file-button{align-items:center;background:none;border:none;border-radius:6px;color:var(--text-color);cursor:pointer;display:flex;justify-content:center;padding:8px;transition:background-color .2s}.ai-chat-file-button:hover:not(:disabled){background-color:rgba(0,0,0,.05)}.ai-chat-file-button:disabled{cursor:not-allowed;opacity:.5}.ai-chat-file-list{display:flex;flex-wrap:wrap;gap:8px;padding:8px 12px}.ai-chat-file-item{align-items:center;background-color:rgba(0,0,0,.05);border-radius:6px;display:flex;font-size:12px;gap:8px;padding:6px 10px}.ai-chat-file-extension{background-color:var(--primary-color);border-radius:3px;color:#fff;display:inline-block;font-size:10px;font-weight:600;min-width:40px;padding:2px 6px;text-align:center;text-transform:uppercase}.ai-chat-file-info{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.ai-chat-file-name{font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-file-size{color:var(--text-muted);font-size:10px;opacity:.7}.ai-chat-file-remove{background:none;border:none;cursor:pointer;font-size:18px;line-height:1;opacity:.6;padding:0 4px;transition:opacity .2s}.ai-chat-file-remove:hover{opacity:1}.ai-chat-message-attachments{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.ai-chat-message-attachment{align-items:center;background-color:rgba(0,0,0,.08);border-radius:4px;display:inline-flex;font-size:11px;gap:4px;padding:3px 8px}.ai-chat-attachment-icon{font-size:12px}.ai-chat-attachment-ext{background-color:var(--primary-color);border-radius:2px;color:#fff;display:inline-block;font-size:9px;font-weight:600;padding:1px 4px;text-transform:uppercase}.ai-chat-attachment-name{max-width:120px;opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-sources{background-color:rgba(0,0,0,.02);border-radius:6px;font-size:12px;margin-top:8px;overflow:hidden}.ai-chat-sources-toggle{align-items:center;background:none;border:none;cursor:pointer;display:flex;gap:6px;padding:8px 10px;text-align:left;transition:background-color .2s;width:100%}.ai-chat-sources-toggle:hover{background-color:rgba(0,0,0,.03)}.ai-chat-sources-icon{color:var(--text-muted);font-size:10px;transition:transform .2s}.ai-chat-sources-title{color:var(--text-color);flex:1;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.ai-chat-source-item{border-top:1px solid rgba(0,0,0,.05);color:#6b7280;display:flex;gap:8px;padding:8px 10px}.ai-chat-source-item:last-child{border-bottom:none}.ai-chat-source-number{color:var(--primary-color);flex-shrink:0;font-weight:600}.ai-chat-source-details{display:flex;flex:1;flex-direction:column;gap:4px}.ai-chat-source-score{color:#9ca3af;font-size:11px}.ai-chat-source-content{color:#6b7280;font-size:11px;font-style:italic;line-height:1.4}.ai-chat-source-metadata{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}.ai-chat-source-meta-item{background-color:rgba(0,0,0,.05);border-radius:3px;color:#6b7280;font-size:10px;padding:2px 6px}.ai-chat-feedback{align-items:center;display:flex;gap:8px;margin-top:8px;min-height:32px}.ai-chat-feedback-button{align-items:center;background:none;border:none;border-radius:6px;cursor:pointer;display:flex;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));font-size:16px;gap:4px;overflow:hidden;padding:6px 10px;position:relative;transition:all .2s ease}.ai-chat-feedback-button:hover:not(:disabled){background-color:rgba(0,0,0,.05);transform:scale(1.2)}.ai-chat-feedback-button:active:not(:disabled){transform:scale(.95)}.ai-chat-feedback-button:disabled{cursor:not-allowed;opacity:.5}.ai-chat-feedback-button.active{background-color:rgba(0,119,255,.1)}.ai-chat-feedback-submitted{align-items:center;animation:feedbackMorph .3s cubic-bezier(.34,1.56,.64,1);display:flex;gap:6px}.ai-chat-feedback-checkmark{animation:checkmarkPop .3s cubic-bezier(.34,1.56,.64,1);color:#10b981;font-size:16px;font-weight:700}.ai-chat-feedback-text{animation:textSlideIn .3s ease;color:#10b981;font-size:13px;font-weight:500}@keyframes feedbackMorph{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes checkmarkPop{0%{opacity:0;transform:scale(0) rotate(-45deg)}50%{transform:scale(1.3) rotate(0deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}@keyframes textSlideIn{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.ai-chat-error{align-items:flex-start;background-color:#fee2e2;border-left:4px solid #dc2626;border-radius:8px;color:#991b1b;display:flex;font-size:14px;font-weight:500;gap:8px;line-height:1.5;margin:8px 16px;padding:12px 16px}.ai-chat-error:before{content:\"⚠️\";flex-shrink:0;font-size:16px}.ai-chat-warning{background-color:#fef3c7;border-radius:8px;color:#92400e;font-size:13px;margin:8px 16px;padding:12px}.ai-chat-suggested-questions{margin-bottom:8px;padding:12px 16px}.ai-chat-suggested-questions-label{color:#6b7280;font-size:12px;font-weight:500;margin-bottom:8px}.ai-chat-suggested-questions-list{display:flex;flex-direction:column;gap:8px}.ai-chat-suggested-question{align-items:center;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;color:#374151;cursor:pointer;display:flex;font-size:14px;gap:8px;padding:10px 12px;text-align:left;transition:all .2s ease;width:100%}.ai-chat-suggested-question:hover{background-color:#f3f4f6;border-color:var(--ai-chat-primary-color,#6366f1);box-shadow:0 2px 4px rgba(0,0,0,.05);transform:translateY(-1px)}.ai-chat-suggested-question:active{transform:translateY(0)}.ai-chat-suggested-question-icon{flex-shrink:0;font-size:16px}.ai-chat-suggested-question-text{flex:1;line-height:1.4}@media (max-width:480px){.ai-chat-window{border-radius:0!important;bottom:0!important;height:100%!important;left:0!important;position:fixed!important;right:0!important;top:0!important;width:100%!important}.ai-chat-widget-container{bottom:20px!important;right:20px!important}.ai-chat-suggested-question{font-size:13px;padding:9px 10px}}.ai-chat-action-approval{background:linear-gradient(135deg,#07f,#001d3d);border-radius:16px;box-shadow:0 4px 12px rgba(0,119,255,.3);color:#fff;margin:16px;padding:16px}.ai-chat-action-approval-content{align-items:flex-start;display:flex;gap:12px;margin-bottom:16px}.ai-chat-action-approval-icon{align-items:center;background:hsla(0,0%,100%,.2);border-radius:8px;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.ai-chat-action-approval-text{flex:1}.ai-chat-action-approval-title{font-size:15px;font-weight:600;margin-bottom:4px}.ai-chat-action-approval-description{font-size:13px;line-height:1.4;opacity:.95}.ai-chat-action-approval-buttons{display:flex;gap:8px;justify-content:flex-end}.ai-chat-action-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:500;gap:6px;padding:8px 16px;transition:all .2s ease}.ai-chat-action-button:disabled{cursor:not-allowed;opacity:.6}.ai-chat-action-button-reject{background:hsla(0,0%,100%,.2);color:#fff}.ai-chat-action-button-reject:hover:not(:disabled){background:hsla(0,0%,100%,.3)}.ai-chat-action-button-approve{background:#fff;color:#07f}.ai-chat-action-button-approve:hover:not(:disabled){background:#f0f0f0;box-shadow:0 2px 8px rgba(0,0,0,.15);transform:translateY(-1px)}.ai-chat-action-spinner{animation:ai-chat-spin .6s linear infinite;border:2px solid rgba(0,119,255,.3);border-radius:50%;border-top-color:#07f;display:inline-block;height:14px;width:14px}@keyframes ai-chat-spin{to{transform:rotate(1turn)}}";
22254
+ var css_248z$1 = ".ai-chat-widget{--primary-color:#07f;--background-color:#fff;--text-color:#1f2937;--border-color:#e5e7eb;--user-message-bg:var(--primary-color);--user-message-text:#fff;--assistant-message-bg:#f3f4f6;--assistant-message-text:#374151;--input-bg:#fff;--input-border:#d1d5db;--shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--button-color:#07f;--button-size:56px;--button-border-radius:28px;--button-border-width:0px;--button-border-color:#07f;--button-opacity:1;--button-backdrop-blur:0px;--button-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--card-background:#fff;--card-border-radius:16px;--card-border-width:0px;--card-border-color:#e5e7eb;--card-opacity:1;--card-backdrop-blur:0px;--card-shadow:0 25px 50px -12px rgba(0,0,0,.25);--header-background:#07f;--header-text-color:#fff;--header-font-size:18px;--header-border-bottom-width:0px;--header-border-bottom-color:#e5e7eb;--header-opacity:1;--header-backdrop-blur:0px;--chat-background:#fff;--chat-opacity:1;--chat-backdrop-blur:0px;--welcome-font-size:16px;--welcome-color:#1f2937;--welcome-opacity:1;--bubble-user-color:#07f;--bubble-assistant-color:#f3f4f6;--bubble-border-radius:16px;--bubble-border-width:0px;--bubble-border-color:#e5e7eb;--bubble-opacity:1;--typing-animation-color:#f3f4f6;--typing-animation-opacity:1;--typing-animation-border-width:0px;--typing-animation-border-color:#e5e7eb;--typing-animation-border-radius:16px;--footer-background:#fff;--footer-border-top-width:1px;--footer-border-top-color:#e5e7eb;--footer-opacity:1;--footer-backdrop-blur:0px;--input-background:#fff;--input-border-radius:24px;--input-border-width:1.5px;--input-border-color:#d1d5db;--input-opacity:1;--input-shadow:0 1px 2px 0 rgba(0,0,0,.05);--send-button-background:#07f;--send-button-border-radius:20px;--send-button-border-width:0px;--send-button-border-color:#07f;--send-button-opacity:1;--hover-button-scale:1.05;--hover-button-opacity:0.9;--hover-input-border-color:#9ca3af;--hover-send-button-opacity:0.85;--hover-close-button-opacity:1;--active-input-border-color:#07f;--active-input-shadow:0 0 0 3px rgba(0,119,255,.1);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.ai-chat-widget.dark{--background-color:#001d3d;--text-color:#f9fafb;--border-color:#374151;--assistant-message-bg:#036;--assistant-message-text:#e5e7eb;--input-bg:#002855;--input-border:#374151}.ai-chat-widget.dark .ai-chat-message.system .ai-chat-message-content{background-color:#78350f;color:#fef3c7}.ai-chat-widget.dark .ai-chat-message.tool .ai-chat-message-content{background-color:#1e3a8a;color:#dbeafe}.ai-chat-widget-container{font-size:14px;line-height:1.5;position:fixed;z-index:9999}.ai-chat-widget-container.bottom-right{bottom:20px;right:20px}.ai-chat-widget-container.bottom-left{bottom:20px;left:20px}.ai-chat-widget-container.top-right{right:20px;top:20px}.ai-chat-widget-container.top-left{left:20px;top:20px}.ai-chat-button{align-items:center;backdrop-filter:blur(var(--button-backdrop-blur));-webkit-backdrop-filter:blur(var(--button-backdrop-blur));background-color:var(--button-color);border:var(--button-border-width) solid var(--button-border-color);border-radius:var(--button-border-radius);box-shadow:var(--button-shadow);color:#fff;cursor:pointer;display:flex;height:var(--button-size);justify-content:center;opacity:var(--button-opacity);transition:all .3s cubic-bezier(.4,0,.2,1);width:var(--button-size)}.ai-chat-button:hover{opacity:.9}.ai-chat-button:active{opacity:.8}.ai-chat-button-svg{height:50%;min-height:24px;min-width:24px;width:50%}.ai-chat-button-icon{font-size:1.5em;line-height:1}.ai-chat-window{border-radius:var(--card-border-radius);box-shadow:0 0 0 var(--card-border-width) var(--card-border-color-rgba,var(--card-border-color)),var(--card-shadow);display:flex;flex-direction:column;overflow:hidden;position:absolute}.ai-chat-window>*{position:relative;z-index:1}.ai-chat-window:before{backdrop-filter:blur(var(--card-backdrop-blur));-webkit-backdrop-filter:blur(var(--card-backdrop-blur));background-color:var(--card-background);border-radius:var(--card-border-radius);content:\"\";inset:0;opacity:var(--card-opacity);pointer-events:none;position:absolute;z-index:0}.ai-chat-widget-container.bottom-right .ai-chat-window{bottom:calc(var(--button-size, 60px) + 16px);right:0}.ai-chat-widget-container.bottom-left .ai-chat-window{bottom:calc(var(--button-size, 60px) + 16px);left:0}.ai-chat-widget-container.top-right .ai-chat-window{right:0;top:calc(var(--button-size, 60px) + 16px)}.ai-chat-widget-container.top-left .ai-chat-window{left:0;top:calc(var(--button-size, 60px) + 16px)}.ai-chat-button{z-index:1}.ai-chat-window{z-index:2}.ai-chat-window.size-small{height:500px;width:380px}.ai-chat-window.size-medium{height:650px;width:440px}.ai-chat-window.size-large{height:750px;width:520px}.ai-chat-logo{border-radius:50%;height:32px;object-fit:cover;width:32px}.ai-chat-messages::-webkit-scrollbar{width:6px}.ai-chat-messages::-webkit-scrollbar-track{background:transparent}.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:var(--input-border)}.ai-chat-message{display:flex;flex-direction:column;gap:4px}.ai-chat-message.user{align-items:flex-end}.ai-chat-message.assistant{align-items:flex-start}.ai-chat-message.system{align-items:center}.ai-chat-message.tool{align-items:flex-start}.ai-chat-message-content{word-wrap:break-word;border:var(--bubble-border-width) solid var(--bubble-border-color);border-radius:var(--bubble-border-radius);font-size:15px;line-height:1.6;max-width:80%;opacity:var(--bubble-opacity);padding:12px 16px}.ai-chat-message.user .ai-chat-message-content{background-color:var(--bubble-user-color);border-bottom-right-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.1);color:var(--user-message-text)}.ai-chat-message.assistant .ai-chat-message-content{background-color:var(--bubble-assistant-color,#f3f4f6);border:1px solid var(--bubble-border-color,rgba(0,0,0,.08));border-radius:var(--bubble-border-radius,16px);border-bottom-left-radius:4px;box-shadow:none;color:var(--assistant-message-text);max-width:85%;padding:12px 16px}.ai-chat-message.assistant .ai-chat-message-content p{margin:0 0 12px}.ai-chat-message.assistant .ai-chat-message-content p:last-child{margin-bottom:0}.ai-chat-message.assistant .ai-chat-message-content ol,.ai-chat-message.assistant .ai-chat-message-content ul{margin:8px 0 12px;padding-left:24px}.ai-chat-message.assistant .ai-chat-message-content li{line-height:1.5;margin:6px 0}.ai-chat-message.assistant .ai-chat-message-content li::marker{color:var(--primary-color,#07f)}.ai-chat-message.assistant .ai-chat-message-content ol li::marker{font-weight:600}.ai-chat-message.assistant .ai-chat-message-content strong{font-weight:600}.ai-chat-message.assistant .ai-chat-message-content em{font-style:italic}.ai-chat-message.assistant .ai-chat-message-content code{background-color:rgba(0,0,0,.06);border-radius:4px;font-family:SF Mono,Consolas,Monaco,monospace;font-size:.9em;padding:2px 6px}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content code{background-color:hsla(0,0%,100%,.1)}.ai-chat-message.assistant .ai-chat-message-content pre{background-color:rgba(0,0,0,.06);border-radius:8px;margin:8px 0 12px;overflow-x:auto;padding:12px}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content pre{background-color:hsla(0,0%,100%,.08)}.ai-chat-message.assistant .ai-chat-message-content pre code{background-color:transparent;border-radius:0;padding:0}.ai-chat-message.assistant .ai-chat-message-content blockquote{border-left:3px solid var(--primary-color,#07f);color:var(--text-muted,#6b7280);margin:8px 0 12px;padding:4px 0 4px 12px}.ai-chat-message.assistant .ai-chat-message-content a{color:var(--primary-color,#07f);text-decoration:underline}.ai-chat-message.assistant .ai-chat-message-content a:hover{opacity:.8}.ai-chat-message.assistant .ai-chat-message-content h1,.ai-chat-message.assistant .ai-chat-message-content h2,.ai-chat-message.assistant .ai-chat-message-content h3,.ai-chat-message.assistant .ai-chat-message-content h4,.ai-chat-message.assistant .ai-chat-message-content h5,.ai-chat-message.assistant .ai-chat-message-content h6{font-weight:600;line-height:1.3;margin:16px 0 8px}.ai-chat-message.assistant .ai-chat-message-content h1:first-child,.ai-chat-message.assistant .ai-chat-message-content h2:first-child,.ai-chat-message.assistant .ai-chat-message-content h3:first-child{margin-top:0}.ai-chat-message.assistant .ai-chat-message-content hr{border:none;border-top:1px solid var(--border-color,#e5e7eb);margin:12px 0}.ai-chat-message.system .ai-chat-message-content{background-color:#fef3c7;border-radius:8px;color:#92400e;font-size:12px;font-style:italic;max-width:90%;text-align:center}.ai-chat-message.tool .ai-chat-message-content{background-color:#dbeafe;border-bottom-left-radius:4px;color:#1e40af;font-family:Courier New,monospace;font-size:13px}.ai-chat-tool-indicators{display:flex;gap:6px;margin-top:6px}.tool-indicator{align-items:center;background:#dbeafe;border-radius:50%;color:#1e40af;display:inline-flex;height:18px;justify-content:center;overflow:hidden;position:relative;width:18px}.tool-indicator .icon{font-size:12px;line-height:1;z-index:1}.tool-indicator.started:after{animation:ai-spin 1s linear infinite;border:2px solid rgba(30,64,175,.25);border-radius:50%;border-top-color:#1e40af;content:\"\";inset:0;position:absolute}@keyframes ai-spin{to{transform:rotate(1turn)}}.ai-chat-tool-message{align-items:center;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.2);border-radius:20px;color:#059669;display:inline-flex;gap:8px;padding:8px 14px}.ai-chat-widget.dark .ai-chat-tool-message{background:rgba(16,185,129,.15);border-color:rgba(16,185,129,.25);color:#34d399}.tool-finished{align-items:center;display:inline-flex;font-size:14px;justify-content:center}.tool-finished .tool-icon{display:none}.tool-finished .tool-check{font-size:14px;font-weight:700}.tool-name{font-size:13px;font-weight:500}.ai-chat-message-timestamp{color:rgba(0,0,0,.6);filter:invert(1) grayscale(1) contrast(1.2);mix-blend-mode:difference;padding:0 4px}.ai-chat-welcome{align-items:center;color:var(--welcome-color);display:flex;flex-direction:column;justify-content:center;min-height:200px;opacity:var(--welcome-opacity);padding:60px 32px 40px;text-align:center}.ai-chat-welcome-title{color:var(--primary-color);font-size:28px;font-weight:700;letter-spacing:-.03em;margin-bottom:12px}.ai-chat-welcome-text{color:var(--assistant-message-text);font-size:16px;line-height:1.6;max-width:280px;opacity:.7}.ai-chat-typing{align-items:center;background-color:var(--assistant-message-bg);border-radius:12px;border-bottom-left-radius:4px;display:flex;gap:4px;max-width:80px;padding:10px 14px}.ai-chat-typing-dot{animation:typingBounce 1.4s infinite;background-color:#9ca3af;border-radius:50%;height:8px;width:8px}.ai-chat-typing-dot:nth-child(2){animation-delay:.2s}.ai-chat-typing-dot:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-8px)}}.ai-chat-file-button{align-items:center;background:none;border:none;border-radius:6px;color:var(--text-color);cursor:pointer;display:flex;justify-content:center;padding:8px;transition:background-color .2s}.ai-chat-file-button:hover:not(:disabled){background-color:rgba(0,0,0,.05)}.ai-chat-file-button:disabled{cursor:not-allowed;opacity:.5}.ai-chat-file-list{display:flex;flex-wrap:wrap;gap:8px;padding:8px 12px}.ai-chat-file-item{align-items:center;background-color:rgba(0,0,0,.05);border-radius:6px;display:flex;font-size:12px;gap:8px;padding:6px 10px}.ai-chat-file-extension{background-color:var(--primary-color);border-radius:3px;color:#fff;display:inline-block;font-size:10px;font-weight:600;min-width:40px;padding:2px 6px;text-align:center;text-transform:uppercase}.ai-chat-file-info{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.ai-chat-file-name{font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-file-size{color:var(--text-muted);font-size:10px;opacity:.7}.ai-chat-file-remove{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;justify-content:center;opacity:.5;padding:4px;transition:opacity .15s ease}.ai-chat-file-remove:hover{opacity:1}.ai-chat-message-attachments{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.ai-chat-message-attachment{align-items:center;background-color:rgba(0,0,0,.08);border-radius:4px;display:inline-flex;font-size:11px;gap:4px;padding:3px 8px}.ai-chat-attachment-icon{font-size:12px}.ai-chat-attachment-ext{background-color:var(--primary-color);border-radius:2px;color:#fff;display:inline-block;font-size:9px;font-weight:600;padding:1px 4px;text-transform:uppercase}.ai-chat-attachment-name{max-width:120px;opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-sources{background-color:rgba(0,0,0,.02);border-radius:6px;font-size:12px;margin-top:8px;overflow:hidden}.ai-chat-sources-toggle{align-items:center;background:none;border:none;cursor:pointer;display:flex;gap:6px;padding:8px 10px;text-align:left;transition:background-color .2s;width:100%}.ai-chat-sources-toggle:hover{background-color:rgba(0,0,0,.03)}.ai-chat-sources-icon{color:var(--text-muted);font-size:10px;transition:transform .2s}.ai-chat-sources-title{color:var(--text-color);flex:1;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.ai-chat-source-item{border-top:1px solid rgba(0,0,0,.05);color:#6b7280;display:flex;gap:8px;padding:8px 10px}.ai-chat-source-item:last-child{border-bottom:none}.ai-chat-source-number{color:var(--primary-color);flex-shrink:0;font-weight:600}.ai-chat-source-details{display:flex;flex:1;flex-direction:column;gap:4px}.ai-chat-source-score{color:#9ca3af;font-size:11px}.ai-chat-source-content{color:#6b7280;font-size:11px;font-style:italic;line-height:1.4}.ai-chat-source-metadata{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}.ai-chat-source-meta-item{background-color:rgba(0,0,0,.05);border-radius:3px;color:#6b7280;font-size:10px;padding:2px 6px}.ai-chat-message-meta{align-items:center;display:inline-flex;gap:6px;height:20px}.ai-chat-message-timestamp{color:#71717a;font-size:11px;line-height:1}.ai-chat-feedback{gap:0}.ai-chat-feedback,.ai-chat-feedback-button{align-items:center;display:inline-flex;height:20px}.ai-chat-feedback-button{background:none!important;border:none;border-radius:0;color:#71717a;cursor:pointer;justify-content:center;padding:0 4px;transition:color .15s ease}.ai-chat-feedback-button:hover:not(:disabled){background:none!important;color:#52525b}.ai-chat-feedback-button:active:not(:disabled){opacity:.7}.ai-chat-feedback-button:disabled{cursor:not-allowed;opacity:.4}.ai-chat-feedback-button.active{background:none!important;color:var(--primary-color,#07f)}.ai-chat-feedback-submitted{align-items:center;animation:feedbackMorph .3s cubic-bezier(.34,1.56,.64,1);display:flex;gap:6px}.ai-chat-feedback-checkmark{animation:checkmarkPop .3s cubic-bezier(.34,1.56,.64,1);color:#10b981;font-size:16px;font-weight:700}.ai-chat-feedback-text{animation:textSlideIn .3s ease;color:#10b981;font-size:13px;font-weight:500}@keyframes feedbackMorph{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes checkmarkPop{0%{opacity:0;transform:scale(0) rotate(-45deg)}50%{transform:scale(1.3) rotate(0deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}@keyframes textSlideIn{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.ai-chat-error{align-items:flex-start;background-color:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.2);border-radius:12px;color:#ef4444;display:flex;font-size:14px;font-weight:500;gap:10px;line-height:1.5;margin:8px 16px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-error{background-color:rgba(239,68,68,.15);border-color:rgba(239,68,68,.25);color:#fca5a5}.ai-chat-error:before{align-items:center;background:rgba(239,68,68,.2);border-radius:50%;content:\"⚠\";display:flex;flex-shrink:0;font-size:14px;font-weight:700;height:20px;justify-content:center;width:20px}.ai-chat-widget.dark .ai-chat-error:before{background:rgba(239,68,68,.25)}.ai-chat-warning{background-color:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.2);border-radius:12px;color:#d97706;font-size:13px;margin:8px 16px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-warning{background-color:rgba(245,158,11,.15);border-color:rgba(245,158,11,.25);color:#fbbf24}.ai-chat-suggested-questions{bottom:80px;left:0;padding:0 20px 16px;position:absolute;right:0;z-index:5}.ai-chat-suggested-questions-list{display:flex;flex-direction:column;gap:8px}.ai-chat-suggested-question{align-items:center;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;box-shadow:0 1px 3px rgba(0,0,0,.04);color:#374151;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:12px;justify-content:space-between;padding:14px 16px;text-align:left;transition:all .15s ease;width:100%}.ai-chat-suggested-question:hover{background:#f9fafb;border-color:rgba(0,0,0,.12);box-shadow:0 2px 8px rgba(0,0,0,.06)}.ai-chat-suggested-question:active{transform:scale(.98)}.ai-chat-suggested-question-text{flex:1;line-height:1.4}.ai-chat-suggested-question-icon{color:var(--primary-color,#07f);flex-shrink:0;opacity:.7;transition:transform .15s ease,opacity .15s ease}.ai-chat-suggested-question:hover .ai-chat-suggested-question-icon{opacity:1;transform:translateX(3px)}@media (max-width:480px){.ai-chat-window{border-radius:0!important;bottom:0!important;height:100%!important;left:0!important;position:fixed!important;right:0!important;top:0!important;width:100%!important}.ai-chat-widget-container{bottom:20px!important;right:20px!important}.ai-chat-suggested-question{font-size:13px;padding:9px 10px}}.ai-chat-action-approval{background:linear-gradient(135deg,#07f,#001d3d);border-radius:16px;box-shadow:0 4px 12px rgba(0,119,255,.3);color:#fff;margin:16px;padding:16px}.ai-chat-action-approval-content{align-items:flex-start;display:flex;gap:12px;margin-bottom:16px}.ai-chat-action-approval-icon{align-items:center;background:hsla(0,0%,100%,.2);border-radius:8px;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.ai-chat-action-approval-text{flex:1}.ai-chat-action-approval-title{font-size:15px;font-weight:600;margin-bottom:4px}.ai-chat-action-approval-description{font-size:13px;line-height:1.4;opacity:.95}.ai-chat-action-approval-buttons{display:flex;gap:8px;justify-content:flex-end}.ai-chat-action-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:500;gap:6px;padding:8px 16px;transition:all .2s ease}.ai-chat-action-button:disabled{cursor:not-allowed;opacity:.6}.ai-chat-action-button-reject{background:hsla(0,0%,100%,.2);color:#fff}.ai-chat-action-button-reject:hover:not(:disabled){background:hsla(0,0%,100%,.3)}.ai-chat-action-button-approve{background:#fff;color:#07f}.ai-chat-action-button-approve:hover:not(:disabled){background:#f0f0f0;box-shadow:0 2px 8px rgba(0,0,0,.15);transform:translateY(-1px)}.ai-chat-action-spinner{animation:ai-chat-spin .6s linear infinite;border:2px solid rgba(0,119,255,.3);border-radius:50%;border-top-color:#07f;display:inline-block;height:14px;width:14px}@keyframes ai-chat-spin{to{transform:rotate(1turn)}}";
22255
+ styleInject(css_248z$1);
22256
+
22257
+ var css_248z = ".ai-chat-widget{--spring-bounce:cubic-bezier(0.34,1.56,0.64,1);--spring-smooth:cubic-bezier(0.4,0,0.2,1);--spring-snappy:cubic-bezier(0.2,0,0,1);--duration-fast:0.2s;--duration-normal:0.35s;--duration-slow:0.5s}.ai-chat-button{align-items:center;background:var(--button-color,var(--primary-color,#07f));border:none;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.15);cursor:pointer;display:flex;height:48px;justify-content:center;overflow:hidden;position:relative;transition:opacity .15s ease;width:48px}.ai-chat-button:hover{opacity:.9}.ai-chat-button:active{opacity:.8}.ai-chat-button-svg{height:20px;transition:transform .15s ease;width:20px}.ai-chat-button.is-open .ai-chat-button-svg{transform:rotate(0deg)}.ai-chat-window{animation:windowOpen var(--duration-slow) var(--spring-bounce);background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 4px 24px rgba(0,0,0,.12),0 1px 3px rgba(0,0,0,.08);display:flex;flex-direction:column;overflow:hidden;position:absolute;transform-origin:bottom right}.ai-chat-widget.dark .ai-chat-window{background:#18181b;border-color:#27272a}@keyframes windowOpen{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.ai-chat-window.closing{animation:windowClose var(--duration-normal) var(--spring-smooth) forwards}@keyframes windowClose{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.9) translateY(20px)}}.ai-chat-header{align-items:center;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;padding:16px 20px;position:relative;z-index:10}.ai-chat-widget.dark .ai-chat-header{background:#18181b;border-bottom-color:#27272a}.ai-chat-header-content{align-items:center;display:flex;flex:1;gap:12px}.ai-chat-logo{border-radius:10px;height:36px;object-fit:cover;width:36px}.ai-chat-title{color:#18181b;font-size:15px;font-weight:600;letter-spacing:-.01em}.ai-chat-widget.dark .ai-chat-title{color:#fafafa}.ai-chat-close-button{align-items:center;background:transparent;border:none;border-radius:8px;color:#a1a1aa;cursor:pointer;display:flex;height:32px;justify-content:center;padding:0;transition:all .15s ease;width:32px}.ai-chat-widget.dark .ai-chat-close-button{color:#71717a}.ai-chat-close-button:hover{background:#f4f4f5;color:#52525b}.ai-chat-widget.dark .ai-chat-close-button:hover{background:#27272a;color:#a1a1aa}.ai-chat-close-button:active{transform:scale(.95)}.ai-chat-messages{-webkit-overflow-scrolling:touch;background:#f4f4f5;display:flex;flex:1;flex-direction:column;gap:12px;overflow-x:hidden;overflow-y:auto;padding:16px 16px 90px;position:relative;scroll-behavior:smooth}.ai-chat-widget.dark .ai-chat-messages{background:#18181b}.ai-chat-messages::-webkit-scrollbar{width:4px}.ai-chat-messages::-webkit-scrollbar-track{background:transparent}.ai-chat-messages::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:4px}.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.25)}.ai-chat-message{animation:messageSlideIn var(--duration-normal) var(--spring-bounce);display:flex;flex-direction:column;gap:6px}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.ai-chat-message-content{word-wrap:break-word;border-radius:12px;font-size:14px;line-height:1.5;max-width:85%;padding:8px 14px}.ai-chat-message.user .ai-chat-message-content{background:var(--bubble-user-color,var(--primary-color,#07f));border-bottom-right-radius:4px;color:#fff;margin-left:auto}.ai-chat-message.assistant .ai-chat-message-content{background:#fff;border:1px solid #e5e7eb;border-bottom-left-radius:4px;color:#374151}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content{background:#18181b;border-color:#27272a;color:#e4e4e7}.ai-chat-typing{align-items:center;animation:messageSlideIn var(--duration-normal) var(--spring-bounce);background:#fff;border:1px solid #e5e7eb;border-radius:12px;border-bottom-left-radius:4px;display:flex;gap:4px;max-width:64px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-typing{background:#18181b;border-color:#27272a}.ai-chat-typing-dot{animation:typingPulse 1.4s ease-in-out infinite;background:linear-gradient(135deg,var(--primary-color) 0,color-mix(in srgb,var(--primary-color) 70%,#000) 100%);border-radius:50%;height:8px;width:8px}.ai-chat-typing-dot:nth-child(2){animation-delay:.15s}.ai-chat-typing-dot:nth-child(3){animation-delay:.3s}@keyframes typingPulse{0%,60%,to{opacity:.4;transform:translateY(0) scale(1)}30%{opacity:1;transform:translateY(-6px) scale(1.1)}}.ai-chat-input-container{background:transparent;bottom:0;left:0;padding:0 16px 16px;position:absolute;right:0;z-index:10}.ai-chat-input-container:before{background:linear-gradient(0deg,#f4f4f5 80%,transparent);bottom:0;content:\"\";height:48px;left:0;pointer-events:none;position:absolute;right:0;z-index:-1}.ai-chat-widget.dark .ai-chat-input-container:before{background:linear-gradient(0deg,#18181b 80%,transparent)}.ai-chat-input-wrapper{align-items:center;background:#f4f4f5;border:1px solid #e5e7eb;border-radius:9999px;display:flex;gap:0;padding:4px 4px 4px 16px;position:relative;transition:all .15s ease;z-index:5}.ai-chat-widget.dark .ai-chat-input-wrapper{background:#27272a;border-color:#3f3f46}.ai-chat-input-wrapper:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 2px rgba(var(--primary-color-rgb,0,119,255),.15)}.ai-chat-input{background:transparent;border:none;color:var(--text-color);flex:1;font-family:inherit;font-size:14px;line-height:1.4;max-height:100px;min-height:20px;outline:none;padding:8px 0;resize:none}.ai-chat-input::placeholder{color:rgba(0,0,0,.35)}.ai-chat-widget.dark .ai-chat-input::placeholder{color:hsla(0,0%,100%,.35)}.ai-chat-send-button{align-items:center;background:transparent;border:none;border-radius:8px;color:#a1a1aa;cursor:pointer;display:flex;flex-shrink:0;height:36px;justify-content:center;padding:0;transition:all .15s ease;width:36px}.ai-chat-widget.dark .ai-chat-send-button{color:#71717a}.ai-chat-send-button.active{background:var(--primary-color,#07f);color:#fff}.ai-chat-send-button.active:hover:not(:disabled){opacity:.9}.ai-chat-send-button:active:not(:disabled){transform:scale(.95)}.ai-chat-send-button:disabled{cursor:not-allowed;opacity:.4}.ai-chat-tool-message{align-items:center;animation:toolPulse 2s ease-in-out infinite;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:linear-gradient(135deg,rgba(16,185,129,.15),rgba(16,185,129,.08));border:1px solid rgba(16,185,129,.2);border-radius:16px;display:inline-flex;gap:10px;padding:10px 16px}@keyframes toolPulse{0%,to{box-shadow:0 0 0 0 rgba(16,185,129,.2)}50%{box-shadow:0 0 0 8px rgba(16,185,129,0)}}.tool-finished{align-items:center;animation:toolComplete .5s var(--spring-bounce);background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;color:#fff;display:inline-flex;height:28px;justify-content:center;position:relative;width:28px}@keyframes toolComplete{0%{transform:scale(0) rotate(-180deg)}to{transform:scale(1) rotate(0deg)}}.tool-indicator{align-items:center;background:linear-gradient(135deg,rgba(59,130,246,.2),rgba(59,130,246,.1));border-radius:50%;color:#3b82f6;display:inline-flex;height:24px;justify-content:center;position:relative;width:24px}.tool-indicator.started:after{animation:toolSpin .8s linear infinite;border:2px solid transparent;border-radius:50%;border-top-color:#3b82f6;content:\"\";inset:-2px;position:absolute}@keyframes toolSpin{to{transform:rotate(1turn)}}.ai-chat-welcome{align-items:center;animation:welcomeFadeIn var(--duration-slow) var(--spring-smooth);display:flex;flex-direction:column;justify-content:center;min-height:200px;padding:60px 32px 40px;text-align:center}@keyframes welcomeFadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.ai-chat-welcome-title{color:var(--primary-color);font-size:28px;font-weight:700;letter-spacing:-.03em;margin-bottom:12px}.ai-chat-welcome-text{color:var(--text-color);font-size:16px;line-height:1.6;max-width:280px;opacity:.6}.ai-chat-suggested-questions{bottom:76px;left:0;padding:0 16px 12px;position:absolute;right:0;z-index:5}.ai-chat-suggested-questions-list{display:flex;flex-direction:column;gap:6px}.ai-chat-suggested-question{align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:10px;color:#374151;cursor:pointer;display:flex;font-size:13px;font-weight:500;gap:10px;justify-content:space-between;padding:10px 14px;text-align:left;transition:all .15s ease;width:100%}.ai-chat-widget.dark .ai-chat-suggested-question{background:#18181b;border-color:#27272a;color:#e4e4e7}.ai-chat-suggested-question:hover{background:#f4f4f5;border-color:#d4d4d8}.ai-chat-widget.dark .ai-chat-suggested-question:hover{background:#27272a;border-color:#3f3f46}.ai-chat-suggested-question:active{transform:scale(.98)}.ai-chat-suggested-question-text{flex:1;line-height:1.4}.ai-chat-suggested-question-icon{color:var(--primary-color,#07f);flex-shrink:0;opacity:.7;transition:transform .15s ease,opacity .15s ease}.ai-chat-suggested-question:hover .ai-chat-suggested-question-icon{opacity:1;transform:translateX(3px)}.ai-chat-feedback-button{align-items:center;background:rgba(0,0,0,.04);border:none;border-radius:8px;cursor:pointer;display:flex;font-size:16px;gap:4px;padding:6px 10px;transition:all var(--duration-fast) var(--spring-bounce)}.ai-chat-feedback-button:hover:not(:disabled){background:rgba(0,0,0,.08);transform:scale(1.15)}.ai-chat-feedback-button:active:not(:disabled){transform:scale(.9)}.ai-chat-feedback-button.active{background:rgba(var(--primary-color-rgb,0,119,255),.15)}@media (max-width:480px){.ai-chat-window{animation:mobileSlideUp var(--duration-normal) var(--spring-smooth);border-radius:0!important;bottom:0!important;height:100%!important;left:0!important;position:fixed!important;right:0!important;top:0!important;width:100%!important}@keyframes mobileSlideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.ai-chat-header{padding-top:max(16px,env(safe-area-inset-top))}.ai-chat-input-container{padding-bottom:max(20px,env(safe-area-inset-bottom))}}";
21870
22258
  styleInject(css_248z);
21871
22259
 
21872
22260
  // Icon components mapping
@@ -21882,32 +22270,55 @@ const iconComponents = {
21882
22270
  FiUsers: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" }), jsxRuntime.jsx("circle", { cx: "9", cy: "7", r: "4" }), jsxRuntime.jsx("path", { d: "M23 21v-2a4 4 0 0 0-3-3.87" }), jsxRuntime.jsx("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })] })),
21883
22271
  FiHeadphones: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M3 18v-6a9 9 0 0 1 18 0v6" }), jsxRuntime.jsx("path", { d: "M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3zM3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z" })] })),
21884
22272
  FiCpu: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("rect", { x: "4", y: "4", width: "16", height: "16", rx: "2", ry: "2" }), jsxRuntime.jsx("rect", { x: "9", y: "9", width: "6", height: "6" }), jsxRuntime.jsx("line", { x1: "9", y1: "1", x2: "9", y2: "4" }), jsxRuntime.jsx("line", { x1: "15", y1: "1", x2: "15", y2: "4" }), jsxRuntime.jsx("line", { x1: "9", y1: "20", x2: "9", y2: "23" }), jsxRuntime.jsx("line", { x1: "15", y1: "20", x2: "15", y2: "23" }), jsxRuntime.jsx("line", { x1: "20", y1: "9", x2: "23", y2: "9" }), jsxRuntime.jsx("line", { x1: "20", y1: "14", x2: "23", y2: "14" }), jsxRuntime.jsx("line", { x1: "1", y1: "9", x2: "4", y2: "9" }), jsxRuntime.jsx("line", { x1: "1", y1: "14", x2: "4", y2: "14" })] })),
22273
+ FiChevronDown: () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("polyline", { points: "6 9 12 15 18 9" }) })),
21885
22274
  };
21886
- const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, position = 'bottom-right', theme: themeOverride, primaryColor, onOpen, onClose, onMessage, onError, }) => {
22275
+ const ChatWidget = ({ widgetId, apiUrl = window.location.origin, position = 'bottom-right', theme: themeOverride, primaryColor, onOpen, onClose, onMessage, onError, }) => {
21887
22276
  const [isOpen, setIsOpen] = react.useState(false);
22277
+ const [autoDetectedTheme, setAutoDetectedTheme] = react.useState('light');
21888
22278
  const widgetRef = react.useRef(null);
22279
+ const containerRef = react.useRef(null);
21889
22280
  const { messages, isLoading, isTyping, error, config, sendMessage, submitFeedback, } = useChat({
21890
22281
  widgetId,
21891
- apiKey,
21892
22282
  apiUrl,
21893
22283
  onMessage,
21894
22284
  onError,
21895
22285
  });
22286
+ // Auto-detect theme from background
22287
+ react.useEffect(() => {
22288
+ if (!containerRef.current)
22289
+ return;
22290
+ // Initial detection
22291
+ const detected = detectTheme(containerRef.current);
22292
+ setAutoDetectedTheme(detected);
22293
+ // Watch for theme changes on the page
22294
+ const observer = createThemeObserver(containerRef.current, (newTheme) => {
22295
+ setAutoDetectedTheme(newTheme);
22296
+ });
22297
+ // Also listen for system preference changes
22298
+ const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
22299
+ const handleMediaChange = () => {
22300
+ if (containerRef.current) {
22301
+ const detected = detectTheme(containerRef.current);
22302
+ setAutoDetectedTheme(detected);
22303
+ }
22304
+ };
22305
+ mediaQuery.addEventListener('change', handleMediaChange);
22306
+ return () => {
22307
+ observer.disconnect();
22308
+ mediaQuery.removeEventListener('change', handleMediaChange);
22309
+ };
22310
+ }, [config]);
21896
22311
  // Debug logging
21897
22312
  react.useEffect(() => {
21898
22313
  console.log('[ChatWidget] Config loaded:', config ? 'YES' : 'NO');
21899
22314
  if (config) {
21900
22315
  console.log('[ChatWidget] Config details:', {
21901
22316
  theme: config.appearance?.theme,
21902
- darkModeEnabled: config.appearance?.darkModeEnabled,
21903
- hasLightMode: !!config.appearance?.lightMode,
21904
- hasDarkMode: !!config.appearance?.darkMode,
22317
+ accentColor: config.appearance?.primaryColor,
22318
+ autoDetectedTheme,
21905
22319
  });
21906
22320
  }
21907
- }, [config]);
21908
- react.useEffect(() => {
21909
- console.log('[ChatWidget] isOpen changed:', isOpen);
21910
- }, [isOpen]);
22321
+ }, [config, autoDetectedTheme]);
21911
22322
  // Handle auto-open
21912
22323
  react.useEffect(() => {
21913
22324
  if (config?.behavior.autoOpen) {
@@ -21920,26 +22331,26 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
21920
22331
  }
21921
22332
  return undefined;
21922
22333
  }, [config, onOpen]);
21923
- // Handle close on outside click
22334
+ // Handle close on outside click - always enabled for better UX
21924
22335
  react.useEffect(() => {
21925
- if (!isOpen || !config?.appearance.closeOnOutsideClick)
22336
+ if (!isOpen)
21926
22337
  return;
21927
22338
  const handleClickOutside = (event) => {
22339
+ // Check if click is outside the widget container
21928
22340
  if (widgetRef.current && !widgetRef.current.contains(event.target)) {
21929
- console.log('[ChatWidget] Closing due to outside click');
21930
22341
  setIsOpen(false);
21931
22342
  onClose?.();
21932
22343
  }
21933
22344
  };
21934
- // Add slight delay to avoid immediate close on open
22345
+ // Small delay to prevent immediate close on open
21935
22346
  const timer = setTimeout(() => {
21936
22347
  document.addEventListener('mousedown', handleClickOutside);
21937
- }, 100);
22348
+ }, 150);
21938
22349
  return () => {
21939
22350
  clearTimeout(timer);
21940
22351
  document.removeEventListener('mousedown', handleClickOutside);
21941
22352
  };
21942
- }, [isOpen, config, onClose]);
22353
+ }, [isOpen, onClose]);
21943
22354
  // Handle close on Escape key
21944
22355
  react.useEffect(() => {
21945
22356
  if (!isOpen || !config?.appearance.closeOnEscape)
@@ -21953,48 +22364,49 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
21953
22364
  document.addEventListener('keydown', handleEscapeKey);
21954
22365
  return () => document.removeEventListener('keydown', handleEscapeKey);
21955
22366
  }, [isOpen, config, onClose]);
21956
- // Determine theme
22367
+ // Determine theme - simplified: always auto-detect unless explicitly overridden
21957
22368
  const appearanceConfig = config?.appearance;
21958
- const themeSetting = themeOverride || appearanceConfig?.theme || 'light';
21959
- const canUseDarkMode = appearanceConfig?.darkModeEnabled !== false;
21960
- // Only check system preference if dark mode is enabled
21961
- const systemPrefersDark = canUseDarkMode && typeof window !== "undefined"
21962
- ? window.matchMedia('(prefers-color-scheme: dark)').matches
21963
- : false;
21964
- const effectiveTheme = !canUseDarkMode
21965
- ? 'light' // Force light mode if dark mode is disabled
21966
- : themeSetting === 'auto'
21967
- ? (systemPrefersDark ? 'dark' : 'light')
21968
- : themeSetting === 'dark'
21969
- ? 'dark'
21970
- : 'light';
22369
+ const themeSetting = themeOverride || appearanceConfig?.theme || 'auto';
22370
+ // Use auto-detected theme, or explicit override
22371
+ const effectiveTheme = themeSetting === 'auto'
22372
+ ? autoDetectedTheme
22373
+ : themeSetting === 'dark'
22374
+ ? 'dark'
22375
+ : 'light';
21971
22376
  // Determine position (config takes priority over prop)
21972
22377
  const effectivePosition = config?.appearance.position || position;
21973
- // Apply custom styles from appearance configuration
21974
- // Use the correct theme configuration (lightMode or darkMode)
21975
- const customStyles = appearanceConfig
22378
+ // Get accent color from config or prop
22379
+ const accentColor = primaryColor || appearanceConfig?.primaryColor || '#0077FF';
22380
+ // Generate styles using simplified theme system
22381
+ const simpleAppearance = {
22382
+ accentColor,
22383
+ size: appearanceConfig?.size || 'small',
22384
+ welcomeTitle: appearanceConfig?.lightMode?.chat?.welcomeTitle,
22385
+ welcomeMessage: appearanceConfig?.welcomeMessage || appearanceConfig?.lightMode?.chat?.welcomeMessage,
22386
+ placeholder: appearanceConfig?.placeholder || appearanceConfig?.lightMode?.footer?.inputPlaceholder,
22387
+ headerTitle: appearanceConfig?.lightMode?.header?.title,
22388
+ buttonIcon: appearanceConfig?.buttonIcon || appearanceConfig?.lightMode?.button?.icon,
22389
+ };
22390
+ // Generate theme styles from accent color
22391
+ const generatedStyles = generateThemeStyles(simpleAppearance, effectiveTheme);
22392
+ // Also apply legacy styles for backward compatibility
22393
+ const legacyStyles = appearanceConfig
21976
22394
  ? applyAppearanceStyles(appearanceConfig, effectiveTheme)
21977
22395
  : {};
21978
- // Override with prop values if provided
21979
- if (primaryColor) {
21980
- customStyles['--primary-color'] = primaryColor;
21981
- }
22396
+ // Merge styles (generated takes priority for new simplified system)
22397
+ const customStyles = {
22398
+ ...legacyStyles,
22399
+ ...generatedStyles,
22400
+ };
21982
22401
  // Debug logging for theme and styles
21983
22402
  react.useEffect(() => {
21984
22403
  console.log('[ChatWidget] Theme info:', {
21985
22404
  effectiveTheme,
21986
- canUseDarkMode,
22405
+ autoDetectedTheme,
21987
22406
  themeSetting,
21988
- systemPrefersDark,
21989
- hasCustomStyles: Object.keys(customStyles).length > 0,
21990
- buttonColor: customStyles['--button-color'],
21991
- buttonSize: customStyles['--button-size'],
21992
- cardBackground: customStyles['--card-background'],
21993
- cardOpacity: customStyles['--card-opacity'],
21994
- cardBorderRadius: customStyles['--card-border-radius'],
22407
+ accentColor,
21995
22408
  });
21996
- console.log('[ChatWidget] All CSS variables:', customStyles);
21997
- }, [effectiveTheme, customStyles]);
22409
+ }, [effectiveTheme, autoDetectedTheme, themeSetting, accentColor]);
21998
22410
  const handleToggle = () => {
21999
22411
  const newState = !isOpen;
22000
22412
  console.log('[ChatWidget] handleToggle called, setting isOpen to:', newState);
@@ -22015,16 +22427,25 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
22015
22427
  return null;
22016
22428
  }
22017
22429
  console.log('[ChatWidget] Rendering widget', { isOpen, hasConfig: !!config });
22018
- return (jsxRuntime.jsx("div", { className: `ai-chat-widget ${effectiveTheme}`, style: customStyles, children: jsxRuntime.jsxs("div", { ref: widgetRef, className: `ai-chat-widget-container ${effectivePosition}`, children: [isOpen && (jsxRuntime.jsx(ChatWindow, { messages: messages, isLoading: isLoading, isTyping: isTyping, error: error, config: config, onSendMessage: sendMessage, onClose: handleToggle, onFeedback: handleFeedback })), !isOpen && (() => {
22019
- // Get icon from theme config
22020
- const themeConfig = effectiveTheme === 'dark'
22021
- ? appearanceConfig?.darkMode
22022
- : appearanceConfig?.lightMode;
22023
- const buttonIcon = themeConfig?.button?.icon || 'FiMessageCircle';
22024
- const buttonIconColor = themeConfig?.button?.iconColor || customStyles['--button-icon-color'] || '#ffffff';
22025
- const IconComponent = iconComponents[buttonIcon] || iconComponents.FiMessageCircle;
22026
- return (jsxRuntime.jsx("button", { className: "ai-chat-button", onClick: handleToggle, "aria-label": "Open chat", style: { color: buttonIconColor }, children: jsxRuntime.jsx("div", { className: "ai-chat-button-svg", children: jsxRuntime.jsx(IconComponent, {}) }) }));
22027
- })()] }) }));
22430
+ // Get button icon based on state
22431
+ const getButtonIcon = () => {
22432
+ if (isOpen) {
22433
+ return iconComponents.FiChevronDown;
22434
+ }
22435
+ const themeConfig = effectiveTheme === 'dark'
22436
+ ? appearanceConfig?.darkMode
22437
+ : appearanceConfig?.lightMode;
22438
+ const buttonIcon = themeConfig?.button?.icon || 'FiMessageCircle';
22439
+ return iconComponents[buttonIcon] || iconComponents.FiMessageCircle;
22440
+ };
22441
+ const buttonIconColor = (() => {
22442
+ const themeConfig = effectiveTheme === 'dark'
22443
+ ? appearanceConfig?.darkMode
22444
+ : appearanceConfig?.lightMode;
22445
+ return themeConfig?.button?.iconColor || customStyles['--button-icon-color'] || '#ffffff';
22446
+ })();
22447
+ const IconComponent = getButtonIcon();
22448
+ return (jsxRuntime.jsx("div", { ref: containerRef, className: `ai-chat-widget ${effectiveTheme}`, style: customStyles, children: jsxRuntime.jsxs("div", { ref: widgetRef, className: `ai-chat-widget-container ${effectivePosition}`, children: [isOpen && (jsxRuntime.jsx(ChatWindow, { messages: messages, isLoading: isLoading, isTyping: isTyping, error: error, config: config, onSendMessage: sendMessage, onClose: handleToggle, onFeedback: handleFeedback })), jsxRuntime.jsx("button", { className: `ai-chat-button ${isOpen ? 'is-open' : ''}`, onClick: handleToggle, "aria-label": isOpen ? "Minimize chat" : "Open chat", style: { color: buttonIconColor }, children: jsxRuntime.jsx("div", { className: "ai-chat-button-svg", children: jsxRuntime.jsx(IconComponent, {}) }) })] }) }));
22028
22449
  };
22029
22450
 
22030
22451
  exports.ApiError = ApiError;