@banbox/chat 1.0.17 → 1.0.19

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.
Files changed (20) hide show
  1. package/dist/index.cjs +191 -166
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +191 -166
  4. package/dist/index.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/chat/ChatImagePreviewModal.tsx +55 -47
  7. package/src/chat/SinglePopup.tsx +81 -31
  8. package/src/modals/ChatTranslateSettingsModal.tsx +2 -2
  9. package/src/ui/AttachmentPreviewStrip.tsx +17 -12
  10. package/src/ui/ChatComposerBar.tsx +21 -13
  11. package/src/ui/ChatFooter.tsx +21 -11
  12. package/src/ui/ChatInquiryBar.tsx +1 -1
  13. package/src/ui/ChatThreadItem.tsx +1 -1
  14. package/src/ui/MessageHoverActions.tsx +2 -2
  15. package/src/ui/ReplyCard.tsx +1 -1
  16. package/src/ui/Select.tsx +2 -1
  17. package/src/ui/drop-up/BusinessCardDropup.tsx +1 -1
  18. package/src/ui/drop-up/EmojiDropup.tsx +3 -3
  19. package/src/ui/message-items/ChatBubbleAudio.tsx +1 -1
  20. package/src/ui/message-items/ChatBubbleFiles.tsx +8 -2
package/dist/index.cjs CHANGED
@@ -37,7 +37,7 @@ function styleInject(css, { insertAt } = {}) {
37
37
  }
38
38
 
39
39
  // src/styles/index.css
