PluginProbe ʕ •ᴥ•ʔ
AI Engine – The Chatbot, AI Framework & MCP for WordPress / 3.5.0
AI Engine – The Chatbot, AI Framework & MCP for WordPress v3.5.0
3.7.4 3.7.3 3.7.2 3.7.1 3.7.0 3.6.9 3.6.8 3.6.7 3.6.6 3.6.4 3.6.5 3.6.3 3.6.2 3.6.1 3.6.0 3.5.9 3.5.8 3.5.7 3.5.6 3.5.5 3.5.4 3.5.3 3.5.2 3.5.1 3.5.0 3.4.9 3.4.8 3.4.7 0.2.1 1.6.91 0.2.2 1.6.92 0.2.3 1.6.93 0.2.4 1.6.94 0.2.5 1.6.95 0.2.6 1.6.96 0.2.7 1.6.97 0.2.8 1.6.98 0.2.9 1.6.99 0.3.0 1.7.0 0.3.1 1.7.1 0.3.2 1.7.2 0.3.3 1.7.3 0.3.4 1.7.4 0.3.5 1.7.5 0.3.6 1.7.6 0.4.0 1.7.7 0.4.1 1.7.8 0.4.2 1.7.9 0.4.3 1.8.0 0.4.4 1.8.1 0.4.5 1.8.2 0.4.6 1.8.3 0.4.7 1.8.4 0.4.8 1.8.5 0.4.9 1.8.6 0.5.0 1.8.7 0.5.1 1.8.8 0.5.2 1.8.9 0.5.3 1.9.0 0.5.4 1.9.1 0.5.5 1.9.2 0.5.6 1.9.3 0.5.7 1.9.4 0.5.8 1.9.5 0.5.9 1.9.6 0.6.0 1.9.7 0.6.1 1.9.8 0.6.2 1.9.81 0.6.3 1.9.82 0.6.4 1.9.83 0.6.5 1.9.84 0.6.6 1.9.85 0.6.7 1.9.86 0.6.8 1.9.87 0.6.9 1.9.88 0.7.0 1.9.89 0.7.1 1.9.90 0.7.2 1.9.91 0.7.3 1.9.92 0.7.4 1.9.93 0.7.5 1.9.94 0.7.6 1.9.95 0.7.7 1.9.96 0.7.8 1.9.97 0.7.9 1.9.98 0.8.0 1.9.99 0.8.1 2.0.0 0.8.2 2.0.1 0.8.3 2.0.2 0.8.4 2.0.3 0.8.5 2.0.4 0.8.6 2.0.5 0.8.7 2.0.6 0.8.8 2.0.7 0.8.9 2.0.8 0.9.0 2.0.9 0.9.2 2.1.0 0.9.3 2.1.1 0.9.4 2.1.2 0.9.5 2.1.3 0.9.6 2.1.4 0.9.7 2.1.5 0.9.8 2.1.6 0.9.81 2.1.7 0.9.82 2.1.8 0.9.83 2.1.9 0.9.84 2.2.0 0.9.85 2.2.1 0.9.86 2.2.2 0.9.87 2.2.3 0.9.88 2.2.4 0.9.89 2.2.5 0.9.9 2.2.51 0.9.91 2.2.52 0.9.92 2.2.53 0.9.93 2.2.54 0.9.94 2.2.56 0.9.95 2.2.57 0.9.96 2.2.6 0.9.97 2.2.60 0.9.98 2.2.61 0.9.99 2.2.62 1.0.0 2.2.63 1.0.01 2.2.70 1.0.1 2.2.80 1.0.2 2.2.81 1.0.3 2.2.90 1.0.4 2.2.91 1.0.5 2.2.92 1.0.6 2.2.93 1.0.7 2.2.94 1.0.8 2.2.95 1.0.9 2.3.0 1.1.0 2.3.1 1.1.1 2.3.2 1.1.2 2.3.3 1.1.3 2.3.4 1.1.4 2.3.5 1.1.5 2.3.6 1.1.6 2.3.7 1.1.7 2.3.8 1.1.8 2.3.9 1.1.9 2.4.0 1.2.0 2.4.1 1.2.1 2.4.2 1.2.2 2.4.3 1.2.21 2.4.4 1.2.3 2.4.5 1.2.30 2.4.6 1.3.0 2.4.7 1.3.1 2.4.8 1.3.2 2.4.9 1.3.3 2.5.0 1.3.31 2.5.1 1.3.32 2.5.2 1.3.33 2.5.3 1.3.34 2.5.4 1.3.35 2.5.5 1.3.36 2.5.6 1.3.37 2.5.7 1.3.38 2.5.8 1.3.39 2.5.9 1.3.40 2.6.0 1.3.41 2.6.1 1.3.42 2.6.2 1.3.43 2.6.3 1.3.44 2.6.5 1.3.45 2.6.6 1.3.46 2.6.7 1.3.47 2.6.8 1.3.48 2.6.9 1.3.49 2.7.0 1.3.50 2.7.1 1.3.51 2.7.2 1.3.52 2.7.3 1.3.53 2.7.4 1.3.54 2.7.5 1.3.56 2.7.6 1.3.57 2.7.7 1.3.58 2.7.8 1.3.59 2.7.9 1.3.60 2.8.0 1.3.61 2.8.1 1.3.62 2.8.2 1.3.63 2.8.3 1.3.64 2.8.4 1.3.65 2.8.5 1.3.66 2.8.6 1.3.67 2.8.7 1.3.68 2.8.8 1.3.69 2.8.9 1.3.70 2.9.0 1.3.71 2.9.1 1.3.72 2.9.2 1.3.73 2.9.3 1.3.74 2.9.4 1.3.75 2.9.5 1.3.76 2.9.6 1.3.77 2.9.7 1.3.78 2.9.8 1.3.79 2.9.9 1.3.80 3.0.0 1.3.81 3.0.1 1.3.82 3.0.2 1.3.83 3.0.3 1.3.84 3.0.4 1.3.85 3.0.5 1.3.86 3.0.6 1.3.87 3.0.7 1.3.88 3.0.8 1.3.89 3.0.9 1.3.90 3.1.0 1.3.91 3.1.1 1.3.92 3.1.2 1.3.93 3.1.3 1.3.94 3.1.4 1.3.95 3.1.5 1.3.96 3.1.6 1.3.97 3.1.7 1.3.98 3.1.8 1.3.99 3.1.9 1.4.0 3.2.0 1.4.1 3.2.1 1.4.2 3.2.2 1.4.3 3.2.3 1.4.4 3.2.4 1.4.5 3.2.5 1.4.6 3.2.6 1.4.7 3.2.7 1.4.8 3.2.8 1.4.9 3.2.9 1.5.0 3.3.0 1.5.1 3.3.1 1.5.2 3.3.2 1.5.3 3.3.3 1.5.4 3.3.4 1.5.5 3.3.5 1.5.6 3.3.6 1.5.7 3.3.7 1.5.8 3.3.8 1.5.9 3.3.9 1.6.0 3.4.0 1.6.1 3.4.1 1.6.2 3.4.2 1.6.3 3.4.3 1.6.5 3.4.4 1.6.51 3.4.5 1.6.52 3.4.6 1.6.53 1.6.54 1.6.55 1.6.56 1.6.57 1.6.58 1.6.59 1.6.60 1.6.61 1.6.62 1.6.63 1.6.64 1.6.65 1.6.66 1.6.67 1.6.68 trunk 1.6.69 0.0.1 1.6.70 0.0.2 1.6.71 0.0.3 1.6.72 0.0.4 1.6.73 0.0.5 1.6.74 0.0.6 1.6.75 0.0.7 1.6.76 0.0.8 1.6.77 0.0.9 1.6.78 0.1.0 1.6.79 0.1.1 1.6.81 0.1.2 1.6.82 0.1.3 1.6.83 0.1.4 1.6.84 0.1.5 1.6.85 0.1.6 1.6.86 0.1.7 1.6.87 0.1.8 1.6.88 0.1.9 1.6.89 0.2.0 1.6.90
ai-engine / themes / timeless.css
ai-engine / themes Last commit date
icons 2 years ago chatgpt.css 4 months ago foundation.css 4 months ago messages.css 4 months ago timeless.css 4 months ago
timeless.css
3055 lines
1 @charset "UTF-8";
2 /*
3 TIMELESS THEME — SPACING, INPUT, AND SAFE-AREA DOCS
4
5 Overview
6 - Clean, balanced layout with a circular submit button and unified footer tools.
7 - Focuses on readability and subtle motion; matches modern app patterns.
8
9 Spacing Strategy
10 - Bottom spacing is owned by the input/footer (not the shell) to avoid double padding
11 and tiny gaps when browser toolbars show/hide. The shell applies only top/side safe areas.
12 - When no footer is present, we add a consistent baseline under the input via a shared mixin.
13
14 Submit Button Strategy
15 - Circular submit with a theme token `--mwai-submitSize` so sizes aren’t hard-coded.
16 - Hover scaling stays centered to avoid visual drift.
17
18 Safe Areas & Viewport
19 - Uses dvh (100dvh) patterns and avoids hard height locks; respects safe-area only where needed.
20
21 Important
22 - Keep this documentation updated as spacing/safe-area rules evolve across platforms.
23 */
24 @keyframes mwai-cursor-blink {
25 0%, 49.9% {
26 background: var(--mwai-terminal-active-color);
27 color: var(--mwai-backgroundPrimaryColor);
28 }
29 50%, 100% {
30 background: transparent;
31 color: var(--mwai-terminal-active-color);
32 }
33 }
34 .mwai-context-menu-portal .mwai-context-menu {
35 background: var(--mwai-backgroundHeaderColor);
36 border: 1px solid rgba(0, 0, 0, 0.1);
37 border-radius: var(--mwai-borderRadius);
38 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
39 font-size: 13px;
40 color: var(--mwai-fontColor);
41 }
42 .mwai-context-menu-portal .mwai-context-menu .mwai-menu-item {
43 display: flex;
44 align-items: center;
45 gap: 8px;
46 padding: 8px 12px;
47 cursor: pointer;
48 transition: background-color 0.2s;
49 }
50 .mwai-context-menu-portal .mwai-context-menu .mwai-menu-item:hover {
51 background-color: rgba(0, 0, 0, 0.05);
52 }
53 .mwai-context-menu-portal .mwai-context-menu .mwai-menu-item.mwai-danger {
54 color: #dc3545;
55 }
56 .mwai-context-menu-portal .mwai-context-menu .mwai-menu-item.mwai-danger:hover {
57 background-color: rgba(220, 53, 69, 0.1);
58 }
59 .mwai-context-menu-portal .mwai-context-menu .mwai-menu-item svg {
60 flex-shrink: 0;
61 }
62
63 .mwai-chunks {
64 padding: 8px;
65 background: rgba(0, 0, 0, 0.03);
66 font-family: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;
67 font-size: 11px;
68 border-top: 1px solid rgba(0, 0, 0, 0.06);
69 }
70 .mwai-chunks.mwai-chunks-collapsed .mwai-chunks-header {
71 margin-bottom: 0 !important;
72 }
73 .mwai-chunks .mwai-chunks-header {
74 display: flex;
75 align-items: center;
76 gap: 2px;
77 margin-bottom: 8px;
78 color: #6b7280;
79 font-size: 10px;
80 text-transform: uppercase;
81 letter-spacing: 0.05em;
82 }
83 .mwai-chunks .mwai-chunks-header .mwai-chunks-title {
84 flex: 1;
85 overflow: hidden;
86 text-overflow: ellipsis;
87 white-space: nowrap;
88 }
89 .mwai-chunks .mwai-chunks-header .mwai-chunks-status {
90 margin-left: 4px;
91 font-weight: 500;
92 }
93 .mwai-chunks .mwai-chunks-header .mwai-chunks-toggle {
94 background: none;
95 border: 1px solid rgba(0, 0, 0, 0.1);
96 border-radius: 3px;
97 padding: 2px;
98 width: 30px;
99 height: 20px;
100 cursor: pointer;
101 color: #6b7280;
102 display: flex;
103 align-items: center;
104 justify-content: center;
105 transition: all 0.2s ease;
106 margin-left: 4px;
107 }
108 .mwai-chunks .mwai-chunks-header .mwai-chunks-toggle:hover {
109 background: rgba(0, 0, 0, 0.05);
110 color: #374151;
111 }
112 .mwai-chunks .mwai-chunk {
113 margin-bottom: 4px;
114 padding: 6px 8px;
115 background: white;
116 border-radius: 4px;
117 border: 1px solid rgba(0, 0, 0, 0.06);
118 transition: all 0.2s ease;
119 }
120 .mwai-chunks .mwai-chunk .mwai-chunk-header {
121 display: flex;
122 align-items: center;
123 gap: 8px;
124 cursor: pointer;
125 user-select: none;
126 }
127 .mwai-chunks .mwai-chunk .mwai-chunk-header .mwai-chunk-time {
128 color: #9ca3af;
129 font-size: 10px;
130 font-variant-numeric: tabular-nums;
131 }
132 .mwai-chunks .mwai-chunk .mwai-chunk-header .mwai-chunk-type {
133 display: flex;
134 align-items: center;
135 gap: 4px;
136 padding: 2px 6px;
137 border-radius: 3px;
138 font-size: 10px;
139 font-weight: 500;
140 color: white;
141 }
142 .mwai-chunks .mwai-chunk .mwai-chunk-header .mwai-chunk-data {
143 flex: 1;
144 color: #374151;
145 overflow: hidden;
146 text-overflow: ellipsis;
147 white-space: nowrap;
148 }
149 .mwai-chunks .mwai-chunk .mwai-chunk-header .mwai-chunk-expand {
150 color: #9ca3af;
151 transition: transform 0.2s ease;
152 }
153 .mwai-chunks .mwai-chunk .mwai-chunk-details {
154 margin-top: 8px;
155 padding: 8px;
156 background: rgba(0, 0, 0, 0.02);
157 border-radius: 3px;
158 overflow-x: auto;
159 }
160 .mwai-chunks .mwai-chunk .mwai-chunk-details pre {
161 margin: 0;
162 white-space: pre-wrap;
163 word-break: break-word;
164 color: #4b5563;
165 }
166
167 /*
168 TIMELESS THEME — SPACING, INPUT, AND SAFE-AREA DOCS
169
170 Overview
171 - Clean, balanced layout with a circular submit button and unified footer tools.
172 - Focuses on readability and subtle motion; matches modern app patterns.
173
174 Spacing Strategy
175 - Bottom spacing is owned by the input/footer (not the shell) to avoid double padding
176 and tiny gaps when browser toolbars show/hide. The shell applies only top/side safe areas.
177 - When no footer is present, we add a consistent baseline under the input via a shared mixin.
178
179 Submit Button Strategy
180 - Circular submit with a theme token `--mwai-submitSize` so sizes aren’t hard-coded.
181 - Hover scaling stays centered to avoid visual drift.
182
183 Safe Areas & Viewport
184 - Uses dvh (100dvh) patterns and avoids hard height locks; respects safe-area only where needed.
185
186 Important
187 - Keep this documentation updated as spacing/safe-area rules evolve across platforms.
188 */
189 @keyframes mwaiIconTextZoomIn {
190 0% {
191 transform: scale(0.92);
192 opacity: 0;
193 }
194 100% {
195 transform: scale(1);
196 opacity: 1;
197 }
198 }
199 @keyframes mwaiIconTextSlideIn {
200 0% {
201 transform: translateY(28px);
202 opacity: 0;
203 }
204 70% {
205 transform: translateY(-3px);
206 opacity: 1;
207 }
208 100% {
209 transform: translateY(0);
210 opacity: 1;
211 }
212 }
213 @keyframes mwaiIconTextSlideUp {
214 0% {
215 transform: translateY(24px);
216 opacity: 0;
217 }
218 100% {
219 transform: translateY(0);
220 opacity: 1;
221 }
222 }
223 @keyframes mwaiIconTextFadeOpacity {
224 0% {
225 opacity: 0;
226 }
227 100% {
228 opacity: 1;
229 }
230 }
231 @keyframes mwaiIconTextFadeTransform {
232 0% {
233 transform: translateY(8px) scale(0.98);
234 }
235 100% {
236 transform: translateY(0) scale(1);
237 }
238 }
239 .mwai-timeless-theme {
240 font-family: var(--mwai-fontFamily, inherit);
241 --mwai-spacing: 15px;
242 --mwai-fontSize: 13px;
243 --mwai-lineHeight: 1.5;
244 --mwai-borderRadius: 10px;
245 --mwai-borderColor: #c5c5c5;
246 --mwai-width: 360px;
247 --mwai-maxHeight: 40vh;
248 --mwai-iconTextColor: #FFFFFF;
249 --mwai-iconTextBackgroundColor: var(--mwai-backgroundUserColor);
250 --mwai-fontColor: black;
251 --mwai-backgroundPrimaryColor: #fafafa;
252 --mwai-backgroundHeaderColor: linear-gradient(130deg, #2831dc 0%, #09a9f8 100%);
253 --mwai-bubbleColor: #2768db;
254 --mwai-iconSize: 60px;
255 --mwai-accentColor: #2768db;
256 --mwai-headerColor: white;
257 --mwai-conversationsBackgroundColor: white;
258 --mwai-backgroundUserColor: linear-gradient(130deg, #2768db 0%, #4a80e1 100%);
259 --mwai-backgroundAiColor: #F1F3F7;
260 --mwai-backgroundAiSecondaryColor: #ddd;
261 --mwai-errorBackgroundColor: #6d2f2a;
262 --mwai-errorTextColor: #FFFFFF;
263 --mwai-headerHeight: 80px;
264 font-size: var(--mwai-fontSize);
265 }
266 .mwai-timeless-theme * {
267 box-sizing: border-box;
268 }
269 .mwai-timeless-theme.mwai-window .mwai-window-box {
270 border-radius: var(--mwai-borderRadius);
271 overflow: hidden;
272 }
273 .mwai-timeless-theme.mwai-window .mwai-header {
274 height: var(--mwai-headerHeight);
275 padding: var(--mwai-spacing);
276 }
277 .mwai-timeless-theme.mwai-window .mwai-header .mwai-avatar img {
278 width: 48px;
279 height: 48px;
280 }
281 .mwai-timeless-theme.mwai-window .mwai-header .mwai-name {
282 color: white;
283 font-size: 140%;
284 /* Match the left header padding for symmetric spacing around the avatar */
285 margin-left: var(--mwai-spacing);
286 }
287 .mwai-timeless-theme.mwai-window .mwai-header .mwai-name small {
288 font-size: 75%;
289 display: block;
290 }
291 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons {
292 margin-right: var(--mwai-spacing);
293 }
294 .mwai-timeless-theme .mwai-body {
295 display: flex;
296 background: var(--mwai-backgroundPrimaryColor);
297 font-size: var(--mwai-fontSize);
298 color: var(--mwai-fontColor);
299 border-radius: var(--mwai-borderRadius);
300 flex-direction: column;
301 }
302 .mwai-timeless-theme .mwai-footer {
303 border-radius: 0 0 var(--mwai-borderRadius) var(--mwai-borderRadius);
304 }
305 .mwai-timeless-theme.mwai-window .mwai-body, .mwai-timeless-theme.mwai-window .mwai-footer {
306 border-radius: 0;
307 }
308 .mwai-timeless-theme .mwai-shortcuts {
309 display: flex;
310 flex-direction: column;
311 align-items: flex-end;
312 }
313 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut {
314 margin-bottom: 5px;
315 font-size: var(--mwai-fontSize);
316 height: inherit;
317 min-height: inherit;
318 width: inherit;
319 min-width: 90px;
320 border-radius: var(--mwai-borderRadius);
321 padding: 7px 12px;
322 cursor: pointer;
323 display: flex;
324 align-items: center;
325 justify-content: end;
326 }
327 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut.mwai-success {
328 background: #4caf50;
329 color: white;
330 box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.15);
331 }
332 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut.mwai-danger {
333 background: #f44336;
334 color: white;
335 box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.15);
336 }
337 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut.mwai-warning {
338 background: #ff9800;
339 color: white;
340 box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.15);
341 }
342 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut.mwai-info {
343 background: #2196f3;
344 color: white;
345 box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.15);
346 }
347 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut .mwai-icon {
348 margin-right: 5px;
349 }
350 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut .mwai-icon img {
351 max-height: 16px;
352 width: auto;
353 }
354 .mwai-timeless-theme .mwai-shortcuts .mwai-shortcut:hover {
355 filter: brightness(1.1);
356 }
357 .mwai-timeless-theme .mwai-blocks {
358 display: flex;
359 flex-direction: column;
360 padding: var(--mwai-spacing);
361 border-top: 0.5px solid rgba(0, 0, 0, 0.15);
362 background: var(--mwai-backgroundAiColor);
363 }
364 .mwai-timeless-theme .mwai-blocks .mwai-block p:first-child {
365 margin-top: 0;
366 }
367 .mwai-timeless-theme .mwai-blocks button {
368 cursor: pointer;
369 }
370 .mwai-timeless-theme .mwai-conversation {
371 display: flex;
372 flex-direction: column;
373 overflow: auto;
374 max-height: var(--mwai-maxHeight);
375 padding: var(--mwai-spacing);
376 scrollbar-width: thin;
377 scrollbar-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.05);
378 }
379 .mwai-timeless-theme .mwai-conversation::-webkit-scrollbar {
380 width: 8px;
381 background: transparent;
382 }
383 .mwai-timeless-theme .mwai-conversation::-webkit-scrollbar-track {
384 background: rgba(0, 0, 0, 0.05);
385 border-radius: 4px;
386 }
387 .mwai-timeless-theme .mwai-conversation::-webkit-scrollbar-thumb {
388 background: rgba(0, 0, 0, 0.15);
389 border-radius: 4px;
390 transition: background 0.2s ease;
391 }
392 .mwai-timeless-theme .mwai-conversation::-webkit-scrollbar-thumb:hover {
393 background: rgba(0, 0, 0, 0.25);
394 }
395 .mwai-timeless-theme .mwai-conversation::-webkit-scrollbar-thumb:active {
396 background: rgba(0, 0, 0, 0.3);
397 }
398 .mwai-timeless-theme .mwai-conversation .mwai-reply {
399 margin-bottom: var(--mwai-spacing);
400 padding: 7px 12px;
401 border-radius: var(--mwai-borderRadius);
402 font-size: var(--mwai-fontSize);
403 color: var(--mwai-fontColor);
404 position: relative;
405 }
406 .mwai-timeless-theme .mwai-conversation .mwai-reply .mwai-name,
407 .mwai-timeless-theme .mwai-conversation .mwai-reply .mwai-name-text {
408 display: none;
409 }
410 .mwai-timeless-theme .mwai-conversation .mwai-reply * > p:first-child {
411 margin-top: 0;
412 }
413 .mwai-timeless-theme .mwai-conversation .mwai-reply * > p:last-child {
414 margin-bottom: 0;
415 }
416 .mwai-timeless-theme .mwai-conversation .mwai-reply.mwai-ai, .mwai-timeless-theme .mwai-conversation .mwai-reply.mwai-error {
417 align-self: flex-start;
418 background: var(--mwai-backgroundAiColor);
419 }
420 .mwai-timeless-theme .mwai-conversation .mwai-reply.mwai-error {
421 border: 1px solid #ff5656;
422 }
423 .mwai-timeless-theme .mwai-conversation .mwai-reply.mwai-user {
424 align-self: flex-end;
425 background: var(--mwai-backgroundUserColor);
426 color: white;
427 }
428 .mwai-timeless-theme .mwai-conversation .mwai-reply.mwai-user .mwai-filename {
429 color: white;
430 border-color: var(--mwai-backgroundPrimaryColor);
431 }
432 .mwai-timeless-theme .mwai-conversation.mwai-terminal {
433 --mwai-terminal-active-color: var(--mwai-accentColor);
434 }
435 .mwai-timeless-theme .mwai-text {
436 flex: auto;
437 }
438 .mwai-timeless-theme .mwai-text .mwai-image {
439 display: block;
440 max-width: 250px;
441 height: auto;
442 margin: 5px 0 10px 0;
443 border-radius: var(--mwai-borderRadius);
444 border: 1px solid rgba(255, 255, 255, 0.4588235294);
445 }
446 .mwai-timeless-theme .mwai-text .mwai-filename {
447 display: flex;
448 text-decoration: none;
449 border: 1px solid var(--mwai-borderColor);
450 border-radius: var(--mwai-borderRadius);
451 color: var(--mwai-fontColor);
452 padding: 5px 10px;
453 margin-bottom: 10px;
454 }
455 .mwai-timeless-theme .mwai-text > span > p > *:first-child {
456 margin-top: 0;
457 }
458 .mwai-timeless-theme .mwai-text a {
459 color: #2196f3;
460 }
461 .mwai-timeless-theme .mwai-text h1, .mwai-timeless-theme .mwai-text h2, .mwai-timeless-theme .mwai-text h3, .mwai-timeless-theme .mwai-text h4, .mwai-timeless-theme .mwai-text h5, .mwai-timeless-theme .mwai-text h6 {
462 margin: 0px;
463 line-height: 1.2;
464 }
465 .mwai-timeless-theme .mwai-text h1 {
466 font-size: 150%;
467 }
468 .mwai-timeless-theme .mwai-text h2 {
469 font-size: 130%;
470 }
471 .mwai-timeless-theme .mwai-text h3 {
472 font-size: 115%;
473 }
474 .mwai-timeless-theme .mwai-text h4 {
475 font-size: 105%;
476 }
477 .mwai-timeless-theme .mwai-text h5 {
478 font-size: 100%;
479 }
480 .mwai-timeless-theme .mwai-text h6 {
481 font-size: 95%;
482 font-weight: bold;
483 }
484 .mwai-timeless-theme .mwai-text p {
485 font-size: var(--mwai-fontSize);
486 line-height: var(--mwai-lineHeight);
487 }
488 .mwai-timeless-theme .mwai-text p code {
489 background: var(--mwai-backgroundAiSecondaryColor);
490 padding: 2px 6px;
491 border-radius: 8px;
492 font-size: calc(var(--mwai-fontSize) * 0.9);
493 font-family: system-ui;
494 }
495 .mwai-timeless-theme .mwai-text pre {
496 color: var(--mwai-fontColor);
497 border-radius: var(--mwai-borderRadius);
498 break-after: auto;
499 white-space: pre-wrap;
500 max-width: 100%;
501 width: 100%;
502 font-family: system-ui;
503 background: var(--mwai-backgroundAiSecondaryColor);
504 padding: var(--mwai-spacing);
505 }
506 .mwai-timeless-theme .mwai-text pre code {
507 padding: 0 !important;
508 font-family: system-ui;
509 background: var(--mwai-backgroundAiSecondaryColor);
510 }
511 .mwai-timeless-theme .mwai-text ul {
512 list-style: disc;
513 padding: 0;
514 margin: 0 0 0 15px;
515 }
516 .mwai-timeless-theme .mwai-text ol {
517 list-style: decimal;
518 padding: 0;
519 margin: 0 0 0 15px;
520 }
521 .mwai-timeless-theme .mwai-text table {
522 width: 100%;
523 border: 2px solid var(--mwai-backgroundAiSecondaryColor);
524 border-collapse: collapse;
525 }
526 .mwai-timeless-theme .mwai-text thead {
527 background: var(--mwai-backgroundAiSecondaryColor);
528 }
529 .mwai-timeless-theme .mwai-text tr,
530 .mwai-timeless-theme .mwai-text td {
531 padding: 2px 5px;
532 }
533 .mwai-timeless-theme .mwai-text td {
534 border: 2px solid var(--mwai-backgroundAiSecondaryColor);
535 }
536 .mwai-timeless-theme .mwai-text .mwai-typewriter {
537 display: inline-block;
538 }
539 .mwai-timeless-theme .mwai-text .mwai-typewriter > :first-child {
540 margin-top: 0;
541 }
542 .mwai-timeless-theme .mwai-text > *:first-child {
543 margin-top: 0;
544 }
545 .mwai-timeless-theme .mwai-text > *:last-child {
546 margin-bottom: 0;
547 }
548 .mwai-timeless-theme button {
549 background: var(--mwai-backgroundUserColor);
550 color: white;
551 border: none;
552 transition: all 0.5s;
553 padding: 7px 12px;
554 border-radius: var(--mwai-borderRadius);
555 }
556 .mwai-timeless-theme .mwai-input {
557 display: flex;
558 align-items: center;
559 position: relative;
560 width: 100%;
561 border-top: 0.5px solid rgba(0, 0, 0, 0.15);
562 padding: calc(var(--mwai-spacing) / 2) var(--mwai-spacing);
563 position: relative;
564 /* Submit button as a neat circle around the icon */
565 }
566 .mwai-timeless-theme .mwai-input .mwai-input-text {
567 flex: auto;
568 position: relative;
569 display: flex;
570 overflow: hidden;
571 border-radius: var(--mwai-borderRadius);
572 width: 100%;
573 background: var(--mwai-backgroundPrimaryColor);
574 overflow: hidden;
575 }
576 .mwai-timeless-theme .mwai-input .mwai-input-text.mwai-blocked img {
577 filter: grayscale(100%);
578 opacity: 0.5;
579 }
580 .mwai-timeless-theme .mwai-input .mwai-input-text.mwai-dragging {
581 border: 1px dashed var(--mwai-backgroundAiSecondaryColor);
582 }
583 .mwai-timeless-theme .mwai-input .mwai-input-text textarea {
584 background: var(--mwai-backgroundPrimaryColor);
585 color: var(--mwai-fontColor);
586 flex: auto;
587 border: none;
588 font-size: var(--mwai-fontSize);
589 resize: none;
590 font-family: inherit;
591 margin: 0;
592 overflow: hidden;
593 min-height: inherit;
594 box-shadow: none;
595 outline: none;
596 }
597 .mwai-timeless-theme .mwai-input .mwai-input-text textarea:focus {
598 outline: none;
599 box-shadow: none;
600 }
601 .mwai-timeless-theme .mwai-input .mwai-input-text textarea::placeholder {
602 color: rgba(0, 0, 0, 0.25);
603 }
604 .mwai-timeless-theme .mwai-input .mwai-input-text .mwai-microphone {
605 display: flex;
606 justify-content: center;
607 align-items: center;
608 }
609 .mwai-timeless-theme .mwai-input .mwai-input-text .mwai-microphone svg {
610 opacity: 0.5;
611 filter: grayscale(100%);
612 transition: opacity 0.3s ease-out;
613 cursor: pointer;
614 }
615 .mwai-timeless-theme .mwai-input .mwai-input-text .mwai-microphone[active=true] svg {
616 opacity: 1;
617 }
618 .mwai-timeless-theme .mwai-input .mwai-input-text .mwai-microphone[disabled] svg {
619 opacity: 0;
620 cursor: not-allowed;
621 }
622 .mwai-timeless-theme .mwai-input button {
623 margin-left: var(--mwai-spacing);
624 border-radius: 100%;
625 cursor: pointer;
626 height: 48px;
627 width: 48px;
628 min-width: 48px;
629 min-height: 48px;
630 transition: filter 0.2s ease, transform 0.15s ease-out;
631 }
632 .mwai-timeless-theme .mwai-input button img {
633 width: 20px;
634 height: 20px;
635 margin: auto;
636 display: block;
637 filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(180deg) brightness(1000%) contrast(100%);
638 }
639 .mwai-timeless-theme .mwai-input button .mwai-timer {
640 font-size: 18px;
641 font-weight: 600;
642 color: rgba(0, 0, 0, 0.25);
643 letter-spacing: 0.5px;
644 font-variant-numeric: tabular-nums;
645 margin-right: var(--mwai-spacing);
646 }
647 .mwai-timeless-theme .mwai-input button:hover {
648 filter: brightness(1.2);
649 }
650 .mwai-timeless-theme .mwai-input button[disabled] {
651 cursor: not-allowed;
652 background: transparent !important;
653 border: none !important;
654 }
655 .mwai-timeless-theme .mwai-input button[disabled] .mwai-timer {
656 display: block;
657 }
658 .mwai-timeless-theme .mwai-input .mwai-input-submit {
659 background: var(--mwai-backgroundHeaderColor);
660 display: inline-flex;
661 align-items: center;
662 justify-content: center;
663 /* Theme token to avoid hard-coded sizes */
664 --mwai-submitSize: 40px;
665 width: var(--mwai-submitSize);
666 height: var(--mwai-submitSize);
667 min-width: var(--mwai-submitSize);
668 min-height: var(--mwai-submitSize);
669 padding: 0;
670 border-radius: 50%;
671 margin-right: -5px; /* slight optical alignment against container padding */
672 }
673 .mwai-timeless-theme .mwai-input .mwai-input-submit svg, .mwai-timeless-theme .mwai-input .mwai-input-submit img {
674 transition: transform 0.15s ease-out;
675 }
676 .mwai-timeless-theme .mwai-input .mwai-input-submit:hover svg, .mwai-timeless-theme .mwai-input .mwai-input-submit:hover img {
677 transform: scale(1.1);
678 }
679 .mwai-timeless-theme .mwai-footer {
680 display: flex;
681 align-items: center;
682 background: var(--mwai-backgroundAiColor, var(--mwai-backgroundSecondaryColor));
683 border-top: 1px solid var(--mwai-backgroundPrimaryColor);
684 padding: 6px var(--mwai-spacing);
685 }
686 .mwai-timeless-theme .mwai-footer:empty {
687 display: none;
688 }
689 .mwai-timeless-theme .mwai-footer:not(:has(.mwai-tools)):has(.mwai-compliance:empty) {
690 display: none;
691 }
692 .mwai-timeless-theme .mwai-footer .mwai-tools {
693 display: flex;
694 align-items: center;
695 gap: 8px;
696 margin-right: calc(var(--mwai-spacing) / 2);
697 }
698 .mwai-timeless-theme .mwai-footer .mwai-tools .mwai-file-upload {
699 display: inline-block;
700 }
701 .mwai-timeless-theme .mwai-footer .mwai-tools .mwai-file-upload-icon.mwai-lucide {
702 display: inline-flex;
703 align-items: center;
704 justify-content: center;
705 position: relative;
706 min-width: 16px;
707 height: 16px;
708 color: var(--mwai-fontColor);
709 opacity: 0.75;
710 margin: 0;
711 }
712 .mwai-timeless-theme .mwai-footer .mwai-tools .mwai-file-upload-icon.mwai-lucide:hover {
713 opacity: 1;
714 }
715 .mwai-timeless-theme .mwai-footer .mwai-tools .mwai-file-upload-icon.mwai-lucide svg {
716 width: 16px;
717 height: 16px;
718 }
719 .mwai-timeless-theme .mwai-footer .mwai-tools .mwai-file-upload-icon.mwai-lucide .mwai-upload-count {
720 position: absolute;
721 top: -5px;
722 right: -6px;
723 min-width: 12px;
724 height: 12px;
725 padding: 0 2px;
726 border-radius: 999px;
727 background: var(--mwai-backgroundHeaderColor);
728 color: #fff;
729 border: 2px solid var(--mwai-backgroundAiColor, var(--mwai-backgroundSecondaryColor));
730 font-size: 8px;
731 font-family: system-ui;
732 font-weight: 700;
733 line-height: 1;
734 display: inline-flex;
735 align-items: center;
736 justify-content: center;
737 user-select: none;
738 cursor: pointer;
739 }
740 .mwai-timeless-theme .mwai-footer .mwai-tools .mwai-file-upload-icon.mwai-lucide .mwai-upload-count::after {
741 content: attr(data-count);
742 }
743 .mwai-timeless-theme .mwai-footer .mwai-tools .mwai-file-upload-icon.mwai-lucide.mwai-hover .mwai-upload-count::after {
744 content: "-";
745 }
746 .mwai-timeless-theme .mwai-footer .mwai-compliance {
747 opacity: 0.5;
748 font-size: 11px;
749 line-height: 11px;
750 color: var(--mwai-fontColor);
751 flex: 1;
752 text-align: left;
753 padding: calc(var(--mwai-spacing) / 2) 0;
754 margin: 0;
755 }
756 .mwai-timeless-theme .mwai-footer .mwai-tools + .mwai-compliance {
757 text-align: right;
758 }
759 .mwai-timeless-theme .mwai-body:not(:has(~ .mwai-footer)):not(:has(+ .mwai-footer)) .mwai-input, .mwai-timeless-theme .mwai-body:last-child .mwai-input {
760 padding-bottom: var(--mwai-spacing);
761 }
762 @media (max-width: 760px) {
763 .mwai-timeless-theme .mwai-body:not(:has(~ .mwai-footer)):not(:has(+ .mwai-footer)) .mwai-input, .mwai-timeless-theme .mwai-body:last-child .mwai-input {
764 padding-bottom: var(--mwai-spacing);
765 }
766 }
767 .mwai-timeless-theme .mwai-gallery {
768 display: grid;
769 grid-template-columns: repeat(3, 1fr);
770 grid-gap: 5px;
771 }
772 .mwai-timeless-theme .mwai-gallery img {
773 width: 100%;
774 }
775 .mwai-timeless-theme .mwai-files {
776 border-top: 0.5px solid rgba(0, 0, 0, 0.15);
777 background: var(--mwai-backgroundAiColor);
778 padding: calc(var(--mwai-spacing) / 2) var(--mwai-spacing);
779 }
780 .mwai-timeless-theme.mwai-animation-zoom.mwai-window {
781 filter: none;
782 }
783 @media (max-width: 760px) {
784 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-header {
785 display: none !important;
786 }
787 }
788 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-window-box {
789 display: flex;
790 flex-direction: column;
791 filter: drop-shadow(0 0 20px rgba(0, 0, 0, 0.15));
792 opacity: 0;
793 transform: scale(0.5);
794 transform-origin: bottom right;
795 transition: opacity 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
796 }
797 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-fullscreen .mwai-window-box {
798 width: 100%;
799 height: 100%;
800 }
801 @media (min-width: 761px) {
802 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-opening .mwai-header {
803 display: flex !important;
804 }
805 }
806 @media (max-width: 760px) {
807 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-opening .mwai-header {
808 display: none !important;
809 }
810 }
811 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-opening .mwai-body {
812 display: flex !important;
813 }
814 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-opening .mwai-window-box {
815 opacity: 1;
816 transform: scale(0.92);
817 }
818 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-open .mwai-window-box {
819 opacity: 1;
820 transform: scale(1);
821 }
822 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-closing .mwai-window-box {
823 opacity: 0;
824 transform: scale(0.85);
825 transition: opacity 180ms cubic-bezier(0.4, 0, 1, 1), transform 180ms cubic-bezier(0.4, 0, 1, 1);
826 }
827 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-closing .mwai-trigger {
828 display: none !important;
829 }
830 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-closing.mwai-open .mwai-trigger .mwai-icon-container {
831 transform: scale(1);
832 opacity: 1;
833 }
834 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-bottom-right .mwai-window-box {
835 transform-origin: calc(100% - 32px) calc(100% - 32px);
836 }
837 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-bottom-left .mwai-window-box {
838 transform-origin: 32px calc(100% - 32px);
839 }
840 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-top-right .mwai-window-box {
841 transform-origin: calc(100% - 32px) 32px;
842 }
843 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-top-left .mwai-window-box {
844 transform-origin: 32px 32px;
845 }
846 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-center-open .mwai-window-box {
847 transform-origin: center center;
848 }
849 @media (max-width: 760px) {
850 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-open .mwai-window-box {
851 transform-origin: center center !important;
852 }
853 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-header {
854 display: none !important;
855 }
856 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger {
857 position: fixed !important;
858 z-index: 9999 !important;
859 }
860 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-bottom-right .mwai-trigger {
861 bottom: calc(20px + env(safe-area-inset-bottom, 0)) !important;
862 right: 20px !important;
863 left: auto !important;
864 top: auto !important;
865 }
866 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-bottom-left .mwai-trigger {
867 bottom: calc(20px + env(safe-area-inset-bottom, 0)) !important;
868 left: 20px !important;
869 right: auto !important;
870 top: auto !important;
871 }
872 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-top-right .mwai-trigger {
873 top: 20px !important;
874 right: 20px !important;
875 left: auto !important;
876 bottom: auto !important;
877 }
878 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-top-left .mwai-trigger {
879 top: 20px !important;
880 left: 20px !important;
881 right: auto !important;
882 bottom: auto !important;
883 }
884 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-open:not(.mwai-closing) .mwai-trigger {
885 display: none !important;
886 }
887 }
888 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container {
889 transition: transform 0.2s ease-out, opacity 0.2s ease-out;
890 }
891 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container .mwai-icon {
892 transition: transform 0.2s ease-out;
893 }
894 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container:hover .mwai-icon {
895 transform: scale(1.1);
896 }
897 .mwai-timeless-theme.mwai-animation-zoom.mwai-window .mwai-trigger .mwai-icon-container:active .mwai-icon {
898 transform: scale(0.9);
899 }
900 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-opening .mwai-trigger .mwai-icon-container {
901 transform: scale(0.8);
902 opacity: 0.3;
903 }
904 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-open:not(.mwai-opening) .mwai-trigger {
905 display: none;
906 }
907 .mwai-timeless-theme.mwai-animation-zoom.mwai-window.mwai-center-open.mwai-closing .mwai-trigger {
908 display: none !important;
909 }
910 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text-container {
911 opacity: 1 !important;
912 transition: none !important;
913 }
914 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
915 will-change: transform, opacity;
916 transform: none;
917 }
918 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger.mwai-bottom-right .mwai-icon-text {
919 transform-origin: right bottom;
920 }
921 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger.mwai-bottom-left .mwai-icon-text {
922 transform-origin: left bottom;
923 }
924 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger.mwai-top-right .mwai-icon-text {
925 transform-origin: right top;
926 }
927 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger.mwai-top-left .mwai-icon-text {
928 transform-origin: left top;
929 }
930 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger.mwai-center-open .mwai-icon-text {
931 transform-origin: center center;
932 }
933 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
934 animation: mwaiIconTextZoomIn 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms 1 both;
935 }
936 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger:hover .mwai-icon-text {
937 transform: scale(1.02);
938 }
939 @media (prefers-reduced-motion: reduce) {
940 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
941 animation: none !important;
942 transform: none !important;
943 }
944 .mwai-timeless-theme.mwai-animation-zoom.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text-container {
945 opacity: 1 !important;
946 transition: none !important;
947 }
948 }
949 .mwai-timeless-theme.mwai-animation-slide.mwai-window {
950 filter: none;
951 }
952 @media (max-width: 760px) {
953 .mwai-timeless-theme.mwai-animation-slide.mwai-window .mwai-header {
954 display: none !important;
955 }
956 }
957 .mwai-timeless-theme.mwai-animation-slide.mwai-window .mwai-window-box {
958 display: flex;
959 flex-direction: column;
960 filter: drop-shadow(0 -5px 20px rgba(0, 0, 0, 0.15));
961 opacity: 0;
962 transform: translateY(100%);
963 transition: opacity 250ms ease-out, transform 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
964 }
965 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-fullscreen .mwai-window-box {
966 width: 100%;
967 height: 100%;
968 }
969 @media (min-width: 761px) {
970 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-opening .mwai-header {
971 display: flex !important;
972 }
973 }
974 @media (max-width: 760px) {
975 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-opening .mwai-header {
976 display: none !important;
977 }
978 }
979 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-opening .mwai-body {
980 display: flex !important;
981 }
982 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-opening .mwai-window-box {
983 opacity: 0.5;
984 transform: translateY(20px);
985 }
986 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-open .mwai-window-box {
987 opacity: 1;
988 transform: translateY(0);
989 }
990 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-closing .mwai-window-box {
991 opacity: 0;
992 transform: translateY(100%);
993 transition: opacity 200ms ease-in, transform 200ms ease-in;
994 }
995 @media (max-width: 760px) {
996 .mwai-timeless-theme.mwai-animation-slide.mwai-window .mwai-header {
997 display: none !important;
998 }
999 }
1000 .mwai-timeless-theme.mwai-animation-slide.mwai-window .mwai-trigger .mwai-icon-container {
1001 transition: transform 0.2s ease-out, opacity 0.2s ease-out;
1002 }
1003 .mwai-timeless-theme.mwai-animation-slide.mwai-window .mwai-trigger .mwai-icon-container .mwai-icon {
1004 transition: transform 0.2s ease-out;
1005 }
1006 .mwai-timeless-theme.mwai-animation-slide.mwai-window .mwai-trigger .mwai-icon-container:hover .mwai-icon {
1007 transform: scale(1.1);
1008 }
1009 .mwai-timeless-theme.mwai-animation-slide.mwai-window .mwai-trigger .mwai-icon-container:active .mwai-icon {
1010 transform: scale(0.9);
1011 }
1012 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-opening .mwai-trigger .mwai-icon-container {
1013 opacity: 0;
1014 }
1015 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-closing .mwai-trigger {
1016 display: none !important;
1017 }
1018 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-center-open.mwai-closing .mwai-trigger {
1019 display: none !important;
1020 }
1021 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-window-dragging.mwai-closing .mwai-trigger {
1022 display: none !important;
1023 }
1024 .mwai-timeless-theme.mwai-animation-slide.mwai-window.mwai-open:not(.mwai-opening) .mwai-trigger {
1025 display: none;
1026 }
1027 .mwai-timeless-theme.mwai-animation-slide.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text-container {
1028 opacity: 1 !important;
1029 transition: none !important;
1030 }
1031 .mwai-timeless-theme.mwai-animation-slide.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
1032 will-change: transform, opacity;
1033 transform: none;
1034 }
1035 .mwai-timeless-theme.mwai-animation-slide.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
1036 animation: mwaiIconTextSlideUp 250ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 0ms 1 both;
1037 backface-visibility: hidden;
1038 }
1039 .mwai-timeless-theme.mwai-animation-slide.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger:hover .mwai-icon-text {
1040 transform: translateY(-2px);
1041 }
1042 @media (prefers-reduced-motion: reduce) {
1043 .mwai-timeless-theme.mwai-animation-slide.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
1044 animation: none !important;
1045 transform: none !important;
1046 }
1047 .mwai-timeless-theme.mwai-animation-slide.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text-container {
1048 opacity: 1 !important;
1049 transition: none !important;
1050 }
1051 }
1052 @media (max-width: 760px) {
1053 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-header {
1054 display: none !important;
1055 }
1056 }
1057 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-window-box {
1058 display: flex;
1059 flex-direction: column;
1060 filter: drop-shadow(0 0 20px rgba(0, 0, 0, 0.15));
1061 opacity: 0;
1062 transform: translateY(8px) scale(0.98);
1063 transform-origin: center bottom;
1064 will-change: opacity, transform;
1065 transition: opacity 180ms ease-out, transform 220ms cubic-bezier(0.2, 0, 0, 1);
1066 }
1067 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-fullscreen .mwai-window-box {
1068 width: 100%;
1069 height: 100%;
1070 }
1071 @media (min-width: 761px) {
1072 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-opening .mwai-header {
1073 display: flex !important;
1074 }
1075 }
1076 @media (max-width: 760px) {
1077 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-opening .mwai-header {
1078 display: none !important;
1079 }
1080 }
1081 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-opening .mwai-body {
1082 display: flex !important;
1083 opacity: 1 !important;
1084 transition: none !important;
1085 }
1086 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-opening .mwai-header {
1087 opacity: 1 !important;
1088 transition: none !important;
1089 }
1090 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-opening .mwai-window-box {
1091 opacity: 1;
1092 transform: translateY(0) scale(1);
1093 }
1094 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-open .mwai-header, .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-open .mwai-body {
1095 opacity: 1 !important;
1096 transition: none !important;
1097 }
1098 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-open .mwai-window-box {
1099 opacity: 1;
1100 transform: translateY(0) scale(1);
1101 }
1102 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-closing .mwai-window-box {
1103 opacity: 0;
1104 transform: translateY(8px) scale(0.98);
1105 transition: opacity 160ms ease-in, transform 180ms cubic-bezier(0.4, 0, 1, 1);
1106 }
1107 @media (prefers-reduced-motion: reduce) {
1108 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-window-box {
1109 transition: opacity 120ms linear !important;
1110 transform: none !important;
1111 }
1112 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-opening .mwai-window-box, .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-open .mwai-window-box {
1113 opacity: 1;
1114 }
1115 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-closing .mwai-window-box {
1116 opacity: 0;
1117 }
1118 }
1119 @media (max-width: 760px) {
1120 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-header {
1121 display: none !important;
1122 }
1123 }
1124 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-trigger .mwai-icon-container {
1125 transition: transform 0.2s ease-out, opacity 0.2s ease-out;
1126 }
1127 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-trigger .mwai-icon-container .mwai-icon {
1128 transition: transform 0.2s ease-out;
1129 }
1130 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-trigger .mwai-icon-container:hover .mwai-icon {
1131 transform: scale(1.1);
1132 }
1133 .mwai-timeless-theme.mwai-animation-fade.mwai-window .mwai-trigger .mwai-icon-container:active .mwai-icon {
1134 transform: scale(0.9);
1135 }
1136 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-opening .mwai-trigger .mwai-icon-container {
1137 opacity: 0;
1138 }
1139 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-closing .mwai-trigger {
1140 display: none !important;
1141 }
1142 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-center-open.mwai-closing .mwai-trigger {
1143 display: none !important;
1144 }
1145 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-window-dragging.mwai-closing .mwai-trigger {
1146 display: none !important;
1147 }
1148 .mwai-timeless-theme.mwai-animation-fade.mwai-window.mwai-open:not(.mwai-opening) .mwai-trigger {
1149 display: none;
1150 }
1151 .mwai-timeless-theme.mwai-animation-fade.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text-container {
1152 opacity: 1 !important;
1153 transition: none !important;
1154 }
1155 .mwai-timeless-theme.mwai-animation-fade.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
1156 will-change: transform, opacity;
1157 transform: none;
1158 }
1159 .mwai-timeless-theme.mwai-animation-fade.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
1160 animation: mwaiIconTextFadeOpacity 180ms ease-out 0ms 1 both, mwaiIconTextFadeTransform 220ms cubic-bezier(0.2, 0, 0, 1) 0ms 1 both;
1161 }
1162 .mwai-timeless-theme.mwai-animation-fade.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger:hover .mwai-icon-text {
1163 transform: scale(1.01);
1164 }
1165 @media (prefers-reduced-motion: reduce) {
1166 .mwai-timeless-theme.mwai-animation-fade.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text {
1167 animation: none !important;
1168 transform: none !important;
1169 }
1170 .mwai-timeless-theme.mwai-animation-fade.mwai-window:not(.mwai-open):not(.mwai-opening):not(.mwai-closing) .mwai-trigger .mwai-icon-text-container {
1171 opacity: 1 !important;
1172 transition: none !important;
1173 }
1174 }
1175 .mwai-timeless-theme:not(.mwai-animation-zoom):not(.mwai-animation-slide):not(.mwai-animation-fade).mwai-window .mwai-window-box {
1176 display: flex;
1177 flex-direction: column;
1178 filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.1));
1179 }
1180 .mwai-timeless-theme:not(.mwai-animation-zoom):not(.mwai-animation-slide):not(.mwai-animation-fade).mwai-window .mwai-trigger .mwai-icon-text-container {
1181 opacity: 1 !important;
1182 transition: none !important;
1183 }
1184 .mwai-timeless-theme:not(.mwai-animation-zoom):not(.mwai-animation-slide):not(.mwai-animation-fade).mwai-window .mwai-trigger .mwai-icon-text {
1185 animation: none !important;
1186 transition: none !important;
1187 opacity: 1 !important;
1188 transform: none !important;
1189 }
1190 .mwai-timeless-theme:not(.mwai-animation-zoom):not(.mwai-animation-slide):not(.mwai-animation-fade).mwai-window.mwai-fullscreen .mwai-window-box {
1191 width: 100%;
1192 height: 100%;
1193 }
1194 .mwai-timeless-theme.mwai-window .mwai-input-submit {
1195 margin-right: -5px; /* subtle overlap for visual balance on desktop */
1196 margin-left: 0;
1197 }
1198 .mwai-timeless-theme.mwai-window.mwai-fullscreen .mwai-input-submit {
1199 margin-right: 0; /* no overlap in fullscreen */
1200 }
1201 .mwai-timeless-theme.mwai-form-container {
1202 padding: var(--mwai-spacing);
1203 font-size: var(--mwai-fontSize);
1204 color: var(--mwai-fontColor);
1205 background: var(--mwai-backgroundPrimaryColor);
1206 border-radius: var(--mwai-borderRadius);
1207 }
1208 .mwai-timeless-theme.mwai-form-container fieldset {
1209 border: 0;
1210 margin: 0;
1211 padding: 0;
1212 display: flex;
1213 flex-direction: column;
1214 margin-bottom: 10px;
1215 }
1216 .mwai-timeless-theme.mwai-form-container fieldset input[type=text], .mwai-timeless-theme.mwai-form-container fieldset input[type=email], .mwai-timeless-theme.mwai-form-container fieldset input[type=tel], .mwai-timeless-theme.mwai-form-container fieldset input[type=url], .mwai-timeless-theme.mwai-form-container fieldset input[type=password], .mwai-timeless-theme.mwai-form-container fieldset input[type=number], .mwai-timeless-theme.mwai-form-container fieldset input[type=date], .mwai-timeless-theme.mwai-form-container fieldset input[type=datetime], .mwai-timeless-theme.mwai-form-container fieldset input[type=datetime-local], .mwai-timeless-theme.mwai-form-container fieldset input[type=month], .mwai-timeless-theme.mwai-form-container fieldset input[type=search], .mwai-timeless-theme.mwai-form-container fieldset input[type=time], .mwai-timeless-theme.mwai-form-container fieldset input[type=week], .mwai-timeless-theme.mwai-form-container fieldset select, .mwai-timeless-theme.mwai-form-container fieldset textarea {
1217 padding: calc(var(--mwai-spacing) * 2 / 3) var(--mwai-spacing);
1218 border: 0;
1219 width: 100%;
1220 border-radius: var(--mwai-borderRadius);
1221 font-size: var(--mwai-fontSize);
1222 background: var(--mwai-backgroundAiColor) !important;
1223 color: var(--mwai-fontColor);
1224 }
1225 .mwai-timeless-theme.mwai-form-container fieldset select {
1226 padding: calc(var(--mwai-spacing) * 2 / 3) var(--mwai-spacing);
1227 border: 0;
1228 width: 100%;
1229 border-radius: var(--mwai-borderRadius);
1230 font-size: var(--mwai-fontSize);
1231 background: var(--mwai-backgroundPrimaryColor);
1232 color: var(--mwai-fontColor);
1233 }
1234 .mwai-timeless-theme.mwai-form-container fieldset textarea {
1235 padding: calc(var(--mwai-spacing) * 2 / 3) var(--mwai-spacing);
1236 border: 0;
1237 width: 100%;
1238 border-radius: var(--mwai-borderRadius);
1239 font-family: inherit;
1240 font-size: var(--mwai-fontSize);
1241 background: var(--mwai-backgroundPrimaryColor);
1242 color: var(--mwai-fontColor);
1243 }
1244 .mwai-timeless-theme.mwai-form-container fieldset input[disabled], .mwai-timeless-theme.mwai-form-container fieldset select[disabled], .mwai-timeless-theme.mwai-form-container fieldset textarea[disabled] {
1245 opacity: 0.25;
1246 }
1247 .mwai-timeless-theme.mwai-form-container .mwai-form-submit button, .mwai-timeless-theme.mwai-form-container .mwai-form-reset button {
1248 height: 45px;
1249 background: none;
1250 width: 100%;
1251 color: white;
1252 font-size: var(--mwai-fontSize);
1253 background: var(--mwai-backgroundUserColor);
1254 border: 1px solid var(--mwai-backgroundPrimaryColor);
1255 border-radius: var(--mwai-borderRadius);
1256 cursor: pointer;
1257 transition: all 0.2s ease-out;
1258 position: relative;
1259 }
1260 .mwai-timeless-theme.mwai-form-container .mwai-form-submit button:hover, .mwai-timeless-theme.mwai-form-container .mwai-form-reset button:hover {
1261 filter: brightness(1.2);
1262 }
1263 .mwai-timeless-theme.mwai-form-container .mwai-form-submit button[disabled] span, .mwai-timeless-theme.mwai-form-container .mwai-form-reset button[disabled] span {
1264 opacity: 0.25;
1265 }
1266 .mwai-timeless-theme.mwai-form-container .mwai-form-submit button[disabled]:hover, .mwai-timeless-theme.mwai-form-container .mwai-form-reset button[disabled]:hover {
1267 filter: brightness(1);
1268 cursor: not-allowed;
1269 }
1270 .mwai-timeless-theme.mwai-form-container .mwai-form-submit.mwai-loading button span, .mwai-timeless-theme.mwai-form-container .mwai-form-reset.mwai-loading button span {
1271 opacity: 0;
1272 }
1273 .mwai-timeless-theme.mwai-form-container .mwai-form-submit.mwai-loading button::after, .mwai-timeless-theme.mwai-form-container .mwai-form-reset.mwai-loading button::after {
1274 content: "";
1275 position: absolute;
1276 width: 18px;
1277 height: 18px;
1278 top: 0;
1279 left: 0;
1280 right: 0;
1281 bottom: 0;
1282 margin: auto;
1283 border: 3px solid transparent;
1284 border-top-color: white;
1285 border-radius: 50%;
1286 animation: mwai-button-spinner 1s ease infinite;
1287 }
1288 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output {
1289 font-size: var(--mwai-fontSize);
1290 position: relative;
1291 margin-top: var(--mwai-spacing);
1292 padding: var(--mwai-spacing);
1293 border: 1px solid var(--mwai-backgroundPrimaryColor);
1294 }
1295 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output.mwai-error {
1296 background: var(--mwai-errorBackgroundColor);
1297 color: var(--mwai-errorFontColor);
1298 }
1299 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output > * {
1300 color: var(--mwai-fontColor) !important;
1301 }
1302 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output > *:first-child {
1303 margin-top: 0;
1304 }
1305 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output > *:last-child {
1306 margin-bottom: 0;
1307 }
1308 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output img {
1309 max-width: 33%;
1310 }
1311 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output div > *:first-child {
1312 margin-top: 0;
1313 }
1314 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container .mwai-form-output div > *:last-child {
1315 margin-bottom: 0;
1316 }
1317 .mwai-timeless-theme.mwai-form-container .mwai-form-output-container.mwai-has-content {
1318 display: block;
1319 }
1320 .mwai-timeless-theme.mwai-form-container .wp-block-columns {
1321 margin: 0;
1322 }
1323
1324 .mwai-timeless-theme .mwai-files {
1325 display: flex;
1326 flex-direction: column;
1327 gap: 8px;
1328 padding: var(--mwai-spacing);
1329 background: var(--mwai-backgroundSecondaryColor);
1330 border-top: 1px solid var(--mwai-backgroundPrimaryColor);
1331 }
1332 .mwai-timeless-theme .mwai-files::-webkit-scrollbar {
1333 width: 6px;
1334 }
1335 .mwai-timeless-theme .mwai-files::-webkit-scrollbar-track {
1336 background: var(--mwai-backgroundPrimaryColor);
1337 border-radius: 3px;
1338 }
1339 .mwai-timeless-theme .mwai-files::-webkit-scrollbar-thumb {
1340 background: var(--mwai-backgroundHeaderColor);
1341 border-radius: 3px;
1342 }
1343 .mwai-timeless-theme .mwai-files::-webkit-scrollbar-thumb:hover {
1344 background: var(--mwai-primaryColor);
1345 }
1346 .mwai-timeless-theme .mwai-files .mwai-file-preview {
1347 position: relative;
1348 }
1349 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-content {
1350 display: flex;
1351 align-items: center;
1352 gap: 8px;
1353 }
1354 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-thumbnail {
1355 width: 32px;
1356 height: 32px;
1357 object-fit: cover;
1358 border-radius: 4px;
1359 border: 1px solid var(--mwai-backgroundHeaderColor);
1360 display: block;
1361 flex-shrink: 0;
1362 }
1363 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-icon {
1364 width: 32px;
1365 height: 32px;
1366 display: flex;
1367 align-items: center;
1368 justify-content: center;
1369 background: var(--mwai-backgroundSecondaryColor);
1370 border-radius: 4px;
1371 color: var(--mwai-fontColor);
1372 opacity: 0.6;
1373 flex-shrink: 0;
1374 }
1375 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-icon svg {
1376 width: 18px;
1377 height: 18px;
1378 }
1379 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-info {
1380 flex: 1;
1381 min-width: 0;
1382 display: flex;
1383 flex-direction: column;
1384 gap: 2px;
1385 }
1386 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-name {
1387 font-size: calc(var(--mwai-fontSize) * 0.85);
1388 color: var(--mwai-fontColor);
1389 white-space: nowrap;
1390 overflow: hidden;
1391 text-overflow: ellipsis;
1392 line-height: 1.2;
1393 }
1394 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-size {
1395 font-size: calc(var(--mwai-fontSize) * 0.7);
1396 color: var(--mwai-fontColor);
1397 opacity: 0.5;
1398 line-height: 1;
1399 }
1400 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-progress {
1401 position: absolute;
1402 bottom: 0;
1403 left: 0;
1404 right: 0;
1405 height: 2px;
1406 background: var(--mwai-backgroundHeaderColor);
1407 border-radius: 0 0 calc(var(--mwai-borderRadius) / 2) calc(var(--mwai-borderRadius) / 2);
1408 overflow: hidden;
1409 }
1410 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-progress .mwai-file-progress-bar {
1411 height: 100%;
1412 background: var(--mwai-primaryColor);
1413 transition: width 0.3s ease;
1414 }
1415 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-remove {
1416 display: flex;
1417 align-items: center;
1418 justify-content: center;
1419 background: none;
1420 cursor: pointer;
1421 color: var(--mwai-fontColor);
1422 padding: 4px;
1423 border: none;
1424 line-height: 0;
1425 min-width: inherit;
1426 margin-left: auto;
1427 opacity: 0.6;
1428 transition: opacity 0.2s ease;
1429 }
1430 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-remove:hover {
1431 opacity: 1;
1432 }
1433 .mwai-timeless-theme .mwai-files .mwai-file-preview .mwai-file-remove svg {
1434 width: 20px;
1435 height: 20px;
1436 }
1437 .mwai-timeless-theme .mwai-files:empty {
1438 display: none;
1439 }
1440 .mwai-timeless-theme .mwai-file-upload-icon {
1441 margin-bottom: -3px;
1442 }
1443 .mwai-timeless-theme .mwai-terminal {
1444 --mwai-terminal-active-color: var(--mwai-fontColor);
1445 font-family: ui-monospace, SFMono-Regular, "SF Mono", Monaco, Menlo, Consolas, "Liberation Mono", "Courier New", monospace;
1446 font-size: 12px;
1447 background: var(--mwai-backgroundPrimaryColor);
1448 color: var(--mwai-fontColor);
1449 padding: var(--mwai-spacing);
1450 height: 100%;
1451 overflow-y: auto;
1452 cursor: text;
1453 display: flex;
1454 flex-direction: column;
1455 flex: 1 1 auto;
1456 min-height: 0;
1457 padding-bottom: calc(var(--mwai-spacing) * 1.25);
1458 scrollbar-width: thin;
1459 scrollbar-color: rgba(128, 128, 128, 0.3) transparent;
1460 }
1461 .mwai-timeless-theme .mwai-terminal:focus {
1462 outline: none;
1463 }
1464 .mwai-timeless-theme .mwai-terminal .mwai-terminal-line {
1465 display: flex;
1466 align-items: flex-start;
1467 margin: calc(var(--mwai-spacing) / 2) 0;
1468 white-space: pre-wrap;
1469 word-wrap: break-word;
1470 word-break: break-word;
1471 }
1472 .mwai-timeless-theme .mwai-terminal .mwai-terminal-line.mwai-terminal-user {
1473 color: var(--mwai-fontColor);
1474 opacity: 0.35;
1475 }
1476 .mwai-timeless-theme .mwai-terminal .mwai-terminal-line.mwai-terminal-user-typing {
1477 color: var(--mwai-terminal-active-color);
1478 opacity: 1;
1479 }
1480 .mwai-timeless-theme .mwai-terminal .mwai-terminal-line.mwai-terminal-user-typing .mwai-terminal-prompt {
1481 color: var(--mwai-terminal-active-color);
1482 }
1483 .mwai-timeless-theme .mwai-terminal .mwai-terminal-line.mwai-terminal-assistant {
1484 color: var(--mwai-fontColor);
1485 }
1486 .mwai-timeless-theme .mwai-terminal .mwai-terminal-line.mwai-terminal-system {
1487 color: #608b4e;
1488 font-style: italic;
1489 }
1490 .mwai-timeless-theme .mwai-terminal .mwai-terminal-prompt {
1491 color: var(--mwai-terminal-active-color);
1492 margin-left: -4px;
1493 margin-right: 4px;
1494 display: inline-flex;
1495 align-items: center;
1496 height: 1.5em;
1497 line-height: 1.2;
1498 flex-shrink: 0;
1499 align-self: flex-start;
1500 }
1501 .mwai-timeless-theme .mwai-terminal .mwai-terminal-prompt svg {
1502 display: block;
1503 width: 1.4em;
1504 height: 1.4em;
1505 }
1506 .mwai-timeless-theme .mwai-terminal .mwai-terminal-text {
1507 color: inherit;
1508 }
1509 .mwai-timeless-theme .mwai-terminal .mwai-terminal-input-wrapper {
1510 flex: 1;
1511 display: inline;
1512 white-space: pre-wrap;
1513 word-wrap: break-word;
1514 word-break: break-word;
1515 }
1516 .mwai-timeless-theme .mwai-terminal .mwai-terminal-typed {
1517 color: var(--mwai-terminal-active-color);
1518 white-space: pre-wrap;
1519 word-wrap: break-word;
1520 word-break: break-word;
1521 }
1522 .mwai-timeless-theme .mwai-terminal .mwai-terminal-cursor {
1523 display: inline-block;
1524 min-width: 8px;
1525 height: 1.35em;
1526 color: var(--mwai-terminal-active-color);
1527 background: var(--mwai-terminal-active-color);
1528 opacity: 0.35;
1529 vertical-align: text-bottom;
1530 line-height: inherit;
1531 }
1532 .mwai-timeless-theme .mwai-terminal .mwai-terminal-cursor.mwai-terminal-cursor-active {
1533 opacity: 1;
1534 color: var(--mwai-backgroundPrimaryColor);
1535 animation: mwai-cursor-blink 1s infinite;
1536 }
1537 .mwai-timeless-theme .mwai-terminal .mwai-terminal-cursor.mwai-terminal-cursor-typing {
1538 opacity: 1;
1539 color: var(--mwai-backgroundPrimaryColor);
1540 }
1541 .mwai-timeless-theme .mwai-terminal .mwai-terminal-cursor.mwai-terminal-cursor-inactive {
1542 opacity: 0.35;
1543 }
1544 .mwai-timeless-theme .mwai-terminal::-webkit-scrollbar {
1545 width: 8px;
1546 background: transparent;
1547 }
1548 .mwai-timeless-theme .mwai-terminal::-webkit-scrollbar-track {
1549 background: transparent;
1550 }
1551 .mwai-timeless-theme .mwai-terminal::-webkit-scrollbar-thumb {
1552 background: rgba(128, 128, 128, 0.3);
1553 border-radius: 4px;
1554 }
1555 .mwai-timeless-theme .mwai-terminal::-webkit-scrollbar-thumb:hover {
1556 background: rgba(128, 128, 128, 0.5);
1557 }
1558 .mwai-timeless-theme .mwai-terminal + .mwai-compliance {
1559 margin-top: 0;
1560 }
1561 .mwai-timeless-theme.mwai-transition, .mwai-timeless-theme .mwai-transition {
1562 opacity: 0;
1563 transition: opacity 350ms ease-in-out;
1564 }
1565 .mwai-timeless-theme.mwai-transition-visible, .mwai-timeless-theme .mwai-transition-visible {
1566 opacity: 1;
1567 }
1568 .mwai-timeless-theme .mwai-text {
1569 overflow-wrap: anywhere;
1570 }
1571 .mwai-timeless-theme .mwai-text img, .mwai-timeless-theme .mwai-text svg {
1572 max-width: 100%;
1573 }
1574 .mwai-timeless-theme .mwai-text div p:first-child {
1575 margin-top: 0;
1576 }
1577 .mwai-timeless-theme .mwai-text div p:last-child {
1578 margin-bottom: 0;
1579 }
1580 .mwai-timeless-theme .mwai-trigger {
1581 position: absolute;
1582 right: 0;
1583 bottom: 0;
1584 transition: all 0.2s ease-out;
1585 z-index: 9999;
1586 display: flex;
1587 flex-direction: column;
1588 align-items: end;
1589 }
1590 .mwai-timeless-theme .mwai-trigger .mwai-icon-text-container {
1591 display: flex;
1592 flex-direction: column;
1593 align-items: flex-end;
1594 position: relative;
1595 z-index: 2;
1596 }
1597 .mwai-timeless-theme .mwai-trigger .mwai-icon-text-container .mwai-icon-text {
1598 background: var(--mwai-iconTextBackgroundColor);
1599 color: var(--mwai-iconTextColor);
1600 box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
1601 max-width: 200px;
1602 font-size: 13px;
1603 margin-bottom: 15px;
1604 padding: 10px 15px;
1605 border-radius: 8px;
1606 position: relative;
1607 user-select: none;
1608 -webkit-user-select: none;
1609 -ms-user-select: none;
1610 }
1611 .mwai-timeless-theme .mwai-trigger .mwai-icon-text-container .mwai-icon-text-close {
1612 --mwai-icon-close-size: 28px;
1613 color: var(--mwai-iconTextColor);
1614 background: var(--mwai-iconTextBackgroundColor);
1615 font-size: 13px;
1616 line-height: 1;
1617 width: var(--mwai-icon-close-size);
1618 height: var(--mwai-icon-close-size);
1619 min-width: var(--mwai-icon-close-size);
1620 min-height: var(--mwai-icon-close-size);
1621 border-radius: 50%;
1622 display: flex;
1623 opacity: 0;
1624 visibility: hidden;
1625 pointer-events: none;
1626 transition: opacity 120ms ease, transform 120ms ease, visibility 0s linear 120ms;
1627 justify-content: center;
1628 align-items: center;
1629 position: absolute;
1630 right: 0;
1631 top: 0;
1632 transform: translate(40%, -40%);
1633 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
1634 z-index: 2;
1635 cursor: pointer;
1636 pointer-events: auto;
1637 -webkit-tap-highlight-color: transparent;
1638 user-select: none;
1639 -webkit-user-select: none;
1640 -ms-user-select: none;
1641 }
1642 .mwai-timeless-theme .mwai-trigger .mwai-icon-text-container:hover {
1643 cursor: pointer;
1644 }
1645 .mwai-timeless-theme .mwai-trigger .mwai-icon-text-container:hover .mwai-icon-text-close {
1646 opacity: 1;
1647 visibility: visible;
1648 pointer-events: auto;
1649 transform: translate(40%, -40%) scale(1);
1650 transition: opacity 120ms ease, transform 120ms ease, visibility 0s;
1651 }
1652 .mwai-timeless-theme .mwai-trigger .mwai-icon-text-container:hover .mwai-icon-text-close:hover {
1653 filter: brightness(1.1);
1654 transform: translate(40%, -40%) scale(1.06);
1655 }
1656 @media (max-width: 760px) {
1657 .mwai-timeless-theme .mwai-trigger .mwai-icon-text-container .mwai-icon-text-close {
1658 opacity: 1;
1659 visibility: visible;
1660 pointer-events: auto;
1661 transform: translate(40%, -40%) scale(1);
1662 transition: opacity 120ms ease, transform 120ms ease, visibility 0s;
1663 }
1664 }
1665 .mwai-timeless-theme .mwai-trigger .mwai-icon-container {
1666 position: relative;
1667 z-index: 1;
1668 }
1669 .mwai-timeless-theme .mwai-trigger .mwai-icon-container .mwai-icon {
1670 filter: drop-shadow(0px 0px 15px rgba(0, 0, 0, 0.15));
1671 transition: all 0.2s ease-out;
1672 }
1673 .mwai-timeless-theme .mwai-trigger .mwai-icon-container .mwai-icon:hover {
1674 cursor: pointer;
1675 transform: scale(1.05);
1676 }
1677 .mwai-timeless-theme.mwai-window {
1678 position: fixed;
1679 right: 30px;
1680 bottom: 30px;
1681 width: var(--mwai-width);
1682 z-index: 9999;
1683 }
1684 .mwai-timeless-theme.mwai-window .mwai-window-box {
1685 position: relative;
1686 z-index: 1;
1687 }
1688 .mwai-timeless-theme.mwai-window .mwai-header {
1689 display: none;
1690 justify-content: space-between;
1691 align-items: center;
1692 padding: 0 0 0 15px;
1693 border-radius: var(--mwai-borderRadius) var(--mwai-borderRadius) 0 0;
1694 background: var(--mwai-backgroundHeaderColor);
1695 }
1696 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons {
1697 display: flex;
1698 align-items: center;
1699 margin-left: auto;
1700 }
1701 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-resize-button {
1702 justify-content: center;
1703 height: 32px;
1704 width: 32px;
1705 cursor: pointer;
1706 display: flex;
1707 justify-content: center;
1708 align-items: center;
1709 }
1710 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-resize-button:before {
1711 transition: all 0.2s ease-out;
1712 content: " ";
1713 cursor: pointer;
1714 position: absolute;
1715 height: 13px;
1716 width: 13px;
1717 border: 1.2px solid var(--mwai-headerColor);
1718 }
1719 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-resize-button:hover:before {
1720 width: 16px;
1721 height: 16px;
1722 }
1723 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-close-button {
1724 justify-content: center;
1725 height: 32px;
1726 width: 32px;
1727 cursor: pointer;
1728 border-radius: var(--mwai-borderRadius);
1729 margin-left: -10px;
1730 }
1731 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-close-button:before {
1732 transition: all 0.2s ease-out;
1733 transform: translate(16px, 5px) rotate(45deg);
1734 }
1735 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-close-button:after {
1736 transition: all 0.2s ease-out;
1737 transform: translate(16px, 5px) rotate(-45deg);
1738 }
1739 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-close-button:before, .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-close-button:after {
1740 content: " ";
1741 cursor: pointer;
1742 position: absolute;
1743 height: 22px;
1744 width: 1.2px;
1745 background-color: var(--mwai-headerColor);
1746 }
1747 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-close-button:hover:before {
1748 opacity: 1;
1749 transform: translate(16px, 5px) rotate(135deg);
1750 }
1751 .mwai-timeless-theme.mwai-window .mwai-header .mwai-buttons .mwai-close-button:hover:after {
1752 opacity: 1;
1753 transform: translate(16px, 5px) rotate(45deg);
1754 }
1755 .mwai-timeless-theme.mwai-window.mwai-opening, .mwai-timeless-theme.mwai-window.mwai-closing {
1756 cursor: default !important;
1757 }
1758 .mwai-timeless-theme.mwai-window.mwai-opening .mwai-header, .mwai-timeless-theme.mwai-window.mwai-closing .mwai-header {
1759 cursor: default !important;
1760 }
1761 .mwai-timeless-theme.mwai-window .mwai-body {
1762 display: none;
1763 opacity: 0;
1764 max-height: var(--mwai-maxHeight);
1765 border-radius: 0 0 var(--mwai-borderRadius) var(--mwai-borderRadius);
1766 }
1767 .mwai-timeless-theme.mwai-window.mwai-bottom-left {
1768 bottom: 30px;
1769 right: inherit;
1770 left: 30px;
1771 }
1772 .mwai-timeless-theme.mwai-window.mwai-bottom-left .mwai-trigger {
1773 right: inherit;
1774 left: 0;
1775 }
1776 .mwai-timeless-theme.mwai-window.mwai-top-right {
1777 top: 30px;
1778 bottom: inherit;
1779 right: 30px;
1780 }
1781 .mwai-timeless-theme.mwai-window.mwai-top-right .mwai-trigger {
1782 top: 0;
1783 bottom: inherit;
1784 }
1785 .mwai-timeless-theme.mwai-window.mwai-top-left {
1786 top: 30px;
1787 bottom: inherit;
1788 right: inherit;
1789 left: 30px;
1790 }
1791 .mwai-timeless-theme.mwai-window.mwai-top-left .mwai-trigger {
1792 top: 0;
1793 bottom: inherit;
1794 right: inherit;
1795 left: 0;
1796 }
1797 .mwai-timeless-theme.mwai-window.mwai-center-open.mwai-open {
1798 top: 50%;
1799 left: 50%;
1800 transform: translate(-50%, -50%);
1801 right: auto;
1802 bottom: auto;
1803 }
1804 @media (max-width: 760px) {
1805 .mwai-timeless-theme.mwai-window.mwai-center-open.mwai-open {
1806 width: calc(100% - 40px);
1807 max-width: var(--mwai-width);
1808 }
1809 }
1810 .mwai-timeless-theme.mwai-window.mwai-top-left .mwai-trigger, .mwai-timeless-theme.mwai-window.mwai-bottom-left .mwai-trigger {
1811 align-items: flex-start;
1812 }
1813 .mwai-timeless-theme.mwai-window.mwai-top-right .mwai-trigger, .mwai-timeless-theme.mwai-window.mwai-top-left .mwai-trigger {
1814 flex-direction: column-reverse;
1815 }
1816 .mwai-timeless-theme.mwai-window.mwai-top-right .mwai-trigger .mwai-icon-text, .mwai-timeless-theme.mwai-window.mwai-top-left .mwai-trigger .mwai-icon-text {
1817 margin-bottom: 0;
1818 margin-top: 15px;
1819 }
1820 .mwai-timeless-theme.mwai-window.mwai-fullscreen .mwai-header .mwai-buttons {
1821 margin-bottom: 0px;
1822 }
1823 .mwai-timeless-theme.mwai-window.mwai-fullscreen .mwai-header .mwai-buttons .mwai-resize-button:before {
1824 width: 16px;
1825 height: 16px;
1826 }
1827 .mwai-timeless-theme.mwai-window.mwai-fullscreen .mwai-header .mwai-buttons .mwai-resize-button:hover:before {
1828 width: 13px;
1829 height: 13px;
1830 }
1831 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) {
1832 position: fixed;
1833 left: 0 !important;
1834 right: 0 !important;
1835 bottom: 0 !important;
1836 top: 0 !important;
1837 width: 100%;
1838 height: 100%;
1839 height: 100vh;
1840 height: 100dvh;
1841 max-height: 100dvh;
1842 max-width: 100%;
1843 display: flex;
1844 flex-direction: column;
1845 margin: 0;
1846 z-index: 999999;
1847 background-color: var(--mwai-backgroundSecondaryColor);
1848 display: flex !important;
1849 visibility: visible !important;
1850 opacity: 1 !important;
1851 }
1852 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-header {
1853 border-radius: 0;
1854 }
1855 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-body {
1856 flex: 1;
1857 min-height: 0;
1858 max-height: inherit;
1859 border-radius: 0;
1860 display: flex !important;
1861 flex-direction: column !important;
1862 }
1863 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-body .mwai-conversation {
1864 flex: 0 1 auto !important;
1865 max-height: none;
1866 overflow-y: auto;
1867 min-height: 0;
1868 }
1869 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-body .mwai-fullscreen-spacer {
1870 flex: 1 1 auto !important;
1871 min-height: 0;
1872 }
1873 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-body .mwai-input {
1874 flex: 0 0 auto;
1875 }
1876 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-body .mwai-footer {
1877 flex: 0 0 auto;
1878 }
1879 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-body .mwai-files {
1880 flex: 0 0 auto;
1881 }
1882 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-window-box {
1883 width: 100%;
1884 height: 100%;
1885 display: flex;
1886 flex-direction: column;
1887 }
1888 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-header {
1889 display: flex !important;
1890 visibility: visible !important;
1891 opacity: 1 !important;
1892 flex: 0 0 auto;
1893 }
1894 .mwai-timeless-theme.mwai-fullscreen:not(.mwai-window) .mwai-body {
1895 display: flex !important;
1896 visibility: visible !important;
1897 opacity: 1 !important;
1898 flex: 1 1 auto;
1899 flex-direction: column;
1900 min-height: 0;
1901 height: 100%;
1902 }
1903 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open {
1904 position: fixed;
1905 left: 0 !important;
1906 right: 0 !important;
1907 bottom: 0 !important;
1908 top: 0 !important;
1909 width: 100%;
1910 height: 100%;
1911 height: 100vh;
1912 height: 100dvh;
1913 max-height: 100dvh;
1914 max-width: 100%;
1915 display: flex;
1916 flex-direction: column;
1917 margin: 0;
1918 z-index: 999999;
1919 background-color: var(--mwai-backgroundSecondaryColor);
1920 transform: none !important;
1921 }
1922 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-header {
1923 border-radius: 0;
1924 }
1925 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-body {
1926 flex: 1;
1927 min-height: 0;
1928 max-height: inherit;
1929 border-radius: 0;
1930 display: flex !important;
1931 flex-direction: column !important;
1932 }
1933 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-body .mwai-conversation {
1934 flex: 0 1 auto !important;
1935 max-height: none;
1936 overflow-y: auto;
1937 min-height: 0;
1938 }
1939 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-body .mwai-fullscreen-spacer {
1940 flex: 1 1 auto !important;
1941 min-height: 0;
1942 }
1943 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-body .mwai-input {
1944 flex: 0 0 auto;
1945 }
1946 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-body .mwai-footer {
1947 flex: 0 0 auto;
1948 }
1949 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-body .mwai-files {
1950 flex: 0 0 auto;
1951 }
1952 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-window-box {
1953 width: 100%;
1954 height: 100%;
1955 display: flex;
1956 flex-direction: column;
1957 }
1958 .mwai-timeless-theme.mwai-fullscreen.mwai-window.mwai-open .mwai-body {
1959 flex: 1 1 auto;
1960 min-height: 0;
1961 }
1962 .mwai-timeless-theme.mwai-window.mwai-open .mwai-header {
1963 display: flex;
1964 }
1965 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body {
1966 display: flex;
1967 transition: opacity 200ms ease-in-out 0s;
1968 opacity: 1;
1969 }
1970 .mwai-timeless-theme.mwai-window.mwai-open .mwai-trigger {
1971 display: none;
1972 }
1973 .mwai-timeless-theme .mwai-body > .mwai-error {
1974 margin: var(--mwai-spacing);
1975 color: white;
1976 background: rgba(180, 55, 55, 0.55);
1977 padding: var(--mwai-spacing);
1978 border-radius: var(--mwai-borderRadius);
1979 }
1980 .mwai-timeless-theme .mwai-body > .mwai-error:hover {
1981 cursor: pointer;
1982 background: rgba(180, 44, 44, 0.85);
1983 }
1984 .mwai-timeless-theme .mwai-reply.mwai-error .mwai-text {
1985 color: #ff5656;
1986 }
1987 .mwai-timeless-theme .mwai-reply.mwai-error .mwai-text a {
1988 color: #ff5656;
1989 text-decoration: underline;
1990 }
1991 .mwai-timeless-theme .mwai-reply.mwai-error .mwai-reply-actions .mwai-action-button {
1992 fill: var(--mwai-fontColor);
1993 padding: 3px 5px;
1994 width: 24px;
1995 height: 24px;
1996 background: var(--mwai-backgroundPrimaryColor);
1997 cursor: pointer;
1998 border-radius: 5px;
1999 }
2000 .mwai-timeless-theme .mwai-reply.mwai-error .mwai-reply-actions .mwai-action-button:hover {
2001 filter: brightness(1.2);
2002 }
2003 .mwai-timeless-theme .mwai-reply-actions {
2004 opacity: 0;
2005 transition: opacity 0.2s ease-in-out;
2006 }
2007 .mwai-timeless-theme .mwai-reply:hover .mwai-reply-actions {
2008 opacity: 1 !important;
2009 }
2010 .mwai-timeless-theme .mwai-form-output-container:hover .mwai-reply-actions {
2011 opacity: 1 !important;
2012 }
2013 .mwai-timeless-theme .mwai-form-output-container:hover .mwai-reply-actions.mwai-hidden {
2014 opacity: 1 !important;
2015 }
2016 .mwai-timeless-theme.mwai-bubble .mwai-trigger .mwai-icon-container {
2017 background: var(--mwai-bubbleColor);
2018 width: var(--mwai-iconSize, 60px);
2019 height: var(--mwai-iconSize, 60px);
2020 border-radius: 100%;
2021 transition: all 0.2s ease-out;
2022 display: flex;
2023 justify-content: center;
2024 align-items: center;
2025 }
2026 .mwai-timeless-theme.mwai-bubble .mwai-trigger .mwai-icon-container .mwai-icon {
2027 max-width: 50%;
2028 max-height: 50%;
2029 filter: none;
2030 }
2031 .mwai-timeless-theme.mwai-bubble .mwai-trigger .mwai-icon-container .mwai-icon:hover {
2032 transform: none;
2033 }
2034 .mwai-timeless-theme.mwai-bubble .mwai-trigger .mwai-icon-container .mwai-emoji {
2035 font-size: calc(var(--mwai-iconSize, 60px) / 2);
2036 }
2037 .mwai-timeless-theme.mwai-bubble .mwai-trigger .mwai-icon-container:hover {
2038 cursor: pointer;
2039 filter: brightness(1.1);
2040 }
2041 @media (max-width: 760px) {
2042 .mwai-timeless-theme.mwai-window.mwai-open {
2043 position: fixed;
2044 top: var(--mwai-vv-offset-top, 0) !important;
2045 left: 0 !important;
2046 right: 0 !important;
2047 bottom: var(--mwai-vv-offset-bottom, 0) !important;
2048 width: 100%;
2049 min-height: 100%;
2050 min-height: 100vh;
2051 min-height: var(--mwai-vv-height, 100dvh);
2052 height: var(--mwai-vv-height, 100dvh);
2053 max-height: var(--mwai-vv-height, 100dvh);
2054 max-width: 100%;
2055 margin: 0;
2056 z-index: 999999;
2057 background-color: var(--mwai-backgroundPrimaryColor, var(--mwai-backgroundSecondaryColor));
2058 border-radius: 0 !important;
2059 box-shadow: none !important;
2060 border: none !important;
2061 padding-top: env(safe-area-inset-top, 0);
2062 padding-left: env(safe-area-inset-left, 0);
2063 padding-right: env(safe-area-inset-right, 0);
2064 box-sizing: border-box;
2065 }
2066 .mwai-timeless-theme.mwai-window.mwai-open .mwai-window-box {
2067 width: 100%;
2068 height: 100%;
2069 flex: 1;
2070 display: flex;
2071 flex-direction: column;
2072 border-radius: 0 !important;
2073 box-shadow: none !important;
2074 border: none !important;
2075 background: transparent !important;
2076 min-height: 0;
2077 }
2078 .mwai-timeless-theme.mwai-window.mwai-open .mwai-header {
2079 display: none !important;
2080 }
2081 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body {
2082 flex: 1;
2083 min-height: 0;
2084 display: flex;
2085 flex-direction: column;
2086 border-radius: 0 !important;
2087 overflow: hidden;
2088 background: var(--mwai-backgroundPrimaryColor, var(--mwai-backgroundSecondaryColor));
2089 }
2090 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body .mwai-conversation {
2091 flex: 1;
2092 overflow-y: auto;
2093 max-height: none;
2094 min-height: 0;
2095 }
2096 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body .mwai-input {
2097 flex-shrink: 0;
2098 position: relative;
2099 }
2100 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body .mwai-footer {
2101 flex-shrink: 0;
2102 position: relative;
2103 }
2104 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body .mwai-body:last-child .mwai-input {
2105 padding-bottom: env(safe-area-inset-bottom, 0);
2106 }
2107 .mwai-timeless-theme.mwai-window.mwai-open .mwai-mobile-header {
2108 display: flex;
2109 position: sticky;
2110 top: 0;
2111 left: 0;
2112 right: 0;
2113 min-height: 50px;
2114 background: var(--mwai-backgroundHeaderColor);
2115 border-bottom: 1px solid var(--mwai-lineColor);
2116 padding: 0 15px;
2117 padding-top: env(safe-area-inset-top, 0);
2118 padding-left: calc(15px + env(safe-area-inset-left, 0));
2119 padding-right: calc(15px + env(safe-area-inset-right, 0));
2120 align-items: center;
2121 justify-content: space-between;
2122 z-index: 10;
2123 flex-shrink: 0;
2124 }
2125 .mwai-timeless-theme.mwai-window.mwai-open .mwai-mobile-header .mwai-mobile-header-title {
2126 font-size: 16px;
2127 font-weight: 600;
2128 color: var(--mwai-headerColor);
2129 flex: 1;
2130 overflow: hidden;
2131 text-overflow: ellipsis;
2132 white-space: nowrap;
2133 }
2134 .mwai-timeless-theme.mwai-window.mwai-open .mwai-mobile-header .mwai-mobile-header-close {
2135 all: unset;
2136 display: flex;
2137 align-items: center;
2138 justify-content: center;
2139 width: 32px;
2140 height: 32px;
2141 min-width: 32px;
2142 cursor: pointer;
2143 border-radius: 6px;
2144 transition: background-color 0.2s ease;
2145 -webkit-tap-highlight-color: transparent;
2146 }
2147 .mwai-timeless-theme.mwai-window.mwai-open .mwai-mobile-header .mwai-mobile-header-close:hover, .mwai-timeless-theme.mwai-window.mwai-open .mwai-mobile-header .mwai-mobile-header-close:active {
2148 background-color: var(--mwai-backgroundSecondaryColor);
2149 }
2150 .mwai-timeless-theme.mwai-window.mwai-open .mwai-mobile-header .mwai-mobile-header-close svg {
2151 width: 20px;
2152 height: 20px;
2153 }
2154 .mwai-timeless-theme.mwai-window.mwai-open .mwai-mobile-header .mwai-mobile-header-close svg path {
2155 stroke: var(--mwai-headerColor);
2156 }
2157 .mwai-timeless-theme.mwai-window.mwai-open.mwai-center-open {
2158 top: var(--mwai-vv-offset-top, 0) !important;
2159 left: 0 !important;
2160 transform: none !important;
2161 right: 0 !important;
2162 bottom: var(--mwai-vv-offset-bottom, 0) !important;
2163 width: 100% !important;
2164 max-width: 100% !important;
2165 height: var(--mwai-vv-height, 100dvh) !important;
2166 }
2167 .mwai-timeless-theme.mwai-window.mwai-open .mwai-input {
2168 flex-direction: column;
2169 }
2170 .mwai-timeless-theme.mwai-window.mwai-open .mwai-input button:not(.mwai-input-submit) {
2171 font-size: 16px;
2172 margin-left: 0;
2173 width: 100%;
2174 }
2175 .mwai-timeless-theme.mwai-window.mwai-open .mwai-input .mwai-input-text {
2176 width: 100%;
2177 }
2178 .mwai-timeless-theme.mwai-window.mwai-open .mwai-input .mwai-input-text input, .mwai-timeless-theme.mwai-window.mwai-open .mwai-input .mwai-input-text textarea {
2179 font-size: 16px;
2180 }
2181 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body {
2182 display: flex;
2183 transition: opacity 200ms ease-in-out 0s;
2184 opacity: 1;
2185 flex: 1;
2186 min-height: 0;
2187 max-height: inherit;
2188 }
2189 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body .mwai-conversation {
2190 flex: 1;
2191 max-height: none;
2192 min-height: 0;
2193 }
2194 .mwai-timeless-theme.mwai-window.mwai-open .mwai-resize-button {
2195 display: none !important;
2196 }
2197 .mwai-timeless-theme.mwai-window.mwai-open .mwai-trigger {
2198 display: none;
2199 }
2200 }
2201 @keyframes mwai-button-spinner {
2202 from {
2203 transform: rotate(0turn);
2204 }
2205 to {
2206 transform: rotate(1turn);
2207 }
2208 }
2209 .mwai-timeless-theme button:not(.mwai-busy):before {
2210 content: none !important;
2211 display: none !important;
2212 animation: none !important;
2213 }
2214 .mwai-timeless-theme .admin-bar .mwai-fullscreen:not(.mwai-window),
2215 .mwai-timeless-theme .admin-bar .mwai-fullscreen.mwai-window.mwai-open {
2216 top: 32px;
2217 }
2218 .mwai-timeless-theme .mwai-input .mwai-terminal-line {
2219 display: flex;
2220 align-items: flex-start;
2221 color: var(--mwai-terminal-active-color, var(--mwai-fontColor));
2222 }
2223 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-prompt {
2224 color: var(--mwai-terminal-active-color, currentColor);
2225 margin-left: -4px;
2226 margin-right: 4px;
2227 display: inline-flex;
2228 align-items: center;
2229 height: 1.5em;
2230 line-height: 1.2;
2231 flex-shrink: 0;
2232 align-self: flex-start;
2233 }
2234 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-prompt svg {
2235 display: block;
2236 width: 1.4em;
2237 height: 1.4em;
2238 }
2239 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-input-wrapper {
2240 flex: 1;
2241 display: inline;
2242 white-space: pre-wrap;
2243 word-wrap: break-word;
2244 word-break: break-word;
2245 }
2246 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-typed {
2247 white-space: pre-wrap;
2248 word-wrap: break-word;
2249 word-break: break-word;
2250 }
2251 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-cursor {
2252 display: inline-block;
2253 min-width: 8px;
2254 height: 1.35em;
2255 color: currentColor;
2256 background: currentColor;
2257 opacity: 0.35;
2258 vertical-align: text-bottom;
2259 line-height: inherit;
2260 }
2261 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-cursor.mwai-terminal-cursor-active {
2262 opacity: 1;
2263 color: var(--mwai-backgroundPrimaryColor, #1a1a2e);
2264 animation: mwai-cursor-blink 1s infinite;
2265 }
2266 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-cursor.mwai-terminal-cursor-typing {
2267 opacity: 1;
2268 color: var(--mwai-backgroundPrimaryColor, #1a1a2e);
2269 }
2270 .mwai-timeless-theme .mwai-input .mwai-terminal-line .mwai-terminal-cursor.mwai-terminal-cursor-inactive {
2271 opacity: 0.35;
2272 }
2273 .mwai-timeless-theme pre code.hljs {
2274 display: block;
2275 overflow-x: auto;
2276 padding: 1em;
2277 }
2278 .mwai-timeless-theme code.hljs {
2279 padding: 3px 5px;
2280 }
2281 .mwai-timeless-theme .hljs {
2282 color: #333;
2283 background: #f0f0f0;
2284 }
2285 .mwai-timeless-theme .hljs-subst {
2286 color: #333;
2287 }
2288 .mwai-timeless-theme .hljs-comment {
2289 color: #888;
2290 }
2291 .mwai-timeless-theme .hljs-attr, .mwai-timeless-theme .hljs-doctag, .mwai-timeless-theme .hljs-keyword, .mwai-timeless-theme .hljs-meta .hljs-keyword, .mwai-timeless-theme .hljs-section, .mwai-timeless-theme .hljs-selector-tag {
2292 color: #0077cc;
2293 }
2294 .mwai-timeless-theme .hljs-attribute {
2295 color: #aa3377;
2296 }
2297 .mwai-timeless-theme .hljs-name, .mwai-timeless-theme .hljs-number, .mwai-timeless-theme .hljs-quote, .mwai-timeless-theme .hljs-selector-id, .mwai-timeless-theme .hljs-template-tag, .mwai-timeless-theme .hljs-type {
2298 color: #c18401;
2299 }
2300 .mwai-timeless-theme .hljs-selector-class {
2301 color: #0077cc;
2302 }
2303 .mwai-timeless-theme .hljs-link, .mwai-timeless-theme .hljs-regexp, .mwai-timeless-theme .hljs-selector-attr, .mwai-timeless-theme .hljs-string, .mwai-timeless-theme .hljs-symbol, .mwai-timeless-theme .hljs-template-variable, .mwai-timeless-theme .hljs-variable {
2304 color: #689700;
2305 }
2306 .mwai-timeless-theme .hljs-meta, .mwai-timeless-theme .hljs-selector-pseudo {
2307 color: #0077cc;
2308 }
2309 .mwai-timeless-theme .hljs-built_in, .mwai-timeless-theme .hljs-literal, .mwai-timeless-theme .hljs-title {
2310 color: #c18401;
2311 }
2312 .mwai-timeless-theme .hljs-bullet, .mwai-timeless-theme .hljs-code {
2313 color: #555;
2314 }
2315 .mwai-timeless-theme .hljs-meta .hljs-string {
2316 color: #689700;
2317 }
2318 .mwai-timeless-theme .hljs-deletion {
2319 color: #b71c1c;
2320 }
2321 .mwai-timeless-theme .hljs-addition {
2322 color: #1b5e20;
2323 }
2324 .mwai-timeless-theme .hljs-emphasis {
2325 font-style: italic;
2326 }
2327 .mwai-timeless-theme .hljs-strong {
2328 font-weight: 700;
2329 }
2330 .mwai-timeless-theme .mwai-reply-actions {
2331 position: absolute;
2332 border-radius: 5px;
2333 top: 10px;
2334 right: 10px;
2335 display: flex;
2336 align-items: center;
2337 padding: 2px 2px;
2338 z-index: 100;
2339 background: var(--mwai-backgroundPrimaryColor);
2340 box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
2341 z-index: 100;
2342 }
2343 .mwai-timeless-theme .mwai-reply-actions .mwai-copy-button,
2344 .mwai-timeless-theme .mwai-reply-actions .mwai-download-button,
2345 .mwai-timeless-theme .mwai-reply-actions .mwai-pdf-button {
2346 fill: var(--mwai-fontColor);
2347 padding: 3px 5px;
2348 width: 24px;
2349 height: 24px;
2350 background: var(--mwai-backgroundPrimaryColor);
2351 cursor: pointer;
2352 border-radius: 5px;
2353 }
2354 .mwai-timeless-theme .mwai-reply-actions .mwai-copy-button:hover,
2355 .mwai-timeless-theme .mwai-reply-actions .mwai-download-button:hover,
2356 .mwai-timeless-theme .mwai-reply-actions .mwai-pdf-button:hover {
2357 filter: brightness(1.2);
2358 }
2359 .mwai-timeless-theme .mwai-reply-actions.mwai-hidden {
2360 opacity: 0;
2361 }
2362 .mwai-timeless-theme .mwai-realtime {
2363 padding: var(--mwai-spacing);
2364 }
2365 .mwai-timeless-theme .mwai-realtime .mwai-visualizer {
2366 display: flex;
2367 justify-content: center;
2368 align-items: center;
2369 }
2370 .mwai-timeless-theme .mwai-realtime .mwai-visualizer hr {
2371 width: 100px;
2372 margin-right: var(--mwai-spacing);
2373 margin-left: var(--mwai-spacing);
2374 border: 1px solid var(--mwai-backgroundPrimaryColor);
2375 }
2376 .mwai-timeless-theme .mwai-realtime .mwai-visualizer .mwai-animation {
2377 background: var(--mwai-backgroundPrimaryColor);
2378 }
2379 .mwai-timeless-theme .mwai-realtime .mwai-controls {
2380 display: flex;
2381 justify-content: center;
2382 align-items: center;
2383 margin-bottom: var(--mwai-spacing);
2384 }
2385 .mwai-timeless-theme .mwai-realtime .mwai-controls > * + * {
2386 margin-left: 10px;
2387 }
2388 .mwai-timeless-theme .mwai-realtime .mwai-controls button {
2389 border-radius: 100%;
2390 width: 50px;
2391 height: 50px;
2392 margin: 5px;
2393 padding: 5px;
2394 display: flex;
2395 align-items: center;
2396 justify-content: center;
2397 color: var(--mwai-fontColor);
2398 border: 2px solid var(--mwai-backgroundPrimaryColor);
2399 background: none;
2400 cursor: pointer;
2401 transition: all 0.2s ease-out;
2402 min-width: inherit;
2403 max-width: inherit;
2404 }
2405 .mwai-timeless-theme .mwai-realtime .mwai-controls button:hover:not(:disabled) {
2406 background: var(--mwai-backgroundPrimaryColor);
2407 }
2408 .mwai-timeless-theme .mwai-realtime .mwai-controls button:disabled {
2409 opacity: 0.5;
2410 cursor: not-allowed;
2411 background: none;
2412 }
2413 .mwai-timeless-theme .mwai-realtime .mwai-controls button.mwai-active {
2414 border: 2px solid var(--mwai-fontColor);
2415 }
2416 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode {
2417 flex-direction: column;
2418 gap: 8px;
2419 }
2420 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk {
2421 border-radius: calc(var(--mwai-borderRadius) * 0.8);
2422 width: auto;
2423 min-width: 120px;
2424 padding: 12px 24px;
2425 margin: 5px;
2426 display: flex;
2427 align-items: center;
2428 justify-content: center;
2429 gap: 8px;
2430 color: var(--mwai-fontColor);
2431 border: 2px solid var(--mwai-backgroundPrimaryColor);
2432 background: none;
2433 cursor: pointer;
2434 transition: all 0.2s ease-out;
2435 font-family: inherit;
2436 font-size: var(--mwai-fontSize);
2437 line-height: 1.2;
2438 font-weight: 500;
2439 height: auto;
2440 }
2441 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk:hover:not(:disabled) {
2442 background: var(--mwai-backgroundPrimaryColor);
2443 }
2444 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk:disabled {
2445 opacity: 0.5;
2446 cursor: not-allowed;
2447 background: none;
2448 }
2449 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk.mwai-active {
2450 border: 2px solid var(--mwai-fontColor);
2451 background: var(--mwai-backgroundPrimaryColor);
2452 }
2453 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk svg {
2454 width: 18px;
2455 height: 18px;
2456 }
2457 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-talk-hint {
2458 font-size: 12px;
2459 color: var(--mwai-fontColor);
2460 opacity: 0.6;
2461 text-align: center;
2462 margin: 0;
2463 }
2464 .mwai-timeless-theme .mwai-realtime .mwai-last-transcript {
2465 margin: var(--mwai-spacing);
2466 margin-top: 0;
2467 border: 2px solid var(--mwai-backgroundPrimaryColor);
2468 padding: calc(var(--mwai-spacing) / 2);
2469 padding-right: calc(var(--mwai-spacing) / 2 + 10px);
2470 border-radius: var(--mwai-borderRadius);
2471 font-size: 80%;
2472 text-align: center;
2473 max-height: 120px;
2474 overflow-y: auto;
2475 overflow-x: hidden;
2476 word-wrap: break-word;
2477 overflow-wrap: break-word;
2478 scrollbar-width: thin;
2479 scrollbar-color: var(--mwai-backgroundHeaderColor) transparent;
2480 }
2481 .mwai-timeless-theme .mwai-realtime .mwai-last-transcript::-webkit-scrollbar {
2482 width: 6px;
2483 }
2484 .mwai-timeless-theme .mwai-realtime .mwai-last-transcript::-webkit-scrollbar-track {
2485 background: transparent;
2486 margin: 4px 0;
2487 }
2488 .mwai-timeless-theme .mwai-realtime .mwai-last-transcript::-webkit-scrollbar-thumb {
2489 background: var(--mwai-backgroundHeaderColor);
2490 border-radius: 10px;
2491 }
2492 .mwai-timeless-theme .mwai-realtime .mwai-last-transcript::-webkit-scrollbar-thumb:hover {
2493 background: var(--mwai-primaryColor);
2494 }
2495 .mwai-timeless-theme .mwai-realtime .mwai-statistics {
2496 display: grid;
2497 grid-template-columns: 1fr 1fr 1fr;
2498 grid-row-gap: 10px;
2499 font-size: 14px;
2500 }
2501 .mwai-timeless-theme .mwai-realtime .mwai-statistics div {
2502 display: flex;
2503 flex-direction: column;
2504 align-items: center;
2505 }
2506 .mwai-timeless-theme .mwai-realtime .mwai-statistics label {
2507 font-size: 11px;
2508 opacity: 0.5;
2509 text-transform: uppercase;
2510 }
2511 .mwai-timeless-theme .mwai-realtime .mwai-options {
2512 margin-top: var(--mwai-spacing);
2513 display: flex;
2514 align-items: center;
2515 }
2516 .mwai-timeless-theme .mwai-realtime .mwai-options .mwai-option {
2517 cursor: pointer;
2518 opacity: 0.5;
2519 margin-right: 2px;
2520 }
2521 .mwai-timeless-theme .mwai-realtime .mwai-options .mwai-option.mwai-active {
2522 opacity: 1;
2523 }
2524 .mwai-timeless-theme.mwai-discussions {
2525 border-radius: var(--mwai-borderRadius);
2526 background: var(--mwai-backgroundHeaderColor);
2527 overflow: hidden;
2528 }
2529 .mwai-timeless-theme.mwai-discussions * {
2530 box-sizing: border-box;
2531 }
2532 .mwai-timeless-theme.mwai-discussions .mwai-discussion {
2533 display: flex;
2534 position: relative;
2535 padding-left: calc(var(--mwai-spacing) / 2);
2536 padding-right: calc(var(--mwai-spacing) / 2);
2537 padding-bottom: calc(var(--mwai-spacing) / 2);
2538 color: var(--mwai-conversationsTextColor);
2539 opacity: 0.65;
2540 align-items: center;
2541 }
2542 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-content {
2543 flex: 1;
2544 padding: 5px 10px;
2545 overflow: hidden;
2546 }
2547 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-title {
2548 display: block;
2549 overflow: hidden;
2550 text-overflow: ellipsis;
2551 white-space: nowrap;
2552 font-size: var(--mwai-fontSize);
2553 margin-bottom: 4px;
2554 }
2555 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-info {
2556 display: flex;
2557 gap: 12px;
2558 font-size: calc(var(--mwai-fontSize) * 0.85);
2559 opacity: 0.7;
2560 }
2561 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-info .mwai-info-item {
2562 display: flex;
2563 align-items: center;
2564 gap: 4px;
2565 }
2566 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-info .mwai-info-item svg {
2567 opacity: 0.6;
2568 }
2569 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-actions {
2570 position: absolute;
2571 top: 50%;
2572 right: calc(var(--mwai-spacing) / 2);
2573 transform: translateY(-50%);
2574 opacity: 0;
2575 transition: opacity 0.2s ease-out;
2576 z-index: 100;
2577 }
2578 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-actions .mwai-menu-icon {
2579 width: 28px;
2580 height: 28px;
2581 display: flex;
2582 align-items: center;
2583 justify-content: center;
2584 cursor: pointer;
2585 color: var(--mwai-conversationsTextColor);
2586 }
2587 .mwai-timeless-theme.mwai-discussions .mwai-discussion.mwai-active {
2588 cursor: pointer;
2589 }
2590 .mwai-timeless-theme.mwai-discussions .mwai-discussion.mwai-active .mwai-discussion-content {
2591 background: var(--mwai-backgroundPrimaryColor);
2592 border-radius: var(--mwai-borderRadius);
2593 opacity: 1;
2594 }
2595 .mwai-timeless-theme.mwai-discussions .mwai-discussion:hover {
2596 cursor: pointer;
2597 }
2598 .mwai-timeless-theme.mwai-discussions .mwai-discussion:hover .mwai-discussion-content {
2599 background: var(--mwai-backgroundPrimaryColor);
2600 border-radius: var(--mwai-borderRadius);
2601 opacity: 1;
2602 }
2603 .mwai-timeless-theme.mwai-discussions .mwai-discussion:hover .mwai-discussion-actions {
2604 opacity: 1;
2605 }
2606 .mwai-timeless-theme.mwai-discussions .mwai-discussion:has(.mwai-context-menu) .mwai-discussion-actions {
2607 opacity: 1;
2608 }
2609 .mwai-timeless-theme.mwai-discussions .mwai-discussion:first-child {
2610 margin-top: calc(var(--mwai-spacing) / 2);
2611 }
2612 .mwai-timeless-theme.mwai-discussions .mwai-header {
2613 color: var(--mwai-headerColor);
2614 padding: var(--mwai-spacing);
2615 display: flex;
2616 justify-content: space-between;
2617 align-items: center;
2618 gap: 10px;
2619 }
2620 .mwai-timeless-theme.mwai-discussions .mwai-header button {
2621 background: var(--mwai-backgroundPrimaryColor);
2622 color: var(--mwai-fontColor);
2623 border: none;
2624 padding: 8px 16px;
2625 border-radius: var(--mwai-borderRadius);
2626 cursor: pointer;
2627 transition: all 0.2s ease-out;
2628 }
2629 .mwai-timeless-theme.mwai-discussions .mwai-header button:hover:not(:disabled) {
2630 background: var(--mwai-iconTextBackgroundColor);
2631 }
2632 .mwai-timeless-theme.mwai-discussions .mwai-header button:disabled {
2633 opacity: 0.5;
2634 cursor: not-allowed;
2635 }
2636 .mwai-timeless-theme.mwai-discussions .mwai-header .mwai-refresh-btn {
2637 padding: 8px;
2638 display: flex;
2639 align-items: center;
2640 justify-content: center;
2641 }
2642 .mwai-timeless-theme.mwai-discussions .mwai-body {
2643 background: var(--mwai-conversationsBackgroundColor);
2644 list-style: none;
2645 padding: 0;
2646 margin: 0;
2647 position: relative;
2648 min-height: 200px;
2649 display: flex;
2650 flex-direction: column;
2651 border-radius: 0;
2652 z-index: 1;
2653 }
2654 .mwai-timeless-theme.mwai-discussions .mwai-loading-overlay {
2655 position: absolute;
2656 top: 0;
2657 left: 0;
2658 right: 0;
2659 bottom: 0;
2660 background: var(--mwai-conversationsBackgroundColor);
2661 opacity: 0.9;
2662 display: flex;
2663 align-items: center;
2664 justify-content: center;
2665 z-index: 10;
2666 }
2667 .mwai-timeless-theme.mwai-discussions .mwai-spinner {
2668 animation: spin 1s linear infinite;
2669 color: var(--mwai-fontColor);
2670 }
2671 @keyframes spin {
2672 from {
2673 transform: rotate(0deg);
2674 }
2675 to {
2676 transform: rotate(360deg);
2677 }
2678 }
2679 .mwai-timeless-theme.mwai-discussions .mwai-pagination {
2680 background: var(--mwai-backgroundHeaderColor);
2681 padding: var(--mwai-spacing);
2682 display: flex;
2683 justify-content: space-between;
2684 align-items: center;
2685 border-top: 1px solid var(--mwai-backgroundPrimaryColor);
2686 }
2687 .mwai-timeless-theme.mwai-discussions .mwai-pagination button {
2688 background: var(--mwai-backgroundPrimaryColor);
2689 color: var(--mwai-fontColor);
2690 border: none;
2691 padding: 8px 12px;
2692 border-radius: var(--mwai-borderRadius);
2693 cursor: pointer;
2694 transition: all 0.2s ease-out;
2695 display: flex;
2696 align-items: center;
2697 justify-content: center;
2698 }
2699 .mwai-timeless-theme.mwai-discussions .mwai-pagination button:hover:not(:disabled) {
2700 background: var(--mwai-iconTextBackgroundColor);
2701 }
2702 .mwai-timeless-theme.mwai-discussions .mwai-pagination button:disabled {
2703 opacity: 0.3;
2704 cursor: not-allowed;
2705 }
2706 .mwai-timeless-theme.mwai-discussions .mwai-pagination span {
2707 color: var(--mwai-headerColor);
2708 font-size: var(--mwai-fontSize);
2709 font-weight: 500;
2710 }
2711 .mwai-timeless-theme.mwai-discussions .mwai-pagination .mwai-page-indicator {
2712 color: var(--mwai-headerColor);
2713 font-size: calc(var(--mwai-fontSize) * 0.85);
2714 font-weight: 400;
2715 opacity: 0.8;
2716 }
2717 .mwai-timeless-theme.mwai-discussions {
2718 background: var(--mwai-backgroundPrimaryColor);
2719 border: 1px solid rgba(0, 0, 0, 0.1);
2720 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
2721 }
2722 .mwai-timeless-theme.mwai-discussions .mwai-header {
2723 background: var(--mwai-backgroundAiColor);
2724 color: var(--mwai-fontColor);
2725 border-bottom: 0.5px solid rgba(0, 0, 0, 0.15);
2726 }
2727 .mwai-timeless-theme.mwai-discussions .mwai-header button {
2728 background: var(--mwai-backgroundHeaderColor);
2729 color: white;
2730 padding: 8px 16px;
2731 border: none;
2732 border-radius: var(--mwai-borderRadius);
2733 cursor: pointer;
2734 transition: transform 0.15s ease-out;
2735 }
2736 .mwai-timeless-theme.mwai-discussions .mwai-header button:hover:not(:disabled) {
2737 background: var(--mwai-backgroundHeaderColor);
2738 transform: scale(1.03);
2739 }
2740 .mwai-timeless-theme.mwai-discussions .mwai-header button:disabled {
2741 opacity: 0.5;
2742 cursor: not-allowed;
2743 filter: saturate(0%);
2744 transform: none;
2745 }
2746 .mwai-timeless-theme.mwai-discussions .mwai-discussions-header {
2747 background: var(--mwai-backgroundAiColor);
2748 color: var(--mwai-fontColor);
2749 padding: var(--mwai-spacing);
2750 border-bottom: 0.5px solid rgba(0, 0, 0, 0.15);
2751 }
2752 .mwai-timeless-theme.mwai-discussions .mwai-discussions-header .mwai-discussions-title {
2753 font-size: calc(var(--mwai-fontSize) * 1.3);
2754 font-weight: 600;
2755 }
2756 .mwai-timeless-theme.mwai-discussions .mwai-discussions-list {
2757 background: var(--mwai-backgroundPrimaryColor);
2758 max-height: 320px;
2759 overflow-y: auto;
2760 scrollbar-width: thin;
2761 scrollbar-color: rgba(0, 0, 0, 0.15) rgba(0, 0, 0, 0.05);
2762 }
2763 .mwai-timeless-theme.mwai-discussions .mwai-discussions-list::-webkit-scrollbar {
2764 width: 8px;
2765 background: transparent;
2766 }
2767 .mwai-timeless-theme.mwai-discussions .mwai-discussions-list::-webkit-scrollbar-track {
2768 background: rgba(0, 0, 0, 0.05);
2769 border-radius: 4px;
2770 }
2771 .mwai-timeless-theme.mwai-discussions .mwai-discussions-list::-webkit-scrollbar-thumb {
2772 background: rgba(0, 0, 0, 0.15);
2773 border-radius: 4px;
2774 transition: background 0.2s ease;
2775 }
2776 .mwai-timeless-theme.mwai-discussions .mwai-discussions-list::-webkit-scrollbar-thumb:hover {
2777 background: rgba(0, 0, 0, 0.25);
2778 }
2779 .mwai-timeless-theme.mwai-discussions .mwai-discussions-list::-webkit-scrollbar-thumb:active {
2780 background: rgba(0, 0, 0, 0.3);
2781 }
2782 .mwai-timeless-theme.mwai-discussions .mwai-discussion {
2783 padding: 0;
2784 color: var(--mwai-fontColor);
2785 opacity: 1;
2786 border-bottom: none;
2787 transition: all 0.3s ease;
2788 }
2789 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-content {
2790 background: transparent;
2791 padding: 10px 14px;
2792 margin: 4px 10px;
2793 transition: all 0.3s ease;
2794 border-radius: var(--mwai-borderRadius);
2795 }
2796 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-title {
2797 color: var(--mwai-fontColor);
2798 font-weight: 500;
2799 }
2800 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-info {
2801 opacity: 0.5;
2802 color: var(--mwai-fontColor);
2803 }
2804 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-info svg {
2805 color: var(--mwai-accentColor);
2806 opacity: 0.4;
2807 }
2808 .mwai-timeless-theme.mwai-discussions .mwai-discussion:hover .mwai-discussion-content {
2809 background: var(--mwai-backgroundAiColor);
2810 opacity: 1;
2811 }
2812 .mwai-timeless-theme.mwai-discussions .mwai-discussion:hover .mwai-discussion-info {
2813 opacity: 0.7;
2814 }
2815 .mwai-timeless-theme.mwai-discussions .mwai-discussion.mwai-active .mwai-discussion-content {
2816 background: var(--mwai-backgroundUserColor);
2817 color: white;
2818 opacity: 1;
2819 }
2820 .mwai-timeless-theme.mwai-discussions .mwai-discussion.mwai-active .mwai-discussion-content .mwai-discussion-title {
2821 color: white;
2822 font-weight: 600;
2823 }
2824 .mwai-timeless-theme.mwai-discussions .mwai-discussion.mwai-active .mwai-discussion-content .mwai-discussion-info {
2825 color: white;
2826 opacity: 0.9;
2827 }
2828 .mwai-timeless-theme.mwai-discussions .mwai-discussion.mwai-active .mwai-discussion-content .mwai-discussion-info svg {
2829 color: white;
2830 opacity: 0.7;
2831 }
2832 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-actions {
2833 right: 18px;
2834 }
2835 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-actions .mwai-menu-icon {
2836 color: var(--mwai-accentColor);
2837 background: var(--mwai-backgroundAiColor);
2838 border-radius: 50%;
2839 width: 28px;
2840 height: 28px;
2841 transition: all 0.3s ease;
2842 }
2843 .mwai-timeless-theme.mwai-discussions .mwai-discussion .mwai-discussion-actions .mwai-menu-icon:hover {
2844 background: var(--mwai-backgroundUserColor);
2845 color: white;
2846 transform: scale(1.1);
2847 }
2848 .mwai-timeless-theme.mwai-discussions .mwai-discussion.mwai-active .mwai-discussion-actions .mwai-menu-icon:hover {
2849 background: var(--mwai-backgroundAiColor);
2850 color: var(--mwai-accentColor);
2851 transform: scale(1.1);
2852 }
2853 .mwai-timeless-theme.mwai-discussions .mwai-context-menu {
2854 background: var(--mwai-backgroundUserColor);
2855 border: 1px solid var(--mwai-accentColor);
2856 border-radius: var(--mwai-borderRadius);
2857 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
2858 padding: 4px;
2859 }
2860 .mwai-timeless-theme.mwai-discussions .mwai-context-menu .mwai-menu-item {
2861 padding: 8px 14px;
2862 color: white;
2863 border-radius: calc(var(--mwai-borderRadius) - 2px);
2864 transition: all 0.2s ease;
2865 }
2866 .mwai-timeless-theme.mwai-discussions .mwai-context-menu .mwai-menu-item:hover {
2867 background: rgba(255, 255, 255, 0.2);
2868 transform: translateX(2px);
2869 }
2870 .mwai-timeless-theme.mwai-discussions .mwai-context-menu .mwai-menu-item.mwai-danger {
2871 color: #ffcdd2;
2872 }
2873 .mwai-timeless-theme.mwai-discussions .mwai-context-menu .mwai-menu-item.mwai-danger:hover {
2874 background: rgba(255, 100, 100, 0.2);
2875 color: white;
2876 }
2877 .mwai-timeless-theme.mwai-discussions .mwai-pagination {
2878 background: var(--mwai-backgroundAiColor);
2879 border-top: 0.5px solid rgba(0, 0, 0, 0.15);
2880 }
2881 .mwai-timeless-theme.mwai-discussions .mwai-pagination button {
2882 background: var(--mwai-backgroundHeaderColor);
2883 color: white;
2884 padding: 8px 12px;
2885 border: none;
2886 border-radius: var(--mwai-borderRadius);
2887 cursor: pointer;
2888 transition: transform 0.15s ease-out;
2889 }
2890 .mwai-timeless-theme.mwai-discussions .mwai-pagination button:hover:not(:disabled) {
2891 background: var(--mwai-backgroundHeaderColor);
2892 transform: scale(1.03);
2893 }
2894 .mwai-timeless-theme.mwai-discussions .mwai-pagination button:disabled {
2895 opacity: 0.5;
2896 cursor: not-allowed;
2897 filter: saturate(0%);
2898 transform: none;
2899 }
2900 .mwai-timeless-theme.mwai-discussions .mwai-discussions-footer,
2901 .mwai-timeless-theme.mwai-discussions .mwai-discussions-pagination {
2902 padding: calc(var(--mwai-spacing) / 2) var(--mwai-spacing);
2903 border-top: 0.5px solid rgba(0, 0, 0, 0.15);
2904 background: var(--mwai-backgroundAiColor);
2905 }
2906 .mwai-timeless-theme.mwai-discussions .mwai-discussions-footer .mwai-new-chat-button,
2907 .mwai-timeless-theme.mwai-discussions .mwai-discussions-pagination .mwai-new-chat-button {
2908 width: 100%;
2909 padding: 10px 20px;
2910 background: var(--mwai-backgroundHeaderColor);
2911 color: white;
2912 border: none;
2913 border-radius: var(--mwai-borderRadius);
2914 font-size: var(--mwai-fontSize);
2915 font-weight: 500;
2916 cursor: pointer;
2917 transition: transform 0.15s ease-out;
2918 }
2919 .mwai-timeless-theme.mwai-discussions .mwai-discussions-footer .mwai-new-chat-button:hover,
2920 .mwai-timeless-theme.mwai-discussions .mwai-discussions-pagination .mwai-new-chat-button:hover {
2921 background: var(--mwai-backgroundHeaderColor);
2922 transform: scale(1.02);
2923 }
2924 .mwai-timeless-theme.mwai-discussions .mwai-discussions-footer .mwai-new-chat-button:disabled,
2925 .mwai-timeless-theme.mwai-discussions .mwai-discussions-pagination .mwai-new-chat-button:disabled {
2926 opacity: 0.5;
2927 cursor: not-allowed;
2928 filter: saturate(0%);
2929 transform: none;
2930 }
2931
2932 .mwai-timeless-theme .mwai-realtime .mwai-visualizer hr {
2933 border: 1px solid var(--mwai-backgroundAiSecondaryColor);
2934 }
2935 .mwai-timeless-theme .mwai-realtime .mwai-visualizer .mwai-animation {
2936 background: var(--mwai-backgroundAiSecondaryColor);
2937 }
2938 .mwai-timeless-theme .mwai-realtime .mwai-controls button {
2939 color: var(--mwai-backgroundPrimaryColor);
2940 background: var(--mwai-backgroundUserColor);
2941 }
2942 .mwai-timeless-theme .mwai-realtime .mwai-controls button:hover {
2943 color: var(--mwai-backgroundPrimaryColor) !important;
2944 background: var(--mwai-backgroundUserColor) !important;
2945 opacity: 0.8;
2946 }
2947 .mwai-timeless-theme .mwai-realtime .mwai-controls button[disabled] {
2948 color: var(--mwai-backgroundPrimaryColor) !important;
2949 background: var(--mwai-backgroundUserColor) !important;
2950 opacity: 0.5;
2951 }
2952 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk {
2953 color: var(--mwai-backgroundPrimaryColor);
2954 background: var(--mwai-backgroundUserColor);
2955 }
2956 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk:hover:not(:disabled) {
2957 color: var(--mwai-backgroundPrimaryColor) !important;
2958 background: var(--mwai-backgroundUserColor) !important;
2959 opacity: 0.8;
2960 }
2961 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk:disabled {
2962 color: var(--mwai-backgroundPrimaryColor) !important;
2963 background: var(--mwai-backgroundUserColor) !important;
2964 opacity: 0.5;
2965 }
2966 .mwai-timeless-theme .mwai-realtime .mwai-controls.mwai-hold-to-talk-mode .mwai-push-to-talk.mwai-active {
2967 color: var(--mwai-backgroundPrimaryColor) !important;
2968 background: var(--mwai-backgroundUserColor) !important;
2969 opacity: 0.9;
2970 border: 2px solid var(--mwai-fontColor);
2971 }
2972 .mwai-timeless-theme .mwai-reply-actions {
2973 top: -6px;
2974 right: -6px;
2975 }
2976 .mwai-timeless-theme .mwai-reply-actions .mwai-copy-button,
2977 .mwai-timeless-theme .mwai-reply-actions .mwai-download-button,
2978 .mwai-timeless-theme .mwai-reply-actions .mwai-pdf-button {
2979 padding-top: 4px;
2980 }
2981 .mwai-timeless-theme .mwai-reply-actions .mwai-copy-button:hover,
2982 .mwai-timeless-theme .mwai-reply-actions .mwai-download-button:hover,
2983 .mwai-timeless-theme .mwai-reply-actions .mwai-pdf-button:hover {
2984 fill: var(--mwai-backgroundPrimaryColor);
2985 background: var(--mwai-backgroundUserColor);
2986 }
2987 .mwai-timeless-theme .mwai-reply-actions .mwai-action-button {
2988 padding-top: 4px;
2989 }
2990 .mwai-timeless-theme .mwai-reply-actions .mwai-action-button:hover {
2991 fill: var(--mwai-backgroundPrimaryColor);
2992 background: var(--mwai-backgroundUserColor);
2993 filter: none;
2994 }
2995 .mwai-timeless-theme .mwai-reply.mwai-error .mwai-reply-actions .mwai-action-button:hover {
2996 fill: var(--mwai-backgroundPrimaryColor);
2997 background: var(--mwai-backgroundUserColor);
2998 filter: none;
2999 }
3000
3001 @media (max-width: 760px) {
3002 .mwai-timeless-theme.mwai-window {
3003 width: calc(100% - 40px);
3004 z-index: 9999999999;
3005 }
3006 .mwai-timeless-theme.mwai-window.mwai-open .mwai-body {
3007 min-height: calc(100dvh - var(--mwai-headerHeight));
3008 }
3009 .mwai-timeless-theme .mwai-input {
3010 display: flex !important;
3011 flex-direction: row !important;
3012 flex-wrap: nowrap !important;
3013 align-items: center !important;
3014 }
3015 .mwai-timeless-theme .mwai-input .mwai-input-text {
3016 flex: 1 1 auto !important;
3017 width: auto !important;
3018 margin-bottom: 0 !important;
3019 }
3020 .mwai-timeless-theme .mwai-input .mwai-input-submit {
3021 flex: 0 0 40px !important;
3022 width: 40px !important;
3023 height: 40px !important;
3024 min-width: 40px !important;
3025 min-height: 40px !important;
3026 border-radius: 50% !important;
3027 margin-right: 5px !important;
3028 margin-left: 10px !important;
3029 margin-bottom: 0 !important;
3030 }
3031 .mwai-timeless-theme .mwai-input .mwai-input-submit img {
3032 width: 18px !important;
3033 height: 18px !important;
3034 }
3035 }
3036
3037 .mwai-context-menu-portal.mwai-timeless-theme .mwai-context-menu {
3038 background: var(--mwai-backgroundPrimaryColor);
3039 border: 1px solid rgba(0, 0, 0, 0.1);
3040 color: var(--mwai-fontColor);
3041 }
3042 .mwai-context-menu-portal.mwai-timeless-theme .mwai-context-menu .mwai-menu-item {
3043 color: var(--mwai-fontColor);
3044 }
3045 .mwai-context-menu-portal.mwai-timeless-theme .mwai-context-menu .mwai-menu-item:hover {
3046 background-color: var(--mwai-backgroundAiColor);
3047 }
3048 .mwai-context-menu-portal.mwai-timeless-theme .mwai-context-menu .mwai-menu-item.mwai-danger {
3049 color: #d32f2f;
3050 }
3051 .mwai-context-menu-portal.mwai-timeless-theme .mwai-context-menu .mwai-menu-item.mwai-danger:hover {
3052 background-color: rgba(211, 47, 47, 0.08);
3053 color: #b71c1c;
3054 }
3055