@helpway/react 0.17.1 → 0.17.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -70,6 +70,14 @@ function createWidgetClient(config) {
70
70
  });
71
71
  }
72
72
 
73
+ // ../types/src/enums.ts
74
+ var MemberRole = {
75
+ Owner: "owner",
76
+ Admin: "admin",
77
+ Agent: "agent",
78
+ Member: "member"
79
+ };
80
+
73
81
  // ../types/src/visitor.ts
74
82
  var ONLINE_WINDOW_MS = 5 * 6e4;
75
83
 
@@ -381,11 +389,30 @@ var DOC_NAV_ICON_MAP = Object.fromEntries(
381
389
  );
382
390
 
383
391
  // ../types/src/upload.ts
392
+ var ALLOWED_MIME_TYPES = /* @__PURE__ */ new Set([
393
+ // Images — the only kind anyone has sent in volume.
394
+ "image/png",
395
+ "image/jpeg",
396
+ "image/gif",
397
+ "image/webp",
398
+ // Documents
399
+ "application/pdf",
400
+ // Text — inert by definition.
401
+ "text/plain",
402
+ "text/csv"
403
+ ]);
384
404
  var MAX_FILE_SIZE = 10 * 1024 * 1024;
385
405
  var MAX_BASE64_LENGTH = Math.ceil(MAX_FILE_SIZE * 1.37);
406
+ function acceptAttribute() {
407
+ return [...ALLOWED_MIME_TYPES].sort().join(",");
408
+ }
409
+
410
+ // ../types/src/member-roles.ts
411
+ var MEMBER_ROLES = [MemberRole.Owner, MemberRole.Admin, MemberRole.Member];
412
+ var ASSIGNABLE_ROLES = [MemberRole.Admin, MemberRole.Member];
386
413
 
387
414
  // ../widget-core/src/version.ts
388
- var SDK_VERSION = "0.17.1".length > 0 ? "0.17.1" : "dev";
415
+ var SDK_VERSION = "0.17.2".length > 0 ? "0.17.2" : "dev";
389
416
 
390
417
  // ../widget-core/src/ws.ts
391
418
  var WebSocketManager = class {
@@ -397,7 +424,17 @@ var WebSocketManager = class {
397
424
  reconnectTimer = null;
398
425
  pingTimer = null;
399
426
  isDestroyed = false;
427
+ /* What the "Reconnecting…" notice needs and `isConnected` cannot say: a
428
+ socket that has never been open is CONNECTING, not reconnecting, and one
429
+ nobody has asked to connect yet is neither (connection-notice.ts). */
430
+ openedOnce = false;
431
+ firstConnectAt = null;
400
432
  visibilityHandler = null;
433
+ /* The retry budget is spent and nothing is scheduled. Until this existed the
434
+ manager simply went quiet after its tenth attempt, and the widget kept
435
+ saying "Reconnecting…" about a socket nobody was reconnecting. */
436
+ gaveUp = false;
437
+ onlineHandler = null;
401
438
  constructor(config) {
402
439
  this.config = config;
403
440
  this.setupVisibilityListener();
@@ -414,6 +451,15 @@ var WebSocketManager = class {
414
451
  };
415
452
  document.addEventListener("visibilitychange", this.visibilityHandler);
416
453
  }
454
+ /* The browser saying the network is back is the best moment to try again,
455
+ and after giving up it is the only automatic one. */
456
+ setupOnlineListener() {
457
+ if (typeof window === "undefined" || this.onlineHandler) return;
458
+ this.onlineHandler = () => {
459
+ if (!this.isDestroyed && !this.isConnected) this.retryNow();
460
+ };
461
+ window.addEventListener("online", this.onlineHandler);
462
+ }
417
463
  /** Update connection parameters (call before connect) */
418
464
  configure(params) {
419
465
  Object.assign(this.config, params);
@@ -422,6 +468,8 @@ var WebSocketManager = class {
422
468
  connect() {
423
469
  if (this.ws?.readyState === WebSocket.OPEN) return;
424
470
  this.isDestroyed = false;
471
+ if (this.firstConnectAt === null) this.firstConnectAt = Date.now();
472
+ this.setupOnlineListener();
425
473
  const protocol = this.config.apiUrl.startsWith("https") ? "wss" : "ws";
426
474
  const base = this.config.apiUrl.replace(/^https?/, protocol);
427
475
  const params = new URLSearchParams({
@@ -435,6 +483,8 @@ var WebSocketManager = class {
435
483
  const ws = new WebSocket(`${base}/ws?${params}`);
436
484
  ws.onopen = () => {
437
485
  this.reconnectAttempts = 0;
486
+ this.openedOnce = true;
487
+ this.gaveUp = false;
438
488
  if (typeof document === "undefined" || document.visibilityState === "visible") {
439
489
  this.startPing();
440
490
  }
@@ -474,6 +524,10 @@ var WebSocketManager = class {
474
524
  document.removeEventListener("visibilitychange", this.visibilityHandler);
475
525
  this.visibilityHandler = null;
476
526
  }
527
+ if (this.onlineHandler && typeof window !== "undefined") {
528
+ window.removeEventListener("online", this.onlineHandler);
529
+ this.onlineHandler = null;
530
+ }
477
531
  if (this.ws) {
478
532
  this.ws.close(1e3, "Client disconnect");
479
533
  this.ws = null;
@@ -500,9 +554,39 @@ var WebSocketManager = class {
500
554
  get isConnected() {
501
555
  return this.ws?.readyState === WebSocket.OPEN;
502
556
  }
557
+ /** True once the socket has been open at least once. */
558
+ get hasOpened() {
559
+ return this.openedOnce;
560
+ }
561
+ /** When `connect()` was first called (ms epoch); null before that. */
562
+ get connectStartedAt() {
563
+ return this.firstConnectAt;
564
+ }
565
+ /** True once every automatic retry has failed and none is scheduled. */
566
+ get hasGivenUp() {
567
+ return this.gaveUp;
568
+ }
569
+ /**
570
+ * Start over with a full retry budget: the visitor pressed "Retry", or the
571
+ * browser came back online. Safe to call at any time; a no-op while
572
+ * connected or after `disconnect()`.
573
+ */
574
+ retryNow() {
575
+ if (this.isDestroyed || this.isConnected) return;
576
+ if (this.reconnectTimer) {
577
+ clearTimeout(this.reconnectTimer);
578
+ this.reconnectTimer = null;
579
+ }
580
+ this.reconnectAttempts = 0;
581
+ this.gaveUp = false;
582
+ this.connect();
583
+ }
503
584
  // ── Private ──────────────────────────────────────────
504
585
  scheduleReconnect() {
505
- if (this.reconnectAttempts >= this.maxReconnectAttempts) return;
586
+ if (this.reconnectAttempts >= this.maxReconnectAttempts) {
587
+ this.gaveUp = true;
588
+ return;
589
+ }
506
590
  const delay = Math.min(1e3 * 2 ** this.reconnectAttempts, 3e4);
507
591
  this.reconnectAttempts++;
508
592
  this.reconnectTimer = setTimeout(() => {
@@ -523,6 +607,100 @@ var WebSocketManager = class {
523
607
  }
524
608
  };
525
609
 
610
+ // ../widget-core/src/dock-ink.ts
611
+ var WHITE = [255, 255, 255];
612
+ var NEAR_BLACK = [5, 5, 7];
613
+ var BLACK = [0, 0, 0];
614
+ var clamp = (n) => Math.min(255, Math.max(0, Math.round(n)));
615
+ function fromHsl(h, s, l) {
616
+ const a = s * Math.min(l, 1 - l);
617
+ const f = (n) => {
618
+ const k = (n + h / 30) % 12;
619
+ return clamp(255 * (l - a * Math.max(-1, Math.min(k - 3, 9 - k, 1))));
620
+ };
621
+ return [f(0), f(8), f(4)];
622
+ }
623
+ function parseColor(input) {
624
+ if (!input) return null;
625
+ const v = input.trim().toLowerCase();
626
+ if (v.startsWith("#")) {
627
+ const short = /^#([0-9a-f])([0-9a-f])([0-9a-f])[0-9a-f]?$/.exec(v);
628
+ const long = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})(?:[0-9a-f]{2})?$/.exec(v);
629
+ const [, r, g, b] = short ?? long ?? [];
630
+ if (r === void 0 || g === void 0 || b === void 0) return null;
631
+ const channel = (digits) => Number.parseInt(short ? digits + digits : digits, 16);
632
+ return [channel(r), channel(g), channel(b)];
633
+ }
634
+ const [, kind, body] = /^(rgb|hsl)a?\(([^)]+)\)$/.exec(v) ?? [];
635
+ if (kind === void 0 || body === void 0) return null;
636
+ const [p0, p1, p2] = body.split(/[\s,/]+/).filter(Boolean);
637
+ if (p0 === void 0 || p1 === void 0 || p2 === void 0) return null;
638
+ const n0 = Number.parseFloat(p0);
639
+ const n1 = Number.parseFloat(p1);
640
+ const n2 = Number.parseFloat(p2);
641
+ if (Number.isNaN(n0) || Number.isNaN(n1) || Number.isNaN(n2)) return null;
642
+ if (kind === "rgb") {
643
+ const channel = (part, n) => clamp(part.endsWith("%") ? n * 2.55 : n);
644
+ return [channel(p0, n0), channel(p1, n1), channel(p2, n2)];
645
+ }
646
+ return fromHsl((n0 % 360 + 360) % 360, n1 / 100, n2 / 100);
647
+ }
648
+ function luminance([r, g, b]) {
649
+ const f = (c) => {
650
+ const s = c / 255;
651
+ return s <= 0.03928 ? s / 12.92 : ((s + 0.055) / 1.055) ** 2.4;
652
+ };
653
+ return 0.2126 * f(r) + 0.7152 * f(g) + 0.0722 * f(b);
654
+ }
655
+ function contrast(a, b) {
656
+ const la = luminance(a);
657
+ const lb = luminance(b);
658
+ return (Math.max(la, lb) + 0.05) / (Math.min(la, lb) + 0.05);
659
+ }
660
+ function mix(a, b, amount) {
661
+ const channel = (x, y) => clamp(x * amount + y * (1 - amount));
662
+ return [channel(a[0], b[0]), channel(a[1], b[1]), channel(a[2], b[2])];
663
+ }
664
+ var toHex = (c) => `#${c.map((n) => n.toString(16).padStart(2, "0")).join("")}`;
665
+ function quiet(ink, tint, from, floor) {
666
+ for (let amount = from; amount < 1; amount += 0.02) {
667
+ const c = mix(ink, tint, amount);
668
+ if (contrast(c, tint) >= floor) return c;
669
+ }
670
+ return ink;
671
+ }
672
+ function dockInk(primaryColor) {
673
+ const tint = parseColor(primaryColor);
674
+ if (!tint) return null;
675
+ const onLight = contrast(WHITE, tint);
676
+ const useLight = onLight >= 4.5 || onLight >= contrast(NEAR_BLACK, tint);
677
+ const ink = useLight ? WHITE : NEAR_BLACK;
678
+ const shade = useLight ? BLACK : WHITE;
679
+ return {
680
+ tint: toHex(tint),
681
+ ink: toHex(ink),
682
+ shade: toHex(shade),
683
+ wash: toHex(contrast(ink, tint) >= 7 ? ink : shade),
684
+ ink2: toHex(quiet(ink, tint, 0.8, 4.5)),
685
+ ink3: toHex(quiet(ink, tint, 0.68, 4.5)),
686
+ ink4: toHex(quiet(ink, tint, 0.5, 3))
687
+ };
688
+ }
689
+
690
+ // ../widget-core/src/connection-notice.ts
691
+ var RECONNECT_GRACE_MS = 2e3;
692
+ var FIRST_CONNECT_GRACE_MS = 8e3;
693
+ function connectionNotice(s) {
694
+ if (s.connected) return "none";
695
+ if (s.gaveUp) return "lost";
696
+ return showReconnecting(s) ? "reconnecting" : "none";
697
+ }
698
+ function showReconnecting(s) {
699
+ if (s.connected || s.startedAt === null) return false;
700
+ if (!s.hasOpened) return s.now - s.startedAt >= FIRST_CONNECT_GRACE_MS;
701
+ return s.downSince !== null && s.now - s.downSince >= RECONNECT_GRACE_MS;
702
+ }
703
+
526
704
  // ../widget-core/src/store.ts
527
705
  import { createStore } from "zustand/vanilla";
528
706
 
@@ -555,10 +733,12 @@ var en = {
555
733
  // Composer
556
734
  "widget.placeholder": "Send a message...",
557
735
  "widget.placeholder_new": "How can we help?",
736
+ "widget.placeholder_resolved": "Reply to reopen this conversation\u2026",
558
737
  "widget.drop_files": "Drop files here",
559
738
  // CSAT
560
739
  "widget.csat_label": "How was your experience?",
561
740
  "widget.csat_thanks": "Thanks for your feedback!",
741
+ "widget.csat_error": "Couldn't save your rating. Please try again.",
562
742
  // Inline email collection (after AI reply)
563
743
  "widget.email_title": "Don't miss our reply",
564
744
  "widget.email_subtitle": "We'll email you when we respond",
@@ -571,6 +751,7 @@ var en = {
571
751
  "widget.error_desc": "Failed to load. Please try again.",
572
752
  "widget.retry": "Retry",
573
753
  "widget.reconnecting": "Reconnecting...",
754
+ "widget.connection_lost": "Connection lost",
574
755
  "widget.send_error": "Message not sent",
575
756
  // Date separators (today is implicit — never rendered)
576
757
  "widget.yesterday": "Yesterday",
@@ -592,6 +773,13 @@ var en = {
592
773
  // Copy
593
774
  "widget.copy": "Copy message",
594
775
  "widget.copied": "Copied",
776
+ /* The code-block button is its own three strings, not a reuse of the pair
777
+ above: that one copies a whole message and reads "Copy message", this one
778
+ sits inside a fenced block where the label has to stay one short word
779
+ (helpway#88). */
780
+ "widget.code_copy": "Copy",
781
+ "widget.code_copy_aria": "Copy code",
782
+ "widget.code_copy_failed": "Failed",
595
783
  // File upload
596
784
  "widget.file_too_large": "File too large (max 10 MB)",
597
785
  "widget.click_to_open": "Click to open",
@@ -1065,12 +1253,12 @@ function createWidgetStore() {
1065
1253
  const existingItems = nextMessages.get(newId) ?? [];
1066
1254
  const tempRewritten = tempItems.map((m) => ({ ...m, conversationId: newId }));
1067
1255
  const isAgentMsg = (m) => !!m.aiAgentId && !m.visitorId && !m.userId;
1068
- const seen = /* @__PURE__ */ new Set();
1256
+ const seen2 = /* @__PURE__ */ new Set();
1069
1257
  const merged = [];
1070
1258
  let keptAgentWelcome = false;
1071
1259
  for (const m of tempRewritten) {
1072
- if (seen.has(m.id)) continue;
1073
- seen.add(m.id);
1260
+ if (seen2.has(m.id)) continue;
1261
+ seen2.add(m.id);
1074
1262
  merged.push(m);
1075
1263
  if (isAgentMsg(m) && merged.length === 1) keptAgentWelcome = true;
1076
1264
  }
@@ -1084,7 +1272,7 @@ function createWidgetStore() {
1084
1272
  });
1085
1273
  let graftedWelcome = false;
1086
1274
  for (const m of existingItems) {
1087
- if (seen.has(m.id)) continue;
1275
+ if (seen2.has(m.id)) continue;
1088
1276
  if (isVisitorMsg(m) && typeof m.text === "string" && pendingVisitor.has(m.text)) {
1089
1277
  const idx = pendingVisitor.get(m.text);
1090
1278
  pendingVisitor.delete(m.text);
@@ -1093,7 +1281,7 @@ function createWidgetStore() {
1093
1281
  ...m,
1094
1282
  _stableKey: optimistic ? optimistic._stableKey ?? optimistic.id : m.id
1095
1283
  };
1096
- seen.add(m.id);
1284
+ seen2.add(m.id);
1097
1285
  continue;
1098
1286
  }
1099
1287
  const isWelcomeEcho = isAgentMsg(m) && keptAgentWelcome && !graftedWelcome && (!serverVisitorTs || m.createdAt <= serverVisitorTs);
@@ -1103,11 +1291,11 @@ function createWidgetStore() {
1103
1291
  ...m,
1104
1292
  _stableKey: seed ? seed._stableKey ?? seed.id : m.id
1105
1293
  };
1106
- seen.add(m.id);
1294
+ seen2.add(m.id);
1107
1295
  graftedWelcome = true;
1108
1296
  continue;
1109
1297
  }
1110
- seen.add(m.id);
1298
+ seen2.add(m.id);
1111
1299
  merged.push(m);
1112
1300
  }
1113
1301
  nextMessages.delete(oldId);
@@ -1541,6 +1729,21 @@ function applyTheme(host, theme) {
1541
1729
  host.style.removeProperty("--hw-window-left");
1542
1730
  }
1543
1731
  if (theme.placement) host.dataset.hwPlacement = theme.placement;
1732
+ if (theme.dockSurface === "brand") {
1733
+ host.dataset.hwDockSurface = "brand";
1734
+ const ink = dockInk(theme.primaryColor);
1735
+ if (ink) {
1736
+ setVar(host, "--hw-dock-tint", ink.tint);
1737
+ setVar(host, "--hw-dock-ink", ink.ink);
1738
+ setVar(host, "--hw-dock-shade", ink.shade);
1739
+ setVar(host, "--hw-dock-wash", ink.wash);
1740
+ setVar(host, "--hw-dock-ink-2", ink.ink2);
1741
+ setVar(host, "--hw-dock-ink-3", ink.ink3);
1742
+ setVar(host, "--hw-dock-ink-4", ink.ink4);
1743
+ }
1744
+ } else if (theme.dockSurface === "glass") {
1745
+ delete host.dataset.hwDockSurface;
1746
+ }
1544
1747
  if (theme.colorScheme === "light" || theme.colorScheme === "dark") {
1545
1748
  host.dataset.theme = theme.colorScheme;
1546
1749
  } else if (theme.colorScheme === "system") {
@@ -1664,6 +1867,43 @@ import {
1664
1867
  useState
1665
1868
  } from "react";
1666
1869
  import { useStore } from "zustand";
1870
+
1871
+ // src/map-conversation.ts
1872
+ function mapConversation(c) {
1873
+ return {
1874
+ id: c.id,
1875
+ title: c.title,
1876
+ status: c.status,
1877
+ lastMessageText: c.lastMessageText,
1878
+ lastMessageAt: c.lastMessageAt,
1879
+ lastMessageSenderType: c.lastMessageSenderType,
1880
+ lastMessageSenderName: c.lastMessageSenderName,
1881
+ lastMessageSenderImage: c.lastMessageSenderImage,
1882
+ /* The server's count, not a zero.
1883
+
1884
+ This was the literal `0`, which meant `useUnread()` answered 0 on every
1885
+ page load however many replies were waiting — the value described
1886
+ "messages that arrived while this tab has been open", not "unread". A
1887
+ badge shipped against the hook downstream never rendered once, with an
1888
+ unanswered agent message on screen.
1889
+
1890
+ Still defaulted, because a widget on an older API build gets a payload
1891
+ without the field, and 0 is the honest answer there — the socket path
1892
+ raises it from there as messages land. */
1893
+ unreadCount: c.unreadCount ?? 0,
1894
+ /* `?? null`, not left undefined: the store type says `string | null`, and
1895
+ undefined would satisfy it structurally while meaning something else to
1896
+ every reader downstream. */
1897
+ assigneeName: c.assigneeName ?? null,
1898
+ assigneeImage: c.assigneeImage ?? null,
1899
+ /* The visitor's own answer. Without it the resolved block asked "How was
1900
+ your experience?" again on every page load, to someone who had already
1901
+ said, and the server then refused the second answer. */
1902
+ csatRating: c.csatRating ?? null
1903
+ };
1904
+ }
1905
+
1906
+ // src/provider.tsx
1667
1907
  import { jsx } from "react/jsx-runtime";
1668
1908
  var WidgetContext = createContext(null);
1669
1909
  function useWidgetContext() {
@@ -1703,6 +1943,7 @@ function SupportProvider({
1703
1943
  const initRef = useRef(null);
1704
1944
  const [hasBootstrapError, setHasBootstrapError] = useState(false);
1705
1945
  const [wsDisconnected, setWsDisconnected] = useState(false);
1946
+ const [wsLost, setWsLost] = useState(false);
1706
1947
  const [bootstrapAttempt, setBootstrapAttempt] = useState(0);
1707
1948
  const sourceLocaleRef = useRef(locale);
1708
1949
  const getSourceLocale = useCallback(() => sourceLocaleRef.current, []);
@@ -1766,28 +2007,6 @@ function SupportProvider({
1766
2007
  }
1767
2008
  const convData = await client.widget.listConversations.query();
1768
2009
  if (cancelled) return;
1769
- const mapConversation = (c) => ({
1770
- id: c.id,
1771
- title: c.title,
1772
- status: c.status,
1773
- lastMessageText: c.lastMessageText,
1774
- lastMessageAt: c.lastMessageAt,
1775
- lastMessageSenderType: c.lastMessageSenderType,
1776
- lastMessageSenderName: c.lastMessageSenderName,
1777
- lastMessageSenderImage: c.lastMessageSenderImage,
1778
- /* The server's count, not a zero.
1779
-
1780
- This was the literal `0`, which meant `useUnread()` answered 0 on
1781
- every page load however many replies were waiting — the value
1782
- described "messages that arrived while this tab has been open",
1783
- not "unread". A badge shipped against the hook downstream never
1784
- rendered once, with an unanswered agent message on screen.
1785
-
1786
- Still defaulted, because a widget on an older API build gets a
1787
- payload without the field, and 0 is the honest answer there — the
1788
- socket path raises it from there as messages land. */
1789
- unreadCount: c.unreadCount ?? 0
1790
- });
1791
2010
  store.getState().setConversations(convData.conversations.map(mapConversation));
1792
2011
  if (data.website?.id && data.visitor?.id) {
1793
2012
  ws.configure({ websiteId: data.website.id, visitorId: data.visitor.id });
@@ -1922,16 +2141,21 @@ function SupportProvider({
1922
2141
  if (isViewing) scheduleMarkSeen(event.conversationId);
1923
2142
  }
1924
2143
  });
1925
- const DOWN_GRACE_MS = 2e3;
1926
2144
  let downSince = null;
1927
2145
  const wsCheck = setInterval(() => {
1928
- if (ws.isConnected) {
1929
- downSince = null;
1930
- setWsDisconnected(false);
1931
- return;
1932
- }
1933
- if (downSince === null) downSince = Date.now();
1934
- setWsDisconnected(Date.now() - downSince >= DOWN_GRACE_MS);
2146
+ const connected = ws.isConnected;
2147
+ if (connected) downSince = null;
2148
+ else if (downSince === null) downSince = Date.now();
2149
+ const notice = connectionNotice({
2150
+ connected,
2151
+ hasOpened: ws.hasOpened ?? false,
2152
+ startedAt: ws.connectStartedAt ?? null,
2153
+ downSince,
2154
+ now: Date.now(),
2155
+ gaveUp: ws.hasGivenUp ?? false
2156
+ });
2157
+ setWsDisconnected(notice === "reconnecting");
2158
+ setWsLost(notice === "lost");
1935
2159
  }, 1e3);
1936
2160
  return () => {
1937
2161
  cancelled = true;
@@ -2022,6 +2246,14 @@ function SupportProvider({
2022
2246
  emitter,
2023
2247
  hasBootstrapError,
2024
2248
  wsDisconnected,
2249
+ wsLost,
2250
+ /* Answer the press on screen at once: the strip goes back to
2251
+ "Reconnecting…" now, not at the next one-second sample. */
2252
+ retryConnection: () => {
2253
+ ws.retryNow?.();
2254
+ setWsLost(false);
2255
+ setWsDisconnected(true);
2256
+ },
2025
2257
  retryBootstrap,
2026
2258
  getSourceLocale
2027
2259
  };
@@ -2123,7 +2355,7 @@ function inferApiUrl() {
2123
2355
  }
2124
2356
 
2125
2357
  // src/themed/default-widget.tsx
2126
- import { createContext as createContext2, useCallback as useCallback14, useContext as useContext2, useEffect as useEffect16, useRef as useRef17, useState as useState16 } from "react";
2358
+ import { createContext as createContext2, useCallback as useCallback14, useContext as useContext2, useEffect as useEffect16, useRef as useRef17, useState as useState17 } from "react";
2127
2359
 
2128
2360
  // src/hooks/use-announcements.ts
2129
2361
  import { useCallback as useCallback2, useEffect as useEffect2, useMemo, useRef as useRef2 } from "react";
@@ -2148,22 +2380,22 @@ function getSeenSlugs(websiteId, visitorId) {
2148
2380
  }
2149
2381
  function addSeenSlug(websiteId, visitorId, slug) {
2150
2382
  try {
2151
- const seen = getSeenSlugs(websiteId, visitorId);
2152
- seen.add(slug);
2153
- localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen]));
2383
+ const seen2 = getSeenSlugs(websiteId, visitorId);
2384
+ seen2.add(slug);
2385
+ localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen2]));
2154
2386
  } catch {
2155
2387
  }
2156
2388
  }
2157
2389
  function addSeenSlugs(websiteId, visitorId, slugs) {
2158
2390
  try {
2159
- const seen = getSeenSlugs(websiteId, visitorId);
2160
- for (const s of slugs) seen.add(s);
2161
- localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen]));
2391
+ const seen2 = getSeenSlugs(websiteId, visitorId);
2392
+ for (const s of slugs) seen2.add(s);
2393
+ localStorage.setItem(storageKey(websiteId, visitorId), JSON.stringify([...seen2]));
2162
2394
  } catch {
2163
2395
  }
2164
2396
  }
2165
- function filterUnseen(entries, seen) {
2166
- return entries.filter((e) => !seen.has(e.slug));
2397
+ function filterUnseen(entries, seen2) {
2398
+ return entries.filter((e) => !seen2.has(e.slug));
2167
2399
  }
2168
2400
  var EMPTY_TABS = [];
2169
2401
  function useAnnouncements() {
@@ -2189,8 +2421,8 @@ function useAnnouncements() {
2189
2421
  function onTabDone(entries, tab) {
2190
2422
  allSlugs.push(...entries.map((e) => e.slug));
2191
2423
  if (!(isFirstVisit && !isAnonymous) && entries.length > 0) {
2192
- const seen = getSeenSlugs(websiteId, visitorId);
2193
- const unseen = filterUnseen(entries, seen);
2424
+ const seen2 = getSeenSlugs(websiteId, visitorId);
2425
+ const unseen = filterUnseen(entries, seen2);
2194
2426
  totalUnseen += unseen.length;
2195
2427
  const newest = unseen[0];
2196
2428
  if (newest && !store.getState().isOpen) {
@@ -2236,13 +2468,13 @@ function useAnnouncements() {
2236
2468
  (slug) => {
2237
2469
  if (!websiteId || !visitorId || announcementTabs.length === 0) return;
2238
2470
  addSeenSlug(websiteId, visitorId, slug);
2239
- const seen = getSeenSlugs(websiteId, visitorId);
2471
+ const seen2 = getSeenSlugs(websiteId, visitorId);
2240
2472
  let total = 0;
2241
2473
  for (const tab of announcementTabs) {
2242
2474
  const cacheKey = `announcements:${tab.id}:${getLocale()}`;
2243
2475
  const cached = store.getState().contentCache.get(cacheKey);
2244
2476
  if (cached) {
2245
- total += filterUnseen(cached.data, seen).length;
2477
+ total += filterUnseen(cached.data, seen2).length;
2246
2478
  }
2247
2479
  }
2248
2480
  store.getState().setUnseenAnnouncementCount(total);
@@ -2265,13 +2497,13 @@ function useAnnouncements() {
2265
2497
  }, [websiteId, visitorId, announcementTabs, store]);
2266
2498
  const getUnseenEntries = useCallback2(() => {
2267
2499
  if (announcementTabs.length === 0 || !websiteId || !visitorId) return [];
2268
- const seen = getSeenSlugs(websiteId, visitorId);
2500
+ const seen2 = getSeenSlugs(websiteId, visitorId);
2269
2501
  const result = [];
2270
2502
  for (const tab of announcementTabs) {
2271
2503
  const cacheKey = `announcements:${tab.id}:${getLocale()}`;
2272
2504
  const cached = store.getState().contentCache.get(cacheKey);
2273
2505
  if (cached) {
2274
- for (const entry of filterUnseen(cached.data, seen)) {
2506
+ for (const entry of filterUnseen(cached.data, seen2)) {
2275
2507
  result.push({ ...entry, tabId: tab.id });
2276
2508
  }
2277
2509
  }
@@ -2301,21 +2533,7 @@ function currentPagePayload() {
2301
2533
  }
2302
2534
  var MAX_ATTACHMENTS = 10;
2303
2535
  var MAX_FILE_SIZE2 = 10 * 1024 * 1024;
2304
- var ACCEPTED_TYPES = [
2305
- "image/png",
2306
- "image/jpeg",
2307
- "image/gif",
2308
- "image/webp",
2309
- "image/svg+xml",
2310
- "application/pdf",
2311
- "text/plain",
2312
- "text/csv",
2313
- "application/zip",
2314
- "application/msword",
2315
- "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
2316
- "application/vnd.ms-excel",
2317
- "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
2318
- ].join(",");
2536
+ var ACCEPTED_TYPES = acceptAttribute();
2319
2537
  function useComposer(boundConversationId) {
2320
2538
  const { client, ws, store, getSourceLocale } = useWidgetContext();
2321
2539
  const conversationId = boundConversationId;
@@ -3020,6 +3238,51 @@ function StarIcon({ size = 24, ...props }) {
3020
3238
  }
3021
3239
  );
3022
3240
  }
3241
+ function CheckCircleIcon({ size = 24, ...props }) {
3242
+ return /* @__PURE__ */ jsx2(
3243
+ "svg",
3244
+ {
3245
+ width: typeof size === "number" ? `${size}px` : size,
3246
+ height: typeof size === "number" ? `${size}px` : size,
3247
+ viewBox: "0 0 24 24",
3248
+ fill: "none",
3249
+ "aria-hidden": true,
3250
+ xmlns: "http://www.w3.org/2000/svg",
3251
+ ...props,
3252
+ children: /* @__PURE__ */ jsx2("path", { d: "M15 9.5L10.5 15L8.5 13M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" })
3253
+ }
3254
+ );
3255
+ }
3256
+ function ThumbsUpIcon({ size = 24, ...props }) {
3257
+ return /* @__PURE__ */ jsx2(
3258
+ "svg",
3259
+ {
3260
+ width: typeof size === "number" ? `${size}px` : size,
3261
+ height: typeof size === "number" ? `${size}px` : size,
3262
+ viewBox: "0 0 24 24",
3263
+ fill: "none",
3264
+ "aria-hidden": true,
3265
+ xmlns: "http://www.w3.org/2000/svg",
3266
+ ...props,
3267
+ children: /* @__PURE__ */ jsx2("path", { d: "M7 11H4C3.44772 11 3 11.4477 3 12V19C3 19.5523 3.44772 20 4 20H7M7 11V20M7 11L11 3H11.6156C12.843 3 13.7808 4.09535 13.5917 5.3081L13.0161 9H18.0631C19.8811 9 21.2813 10.6041 21.0356 12.4053L20.3538 17.4053C20.1511 18.8918 18.8815 20 17.3813 20H7", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round" })
3268
+ }
3269
+ );
3270
+ }
3271
+ function ThumbsDownIcon({ size = 24, ...props }) {
3272
+ return /* @__PURE__ */ jsx2(
3273
+ "svg",
3274
+ {
3275
+ width: typeof size === "number" ? `${size}px` : size,
3276
+ height: typeof size === "number" ? `${size}px` : size,
3277
+ viewBox: "0 0 24 24",
3278
+ fill: "none",
3279
+ "aria-hidden": true,
3280
+ xmlns: "http://www.w3.org/2000/svg",
3281
+ ...props,
3282
+ children: /* @__PURE__ */ jsx2("path", { d: "M17 13H20C20.5523 13 21 12.5523 21 12L21 5C21 4.44772 20.5523 4 20 4H17M17 13L17 4M17 13L13.301 20.4505C13.1339 20.7871 12.7905 21 12.4147 21V21C11.1917 21 10.2572 19.9046 10.4456 18.6919L11.0192 15L5.98994 15C4.17839 15 2.78316 13.3959 3.02793 11.5947L3.70735 6.59466C3.90933 5.1082 5.17443 4 6.66936 4H17", stroke: "currentColor", strokeWidth: "2", strokeLinejoin: "round" })
3283
+ }
3284
+ );
3285
+ }
3023
3286
 
3024
3287
  // src/themed/composer.tsx
3025
3288
  import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
@@ -3636,6 +3899,31 @@ function AnnouncementPreviewItem({
3636
3899
  );
3637
3900
  }
3638
3901
 
3902
+ // src/themed/connection-strip.tsx
3903
+ import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
3904
+ function ConnectionStrip({
3905
+ reconnecting,
3906
+ lost,
3907
+ onRetry
3908
+ }) {
3909
+ if (lost) {
3910
+ return (
3911
+ // biome-ignore lint/a11y/useSemanticElements: <output> is a form element and is styled by host pages; a div with the role is announced the same
3912
+ /* @__PURE__ */ jsxs5("div", { className: "hw-disconnect", role: "status", children: [
3913
+ /* @__PURE__ */ jsx6("span", { children: t("widget.connection_lost") }),
3914
+ /* @__PURE__ */ jsx6("button", { type: "button", className: "hw-disconnect-retry", onClick: onRetry, children: t("widget.retry") })
3915
+ ] })
3916
+ );
3917
+ }
3918
+ if (reconnecting) {
3919
+ return /* @__PURE__ */ jsxs5("div", { className: "hw-disconnect", children: [
3920
+ /* @__PURE__ */ jsx6("div", { className: "hw-disconnect-spinner" }),
3921
+ t("widget.reconnecting")
3922
+ ] });
3923
+ }
3924
+ return null;
3925
+ }
3926
+
3639
3927
  // src/themed/content/content-tab-view.tsx
3640
3928
  import { useCallback as useCallback13, useEffect as useEffect11 } from "react";
3641
3929
 
@@ -3786,7 +4074,10 @@ function useContentTab(tabId) {
3786
4074
 
3787
4075
  // src/themed/content/simple-markdown.tsx
3788
4076
  import { useEffect as useEffect9, useRef as useRef10 } from "react";
3789
- import { jsx as jsx6 } from "react/jsx-runtime";
4077
+ import { jsx as jsx7 } from "react/jsx-runtime";
4078
+ function esc(value) {
4079
+ return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
4080
+ }
3790
4081
  var COPY_ICON = `<svg class="hw-code-copy-icon" viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M15 9V4.25C15 3.55964 14.4404 3 13.75 3H4.25C3.55964 3 3 3.55964 3 4.25V13.75C3 14.4404 3.55964 15 4.25 15H9M10.25 9H19.75C20.4404 9 21 9.55964 21 10.25V19.75C21 20.4404 20.4404 21 19.75 21H10.25C9.55964 21 9 20.4404 9 19.75V10.25C9 9.55964 9.55964 9 10.25 9Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
3791
4082
  var CHECK_ICON = `<svg class="hw-code-check-icon" viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M8 13L11 16L16 8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
3792
4083
  function inferCodeLanguage(code, lang) {
@@ -3826,7 +4117,7 @@ function renderMarkdown(md) {
3826
4117
  const className = langLabel !== "code" ? ` class="language-${langLabel}"` : "";
3827
4118
  const trimmed = escaped.replace(/\n$/, "");
3828
4119
  codeBlocks.push(
3829
- `<div class="hw-code" data-hw-code="1"><div class="hw-code-header"><span class="hw-code-lang">${langLabel}</span><div class="hw-code-actions"><button type="button" class="hw-code-action hw-code-copy" aria-label="Copy code" title="Copy code">${COPY_ICON}${CHECK_ICON}<span class="hw-code-copy-label">Copy</span></button></div></div><pre><code${className}>${trimmed}</code></pre></div>`
4120
+ `<div class="hw-code" data-hw-code="1"><div class="hw-code-header"><span class="hw-code-lang">${langLabel}</span><div class="hw-code-actions"><button type="button" class="hw-code-action hw-code-copy" aria-label="${esc(t("widget.code_copy_aria"))}" title="${esc(t("widget.code_copy_aria"))}">${COPY_ICON}${CHECK_ICON}<span class="hw-code-copy-label">${esc(t("widget.code_copy"))}</span></button></div></div><pre><code${className}>${trimmed}</code></pre></div>`
3830
4121
  );
3831
4122
  return `
3832
4123
 
@@ -3850,7 +4141,9 @@ ${codeBlockPlaceholder(codeBlocks.length - 1)}
3850
4141
  (_match, headerLine, bodyLines) => {
3851
4142
  const cells = (line) => line.trim().replace(/^\||\|$/g, "").split("|").map((c) => c.trim());
3852
4143
  const head = cells(headerLine).map((c) => `<th>${c}</th>`).join("");
3853
- const rows = bodyLines.trim().split("\n").map((line) => `<tr>${cells(line).map((c) => `<td>${c}</td>`).join("")}</tr>`).join("");
4144
+ const rows = bodyLines.trim().split("\n").map(
4145
+ (line) => `<tr>${cells(line).map((c) => `<td>${c}</td>`).join("")}</tr>`
4146
+ ).join("");
3854
4147
  tables.push(
3855
4148
  `<div class="hw-table-wrap"><table class="hw-table"><thead><tr>${head}</tr></thead><tbody>${rows}</tbody></table></div>`
3856
4149
  );
@@ -3906,9 +4199,7 @@ function MarkdownContent({
3906
4199
  const root = rootRef.current;
3907
4200
  if (!root) return;
3908
4201
  const isWhitespaceOnly = (el) => {
3909
- const hasNonBrChild = Array.from(el.children).some(
3910
- (c) => c.tagName !== "BR"
3911
- );
4202
+ const hasNonBrChild = Array.from(el.children).some((c) => c.tagName !== "BR");
3912
4203
  if (hasNonBrChild) return false;
3913
4204
  const text = el.textContent ?? "";
3914
4205
  return text.replace(/[\s ]/g, "") === "";
@@ -3933,7 +4224,7 @@ function MarkdownContent({
3933
4224
  };
3934
4225
  }, []);
3935
4226
  if (!html) return null;
3936
- return /* @__PURE__ */ jsx6(
4227
+ return /* @__PURE__ */ jsx7(
3937
4228
  "div",
3938
4229
  {
3939
4230
  ref: rootRef,
@@ -3945,8 +4236,8 @@ function MarkdownContent({
3945
4236
  function flashCopied(btn, failed = false) {
3946
4237
  const label = btn.querySelector(".hw-code-copy-label");
3947
4238
  if (!label) return;
3948
- const original = label.textContent ?? "Copy";
3949
- label.textContent = failed ? "Failed" : "Copied";
4239
+ const original = label.textContent ?? t("widget.code_copy");
4240
+ label.textContent = failed ? t("widget.code_copy_failed") : t("widget.copied");
3950
4241
  btn.classList.add(failed ? "hw-code-copy--failed" : "hw-code-copy--copied");
3951
4242
  setTimeout(() => {
3952
4243
  label.textContent = original;
@@ -3963,24 +4254,24 @@ function closeDanglingMarkdown(partial) {
3963
4254
  }
3964
4255
 
3965
4256
  // src/themed/content/content-detail-view.tsx
3966
- import { Fragment as Fragment2, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
4257
+ import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
3967
4258
  function ContentDetailView({
3968
4259
  entry,
3969
4260
  isLoading
3970
4261
  }) {
3971
4262
  if (isLoading || !entry) {
3972
- return /* @__PURE__ */ jsx7(ArticleSkeleton, {});
4263
+ return /* @__PURE__ */ jsx8(ArticleSkeleton, {});
3973
4264
  }
3974
4265
  const badge = entry.customFields.version ?? entry.customFields.priority ?? entry.customFields.type ?? null;
3975
- return /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail", children: [
3976
- /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-header", children: [
3977
- /* @__PURE__ */ jsx7("h1", { className: "hw-content-detail-title", children: entry.title }),
3978
- (badge || entry.publishedAt) && /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-meta", children: [
3979
- badge && /* @__PURE__ */ jsx7("span", { className: "hw-content-entry-badge", children: badge }),
3980
- entry.publishedAt && /* @__PURE__ */ jsx7("span", { className: "hw-content-detail-date", children: formatRelativeTime(entry.publishedAt) })
4266
+ return /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail", children: [
4267
+ /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-header", children: [
4268
+ /* @__PURE__ */ jsx8("h1", { className: "hw-content-detail-title", children: entry.title }),
4269
+ (badge || entry.publishedAt) && /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-meta", children: [
4270
+ badge && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-badge", children: badge }),
4271
+ entry.publishedAt && /* @__PURE__ */ jsx8("span", { className: "hw-content-detail-date", children: formatRelativeTime(entry.publishedAt) })
3981
4272
  ] })
3982
4273
  ] }),
3983
- (entry.body || entry.bodyHtml) && /* @__PURE__ */ jsx7("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx7(MarkdownContent, { bodyHtml: entry.bodyHtml, bodyMarkdown: entry.body }) })
4274
+ (entry.body || entry.bodyHtml) && /* @__PURE__ */ jsx8("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx8(MarkdownContent, { bodyHtml: entry.bodyHtml, bodyMarkdown: entry.body }) })
3984
4275
  ] });
3985
4276
  }
3986
4277
  function ArticleSkeleton() {
@@ -4001,15 +4292,15 @@ function ArticleSkeleton() {
4001
4292
  ]
4002
4293
  }
4003
4294
  ];
4004
- return /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail", children: [
4005
- /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-header", children: [
4006
- /* @__PURE__ */ jsx7("h1", { className: "hw-content-detail-title", children: /* @__PURE__ */ jsx7("span", { className: "hw-skeleton hw-skeleton-title" }) }),
4007
- /* @__PURE__ */ jsxs5("div", { className: "hw-content-detail-meta", children: [
4008
- /* @__PURE__ */ jsx7("span", { className: "hw-skeleton hw-skeleton-badge" }),
4009
- /* @__PURE__ */ jsx7("span", { className: "hw-skeleton hw-skeleton-date" })
4295
+ return /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail", children: [
4296
+ /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-header", children: [
4297
+ /* @__PURE__ */ jsx8("h1", { className: "hw-content-detail-title", children: /* @__PURE__ */ jsx8("span", { className: "hw-skeleton hw-skeleton-title" }) }),
4298
+ /* @__PURE__ */ jsxs6("div", { className: "hw-content-detail-meta", children: [
4299
+ /* @__PURE__ */ jsx8("span", { className: "hw-skeleton hw-skeleton-badge" }),
4300
+ /* @__PURE__ */ jsx8("span", { className: "hw-skeleton hw-skeleton-date" })
4010
4301
  ] })
4011
4302
  ] }),
4012
- /* @__PURE__ */ jsx7("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx7("div", { className: "hw-markdown", children: sections.map((s, i) => /* @__PURE__ */ jsx7(
4303
+ /* @__PURE__ */ jsx8("div", { className: "hw-content-detail-body", children: /* @__PURE__ */ jsx8("div", { className: "hw-markdown", children: sections.map((s, i) => /* @__PURE__ */ jsx8(
4013
4304
  SkeletonSection,
4014
4305
  {
4015
4306
  headerWidth: s.headerWidth,
@@ -4023,23 +4314,23 @@ function SkeletonSection({
4023
4314
  headerWidth,
4024
4315
  items
4025
4316
  }) {
4026
- return /* @__PURE__ */ jsxs5(Fragment2, { children: [
4027
- /* @__PURE__ */ jsx7("h2", { children: /* @__PURE__ */ jsx7(
4317
+ return /* @__PURE__ */ jsxs6(Fragment2, { children: [
4318
+ /* @__PURE__ */ jsx8("h2", { children: /* @__PURE__ */ jsx8(
4028
4319
  "span",
4029
4320
  {
4030
4321
  className: "hw-skeleton hw-skeleton-h2",
4031
4322
  style: { display: "block", width: headerWidth }
4032
4323
  }
4033
4324
  ) }),
4034
- items.map((item, j) => /* @__PURE__ */ jsx7("ul", { children: /* @__PURE__ */ jsx7("li", { children: /* @__PURE__ */ jsxs5("div", { className: "hw-skeleton-bullet-lines", children: [
4035
- /* @__PURE__ */ jsx7(
4325
+ items.map((item, j) => /* @__PURE__ */ jsx8("ul", { children: /* @__PURE__ */ jsx8("li", { children: /* @__PURE__ */ jsxs6("div", { className: "hw-skeleton-bullet-lines", children: [
4326
+ /* @__PURE__ */ jsx8(
4036
4327
  "span",
4037
4328
  {
4038
4329
  className: "hw-skeleton hw-skeleton-bullet-line",
4039
4330
  style: { display: "block", width: item.l1 }
4040
4331
  }
4041
4332
  ),
4042
- /* @__PURE__ */ jsx7(
4333
+ /* @__PURE__ */ jsx8(
4043
4334
  "span",
4044
4335
  {
4045
4336
  className: "hw-skeleton hw-skeleton-bullet-line",
@@ -4052,7 +4343,7 @@ function SkeletonSection({
4052
4343
 
4053
4344
  // src/themed/content/content-list-view.tsx
4054
4345
  import { useCallback as useCallback11, useRef as useRef11, useState as useState11 } from "react";
4055
- import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
4346
+ import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
4056
4347
  function ContentListView({
4057
4348
  entries,
4058
4349
  isLoading,
@@ -4076,13 +4367,13 @@ function ContentListView({
4076
4367
  },
4077
4368
  [onSearch]
4078
4369
  );
4079
- return /* @__PURE__ */ jsxs6("div", { className: "hw-content-list", children: [
4080
- onSearch && /* @__PURE__ */ jsx8("div", { className: "hw-content-search", children: /* @__PURE__ */ jsxs6("div", { className: "hw-content-search-box", children: [
4081
- /* @__PURE__ */ jsxs6("svg", { className: "hw-content-search-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
4082
- /* @__PURE__ */ jsx8("circle", { cx: "11", cy: "11", r: "8" }),
4083
- /* @__PURE__ */ jsx8("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
4370
+ return /* @__PURE__ */ jsxs7("div", { className: "hw-content-list", children: [
4371
+ onSearch && /* @__PURE__ */ jsx9("div", { className: "hw-content-search", children: /* @__PURE__ */ jsxs7("div", { className: "hw-content-search-box", children: [
4372
+ /* @__PURE__ */ jsxs7("svg", { className: "hw-content-search-icon", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
4373
+ /* @__PURE__ */ jsx9("circle", { cx: "11", cy: "11", r: "8" }),
4374
+ /* @__PURE__ */ jsx9("line", { x1: "21", y1: "21", x2: "16.65", y2: "16.65" })
4084
4375
  ] }),
4085
- /* @__PURE__ */ jsx8(
4376
+ /* @__PURE__ */ jsx9(
4086
4377
  "input",
4087
4378
  {
4088
4379
  type: "text",
@@ -4093,18 +4384,18 @@ function ContentListView({
4093
4384
  }
4094
4385
  )
4095
4386
  ] }) }),
4096
- isLoading && entries.length === 0 && /* @__PURE__ */ jsx8("div", { className: "hw-skeleton-content", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs6("div", { className: "hw-skeleton-content-item", children: [
4097
- /* @__PURE__ */ jsx8("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "70%", height: 14 } }),
4098
- /* @__PURE__ */ jsx8("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "90%", height: 12 } }),
4099
- /* @__PURE__ */ jsx8("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "40%", height: 10 } })
4387
+ isLoading && entries.length === 0 && /* @__PURE__ */ jsx9("div", { className: "hw-skeleton-content", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsxs7("div", { className: "hw-skeleton-content-item", children: [
4388
+ /* @__PURE__ */ jsx9("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "70%", height: 14 } }),
4389
+ /* @__PURE__ */ jsx9("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "90%", height: 12 } }),
4390
+ /* @__PURE__ */ jsx9("div", { className: "hw-skeleton hw-skeleton-line", style: { width: "40%", height: 10 } })
4100
4391
  ] }, i)) }),
4101
- !isLoading && entries.length === 0 && /* @__PURE__ */ jsxs6("div", { className: "hw-content-empty", children: [
4102
- /* @__PURE__ */ jsx8("div", { className: "hw-content-empty-title", children: searchText ? t("widget.no_results") : t("widget.nothing_yet") }),
4103
- /* @__PURE__ */ jsx8("div", { className: "hw-content-empty-desc", children: searchText ? t("widget.try_different") : t("widget.check_back") })
4392
+ !isLoading && entries.length === 0 && /* @__PURE__ */ jsxs7("div", { className: "hw-content-empty", children: [
4393
+ /* @__PURE__ */ jsx9("div", { className: "hw-content-empty-title", children: searchText ? t("widget.no_results") : t("widget.nothing_yet") }),
4394
+ /* @__PURE__ */ jsx9("div", { className: "hw-content-empty-desc", children: searchText ? t("widget.try_different") : t("widget.check_back") })
4104
4395
  ] }),
4105
- entries.length > 0 && /* @__PURE__ */ jsxs6("div", { className: "hw-content-entries", children: [
4106
- entries.map((entry) => /* @__PURE__ */ jsx8(ContentEntryCard, { entry, onSelect, display }, entry.slug)),
4107
- hasMore && /* @__PURE__ */ jsx8(
4396
+ entries.length > 0 && /* @__PURE__ */ jsxs7("div", { className: "hw-content-entries", children: [
4397
+ entries.map((entry) => /* @__PURE__ */ jsx9(ContentEntryCard, { entry, onSelect, display }, entry.slug)),
4398
+ hasMore && /* @__PURE__ */ jsx9(
4108
4399
  "button",
4109
4400
  {
4110
4401
  type: "button",
@@ -4131,16 +4422,16 @@ function ContentEntryCard({
4131
4422
  const badge = display?.badgeField ? customFields[display.badgeField] ?? null : customFields.version ?? customFields.priority ?? customFields.type ?? null;
4132
4423
  const subtitleValue = display?.subtitleField ? (display.subtitleField === "body" ? entry.body : customFields[display.subtitleField]) ?? null : customFields.excerpt ?? customFields.summary ?? customFields.description ?? null;
4133
4424
  const preview = subtitleValue ? truncateText(subtitleValue) : truncateText(entry.body);
4134
- return /* @__PURE__ */ jsx8("button", { type: "button", className: "hw-content-entry", onClick: () => onSelect(entry.slug), children: /* @__PURE__ */ jsxs6("div", { className: "hw-content-entry-main", children: [
4135
- /* @__PURE__ */ jsxs6("div", { className: "hw-content-entry-text", children: [
4136
- /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-title", children: entry.title }),
4137
- preview && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-desc", children: preview }),
4138
- (badge || entry.publishedAt) && /* @__PURE__ */ jsxs6("div", { className: "hw-content-entry-meta", children: [
4139
- badge && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-badge", children: badge }),
4140
- entry.publishedAt && /* @__PURE__ */ jsx8("span", { className: "hw-content-entry-date", children: formatRelativeTime(entry.publishedAt) })
4425
+ return /* @__PURE__ */ jsx9("button", { type: "button", className: "hw-content-entry", onClick: () => onSelect(entry.slug), children: /* @__PURE__ */ jsxs7("div", { className: "hw-content-entry-main", children: [
4426
+ /* @__PURE__ */ jsxs7("div", { className: "hw-content-entry-text", children: [
4427
+ /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-title", children: entry.title }),
4428
+ preview && /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-desc", children: preview }),
4429
+ (badge || entry.publishedAt) && /* @__PURE__ */ jsxs7("div", { className: "hw-content-entry-meta", children: [
4430
+ badge && /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-badge", children: badge }),
4431
+ entry.publishedAt && /* @__PURE__ */ jsx9("span", { className: "hw-content-entry-date", children: formatRelativeTime(entry.publishedAt) })
4141
4432
  ] })
4142
4433
  ] }),
4143
- /* @__PURE__ */ jsx8("svg", { className: "hw-content-entry-chevron", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx8("polyline", { points: "9 18 15 12 9 6" }) })
4434
+ /* @__PURE__ */ jsx9("svg", { className: "hw-content-entry-chevron", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx9("polyline", { points: "9 18 15 12 9 6" }) })
4144
4435
  ] }) });
4145
4436
  }
4146
4437
 
@@ -4357,7 +4648,7 @@ function useGroupedContentTab(tabId) {
4357
4648
  }
4358
4649
 
4359
4650
  // src/themed/content/grouped-content-tab-view.tsx
4360
- import { jsx as jsx9 } from "react/jsx-runtime";
4651
+ import { jsx as jsx10 } from "react/jsx-runtime";
4361
4652
  function GroupedContentTabView({
4362
4653
  tab,
4363
4654
  subView,
@@ -4398,10 +4689,10 @@ function GroupedContentTabView({
4398
4689
  prevSubView.current = subView;
4399
4690
  }, [subView, clearCategory]);
4400
4691
  if (subView === "content-detail" && detailSlug) {
4401
- return /* @__PURE__ */ jsx9(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
4692
+ return /* @__PURE__ */ jsx10(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
4402
4693
  }
4403
4694
  if (subView === "content-category" && activeCategory) {
4404
- return /* @__PURE__ */ jsx9(
4695
+ return /* @__PURE__ */ jsx10(
4405
4696
  ContentListView,
4406
4697
  {
4407
4698
  entries: items,
@@ -4415,7 +4706,7 @@ function GroupedContentTabView({
4415
4706
  }
4416
4707
  );
4417
4708
  }
4418
- return /* @__PURE__ */ jsx9(
4709
+ return /* @__PURE__ */ jsx10(
4419
4710
  ContentListView,
4420
4711
  {
4421
4712
  entries: categories,
@@ -4437,7 +4728,7 @@ function GroupedContentTabView({
4437
4728
  }
4438
4729
 
4439
4730
  // src/themed/content/content-tab-view.tsx
4440
- import { jsx as jsx10 } from "react/jsx-runtime";
4731
+ import { jsx as jsx11 } from "react/jsx-runtime";
4441
4732
  function ContentTabView({
4442
4733
  tab,
4443
4734
  showDetail,
@@ -4447,7 +4738,7 @@ function ContentTabView({
4447
4738
  onSelectCategory
4448
4739
  }) {
4449
4740
  if (tab.tabType === "grouped" && tab.itemsModelSlug) {
4450
- return /* @__PURE__ */ jsx10(
4741
+ return /* @__PURE__ */ jsx11(
4451
4742
  GroupedContentTabView,
4452
4743
  {
4453
4744
  tab,
@@ -4459,7 +4750,7 @@ function ContentTabView({
4459
4750
  }
4460
4751
  );
4461
4752
  }
4462
- return /* @__PURE__ */ jsx10(
4753
+ return /* @__PURE__ */ jsx11(
4463
4754
  FlatContentTabView,
4464
4755
  {
4465
4756
  tab,
@@ -4495,9 +4786,9 @@ function FlatContentTabView({
4495
4786
  [fetchEntries]
4496
4787
  );
4497
4788
  if (showDetail && detailSlug) {
4498
- return /* @__PURE__ */ jsx10(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
4789
+ return /* @__PURE__ */ jsx11(ContentDetailView, { entry: detail, isLoading: isLoadingDetail });
4499
4790
  }
4500
- return /* @__PURE__ */ jsx10(
4791
+ return /* @__PURE__ */ jsx11(
4501
4792
  ContentListView,
4502
4793
  {
4503
4794
  entries,
@@ -4513,7 +4804,7 @@ function FlatContentTabView({
4513
4804
  }
4514
4805
 
4515
4806
  // src/themed/content/tab-icon.tsx
4516
- import { jsx as jsx11 } from "react/jsx-runtime";
4807
+ import { jsx as jsx12 } from "react/jsx-runtime";
4517
4808
  var ICON_MAP = {
4518
4809
  book: BookIcon,
4519
4810
  megaphone: MegaphoneIcon,
@@ -4524,12 +4815,12 @@ var ICON_MAP = {
4524
4815
  };
4525
4816
  function ContentTabIconComponent({ icon }) {
4526
4817
  const Icon = ICON_MAP[icon] ?? BookIcon;
4527
- return /* @__PURE__ */ jsx11(Icon, {});
4818
+ return /* @__PURE__ */ jsx12(Icon, {});
4528
4819
  }
4529
4820
 
4530
4821
  // src/themed/debug-overlay.tsx
4531
4822
  import { useEffect as useEffect12, useMemo as useMemo2, useRef as useRef14, useState as useState13 } from "react";
4532
- import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
4823
+ import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
4533
4824
  var MAX_EVENTS = 60;
4534
4825
  function isDebugEnabled() {
4535
4826
  if (typeof window === "undefined") return false;
@@ -4635,10 +4926,10 @@ function WidgetDebugOverlay() {
4635
4926
  if (!enabled) return null;
4636
4927
  const isTyping = activeId ? typingUsers.get(activeId) : false;
4637
4928
  const isAi = activeId ? aiProcessingMap.get(activeId) : false;
4638
- return /* @__PURE__ */ jsxs7("div", { style: styles.wrap, children: [
4639
- /* @__PURE__ */ jsxs7("div", { style: styles.header, children: [
4640
- /* @__PURE__ */ jsx12("strong", { children: "hw debug" }),
4641
- /* @__PURE__ */ jsxs7("span", { style: styles.meta, children: [
4929
+ return /* @__PURE__ */ jsxs8("div", { style: styles.wrap, children: [
4930
+ /* @__PURE__ */ jsxs8("div", { style: styles.header, children: [
4931
+ /* @__PURE__ */ jsx13("strong", { children: "hw debug" }),
4932
+ /* @__PURE__ */ jsxs8("span", { style: styles.meta, children: [
4642
4933
  " ",
4643
4934
  "\xB7 conv ",
4644
4935
  activeId ? activeId.slice(0, 10) : "\u2014",
@@ -4649,29 +4940,29 @@ function WidgetDebugOverlay() {
4649
4940
  " \xB7 ai ",
4650
4941
  isAi ? "Y" : "n"
4651
4942
  ] }),
4652
- /* @__PURE__ */ jsx12("button", { type: "button", style: styles.btn, onClick: () => setOpen((v) => !v), children: open ? "hide" : "show" }),
4653
- /* @__PURE__ */ jsx12("button", { type: "button", style: styles.btn, onClick: () => {
4943
+ /* @__PURE__ */ jsx13("button", { type: "button", style: styles.btn, onClick: () => setOpen((v) => !v), children: open ? "hide" : "show" }),
4944
+ /* @__PURE__ */ jsx13("button", { type: "button", style: styles.btn, onClick: () => {
4654
4945
  eventsRef.current = [];
4655
4946
  setEvents([]);
4656
4947
  }, children: "clear" })
4657
4948
  ] }),
4658
- open && /* @__PURE__ */ jsxs7("div", { style: styles.body, children: [
4659
- /* @__PURE__ */ jsxs7("div", { style: styles.section, children: [
4660
- /* @__PURE__ */ jsx12("div", { style: styles.sectionTitle, children: "messages (active)" }),
4661
- activeMessages.length === 0 ? /* @__PURE__ */ jsx12("div", { style: styles.empty, children: "empty" }) : activeMessages.map((m, i) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
4662
- /* @__PURE__ */ jsx12("span", { style: { ...styles.badge, background: colorFor(senderOf(m)) }, children: i }),
4663
- /* @__PURE__ */ jsx12("span", { style: styles.sender, children: senderOf(m) }),
4664
- /* @__PURE__ */ jsx12("span", { style: styles.ts, children: m.createdAt.slice(11, 23) }),
4665
- /* @__PURE__ */ jsx12("span", { style: styles.text, children: (m.text ?? "").slice(0, 60) })
4949
+ open && /* @__PURE__ */ jsxs8("div", { style: styles.body, children: [
4950
+ /* @__PURE__ */ jsxs8("div", { style: styles.section, children: [
4951
+ /* @__PURE__ */ jsx13("div", { style: styles.sectionTitle, children: "messages (active)" }),
4952
+ activeMessages.length === 0 ? /* @__PURE__ */ jsx13("div", { style: styles.empty, children: "empty" }) : activeMessages.map((m, i) => /* @__PURE__ */ jsxs8("div", { style: styles.row, children: [
4953
+ /* @__PURE__ */ jsx13("span", { style: { ...styles.badge, background: colorFor(senderOf(m)) }, children: i }),
4954
+ /* @__PURE__ */ jsx13("span", { style: styles.sender, children: senderOf(m) }),
4955
+ /* @__PURE__ */ jsx13("span", { style: styles.ts, children: m.createdAt.slice(11, 23) }),
4956
+ /* @__PURE__ */ jsx13("span", { style: styles.text, children: (m.text ?? "").slice(0, 60) })
4666
4957
  ] }, m.id))
4667
4958
  ] }),
4668
- /* @__PURE__ */ jsxs7("div", { style: styles.section, children: [
4669
- /* @__PURE__ */ jsx12("div", { style: styles.sectionTitle, children: "events" }),
4670
- events.length === 0 ? /* @__PURE__ */ jsx12("div", { style: styles.empty, children: "no events yet \u2014 send a message" }) : events.map((e) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
4671
- /* @__PURE__ */ jsx12("span", { style: { ...styles.badge, background: kindColor(e.kind) }, children: e.kind }),
4672
- /* @__PURE__ */ jsx12("span", { style: styles.ts, children: new Date(e.t).toISOString().slice(11, 23) }),
4673
- /* @__PURE__ */ jsx12("span", { style: styles.evLabel, children: e.label }),
4674
- e.detail && /* @__PURE__ */ jsx12("span", { style: styles.detail, children: e.detail })
4959
+ /* @__PURE__ */ jsxs8("div", { style: styles.section, children: [
4960
+ /* @__PURE__ */ jsx13("div", { style: styles.sectionTitle, children: "events" }),
4961
+ events.length === 0 ? /* @__PURE__ */ jsx13("div", { style: styles.empty, children: "no events yet \u2014 send a message" }) : events.map((e) => /* @__PURE__ */ jsxs8("div", { style: styles.row, children: [
4962
+ /* @__PURE__ */ jsx13("span", { style: { ...styles.badge, background: kindColor(e.kind) }, children: e.kind }),
4963
+ /* @__PURE__ */ jsx13("span", { style: styles.ts, children: new Date(e.t).toISOString().slice(11, 23) }),
4964
+ /* @__PURE__ */ jsx13("span", { style: styles.evLabel, children: e.label }),
4965
+ e.detail && /* @__PURE__ */ jsx13("span", { style: styles.detail, children: e.detail })
4675
4966
  ] }, e.id))
4676
4967
  ] })
4677
4968
  ] })
@@ -4774,9 +5065,9 @@ var styles = {
4774
5065
  };
4775
5066
 
4776
5067
  // src/themed/icons-local.tsx
4777
- import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
5068
+ import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
4778
5069
  function DotsIcon({ size = 24, ...props }) {
4779
- return /* @__PURE__ */ jsxs8(
5070
+ return /* @__PURE__ */ jsxs9(
4780
5071
  "svg",
4781
5072
  {
4782
5073
  width: size,
@@ -4787,9 +5078,9 @@ function DotsIcon({ size = 24, ...props }) {
4787
5078
  "aria-hidden": "true",
4788
5079
  ...props,
4789
5080
  children: [
4790
- /* @__PURE__ */ jsx13("circle", { cx: "5", cy: "12", r: "1.7", fill: "currentColor" }),
4791
- /* @__PURE__ */ jsx13("circle", { cx: "12", cy: "12", r: "1.7", fill: "currentColor" }),
4792
- /* @__PURE__ */ jsx13("circle", { cx: "19", cy: "12", r: "1.7", fill: "currentColor" })
5081
+ /* @__PURE__ */ jsx14("circle", { cx: "5", cy: "12", r: "1.7", fill: "currentColor" }),
5082
+ /* @__PURE__ */ jsx14("circle", { cx: "12", cy: "12", r: "1.7", fill: "currentColor" }),
5083
+ /* @__PURE__ */ jsx14("circle", { cx: "19", cy: "12", r: "1.7", fill: "currentColor" })
4793
5084
  ]
4794
5085
  }
4795
5086
  );
@@ -4797,8 +5088,379 @@ function DotsIcon({ size = 24, ...props }) {
4797
5088
 
4798
5089
  // src/themed/message-bubble.tsx
4799
5090
  import { useEffect as useEffect13, useLayoutEffect, useRef as useRef15, useState as useState14 } from "react";
5091
+
5092
+ // src/themed/image-fallback.ts
5093
+ function imageFileName(url) {
5094
+ try {
5095
+ const { pathname, host } = new URL(url);
5096
+ const last = pathname.split("/").filter(Boolean).pop();
5097
+ if (!last) return host;
5098
+ try {
5099
+ return decodeURIComponent(last);
5100
+ } catch {
5101
+ return last;
5102
+ }
5103
+ } catch {
5104
+ return url.split(/[?#]/)[0]?.split("/").filter(Boolean).pop() ?? url;
5105
+ }
5106
+ }
5107
+ function fileExt(name) {
5108
+ const dot = name.lastIndexOf(".");
5109
+ return dot > 0 ? name.slice(dot + 1).toLowerCase() : "";
5110
+ }
5111
+
5112
+ // ../types/src/link-preview.ts
5113
+ var FILE_ENDINGS = /* @__PURE__ */ new Set([
5114
+ "js",
5115
+ "jsx",
5116
+ "ts",
5117
+ "tsx",
5118
+ "mjs",
5119
+ "cjs",
5120
+ "css",
5121
+ "scss",
5122
+ "html",
5123
+ "htm",
5124
+ "json",
5125
+ "yaml",
5126
+ "yml",
5127
+ "toml",
5128
+ "xml",
5129
+ "txt",
5130
+ "log",
5131
+ "csv",
5132
+ "pdf",
5133
+ "png",
5134
+ "jpg",
5135
+ "jpeg",
5136
+ "gif",
5137
+ "svg",
5138
+ "webp",
5139
+ "php",
5140
+ "rb",
5141
+ "cpp",
5142
+ "exe",
5143
+ "lock",
5144
+ "map",
5145
+ "env",
5146
+ "md",
5147
+ "gz",
5148
+ "tar"
5149
+ ]);
5150
+ var FILE_MIDDLES = /* @__PURE__ */ new Set([
5151
+ "config",
5152
+ "spec",
5153
+ "test",
5154
+ "min",
5155
+ "d",
5156
+ "module",
5157
+ "stories",
5158
+ "setup",
5159
+ "types",
5160
+ "bundle",
5161
+ "schema"
5162
+ ]);
5163
+ var KNOWN_NAMES = /* @__PURE__ */ new Set(["asp.net", "ado.net", "vb.net"]);
5164
+ var DOT_LETTERS = /* @__PURE__ */ new Set(["\uA4F8", "\uA78F"]);
5165
+ var make = (source, flags) => new RegExp(source, flags);
5166
+ var one = (set) => make(`^[${set}]$`, "u");
5167
+ var engine;
5168
+ function patterns() {
5169
+ if (engine !== void 0) return engine;
5170
+ try {
5171
+ const lgc = "\\p{sc=Latn}\\p{sc=Grek}\\p{sc=Cyrl}\\p{sc=Zyyy}";
5172
+ engine = {
5173
+ /* Controls, line separators and the bidi controls: a space, not
5174
+ nothing, because they separated something. */
5175
+ control: make("[\\p{Cc}\\p{Zl}\\p{Zp}\\u202a-\\u202e\\u2066-\\u2069]", "gu"),
5176
+ invisible: make("[\\p{Cf}\\p{Me}\\p{Default_Ignorable_Code_Point}]", "gu"),
5177
+ looseMark: make(`(^|[${lgc}])\\p{Mn}+`, "gu"),
5178
+ anyMark: make("\\p{M}", "gu"),
5179
+ letter: one("\\p{L}"),
5180
+ modifier: one("\\p{Lm}"),
5181
+ digit: one("\\p{Nd}"),
5182
+ number: one("\\p{N}"),
5183
+ punctOrSymbol: one("\\p{P}\\p{S}"),
5184
+ /* Dashes and quotation marks are not drawn as a dot. */
5185
+ notAJoiner: one("\\p{Pd}\\p{Pi}\\p{Pf}"),
5186
+ latin: one("\\p{sc=Latn}"),
5187
+ greek: one("\\p{sc=Grek}"),
5188
+ cyrillic: one("\\p{sc=Cyrl}"),
5189
+ noSpace: one(
5190
+ "\\p{sc=Hani}\\p{sc=Hira}\\p{sc=Kana}\\p{sc=Hang}\\p{sc=Bopo}\\p{sc=Thai}\\p{sc=Laoo}\\p{sc=Khmr}\\p{sc=Mymr}\\p{sc=Tibt}"
5191
+ ),
5192
+ common: one("\\p{sc=Zyyy}\\p{sc=Zinh}"),
5193
+ tld: make("^\\p{L}{2,}$", "u"),
5194
+ ipv6Bracket: make("\\[[0-9a-f:.]*:[0-9a-f:.]*\\]", "g"),
5195
+ ipv6Bare: make("(^|[^\\p{L}\\p{N}:.])([0-9a-f:]{3,})(?![\\p{L}\\p{N}:.])", "gu")
5196
+ };
5197
+ } catch {
5198
+ engine = null;
5199
+ }
5200
+ return engine;
5201
+ }
5202
+ function foldPreviewText(value) {
5203
+ const rx = patterns();
5204
+ if (!rx) throw new Error("link-preview: no Unicode property support");
5205
+ return value.normalize("NFKC").replace(rx.control, " ").replace(rx.invisible, "").replace(rx.looseMark, "$1").replace(/\s+/g, " ").trim();
5206
+ }
5207
+ function cleanPreviewText(value, cap) {
5208
+ if (typeof value !== "string") return null;
5209
+ let text;
5210
+ try {
5211
+ text = foldPreviewText(value);
5212
+ } catch {
5213
+ return null;
5214
+ }
5215
+ if (!text) return null;
5216
+ return text.length > cap ? `${text.slice(0, cap - 1).trimEnd()}\u2026` : text;
5217
+ }
5218
+ var BREAK = { kind: "break", script: "common" };
5219
+ var seen = /* @__PURE__ */ new Map();
5220
+ function scriptOf(ch, rx) {
5221
+ if (rx.latin.test(ch)) return "latin";
5222
+ if (rx.noSpace.test(ch)) return "nospace";
5223
+ if (rx.cyrillic.test(ch)) return "cyrillic";
5224
+ if (rx.greek.test(ch)) return "greek";
5225
+ if (rx.common.test(ch)) return "common";
5226
+ return "other";
5227
+ }
5228
+ function read(ch, rx) {
5229
+ const code = ch.codePointAt(0) ?? 0;
5230
+ if (code < 128) {
5231
+ if (ch === ".") return { kind: "dot", script: "common" };
5232
+ if (ch === "-" || code >= 48 && code <= 57) return { kind: "word", script: "common" };
5233
+ if (code >= 97 && code <= 122) return { kind: "word", script: "latin" };
5234
+ return BREAK;
5235
+ }
5236
+ const known = seen.get(ch);
5237
+ if (known) return known;
5238
+ let out = BREAK;
5239
+ if (DOT_LETTERS.has(ch) || rx.modifier.test(ch)) out = { kind: "join", script: "common" };
5240
+ else if (rx.letter.test(ch)) out = { kind: "word", script: scriptOf(ch, rx) };
5241
+ else if (rx.digit.test(ch)) out = { kind: "join", script: "common" };
5242
+ else if (rx.number.test(ch)) out = { kind: "word", script: "common" };
5243
+ else if (rx.notAJoiner.test(ch)) out = BREAK;
5244
+ else if (rx.punctOrSymbol.test(ch)) out = { kind: "join", script: "common" };
5245
+ if (seen.size < 4096) seen.set(ch, out);
5246
+ return out;
5247
+ }
5248
+ function shapeOf(checked, rx) {
5249
+ const tokens = [];
5250
+ let mixed = false;
5251
+ let run = "";
5252
+ let letters = 0;
5253
+ let noSpaceLetters = 0;
5254
+ let piece = /* @__PURE__ */ new Set();
5255
+ const endPiece = () => {
5256
+ piece.delete("nospace");
5257
+ piece.delete("common");
5258
+ if (piece.size > 1) mixed = true;
5259
+ piece = /* @__PURE__ */ new Set();
5260
+ };
5261
+ const endRun = () => {
5262
+ if (!run) return;
5263
+ endPiece();
5264
+ if (/[^-]/.test(run)) {
5265
+ tokens.push({
5266
+ kind: "word",
5267
+ text: run,
5268
+ noSpace: letters > 0 && noSpaceLetters === letters,
5269
+ hasLetter: letters > 0
5270
+ });
5271
+ } else {
5272
+ tokens.push({ kind: "break", text: run, noSpace: false, hasLetter: false });
5273
+ }
5274
+ run = "";
5275
+ letters = 0;
5276
+ noSpaceLetters = 0;
5277
+ };
5278
+ for (const ch of checked) {
5279
+ const c = read(ch, rx);
5280
+ if (c.kind === "word") {
5281
+ run += ch;
5282
+ if (ch === "-") endPiece();
5283
+ else if (c.script !== "common") {
5284
+ letters++;
5285
+ if (c.script === "nospace") noSpaceLetters++;
5286
+ piece.add(c.script);
5287
+ }
5288
+ continue;
5289
+ }
5290
+ endRun();
5291
+ tokens.push({ kind: c.kind, text: ch, noSpace: false, hasLetter: false });
5292
+ }
5293
+ endRun();
5294
+ return { tokens, mixed };
5295
+ }
5296
+ function hostOf(labels, rx, asAddress) {
5297
+ const n = labels.length;
5298
+ if (n === 4 && labels.every((l) => /^\d{1,3}$/.test(l))) return labels.join(".");
5299
+ let end = n;
5300
+ if (!asAddress) {
5301
+ let file = false;
5302
+ while (end > 1 && FILE_ENDINGS.has(labels[end - 1] ?? "")) {
5303
+ end--;
5304
+ file = true;
5305
+ }
5306
+ while (file && end > 1 && FILE_MIDDLES.has(labels[end - 1] ?? "")) end--;
5307
+ }
5308
+ for (let i = end - 1; i >= 1; i--) {
5309
+ const ending = (labels[i] ?? "").split("-", 1)[0] ?? "";
5310
+ if (!rx.tld.test(ending)) continue;
5311
+ const host = [...labels.slice(0, i), ending].join(".");
5312
+ return KNOWN_NAMES.has(host) ? null : host;
5313
+ }
5314
+ return null;
5315
+ }
5316
+ function hostsNamedIn(text) {
5317
+ const rx = patterns();
5318
+ if (!rx) return [""];
5319
+ const checked = foldPreviewText(text).replace(rx.anyMark, "").toLowerCase();
5320
+ const out = /* @__PURE__ */ new Set();
5321
+ const { tokens, mixed } = shapeOf(checked, rx);
5322
+ if (mixed) out.add("");
5323
+ for (let i = 0; i < tokens.length; i++) {
5324
+ const first = tokens[i];
5325
+ if (!first || first.kind !== "word") continue;
5326
+ const labels = [first.text];
5327
+ let anyLetter = first.hasLetter;
5328
+ let j = i;
5329
+ for (; ; ) {
5330
+ const sep = tokens[j + 1];
5331
+ const next = tokens[j + 2];
5332
+ const here = tokens[j];
5333
+ if (!sep || !next || !here || next.kind !== "word") break;
5334
+ if (sep.kind === "break") break;
5335
+ if (sep.kind === "join" && here.noSpace && next.noSpace) break;
5336
+ labels.push(next.text);
5337
+ anyLetter ||= next.hasLetter;
5338
+ j += 2;
5339
+ }
5340
+ const before = tokens[i - 1]?.text;
5341
+ const host = labels.length > 1 ? hostOf(labels, rx, before === "@") : null;
5342
+ if (host) out.add(host);
5343
+ const colon = tokens[j + 1];
5344
+ const port = tokens[j + 2];
5345
+ if (!host && anyLetter && colon?.text === ":" && port && /^\d{1,5}$/.test(port.text)) {
5346
+ out.add(labels.join("."));
5347
+ }
5348
+ i = j;
5349
+ }
5350
+ for (let at = checked.indexOf("://"); at !== -1; at = checked.indexOf("://", at + 3)) {
5351
+ const rest = checked.slice(at + 3, at + 3 + 300);
5352
+ const authority = (rest.split(/[\s/?#]/, 1)[0] ?? "").split("@").pop() ?? "";
5353
+ const literal = /^\[[^\]]*\]/.exec(authority)?.[0];
5354
+ out.add(literal ?? authority.replace(/:\d*$/, ""));
5355
+ }
5356
+ for (const m of checked.matchAll(rx.ipv6Bracket)) out.add(m[0]);
5357
+ for (const m of checked.matchAll(rx.ipv6Bare)) {
5358
+ const literal = m[2] ?? "";
5359
+ const colons = literal.split(":").length - 1;
5360
+ if (/[0-9a-f]/.test(literal) && (literal.includes("::") || colons === 7)) out.add(literal);
5361
+ }
5362
+ return [...out];
5363
+ }
5364
+ function bare(host) {
5365
+ const h = host.toLowerCase();
5366
+ const bracketed = /^\[(.*)\](?::\d+)?$/.exec(h);
5367
+ if (bracketed) return bracketed[1] ?? "";
5368
+ if (h.split(":").length > 2) return h;
5369
+ return h.replace(/:\d+$/, "").replace(/\.$/, "").replace(/^www\./, "");
5370
+ }
5371
+ function sameSite(a, b) {
5372
+ const x = bare(a);
5373
+ const y = bare(b);
5374
+ if (!x || !y) return false;
5375
+ return x === y || x.endsWith(`.${y}`) || y.endsWith(`.${x}`);
5376
+ }
5377
+ function ascii(named) {
5378
+ if (/^[\x00-\x7f]*$/.test(named)) return named;
5379
+ try {
5380
+ return new URL(`https://${named}`).hostname;
5381
+ } catch {
5382
+ return null;
5383
+ }
5384
+ }
5385
+ function namesAnotherSite(text, realHost) {
5386
+ let named;
5387
+ try {
5388
+ named = hostsNamedIn(text);
5389
+ } catch {
5390
+ return true;
5391
+ }
5392
+ for (const host of named) {
5393
+ const form = host === "" ? null : ascii(host);
5394
+ if (form === null || !sameSite(form, realHost)) return true;
5395
+ }
5396
+ return false;
5397
+ }
5398
+ var PREVIEW_HOST_CAP = 40;
5399
+ function previewHost(url) {
5400
+ const host = url.host.replace(/^www\./, "");
5401
+ return host.length > PREVIEW_HOST_CAP ? `\u2026${host.slice(host.length - (PREVIEW_HOST_CAP - 1))}` : host;
5402
+ }
5403
+ function previewWords(url, raw, caps = { title: 160, description: 280 }) {
5404
+ const keep = (value, cap) => {
5405
+ if (typeof value !== "string" || namesAnotherSite(value, url.hostname)) return null;
5406
+ return cleanPreviewText(value, cap);
5407
+ };
5408
+ return {
5409
+ title: keep(raw.title, caps.title),
5410
+ description: keep(raw.description, caps.description)
5411
+ };
5412
+ }
5413
+ var PREVIEW_ICON_MAX_BYTES = 32 * 1024;
5414
+
5415
+ // src/themed/link-preview.ts
5416
+ function httpsOnly(value) {
5417
+ if (!value) return null;
5418
+ try {
5419
+ const url = new URL(value);
5420
+ return url.protocol === "https:" && !url.username && !url.password ? url.href : null;
5421
+ } catch {
5422
+ return null;
5423
+ }
5424
+ }
5425
+ function pictureOnly(image, title) {
5426
+ if (!image || !title) return image;
5427
+ let asked;
5428
+ try {
5429
+ asked = new URL(image).searchParams.get("title");
5430
+ } catch {
5431
+ return image;
5432
+ }
5433
+ if (!asked) return image;
5434
+ const fold = (v) => v.toLowerCase().replace(/\s+/g, " ").trim();
5435
+ const a = fold(asked);
5436
+ const t2 = fold(title);
5437
+ return a.length >= 4 && (t2.includes(a) || a.includes(t2)) ? null : image;
5438
+ }
5439
+ function linkPreviewView(preview) {
5440
+ let url;
5441
+ try {
5442
+ url = new URL(preview.url);
5443
+ } catch {
5444
+ return null;
5445
+ }
5446
+ if (url.protocol !== "http:" && url.protocol !== "https:" || url.username || url.password) {
5447
+ return null;
5448
+ }
5449
+ const { title, description } = previewWords(url, preview);
5450
+ if (!title && !description) return null;
5451
+ return {
5452
+ href: url.href,
5453
+ host: previewHost(url),
5454
+ title,
5455
+ description,
5456
+ image: pictureOnly(httpsOnly(preview.imageUrl), title),
5457
+ favicon: httpsOnly(preview.favicon)
5458
+ };
5459
+ }
5460
+
5461
+ // src/themed/message-bubble.tsx
4800
5462
  import { createPortal } from "react-dom";
4801
- import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
5463
+ import { Fragment as Fragment3, jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
4802
5464
  function MessageBubble({
4803
5465
  text,
4804
5466
  sender,
@@ -4832,23 +5494,23 @@ function MessageBubble({
4832
5494
  bubble.removeEventListener("click", handleClick);
4833
5495
  };
4834
5496
  }, [sender]);
4835
- return /* @__PURE__ */ jsx14("div", { className: `hw-msg ${senderClass}`, children: /* @__PURE__ */ jsxs9("div", { className: "hw-msg-body", children: [
4836
- imageParts.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-msg-images", children: imageParts.map((img, i) => /* @__PURE__ */ jsx14(PreviewableThumbnail, { src: img.url }, i)) }),
4837
- hasText && /* @__PURE__ */ jsxs9("div", { className: "hw-msg-bubble", ref: bubbleRef, children: [
4838
- sender === "ai" || sender === "team" ? /* @__PURE__ */ jsx14(
5497
+ return /* @__PURE__ */ jsx15("div", { className: `hw-msg ${senderClass}`, children: /* @__PURE__ */ jsxs10("div", { className: "hw-msg-body", children: [
5498
+ imageParts.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-msg-images", children: imageParts.map((img, i) => /* @__PURE__ */ jsx15(PreviewableThumbnail, { src: img.url }, i)) }),
5499
+ hasText && /* @__PURE__ */ jsxs10("div", { className: "hw-msg-bubble", ref: bubbleRef, children: [
5500
+ sender === "ai" || sender === "team" ? /* @__PURE__ */ jsx15(
4839
5501
  "span",
4840
5502
  {
4841
5503
  dangerouslySetInnerHTML: {
4842
5504
  __html: renderMarkdown(streaming ? closeDanglingMarkdown(text) : text)
4843
5505
  }
4844
5506
  }
4845
- ) : /* @__PURE__ */ jsx14("span", { dangerouslySetInnerHTML: { __html: linkifyText(text) } }),
4846
- streaming && /* @__PURE__ */ jsx14("span", { className: "hw-streaming-cursor" })
5507
+ ) : /* @__PURE__ */ jsx15("span", { dangerouslySetInnerHTML: { __html: linkifyText(text) } }),
5508
+ streaming && /* @__PURE__ */ jsx15("span", { className: "hw-streaming-cursor" })
4847
5509
  ] }),
4848
- fileParts.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-msg-files", children: fileParts.map((file, i) => /* @__PURE__ */ jsx14(FileCard, { file }, i)) }),
4849
- linkPreviews.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-msg-links", children: linkPreviews.map((lp, i) => /* @__PURE__ */ jsx14(LinkPreviewCard, { preview: lp }, i)) }),
4850
- sources.length > 0 && /* @__PURE__ */ jsx14("div", { className: "hw-sources", children: sources.map(
4851
- (src, i) => src.sourceUrl ? /* @__PURE__ */ jsxs9(
5510
+ fileParts.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-msg-files", children: fileParts.map((file, i) => /* @__PURE__ */ jsx15(FileCard, { file }, i)) }),
5511
+ linkPreviews.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-msg-links", children: linkPreviews.map((lp, i) => /* @__PURE__ */ jsx15(LinkPreviewCard, { preview: lp }, i)) }),
5512
+ sources.length > 0 && /* @__PURE__ */ jsx15("div", { className: "hw-sources", children: sources.map(
5513
+ (src, i) => src.sourceUrl ? /* @__PURE__ */ jsxs10(
4852
5514
  "a",
4853
5515
  {
4854
5516
  href: src.sourceUrl,
@@ -4857,26 +5519,26 @@ function MessageBubble({
4857
5519
  className: "hw-source",
4858
5520
  onClick: (e) => e.stopPropagation(),
4859
5521
  children: [
4860
- /* @__PURE__ */ jsx14("span", { className: "hw-source-n", children: i + 1 }),
4861
- /* @__PURE__ */ jsx14("span", { className: "hw-source-title", children: src.title })
5522
+ /* @__PURE__ */ jsx15("span", { className: "hw-source-n", children: i + 1 }),
5523
+ /* @__PURE__ */ jsx15("span", { className: "hw-source-title", children: src.title })
4862
5524
  ]
4863
5525
  },
4864
5526
  src.knowledgeId
4865
- ) : /* @__PURE__ */ jsxs9("div", { className: "hw-source", children: [
4866
- /* @__PURE__ */ jsx14("span", { className: "hw-source-n", children: i + 1 }),
4867
- /* @__PURE__ */ jsx14("span", { className: "hw-source-title", children: src.title })
5527
+ ) : /* @__PURE__ */ jsxs10("div", { className: "hw-source", children: [
5528
+ /* @__PURE__ */ jsx15("span", { className: "hw-source-n", children: i + 1 }),
5529
+ /* @__PURE__ */ jsx15("span", { className: "hw-source-title", children: src.title })
4868
5530
  ] }, src.knowledgeId)
4869
5531
  ) }),
4870
- metadata?.kind === "quick_replies" && /* @__PURE__ */ jsx14(QuickReplyButtons, { metadata, onTap: onQuickReplyTap }),
5532
+ metadata?.kind === "quick_replies" && /* @__PURE__ */ jsx15(QuickReplyButtons, { metadata, onTap: onQuickReplyTap }),
4871
5533
  (() => {
4872
5534
  const isVisitor = sender === "visitor";
4873
5535
  const lead = isVisitor ? null : senderName ?? null;
4874
5536
  const withLead = (showAuthor ?? !!timestamp) && !!lead;
4875
5537
  if (!withLead && !timestamp) return null;
4876
- return /* @__PURE__ */ jsxs9("div", { className: "hw-msg-meta", children: [
4877
- withLead && /* @__PURE__ */ jsx14("span", { className: "hw-msg-author", children: lead }),
4878
- withLead && timestamp && /* @__PURE__ */ jsx14("span", { className: "hw-msg-meta-sep", children: "\xB7" }),
4879
- timestamp && /* @__PURE__ */ jsx14("span", { className: "hw-msg-time", children: timestamp })
5538
+ return /* @__PURE__ */ jsxs10("div", { className: "hw-msg-meta", children: [
5539
+ withLead && /* @__PURE__ */ jsx15("span", { className: "hw-msg-author", children: lead }),
5540
+ withLead && timestamp && /* @__PURE__ */ jsx15("span", { className: "hw-msg-meta-sep", children: "\xB7" }),
5541
+ timestamp && /* @__PURE__ */ jsx15("span", { className: "hw-msg-time", children: timestamp })
4880
5542
  ] });
4881
5543
  })()
4882
5544
  ] }) });
@@ -4892,14 +5554,14 @@ function QuickReplyButtons({
4892
5554
  setTappedId(optionId);
4893
5555
  onTap?.(optionId, metadata.stepId);
4894
5556
  };
4895
- return /* @__PURE__ */ jsx14(
5557
+ return /* @__PURE__ */ jsx15(
4896
5558
  "div",
4897
5559
  {
4898
5560
  className: "hw-quick-replies",
4899
5561
  "data-cancelled": metadata.cancelled ? "true" : void 0,
4900
5562
  children: metadata.options.map((opt) => {
4901
5563
  const isTapped = tappedId === opt.id;
4902
- return /* @__PURE__ */ jsx14(
5564
+ return /* @__PURE__ */ jsx15(
4903
5565
  "button",
4904
5566
  {
4905
5567
  type: "button",
@@ -4917,9 +5579,17 @@ function QuickReplyButtons({
4917
5579
  }
4918
5580
  function PreviewableThumbnail({ src }) {
4919
5581
  const [hover, setHover] = useState14(false);
5582
+ const [broken, setBroken] = useState14(false);
4920
5583
  const ref = useRef15(null);
4921
- return /* @__PURE__ */ jsxs9(Fragment3, { children: [
4922
- /* @__PURE__ */ jsx14(
5584
+ if (broken) {
5585
+ const name = imageFileName(src);
5586
+ return /* @__PURE__ */ jsxs10("a", { href: src, target: "_blank", rel: "noopener noreferrer", className: "hw-msg-file", children: [
5587
+ /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx15(FileTypeIcon, { ext: fileExt(name) }) }),
5588
+ /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-info", children: /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-name", children: name }) })
5589
+ ] });
5590
+ }
5591
+ return /* @__PURE__ */ jsxs10(Fragment3, { children: [
5592
+ /* @__PURE__ */ jsx15(
4923
5593
  "a",
4924
5594
  {
4925
5595
  ref,
@@ -4930,10 +5600,10 @@ function PreviewableThumbnail({ src }) {
4930
5600
  "aria-label": t("widget.aria_open_image"),
4931
5601
  onMouseEnter: () => setHover(true),
4932
5602
  onMouseLeave: () => setHover(false),
4933
- children: /* @__PURE__ */ jsx14("img", { src, alt: "", className: "hw-msg-image", loading: "lazy" })
5603
+ children: /* @__PURE__ */ jsx15("img", { src, alt: "", className: "hw-msg-image", loading: "lazy", onError: () => setBroken(true) })
4934
5604
  }
4935
5605
  ),
4936
- hover && /* @__PURE__ */ jsx14(AnchoredPreview, { src, anchorRef: ref, href: src })
5606
+ hover && /* @__PURE__ */ jsx15(AnchoredPreview, { src, anchorRef: ref, href: src })
4937
5607
  ] });
4938
5608
  }
4939
5609
  var PREVIEWABLE_EXTS = /* @__PURE__ */ new Set(["pdf", "csv", "png", "jpg", "jpeg", "gif", "webp", "svg"]);
@@ -4943,8 +5613,8 @@ function FileCard({ file }) {
4943
5613
  const ext = file.fileName.split(".").pop()?.toLowerCase() ?? "";
4944
5614
  const isPreviewable = PREVIEWABLE_EXTS.has(ext);
4945
5615
  const isImage = file.mimeType.startsWith("image/");
4946
- return /* @__PURE__ */ jsxs9(Fragment3, { children: [
4947
- /* @__PURE__ */ jsxs9(
5616
+ return /* @__PURE__ */ jsxs10(Fragment3, { children: [
5617
+ /* @__PURE__ */ jsxs10(
4948
5618
  "a",
4949
5619
  {
4950
5620
  ref,
@@ -4955,15 +5625,15 @@ function FileCard({ file }) {
4955
5625
  onMouseEnter: () => isPreviewable && setHover(true),
4956
5626
  onMouseLeave: () => setHover(false),
4957
5627
  children: [
4958
- /* @__PURE__ */ jsx14("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx14(FileTypeIcon, { ext }) }),
4959
- /* @__PURE__ */ jsxs9("span", { className: "hw-msg-file-info", children: [
4960
- /* @__PURE__ */ jsx14("span", { className: "hw-msg-file-name", children: file.fileName }),
4961
- /* @__PURE__ */ jsx14("span", { className: "hw-msg-file-size", children: formatFileSize(file.fileSize) })
5628
+ /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-icon", children: /* @__PURE__ */ jsx15(FileTypeIcon, { ext }) }),
5629
+ /* @__PURE__ */ jsxs10("span", { className: "hw-msg-file-info", children: [
5630
+ /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-name", children: file.fileName }),
5631
+ /* @__PURE__ */ jsx15("span", { className: "hw-msg-file-size", children: formatFileSize(file.fileSize) })
4962
5632
  ] })
4963
5633
  ]
4964
5634
  }
4965
5635
  ),
4966
- hover && isPreviewable && (isImage ? /* @__PURE__ */ jsx14(AnchoredPreview, { src: file.url, anchorRef: ref, href: file.url }) : /* @__PURE__ */ jsx14(AnchoredDocPreview, { fileName: file.fileName, ext, anchorRef: ref, href: file.url }))
5636
+ hover && isPreviewable && (isImage ? /* @__PURE__ */ jsx15(AnchoredPreview, { src: file.url, anchorRef: ref, href: file.url }) : /* @__PURE__ */ jsx15(AnchoredDocPreview, { fileName: file.fileName, ext, anchorRef: ref, href: file.url }))
4967
5637
  ] });
4968
5638
  }
4969
5639
  function AnchoredPreview({
@@ -4997,7 +5667,7 @@ function AnchoredPreview({
4997
5667
  };
4998
5668
  if (!portalTarget) return null;
4999
5669
  return createPortal(
5000
- /* @__PURE__ */ jsx14("div", { className: "hw-hover-preview", style, onClick: handleClick, children: /* @__PURE__ */ jsx14("img", { src, alt: "", className: "hw-hover-preview-img" }) }),
5670
+ /* @__PURE__ */ jsx15("div", { className: "hw-hover-preview", style, onClick: handleClick, children: /* @__PURE__ */ jsx15("img", { src, alt: "", className: "hw-hover-preview-img" }) }),
5001
5671
  portalTarget
5002
5672
  );
5003
5673
  }
@@ -5028,17 +5698,17 @@ function AnchoredDocPreview({
5028
5698
  }, [anchorRef]);
5029
5699
  if (!portalTarget) return null;
5030
5700
  return createPortal(
5031
- /* @__PURE__ */ jsxs9(
5701
+ /* @__PURE__ */ jsxs10(
5032
5702
  "div",
5033
5703
  {
5034
5704
  className: "hw-hover-preview hw-hover-preview--doc",
5035
5705
  style,
5036
5706
  onClick: () => window.open(href, "_blank", "noopener,noreferrer"),
5037
5707
  children: [
5038
- /* @__PURE__ */ jsx14("div", { className: "hw-hover-preview-doc-icon", children: /* @__PURE__ */ jsx14(FileTypeIcon, { ext }) }),
5039
- /* @__PURE__ */ jsxs9("div", { className: "hw-hover-preview-doc-info", children: [
5040
- /* @__PURE__ */ jsx14("span", { className: "hw-hover-preview-doc-name", children: fileName }),
5041
- /* @__PURE__ */ jsx14("span", { className: "hw-hover-preview-doc-hint", children: t("widget.click_to_open") })
5708
+ /* @__PURE__ */ jsx15("div", { className: "hw-hover-preview-doc-icon", children: /* @__PURE__ */ jsx15(FileTypeIcon, { ext }) }),
5709
+ /* @__PURE__ */ jsxs10("div", { className: "hw-hover-preview-doc-info", children: [
5710
+ /* @__PURE__ */ jsx15("span", { className: "hw-hover-preview-doc-name", children: fileName }),
5711
+ /* @__PURE__ */ jsx15("span", { className: "hw-hover-preview-doc-hint", children: t("widget.click_to_open") })
5042
5712
  ] })
5043
5713
  ]
5044
5714
  }
@@ -5063,7 +5733,7 @@ var FILE_TYPE_COLORS = {
5063
5733
  };
5064
5734
  function FileTypeIcon({ ext }) {
5065
5735
  const color = FILE_TYPE_COLORS[ext] ?? "currentColor";
5066
- return /* @__PURE__ */ jsxs9(
5736
+ return /* @__PURE__ */ jsxs10(
5067
5737
  "svg",
5068
5738
  {
5069
5739
  viewBox: "0 0 24 24",
@@ -5073,60 +5743,60 @@ function FileTypeIcon({ ext }) {
5073
5743
  strokeLinecap: "round",
5074
5744
  strokeLinejoin: "round",
5075
5745
  children: [
5076
- /* @__PURE__ */ jsx14("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
5077
- /* @__PURE__ */ jsx14("polyline", { points: "14 2 14 8 20 8" }),
5078
- ext === "pdf" && /* @__PURE__ */ jsx14("text", { x: "8", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "PDF" }),
5079
- ext === "csv" && /* @__PURE__ */ jsx14("text", { x: "7", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "CSV" })
5746
+ /* @__PURE__ */ jsx15("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
5747
+ /* @__PURE__ */ jsx15("polyline", { points: "14 2 14 8 20 8" }),
5748
+ ext === "pdf" && /* @__PURE__ */ jsx15("text", { x: "8", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "PDF" }),
5749
+ ext === "csv" && /* @__PURE__ */ jsx15("text", { x: "7", y: "18", fontSize: "6", fill: color, stroke: "none", fontWeight: "700", children: "CSV" })
5080
5750
  ]
5081
5751
  }
5082
5752
  );
5083
5753
  }
5084
5754
  function LinkPreviewCard({ preview }) {
5085
- const hostname = (() => {
5086
- try {
5087
- return new URL(preview.url).hostname;
5088
- } catch {
5089
- return preview.url;
5090
- }
5091
- })();
5092
- return /* @__PURE__ */ jsxs9(
5755
+ const view = linkPreviewView(preview);
5756
+ const [imageFailed, setImageFailed] = useState14(false);
5757
+ const [faviconFailed, setFaviconFailed] = useState14(false);
5758
+ if (!view) return null;
5759
+ return /* @__PURE__ */ jsxs10(
5093
5760
  "a",
5094
5761
  {
5095
- href: preview.url,
5762
+ href: view.href,
5096
5763
  target: "_blank",
5097
5764
  rel: "noopener noreferrer",
5098
5765
  className: "hw-link-preview",
5099
5766
  onClick: (e) => e.stopPropagation(),
5100
5767
  children: [
5101
- preview.imageUrl && /* @__PURE__ */ jsx14(
5768
+ view.image && !imageFailed && /* @__PURE__ */ jsx15(
5102
5769
  "img",
5103
5770
  {
5104
- src: preview.imageUrl,
5771
+ src: view.image,
5105
5772
  alt: "",
5106
5773
  className: "hw-link-preview-img",
5107
5774
  loading: "lazy",
5108
- onError: (e) => {
5109
- e.target.style.display = "none";
5110
- }
5775
+ decoding: "async",
5776
+ referrerPolicy: "no-referrer",
5777
+ onError: () => setImageFailed(true)
5111
5778
  }
5112
5779
  ),
5113
- /* @__PURE__ */ jsxs9("div", { className: "hw-link-preview-body", children: [
5114
- preview.favicon && /* @__PURE__ */ jsx14(
5115
- "img",
5116
- {
5117
- src: preview.favicon,
5118
- alt: "",
5119
- className: "hw-link-preview-favicon",
5120
- width: 16,
5121
- height: 16,
5122
- onError: (e) => {
5123
- e.target.style.display = "none";
5780
+ /* @__PURE__ */ jsxs10("div", { className: "hw-link-preview-body", children: [
5781
+ /* @__PURE__ */ jsxs10("div", { className: "hw-link-preview-url", children: [
5782
+ view.favicon && !faviconFailed && /* @__PURE__ */ jsx15(
5783
+ "img",
5784
+ {
5785
+ src: view.favicon,
5786
+ alt: "",
5787
+ className: "hw-link-preview-favicon",
5788
+ width: 14,
5789
+ height: 14,
5790
+ loading: "lazy",
5791
+ decoding: "async",
5792
+ referrerPolicy: "no-referrer",
5793
+ onError: () => setFaviconFailed(true)
5124
5794
  }
5125
- }
5126
- ),
5127
- preview.title && /* @__PURE__ */ jsx14("div", { className: "hw-link-preview-title", children: preview.title }),
5128
- preview.description && /* @__PURE__ */ jsx14("div", { className: "hw-link-preview-desc", children: preview.description.slice(0, 120) }),
5129
- /* @__PURE__ */ jsx14("div", { className: "hw-link-preview-url", children: hostname })
5795
+ ),
5796
+ /* @__PURE__ */ jsx15("span", { className: "hw-link-preview-host", children: view.host })
5797
+ ] }),
5798
+ view.title && /* @__PURE__ */ jsx15("div", { className: "hw-link-preview-title", dir: "auto", children: view.title }),
5799
+ view.description && /* @__PURE__ */ jsx15("div", { className: "hw-link-preview-desc", dir: "auto", children: view.description })
5130
5800
  ] })
5131
5801
  ]
5132
5802
  }
@@ -5135,7 +5805,7 @@ function LinkPreviewCard({ preview }) {
5135
5805
 
5136
5806
  // src/themed/message-list.tsx
5137
5807
  import React, { useEffect as useEffect14, useRef as useRef16 } from "react";
5138
- import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
5808
+ import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
5139
5809
  function parseParts(raw) {
5140
5810
  if (!raw) return null;
5141
5811
  if (Array.isArray(raw)) return raw;
@@ -5236,16 +5906,16 @@ function MessageList({
5236
5906
  return () => observer.disconnect();
5237
5907
  }, [hasMore, onLoadMore, isLoadingMore]);
5238
5908
  if (items.length === 0) {
5239
- return /* @__PURE__ */ jsx15(
5909
+ return /* @__PURE__ */ jsx16(
5240
5910
  "div",
5241
5911
  {
5242
5912
  className: "hw-messages",
5243
5913
  role: "log",
5244
5914
  "aria-label": t("widget.aria_messages"),
5245
5915
  "aria-live": "polite",
5246
- children: /* @__PURE__ */ jsxs10("div", { className: "hw-empty", children: [
5247
- /* @__PURE__ */ jsx15("div", { className: "hw-empty-icon", children: /* @__PURE__ */ jsx15("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.5, children: /* @__PURE__ */ jsx15("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }) }) }),
5248
- /* @__PURE__ */ jsx15("div", { className: "hw-empty-text", children: t("widget.start_a_conversation") })
5916
+ children: /* @__PURE__ */ jsxs11("div", { className: "hw-empty", children: [
5917
+ /* @__PURE__ */ jsx16("div", { className: "hw-empty-icon", children: /* @__PURE__ */ jsx16("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1.5, children: /* @__PURE__ */ jsx16("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }) }) }),
5918
+ /* @__PURE__ */ jsx16("div", { className: "hw-empty-text", children: t("widget.start_a_conversation") })
5249
5919
  ] })
5250
5920
  }
5251
5921
  );
@@ -5255,7 +5925,7 @@ function MessageList({
5255
5925
  const yesterday = /* @__PURE__ */ new Date();
5256
5926
  yesterday.setDate(yesterday.getDate() - 1);
5257
5927
  const yesterdayKey = DATE_KEY_FMT.format(yesterday);
5258
- return /* @__PURE__ */ jsxs10(
5928
+ return /* @__PURE__ */ jsxs11(
5259
5929
  "div",
5260
5930
  {
5261
5931
  ref: containerRef,
@@ -5264,15 +5934,15 @@ function MessageList({
5264
5934
  "aria-label": t("widget.aria_messages"),
5265
5935
  "aria-live": "polite",
5266
5936
  children: [
5267
- /* @__PURE__ */ jsx15("div", { ref: topRef, className: "hw-load-more-trigger", children: isLoadingMore && /* @__PURE__ */ jsxs10("div", { className: "hw-load-more-spinner", children: [
5268
- /* @__PURE__ */ jsx15("div", {}),
5269
- /* @__PURE__ */ jsx15("div", {}),
5270
- /* @__PURE__ */ jsx15("div", {})
5937
+ /* @__PURE__ */ jsx16("div", { ref: topRef, className: "hw-load-more-trigger", children: isLoadingMore && /* @__PURE__ */ jsxs11("div", { className: "hw-load-more-spinner", children: [
5938
+ /* @__PURE__ */ jsx16("div", {}),
5939
+ /* @__PURE__ */ jsx16("div", {}),
5940
+ /* @__PURE__ */ jsx16("div", {})
5271
5941
  ] }) }),
5272
5942
  [
5273
5943
  ...items.map((item) => {
5274
5944
  if (item.type === "event") {
5275
- return /* @__PURE__ */ jsx15(
5945
+ return /* @__PURE__ */ jsx16(
5276
5946
  EventCard,
5277
5947
  {
5278
5948
  text: item.text ?? ""
@@ -5287,16 +5957,16 @@ function MessageList({
5287
5957
  const showDateSep = isNewBucket && dateKey !== todayKey;
5288
5958
  const dateLabel = dateKey === yesterdayKey ? t("widget.yesterday") : displayDateFormatter(getLocale()).format(itemDate);
5289
5959
  const sender = item.visitorId ? "visitor" : item.aiAgentId ? "ai" : "team";
5290
- return /* @__PURE__ */ jsxs10(
5960
+ return /* @__PURE__ */ jsxs11(
5291
5961
  React.Fragment,
5292
5962
  {
5293
5963
  children: [
5294
- showDateSep && /* @__PURE__ */ jsxs10("div", { className: "hw-date-sep", children: [
5295
- /* @__PURE__ */ jsx15("div", { className: "hw-date-sep-line" }),
5296
- /* @__PURE__ */ jsx15("div", { className: "hw-date-sep-text", children: dateLabel }),
5297
- /* @__PURE__ */ jsx15("div", { className: "hw-date-sep-line" })
5964
+ showDateSep && /* @__PURE__ */ jsxs11("div", { className: "hw-date-sep", children: [
5965
+ /* @__PURE__ */ jsx16("div", { className: "hw-date-sep-line" }),
5966
+ /* @__PURE__ */ jsx16("div", { className: "hw-date-sep-text", children: dateLabel }),
5967
+ /* @__PURE__ */ jsx16("div", { className: "hw-date-sep-line" })
5298
5968
  ] }),
5299
- /* @__PURE__ */ jsx15(
5969
+ /* @__PURE__ */ jsx16(
5300
5970
  MessageBubble,
5301
5971
  {
5302
5972
  text: item.text ?? "",
@@ -5328,19 +5998,19 @@ function MessageList({
5328
5998
  its place, .hw-msg replayed hw-msg-appear (styles.css:1326), and the
5329
5999
  answer visibly animated in a second time just as it finished. */
5330
6000
  ...streamingText && activeConversationId ? [
5331
- /* @__PURE__ */ jsxs10(React.Fragment, { children: [
6001
+ /* @__PURE__ */ jsxs11(React.Fragment, { children: [
5332
6002
  null,
5333
- /* @__PURE__ */ jsx15(MessageBubble, { text: streamingText, sender: "ai", parts: null, streaming: true })
6003
+ /* @__PURE__ */ jsx16(MessageBubble, { text: streamingText, sender: "ai", parts: null, streaming: true })
5334
6004
  ] }, streamingKeyFor(activeConversationId))
5335
6005
  ] : []
5336
6006
  ],
5337
6007
  renderAfterMessages,
5338
- (isAiProcessing || isTyping) && !streamingText && /* @__PURE__ */ jsx15("div", { className: "hw-typing", children: /* @__PURE__ */ jsxs10("div", { className: "hw-typing-dots", children: [
5339
- /* @__PURE__ */ jsx15("div", { className: "hw-typing-dot" }),
5340
- /* @__PURE__ */ jsx15("div", { className: "hw-typing-dot" }),
5341
- /* @__PURE__ */ jsx15("div", { className: "hw-typing-dot" })
6008
+ (isAiProcessing || isTyping) && !streamingText && /* @__PURE__ */ jsx16("div", { className: "hw-typing", children: /* @__PURE__ */ jsxs11("div", { className: "hw-typing-dots", children: [
6009
+ /* @__PURE__ */ jsx16("div", { className: "hw-typing-dot" }),
6010
+ /* @__PURE__ */ jsx16("div", { className: "hw-typing-dot" }),
6011
+ /* @__PURE__ */ jsx16("div", { className: "hw-typing-dot" })
5342
6012
  ] }) }),
5343
- /* @__PURE__ */ jsx15("div", { ref: bottomRef })
6013
+ /* @__PURE__ */ jsx16("div", { ref: bottomRef })
5344
6014
  ]
5345
6015
  }
5346
6016
  );
@@ -5358,8 +6028,8 @@ function EventCard({ text }) {
5358
6028
  const data = parseEventData(text);
5359
6029
  if (data) {
5360
6030
  const message = data.action === "joined" ? t("widget.joined") : t("widget.left");
5361
- return /* @__PURE__ */ jsxs10("div", { className: "hw-event hw-event--card", children: [
5362
- /* @__PURE__ */ jsx15("div", { className: "hw-event-avatar", children: data.image ? /* @__PURE__ */ jsx15(
6031
+ return /* @__PURE__ */ jsxs11("div", { className: "hw-event hw-event--card", children: [
6032
+ /* @__PURE__ */ jsx16("div", { className: "hw-event-avatar", children: data.image ? /* @__PURE__ */ jsx16(
5363
6033
  "img",
5364
6034
  {
5365
6035
  src: data.image,
@@ -5367,20 +6037,20 @@ function EventCard({ text }) {
5367
6037
  className: "hw-event-avatar-img",
5368
6038
  referrerPolicy: "no-referrer"
5369
6039
  }
5370
- ) : /* @__PURE__ */ jsx15("span", { children: getInitials(data.name) }) }),
5371
- /* @__PURE__ */ jsxs10("div", { className: "hw-event-body", children: [
5372
- /* @__PURE__ */ jsx15("span", { className: "hw-event-name", children: data.name }),
6040
+ ) : /* @__PURE__ */ jsx16("span", { children: getInitials(data.name) }) }),
6041
+ /* @__PURE__ */ jsxs11("div", { className: "hw-event-body", children: [
6042
+ /* @__PURE__ */ jsx16("span", { className: "hw-event-name", children: data.name }),
5373
6043
  " ",
5374
- /* @__PURE__ */ jsx15("span", { className: "hw-event-action", children: message })
6044
+ /* @__PURE__ */ jsx16("span", { className: "hw-event-action", children: message })
5375
6045
  ] })
5376
6046
  ] });
5377
6047
  }
5378
- return /* @__PURE__ */ jsx15("div", { className: "hw-event", children: /* @__PURE__ */ jsx15("div", { className: "hw-event-text", children: text }) });
6048
+ return /* @__PURE__ */ jsx16("div", { className: "hw-event", children: /* @__PURE__ */ jsx16("div", { className: "hw-event-text", children: text }) });
5379
6049
  }
5380
6050
 
5381
6051
  // src/themed/message-preview.tsx
5382
6052
  import { useEffect as useEffect15, useState as useState15 } from "react";
5383
- import { Fragment as Fragment4, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
6053
+ import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
5384
6054
  function MessagePreview({
5385
6055
  onOpen,
5386
6056
  avatar,
@@ -5437,7 +6107,7 @@ function MessagePreview({
5437
6107
  );
5438
6108
  const qr = preview.quickReplies && preview.quickReplies.options.length > 0 ? preview.quickReplies : null;
5439
6109
  const placementClass = placement === "anchored" ? "hw-preview--anchored " : "";
5440
- return /* @__PURE__ */ jsxs11(
6110
+ return /* @__PURE__ */ jsxs12(
5441
6111
  "div",
5442
6112
  {
5443
6113
  className: `hw-preview ${placementClass}${closing ? "hw-preview--closing" : ""}`,
@@ -5451,17 +6121,17 @@ function MessagePreview({
5451
6121
  role: "button",
5452
6122
  tabIndex: 0,
5453
6123
  children: [
5454
- /* @__PURE__ */ jsxs11("div", { className: "hw-preview-header", children: [
5455
- /* @__PURE__ */ jsx16("div", { className: "hw-preview-avatar", children: senderImage ? /* @__PURE__ */ jsx16("img", { src: senderImage, alt: "", referrerPolicy: "no-referrer" }) : avatar }),
5456
- /* @__PURE__ */ jsx16("div", { className: "hw-preview-name", children: senderName }),
5457
- /* @__PURE__ */ jsx16(
6124
+ /* @__PURE__ */ jsxs12("div", { className: "hw-preview-header", children: [
6125
+ /* @__PURE__ */ jsx17("div", { className: "hw-preview-avatar", children: senderImage ? /* @__PURE__ */ jsx17("img", { src: senderImage, alt: "", referrerPolicy: "no-referrer" }) : avatar }),
6126
+ /* @__PURE__ */ jsx17("div", { className: "hw-preview-name", children: senderName }),
6127
+ /* @__PURE__ */ jsx17(
5458
6128
  "button",
5459
6129
  {
5460
6130
  type: "button",
5461
6131
  className: "hw-preview-close",
5462
6132
  onClick: handleClose,
5463
6133
  "aria-label": t("widget.aria_dismiss"),
5464
- children: /* @__PURE__ */ jsx16(XIcon, { size: 20 })
6134
+ children: /* @__PURE__ */ jsx17(XIcon, { size: 20 })
5465
6135
  }
5466
6136
  )
5467
6137
  ] }),
@@ -5470,11 +6140,11 @@ function MessagePreview({
5470
6140
  consecutive messages, so two identical ones would already be a bug
5471
6141
  upstream, and an index key hands React the wrong bubble to reuse the
5472
6142
  moment a new message lands mid-animation. */
5473
- /* @__PURE__ */ jsx16("div", { className: "hw-preview-body", children: truncatePreviewBody(m.text) }, m.text)
6143
+ /* @__PURE__ */ jsx17("div", { className: "hw-preview-body", children: truncatePreviewBody(m.text) }, m.text)
5474
6144
  )),
5475
- qr && /* @__PURE__ */ jsxs11(Fragment4, { children: [
5476
- qr.prompt && /* @__PURE__ */ jsx16("div", { className: "hw-preview-body", children: qr.prompt }),
5477
- /* @__PURE__ */ jsx16("div", { className: "hw-preview-quick-replies hw-quick-replies", children: qr.options.map((opt) => /* @__PURE__ */ jsx16(
6145
+ qr && /* @__PURE__ */ jsxs12(Fragment4, { children: [
6146
+ qr.prompt && /* @__PURE__ */ jsx17("div", { className: "hw-preview-body", children: qr.prompt }),
6147
+ /* @__PURE__ */ jsx17("div", { className: "hw-preview-quick-replies hw-quick-replies", children: qr.options.map((opt) => /* @__PURE__ */ jsx17(
5478
6148
  "button",
5479
6149
  {
5480
6150
  type: "button",
@@ -5488,14 +6158,92 @@ function MessagePreview({
5488
6158
  opt.id
5489
6159
  )) })
5490
6160
  ] }),
5491
- footer != null && footer !== false && /* @__PURE__ */ jsx16("div", { className: "hw-preview-footer", children: footer })
6161
+ footer != null && footer !== false && /* @__PURE__ */ jsx17("div", { className: "hw-preview-footer", children: footer })
5492
6162
  ]
5493
6163
  }
5494
6164
  );
5495
6165
  }
5496
6166
 
6167
+ // src/themed/resolved-banner.tsx
6168
+ import { useId, useState as useState16 } from "react";
6169
+
6170
+ // src/themed/resolved-rating.ts
6171
+ function asCsatRating(value) {
6172
+ return value === "good" || value === "bad" ? value : null;
6173
+ }
6174
+ async function saveRating(client, store, conversationId, rating) {
6175
+ try {
6176
+ await client.widget.sendCsat.mutate({ conversationId, rating });
6177
+ } catch {
6178
+ return false;
6179
+ }
6180
+ store.setState((s) => ({
6181
+ conversations: s.conversations.map(
6182
+ (c) => c.id === conversationId ? { ...c, csatRating: rating } : c
6183
+ )
6184
+ }));
6185
+ return true;
6186
+ }
6187
+
6188
+ // src/themed/resolved-banner.tsx
6189
+ import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
6190
+ var OPTIONS = [
6191
+ { value: "good", labelKey: "widget.aria_good", Icon: ThumbsUpIcon },
6192
+ { value: "bad", labelKey: "widget.aria_bad", Icon: ThumbsDownIcon }
6193
+ ];
6194
+ function ResolvedBlock({
6195
+ rating,
6196
+ failed = false,
6197
+ onRate
6198
+ }) {
6199
+ const labelId = useId();
6200
+ return /* @__PURE__ */ jsxs13("div", { className: "hw-resolved", children: [
6201
+ /* @__PURE__ */ jsxs13("div", { className: "hw-resolved-status", role: "status", children: [
6202
+ /* @__PURE__ */ jsx18(CheckCircleIcon, { size: 16 }),
6203
+ /* @__PURE__ */ jsx18("span", { children: t("widget.resolved_text") })
6204
+ ] }),
6205
+ /* @__PURE__ */ jsxs13("div", { className: "hw-csat", role: "group", "aria-labelledby": labelId, children: [
6206
+ /* @__PURE__ */ jsx18("span", { className: "hw-csat-label", id: labelId, children: rating ? t("widget.csat_thanks") : t("widget.csat_label") }),
6207
+ /* @__PURE__ */ jsx18("span", { className: "hw-csat-buttons", children: OPTIONS.filter((o) => !rating || o.value === rating).map(({ value, labelKey, Icon }) => /* @__PURE__ */ jsxs13(
6208
+ "button",
6209
+ {
6210
+ type: "button",
6211
+ className: "hw-csat-btn",
6212
+ "aria-pressed": rating === value,
6213
+ "aria-disabled": rating ? true : void 0,
6214
+ onClick: rating ? void 0 : () => onRate(value),
6215
+ children: [
6216
+ /* @__PURE__ */ jsx18(Icon, { size: 14 }),
6217
+ t(labelKey)
6218
+ ]
6219
+ },
6220
+ value
6221
+ )) })
6222
+ ] }),
6223
+ failed && !rating && /* @__PURE__ */ jsx18("div", { className: "hw-csat-error", role: "alert", children: t("widget.csat_error") })
6224
+ ] });
6225
+ }
6226
+ function ResolvedBanner({ conversationId }) {
6227
+ const { client, store } = useWidgetContext();
6228
+ const saved = useWidgetStore(
6229
+ (s) => asCsatRating(s.conversations.find((c) => c.id === conversationId)?.csatRating)
6230
+ );
6231
+ const [pending, setPending] = useState16(null);
6232
+ const [failed, setFailed] = useState16(false);
6233
+ const rate = (rating) => {
6234
+ setPending(rating);
6235
+ setFailed(false);
6236
+ void saveRating(client, store, conversationId, rating).then((ok) => {
6237
+ if (ok) return;
6238
+ setPending(null);
6239
+ setFailed(true);
6240
+ });
6241
+ };
6242
+ return /* @__PURE__ */ jsx18(ResolvedBlock, { rating: saved ?? pending, failed, onRate: rate });
6243
+ }
6244
+
5497
6245
  // src/themed/default-widget.tsx
5498
- import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
6246
+ import { Fragment as Fragment5, jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
5499
6247
  function resolveLabel2(label) {
5500
6248
  if (!label.startsWith("widget.")) return label;
5501
6249
  const resolved = t(label);
@@ -5507,7 +6255,7 @@ var EMPTY_CONTENT_TABS = [];
5507
6255
  var DEFAULT_EN_WELCOME = "Hi there \u{1F44B}\nHow can we help?";
5508
6256
  var DEFAULT_EN_SUBTITLE = "Usually replies in minutes";
5509
6257
  function HelpwayMark({ className }) {
5510
- return /* @__PURE__ */ jsx17(
6258
+ return /* @__PURE__ */ jsx19(
5511
6259
  "svg",
5512
6260
  {
5513
6261
  className,
@@ -5517,7 +6265,7 @@ function HelpwayMark({ className }) {
5517
6265
  fill: "none",
5518
6266
  xmlns: "http://www.w3.org/2000/svg",
5519
6267
  "aria-hidden": "true",
5520
- children: /* @__PURE__ */ jsx17(
6268
+ children: /* @__PURE__ */ jsx19(
5521
6269
  "path",
5522
6270
  {
5523
6271
  d: "M28.7 0H12.8L0 12.8V28.7L12.8 41.5H28.7L41.5 28.7V12.8L28.7 0ZM15 28.9L6.80002 20.7L15 12.5C18.1 9.4 23.2 9.4 26.3 12.5L34.5 20.7L26.3 28.9C23.2 32 18.2 32 15 28.9Z",
@@ -5544,7 +6292,7 @@ function WidgetLogo({
5544
6292
  });
5545
6293
  const logoClass = forceAgent ? "hw-agent-img--logo" : "";
5546
6294
  if (!forceAgent && activeId && assignee?.assigneeImage) {
5547
- return /* @__PURE__ */ jsx17(
6295
+ return /* @__PURE__ */ jsx19(
5548
6296
  "img",
5549
6297
  {
5550
6298
  src: assignee.assigneeImage,
@@ -5555,7 +6303,7 @@ function WidgetLogo({
5555
6303
  );
5556
6304
  }
5557
6305
  if (customAvatar) {
5558
- return /* @__PURE__ */ jsx17(
6306
+ return /* @__PURE__ */ jsx19(
5559
6307
  "span",
5560
6308
  {
5561
6309
  className: `hw-agent-icon hw-agent-custom ${className ?? ""}`,
@@ -5565,7 +6313,7 @@ function WidgetLogo({
5565
6313
  );
5566
6314
  }
5567
6315
  if (agentConfig?.avatarUrl) {
5568
- return /* @__PURE__ */ jsx17(
6316
+ return /* @__PURE__ */ jsx19(
5569
6317
  "img",
5570
6318
  {
5571
6319
  src: agentConfig.avatarUrl,
@@ -5575,7 +6323,7 @@ function WidgetLogo({
5575
6323
  );
5576
6324
  }
5577
6325
  if (agentConfig?.avatarPreset) {
5578
- return /* @__PURE__ */ jsx17(
6326
+ return /* @__PURE__ */ jsx19(
5579
6327
  "div",
5580
6328
  {
5581
6329
  className: `hw-agent-icon ${className ?? ""}`,
@@ -5586,18 +6334,18 @@ function WidgetLogo({
5586
6334
  justifyContent: "center",
5587
6335
  borderRadius: 8
5588
6336
  },
5589
- children: /* @__PURE__ */ jsx17(AgentPresetIcon, { presetId: agentConfig.avatarPreset })
6337
+ children: /* @__PURE__ */ jsx19(AgentPresetIcon, { presetId: agentConfig.avatarPreset })
5590
6338
  }
5591
6339
  );
5592
6340
  }
5593
6341
  if (logoUrl) {
5594
- return /* @__PURE__ */ jsx17("img", { src: logoUrl, alt: "", className: `hw-agent-img hw-agent-img--logo ${className ?? ""}` });
6342
+ return /* @__PURE__ */ jsx19("img", { src: logoUrl, alt: "", className: `hw-agent-img hw-agent-img--logo ${className ?? ""}` });
5595
6343
  }
5596
- return /* @__PURE__ */ jsx17(HelpwayMark, { className });
6344
+ return /* @__PURE__ */ jsx19(HelpwayMark, { className });
5597
6345
  }
5598
6346
  function LauncherIcon({ className }) {
5599
6347
  const agentConfig = useWidgetStore((s) => s.agentConfig);
5600
- const [imgLoaded, setImgLoaded] = useState16(false);
6348
+ const [imgLoaded, setImgLoaded] = useState17(false);
5601
6349
  const imgSrc = agentConfig?.launcherIconUrl ?? null;
5602
6350
  useEffect16(() => {
5603
6351
  if (!imgSrc) return;
@@ -5612,7 +6360,7 @@ function LauncherIcon({ className }) {
5612
6360
  img.onerror = () => setImgLoaded(true);
5613
6361
  }, [imgSrc]);
5614
6362
  if (imgSrc) {
5615
- return /* @__PURE__ */ jsx17(
6363
+ return /* @__PURE__ */ jsx19(
5616
6364
  "img",
5617
6365
  {
5618
6366
  src: imgSrc,
@@ -5622,7 +6370,7 @@ function LauncherIcon({ className }) {
5622
6370
  }
5623
6371
  );
5624
6372
  }
5625
- return /* @__PURE__ */ jsx17(WidgetLogo, { className, forceAgent: true });
6373
+ return /* @__PURE__ */ jsx19(WidgetLogo, { className, forceAgent: true });
5626
6374
  }
5627
6375
  var PRESET_SVG = {
5628
6376
  // Helpway brand mark — octagonal chamfer with stylized "W" inside.
@@ -5681,7 +6429,7 @@ function AgentPresetIcon({ presetId }) {
5681
6429
  const svgContent = PRESET_SVG[presetId] ?? PRESET_SVG.sparkle;
5682
6430
  return (
5683
6431
  // biome-ignore lint: trusted static SVG content from our icon library
5684
- /* @__PURE__ */ jsx17(
6432
+ /* @__PURE__ */ jsx19(
5685
6433
  "svg",
5686
6434
  {
5687
6435
  viewBox: "0 0 24 24",
@@ -5694,8 +6442,8 @@ function AgentPresetIcon({ presetId }) {
5694
6442
  );
5695
6443
  }
5696
6444
  function CloseGlyph({ docked }) {
5697
- if (!docked) return /* @__PURE__ */ jsx17(XIcon, { size: 20 });
5698
- return /* @__PURE__ */ jsx17(
6445
+ if (!docked) return /* @__PURE__ */ jsx19(XIcon, { size: 20 });
6446
+ return /* @__PURE__ */ jsx19(
5699
6447
  "svg",
5700
6448
  {
5701
6449
  width: "20",
@@ -5707,7 +6455,7 @@ function CloseGlyph({ docked }) {
5707
6455
  strokeLinecap: "round",
5708
6456
  strokeLinejoin: "round",
5709
6457
  "aria-hidden": "true",
5710
- children: /* @__PURE__ */ jsx17("path", { d: "M6 9.5 12 15.5 18 9.5" })
6458
+ children: /* @__PURE__ */ jsx19("path", { d: "M6 9.5 12 15.5 18 9.5" })
5711
6459
  }
5712
6460
  );
5713
6461
  }
@@ -5720,7 +6468,15 @@ function DefaultWidget({
5720
6468
  const { isReady, website, agentConfig } = useWidget();
5721
6469
  const customAvatar = useContext2(AgentAvatarContext);
5722
6470
  useI18n();
5723
- const { client, store, hasBootstrapError, wsDisconnected, retryBootstrap } = useWidgetContext();
6471
+ const {
6472
+ client,
6473
+ store,
6474
+ hasBootstrapError,
6475
+ wsDisconnected,
6476
+ wsLost,
6477
+ retryConnection,
6478
+ retryBootstrap
6479
+ } = useWidgetContext();
5724
6480
  const { conversations, create, isCreating, setActiveConversation } = useConversations();
5725
6481
  const activeId = useWidgetStore((s) => s.activeConversationId);
5726
6482
  const isDismissed = useWidgetStore((s) => s.isDismissed);
@@ -5739,13 +6495,13 @@ function DefaultWidget({
5739
6495
  });
5740
6496
  }
5741
6497
  const storeIsOpen = useWidgetStore((s) => s.isOpen);
5742
- const [isClosing, setIsClosing] = useState16(false);
6498
+ const [isClosing, setIsClosing] = useState17(false);
5743
6499
  const isOpen = storeIsOpen || isClosing;
5744
- const [activeTab, setActiveTab] = useState16("home");
5745
- const [subView, setSubView] = useState16(null);
5746
- const [newText, setNewText] = useState16("");
5747
- const [contentDetailSlug, setContentDetailSlug] = useState16(null);
5748
- const [contentCategoryName, setContentCategoryName] = useState16(null);
6500
+ const [activeTab, setActiveTab] = useState17("home");
6501
+ const [subView, setSubView] = useState17(null);
6502
+ const [newText, setNewText] = useState17("");
6503
+ const [contentDetailSlug, setContentDetailSlug] = useState17(null);
6504
+ const [contentCategoryName, setContentCategoryName] = useState17(null);
5749
6505
  const prevActiveIdRef = useRef17(activeId);
5750
6506
  useEffect16(() => {
5751
6507
  if (activeId && activeId !== prevActiveIdRef.current && subView !== "conversation") {
@@ -5853,7 +6609,7 @@ function DefaultWidget({
5853
6609
  pendingDockText.current = null;
5854
6610
  void dockRef.current.submit({ text, conversationId: activeId });
5855
6611
  }, [activeId]);
5856
- const [menuOpen, setMenuOpen] = useState16(false);
6612
+ const [menuOpen, setMenuOpen] = useState17(false);
5857
6613
  useEffect16(() => {
5858
6614
  if (!menuOpen) return;
5859
6615
  const close = () => setMenuOpen(false);
@@ -6065,7 +6821,7 @@ function DefaultWidget({
6065
6821
  const launcherStyle = agentConfig?.launcherStyle ?? "icon";
6066
6822
  const bubbleStyle = agentConfig?.bubbleStyle ?? "rounded";
6067
6823
  const hasUploadedAvatar = !!agentConfig?.avatarUrl;
6068
- return /* @__PURE__ */ jsxs12(
6824
+ return /* @__PURE__ */ jsxs14(
6069
6825
  "div",
6070
6826
  {
6071
6827
  className: "hw-widget",
@@ -6081,7 +6837,7 @@ function DefaultWidget({
6081
6837
  "--hw-window-left": widgetPosition === "bottom-left" ? "0" : "auto"
6082
6838
  },
6083
6839
  children: [
6084
- placement === "docked" && isReady && /* @__PURE__ */ jsx17(
6840
+ placement === "docked" && isReady && /* @__PURE__ */ jsx19(
6085
6841
  DockedBar,
6086
6842
  {
6087
6843
  value: dockComposer.text,
@@ -6096,19 +6852,20 @@ function DefaultWidget({
6096
6852
  onReopen: reopenFromDock,
6097
6853
  sendError: dockComposer.sendError,
6098
6854
  onClearSendError: dockComposer.clearSendError,
6099
- leading: customAvatar
6855
+ leading: customAvatar,
6856
+ placeholder: conversations.find((c) => c.id === activeId)?.status === "resolved" ? t("widget.placeholder_resolved") : void 0
6100
6857
  }
6101
6858
  ),
6102
- isOpen && !isReady && !hasBootstrapError && /* @__PURE__ */ jsx17("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-loading", children: [
6103
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
6104
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } }),
6105
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } })
6859
+ isOpen && !isReady && !hasBootstrapError && /* @__PURE__ */ jsx19("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-loading", children: [
6860
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
6861
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } }),
6862
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } })
6106
6863
  ] }) }),
6107
- isOpen && hasBootstrapError && /* @__PURE__ */ jsx17("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs12("div", { className: "hw-bootstrap-error", children: [
6108
- /* @__PURE__ */ jsx17("div", { className: "hw-bootstrap-error-text", children: t("widget.error_desc") }),
6109
- /* @__PURE__ */ jsx17("button", { type: "button", className: "hw-bootstrap-error-retry", onClick: retryBootstrap, children: t("widget.retry") })
6864
+ isOpen && hasBootstrapError && /* @__PURE__ */ jsx19("div", { className: `hw-window ${isClosing ? "hw-window--closing" : ""}`, children: /* @__PURE__ */ jsxs14("div", { className: "hw-bootstrap-error", children: [
6865
+ /* @__PURE__ */ jsx19("div", { className: "hw-bootstrap-error-text", children: t("widget.error_desc") }),
6866
+ /* @__PURE__ */ jsx19("button", { type: "button", className: "hw-bootstrap-error-retry", onClick: retryBootstrap, children: t("widget.retry") })
6110
6867
  ] }) }),
6111
- isOpen && isReady && /* @__PURE__ */ jsxs12(
6868
+ isOpen && isReady && /* @__PURE__ */ jsxs14(
6112
6869
  "div",
6113
6870
  {
6114
6871
  ref: windowRef,
@@ -6120,24 +6877,28 @@ function DefaultWidget({
6120
6877
  onTouchMove: handleTouchMove,
6121
6878
  onTouchEnd: handleTouchEnd,
6122
6879
  children: [
6123
- /* @__PURE__ */ jsx17("div", { className: "hw-drag-handle", children: /* @__PURE__ */ jsx17("div", { className: "hw-drag-handle-pill" }) }),
6124
- wsDisconnected && /* @__PURE__ */ jsxs12("div", { className: "hw-disconnect", children: [
6125
- /* @__PURE__ */ jsx17("div", { className: "hw-disconnect-spinner" }),
6126
- t("widget.reconnecting")
6127
- ] }),
6880
+ /* @__PURE__ */ jsx19("div", { className: "hw-drag-handle", children: /* @__PURE__ */ jsx19("div", { className: "hw-drag-handle-pill" }) }),
6881
+ /* @__PURE__ */ jsx19(
6882
+ ConnectionStrip,
6883
+ {
6884
+ reconnecting: wsDisconnected,
6885
+ lost: wsLost,
6886
+ onRetry: retryConnection
6887
+ }
6888
+ ),
6128
6889
  (subView === "content-detail" || subView === "content-category") && (() => {
6129
6890
  const tabId = activeTab.replace("content:", "");
6130
6891
  const contentTab = contentTabs.find((t2) => t2.id === tabId);
6131
6892
  const headerTitle = subView === "content-category" && contentCategoryName ? contentCategoryName : contentTab?.label ? resolveLabel2(contentTab.label) : t("widget.content");
6132
- return /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--centered", children: [
6133
- /* @__PURE__ */ jsx17(
6893
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--centered", children: [
6894
+ /* @__PURE__ */ jsx19(
6134
6895
  "button",
6135
6896
  {
6136
6897
  type: "button",
6137
6898
  className: "hw-header-back",
6138
6899
  onClick: goBack,
6139
6900
  "aria-label": t("widget.aria_back"),
6140
- children: /* @__PURE__ */ jsx17(
6901
+ children: /* @__PURE__ */ jsx19(
6141
6902
  "svg",
6142
6903
  {
6143
6904
  viewBox: "0 0 24 24",
@@ -6146,33 +6907,33 @@ function DefaultWidget({
6146
6907
  strokeWidth: 2,
6147
6908
  strokeLinecap: "round",
6148
6909
  strokeLinejoin: "round",
6149
- children: /* @__PURE__ */ jsx17("path", { d: "M15 18l-6-6 6-6" })
6910
+ children: /* @__PURE__ */ jsx19("path", { d: "M15 18l-6-6 6-6" })
6150
6911
  }
6151
6912
  )
6152
6913
  }
6153
6914
  ),
6154
- /* @__PURE__ */ jsx17("div", { className: "hw-header-title", children: headerTitle }),
6155
- /* @__PURE__ */ jsx17(
6915
+ /* @__PURE__ */ jsx19("div", { className: "hw-header-title", children: headerTitle }),
6916
+ /* @__PURE__ */ jsx19(
6156
6917
  "button",
6157
6918
  {
6158
6919
  type: "button",
6159
6920
  className: "hw-header-close",
6160
6921
  onClick: handleClose,
6161
6922
  "aria-label": t("widget.aria_close"),
6162
- children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
6923
+ children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
6163
6924
  }
6164
6925
  )
6165
6926
  ] });
6166
6927
  })(),
6167
- subView !== null && subView !== "content-detail" && subView !== "content-category" && /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--sub", children: [
6168
- /* @__PURE__ */ jsx17(
6928
+ subView !== null && subView !== "content-detail" && subView !== "content-category" && /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--sub", children: [
6929
+ /* @__PURE__ */ jsx19(
6169
6930
  "button",
6170
6931
  {
6171
6932
  type: "button",
6172
6933
  className: "hw-header-back",
6173
6934
  onClick: goBack,
6174
6935
  "aria-label": t("widget.aria_back"),
6175
- children: /* @__PURE__ */ jsx17(
6936
+ children: /* @__PURE__ */ jsx19(
6176
6937
  "svg",
6177
6938
  {
6178
6939
  viewBox: "0 0 24 24",
@@ -6181,17 +6942,17 @@ function DefaultWidget({
6181
6942
  strokeWidth: 2,
6182
6943
  strokeLinecap: "round",
6183
6944
  strokeLinejoin: "round",
6184
- children: /* @__PURE__ */ jsx17("path", { d: "M15 18l-6-6 6-6" })
6945
+ children: /* @__PURE__ */ jsx19("path", { d: "M15 18l-6-6 6-6" })
6185
6946
  }
6186
6947
  )
6187
6948
  }
6188
6949
  ),
6189
- /* @__PURE__ */ jsxs12("div", { className: "hw-header-identity", children: [
6190
- /* @__PURE__ */ jsx17(
6950
+ /* @__PURE__ */ jsxs14("div", { className: "hw-header-identity", children: [
6951
+ /* @__PURE__ */ jsx19(
6191
6952
  "div",
6192
6953
  {
6193
6954
  className: `hw-header-bot-icon${hasTeamAgent ? " hw-header-bot-icon--team" : ""}`,
6194
- children: hasTeamAgent && humanImage ? /* @__PURE__ */ jsx17(
6955
+ children: hasTeamAgent && humanImage ? /* @__PURE__ */ jsx19(
6195
6956
  "img",
6196
6957
  {
6197
6958
  src: humanImage,
@@ -6199,16 +6960,16 @@ function DefaultWidget({
6199
6960
  className: "hw-header-agent-img",
6200
6961
  referrerPolicy: "no-referrer"
6201
6962
  }
6202
- ) : hasTeamAgent ? /* @__PURE__ */ jsx17("span", { className: "hw-header-agent-initials", children: headerName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx17(WidgetLogo, {})
6963
+ ) : hasTeamAgent ? /* @__PURE__ */ jsx19("span", { className: "hw-header-agent-initials", children: headerName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx19(WidgetLogo, {})
6203
6964
  }
6204
6965
  ),
6205
- /* @__PURE__ */ jsxs12("div", { className: "hw-header-info", children: [
6206
- /* @__PURE__ */ jsx17("div", { className: "hw-header-name", children: headerName }),
6207
- /* @__PURE__ */ jsx17("div", { className: "hw-header-status", children: subtitleText })
6966
+ /* @__PURE__ */ jsxs14("div", { className: "hw-header-info", children: [
6967
+ /* @__PURE__ */ jsx19("div", { className: "hw-header-name", children: headerName }),
6968
+ /* @__PURE__ */ jsx19("div", { className: "hw-header-status", children: subtitleText })
6208
6969
  ] })
6209
6970
  ] }),
6210
- /* @__PURE__ */ jsxs12("div", { className: "hw-header-actions", children: [
6211
- /* @__PURE__ */ jsx17(
6971
+ /* @__PURE__ */ jsxs14("div", { className: "hw-header-actions", children: [
6972
+ /* @__PURE__ */ jsx19(
6212
6973
  "button",
6213
6974
  {
6214
6975
  type: "button",
@@ -6220,21 +6981,21 @@ function DefaultWidget({
6220
6981
  event.stopPropagation();
6221
6982
  setMenuOpen((open) => !open);
6222
6983
  },
6223
- children: /* @__PURE__ */ jsx17(DotsIcon, { size: 18 })
6984
+ children: /* @__PURE__ */ jsx19(DotsIcon, { size: 18 })
6224
6985
  }
6225
6986
  ),
6226
- /* @__PURE__ */ jsx17(
6987
+ /* @__PURE__ */ jsx19(
6227
6988
  "button",
6228
6989
  {
6229
6990
  type: "button",
6230
6991
  className: "hw-header-close",
6231
6992
  onClick: handleClose,
6232
6993
  "aria-label": t("widget.aria_close"),
6233
- children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
6994
+ children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
6234
6995
  }
6235
6996
  ),
6236
- menuOpen && /* @__PURE__ */ jsxs12("div", { className: "hw-header-menu", role: "menu", children: [
6237
- conversations.length > 0 && /* @__PURE__ */ jsx17("div", { className: "hw-header-menu-convs", children: conversations.slice(0, 3).map((conv) => /* @__PURE__ */ jsxs12(
6997
+ menuOpen && /* @__PURE__ */ jsxs14("div", { className: "hw-header-menu", role: "menu", children: [
6998
+ conversations.length > 0 && /* @__PURE__ */ jsx19("div", { className: "hw-header-menu-convs", children: conversations.slice(0, 3).map((conv) => /* @__PURE__ */ jsxs14(
6238
6999
  "button",
6239
7000
  {
6240
7001
  type: "button",
@@ -6246,16 +7007,16 @@ function DefaultWidget({
6246
7007
  openConversation(conv.id);
6247
7008
  },
6248
7009
  children: [
6249
- /* @__PURE__ */ jsxs12("span", { className: "hw-header-menu-conv-top", children: [
6250
- /* @__PURE__ */ jsx17("span", { className: "hw-header-menu-conv-name", children: conversationIdentity(conv).humanName ?? companyName }),
6251
- conv.lastMessageAt && /* @__PURE__ */ jsx17("span", { className: "hw-header-menu-conv-time", children: formatRelativeTime(conv.lastMessageAt) })
7010
+ /* @__PURE__ */ jsxs14("span", { className: "hw-header-menu-conv-top", children: [
7011
+ /* @__PURE__ */ jsx19("span", { className: "hw-header-menu-conv-name", children: conversationIdentity(conv).humanName ?? companyName }),
7012
+ conv.lastMessageAt && /* @__PURE__ */ jsx19("span", { className: "hw-header-menu-conv-time", children: formatRelativeTime(conv.lastMessageAt) })
6252
7013
  ] }),
6253
- /* @__PURE__ */ jsx17("span", { className: "hw-header-menu-conv-preview", children: conv.lastMessageText ?? t("widget.no_preview") })
7014
+ /* @__PURE__ */ jsx19("span", { className: "hw-header-menu-conv-preview", children: conv.lastMessageText ?? t("widget.no_preview") })
6254
7015
  ]
6255
7016
  },
6256
7017
  conv.id
6257
7018
  )) }),
6258
- /* @__PURE__ */ jsxs12(
7019
+ /* @__PURE__ */ jsxs14(
6259
7020
  "button",
6260
7021
  {
6261
7022
  type: "button",
@@ -6265,7 +7026,7 @@ function DefaultWidget({
6265
7026
  openNewConversation();
6266
7027
  },
6267
7028
  children: [
6268
- /* @__PURE__ */ jsx17(NewChatIcon, { size: 16 }),
7029
+ /* @__PURE__ */ jsx19(NewChatIcon, { size: 16 }),
6269
7030
  t("widget.new_conversation")
6270
7031
  ]
6271
7032
  }
@@ -6273,43 +7034,43 @@ function DefaultWidget({
6273
7034
  ] })
6274
7035
  ] })
6275
7036
  ] }),
6276
- subView === null && activeTab === "home" && /* @__PURE__ */ jsxs12(Fragment5, { children: [
6277
- /* @__PURE__ */ jsxs12("div", { className: "hw-hero", children: [
6278
- /* @__PURE__ */ jsxs12("div", { className: "hw-hero-top", children: [
6279
- /* @__PURE__ */ jsx17("div", { className: "hw-hero-bot-icon", children: /* @__PURE__ */ jsx17(WidgetLogo, {}) }),
6280
- /* @__PURE__ */ jsx17(
7037
+ subView === null && activeTab === "home" && /* @__PURE__ */ jsxs14(Fragment5, { children: [
7038
+ /* @__PURE__ */ jsxs14("div", { className: "hw-hero", children: [
7039
+ /* @__PURE__ */ jsxs14("div", { className: "hw-hero-top", children: [
7040
+ /* @__PURE__ */ jsx19("div", { className: "hw-hero-bot-icon", children: /* @__PURE__ */ jsx19(WidgetLogo, {}) }),
7041
+ /* @__PURE__ */ jsx19(
6281
7042
  "button",
6282
7043
  {
6283
7044
  type: "button",
6284
7045
  className: "hw-hero-close",
6285
7046
  onClick: handleClose,
6286
7047
  "aria-label": t("widget.aria_close"),
6287
- children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
7048
+ children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
6288
7049
  }
6289
7050
  )
6290
7051
  ] }),
6291
- /* @__PURE__ */ jsx17("div", { className: "hw-hero-greeting", children: welcomeMessage.split("\n").map((line, i) => /* @__PURE__ */ jsxs12(
7052
+ /* @__PURE__ */ jsx19("div", { className: "hw-hero-greeting", children: welcomeMessage.split("\n").map((line, i) => /* @__PURE__ */ jsxs14(
6292
7053
  "span",
6293
7054
  {
6294
7055
  className: i === 0 ? "hw-hero-greeting-name" : "hw-hero-greeting-question",
6295
7056
  children: [
6296
- i > 0 && /* @__PURE__ */ jsx17("br", {}),
7057
+ i > 0 && /* @__PURE__ */ jsx19("br", {}),
6297
7058
  line
6298
7059
  ]
6299
7060
  },
6300
7061
  i
6301
7062
  )) }),
6302
- /* @__PURE__ */ jsx17("div", { className: "hw-hero-subtitle", children: subtitleText })
7063
+ /* @__PURE__ */ jsx19("div", { className: "hw-hero-subtitle", children: subtitleText })
6303
7064
  ] }),
6304
- /* @__PURE__ */ jsx17("div", { className: "hw-sheet", children: /* @__PURE__ */ jsxs12("div", { className: "hw-sheet-inner", children: [
6305
- /* @__PURE__ */ jsxs12("button", { type: "button", className: "hw-card", onClick: openNewConversation, children: [
6306
- /* @__PURE__ */ jsxs12("div", { className: "hw-card-body", children: [
6307
- /* @__PURE__ */ jsx17("div", { className: "hw-card-title", children: t("widget.send_us_message") }),
6308
- /* @__PURE__ */ jsx17("div", { className: "hw-card-meta", children: t("widget.reply_time") })
7065
+ /* @__PURE__ */ jsx19("div", { className: "hw-sheet", children: /* @__PURE__ */ jsxs14("div", { className: "hw-sheet-inner", children: [
7066
+ /* @__PURE__ */ jsxs14("button", { type: "button", className: "hw-card", onClick: openNewConversation, children: [
7067
+ /* @__PURE__ */ jsxs14("div", { className: "hw-card-body", children: [
7068
+ /* @__PURE__ */ jsx19("div", { className: "hw-card-title", children: t("widget.send_us_message") }),
7069
+ /* @__PURE__ */ jsx19("div", { className: "hw-card-meta", children: t("widget.reply_time") })
6309
7070
  ] }),
6310
- /* @__PURE__ */ jsx17("div", { className: "hw-card-arrow", children: /* @__PURE__ */ jsx17(SendIcon, {}) })
7071
+ /* @__PURE__ */ jsx19("div", { className: "hw-card-arrow", children: /* @__PURE__ */ jsx19(SendIcon, {}) })
6311
7072
  ] }),
6312
- announcementTabs.length > 0 && /* @__PURE__ */ jsx17(
7073
+ announcementTabs.length > 0 && /* @__PURE__ */ jsx19(
6313
7074
  WhatsNewCard,
6314
7075
  {
6315
7076
  getUnseenEntries,
@@ -6325,7 +7086,7 @@ function DefaultWidget({
6325
7086
  }
6326
7087
  }
6327
7088
  ),
6328
- /* @__PURE__ */ jsx17(
7089
+ /* @__PURE__ */ jsx19(
6329
7090
  HomeView,
6330
7091
  {
6331
7092
  conversations,
@@ -6335,17 +7096,17 @@ function DefaultWidget({
6335
7096
  )
6336
7097
  ] }) })
6337
7098
  ] }),
6338
- subView === null && activeTab === "messages" && /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--centered", children: [
6339
- /* @__PURE__ */ jsx17("div", { className: "hw-header-spacer" }),
6340
- /* @__PURE__ */ jsx17("div", { className: "hw-header-title", children: t("widget.messages") }),
6341
- /* @__PURE__ */ jsx17(
7099
+ subView === null && activeTab === "messages" && /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--centered", children: [
7100
+ /* @__PURE__ */ jsx19("div", { className: "hw-header-spacer" }),
7101
+ /* @__PURE__ */ jsx19("div", { className: "hw-header-title", children: t("widget.messages") }),
7102
+ /* @__PURE__ */ jsx19(
6342
7103
  "button",
6343
7104
  {
6344
7105
  type: "button",
6345
7106
  className: "hw-header-close",
6346
7107
  onClick: handleClose,
6347
7108
  "aria-label": t("widget.aria_close"),
6348
- children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
7109
+ children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
6349
7110
  }
6350
7111
  )
6351
7112
  ] }),
@@ -6353,23 +7114,23 @@ function DefaultWidget({
6353
7114
  const tabId = activeTab.replace("content:", "");
6354
7115
  const contentTab = contentTabs.find((t2) => t2.id === tabId);
6355
7116
  if (!contentTab) return null;
6356
- return /* @__PURE__ */ jsxs12("div", { className: "hw-header hw-header--centered", children: [
6357
- /* @__PURE__ */ jsx17("div", { className: "hw-header-spacer" }),
6358
- /* @__PURE__ */ jsx17("div", { className: "hw-header-title", children: resolveLabel2(contentTab.label) }),
6359
- /* @__PURE__ */ jsx17(
7117
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-header hw-header--centered", children: [
7118
+ /* @__PURE__ */ jsx19("div", { className: "hw-header-spacer" }),
7119
+ /* @__PURE__ */ jsx19("div", { className: "hw-header-title", children: resolveLabel2(contentTab.label) }),
7120
+ /* @__PURE__ */ jsx19(
6360
7121
  "button",
6361
7122
  {
6362
7123
  type: "button",
6363
7124
  className: "hw-header-close",
6364
7125
  onClick: handleClose,
6365
7126
  "aria-label": t("widget.aria_close"),
6366
- children: /* @__PURE__ */ jsx17(CloseGlyph, { docked: placement === "docked" })
7127
+ children: /* @__PURE__ */ jsx19(CloseGlyph, { docked: placement === "docked" })
6367
7128
  }
6368
7129
  )
6369
7130
  ] });
6370
7131
  })(),
6371
- (subView !== null || activeTab !== "home") && /* @__PURE__ */ jsxs12("div", { className: "hw-content", children: [
6372
- subView === null && activeTab === "messages" && /* @__PURE__ */ jsx17(
7132
+ (subView !== null || activeTab !== "home") && /* @__PURE__ */ jsxs14("div", { className: "hw-content", children: [
7133
+ subView === null && activeTab === "messages" && /* @__PURE__ */ jsx19(
6373
7134
  MessagesView,
6374
7135
  {
6375
7136
  conversations,
@@ -6377,7 +7138,7 @@ function DefaultWidget({
6377
7138
  onNewClick: openNewConversation
6378
7139
  }
6379
7140
  ),
6380
- subView === "new" && /* @__PURE__ */ jsx17(
7141
+ subView === "new" && /* @__PURE__ */ jsx19(
6381
7142
  NewConversationView,
6382
7143
  {
6383
7144
  text: newText,
@@ -6387,12 +7148,12 @@ function DefaultWidget({
6387
7148
  welcomeMessage
6388
7149
  }
6389
7150
  ),
6390
- subView === "conversation" && activeId && /* @__PURE__ */ jsx17(ConversationView, { conversationId: activeId, starters: dockSuggestions }),
7151
+ subView === "conversation" && activeId && /* @__PURE__ */ jsx19(ConversationView, { conversationId: activeId, starters: dockSuggestions }),
6391
7152
  activeTab.startsWith("content:") && (() => {
6392
7153
  const tabId = activeTab.replace("content:", "");
6393
7154
  const contentTab = contentTabs.find((t2) => t2.id === tabId);
6394
7155
  if (!contentTab) return null;
6395
- return /* @__PURE__ */ jsx17(
7156
+ return /* @__PURE__ */ jsx19(
6396
7157
  ContentTabView,
6397
7158
  {
6398
7159
  tab: contentTab,
@@ -6412,7 +7173,7 @@ function DefaultWidget({
6412
7173
  );
6413
7174
  })()
6414
7175
  ] }),
6415
- showTabBar && /* @__PURE__ */ jsx17(
7176
+ showTabBar && /* @__PURE__ */ jsx19(
6416
7177
  TabBar,
6417
7178
  {
6418
7179
  activeTab,
@@ -6423,20 +7184,20 @@ function DefaultWidget({
6423
7184
  unseenAnnouncementCount
6424
7185
  }
6425
7186
  ),
6426
- /* @__PURE__ */ jsxs12("div", { className: "hw-powered", children: [
7187
+ /* @__PURE__ */ jsxs14("div", { className: "hw-powered", children: [
6427
7188
  t("widget.powered_by"),
6428
7189
  " ",
6429
- /* @__PURE__ */ jsx17("a", { href: "https://helpway.ai", target: "_blank", rel: "noopener noreferrer", children: "Helpway" })
7190
+ /* @__PURE__ */ jsx19("a", { href: "https://helpway.ai", target: "_blank", rel: "noopener noreferrer", children: "Helpway" })
6430
7191
  ] })
6431
7192
  ]
6432
7193
  }
6433
7194
  ),
6434
- isReady && !isOpen && !isDismissed && !hideLauncher && /* @__PURE__ */ jsxs12("div", { className: "hw-preview-dock", children: [
6435
- /* @__PURE__ */ jsx17(
7195
+ isReady && !isOpen && !isDismissed && !hideLauncher && /* @__PURE__ */ jsxs14("div", { className: "hw-preview-dock", children: [
7196
+ /* @__PURE__ */ jsx19(
6436
7197
  AnnouncementPreviews,
6437
7198
  {
6438
7199
  maxVisible: incomingPreview ? 1 : 2,
6439
- avatar: /* @__PURE__ */ jsx17(WidgetLogo, {}),
7200
+ avatar: /* @__PURE__ */ jsx19(WidgetLogo, {}),
6440
7201
  onOpen: (slug, tabId) => {
6441
7202
  markEntrySeen(slug);
6442
7203
  handleBubbleClick();
@@ -6448,10 +7209,10 @@ function DefaultWidget({
6448
7209
  }
6449
7210
  }
6450
7211
  ),
6451
- /* @__PURE__ */ jsx17(MessagePreview, { onOpen: handleBubbleClick, avatar: /* @__PURE__ */ jsx17(WidgetLogo, {}), autoDismissMs: null })
7212
+ /* @__PURE__ */ jsx19(MessagePreview, { onOpen: handleBubbleClick, avatar: /* @__PURE__ */ jsx19(WidgetLogo, {}), autoDismissMs: null })
6452
7213
  ] }),
6453
- /* @__PURE__ */ jsx17(WidgetDebugOverlay, {}),
6454
- isReady && !isDismissed && (!hideLauncher || isOpen) && /* @__PURE__ */ jsxs12(
7214
+ /* @__PURE__ */ jsx19(WidgetDebugOverlay, {}),
7215
+ isReady && !isDismissed && (!hideLauncher || isOpen) && /* @__PURE__ */ jsxs14(
6455
7216
  "button",
6456
7217
  {
6457
7218
  ref: bubbleRef,
@@ -6468,24 +7229,24 @@ function DefaultWidget({
6468
7229
  "aria-expanded": isOpen,
6469
7230
  "aria-haspopup": "dialog",
6470
7231
  children: [
6471
- /* @__PURE__ */ jsx17(
7232
+ /* @__PURE__ */ jsx19(
6472
7233
  "span",
6473
7234
  {
6474
7235
  className: `hw-bubble-icon hw-bubble-icon--bot ${isOpen ? "hw-bubble-icon--hidden" : ""}`,
6475
- children: /* @__PURE__ */ jsx17(LauncherIcon, {})
7236
+ children: /* @__PURE__ */ jsx19(LauncherIcon, {})
6476
7237
  }
6477
7238
  ),
6478
- /* @__PURE__ */ jsx17(
7239
+ /* @__PURE__ */ jsx19(
6479
7240
  "span",
6480
7241
  {
6481
7242
  className: `hw-bubble-icon hw-bubble-icon--close ${!isOpen ? "hw-bubble-icon--hidden" : ""}`,
6482
- children: /* @__PURE__ */ jsx17(XIcon, { size: 24 })
7243
+ children: /* @__PURE__ */ jsx19(XIcon, { size: 24 })
6483
7244
  }
6484
7245
  ),
6485
- launcherStyle !== "icon" && !isOpen && /* @__PURE__ */ jsx17("span", { className: "hw-bubble-label", children: launcherStyle === "help" ? t("widget.help") : companyName }),
6486
- !isOpen && (totalUnread > 0 || awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsxs12("div", { className: "hw-bubble-badge", children: [
7246
+ launcherStyle !== "icon" && !isOpen && /* @__PURE__ */ jsx19("span", { className: "hw-bubble-label", children: launcherStyle === "help" ? t("widget.help") : companyName }),
7247
+ !isOpen && (totalUnread > 0 || awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsxs14("div", { className: "hw-bubble-badge", children: [
6487
7248
  totalUnread > 0 ? totalUnread : "",
6488
- totalUnread === 0 && (awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsx17("span", { className: "hw-bubble-badge-dot" })
7249
+ totalUnread === 0 && (awaitingReply > 0 || unseenAnnouncementCount > 0) && /* @__PURE__ */ jsx19("span", { className: "hw-bubble-badge-dot" })
6489
7250
  ] })
6490
7251
  ]
6491
7252
  }
@@ -6502,8 +7263,8 @@ function TabBar({
6502
7263
  showMessagesTab = true,
6503
7264
  unseenAnnouncementCount = 0
6504
7265
  }) {
6505
- return /* @__PURE__ */ jsxs12("div", { className: "hw-tabs", role: "tablist", children: [
6506
- /* @__PURE__ */ jsxs12(
7266
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-tabs", role: "tablist", children: [
7267
+ /* @__PURE__ */ jsxs14(
6507
7268
  "button",
6508
7269
  {
6509
7270
  type: "button",
@@ -6512,12 +7273,12 @@ function TabBar({
6512
7273
  role: "tab",
6513
7274
  "aria-selected": activeTab === "home",
6514
7275
  children: [
6515
- /* @__PURE__ */ jsx17(HomeIcon, {}),
6516
- /* @__PURE__ */ jsx17("span", { children: t("widget.home") })
7276
+ /* @__PURE__ */ jsx19(HomeIcon, {}),
7277
+ /* @__PURE__ */ jsx19("span", { children: t("widget.home") })
6517
7278
  ]
6518
7279
  }
6519
7280
  ),
6520
- showMessagesTab && /* @__PURE__ */ jsxs12(
7281
+ showMessagesTab && /* @__PURE__ */ jsxs14(
6521
7282
  "button",
6522
7283
  {
6523
7284
  type: "button",
@@ -6526,15 +7287,15 @@ function TabBar({
6526
7287
  role: "tab",
6527
7288
  "aria-selected": activeTab === "messages",
6528
7289
  children: [
6529
- /* @__PURE__ */ jsxs12("span", { className: "hw-tabs-icon-wrap", children: [
6530
- /* @__PURE__ */ jsx17(MessagesIcon, {}),
6531
- unreadCount > 0 && /* @__PURE__ */ jsx17("span", { className: "hw-tabs-badge", children: unreadCount > 99 ? "99+" : unreadCount })
7290
+ /* @__PURE__ */ jsxs14("span", { className: "hw-tabs-icon-wrap", children: [
7291
+ /* @__PURE__ */ jsx19(MessagesIcon, {}),
7292
+ unreadCount > 0 && /* @__PURE__ */ jsx19("span", { className: "hw-tabs-badge", children: unreadCount > 99 ? "99+" : unreadCount })
6532
7293
  ] }),
6533
- /* @__PURE__ */ jsx17("span", { children: t("widget.messages") })
7294
+ /* @__PURE__ */ jsx19("span", { children: t("widget.messages") })
6534
7295
  ]
6535
7296
  }
6536
7297
  ),
6537
- contentTabs.map((tab) => /* @__PURE__ */ jsxs12(
7298
+ contentTabs.map((tab) => /* @__PURE__ */ jsxs14(
6538
7299
  "button",
6539
7300
  {
6540
7301
  type: "button",
@@ -6543,11 +7304,11 @@ function TabBar({
6543
7304
  role: "tab",
6544
7305
  "aria-selected": activeTab === `content:${tab.id}`,
6545
7306
  children: [
6546
- /* @__PURE__ */ jsxs12("span", { className: "hw-tabs-icon-wrap", children: [
6547
- /* @__PURE__ */ jsx17(ContentTabIconComponent, { icon: tab.icon }),
6548
- tab.isAnnouncements && unseenAnnouncementCount > 0 && /* @__PURE__ */ jsx17("span", { className: "hw-tabs-dot" })
7307
+ /* @__PURE__ */ jsxs14("span", { className: "hw-tabs-icon-wrap", children: [
7308
+ /* @__PURE__ */ jsx19(ContentTabIconComponent, { icon: tab.icon }),
7309
+ tab.isAnnouncements && unseenAnnouncementCount > 0 && /* @__PURE__ */ jsx19("span", { className: "hw-tabs-dot" })
6549
7310
  ] }),
6550
- /* @__PURE__ */ jsx17("span", { children: resolveLabel2(tab.label) })
7311
+ /* @__PURE__ */ jsx19("span", { children: resolveLabel2(tab.label) })
6551
7312
  ]
6552
7313
  },
6553
7314
  tab.id
@@ -6561,9 +7322,9 @@ function HomeView({
6561
7322
  }) {
6562
7323
  const recent = conversations.slice(0, 3);
6563
7324
  if (recent.length === 0) return null;
6564
- return /* @__PURE__ */ jsxs12("div", { className: "hw-recent-card", children: [
6565
- /* @__PURE__ */ jsx17("div", { className: "hw-recent-header", children: t("widget.recent_conversations") }),
6566
- recent.map((conv, i) => /* @__PURE__ */ jsx17(
7325
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-recent-card", children: [
7326
+ /* @__PURE__ */ jsx19("div", { className: "hw-recent-header", children: t("widget.recent_conversations") }),
7327
+ recent.map((conv, i) => /* @__PURE__ */ jsx19(
6567
7328
  ConversationRow,
6568
7329
  {
6569
7330
  conversation: conv,
@@ -6572,7 +7333,7 @@ function HomeView({
6572
7333
  },
6573
7334
  conv.id
6574
7335
  )),
6575
- conversations.length > 3 && /* @__PURE__ */ jsx17("button", { type: "button", className: "hw-recent-see-all", onClick: onMessagesClick, children: t("widget.see_all") })
7336
+ conversations.length > 3 && /* @__PURE__ */ jsx19("button", { type: "button", className: "hw-recent-see-all", onClick: onMessagesClick, children: t("widget.see_all") })
6576
7337
  ] });
6577
7338
  }
6578
7339
  function MessagesView({
@@ -6581,14 +7342,14 @@ function MessagesView({
6581
7342
  onNewClick
6582
7343
  }) {
6583
7344
  if (conversations.length === 0) {
6584
- return /* @__PURE__ */ jsxs12("div", { className: "hw-empty-state", children: [
6585
- /* @__PURE__ */ jsx17("div", { className: "hw-empty-icon-wrap", children: /* @__PURE__ */ jsx17(MessagesIcon, {}) }),
6586
- /* @__PURE__ */ jsx17("div", { className: "hw-empty-title", children: t("widget.no_messages") }),
6587
- /* @__PURE__ */ jsx17("div", { className: "hw-empty-desc", children: t("widget.no_messages_desc") }),
6588
- /* @__PURE__ */ jsx17("button", { type: "button", className: "hw-empty-btn", onClick: onNewClick, children: t("widget.start_conversation") })
7345
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-empty-state", children: [
7346
+ /* @__PURE__ */ jsx19("div", { className: "hw-empty-icon-wrap", children: /* @__PURE__ */ jsx19(MessagesIcon, {}) }),
7347
+ /* @__PURE__ */ jsx19("div", { className: "hw-empty-title", children: t("widget.no_messages") }),
7348
+ /* @__PURE__ */ jsx19("div", { className: "hw-empty-desc", children: t("widget.no_messages_desc") }),
7349
+ /* @__PURE__ */ jsx19("button", { type: "button", className: "hw-empty-btn", onClick: onNewClick, children: t("widget.start_conversation") })
6589
7350
  ] });
6590
7351
  }
6591
- return /* @__PURE__ */ jsx17("div", { className: "hw-msgs-tab", children: conversations.map((conv) => /* @__PURE__ */ jsx17(ConversationCard, { conversation: conv, onSelect }, conv.id)) });
7352
+ return /* @__PURE__ */ jsx19("div", { className: "hw-msgs-tab", children: conversations.map((conv) => /* @__PURE__ */ jsx19(ConversationCard, { conversation: conv, onSelect }, conv.id)) });
6592
7353
  }
6593
7354
  function ConvCardBody({ conv }) {
6594
7355
  const agentName = useWidgetStore((s) => s.agentConfig?.name) ?? "Support";
@@ -6596,8 +7357,8 @@ function ConvCardBody({ conv }) {
6596
7357
  const isTeam = !!humanName;
6597
7358
  const displayName = humanName ?? agentName;
6598
7359
  const preview = conv.lastMessageText ?? t("widget.no_preview");
6599
- return /* @__PURE__ */ jsxs12(Fragment5, { children: [
6600
- /* @__PURE__ */ jsx17("div", { className: `hw-conv-card-avatar${isTeam ? " hw-conv-card-avatar--team" : ""}`, children: isTeam ? humanImage ? /* @__PURE__ */ jsx17(
7360
+ return /* @__PURE__ */ jsxs14(Fragment5, { children: [
7361
+ /* @__PURE__ */ jsx19("div", { className: `hw-conv-card-avatar${isTeam ? " hw-conv-card-avatar--team" : ""}`, children: isTeam ? humanImage ? /* @__PURE__ */ jsx19(
6601
7362
  "img",
6602
7363
  {
6603
7364
  src: humanImage,
@@ -6605,13 +7366,13 @@ function ConvCardBody({ conv }) {
6605
7366
  className: "hw-conv-card-avatar-img",
6606
7367
  referrerPolicy: "no-referrer"
6607
7368
  }
6608
- ) : /* @__PURE__ */ jsx17("span", { className: "hw-conv-card-avatar-initials", children: displayName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx17(WidgetLogo, {}) }),
6609
- /* @__PURE__ */ jsxs12("div", { className: "hw-conv-card-content", children: [
6610
- /* @__PURE__ */ jsxs12("div", { className: "hw-conv-card-top", children: [
6611
- /* @__PURE__ */ jsx17("span", { className: "hw-conv-card-name", children: displayName }),
6612
- conv.lastMessageAt && /* @__PURE__ */ jsx17("span", { className: "hw-conv-card-time", children: formatRelativeTime(conv.lastMessageAt) })
7369
+ ) : /* @__PURE__ */ jsx19("span", { className: "hw-conv-card-avatar-initials", children: displayName.split(" ").map((w) => w[0]).join("").slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx19(WidgetLogo, {}) }),
7370
+ /* @__PURE__ */ jsxs14("div", { className: "hw-conv-card-content", children: [
7371
+ /* @__PURE__ */ jsxs14("div", { className: "hw-conv-card-top", children: [
7372
+ /* @__PURE__ */ jsx19("span", { className: "hw-conv-card-name", children: displayName }),
7373
+ conv.lastMessageAt && /* @__PURE__ */ jsx19("span", { className: "hw-conv-card-time", children: formatRelativeTime(conv.lastMessageAt) })
6613
7374
  ] }),
6614
- /* @__PURE__ */ jsx17("div", { className: "hw-conv-card-preview", children: preview })
7375
+ /* @__PURE__ */ jsx19("div", { className: "hw-conv-card-preview", children: preview })
6615
7376
  ] })
6616
7377
  ] });
6617
7378
  }
@@ -6621,16 +7382,16 @@ function ConversationCard({
6621
7382
  }) {
6622
7383
  const hasUnread = conv.unreadCount > 0;
6623
7384
  const awaiting = !hasUnread && isAwaitingVisitorReply(conv);
6624
- return /* @__PURE__ */ jsxs12(
7385
+ return /* @__PURE__ */ jsxs14(
6625
7386
  "button",
6626
7387
  {
6627
7388
  type: "button",
6628
7389
  className: `hw-conv-card ${hasUnread ? "hw-conv-card--unread" : ""}`,
6629
7390
  onClick: () => onSelect(conv.id),
6630
7391
  children: [
6631
- /* @__PURE__ */ jsx17("div", { className: "hw-conv-card-row", children: /* @__PURE__ */ jsx17(ConvCardBody, { conv }) }),
6632
- hasUnread && /* @__PURE__ */ jsx17("div", { className: "hw-conv-card-badge", children: conv.unreadCount }),
6633
- awaiting && /* @__PURE__ */ jsx17("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
7392
+ /* @__PURE__ */ jsx19("div", { className: "hw-conv-card-row", children: /* @__PURE__ */ jsx19(ConvCardBody, { conv }) }),
7393
+ hasUnread && /* @__PURE__ */ jsx19("div", { className: "hw-conv-card-badge", children: conv.unreadCount }),
7394
+ awaiting && /* @__PURE__ */ jsx19("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
6634
7395
  ]
6635
7396
  }
6636
7397
  );
@@ -6642,16 +7403,16 @@ function ConversationRow({
6642
7403
  }) {
6643
7404
  const hasUnread = conv.unreadCount > 0;
6644
7405
  const awaiting = !hasUnread && isAwaitingVisitorReply(conv);
6645
- return /* @__PURE__ */ jsxs12(
7406
+ return /* @__PURE__ */ jsxs14(
6646
7407
  "button",
6647
7408
  {
6648
7409
  type: "button",
6649
7410
  className: `hw-recent-row ${hasUnread ? "hw-recent-row--unread" : ""} ${isLast ? "hw-recent-row--last" : ""}`,
6650
7411
  onClick: () => onSelect(conv.id),
6651
7412
  children: [
6652
- /* @__PURE__ */ jsx17(ConvCardBody, { conv }),
6653
- hasUnread && /* @__PURE__ */ jsx17("div", { className: "hw-recent-row-badge", children: conv.unreadCount }),
6654
- awaiting && /* @__PURE__ */ jsx17("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
7413
+ /* @__PURE__ */ jsx19(ConvCardBody, { conv }),
7414
+ hasUnread && /* @__PURE__ */ jsx19("div", { className: "hw-recent-row-badge", children: conv.unreadCount }),
7415
+ awaiting && /* @__PURE__ */ jsx19("div", { className: "hw-awaiting", children: t("widget.awaiting_your_reply") })
6655
7416
  ]
6656
7417
  }
6657
7418
  );
@@ -6659,10 +7420,10 @@ function ConversationRow({
6659
7420
  function InlineEmailPrompt({ conversationId }) {
6660
7421
  const { client, store } = useWidgetContext();
6661
7422
  const updateContact = useWidgetStore((s) => s.updateVisitorContact);
6662
- const [email, setEmail] = useState16("");
6663
- const [isSubmitting, setIsSubmitting] = useState16(false);
6664
- const [isSuccess, setIsSuccess] = useState16(false);
6665
- const [hasError, setHasError] = useState16(false);
7423
+ const [email, setEmail] = useState17("");
7424
+ const [isSubmitting, setIsSubmitting] = useState17(false);
7425
+ const [isSuccess, setIsSuccess] = useState17(false);
7426
+ const [hasError, setHasError] = useState17(false);
6666
7427
  const handleSubmit = async () => {
6667
7428
  const trimmed = email.trim();
6668
7429
  if (!trimmed || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(trimmed)) {
@@ -6703,8 +7464,8 @@ function InlineEmailPrompt({ conversationId }) {
6703
7464
  }
6704
7465
  };
6705
7466
  if (isSuccess) {
6706
- return /* @__PURE__ */ jsxs12("div", { className: "hw-email-card hw-email-card--success", children: [
6707
- /* @__PURE__ */ jsx17(
7467
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-email-card hw-email-card--success", children: [
7468
+ /* @__PURE__ */ jsx19(
6708
7469
  "svg",
6709
7470
  {
6710
7471
  width: "15",
@@ -6715,17 +7476,17 @@ function InlineEmailPrompt({ conversationId }) {
6715
7476
  strokeWidth: 2.5,
6716
7477
  strokeLinecap: "round",
6717
7478
  strokeLinejoin: "round",
6718
- children: /* @__PURE__ */ jsx17("polyline", { points: "20 6 9 17 4 12" })
7479
+ children: /* @__PURE__ */ jsx19("polyline", { points: "20 6 9 17 4 12" })
6719
7480
  }
6720
7481
  ),
6721
7482
  t("widget.email_saved")
6722
7483
  ] });
6723
7484
  }
6724
- return /* @__PURE__ */ jsxs12("div", { className: "hw-email-card", children: [
6725
- /* @__PURE__ */ jsx17("p", { className: "hw-email-card-title", children: t("widget.email_title") }),
6726
- /* @__PURE__ */ jsx17("p", { className: "hw-email-card-subtitle", children: t("widget.email_subtitle") }),
6727
- /* @__PURE__ */ jsxs12("div", { className: "hw-email-card-row", children: [
6728
- /* @__PURE__ */ jsx17(
7485
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-email-card", children: [
7486
+ /* @__PURE__ */ jsx19("p", { className: "hw-email-card-title", children: t("widget.email_title") }),
7487
+ /* @__PURE__ */ jsx19("p", { className: "hw-email-card-subtitle", children: t("widget.email_subtitle") }),
7488
+ /* @__PURE__ */ jsxs14("div", { className: "hw-email-card-row", children: [
7489
+ /* @__PURE__ */ jsx19(
6729
7490
  "input",
6730
7491
  {
6731
7492
  type: "email",
@@ -6741,7 +7502,7 @@ function InlineEmailPrompt({ conversationId }) {
6741
7502
  placeholder: t("widget.email_placeholder")
6742
7503
  }
6743
7504
  ),
6744
- /* @__PURE__ */ jsx17(
7505
+ /* @__PURE__ */ jsx19(
6745
7506
  "button",
6746
7507
  {
6747
7508
  type: "button",
@@ -6749,7 +7510,7 @@ function InlineEmailPrompt({ conversationId }) {
6749
7510
  onClick: handleSubmit,
6750
7511
  disabled: isSubmitting || !email.trim(),
6751
7512
  "aria-label": t("widget.email_continue"),
6752
- children: isSubmitting ? /* @__PURE__ */ jsx17(
7513
+ children: isSubmitting ? /* @__PURE__ */ jsx19(
6753
7514
  "svg",
6754
7515
  {
6755
7516
  width: "14",
@@ -6759,7 +7520,7 @@ function InlineEmailPrompt({ conversationId }) {
6759
7520
  stroke: "currentColor",
6760
7521
  strokeWidth: 2,
6761
7522
  "aria-hidden": "true",
6762
- children: /* @__PURE__ */ jsx17("circle", { cx: "12", cy: "12", r: "10", strokeDasharray: "32", strokeDashoffset: "32", children: /* @__PURE__ */ jsx17(
7523
+ children: /* @__PURE__ */ jsx19("circle", { cx: "12", cy: "12", r: "10", strokeDasharray: "32", strokeDashoffset: "32", children: /* @__PURE__ */ jsx19(
6763
7524
  "animate",
6764
7525
  {
6765
7526
  attributeName: "stroke-dashoffset",
@@ -6769,7 +7530,7 @@ function InlineEmailPrompt({ conversationId }) {
6769
7530
  }
6770
7531
  ) })
6771
7532
  }
6772
- ) : /* @__PURE__ */ jsx17(
7533
+ ) : /* @__PURE__ */ jsx19(
6773
7534
  "svg",
6774
7535
  {
6775
7536
  width: "15",
@@ -6781,7 +7542,7 @@ function InlineEmailPrompt({ conversationId }) {
6781
7542
  strokeLinecap: "round",
6782
7543
  strokeLinejoin: "round",
6783
7544
  "aria-hidden": "true",
6784
- children: /* @__PURE__ */ jsx17("path", { d: "M5 12h13M12 5l7 7-7 7" })
7545
+ children: /* @__PURE__ */ jsx19("path", { d: "M5 12h13M12 5l7 7-7 7" })
6785
7546
  }
6786
7547
  )
6787
7548
  }
@@ -6796,9 +7557,9 @@ function NewConversationView({
6796
7557
  isSubmitting,
6797
7558
  welcomeMessage
6798
7559
  }) {
6799
- return /* @__PURE__ */ jsxs12("div", { className: "hw-new", children: [
6800
- /* @__PURE__ */ jsx17("div", { className: "hw-new-welcome", children: /* @__PURE__ */ jsx17(MessageBubble, { text: welcomeMessage, sender: "ai", parts: null }) }),
6801
- /* @__PURE__ */ jsx17(
7560
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-new", children: [
7561
+ /* @__PURE__ */ jsx19("div", { className: "hw-new-welcome", children: /* @__PURE__ */ jsx19(MessageBubble, { text: welcomeMessage, sender: "ai", parts: null }) }),
7562
+ /* @__PURE__ */ jsx19(
6802
7563
  Composer,
6803
7564
  {
6804
7565
  text,
@@ -6847,27 +7608,27 @@ function ConversationView({
6847
7608
  const needsEmailPostReply = !!agentConfig?.requireVisitorEmail && !hasEmail && visitorMessageCount >= 2 && hasAiReply;
6848
7609
  const needsEmail = needsEmailPostReply || !!emailGateConvId;
6849
7610
  if (isLoading && items.length === 0) {
6850
- return /* @__PURE__ */ jsx17("div", { className: "hw-messages", children: /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-messages", children: [
6851
- /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-msg", children: [
6852
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-avatar" }),
6853
- /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-bubble", children: [
6854
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 140 } }),
6855
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } })
7611
+ return /* @__PURE__ */ jsx19("div", { className: "hw-messages", children: /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-messages", children: [
7612
+ /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-msg", children: [
7613
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-avatar" }),
7614
+ /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-bubble", children: [
7615
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 140 } }),
7616
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 200 } })
6856
7617
  ] })
6857
7618
  ] }),
6858
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton-msg hw-skeleton-msg--right", children: /* @__PURE__ */ jsx17("div", { className: "hw-skeleton-bubble", style: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } }) }) }),
6859
- /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-msg", children: [
6860
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-avatar" }),
6861
- /* @__PURE__ */ jsxs12("div", { className: "hw-skeleton-bubble", children: [
6862
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 180 } }),
6863
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
6864
- /* @__PURE__ */ jsx17("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 80 } })
7619
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton-msg hw-skeleton-msg--right", children: /* @__PURE__ */ jsx19("div", { className: "hw-skeleton-bubble", style: { alignItems: "flex-end" }, children: /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 160 } }) }) }),
7620
+ /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-msg", children: [
7621
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-avatar" }),
7622
+ /* @__PURE__ */ jsxs14("div", { className: "hw-skeleton-bubble", children: [
7623
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 180 } }),
7624
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 120 } }),
7625
+ /* @__PURE__ */ jsx19("div", { className: "hw-skeleton hw-skeleton-line", style: { width: 80 } })
6865
7626
  ] })
6866
7627
  ] })
6867
7628
  ] }) });
6868
7629
  }
6869
- return /* @__PURE__ */ jsxs12(Fragment5, { children: [
6870
- /* @__PURE__ */ jsx17(
7630
+ return /* @__PURE__ */ jsxs14(Fragment5, { children: [
7631
+ /* @__PURE__ */ jsx19(
6871
7632
  MessageList,
6872
7633
  {
6873
7634
  items,
@@ -6877,12 +7638,12 @@ function ConversationView({
6877
7638
  hasMore,
6878
7639
  isLoadingMore: isLoading,
6879
7640
  onLoadMore: loadMore,
6880
- renderAfterMessages: needsEmail || showStarters ? /* @__PURE__ */ jsxs12(Fragment5, { children: [
6881
- needsEmail && /* @__PURE__ */ jsx17(InlineEmailPrompt, { conversationId: emailGateConvId ?? void 0 }),
6882
- showStarters && /* @__PURE__ */ jsx17("div", { className: "hw-starters", children: starters?.map((entry, index) => {
7641
+ renderAfterMessages: needsEmail || showStarters ? /* @__PURE__ */ jsxs14(Fragment5, { children: [
7642
+ needsEmail && /* @__PURE__ */ jsx19(InlineEmailPrompt, { conversationId: emailGateConvId ?? void 0 }),
7643
+ showStarters && /* @__PURE__ */ jsx19("div", { className: "hw-starters", children: starters?.map((entry, index) => {
6883
7644
  const question = typeof entry === "string" ? entry : entry.question;
6884
7645
  const label = typeof entry === "string" ? null : entry.label;
6885
- return /* @__PURE__ */ jsxs12(
7646
+ return /* @__PURE__ */ jsxs14(
6886
7647
  "button",
6887
7648
  {
6888
7649
  type: "button",
@@ -6892,11 +7653,11 @@ function ConversationView({
6892
7653
  void submit({ text: question });
6893
7654
  },
6894
7655
  children: [
6895
- /* @__PURE__ */ jsxs12("span", { className: "hw-starter-text", children: [
6896
- /* @__PURE__ */ jsx17("span", { className: "hw-starter-k", children: label ?? question }),
6897
- label && /* @__PURE__ */ jsx17("span", { className: "hw-starter-q", children: question })
7656
+ /* @__PURE__ */ jsxs14("span", { className: "hw-starter-text", children: [
7657
+ /* @__PURE__ */ jsx19("span", { className: "hw-starter-k", children: label ?? question }),
7658
+ label && /* @__PURE__ */ jsx19("span", { className: "hw-starter-q", children: question })
6898
7659
  ] }),
6899
- /* @__PURE__ */ jsx17(ChevronRightIcon, { size: 14 })
7660
+ /* @__PURE__ */ jsx19(ChevronRightIcon, { size: 14 })
6900
7661
  ]
6901
7662
  },
6902
7663
  question
@@ -6905,10 +7666,10 @@ function ConversationView({
6905
7666
  ] }) : void 0
6906
7667
  }
6907
7668
  ),
6908
- isResolved && /* @__PURE__ */ jsx17(ResolvedBanner, { conversationId }),
6909
- sendError && /* @__PURE__ */ jsxs12("div", { className: "hw-send-error", children: [
7669
+ isResolved && /* @__PURE__ */ jsx19(ResolvedBanner, { conversationId }),
7670
+ sendError && /* @__PURE__ */ jsxs14("div", { className: "hw-send-error", children: [
6910
7671
  sendError,
6911
- /* @__PURE__ */ jsx17(
7672
+ /* @__PURE__ */ jsx19(
6912
7673
  "button",
6913
7674
  {
6914
7675
  type: "button",
@@ -6921,7 +7682,7 @@ function ConversationView({
6921
7682
  }
6922
7683
  )
6923
7684
  ] }),
6924
- /* @__PURE__ */ jsx17(
7685
+ /* @__PURE__ */ jsx19(
6925
7686
  Composer,
6926
7687
  {
6927
7688
  text,
@@ -6932,50 +7693,12 @@ function ConversationView({
6932
7693
  attachments,
6933
7694
  onAddFiles: addFiles,
6934
7695
  onRemoveAttachment: removeAttachment,
6935
- disabled: needsEmail
7696
+ disabled: needsEmail,
7697
+ placeholder: isResolved ? t("widget.placeholder_resolved") : void 0
6936
7698
  }
6937
7699
  )
6938
7700
  ] });
6939
7701
  }
6940
- function ResolvedBanner({ conversationId }) {
6941
- const { client } = useWidgetContext();
6942
- const [csatRating, setCsatRating] = useState16(null);
6943
- const [csatSubmitted, setCsatSubmitted] = useState16(false);
6944
- const handleCsat = (rating) => {
6945
- setCsatRating(rating);
6946
- setCsatSubmitted(true);
6947
- client.widget.sendCsat.mutate({ conversationId, rating }).catch(() => {
6948
- });
6949
- };
6950
- return /* @__PURE__ */ jsxs12("div", { className: "hw-resolved", children: [
6951
- /* @__PURE__ */ jsx17("div", { className: "hw-resolved-text", children: t("widget.resolved_text") }),
6952
- !csatSubmitted ? /* @__PURE__ */ jsxs12("div", { className: "hw-csat", children: [
6953
- /* @__PURE__ */ jsx17("div", { className: "hw-csat-label", children: t("widget.csat_label") }),
6954
- /* @__PURE__ */ jsxs12("div", { className: "hw-csat-buttons", children: [
6955
- /* @__PURE__ */ jsx17(
6956
- "button",
6957
- {
6958
- type: "button",
6959
- className: `hw-csat-btn ${csatRating === "good" ? "hw-csat-btn--selected" : ""}`,
6960
- onClick: () => handleCsat("good"),
6961
- "aria-label": t("widget.aria_good"),
6962
- children: "\u{1F44D}"
6963
- }
6964
- ),
6965
- /* @__PURE__ */ jsx17(
6966
- "button",
6967
- {
6968
- type: "button",
6969
- className: `hw-csat-btn ${csatRating === "bad" ? "hw-csat-btn--selected" : ""}`,
6970
- onClick: () => handleCsat("bad"),
6971
- "aria-label": t("widget.aria_bad"),
6972
- children: "\u{1F44E}"
6973
- }
6974
- )
6975
- ] })
6976
- ] }) : /* @__PURE__ */ jsx17("div", { className: "hw-csat-thanks", children: t("widget.csat_thanks") })
6977
- ] });
6978
- }
6979
7702
  function WhatsNewCard({
6980
7703
  getUnseenEntries,
6981
7704
  announcementTabs,
@@ -6986,34 +7709,34 @@ function WhatsNewCard({
6986
7709
  if (unseen.length === 0) return null;
6987
7710
  const display = unseen.slice(0, 3);
6988
7711
  const badgeFieldMap = new Map(announcementTabs.map((t2) => [t2.id, t2.display?.badgeField]));
6989
- return /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new", children: [
6990
- /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new-header", children: [
6991
- /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-title", children: resolveLabel2("widget.whats_new") }),
6992
- /* @__PURE__ */ jsxs12("button", { type: "button", className: "hw-whats-new-view-all", onClick: onViewAll, children: [
7712
+ return /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new", children: [
7713
+ /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new-header", children: [
7714
+ /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-title", children: resolveLabel2("widget.whats_new") }),
7715
+ /* @__PURE__ */ jsxs14("button", { type: "button", className: "hw-whats-new-view-all", onClick: onViewAll, children: [
6993
7716
  resolveLabel2("widget.view_all"),
6994
7717
  " \u2192"
6995
7718
  ] })
6996
7719
  ] }),
6997
- /* @__PURE__ */ jsx17("div", { className: "hw-whats-new-list", children: display.map((entry) => {
7720
+ /* @__PURE__ */ jsx19("div", { className: "hw-whats-new-list", children: display.map((entry) => {
6998
7721
  const badgeField = badgeFieldMap.get(entry.tabId);
6999
- return /* @__PURE__ */ jsxs12(
7722
+ return /* @__PURE__ */ jsxs14(
7000
7723
  "button",
7001
7724
  {
7002
7725
  type: "button",
7003
7726
  className: "hw-whats-new-item",
7004
7727
  onClick: () => onSelect(entry.slug, entry.tabId),
7005
7728
  children: [
7006
- badgeField && entry.customFields[badgeField] && /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new-item-top", children: [
7007
- /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-badge", children: entry.customFields[badgeField] }),
7008
- entry.publishedAt && /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-time", children: formatRelativeTime(entry.publishedAt) })
7729
+ badgeField && entry.customFields[badgeField] && /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new-item-top", children: [
7730
+ /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-badge", children: entry.customFields[badgeField] }),
7731
+ entry.publishedAt && /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-time", children: formatRelativeTime(entry.publishedAt) })
7009
7732
  ] }),
7010
- /* @__PURE__ */ jsxs12("div", { className: "hw-whats-new-item-title", children: [
7733
+ /* @__PURE__ */ jsxs14("div", { className: "hw-whats-new-item-title", children: [
7011
7734
  entry.title,
7012
- !badgeField && entry.publishedAt && /* @__PURE__ */ jsx17("span", { className: "hw-whats-new-time-inline", children: formatRelativeTime(entry.publishedAt) })
7735
+ !badgeField && entry.publishedAt && /* @__PURE__ */ jsx19("span", { className: "hw-whats-new-time-inline", children: formatRelativeTime(entry.publishedAt) })
7013
7736
  ] }),
7014
7737
  entry.body && (() => {
7015
7738
  const clean = stripMarkdown(entry.body);
7016
- return /* @__PURE__ */ jsx17("div", { className: "hw-whats-new-item-body", children: clean.length > 80 ? `${clean.slice(0, 80)}\u2026` : clean });
7739
+ return /* @__PURE__ */ jsx19("div", { className: "hw-whats-new-item-body", children: clean.length > 80 ? `${clean.slice(0, 80)}\u2026` : clean });
7017
7740
  })()
7018
7741
  ]
7019
7742
  },
@@ -7046,10 +7769,10 @@ function styleInject(css, { insertAt } = {}) {
7046
7769
  }
7047
7770
 
7048
7771
  // src/themed/styles.css
7049
- styleInject(':host {\n all: initial;\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n "Helvetica Neue",\n Arial,\n sans-serif;\n font-size: 14px;\n line-height: 1.5;\n color: #1a1a1a;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget {\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n "Helvetica Neue",\n Arial,\n sans-serif;\n font-size: 14px;\n line-height: 1.5;\n color: #1a1a1a;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget *,\n.hw-widget *::before,\n.hw-widget *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n}\n:where(.hw-widget) {\n --hw-primary: #171717;\n --hw-primary-hover: #2a2a2a;\n --hw-brand: #171717;\n --hw-on-brand: #ffffff;\n --hw-focus-border: #9ca3af;\n --hw-focus-ring: rgba(0, 0, 0, 0.06);\n --hw-accent: #6366f1;\n --hw-bg: #ffffff;\n --hw-bg-subtle: #fafaf9;\n --hw-bg-hover: #f5f5f4;\n --hw-border: #ebe9e5;\n --hw-border-md: #e5e5e5;\n --hw-text: #1c1b19;\n --hw-text-1: #111;\n --hw-text-2: #666;\n --hw-text-3: #8a847c;\n --hw-text-4: #a8a29a;\n --hw-radius: 20px;\n --hw-visitor-bubble-bg: #f5f5f4;\n --hw-visitor-bubble-text: #1a1a1a;\n --hw-font:\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n "Helvetica Neue",\n Arial,\n sans-serif;\n}\n.hw-agent-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-agent-icon {\n width: 100%;\n height: 100%;\n border-radius: inherit;\n}\n.hw-widget :is(.hw-header-bot-icon, .hw-hero-bot-icon, .hw-conv-card-avatar, .hw-event-avatar, .hw-bubble-icon--bot):has(> .hw-agent-custom) {\n border-radius: 50%;\n background: transparent;\n padding: 0;\n}\n.hw-widget :focus-visible {\n outline: 2px solid var(--hw-primary);\n outline-offset: 2px;\n}\n.hw-widget :focus:not(:focus-visible) {\n outline: none;\n}\n.hw-widget {\n position: fixed;\n bottom: 20px;\n right: var(--hw-position-right, 20px);\n left: var(--hw-position-left, auto);\n z-index: 999999;\n font-family: var(--hw-font);\n}\n@keyframes hw-bubble-enter {\n from {\n opacity: 0;\n transform: scale(0.6);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n.hw-bubble {\n width: 48px;\n height: 48px;\n border-radius: 14px;\n background: var(--hw-primary);\n color: white;\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n position: relative;\n overflow: visible;\n animation: hw-bubble-enter 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) both;\n}\n.hw-bubble--rounded {\n border-radius: 14px;\n}\n.hw-bubble--square {\n border-radius: 8px;\n}\n.hw-bubble--pill {\n border-radius: 24px;\n}\n.hw-bubble--launcher-bubble,\n.hw-bubble--launcher-help {\n width: auto;\n padding: 0 16px 0 12px;\n gap: 8px;\n border-radius: 24px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--square,\n.hw-bubble--launcher-help.hw-bubble--square {\n border-radius: 8px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--rounded,\n.hw-bubble--launcher-help.hw-bubble--rounded {\n border-radius: 14px;\n}\n.hw-bubble-label {\n font-size: 14px;\n font-weight: 600;\n white-space: nowrap;\n line-height: 1;\n position: static;\n opacity: 1;\n transform: none;\n}\n.hw-bubble--launcher-bubble .hw-bubble-icon,\n.hw-bubble--launcher-help .hw-bubble-icon {\n position: static;\n}\n.hw-bubble:hover {\n transform: scale(1.05);\n box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);\n}\n.hw-bubble:active {\n transform: scale(0.95);\n}\n.hw-bubble--open {\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\n}\n.hw-bubble:focus-visible {\n outline: 2px solid white;\n outline-offset: 2px;\n}\n.hw-bubble-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;\n}\n.hw-bubble-icon svg:not(.hw-agent-custom svg) {\n width: 22px;\n height: 22px;\n}\n.hw-bubble-icon--hidden {\n transform: scale(0.3) rotate(90deg);\n opacity: 0;\n}\n.hw-bubble-icon--bot {\n}\n.hw-bubble--avatar .hw-bubble-icon--bot {\n width: 100%;\n height: 100%;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img {\n width: 100%;\n height: 100%;\n border-radius: 0;\n}\n.hw-agent-img.hw-agent-img--logo {\n object-fit: contain;\n padding: 10px;\n box-sizing: border-box;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img.hw-agent-img--logo {\n padding: 10px;\n box-sizing: border-box;\n object-fit: contain;\n}\n.hw-bubble-icon--close svg {\n width: 22px;\n height: 22px;\n}\n.hw-bubble-badge {\n position: absolute;\n top: -4px;\n right: -4px;\n min-width: 20px;\n height: 20px;\n border-radius: 10px;\n background: var(--hw-primary);\n color: white;\n font-size: 11px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 5px;\n border: 2px solid white;\n animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n@keyframes hw-badge-pop {\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n}\n.hw-bubble-badge::after {\n content: "";\n position: absolute;\n inset: -2px;\n border-radius: inherit;\n background: var(--hw-primary);\n opacity: 0;\n animation: hw-badge-pulse 2s ease-out infinite;\n}\n@keyframes hw-badge-pulse {\n 0% {\n opacity: 0.5;\n transform: scale(1);\n }\n 100% {\n opacity: 0;\n transform: scale(1.8);\n }\n}\n.hw-window {\n position: absolute;\n bottom: 72px;\n right: var(--hw-window-right, 0);\n left: var(--hw-window-left, auto);\n width: 440px;\n height: 640px;\n background: var(--hw-bg-subtle);\n color: var(--hw-text);\n border-radius: var(--hw-radius);\n box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.04);\n display: flex;\n flex-direction: column;\n overflow: hidden;\n animation: hw-window-open 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);\n transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1), height 280ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.hw-window--reading {\n width: min(720px, calc(100vw - 40px));\n height: min(800px, calc(100vh - 112px));\n}\n:host([data-hw-mode="mobile"]) .hw-window,\n:host([data-hw-mode="mobile"]) .hw-window--reading {\n position: fixed;\n inset: 0;\n width: 100%;\n height: var(--hw-visible-height, 100%);\n border-radius: 0;\n box-shadow: none;\n animation: none;\n}\n:host([data-hw-mode="mobile"]) .hw-hero {\n background-color: color-mix(in srgb, var(--hw-primary) 60%, black);\n}\n:host([data-hw-mode="mobile"]) .hw-bubble {\n display: none;\n}\n.hw-window[data-hw-keyboard] .hw-composer {\n padding-bottom: 8px;\n}\n.hw-window[data-hw-keyboard] .hw-powered {\n display: none;\n}\n@keyframes hw-window-open {\n from {\n opacity: 0;\n transform: translateY(12px) scale(0.96);\n }\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n.hw-window--closing {\n animation: hw-window-close 0.2s ease forwards;\n}\n@keyframes hw-window-close {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n to {\n opacity: 0;\n transform: translateY(8px) scale(0.98);\n }\n}\n.hw-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-window,\n .hw-window--closing,\n .hw-content,\n .hw-msg,\n .hw-bubble,\n .hw-bubble-icon,\n .hw-bubble-badge,\n .hw-bubble-badge::after,\n .hw-typing-dot,\n .hw-loading-dot {\n animation-duration: 0.01ms !important;\n transition-duration: 0.01ms !important;\n }\n}\n.hw-hero {\n flex-shrink: 0;\n background:\n linear-gradient(\n 160deg,\n color-mix(in srgb, var(--hw-primary) 60%, black) 0%,\n var(--hw-primary) 50%,\n color-mix(in srgb, var(--hw-primary) 40%, black) 100%);\n color: white;\n padding: 20px 22px 40px;\n}\n.hw-hero-top {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 16px;\n}\n.hw-hero-close {\n width: 30px;\n height: 30px;\n border-radius: 50%;\n border: none;\n background: rgba(255, 255, 255, 0.1);\n color: rgba(255, 255, 255, 0.6);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background 0.15s, color 0.15s;\n}\n.hw-hero-close:hover {\n background: rgba(255, 255, 255, 0.2);\n color: white;\n}\n.hw-hero-close:active {\n transform: scale(0.92);\n transition:\n transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n background 0.15s,\n color 0.15s;\n}\n.hw-hero-close svg {\n width: 20px;\n height: 20px;\n}\n.hw-hero-bot-icon {\n width: 36px;\n height: 36px;\n flex-shrink: 0;\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 10px;\n}\n.hw-hero-bot-icon > svg,\n.hw-hero-bot-icon > .hw-agent-icon > svg {\n width: 32px;\n height: 32px;\n}\n.hw-hero-bot-icon .hw-agent-img,\n.hw-hero-bot-icon .hw-agent-icon {\n border-radius: inherit;\n overflow: hidden;\n object-fit: contain;\n}\n.hw-hero-greeting {\n font-size: 26px;\n font-weight: 700;\n line-height: 1.15;\n margin-bottom: 6px;\n}\n.hw-hero-greeting-name {\n font-weight: 300;\n}\n.hw-hero-greeting-question {\n font-weight: 700;\n}\n.hw-hero-subtitle {\n font-size: 15px;\n color: rgba(255, 255, 255, 0.5);\n line-height: 1.35;\n}\n.hw-sheet {\n flex: 1;\n overflow-y: auto;\n min-height: 0;\n background: #ffffff;\n border-radius: 20px 20px 0 0;\n margin-top: -24px;\n box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);\n position: relative;\n z-index: 1;\n}\n.hw-sheet-inner {\n padding: 20px 16px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n.hw-header {\n display: flex;\n align-items: center;\n padding: 14px 12px 14px 16px;\n background: var(--hw-primary);\n color: white;\n flex-shrink: 0;\n gap: 10px;\n}\n.hw-header--sub {\n justify-content: space-between;\n background: transparent;\n color: var(--hw-text);\n border-bottom: 0;\n}\n.hw-header-back {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: color 0.15s, background 0.15s;\n flex-shrink: 0;\n}\n.hw-header-back svg {\n width: 18px;\n height: 18px;\n}\n.hw-header-back:hover {\n color: var(--hw-text);\n background: var(--hw-bg-subtle);\n}\n.hw-header-identity {\n display: flex;\n align-items: center;\n gap: 10px;\n flex: 1;\n min-width: 0;\n}\n.hw-header-bot-icon {\n width: 32px;\n height: 32px;\n flex-shrink: 0;\n color: var(--hw-text);\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 9px;\n background: var(--hw-agent-bg, var(--hw-agent-bg-default, transparent));\n}\n.hw-header-bot-icon > svg,\n.hw-header-bot-icon > .hw-agent-icon > svg {\n width: 24px;\n height: 24px;\n}\n.hw-header-bot-icon--team {\n background: var(--hw-brand, #0a0a0a);\n color: var(--hw-on-brand, #fff);\n}\n.hw-header-agent-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: inherit;\n}\n.hw-header-bot-icon .hw-agent-img,\n.hw-header-bot-icon .hw-agent-icon {\n border-radius: inherit;\n overflow: hidden;\n}\n.hw-header-bot-icon .hw-agent-img {\n object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n box-sizing: border-box;\n}\n.hw-widget[data-has-avatar=true] {\n --hw-agent-bg-default: var(--hw-primary);\n --hw-agent-fit-default: contain;\n --hw-agent-pad-default: 6px;\n}\n.hw-header-agent-initials {\n font-size: 11px;\n font-weight: 600;\n line-height: 1;\n}\n.hw-header-info {\n flex: 1;\n min-width: 0;\n}\n.hw-header-name {\n font-size: 15px;\n font-weight: 600;\n line-height: 1.3;\n}\n.hw-header-status {\n font-size: 11px;\n color: var(--hw-text-3);\n line-height: 1.3;\n}\n.hw-header-close {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition:\n background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n flex-shrink: 0;\n}\n.hw-header-close svg {\n width: 20px;\n height: 20px;\n}\n.hw-header-close:hover {\n background: var(--hw-bg-subtle);\n color: var(--hw-text);\n}\n.hw-header-close:active {\n transform: scale(0.92);\n}\n.hw-header--centered {\n justify-content: space-between;\n background: transparent;\n color: var(--hw-text);\n border-bottom: 0;\n}\n.hw-header--centered .hw-header-title {\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n max-width: calc(100% - 88px);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n text-align: center;\n}\n.hw-header-spacer {\n width: 28px;\n flex-shrink: 0;\n}\n.hw-header--messages {\n justify-content: space-between;\n background: transparent;\n color: var(--hw-text);\n border-bottom: 0;\n}\n.hw-header-title {\n font-size: 16px;\n font-weight: 600;\n}\n.hw-header-actions {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n.hw-header-action {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition:\n background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-header-action svg {\n width: 16px;\n height: 16px;\n}\n.hw-header-action:hover {\n background: var(--hw-bg-subtle);\n color: var(--hw-text);\n}\n.hw-header-action:active {\n transform: scale(0.94);\n}\n.hw-card {\n display: flex;\n align-items: center;\n gap: 12px;\n width: 100%;\n padding: 14px 16px;\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n cursor: pointer;\n transition: box-shadow 180ms cubic-bezier(0.23, 1, 0.32, 1), transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n text-align: left;\n color: var(--hw-text);\n font-family: inherit;\n}\n.hw-card:hover {\n box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.05);\n transform: translateY(-1px);\n}\n.hw-card:active {\n transform: translateY(0) scale(0.99);\n transition-duration: 120ms;\n}\n.hw-card-body {\n flex: 1;\n min-width: 0;\n}\n.hw-card-title {\n font-size: 14px;\n font-weight: 600;\n line-height: 1.3;\n color: var(--hw-text);\n}\n.hw-card-meta {\n font-size: 12px;\n color: var(--hw-text-3);\n line-height: 1.3;\n margin-top: 1px;\n}\n.hw-card-arrow {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: var(--hw-primary);\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n.hw-card-arrow svg {\n width: 14px;\n height: 14px;\n}\n.hw-msgs-tab {\n flex: 1;\n overflow-y: auto;\n padding: 12px 16px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.hw-recent-card {\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n overflow: hidden;\n}\n.hw-recent-header {\n font-size: 12px;\n font-weight: 600;\n color: var(--hw-text-2);\n padding: 12px 14px 0;\n}\n.hw-recent-row {\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n padding: 10px 14px;\n border: none;\n border-bottom: 1px solid var(--hw-border);\n background: none;\n cursor: pointer;\n text-align: left;\n font-family: inherit;\n color: var(--hw-text);\n transition: background-color 140ms cubic-bezier(0.23, 1, 0.32, 1), transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n position: relative;\n}\n.hw-recent-row:hover {\n background: rgba(0, 0, 0, 0.03);\n}\n.hw-recent-row:active {\n transform: scale(0.995);\n}\n.hw-recent-row--last {\n border-bottom: none;\n}\n.hw-recent-row .hw-conv-card-avatar {\n width: 32px;\n height: 32px;\n border-radius: 8px;\n}\n.hw-recent-row .hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n width: 18px;\n height: 18px;\n}\n.hw-recent-row .hw-conv-card-name {\n font-size: 13px;\n}\n.hw-recent-row .hw-conv-card-preview {\n font-size: 12px;\n}\n.hw-recent-row--unread .hw-conv-card-name {\n color: var(--hw-text);\n}\n.hw-recent-row--unread .hw-conv-card-time {\n color: var(--hw-primary);\n font-weight: 500;\n}\n.hw-recent-row-badge {\n min-width: 18px;\n height: 18px;\n border-radius: 9px;\n background: var(--hw-primary);\n color: white;\n font-size: 11px;\n font-weight: 600;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 5px;\n flex-shrink: 0;\n font-variant-numeric: tabular-nums;\n}\n.hw-recent-see-all {\n display: block;\n width: 100%;\n padding: 10px 14px;\n text-align: center;\n font-size: 13px;\n font-weight: 500;\n color: var(--hw-text);\n background: none;\n border: none;\n border-top: 1px solid var(--hw-border);\n cursor: pointer;\n font-family: inherit;\n transition: background 0.1s;\n}\n.hw-recent-see-all:hover {\n background: rgba(0, 0, 0, 0.02);\n}\n.hw-conv-card {\n position: relative;\n display: flex;\n flex-direction: column;\n gap: 4px;\n width: 100%;\n padding: 14px 16px;\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n cursor: pointer;\n transition: box-shadow 0.15s, transform 0.1s;\n text-align: left;\n font-family: inherit;\n color: var(--hw-text);\n}\n.hw-conv-card:hover {\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.04);\n}\n.hw-conv-card:active {\n transform: scale(0.99);\n}\n.hw-conv-card-row {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.hw-conv-card-avatar {\n width: 36px;\n height: 36px;\n border-radius: 10px;\n background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-subtle)));\n color: var(--hw-text-3);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n overflow: hidden;\n}\n.hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n width: 20px;\n height: 20px;\n}\n.hw-conv-card-avatar-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-conv-card-avatar .hw-agent-img {\n object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n box-sizing: border-box;\n}\n.hw-conv-card-avatar--team {\n background: var(--hw-brand, #0a0a0a);\n color: var(--hw-on-brand, #fff);\n}\n.hw-conv-card-avatar-initials {\n font-size: 12px;\n font-weight: 600;\n line-height: 1;\n letter-spacing: 0.02em;\n}\n.hw-conv-card-content {\n flex: 1;\n min-width: 0;\n}\n.hw-conv-card-top {\n display: flex;\n align-items: baseline;\n gap: 8px;\n}\n.hw-conv-card-name {\n flex: 1;\n font-size: 14px;\n font-weight: 600;\n color: var(--hw-text);\n}\n.hw-conv-card-time {\n font-size: 11px;\n color: var(--hw-text-3);\n flex-shrink: 0;\n font-variant-numeric: tabular-nums;\n}\n.hw-conv-card-preview {\n font-size: 13px;\n color: var(--hw-text-2);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n line-height: 1.4;\n margin-top: 1px;\n}\n.hw-conv-card--unread .hw-conv-card-name {\n color: var(--hw-text);\n}\n.hw-conv-card--unread .hw-conv-card-time {\n color: var(--hw-primary);\n font-weight: 500;\n}\n.hw-conv-card-badge {\n position: absolute;\n top: 12px;\n right: 12px;\n min-width: 18px;\n height: 18px;\n border-radius: 9px;\n background: var(--hw-primary);\n color: white;\n font-size: 11px;\n font-weight: 600;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 5px;\n font-variant-numeric: tabular-nums;\n}\n.hw-empty-state {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px;\n text-align: center;\n}\n.hw-empty-icon-wrap {\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background: var(--hw-bg-subtle);\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 16px;\n color: var(--hw-text-3);\n}\n.hw-empty-icon-wrap svg {\n width: 24px;\n height: 24px;\n}\n.hw-empty-title {\n font-size: 15px;\n font-weight: 600;\n color: var(--hw-text);\n margin-bottom: 4px;\n}\n.hw-empty-desc {\n font-size: 13px;\n color: var(--hw-text-3);\n margin-bottom: 20px;\n}\n.hw-empty-btn {\n padding: 8px 20px;\n border-radius: 10px;\n background: var(--hw-primary);\n color: white;\n border: none;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n font-family: inherit;\n transition: background 0.15s;\n}\n.hw-empty-btn:hover {\n background: var(--hw-primary-hover);\n}\n.hw-tabs {\n display: flex;\n border-top: 1px solid var(--hw-border);\n flex-shrink: 0;\n background: var(--hw-bg-subtle);\n}\n.hw-tabs-item {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 2px;\n padding: 8px 0;\n border: none;\n background: none;\n cursor: pointer;\n font-family: inherit;\n font-size: 11px;\n font-weight: 500;\n color: var(--hw-text-3);\n transition: color 0.15s;\n}\n.hw-tabs-item svg {\n width: 22px;\n height: 22px;\n overflow: visible;\n}\n.hw-tabs-item--active {\n color: var(--hw-text);\n}\n.hw-tabs-item:hover {\n color: var(--hw-text-2);\n}\n.hw-tabs-item:active {\n transform: scale(0.94);\n transition: transform 0.14s cubic-bezier(0.23, 1, 0.32, 1), color 0.15s;\n}\n.hw-tabs-icon-wrap {\n position: relative;\n display: inline-flex;\n}\n.hw-tabs-badge {\n position: absolute;\n top: -6px;\n right: -10px;\n min-width: 16px;\n height: 16px;\n border-radius: 8px;\n background: var(--hw-primary);\n color: white;\n font-size: 10px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 4px;\n font-variant-numeric: tabular-nums;\n}\n.hw-messages {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 16px 14px 8px;\n background: var(--hw-bg-subtle);\n display: flex;\n flex-direction: column;\n gap: 14px;\n overscroll-behavior: contain;\n min-width: 0;\n scrollbar-color: rgba(0, 0, 0, 0.2) transparent;\n scrollbar-width: thin;\n}\n.hw-messages::-webkit-scrollbar {\n width: 10px;\n height: 10px;\n}\n.hw-messages::-webkit-scrollbar-track {\n background: transparent;\n}\n.hw-messages::-webkit-scrollbar-thumb {\n background: rgba(0, 0, 0, 0.16);\n background-clip: content-box;\n border: 3px solid transparent;\n border-radius: 999px;\n}\n.hw-messages::-webkit-scrollbar-thumb:hover {\n background: rgba(0, 0, 0, 0.28);\n background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages {\n scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.2);\n background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.32);\n background-clip: content-box;\n}\n.hw-empty {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px;\n color: var(--hw-text-3);\n text-align: center;\n}\n.hw-empty-icon {\n width: 40px;\n height: 40px;\n margin-bottom: 12px;\n opacity: 0.3;\n}\n.hw-empty-text {\n font-size: 13px;\n}\n.hw-date-sep {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 0;\n}\n.hw-date-sep-line {\n flex: 1;\n height: 1px;\n background: var(--hw-border-md);\n}\n.hw-date-sep-text {\n font-size: 11px;\n color: var(--hw-text-3);\n font-weight: 500;\n white-space: nowrap;\n}\n.hw-msg {\n display: flex;\n padding: 4px 0;\n max-width: 75%;\n min-width: 0;\n animation: hw-msg-appear 0.25s ease-out;\n}\n@keyframes hw-msg-appear {\n from {\n opacity: 0;\n transform: translateY(6px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.hw-msg--visitor {\n align-self: flex-end;\n}\n.hw-msg--team,\n.hw-msg--ai {\n align-self: flex-start;\n}\n.hw-msg--ai {\n width: 100%;\n max-width: 100%;\n}\n.hw-msg-body {\n display: flex;\n flex-direction: column;\n min-width: 0;\n max-width: 100%;\n}\n.hw-msg-bubble {\n padding: 10px 14px;\n border-radius: 16px;\n font-size: 14px;\n line-height: 1.45;\n white-space: pre-wrap;\n word-break: break-word;\n overflow-wrap: anywhere;\n max-width: 100%;\n}\n.hw-msg--visitor .hw-msg-bubble {\n background: var(--hw-primary);\n color: white;\n border-bottom-right-radius: 4px;\n}\n.hw-msg--team .hw-msg-bubble {\n background: var(--hw-visitor-bubble-bg);\n color: var(--hw-visitor-bubble-text);\n border-bottom-left-radius: 4px;\n}\n.hw-msg--ai .hw-msg-bubble {\n background: var(--hw-visitor-bubble-bg);\n color: var(--hw-text);\n border-bottom-left-radius: 4px;\n white-space: normal;\n max-width: min(100%, 640px);\n}\n.hw-msg--ai .hw-msg-body {\n width: 100%;\n}\n.hw-msg--ai .hw-msg-bubble:has(.hw-code),\n.hw-msg--ai .hw-msg-bubble:has(pre) {\n width: 100%;\n}\n.hw-quick-replies {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin-top: 8px;\n}\n.hw-quick-reply-btn {\n font: inherit;\n font-size: 13px;\n font-weight: 500;\n padding: 6px 14px;\n border-radius: 18px;\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n background: var(--hw-bg, #fff);\n color: var(--hw-text-1, #1a1a1a);\n cursor: pointer;\n transition:\n background 120ms ease,\n border-color 120ms ease,\n box-shadow 120ms ease,\n transform 80ms ease;\n line-height: 1.3;\n}\n.hw-quick-reply-btn:hover:not(:disabled) {\n border-color: var(--hw-primary);\n background: color-mix(in srgb, var(--hw-primary) 8%, transparent);\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n}\n.hw-quick-reply-btn:active:not(:disabled) {\n transform: scale(0.97);\n}\n.hw-quick-reply-btn:disabled {\n cursor: default;\n opacity: 0.4;\n}\n.hw-quick-reply-btn[data-tapped=true] {\n background: var(--hw-primary);\n color: white;\n border-color: var(--hw-primary);\n opacity: 1;\n}\n.hw-quick-replies[data-cancelled=true] .hw-quick-reply-btn {\n border-color: var(--hw-border);\n color: var(--hw-text-3);\n}\n.hw-msg--ai .hw-code {\n width: 100%;\n box-sizing: border-box;\n}\n.hw-msg-meta {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: 11px;\n color: var(--hw-text-2);\n margin-top: 2px;\n padding: 0 4px;\n font-variant-numeric: tabular-nums;\n}\n.hw-msg-time {\n white-space: nowrap;\n}\n.hw-msg--visitor .hw-msg-meta {\n text-align: right;\n}\n.hw-msg--team .hw-msg-body,\n.hw-msg--ai .hw-msg-body {\n align-items: flex-start;\n}\n.hw-msg--visitor .hw-msg-body {\n align-items: flex-end;\n}\n.hw-typing {\n display: flex;\n flex-direction: column;\n gap: 3px;\n padding: 8px 0;\n width: fit-content;\n animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-typing-dots {\n display: flex;\n gap: 3px;\n padding: 6px 2px;\n width: fit-content;\n}\n.hw-typing-dot {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: var(--hw-text-3);\n animation: hw-typing-bounce 1.4s infinite;\n}\n.hw-typing-dot:nth-child(2) {\n animation-delay: 0.2s;\n}\n.hw-typing-dot:nth-child(3) {\n animation-delay: 0.4s;\n}\n@keyframes hw-typing-bounce {\n 0%, 60%, 100% {\n transform: translateY(0);\n }\n 30% {\n transform: translateY(-4px);\n }\n}\n.hw-streaming-cursor {\n display: inline-block;\n width: 2px;\n height: 1em;\n background: currentColor;\n opacity: 0.6;\n margin-left: 1px;\n vertical-align: text-bottom;\n animation: hw-cursor-blink 0.8s step-end infinite;\n}\n@keyframes hw-cursor-blink {\n 50% {\n opacity: 0;\n }\n}\n.hw-link-preview {\n display: flex;\n flex-direction: column;\n gap: 0;\n border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n border-radius: 10px;\n overflow: hidden;\n text-decoration: none;\n color: inherit;\n margin-top: 6px;\n transition: background 0.15s;\n}\n.hw-link-preview:hover {\n background: var(--hw-bg-hover, rgba(0, 0, 0, 0.02));\n}\n.hw-link-preview-img {\n width: 100%;\n height: 56px;\n flex: 0 0 56px;\n object-fit: cover;\n object-position: top;\n border-radius: 0;\n}\n.hw-link-preview-body {\n padding: 8px 10px;\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 0;\n justify-content: center;\n}\n.hw-link-preview-favicon {\n width: 16px;\n height: 16px;\n border-radius: 2px;\n}\n.hw-link-preview-title {\n font-size: 12.5px;\n font-weight: 600;\n line-height: 1.3;\n color: var(--hw-text, #1a1a1a);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n.hw-link-preview-desc {\n font-size: 11.5px;\n line-height: 1.4;\n color: var(--hw-text-2, #6b7280);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n.hw-link-preview-url {\n font-size: 11px;\n color: var(--hw-text-2);\n}\n.hw-msg-links {\n display: flex;\n flex-direction: column;\n gap: 6px;\n max-width: 240px;\n}\n.hw-loading {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-loading-dots {\n display: flex;\n gap: 4px;\n}\n.hw-loading-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--hw-text-4);\n animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-loading-dot:nth-child(2) {\n animation-delay: 0.2s;\n}\n.hw-loading-dot:nth-child(3) {\n animation-delay: 0.4s;\n}\n@keyframes hw-loading-pulse {\n 0%, 60%, 100% {\n opacity: 0.3;\n transform: scale(0.8);\n }\n 30% {\n opacity: 1;\n transform: scale(1);\n }\n}\n@keyframes hw-skeleton-shimmer {\n 0% {\n background-position: -200px 0;\n }\n 100% {\n background-position: calc(200px + 100%) 0;\n }\n}\n.hw-skeleton {\n background:\n linear-gradient(\n 90deg,\n var(--hw-bg-subtle) 25%,\n rgba(0, 0, 0, 0.04) 50%,\n var(--hw-bg-subtle) 75%);\n background-size: 200px 100%;\n animation: hw-skeleton-shimmer 1.5s ease-in-out infinite;\n border-radius: 6px;\n}\n.hw-skeleton-messages {\n flex: 1;\n display: flex;\n flex-direction: column;\n padding: 16px;\n gap: 16px;\n}\n.hw-skeleton-msg {\n display: flex;\n gap: 10px;\n align-items: flex-start;\n}\n.hw-skeleton-msg--right {\n flex-direction: row-reverse;\n}\n.hw-skeleton-avatar {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n flex-shrink: 0;\n}\n.hw-skeleton-bubble {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.hw-skeleton-line {\n height: 12px;\n border-radius: 6px;\n}\n.hw-skeleton-convs {\n display: flex;\n flex-direction: column;\n padding: 8px 0;\n}\n.hw-skeleton-conv {\n display: flex;\n gap: 10px;\n align-items: center;\n padding: 10px 16px;\n}\n.hw-skeleton-conv-avatar {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n flex-shrink: 0;\n}\n.hw-skeleton-conv-lines {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.hw-skeleton-content {\n display: flex;\n flex-direction: column;\n padding: 12px 16px;\n gap: 12px;\n}\n.hw-skeleton-content-item {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding: 12px;\n border-radius: 10px;\n background: var(--hw-bg);\n}\n.hw-skeleton-title {\n height: 22px;\n width: 65%;\n border-radius: 6px;\n}\n.hw-skeleton-badge {\n width: 42px;\n height: 18px;\n border-radius: 9px;\n}\n.hw-skeleton-date {\n width: 60px;\n height: 12px;\n border-radius: 6px;\n}\n.hw-skeleton-h2 {\n height: 16px;\n border-radius: 6px;\n}\n.hw-skeleton-bullet {\n padding-left: 20px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.hw-skeleton-bullet-line {\n height: 14px;\n border-radius: 7px;\n}\n.hw-email-card {\n max-width: min(100%, 340px);\n margin: 0;\n padding: 0;\n border: 0;\n border-radius: 0;\n background: none;\n box-shadow: none;\n animation: hw-email-slide-in 0.25s ease-out;\n}\n@keyframes hw-email-slide-in {\n from {\n opacity: 0;\n transform: translateY(8px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.hw-email-card-title {\n font-size: 14px;\n font-weight: 550;\n color: var(--hw-text, #1a1a1a);\n line-height: 1.3;\n margin: 0 0 2px;\n}\n.hw-email-card-subtitle {\n font-size: 12px;\n color: var(--hw-text-2, #888);\n line-height: 1.4;\n margin: 0;\n}\n.hw-email-card-row {\n max-width: 300px;\n display: flex;\n align-items: center;\n gap: 6px;\n margin-top: 9px;\n padding: 3px 3px 3px 12px;\n border-radius: 999px;\n border: 1px solid var(--hw-border, rgba(0,0,0,0.1));\n background: var(--hw-bg-subtle, #fafafa);\n transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-email-card-row:focus-within {\n border-color: var(--hw-focus-border, rgba(0,0,0,0.2));\n box-shadow: 0 0 0 2px var(--hw-focus-ring, rgba(0,0,0,0.06));\n}\n.hw-email-card-input {\n flex: 1;\n min-width: 0;\n padding: 6px 0;\n border: 0;\n background: transparent;\n color: var(--hw-text, #1a1a1a);\n font: inherit;\n font-size: 13px;\n outline: none;\n}\n.hw-email-card-input::placeholder {\n color: var(--hw-text-3, #999);\n}\n.hw-email-card-row:has(.hw-email-card-input--error) {\n border-color: #ef4444;\n}\n.hw-email-card-submit {\n flex: none;\n display: grid;\n place-items: center;\n width: 28px;\n height: 28px;\n border: none;\n border-radius: 50%;\n background: var(--hw-brand, #0a0a0a);\n color: var(--hw-on-brand, #fff);\n cursor: pointer;\n transition: opacity 0.15s, transform 0.15s;\n}\n.hw-email-card-submit:hover:not(:disabled) {\n transform: scale(1.06);\n}\n.hw-email-card-submit:disabled {\n opacity: 0.45;\n cursor: default;\n}\n.hw-email-card--success {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 2px 0;\n font-size: 13px;\n color: var(--hw-text-2, #888);\n animation: hw-email-slide-in 0.2s ease-out;\n}\n.hw-email-card--success svg {\n flex-shrink: 0;\n}\n.hw-composer {\n display: flex;\n flex-direction: column;\n padding: 12px 16px;\n background: transparent;\n flex-shrink: 0;\n}\n.hw-composer--compact {\n padding: 8px 12px;\n}\n.hw-composer-box {\n display: flex;\n flex-direction: column;\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n border-radius: 16px;\n overflow: hidden;\n transition: border-color 0.2s;\n background: var(--hw-bg);\n}\n.hw-composer-box:focus-within {\n border-color: var(--hw-focus-border);\n box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-composer-input {\n resize: none;\n border: none;\n padding: 12px 16px 4px;\n font-size: 14px;\n font-family: inherit;\n line-height: 1.4;\n outline: none;\n min-height: 40px;\n max-height: 220px;\n background: transparent;\n color: var(--hw-text);\n field-sizing: content;\n}\n.hw-composer-input:focus {\n outline: none;\n}\n.hw-composer-input:focus-visible {\n outline: none;\n}\n.hw-composer-input::placeholder {\n color: var(--hw-text-4);\n}\n.hw-composer-toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px 10px 10px;\n}\n.hw-composer-toolbar-left {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n.hw-composer-send {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n transition:\n background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-composer-send:active:not(:disabled) {\n transform: scale(0.9);\n}\n.hw-composer-send--active {\n background: var(--hw-primary);\n color: white;\n}\n.hw-composer-send--inactive {\n background: var(--hw-border);\n color: var(--hw-text-4);\n cursor: default;\n}\n.hw-composer-send svg {\n width: 14px;\n height: 14px;\n}\n.hw-composer-charcount {\n font-size: 11px;\n color: var(--hw-text-3);\n font-variant-numeric: tabular-nums;\n opacity: 1;\n transform: translateY(0);\n transition:\n color 180ms cubic-bezier(0.23, 1, 0.32, 1),\n opacity 180ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n@starting-style {\n .hw-composer-charcount {\n opacity: 0;\n transform: translateY(3px);\n }\n}\n.hw-composer-charcount--over {\n color: #ef4444;\n font-weight: 600;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-composer-charcount {\n transform: none;\n transition: color 160ms ease, opacity 160ms ease;\n }\n @starting-style {\n .hw-composer-charcount {\n transform: none;\n }\n }\n}\n.hw-composer-previews {\n display: flex;\n gap: 6px;\n padding: 8px 10px 0;\n overflow-x: auto;\n scrollbar-width: none;\n}\n.hw-composer-previews::-webkit-scrollbar {\n display: none;\n}\n.hw-composer-preview {\n position: relative;\n width: 48px;\n height: 48px;\n border-radius: 8px;\n overflow: hidden;\n flex-shrink: 0;\n background: var(--hw-border);\n cursor: pointer;\n}\n.hw-composer-preview--error {\n outline: 2px solid #ef4444;\n outline-offset: -2px;\n}\n.hw-composer-preview-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-composer-preview-file {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--hw-bg-subtle);\n}\n.hw-composer-preview-ext {\n font-size: 10px;\n font-weight: 700;\n color: var(--hw-text-3);\n text-transform: uppercase;\n}\n.hw-composer-preview-loader {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0.35);\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-composer-preview-loader::after {\n content: "";\n width: 16px;\n height: 16px;\n border: 2px solid rgba(255, 255, 255, 0.3);\n border-top-color: white;\n border-radius: 50%;\n animation: hw-spin 0.6s linear infinite;\n}\n@keyframes hw-spin {\n to {\n transform: rotate(360deg);\n }\n}\n.hw-composer-preview-badge {\n position: absolute;\n top: 2px;\n right: 2px;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n background: #ef4444;\n color: white;\n font-size: 10px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-composer-preview-remove {\n position: absolute;\n top: 2px;\n right: 2px;\n width: 18px;\n height: 18px;\n border-radius: 50%;\n border: none;\n background: rgba(0, 0, 0, 0.55);\n color: white;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n opacity: 0;\n transition: opacity 0.15s;\n}\n.hw-composer-preview-remove svg {\n width: 10px;\n height: 10px;\n}\n.hw-composer-preview:hover .hw-composer-preview-remove {\n opacity: 1;\n}\n.hw-composer-attach {\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 6px;\n opacity: 0.7;\n transition: opacity 0.15s;\n}\n.hw-composer-attach:hover {\n opacity: 1;\n}\n.hw-composer-attach svg {\n width: 16px;\n height: 16px;\n}\n.hw-msg-images {\n display: flex;\n flex-direction: column;\n gap: 4px;\n margin-bottom: 4px;\n}\n.hw-msg-image-link {\n display: block;\n border-radius: 14px;\n overflow: hidden;\n line-height: 0;\n}\n.hw-msg-image {\n max-width: 140px;\n max-height: 80px;\n object-fit: cover;\n border-radius: 8px;\n outline: 1px solid rgba(0, 0, 0, 0.08);\n outline-offset: -1px;\n}\n.hw-msg-files {\n display: flex;\n flex-direction: column;\n gap: 4px;\n margin-top: 4px;\n}\n.hw-msg-file {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n border-radius: 10px;\n background: var(--hw-bg-subtle);\n text-decoration: none;\n color: var(--hw-text);\n transition: background 0.15s;\n}\n.hw-msg-file:hover {\n background: var(--hw-border);\n}\n.hw-msg-file-icon {\n flex-shrink: 0;\n width: 20px;\n height: 20px;\n color: var(--hw-text-3);\n}\n.hw-msg-file-icon svg {\n width: 100%;\n height: 100%;\n}\n.hw-msg-file-info {\n display: flex;\n flex-direction: column;\n min-width: 0;\n}\n.hw-msg-file-name {\n font-size: 13px;\n font-weight: 500;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.hw-msg-file-size {\n font-size: 11px;\n color: var(--hw-text-3);\n}\n.hw-msg-image-link {\n cursor: pointer;\n border: none;\n padding: 0;\n background: none;\n display: block;\n line-height: 0;\n}\n.hw-hover-preview {\n position: fixed;\n z-index: 2147483001;\n padding: 6px;\n border-radius: 14px;\n background: white;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(0, 0, 0, 0.06);\n cursor: pointer;\n animation: hw-hover-in 0.15s ease-out;\n}\n@media (prefers-color-scheme: dark) {\n .hw-hover-preview {\n background: #1c1c1e;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.08);\n }\n}\n@keyframes hw-hover-in {\n from {\n opacity: 0;\n transform: scale(0.96) translateY(4px);\n }\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n.hw-hover-preview-img {\n width: 100%;\n max-height: 200px;\n object-fit: contain;\n border-radius: 10px;\n display: block;\n outline: 1px solid rgba(0, 0, 0, 0.08);\n outline-offset: -1px;\n}\n.hw-hover-preview--doc {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 14px;\n}\n.hw-hover-preview-doc-icon {\n width: 28px;\n height: 28px;\n flex-shrink: 0;\n}\n.hw-hover-preview-doc-icon svg {\n width: 100%;\n height: 100%;\n}\n.hw-hover-preview-doc-info {\n display: flex;\n flex-direction: column;\n min-width: 0;\n}\n.hw-hover-preview-doc-name {\n font-size: 13px;\n font-weight: 500;\n color: var(--hw-text);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.hw-hover-preview-doc-hint {\n font-size: 11px;\n color: var(--hw-text-3);\n}\n.hw-event {\n display: flex;\n justify-content: center;\n padding: 8px 16px;\n}\n.hw-event-text {\n font-size: 12px;\n color: var(--hw-text-3);\n text-align: center;\n}\n.hw-event--card {\n justify-content: flex-start;\n align-items: center;\n gap: 10px;\n background: var(--hw-bg-subtle);\n padding: 10px 14px;\n border-radius: 12px;\n margin: 4px 16px;\n}\n.hw-event-avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-hover, #e0e0e0)));\n color: var(--hw-text-2, #555);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 11px;\n font-weight: 600;\n flex-shrink: 0;\n overflow: hidden;\n}\n.hw-event-avatar-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-event-avatar .hw-agent-img {\n object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n box-sizing: border-box;\n}\n.hw-event-body {\n font-size: 13px;\n line-height: 1.3;\n}\n.hw-event-name {\n font-weight: 600;\n color: var(--hw-text);\n}\n.hw-event-action {\n color: var(--hw-text-2);\n}\n.hw-resolved-banner {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 12px 16px;\n border-top: 1px solid var(--hw-border);\n background: var(--hw-bg-subtle);\n color: var(--hw-text-2);\n font-size: 13px;\n flex-shrink: 0;\n}\n.hw-new {\n flex: 1;\n display: flex;\n flex-direction: column;\n background: var(--hw-bg-subtle);\n}\n.hw-new-body {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px 24px;\n text-align: center;\n}\n.hw-new-welcome {\n flex: 1;\n padding: 16px 20px;\n overflow-y: auto;\n}\n.hw-new-heading {\n font-size: 17px;\n font-weight: 600;\n color: var(--hw-text);\n margin-bottom: 6px;\n}\n.hw-new-desc {\n font-size: 13px;\n color: var(--hw-text-2);\n margin-bottom: 24px;\n}\n.hw-powered {\n text-align: center;\n padding: 8px;\n font-size: 11px;\n color: var(--hw-text-4);\n flex-shrink: 0;\n}\n.hw-powered a {\n color: var(--hw-text-2);\n text-decoration: none;\n font-weight: 500;\n}\n.hw-powered a:hover {\n color: var(--hw-text);\n}\n@media (max-width: 479px) {\n .hw-widget {\n bottom: 16px;\n right: 16px;\n left: auto;\n }\n .hw-window {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: var(--hw-visible-height, 100%);\n border-radius: 0;\n animation: hw-mob-up 0.3s cubic-bezier(0.22, 1, 0.36, 1);\n }\n .hw-window--closing {\n animation: hw-mob-down 0.2s ease forwards;\n }\n @keyframes hw-mob-up {\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n @keyframes hw-mob-down {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n }\n .hw-hero {\n padding-top: calc(20px + env(safe-area-inset-top, 0px));\n }\n .hw-header {\n padding-top: env(safe-area-inset-top, 0px);\n }\n .hw-tabs {\n padding-bottom: env(safe-area-inset-bottom, 0px);\n }\n .hw-composer {\n padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));\n }\n .hw-powered {\n padding-bottom: calc(5px + env(safe-area-inset-bottom, 0px));\n }\n .hw-window:has(.hw-powered) .hw-composer {\n padding-bottom: 8px;\n }\n .hw-window:has(.hw-powered) .hw-tabs {\n padding-bottom: 0;\n }\n .hw-header-close,\n .hw-header-back,\n .hw-header-action {\n width: 34px;\n height: 34px;\n }\n .hw-composer-send {\n width: 40px;\n height: 40px;\n }\n .hw-window ~ .hw-bubble {\n display: none;\n }\n .hw-messages {\n padding: 12px 14px;\n }\n .hw-msg {\n max-width: 82%;\n }\n .hw-msg--ai {\n max-width: 100%;\n }\n}\n.hw-preview {\n position: absolute;\n bottom: calc(100% + 12px);\n right: 0;\n width: 300px;\n max-width: calc(100vw - 40px);\n background: var(--hw-bg);\n border: 1px solid var(--hw-border);\n border-radius: 16px;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);\n animation: hw-preview-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n overflow: hidden;\n cursor: pointer;\n transition: transform 0.15s, box-shadow 0.15s;\n}\n.hw-preview.hw-preview--anchored {\n position: static;\n bottom: auto;\n right: auto;\n width: 100%;\n max-width: 100%;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar {\n background: none;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar img,\n.hw-preview.hw-preview--anchored .hw-preview-avatar svg:not(.hw-agent-custom svg) {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n.hw-preview:hover {\n transform: translateY(-2px);\n box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15), 0 4px 12px rgba(0, 0, 0, 0.08);\n}\n@keyframes hw-preview-in {\n from {\n opacity: 0;\n transform: translateY(8px) scale(0.95);\n }\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n@keyframes hw-preview-out {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n to {\n opacity: 0;\n transform: translateY(8px) scale(0.95);\n }\n}\n.hw-preview-header {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 14px 0;\n}\n.hw-preview-avatar {\n width: 28px;\n height: 28px;\n border-radius: 50%;\n background:\n linear-gradient(\n 135deg,\n var(--hw-primary),\n color-mix(in srgb, var(--hw-primary) 50%, black));\n display: flex;\n align-items: center;\n justify-content: center;\n color: white;\n flex-shrink: 0;\n overflow: hidden;\n}\n.hw-preview-avatar svg:not(.hw-agent-custom svg) {\n width: 16px;\n height: 16px;\n}\n.hw-preview-avatar img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n}\n.hw-preview-name {\n font-size: 13px;\n font-weight: 600;\n color: var(--hw-text);\n flex: 1;\n}\n.hw-preview-close {\n width: 24px;\n height: 24px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n transition: background 0.15s, color 0.15s;\n flex-shrink: 0;\n}\n.hw-preview-close:hover {\n background: var(--hw-bg-subtle);\n color: var(--hw-text-2);\n}\n.hw-preview-close:active {\n transform: scale(0.90);\n transition:\n transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n background 0.15s,\n color 0.15s;\n}\n.hw-preview-close svg {\n width: 12px;\n height: 12px;\n}\n.hw-preview-body {\n padding: 4px 14px;\n font-size: 14px;\n line-height: 1.45;\n color: var(--hw-text-2);\n}\n.hw-preview-body:first-of-type {\n padding-top: 8px;\n}\n.hw-preview-body:last-child {\n padding-bottom: 14px;\n}\n.hw-preview-footer {\n margin-top: 2px;\n padding: 8px 14px 12px;\n border-top: 1px solid var(--hw-border);\n font-size: 11px;\n line-height: 1.3;\n color: var(--hw-text-2);\n opacity: 0.65;\n}\n.hw-preview-prompt {\n padding: 2px 14px 6px;\n font-size: 14px;\n font-weight: 500;\n color: var(--hw-text-1);\n}\n.hw-preview-quick-replies {\n padding: 0 14px 14px;\n margin-top: 0;\n}\n.hw-awaiting {\n margin-top: 2px;\n padding-left: 44px;\n font-size: 11px;\n line-height: 1.4;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-preview-dock {\n position: absolute;\n bottom: calc(100% + 12px);\n right: 0;\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n gap: 8px;\n pointer-events: none;\n}\n.hw-preview-dock > .hw-preview,\n.hw-preview-dock > .hw-preview-stack {\n position: relative;\n bottom: auto;\n right: auto;\n pointer-events: auto;\n}\n.hw-preview--closing {\n animation: hw-preview-out 0.2s ease-in forwards;\n}\n.hw-preview-stack {\n position: absolute;\n bottom: calc(100% + 12px);\n right: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.hw-preview-stack .hw-preview {\n position: relative;\n bottom: auto;\n right: auto;\n}\n.hw-preview-stack.hw-preview-stack--anchored {\n position: static;\n bottom: auto;\n right: auto;\n width: 100%;\n}\n.hw-preview-more {\n align-self: flex-end;\n padding: 4px 10px;\n border: 0;\n border-radius: 999px;\n background: var(--hw-bg);\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), inset 0 0 0 1px var(--hw-border);\n color: var(--hw-text-2);\n font: inherit;\n font-size: 12px;\n line-height: 1.4;\n cursor: pointer;\n transition: background 0.12s, color 0.12s;\n}\n.hw-preview-more:hover {\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n}\n.hw-preview--announcement {\n width: 340px;\n}\n.hw-preview--announcement .hw-preview-body--title {\n font-weight: 600;\n color: var(--hw-text);\n font-size: 15px;\n line-height: 1.3;\n padding-top: 10px;\n}\n.hw-preview--announcement .hw-preview-body--desc {\n font-size: 13px;\n color: var(--hw-text-2);\n line-height: 1.5;\n padding-bottom: 16px;\n}\n.hw-announcement-badge {\n display: inline-block;\n margin: 8px 14px 0;\n padding: 2px 8px;\n font-size: 10px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--hw-primary);\n background: color-mix(in srgb, var(--hw-primary) 10%, transparent);\n border-radius: 4px;\n}\n.hw-whats-new {\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n overflow: hidden;\n}\n.hw-whats-new-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 14px 0;\n}\n.hw-whats-new-title {\n font-size: 12px;\n font-weight: 600;\n color: var(--hw-text-2);\n}\n.hw-whats-new-view-all {\n font-size: 11px;\n font-weight: 500;\n color: var(--hw-primary);\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n font-family: inherit;\n}\n.hw-whats-new-view-all:hover {\n opacity: 0.8;\n}\n.hw-whats-new-list {\n display: flex;\n flex-direction: column;\n}\n.hw-whats-new-item {\n display: flex;\n flex-direction: column;\n gap: 2px;\n width: 100%;\n padding: 10px 14px;\n border: none;\n border-bottom: 1px solid var(--hw-border);\n background: none;\n cursor: pointer;\n text-align: left;\n font-family: inherit;\n color: var(--hw-text);\n transition: background-color 140ms ease;\n}\n.hw-whats-new-item:last-child {\n border-bottom: none;\n}\n.hw-whats-new-item:hover {\n background: rgba(0, 0, 0, 0.03);\n}\n.hw-whats-new-item-top {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.hw-whats-new-badge {\n font-size: 10px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--hw-primary);\n}\n.hw-whats-new-time {\n font-size: 11px;\n color: var(--hw-text-3);\n margin-left: auto;\n}\n.hw-whats-new-item-title {\n font-size: 13px;\n font-weight: 600;\n color: var(--hw-text);\n line-height: 1.3;\n display: flex;\n align-items: baseline;\n gap: 8px;\n}\n.hw-whats-new-time-inline {\n font-size: 11px;\n font-weight: 400;\n color: var(--hw-text-3);\n margin-left: auto;\n flex-shrink: 0;\n}\n.hw-whats-new-item-body {\n font-size: 12px;\n color: var(--hw-text-2);\n line-height: 1.4;\n}\n.hw-tabs-dot {\n position: absolute;\n top: -2px;\n right: -6px;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--hw-primary);\n animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n.hw-bubble-badge-dot {\n display: block;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: white;\n}\n.hw-content-search {\n padding: 10px 16px;\n}\n.hw-content-search-box {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background: var(--hw-bg);\n border: 1px solid var(--hw-border-md);\n border-radius: 10px;\n transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-content-search-box:focus-within {\n border-color: var(--hw-focus-border);\n box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-content-search-input {\n flex: 1;\n border: none !important;\n outline: none !important;\n box-shadow: none !important;\n background: none;\n font-size: 13px;\n color: var(--hw-text-1);\n font-family: inherit;\n line-height: 1;\n -webkit-appearance: none;\n}\n.hw-content-search-input:focus,\n.hw-content-search-input:focus-visible {\n outline: none !important;\n box-shadow: none !important;\n border: none !important;\n}\n.hw-content-search-input::placeholder {\n color: var(--hw-text-3);\n}\n.hw-content-search-icon {\n width: 15px;\n height: 15px;\n color: var(--hw-text-3);\n flex-shrink: 0;\n}\n.hw-content-list {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.hw-content-entries {\n flex: 1;\n overflow-y: auto;\n overscroll-behavior: contain;\n}\n.hw-content-entry {\n display: block;\n width: 100%;\n padding: 14px 16px;\n border: none;\n border-bottom: 1px solid var(--hw-border);\n background: none;\n cursor: pointer;\n text-align: left;\n transition: background-color 0.15s ease;\n -webkit-tap-highlight-color: transparent;\n}\n.hw-content-entry:hover {\n background: var(--hw-bg-hover);\n}\n.hw-content-entry:active {\n background: var(--hw-border);\n}\n.hw-content-entry:last-child {\n border-bottom: none;\n}\n.hw-content-entry-main {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.hw-content-entry-text {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 3px;\n}\n.hw-content-entry-title {\n font-size: 14px;\n font-weight: 600;\n color: var(--hw-text-1);\n line-height: 1.3;\n}\n.hw-content-entry-desc {\n font-size: 13px;\n color: var(--hw-text-2);\n line-height: 1.4;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n.hw-content-entry-meta {\n display: flex;\n align-items: center;\n gap: 6px;\n margin-top: 2px;\n}\n.hw-content-entry-badge {\n font-size: 11px;\n font-weight: 500;\n color: var(--hw-text-3);\n background: var(--hw-bg-hover);\n padding: 1px 6px;\n border-radius: 4px;\n}\n.hw-content-entry-date {\n font-size: 11px;\n color: var(--hw-text-3);\n}\n.hw-content-entry-chevron {\n width: 16px;\n height: 16px;\n color: var(--hw-text-3);\n flex-shrink: 0;\n opacity: 0.5;\n}\n.hw-content-detail {\n padding: 16px;\n overflow-y: auto;\n overscroll-behavior: contain;\n flex: 1;\n min-height: 0;\n}\n.hw-content-detail-header {\n margin-bottom: 16px;\n}\n.hw-content-detail-title {\n font-size: 17px;\n font-weight: 700;\n color: var(--hw-text-1);\n margin: 0 0 6px;\n line-height: 1.3;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n.hw-content-detail-meta {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: wrap;\n}\n.hw-content-detail-date {\n font-size: 12px;\n color: var(--hw-text-3);\n}\n.hw-content-detail-body {\n font-size: 14px;\n line-height: 1.6;\n color: var(--hw-text-1);\n}\n.hw-markdown h1 {\n font-size: 17px;\n font-weight: 700;\n margin: 0;\n}\n.hw-markdown h2 {\n font-size: 15px;\n font-weight: 600;\n margin: 0;\n}\n.hw-markdown h3 {\n font-size: 14px;\n font-weight: 600;\n margin: 0;\n}\n.hw-markdown p {\n margin: 0;\n}\n.hw-markdown p:empty,\n.hw-markdown div:empty,\n.hw-markdown p:has(> br:only-child),\n.hw-markdown div:has(> br:only-child) {\n display: none;\n}\n.hw-markdown > * + * {\n margin-top: 12px;\n}\n.hw-markdown > * + h1,\n.hw-markdown > * + h2 {\n margin-top: 20px;\n}\n.hw-markdown > * + h3 {\n margin-top: 16px;\n}\n.hw-markdown > h1 + *,\n.hw-markdown > h2 + *,\n.hw-markdown > h3 + * {\n margin-top: 8px;\n}\n.hw-markdown > *:first-child {\n margin-top: 0;\n}\n.hw-markdown > *:last-child {\n margin-bottom: 0;\n}\n.hw-markdown > br {\n display: none;\n}\n.hw-markdown ul,\n.hw-markdown ol {\n margin: 0;\n padding-left: 20px;\n}\n.hw-markdown li {\n margin: 4px 0;\n}\n.hw-markdown code {\n font-family:\n ui-monospace,\n "SF Mono",\n monospace;\n font-size: 12px;\n background: var(--hw-bg-hover);\n padding: 1px 5px;\n border-radius: 4px;\n}\n.hw-table-wrap {\n margin: 10px 0;\n overflow-x: auto;\n border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n border-radius: 10px;\n}\n.hw-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 13px;\n}\n.hw-table th {\n text-align: left;\n font-weight: 600;\n font-size: 12px;\n padding: 8px 12px;\n background: var(--hw-bg-hover, #f5f5f4);\n border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n}\n.hw-table td {\n padding: 8px 12px;\n border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n vertical-align: top;\n}\n.hw-table tbody tr:last-child td {\n border-bottom: none;\n}\n.hw-code {\n margin: 10px 0;\n border-radius: 10px;\n overflow: hidden;\n border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n background: var(--hw-bg-hover, #f5f5f4);\n font-family:\n ui-monospace,\n "SF Mono",\n "Menlo",\n monospace;\n}\n.hw-code-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 10px;\n padding: 7px 8px 7px 12px;\n font-size: 11px;\n color: var(--hw-text-2, #6b7280);\n background: rgba(0, 0, 0, 0.03);\n border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n}\n.hw-code-lang {\n text-transform: lowercase;\n letter-spacing: 0.02em;\n font-weight: 500;\n}\n.hw-code-actions {\n display: inline-flex;\n align-items: center;\n gap: 1px;\n}\n.hw-code-action {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 22px;\n height: 22px;\n padding: 0;\n font-family: inherit;\n color: var(--hw-text-2, #6b7280);\n background: transparent;\n border: 1px solid transparent;\n border-radius: 6px;\n cursor: pointer;\n opacity: 0.62;\n transition:\n background 120ms ease,\n color 120ms ease,\n opacity 120ms ease,\n scale 120ms ease;\n}\n.hw-code-action:hover {\n color: var(--hw-text, #111);\n background: rgba(0, 0, 0, 0.06);\n opacity: 1;\n}\n.hw-code-action:active {\n scale: 0.96;\n}\n.hw-code-action svg {\n width: 13px;\n height: 13px;\n}\n.hw-code-copy-icon,\n.hw-code-check-icon {\n position: absolute;\n inset: 50% auto auto 50%;\n transition:\n opacity 180ms cubic-bezier(0.2, 0, 0, 1),\n scale 180ms cubic-bezier(0.2, 0, 0, 1),\n filter 180ms cubic-bezier(0.2, 0, 0, 1);\n translate: -50% -50%;\n}\n.hw-code-check-icon {\n filter: blur(4px);\n opacity: 0;\n scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-copy-icon {\n filter: blur(4px);\n opacity: 0;\n scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-check-icon {\n filter: blur(0);\n opacity: 1;\n scale: 1;\n}\n.hw-code-copy-label {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n}\n.hw-code-copy--copied {\n color: #16a34a;\n}\n.hw-code-copy--failed {\n color: #dc2626;\n}\n.hw-code pre {\n margin: 0;\n padding: 10px 12px;\n background: transparent;\n border-radius: 0;\n overflow-x: auto;\n max-width: 100%;\n max-height: 320px;\n scrollbar-color: rgba(0, 0, 0, 0.22) transparent;\n scrollbar-width: thin;\n}\n.hw-code pre::-webkit-scrollbar {\n width: 10px;\n height: 10px;\n}\n.hw-code pre::-webkit-scrollbar-track {\n background: transparent;\n}\n.hw-code pre::-webkit-scrollbar-thumb {\n background: rgba(0, 0, 0, 0.18);\n background-clip: content-box;\n border: 3px solid transparent;\n border-radius: 999px;\n}\n.hw-code pre::-webkit-scrollbar-thumb:hover {\n background: rgba(0, 0, 0, 0.28);\n background-clip: content-box;\n}\n.hw-code pre code {\n display: block;\n background: transparent;\n padding: 0;\n font-size: 12px;\n line-height: 1.55;\n white-space: pre;\n color: var(--hw-text, #111);\n}\n@media (prefers-color-scheme: dark) {\n .hw-code {\n background: rgba(255, 255, 255, 0.04);\n border-color: rgba(255, 255, 255, 0.08);\n }\n .hw-code-header {\n background: rgba(255, 255, 255, 0.03);\n border-bottom-color: rgba(255, 255, 255, 0.06);\n }\n .hw-code-action:hover,\n .hw-code-action:focus-visible {\n background: rgba(255, 255, 255, 0.08);\n }\n .hw-code pre {\n scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n }\n .hw-code pre::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.22);\n background-clip: content-box;\n }\n .hw-code pre::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.32);\n background-clip: content-box;\n }\n}\n.hw-markdown pre {\n margin: 8px 0;\n padding: 10px 12px;\n background: var(--hw-bg-hover);\n border-radius: 8px;\n overflow-x: auto;\n max-width: 100%;\n}\n.hw-markdown pre code {\n display: block;\n background: transparent;\n padding: 0;\n border-radius: 0;\n font-size: 12px;\n line-height: 1.5;\n white-space: pre;\n word-break: normal;\n color: inherit;\n}\n.hw-msg-bubble pre {\n margin: 6px 0;\n padding: 8px 10px;\n background: rgba(0, 0, 0, 0.06);\n border-radius: 6px;\n overflow-x: auto;\n max-width: 100%;\n}\n.hw-msg-bubble pre code {\n background: transparent;\n padding: 0;\n font-size: 12px;\n line-height: 1.5;\n white-space: pre;\n}\n.hw-msg-bubble .hw-code pre {\n margin: 0;\n padding: 10px 12px;\n background: transparent;\n border-radius: 0;\n}\n.hw-msg-bubble .hw-code pre code {\n background: transparent;\n padding: 0;\n font-size: 12px;\n line-height: 1.55;\n}\n.hw-msg--team .hw-msg-bubble pre,\n.hw-msg--visitor .hw-msg-bubble pre {\n background: rgba(255, 255, 255, 0.12);\n}\n.hw-markdown blockquote {\n margin: 0 0 12px;\n padding: 8px 12px;\n border-left: 3px solid var(--hw-border);\n color: var(--hw-text-2);\n font-style: italic;\n}\n.hw-markdown a {\n color: var(--hw-primary);\n text-decoration: underline;\n text-underline-offset: 2px;\n}\n.hw-markdown img {\n max-width: 100%;\n border-radius: 8px;\n margin: 8px 0;\n outline: 1px solid rgba(0, 0, 0, 0.08);\n outline-offset: -1px;\n}\n.hw-markdown hr {\n border: none;\n border-top: 1px solid var(--hw-border);\n margin: 16px 0;\n}\n.hw-content-empty {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n text-align: center;\n}\n.hw-content-empty-title {\n font-size: 14px;\n font-weight: 600;\n color: var(--hw-text-1);\n margin-bottom: 4px;\n}\n.hw-content-empty-desc {\n font-size: 12px;\n color: var(--hw-text-3);\n}\n.hw-content-loading {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n}\n.hw-content-load-more {\n display: block;\n width: 100%;\n padding: 10px;\n border: none;\n background: none;\n color: var(--hw-primary);\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n text-align: center;\n}\n.hw-content-load-more:hover {\n background: var(--hw-bg-hover);\n}\n.hw-content-load-more:disabled {\n opacity: 0.5;\n cursor: default;\n}\n@media (hover: none) {\n .hw-composer-preview-remove {\n opacity: 0.7;\n }\n}\n.hw-composer--dragging .hw-composer-box {\n border-color: var(--hw-primary);\n background: color-mix(in srgb, var(--hw-primary) 4%, transparent);\n}\n.hw-composer-drop-overlay {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: color-mix(in srgb, var(--hw-bg) 90%, transparent);\n border: 2px dashed var(--hw-primary);\n border-radius: 12px;\n z-index: 10;\n pointer-events: none;\n animation: hw-drop-pulse 1.5s ease-in-out infinite;\n}\n.hw-composer-drop-text {\n font-size: 13px;\n font-weight: 500;\n color: var(--hw-primary);\n}\n@keyframes hw-drop-pulse {\n 0%, 100% {\n opacity: 0.8;\n }\n 50% {\n opacity: 1;\n }\n}\n.hw-disconnect {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 7px;\n padding: 7px 14px;\n background: var(--hw-bg-hover);\n color: var(--hw-text-2);\n font-size: 11.5px;\n font-weight: 500;\n letter-spacing: -0.01em;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 0;\n animation: hw-disconnect-in 0.18s cubic-bezier(0.22, 1, 0.36, 1);\n}\n@keyframes hw-disconnect-in {\n from {\n opacity: 0;\n transform: translateY(-100%);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.hw-disconnect-spinner {\n width: 9px;\n height: 9px;\n border: 1.5px solid currentColor;\n border-top-color: transparent;\n border-radius: 50%;\n opacity: 0.75;\n flex-shrink: 0;\n animation: hw-spin 0.7s linear infinite;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-disconnect {\n animation: none;\n }\n .hw-disconnect-spinner {\n animation: none;\n border-top-color: currentColor;\n opacity: 0.5;\n }\n}\n.hw-error-state {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px 24px;\n text-align: center;\n gap: 12px;\n}\n.hw-error-icon {\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background: #fef2f2;\n color: #ef4444;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-error-icon svg {\n width: 24px;\n height: 24px;\n}\n.hw-error-title {\n font-size: 15px;\n font-weight: 600;\n color: var(--hw-text);\n}\n.hw-error-desc {\n font-size: 13px;\n color: var(--hw-text-2);\n}\n.hw-error-btn {\n padding: 8px 20px;\n border: 1px solid var(--hw-border-md);\n border-radius: 8px;\n background: var(--hw-bg);\n color: var(--hw-text);\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n transition: background 0.15s;\n}\n.hw-error-btn:hover {\n background: var(--hw-bg-hover);\n}\n.hw-send-error {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background: #fef2f2;\n color: #dc2626;\n font-size: 12px;\n font-weight: 500;\n flex-shrink: 0;\n animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-send-error-retry {\n margin-left: auto;\n padding: 2px 8px;\n border: 1px solid #fca5a5;\n border-radius: 4px;\n background: none;\n color: #dc2626;\n font-size: 11px;\n font-weight: 600;\n cursor: pointer;\n}\n.hw-send-error-retry:hover {\n background: #fee2e2;\n}\n.hw-resolved {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 12px;\n padding: 16px 20px;\n border-top: 1px solid var(--hw-border);\n flex-shrink: 0;\n}\n.hw-resolved-text {\n font-size: 13px;\n color: var(--hw-text-3);\n font-weight: 500;\n}\n.hw-resolved-actions {\n display: flex;\n gap: 8px;\n}\n.hw-resolved-reopen {\n padding: 6px 16px;\n border: 1px solid var(--hw-border-md);\n border-radius: 8px;\n background: var(--hw-bg);\n color: var(--hw-text);\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n transition: background 0.15s;\n}\n.hw-resolved-reopen:hover {\n background: var(--hw-bg-hover);\n}\n.hw-csat {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n.hw-csat-label {\n font-size: 12px;\n color: var(--hw-text-3);\n}\n.hw-csat-buttons {\n display: flex;\n gap: 8px;\n}\n.hw-csat-btn {\n width: 36px;\n height: 36px;\n border: 1px solid var(--hw-border-md);\n border-radius: 8px;\n background: var(--hw-bg);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 18px;\n transition:\n transform 0.15s,\n border-color 0.15s,\n background 0.15s;\n}\n.hw-csat-btn:hover {\n transform: scale(1.1);\n border-color: var(--hw-text-3);\n}\n.hw-csat-btn--selected {\n border-color: var(--hw-primary);\n background: var(--hw-bg-hover);\n transform: scale(1.15);\n}\n.hw-csat-thanks {\n font-size: 12px;\n color: #22c55e;\n font-weight: 500;\n animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-load-more-trigger {\n display: flex;\n justify-content: center;\n min-height: 1px;\n}\n.hw-load-more-trigger:has(.hw-load-more-spinner) {\n padding: 8px 0;\n}\n.hw-load-more-spinner {\n display: flex;\n gap: 3px;\n}\n.hw-load-more-spinner > div {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background: var(--hw-text-4);\n animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-load-more-spinner > div:nth-child(2) {\n animation-delay: 0.2s;\n}\n.hw-load-more-spinner > div:nth-child(3) {\n animation-delay: 0.4s;\n}\n.hw-drag-handle {\n display: none;\n}\n@media (max-width: 479px) {\n .hw-drag-handle {\n display: flex;\n justify-content: center;\n padding: 8px 0 4px;\n flex-shrink: 0;\n }\n .hw-drag-handle-pill {\n width: 32px;\n height: 4px;\n border-radius: 2px;\n background: var(--hw-text-4);\n }\n}\n.hw-msg-bubble p {\n margin: 0 0 8px;\n}\n.hw-msg-bubble p:last-child {\n margin-bottom: 0;\n}\n.hw-msg-bubble strong {\n font-weight: 600;\n}\n.hw-msg-bubble em {\n font-style: italic;\n}\n.hw-msg-bubble a {\n color: inherit;\n text-decoration: underline;\n text-decoration-thickness: 1px;\n text-underline-offset: 2px;\n text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);\n word-break: normal;\n overflow-wrap: anywhere;\n}\n.hw-msg-bubble a:hover {\n opacity: 0.8;\n}\n.hw-msg--visitor .hw-msg-bubble a {\n color: rgba(255, 255, 255, 0.9);\n}\n.hw-msg--visitor .hw-msg-bubble a:hover {\n color: white;\n}\n.hw-msg-bubble ul,\n.hw-msg-bubble ol {\n margin: 4px 0 8px;\n padding-left: 20px;\n}\n.hw-msg-bubble li {\n margin: 2px 0;\n}\n.hw-msg-bubble code {\n padding: 1px 4px;\n border-radius: 3px;\n background: rgba(0, 0, 0, 0.06);\n font-size: 0.9em;\n font-family:\n ui-monospace,\n SFMono-Regular,\n Menlo,\n monospace;\n}\n.hw-msg-bubble pre {\n margin: 4px 0 8px;\n padding: 8px 10px;\n border-radius: 6px;\n background: rgba(0, 0, 0, 0.06);\n overflow-x: auto;\n font-size: 0.85em;\n}\n.hw-msg-bubble pre code {\n padding: 0;\n background: none;\n}\n.hw-msg-bubble blockquote {\n margin: 4px 0 8px;\n padding: 4px 0 4px 12px;\n border-left: 3px solid var(--hw-border-md);\n color: var(--hw-text-2);\n}\n.hw-widget[data-theme=dark] {\n --hw-bg: #1c1c1e;\n --hw-bg-subtle: #161618;\n --hw-bg-hover: #2c2c2e;\n --hw-border: rgba(255, 255, 255, 0.08);\n --hw-border-md: rgba(255, 255, 255, 0.14);\n --hw-text: #f5f5f5;\n --hw-text-1: #f5f5f5;\n --hw-text-2: #a1a1aa;\n --hw-text-3: #71717a;\n --hw-text-4: #52525b;\n --hw-visitor-bubble-bg: #2c2c2e;\n --hw-visitor-bubble-text: #f5f5f5;\n --hw-focus-border: rgba(255, 255, 255, 0.28);\n --hw-focus-ring: rgba(255, 255, 255, 0.08);\n --hw-brand: #f5f5f5;\n --hw-on-brand: #1c1c1e;\n}\n@media (prefers-color-scheme: dark) {\n .hw-widget:not([data-theme=light]) .hw-messages {\n scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n }\n .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.2);\n background-clip: content-box;\n }\n .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.32);\n background-clip: content-box;\n }\n .hw-widget:not([data-theme=light]) {\n --hw-bg: #1c1c1e;\n --hw-bg-subtle: #161618;\n --hw-bg-hover: #2c2c2e;\n --hw-border: rgba(255, 255, 255, 0.08);\n --hw-border-md: rgba(255, 255, 255, 0.14);\n --hw-text: #f5f5f5;\n --hw-text-1: #f5f5f5;\n --hw-text-2: #a1a1aa;\n --hw-text-3: #71717a;\n --hw-text-4: #52525b;\n --hw-visitor-bubble-bg: #2c2c2e;\n --hw-visitor-bubble-text: #f5f5f5;\n --hw-focus-border: rgba(255, 255, 255, 0.28);\n --hw-focus-ring: rgba(255, 255, 255, 0.08);\n --hw-brand: #f5f5f5;\n --hw-on-brand: #1c1c1e;\n }\n}\n@media (prefers-color-scheme: dark) {\n .hw-widget:not([data-theme=light]) .hw-header {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-header-bot-icon {\n background: var(--hw-bg-hover);\n }\n .hw-header-name,\n .hw-header-title {\n color: var(--hw-text);\n }\n .hw-header-status {\n color: var(--hw-text-2);\n }\n .hw-header-close,\n .hw-header-back {\n color: var(--hw-text-2);\n }\n .hw-header-close:hover,\n .hw-header-back:hover {\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n }\n .hw-content-entry {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-content-entry:hover {\n background: var(--hw-bg-hover);\n border-color: var(--hw-border-md);\n }\n .hw-content-empty,\n .hw-empty {\n color: var(--hw-text-3);\n }\n .hw-conv-card {\n border-color: var(--hw-border);\n }\n .hw-recent-row {\n border-color: var(--hw-border);\n }\n .hw-composer-drop-overlay {\n background: rgba(0, 0, 0, 0.6);\n color: var(--hw-text);\n }\n .hw-composer--dragging .hw-composer-box {\n border-color: var(--hw-focus-border);\n box-shadow: 0 0 0 3px var(--hw-focus-ring);\n }\n .hw-hero {\n background:\n linear-gradient(\n 160deg,\n color-mix(in srgb, var(--hw-primary) 40%, black) 0%,\n var(--hw-primary) 50%,\n color-mix(in srgb, var(--hw-primary) 25%, black) 100%);\n }\n .hw-sheet {\n background: var(--hw-bg);\n }\n .hw-card {\n background: var(--hw-bg-hover);\n border-color: var(--hw-border);\n }\n .hw-card:hover {\n background: #333;\n }\n .hw-window {\n box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.06);\n }\n .hw-bubble:focus-visible {\n outline-color: var(--hw-text-3);\n }\n .hw-msg--visitor .hw-msg-bubble {\n background: var(--hw-primary);\n color: white;\n }\n .hw-msg-bubble code {\n background: rgba(255, 255, 255, 0.08);\n }\n .hw-msg-bubble pre {\n background: rgba(255, 255, 255, 0.08);\n }\n .hw-composer-box {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-composer-input {\n color: var(--hw-text);\n }\n .hw-tabs {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-conv-card:hover,\n .hw-recent-row:hover {\n background: var(--hw-bg-hover);\n }\n .hw-send-error {\n background: #450a0a;\n color: #fca5a5;\n }\n .hw-error-icon {\n background: #450a0a;\n color: #f87171;\n }\n .hw-resolved {\n border-color: var(--hw-border);\n }\n .hw-resolved-reopen,\n .hw-csat-btn {\n background: var(--hw-bg-hover);\n border-color: var(--hw-border-md);\n color: var(--hw-text);\n }\n .hw-hover-preview {\n background: #1c1c1e;\n border-color: var(--hw-border);\n }\n .hw-content-search-box {\n background: var(--hw-bg-hover);\n border-color: var(--hw-border-md);\n }\n .hw-preview {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n}\n.hw-widget[data-hw-placement=docked] {\n --hw-dock-width: 600px;\n --hw-dock-bar-width: 480px;\n --hw-dock-inset: 24px;\n --hw-bar-max-height: 148px;\n --hw-dock-surface: #ffffff;\n --hw-dock-on-surface: #111111;\n --hw-dock-pill-bg: rgba(44, 44, 48, 0.66);\n --hw-dock-pill-fg: rgba(255, 255, 255, 0.94);\n --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] {\n z-index: 2147483000;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock {\n position: fixed;\n left: 0;\n right: 0;\n bottom: var(--hw-dock-inset);\n z-index: 2147483000;\n display: flex;\n flex-direction: column;\n align-items: center;\n pointer-events: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock > * {\n pointer-events: auto;\n}\n.hw-dock-suggestions {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 9px;\n width: var(--hw-dock-bar-width, var(--hw-dock-width));\n max-width: calc(100vw - 32px);\n margin-bottom: 14px;\n}\n.hw-dock-pill-row {\n align-self: flex-start;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n animation: hw-dock-pill-in 0.42s cubic-bezier(0.2, 0.9, 0.3, 1) both;\n}\n.hw-dock-pill-dismiss {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n padding: 0;\n border: 0;\n background: none;\n color: var(--hw-dock-pill-fg);\n cursor: pointer;\n align-self: flex-start;\n margin-top: 8px;\n opacity: 0;\n transform: scale(0.85);\n transition:\n opacity 0.12s linear,\n transform 0.12s cubic-bezier(0.25, 1, 0.5, 1),\n color 0.12s linear;\n}\n.hw-dock-pill-dismiss svg {\n width: 11px;\n height: 11px;\n}\n.hw-dock-suggestions:hover .hw-dock-pill-dismiss,\n.hw-dock-suggestions:focus-within .hw-dock-pill-dismiss {\n opacity: 1;\n transform: none;\n}\n.hw-dock-pill-dismiss:hover {\n color: var(--hw-dock-on-surface);\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-pill-dismiss {\n transition: none;\n }\n}\n@media (hover: none) {\n .hw-dock-pill-dismiss {\n opacity: 1;\n transform: none;\n }\n}\n.hw-dock-pill {\n align-self: flex-start;\n padding: 10px 18px;\n border: 1px solid var(--hw-dock-pill-border, transparent);\n border-radius: 999px;\n cursor: pointer;\n font: inherit;\n font-size: 14px;\n font-weight: 500;\n text-align: left;\n background: var(--hw-dock-pill-bg);\n color: var(--hw-dock-pill-fg);\n backdrop-filter: blur(10px) saturate(1.2);\n -webkit-backdrop-filter: blur(10px) saturate(1.2);\n box-shadow: 0 4px 14px -8px rgba(12, 11, 10, 0.28);\n transition:\n background 0.16s,\n border-color 0.16s,\n transform 0.16s;\n}\n.hw-dock-pill {\n backdrop-filter: blur(18px);\n -webkit-backdrop-filter: blur(18px);\n}\n.hw-dock-pill:hover {\n background: color-mix(in srgb, var(--hw-dock-pill-bg) 100%, var(--hw-dock-on-surface) 8%);\n border-color: color-mix(in srgb, var(--hw-dock-pill-border) 100%, var(--hw-dock-on-surface) 10%);\n transform: translateX(3px);\n}\n@keyframes hw-dock-pill-in {\n from {\n opacity: 0;\n transform: translateY(10px) scale(0.97);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n.hw-dock-bar {\n display: flex;\n align-items: flex-end;\n gap: 10px;\n width: var(--hw-dock-bar-width, var(--hw-dock-width));\n max-width: calc(100vw - 32px);\n min-height: 52px;\n padding: 10px 10px 10px 18px;\n border: 0;\n border-radius: 26px;\n background: var(--hw-dock-surface);\n color: var(--hw-dock-on-surface);\n box-shadow:\n inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n 0 0 0 1px color-mix(in srgb, var(--hw-dock-on-surface) 7%, transparent),\n 0 2px 6px rgba(12, 11, 10, 0.18),\n 0 20px 48px -14px rgba(12, 11, 10, 0.45);\n transition:\n border-radius 0.18s ease,\n box-shadow 0.2s cubic-bezier(0.2, 0.8, 0.2, 1),\n width 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);\n}\n.hw-dock-bar:focus-within {\n box-shadow:\n inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n 0 0 0 1px color-mix(in srgb, var(--hw-primary, #fb923c) 60%, transparent),\n 0 2px 6px rgba(12, 11, 10, 0.18),\n 0 20px 48px -14px rgba(12, 11, 10, 0.45);\n}\n.hw-dock-bar[data-grown=true] {\n border-radius: 20px;\n}\n.hw-dock-input {\n flex: 1;\n min-width: 0;\n min-height: 20px;\n max-height: var(--hw-bar-max-height);\n padding: 6px 0;\n border: 0;\n outline: none;\n resize: none;\n overflow-y: auto;\n background: transparent;\n color: var(--hw-dock-on-surface);\n font: inherit;\n font-size: 14px;\n line-height: 1.45;\n transition: height 0.12s ease;\n}\n.hw-dock-input::placeholder {\n color: color-mix(in srgb, var(--hw-dock-on-surface) 45%, transparent);\n}\n.hw-dock-send {\n flex: none;\n width: 32px;\n height: 32px;\n margin-bottom: 1px;\n border: 0;\n border-radius: 50%;\n display: grid;\n place-items: center;\n cursor: pointer;\n background: var(--hw-primary, #fb923c);\n color: var(--hw-on-brand, #fff);\n transition: transform 0.16s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.16s;\n}\n.hw-dock-send:hover:not(:disabled) {\n transform: scale(1.06);\n}\n.hw-dock-send:disabled {\n opacity: 0.45;\n cursor: default;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n position: fixed;\n left: 50%;\n right: auto;\n margin-left: calc(var(--hw-dock-width) / -2);\n bottom: calc(var(--hw-dock-inset) + 66px);\n width: var(--hw-dock-width);\n max-width: calc(100vw - 32px);\n height: 420px;\n}\n@media (max-width: 640px) {\n .hw-widget[data-hw-placement=docked] .hw-window {\n left: 16px;\n right: 16px;\n margin-left: 0;\n width: auto;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-bubble {\n display: none;\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-window {\n bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-suggestions {\n display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-pill,\n .hw-dock-bar,\n .hw-dock-input,\n .hw-dock-send {\n animation: none;\n transition: none;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-composer,\n.hw-widget[data-hw-placement=docked] .hw-tabs,\n.hw-widget[data-hw-placement=docked] .hw-footer-tabs {\n display: none;\n}\n.hw-starters {\n display: flex;\n flex-direction: column;\n margin-top: 10px;\n border-radius: 14px;\n overflow: hidden;\n background: var(--hw-bg);\n box-shadow: inset 0 0 0 1px var(--hw-border);\n}\n.hw-starter {\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n padding: 11px 14px;\n border: 0;\n border-radius: 0;\n cursor: pointer;\n background: transparent;\n color: var(--hw-text);\n font: inherit;\n text-align: left;\n animation: hw-starter-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n transition: background 0.12s;\n}\n.hw-starter + .hw-starter {\n box-shadow: inset 0 1px 0 var(--hw-border);\n}\n.hw-starter:hover {\n background: var(--hw-bg-hover);\n}\n.hw-starter-text {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 1px;\n}\n.hw-starter-k {\n font-size: 13px;\n font-weight: 550;\n line-height: 1.35;\n color: var(--hw-text);\n}\n.hw-starter-q {\n font-size: 12px;\n line-height: 1.35;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-starter svg {\n flex: none;\n color: var(--hw-text-3, var(--hw-text-muted));\n opacity: 0.45;\n transition: opacity 0.15s, transform 0.15s;\n}\n.hw-starter:hover svg {\n opacity: 0.9;\n transform: translateX(2px);\n}\n@keyframes hw-starter-in {\n from {\n opacity: 0;\n transform: translateY(6px);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-header-back {\n display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-starter {\n animation: none;\n }\n}\n@media (prefers-color-scheme: dark) {\n .hw-widget:not([data-theme=light])[data-hw-placement=docked] {\n --hw-dock-surface: #1f1f23;\n --hw-dock-on-surface: #f4f4f6;\n --hw-dock-pill-bg: rgba(255, 255, 255, 0.1);\n --hw-dock-pill-fg: #e4e4e7;\n --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n }\n}\n.hw-widget[data-theme=dark][data-hw-placement=docked] {\n --hw-dock-surface: #1f1f23;\n --hw-dock-on-surface: #f4f4f6;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n --hw-bg: rgba(255, 255, 255, 0.08);\n --hw-bg-subtle: transparent;\n --hw-bg-hover: rgba(255, 255, 255, 0.1);\n --hw-border: rgba(255, 255, 255, 0.14);\n --hw-border-md: rgba(255, 255, 255, 0.22);\n --hw-text: rgba(255, 255, 255, 0.94);\n --hw-text-1: #ffffff;\n --hw-text-2: rgba(255, 255, 255, 0.72);\n --hw-text-3: rgba(255, 255, 255, 0.62);\n --hw-text-4: rgba(255, 255, 255, 0.46);\n --hw-visitor-bubble-bg: rgba(255, 255, 255, 0.16);\n --hw-visitor-bubble-text: #ffffff;\n --hw-brand: rgba(255, 255, 255, 0.92);\n --hw-on-brand: #17161a;\n --hw-focus-border: rgba(255, 255, 255, 0.34);\n --hw-focus-ring: rgba(255, 255, 255, 0.1);\n height: 500px;\n max-height: calc(100vh - 180px);\n border-radius: 24px;\n color: var(--hw-text);\n background:\n linear-gradient(\n 180deg,\n rgba(40, 40, 44, 0.72) 0%,\n rgba(46, 46, 50, 0.7) 55%,\n rgba(52, 52, 56, 0.68) 100%);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n .hw-widget[data-hw-placement=docked] .hw-window {\n background: #2c2c2e;\n }\n}\n@media (max-width: 640px) {\n .hw-widget[data-hw-placement=docked] .hw-window {\n height: min(60vh, 460px);\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-header--sub {\n padding: 14px 12px 8px 16px;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-status {\n display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-name {\n font-size: 15.5px;\n font-weight: 560;\n letter-spacing: -0.006em;\n color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-conv-name,\n.hw-widget[data-hw-placement=docked] .hw-event-name {\n font-weight: 545;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-bot-icon {\n border-radius: 50%;\n overflow: hidden;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-close:hover,\n.hw-widget[data-hw-placement=docked] .hw-header-menu-btn:hover {\n background: rgba(255, 255, 255, 0.12);\n color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-messages {\n padding: 4px 22px 16px;\n gap: 18px;\n -webkit-mask-image:\n linear-gradient(\n 180deg,\n transparent 0,\n #000 16px);\n mask-image:\n linear-gradient(\n 180deg,\n transparent 0,\n #000 16px);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--ai .hw-msg-bubble,\n.hw-widget[data-hw-placement=docked] .hw-msg--team .hw-msg-bubble {\n padding: 0;\n background: transparent;\n border-radius: 0;\n font-size: 15px;\n line-height: 1.55;\n color: var(--hw-text);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--visitor .hw-msg-bubble {\n background: rgba(255, 255, 255, 0.16);\n color: #ffffff;\n font-size: 14.5px;\n line-height: 1.5;\n}\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble pre,\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble code {\n background: rgba(0, 0, 0, 0.28);\n color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row {\n background: rgba(0, 0, 0, 0.26);\n border-color: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] .hw-window :focus-visible {\n outline-color: rgba(255, 255, 255, 0.55);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus,\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus-visible {\n outline: none;\n box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row:focus-within {\n border-color: rgba(255, 255, 255, 0.42);\n box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-submit {\n background: #ffffff;\n color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n position: relative;\n z-index: 3;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu {\n background: #3a3a3f;\n box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16), 0 18px 44px -12px rgba(12, 11, 10, 0.62);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button:hover {\n background: rgba(255, 255, 255, 0.11);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button.hw-header-menu-conv[data-active=true] {\n background: rgba(255, 255, 255, 0.09);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-convs {\n border-bottom-color: rgba(255, 255, 255, 0.12);\n}\n.hw-widget[data-hw-placement=docked] .hw-event--card {\n margin: 0;\n background: rgba(255, 255, 255, 0.08);\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-event-avatar {\n background: rgba(255, 255, 255, 0.14);\n color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview {\n position: fixed;\n left: 50%;\n right: auto;\n margin-left: calc(var(--hw-dock-bar-width, var(--hw-dock-width)) / -2);\n bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n width: var(--hw-dock-bar-width, var(--hw-dock-width));\n max-width: calc(100vw - 32px);\n border: 0;\n border-radius: 24px;\n color: rgba(255, 255, 255, 0.94);\n background:\n linear-gradient(\n 180deg,\n rgba(40, 40, 44, 0.74) 0%,\n rgba(52, 52, 56, 0.7) 100%);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-name,\n.hw-widget[data-hw-placement=docked] .hw-preview-body {\n color: rgba(255, 255, 255, 0.94);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close {\n color: rgba(255, 255, 255, 0.6);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close:hover {\n background: rgba(255, 255, 255, 0.12);\n color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-footer {\n color: rgba(255, 255, 255, 0.55);\n border-top-color: rgba(255, 255, 255, 0.1);\n}\n@media (max-width: 640px) {\n .hw-widget[data-hw-placement=docked] .hw-preview {\n left: 16px;\n right: 16px;\n margin-left: 0;\n width: auto;\n }\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n .hw-widget[data-hw-placement=docked] .hw-preview {\n background: #2c2c2e;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn {\n padding: 7px 14px;\n font-size: 13px;\n font-weight: 550;\n border-radius: 999px;\n background: rgba(255, 255, 255, 0.94);\n box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn:hover:not(:disabled) {\n background: #ffffff;\n box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn[data-tapped=true] {\n background: rgba(255, 255, 255, 0.22);\n color: #ffffff;\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);\n transform: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn svg {\n opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer {\n padding: 7px 14px;\n font-size: 13px;\n background: rgba(255, 255, 255, 0.94);\n color: #17161a;\n box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n transition:\n background 0.15s,\n box-shadow 0.15s,\n transform 0.15s;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer:hover {\n background: #ffffff;\n color: #17161a;\n box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-offer svg {\n opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar {\n --hw-dock-on-surface: rgba(255, 255, 255, 0.94);\n color: rgba(255, 255, 255, 0.94);\n background:\n linear-gradient(\n 180deg,\n rgba(44, 44, 48, 0.74) 0%,\n rgba(52, 52, 56, 0.72) 100%);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), 0 18px 40px -16px rgba(12, 11, 10, 0.45);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n width: var(--hw-dock-width);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar:focus-within {\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26), 0 18px 40px -16px rgba(12, 11, 10, 0.5);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 22px 52px -18px rgba(12, 11, 10, 0.52);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-send:not(:disabled) {\n background: #ffffff;\n color: #17161a;\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n .hw-widget[data-hw-placement=docked] .hw-dock-bar {\n background: #2c2c2e;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n transform-origin: 50% 100%;\n animation: hw-dock-panel-in 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing {\n animation: hw-dock-panel-out 0.18s cubic-bezier(0.4, 0, 1, 1) forwards;\n}\n@keyframes hw-dock-panel-in {\n from {\n opacity: 0;\n transform: translateY(14px) scale(0.98);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n@keyframes hw-dock-panel-out {\n from {\n opacity: 1;\n transform: none;\n }\n to {\n opacity: 0;\n transform: translateY(8px) scale(0.99);\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n animation: hw-dock-settle 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.06s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n animation: hw-dock-settle 0.34s cubic-bezier(0.16, 1, 0.3, 1) 0.11s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-header--sub,\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-messages {\n animation: none;\n}\n@keyframes hw-dock-settle {\n from {\n opacity: 0;\n transform: translateY(7px);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-widget[data-hw-placement=docked] .hw-window,\n .hw-widget[data-hw-placement=docked] .hw-window--closing,\n .hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub,\n .hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n animation: none;\n }\n}\n.hw-dock-bar {\n flex-wrap: wrap;\n padding-left: 18px;\n padding-right: 8px;\n}\n.hw-dock-error {\n width: var(--hw-dock-width);\n max-width: calc(100vw - 32px);\n margin-bottom: 8px;\n padding: 8px 14px;\n border-radius: 14px;\n background: rgba(190, 24, 40, 0.92);\n color: #ffffff;\n font-size: 12.5px;\n line-height: 1.35;\n box-shadow: 0 10px 26px -12px rgba(12, 11, 10, 0.5);\n animation: hw-dock-settle 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-error {\n animation: none;\n }\n}\n.hw-dock-previews {\n flex: 0 0 100%;\n order: -1;\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n padding: 2px 0 8px;\n}\n.hw-dock-lead {\n flex: none;\n display: grid;\n place-items: center;\n width: 32px;\n height: 32px;\n margin-left: -8px;\n}\n.hw-dock-actions {\n flex: none;\n display: flex;\n align-items: center;\n gap: 2px;\n margin-bottom: 1px;\n}\n.hw-dock-tool {\n display: grid;\n place-items: center;\n width: 30px;\n height: 30px;\n border: 0;\n border-radius: 50%;\n background: transparent;\n color: color-mix(in srgb, var(--hw-dock-on-surface) 52%, transparent);\n cursor: pointer;\n transition: background 0.15s, color 0.15s;\n}\n.hw-dock-tool:hover:not(:disabled) {\n background: color-mix(in srgb, var(--hw-dock-on-surface) 8%, transparent);\n color: var(--hw-dock-on-surface);\n}\n.hw-dock-tool:disabled {\n opacity: 0.4;\n cursor: default;\n}\n.hw-dock-tool[data-active=true] {\n color: #e11d48;\n background: rgba(225, 29, 72, 0.12);\n animation: hw-dock-listening 1.4s ease-in-out infinite;\n}\n@keyframes hw-dock-listening {\n 0%, 100% {\n box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.35);\n }\n 50% {\n box-shadow: 0 0 0 4px rgba(225, 29, 72, 0);\n }\n}\n.hw-dock-send:disabled {\n opacity: 1;\n background: color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent);\n color: color-mix(in srgb, var(--hw-dock-on-surface) 38%, transparent);\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-tool[data-active=true] {\n animation: none;\n }\n .hw-dock-bar {\n transition: none;\n }\n}\n.hw-dock-input:focus,\n.hw-dock-input:focus-visible {\n outline: none;\n box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-powered {\n display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-disconnect {\n border-radius: 20px 20px 0 0;\n}\n.hw-msg-meta {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n.hw-msg-author {\n font-weight: 550;\n}\n.hw-msg-meta-sep {\n opacity: 0.55;\n}\n.hw-header-actions {\n position: relative;\n display: flex;\n align-items: center;\n gap: 2px;\n}\n.hw-header-menu-btn {\n display: grid;\n place-items: center;\n width: 30px;\n height: 30px;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n background: transparent;\n color: var(--hw-text-2, var(--hw-text-muted));\n transition: background 0.15s, color 0.15s;\n}\n.hw-header-menu-btn:hover {\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n}\n.hw-header-menu {\n position: absolute;\n top: 36px;\n right: 0;\n z-index: 6;\n min-width: 236px;\n max-width: 288px;\n padding: 5px;\n border-radius: 14px;\n background: var(--hw-bg);\n color: var(--hw-text);\n box-shadow: 0 0 0 1px var(--hw-border), 0 12px 32px -10px rgba(0, 0, 0, 0.32);\n animation: hw-menu-in 0.16s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n}\n@keyframes hw-menu-in {\n from {\n opacity: 0;\n transform: translateY(-4px) scale(0.98);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n.hw-header-menu button {\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n padding: 9px 10px;\n border: 0;\n border-radius: 9px;\n cursor: pointer;\n background: transparent;\n color: var(--hw-text);\n font: inherit;\n font-size: 13px;\n text-align: left;\n transition: background 0.14s;\n}\n.hw-header-menu button:hover {\n background: var(--hw-bg-hover);\n}\n.hw-header-menu button svg {\n flex: none;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu button:hover svg {\n color: var(--hw-brand, var(--hw-primary));\n}\n.hw-header-menu-convs {\n display: flex;\n flex-direction: column;\n max-height: 168px;\n overflow-y: auto;\n padding-bottom: 5px;\n margin-bottom: 5px;\n border-bottom: 1px solid var(--hw-border);\n}\n.hw-header-menu button.hw-header-menu-conv {\n flex-direction: column;\n align-items: stretch;\n gap: 2px;\n padding: 8px 10px;\n}\n.hw-header-menu button.hw-header-menu-conv[data-active=true] {\n background: var(--hw-bg-hover);\n}\n.hw-header-menu-conv-top {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: 8px;\n}\n.hw-header-menu-conv-name {\n overflow: hidden;\n font-size: 12.5px;\n font-weight: 600;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.hw-header-menu-conv-time {\n flex: none;\n font-size: 11px;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu-conv-preview {\n overflow: hidden;\n font-size: 12px;\n color: var(--hw-text-2);\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.hw-offers {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin-top: 10px;\n}\n.hw-offer {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 8px 14px;\n border: 0;\n border-radius: 999px;\n cursor: pointer;\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n font: inherit;\n font-size: 12.5px;\n font-weight: 550;\n transition: background 0.15s, color 0.15s;\n}\n.hw-offer:hover {\n background: var(--hw-brand, var(--hw-primary));\n color: var(--hw-on-brand, #fff);\n}\n.hw-offer svg {\n flex: none;\n}\n.hw-sources {\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin-top: 8px;\n}\n.hw-source {\n display: flex;\n align-items: center;\n gap: 9px;\n padding: 7px 10px;\n border-radius: 9px;\n background: transparent;\n color: var(--hw-text);\n text-decoration: none;\n transition: background 0.15s;\n}\na.hw-source {\n cursor: pointer;\n}\na.hw-source:hover {\n background: var(--hw-bg-hover);\n}\n.hw-source-n {\n display: grid;\n place-items: center;\n flex: none;\n width: 16px;\n height: 16px;\n border-radius: 4px;\n background: var(--hw-brand, var(--hw-primary));\n color: var(--hw-on-brand, #fff);\n font-size: 10px;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n}\n.hw-source-title {\n flex: 1;\n min-width: 0;\n font-size: 12px;\n font-weight: 550;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n');
7772
+ styleInject(':host {\n all: initial;\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n "Helvetica Neue",\n Arial,\n sans-serif;\n font-size: 14px;\n line-height: 1.5;\n color: #1a1a1a;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget {\n font-family:\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n "Helvetica Neue",\n Arial,\n sans-serif;\n font-size: 14px;\n line-height: 1.5;\n color: #1a1a1a;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.hw-widget *,\n.hw-widget *::before,\n.hw-widget *::after {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n}\n.hw-widget :where(p, li, strong, b, em, i, u, s, small, a, code, pre, blockquote, h1, h2, h3, h4, h5, h6) {\n color: inherit;\n}\n:where(.hw-widget) {\n --hw-primary: #171717;\n --hw-primary-hover: #2a2a2a;\n --hw-brand: #171717;\n --hw-on-brand: #ffffff;\n --hw-focus-border: #9ca3af;\n --hw-focus-ring: rgba(0, 0, 0, 0.06);\n --hw-accent: #6366f1;\n --hw-bg: #ffffff;\n --hw-bg-subtle: #fafaf9;\n --hw-bg-hover: #f5f5f4;\n --hw-border: #ebe9e5;\n --hw-border-md: #e5e5e5;\n --hw-text: #1c1b19;\n --hw-text-1: #111;\n --hw-text-2: #666;\n --hw-text-3: #8a847c;\n --hw-text-4: #a8a29a;\n --hw-radius: 20px;\n --hw-visitor-bubble-bg: #f5f5f4;\n --hw-visitor-bubble-text: #1a1a1a;\n --hw-font:\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n "Helvetica Neue",\n Arial,\n sans-serif;\n}\n.hw-agent-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-agent-icon {\n width: 100%;\n height: 100%;\n border-radius: inherit;\n}\n.hw-widget :is(.hw-header-bot-icon, .hw-hero-bot-icon, .hw-conv-card-avatar, .hw-event-avatar, .hw-bubble-icon--bot):has(> .hw-agent-custom) {\n border-radius: 50%;\n background: transparent;\n padding: 0;\n}\n.hw-widget :focus-visible {\n outline: 2px solid var(--hw-primary);\n outline-offset: 2px;\n}\n.hw-widget :focus:not(:focus-visible) {\n outline: none;\n}\n.hw-widget {\n position: fixed;\n bottom: 20px;\n right: var(--hw-position-right, 20px);\n left: var(--hw-position-left, auto);\n z-index: 999999;\n font-family: var(--hw-font);\n}\n@keyframes hw-bubble-enter {\n from {\n opacity: 0;\n transform: scale(0.6);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n}\n.hw-bubble {\n width: 48px;\n height: 48px;\n border-radius: 14px;\n background: var(--hw-primary);\n color: white;\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;\n position: relative;\n overflow: visible;\n animation: hw-bubble-enter 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) both;\n}\n.hw-bubble--rounded {\n border-radius: 14px;\n}\n.hw-bubble--square {\n border-radius: 8px;\n}\n.hw-bubble--pill {\n border-radius: 24px;\n}\n.hw-bubble--launcher-bubble,\n.hw-bubble--launcher-help {\n width: auto;\n padding: 0 16px 0 12px;\n gap: 8px;\n border-radius: 24px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--square,\n.hw-bubble--launcher-help.hw-bubble--square {\n border-radius: 8px;\n}\n.hw-bubble--launcher-bubble.hw-bubble--rounded,\n.hw-bubble--launcher-help.hw-bubble--rounded {\n border-radius: 14px;\n}\n.hw-bubble-label {\n font-size: 14px;\n font-weight: 600;\n white-space: nowrap;\n line-height: 1;\n position: static;\n opacity: 1;\n transform: none;\n}\n.hw-bubble--launcher-bubble .hw-bubble-icon,\n.hw-bubble--launcher-help .hw-bubble-icon {\n position: static;\n}\n.hw-bubble:hover {\n transform: scale(1.05);\n box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);\n}\n.hw-bubble:active {\n transform: scale(0.95);\n}\n.hw-bubble--open {\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\n}\n.hw-bubble:focus-visible {\n outline: 2px solid white;\n outline-offset: 2px;\n}\n.hw-bubble-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;\n}\n.hw-bubble-icon svg:not(.hw-agent-custom svg) {\n width: 22px;\n height: 22px;\n}\n.hw-bubble-icon--hidden {\n transform: scale(0.3) rotate(90deg);\n opacity: 0;\n}\n.hw-bubble-icon--bot {\n}\n.hw-bubble--avatar .hw-bubble-icon--bot {\n width: 100%;\n height: 100%;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img {\n width: 100%;\n height: 100%;\n border-radius: 0;\n}\n.hw-agent-img.hw-agent-img--logo {\n object-fit: contain;\n padding: 10px;\n box-sizing: border-box;\n}\n.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img.hw-agent-img--logo {\n padding: 10px;\n box-sizing: border-box;\n object-fit: contain;\n}\n.hw-bubble-icon--close svg {\n width: 22px;\n height: 22px;\n}\n.hw-bubble-badge {\n position: absolute;\n top: -4px;\n right: -4px;\n min-width: 20px;\n height: 20px;\n border-radius: 10px;\n background: var(--hw-primary);\n color: white;\n font-size: 11px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 5px;\n border: 2px solid white;\n animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n@keyframes hw-badge-pop {\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n}\n.hw-bubble-badge::after {\n content: "";\n position: absolute;\n inset: -2px;\n border-radius: inherit;\n background: var(--hw-primary);\n opacity: 0;\n animation: hw-badge-pulse 2s ease-out infinite;\n}\n@keyframes hw-badge-pulse {\n 0% {\n opacity: 0.5;\n transform: scale(1);\n }\n 100% {\n opacity: 0;\n transform: scale(1.8);\n }\n}\n.hw-window {\n position: absolute;\n bottom: 72px;\n right: var(--hw-window-right, 0);\n left: var(--hw-window-left, auto);\n width: 440px;\n height: 640px;\n background: var(--hw-bg-subtle);\n color: var(--hw-text);\n border-radius: var(--hw-radius);\n box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.04);\n display: flex;\n flex-direction: column;\n overflow: hidden;\n animation: hw-window-open 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);\n transition: width 280ms cubic-bezier(0.4, 0, 0.2, 1), height 280ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.hw-window--reading {\n width: min(720px, calc(100vw - 40px));\n height: min(800px, calc(100vh - 112px));\n}\n:host([data-hw-mode="mobile"]) .hw-window,\n:host([data-hw-mode="mobile"]) .hw-window--reading {\n position: fixed;\n inset: 0;\n width: 100%;\n height: var(--hw-visible-height, 100%);\n border-radius: 0;\n box-shadow: none;\n animation: none;\n}\n:host([data-hw-mode="mobile"]) .hw-hero {\n background-color: color-mix(in srgb, var(--hw-primary) 60%, black);\n}\n:host([data-hw-mode="mobile"]) .hw-bubble {\n display: none;\n}\n.hw-window[data-hw-keyboard] .hw-composer {\n padding-bottom: 8px;\n}\n.hw-window[data-hw-keyboard] .hw-powered {\n display: none;\n}\n@keyframes hw-window-open {\n from {\n opacity: 0;\n transform: translateY(12px) scale(0.96);\n }\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n.hw-window--closing {\n animation: hw-window-close 0.2s ease forwards;\n}\n@keyframes hw-window-close {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n to {\n opacity: 0;\n transform: translateY(8px) scale(0.98);\n }\n}\n.hw-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n min-height: 0;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-window,\n .hw-window--closing,\n .hw-content,\n .hw-msg,\n .hw-bubble,\n .hw-bubble-icon,\n .hw-bubble-badge,\n .hw-bubble-badge::after,\n .hw-typing-dot,\n .hw-loading-dot {\n animation-duration: 0.01ms !important;\n transition-duration: 0.01ms !important;\n }\n}\n.hw-hero {\n flex-shrink: 0;\n background:\n linear-gradient(\n 160deg,\n color-mix(in srgb, var(--hw-primary) 60%, black) 0%,\n var(--hw-primary) 50%,\n color-mix(in srgb, var(--hw-primary) 40%, black) 100%);\n color: white;\n padding: 20px 22px 40px;\n}\n.hw-hero-top {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 16px;\n}\n.hw-hero-close {\n width: 30px;\n height: 30px;\n border-radius: 50%;\n border: none;\n background: rgba(255, 255, 255, 0.1);\n color: rgba(255, 255, 255, 0.6);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background 0.15s, color 0.15s;\n}\n.hw-hero-close:hover {\n background: rgba(255, 255, 255, 0.2);\n color: white;\n}\n.hw-hero-close:active {\n transform: scale(0.92);\n transition:\n transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n background 0.15s,\n color 0.15s;\n}\n.hw-hero-close svg {\n width: 20px;\n height: 20px;\n}\n.hw-hero-bot-icon {\n width: 36px;\n height: 36px;\n flex-shrink: 0;\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 10px;\n}\n.hw-hero-bot-icon > svg,\n.hw-hero-bot-icon > .hw-agent-icon > svg {\n width: 32px;\n height: 32px;\n}\n.hw-hero-bot-icon .hw-agent-img,\n.hw-hero-bot-icon .hw-agent-icon {\n border-radius: inherit;\n overflow: hidden;\n object-fit: contain;\n}\n.hw-hero-greeting {\n font-size: 26px;\n font-weight: 700;\n line-height: 1.15;\n margin-bottom: 6px;\n}\n.hw-hero-greeting-name {\n font-weight: 300;\n}\n.hw-hero-greeting-question {\n font-weight: 700;\n}\n.hw-hero-subtitle {\n font-size: 15px;\n color: rgba(255, 255, 255, 0.5);\n line-height: 1.35;\n}\n.hw-sheet {\n flex: 1;\n overflow-y: auto;\n min-height: 0;\n background: #ffffff;\n border-radius: 20px 20px 0 0;\n margin-top: -24px;\n box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);\n position: relative;\n z-index: 1;\n}\n.hw-sheet-inner {\n padding: 20px 16px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n.hw-header {\n display: flex;\n align-items: center;\n padding: 14px 12px 14px 16px;\n background: var(--hw-primary);\n color: white;\n flex-shrink: 0;\n gap: 10px;\n}\n.hw-header--sub {\n justify-content: space-between;\n background: transparent;\n color: var(--hw-text);\n border-bottom: 0;\n}\n.hw-header-back {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: color 0.15s, background 0.15s;\n flex-shrink: 0;\n}\n.hw-header-back svg {\n width: 18px;\n height: 18px;\n}\n.hw-header-back:hover {\n color: var(--hw-text);\n background: var(--hw-bg-subtle);\n}\n.hw-header-identity {\n display: flex;\n align-items: center;\n gap: 10px;\n flex: 1;\n min-width: 0;\n}\n.hw-header-bot-icon {\n width: 32px;\n height: 32px;\n flex-shrink: 0;\n color: var(--hw-text);\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 9px;\n background: var(--hw-agent-bg, var(--hw-agent-bg-default, transparent));\n}\n.hw-header-bot-icon > svg,\n.hw-header-bot-icon > .hw-agent-icon > svg {\n width: 24px;\n height: 24px;\n}\n.hw-header-bot-icon--team {\n background: var(--hw-brand, #0a0a0a);\n color: var(--hw-on-brand, #fff);\n}\n.hw-header-agent-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: inherit;\n}\n.hw-header-bot-icon .hw-agent-img,\n.hw-header-bot-icon .hw-agent-icon {\n border-radius: inherit;\n overflow: hidden;\n}\n.hw-header-bot-icon .hw-agent-img {\n object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n box-sizing: border-box;\n}\n.hw-widget[data-has-avatar=true] {\n --hw-agent-bg-default: var(--hw-primary);\n --hw-agent-fit-default: contain;\n --hw-agent-pad-default: 6px;\n}\n.hw-header-agent-initials {\n font-size: 11px;\n font-weight: 600;\n line-height: 1;\n}\n.hw-header-info {\n flex: 1;\n min-width: 0;\n}\n.hw-header-name {\n font-size: 15px;\n font-weight: 600;\n line-height: 1.3;\n}\n.hw-header-status {\n font-size: 11px;\n color: var(--hw-text-3);\n line-height: 1.3;\n}\n.hw-header-close {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition:\n background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n flex-shrink: 0;\n}\n.hw-header-close svg {\n width: 20px;\n height: 20px;\n}\n.hw-header-close:hover {\n background: var(--hw-bg-subtle);\n color: var(--hw-text);\n}\n.hw-header-close:active {\n transform: scale(0.92);\n}\n.hw-header--centered {\n justify-content: space-between;\n background: transparent;\n color: var(--hw-text);\n border-bottom: 0;\n}\n.hw-header--centered .hw-header-title {\n position: absolute;\n left: 50%;\n transform: translateX(-50%);\n max-width: calc(100% - 88px);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n text-align: center;\n}\n.hw-header-spacer {\n width: 28px;\n flex-shrink: 0;\n}\n.hw-header--messages {\n justify-content: space-between;\n background: transparent;\n color: var(--hw-text);\n border-bottom: 0;\n}\n.hw-header-title {\n font-size: 16px;\n font-weight: 600;\n}\n.hw-header-actions {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n.hw-header-action {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition:\n background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-header-action svg {\n width: 16px;\n height: 16px;\n}\n.hw-header-action:hover {\n background: var(--hw-bg-subtle);\n color: var(--hw-text);\n}\n.hw-header-action:active {\n transform: scale(0.94);\n}\n.hw-card {\n display: flex;\n align-items: center;\n gap: 12px;\n width: 100%;\n padding: 14px 16px;\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n cursor: pointer;\n transition: box-shadow 180ms cubic-bezier(0.23, 1, 0.32, 1), transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n text-align: left;\n color: var(--hw-text);\n font-family: inherit;\n}\n.hw-card:hover {\n box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.05);\n transform: translateY(-1px);\n}\n.hw-card:active {\n transform: translateY(0) scale(0.99);\n transition-duration: 120ms;\n}\n.hw-card-body {\n flex: 1;\n min-width: 0;\n}\n.hw-card-title {\n font-size: 14px;\n font-weight: 600;\n line-height: 1.3;\n color: var(--hw-text);\n}\n.hw-card-meta {\n font-size: 12px;\n color: var(--hw-text-3);\n line-height: 1.3;\n margin-top: 1px;\n}\n.hw-card-arrow {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: var(--hw-primary);\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n.hw-card-arrow svg {\n width: 14px;\n height: 14px;\n}\n.hw-msgs-tab {\n flex: 1;\n overflow-y: auto;\n padding: 12px 16px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.hw-recent-card {\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n overflow: hidden;\n}\n.hw-recent-header {\n font-size: 12px;\n font-weight: 600;\n color: var(--hw-text-2);\n padding: 12px 14px 0;\n}\n.hw-recent-row {\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n padding: 10px 14px;\n border: none;\n border-bottom: 1px solid var(--hw-border);\n background: none;\n cursor: pointer;\n text-align: left;\n font-family: inherit;\n color: var(--hw-text);\n transition: background-color 140ms cubic-bezier(0.23, 1, 0.32, 1), transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n position: relative;\n}\n.hw-recent-row:hover {\n background: rgba(0, 0, 0, 0.03);\n}\n.hw-recent-row:active {\n transform: scale(0.995);\n}\n.hw-recent-row--last {\n border-bottom: none;\n}\n.hw-recent-row .hw-conv-card-avatar {\n width: 32px;\n height: 32px;\n border-radius: 8px;\n}\n.hw-recent-row .hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n width: 18px;\n height: 18px;\n}\n.hw-recent-row .hw-conv-card-name {\n font-size: 13px;\n}\n.hw-recent-row .hw-conv-card-preview {\n font-size: 12px;\n}\n.hw-recent-row--unread .hw-conv-card-name {\n color: var(--hw-text);\n}\n.hw-recent-row--unread .hw-conv-card-time {\n color: var(--hw-primary);\n font-weight: 500;\n}\n.hw-recent-row-badge {\n min-width: 18px;\n height: 18px;\n border-radius: 9px;\n background: var(--hw-primary);\n color: white;\n font-size: 11px;\n font-weight: 600;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 5px;\n flex-shrink: 0;\n font-variant-numeric: tabular-nums;\n}\n.hw-recent-see-all {\n display: block;\n width: 100%;\n padding: 10px 14px;\n text-align: center;\n font-size: 13px;\n font-weight: 500;\n color: var(--hw-text);\n background: none;\n border: none;\n border-top: 1px solid var(--hw-border);\n cursor: pointer;\n font-family: inherit;\n transition: background 0.1s;\n}\n.hw-recent-see-all:hover {\n background: rgba(0, 0, 0, 0.02);\n}\n.hw-conv-card {\n position: relative;\n display: flex;\n flex-direction: column;\n gap: 4px;\n width: 100%;\n padding: 14px 16px;\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n cursor: pointer;\n transition: box-shadow 0.15s, transform 0.1s;\n text-align: left;\n font-family: inherit;\n color: var(--hw-text);\n}\n.hw-conv-card:hover {\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0, 0, 0, 0.04);\n}\n.hw-conv-card:active {\n transform: scale(0.99);\n}\n.hw-conv-card-row {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.hw-conv-card-avatar {\n width: 36px;\n height: 36px;\n border-radius: 10px;\n background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-subtle)));\n color: var(--hw-text-3);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n overflow: hidden;\n}\n.hw-conv-card-avatar svg:not(.hw-agent-custom svg) {\n width: 20px;\n height: 20px;\n}\n.hw-conv-card-avatar-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-conv-card-avatar .hw-agent-img {\n object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n box-sizing: border-box;\n}\n.hw-conv-card-avatar--team {\n background: var(--hw-brand, #0a0a0a);\n color: var(--hw-on-brand, #fff);\n}\n.hw-conv-card-avatar-initials {\n font-size: 12px;\n font-weight: 600;\n line-height: 1;\n letter-spacing: 0.02em;\n}\n.hw-conv-card-content {\n flex: 1;\n min-width: 0;\n}\n.hw-conv-card-top {\n display: flex;\n align-items: baseline;\n gap: 8px;\n}\n.hw-conv-card-name {\n flex: 1;\n font-size: 14px;\n font-weight: 600;\n color: var(--hw-text);\n}\n.hw-conv-card-time {\n font-size: 11px;\n color: var(--hw-text-3);\n flex-shrink: 0;\n font-variant-numeric: tabular-nums;\n}\n.hw-conv-card-preview {\n font-size: 13px;\n color: var(--hw-text-2);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n line-height: 1.4;\n margin-top: 1px;\n}\n.hw-conv-card--unread .hw-conv-card-name {\n color: var(--hw-text);\n}\n.hw-conv-card--unread .hw-conv-card-time {\n color: var(--hw-primary);\n font-weight: 500;\n}\n.hw-conv-card-badge {\n position: absolute;\n top: 12px;\n right: 12px;\n min-width: 18px;\n height: 18px;\n border-radius: 9px;\n background: var(--hw-primary);\n color: white;\n font-size: 11px;\n font-weight: 600;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 5px;\n font-variant-numeric: tabular-nums;\n}\n.hw-empty-state {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px;\n text-align: center;\n}\n.hw-empty-icon-wrap {\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background: var(--hw-bg-subtle);\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 16px;\n color: var(--hw-text-3);\n}\n.hw-empty-icon-wrap svg {\n width: 24px;\n height: 24px;\n}\n.hw-empty-title {\n font-size: 15px;\n font-weight: 600;\n color: var(--hw-text);\n margin-bottom: 4px;\n}\n.hw-empty-desc {\n font-size: 13px;\n color: var(--hw-text-3);\n margin-bottom: 20px;\n}\n.hw-empty-btn {\n padding: 8px 20px;\n border-radius: 10px;\n background: var(--hw-primary);\n color: white;\n border: none;\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n font-family: inherit;\n transition: background 0.15s;\n}\n.hw-empty-btn:hover {\n background: var(--hw-primary-hover);\n}\n.hw-tabs {\n display: flex;\n border-top: 1px solid var(--hw-border);\n flex-shrink: 0;\n background: var(--hw-bg-subtle);\n}\n.hw-tabs-item {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 2px;\n padding: 8px 0;\n border: none;\n background: none;\n cursor: pointer;\n font-family: inherit;\n font-size: 11px;\n font-weight: 500;\n color: var(--hw-text-3);\n transition: color 0.15s;\n}\n.hw-tabs-item svg {\n width: 22px;\n height: 22px;\n overflow: visible;\n}\n.hw-tabs-item--active {\n color: var(--hw-text);\n}\n.hw-tabs-item:hover {\n color: var(--hw-text-2);\n}\n.hw-tabs-item:active {\n transform: scale(0.94);\n transition: transform 0.14s cubic-bezier(0.23, 1, 0.32, 1), color 0.15s;\n}\n.hw-tabs-icon-wrap {\n position: relative;\n display: inline-flex;\n}\n.hw-tabs-badge {\n position: absolute;\n top: -6px;\n right: -10px;\n min-width: 16px;\n height: 16px;\n border-radius: 8px;\n background: var(--hw-primary);\n color: white;\n font-size: 10px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0 4px;\n font-variant-numeric: tabular-nums;\n}\n.hw-messages {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 16px 14px 8px;\n background: var(--hw-bg-subtle);\n display: flex;\n flex-direction: column;\n gap: 14px;\n overscroll-behavior: contain;\n min-width: 0;\n scrollbar-color: rgba(0, 0, 0, 0.2) transparent;\n scrollbar-width: thin;\n -webkit-mask-image:\n linear-gradient(\n 180deg,\n transparent 0,\n #000 12px);\n mask-image:\n linear-gradient(\n 180deg,\n transparent 0,\n #000 12px);\n}\n.hw-messages::-webkit-scrollbar {\n width: 10px;\n height: 10px;\n}\n.hw-messages::-webkit-scrollbar-track {\n background: transparent;\n}\n.hw-messages::-webkit-scrollbar-thumb {\n background: rgba(0, 0, 0, 0.16);\n background-clip: content-box;\n border: 3px solid transparent;\n border-radius: 999px;\n}\n.hw-messages::-webkit-scrollbar-thumb:hover {\n background: rgba(0, 0, 0, 0.28);\n background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages {\n scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.2);\n background-clip: content-box;\n}\n.hw-widget[data-theme=dark] .hw-messages::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.32);\n background-clip: content-box;\n}\n.hw-empty {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px;\n color: var(--hw-text-3);\n text-align: center;\n}\n.hw-empty-icon {\n width: 40px;\n height: 40px;\n margin-bottom: 12px;\n opacity: 0.3;\n}\n.hw-empty-text {\n font-size: 13px;\n}\n.hw-date-sep {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 0;\n}\n.hw-date-sep-line {\n flex: 1;\n height: 1px;\n background: var(--hw-border-md);\n}\n.hw-date-sep-text {\n font-size: 11px;\n color: var(--hw-text-3);\n font-weight: 500;\n white-space: nowrap;\n}\n.hw-msg {\n display: flex;\n padding: 4px 0;\n max-width: 75%;\n min-width: 0;\n animation: hw-msg-appear 0.25s ease-out;\n}\n@keyframes hw-msg-appear {\n from {\n opacity: 0;\n transform: translateY(6px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.hw-msg--visitor {\n align-self: flex-end;\n}\n.hw-msg--team,\n.hw-msg--ai {\n align-self: flex-start;\n}\n.hw-msg--ai {\n width: 100%;\n max-width: 100%;\n}\n.hw-msg-body {\n display: flex;\n flex-direction: column;\n min-width: 0;\n max-width: 100%;\n}\n.hw-msg-bubble {\n padding: 10px 14px;\n border-radius: 16px;\n font-size: 14px;\n line-height: 1.45;\n white-space: pre-wrap;\n word-break: break-word;\n overflow-wrap: anywhere;\n max-width: 100%;\n}\n.hw-msg--visitor .hw-msg-bubble {\n background: var(--hw-primary);\n color: white;\n border-bottom-right-radius: 4px;\n}\n.hw-msg--team .hw-msg-bubble {\n background: var(--hw-visitor-bubble-bg);\n color: var(--hw-visitor-bubble-text);\n border-bottom-left-radius: 4px;\n}\n.hw-msg--ai .hw-msg-bubble {\n background: var(--hw-visitor-bubble-bg);\n color: var(--hw-text);\n border-bottom-left-radius: 4px;\n white-space: normal;\n max-width: min(100%, 640px);\n}\n.hw-msg--ai .hw-msg-body {\n width: 100%;\n}\n.hw-msg--ai .hw-msg-bubble:has(.hw-code),\n.hw-msg--ai .hw-msg-bubble:has(pre) {\n width: 100%;\n}\n.hw-quick-replies {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin-top: 8px;\n}\n.hw-quick-reply-btn {\n font: inherit;\n font-size: 13px;\n font-weight: 500;\n padding: 6px 14px;\n border-radius: 18px;\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n background: var(--hw-bg, #fff);\n color: var(--hw-text-1, #1a1a1a);\n cursor: pointer;\n transition:\n background 120ms ease,\n border-color 120ms ease,\n box-shadow 120ms ease,\n transform 80ms ease;\n line-height: 1.3;\n}\n.hw-quick-reply-btn:hover:not(:disabled) {\n border-color: var(--hw-primary);\n background: color-mix(in srgb, var(--hw-primary) 8%, transparent);\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);\n}\n.hw-quick-reply-btn:active:not(:disabled) {\n transform: scale(0.97);\n}\n.hw-quick-reply-btn:disabled {\n cursor: default;\n opacity: 0.4;\n}\n.hw-quick-reply-btn[data-tapped=true] {\n background: var(--hw-primary);\n color: white;\n border-color: var(--hw-primary);\n opacity: 1;\n}\n.hw-quick-replies[data-cancelled=true] .hw-quick-reply-btn {\n border-color: var(--hw-border);\n color: var(--hw-text-3);\n}\n.hw-msg--ai .hw-code {\n width: 100%;\n box-sizing: border-box;\n}\n.hw-msg-meta {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: 11px;\n color: var(--hw-text-2);\n margin-top: 2px;\n padding: 0 4px;\n font-variant-numeric: tabular-nums;\n}\n.hw-msg-time {\n white-space: nowrap;\n}\n.hw-msg--visitor .hw-msg-meta {\n text-align: right;\n}\n.hw-msg--team .hw-msg-body,\n.hw-msg--ai .hw-msg-body {\n align-items: flex-start;\n}\n.hw-msg--visitor .hw-msg-body {\n align-items: flex-end;\n}\n.hw-typing {\n display: flex;\n flex-direction: column;\n gap: 3px;\n padding: 8px 0;\n width: fit-content;\n animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-typing-dots {\n display: flex;\n gap: 3px;\n padding: 6px 2px;\n width: fit-content;\n}\n.hw-typing-dot {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: var(--hw-text-3);\n animation: hw-typing-bounce 1.4s infinite;\n}\n.hw-typing-dot:nth-child(2) {\n animation-delay: 0.2s;\n}\n.hw-typing-dot:nth-child(3) {\n animation-delay: 0.4s;\n}\n@keyframes hw-typing-bounce {\n 0%, 60%, 100% {\n transform: translateY(0);\n }\n 30% {\n transform: translateY(-4px);\n }\n}\n.hw-streaming-cursor {\n display: inline-block;\n width: 2px;\n height: 1em;\n background: currentColor;\n opacity: 0.6;\n margin-left: 1px;\n vertical-align: text-bottom;\n animation: hw-cursor-blink 0.8s step-end infinite;\n}\n@keyframes hw-cursor-blink {\n 50% {\n opacity: 0;\n }\n}\n.hw-link-preview {\n display: flex;\n flex-direction: column;\n gap: 0;\n border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n border-radius: 10px;\n overflow: hidden;\n text-decoration: none;\n color: inherit;\n margin-top: 6px;\n transition: background 0.15s;\n min-height: 44px;\n max-width: 100%;\n text-align: start;\n}\n.hw-link-preview:hover {\n background: var(--hw-bg-hover, rgba(0, 0, 0, 0.02));\n}\n.hw-link-preview-img {\n width: 100%;\n height: 56px;\n flex: 0 0 56px;\n object-fit: cover;\n object-position: top;\n border-radius: 0;\n}\n.hw-link-preview-body {\n padding: 8px 10px;\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 0;\n justify-content: center;\n}\n.hw-link-preview-favicon {\n width: 14px;\n height: 14px;\n flex: 0 0 14px;\n border-radius: 3px;\n}\n.hw-widget[data-hw-placement=docked] .hw-link-preview-favicon {\n box-sizing: content-box;\n padding: 2px;\n background: #ffffff;\n}\n.hw-link-preview-host {\n direction: ltr;\n min-width: 0;\n overflow-wrap: anywhere;\n word-break: break-all;\n}\n.hw-link-preview-title {\n font-size: 12.5px;\n font-weight: 600;\n line-height: 1.3;\n color: var(--hw-text, #1a1a1a);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n overflow-wrap: anywhere;\n}\n.hw-link-preview-desc {\n font-size: 11.5px;\n line-height: 1.4;\n color: var(--hw-text-2, #6b7280);\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n overflow-wrap: anywhere;\n}\n.hw-link-preview-url {\n display: flex;\n align-items: center;\n gap: 6px;\n min-width: 0;\n font-size: 11px;\n color: var(--hw-text-2);\n}\n.hw-msg-links {\n display: flex;\n flex-direction: column;\n gap: 6px;\n max-width: 240px;\n}\n.hw-loading {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-loading-dots {\n display: flex;\n gap: 4px;\n}\n.hw-loading-dot {\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--hw-text-4);\n animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-loading-dot:nth-child(2) {\n animation-delay: 0.2s;\n}\n.hw-loading-dot:nth-child(3) {\n animation-delay: 0.4s;\n}\n@keyframes hw-loading-pulse {\n 0%, 60%, 100% {\n opacity: 0.3;\n transform: scale(0.8);\n }\n 30% {\n opacity: 1;\n transform: scale(1);\n }\n}\n@keyframes hw-skeleton-shimmer {\n 0% {\n background-position: -200px 0;\n }\n 100% {\n background-position: calc(200px + 100%) 0;\n }\n}\n.hw-skeleton {\n background:\n linear-gradient(\n 90deg,\n var(--hw-bg-subtle) 25%,\n rgba(0, 0, 0, 0.04) 50%,\n var(--hw-bg-subtle) 75%);\n background-size: 200px 100%;\n animation: hw-skeleton-shimmer 1.5s ease-in-out infinite;\n border-radius: 6px;\n}\n.hw-skeleton-messages {\n flex: 1;\n display: flex;\n flex-direction: column;\n padding: 16px;\n gap: 16px;\n}\n.hw-skeleton-msg {\n display: flex;\n gap: 10px;\n align-items: flex-start;\n}\n.hw-skeleton-msg--right {\n flex-direction: row-reverse;\n}\n.hw-skeleton-avatar {\n width: 28px;\n height: 28px;\n border-radius: 8px;\n flex-shrink: 0;\n}\n.hw-skeleton-bubble {\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.hw-skeleton-line {\n height: 12px;\n border-radius: 6px;\n}\n.hw-skeleton-convs {\n display: flex;\n flex-direction: column;\n padding: 8px 0;\n}\n.hw-skeleton-conv {\n display: flex;\n gap: 10px;\n align-items: center;\n padding: 10px 16px;\n}\n.hw-skeleton-conv-avatar {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n flex-shrink: 0;\n}\n.hw-skeleton-conv-lines {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 6px;\n}\n.hw-skeleton-content {\n display: flex;\n flex-direction: column;\n padding: 12px 16px;\n gap: 12px;\n}\n.hw-skeleton-content-item {\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding: 12px;\n border-radius: 10px;\n background: var(--hw-bg);\n}\n.hw-skeleton-title {\n height: 22px;\n width: 65%;\n border-radius: 6px;\n}\n.hw-skeleton-badge {\n width: 42px;\n height: 18px;\n border-radius: 9px;\n}\n.hw-skeleton-date {\n width: 60px;\n height: 12px;\n border-radius: 6px;\n}\n.hw-skeleton-h2 {\n height: 16px;\n border-radius: 6px;\n}\n.hw-skeleton-bullet {\n padding-left: 20px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.hw-skeleton-bullet-line {\n height: 14px;\n border-radius: 7px;\n}\n.hw-email-card {\n max-width: min(100%, 340px);\n margin: 0;\n padding: 0;\n border: 0;\n border-radius: 0;\n background: none;\n box-shadow: none;\n animation: hw-email-slide-in 0.25s ease-out;\n}\n@keyframes hw-email-slide-in {\n from {\n opacity: 0;\n transform: translateY(8px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.hw-email-card-title {\n font-size: 14px;\n font-weight: 550;\n color: var(--hw-text, #1a1a1a);\n line-height: 1.3;\n margin: 0 0 2px;\n}\n.hw-email-card-subtitle {\n font-size: 12px;\n color: var(--hw-text-2, #888);\n line-height: 1.4;\n margin: 0;\n}\n.hw-email-card-row {\n max-width: 300px;\n display: flex;\n align-items: center;\n gap: 6px;\n margin-top: 9px;\n padding: 3px 3px 3px 12px;\n border-radius: 999px;\n border: 1px solid var(--hw-border, rgba(0,0,0,0.1));\n background: var(--hw-bg-subtle, #fafafa);\n transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-email-card-row:focus-within {\n border-color: var(--hw-focus-border, rgba(0,0,0,0.2));\n box-shadow: 0 0 0 2px var(--hw-focus-ring, rgba(0,0,0,0.06));\n}\n.hw-email-card-input {\n flex: 1;\n min-width: 0;\n padding: 6px 0;\n border: 0;\n background: transparent;\n color: var(--hw-text, #1a1a1a);\n font: inherit;\n font-size: 13px;\n outline: none;\n}\n.hw-email-card-input::placeholder {\n color: var(--hw-text-3, #999);\n}\n.hw-email-card-row:has(.hw-email-card-input--error) {\n border-color: #ef4444;\n}\n.hw-email-card-submit {\n flex: none;\n display: grid;\n place-items: center;\n width: 28px;\n height: 28px;\n border: none;\n border-radius: 50%;\n background: var(--hw-brand, #0a0a0a);\n color: var(--hw-on-brand, #fff);\n cursor: pointer;\n transition: opacity 0.15s, transform 0.15s;\n}\n.hw-email-card-submit:hover:not(:disabled) {\n transform: scale(1.06);\n}\n.hw-email-card-submit:disabled {\n opacity: 0.45;\n cursor: default;\n}\n.hw-email-card--success {\n display: flex;\n align-items: center;\n gap: 6px;\n padding: 2px 0;\n font-size: 13px;\n color: var(--hw-text-2, #888);\n animation: hw-email-slide-in 0.2s ease-out;\n}\n.hw-email-card--success svg {\n flex-shrink: 0;\n}\n.hw-composer {\n display: flex;\n flex-direction: column;\n padding: 12px 16px;\n background: transparent;\n flex-shrink: 0;\n}\n.hw-composer--compact {\n padding: 8px 12px;\n}\n.hw-composer-box {\n display: flex;\n flex-direction: column;\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n border-radius: 16px;\n overflow: hidden;\n transition: border-color 0.2s;\n background: var(--hw-bg);\n}\n.hw-composer-box:focus-within {\n border-color: var(--hw-focus-border);\n box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-composer-input {\n resize: none;\n border: none;\n padding: 12px 16px 4px;\n font-size: 14px;\n font-family: inherit;\n line-height: 1.4;\n outline: none;\n min-height: 40px;\n max-height: 220px;\n background: transparent;\n color: var(--hw-text);\n field-sizing: content;\n}\n.hw-composer-input:focus {\n outline: none;\n}\n.hw-composer-input:focus-visible {\n outline: none;\n}\n.hw-composer-input::placeholder {\n color: var(--hw-text-4);\n}\n.hw-composer-toolbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 4px 10px 10px;\n}\n.hw-composer-toolbar-left {\n display: flex;\n align-items: center;\n gap: 4px;\n}\n.hw-composer-send {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: none;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n transition:\n background-color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n color 140ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 140ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n.hw-composer-send:active:not(:disabled) {\n transform: scale(0.9);\n}\n.hw-composer-send--active {\n background: var(--hw-primary);\n color: white;\n}\n.hw-composer-send--inactive {\n background: var(--hw-border);\n color: var(--hw-text-4);\n cursor: default;\n}\n.hw-composer-send svg {\n width: 14px;\n height: 14px;\n}\n.hw-composer-charcount {\n font-size: 11px;\n color: var(--hw-text-3);\n font-variant-numeric: tabular-nums;\n opacity: 1;\n transform: translateY(0);\n transition:\n color 180ms cubic-bezier(0.23, 1, 0.32, 1),\n opacity 180ms cubic-bezier(0.23, 1, 0.32, 1),\n transform 180ms cubic-bezier(0.23, 1, 0.32, 1);\n}\n@starting-style {\n .hw-composer-charcount {\n opacity: 0;\n transform: translateY(3px);\n }\n}\n.hw-composer-charcount--over {\n color: #ef4444;\n font-weight: 600;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-composer-charcount {\n transform: none;\n transition: color 160ms ease, opacity 160ms ease;\n }\n @starting-style {\n .hw-composer-charcount {\n transform: none;\n }\n }\n}\n.hw-composer-previews {\n display: flex;\n gap: 6px;\n padding: 8px 10px 0;\n overflow-x: auto;\n scrollbar-width: none;\n}\n.hw-composer-previews::-webkit-scrollbar {\n display: none;\n}\n.hw-composer-preview {\n position: relative;\n width: 48px;\n height: 48px;\n border-radius: 8px;\n overflow: hidden;\n flex-shrink: 0;\n background: var(--hw-border);\n cursor: pointer;\n}\n.hw-composer-preview--error {\n outline: 2px solid #ef4444;\n outline-offset: -2px;\n}\n.hw-composer-preview-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-composer-preview-file {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--hw-bg-subtle);\n}\n.hw-composer-preview-ext {\n font-size: 10px;\n font-weight: 700;\n color: var(--hw-text-3);\n text-transform: uppercase;\n}\n.hw-composer-preview-loader {\n position: absolute;\n inset: 0;\n background: rgba(0, 0, 0, 0.35);\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-composer-preview-loader::after {\n content: "";\n width: 16px;\n height: 16px;\n border: 2px solid rgba(255, 255, 255, 0.3);\n border-top-color: white;\n border-radius: 50%;\n animation: hw-spin 0.6s linear infinite;\n}\n@keyframes hw-spin {\n to {\n transform: rotate(360deg);\n }\n}\n.hw-composer-preview-badge {\n position: absolute;\n top: 2px;\n right: 2px;\n width: 16px;\n height: 16px;\n border-radius: 50%;\n background: #ef4444;\n color: white;\n font-size: 10px;\n font-weight: 700;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-composer-preview-remove {\n position: absolute;\n top: 2px;\n right: 2px;\n width: 18px;\n height: 18px;\n border-radius: 50%;\n border: none;\n background: rgba(0, 0, 0, 0.55);\n color: white;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n opacity: 0;\n transition: opacity 0.15s;\n}\n.hw-composer-preview-remove svg {\n width: 10px;\n height: 10px;\n}\n.hw-composer-preview:hover .hw-composer-preview-remove {\n opacity: 1;\n}\n.hw-composer-attach {\n width: 28px;\n height: 28px;\n border: none;\n background: none;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 6px;\n opacity: 0.7;\n transition: opacity 0.15s;\n}\n.hw-composer-attach:hover {\n opacity: 1;\n}\n.hw-composer-attach svg {\n width: 16px;\n height: 16px;\n}\n.hw-msg-images {\n display: flex;\n flex-direction: column;\n gap: 4px;\n margin-bottom: 4px;\n}\n.hw-msg-image-link {\n display: block;\n border-radius: 14px;\n overflow: hidden;\n line-height: 0;\n}\n.hw-msg-image {\n max-width: 140px;\n max-height: 80px;\n object-fit: cover;\n border-radius: 8px;\n outline: 1px solid rgba(0, 0, 0, 0.08);\n outline-offset: -1px;\n}\n.hw-msg-files {\n display: flex;\n flex-direction: column;\n gap: 4px;\n margin-top: 4px;\n}\n.hw-msg-file {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n border-radius: 10px;\n background: var(--hw-bg-subtle);\n text-decoration: none;\n color: var(--hw-text);\n transition: background 0.15s;\n}\n.hw-msg-file:hover {\n background: var(--hw-border);\n}\n.hw-msg-file-icon {\n flex-shrink: 0;\n width: 20px;\n height: 20px;\n color: var(--hw-text-3);\n}\n.hw-msg-file-icon svg {\n width: 100%;\n height: 100%;\n}\n.hw-msg-file-info {\n display: flex;\n flex-direction: column;\n min-width: 0;\n}\n.hw-msg-file-name {\n font-size: 13px;\n font-weight: 500;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.hw-msg-file-size {\n font-size: 11px;\n color: var(--hw-text-3);\n}\n.hw-msg-image-link {\n cursor: pointer;\n border: none;\n padding: 0;\n background: none;\n display: block;\n line-height: 0;\n}\n.hw-hover-preview {\n position: fixed;\n z-index: 2147483001;\n padding: 6px;\n border-radius: 14px;\n background: white;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(0, 0, 0, 0.06);\n cursor: pointer;\n animation: hw-hover-in 0.15s ease-out;\n}\n@media (prefers-color-scheme: dark) {\n .hw-hover-preview {\n background: #1c1c1e;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.08);\n }\n}\n@keyframes hw-hover-in {\n from {\n opacity: 0;\n transform: scale(0.96) translateY(4px);\n }\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n.hw-hover-preview-img {\n width: 100%;\n max-height: 200px;\n object-fit: contain;\n border-radius: 10px;\n display: block;\n outline: 1px solid rgba(0, 0, 0, 0.08);\n outline-offset: -1px;\n}\n.hw-hover-preview--doc {\n display: flex;\n align-items: center;\n gap: 10px;\n padding: 10px 14px;\n}\n.hw-hover-preview-doc-icon {\n width: 28px;\n height: 28px;\n flex-shrink: 0;\n}\n.hw-hover-preview-doc-icon svg {\n width: 100%;\n height: 100%;\n}\n.hw-hover-preview-doc-info {\n display: flex;\n flex-direction: column;\n min-width: 0;\n}\n.hw-hover-preview-doc-name {\n font-size: 13px;\n font-weight: 500;\n color: var(--hw-text);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.hw-hover-preview-doc-hint {\n font-size: 11px;\n color: var(--hw-text-3);\n}\n.hw-event {\n display: flex;\n justify-content: center;\n padding: 8px 16px;\n}\n.hw-event-text {\n font-size: 12px;\n color: var(--hw-text-3);\n text-align: center;\n}\n.hw-event--card {\n justify-content: flex-start;\n align-items: center;\n gap: 10px;\n background: var(--hw-bg-subtle);\n padding: 10px 14px;\n border-radius: 12px;\n margin: 4px 16px;\n}\n.hw-event-avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n background: var(--hw-agent-bg, var(--hw-agent-bg-default, var(--hw-bg-hover, #e0e0e0)));\n color: var(--hw-text-2, #555);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 11px;\n font-weight: 600;\n flex-shrink: 0;\n overflow: hidden;\n}\n.hw-event-avatar-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n}\n.hw-event-avatar .hw-agent-img {\n object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));\n padding: var(--hw-agent-pad, var(--hw-agent-pad-default, 0));\n box-sizing: border-box;\n}\n.hw-event-body {\n font-size: 13px;\n line-height: 1.3;\n}\n.hw-event-name {\n font-weight: 600;\n color: var(--hw-text);\n}\n.hw-event-action {\n color: var(--hw-text-2);\n}\n.hw-new {\n flex: 1;\n display: flex;\n flex-direction: column;\n background: var(--hw-bg-subtle);\n}\n.hw-new-body {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px 24px;\n text-align: center;\n}\n.hw-new-welcome {\n flex: 1;\n padding: 16px 20px;\n overflow-y: auto;\n}\n.hw-new-heading {\n font-size: 17px;\n font-weight: 600;\n color: var(--hw-text);\n margin-bottom: 6px;\n}\n.hw-new-desc {\n font-size: 13px;\n color: var(--hw-text-2);\n margin-bottom: 24px;\n}\n.hw-powered {\n text-align: center;\n padding: 8px;\n font-size: 11px;\n color: var(--hw-text-4);\n flex-shrink: 0;\n}\n.hw-powered a {\n color: var(--hw-text-2);\n text-decoration: none;\n font-weight: 500;\n}\n.hw-powered a:hover {\n color: var(--hw-text);\n}\n@media (max-width: 479px) {\n .hw-widget {\n bottom: 16px;\n right: 16px;\n left: auto;\n }\n .hw-window {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: var(--hw-visible-height, 100%);\n border-radius: 0;\n animation: hw-mob-up 0.3s cubic-bezier(0.22, 1, 0.36, 1);\n }\n .hw-window--closing {\n animation: hw-mob-down 0.2s ease forwards;\n }\n @keyframes hw-mob-up {\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n @keyframes hw-mob-down {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(100%);\n }\n }\n .hw-hero {\n padding-top: calc(20px + env(safe-area-inset-top, 0px));\n }\n .hw-header {\n padding-top: env(safe-area-inset-top, 0px);\n }\n .hw-tabs {\n padding-bottom: env(safe-area-inset-bottom, 0px);\n }\n .hw-composer {\n padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));\n }\n .hw-powered {\n padding-bottom: calc(5px + env(safe-area-inset-bottom, 0px));\n }\n .hw-window:has(.hw-powered) .hw-composer {\n padding-bottom: 8px;\n }\n .hw-window:has(.hw-powered) .hw-tabs {\n padding-bottom: 0;\n }\n .hw-header-close,\n .hw-header-back,\n .hw-header-action {\n width: 34px;\n height: 34px;\n }\n .hw-composer-send {\n width: 40px;\n height: 40px;\n }\n .hw-window ~ .hw-bubble {\n display: none;\n }\n .hw-messages {\n padding: 12px 14px;\n }\n .hw-msg {\n max-width: 82%;\n }\n .hw-msg--ai {\n max-width: 100%;\n }\n}\n.hw-preview {\n position: absolute;\n bottom: calc(100% + 12px);\n right: 0;\n width: 300px;\n max-width: calc(100vw - 40px);\n background: var(--hw-bg);\n border: 1px solid var(--hw-border);\n border-radius: 16px;\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);\n animation: hw-preview-in 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n overflow: hidden;\n cursor: pointer;\n transition: transform 0.15s, box-shadow 0.15s;\n}\n.hw-preview.hw-preview--anchored {\n position: static;\n bottom: auto;\n right: auto;\n width: 100%;\n max-width: 100%;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar {\n background: none;\n}\n.hw-preview.hw-preview--anchored .hw-preview-avatar img,\n.hw-preview.hw-preview--anchored .hw-preview-avatar svg:not(.hw-agent-custom svg) {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n.hw-preview:hover {\n transform: translateY(-2px);\n box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15), 0 4px 12px rgba(0, 0, 0, 0.08);\n}\n@keyframes hw-preview-in {\n from {\n opacity: 0;\n transform: translateY(8px) scale(0.95);\n }\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n}\n@keyframes hw-preview-out {\n from {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n to {\n opacity: 0;\n transform: translateY(8px) scale(0.95);\n }\n}\n.hw-preview-header {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 14px 0;\n}\n.hw-preview-avatar {\n width: 28px;\n height: 28px;\n border-radius: 50%;\n background:\n linear-gradient(\n 135deg,\n var(--hw-primary),\n color-mix(in srgb, var(--hw-primary) 50%, black));\n display: flex;\n align-items: center;\n justify-content: center;\n color: white;\n flex-shrink: 0;\n overflow: hidden;\n}\n.hw-preview-avatar svg:not(.hw-agent-custom svg) {\n width: 16px;\n height: 16px;\n}\n.hw-preview-avatar img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n}\n.hw-preview-name {\n font-size: 13px;\n font-weight: 600;\n color: var(--hw-text);\n flex: 1;\n}\n.hw-preview-close {\n width: 24px;\n height: 24px;\n border: none;\n background: transparent;\n color: var(--hw-text-3);\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n transition: background 0.15s, color 0.15s;\n flex-shrink: 0;\n}\n.hw-preview-close:hover {\n background: var(--hw-bg-subtle);\n color: var(--hw-text-2);\n}\n.hw-preview-close:active {\n transform: scale(0.90);\n transition:\n transform 0.14s cubic-bezier(0.23, 1, 0.32, 1),\n background 0.15s,\n color 0.15s;\n}\n.hw-preview-close svg {\n width: 12px;\n height: 12px;\n}\n.hw-preview-body {\n padding: 4px 14px;\n font-size: 14px;\n line-height: 1.45;\n color: var(--hw-text-2);\n}\n.hw-preview-body:first-of-type {\n padding-top: 8px;\n}\n.hw-preview-body:last-child {\n padding-bottom: 14px;\n}\n.hw-preview-footer {\n margin-top: 2px;\n padding: 8px 14px 12px;\n border-top: 1px solid var(--hw-border);\n font-size: 11px;\n line-height: 1.3;\n color: var(--hw-text-2);\n opacity: 0.65;\n}\n.hw-preview-prompt {\n padding: 2px 14px 6px;\n font-size: 14px;\n font-weight: 500;\n color: var(--hw-text-1);\n}\n.hw-preview-quick-replies {\n padding: 0 14px 14px;\n margin-top: 0;\n}\n.hw-awaiting {\n margin-top: 2px;\n padding-left: 44px;\n font-size: 11px;\n line-height: 1.4;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-preview-dock {\n position: absolute;\n bottom: calc(100% + 12px);\n right: 0;\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n gap: 8px;\n pointer-events: none;\n}\n.hw-preview-dock > .hw-preview,\n.hw-preview-dock > .hw-preview-stack {\n position: relative;\n bottom: auto;\n right: auto;\n pointer-events: auto;\n}\n.hw-preview--closing {\n animation: hw-preview-out 0.2s ease-in forwards;\n}\n.hw-preview-stack {\n position: absolute;\n bottom: calc(100% + 12px);\n right: 0;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.hw-preview-stack .hw-preview {\n position: relative;\n bottom: auto;\n right: auto;\n}\n.hw-preview-stack.hw-preview-stack--anchored {\n position: static;\n bottom: auto;\n right: auto;\n width: 100%;\n}\n.hw-preview-more {\n align-self: flex-end;\n padding: 4px 10px;\n border: 0;\n border-radius: 999px;\n background: var(--hw-bg);\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08), inset 0 0 0 1px var(--hw-border);\n color: var(--hw-text-2);\n font: inherit;\n font-size: 12px;\n line-height: 1.4;\n cursor: pointer;\n transition: background 0.12s, color 0.12s;\n}\n.hw-preview-more:hover {\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n}\n.hw-preview--announcement {\n width: 340px;\n}\n.hw-preview--announcement .hw-preview-body--title {\n font-weight: 600;\n color: var(--hw-text);\n font-size: 15px;\n line-height: 1.3;\n padding-top: 10px;\n}\n.hw-preview--announcement .hw-preview-body--desc {\n font-size: 13px;\n color: var(--hw-text-2);\n line-height: 1.5;\n padding-bottom: 16px;\n}\n.hw-announcement-badge {\n display: inline-block;\n margin: 8px 14px 0;\n padding: 2px 8px;\n font-size: 10px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--hw-primary);\n background: color-mix(in srgb, var(--hw-primary) 10%, transparent);\n border-radius: 4px;\n}\n.hw-whats-new {\n border-radius: 14px;\n background: var(--hw-bg);\n border: 0;\n box-shadow: inset 0 0 0 1px var(--hw-border);\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.03);\n overflow: hidden;\n}\n.hw-whats-new-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 12px 14px 0;\n}\n.hw-whats-new-title {\n font-size: 12px;\n font-weight: 600;\n color: var(--hw-text-2);\n}\n.hw-whats-new-view-all {\n font-size: 11px;\n font-weight: 500;\n color: var(--hw-primary);\n background: none;\n border: none;\n cursor: pointer;\n padding: 0;\n font-family: inherit;\n}\n.hw-whats-new-view-all:hover {\n opacity: 0.8;\n}\n.hw-whats-new-list {\n display: flex;\n flex-direction: column;\n}\n.hw-whats-new-item {\n display: flex;\n flex-direction: column;\n gap: 2px;\n width: 100%;\n padding: 10px 14px;\n border: none;\n border-bottom: 1px solid var(--hw-border);\n background: none;\n cursor: pointer;\n text-align: left;\n font-family: inherit;\n color: var(--hw-text);\n transition: background-color 140ms ease;\n}\n.hw-whats-new-item:last-child {\n border-bottom: none;\n}\n.hw-whats-new-item:hover {\n background: rgba(0, 0, 0, 0.03);\n}\n.hw-whats-new-item-top {\n display: flex;\n align-items: center;\n gap: 8px;\n}\n.hw-whats-new-badge {\n font-size: 10px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--hw-primary);\n}\n.hw-whats-new-time {\n font-size: 11px;\n color: var(--hw-text-3);\n margin-left: auto;\n}\n.hw-whats-new-item-title {\n font-size: 13px;\n font-weight: 600;\n color: var(--hw-text);\n line-height: 1.3;\n display: flex;\n align-items: baseline;\n gap: 8px;\n}\n.hw-whats-new-time-inline {\n font-size: 11px;\n font-weight: 400;\n color: var(--hw-text-3);\n margin-left: auto;\n flex-shrink: 0;\n}\n.hw-whats-new-item-body {\n font-size: 12px;\n color: var(--hw-text-2);\n line-height: 1.4;\n}\n.hw-tabs-dot {\n position: absolute;\n top: -2px;\n right: -6px;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: var(--hw-primary);\n animation: hw-badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);\n}\n.hw-bubble-badge-dot {\n display: block;\n width: 8px;\n height: 8px;\n border-radius: 50%;\n background: white;\n}\n.hw-content-search {\n padding: 10px 16px;\n}\n.hw-content-search-box {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background: var(--hw-bg);\n border: 1px solid var(--hw-border-md);\n border-radius: 10px;\n transition: border-color 0.15s, box-shadow 0.15s;\n}\n.hw-content-search-box:focus-within {\n border-color: var(--hw-focus-border);\n box-shadow: 0 0 0 3px var(--hw-focus-ring);\n}\n.hw-content-search-input {\n flex: 1;\n border: none !important;\n outline: none !important;\n box-shadow: none !important;\n background: none;\n font-size: 13px;\n color: var(--hw-text-1);\n font-family: inherit;\n line-height: 1;\n -webkit-appearance: none;\n}\n.hw-content-search-input:focus,\n.hw-content-search-input:focus-visible {\n outline: none !important;\n box-shadow: none !important;\n border: none !important;\n}\n.hw-content-search-input::placeholder {\n color: var(--hw-text-3);\n}\n.hw-content-search-icon {\n width: 15px;\n height: 15px;\n color: var(--hw-text-3);\n flex-shrink: 0;\n}\n.hw-content-list {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n.hw-content-entries {\n flex: 1;\n overflow-y: auto;\n overscroll-behavior: contain;\n}\n.hw-content-entry {\n display: block;\n width: 100%;\n padding: 14px 16px;\n border: none;\n border-bottom: 1px solid var(--hw-border);\n background: none;\n cursor: pointer;\n text-align: left;\n transition: background-color 0.15s ease;\n -webkit-tap-highlight-color: transparent;\n}\n.hw-content-entry:hover {\n background: var(--hw-bg-hover);\n}\n.hw-content-entry:active {\n background: var(--hw-border);\n}\n.hw-content-entry:last-child {\n border-bottom: none;\n}\n.hw-content-entry-main {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.hw-content-entry-text {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 3px;\n}\n.hw-content-entry-title {\n font-size: 14px;\n font-weight: 600;\n color: var(--hw-text-1);\n line-height: 1.3;\n}\n.hw-content-entry-desc {\n font-size: 13px;\n color: var(--hw-text-2);\n line-height: 1.4;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n.hw-content-entry-meta {\n display: flex;\n align-items: center;\n gap: 6px;\n margin-top: 2px;\n}\n.hw-content-entry-badge {\n font-size: 11px;\n font-weight: 500;\n color: var(--hw-text-3);\n background: var(--hw-bg-hover);\n padding: 1px 6px;\n border-radius: 4px;\n}\n.hw-content-entry-date {\n font-size: 11px;\n color: var(--hw-text-3);\n}\n.hw-content-entry-chevron {\n width: 16px;\n height: 16px;\n color: var(--hw-text-3);\n flex-shrink: 0;\n opacity: 0.5;\n}\n.hw-content-detail {\n padding: 16px;\n overflow-y: auto;\n overscroll-behavior: contain;\n flex: 1;\n min-height: 0;\n}\n.hw-content-detail-header {\n margin-bottom: 16px;\n}\n.hw-content-detail-title {\n font-size: 17px;\n font-weight: 700;\n color: var(--hw-text-1);\n margin: 0 0 6px;\n line-height: 1.3;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n.hw-content-detail-meta {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-wrap: wrap;\n}\n.hw-content-detail-date {\n font-size: 12px;\n color: var(--hw-text-3);\n}\n.hw-content-detail-body {\n font-size: 14px;\n line-height: 1.6;\n color: var(--hw-text-1);\n}\n.hw-markdown h1 {\n font-size: 17px;\n font-weight: 700;\n margin: 0;\n}\n.hw-markdown h2 {\n font-size: 15px;\n font-weight: 600;\n margin: 0;\n}\n.hw-markdown h3 {\n font-size: 14px;\n font-weight: 600;\n margin: 0;\n}\n.hw-markdown p {\n margin: 0;\n}\n.hw-markdown p:empty,\n.hw-markdown div:empty,\n.hw-markdown p:has(> br:only-child),\n.hw-markdown div:has(> br:only-child) {\n display: none;\n}\n.hw-markdown > * + * {\n margin-top: 12px;\n}\n.hw-markdown > * + h1,\n.hw-markdown > * + h2 {\n margin-top: 20px;\n}\n.hw-markdown > * + h3 {\n margin-top: 16px;\n}\n.hw-markdown > h1 + *,\n.hw-markdown > h2 + *,\n.hw-markdown > h3 + * {\n margin-top: 8px;\n}\n.hw-markdown > *:first-child {\n margin-top: 0;\n}\n.hw-markdown > *:last-child {\n margin-bottom: 0;\n}\n.hw-markdown > br {\n display: none;\n}\n.hw-markdown ul,\n.hw-markdown ol {\n margin: 0;\n padding-left: 20px;\n}\n.hw-markdown li {\n margin: 4px 0;\n}\n.hw-markdown code {\n font-family:\n ui-monospace,\n "SF Mono",\n monospace;\n font-size: 12px;\n background: var(--hw-bg-hover);\n padding: 1px 5px;\n border-radius: 4px;\n}\n.hw-table-wrap {\n margin: 10px 0;\n overflow-x: auto;\n border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n border-radius: 10px;\n}\n.hw-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 13px;\n}\n.hw-table th {\n text-align: left;\n font-weight: 600;\n font-size: 12px;\n padding: 8px 12px;\n background: var(--hw-bg-hover, #f5f5f4);\n border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n}\n.hw-table td {\n padding: 8px 12px;\n border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n vertical-align: top;\n}\n.hw-table tbody tr:last-child td {\n border-bottom: none;\n}\n.hw-code {\n margin: 10px 0;\n border-radius: 10px;\n overflow: hidden;\n border: 1px solid var(--hw-border, rgba(0, 0, 0, 0.08));\n background: var(--hw-bg-hover, #f5f5f4);\n font-family:\n ui-monospace,\n "SF Mono",\n "Menlo",\n monospace;\n}\n.hw-code-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 10px;\n padding: 7px 8px 7px 12px;\n font-size: 11px;\n color: var(--hw-text-2, #6b7280);\n background: rgba(0, 0, 0, 0.03);\n border-bottom: 1px solid var(--hw-border, rgba(0, 0, 0, 0.06));\n}\n.hw-code-lang {\n text-transform: lowercase;\n letter-spacing: 0.02em;\n font-weight: 500;\n}\n.hw-code-actions {\n display: inline-flex;\n align-items: center;\n gap: 1px;\n}\n.hw-code-action {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 22px;\n height: 22px;\n padding: 0;\n font-family: inherit;\n color: var(--hw-text-2, #6b7280);\n background: transparent;\n border: 1px solid transparent;\n border-radius: 6px;\n cursor: pointer;\n opacity: 0.62;\n transition:\n background 120ms ease,\n color 120ms ease,\n opacity 120ms ease,\n scale 120ms ease;\n}\n.hw-code-action:hover {\n color: var(--hw-text, #111);\n background: rgba(0, 0, 0, 0.06);\n opacity: 1;\n}\n.hw-code-action:active {\n scale: 0.96;\n}\n.hw-code-action svg {\n width: 13px;\n height: 13px;\n}\n.hw-code-copy-icon,\n.hw-code-check-icon {\n position: absolute;\n inset: 50% auto auto 50%;\n transition:\n opacity 180ms cubic-bezier(0.2, 0, 0, 1),\n scale 180ms cubic-bezier(0.2, 0, 0, 1),\n filter 180ms cubic-bezier(0.2, 0, 0, 1);\n translate: -50% -50%;\n}\n.hw-code-check-icon {\n filter: blur(4px);\n opacity: 0;\n scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-copy-icon {\n filter: blur(4px);\n opacity: 0;\n scale: 0.25;\n}\n.hw-code-copy--copied .hw-code-check-icon {\n filter: blur(0);\n opacity: 1;\n scale: 1;\n}\n.hw-code-copy-label {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n}\n.hw-code-copy--copied {\n color: #16a34a;\n}\n.hw-code-copy--failed {\n color: #dc2626;\n}\n.hw-code pre {\n margin: 0;\n padding: 10px 12px;\n background: transparent;\n border-radius: 0;\n overflow-x: auto;\n max-width: 100%;\n max-height: 320px;\n scrollbar-color: rgba(0, 0, 0, 0.22) transparent;\n scrollbar-width: thin;\n}\n.hw-code pre::-webkit-scrollbar {\n width: 10px;\n height: 10px;\n}\n.hw-code pre::-webkit-scrollbar-track {\n background: transparent;\n}\n.hw-code pre::-webkit-scrollbar-thumb {\n background: rgba(0, 0, 0, 0.18);\n background-clip: content-box;\n border: 3px solid transparent;\n border-radius: 999px;\n}\n.hw-code pre::-webkit-scrollbar-thumb:hover {\n background: rgba(0, 0, 0, 0.28);\n background-clip: content-box;\n}\n.hw-code pre code {\n display: block;\n background: transparent;\n padding: 0;\n font-size: 12px;\n line-height: 1.55;\n white-space: pre;\n color: var(--hw-text, #111);\n}\n@media (prefers-color-scheme: dark) {\n .hw-code {\n background: rgba(255, 255, 255, 0.04);\n border-color: rgba(255, 255, 255, 0.08);\n }\n .hw-code-header {\n background: rgba(255, 255, 255, 0.03);\n border-bottom-color: rgba(255, 255, 255, 0.06);\n }\n .hw-code-action:hover,\n .hw-code-action:focus-visible {\n background: rgba(255, 255, 255, 0.08);\n }\n .hw-code pre {\n scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n }\n .hw-code pre::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.22);\n background-clip: content-box;\n }\n .hw-code pre::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.32);\n background-clip: content-box;\n }\n}\n.hw-markdown pre {\n margin: 8px 0;\n padding: 10px 12px;\n background: var(--hw-bg-hover);\n border-radius: 8px;\n overflow-x: auto;\n max-width: 100%;\n}\n.hw-markdown pre code {\n display: block;\n background: transparent;\n padding: 0;\n border-radius: 0;\n font-size: 12px;\n line-height: 1.5;\n white-space: pre;\n word-break: normal;\n color: inherit;\n}\n.hw-msg-bubble pre {\n margin: 6px 0;\n padding: 8px 10px;\n background: rgba(0, 0, 0, 0.06);\n border-radius: 6px;\n overflow-x: auto;\n max-width: 100%;\n}\n.hw-msg-bubble pre code {\n background: transparent;\n padding: 0;\n font-size: 12px;\n line-height: 1.5;\n white-space: pre;\n}\n.hw-msg-bubble .hw-code pre {\n margin: 0;\n padding: 10px 12px;\n background: transparent;\n border-radius: 0;\n}\n.hw-msg-bubble .hw-code pre code {\n background: transparent;\n padding: 0;\n font-size: 12px;\n line-height: 1.55;\n}\n.hw-msg--team .hw-msg-bubble pre,\n.hw-msg--visitor .hw-msg-bubble pre {\n background: rgba(255, 255, 255, 0.12);\n}\n.hw-markdown blockquote {\n margin: 0 0 12px;\n padding: 8px 12px;\n border-left: 3px solid var(--hw-border);\n color: var(--hw-text-2);\n font-style: italic;\n}\n.hw-markdown a {\n color: var(--hw-primary);\n text-decoration: underline;\n text-underline-offset: 2px;\n}\n.hw-markdown img {\n max-width: 100%;\n border-radius: 8px;\n margin: 8px 0;\n outline: 1px solid rgba(0, 0, 0, 0.08);\n outline-offset: -1px;\n}\n.hw-markdown hr {\n border: none;\n border-top: 1px solid var(--hw-border);\n margin: 16px 0;\n}\n.hw-content-empty {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n text-align: center;\n}\n.hw-content-empty-title {\n font-size: 14px;\n font-weight: 600;\n color: var(--hw-text-1);\n margin-bottom: 4px;\n}\n.hw-content-empty-desc {\n font-size: 12px;\n color: var(--hw-text-3);\n}\n.hw-content-loading {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 20px;\n}\n.hw-content-load-more {\n display: block;\n width: 100%;\n padding: 10px;\n border: none;\n background: none;\n color: var(--hw-primary);\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n text-align: center;\n}\n.hw-content-load-more:hover {\n background: var(--hw-bg-hover);\n}\n.hw-content-load-more:disabled {\n opacity: 0.5;\n cursor: default;\n}\n@media (hover: none) {\n .hw-composer-preview-remove {\n opacity: 0.7;\n }\n}\n.hw-composer--dragging .hw-composer-box {\n border-color: var(--hw-primary);\n background: color-mix(in srgb, var(--hw-primary) 4%, transparent);\n}\n.hw-composer-drop-overlay {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background: color-mix(in srgb, var(--hw-bg) 90%, transparent);\n border: 2px dashed var(--hw-primary);\n border-radius: 12px;\n z-index: 10;\n pointer-events: none;\n animation: hw-drop-pulse 1.5s ease-in-out infinite;\n}\n.hw-composer-drop-text {\n font-size: 13px;\n font-weight: 500;\n color: var(--hw-primary);\n}\n@keyframes hw-drop-pulse {\n 0%, 100% {\n opacity: 0.8;\n }\n 50% {\n opacity: 1;\n }\n}\n.hw-disconnect {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 7px;\n padding: 7px 14px;\n background: var(--hw-bg-hover);\n color: var(--hw-text-2);\n font-size: 11.5px;\n font-weight: 500;\n letter-spacing: -0.01em;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n flex-shrink: 0;\n animation: hw-disconnect-in 0.18s cubic-bezier(0.22, 1, 0.36, 1);\n}\n@keyframes hw-disconnect-in {\n from {\n opacity: 0;\n transform: translateY(-100%);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.hw-disconnect-retry {\n flex: none;\n padding: 2px 4px;\n margin: -2px 0;\n border: 0;\n border-radius: 4px;\n background: none;\n color: var(--hw-text);\n font: inherit;\n font-weight: 600;\n text-decoration: underline;\n text-underline-offset: 2px;\n cursor: pointer;\n}\n.hw-disconnect-retry:hover {\n text-decoration-thickness: 2px;\n}\n.hw-disconnect-retry:focus-visible {\n outline: 2px solid var(--hw-text);\n outline-offset: 1px;\n}\n.hw-disconnect-spinner {\n width: 9px;\n height: 9px;\n border: 1.5px solid currentColor;\n border-top-color: transparent;\n border-radius: 50%;\n opacity: 0.75;\n flex-shrink: 0;\n animation: hw-spin 0.7s linear infinite;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-disconnect {\n animation: none;\n }\n .hw-disconnect-spinner {\n animation: none;\n border-top-color: currentColor;\n opacity: 0.5;\n }\n}\n.hw-error-state {\n flex: 1;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 32px 24px;\n text-align: center;\n gap: 12px;\n}\n.hw-error-icon {\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background: #fef2f2;\n color: #ef4444;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n.hw-error-icon svg {\n width: 24px;\n height: 24px;\n}\n.hw-error-title {\n font-size: 15px;\n font-weight: 600;\n color: var(--hw-text);\n}\n.hw-error-desc {\n font-size: 13px;\n color: var(--hw-text-2);\n}\n.hw-error-btn {\n padding: 8px 20px;\n border: 1px solid var(--hw-border-md);\n border-radius: 8px;\n background: var(--hw-bg);\n color: var(--hw-text);\n font-size: 13px;\n font-weight: 500;\n cursor: pointer;\n transition: background 0.15s;\n}\n.hw-error-btn:hover {\n background: var(--hw-bg-hover);\n}\n.hw-send-error {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n background: #fef2f2;\n color: #dc2626;\n font-size: 12px;\n font-weight: 500;\n flex-shrink: 0;\n animation: hw-msg-appear 0.25s ease-out;\n}\n.hw-send-error-retry {\n margin-left: auto;\n padding: 2px 8px;\n border: 1px solid #fca5a5;\n border-radius: 4px;\n background: none;\n color: #dc2626;\n font-size: 11px;\n font-weight: 600;\n cursor: pointer;\n}\n.hw-send-error-retry:hover {\n background: #fee2e2;\n}\n.hw-resolved {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 10px 14px;\n border-top: 1px solid var(--hw-border);\n flex-shrink: 0;\n}\n.hw-resolved-status {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12.5px;\n font-weight: 550;\n color: var(--hw-text);\n}\n.hw-resolved-status svg {\n flex: none;\n color: var(--hw-text-2);\n}\n.hw-csat {\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-wrap: wrap;\n gap: 6px 10px;\n}\n.hw-csat-label,\n.hw-csat-error {\n font-size: 12px;\n color: var(--hw-text-2);\n}\n.hw-csat-error {\n color: var(--hw-text);\n}\n.hw-csat-buttons {\n display: flex;\n gap: 6px;\n}\n.hw-csat-btn {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n height: 30px;\n padding: 0 11px;\n border: 1px solid var(--hw-border-md);\n border-radius: 999px;\n background: var(--hw-bg);\n color: var(--hw-text);\n font: inherit;\n font-size: 12px;\n font-weight: 550;\n cursor: pointer;\n transition: background 0.15s, border-color 0.15s;\n}\n.hw-csat-btn svg {\n flex: none;\n}\n.hw-csat-btn:hover {\n background: var(--hw-bg-hover);\n}\n.hw-csat-btn:focus-visible {\n outline: 2px solid var(--hw-text);\n outline-offset: 2px;\n}\n.hw-csat-btn[aria-pressed=true] {\n background: var(--hw-bg-hover);\n border-color: var(--hw-brand, var(--hw-primary));\n box-shadow: inset 0 0 0 1px var(--hw-brand, var(--hw-primary));\n cursor: default;\n}\n.hw-load-more-trigger {\n display: flex;\n justify-content: center;\n min-height: 1px;\n}\n.hw-load-more-trigger:has(.hw-load-more-spinner) {\n padding: 8px 0;\n}\n.hw-load-more-spinner {\n display: flex;\n gap: 3px;\n}\n.hw-load-more-spinner > div {\n width: 5px;\n height: 5px;\n border-radius: 50%;\n background: var(--hw-text-4);\n animation: hw-loading-pulse 1.4s infinite;\n}\n.hw-load-more-spinner > div:nth-child(2) {\n animation-delay: 0.2s;\n}\n.hw-load-more-spinner > div:nth-child(3) {\n animation-delay: 0.4s;\n}\n.hw-drag-handle {\n display: none;\n}\n@media (max-width: 479px) {\n .hw-drag-handle {\n display: flex;\n justify-content: center;\n padding: 8px 0 4px;\n flex-shrink: 0;\n }\n .hw-drag-handle-pill {\n width: 32px;\n height: 4px;\n border-radius: 2px;\n background: var(--hw-text-4);\n }\n}\n.hw-msg-bubble p {\n margin: 0 0 8px;\n}\n.hw-msg-bubble p:last-child {\n margin-bottom: 0;\n}\n.hw-msg-bubble strong {\n font-weight: 600;\n}\n.hw-msg-bubble em {\n font-style: italic;\n}\n.hw-msg-bubble a {\n color: inherit;\n text-decoration: underline;\n text-decoration-thickness: 1px;\n text-underline-offset: 2px;\n text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);\n word-break: normal;\n overflow-wrap: anywhere;\n}\n.hw-msg-bubble a:hover {\n opacity: 0.8;\n}\n.hw-msg--visitor .hw-msg-bubble a {\n color: rgba(255, 255, 255, 0.9);\n}\n.hw-msg--visitor .hw-msg-bubble a:hover {\n color: white;\n}\n.hw-msg-bubble ul,\n.hw-msg-bubble ol {\n margin: 4px 0 8px;\n padding-left: 20px;\n}\n.hw-msg-bubble li {\n margin: 2px 0;\n}\n.hw-msg-bubble code {\n padding: 1px 4px;\n border-radius: 3px;\n background: rgba(0, 0, 0, 0.06);\n font-size: 0.9em;\n font-family:\n ui-monospace,\n SFMono-Regular,\n Menlo,\n monospace;\n}\n.hw-msg-bubble pre {\n margin: 4px 0 8px;\n padding: 8px 10px;\n border-radius: 6px;\n background: rgba(0, 0, 0, 0.06);\n overflow-x: auto;\n font-size: 0.85em;\n}\n.hw-msg-bubble pre code {\n padding: 0;\n background: none;\n}\n.hw-msg-bubble blockquote {\n margin: 4px 0 8px;\n padding: 4px 0 4px 12px;\n border-left: 3px solid var(--hw-border-md);\n color: var(--hw-text-2);\n}\n.hw-widget[data-theme=dark] {\n --hw-bg: #1c1c1e;\n --hw-bg-subtle: #161618;\n --hw-bg-hover: #2c2c2e;\n --hw-border: rgba(255, 255, 255, 0.08);\n --hw-border-md: rgba(255, 255, 255, 0.14);\n --hw-text: #f5f5f5;\n --hw-text-1: #f5f5f5;\n --hw-text-2: #a1a1aa;\n --hw-text-3: #71717a;\n --hw-text-4: #52525b;\n --hw-visitor-bubble-bg: #2c2c2e;\n --hw-visitor-bubble-text: #f5f5f5;\n --hw-focus-border: rgba(255, 255, 255, 0.28);\n --hw-focus-ring: rgba(255, 255, 255, 0.08);\n --hw-brand: #f5f5f5;\n --hw-on-brand: #1c1c1e;\n}\n@media (prefers-color-scheme: dark) {\n .hw-widget:not([data-theme=light]) .hw-messages {\n scrollbar-color: rgba(255, 255, 255, 0.26) transparent;\n }\n .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb {\n background: rgba(255, 255, 255, 0.2);\n background-clip: content-box;\n }\n .hw-widget:not([data-theme=light]) .hw-messages::-webkit-scrollbar-thumb:hover {\n background: rgba(255, 255, 255, 0.32);\n background-clip: content-box;\n }\n .hw-widget:not([data-theme=light]) {\n --hw-bg: #1c1c1e;\n --hw-bg-subtle: #161618;\n --hw-bg-hover: #2c2c2e;\n --hw-border: rgba(255, 255, 255, 0.08);\n --hw-border-md: rgba(255, 255, 255, 0.14);\n --hw-text: #f5f5f5;\n --hw-text-1: #f5f5f5;\n --hw-text-2: #a1a1aa;\n --hw-text-3: #71717a;\n --hw-text-4: #52525b;\n --hw-visitor-bubble-bg: #2c2c2e;\n --hw-visitor-bubble-text: #f5f5f5;\n --hw-focus-border: rgba(255, 255, 255, 0.28);\n --hw-focus-ring: rgba(255, 255, 255, 0.08);\n --hw-brand: #f5f5f5;\n --hw-on-brand: #1c1c1e;\n }\n}\n@media (prefers-color-scheme: dark) {\n .hw-widget:not([data-theme=light]) .hw-header {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-header-bot-icon {\n background: var(--hw-bg-hover);\n }\n .hw-header-name,\n .hw-header-title {\n color: var(--hw-text);\n }\n .hw-header-status {\n color: var(--hw-text-2);\n }\n .hw-header-close,\n .hw-header-back {\n color: var(--hw-text-2);\n }\n .hw-header-close:hover,\n .hw-header-back:hover {\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n }\n .hw-content-entry {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-content-entry:hover {\n background: var(--hw-bg-hover);\n border-color: var(--hw-border-md);\n }\n .hw-content-empty,\n .hw-empty {\n color: var(--hw-text-3);\n }\n .hw-conv-card {\n border-color: var(--hw-border);\n }\n .hw-recent-row {\n border-color: var(--hw-border);\n }\n .hw-composer-drop-overlay {\n background: rgba(0, 0, 0, 0.6);\n color: var(--hw-text);\n }\n .hw-composer--dragging .hw-composer-box {\n border-color: var(--hw-focus-border);\n box-shadow: 0 0 0 3px var(--hw-focus-ring);\n }\n .hw-hero {\n background:\n linear-gradient(\n 160deg,\n color-mix(in srgb, var(--hw-primary) 40%, black) 0%,\n var(--hw-primary) 50%,\n color-mix(in srgb, var(--hw-primary) 25%, black) 100%);\n }\n .hw-sheet {\n background: var(--hw-bg);\n }\n .hw-card {\n background: var(--hw-bg-hover);\n border-color: var(--hw-border);\n }\n .hw-card:hover {\n background: #333;\n }\n .hw-window {\n box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.06);\n }\n .hw-bubble:focus-visible {\n outline-color: var(--hw-text-3);\n }\n .hw-msg--visitor .hw-msg-bubble {\n background: var(--hw-primary);\n color: white;\n }\n .hw-msg-bubble code {\n background: rgba(255, 255, 255, 0.08);\n }\n .hw-msg-bubble pre {\n background: rgba(255, 255, 255, 0.08);\n }\n .hw-composer-box {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-composer-input {\n color: var(--hw-text);\n }\n .hw-tabs {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n .hw-conv-card:hover,\n .hw-recent-row:hover {\n background: var(--hw-bg-hover);\n }\n .hw-send-error {\n background: #450a0a;\n color: #fca5a5;\n }\n .hw-error-icon {\n background: #450a0a;\n color: #f87171;\n }\n .hw-hover-preview {\n background: #1c1c1e;\n border-color: var(--hw-border);\n }\n .hw-content-search-box {\n background: var(--hw-bg-hover);\n border-color: var(--hw-border-md);\n }\n .hw-preview {\n background: var(--hw-bg);\n border-color: var(--hw-border);\n }\n}\n.hw-widget[data-hw-placement=docked] {\n --hw-dock-width: 600px;\n --hw-dock-bar-width: 480px;\n --hw-dock-inset: 24px;\n --hw-bar-max-height: 148px;\n --hw-dock-surface: #ffffff;\n --hw-dock-on-surface: #111111;\n --hw-dock-pill-bg: rgba(44, 44, 48, 0.66);\n --hw-dock-pill-fg: rgba(255, 255, 255, 0.94);\n --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] {\n z-index: 2147483000;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock {\n position: fixed;\n left: 0;\n right: 0;\n bottom: var(--hw-dock-inset);\n z-index: 2147483000;\n display: flex;\n flex-direction: column;\n align-items: center;\n pointer-events: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock > * {\n pointer-events: auto;\n}\n.hw-dock-suggestions {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 9px;\n width: var(--hw-dock-bar-width, var(--hw-dock-width));\n max-width: calc(100vw - 32px);\n margin-bottom: 14px;\n}\n.hw-dock-pill-row {\n align-self: flex-start;\n display: inline-flex;\n align-items: center;\n gap: 4px;\n animation: hw-dock-pill-in 0.42s cubic-bezier(0.2, 0.9, 0.3, 1) both;\n}\n.hw-dock-pill-dismiss {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 20px;\n height: 20px;\n flex-shrink: 0;\n padding: 0;\n border: 0;\n background: none;\n color: var(--hw-dock-pill-fg);\n cursor: pointer;\n align-self: flex-start;\n margin-top: 8px;\n opacity: 0;\n transform: scale(0.85);\n transition:\n opacity 0.12s linear,\n transform 0.12s cubic-bezier(0.25, 1, 0.5, 1),\n color 0.12s linear;\n}\n.hw-dock-pill-dismiss svg {\n width: 11px;\n height: 11px;\n}\n.hw-dock-suggestions:hover .hw-dock-pill-dismiss,\n.hw-dock-suggestions:focus-within .hw-dock-pill-dismiss {\n opacity: 1;\n transform: none;\n}\n.hw-dock-pill-dismiss:hover {\n color: var(--hw-dock-on-surface);\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-pill-dismiss {\n transition: none;\n }\n}\n@media (hover: none) {\n .hw-dock-pill-dismiss {\n opacity: 1;\n transform: none;\n }\n}\n.hw-dock-pill {\n align-self: flex-start;\n padding: 10px 18px;\n border: 1px solid var(--hw-dock-pill-border, transparent);\n border-radius: 999px;\n cursor: pointer;\n font: inherit;\n font-size: 14px;\n font-weight: 500;\n text-align: left;\n background: var(--hw-dock-pill-bg);\n color: var(--hw-dock-pill-fg);\n backdrop-filter: blur(10px) saturate(1.2);\n -webkit-backdrop-filter: blur(10px) saturate(1.2);\n box-shadow: 0 4px 14px -8px rgba(12, 11, 10, 0.28);\n transition:\n background 0.16s,\n border-color 0.16s,\n transform 0.16s;\n}\n.hw-dock-pill {\n backdrop-filter: blur(18px);\n -webkit-backdrop-filter: blur(18px);\n}\n.hw-dock-pill:hover {\n background: color-mix(in srgb, var(--hw-dock-pill-bg) 100%, var(--hw-dock-on-surface) 8%);\n border-color: color-mix(in srgb, var(--hw-dock-pill-border) 100%, var(--hw-dock-on-surface) 10%);\n transform: translateX(3px);\n}\n@keyframes hw-dock-pill-in {\n from {\n opacity: 0;\n transform: translateY(10px) scale(0.97);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n.hw-dock-bar {\n display: flex;\n align-items: flex-end;\n gap: 10px;\n width: var(--hw-dock-bar-width, var(--hw-dock-width));\n max-width: calc(100vw - 32px);\n min-height: 52px;\n padding: 10px 10px 10px 18px;\n border: 0;\n border-radius: 26px;\n background: var(--hw-dock-surface);\n color: var(--hw-dock-on-surface);\n box-shadow:\n inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n 0 0 0 1px color-mix(in srgb, var(--hw-dock-on-surface) 7%, transparent),\n 0 2px 6px rgba(12, 11, 10, 0.18),\n 0 20px 48px -14px rgba(12, 11, 10, 0.45);\n transition:\n border-radius 0.18s ease,\n box-shadow 0.2s cubic-bezier(0.2, 0.8, 0.2, 1),\n width 0.26s cubic-bezier(0.2, 0.8, 0.2, 1);\n}\n.hw-dock-bar:focus-within {\n box-shadow:\n inset 0 1px 0 color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent),\n 0 0 0 1px color-mix(in srgb, var(--hw-primary, #fb923c) 60%, transparent),\n 0 2px 6px rgba(12, 11, 10, 0.18),\n 0 20px 48px -14px rgba(12, 11, 10, 0.45);\n}\n.hw-dock-bar[data-grown=true] {\n border-radius: 20px;\n}\n.hw-dock-input {\n flex: 1;\n min-width: 0;\n min-height: 20px;\n max-height: var(--hw-bar-max-height);\n padding: 6px 0;\n border: 0;\n outline: none;\n resize: none;\n overflow-y: auto;\n background: transparent;\n color: var(--hw-dock-on-surface);\n font: inherit;\n font-size: 14px;\n line-height: 1.45;\n transition: height 0.12s ease;\n}\n.hw-dock-input::placeholder {\n color: color-mix(in srgb, var(--hw-dock-on-surface) 45%, transparent);\n}\n.hw-dock-send {\n flex: none;\n width: 32px;\n height: 32px;\n margin-bottom: 1px;\n border: 0;\n border-radius: 50%;\n display: grid;\n place-items: center;\n cursor: pointer;\n background: var(--hw-primary, #fb923c);\n color: var(--hw-on-brand, #fff);\n transition: transform 0.16s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.16s;\n}\n.hw-dock-send:hover:not(:disabled) {\n transform: scale(1.06);\n}\n.hw-dock-send:disabled {\n opacity: 0.45;\n cursor: default;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n position: fixed;\n left: 50%;\n right: auto;\n margin-left: calc(var(--hw-dock-width) / -2);\n bottom: calc(var(--hw-dock-inset) + 66px);\n width: var(--hw-dock-width);\n max-width: calc(100vw - 32px);\n height: 420px;\n}\n@media (max-width: 640px) {\n .hw-widget[data-hw-placement=docked] .hw-window {\n left: 16px;\n right: 16px;\n margin-left: 0;\n width: auto;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-bubble {\n display: none;\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-window {\n bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-suggestions {\n display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-pill,\n .hw-dock-bar,\n .hw-dock-input,\n .hw-dock-send {\n animation: none;\n transition: none;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-composer,\n.hw-widget[data-hw-placement=docked] .hw-tabs,\n.hw-widget[data-hw-placement=docked] .hw-footer-tabs {\n display: none;\n}\n.hw-starters {\n display: flex;\n flex-direction: column;\n margin-top: 10px;\n border-radius: 14px;\n overflow: hidden;\n background: var(--hw-bg);\n box-shadow: inset 0 0 0 1px var(--hw-border);\n}\n.hw-starter {\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n padding: 11px 14px;\n border: 0;\n border-radius: 0;\n cursor: pointer;\n background: transparent;\n color: var(--hw-text);\n font: inherit;\n text-align: left;\n animation: hw-starter-in 0.3s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n transition: background 0.12s;\n}\n.hw-starter + .hw-starter {\n box-shadow: inset 0 1px 0 var(--hw-border);\n}\n.hw-starter:hover {\n background: var(--hw-bg-hover);\n}\n.hw-starter-text {\n flex: 1;\n min-width: 0;\n display: flex;\n flex-direction: column;\n gap: 1px;\n}\n.hw-starter-k {\n font-size: 13px;\n font-weight: 550;\n line-height: 1.35;\n color: var(--hw-text);\n}\n.hw-starter-q {\n font-size: 12px;\n line-height: 1.35;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-starter svg {\n flex: none;\n color: var(--hw-text-3, var(--hw-text-muted));\n opacity: 0.45;\n transition: opacity 0.15s, transform 0.15s;\n}\n.hw-starter:hover svg {\n opacity: 0.9;\n transform: translateX(2px);\n}\n@keyframes hw-starter-in {\n from {\n opacity: 0;\n transform: translateY(6px);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-header-back {\n display: none;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-starter {\n animation: none;\n }\n}\n@media (prefers-color-scheme: dark) {\n .hw-widget:not([data-theme=light])[data-hw-placement=docked] {\n --hw-dock-surface: #1f1f23;\n --hw-dock-on-surface: #f4f4f6;\n --hw-dock-pill-bg: rgba(255, 255, 255, 0.1);\n --hw-dock-pill-fg: #e4e4e7;\n --hw-dock-pill-border: rgba(255, 255, 255, 0.14);\n }\n}\n.hw-widget[data-theme=dark][data-hw-placement=docked] {\n --hw-dock-surface: #1f1f23;\n --hw-dock-on-surface: #f4f4f6;\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n --hw-bg: rgba(255, 255, 255, 0.08);\n --hw-bg-subtle: transparent;\n --hw-bg-hover: rgba(255, 255, 255, 0.1);\n --hw-border: rgba(255, 255, 255, 0.14);\n --hw-border-md: rgba(255, 255, 255, 0.22);\n --hw-text: rgba(255, 255, 255, 0.94);\n --hw-text-1: #ffffff;\n --hw-text-2: rgba(255, 255, 255, 0.72);\n --hw-text-3: rgba(255, 255, 255, 0.62);\n --hw-text-4: rgba(255, 255, 255, 0.46);\n --hw-visitor-bubble-bg: rgba(255, 255, 255, 0.16);\n --hw-visitor-bubble-text: #ffffff;\n --hw-brand: rgba(255, 255, 255, 0.92);\n --hw-on-brand: #17161a;\n --hw-focus-border: rgba(255, 255, 255, 0.34);\n --hw-focus-ring: rgba(255, 255, 255, 0.1);\n height: 500px;\n max-height: calc(100vh - 180px);\n border-radius: 24px;\n color: var(--hw-text);\n background:\n linear-gradient(\n 180deg,\n rgba(40, 40, 44, 0.72) 0%,\n rgba(46, 46, 50, 0.7) 55%,\n rgba(52, 52, 56, 0.68) 100%);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n .hw-widget[data-hw-placement=docked] .hw-window {\n background: #2c2c2e;\n }\n}\n@media (max-width: 640px) {\n .hw-widget[data-hw-placement=docked] .hw-window {\n height: min(60vh, 460px);\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-header--sub {\n padding: 14px 12px 8px 16px;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-status {\n display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-name {\n font-size: 15.5px;\n font-weight: 560;\n letter-spacing: -0.006em;\n color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-conv-name,\n.hw-widget[data-hw-placement=docked] .hw-event-name {\n font-weight: 545;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-bot-icon {\n border-radius: 50%;\n overflow: hidden;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-close:hover,\n.hw-widget[data-hw-placement=docked] .hw-header-menu-btn:hover {\n background: rgba(255, 255, 255, 0.12);\n color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-messages {\n padding: 4px 22px 16px;\n gap: 18px;\n -webkit-mask-image:\n linear-gradient(\n 180deg,\n transparent 0,\n #000 16px);\n mask-image:\n linear-gradient(\n 180deg,\n transparent 0,\n #000 16px);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--ai .hw-msg-bubble,\n.hw-widget[data-hw-placement=docked] .hw-msg--team .hw-msg-bubble {\n padding: 0;\n background: transparent;\n border-radius: 0;\n font-size: 15px;\n line-height: 1.55;\n color: var(--hw-text);\n}\n.hw-widget[data-hw-placement=docked] .hw-msg--visitor .hw-msg-bubble {\n background: rgba(255, 255, 255, 0.16);\n color: #ffffff;\n font-size: 14.5px;\n line-height: 1.5;\n}\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble pre,\n.hw-widget[data-hw-placement=docked] .hw-msg-bubble code {\n background: rgba(0, 0, 0, 0.28);\n color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row {\n background: rgba(0, 0, 0, 0.26);\n border-color: rgba(255, 255, 255, 0.14);\n}\n.hw-widget[data-hw-placement=docked] .hw-window :focus-visible {\n outline-color: rgba(255, 255, 255, 0.55);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus,\n.hw-widget[data-hw-placement=docked] .hw-email-card-input:focus-visible {\n outline: none;\n box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-row:focus-within {\n border-color: rgba(255, 255, 255, 0.42);\n box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-email-card-submit {\n background: #ffffff;\n color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n position: relative;\n z-index: 3;\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu {\n background: #3a3a3f;\n box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16), 0 18px 44px -12px rgba(12, 11, 10, 0.62);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button:hover {\n background: rgba(255, 255, 255, 0.11);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu button.hw-header-menu-conv[data-active=true] {\n background: rgba(255, 255, 255, 0.09);\n}\n.hw-widget[data-hw-placement=docked] .hw-header-menu-convs {\n border-bottom-color: rgba(255, 255, 255, 0.12);\n}\n.hw-widget[data-hw-placement=docked] .hw-event--card {\n margin: 0;\n background: rgba(255, 255, 255, 0.08);\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);\n}\n.hw-widget[data-hw-placement=docked] .hw-event-avatar {\n background: rgba(255, 255, 255, 0.14);\n color: var(--hw-text-1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview {\n position: fixed;\n left: 50%;\n right: auto;\n margin-left: calc(var(--hw-dock-bar-width, var(--hw-dock-width)) / -2);\n bottom: calc(var(--hw-dock-inset) + 52px + 12px);\n width: var(--hw-dock-bar-width, var(--hw-dock-width));\n max-width: calc(100vw - 32px);\n border: 0;\n border-radius: 24px;\n color: rgba(255, 255, 255, 0.94);\n background:\n linear-gradient(\n 180deg,\n rgba(40, 40, 44, 0.74) 0%,\n rgba(52, 52, 56, 0.7) 100%);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.1);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-name,\n.hw-widget[data-hw-placement=docked] .hw-preview-body {\n color: rgba(255, 255, 255, 0.94);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close {\n color: rgba(255, 255, 255, 0.6);\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-close:hover {\n background: rgba(255, 255, 255, 0.12);\n color: #ffffff;\n}\n.hw-widget[data-hw-placement=docked] .hw-preview-footer {\n color: rgba(255, 255, 255, 0.55);\n border-top-color: rgba(255, 255, 255, 0.1);\n}\n@media (max-width: 640px) {\n .hw-widget[data-hw-placement=docked] .hw-preview {\n left: 16px;\n right: 16px;\n margin-left: 0;\n width: auto;\n }\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n .hw-widget[data-hw-placement=docked] .hw-preview {\n background: #2c2c2e;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn {\n padding: 7px 14px;\n font-size: 13px;\n font-weight: 550;\n border-radius: 999px;\n background: rgba(255, 255, 255, 0.94);\n box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n color: #17161a;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn:hover:not(:disabled) {\n background: #ffffff;\n box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn[data-tapped=true] {\n background: rgba(255, 255, 255, 0.22);\n color: #ffffff;\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.3);\n transform: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-quick-reply-btn svg {\n opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer {\n padding: 7px 14px;\n font-size: 13px;\n background: rgba(255, 255, 255, 0.94);\n color: #17161a;\n box-shadow: 0 1px 3px rgba(12, 11, 10, 0.22);\n transition:\n background 0.15s,\n box-shadow 0.15s,\n transform 0.15s;\n}\n.hw-widget[data-hw-placement=docked] .hw-offer:hover {\n background: #ffffff;\n color: #17161a;\n box-shadow: 0 4px 12px rgba(12, 11, 10, 0.28);\n transform: translateY(-1px);\n}\n.hw-widget[data-hw-placement=docked] .hw-offer svg {\n opacity: 0.55;\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar {\n --hw-dock-on-surface: rgba(255, 255, 255, 0.94);\n color: rgba(255, 255, 255, 0.94);\n background:\n linear-gradient(\n 180deg,\n rgba(44, 44, 48, 0.74) 0%,\n rgba(52, 52, 56, 0.72) 100%);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), 0 18px 40px -16px rgba(12, 11, 10, 0.45);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n width: var(--hw-dock-width);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-bar:focus-within {\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.26), 0 18px 40px -16px rgba(12, 11, 10, 0.5);\n}\n.hw-widget[data-hw-placement=docked][data-hw-open=true] .hw-dock-bar {\n box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14), 0 22px 52px -18px rgba(12, 11, 10, 0.52);\n}\n.hw-widget[data-hw-placement=docked] .hw-dock-send:not(:disabled) {\n background: #ffffff;\n color: #17161a;\n}\n@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {\n .hw-widget[data-hw-placement=docked] .hw-dock-bar {\n background: #2c2c2e;\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-window {\n transform-origin: 50% 100%;\n animation: hw-dock-panel-in 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing {\n animation: hw-dock-panel-out 0.18s cubic-bezier(0.4, 0, 1, 1) forwards;\n}\n@keyframes hw-dock-panel-in {\n from {\n opacity: 0;\n transform: translateY(14px) scale(0.98);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n@keyframes hw-dock-panel-out {\n from {\n opacity: 1;\n transform: none;\n }\n to {\n opacity: 0;\n transform: translateY(8px) scale(0.99);\n }\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub {\n animation: hw-dock-settle 0.32s cubic-bezier(0.16, 1, 0.3, 1) 0.06s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n animation: hw-dock-settle 0.34s cubic-bezier(0.16, 1, 0.3, 1) 0.11s both;\n}\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-header--sub,\n.hw-widget[data-hw-placement=docked] .hw-window--closing .hw-messages {\n animation: none;\n}\n@keyframes hw-dock-settle {\n from {\n opacity: 0;\n transform: translateY(7px);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-widget[data-hw-placement=docked] .hw-window,\n .hw-widget[data-hw-placement=docked] .hw-window--closing,\n .hw-widget[data-hw-placement=docked] .hw-window .hw-header--sub,\n .hw-widget[data-hw-placement=docked] .hw-window .hw-messages {\n animation: none;\n }\n}\n.hw-dock-bar {\n flex-wrap: wrap;\n padding-left: 18px;\n padding-right: 8px;\n}\n.hw-dock-error {\n width: var(--hw-dock-width);\n max-width: calc(100vw - 32px);\n margin-bottom: 8px;\n padding: 8px 14px;\n border-radius: 14px;\n background: rgba(190, 24, 40, 0.92);\n color: #ffffff;\n font-size: 12.5px;\n line-height: 1.35;\n box-shadow: 0 10px 26px -12px rgba(12, 11, 10, 0.5);\n animation: hw-dock-settle 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-error {\n animation: none;\n }\n}\n.hw-dock-previews {\n flex: 0 0 100%;\n order: -1;\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n padding: 2px 0 8px;\n}\n.hw-dock-lead {\n flex: none;\n display: grid;\n place-items: center;\n width: 32px;\n height: 32px;\n margin-left: -8px;\n}\n.hw-dock-actions {\n flex: none;\n display: flex;\n align-items: center;\n gap: 2px;\n margin-bottom: 1px;\n}\n.hw-dock-tool {\n display: grid;\n place-items: center;\n width: 30px;\n height: 30px;\n border: 0;\n border-radius: 50%;\n background: transparent;\n color: color-mix(in srgb, var(--hw-dock-on-surface) 52%, transparent);\n cursor: pointer;\n transition: background 0.15s, color 0.15s;\n}\n.hw-dock-tool:hover:not(:disabled) {\n background: color-mix(in srgb, var(--hw-dock-on-surface) 8%, transparent);\n color: var(--hw-dock-on-surface);\n}\n.hw-dock-tool:disabled {\n opacity: 0.4;\n cursor: default;\n}\n.hw-dock-tool[data-active=true] {\n color: #e11d48;\n background: rgba(225, 29, 72, 0.12);\n animation: hw-dock-listening 1.4s ease-in-out infinite;\n}\n@keyframes hw-dock-listening {\n 0%, 100% {\n box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.35);\n }\n 50% {\n box-shadow: 0 0 0 4px rgba(225, 29, 72, 0);\n }\n}\n.hw-dock-send:disabled {\n opacity: 1;\n background: color-mix(in srgb, var(--hw-dock-on-surface) 9%, transparent);\n color: color-mix(in srgb, var(--hw-dock-on-surface) 38%, transparent);\n}\n@media (prefers-reduced-motion: reduce) {\n .hw-dock-tool[data-active=true] {\n animation: none;\n }\n .hw-dock-bar {\n transition: none;\n }\n}\n.hw-dock-input:focus,\n.hw-dock-input:focus-visible {\n outline: none;\n box-shadow: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-powered {\n display: none;\n}\n.hw-widget[data-hw-placement=docked] .hw-disconnect {\n border-radius: 20px 20px 0 0;\n}\n.hw-msg-meta {\n display: flex;\n align-items: center;\n gap: 5px;\n}\n.hw-msg-author {\n font-weight: 550;\n}\n.hw-msg-meta-sep {\n opacity: 0.55;\n}\n.hw-header-actions {\n position: relative;\n display: flex;\n align-items: center;\n gap: 2px;\n}\n.hw-header-menu-btn {\n display: grid;\n place-items: center;\n width: 30px;\n height: 30px;\n border: 0;\n border-radius: 8px;\n cursor: pointer;\n background: transparent;\n color: var(--hw-text-2, var(--hw-text-muted));\n transition: background 0.15s, color 0.15s;\n}\n.hw-header-menu-btn:hover {\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n}\n.hw-header-menu {\n position: absolute;\n top: 36px;\n right: 0;\n z-index: 6;\n min-width: 236px;\n max-width: 288px;\n padding: 5px;\n border-radius: 14px;\n background: var(--hw-bg);\n color: var(--hw-text);\n box-shadow: 0 0 0 1px var(--hw-border), 0 12px 32px -10px rgba(0, 0, 0, 0.32);\n animation: hw-menu-in 0.16s cubic-bezier(0.2, 0.8, 0.2, 1) both;\n}\n@keyframes hw-menu-in {\n from {\n opacity: 0;\n transform: translateY(-4px) scale(0.98);\n }\n to {\n opacity: 1;\n transform: none;\n }\n}\n.hw-header-menu button {\n display: flex;\n align-items: center;\n gap: 10px;\n width: 100%;\n padding: 9px 10px;\n border: 0;\n border-radius: 9px;\n cursor: pointer;\n background: transparent;\n color: var(--hw-text);\n font: inherit;\n font-size: 13px;\n text-align: left;\n transition: background 0.14s;\n}\n.hw-header-menu button:hover {\n background: var(--hw-bg-hover);\n}\n.hw-header-menu button svg {\n flex: none;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu button:hover svg {\n color: var(--hw-brand, var(--hw-primary));\n}\n.hw-header-menu-convs {\n display: flex;\n flex-direction: column;\n max-height: 168px;\n overflow-y: auto;\n padding-bottom: 5px;\n margin-bottom: 5px;\n border-bottom: 1px solid var(--hw-border);\n}\n.hw-header-menu button.hw-header-menu-conv {\n flex-direction: column;\n align-items: stretch;\n gap: 2px;\n padding: 8px 10px;\n}\n.hw-header-menu button.hw-header-menu-conv[data-active=true] {\n background: var(--hw-bg-hover);\n}\n.hw-header-menu-conv-top {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: 8px;\n}\n.hw-header-menu-conv-name {\n overflow: hidden;\n font-size: 12.5px;\n font-weight: 600;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.hw-header-menu-conv-time {\n flex: none;\n font-size: 11px;\n color: var(--hw-text-3, var(--hw-text-muted));\n}\n.hw-header-menu-conv-preview {\n overflow: hidden;\n font-size: 12px;\n color: var(--hw-text-2);\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.hw-offers {\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n margin-top: 10px;\n}\n.hw-offer {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 8px 14px;\n border: 0;\n border-radius: 999px;\n cursor: pointer;\n background: var(--hw-bg-hover);\n color: var(--hw-text);\n font: inherit;\n font-size: 12.5px;\n font-weight: 550;\n transition: background 0.15s, color 0.15s;\n}\n.hw-offer:hover {\n background: var(--hw-brand, var(--hw-primary));\n color: var(--hw-on-brand, #fff);\n}\n.hw-offer svg {\n flex: none;\n}\n.hw-sources {\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin-top: 4px;\n}\n.hw-source {\n display: flex;\n align-items: center;\n gap: 9px;\n padding: 5px 14px;\n border-radius: 9px;\n background: transparent;\n color: var(--hw-text);\n text-decoration: none;\n transition: background 0.15s;\n}\n.hw-widget[data-hw-placement=docked] .hw-source {\n margin-inline: -8px;\n padding-inline: 8px;\n}\na.hw-source {\n cursor: pointer;\n}\na.hw-source:hover {\n background: var(--hw-bg-hover);\n}\n.hw-source-n {\n display: grid;\n place-items: center;\n flex: none;\n width: 16px;\n height: 16px;\n border-radius: 4px;\n background: var(--hw-brand, var(--hw-primary));\n color: var(--hw-on-brand, #fff);\n font-size: 10px;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n}\n.hw-source-title {\n flex: 1;\n min-width: 0;\n font-size: 12px;\n font-weight: 550;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] {\n --hw-dock-tint: var(--hw-primary);\n --hw-dock-ink: #ffffff;\n --hw-dock-shade: #000000;\n --hw-dock-wash: var(--hw-dock-shade);\n --hw-dock-ink-2: color-mix(in srgb, var(--hw-dock-ink) 86%, var(--hw-dock-tint));\n --hw-dock-ink-3: color-mix(in srgb, var(--hw-dock-ink) 78%, var(--hw-dock-tint));\n --hw-dock-ink-4: color-mix(in srgb, var(--hw-dock-ink) 60%, var(--hw-dock-tint));\n --hw-dock-pill-bg: var(--hw-dock-tint);\n --hw-dock-pill-fg: var(--hw-dock-ink);\n --hw-dock-pill-border: color-mix(in srgb, var(--hw-dock-ink) 30%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-window, .hw-dock-bar, .hw-preview) {\n --hw-text: var(--hw-dock-ink);\n --hw-text-1: var(--hw-dock-ink);\n --hw-text-2: var(--hw-dock-ink-2);\n --hw-text-3: var(--hw-dock-ink-3);\n --hw-text-4: var(--hw-dock-ink-4);\n --hw-text-muted: var(--hw-dock-ink-2);\n --hw-bg: color-mix(in srgb, var(--hw-dock-wash) 12%, transparent);\n --hw-bg-subtle: transparent;\n --hw-bg-hover: color-mix(in srgb, var(--hw-dock-wash) 18%, transparent);\n --hw-border: color-mix(in srgb, var(--hw-dock-ink) 22%, transparent);\n --hw-border-md: color-mix(in srgb, var(--hw-dock-ink) 34%, transparent);\n --hw-focus-border: color-mix(in srgb, var(--hw-dock-ink) 60%, transparent);\n --hw-focus-ring: color-mix(in srgb, var(--hw-dock-ink) 18%, transparent);\n --hw-visitor-bubble-bg: color-mix(in srgb, var(--hw-dock-wash) 14%, transparent);\n --hw-visitor-bubble-text: var(--hw-dock-ink);\n --hw-primary: var(--hw-dock-ink);\n --hw-primary-hover: var(--hw-dock-ink);\n --hw-brand: var(--hw-dock-ink);\n --hw-on-brand: var(--hw-dock-tint);\n --hw-dock-surface: transparent;\n --hw-dock-on-surface: var(--hw-dock-ink);\n color: var(--hw-dock-ink);\n background:\n radial-gradient(\n 70% 60% at 86% 8%,\n var(--hw-dock-tint),\n transparent 64%),\n linear-gradient(\n 165deg,\n color-mix(in srgb, var(--hw-dock-shade) 12%, var(--hw-dock-tint)) 0%,\n color-mix(in srgb, var(--hw-dock-shade) 30%, var(--hw-dock-tint)) 100%);\n backdrop-filter: none;\n -webkit-backdrop-filter: none;\n box-shadow: 0 24px 60px -20px rgba(12, 11, 10, 0.5), inset 0 0 0 1px color-mix(in srgb, var(--hw-dock-ink) 16%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg--visitor .hw-msg-bubble {\n background: var(--hw-dock-ink);\n color: var(--hw-dock-tint);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg--visitor .hw-msg-bubble a,\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg--visitor .hw-msg-bubble a:hover {\n color: inherit;\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-dock-send:not(:disabled), .hw-quick-reply-btn, .hw-quick-reply-btn:hover:not(:disabled), .hw-email-card-submit, .hw-offer, .hw-offer:hover) {\n background: var(--hw-dock-ink);\n color: var(--hw-dock-tint);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-preview-body, .hw-header-close:hover, .hw-header-menu-btn:hover, .hw-preview-close:hover, .hw-quick-reply-btn[data-tapped=true]) {\n color: var(--hw-dock-ink);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-preview-close, .hw-preview-footer) {\n color: var(--hw-dock-ink-2);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-quick-reply-btn[data-tapped=true] {\n background: color-mix(in srgb, var(--hw-dock-wash) 22%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-window :focus-visible {\n outline-color: var(--hw-dock-ink);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-msg-bubble :is(pre, code),\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-email-card-row {\n background: color-mix(in srgb, var(--hw-dock-shade) 26%, transparent);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-header-menu {\n background: color-mix(in srgb, var(--hw-dock-shade) 34%, var(--hw-dock-tint));\n color: var(--hw-dock-ink);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] :is(.hw-header-bot-icon--team, .hw-event-avatar) {\n background: var(--hw-dock-ink);\n color: var(--hw-dock-tint);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-dock-input::placeholder {\n color: var(--hw-dock-ink-3);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-typing-dot {\n background: var(--hw-dock-ink-2);\n}\n.hw-widget[data-hw-placement=docked][data-hw-dock-surface=brand] .hw-disconnect {\n background: color-mix(in srgb, var(--hw-dock-shade) 16%, transparent);\n color: var(--hw-dock-ink-2);\n}\n');
7050
7773
 
7051
7774
  // src/helpway-widget.tsx
7052
- import { jsx as jsx18 } from "react/jsx-runtime";
7775
+ import { jsx as jsx20 } from "react/jsx-runtime";
7053
7776
  function HelpwayWidget({
7054
7777
  apiKey,
7055
7778
  apiUrl,
@@ -7071,7 +7794,7 @@ function HelpwayWidget({
7071
7794
  src
7072
7795
  }) {
7073
7796
  const resolvedApiUrl = apiUrl ?? (src ? src.replace(/\/widget\.js$/, "") : void 0);
7074
- return /* @__PURE__ */ jsx18(
7797
+ return /* @__PURE__ */ jsx20(
7075
7798
  SupportProvider,
7076
7799
  {
7077
7800
  apiKey,
@@ -7085,7 +7808,7 @@ function HelpwayWidget({
7085
7808
  onClose,
7086
7809
  onUnreadChange,
7087
7810
  theme,
7088
- children: /* @__PURE__ */ jsx18(AgentAvatarProvider, { value: agentAvatar ?? null, children: /* @__PURE__ */ jsx18(
7811
+ children: /* @__PURE__ */ jsx20(AgentAvatarProvider, { value: agentAvatar ?? null, children: /* @__PURE__ */ jsx20(
7089
7812
  DefaultWidget,
7090
7813
  {
7091
7814
  hideLauncher,