40
- styleInject('/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root,\n :host {\n --font-sans:\n ui-sans-serif,\n system-ui,\n sans-serif,\n "Apple Color Emoji",\n "Segoe UI Emoji",\n "Segoe UI Symbol",\n "Noto Color Emoji";\n --font-mono:\n ui-monospace,\n SFMono-Regular,\n Menlo,\n Monaco,\n Consolas,\n "Liberation Mono",\n "Courier New",\n monospace;\n --color-gray-50: oklch(98.5% 0.002 247.839);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --text-4xl: 2.25rem;\n --text-4xl--line-height: calc(2.5 / 2.25);\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --tracking-wide: 0.025em;\n --leading-normal: 1.5;\n --radius-xs: 0.125rem;\n --radius-sm: 0.25rem;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n }\n}\n@layer base {\n *,\n ::after,\n ::before,\n ::backdrop,\n ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html,\n :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b,\n strong {\n font-weight: bolder;\n }\n code,\n kbd,\n samp,\n pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub,\n sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol,\n ul,\n menu {\n list-style: none;\n }\n img,\n svg,\n video,\n canvas,\n audio,\n iframe,\n embed,\n object {\n display: block;\n vertical-align: middle;\n }\n img,\n video {\n max-width: 100%;\n height: auto;\n }\n button,\n input,\n select,\n optgroup,\n textarea,\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit,\n ::-webkit-datetime-edit-year-field,\n ::-webkit-datetime-edit-month-field,\n ::-webkit-datetime-edit-day-field,\n ::-webkit-datetime-edit-hour-field,\n ::-webkit-datetime-edit-minute-field,\n ::-webkit-datetime-edit-second-field,\n ::-webkit-datetime-edit-millisecond-field,\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button,\n input:where([type=button], [type=reset], [type=submit]),\n ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button,\n ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=until-found])) {\n display: none !important;\n }\n}\n@layer utilities {\n .pointer-events-auto {\n pointer-events: auto;\n }\n .pointer-events-none {\n pointer-events: none;\n }\n .visible {\n visibility: visible;\n }\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n border-width: 0;\n }\n .absolute {\n position: absolute;\n }\n .fixed {\n position: fixed;\n }\n .relative {\n position: relative;\n }\n .static {\n position: static;\n }\n .inset-0 {\n inset: calc(var(--spacing) * 0);\n }\n .inset-x-0 {\n inset-inline: calc(var(--spacing) * 0);\n }\n .inset-y-0 {\n inset-block: calc(var(--spacing) * 0);\n }\n .-top-\\[6px\\] {\n top: calc(6px * -1);\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .top-1\\/2 {\n top: calc(1 / 2 * 100%);\n }\n .top-\\[-4px\\] {\n top: -4px;\n }\n .top-\\[-6px\\] {\n top: -6px;\n }\n .top-full {\n top: 100%;\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n .right-4 {\n right: calc(var(--spacing) * 4);\n }\n .right-6 {\n right: calc(var(--spacing) * 6);\n }\n .right-\\[-63px\\] {\n right: -63px;\n }\n .right-full {\n right: 100%;\n }\n .-bottom-2 {\n bottom: calc(var(--spacing) * -2);\n }\n .bottom-0 {\n bottom: calc(var(--spacing) * 0);\n }\n .bottom-4 {\n bottom: calc(var(--spacing) * 4);\n }\n .bottom-6 {\n bottom: calc(var(--spacing) * 6);\n }\n .bottom-\\[-13px\\] {\n bottom: -13px;\n }\n .bottom-\\[12px\\] {\n bottom: 12px;\n }\n .bottom-full {\n bottom: 100%;\n }\n .left-0 {\n left: calc(var(--spacing) * 0);\n }\n .left-1\\/2 {\n left: calc(1 / 2 * 100%);\n }\n .left-6 {\n left: calc(var(--spacing) * 6);\n }\n .left-\\[30px\\] {\n left: 30px;\n }\n .left-full {\n left: 100%;\n }\n .-z-\\[1\\] {\n z-index: calc(1 * -1);\n }\n .z-10 {\n z-index: 10;\n }\n .z-50 {\n z-index: 50;\n }\n .z-70 {\n z-index: 70;\n }\n .z-71 {\n z-index: 71;\n }\n .z-999 {\n z-index: 999;\n }\n .z-9999 {\n z-index: 9999;\n }\n .z-10002 {\n z-index: 10002;\n }\n .z-10003 {\n z-index: 10003;\n }\n .z-10004 {\n z-index: 10004;\n }\n .z-10010 {\n z-index: 10010;\n }\n .z-10011 {\n z-index: 10011;\n }\n .z-\\[-1\\] {\n z-index: -1;\n }\n .z-\\[N\\] {\n z-index: N;\n }\n .container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n }\n .mx-auto {\n margin-inline: auto;\n }\n .ms-1 {\n margin-inline-start: calc(var(--spacing) * 1);\n }\n .ms-\\[3px\\] {\n margin-inline-start: 3px;\n }\n .ms-\\[12px\\] {\n margin-inline-start: 12px;\n }\n .me-1 {\n margin-inline-end: calc(var(--spacing) * 1);\n }\n .mt-0\\.5 {\n margin-top: calc(var(--spacing) * 0.5);\n }\n .mt-1 {\n margin-top: calc(var(--spacing) * 1);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-3 {\n margin-top: calc(var(--spacing) * 3);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-\\[2px\\] {\n margin-top: 2px;\n }\n .mt-\\[6px\\] {\n margin-top: 6px;\n }\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n .mr-auto {\n margin-right: auto;\n }\n .mb-0 {\n margin-bottom: calc(var(--spacing) * 0);\n }\n .mb-0\\.5 {\n margin-bottom: calc(var(--spacing) * 0.5);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-5 {\n margin-bottom: calc(var(--spacing) * 5);\n }\n .mb-10 {\n margin-bottom: calc(var(--spacing) * 10);\n }\n .mb-\\[24px\\] {\n margin-bottom: 24px;\n }\n .-ml-\\[5px\\] {\n margin-left: calc(5px * -1);\n }\n .ml-0\\.5 {\n margin-left: calc(var(--spacing) * 0.5);\n }\n .ml-1 {\n margin-left: calc(var(--spacing) * 1);\n }\n .ml-1\\.5 {\n margin-left: calc(var(--spacing) * 1.5);\n }\n .ml-\\[-5px\\] {\n margin-left: -5px;\n }\n .ml-\\[2px\\] {\n margin-left: 2px;\n }\n .ml-\\[4px\\] {\n margin-left: 4px;\n }\n .ml-auto {\n margin-left: auto;\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .hidden {\n display: none;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\n }\n .h-0 {\n height: calc(var(--spacing) * 0);\n }\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n .h-2\\.5 {\n height: calc(var(--spacing) * 2.5);\n }\n .h-3 {\n height: calc(var(--spacing) * 3);\n }\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n .h-7 {\n height: calc(var(--spacing) * 7);\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n .h-\\[1\\.17px\\] {\n height: 1.17px;\n }\n .h-\\[4px\\] {\n height: 4px;\n }\n .h-\\[5\\.5px\\] {\n height: 5.5px;\n }\n .h-\\[11\\.25px\\] {\n height: 11.25px;\n }\n .h-\\[14px\\] {\n height: 14px;\n }\n .h-\\[16px\\] {\n height: 16px;\n }\n .h-\\[17\\.5px\\] {\n height: 17.5px;\n }\n .h-\\[18px\\] {\n height: 18px;\n }\n .h-\\[21px\\] {\n height: 21px;\n }\n .h-\\[22px\\] {\n height: 22px;\n }\n .h-\\[26px\\] {\n height: 26px;\n }\n .h-\\[28px\\] {\n height: 28px;\n }\n .h-\\[30px\\] {\n height: 30px;\n }\n .h-\\[32px\\] {\n height: 32px;\n }\n .h-\\[34px\\] {\n height: 34px;\n }\n .h-\\[36px\\] {\n height: 36px;\n }\n .h-\\[40px\\] {\n height: 40px;\n }\n .h-\\[41px\\] {\n height: 41px;\n }\n .h-\\[44px\\] {\n height: 44px;\n }\n .h-\\[46px\\] {\n height: 46px;\n }\n .h-\\[52px\\] {\n height: 52px;\n }\n .h-\\[64px\\] {\n height: 64px;\n }\n .h-\\[65px\\] {\n height: 65px;\n }\n .h-\\[75px\\] {\n height: 75px;\n }\n .h-\\[100px\\] {\n height: 100px;\n }\n .h-\\[208px\\] {\n height: 208px;\n }\n .h-\\[446px\\] {\n height: 446px;\n }\n .h-\\[650px\\] {\n height: 650px;\n }\n .h-full {\n height: 100%;\n }\n .h-px {\n height: 1px;\n }\n .max-h-\\[200px\\] {\n max-height: 200px;\n }\n .min-h-0 {\n min-height: calc(var(--spacing) * 0);\n }\n .min-h-\\[50px\\] {\n min-height: 50px;\n }\n .min-h-full {\n min-height: 100%;\n }\n .w-0 {\n width: calc(var(--spacing) * 0);\n }\n .w-2 {\n width: calc(var(--spacing) * 2);\n }\n .w-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n }\n .w-3 {\n width: calc(var(--spacing) * 3);\n }\n .w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n }\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n .w-9 {\n width: calc(var(--spacing) * 9);\n }\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n .w-44 {\n width: calc(var(--spacing) * 44);\n }\n .w-\\[5\\.5px\\] {\n width: 5.5px;\n }\n .w-\\[11\\.25px\\] {\n width: 11.25px;\n }\n .w-\\[14px\\] {\n width: 14px;\n }\n .w-\\[16px\\] {\n width: 16px;\n }\n .w-\\[18\\.08px\\] {\n width: 18.08px;\n }\n .w-\\[18px\\] {\n width: 18px;\n }\n .w-\\[22px\\] {\n width: 22px;\n }\n .w-\\[26px\\] {\n width: 26px;\n }\n .w-\\[28px\\] {\n width: 28px;\n }\n .w-\\[30px\\] {\n width: 30px;\n }\n .w-\\[34px\\] {\n width: 34px;\n }\n .w-\\[36px\\] {\n width: 36px;\n }\n .w-\\[40px\\] {\n width: 40px;\n }\n .w-\\[44px\\] {\n width: 44px;\n }\n .w-\\[46px\\] {\n width: 46px;\n }\n .w-\\[65px\\] {\n width: 65px;\n }\n .w-\\[105px\\] {\n width: 105px;\n }\n .w-\\[130px\\] {\n width: 130px;\n }\n .w-\\[186px\\] {\n width: 186px;\n }\n .w-\\[340px\\] {\n width: 340px;\n }\n .w-\\[355px\\] {\n width: 355px;\n }\n .w-\\[420px\\] {\n width: 420px;\n }\n .w-\\[450px\\] {\n width: 450px;\n }\n .w-\\[460px\\] {\n width: 460px;\n }\n .w-\\[480px\\] {\n width: 480px;\n }\n .w-\\[700px\\] {\n width: 700px;\n }\n .w-fit {\n width: fit-content;\n }\n .w-full {\n width: 100%;\n }\n .w-px {\n width: 1px;\n }\n .max-w-\\[80\\%\\] {\n max-width: 80%;\n }\n .max-w-\\[95\\%\\] {\n max-width: 95%;\n }\n .max-w-\\[95vw\\] {\n max-width: 95vw;\n }\n .max-w-\\[110px\\] {\n max-width: 110px;\n }\n .max-w-\\[151px\\] {\n max-width: 151px;\n }\n .max-w-\\[185px\\] {\n max-width: 185px;\n }\n .max-w-\\[200px\\] {\n max-width: 200px;\n }\n .max-w-\\[260px\\] {\n max-width: 260px;\n }\n .max-w-\\[289px\\] {\n max-width: 289px;\n }\n .max-w-\\[300px\\] {\n max-width: 300px;\n }\n .max-w-\\[410px\\] {\n max-width: 410px;\n }\n .min-w-0 {\n min-width: calc(var(--spacing) * 0);\n }\n .min-w-\\[100px\\] {\n min-width: 100px;\n }\n .min-w-\\[106px\\] {\n min-width: 106px;\n }\n .flex-1 {\n flex: 1;\n }\n .shrink-0 {\n flex-shrink: 0;\n }\n .-translate-x-1\\.5 {\n --tw-translate-x: calc(var(--spacing) * -1.5);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-x-1\\.5 {\n --tw-translate-x: calc(var(--spacing) * 1.5);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .rotate-45 {\n rotate: 45deg;\n }\n .rotate-180 {\n rotate: 180deg;\n }\n .transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n }\n .cursor-auto\\! {\n cursor: auto !important;\n }\n .cursor-default {\n cursor: default;\n }\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n .cursor-pointer {\n cursor: pointer;\n }\n .cursor-zoom-in {\n cursor: zoom-in;\n }\n .resize {\n resize: both;\n }\n .resize-none {\n resize: none;\n }\n .appearance-none {\n appearance: none;\n }\n .grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-7 {\n grid-template-columns: repeat(7, minmax(0, 1fr));\n }\n .grid-cols-\\[1fr_350px\\] {\n grid-template-columns: 1fr 350px;\n }\n .grid-cols-\\[18px_120px_1fr\\] {\n grid-template-columns: 18px 120px 1fr;\n }\n .grid-cols-\\[125px_125px\\] {\n grid-template-columns: 125px 125px;\n }\n .flex-col {\n flex-direction: column;\n }\n .place-items-center {\n place-items: center;\n }\n .items-center {\n align-items: center;\n }\n .items-end {\n align-items: flex-end;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n .gap-\\[6px\\] {\n gap: 6px;\n }\n .gap-\\[17px\\] {\n gap: 17px;\n }\n .gap-\\[18px\\] {\n gap: 18px;\n }\n .gap-\\[24px\\] {\n gap: 24px;\n }\n .space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-1\\.5 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-\\[2px\\] {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(2px * var(--tw-space-y-reverse));\n margin-block-end: calc(2px * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .gap-y-1\\.5 {\n row-gap: calc(var(--spacing) * 1.5);\n }\n .truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .overflow-clip {\n overflow: clip;\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-x-auto {\n overflow-x: auto;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .rounded {\n border-radius: 0.25rem;\n }\n .rounded-\\[2\\.33px\\] {\n border-radius: 2.33px;\n }\n .rounded-\\[3\\.5px\\] {\n border-radius: 3.5px;\n }\n .rounded-\\[3px\\] {\n border-radius: 3px;\n }\n .rounded-\\[4px\\] {\n border-radius: 4px;\n }\n .rounded-\\[6px\\] {\n border-radius: 6px;\n }\n .rounded-\\[12px\\] {\n border-radius: 12px;\n }\n .rounded-\\[14px\\] {\n border-radius: 14px;\n }\n .rounded-\\[18px\\] {\n border-radius: 18px;\n }\n .rounded-\\[20px\\] {\n border-radius: 20px;\n }\n .rounded-\\[inherit\\] {\n border-radius: inherit;\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .rounded-md {\n border-radius: var(--radius-md);\n }\n .rounded-sm {\n border-radius: var(--radius-sm);\n }\n .rounded-xs {\n border-radius: var(--radius-xs);\n }\n .rounded-t-\\[6px\\] {\n border-top-left-radius: 6px;\n border-top-right-radius: 6px;\n }\n .rounded-t-md {\n border-top-left-radius: var(--radius-md);\n border-top-right-radius: var(--radius-md);\n }\n .rounded-tl-\\[3px\\] {\n border-top-left-radius: 3px;\n }\n .rounded-tl-md {\n border-top-left-radius: var(--radius-md);\n }\n .rounded-tr-\\[3px\\] {\n border-top-right-radius: 3px;\n }\n .rounded-tr-\\[6px\\] {\n border-top-right-radius: 6px;\n }\n .rounded-b-\\[6px\\] {\n border-bottom-right-radius: 6px;\n border-bottom-left-radius: 6px;\n }\n .rounded-br-\\[3px\\] {\n border-bottom-right-radius: 3px;\n }\n .rounded-bl-\\[3px\\] {\n border-bottom-left-radius: 3px;\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-\\[0\\.7px\\] {\n border-style: var(--tw-border-style);\n border-width: 0.7px;\n }\n .border-\\[1\\.5px\\] {\n border-style: var(--tw-border-style);\n border-width: 1.5px;\n }\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n .border-t-16 {\n border-top-style: var(--tw-border-style);\n border-top-width: 16px;\n }\n .border-t-\\[5px\\] {\n border-top-style: var(--tw-border-style);\n border-top-width: 5px;\n }\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n .border-r-\\[5px\\] {\n border-right-style: var(--tw-border-style);\n border-right-width: 5px;\n }\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n .border-l-2 {\n border-left-style: var(--tw-border-style);\n border-left-width: 2px;\n }\n .border-l-16 {\n border-left-style: var(--tw-border-style);\n border-left-width: 16px;\n }\n .border-l-\\[5px\\] {\n border-left-style: var(--tw-border-style);\n border-left-width: 5px;\n }\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n .border-\\[\\#00b8d4\\] {\n border-color: #00b8d4;\n }\n .border-\\[\\#3D3D3D\\] {\n border-color: #3D3D3D;\n }\n .border-\\[\\#3d3d3d\\] {\n border-color: #3d3d3d;\n }\n .border-\\[\\#3d6b42\\] {\n border-color: #3d6b42;\n }\n .border-\\[\\#6A6A6A\\] {\n border-color: #6A6A6A;\n }\n .border-\\[\\#9BBCCF\\] {\n border-color: #9BBCCF;\n }\n .border-\\[\\#005694\\] {\n border-color: #005694;\n }\n .border-\\[\\#086600\\] {\n border-color: #086600;\n }\n .border-\\[\\#636363\\] {\n border-color: #636363;\n }\n .border-\\[\\#CCCCCC\\] {\n border-color: #CCCCCC;\n }\n .border-\\[\\#D8D8D8\\] {\n border-color: #D8D8D8;\n }\n .border-\\[\\#E5E5E5\\] {\n border-color: #E5E5E5;\n }\n .border-\\[\\#EFEFEF\\] {\n border-color: #EFEFEF;\n }\n .border-\\[\\#F1F1F1\\] {\n border-color: #F1F1F1;\n }\n .border-\\[\\#F8F8F8\\] {\n border-color: #F8F8F8;\n }\n .border-\\[\\#FF5300\\] {\n border-color: #FF5300;\n }\n .border-\\[\\#cacaca\\] {\n border-color: #cacaca;\n }\n .border-\\[\\#d1d5db\\] {\n border-color: #d1d5db;\n }\n .border-\\[\\#e1e1e1\\] {\n border-color: #e1e1e1;\n }\n .border-\\[\\#ededed\\] {\n border-color: #ededed;\n }\n .border-\\[\\#ef4444\\] {\n border-color: #ef4444;\n }\n .border-\\[\\#f1f1f1\\] {\n border-color: #f1f1f1;\n }\n .border-\\[\\#f8f8f8\\] {\n border-color: #f8f8f8;\n }\n .border-\\[\\#f59e0b\\] {\n border-color: #f59e0b;\n }\n .border-black {\n border-color: var(--color-black);\n }\n .border-transparent {\n border-color: transparent;\n }\n .border-t-\\[\\#636363\\] {\n border-top-color: #636363;\n }\n .border-t-\\[\\#FFD2BD\\] {\n border-top-color: #FFD2BD;\n }\n .border-t-transparent {\n border-top-color: transparent;\n }\n .border-r-transparent {\n border-right-color: transparent;\n }\n .border-l-transparent {\n border-left-color: transparent;\n }\n .\\!bg-\\[\\#hex\\] {\n background-color: #hex !important;\n }\n .bg-\\(--color-banbox-f8\\,\\#f8f8f8\\) {\n background-color: var(--color-banbox-f8,#f8f8f8);\n }\n .bg-\\(--color-banbox-primary-container\\,\\#f0f4ff\\) {\n background-color: var(--color-banbox-primary-container,#f0f4ff);\n }\n .bg-\\(--x\\,fallback\\) {\n background-color: var(--x,fallback);\n }\n .bg-\\[\\#00b8d4\\] {\n background-color: #00b8d4;\n }\n .bg-\\[\\#00b8d4\\]\\/10 {\n background-color: color-mix(in oklab, #00b8d4 10%, transparent);\n }\n .bg-\\[\\#1E8E3E\\] {\n background-color: #1E8E3E;\n }\n .bg-\\[\\#3D3D3D\\] {\n background-color: #3D3D3D;\n }\n .bg-\\[\\#3D3D3D\\]\\/10 {\n background-color: color-mix(in oklab, #3D3D3D 10%, transparent);\n }\n .bg-\\[\\#3d3d3d\\] {\n background-color: #3d3d3d;\n }\n .bg-\\[\\#3d6b42\\] {\n background-color: #3d6b42;\n }\n .bg-\\[\\#3d6b42\\]\\/10 {\n background-color: color-mix(in oklab, #3d6b42 10%, transparent);\n }\n .bg-\\[\\#005694\\] {\n background-color: #005694;\n }\n .bg-\\[\\#086600\\] {\n background-color: #086600;\n }\n .bg-\\[\\#328545\\] {\n background-color: #328545;\n }\n .bg-\\[\\#636363\\] {\n background-color: #636363;\n }\n .bg-\\[\\#636363\\]\\! {\n background-color: #636363 !important;\n }\n .bg-\\[\\#747474\\] {\n background-color: #747474;\n }\n .bg-\\[\\#BDBDBD\\] {\n background-color: #BDBDBD;\n }\n .bg-\\[\\#E0EFF8\\] {\n background-color: #E0EFF8;\n }\n .bg-\\[\\#E6F5E6\\] {\n background-color: #E6F5E6;\n }\n .bg-\\[\\#E7E7E7\\] {\n background-color: #E7E7E7;\n }\n .bg-\\[\\#F1F1F1\\] {\n background-color: #F1F1F1;\n }\n .bg-\\[\\#F5F7FA\\] {\n background-color: #F5F7FA;\n }\n .bg-\\[\\#F7F7F7\\] {\n background-color: #F7F7F7;\n }\n .bg-\\[\\#F8F8F8\\] {\n background-color: #F8F8F8;\n }\n .bg-\\[\\#FF5300\\] {\n background-color: #FF5300;\n }\n .bg-\\[\\#FFDBCF\\] {\n background-color: #FFDBCF;\n }\n .bg-\\[\\#FFE9DB\\] {\n background-color: #FFE9DB;\n }\n .bg-\\[\\#FFEAE0\\] {\n background-color: #FFEAE0;\n }\n .bg-\\[\\#cacaca\\] {\n background-color: #cacaca;\n }\n .bg-\\[\\#e1e1e1\\] {\n background-color: #e1e1e1;\n }\n .bg-\\[\\#eb2127\\] {\n background-color: #eb2127;\n }\n .bg-\\[\\#ececec\\] {\n background-color: #ececec;\n }\n .bg-\\[\\#ef4444\\] {\n background-color: #ef4444;\n }\n .bg-\\[\\#ef4444\\]\\/10 {\n background-color: color-mix(in oklab, #ef4444 10%, transparent);\n }\n .bg-\\[\\#f0f4ff\\] {\n background-color: #f0f4ff;\n }\n .bg-\\[\\#f1f1f1\\] {\n background-color: #f1f1f1;\n }\n .bg-\\[\\#f8f8f8\\] {\n background-color: #f8f8f8;\n }\n .bg-\\[\\#f59e0b\\] {\n background-color: #f59e0b;\n }\n .bg-\\[\\#f59e0b\\]\\/10 {\n background-color: color-mix(in oklab, #f59e0b 10%, transparent);\n }\n .bg-\\[\\#ff5200\\] {\n background-color: #ff5200;\n }\n .bg-\\[\\#hex\\]\\! {\n background-color: #hex !important;\n }\n .bg-\\[var\\(--x\\,fallback\\)\\] {\n background-color: var(--x,fallback);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-black\\/5 {\n background-color: color-mix(in srgb, #000 5%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n }\n .bg-black\\/30 {\n background-color: color-mix(in srgb, #000 30%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 30%, transparent);\n }\n }\n .bg-black\\/35 {\n background-color: color-mix(in srgb, #000 35%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 35%, transparent);\n }\n }\n .bg-black\\/40 {\n background-color: color-mix(in srgb, #000 40%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 40%, transparent);\n }\n }\n .bg-transparent {\n background-color: transparent;\n }\n .bg-white {\n background-color: var(--color-white);\n }\n .bg-cover {\n background-size: cover;\n }\n .bg-no-repeat {\n background-repeat: no-repeat;\n }\n .object-contain {\n object-fit: contain;\n }\n .object-cover {\n object-fit: cover;\n }\n .p-1 {\n padding: calc(var(--spacing) * 1);\n }\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n .p-3\\.5 {\n padding: calc(var(--spacing) * 3.5);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n .p-\\[1\\.75px\\] {\n padding: 1.75px;\n }\n .p-\\[2px\\] {\n padding: 2px;\n }\n .p-\\[3px\\] {\n padding: 3px;\n }\n .p-\\[7px\\] {\n padding: 7px;\n }\n .p-px {\n padding: 1px;\n }\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n .px-2\\.5 {\n padding-inline: calc(var(--spacing) * 2.5);\n }\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n .px-8 {\n padding-inline: calc(var(--spacing) * 8);\n }\n .px-\\[3px\\] {\n padding-inline: 3px;\n }\n .px-\\[4px\\] {\n padding-inline: 4px;\n }\n .px-\\[10px\\] {\n padding-inline: 10px;\n }\n .px-\\[12px\\] {\n padding-inline: 12px;\n }\n .px-\\[14px\\] {\n padding-inline: 14px;\n }\n .px-\\[16px\\] {\n padding-inline: 16px;\n }\n .px-\\[18px\\] {\n padding-inline: 18px;\n }\n .px-\\[20px\\] {\n padding-inline: 20px;\n }\n .py-0 {\n padding-block: calc(var(--spacing) * 0);\n }\n .py-1 {\n padding-block: calc(var(--spacing) * 1);\n }\n .py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n .py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n }\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n .py-6 {\n padding-block: calc(var(--spacing) * 6);\n }\n .py-\\[2px\\] {\n padding-block: 2px;\n }\n .py-\\[3px\\] {\n padding-block: 3px;\n }\n .py-\\[7px\\] {\n padding-block: 7px;\n }\n .py-\\[9px\\] {\n padding-block: 9px;\n }\n .ps-\\[16px\\] {\n padding-inline-start: 16px;\n }\n .pe-\\[4px\\] {\n padding-inline-end: 4px;\n }\n .pe-\\[30px\\] {\n padding-inline-end: 30px;\n }\n .pt-1 {\n padding-top: calc(var(--spacing) * 1);\n }\n .pt-2\\.5 {\n padding-top: calc(var(--spacing) * 2.5);\n }\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n .pt-\\[2px\\] {\n padding-top: 2px;\n }\n .pt-\\[24px\\] {\n padding-top: 24px;\n }\n .pr-1\\.5 {\n padding-right: calc(var(--spacing) * 1.5);\n }\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n .pb-1 {\n padding-bottom: calc(var(--spacing) * 1);\n }\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n .pb-6 {\n padding-bottom: calc(var(--spacing) * 6);\n }\n .pb-10 {\n padding-bottom: calc(var(--spacing) * 10);\n }\n .pb-\\[2px\\] {\n padding-bottom: 2px;\n }\n .text-left {\n text-align: left;\n }\n .text-right {\n text-align: right;\n }\n .text-2xl {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n }\n .text-4xl {\n font-size: var(--text-4xl);\n line-height: var(--tw-leading, var(--text-4xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .text-\\[10px\\] {\n font-size: 10px;\n }\n .text-\\[12px\\] {\n font-size: 12px;\n }\n .text-\\[13px\\] {\n font-size: 13px;\n }\n .text-\\[14px\\] {\n font-size: 14px;\n }\n .text-\\[15px\\] {\n font-size: 15px;\n }\n .text-\\[16px\\] {\n font-size: 16px;\n }\n .text-\\[20px\\] {\n font-size: 20px;\n }\n .text-\\[22px\\] {\n font-size: 22px;\n }\n .leading-4 {\n --tw-leading: calc(var(--spacing) * 4);\n line-height: calc(var(--spacing) * 4);\n }\n .leading-normal {\n --tw-leading: var(--leading-normal);\n line-height: var(--leading-normal);\n }\n .font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n }\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n .font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n }\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n .tracking-\\[0\\.4px\\] {\n --tw-tracking: 0.4px;\n letter-spacing: 0.4px;\n }\n .tracking-\\[0\\.5px\\] {\n --tw-tracking: 0.5px;\n letter-spacing: 0.5px;\n }\n .tracking-\\[0\\.25px\\] {\n --tw-tracking: 0.25px;\n letter-spacing: 0.25px;\n }\n .tracking-wide {\n --tw-tracking: var(--tracking-wide);\n letter-spacing: var(--tracking-wide);\n }\n .break-words {\n overflow-wrap: break-word;\n }\n .whitespace-nowrap {\n white-space: nowrap;\n }\n .whitespace-pre-wrap {\n white-space: pre-wrap;\n }\n .text-\\[\\#0D5EA8\\] {\n color: #0D5EA8;\n }\n .text-\\[\\#0F0F0F\\] {\n color: #0F0F0F;\n }\n .text-\\[\\#00b8d4\\] {\n color: #00b8d4;\n }\n .text-\\[\\#1E9E6A\\] {\n color: #1E9E6A;\n }\n .text-\\[\\#2B579A\\] {\n color: #2B579A;\n }\n .text-\\[\\#2C2C2C\\] {\n color: #2C2C2C;\n }\n .text-\\[\\#2c2c2c\\] {\n color: #2c2c2c;\n }\n .text-\\[\\#3D3D3D\\] {\n color: #3D3D3D;\n }\n .text-\\[\\#3d6b42\\] {\n color: #3d6b42;\n }\n .text-\\[\\#004F4F\\] {\n color: #004F4F;\n }\n .text-\\[\\#6B7280\\] {\n color: #6B7280;\n }\n .text-\\[\\#6b7280\\] {\n color: #6b7280;\n }\n .text-\\[\\#9AA1A9\\] {\n color: #9AA1A9;\n }\n .text-\\[\\#9C9C9C\\] {\n color: #9C9C9C;\n }\n .text-\\[\\#9ca3af\\] {\n color: #9ca3af;\n }\n .text-\\[\\#00486F\\] {\n color: #00486F;\n }\n .text-\\[\\#005694\\] {\n color: #005694;\n }\n .text-\\[\\#086600\\] {\n color: #086600;\n }\n .text-\\[\\#161616\\] {\n color: #161616;\n }\n .text-\\[\\#374151\\] {\n color: #374151;\n }\n .text-\\[\\#636363\\] {\n color: #636363;\n }\n .text-\\[\\#747474\\] {\n color: #747474;\n }\n .text-\\[\\#929292\\] {\n color: #929292;\n }\n .text-\\[\\#B7B7B7\\] {\n color: #B7B7B7;\n }\n .text-\\[\\#B9C3D4\\] {\n color: #B9C3D4;\n }\n .text-\\[\\#D93025\\] {\n color: #D93025;\n }\n .text-\\[\\#E63946\\] {\n color: #E63946;\n }\n .text-\\[\\#E69138\\] {\n color: #E69138;\n }\n .text-\\[\\#EA580C\\] {\n color: #EA580C;\n }\n .text-\\[\\#FF5300\\] {\n color: #FF5300;\n }\n .text-\\[\\#ef4444\\] {\n color: #ef4444;\n }\n .text-\\[\\#f59e0b\\] {\n color: #f59e0b;\n }\n .text-\\[\\#ff5200\\] {\n color: #ff5200;\n }\n .text-\\[\\#ff5301\\] {\n color: #ff5301;\n }\n .text-black {\n color: var(--color-black);\n }\n .text-white {\n color: var(--color-white);\n }\n .capitalize {\n text-transform: capitalize;\n }\n .uppercase {\n text-transform: uppercase;\n }\n .underline {\n text-decoration-line: underline;\n }\n .underline-offset-4 {\n text-underline-offset: 4px;\n }\n .placeholder-\\[\\#9ca3af\\] {\n &::placeholder {\n color: #9ca3af;\n }\n }\n .opacity-0 {\n opacity: 0%;\n }\n .opacity-30 {\n opacity: 30%;\n }\n .opacity-50 {\n opacity: 50%;\n }\n .opacity-100 {\n opacity: 100%;\n }\n .shadow-\\[-3px_0px_6px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: -3px 0px 6px 0px var(--tw-shadow-color, rgba(0,0,0,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_1px_2px_rgba\\(0\\,0\\,0\\,0\\.04\\)\\] {\n --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0,0,0,0.04));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_1px_3px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\] {\n --tw-shadow: 0 1px 3px var(--tw-shadow-color, rgba(0,0,0,0.08));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_2px_8px_rgba\\(0\\,0\\,0\\,0\\.15\\)\\] {\n --tw-shadow: 0 2px 8px var(--tw-shadow-color, rgba(0,0,0,0.15));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_2px_12px_rgba\\(59\\,51\\,51\\,0\\.1\\)\\] {\n --tw-shadow: 0 2px 12px var(--tw-shadow-color, rgba(59,51,51,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_4px_16px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\] {\n --tw-shadow: 0 4px 16px var(--tw-shadow-color, rgba(0,0,0,0.08));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_8px_24px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\] {\n --tw-shadow: 0 8px 24px var(--tw-shadow-color, rgba(0,0,0,0.12));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_12px_30px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\] {\n --tw-shadow: 0 12px 30px var(--tw-shadow-color, rgba(0,0,0,0.18));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0px_2px_2px_0px_rgba\\(47\\,47\\,47\\,0\\.08\\)\\] {\n --tw-shadow: 0px 2px 2px 0px var(--tw-shadow-color, rgba(47,47,47,0.08));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0px_2px_4px_0px_\\#A5A3AE4D\\] {\n --tw-shadow: 0px 2px 4px 0px var(--tw-shadow-color, #A5A3AE4D);\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0px_2px_12px_0px_rgba\\(59\\,51\\,51\\,0\\.1\\)\\] {\n --tw-shadow: 0px 2px 12px 0px var(--tw-shadow-color, rgba(59,51,51,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[3px_0px_6px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 3px 0px 6px 0px var(--tw-shadow-color, rgba(0,0,0,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .ring-1 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .ring-\\[\\#2F80ED\\]\\/40 {\n --tw-ring-color: color-mix(in oklab, #2F80ED 40%, transparent);\n }\n .ring-white {\n --tw-ring-color: var(--color-white);\n }\n .filter {\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n }\n .backdrop-blur-\\[2px\\] {\n --tw-backdrop-blur: blur(2px);\n -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n }\n .transition {\n transition-property:\n color,\n background-color,\n border-color,\n outline-color,\n text-decoration-color,\n fill,\n stroke,\n --tw-gradient-from,\n --tw-gradient-via,\n --tw-gradient-to,\n opacity,\n box-shadow,\n transform,\n translate,\n scale,\n rotate,\n filter,\n -webkit-backdrop-filter,\n backdrop-filter,\n display,\n content-visibility,\n overlay,\n pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-\\[background\\] {\n transition-property: background;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-colors {\n transition-property:\n color,\n background-color,\n border-color,\n outline-color,\n text-decoration-color,\n fill,\n stroke,\n --tw-gradient-from,\n --tw-gradient-via,\n --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-transform {\n transition-property:\n transform,\n translate,\n scale,\n rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .duration-150 {\n --tw-duration: 150ms;\n transition-duration: 150ms;\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .duration-300 {\n --tw-duration: 300ms;\n transition-duration: 300ms;\n }\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n .ease-out {\n --tw-ease: var(--ease-out);\n transition-timing-function: var(--ease-out);\n }\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n .select-none {\n -webkit-user-select: none;\n user-select: none;\n }\n .group-hover\\:h-\\[6px\\] {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n height: 6px;\n }\n }\n }\n .group-hover\\:w-\\[6px\\] {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n width: 6px;\n }\n }\n }\n .group-hover\\:border-2 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n }\n }\n .group-hover\\:opacity-0 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n opacity: 0%;\n }\n }\n }\n .group-hover\\:opacity-100 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .group-hover\\/message\\:opacity-100 {\n &:is(:where(.group\\/message):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .group-hover\\/replay\\:opacity-100 {\n &:is(:where(.group\\/replay):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .group-hover\\/translate\\:opacity-100 {\n &:is(:where(.group\\/translate):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .placeholder\\:text-\\[\\#9C9C9C\\] {\n &::placeholder {\n color: #9C9C9C;\n }\n }\n .hover\\:border-\\[\\#777\\] {\n &:hover {\n @media (hover: hover) {\n border-color: #777;\n }\n }\n }\n .hover\\:border-\\[\\#636363\\] {\n &:hover {\n @media (hover: hover) {\n border-color: #636363;\n }\n }\n }\n .hover\\:border-\\[\\#e04a00\\] {\n &:hover {\n @media (hover: hover) {\n border-color: #e04a00;\n }\n }\n }\n .hover\\:bg-\\[\\#2e5939\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #2e5939;\n }\n }\n }\n .hover\\:bg-\\[\\#009db3\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #009db3;\n }\n }\n }\n .hover\\:bg-\\[\\#28A745\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #28A745;\n }\n }\n }\n .hover\\:bg-\\[\\#00375E\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #00375E;\n }\n }\n }\n .hover\\:bg-\\[\\#646464\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #646464;\n }\n }\n }\n .hover\\:bg-\\[\\#F4F6F8\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #F4F6F8;\n }\n }\n }\n .hover\\:bg-\\[\\#c91b20\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #c91b20;\n }\n }\n }\n .hover\\:bg-\\[\\#d97706\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #d97706;\n }\n }\n }\n .hover\\:bg-\\[\\#e04a00\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #e04a00;\n }\n }\n }\n .hover\\:bg-\\[\\#e64a00\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #e64a00;\n }\n }\n }\n .hover\\:bg-\\[\\#f1f1f1\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #f1f1f1;\n }\n }\n }\n .hover\\:bg-\\[\\#f8f8f8\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #f8f8f8;\n }\n }\n }\n .hover\\:bg-\\[\\#f9fafb\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #f9fafb;\n }\n }\n }\n .hover\\:bg-black\\/5 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #000 5%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n }\n }\n }\n .hover\\:bg-black\\/10 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #000 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n }\n }\n }\n }\n .hover\\:bg-gray-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-50);\n }\n }\n }\n .hover\\:text-\\(--color-banbox-warning\\) {\n &:hover {\n @media (hover: hover) {\n color: var(--color-banbox-warning);\n }\n }\n }\n .hover\\:text-\\(--x\\) {\n &:hover {\n @media (hover: hover) {\n color: var(--x);\n }\n }\n }\n .hover\\:text-\\[\\#FF5300\\] {\n &:hover {\n @media (hover: hover) {\n color: #FF5300;\n }\n }\n }\n .hover\\:text-\\[\\#ff5200\\] {\n &:hover {\n @media (hover: hover) {\n color: #ff5200;\n }\n }\n }\n .hover\\:text-\\[\\#ff5301\\] {\n &:hover {\n @media (hover: hover) {\n color: #ff5301;\n }\n }\n }\n .hover\\:text-\\[var\\(--x\\)\\] {\n &:hover {\n @media (hover: hover) {\n color: var(--x);\n }\n }\n }\n .hover\\:brightness-95 {\n &:hover {\n @media (hover: hover) {\n --tw-brightness: brightness(95%);\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n }\n }\n }\n .focus\\:border-\\[\\#2753fb\\] {\n &:focus {\n border-color: #2753fb;\n }\n }\n .focus\\:border-\\[\\#ff5200\\] {\n &:focus {\n border-color: #ff5200;\n }\n }\n .focus\\:ring-1 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n }\n .focus\\:ring-\\[\\#2753fb\\]\\/20 {\n &:focus {\n --tw-ring-color: color-mix(in oklab, #2753fb 20%, transparent);\n }\n }\n .focus\\:ring-\\[\\#ff5200\\]\\/30 {\n &:focus {\n --tw-ring-color: color-mix(in oklab, #ff5200 30%, transparent);\n }\n }\n .focus\\:outline-none {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n }\n .disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n }\n}\n.banbox-chat-root {\n --color-banbox-primary: #ff5300;\n --color-banbox-primary-active: #dc4c07;\n --color-banbox-secondary: #2079b0;\n --color-banbox-tertiary: #74a380;\n --color-banbox-primary-container: #f9d2c4;\n --color-banbox-on-primary-container: #9e3505;\n --color-banbox-secondary-container: #b2e0fc;\n --color-banbox-on-secondary-container: #17547b;\n --color-banbox-tertiary-container: #ceefd6;\n --color-banbox-on-tertiary-container: #3b7249;\n --color-banbox-surface-dim: #f1f1f1;\n --color-banbox-surface: #f2f3f7;\n --color-banbox-surface-bright: #fffcfa;\n --color-banbox-surface-container-lowest: #ffffff;\n --color-banbox-surface-container-low: #fff1ec;\n --color-banbox-surface-container: #fceae5;\n --color-banbox-surface-container-high: #f7e4df;\n --color-banbox-surface-container-highest: #f1dfd9;\n --color-banbox-on-surface: #2c2c2c;\n --color-banbox-text-dynamic: #636363;\n --color-banbox-outline: #e0d6cf;\n --color-banbox-outline-variant: #a89e97;\n --color-banbox-blue: #0d99ff;\n --color-banbox-blue-deep: #1078d8;\n --color-banbox-blue-dim-deep: #006fd6;\n --color-banbox-blue-h: #0a7acc;\n --color-banbox-red: #eb2127;\n --color-banbox-link: #005694;\n --color-banbox-link-h: #004576;\n --color-banbox-review: #fcb532;\n --color-banbox-green: #28c76f;\n --color-banbox-deep-green: #097000;\n --color-banbox-warning: #ff5301;\n --color-banbox-error: #eb2127;\n --color-banbox-ed: #ededed;\n --color-banbox-f8: #f8f8f8;\n --color-banbox-e1: #e1e1e1;\n --color-banbox-fc: #fcfcfc;\n --color-banbox-ca: #cacaca;\n --color-banbox-e5: #e5e5e5;\n --color-banbox-92: #929292;\n --color-banbox-63: #636363;\n --color-banbox-2c: #2c2c2c;\n --color-banbox-f1: #f1f1f1;\n --border-banbox-primary: #636363;\n --border-banbox-e1: #e1e1e1;\n --border-banbox-dark: #374151;\n --radius-banbox-sm: 4px;\n --radius-banbox-md: 6px;\n --radius-lg: 12px;\n --radius-full: 100px;\n --shadow-banbox-modal-primary: 0px 2px 12px 0px #3b33331a;\n --shadow-banbox-card-primary: 0px 6px 12px 0px #3b33331a;\n --shadow-banbox-card-secondary: 0px 2px 2px 0px #2f2f2f14;\n --shadow-banbox-footer-primary: 0px -2px 4px 0px #0000000a;\n}\n.banbox-chat-root[data-theme=marketplace] {\n --color-banbox-primary: #ff5300;\n --color-banbox-primary-active: #dc4c07;\n --color-banbox-surface-container-low: #fff1ec;\n --color-banbox-surface-container: #fceae5;\n}\n.banbox-chat-root[data-theme=admin] {\n --color-banbox-primary: #1a1a1a;\n --color-banbox-primary-active: #000000;\n --color-banbox-secondary: #374151;\n --color-banbox-surface-container-lowest: #ffffff;\n --color-banbox-surface-container-low: #f5f5f5;\n --color-banbox-surface-container: #eeeeee;\n --color-banbox-surface-container-high: #e8e8e8;\n --color-banbox-surface-container-highest: #e0e0e0;\n --color-banbox-outline: #d4d4d4;\n --color-banbox-outline-variant: #9e9e9e;\n}\n.banbox-chat-root .custom-scroll,\n.banbox-chat-root .custom-scroll-hidden {\n --sb-size: 6px;\n --sb-track: #f1f1f1;\n --sb-thumb: #c1c1c1;\n --sb-thumb-hover: #898989;\n overflow-y: auto;\n overscroll-behavior: contain;\n scrollbar-width: thin;\n scrollbar-color: #c1c1c1 #f1f1f1;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar {\n width: 6px;\n height: 6px;\n display: block;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar-track,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 9999px;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar-thumb,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar-thumb {\n background-color: #c1c1c1;\n border-radius: 9999px;\n border: 1px solid #f1f1f1;\n min-height: 40px;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar-thumb:hover,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar-thumb:hover {\n background-color: #898989;\n}\n.banbox-chat-root .custom-scroll-hidden {\n scrollbar-width: none;\n}\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar {\n display: none;\n}\n.banbox-chat-root .no-scrollbar {\n -ms-overflow-style: none;\n scrollbar-width: none;\n}\n.banbox-chat-root .no-scrollbar::-webkit-scrollbar {\n display: none;\n}\n@keyframes banbox-chat-fade-in {\n from {\n opacity: 0;\n transform: translateY(6px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.banbox-chat-root .animate-fade-in {\n animation: banbox-chat-fade-in 0.2s ease-out forwards;\n}\n.banbox-chat-root .chat-bubble-mine {\n background-color: var(--color-banbox-primary);\n color: #fff;\n}\n.banbox-chat-root .chat-thread-active {\n background-color: var(--color-banbox-surface-container-low);\n}\n.banbox-chat-root .chat-btn-send {\n background-color: var(--color-banbox-primary);\n color: #fff;\n}\n.banbox-chat-root .chat-btn-send:hover {\n background-color: var(--color-banbox-primary-active);\n}\n.banbox-chat-root .chat-badge-unread {\n background-color: var(--color-banbox-primary);\n color: #fff;\n}\n@layer utilities {\n .banbox-chat-root * {\n box-sizing: border-box;\n }\n}\n@property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-rotate-x { syntax: "*"; inherits: false; }\n@property --tw-rotate-y { syntax: "*"; inherits: false; }\n@property --tw-rotate-z { syntax: "*"; inherits: false; }\n@property --tw-skew-x { syntax: "*"; inherits: false; }\n@property --tw-skew-y { syntax: "*"; inherits: false; }\n@property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }\n@property --tw-leading { syntax: "*"; inherits: false; }\n@property --tw-font-weight { syntax: "*"; inherits: false; }\n@property --tw-tracking { syntax: "*"; inherits: false; }\n@property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-shadow-color { syntax: "*"; inherits: false; }\n@property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }\n@property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-inset-shadow-color { syntax: "*"; inherits: false; }\n@property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }\n@property --tw-ring-color { syntax: "*"; inherits: false; }\n@property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-inset-ring-color { syntax: "*"; inherits: false; }\n@property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-ring-inset { syntax: "*"; inherits: false; }\n@property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0px; }\n@property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }\n@property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-blur { syntax: "*"; inherits: false; }\n@property --tw-brightness { syntax: "*"; inherits: false; }\n@property --tw-contrast { syntax: "*"; inherits: false; }\n@property --tw-grayscale { syntax: "*"; inherits: false; }\n@property --tw-hue-rotate { syntax: "*"; inherits: false; }\n@property --tw-invert { syntax: "*"; inherits: false; }\n@property --tw-opacity { syntax: "*"; inherits: false; }\n@property --tw-saturate { syntax: "*"; inherits: false; }\n@property --tw-sepia { syntax: "*"; inherits: false; }\n@property --tw-drop-shadow { syntax: "*"; inherits: false; }\n@property --tw-drop-shadow-color { syntax: "*"; inherits: false; }\n@property --tw-drop-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }\n@property --tw-drop-shadow-size { syntax: "*"; inherits: false; }\n@property --tw-backdrop-blur { syntax: "*"; inherits: false; }\n@property --tw-backdrop-brightness { syntax: "*"; inherits: false; }\n@property --tw-backdrop-contrast { syntax: "*"; inherits: false; }\n@property --tw-backdrop-grayscale { syntax: "*"; inherits: false; }\n@property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false; }\n@property --tw-backdrop-invert { syntax: "*"; inherits: false; }\n@property --tw-backdrop-opacity { syntax: "*"; inherits: false; }\n@property --tw-backdrop-saturate { syntax: "*"; inherits: false; }\n@property --tw-backdrop-sepia { syntax: "*"; inherits: false; }\n@property --tw-duration { syntax: "*"; inherits: false; }\n@property --tw-ease { syntax: "*"; inherits: false; }\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *,\n ::before,\n ::after,\n ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-backdrop-blur: initial;\n --tw-backdrop-brightness: initial;\n --tw-backdrop-contrast: initial;\n --tw-backdrop-grayscale: initial;\n --tw-backdrop-hue-rotate: initial;\n --tw-backdrop-invert: initial;\n --tw-backdrop-opacity: initial;\n --tw-backdrop-saturate: initial;\n --tw-backdrop-sepia: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n');
40
+ styleInject('/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n :root,\n :host {\n --font-sans:\n ui-sans-serif,\n system-ui,\n sans-serif,\n "Apple Color Emoji",\n "Segoe UI Emoji",\n "Segoe UI Symbol",\n "Noto Color Emoji";\n --font-mono:\n ui-monospace,\n SFMono-Regular,\n Menlo,\n Monaco,\n Consolas,\n "Liberation Mono",\n "Courier New",\n monospace;\n --color-gray-50: oklch(98.5% 0.002 247.839);\n --color-black: #000;\n --color-white: #fff;\n --spacing: 0.25rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\n --text-sm: 0.875rem;\n --text-sm--line-height: calc(1.25 / 0.875);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-2xl: 1.5rem;\n --text-2xl--line-height: calc(2 / 1.5);\n --text-4xl: 2.25rem;\n --text-4xl--line-height: calc(2.5 / 2.25);\n --font-weight-light: 300;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --tracking-wide: 0.025em;\n --leading-normal: 1.5;\n --radius-xs: 0.125rem;\n --radius-sm: 0.25rem;\n --radius-md: 0.375rem;\n --radius-lg: 0.5rem;\n --ease-out: cubic-bezier(0, 0, 0.2, 1);\n --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n --default-transition-duration: 150ms;\n --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n }\n}\n@layer base {\n *,\n ::after,\n ::before,\n ::backdrop,\n ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html,\n :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b,\n strong {\n font-weight: bolder;\n }\n code,\n kbd,\n samp,\n pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub,\n sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol,\n ul,\n menu {\n list-style: none;\n }\n img,\n svg,\n video,\n canvas,\n audio,\n iframe,\n embed,\n object {\n display: block;\n vertical-align: middle;\n }\n img,\n video {\n max-width: 100%;\n height: auto;\n }\n button,\n input,\n select,\n optgroup,\n textarea,\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n @supports (color: color-mix(in lab, red, red)) {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit,\n ::-webkit-datetime-edit-year-field,\n ::-webkit-datetime-edit-month-field,\n ::-webkit-datetime-edit-day-field,\n ::-webkit-datetime-edit-hour-field,\n ::-webkit-datetime-edit-minute-field,\n ::-webkit-datetime-edit-second-field,\n ::-webkit-datetime-edit-millisecond-field,\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button,\n input:where([type=button], [type=reset], [type=submit]),\n ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button,\n ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden=until-found])) {\n display: none !important;\n }\n}\n@layer utilities {\n .pointer-events-auto {\n pointer-events: auto;\n }\n .pointer-events-none {\n pointer-events: none;\n }\n .visible {\n visibility: visible;\n }\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n border-width: 0;\n }\n .absolute {\n position: absolute;\n }\n .fixed {\n position: fixed;\n }\n .relative {\n position: relative;\n }\n .static {\n position: static;\n }\n .sticky {\n position: sticky;\n }\n .inset-0 {\n inset: calc(var(--spacing) * 0);\n }\n .inset-x-0 {\n inset-inline: calc(var(--spacing) * 0);\n }\n .inset-y-0 {\n inset-block: calc(var(--spacing) * 0);\n }\n .-top-\\[6px\\] {\n top: calc(6px * -1);\n }\n .top-0 {\n top: calc(var(--spacing) * 0);\n }\n .top-1\\/2 {\n top: calc(1 / 2 * 100%);\n }\n .top-\\[-4px\\] {\n top: -4px;\n }\n .top-\\[-6px\\] {\n top: -6px;\n }\n .top-full {\n top: 100%;\n }\n .right-0 {\n right: calc(var(--spacing) * 0);\n }\n .right-3 {\n right: calc(var(--spacing) * 3);\n }\n .right-4 {\n right: calc(var(--spacing) * 4);\n }\n .right-6 {\n right: calc(var(--spacing) * 6);\n }\n .right-\\[-63px\\] {\n right: -63px;\n }\n .right-full {\n right: 100%;\n }\n .-bottom-2 {\n bottom: calc(var(--spacing) * -2);\n }\n .bottom-0 {\n bottom: calc(var(--spacing) * 0);\n }\n .bottom-4 {\n bottom: calc(var(--spacing) * 4);\n }\n .bottom-6 {\n bottom: calc(var(--spacing) * 6);\n }\n .bottom-\\[-13px\\] {\n bottom: -13px;\n }\n .bottom-\\[12px\\] {\n bottom: 12px;\n }\n .bottom-full {\n bottom: 100%;\n }\n .left-0 {\n left: calc(var(--spacing) * 0);\n }\n .left-1\\/2 {\n left: calc(1 / 2 * 100%);\n }\n .left-6 {\n left: calc(var(--spacing) * 6);\n }\n .left-\\[30px\\] {\n left: 30px;\n }\n .left-full {\n left: 100%;\n }\n .-z-\\[1\\] {\n z-index: calc(1 * -1);\n }\n .z-10 {\n z-index: 10;\n }\n .z-50 {\n z-index: 50;\n }\n .z-70 {\n z-index: 70;\n }\n .z-71 {\n z-index: 71;\n }\n .z-9999 {\n z-index: 9999;\n }\n .z-10002 {\n z-index: 10002;\n }\n .z-10003 {\n z-index: 10003;\n }\n .z-10004 {\n z-index: 10004;\n }\n .z-10010 {\n z-index: 10010;\n }\n .z-10011 {\n z-index: 10011;\n }\n .z-\\[-1\\] {\n z-index: -1;\n }\n .z-\\[N\\] {\n z-index: N;\n }\n .container {\n width: 100%;\n @media (width >= 40rem) {\n max-width: 40rem;\n }\n @media (width >= 48rem) {\n max-width: 48rem;\n }\n @media (width >= 64rem) {\n max-width: 64rem;\n }\n @media (width >= 80rem) {\n max-width: 80rem;\n }\n @media (width >= 96rem) {\n max-width: 96rem;\n }\n }\n .mx-auto {\n margin-inline: auto;\n }\n .ms-1 {\n margin-inline-start: calc(var(--spacing) * 1);\n }\n .ms-\\[3px\\] {\n margin-inline-start: 3px;\n }\n .ms-\\[12px\\] {\n margin-inline-start: 12px;\n }\n .me-1 {\n margin-inline-end: calc(var(--spacing) * 1);\n }\n .mt-0\\.5 {\n margin-top: calc(var(--spacing) * 0.5);\n }\n .mt-1 {\n margin-top: calc(var(--spacing) * 1);\n }\n .mt-2 {\n margin-top: calc(var(--spacing) * 2);\n }\n .mt-3 {\n margin-top: calc(var(--spacing) * 3);\n }\n .mt-4 {\n margin-top: calc(var(--spacing) * 4);\n }\n .mt-\\[2px\\] {\n margin-top: 2px;\n }\n .mt-\\[6px\\] {\n margin-top: 6px;\n }\n .mr-2 {\n margin-right: calc(var(--spacing) * 2);\n }\n .mr-auto {\n margin-right: auto;\n }\n .mb-0 {\n margin-bottom: calc(var(--spacing) * 0);\n }\n .mb-0\\.5 {\n margin-bottom: calc(var(--spacing) * 0.5);\n }\n .mb-1 {\n margin-bottom: calc(var(--spacing) * 1);\n }\n .mb-1\\.5 {\n margin-bottom: calc(var(--spacing) * 1.5);\n }\n .mb-2 {\n margin-bottom: calc(var(--spacing) * 2);\n }\n .mb-4 {\n margin-bottom: calc(var(--spacing) * 4);\n }\n .mb-5 {\n margin-bottom: calc(var(--spacing) * 5);\n }\n .mb-10 {\n margin-bottom: calc(var(--spacing) * 10);\n }\n .mb-\\[24px\\] {\n margin-bottom: 24px;\n }\n .-ml-\\[5px\\] {\n margin-left: calc(5px * -1);\n }\n .ml-0\\.5 {\n margin-left: calc(var(--spacing) * 0.5);\n }\n .ml-1 {\n margin-left: calc(var(--spacing) * 1);\n }\n .ml-1\\.5 {\n margin-left: calc(var(--spacing) * 1.5);\n }\n .ml-\\[-5px\\] {\n margin-left: -5px;\n }\n .ml-\\[2px\\] {\n margin-left: 2px;\n }\n .ml-\\[4px\\] {\n margin-left: 4px;\n }\n .ml-auto {\n margin-left: auto;\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .hidden {\n display: none;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\n }\n .h-0 {\n height: calc(var(--spacing) * 0);\n }\n .h-2 {\n height: calc(var(--spacing) * 2);\n }\n .h-2\\.5 {\n height: calc(var(--spacing) * 2.5);\n }\n .h-3 {\n height: calc(var(--spacing) * 3);\n }\n .h-3\\.5 {\n height: calc(var(--spacing) * 3.5);\n }\n .h-4 {\n height: calc(var(--spacing) * 4);\n }\n .h-5 {\n height: calc(var(--spacing) * 5);\n }\n .h-6 {\n height: calc(var(--spacing) * 6);\n }\n .h-7 {\n height: calc(var(--spacing) * 7);\n }\n .h-8 {\n height: calc(var(--spacing) * 8);\n }\n .h-9 {\n height: calc(var(--spacing) * 9);\n }\n .h-10 {\n height: calc(var(--spacing) * 10);\n }\n .h-\\[1\\.17px\\] {\n height: 1.17px;\n }\n .h-\\[4px\\] {\n height: 4px;\n }\n .h-\\[5\\.5px\\] {\n height: 5.5px;\n }\n .h-\\[11\\.25px\\] {\n height: 11.25px;\n }\n .h-\\[14px\\] {\n height: 14px;\n }\n .h-\\[16px\\] {\n height: 16px;\n }\n .h-\\[17\\.5px\\] {\n height: 17.5px;\n }\n .h-\\[18px\\] {\n height: 18px;\n }\n .h-\\[21px\\] {\n height: 21px;\n }\n .h-\\[22px\\] {\n height: 22px;\n }\n .h-\\[24px\\] {\n height: 24px;\n }\n .h-\\[26px\\] {\n height: 26px;\n }\n .h-\\[28px\\] {\n height: 28px;\n }\n .h-\\[30px\\] {\n height: 30px;\n }\n .h-\\[32px\\] {\n height: 32px;\n }\n .h-\\[34px\\] {\n height: 34px;\n }\n .h-\\[36px\\] {\n height: 36px;\n }\n .h-\\[40px\\] {\n height: 40px;\n }\n .h-\\[41px\\] {\n height: 41px;\n }\n .h-\\[44px\\] {\n height: 44px;\n }\n .h-\\[46px\\] {\n height: 46px;\n }\n .h-\\[52px\\] {\n height: 52px;\n }\n .h-\\[64px\\] {\n height: 64px;\n }\n .h-\\[65px\\] {\n height: 65px;\n }\n .h-\\[75px\\] {\n height: 75px;\n }\n .h-\\[100px\\] {\n height: 100px;\n }\n .h-\\[208px\\] {\n height: 208px;\n }\n .h-\\[446px\\] {\n height: 446px;\n }\n .h-\\[650px\\] {\n height: 650px;\n }\n .h-full {\n height: 100%;\n }\n .h-px {\n height: 1px;\n }\n .max-h-\\[200px\\] {\n max-height: 200px;\n }\n .min-h-0 {\n min-height: calc(var(--spacing) * 0);\n }\n .min-h-\\[50px\\] {\n min-height: 50px;\n }\n .min-h-full {\n min-height: 100%;\n }\n .w-0 {\n width: calc(var(--spacing) * 0);\n }\n .w-2 {\n width: calc(var(--spacing) * 2);\n }\n .w-2\\.5 {\n width: calc(var(--spacing) * 2.5);\n }\n .w-3 {\n width: calc(var(--spacing) * 3);\n }\n .w-3\\.5 {\n width: calc(var(--spacing) * 3.5);\n }\n .w-4 {\n width: calc(var(--spacing) * 4);\n }\n .w-5 {\n width: calc(var(--spacing) * 5);\n }\n .w-6 {\n width: calc(var(--spacing) * 6);\n }\n .w-8 {\n width: calc(var(--spacing) * 8);\n }\n .w-9 {\n width: calc(var(--spacing) * 9);\n }\n .w-10 {\n width: calc(var(--spacing) * 10);\n }\n .w-44 {\n width: calc(var(--spacing) * 44);\n }\n .w-\\[5\\.5px\\] {\n width: 5.5px;\n }\n .w-\\[11\\.25px\\] {\n width: 11.25px;\n }\n .w-\\[14px\\] {\n width: 14px;\n }\n .w-\\[16px\\] {\n width: 16px;\n }\n .w-\\[18\\.08px\\] {\n width: 18.08px;\n }\n .w-\\[18px\\] {\n width: 18px;\n }\n .w-\\[22px\\] {\n width: 22px;\n }\n .w-\\[24px\\] {\n width: 24px;\n }\n .w-\\[26px\\] {\n width: 26px;\n }\n .w-\\[28px\\] {\n width: 28px;\n }\n .w-\\[30px\\] {\n width: 30px;\n }\n .w-\\[34px\\] {\n width: 34px;\n }\n .w-\\[36px\\] {\n width: 36px;\n }\n .w-\\[40px\\] {\n width: 40px;\n }\n .w-\\[44px\\] {\n width: 44px;\n }\n .w-\\[46px\\] {\n width: 46px;\n }\n .w-\\[65px\\] {\n width: 65px;\n }\n .w-\\[105px\\] {\n width: 105px;\n }\n .w-\\[130px\\] {\n width: 130px;\n }\n .w-\\[186px\\] {\n width: 186px;\n }\n .w-\\[340px\\] {\n width: 340px;\n }\n .w-\\[355px\\] {\n width: 355px;\n }\n .w-\\[420px\\] {\n width: 420px;\n }\n .w-\\[450px\\] {\n width: 450px;\n }\n .w-\\[460px\\] {\n width: 460px;\n }\n .w-\\[480px\\] {\n width: 480px;\n }\n .w-\\[700px\\] {\n width: 700px;\n }\n .w-fit {\n width: fit-content;\n }\n .w-full {\n width: 100%;\n }\n .w-px {\n width: 1px;\n }\n .max-w-\\[80\\%\\] {\n max-width: 80%;\n }\n .max-w-\\[95\\%\\] {\n max-width: 95%;\n }\n .max-w-\\[95vw\\] {\n max-width: 95vw;\n }\n .max-w-\\[110px\\] {\n max-width: 110px;\n }\n .max-w-\\[151px\\] {\n max-width: 151px;\n }\n .max-w-\\[185px\\] {\n max-width: 185px;\n }\n .max-w-\\[200px\\] {\n max-width: 200px;\n }\n .max-w-\\[260px\\] {\n max-width: 260px;\n }\n .max-w-\\[289px\\] {\n max-width: 289px;\n }\n .max-w-\\[300px\\] {\n max-width: 300px;\n }\n .max-w-\\[410px\\] {\n max-width: 410px;\n }\n .min-w-0 {\n min-width: calc(var(--spacing) * 0);\n }\n .min-w-\\[100px\\] {\n min-width: 100px;\n }\n .min-w-\\[106px\\] {\n min-width: 106px;\n }\n .flex-1 {\n flex: 1;\n }\n .shrink-0 {\n flex-shrink: 0;\n }\n .-translate-x-1\\.5 {\n --tw-translate-x: calc(var(--spacing) * -1.5);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-x-1\\.5 {\n --tw-translate-x: calc(var(--spacing) * 1.5);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .rotate-45 {\n rotate: 45deg;\n }\n .rotate-180 {\n rotate: 180deg;\n }\n .transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n }\n .cursor-auto\\! {\n cursor: auto !important;\n }\n .cursor-default {\n cursor: default;\n }\n .cursor-not-allowed {\n cursor: not-allowed;\n }\n .cursor-pointer {\n cursor: pointer;\n }\n .cursor-zoom-in {\n cursor: zoom-in;\n }\n .resize {\n resize: both;\n }\n .resize-none {\n resize: none;\n }\n .appearance-none {\n appearance: none;\n }\n .grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-7 {\n grid-template-columns: repeat(7, minmax(0, 1fr));\n }\n .grid-cols-\\[1fr_350px\\] {\n grid-template-columns: 1fr 350px;\n }\n .grid-cols-\\[18px_120px_1fr\\] {\n grid-template-columns: 18px 120px 1fr;\n }\n .grid-cols-\\[125px_125px\\] {\n grid-template-columns: 125px 125px;\n }\n .flex-col {\n flex-direction: column;\n }\n .place-items-center {\n place-items: center;\n }\n .items-center {\n align-items: center;\n }\n .items-end {\n align-items: flex-end;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-1\\.5 {\n gap: calc(var(--spacing) * 1.5);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-3 {\n gap: calc(var(--spacing) * 3);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .gap-6 {\n gap: calc(var(--spacing) * 6);\n }\n .gap-\\[6px\\] {\n gap: 6px;\n }\n .gap-\\[17px\\] {\n gap: 17px;\n }\n .gap-\\[18px\\] {\n gap: 18px;\n }\n .gap-\\[24px\\] {\n gap: 24px;\n }\n .space-y-1 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-1\\.5 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-3 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-\\[2px\\] {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(2px * var(--tw-space-y-reverse));\n margin-block-end: calc(2px * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .gap-y-1\\.5 {\n row-gap: calc(var(--spacing) * 1.5);\n }\n .truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-x-auto {\n overflow-x: auto;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .rounded {\n border-radius: 0.25rem;\n }\n .rounded-\\[2\\.33px\\] {\n border-radius: 2.33px;\n }\n .rounded-\\[3\\.5px\\] {\n border-radius: 3.5px;\n }\n .rounded-\\[3px\\] {\n border-radius: 3px;\n }\n .rounded-\\[4px\\] {\n border-radius: 4px;\n }\n .rounded-\\[5px\\] {\n border-radius: 5px;\n }\n .rounded-\\[6px\\] {\n border-radius: 6px;\n }\n .rounded-\\[12px\\] {\n border-radius: 12px;\n }\n .rounded-\\[14px\\] {\n border-radius: 14px;\n }\n .rounded-\\[18px\\] {\n border-radius: 18px;\n }\n .rounded-\\[20px\\] {\n border-radius: 20px;\n }\n .rounded-\\[inherit\\] {\n border-radius: inherit;\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-lg {\n border-radius: var(--radius-lg);\n }\n .rounded-md {\n border-radius: var(--radius-md);\n }\n .rounded-sm {\n border-radius: var(--radius-sm);\n }\n .rounded-xs {\n border-radius: var(--radius-xs);\n }\n .rounded-t-\\[6px\\] {\n border-top-left-radius: 6px;\n border-top-right-radius: 6px;\n }\n .rounded-t-md {\n border-top-left-radius: var(--radius-md);\n border-top-right-radius: var(--radius-md);\n }\n .rounded-tl-\\[3px\\] {\n border-top-left-radius: 3px;\n }\n .rounded-tl-md {\n border-top-left-radius: var(--radius-md);\n }\n .rounded-tr-\\[3px\\] {\n border-top-right-radius: 3px;\n }\n .rounded-tr-\\[6px\\] {\n border-top-right-radius: 6px;\n }\n .rounded-b-\\[6px\\] {\n border-bottom-right-radius: 6px;\n border-bottom-left-radius: 6px;\n }\n .rounded-br-\\[3px\\] {\n border-bottom-right-radius: 3px;\n }\n .rounded-bl-\\[3px\\] {\n border-bottom-left-radius: 3px;\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-\\[0\\.7px\\] {\n border-style: var(--tw-border-style);\n border-width: 0.7px;\n }\n .border-\\[1\\.5px\\] {\n border-style: var(--tw-border-style);\n border-width: 1.5px;\n }\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n .border-t-16 {\n border-top-style: var(--tw-border-style);\n border-top-width: 16px;\n }\n .border-t-\\[5px\\] {\n border-top-style: var(--tw-border-style);\n border-top-width: 5px;\n }\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n .border-r-\\[5px\\] {\n border-right-style: var(--tw-border-style);\n border-right-width: 5px;\n }\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n .border-l-2 {\n border-left-style: var(--tw-border-style);\n border-left-width: 2px;\n }\n .border-l-16 {\n border-left-style: var(--tw-border-style);\n border-left-width: 16px;\n }\n .border-l-\\[5px\\] {\n border-left-style: var(--tw-border-style);\n border-left-width: 5px;\n }\n .border-none {\n --tw-border-style: none;\n border-style: none;\n }\n .border-\\[\\#00b8d4\\] {\n border-color: #00b8d4;\n }\n .border-\\[\\#3D3D3D\\] {\n border-color: #3D3D3D;\n }\n .border-\\[\\#3d3d3d\\] {\n border-color: #3d3d3d;\n }\n .border-\\[\\#3d6b42\\] {\n border-color: #3d6b42;\n }\n .border-\\[\\#6A6A6A\\] {\n border-color: #6A6A6A;\n }\n .border-\\[\\#9BBCCF\\] {\n border-color: #9BBCCF;\n }\n .border-\\[\\#005694\\] {\n border-color: #005694;\n }\n .border-\\[\\#086600\\] {\n border-color: #086600;\n }\n .border-\\[\\#636363\\] {\n border-color: #636363;\n }\n .border-\\[\\#CCCCCC\\] {\n border-color: #CCCCCC;\n }\n .border-\\[\\#D8D8D8\\] {\n border-color: #D8D8D8;\n }\n .border-\\[\\#E5E5E5\\] {\n border-color: #E5E5E5;\n }\n .border-\\[\\#EFEFEF\\] {\n border-color: #EFEFEF;\n }\n .border-\\[\\#F1F1F1\\] {\n border-color: #F1F1F1;\n }\n .border-\\[\\#F8F8F8\\] {\n border-color: #F8F8F8;\n }\n .border-\\[\\#FF5300\\] {\n border-color: #FF5300;\n }\n .border-\\[\\#cacaca\\] {\n border-color: #cacaca;\n }\n .border-\\[\\#d1d5db\\] {\n border-color: #d1d5db;\n }\n .border-\\[\\#e1e1e1\\] {\n border-color: #e1e1e1;\n }\n .border-\\[\\#ededed\\] {\n border-color: #ededed;\n }\n .border-\\[\\#ef4444\\] {\n border-color: #ef4444;\n }\n .border-\\[\\#f1f1f1\\] {\n border-color: #f1f1f1;\n }\n .border-\\[\\#f8f8f8\\] {\n border-color: #f8f8f8;\n }\n .border-\\[\\#f59e0b\\] {\n border-color: #f59e0b;\n }\n .border-black {\n border-color: var(--color-black);\n }\n .border-transparent {\n border-color: transparent;\n }\n .border-t-\\[\\#636363\\] {\n border-top-color: #636363;\n }\n .border-t-\\[\\#FFD2BD\\] {\n border-top-color: #FFD2BD;\n }\n .border-t-transparent {\n border-top-color: transparent;\n }\n .border-r-transparent {\n border-right-color: transparent;\n }\n .border-l-transparent {\n border-left-color: transparent;\n }\n .\\!bg-\\[\\#hex\\] {\n background-color: #hex !important;\n }\n .bg-\\(--color-banbox-f8\\,\\#f8f8f8\\) {\n background-color: var(--color-banbox-f8,#f8f8f8);\n }\n .bg-\\(--color-banbox-primary-container\\,\\#f0f4ff\\) {\n background-color: var(--color-banbox-primary-container,#f0f4ff);\n }\n .bg-\\(--x\\,fallback\\) {\n background-color: var(--x,fallback);\n }\n .bg-\\[\\#00b8d4\\] {\n background-color: #00b8d4;\n }\n .bg-\\[\\#00b8d4\\]\\/10 {\n background-color: color-mix(in oklab, #00b8d4 10%, transparent);\n }\n .bg-\\[\\#1E8E3E\\] {\n background-color: #1E8E3E;\n }\n .bg-\\[\\#3D3D3D\\] {\n background-color: #3D3D3D;\n }\n .bg-\\[\\#3D3D3D\\]\\/10 {\n background-color: color-mix(in oklab, #3D3D3D 10%, transparent);\n }\n .bg-\\[\\#3d3d3d\\] {\n background-color: #3d3d3d;\n }\n .bg-\\[\\#3d6b42\\] {\n background-color: #3d6b42;\n }\n .bg-\\[\\#3d6b42\\]\\/10 {\n background-color: color-mix(in oklab, #3d6b42 10%, transparent);\n }\n .bg-\\[\\#005694\\] {\n background-color: #005694;\n }\n .bg-\\[\\#086600\\] {\n background-color: #086600;\n }\n .bg-\\[\\#328545\\] {\n background-color: #328545;\n }\n .bg-\\[\\#636363\\] {\n background-color: #636363;\n }\n .bg-\\[\\#636363\\]\\! {\n background-color: #636363 !important;\n }\n .bg-\\[\\#747474\\] {\n background-color: #747474;\n }\n .bg-\\[\\#BDBDBD\\] {\n background-color: #BDBDBD;\n }\n .bg-\\[\\#E0EFF8\\] {\n background-color: #E0EFF8;\n }\n .bg-\\[\\#E6F5E6\\] {\n background-color: #E6F5E6;\n }\n .bg-\\[\\#E7E7E7\\] {\n background-color: #E7E7E7;\n }\n .bg-\\[\\#F1F1F1\\] {\n background-color: #F1F1F1;\n }\n .bg-\\[\\#F5F7FA\\] {\n background-color: #F5F7FA;\n }\n .bg-\\[\\#F7F7F7\\] {\n background-color: #F7F7F7;\n }\n .bg-\\[\\#F8F8F8\\] {\n background-color: #F8F8F8;\n }\n .bg-\\[\\#FF5300\\] {\n background-color: #FF5300;\n }\n .bg-\\[\\#FFDBCF\\] {\n background-color: #FFDBCF;\n }\n .bg-\\[\\#FFE9DB\\] {\n background-color: #FFE9DB;\n }\n .bg-\\[\\#FFEAE0\\] {\n background-color: #FFEAE0;\n }\n .bg-\\[\\#cacaca\\] {\n background-color: #cacaca;\n }\n .bg-\\[\\#e1e1e1\\] {\n background-color: #e1e1e1;\n }\n .bg-\\[\\#eb2127\\] {\n background-color: #eb2127;\n }\n .bg-\\[\\#ececec\\] {\n background-color: #ececec;\n }\n .bg-\\[\\#ef4444\\] {\n background-color: #ef4444;\n }\n .bg-\\[\\#ef4444\\]\\/10 {\n background-color: color-mix(in oklab, #ef4444 10%, transparent);\n }\n .bg-\\[\\#f0f4ff\\] {\n background-color: #f0f4ff;\n }\n .bg-\\[\\#f1f1f1\\] {\n background-color: #f1f1f1;\n }\n .bg-\\[\\#f8f8f8\\] {\n background-color: #f8f8f8;\n }\n .bg-\\[\\#f59e0b\\] {\n background-color: #f59e0b;\n }\n .bg-\\[\\#f59e0b\\]\\/10 {\n background-color: color-mix(in oklab, #f59e0b 10%, transparent);\n }\n .bg-\\[\\#ff5200\\] {\n background-color: #ff5200;\n }\n .bg-\\[\\#hex\\]\\! {\n background-color: #hex !important;\n }\n .bg-\\[var\\(--x\\,fallback\\)\\] {\n background-color: var(--x,fallback);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-black\\/5 {\n background-color: color-mix(in srgb, #000 5%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n }\n .bg-black\\/30 {\n background-color: color-mix(in srgb, #000 30%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 30%, transparent);\n }\n }\n .bg-black\\/35 {\n background-color: color-mix(in srgb, #000 35%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 35%, transparent);\n }\n }\n .bg-black\\/40 {\n background-color: color-mix(in srgb, #000 40%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 40%, transparent);\n }\n }\n .bg-transparent {\n background-color: transparent;\n }\n .bg-white {\n background-color: var(--color-white);\n }\n .bg-cover {\n background-size: cover;\n }\n .bg-no-repeat {\n background-repeat: no-repeat;\n }\n .object-contain {\n object-fit: contain;\n }\n .object-cover {\n object-fit: cover;\n }\n .p-1 {\n padding: calc(var(--spacing) * 1);\n }\n .p-2 {\n padding: calc(var(--spacing) * 2);\n }\n .p-3 {\n padding: calc(var(--spacing) * 3);\n }\n .p-3\\.5 {\n padding: calc(var(--spacing) * 3.5);\n }\n .p-4 {\n padding: calc(var(--spacing) * 4);\n }\n .p-6 {\n padding: calc(var(--spacing) * 6);\n }\n .p-\\[1\\.75px\\] {\n padding: 1.75px;\n }\n .p-\\[2px\\] {\n padding: 2px;\n }\n .p-\\[3px\\] {\n padding: 3px;\n }\n .p-\\[7px\\] {\n padding: 7px;\n }\n .p-px {\n padding: 1px;\n }\n .px-2 {\n padding-inline: calc(var(--spacing) * 2);\n }\n .px-2\\.5 {\n padding-inline: calc(var(--spacing) * 2.5);\n }\n .px-3 {\n padding-inline: calc(var(--spacing) * 3);\n }\n .px-4 {\n padding-inline: calc(var(--spacing) * 4);\n }\n .px-5 {\n padding-inline: calc(var(--spacing) * 5);\n }\n .px-6 {\n padding-inline: calc(var(--spacing) * 6);\n }\n .px-8 {\n padding-inline: calc(var(--spacing) * 8);\n }\n .px-\\[3px\\] {\n padding-inline: 3px;\n }\n .px-\\[4px\\] {\n padding-inline: 4px;\n }\n .px-\\[10px\\] {\n padding-inline: 10px;\n }\n .px-\\[12px\\] {\n padding-inline: 12px;\n }\n .px-\\[14px\\] {\n padding-inline: 14px;\n }\n .px-\\[16px\\] {\n padding-inline: 16px;\n }\n .px-\\[18px\\] {\n padding-inline: 18px;\n }\n .px-\\[20px\\] {\n padding-inline: 20px;\n }\n .py-0 {\n padding-block: calc(var(--spacing) * 0);\n }\n .py-1 {\n padding-block: calc(var(--spacing) * 1);\n }\n .py-1\\.5 {\n padding-block: calc(var(--spacing) * 1.5);\n }\n .py-2 {\n padding-block: calc(var(--spacing) * 2);\n }\n .py-2\\.5 {\n padding-block: calc(var(--spacing) * 2.5);\n }\n .py-3 {\n padding-block: calc(var(--spacing) * 3);\n }\n .py-4 {\n padding-block: calc(var(--spacing) * 4);\n }\n .py-6 {\n padding-block: calc(var(--spacing) * 6);\n }\n .py-\\[2px\\] {\n padding-block: 2px;\n }\n .py-\\[3px\\] {\n padding-block: 3px;\n }\n .py-\\[7px\\] {\n padding-block: 7px;\n }\n .py-\\[9px\\] {\n padding-block: 9px;\n }\n .ps-\\[16px\\] {\n padding-inline-start: 16px;\n }\n .pe-\\[4px\\] {\n padding-inline-end: 4px;\n }\n .pe-\\[30px\\] {\n padding-inline-end: 30px;\n }\n .pt-1 {\n padding-top: calc(var(--spacing) * 1);\n }\n .pt-2\\.5 {\n padding-top: calc(var(--spacing) * 2.5);\n }\n .pt-4 {\n padding-top: calc(var(--spacing) * 4);\n }\n .pt-\\[2px\\] {\n padding-top: 2px;\n }\n .pt-\\[24px\\] {\n padding-top: 24px;\n }\n .pr-1\\.5 {\n padding-right: calc(var(--spacing) * 1.5);\n }\n .pr-2 {\n padding-right: calc(var(--spacing) * 2);\n }\n .pb-1 {\n padding-bottom: calc(var(--spacing) * 1);\n }\n .pb-2 {\n padding-bottom: calc(var(--spacing) * 2);\n }\n .pb-6 {\n padding-bottom: calc(var(--spacing) * 6);\n }\n .pb-10 {\n padding-bottom: calc(var(--spacing) * 10);\n }\n .pb-\\[2px\\] {\n padding-bottom: 2px;\n }\n .text-left {\n text-align: left;\n }\n .text-right {\n text-align: right;\n }\n .text-2xl {\n font-size: var(--text-2xl);\n line-height: var(--tw-leading, var(--text-2xl--line-height));\n }\n .text-4xl {\n font-size: var(--text-4xl);\n line-height: var(--tw-leading, var(--text-4xl--line-height));\n }\n .text-lg {\n font-size: var(--text-lg);\n line-height: var(--tw-leading, var(--text-lg--line-height));\n }\n .text-sm {\n font-size: var(--text-sm);\n line-height: var(--tw-leading, var(--text-sm--line-height));\n }\n .text-xl {\n font-size: var(--text-xl);\n line-height: var(--tw-leading, var(--text-xl--line-height));\n }\n .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--line-height));\n }\n .text-\\[10px\\] {\n font-size: 10px;\n }\n .text-\\[12px\\] {\n font-size: 12px;\n }\n .text-\\[13px\\] {\n font-size: 13px;\n }\n .text-\\[14px\\] {\n font-size: 14px;\n }\n .text-\\[15px\\] {\n font-size: 15px;\n }\n .text-\\[16px\\] {\n font-size: 16px;\n }\n .text-\\[20px\\] {\n font-size: 20px;\n }\n .text-\\[22px\\] {\n font-size: 22px;\n }\n .leading-4 {\n --tw-leading: calc(var(--spacing) * 4);\n line-height: calc(var(--spacing) * 4);\n }\n .leading-normal {\n --tw-leading: var(--leading-normal);\n line-height: var(--leading-normal);\n }\n .font-light {\n --tw-font-weight: var(--font-weight-light);\n font-weight: var(--font-weight-light);\n }\n .font-medium {\n --tw-font-weight: var(--font-weight-medium);\n font-weight: var(--font-weight-medium);\n }\n .font-normal {\n --tw-font-weight: var(--font-weight-normal);\n font-weight: var(--font-weight-normal);\n }\n .font-semibold {\n --tw-font-weight: var(--font-weight-semibold);\n font-weight: var(--font-weight-semibold);\n }\n .tracking-\\[0\\.4px\\] {\n --tw-tracking: 0.4px;\n letter-spacing: 0.4px;\n }\n .tracking-\\[0\\.5px\\] {\n --tw-tracking: 0.5px;\n letter-spacing: 0.5px;\n }\n .tracking-\\[0\\.25px\\] {\n --tw-tracking: 0.25px;\n letter-spacing: 0.25px;\n }\n .tracking-wide {\n --tw-tracking: var(--tracking-wide);\n letter-spacing: var(--tracking-wide);\n }\n .break-words {\n overflow-wrap: break-word;\n }\n .whitespace-nowrap {\n white-space: nowrap;\n }\n .whitespace-pre-wrap {\n white-space: pre-wrap;\n }\n .text-\\[\\#0D5EA8\\] {\n color: #0D5EA8;\n }\n .text-\\[\\#0F0F0F\\] {\n color: #0F0F0F;\n }\n .text-\\[\\#00b8d4\\] {\n color: #00b8d4;\n }\n .text-\\[\\#1E9E6A\\] {\n color: #1E9E6A;\n }\n .text-\\[\\#2B579A\\] {\n color: #2B579A;\n }\n .text-\\[\\#2C2C2C\\] {\n color: #2C2C2C;\n }\n .text-\\[\\#2c2c2c\\] {\n color: #2c2c2c;\n }\n .text-\\[\\#3D3D3D\\] {\n color: #3D3D3D;\n }\n .text-\\[\\#3d6b42\\] {\n color: #3d6b42;\n }\n .text-\\[\\#004F4F\\] {\n color: #004F4F;\n }\n .text-\\[\\#6B7280\\] {\n color: #6B7280;\n }\n .text-\\[\\#6b7280\\] {\n color: #6b7280;\n }\n .text-\\[\\#9AA1A9\\] {\n color: #9AA1A9;\n }\n .text-\\[\\#9C9C9C\\] {\n color: #9C9C9C;\n }\n .text-\\[\\#9ca3af\\] {\n color: #9ca3af;\n }\n .text-\\[\\#00486F\\] {\n color: #00486F;\n }\n .text-\\[\\#005694\\] {\n color: #005694;\n }\n .text-\\[\\#086600\\] {\n color: #086600;\n }\n .text-\\[\\#161616\\] {\n color: #161616;\n }\n .text-\\[\\#374151\\] {\n color: #374151;\n }\n .text-\\[\\#636363\\] {\n color: #636363;\n }\n .text-\\[\\#747474\\] {\n color: #747474;\n }\n .text-\\[\\#929292\\] {\n color: #929292;\n }\n .text-\\[\\#B7B7B7\\] {\n color: #B7B7B7;\n }\n .text-\\[\\#B9C3D4\\] {\n color: #B9C3D4;\n }\n .text-\\[\\#D93025\\] {\n color: #D93025;\n }\n .text-\\[\\#E63946\\] {\n color: #E63946;\n }\n .text-\\[\\#E69138\\] {\n color: #E69138;\n }\n .text-\\[\\#EA580C\\] {\n color: #EA580C;\n }\n .text-\\[\\#FF5300\\] {\n color: #FF5300;\n }\n .text-\\[\\#ef4444\\] {\n color: #ef4444;\n }\n .text-\\[\\#f59e0b\\] {\n color: #f59e0b;\n }\n .text-\\[\\#ff5200\\] {\n color: #ff5200;\n }\n .text-\\[\\#ff5301\\] {\n color: #ff5301;\n }\n .text-black {\n color: var(--color-black);\n }\n .text-white {\n color: var(--color-white);\n }\n .capitalize {\n text-transform: capitalize;\n }\n .uppercase {\n text-transform: uppercase;\n }\n .underline {\n text-decoration-line: underline;\n }\n .underline-offset-4 {\n text-underline-offset: 4px;\n }\n .placeholder-\\[\\#9ca3af\\] {\n &::placeholder {\n color: #9ca3af;\n }\n }\n .opacity-0 {\n opacity: 0%;\n }\n .opacity-30 {\n opacity: 30%;\n }\n .opacity-50 {\n opacity: 50%;\n }\n .opacity-100 {\n opacity: 100%;\n }\n .shadow-\\[-3px_0px_6px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: -3px 0px 6px 0px var(--tw-shadow-color, rgba(0,0,0,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_1px_2px_rgba\\(0\\,0\\,0\\,0\\.04\\)\\] {\n --tw-shadow: 0 1px 2px var(--tw-shadow-color, rgba(0,0,0,0.04));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_1px_3px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\] {\n --tw-shadow: 0 1px 3px var(--tw-shadow-color, rgba(0,0,0,0.08));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_2px_8px_rgba\\(0\\,0\\,0\\,0\\.15\\)\\] {\n --tw-shadow: 0 2px 8px var(--tw-shadow-color, rgba(0,0,0,0.15));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_2px_12px_rgba\\(59\\,51\\,51\\,0\\.1\\)\\] {\n --tw-shadow: 0 2px 12px var(--tw-shadow-color, rgba(59,51,51,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_4px_16px_rgba\\(0\\,0\\,0\\,0\\.08\\)\\] {\n --tw-shadow: 0 4px 16px var(--tw-shadow-color, rgba(0,0,0,0.08));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_8px_24px_rgba\\(0\\,0\\,0\\,0\\.12\\)\\] {\n --tw-shadow: 0 8px 24px var(--tw-shadow-color, rgba(0,0,0,0.12));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0_12px_30px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\] {\n --tw-shadow: 0 12px 30px var(--tw-shadow-color, rgba(0,0,0,0.18));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0px_2px_2px_0px_rgba\\(47\\,47\\,47\\,0\\.08\\)\\] {\n --tw-shadow: 0px 2px 2px 0px var(--tw-shadow-color, rgba(47,47,47,0.08));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0px_2px_4px_0px_\\#A5A3AE4D\\] {\n --tw-shadow: 0px 2px 4px 0px var(--tw-shadow-color, #A5A3AE4D);\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[0px_2px_12px_0px_rgba\\(59\\,51\\,51\\,0\\.1\\)\\] {\n --tw-shadow: 0px 2px 12px 0px var(--tw-shadow-color, rgba(59,51,51,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .shadow-\\[3px_0px_6px_0px_rgba\\(0\\,0\\,0\\,0\\.1\\)\\] {\n --tw-shadow: 3px 0px 6px 0px var(--tw-shadow-color, rgba(0,0,0,0.1));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .ring-1 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n .ring-\\[\\#2F80ED\\]\\/40 {\n --tw-ring-color: color-mix(in oklab, #2F80ED 40%, transparent);\n }\n .ring-white {\n --tw-ring-color: var(--color-white);\n }\n .filter {\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n }\n .backdrop-blur-\\[2px\\] {\n --tw-backdrop-blur: blur(2px);\n -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);\n }\n .transition {\n transition-property:\n color,\n background-color,\n border-color,\n outline-color,\n text-decoration-color,\n fill,\n stroke,\n --tw-gradient-from,\n --tw-gradient-via,\n --tw-gradient-to,\n opacity,\n box-shadow,\n transform,\n translate,\n scale,\n rotate,\n filter,\n -webkit-backdrop-filter,\n backdrop-filter,\n display,\n content-visibility,\n overlay,\n pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-\\[background\\] {\n transition-property: background;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-colors {\n transition-property:\n color,\n background-color,\n border-color,\n outline-color,\n text-decoration-color,\n fill,\n stroke,\n --tw-gradient-from,\n --tw-gradient-via,\n --tw-gradient-to;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .transition-transform {\n transition-property:\n transform,\n translate,\n scale,\n rotate;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n transition-duration: var(--tw-duration, var(--default-transition-duration));\n }\n .duration-150 {\n --tw-duration: 150ms;\n transition-duration: 150ms;\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .duration-300 {\n --tw-duration: 300ms;\n transition-duration: 300ms;\n }\n .ease-in-out {\n --tw-ease: var(--ease-in-out);\n transition-timing-function: var(--ease-in-out);\n }\n .ease-out {\n --tw-ease: var(--ease-out);\n transition-timing-function: var(--ease-out);\n }\n .outline-none {\n --tw-outline-style: none;\n outline-style: none;\n }\n .select-none {\n -webkit-user-select: none;\n user-select: none;\n }\n .group-hover\\:h-\\[6px\\] {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n height: 6px;\n }\n }\n }\n .group-hover\\:w-\\[6px\\] {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n width: 6px;\n }\n }\n }\n .group-hover\\:border-2 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n border-style: var(--tw-border-style);\n border-width: 2px;\n }\n }\n }\n .group-hover\\:opacity-0 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n opacity: 0%;\n }\n }\n }\n .group-hover\\:opacity-100 {\n &:is(:where(.group):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .group-hover\\/message\\:opacity-100 {\n &:is(:where(.group\\/message):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .group-hover\\/replay\\:opacity-100 {\n &:is(:where(.group\\/replay):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .group-hover\\/translate\\:opacity-100 {\n &:is(:where(.group\\/translate):hover *) {\n @media (hover: hover) {\n opacity: 100%;\n }\n }\n }\n .placeholder\\:text-\\[\\#9C9C9C\\] {\n &::placeholder {\n color: #9C9C9C;\n }\n }\n .hover\\:border-\\[\\#777\\] {\n &:hover {\n @media (hover: hover) {\n border-color: #777;\n }\n }\n }\n .hover\\:border-\\[\\#636363\\] {\n &:hover {\n @media (hover: hover) {\n border-color: #636363;\n }\n }\n }\n .hover\\:border-\\[\\#e04a00\\] {\n &:hover {\n @media (hover: hover) {\n border-color: #e04a00;\n }\n }\n }\n .hover\\:bg-\\[\\#2e5939\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #2e5939;\n }\n }\n }\n .hover\\:bg-\\[\\#009db3\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #009db3;\n }\n }\n }\n .hover\\:bg-\\[\\#28A745\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #28A745;\n }\n }\n }\n .hover\\:bg-\\[\\#00375E\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #00375E;\n }\n }\n }\n .hover\\:bg-\\[\\#646464\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #646464;\n }\n }\n }\n .hover\\:bg-\\[\\#F4F6F8\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #F4F6F8;\n }\n }\n }\n .hover\\:bg-\\[\\#c91b20\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #c91b20;\n }\n }\n }\n .hover\\:bg-\\[\\#d97706\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #d97706;\n }\n }\n }\n .hover\\:bg-\\[\\#e04a00\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #e04a00;\n }\n }\n }\n .hover\\:bg-\\[\\#e64a00\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #e64a00;\n }\n }\n }\n .hover\\:bg-\\[\\#f1f1f1\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #f1f1f1;\n }\n }\n }\n .hover\\:bg-\\[\\#f8f8f8\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #f8f8f8;\n }\n }\n }\n .hover\\:bg-\\[\\#f9fafb\\] {\n &:hover {\n @media (hover: hover) {\n background-color: #f9fafb;\n }\n }\n }\n .hover\\:bg-black\\/5 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #000 5%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 5%, transparent);\n }\n }\n }\n }\n .hover\\:bg-black\\/10 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, #000 10%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-black) 10%, transparent);\n }\n }\n }\n }\n .hover\\:bg-gray-50 {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-gray-50);\n }\n }\n }\n .hover\\:bg-white {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-white);\n }\n }\n }\n .hover\\:text-\\(--color-banbox-warning\\) {\n &:hover {\n @media (hover: hover) {\n color: var(--color-banbox-warning);\n }\n }\n }\n .hover\\:text-\\(--x\\) {\n &:hover {\n @media (hover: hover) {\n color: var(--x);\n }\n }\n }\n .hover\\:text-\\[\\#FF5300\\] {\n &:hover {\n @media (hover: hover) {\n color: #FF5300;\n }\n }\n }\n .hover\\:text-\\[\\#ff5200\\] {\n &:hover {\n @media (hover: hover) {\n color: #ff5200;\n }\n }\n }\n .hover\\:text-\\[\\#ff5301\\] {\n &:hover {\n @media (hover: hover) {\n color: #ff5301;\n }\n }\n }\n .hover\\:text-\\[var\\(--x\\)\\] {\n &:hover {\n @media (hover: hover) {\n color: var(--x);\n }\n }\n }\n .hover\\:shadow-\\[-3px_0px_10px_0px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: -3px 0px 10px 0px var(--tw-shadow-color, rgba(0,0,0,0.18));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n }\n }\n .hover\\:shadow-\\[3px_0px_10px_0px_rgba\\(0\\,0\\,0\\,0\\.18\\)\\] {\n &:hover {\n @media (hover: hover) {\n --tw-shadow: 3px 0px 10px 0px var(--tw-shadow-color, rgba(0,0,0,0.18));\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n }\n }\n .hover\\:brightness-95 {\n &:hover {\n @media (hover: hover) {\n --tw-brightness: brightness(95%);\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n }\n }\n }\n .focus\\:border-\\[\\#2753fb\\] {\n &:focus {\n border-color: #2753fb;\n }\n }\n .focus\\:border-\\[\\#ff5200\\] {\n &:focus {\n border-color: #ff5200;\n }\n }\n .focus\\:ring-1 {\n &:focus {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow:\n var(--tw-inset-shadow),\n var(--tw-inset-ring-shadow),\n var(--tw-ring-offset-shadow),\n var(--tw-ring-shadow),\n var(--tw-shadow);\n }\n }\n .focus\\:ring-\\[\\#2753fb\\]\\/20 {\n &:focus {\n --tw-ring-color: color-mix(in oklab, #2753fb 20%, transparent);\n }\n }\n .focus\\:ring-\\[\\#ff5200\\]\\/30 {\n &:focus {\n --tw-ring-color: color-mix(in oklab, #ff5200 30%, transparent);\n }\n }\n .focus\\:outline-none {\n &:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n }\n .disabled\\:opacity-50 {\n &:disabled {\n opacity: 50%;\n }\n }\n}\n.banbox-chat-root {\n --color-banbox-primary: #ff5300;\n --color-banbox-primary-active: #dc4c07;\n --color-banbox-secondary: #2079b0;\n --color-banbox-tertiary: #74a380;\n --color-banbox-primary-container: #f9d2c4;\n --color-banbox-on-primary-container: #9e3505;\n --color-banbox-secondary-container: #b2e0fc;\n --color-banbox-on-secondary-container: #17547b;\n --color-banbox-tertiary-container: #ceefd6;\n --color-banbox-on-tertiary-container: #3b7249;\n --color-banbox-surface-dim: #f1f1f1;\n --color-banbox-surface: #f2f3f7;\n --color-banbox-surface-bright: #fffcfa;\n --color-banbox-surface-container-lowest: #ffffff;\n --color-banbox-surface-container-low: #fff1ec;\n --color-banbox-surface-container: #fceae5;\n --color-banbox-surface-container-high: #f7e4df;\n --color-banbox-surface-container-highest: #f1dfd9;\n --color-banbox-on-surface: #2c2c2c;\n --color-banbox-text-dynamic: #636363;\n --color-banbox-outline: #e0d6cf;\n --color-banbox-outline-variant: #a89e97;\n --color-banbox-blue: #0d99ff;\n --color-banbox-blue-deep: #1078d8;\n --color-banbox-blue-dim-deep: #006fd6;\n --color-banbox-blue-h: #0a7acc;\n --color-banbox-red: #eb2127;\n --color-banbox-link: #005694;\n --color-banbox-link-h: #004576;\n --color-banbox-review: #fcb532;\n --color-banbox-green: #28c76f;\n --color-banbox-deep-green: #097000;\n --color-banbox-warning: #ff5301;\n --color-banbox-error: #eb2127;\n --color-banbox-ed: #ededed;\n --color-banbox-f8: #f8f8f8;\n --color-banbox-e1: #e1e1e1;\n --color-banbox-fc: #fcfcfc;\n --color-banbox-ca: #cacaca;\n --color-banbox-e5: #e5e5e5;\n --color-banbox-92: #929292;\n --color-banbox-63: #636363;\n --color-banbox-2c: #2c2c2c;\n --color-banbox-f1: #f1f1f1;\n --border-banbox-primary: #636363;\n --border-banbox-e1: #e1e1e1;\n --border-banbox-dark: #374151;\n --radius-banbox-sm: 4px;\n --radius-banbox-md: 6px;\n --radius-lg: 12px;\n --radius-full: 100px;\n --shadow-banbox-modal-primary: 0px 2px 12px 0px #3b33331a;\n --shadow-banbox-card-primary: 0px 6px 12px 0px #3b33331a;\n --shadow-banbox-card-secondary: 0px 2px 2px 0px #2f2f2f14;\n --shadow-banbox-footer-primary: 0px -2px 4px 0px #0000000a;\n}\n.banbox-chat-root[data-theme=marketplace] {\n --color-banbox-primary: #ff5300;\n --color-banbox-primary-active: #dc4c07;\n --color-banbox-surface-container-low: #fff1ec;\n --color-banbox-surface-container: #fceae5;\n}\n.banbox-chat-root[data-theme=admin] {\n --color-banbox-primary: #1a1a1a;\n --color-banbox-primary-active: #000000;\n --color-banbox-secondary: #374151;\n --color-banbox-surface-container-lowest: #ffffff;\n --color-banbox-surface-container-low: #f5f5f5;\n --color-banbox-surface-container: #eeeeee;\n --color-banbox-surface-container-high: #e8e8e8;\n --color-banbox-surface-container-highest: #e0e0e0;\n --color-banbox-outline: #d4d4d4;\n --color-banbox-outline-variant: #9e9e9e;\n}\n.banbox-chat-root .custom-scroll,\n.banbox-chat-root .custom-scroll-hidden {\n --sb-size: 6px;\n --sb-track: #f1f1f1;\n --sb-thumb: #c1c1c1;\n --sb-thumb-hover: #898989;\n overflow-y: auto;\n overscroll-behavior: contain;\n scrollbar-width: thin;\n scrollbar-color: #c1c1c1 #f1f1f1;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar {\n width: 6px;\n height: 6px;\n display: block;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar-track,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 9999px;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar-thumb,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar-thumb {\n background-color: #c1c1c1;\n border-radius: 9999px;\n border: 1px solid #f1f1f1;\n min-height: 40px;\n}\n.banbox-chat-root .custom-scroll::-webkit-scrollbar-thumb:hover,\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar-thumb:hover {\n background-color: #898989;\n}\n.banbox-chat-root .custom-scroll-hidden {\n scrollbar-width: none;\n}\n.banbox-chat-root .custom-scroll-hidden::-webkit-scrollbar {\n display: none;\n}\n.banbox-chat-root .no-scrollbar {\n -ms-overflow-style: none;\n scrollbar-width: none;\n}\n.banbox-chat-root .no-scrollbar::-webkit-scrollbar {\n display: none;\n}\n@keyframes banbox-chat-fade-in {\n from {\n opacity: 0;\n transform: translateY(6px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n.banbox-chat-root .animate-fade-in {\n animation: banbox-chat-fade-in 0.2s ease-out forwards;\n}\n.banbox-chat-root .chat-bubble-mine {\n background-color: var(--color-banbox-primary);\n color: #fff;\n}\n.banbox-chat-root .chat-thread-active {\n background-color: var(--color-banbox-surface-container-low);\n}\n.banbox-chat-root .chat-btn-send {\n background-color: var(--color-banbox-primary);\n color: #fff;\n}\n.banbox-chat-root .chat-btn-send:hover {\n background-color: var(--color-banbox-primary-active);\n}\n.banbox-chat-root .chat-badge-unread {\n background-color: var(--color-banbox-primary);\n color: #fff;\n}\n@layer utilities {\n .banbox-chat-root * {\n box-sizing: border-box;\n }\n}\n@property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-rotate-x { syntax: "*"; inherits: false; }\n@property --tw-rotate-y { syntax: "*"; inherits: false; }\n@property --tw-rotate-z { syntax: "*"; inherits: false; }\n@property --tw-skew-x { syntax: "*"; inherits: false; }\n@property --tw-skew-y { syntax: "*"; inherits: false; }\n@property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; }\n@property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }\n@property --tw-leading { syntax: "*"; inherits: false; }\n@property --tw-font-weight { syntax: "*"; inherits: false; }\n@property --tw-tracking { syntax: "*"; inherits: false; }\n@property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-shadow-color { syntax: "*"; inherits: false; }\n@property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }\n@property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-inset-shadow-color { syntax: "*"; inherits: false; }\n@property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }\n@property --tw-ring-color { syntax: "*"; inherits: false; }\n@property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-inset-ring-color { syntax: "*"; inherits: false; }\n@property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-ring-inset { syntax: "*"; inherits: false; }\n@property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0px; }\n@property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }\n@property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }\n@property --tw-blur { syntax: "*"; inherits: false; }\n@property --tw-brightness { syntax: "*"; inherits: false; }\n@property --tw-contrast { syntax: "*"; inherits: false; }\n@property --tw-grayscale { syntax: "*"; inherits: false; }\n@property --tw-hue-rotate { syntax: "*"; inherits: false; }\n@property --tw-invert { syntax: "*"; inherits: false; }\n@property --tw-opacity { syntax: "*"; inherits: false; }\n@property --tw-saturate { syntax: "*"; inherits: false; }\n@property --tw-sepia { syntax: "*"; inherits: false; }\n@property --tw-drop-shadow { syntax: "*"; inherits: false; }\n@property --tw-drop-shadow-color { syntax: "*"; inherits: false; }\n@property --tw-drop-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }\n@property --tw-drop-shadow-size { syntax: "*"; inherits: false; }\n@property --tw-backdrop-blur { syntax: "*"; inherits: false; }\n@property --tw-backdrop-brightness { syntax: "*"; inherits: false; }\n@property --tw-backdrop-contrast { syntax: "*"; inherits: false; }\n@property --tw-backdrop-grayscale { syntax: "*"; inherits: false; }\n@property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false; }\n@property --tw-backdrop-invert { syntax: "*"; inherits: false; }\n@property --tw-backdrop-opacity { syntax: "*"; inherits: false; }\n@property --tw-backdrop-saturate { syntax: "*"; inherits: false; }\n@property --tw-backdrop-sepia { syntax: "*"; inherits: false; }\n@property --tw-duration { syntax: "*"; inherits: false; }\n@property --tw-ease { syntax: "*"; inherits: false; }\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *,\n ::before,\n ::after,\n ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-backdrop-blur: initial;\n --tw-backdrop-brightness: initial;\n --tw-backdrop-contrast: initial;\n --tw-backdrop-grayscale: initial;\n --tw-backdrop-hue-rotate: initial;\n --tw-backdrop-invert: initial;\n --tw-backdrop-opacity: initial;\n --tw-backdrop-saturate: initial;\n --tw-backdrop-sepia: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n }\n }\n}\n');
41
41
  var ChatUIContext = React16.createContext(null);
42
42
  function useChatUI() {
43
43
  const ctx = React16.useContext(ChatUIContext);
@@ -455,7 +455,8 @@ var Select = ({ options, value, onChange, placeholder = "Select...", size = 36,
455
455
  onClick: () => setOpen((v) => !v),
456
456
  className: cn(
457
457
  "flex w-full items-center justify-between rounded-[4px] border border-[#cacaca] bg-white px-3 text-[13px] text-left",
458
- disabled && "cursor-not-allowed opacity-50"
458
+ disabled && "cursor-not-allowed opacity-50",
459
+ !disabled && "cursor-pointer"
459
460
  ),
460
461
  style: { height: size },
461
462
  children: [
@@ -469,7 +470,7 @@ var Select = ({ options, value, onChange, placeholder = "Select...", size = 36,
469
470
  {
470
471
  type: "button",
471
472
  className: cn(
472
- "flex w-full items-center px-3 py-2 text-[13px] text-left hover:bg-black/5",
473
+ "flex w-full cursor-pointer items-center px-3 py-2 text-[13px] text-left hover:bg-black/5",
473
474
  opt.value === value && "bg-black/5 font-medium"
474
475
  ),
475
476
  onClick: () => {
@@ -541,7 +542,7 @@ var ChatTranslateSettingsModal = ({
541
542
  onClose();
542
543
  },
543
544
  children: [
544
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-black/30 rounded-[inherit]" }),
545
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-black/30 rounded-[inherit] overflow-hidden" }),
545
546
  /* @__PURE__ */ jsxRuntime.jsxs(
546
547
  "div",
547
548
  {
@@ -551,7 +552,7 @@ var ChatTranslateSettingsModal = ({
551
552
  onClick: (e) => e.stopPropagation(),
552
553
  className: clsx3__default.default(
553
554
  "relative w-[460px] max-w-[95%]",
554
- "overflow-clip rounded-[6px] bg-white shadow-[0px_2px_12px_0px_rgba(59,51,51,0.1)]",
555
+ "rounded-[6px] bg-white shadow-[0px_2px_12px_0px_rgba(59,51,51,0.1)]",
555
556
  className
556
557
  ),
557
558
  children: [
@@ -1296,7 +1297,7 @@ var extColor = (ext) => {
1296
1297
  }
1297
1298
  return "text-[#6B7280]";
1298
1299
  };
1299
- var FilePreviewChip = ({ name, sizeMB, ext, onRemove }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mr-2 inline-flex items-center gap-3 whitespace-nowrap rounded-sm border border-[#e1e1e1] bg-white px-3 py-2 h-[65px] max-w-[185px]", children: [
1300
+ var FilePreviewChip = ({ name, sizeMB, ext, onRemove }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mr-2 inline-flex items-center gap-2 whitespace-nowrap rounded-sm border border-[#e1e1e1] bg-white px-3 py-2 h-[65px] max-w-[185px]", children: [
1300
1301
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-w-0 items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
1301
1302
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
1302
1303
  /* @__PURE__ */ jsxRuntime.jsx(FileIcon, { className: clsx3__default.default("h-[18px] w-[18px]", extColor(ext)) }),
@@ -1312,26 +1313,29 @@ var FilePreviewChip = ({ name, sizeMB, ext, onRemove }) => /* @__PURE__ */ jsxRu
1312
1313
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "uppercase", children: ext })
1313
1314
  ] })
1314
1315
  ] }) }),
1315
- /* @__PURE__ */ jsxRuntime.jsx(
1316
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: /* @__PURE__ */ jsxRuntime.jsx(
1316
1317
  "button",
1317
1318
  {
1318
1319
  type: "button",
1319
1320
  onClick: onRemove,
1320
- className: "grid h-8 w-8 place-items-center rounded-full bg-white text-[#3D3D3D] shadow-[0px_2px_4px_0px_#A5A3AE4D] hover:bg-black/5",
1321
+ className: "grid h-[24px] w-[24px] cursor-pointer place-items-center rounded-full bg-white text-[#3D3D3D] shadow-[0px_2px_4px_0px_#A5A3AE4D] hover:bg-black/5",
1321
1322
  title: "Remove",
1322
1323
  "aria-label": "Remove file",
1323
1324
  children: /* @__PURE__ */ jsxRuntime.jsx(ChatXIcon, { className: "h-[18px] w-[18px]" })
1324
1325
  }
1325
- )
1326
+ ) })
1326
1327
  ] });
1327
- var ImageThumb = ({ url, onRemove }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative mr-2 inline-block h-[65px] w-[65px] rounded-sm border border-[#e1e1e1] bg-[#F7F7F7]", children: [
1328
+ var ImageThumb = ({
1329
+ url,
1330
+ onRemove
1331
+ }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative mr-2 inline-block h-[65px] w-[65px] rounded-sm border border-[#e1e1e1] bg-[#F7F7F7]", children: [
1328
1332
  /* @__PURE__ */ jsxRuntime.jsx("img", { src: url, alt: "", className: "h-full w-full object-cover rounded-sm" }),
1329
1333
  /* @__PURE__ */ jsxRuntime.jsx(
1330
1334
  "button",
1331
1335
  {
1332
1336
  type: "button",
1333
1337
  onClick: onRemove,
1334
- className: "absolute left-1/2 top-1/2 z-10 grid h-6 w-6 -translate-x-1/2 -translate-y-1/2 place-items-center rounded-full bg-black/30 text-[#3D3D3D] shadow-[0px_2px_4px_0px_#A5A3AE4D]",
1338
+ className: "absolute left-1/2 top-1/2 z-10 grid h-6 w-6 -translate-x-1/2 -translate-y-1/2 cursor-pointer place-items-center rounded-full bg-black/30 text-[#3D3D3D] shadow-[0px_2px_4px_0px_#A5A3AE4D]",
1335
1339
  "aria-label": "Remove image",
1336
1340
  title: "Remove image",
1337
1341
  children: /* @__PURE__ */ jsxRuntime.jsx(ChatXIcon, { className: "h-4 w-4 text-white" })
@@ -1388,18 +1392,18 @@ var ChatComposerBar = ({
1388
1392
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full items-stretch gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(
1389
1393
  "div",
1390
1394
  {
1391
- className: "w-full rounded-sm p-px transition-[background] duration-200",
1395
+ className: "w-full rounded-[6px] p-px transition-[background] duration-200",
1392
1396
  style: {
1393
1397
  background: isActiveBorder ? activeGradient : idleGradient
1394
1398
  },
1395
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[50px] w-full items-center justify-between rounded-[3px] bg-white", children: [
1399
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[50px] w-full items-center justify-between rounded-[5px] bg-white", children: [
1396
1400
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full items-center justify-between p-[3px]", children: [
1397
1401
  !isTyping ? /* @__PURE__ */ jsxRuntime.jsx(
1398
1402
  "button",
1399
1403
  {
1400
1404
  type: "button",
1401
1405
  onClick: startRecording,
1402
- className: "grid h-[44px] w-[44px] place-items-center rounded-xs bg-[#f8f8f8] text-[#ff5301] hover:brightness-95",
1406
+ className: "grid h-[44px] w-[44px] cursor-pointer place-items-center rounded-xs bg-[#f8f8f8] text-[#ff5301] hover:brightness-95",
1403
1407
  title: "Record voice",
1404
1408
  "aria-label": "Record voice",
1405
1409
  children: /* @__PURE__ */ jsxRuntime.jsx(RecordMicIcon, { className: "h-6 w-6" })
@@ -1451,7 +1455,7 @@ var ChatComposerBar = ({
1451
1455
  type: "button",
1452
1456
  onClick: sendText,
1453
1457
  className: clsx3__default.default(
1454
- "ms-1 grid h-[40px] w-[40px] place-items-center rounded-full text-[#ff5301] hover:bg-[#f8f8f8]"
1458
+ "ms-1 grid h-[40px] w-[40px] cursor-pointer place-items-center rounded-full text-[#ff5301] hover:bg-[#f8f8f8]"
1455
1459
  ),
1456
1460
  title: hasAttachments ? "Send attachments" : "Send",
1457
1461
  "aria-label": "Send",
@@ -1468,7 +1472,7 @@ var ChatComposerBar = ({
1468
1472
  disabled: !hasAttachments,
1469
1473
  className: clsx3__default.default(
1470
1474
  "ms-1 grid h-[40px] w-[40px] place-items-center rounded-full hover:bg-[#f8f8f8]",
1471
- hasAttachments ? "text-[#ff5301]" : "text-[#B9C3D4]"
1475
+ hasAttachments ? "text-[#ff5301] cursor-pointer" : "text-[#B9C3D4] cursor-not-allowed"
1472
1476
  ),
1473
1477
  title: hasAttachments ? "Send attachments" : "Send",
1474
1478
  "aria-label": "Send",
@@ -1480,52 +1484,59 @@ var ChatComposerBar = ({
1480
1484
  }
1481
1485
  ) });
1482
1486
  }
1483
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full items-stretch gap-2", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full rounded-sm p-px", style: { background: activeGradient }, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[50px] w-full items-center justify-between rounded-[3px] bg-white", children: [
1484
- /* @__PURE__ */ jsxRuntime.jsx(
1485
- "button",
1486
- {
1487
- type: "button",
1488
- className: "grid ms-[3px] h-[46px] w-[46px] place-items-center rounded-xs bg-[#f8f8f8] text-[#ff5301] hover:brightness-95",
1489
- "aria-label": "Recording",
1490
- title: "Recording",
1491
- children: /* @__PURE__ */ jsxRuntime.jsx(
1492
- RecordMicIcon,
1487
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full items-stretch gap-2", children: /* @__PURE__ */ jsxRuntime.jsx(
1488
+ "div",
1489
+ {
1490
+ className: "w-full rounded-sm p-px",
1491
+ style: { background: activeGradient },
1492
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[50px] w-full items-center justify-between rounded-[3px] bg-white", children: [
1493
+ /* @__PURE__ */ jsxRuntime.jsx(
1494
+ "button",
1493
1495
  {
1494
- className: clsx3__default.default(
1495
- "h-6 w-6",
1496
- seconds % 2 === 0 ? "text-[#929292]" : "text-[#ff5301]"
1496
+ type: "button",
1497
+ className: "grid ms-[3px] h-[46px] w-[46px] place-items-center rounded-xs bg-[#f8f8f8] text-[#ff5301] hover:brightness-95",
1498
+ "aria-label": "Recording",
1499
+ title: "Recording",
1500
+ children: /* @__PURE__ */ jsxRuntime.jsx(
1501
+ RecordMicIcon,
1502
+ {
1503
+ className: clsx3__default.default(
1504
+ "h-6 w-6",
1505
+ seconds % 2 === 0 ? "text-[#929292]" : "text-[#ff5301]"
1506
+ )
1507
+ }
1497
1508
  )
1498
1509
  }
1499
- )
1500
- }
1501
- ),
1502
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-3 text-sm", children: fmtTime2(seconds) }),
1503
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-3 pr-2", children: [
1504
- /* @__PURE__ */ jsxRuntime.jsx(
1505
- "button",
1506
- {
1507
- type: "button",
1508
- onClick: () => stopRecording(false),
1509
- className: "grid h-8 w-8 place-items-center rounded-full text-[#3D3D3D] hover:bg-black/5",
1510
- title: "Discard",
1511
- "aria-label": "Discard recording",
1512
- children: /* @__PURE__ */ jsxRuntime.jsx(ChatXIcon, { className: "h-5 w-5" })
1513
- }
1514
- ),
1515
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-6 w-px bg-[#E7E7E7]" }),
1516
- /* @__PURE__ */ jsxRuntime.jsx(
1517
- "button",
1518
- {
1519
- type: "button",
1520
- onClick: () => stopRecording(true),
1521
- className: "grid h-10 w-[40px] place-items-center rounded-full text-[#ff5301]",
1522
- title: "Send",
1523
- "aria-label": "Send",
1524
- children: /* @__PURE__ */ jsxRuntime.jsx(ArrowSendAngleIcon, { className: "h-6 w-6" })
1525
- }
1526
- )
1527
- ] })
1528
- ] }) }) });
1510
+ ),
1511
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-3 text-sm", children: fmtTime2(seconds) }),
1512
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-3 pr-2", children: [
1513
+ /* @__PURE__ */ jsxRuntime.jsx(
1514
+ "button",
1515
+ {
1516
+ type: "button",
1517
+ onClick: () => stopRecording(false),
1518
+ className: "grid h-8 w-8 cursor-pointer place-items-center rounded-full text-[#3D3D3D] hover:bg-black/5",
1519
+ title: "Discard",
1520
+ "aria-label": "Discard recording",
1521
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChatXIcon, { className: "h-5 w-5" })
1522
+ }
1523
+ ),
1524
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-6 w-px bg-[#E7E7E7]" }),
1525
+ /* @__PURE__ */ jsxRuntime.jsx(
1526
+ "button",
1527
+ {
1528
+ type: "button",
1529
+ onClick: () => stopRecording(true),
1530
+ className: "grid h-10 w-[40px] cursor-pointer place-items-center rounded-full text-[#ff5301]",
1531
+ title: "Send",
1532
+ "aria-label": "Send",
1533
+ children: /* @__PURE__ */ jsxRuntime.jsx(ArrowSendAngleIcon, { className: "h-6 w-6" })
1534
+ }
1535
+ )
1536
+ ] })
1537
+ ] })
1538
+ }
1539
+ ) });
1529
1540
  };
1530
1541
  var ChatComposerBar_default = ChatComposerBar;
1531
1542
  var WIDTH = 380;
@@ -1648,7 +1659,7 @@ var BusinessCardDropup = ({
1648
1659
  type: "button",
1649
1660
  onClick: onClose,
1650
1661
  "aria-label": "Close",
1651
- className: "grid h-8 w-8 place-items-center rounded-full hover:bg-black/5",
1662
+ className: "grid h-8 w-8 cursor-pointer place-items-center rounded-full hover:bg-black/5",
1652
1663
  children: /* @__PURE__ */ jsxRuntime.jsx(ChatXIcon, { className: "h-6 w-6" })
1653
1664
  }
1654
1665
  )
@@ -1782,7 +1793,8 @@ var EmojiDropup = ({ open, onClose, onSelect, anchorRef, className }) => {
1782
1793
  return;
1783
1794
  }
1784
1795
  const onDoc = (e) => {
1785
- if (panelRef.current && !panelRef.current.contains(e.target)) {
1796
+ const target = e.target;
1797
+ if (panelRef.current && !panelRef.current.contains(target) && (!anchorRef?.current || !anchorRef.current.contains(target))) {
1786
1798
  onClose();
1787
1799
  }
1788
1800
  };
@@ -1817,10 +1829,9 @@ var EmojiDropup = ({ open, onClose, onSelect, anchorRef, className }) => {
1817
1829
  "button",
1818
1830
  {
1819
1831
  type: "button",
1820
- className: "emoji-dropup__item",
1832
+ className: "emoji-dropup__item cursor-pointer",
1821
1833
  onClick: () => {
1822
1834
  onSelect(e);
1823
- onClose();
1824
1835
  },
1825
1836
  "aria-label": `Insert ${e}`,
1826
1837
  children: e
@@ -1967,7 +1978,7 @@ var ReplyCard = ({ refMsg, onClose, compact, className, jumpOnClick }) => {
1967
1978
  {
1968
1979
  type: "button",
1969
1980
  onClick: onClose,
1970
- className: "absolute right-3 top-1/2 -translate-y-1/2 grid h-8 w-8 place-items-center rounded-full bg-white text-[#3D3D3D] shadow-[0px_2px_4px_0px_#A5A3AE4D] hover:text-[#FF5300]",
1981
+ className: "absolute right-3 top-1/2 -translate-y-1/2 grid h-8 w-8 cursor-pointer place-items-center rounded-full bg-white text-[#3D3D3D] shadow-[0px_2px_4px_0px_#A5A3AE4D] hover:text-[#FF5300]",
1971
1982
  title: "Remove",
1972
1983
  "aria-label": "Remove",
1973
1984
  children: /* @__PURE__ */ jsxRuntime.jsx(ChatXIcon, { className: "h-[18px] w-[18px]" })
@@ -2161,9 +2172,7 @@ var ChatFooter = ({
2161
2172
  e.target.value = "";
2162
2173
  };
2163
2174
  const previewFilesToPayload = (files) => files.map((f) => ({ name: f.name, sizeMB: f.sizeMB, ext: f.ext, href: f.href, downloadName: f.downloadName }));
2164
- const clearAttachments = () => {
2165
- imgPreviews.forEach((u) => u.startsWith("blob:") && URL.revokeObjectURL(u));
2166
- filePreviews.forEach((f) => f.href?.startsWith("blob:") && URL.revokeObjectURL(f.href));
2175
+ const dismissAttachments = () => {
2167
2176
  setImgPreviews([]);
2168
2177
  setFilePreviews([]);
2169
2178
  };
@@ -2179,7 +2188,7 @@ var ChatFooter = ({
2179
2188
  images: imgPreviews,
2180
2189
  replyTo
2181
2190
  });
2182
- clearAttachments();
2191
+ dismissAttachments();
2183
2192
  } else {
2184
2193
  onSend({ type: "text", text: t, replyTo });
2185
2194
  }
@@ -2200,7 +2209,7 @@ var ChatFooter = ({
2200
2209
  files: previewFilesToPayload(filePreviews),
2201
2210
  replyTo
2202
2211
  });
2203
- clearAttachments();
2212
+ dismissAttachments();
2204
2213
  clearReply?.();
2205
2214
  onAfterSend?.();
2206
2215
  };
@@ -2296,18 +2305,18 @@ var ChatFooter = ({
2296
2305
  const isBiz = a.key === "businessCard";
2297
2306
  const isAddress = a.key === "addressCard";
2298
2307
  if (isEmoji) {
2299
- return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { ref: emojiBtnRef, type: "button", onClick: () => setShowEmoji((v) => !v), className: "flex h-6 w-6 items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }) }, a.key);
2308
+ return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { ref: emojiBtnRef, type: "button", onClick: () => setShowEmoji(true), className: "flex h-6 w-6 cursor-pointer items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }) }, a.key);
2300
2309
  }
2301
2310
  if (isTranslate) {
2302
- return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => setShowTranslate(true), className: "flex h-6 w-6 items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }, a.key);
2311
+ return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => setShowTranslate(true), className: "flex h-6 w-6 cursor-pointer items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }, a.key);
2303
2312
  }
2304
2313
  if (isBiz) {
2305
- return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { ref: bizBtnRef, type: "button", onClick: () => setShowBiz((v) => !v), className: "flex h-6 w-6 items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }) }, a.key);
2314
+ return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { ref: bizBtnRef, type: "button", onClick: () => setShowBiz((v) => !v), className: "flex h-6 w-6 cursor-pointer items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }) }, a.key);
2306
2315
  }
2307
2316
  if (isAddress) {
2308
- return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { ref: addrBtnRef, type: "button", onClick: () => setShowAddress(true), className: "flex h-6 w-6 items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }) }, a.key);
2317
+ return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative inline-flex", children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { ref: addrBtnRef, type: "button", onClick: () => setShowAddress(true), className: "flex h-6 w-6 cursor-pointer items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }) }, a.key);
2309
2318
  }
2310
- return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: isAttach ? () => fileInputRef.current?.click() : a.onClick, className: "flex h-6 w-6 items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }, a.key);
2319
+ return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { text: a.title, children: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: isAttach ? () => fileInputRef.current?.click() : a.onClick, className: "flex h-6 w-6 cursor-pointer items-center justify-center rounded-full text-[#0F0F0F] hover:bg-[#F4F6F8]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: a.icon }) }) }, a.key);
2311
2320
  }),
2312
2321
  /* @__PURE__ */ jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", multiple: true, accept: ACCEPT, onChange: onFilesPicked, className: "hidden" }),
2313
2322
  /* @__PURE__ */ jsxRuntime.jsx(EmojiDropup_default, { open: showEmoji, onClose: () => setShowEmoji(false), onSelect: insertEmoji, anchorRef: emojiBtnRef }),
@@ -2326,9 +2335,9 @@ var ChatFooter = ({
2326
2335
  }
2327
2336
  )
2328
2337
  ] }),
2329
- micError && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex items-start gap-2 rounded-sm bg-[#f8f8f8] px-2 py-1.5 text-xs text-[#ff5301]", children: [
2330
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: /* @__PURE__ */ jsxRuntime.jsx(ChatInfoIcon, { className: "mt-0.5 h-3.5 w-3.5" }) }),
2331
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: micError }),
2338
+ micError && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex items-center gap-2 rounded-sm bg-[#f8f8f8] px-2 py-1.5 text-xs text-[#ff5301]", children: [
2339
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: /* @__PURE__ */ jsxRuntime.jsx(ChatInfoIcon, { className: "h-3.5 w-3.5 shrink-0" }) }),
2340
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: micError }),
2332
2341
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "pointer flex cursor-pointer items-center justify-center rounded-full p-1 hover:bg-black/10", onClick: () => setMicError(""), children: /* @__PURE__ */ jsxRuntime.jsx(ChatXIcon, { className: "h-3.5 w-3.5" }) })
2333
2342
  ] }),
2334
2343
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -2575,7 +2584,7 @@ var ChatInquiryBar = ({ id, onView, className, label, buttonLabel }) => {
2575
2584
  {
2576
2585
  type: "button",
2577
2586
  onClick: onView,
2578
- className: "group relative inline-flex w-fit items-center justify-end text-xs font-medium text-black",
2587
+ className: "group relative inline-flex w-fit cursor-pointer items-center justify-end text-xs font-medium text-black",
2579
2588
  children: [
2580
2589
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center transition-opacity duration-300 ease-in-out group-hover:opacity-0", children: [
2581
2590
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: buttonLabel }),
@@ -2916,7 +2925,7 @@ var ChatBubbleAudio = ({ mine, audio }) => {
2916
2925
  "aria-label": playing ? "Pause" : "Play",
2917
2926
  onClick: toggle,
2918
2927
  className: clsx3__default.default(
2919
- "grid h-7 w-[34px] place-items-center rounded-md transition-colors",
2928
+ "grid h-7 w-[34px] cursor-pointer place-items-center rounded-md transition-colors",
2920
2929
  mine ? "bg-[#F1F1F1] text-[#00486F]" : "bg-[#F1F1F1] text-[#00486F]"
2921
2930
  ),
2922
2931
  children: playing ? /* @__PURE__ */ jsxRuntime.jsx(PauseIcon, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(PlayIcon, { className: "h-4 w-4" })
@@ -2986,7 +2995,12 @@ var extColor2 = (ext) => {
2986
2995
  var FileChip = ({ file }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-3 rounded-sm border border-[#e1e1e1] bg-white px-3 py-2", children: [
2987
2996
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-w-0 items-center gap-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
2988
2997
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
2989
- /* @__PURE__ */ jsxRuntime.jsx(FileIcon, { className: clsx3__default.default("h-[18px] w-[18px]", extColor2(file.ext)) }),
2998
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: /* @__PURE__ */ jsxRuntime.jsx(
2999
+ FileIcon,
3000
+ {
3001
+ className: clsx3__default.default("h-[18px] w-[18px]", extColor2(file.ext))
3002
+ }
3003
+ ) }),
2990
3004
  " ",
2991
3005
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-xs font-normal text-black", children: file.name })
2992
3006
  ] }),
@@ -3205,7 +3219,7 @@ var MessageHoverActions = ({
3205
3219
  onReply?.();
3206
3220
  },
3207
3221
  className: clsx3__default.default(
3208
- "inline-flex h-[22px] w-[22px] items-center justify-center rounded-sm bg-white text-[#2c2c2c] shadow-[0_1px_3px_rgba(0,0,0,0.08)] hover:bg-[#f8f8f8]",
3222
+ "inline-flex h-[22px] w-[22px] cursor-pointer items-center justify-center rounded-sm bg-white text-[#2c2c2c] shadow-[0_1px_3px_rgba(0,0,0,0.08)] hover:bg-[#f8f8f8]",
3209
3223
  isActive("replay") && "bg-[#636363] text-white"
3210
3224
  ),
3211
3225
  children: /* @__PURE__ */ jsxRuntime.jsx(MessageReplayIcon, { className: "h-[14px] w-[14px]" })
@@ -3226,7 +3240,7 @@ var MessageHoverActions = ({
3226
3240
  onTranslate?.();
3227
3241
  },
3228
3242
  className: clsx3__default.default(
3229
- "inline-flex h-[22px] w-[22px] items-center justify-center rounded-sm bg-white text-[#2c2c2c] shadow-[0_1px_3px_rgba(0,0,0,0.08)] hover:bg-[#f8f8f8]",
3243
+ "inline-flex h-[22px] w-[22px] cursor-pointer items-center justify-center rounded-sm bg-white text-[#2c2c2c] shadow-[0_1px_3px_rgba(0,0,0,0.08)] hover:bg-[#f8f8f8]",
3230
3244
  isActive("translate") && "bg-[#636363]! text-white"
3231
3245
  ),
3232
3246
  children: /* @__PURE__ */ jsxRuntime.jsx(NewLanguageIcon, { className: "h-[14px] w-[14px]" })
@@ -3389,7 +3403,7 @@ var ChatThreadItem = ({
3389
3403
  {
3390
3404
  onClick,
3391
3405
  className: clsx3__default.default(
3392
- "relative w-full text-left px-5 py-2 hover:bg-[#f8f8f8] focus:outline-none h-[75px]",
3406
+ "relative w-full cursor-pointer text-left px-5 py-2 hover:bg-[#f8f8f8] focus:outline-none h-[75px]",
3393
3407
  active && "bg-[#f8f8f8]",
3394
3408
  className
3395
3409
  ),
@@ -3515,12 +3529,12 @@ function Portal({ children, containerId = "portal-root" }) {
3515
3529
  }
3516
3530
  var slideVariants = {
3517
3531
  enter: (dir) => ({
3518
- x: dir > 0 ? 300 : -300,
3532
+ x: dir > 0 ? "100%" : "-100%",
3519
3533
  opacity: 0
3520
3534
  }),
3521
3535
  center: { x: 0, opacity: 1 },
3522
3536
  exit: (dir) => ({
3523
- x: dir > 0 ? -300 : 300,
3537
+ x: dir > 0 ? "-100%" : "100%",
3524
3538
  opacity: 0
3525
3539
  })
3526
3540
  };
@@ -3560,7 +3574,7 @@ var ChatImagePreviewModal = ({
3560
3574
  return /* @__PURE__ */ jsxRuntime.jsx(Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children: isOpen && total > 0 && /* @__PURE__ */ jsxRuntime.jsx(
3561
3575
  framerMotion.motion.div,
3562
3576
  {
3563
- className: "fixed inset-0 z-999 flex items-center justify-center",
3577
+ className: "fixed inset-0 z-10010 flex items-center justify-center",
3564
3578
  initial: { opacity: 0, backgroundColor: "rgba(0,0,0,0)" },
3565
3579
  animate: { opacity: 1, backgroundColor: "rgba(0,0,0,0.55)" },
3566
3580
  exit: { opacity: 0, backgroundColor: "rgba(0,0,0,0)" },
@@ -3580,9 +3594,9 @@ var ChatImagePreviewModal = ({
3580
3594
  "div",
3581
3595
  {
3582
3596
  className: "relative flex items-center justify-center overflow-hidden rounded-[6px] bg-white",
3583
- style: { width: 850, height: 850 },
3597
+ style: { width: 953, height: 679 },
3584
3598
  children: [
3585
- /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", initial: false, custom: direction, children: /* @__PURE__ */ jsxRuntime.jsx(
3599
+ /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: false, custom: direction, children: /* @__PURE__ */ jsxRuntime.jsx(
3586
3600
  framerMotion.motion.img,
3587
3601
  {
3588
3602
  custom: direction,
@@ -3590,56 +3604,58 @@ var ChatImagePreviewModal = ({
3590
3604
  initial: "enter",
3591
3605
  animate: "center",
3592
3606
  exit: "exit",
3593
- transition: { duration: 0.3, ease: "easeInOut" },
3607
+ transition: { duration: 0.35, ease: [0.25, 0.46, 0.45, 0.94] },
3594
3608
  src: currentImage?.url,
3595
3609
  alt: currentImage?.altText ?? `Image ${current + 1}`,
3596
- className: "w-full rounded-[6px] object-contain",
3610
+ className: "absolute inset-0 w-full h-full rounded-[6px] object-contain",
3597
3611
  draggable: false
3598
3612
  },
3599
3613
  current
3600
3614
  ) }),
3601
- /* @__PURE__ */ jsxRuntime.jsx(
3602
- "button",
3603
- {
3604
- type: "button",
3605
- onClick: goPrev,
3606
- disabled: !hasPrev,
3607
- className: `absolute left-0 top-1/2 -translate-y-1/2 flex h-[100px] items-center rounded-tr-[3px] rounded-br-[3px] p-[7px] backdrop-blur-[2px] shadow-[3px_0px_6px_0px_rgba(0,0,0,0.1)] transition-opacity ${hasPrev ? "cursor-pointer opacity-100" : "cursor-default opacity-30"}`,
3608
- style: { backgroundColor: "rgba(255,255,255,0.7)" },
3609
- "aria-label": "Previous image",
3610
- children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "42", height: "42", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
3611
- "path",
3612
- {
3613
- d: "M15 18L9 12L15 6",
3614
- stroke: "#2C2C2C",
3615
- strokeWidth: "2",
3616
- strokeLinecap: "round",
3617
- strokeLinejoin: "round"
3618
- }
3619
- ) })
3620
- }
3621
- ),
3622
- /* @__PURE__ */ jsxRuntime.jsx(
3623
- "button",
3624
- {
3625
- type: "button",
3626
- onClick: goNext,
3627
- disabled: !hasNext,
3628
- className: `absolute right-0 top-1/2 -translate-y-1/2 flex h-[100px] items-center rounded-tl-[3px] rounded-bl-[3px] p-[7px] backdrop-blur-[2px] shadow-[-3px_0px_6px_0px_rgba(0,0,0,0.1)] transition-opacity ${hasNext ? "cursor-pointer opacity-100" : "cursor-default opacity-30"}`,
3629
- style: { backgroundColor: "rgba(255,255,255,0.7)" },
3630
- "aria-label": "Next image",
3631
- children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "42", height: "42", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
3632
- "path",
3633
- {
3634
- d: "M9 18L15 12L9 6",
3635
- stroke: "#2C2C2C",
3636
- strokeWidth: "2",
3637
- strokeLinecap: "round",
3638
- strokeLinejoin: "round"
3639
- }
3640
- ) })
3641
- }
3642
- )
3615
+ total > 1 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
3616
+ /* @__PURE__ */ jsxRuntime.jsx(
3617
+ "button",
3618
+ {
3619
+ type: "button",
3620
+ onClick: goPrev,
3621
+ disabled: !hasPrev,
3622
+ className: `absolute left-0 top-1/2 -translate-y-1/2 flex h-[100px] items-center rounded-tr-[3px] rounded-br-[3px] p-[7px] backdrop-blur-[2px] shadow-[3px_0px_6px_0px_rgba(0,0,0,0.1)] transition-all duration-200 ${hasPrev ? "cursor-pointer opacity-100 hover:bg-white hover:shadow-[3px_0px_10px_0px_rgba(0,0,0,0.18)]" : "cursor-default opacity-30"}`,
3623
+ style: { backgroundColor: "rgba(255,255,255,0.7)" },
3624
+ "aria-label": "Previous image",
3625
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "42", height: "42", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
3626
+ "path",
3627
+ {
3628
+ d: "M15 18L9 12L15 6",
3629
+ stroke: "#2C2C2C",
3630
+ strokeWidth: "2",
3631
+ strokeLinecap: "round",
3632
+ strokeLinejoin: "round"
3633
+ }
3634
+ ) })
3635
+ }
3636
+ ),
3637
+ /* @__PURE__ */ jsxRuntime.jsx(
3638
+ "button",
3639
+ {
3640
+ type: "button",
3641
+ onClick: goNext,
3642
+ disabled: !hasNext,
3643
+ className: `absolute right-0 top-1/2 -translate-y-1/2 flex h-[100px] items-center rounded-tl-[3px] rounded-bl-[3px] p-[7px] backdrop-blur-[2px] shadow-[-3px_0px_6px_0px_rgba(0,0,0,0.1)] transition-all duration-200 ${hasNext ? "cursor-pointer opacity-100 hover:bg-white hover:shadow-[-3px_0px_10px_0px_rgba(0,0,0,0.18)]" : "cursor-default opacity-30"}`,
3644
+ style: { backgroundColor: "rgba(255,255,255,0.7)" },
3645
+ "aria-label": "Next image",
3646
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "42", height: "42", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
3647
+ "path",
3648
+ {
3649
+ d: "M9 18L15 12L9 6",
3650
+ stroke: "#2C2C2C",
3651
+ strokeWidth: "2",
3652
+ strokeLinecap: "round",
3653
+ strokeLinejoin: "round"
3654
+ }
3655
+ ) })
3656
+ }
3657
+ )
3658
+ ] })
3643
3659
  ]
3644
3660
  }
3645
3661
  ),
@@ -4116,10 +4132,17 @@ var avatarBgByInitial2 = {
4116
4132
  y: "#EAE4FF",
4117
4133
  z: "#E4FFF0"
4118
4134
  };
4119
- var SinglePopup = ({ adapter, uiCallbacks, theme, footerActions }) => {
4135
+ var SinglePopup = ({
4136
+ adapter,
4137
+ uiCallbacks,
4138
+ theme,
4139
+ footerActions
4140
+ }) => {
4120
4141
  const { close, reference } = useChatUI();
4121
4142
  const { isOpen: isGalleryOpen, closeGallery } = useGallery();
4122
- const [threads, setThreads] = React16__default.default.useState(() => adapter.threads.list(reference));
4143
+ const [threads, setThreads] = React16__default.default.useState(
4144
+ () => adapter.threads.list(reference)
4145
+ );
4123
4146
  React16__default.default.useEffect(() => {
4124
4147
  setThreads(adapter.threads.list(reference));
4125
4148
  const unsub = adapter.threads.subscribe(() => {
@@ -4133,7 +4156,9 @@ var SinglePopup = ({ adapter, uiCallbacks, theme, footerActions }) => {
4133
4156
  [reference]
4134
4157
  );
4135
4158
  const [activeId] = React16__default.default.useState(initialThreadId);
4136
- const activeThread = threads.find((t) => t.id === activeId);
4159
+ const activeThread = threads.find(
4160
+ (t) => t.id === activeId
4161
+ );
4137
4162
  const isVerified = activeThread?.badge === true;
4138
4163
  const meta = reference?.meta ?? {};
4139
4164
  const avatarSrc = meta.avatarSrc ?? activeThread?.avatarSrc;
@@ -4146,7 +4171,9 @@ var SinglePopup = ({ adapter, uiCallbacks, theme, footerActions }) => {
4146
4171
  () => activeId ? adapter.messages.list(activeId) : []
4147
4172
  );
4148
4173
  const [scrollKey, setScrollKey] = React16__default.default.useState(Date.now());
4149
- const [replyTo, setReplyTo] = React16__default.default.useState(void 0);
4174
+ const [replyTo, setReplyTo] = React16__default.default.useState(
4175
+ void 0
4176
+ );
4150
4177
  const [showDelete, setShowDelete] = React16__default.default.useState(false);
4151
4178
  React16__default.default.useEffect(() => {
4152
4179
  if (!activeId || !adapter.messages.subscribe) return;
@@ -4208,7 +4235,7 @@ var SinglePopup = ({ adapter, uiCallbacks, theme, footerActions }) => {
4208
4235
  children: /* @__PURE__ */ jsxRuntime.jsxs(
4209
4236
  "div",
4210
4237
  {
4211
- className: "flex h-full w-full flex-col overflow-hidden rounded-[18px] bg-white",
4238
+ className: "relative flex h-full w-full flex-col overflow-hidden rounded-[18px] bg-white",
4212
4239
  style: { overscrollBehavior: "contain" },
4213
4240
  children: [
4214
4241
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[64px] shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -4249,42 +4276,40 @@ var SinglePopup = ({ adapter, uiCallbacks, theme, footerActions }) => {
4249
4276
  )
4250
4277
  }
4251
4278
  ) }),
4252
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
4279
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntime.jsx(
4253
4280
  ChatScroll_default,
4254
4281
  {
4255
4282
  className: "h-full",
4256
4283
  bottomAlignWhenShort: false,
4257
4284
  scrollKey,
4258
- children: [
4259
- messages.map((m, idx) => {
4260
- const mine = m.author === "you";
4261
- const isLast = idx === messages.length - 1;
4262
- return /* @__PURE__ */ jsxRuntime.jsx(
4263
- ChatMessageItem_default,
4264
- {
4265
- id: m.id,
4266
- mine,
4267
- time: m.time ?? "",
4268
- authorInitial: typeof m.author === "string" ? m.author : "U",
4269
- text: m.text ?? m.content,
4270
- businessCard: m.businessCard,
4271
- addressCard: m.addressCard,
4272
- images: m.images,
4273
- files: m.files,
4274
- audio: m.audio,
4275
- replyTo: m.replyTo,
4276
- initialSrc: m.avatarSrc,
4277
- showStatus: isLast,
4278
- status: activeThread?.status?.kind === "seen" ? "Seen" : "Delivered",
4279
- onReply: () => setReplyTo(toRef(m))
4280
- },
4281
- m.id
4282
- );
4283
- }),
4284
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-start", children: /* @__PURE__ */ jsxRuntime.jsx(TypingIndicator_default, {}) })
4285
- ]
4285
+ children: messages.map((m, idx) => {
4286
+ const mine = m.author === "you";
4287
+ const isLast = idx === messages.length - 1;
4288
+ return /* @__PURE__ */ jsxRuntime.jsx(
4289
+ ChatMessageItem_default,
4290
+ {
4291
+ id: m.id,
4292
+ mine,
4293
+ time: m.time ?? "",
4294
+ authorInitial: typeof m.author === "string" ? m.author : "U",
4295
+ text: m.text ?? m.content,
4296
+ businessCard: m.businessCard,
4297
+ addressCard: m.addressCard,
4298
+ images: m.images,
4299
+ files: m.files,
4300
+ audio: m.audio,
4301
+ replyTo: m.replyTo,
4302
+ initialSrc: m.avatarSrc,
4303
+ showStatus: isLast,
4304
+ status: activeThread?.status?.kind === "seen" ? "Seen" : "Delivered",
4305
+ onReply: () => setReplyTo(toRef(m))
4306
+ },
4307
+ m.id
4308
+ );
4309
+ })
4286
4310
  }
4287
4311
  ) }),
4312
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-start py-2 px-[16px]", children: /* @__PURE__ */ jsxRuntime.jsx(TypingIndicator_default, {}) }) }),
4288
4313
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(
4289
4314
  ChatFooter_default,
4290
4315
  {