@accurix/centrinfo-widget 2.0.0 → 5.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +22 -0
- package/dist/cdn/centrinfo-widget.js +355 -31
- package/dist/cdn/manifest.json +6 -6
- package/dist/index.cjs +1 -3519
- package/dist/index.d.cts +1 -1
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.mjs +1 -3519
- package/dist/runtime.cjs +2 -1
- package/dist/runtime.d.cts +170 -22
- package/dist/runtime.d.mts +170 -22
- package/dist/runtime.mjs +2 -1
- package/dist/styles-BgWsSZsR.cjs +7714 -0
- package/dist/styles-CIJFMOKa.mjs +3869 -0
- package/dist/{types-1ZJJY7Da.d.mts → types-BGKFxmKB.d.cts} +113 -11
- package/dist/{types-B0r4SXaT.d.cts → types-DhmmWqaj.d.mts} +115 -10
- package/package.json +3 -2
- package/dist/config-CkU4urQY.mjs +0 -30
- package/dist/config-DsNMbdKp.cjs +0 -36
package/dist/index.cjs
CHANGED
|
@@ -1,3519 +1 @@
|
|
|
1
|
-
const e=require(`./config-DsNMbdKp.cjs`);let t=require(`preact`),n=require(`preact/hooks`),r=require(`preact/jsx-runtime`);const i=[{name:`Smileys`,emojis:`😀.😃.😄.😁.😅.😂.🤣.😊.😇.🙂.🙃.😉.😌.😍.🥰.😘.😋.😛.😜.🤪.🤗.🤭.🤔.🤐.😐.😶.😏.🙄.😴.🥳.😎.🤓.🥺.😢.😭.😤.😠.🤯.😬.😱.🤩.🥱`.split(`.`)},{name:`Gestures`,emojis:[`👍`,`👎`,`👌`,`🤌`,`✌️`,`🤞`,`🤟`,`🤘`,`🤙`,`👈`,`👉`,`👆`,`👇`,`✋`,`🖐️`,`👋`,`🤝`,`🙏`,`💪`,`👏`,`🙌`,`👐`,`🤲`,`🫶`]},{name:`Hearts & symbols`,emojis:`❤️.🧡.💛.💚.💙.💜.🖤.🤍.💔.❣️.💕.💖.💘.💝.✨.⭐.🌟.💫.🔥.🎉.🎊.✅.❌.⚡.💯.🚀`.split(`.`)},{name:`Animals & nature`,emojis:[`🐶`,`🐱`,`🦊`,`🐻`,`🐼`,`🐨`,`🦁`,`🐮`,`🐸`,`🐵`,`🐧`,`🦄`,`🐝`,`🦋`,`🐢`,`🐬`,`🌷`,`🌸`,`🌹`,`🌻`,`🌳`,`🍀`]},{name:`Food & drink`,emojis:[`🍎`,`🍌`,`🍉`,`🍓`,`🍒`,`🥑`,`🍔`,`🍟`,`🍕`,`🌮`,`🍿`,`🍩`,`🍪`,`🎂`,`☕`,`🍵`,`🍺`,`🥂`,`🍷`]},{name:`Objects & travel`,emojis:`🚀.✈️.🚗.🏠.📦.📱.💻.⌚.📷.💡.🔑.🎁.📌.✏️.📝.📞.📧.💰.📈.⏰.🔔.🎯.🏆.🎮.🎵.💬.👀`.split(`.`)}],a={"contact-support":{title:`Contact support`,submit:`Request support`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`subject`,label:`Subject`,kind:`text`,required:!0},{key:`message`,label:`Message`,kind:`textarea`,required:!0,placeholder:`What do you need help with?`}]},inquiry:{title:`Leave a message`,submit:`Send message`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`message`,label:`Message`,kind:`textarea`,required:!0,placeholder:`How can we help?`}]},contact:{title:`Share your details`,submit:`Save`,fields:[{key:`name`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`email`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`phone`,label:`Phone`,kind:`tel`,required:!0,identity:`phone`}]},"book-demo":{title:`Book a demo`,submit:`Request demo`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`preferredAt`,label:`Preferred time`,kind:`text`,placeholder:`e.g. Thursday 3pm`},{key:`notes`,label:`Notes`,kind:`textarea`,placeholder:`Anything we should know?`}]},"request-callback":{title:`Request a callback`,submit:`Request callback`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorPhone`,label:`Phone`,kind:`tel`,required:!0,identity:`phone`},{key:`bestTime`,label:`Best time to call`,kind:`text`,placeholder:`e.g. tomorrow afternoon`},{key:`topic`,label:`Topic`,kind:`text`,placeholder:`What should we call about?`}]},"subscribe-newsletter":{title:`Subscribe`,submit:`Subscribe`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`}]}},o=(e,t)=>(0,r.jsx)(`svg`,{viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`,"aria-hidden":`true`,...t,children:e}),s=e=>(0,r.jsx)(`svg`,{viewBox:`0 0 24 24`,fill:`currentColor`,"aria-hidden":`true`,...e,children:(0,r.jsx)(`path`,{"fill-rule":`evenodd`,"clip-rule":`evenodd`,d:`M5 3.25h14A3.75 3.75 0 0 1 22.75 7v6A3.75 3.75 0 0 1 19 16.75h-7.19l-4.26 3.84A.75.75 0 0 1 6.25 20v-3.32A3.75 3.75 0 0 1 2.25 13V7A3.75 3.75 0 0 1 6 3.25Zm3 7.75a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Zm4 0a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Zm4 0a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Z`})}),c=e=>o((0,r.jsx)(`path`,{d:`m6 9 6 6 6-6`}),e),l=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`m22 2-7 20-4-9-9-4Z`}),(0,r.jsx)(`path`,{d:`M22 2 11 13`})]}),e),u=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z`}),(0,r.jsx)(`path`,{d:`M19 10v2a7 7 0 0 1-14 0v-2`}),(0,r.jsx)(`line`,{x1:`12`,y1:`19`,x2:`12`,y2:`22`})]}),e),d=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M9 9v1a3 3 0 0 0 4.24 2.73`}),(0,r.jsx)(`path`,{d:`M15 5.5V5a3 3 0 0 0-5.94-.6`}),(0,r.jsx)(`path`,{d:`M19 10v2a7 7 0 0 1-9.9 6.36`}),(0,r.jsx)(`path`,{d:`M5 10v2a6.98 6.98 0 0 0 1.11 3.79`}),(0,r.jsx)(`line`,{x1:`12`,y1:`19`,x2:`12`,y2:`22`}),(0,r.jsx)(`line`,{x1:`2`,y1:`2`,x2:`22`,y2:`22`})]}),e),f=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M15 3h6v6`}),(0,r.jsx)(`path`,{d:`M10 14 21 3`}),(0,r.jsx)(`path`,{d:`M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6`})]}),e),p=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`rect`,{x:`3`,y:`4`,width:`18`,height:`18`,rx:`2`}),(0,r.jsx)(`line`,{x1:`16`,y1:`2`,x2:`16`,y2:`6`}),(0,r.jsx)(`line`,{x1:`8`,y1:`2`,x2:`8`,y2:`6`}),(0,r.jsx)(`line`,{x1:`3`,y1:`10`,x2:`21`,y2:`10`})]}),e),m=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`rect`,{x:`2`,y:`4`,width:`20`,height:`16`,rx:`2`}),(0,r.jsx)(`path`,{d:`m22 7-10 5L2 7`})]}),e),h=e=>o((0,r.jsx)(`path`,{d:`M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92Z`}),e),g=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`circle`,{cx:`12`,cy:`12`,r:`9`}),(0,r.jsx)(`path`,{d:`M8.5 14.5a4 4 0 0 0 7 0`}),(0,r.jsx)(`line`,{x1:`9`,y1:`9.5`,x2:`9.01`,y2:`9.5`}),(0,r.jsx)(`line`,{x1:`15`,y1:`9.5`,x2:`15.01`,y2:`9.5`})]}),e),_=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`line`,{x1:`18`,y1:`6`,x2:`6`,y2:`18`}),(0,r.jsx)(`line`,{x1:`6`,y1:`6`,x2:`18`,y2:`18`})]}),e),v=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M11 5 6 9H2v6h4l5 4z`}),(0,r.jsx)(`path`,{d:`M15.5 8.5a5 5 0 0 1 0 7`}),(0,r.jsx)(`path`,{d:`M19 5a9 9 0 0 1 0 14`})]}),e),y=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M11 5 6 9H2v6h4l5 4z`}),(0,r.jsx)(`line`,{x1:`22`,y1:`9`,x2:`16`,y2:`15`}),(0,r.jsx)(`line`,{x1:`16`,y1:`9`,x2:`22`,y2:`15`})]}),e),b=e=>o((0,r.jsx)(`path`,{d:`M20 6 9 17l-5-5`}),e),x=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`rect`,{x:`9`,y:`9`,width:`13`,height:`13`,rx:`2`}),(0,r.jsx)(`path`,{d:`M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1`})]}),e),S=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M1 4v6h6`}),(0,r.jsx)(`path`,{d:`M3.51 15a9 9 0 1 0 2.13-9.36L1 10`})]}),e),C=e=>o((0,r.jsx)(`rect`,{x:`6`,y:`6`,width:`12`,height:`12`,rx:`2`}),e),w=e=>o((0,r.jsx)(`path`,{d:`M21.44 11.05 12.25 20.24a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48`}),e),T=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M18.36 6.64a9 9 0 1 1-12.73 0`}),(0,r.jsx)(`line`,{x1:`12`,y1:`2`,x2:`12`,y2:`12`})]}),e),E=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`circle`,{cx:`12`,cy:`12`,r:`9`}),(0,r.jsx)(`path`,{d:`M12 7v5l3 2`})]}),e),D=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M7 10v12`}),(0,r.jsx)(`path`,{d:`M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z`})]}),e),O=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M17 14V2`}),(0,r.jsx)(`path`,{d:`M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z`})]}),e),k=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M15 3h6v6`}),(0,r.jsx)(`path`,{d:`M9 21H3v-6`}),(0,r.jsx)(`path`,{d:`M21 3l-7 7`}),(0,r.jsx)(`path`,{d:`M3 21l7-7`})]}),e),A=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`path`,{d:`M9 3v6H3`}),(0,r.jsx)(`path`,{d:`M15 21v-6h6`}),(0,r.jsx)(`path`,{d:`M9 9 2 2`}),(0,r.jsx)(`path`,{d:`M15 15l7 7`})]}),e),j=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`rect`,{x:`3`,y:`4`,width:`18`,height:`14`,rx:`2`}),(0,r.jsx)(`rect`,{x:`11`,y:`11`,width:`8`,height:`6`,rx:`1`,fill:`currentColor`,stroke:`none`})]}),e),ee=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`rect`,{x:`4`,y:`5`,width:`16`,height:`14`,rx:`2`}),(0,r.jsx)(`path`,{d:`M12 15V9`}),(0,r.jsx)(`path`,{d:`m8.5 12.5 3.5-3.5 3.5 3.5`})]}),e),M=e=>o((0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`}),(0,r.jsx)(`path`,{d:`m19 12-7 7-7-7`})]}),e),N=e=>{let t=(e??``).trim().toLowerCase().replaceAll(`-`,`_`);return t===`low`||t===`low_quality`?`Low-confidence forecast`:t===`medium`||t===`directional`?`Directional forecast`:t===`high`||t===`validated`||t===`trusted`?`Validated forecast`:`Forecast estimate`},P=e=>{if(!e)return`Live data`;let t=new Date(e);return Number.isNaN(t.getTime())?`Live data`:`Updated ${new Intl.DateTimeFormat(void 0,{hour:`numeric`,minute:`2-digit`}).format(t)}`},te=({answeredAt:e,reportingPeriod:t,filters:n=[],rowCount:i})=>(0,r.jsxs)(`div`,{class:`cf-analytics-meta`,"data-testid":`analytics-result-meta`,"aria-label":`Result details`,children:[(0,r.jsxs)(`span`,{children:[(0,r.jsx)(`span`,{"aria-hidden":`true`,class:`cf-analytics-meta__dot`}),P(e)]}),t?.label?(0,r.jsx)(`span`,{children:t.label}):null,typeof i==`number`?(0,r.jsxs)(`span`,{children:[i,` `,i===1?`row`:`rows`]}):null,n.length>0?(0,r.jsxs)(`span`,{children:[n.length,` applied `,n.length===1?`filter`:`filters`]}):null]}),F=({label:e,value:t})=>(0,r.jsxs)(`section`,{class:`cf-analytics-kpi`,"aria-label":e,"data-testid":`analytics-kpi`,children:[(0,r.jsx)(`div`,{class:`cf-analytics-kpi__label`,children:e}),(0,r.jsx)(`div`,{class:`cf-analytics-kpi__value`,children:t})]}),I=({title:e=`No matching data`,description:t=`No approved records matched this question.`})=>(0,r.jsxs)(`section`,{class:`cf-analytics-empty`,role:`status`,"data-testid":`analytics-empty-state`,children:[(0,r.jsx)(`p`,{children:e}),(0,r.jsx)(`p`,{children:t})]}),ne=e=>e===`line`?`Best for change over time.`:e===`stacked_bar`?`Compare totals and their parts.`:`Compare categories or ranked values.`,L=({type:e,className:t=`cf-chart-type-icon`})=>e===`line`?(0,r.jsxs)(`svg`,{viewBox:`0 0 32 32`,"aria-hidden":`true`,class:t,children:[(0,r.jsx)(`path`,{d:`M6 25h21M6 7v18`,fill:`none`,stroke:`#6B7280`,"stroke-width":`1.4`,"stroke-linecap":`round`,"stroke-linejoin":`round`}),(0,r.jsx)(`path`,{d:`M8 21c4-7 7 2 11-6 2.5-5 4.5-2 7-7`,fill:`none`,stroke:`#2563EB`,"stroke-width":`2.1`,"stroke-linecap":`round`,"stroke-linejoin":`round`})]}):e===`stacked_bar`?(0,r.jsxs)(`svg`,{viewBox:`0 0 32 32`,"aria-hidden":`true`,class:t,children:[(0,r.jsx)(`path`,{d:`M6 26h21M6 7v19`,fill:`none`,stroke:`#6B7280`,"stroke-width":`1.4`,"stroke-linecap":`round`,"stroke-linejoin":`round`}),[9,15,21].map((e,t)=>(0,r.jsxs)(`g`,{children:[(0,r.jsx)(`rect`,{x:e,y:18-t*2,width:`4`,height:8+t*2,fill:`#2563EB`,rx:`0.6`}),(0,r.jsx)(`rect`,{x:e,y:13-t,width:`4`,height:`5`,fill:`#F59E0B`,rx:`0.6`}),(0,r.jsx)(`rect`,{x:e,y:9-t,width:`4`,height:`4`,fill:`#22C55E`,rx:`0.6`})]},e))]}):(0,r.jsxs)(`svg`,{viewBox:`0 0 32 32`,"aria-hidden":`true`,class:t,children:[(0,r.jsx)(`path`,{d:`M6 26h21M6 7v19`,fill:`none`,stroke:`#6B7280`,"stroke-width":`1.4`,"stroke-linecap":`round`,"stroke-linejoin":`round`}),(0,r.jsx)(`rect`,{x:`9`,y:`18`,width:`4`,height:`8`,fill:`#2563EB`,rx:`0.7`}),(0,r.jsx)(`rect`,{x:`15`,y:`13`,width:`4`,height:`13`,fill:`#2563EB`,rx:`0.7`}),(0,r.jsx)(`rect`,{x:`21`,y:`8`,width:`4`,height:`18`,fill:`#2563EB`,rx:`0.7`})]}),re=({explanation:e,onFollowUp:t,showLead:n=!1,maxFollowUps:i=3})=>(0,r.jsxs)(`section`,{class:`cf-analytics-explanation`,"data-testid":`inline-analytics-explanation`,"aria-label":`Analysis and supporting evidence`,children:[n?(0,r.jsxs)(`div`,{class:`cf-analytics-explanation__lead`,"data-testid":`analytics-explanation-lead`,children:[e.conversationalPreface?(0,r.jsx)(`p`,{class:`cf-analytics-explanation__summary`,children:e.conversationalPreface}):null,(0,r.jsxs)(`div`,{class:`cf-analytics-explanation__lead-meta`,children:[(0,r.jsx)(`span`,{class:`cf-analytics-explanation__eyebrow`,children:`Answer from your data`}),(0,r.jsxs)(`span`,{class:`cf-analytics-explanation__provenance`,children:[(0,r.jsx)(`span`,{"aria-hidden":`true`,class:`cf-analytics-explanation__provenance-dot`}),e.source===`ai_grounded`?`AI-assisted · evidence checked`:`Based on current values`]})]}),(0,r.jsx)(`h3`,{class:`cf-analytics-explanation__headline`,children:e.headline}),(0,r.jsx)(`p`,{class:`cf-analytics-explanation__summary`,children:e.summary})]}):null,(0,r.jsxs)(`div`,{class:`cf-analytics-explanation__body`,children:[(e.evidence?.length??0)>0?(0,r.jsxs)(`section`,{class:`cf-analytics-explanation__section`,children:[(0,r.jsx)(`h4`,{class:`cf-analytics-explanation__heading`,children:`What the numbers show`}),(0,r.jsx)(`ul`,{class:`cf-analytics-explanation__evidence`,children:e.evidence?.slice(0,4).map(e=>(0,r.jsxs)(`li`,{class:`cf-analytics-explanation__evidence-item`,children:[(0,r.jsx)(`span`,{"aria-hidden":`true`,class:`cf-analytics-explanation__evidence-bullet`}),(0,r.jsx)(`span`,{children:e})]},e))})]}):null,e.businessMeaning?(0,r.jsxs)(`section`,{class:`cf-analytics-explanation__meaning`,children:[(0,r.jsx)(`h4`,{class:`cf-analytics-explanation__heading`,children:`Why this may matter`}),(0,r.jsx)(`p`,{class:`cf-analytics-explanation__paragraph`,children:e.businessMeaning})]}):null,(e.possibleDrivers?.length??0)>0?(0,r.jsxs)(`section`,{class:`cf-analytics-explanation__section`,children:[(0,r.jsxs)(`div`,{class:`cf-analytics-explanation__section-heading`,children:[(0,r.jsx)(`h4`,{class:`cf-analytics-explanation__heading`,children:`Possibilities worth checking`}),(0,r.jsx)(`span`,{class:`cf-analytics-explanation__hint`,children:`These are not proven causes`})]}),(0,r.jsx)(`div`,{class:`cf-analytics-explanation__drivers`,children:e.possibleDrivers?.slice(0,2).map(e=>(0,r.jsxs)(`article`,{class:`cf-analytics-explanation__driver`,children:[(0,r.jsx)(`p`,{class:`cf-analytics-explanation__driver-title`,children:e.hypothesis}),(0,r.jsxs)(`p`,{class:`cf-analytics-explanation__driver-body`,children:[(0,r.jsx)(`span`,{class:`cf-analytics-explanation__driver-label`,children:`How to check:`}),` `,e.howToCheck]})]},`${e.hypothesis}-${e.howToCheck}`))})]}):null,(e.recommendations?.length??0)>0?(0,r.jsxs)(`section`,{class:`cf-analytics-explanation__section`,children:[(0,r.jsx)(`h4`,{class:`cf-analytics-explanation__heading`,children:`Useful next steps`}),(0,r.jsx)(`div`,{class:`cf-analytics-explanation__recommendations`,children:e.recommendations?.slice(0,3).map((e,t)=>(0,r.jsxs)(`article`,{class:`cf-analytics-explanation__recommendation`,children:[(0,r.jsx)(`span`,{class:`cf-analytics-explanation__recommendation-index`,children:t+1}),(0,r.jsxs)(`div`,{children:[(0,r.jsx)(`p`,{class:`cf-analytics-explanation__recommendation-title`,children:e.action}),(0,r.jsx)(`p`,{class:`cf-analytics-explanation__recommendation-body`,children:e.why}),e.successMetric?(0,r.jsxs)(`p`,{class:`cf-analytics-explanation__recommendation-body`,children:[(0,r.jsx)(`span`,{class:`cf-analytics-explanation__driver-label`,children:`Watch:`}),` `,e.successMetric]}):null]})]},`${e.action}-${e.why}`))})]}):null,e.forecast?(0,r.jsxs)(`section`,{class:`cf-analytics-explanation__outlook`,children:[(0,r.jsxs)(`div`,{class:`cf-analytics-explanation__outlook-header`,children:[(0,r.jsx)(`h4`,{class:`cf-analytics-explanation__heading`,children:`Outlook`}),(0,r.jsx)(`span`,{class:`cf-analytics-explanation__outlook-badge`,children:N(e.forecast.qualityStatus)})]}),(0,r.jsx)(`p`,{class:`cf-analytics-explanation__paragraph`,children:e.forecast.text}),e.forecast.limitations?(0,r.jsx)(`p`,{class:`cf-analytics-explanation__recommendation-body`,children:e.forecast.limitations}):null]}):null,t&&(e.followUps?.length??0)>0?(0,r.jsxs)(`section`,{class:`cf-analytics-explanation__section cf-analytics-explanation__follow-up`,children:[(0,r.jsx)(`h4`,{class:`cf-analytics-explanation__heading`,children:`Ask a follow-up`}),(0,r.jsx)(`div`,{class:`cf-analytics-explanation__questions`,children:e.followUps?.slice(0,i).map(e=>(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-explanation__question`,onClick:()=>t(e),children:e},e))})]}):null,(e.limitations?.length??0)>0?(0,r.jsxs)(`details`,{class:`cf-analytics-explanation__limits`,children:[(0,r.jsx)(`summary`,{class:`cf-analytics-explanation__limits-summary`,children:`Important limits`}),(0,r.jsx)(`ul`,{class:`cf-analytics-explanation__limits-list`,children:e.limitations?.map(e=>(0,r.jsx)(`li`,{children:e},e))})]}):null]}),(0,r.jsx)(`p`,{class:`cf-analytics-explanation__source`,children:e.source===`ai_grounded`?`AI-assisted wording, checked against the live values shown here.`:`Based only on the live values shown here.`})]}),ie=e=>e.explanation?.source===`ai_grounded`?e.explanation:e.businessAnalysis?.explanation??e.explanation,ae=()=>{let e=(0,n.useRef)(null);return(0,n.useEffect)(()=>{let t=requestAnimationFrame(()=>e.current?.scrollIntoView?.({block:`end`}));return()=>cancelAnimationFrame(t)},[]),e},oe=e=>e.trim().split(/\s+/).slice(0,2).map(e=>e[0]?.toUpperCase()??``).join(``)||`🤖`,R=e=>{let t=e?.avatarId?.trim().toLowerCase().replace(/[^a-z0-9-]/g,`-`);return t?` cf-avatar-preset--${t}`:``},se={"support-guide":`SG`,"sales-host":`SH`,"calm-advisor":`CA`,"technical-guide":`TG`,"school-desk":`SD`,"front-office":`FO`},z=e=>{let t=e?.avatarId?.trim().toLowerCase();return t&&se[t]||(e?oe(e.agentName):`·`)},ce=({persona:e,small:t,hideWhenMissing:n})=>{let i=t?`cf-msg__avatar`:`cf-header__avatar`,a=e?.agentAvatarUrl?.trim();return a?(0,r.jsx)(`span`,{class:i,children:(0,r.jsx)(`img`,{src:a,alt:``})}):n?null:(0,r.jsx)(`span`,{class:`${i}${R(e)}`,children:z(e)})},le=()=>{let t=e.c(),[i,a]=(0,n.useState)(0),o=[`Understanding your question`,`Checking approved information`,`Preparing your answer`];return(0,n.useEffect)(()=>{let e=[window.setTimeout(()=>a(1),1800),window.setTimeout(()=>a(2),5e3)];return()=>e.forEach(e=>window.clearTimeout(e))},[]),(0,r.jsxs)(`div`,{class:`cf-msg__bubble cf-typing`,"aria-label":t.assistantTyping,children:[(0,r.jsx)(`span`,{class:`cf-typing__label`,"aria-live":`polite`,children:o[i]}),(0,r.jsx)(`span`,{class:`cf-typing__dot`}),(0,r.jsx)(`span`,{class:`cf-typing__dot`}),(0,r.jsx)(`span`,{class:`cf-typing__dot`})]})},B=3,V=({msg:e})=>{if(!e.sources||e.sources.length===0)return null;let t=new Set,n=[];for(let r of e.sources){let e=(r.url||r.title||``).toLowerCase();!e||t.has(e)||(t.add(e),n.push(r))}if(n.length===0)return null;let i=n.slice(0,3),a=n.length-i.length;return(0,r.jsxs)(`div`,{class:`cf-sources`,children:[i.map((e,t)=>e.url?(0,r.jsxs)(`a`,{class:`cf-source`,href:e.url,target:`_blank`,rel:`noopener noreferrer nofollow`,title:e.title||e.url,children:[(0,r.jsx)(f,{}),(0,r.jsx)(`span`,{children:e.title||e.url})]},t):(0,r.jsxs)(`span`,{class:`cf-source`,title:e.title,children:[(0,r.jsx)(f,{}),(0,r.jsx)(`span`,{children:e.title})]},t)),a>0&&(0,r.jsxs)(`span`,{class:`cf-source cf-source--more`,children:[`+`,a,` more`]})]})},ue=({replies:e,onPick:t})=>e&&e.length>0?(0,r.jsx)(`div`,{class:`cf-chips`,children:e.map((e,n)=>(0,r.jsx)(`button`,{type:`button`,class:`cf-chip`,onClick:()=>t(e),children:e},n))}):null,de=({persona:e,starters:t,onPick:n,onFocusComposer:i,speaking:a,voiceState:o=`idle`,replyPending:s=!1,pinned:c=!1,muted:l=!1,onToggleMute:d,onEndCall:f,onTalkNow:p,showTalkNow:m=!1,micLevel:h=0,theaterMode:g=!1,onToggleTheater:_,onMinimize:v,audioDevices:y=[],selectedAudioDeviceId:b=``,onSelectAudioDevice:x,connectingOnly:S=!1})=>{if(!e||!(e.talkbackMode===`avatar`||e.widgetModule===`assistant`||e.allowVoiceInput))return null;let C=e.agentAvatarUrl?.trim()||``,w=e.assistantMediaUrl?.trim()||C,T=e.assistantMediaKind===`video`&&!!w,E=t.slice(0,3),D=o!==`idle`,O=o===`idle`?`Speak with ${e.agentName}`:`End voice chat`,k=c&&!D&&!a,A=o===`connecting`||o===`processing`||D&&s,j=[`cf-assistant-card__stage`,`cf-assistant-card__stage--local`,D?`is-live`:``,A?`is-thinking`:``,o===`listening`&&!l?`is-listening`:``,a||o===`speaking`?`is-speaking`:``,l?`is-muted`:``].filter(Boolean).join(` `),ee=o===`listening`&&!l?{"--cf-listen":String(Math.max(.18,Math.min(1,h*8)))}:void 0,M=A&&(0,r.jsxs)(`span`,{class:`cf-call-ripple`,"aria-hidden":`true`,children:[(0,r.jsx)(`span`,{}),(0,r.jsx)(`span`,{}),(0,r.jsx)(`span`,{})]});if(S)return(0,r.jsxs)(`div`,{class:`cf-assistant-card cf-assistant-card--connecting`,"aria-live":`polite`,children:[(0,r.jsxs)(`div`,{class:`cf-assistant-card__connecting-avatar`,children:[C?(0,r.jsx)(`img`,{src:C,alt:``}):(0,r.jsx)(`span`,{class:`cf-assistant-card__connecting-face${R(e)}`,children:z(e)}),M]}),(0,r.jsxs)(`div`,{class:`cf-assistant-card__connecting-copy`,children:[(0,r.jsx)(`span`,{class:`cf-assistant-card__connecting-eyebrow`,children:e.agentName}),(0,r.jsx)(`strong`,{children:`Connecting with the AI…`})]})]});let N=D&&f&&(0,r.jsx)(We,{voiceState:o,muted:l,onToggleMute:d??(()=>{}),onEndCall:f,onTalkNow:p??(()=>{}),showTalkNow:m,micLevel:h,theaterMode:g,onToggleTheater:_??(()=>{}),onMinimize:v??(()=>{}),audioDevices:y,selectedAudioDeviceId:b,onSelectAudioDevice:x??(()=>{})});return k?(0,r.jsx)(`div`,{class:`cf-assistant-card cf-assistant-card--pinned cf-assistant-card--compact`,children:(0,r.jsxs)(`button`,{type:`button`,class:`cf-assistant-card__compact-speak`,onClick:i,children:[C?(0,r.jsx)(`span`,{class:`cf-assistant-card__compact-avatar`,children:(0,r.jsx)(`img`,{src:C,alt:``})}):null,(0,r.jsx)(`span`,{class:`cf-assistant-card__compact-mic`,"aria-hidden":`true`,children:(0,r.jsx)(u,{})}),(0,r.jsx)(`span`,{class:`cf-assistant-card__compact-label`,children:O})]})}):(0,r.jsxs)(`div`,{class:`cf-assistant-card ${c?`cf-assistant-card--pinned`:``} ${a?`is-speaking`:``}`,children:[(w||e.allowVoiceInput)&&(0,r.jsxs)(`div`,{class:j,style:ee,children:[(0,r.jsxs)(`div`,{class:`cf-assistant-card__media ${w?`cf-assistant-card__media--uploaded`:`cf-assistant-card__media--generated`}${R(e)}`,children:[T?(0,r.jsx)(`video`,{src:w,muted:!0,loop:!0,playsInline:!0,autoPlay:!0}):w?(0,r.jsx)(`img`,{src:w,alt:``}):(0,r.jsx)(`div`,{class:`cf-assistant-card__avatar-stage${R(e)}`,children:(0,r.jsxs)(`div`,{class:`cf-assistant-card__face`,children:[(0,r.jsx)(`span`,{class:`cf-assistant-card__initials`,children:z(e)}),(0,r.jsx)(`span`,{class:`cf-assistant-card__eye cf-assistant-card__eye--left`}),(0,r.jsx)(`span`,{class:`cf-assistant-card__eye cf-assistant-card__eye--right`}),(0,r.jsx)(`span`,{class:`cf-assistant-card__mouth`})]})}),w&&!T&&(0,r.jsx)(`span`,{class:`cf-assistant-card__mouth cf-assistant-card__mouth--overlay`}),(0,r.jsx)(`span`,{class:`cf-avatar-aura cf-avatar-aura--one`,"aria-hidden":`true`}),(0,r.jsx)(`span`,{class:`cf-avatar-aura cf-avatar-aura--two`,"aria-hidden":`true`}),(0,r.jsx)(`span`,{class:`cf-avatar-listen-ring`,"aria-hidden":`true`}),(0,r.jsxs)(`span`,{class:`cf-avatar-wave`,"aria-hidden":`true`,children:[(0,r.jsx)(`span`,{}),(0,r.jsx)(`span`,{}),(0,r.jsx)(`span`,{}),(0,r.jsx)(`span`,{})]})]}),M,e.allowVoiceInput&&(N||(0,r.jsxs)(`button`,{type:`button`,class:`cf-assistant-card__speak`,onClick:i,children:[(0,r.jsx)(u,{}),O]}))]}),!c&&(0,r.jsxs)(r.Fragment,{children:[e.agentDescription?(0,r.jsx)(`p`,{class:`cf-assistant-card__copy`,children:e.agentDescription}):(0,r.jsx)(`p`,{class:`cf-assistant-card__copy`,children:e.greeting}),E.length>0&&(0,r.jsx)(`div`,{class:`cf-assistant-card__chips`,children:E.map(e=>(0,r.jsx)(`button`,{type:`button`,class:`cf-assistant-card__chip`,onClick:()=>n(e),children:e},e))}),e.disclaimerText||e.assistantPrivacyUrl?(0,r.jsxs)(`p`,{class:`cf-assistant-card__privacy`,children:[e.disclaimerText||`This chat may be recorded for quality and support.`,e.assistantPrivacyUrl?(0,r.jsxs)(r.Fragment,{children:[` `,(0,r.jsx)(`a`,{href:e.assistantPrivacyUrl,target:`_blank`,rel:`noopener noreferrer nofollow`,children:`Privacy Policy`})]}):null]}):null]})]})},fe={calendar:p,mail:m,phone:h,lifebuoy:m},pe=e=>fe[e]??m,me=e=>{if(e.id===`public_contact_support`)return`contact-support`;switch(e.endpoint){case`book-demo`:return`book-demo`;case`request-callback`:return`request-callback`;case`subscribe-newsletter`:return`subscribe-newsletter`;case`contact`:return`contact`;default:return`inquiry`}},he={public_contact_support:{label:`Contact support`,description:`Ask a teammate to join this conversation.`,category:`support`,icon:`lifebuoy`,endpoint:`inquiry`},public_submit_inquiry:{label:`Leave a message`,description:`Send your question and contact details.`,category:`support`,icon:`mail`,endpoint:`inquiry`},public_book_demo:{label:`Book a demo`,description:`Request a demo from the team.`,category:`sales`,icon:`calendar`,endpoint:`book-demo`},public_request_callback:{label:`Request a callback`,description:`Share your number and best time to call.`,category:`sales`,icon:`phone`,endpoint:`request-callback`},public_subscribe_newsletter:{label:`Subscribe`,description:`Get product updates.`,category:`marketing`,icon:`mail`,endpoint:`subscribe-newsletter`}},ge=(e,t,n={})=>Array.isArray(e)?e.filter(e=>e.readiness!==`unavailable`).map(e=>_e(e,n[e.id])):(t??[]).flatMap(e=>{let t=he[e];if(!t)return[];let n=me({...t,id:e}),r=a[n];return[{...t,id:e,presentation:n===`book-demo`?`booking`:`form`,formTitle:r.title,submitLabel:r.submit,fields:r.fields,delivery:``,prompt:``,shortLabel:t.label.toLowerCase(),enabled:!0,readiness:`available`,legacyFallback:!0}]}).map(e=>_e(e,n[e.id])),_e=(e,t)=>{if(!t)return e;let n=t.fields??{};return{...e,...Object.fromEntries(Object.entries(t).filter(([e,t])=>e!==`fields`&&t!==void 0)),fields:e.fields.map(e=>({...e,...n[e.key]}))}},ve=(t,n)=>{let r=t.map(e=>e.label);return r.length===0?n.actionGetInTouch:r.length<=3?r.join(`, `):`${r.slice(0,2).join(`, `)} ${e.s(n.actionMore,{count:String(r.length-2)})}`},H=({field:e,value:t,onInput:n})=>{let i=e.placeholder??e.label,a={class:`cf-form__input`,placeholder:e.required?`${i} *`:i,value:t,"aria-label":e.label,onInput:e=>n(e.target.value)};return e.kind===`textarea`?(0,r.jsx)(`textarea`,{rows:2,...a}):(0,r.jsx)(`input`,{type:e.kind,...a})},U=({spec:t,visitor:i,onSubmit:a,onCancel:o})=>{let s=e.c(),c=ae(),[l,u]=(0,n.useState)(()=>{let e={};for(let n of t.fields)n.identity&&i[n.identity]&&(e[n.key]=i[n.identity]);return e}),[d,f]=(0,n.useState)(`idle`),[p,m]=(0,n.useState)(``),h=e=>!!(e.identity&&i[e.identity]?.trim()),g=t.fields.filter(e=>!h(e)),_=g.every(e=>!e.required||(l[e.key]?.trim()??``)!==``),v=i.email||i.name||``;return d===`done`?(0,r.jsxs)(`div`,{class:`cf-form cf-form--done`,children:[(0,r.jsx)(b,{}),(0,r.jsx)(`span`,{children:p})]}):(0,r.jsxs)(`div`,{class:`cf-form`,ref:c,children:[(0,r.jsx)(`div`,{class:`cf-form__title`,children:t.title}),g.length===0&&v&&(0,r.jsx)(`div`,{class:`cf-form__as`,children:e.s(s.actionAs,{identity:v})}),g.map(e=>(0,r.jsx)(H,{field:e,value:l[e.key]??``,onInput:t=>u(n=>({...n,[e.key]:t}))},e.key)),d===`error`&&(0,r.jsx)(`div`,{class:`cf-form__err`,children:s.formError}),(0,r.jsxs)(`div`,{class:`cf-form__actions`,children:[o&&(0,r.jsx)(`button`,{type:`button`,class:`cf-form__cancel`,onClick:o,children:s.cancel}),(0,r.jsx)(`button`,{type:`button`,class:`cf-form__submit`,disabled:!_||d===`submitting`,onClick:async()=>{if(!_||d===`submitting`)return;f(`submitting`);let e={},n={};for(let r of t.fields){let t=l[r.key]?.trim();t&&(e[r.key]=t,r.identity&&(n[r.identity]=t))}try{m((await a(e,n)).note||s.formThanks),f(`done`)}catch{f(`error`)}},children:d===`submitting`?s.sending:t.submit})]})]})},ye=e=>String(e).padStart(2,`0`),W=()=>{let e=[];for(let t=9;t<=17;t++)e.push(`${ye(t)}:00`),e.push(`${ye(t)}:30`);return e},G=e=>{let t=new Date;return t.setHours(0,0,0,0),Array.from({length:e},(e,n)=>{let r=new Date(t);return r.setDate(t.getDate()+n),r})},K=(e,t)=>{let[n,r]=t.split(`:`).map(Number),i=new Date(e.getFullYear(),e.getMonth(),e.getDate(),n??0,r??0);try{return new Intl.DateTimeFormat(void 0,{weekday:`short`,day:`numeric`,month:`short`,year:`numeric`,hour:`2-digit`,minute:`2-digit`,timeZoneName:`short`}).format(i)}catch{return`${e.toDateString()} ${t}`}},be=(e,t)=>{let[n,r]=t.split(`:`).map(Number);return new Date(e.getFullYear(),e.getMonth(),e.getDate(),n??0,r??0)},xe=(e,t)=>{let n=be(e,t);try{return new Intl.DateTimeFormat(void 0,{hour:`numeric`,minute:`2-digit`}).format(n)}catch{return t}},Se=()=>{try{return Intl.DateTimeFormat().resolvedOptions().timeZone||``}catch{return``}},Ce=({visitor:t,onSubmit:i,onCancel:o,onDemoSlots:s,scheduler:c,title:l,submitLabel:u})=>{let d=l?.trim()||a[`book-demo`].title,p=u?.trim()||a[`book-demo`].submit,m=e.c(),h=ae(),g=!!(c?.connected&&c.mode===`event`&&(c.availability===void 0||c.availability.calendarIds.length>0)),_=Math.min(60,Math.max(1,c?.availability?.bookingWindowDays??14)),v=(0,n.useMemo)(()=>G(_),[_]),[y,x]=(0,n.useState)(null),[S,C]=(0,n.useState)(g?`loading`:`request_only`),[w,T]=(0,n.useState)(c?.availability?.slotDurationMinutes??30),[E,D]=(0,n.useState)(Se()||c?.availability?.timezone||``),O=(0,n.useMemo)(()=>g?S!==`available`||y===null?[]:[...new Set([...y].map(e=>{let t=new Date(e);return`${String(t.getHours()).padStart(2,`0`)}:${String(t.getMinutes()).padStart(2,`0`)}`}))].sort():W(),[y,S,g]),[k,A]=(0,n.useState)((0,n.useMemo)(()=>{let e=Date.now();for(let t=0;t<v.length;t++)if(O.some(n=>be(v[t],n).getTime()>e))return t;return 0},[v,O])),[j,ee]=(0,n.useState)(null),[M,N]=(0,n.useState)(t.name??``),[P,te]=(0,n.useState)(t.email??``),[F,I]=(0,n.useState)(`idle`),[ne,L]=(0,n.useState)(``),[re,ie]=(0,n.useState)(``);(0,n.useEffect)(()=>{if(!g||S!==`available`||y===null)return;let e=v.findIndex(e=>O.some(t=>y.has(be(e,t).getTime())));e>=0&&A(e)},[y,S,v,g,O]);let oe=c?.connected&&c.mode===`link`,R=async()=>{if(F===`submitting`||!t.name?.trim()&&!M.trim()||!t.email?.trim()&&!P.trim())return;I(`submitting`);let e={};P.trim()&&(e.email=P.trim()),M.trim()&&(e.name=M.trim());try{let t=await i({...P.trim()?{visitorEmail:P.trim()}:{},...M.trim()?{visitorName:M.trim()}:{}},e),n=t.booking?.schedulingLink||c?.bookingLink||``;if(!n){I(`error`);return}try{window.open(n,`_blank`,`noopener,noreferrer`)}catch{}ie(n),L(t.note||m.bookingLinkOpened),I(`done`)}catch{I(`error`)}},[se,z]=(0,n.useState)(new Set),[ce,le]=(0,n.useState)([]),[B,V]=(0,n.useState)(0),[ue,de]=(0,n.useState)(!1);(0,n.useEffect)(()=>{if(!s)return;let e=!0,t=new Date,n=new Date;return n.setDate(n.getDate()+_+1),s(t.toISOString(),n.toISOString()).then(t=>{if(e)if(z(new Set(t.taken.map(e=>Date.parse(e)).filter(e=>!Number.isNaN(e)))),le(t.busy.map(e=>[Date.parse(e.start),Date.parse(e.end)]).filter(([e,t])=>!Number.isNaN(e)&&!Number.isNaN(t))),T(t.slotDurationMinutes??30),D(Se()||t.timezone||``),g){if(t.status!==`available`||!Array.isArray(t.available)){x(null),C(`unavailable`);return}x(new Set(t.available.map(e=>Date.parse(e)).filter(e=>!Number.isNaN(e)))),C(`available`)}else C(t.status??`request_only`)}).catch(()=>{!e||!g||(x(null),C(`unavailable`))}),()=>{e=!1}},[_,g,s,B]);let fe=!!t.email?.trim(),pe=!!t.name?.trim(),me=!!j&&(!g||S===`available`)&&(pe||M.trim()!==``)&&(fe||P.trim()!==``),he=t.email||t.name||``,ge=e=>se.has(be(v[k],e).getTime()),_e=e=>be(v[k],e).getTime()<=Date.now(),ve=w*60*1e3,H=e=>{let t=be(v[k],e).getTime(),n=t+ve;return ce.some(([e,r])=>t<r&&n>e)},U=e=>!g||y?.has(be(v[k],e).getTime())===!0,ye=async()=>{if(!me||F===`submitting`||!j)return;I(`submitting`),de(!1);let t=be(v[k],j),n=K(v[k],j),r={};P.trim()&&(r.email=P.trim()),M.trim()&&(r.name=M.trim());try{let a=await i({preferredAt:n,slotAt:t.toISOString(),...P.trim()?{visitorEmail:P.trim()}:{},...M.trim()?{visitorName:M.trim()}:{}},r);a.booking?.confirmed?(L(a.note||e.s(m.bookingConfirmed,{when:n})),ie(a.booking.meetingUrl||a.booking.eventLink||``)):L(a.note||e.s(m.bookingRequested,{when:n})),I(`done`)}catch(e){e?.status===409?(z(e=>new Set(e).add(t.getTime())),ee(null),de(!0),V(e=>e+1),I(`idle`)):I(`error`)}};return F===`done`?(0,r.jsxs)(`div`,{class:`cf-form cf-form--done`,children:[(0,r.jsx)(b,{}),(0,r.jsx)(`span`,{children:ne}),re&&(0,r.jsxs)(`a`,{class:`cf-booking__link`,href:re,target:`_blank`,rel:`noopener noreferrer`,children:[oe?m.bookingOpenScheduler:m.bookingMeetingLink,` `,(0,r.jsx)(f,{})]})]}):oe?(0,r.jsxs)(`div`,{class:`cf-form cf-booking`,ref:h,children:[(0,r.jsx)(`div`,{class:`cf-form__title`,children:d}),(0,r.jsx)(`div`,{class:`cf-booking__hint`,children:e.s(m.bookingViaProvider,{provider:c?.label??m.bookingSchedulerFallback})}),fe?he?(0,r.jsx)(`div`,{class:`cf-form__as`,children:e.s(m.actionAs,{identity:he})}):null:(0,r.jsxs)(r.Fragment,{children:[!t.name?.trim()&&(0,r.jsx)(`input`,{class:`cf-form__input`,type:`text`,placeholder:`${m.handoffName} *`,value:M,"aria-label":m.handoffName,onInput:e=>N(e.target.value)}),(0,r.jsx)(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${m.handoffEmail} *`,value:P,"aria-label":m.handoffEmail,onInput:e=>te(e.target.value)})]}),F===`error`&&(0,r.jsx)(`div`,{class:`cf-form__err`,children:m.formError}),(0,r.jsxs)(`div`,{class:`cf-form__actions`,children:[o&&(0,r.jsx)(`button`,{type:`button`,class:`cf-form__cancel`,onClick:o,children:m.cancel}),(0,r.jsx)(`button`,{type:`button`,class:`cf-form__submit`,disabled:F===`submitting`||!t.name?.trim()&&M.trim()===``||!fe&&P.trim()===``,onClick:R,children:F===`submitting`?m.sending:m.bookingOpenScheduler})]})]}):(0,r.jsxs)(`div`,{class:`cf-form cf-booking`,ref:h,children:[(0,r.jsx)(`div`,{class:`cf-form__title`,children:d}),(0,r.jsxs)(`div`,{class:`cf-booking__hint`,children:[m.bookingPickTime,` ·`,` `,(0,r.jsx)(`span`,{class:`cf-booking__dur`,children:e.s(m.bookingDuration,{count:String(w)})}),E?` · ${e.s(m.bookingTimezone,{timezone:E})}`:``]}),g&&S===`loading`?(0,r.jsx)(`div`,{class:`cf-booking__state`,role:`status`,children:m.bookingCheckingAvailability}):null,g&&S===`unavailable`?(0,r.jsx)(`div`,{class:`cf-form__err`,role:`alert`,children:m.bookingAvailabilityUnavailable}):null,g&&S===`available`&&O.length===0?(0,r.jsx)(`div`,{class:`cf-booking__state`,role:`status`,children:m.bookingNoSlots}):null,O.length>0?(0,r.jsx)(`div`,{class:`cf-booking__dates`,role:`tablist`,"aria-label":m.bookingPickDay,children:v.map((e,t)=>(0,r.jsxs)(`button`,{type:`button`,role:`tab`,"aria-selected":t===k,disabled:g&&S===`available`&&!O.some(t=>y?.has(be(e,t).getTime())),class:`cf-booking__date ${t===k?`is-selected`:``}`,onClick:()=>{A(t),ee(null)},children:[(0,r.jsx)(`span`,{class:`cf-booking__dow`,children:e.toLocaleDateString(void 0,{weekday:`short`})}),(0,r.jsx)(`span`,{class:`cf-booking__dom`,children:e.getDate()})]},t))}):null,O.length>0?(0,r.jsx)(`div`,{class:`cf-booking__slots`,role:`listbox`,"aria-label":m.bookingPickTimeLabel,children:O.map(e=>{let t=_e(e),n=H(e),i=ge(e),a=U(e),o=i||t||n||!a;return(0,r.jsx)(`button`,{type:`button`,role:`option`,"aria-selected":j===e,disabled:o,title:t?m.bookingEarlierToday:n?m.bookingCalendarBusy:i?m.bookingAlreadyBooked:a?void 0:m.bookingNotOffered,class:`cf-booking__slot ${j===e?`is-selected`:``} ${o?`is-taken`:``}`,onClick:()=>ee(e),children:xe(v[k],e)},e)})}):null,ue&&(0,r.jsx)(`div`,{class:`cf-form__err`,children:m.bookingSlotTaken}),he?(0,r.jsx)(`div`,{class:`cf-form__as`,children:e.s(m.actionAs,{identity:he})}):null,!pe&&(0,r.jsx)(`input`,{class:`cf-form__input`,type:`text`,placeholder:`${m.handoffName} *`,value:M,"aria-label":m.handoffName,onInput:e=>N(e.target.value)}),!fe&&(0,r.jsx)(r.Fragment,{children:(0,r.jsx)(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${m.handoffEmail} *`,value:P,"aria-label":m.handoffEmail,onInput:e=>te(e.target.value)})}),F===`error`&&(0,r.jsx)(`div`,{class:`cf-form__err`,children:m.formError}),(0,r.jsxs)(`div`,{class:`cf-form__actions`,children:[o&&(0,r.jsx)(`button`,{type:`button`,class:`cf-form__cancel`,onClick:o,children:m.cancel}),(0,r.jsx)(`button`,{type:`button`,class:`cf-form__submit`,disabled:!me||F===`submitting`,onClick:ye,children:F===`submitting`?m.sending:p})]})]})},we=({actions:t,descriptors:i,visitor:a,onSubmitForm:o,onDemoSlots:s,scheduler:l,exclude:u=[],openAction:d,translations:f={}})=>{let p=e.c(),[h,g]=(0,n.useState)(null),[v,y]=(0,n.useState)(!1),b=(0,n.useRef)(null),x=(0,n.useRef)(null),S=(0,n.useRef)(!1),C=(0,n.useMemo)(()=>`cf-actions-${Math.random().toString(36).slice(2,9)}`,[]),w=(0,n.useMemo)(()=>ge(i,t,f).filter(e=>!u.includes(e.id)&&!u.includes(e.endpoint)),[i,t,u,f]);(0,n.useEffect)(()=>{d&&w.some(e=>e.id===d)&&(g(d),y(!0))},[d,w]);let T=h?w.find(e=>e.id===h):void 0,E=(0,n.useCallback)(()=>{S.current=!0,g(null),y(!1)},[]),D=(0,n.useCallback)(()=>g(null),[]);(0,n.useLayoutEffect)(()=>{v||!S.current||(S.current=!1,b.current?.focus())},[v]);let O=(0,n.useRef)({drawerOpen:v,activeId:h});if(O.current={drawerOpen:v,activeId:h},(0,n.useEffect)(()=>{let e=e=>{if(e.key!==`Escape`)return;let{drawerOpen:t,activeId:n}=O.current;!t&&!n||(e.stopPropagation(),n?D():E())};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[D,E]),(0,n.useEffect)(()=>{v&&x.current?.querySelector(`button, input, textarea, select`)?.focus()},[v,h]),w.length===0)return null;let k=v?T?(0,r.jsxs)(`div`,{ref:x,id:C,class:`cf-action-drawer is-open`,role:`dialog`,"aria-modal":`false`,"aria-label":T.formTitle||T.label,children:[(0,r.jsx)(`div`,{class:`cf-action-drawer__handle`,"aria-hidden":`true`}),(0,r.jsxs)(`div`,{class:`cf-action-drawer__head`,children:[(0,r.jsxs)(`div`,{children:[(0,r.jsx)(`strong`,{children:T.formTitle||T.label}),T.legacyFallback?(0,r.jsx)(`small`,{class:`cf-action-test-mode`,children:p.actionTestMode}):null]}),(0,r.jsx)(`button`,{type:`button`,class:`cf-action-drawer__close`,"aria-label":p.actionClose,onClick:D,children:(0,r.jsx)(_,{})})]}),T.readiness===`degraded`&&T.readinessNote?(0,r.jsx)(`p`,{class:`cf-action-drawer__note cf-action-drawer__note--warn`,role:`status`,children:T.readinessNote}):null,(T.presentation??`form`)===`booking`?(0,r.jsx)(Ce,{visitor:a,title:T.formTitle,submitLabel:T.submitLabel,onCancel:D,onSubmit:(e,t)=>o(T.id,e,t,T.endpoint),onDemoSlots:s,scheduler:l}):(0,r.jsx)(U,{spec:{title:T.formTitle||T.label,submit:T.submitLabel,fields:T.fields},visitor:a,onCancel:D,onSubmit:(e,t)=>o(T.id,e,t,T.endpoint)})]}):(0,r.jsxs)(`div`,{ref:x,id:C,class:`cf-action-drawer cf-action-drawer--menu`,role:`dialog`,"aria-modal":`false`,"aria-label":p.actionChoose,children:[(0,r.jsx)(`div`,{class:`cf-action-drawer__handle`,"aria-hidden":`true`}),(0,r.jsxs)(`div`,{class:`cf-action-drawer__head`,children:[(0,r.jsxs)(`div`,{children:[(0,r.jsx)(`span`,{class:`cf-action-drawer__eyebrow`,children:p.actionNeedHelp}),(0,r.jsx)(`strong`,{children:p.actionChoose})]}),(0,r.jsx)(`button`,{type:`button`,class:`cf-action-drawer__close`,"aria-label":p.actionClose,onClick:E,children:(0,r.jsx)(_,{})})]}),(0,r.jsx)(`div`,{class:`cf-action-drawer__grid`,children:w.map(e=>(0,r.jsxs)(`button`,{type:`button`,class:`cf-action-card`,onClick:()=>g(e.id),children:[(0,r.jsx)(`span`,{class:`cf-action-card__icon`,children:(0,r.jsx)(pe(e.icon),{})}),(0,r.jsxs)(`span`,{class:`cf-action-card__copy`,children:[(0,r.jsx)(`strong`,{children:e.label}),e.legacyFallback?(0,r.jsx)(`small`,{class:`cf-action-test-mode`,children:p.actionTestMode}):null,(0,r.jsx)(`small`,{children:e.description}),e.readiness===`degraded`&&e.readinessNote?(0,r.jsx)(`small`,{class:`cf-action-card__warn`,children:e.readinessNote}):null]}),(0,r.jsx)(c,{})]},e.id))}),(0,r.jsx)(`p`,{class:`cf-action-drawer__note`,children:p.actionFooter})]}):null;return(0,r.jsxs)(`div`,{class:`cf-action-shell`,children:[(0,r.jsxs)(`button`,{ref:b,type:`button`,class:`cf-action-trigger`,hidden:v,"aria-expanded":v,"aria-controls":C,onClick:()=>v?E():y(!0),children:[(0,r.jsx)(`span`,{class:`cf-action-trigger__icon`,children:(0,r.jsx)(m,{})}),(0,r.jsxs)(`span`,{class:`cf-action-trigger__copy`,children:[(0,r.jsx)(`strong`,{children:p.actionContactOptions}),(0,r.jsx)(`small`,{children:ve(w,p)})]}),(0,r.jsx)(c,{})]}),k]})},Te=({hasEmail:t,visitor:i,question:a,onSubmitForm:o})=>{let s=e.c(),[c,l]=(0,n.useState)(!1),[u,d]=(0,n.useState)(!1),[f,p]=(0,n.useState)(i.name??``),[m,h]=(0,n.useState)(i.email??``);if(t)return(0,r.jsxs)(`div`,{class:`cf-handoff cf-handoff--done`,children:[(0,r.jsx)(b,{}),(0,r.jsx)(`span`,{children:`We’ve alerted the team. If someone is available, they can continue here.`})]});if(c){let t=i.email||m;return(0,r.jsxs)(`div`,{class:`cf-handoff cf-handoff--done`,children:[(0,r.jsx)(b,{}),(0,r.jsx)(`span`,{children:e.s(s.handoffShared,{email:t})})]})}let g=async()=>{if(!(!m.trim()||u)){d(!0);try{await o(`inquiry`,{visitorEmail:m.trim(),...f.trim()?{visitorName:f.trim()}:{},message:a||`I had a question the assistant couldn’t answer.`,subject:`Help request from chat`},{email:m.trim(),name:f.trim()||void 0}),l(!0)}catch{d(!1)}}};return(0,r.jsxs)(`div`,{class:`cf-handoff`,children:[(0,r.jsx)(`div`,{class:`cf-handoff__title`,children:s.handoffTitle}),(0,r.jsx)(`input`,{class:`cf-form__input`,type:`text`,placeholder:s.handoffName,value:f,"aria-label":s.handoffName,onInput:e=>p(e.target.value)}),(0,r.jsx)(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${s.handoffEmail} *`,value:m,"aria-label":s.handoffEmail,onInput:e=>h(e.target.value)}),(0,r.jsx)(`button`,{type:`button`,class:`cf-form__submit`,disabled:!m.trim()||u,onClick:g,children:u?s.sending:s.handoffNotify})]})},Ee=({text:t})=>{let i=e.c(),[a,o]=(0,n.useState)(!1);return(0,r.jsxs)(`button`,{type:`button`,class:`cf-tool`,onClick:async()=>{try{await navigator.clipboard.writeText(t),o(!0),setTimeout(()=>o(!1),1500)}catch{}},"aria-label":i.copy,children:[a?(0,r.jsx)(b,{}):(0,r.jsx)(x,{}),a?i.copied:i.copy]})},De=({items:e,onPick:t})=>e.length===0?null:(0,r.jsx)(`div`,{class:`cf-starters`,children:e.map((e,n)=>(0,r.jsx)(`button`,{type:`button`,class:`cf-starter`,onClick:()=>t(e),children:e},n))}),Oe=({items:e})=>{let t=e.filter(e=>e.label.trim()&&e.url.trim()).slice(0,4);return t.length===0?null:(0,r.jsx)(`div`,{class:`cf-featured-links`,children:t.map((e,t)=>(0,r.jsxs)(`a`,{class:`cf-featured-link`,href:e.url,target:`_blank`,rel:`noopener noreferrer nofollow`,title:e.label,children:[(0,r.jsx)(f,{}),(0,r.jsx)(`span`,{children:e.label})]},`${e.url}-${t}`))})},ke=({msg:t,onRate:i})=>{let a=e.c(),[o,s]=(0,n.useState)(!1),[c,l]=(0,n.useState)(``),u=t.feedback,d=()=>{i(t.id,`up`),s(!1)},f=()=>{i(t.id,`down`),s(!0)},p=()=>{i(t.id,`down`,c.trim()),s(!1)};return(0,r.jsxs)(`div`,{class:`cf-feedback`,children:[(0,r.jsxs)(`div`,{class:`cf-feedback__row`,children:[(0,r.jsx)(`button`,{type:`button`,class:`cf-feedback__btn ${u===`up`?`is-active`:``}`,"aria-label":a.feedbackHelpful,"aria-pressed":u===`up`,onClick:d,children:(0,r.jsx)(D,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-feedback__btn ${u===`down`?`is-active`:``}`,"aria-label":a.feedbackNotHelpful,"aria-pressed":u===`down`,onClick:f,children:(0,r.jsx)(O,{})}),u&&!o&&(0,r.jsx)(`span`,{class:`cf-feedback__thanks`,children:a.feedbackThanks})]}),o&&u===`down`&&(0,r.jsxs)(`div`,{class:`cf-feedback__comment`,children:[(0,r.jsx)(`textarea`,{class:`cf-feedback__input`,rows:2,placeholder:a.feedbackCommentPlaceholder,value:c,onInput:e=>l(e.target.value)}),(0,r.jsx)(`button`,{type:`button`,class:`cf-feedback__send`,onClick:p,children:a.feedbackSend})]})]})},Ae=({msg:t,persona:n,isLast:i,visitor:a,hasEmail:o,lastQuestion:s,showActions:c,onPickReply:l,onSubmitForm:u,onDemoSlots:d,onRetry:f,ratable:p,onRate:m,onExpandVisualization:h})=>{let g=e.c(),_=t.role===`user`,v=t.liveEventType??``,y=t.content.trim().toLowerCase(),b=v===`handoff_queued`||v===`agent_joined`||v===`agent_left`||v===`conversation_ended`||y.includes(`joined the chat`)||y.includes(`left the chat`)||y.includes(`support agents will be with you`),x=t.role===`system`||b,C=t.requestedContactFields?.includes(`email`)===!0,T=i&&!_&&!x&&!!(t.handoffOffered||C),E=T&&!o?[`inquiry`]:[],D=!t.pending&&!t.streaming,O=[...t.artifacts??[],...t.visualization&&!(t.artifacts??[]).some(e=>e.type===`visualization`)?[{type:`visualization`,visualization:t.visualization}]:[]];return x?(0,r.jsx)(`div`,{class:`cf-msg cf-msg--system`,children:(0,r.jsxs)(`div`,{class:`cf-system-event`,children:[(0,r.jsx)(`div`,{class:`cf-system-event__mark`,"aria-hidden":`true`}),(0,r.jsx)(`div`,{class:`cf-system-event__text`,children:t.content}),t.createdAt&&(0,r.jsx)(`div`,{class:`cf-system-event__time`,children:new Date(t.createdAt).toLocaleString(void 0,{day:`2-digit`,month:`short`,year:`numeric`,hour:`numeric`,minute:`2-digit`})})]})}):(0,r.jsxs)(`div`,{class:`cf-msg cf-msg--${_?`user`:`agent`}`,children:[!_&&(0,r.jsx)(ce,{persona:n,small:!0}),(0,r.jsxs)(`div`,{class:`cf-msg__col`,children:[t.pending&&t.content===``?(0,r.jsx)(le,{}):t.imageUrl?(0,r.jsxs)(`div`,{class:`cf-msg__bubble cf-msg__bubble--media`,children:[(0,r.jsx)(`img`,{class:`cf-msg__media`,src:t.imageUrl,alt:`GIF`}),t.content&&(0,r.jsx)(`span`,{class:`cf-msg__caption`,children:t.content})]}):(0,r.jsxs)(`div`,{class:`cf-msg__bubble`,children:[_?t.content:e.a(t.content),t.streaming&&(0,r.jsx)(`span`,{class:`cf-caret`,"aria-hidden":`true`})]}),_?null:O.map((e,n)=>e.type===`visualization`&&e.visualization?(0,r.jsx)(je,{visualization:e.visualization,onExpand:h?()=>h(t.id):void 0,expandControlId:t.id},`visualization-${n}`):e.type===`image`&&(e.data||e.uri?.startsWith(`https://`))&&[`image/png`,`image/jpeg`,`image/webp`].includes(e.mimeType??``)?(0,r.jsxs)(`figure`,{class:`cf-artifact`,children:[e.title?(0,r.jsx)(`figcaption`,{children:e.title}):null,(0,r.jsx)(`img`,{src:e.uri||`data:${e.mimeType};base64,${e.data}`,alt:e.altText||e.caption||e.title||`Tool result`}),e.caption&&e.caption!==e.title?(0,r.jsx)(`p`,{children:e.caption}):null]},`image-${n}`):e.type===`resource_link`&&e.uri?.startsWith(`https://`)?(0,r.jsxs)(`a`,{class:`cf-artifact-link`,href:e.uri,target:`_blank`,rel:`noopener noreferrer nofollow`,children:[(0,r.jsx)(`strong`,{children:e.title||e.name||`Open result`}),e.caption?(0,r.jsx)(`span`,{children:e.caption}):null]},`link-${n}`):null),!_&&t.visualization&&ie(t.visualization)?(0,r.jsx)(re,{explanation:ie(t.visualization),onFollowUp:l,showLead:!t.content.toLocaleLowerCase().includes(ie(t.visualization).headline.toLocaleLowerCase())}):null,_&&t.attachmentName&&(0,r.jsxs)(`div`,{class:`cf-attach-chip`,title:t.attachmentName,children:[(0,r.jsx)(w,{}),(0,r.jsx)(`span`,{children:t.attachmentName})]}),!_&&(0,r.jsxs)(r.Fragment,{children:[D&&(t.error||t.content)&&(0,r.jsxs)(`div`,{class:`cf-msg__actions`,children:[(0,r.jsx)(`div`,{class:`cf-msg__tools`,children:t.error?(0,r.jsxs)(`button`,{type:`button`,class:`cf-tool`,onClick:()=>f(t.id,t.retryText??``),children:[(0,r.jsx)(S,{}),g.retry]}):(0,r.jsx)(Ee,{text:t.content})}),p&&!t.error&&t.content&&(0,r.jsx)(ke,{msg:t,onRate:m})]}),(0,r.jsx)(V,{msg:t}),i&&(0,r.jsx)(ue,{replies:t.suggestedReplies,onPick:l}),T&&(0,r.jsx)(Te,{hasEmail:o,visitor:a,question:s,onSubmitForm:u}),c&&(0,r.jsx)(we,{actions:t.availableActions,descriptors:t.actions,openAction:t.selectedAction,visitor:a,onSubmitForm:u,onDemoSlots:d,scheduler:n?.scheduler,exclude:E})]})]})]})},je=({visualization:t,expanded:i=!1,onExpand:a,onClose:o,expandControlId:s})=>{let l=(0,n.useRef)(null),u=(0,n.useMemo)(()=>e.v(t),[t]),[d,f]=(0,n.useState)(u?.type);(0,n.useEffect)(()=>f(u?.type),[u]);let p=(0,n.useMemo)(()=>e.b(t),[t]),m=(0,n.useMemo)(()=>e.v(t,d),[d,t]),h=d??m?.type??u?.type,g=p.find(e=>e.type===h),v=t.rows??[],y=t.columns?.length?t.columns:Object.keys(v[0]??{}),x=y.map(e=>{let n=t.columnMetadata?.find(t=>t.key===e);return n?{key:e,label:n.label,dataType:n.dataType,currencyCode:n.currencyCode}:e});if(v.length===0)return(0,r.jsx)(I,{});let S=(0,r.jsx)(te,{answeredAt:t.freshness?.answeredAt,reportingPeriod:t.reportingPeriod,filters:t.appliedFilters,rowCount:t.rowCount??v.length}),C=()=>t.tableAvailable===!1||y.length===0?null:(0,r.jsxs)(`div`,{class:`cf-analytics-visualization${i?` is-expanded`:``}`,children:[(0,r.jsxs)(`div`,{class:`cf-analytics-visualization__header`,children:[(0,r.jsxs)(`div`,{children:[(0,r.jsx)(`div`,{class:`cf-analytics-visualization__title`,children:t.title?.trim()||`Result details`}),S]}),(0,r.jsxs)(`div`,{class:`cf-analytics-visualization__actions`,children:[t.downloadAvailable?(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-visualization__download`,onClick:()=>Me(y,v),children:`Download`}):null,i&&o?(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-visualization__close`,"aria-label":`Restore assistant view`,onClick:o,children:(0,r.jsx)(_,{})}):a&&t.expandable!==!1?(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-visualization__expand`,"aria-label":`Expand table`,"data-visualization-message":s,onClick:a,children:(0,r.jsx)(k,{})}):null]})]}),(0,r.jsx)(e.p,{rows:v,columns:x,maxRows:100,expanded:i,classPrefix:`cf`})]});if(t.presentation===`table`||!t.presentation&&t.type===`table`)return C();let w=t.chartRecommendation?.valueFields?.[0]??t.valueFields?.[0]??t.value??y[1];if(t.presentation===`kpi`||!t.presentation&&t.type===`kpi`){let n=v[0]?.[w??y[0]??``],a=typeof n==`number`?n:Number(n),s=t.columnMetadata?.find(e=>e.key===w),c=Number.isFinite(a)?e.y(a,s,t):String(n??`No value`);return(0,r.jsxs)(`div`,{class:`cf-analytics-visualization${i?` is-expanded`:``}`,children:[(0,r.jsxs)(`div`,{class:`cf-analytics-visualization__header`,children:[(0,r.jsxs)(`div`,{children:[(0,r.jsx)(`div`,{class:`cf-analytics-visualization__title`,children:`Live metric`}),S]}),i&&o?(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-visualization__close`,"aria-label":`Restore assistant view`,onClick:o,children:(0,r.jsx)(_,{})}):null]}),(0,r.jsx)(F,{label:s?.label??w??`Current value`,value:c})]})}return m?(0,r.jsxs)(`div`,{class:`cf-analytics-visualization${i?` is-expanded`:``}`,children:[(0,r.jsxs)(`div`,{class:`cf-analytics-visualization__header`,children:[(0,r.jsxs)(`div`,{children:[(0,r.jsx)(`div`,{class:`cf-analytics-visualization__title`,children:m.title}),S]}),(0,r.jsxs)(`div`,{class:`cf-analytics-visualization__actions`,children:[p.length>1?(0,r.jsxs)(`details`,{ref:l,class:`cf-analytics-chart-picker`,children:[(0,r.jsxs)(`summary`,{"aria-label":`Choose chart type`,title:`Choose chart type`,children:[(0,r.jsxs)(`span`,{class:`cf-analytics-chart-picker__current`,children:[(0,r.jsx)(L,{type:h??m.type}),(0,r.jsx)(`span`,{children:g?.label??`Chart`})]}),(0,r.jsx)(c,{})]}),(0,r.jsx)(`div`,{class:`cf-analytics-chart-picker__menu`,role:`listbox`,"aria-label":`Chart type`,children:p.map(e=>{let t=e.type===h;return(0,r.jsxs)(`button`,{type:`button`,role:`option`,"aria-selected":t,class:t?`is-selected`:``,onClick:()=>{f(e.type),l.current&&(l.current.open=!1)},children:[(0,r.jsx)(`span`,{class:`cf-analytics-chart-picker__icon`,children:(0,r.jsx)(L,{type:e.type})}),(0,r.jsxs)(`span`,{class:`cf-analytics-chart-picker__copy`,children:[(0,r.jsx)(`strong`,{children:e.label}),(0,r.jsx)(`small`,{children:ne(e.type)})]}),t?(0,r.jsx)(b,{}):null]},e.type)})})]}):null,i&&o?(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-visualization__close`,"aria-label":`Restore assistant view`,onClick:o,children:(0,r.jsx)(_,{})}):a&&t.expandable!==!1?(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-visualization__expand`,"aria-label":`Expand chart`,"data-visualization-message":s,onClick:a,children:(0,r.jsx)(k,{})}):null]})]}),(0,r.jsx)(e._,{model:m,expanded:i}),t.downloadAvailable?(0,r.jsx)(`button`,{type:`button`,class:`cf-analytics-visualization__download`,onClick:()=>Me(y,v),children:`Download this data`}):null]}):C()},Me=(t,n)=>{if(typeof document>`u`||t.length===0)return;let r=e.g(n,t),i=URL.createObjectURL(new Blob([r],{type:`text/csv;charset=utf-8`})),a=document.createElement(`a`);a.href=i,a.download=`analytics-result.csv`,a.click(),URL.revokeObjectURL(i)},Ne=e=>new Promise((t,n)=>{let r=new FileReader;r.onload=()=>t(String(r.result).split(`,`)[1]??``),r.onerror=n,r.readAsDataURL(e)}),Pe=({onPick:e})=>(0,r.jsx)(`div`,{class:`cf-picker cf-emoji`,children:i.map(t=>(0,r.jsxs)(`div`,{class:`cf-emoji__group`,children:[(0,r.jsx)(`div`,{class:`cf-emoji__label`,children:t.name}),(0,r.jsx)(`div`,{class:`cf-emoji__grid`,children:t.emojis.map((t,n)=>(0,r.jsx)(`button`,{type:`button`,class:`cf-emoji__btn`,onClick:()=>e(t),"aria-label":t,children:t},n))})]},t.name))}),Fe=({onSearch:t,onPick:i})=>{let a=e.c(),[o,s]=(0,n.useState)(``),[c,l]=(0,n.useState)([]),[u,d]=(0,n.useState)(!0);return(0,n.useEffect)(()=>{let e=!0;d(!0);let n=setTimeout(()=>{t(o).then(t=>e&&(l(t),d(!1))).catch(()=>e&&(l([]),d(!1)))},300);return()=>{e=!1,clearTimeout(n)}},[o,t]),(0,r.jsxs)(`div`,{class:`cf-picker cf-gif`,children:[(0,r.jsx)(`input`,{class:`cf-gif__search`,placeholder:a.searchGifs,value:o,"aria-label":a.searchGifs,onInput:e=>s(e.target.value)}),(0,r.jsx)(`div`,{class:`cf-gif__grid`,children:u?(0,r.jsx)(`div`,{class:`cf-gif__hint`,children:a.searchingGifs}):c.length===0?(0,r.jsx)(`div`,{class:`cf-gif__hint`,children:a.noGifs}):c.map(e=>(0,r.jsx)(`button`,{type:`button`,class:`cf-gif__item`,onClick:()=>i(e.url),"aria-label":e.alt,children:(0,r.jsx)(`img`,{src:e.preview,alt:e.alt,loading:`lazy`})},e.id))}),(0,r.jsx)(`div`,{class:`cf-gif__powered`,children:`via Tenor`})]})},Ie=8*1024*1024,Le=`image/png,image/jpeg,image/webp,image/gif,application/pdf`,Re=12e3,ze=250,Be=e=>{switch(e){case`connecting`:return`Connecting with AI…`;case`listening`:return`Listening now — go ahead.`;case`speaking`:return`AI is speaking — talk to interrupt.`;case`processing`:return`Understanding what you said…`;case`noise`:return`I couldn't hear clear words. Try again closer to the mic.`;case`misunderstood`:return`I didn't understand that. Please try again.`;case`denied`:return`Microphone access is blocked. Allow the mic or type your question.`;case`muted`:return`Muted — tap the mic to unmute.`;case`timeout`:return`Didn't hear anything for a while — ending the call.`;default:return``}},Ve=.004,He=({muted:e,listening:t,micLevel:n,onToggleMute:i})=>(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn ${e?`is-muted`:``} ${t?`is-listening`:``} ${t&&n>=.004?`is-hot`:``}`,"aria-label":e?`Unmute microphone`:`Mute microphone`,"aria-pressed":e,onClick:i,style:t?{"--cf-wave":String(Math.max(.2,Math.min(1,n*6)))}:void 0,children:e?(0,r.jsx)(d,{}):(0,r.jsx)(u,{})}),Ue=({audioDevices:e,selectedAudioDeviceId:t,onSelectAudioDevice:i})=>{let[a,o]=(0,n.useState)(!1),s=(0,n.useRef)(null);(0,n.useEffect)(()=>{if(!a)return;let e=e=>{s.current&&!e.composedPath().includes(s.current)&&o(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[a]);let l=[{deviceId:``,label:`Default microphone`},...e];return(0,r.jsxs)(`div`,{class:`cf-call-more`,ref:s,children:[(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--microphones`,"aria-label":`Choose microphone`,"aria-expanded":a,onClick:()=>o(e=>!e),children:(0,r.jsx)(c,{})}),a&&(0,r.jsxs)(`div`,{class:`cf-call-menu`,role:`menu`,children:[(0,r.jsx)(`div`,{class:`cf-call-menu__label`,children:`Microphone`}),l.map(e=>(0,r.jsxs)(`button`,{type:`button`,role:`menuitemradio`,"aria-checked":e.deviceId===t,class:`cf-call-menu__item ${e.deviceId===t?`is-active`:``}`,onClick:()=>{i(e.deviceId),o(!1)},children:[e.deviceId===t?(0,r.jsx)(b,{}):(0,r.jsx)(`span`,{class:`cf-call-menu__spacer`}),(0,r.jsx)(`span`,{children:e.label})]},e.deviceId))]})]})},We=({voiceState:e,muted:t,onToggleMute:n,onEndCall:i,onTalkNow:a,showTalkNow:o,micLevel:s,theaterMode:c,onToggleTheater:l,onMinimize:d,audioDevices:f,selectedAudioDeviceId:p,onSelectAudioDevice:m})=>(0,r.jsxs)(`div`,{class:`cf-call-controls`,children:[(0,r.jsx)(He,{muted:t,listening:e===`listening`&&!t,micLevel:s,onToggleMute:n}),(0,r.jsx)(Ue,{audioDevices:f,selectedAudioDeviceId:p,onSelectAudioDevice:m}),o&&(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--talk`,"aria-label":`Talk now`,onClick:a,children:(0,r.jsx)(u,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn`,"aria-label":c?`Exit expanded view`:`Expand view`,"aria-pressed":c,onClick:l,children:c?(0,r.jsx)(A,{}):(0,r.jsx)(k,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn`,"aria-label":`Minimize voice chat`,onClick:d,children:(0,r.jsx)(j,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--end`,"aria-label":`End voice chat`,onClick:i,children:(0,r.jsx)(T,{})})]}),Ge=({persona:e,voiceState:t,muted:n,onToggleMute:i,onEndCall:a,micLevel:o,onExpand:s})=>{let c=e=>e.stopPropagation(),l=e?.assistantMediaUrl?.trim()||e?.agentAvatarUrl?.trim()||``,u=e?.assistantMediaKind===`video`&&!!l,d=e?.agentName||`Assistant`;return(0,r.jsxs)(`div`,{class:[`cf-floating-call-card`,t===`listening`&&!n?`is-listening`:``,t===`speaking`?`is-speaking`:``,t===`processing`||t===`connecting`?`is-thinking`:``,n?`is-muted`:``].filter(Boolean).join(` `),style:t===`listening`&&!n?{"--cf-listen":String(Math.max(.18,Math.min(1,o*8)))}:void 0,role:`button`,tabIndex:0,"aria-label":`Reopen voice chat with ${d}`,onClick:s,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),s())},children:[(0,r.jsx)(`div`,{class:`cf-floating-call-card__media`,"aria-hidden":`true`,children:l?u?(0,r.jsx)(`video`,{src:l,muted:!0,loop:!0,playsInline:!0,autoPlay:!0}):(0,r.jsx)(`img`,{src:l,alt:``}):(0,r.jsxs)(`div`,{class:`cf-floating-call-card__avatar${R(e)}`,children:[(0,r.jsx)(`span`,{children:z(e)}),(0,r.jsx)(`span`,{class:`cf-floating-call-card__eye cf-floating-call-card__eye--left`}),(0,r.jsx)(`span`,{class:`cf-floating-call-card__eye cf-floating-call-card__eye--right`}),(0,r.jsx)(`span`,{class:`cf-floating-call-card__mouth`})]})}),(0,r.jsx)(`div`,{class:`cf-floating-call-card__shade`,"aria-hidden":`true`}),(0,r.jsxs)(`div`,{class:`cf-floating-call-card__controls`,onClick:c,onKeyDown:c,role:`presentation`,children:[(0,r.jsx)(He,{muted:n,listening:t===`listening`&&!n,micLevel:o,onToggleMute:i}),(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--restore`,"aria-label":`Restore voice chat`,onClick:e=>{c(e),s()},children:(0,r.jsx)(ee,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--end`,"aria-label":`End voice chat`,onClick:e=>{c(e),a()},children:(0,r.jsx)(T,{})})]})]})},Ke=(e,t)=>{switch(e){case`connecting`:return t.voiceConnecting;case`listening`:return t.voiceListening;case`processing`:return t.voiceProcessing;case`speaking`:return t.voiceSpeaking;case`noise`:return t.voiceNoise;case`misunderstood`:return t.voiceMisunderstood;case`denied`:return t.voiceDenied;default:return Be(e)}},qe=({draftStore:t,onSend:i,onSendGif:a,onTyping:o,disabled:s,allowVoice:c,onTranscribe:d,gifEnabled:f,onSearchGifs:p,allowAttach:m,onExtract:h,voiceStartSignal:v=0,onVoiceStateChange:y})=>{let b=e.c(),[x,S]=(0,n.useState)(()=>t.value),C=e=>{let n=typeof e==`function`?e(x):e;t.value=n,S(n)},[T,E]=(0,n.useState)(!1),[D,O]=(0,n.useState)(!1),[k,A]=(0,n.useState)(`idle`),[j,ee]=(0,n.useState)(`none`),[M,N]=(0,n.useState)(null),[P,te]=(0,n.useState)(!1),[F,I]=(0,n.useState)(!1),[ne,L]=(0,n.useState)(``),re=(0,n.useRef)(null),ie=(0,n.useRef)(null),ae=(0,n.useRef)(null),oe=(0,n.useRef)(0),R=(0,n.useRef)(null),se=(0,n.useRef)([]),z=(0,n.useRef)(void 0),ce=(0,n.useRef)(null),le=(0,n.useRef)(void 0),B=(0,n.useRef)(0),V=e=>{A(e),y?.(e)},ue=()=>{z.current&&window.clearTimeout(z.current),z.current=void 0,le.current&&cancelAnimationFrame(le.current),le.current=void 0,ce.current?.close().catch(()=>void 0),ce.current=null};(0,n.useEffect)(()=>{let e=re.current;e&&(e.style.height=`auto`,e.style.height=`${Math.min(e.scrollHeight,110)}px`)},[x]),(0,n.useEffect)(()=>()=>{M?.previewUrl&&URL.revokeObjectURL(M.previewUrl)},[M?.previewUrl]),(0,n.useEffect)(()=>{if(j===`none`)return;let e=e=>{ie.current&&!e.composedPath().includes(ie.current)&&ee(`none`)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[j]);let de=e=>ee(t=>t===e?`none`:e),fe=e=>{let t=re.current;if(!t){C(t=>t+e);return}let n=t.selectionStart??x.length,r=t.selectionEnd??x.length;C(x.slice(0,n)+e+x.slice(r)),requestAnimationFrame(()=>{t.focus();let r=n+e.length;t.setSelectionRange(r,r)})},pe=e=>{ee(`none`),a(e)},me=async e=>{if(!e)return;let t=++oe.current;if(L(``),e.size>8388608){L(b.attachTooLarge);return}te(!0);try{let n=await h(await Ne(e),e.type||`application/octet-stream`,e.name);if(t!==oe.current)return;if(!n){L(b.attachFailed);return}N({name:e.name,text:n,mimeType:e.type||`application/octet-stream`,size:e.size,previewUrl:e.type.startsWith(`image/`)?URL.createObjectURL(e):void 0})}catch{L(b.attachFailed)}finally{t===oe.current&&te(!1)}},he=async e=>{let t=e.target,n=t.files?.[0];t.value=``,await me(n)},ge=()=>{oe.current+=1,te(!1),L(``)},_e=(!!x.trim()||!!M)&&!s&&!P&&!D,ve=()=>{_e&&(i(x,M?{attachmentName:M.name,attachmentText:M.text}:void 0),o?.(!1),C(``),N(null),L(``))},H=e=>{let t=e.trim();if(!t||s){V(`misunderstood`),window.setTimeout(()=>V(`idle`),2500);return}let n=x.trim();i(n?`${n} ${t}`:t),o?.(!1),C(``),N(null),L(``),V(`idle`)},U=e=>{if(e.key===`Enter`&&!e.shiftKey){if(s)return;e.preventDefault(),ve()}else e.key===`Escape`&&j!==`none`&&(e.preventDefault(),e.stopPropagation(),ee(`none`))},ye=async()=>{if(T){e.f(R.current);return}try{V(`connecting`);let t=await navigator.mediaDevices.getUserMedia({audio:e.d()}),n=e.u(t);se.current=[],B.current=0;try{let e=window.AudioContext??window.webkitAudioContext;if(e){let n=new e;ce.current=n;let r=n.createMediaStreamSource(t),i=n.createAnalyser();i.fftSize=512,r.connect(i);let a=new Uint8Array(i.frequencyBinCount),o=()=>{i.getByteTimeDomainData(a);let e=0;for(let t of a){let n=(t-128)/128;e+=n*n}B.current=Math.max(B.current,Math.sqrt(e/a.length)),le.current=requestAnimationFrame(o)};o()}}catch{}n.ondataavailable=e=>e.data.size>0&&se.current.push(e.data),n.onstop=async()=>{ue(),t.getTracks().forEach(e=>e.stop()),E(!1);let e=new Blob(se.current,{type:n.mimeType||`audio/webm`});if(e.size===0||e.size<900||B.current<.006){V(`noise`),window.setTimeout(()=>V(`idle`),3200);return}O(!0),V(`processing`);try{let t=await Ne(e);if(!t.trim()){V(`noise`),window.setTimeout(()=>V(`idle`),3200);return}let n=typeof navigator<`u`&&(navigator.languages?.[0]||navigator.language)||void 0;H(await d(t,e.type,n))}catch{V(`misunderstood`),window.setTimeout(()=>V(`idle`),3e3)}finally{O(!1)}},R.current=n,n.start(250),E(!0),V(`listening`),z.current=window.setTimeout(()=>{e.f(R.current)},12e3)}catch{V(`denied`),window.setTimeout(()=>V(`idle`),3500)}};return(0,n.useEffect)(()=>{!v||!c||s||T||D||ye()},[v]),(0,n.useEffect)(()=>()=>{ue();let e=R.current;if(e){if(e.ondataavailable=null,e.onstop=null,e.onerror=null,e.state!==`inactive`)try{e.stop()}catch{}e.stream.getTracks().forEach(e=>e.stop())}R.current=null,se.current=[]},[]),(0,r.jsxs)(`div`,{class:`cf-composer ${F?`is-dragging`:``}`,ref:ie,onDragEnter:e=>{m&&(e.preventDefault(),I(!0))},onDragOver:e=>{m&&e.preventDefault()},onDragLeave:e=>{e.currentTarget===e.target&&I(!1)},onDrop:e=>{m&&(e.preventDefault(),I(!1),me(e.dataTransfer?.files?.[0]))},children:[j===`emoji`&&(0,r.jsx)(Pe,{onPick:fe}),j===`gif`&&(0,r.jsx)(Fe,{onSearch:p,onPick:pe}),(M||P||ne)&&(0,r.jsx)(`div`,{class:`cf-attach-row`,children:P?(0,r.jsxs)(`span`,{class:`cf-attach-status`,children:[(0,r.jsx)(`span`,{children:b.attaching}),(0,r.jsx)(`button`,{type:`button`,onClick:ge,children:b.cancel})]}):ne?(0,r.jsx)(`span`,{class:`cf-attach-status cf-attach-status--err`,children:ne}):M&&(0,r.jsxs)(`span`,{class:`cf-attach-chip`,title:M.name,children:[M.previewUrl?(0,r.jsx)(`img`,{class:`cf-attach-preview`,src:M.previewUrl,alt:``}):(0,r.jsx)(w,{}),(0,r.jsxs)(`span`,{class:`cf-attach-copy`,children:[(0,r.jsx)(`span`,{children:M.name}),(0,r.jsxs)(`small`,{children:[Math.max(1,Math.ceil(M.size/1024)),` KB`]})]}),(0,r.jsx)(`button`,{type:`button`,class:`cf-attach-x`,"aria-label":b.removeAttachment,onClick:()=>N(null),children:(0,r.jsx)(_,{})})]})}),k!==`idle`&&(0,r.jsxs)(`div`,{class:`cf-voice-state`,"aria-live":`polite`,children:[(0,r.jsx)(`span`,{class:`cf-voice-state__dot ${T?`is-live`:``}`}),Ke(k,b)]}),(0,r.jsxs)(`div`,{class:`cf-composer__field`,children:[(0,r.jsx)(`button`,{type:`button`,class:`cf-iconbtn ${j===`emoji`?`is-active`:``}`,"aria-label":b.emoji,"aria-pressed":j===`emoji`,onClick:()=>de(`emoji`),children:j===`emoji`?(0,r.jsx)(_,{}):(0,r.jsx)(g,{})}),f&&(0,r.jsx)(`button`,{type:`button`,class:`cf-iconbtn cf-gifbtn ${j===`gif`?`is-active`:``}`,"aria-label":b.gifs,"aria-pressed":j===`gif`,onClick:()=>de(`gif`),children:(0,r.jsx)(`span`,{class:`cf-gif-label`,children:`GIF`})}),m&&(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(`input`,{ref:ae,type:`file`,class:`cf-file-input`,accept:`image/png,image/jpeg,image/webp,image/gif,application/pdf`,onChange:he,tabIndex:-1,"aria-hidden":`true`}),(0,r.jsx)(`button`,{type:`button`,class:`cf-iconbtn`,"aria-label":b.attachFile,disabled:P,onClick:()=>ae.current?.click(),children:(0,r.jsx)(w,{})})]}),(0,r.jsx)(`textarea`,{ref:re,class:`cf-textarea`,rows:1,placeholder:b.composerPlaceholder,value:x,"aria-label":b.composerPlaceholder,"aria-busy":s,onInput:e=>{let t=e.target.value;C(t),o?.(!!t.trim())},onPaste:e=>{let t=e.clipboardData?.files?.[0];!m||!t||(e.preventDefault(),me(t))},onKeyDown:U}),c&&(0,r.jsx)(`button`,{type:`button`,class:`cf-iconbtn cf-mic ${T?`is-recording`:``}`,"aria-label":T?b.stopRecording:b.recordVoice,"aria-pressed":T,disabled:D||s,onClick:ye,children:(0,r.jsx)(u,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-send`,"aria-label":b.send,disabled:!_e,onClick:ve,children:(0,r.jsx)(l,{})})]})]})},Je=({name:t,greeting:n})=>{let i=e.c();return(0,r.jsxs)(`section`,{class:`cf-empty-welcome`,"aria-label":e.s(i.welcomeLabel,{name:t}),children:[(0,r.jsx)(`span`,{class:`cf-empty-welcome__eyebrow`,children:i.welcomeEyebrow}),(0,r.jsx)(`h2`,{children:t}),(0,r.jsx)(`p`,{children:n||i.welcomePrompt})]})},Ye=(e,t,n)=>{if(e.key===`Escape`){e.preventDefault(),e.stopPropagation(),n();return}if(e.key!==`Tab`)return;let r=Array.from(t.querySelectorAll(`button, [href], textarea, input, select, [tabindex]:not([tabindex="-1"])`)).filter(e=>!e.hasAttribute(`disabled`)&&e.getAttribute(`aria-hidden`)!==`true`&&e.tabIndex>=0);if(r.length===0)return;let i=t.getRootNode(),a=e.composedPath()[0],o=a instanceof HTMLElement?a:`activeElement`in i?i.activeElement:document.activeElement,s=r[0],c=r[r.length-1];e.shiftKey&&(o===s||!t.contains(o))?(e.preventDefault(),e.stopPropagation(),c.focus()):!e.shiftKey&&(o===c||!t.contains(o))&&(e.preventDefault(),e.stopPropagation(),s.focus())},Xe=new Map,Ze=e=>{if(!e||typeof document>`u`||typeof CanvasRenderingContext2D>`u`)return;let t=document.createElement(`canvas`).getContext(`2d`);if(!t)return;t.fillStyle=`#010203`,t.fillStyle=e;let n=t.fillStyle;if(n===`#010203`&&e.trim().toLowerCase()!==`#010203`)return;let r=n.match(/^#([\da-f]{6})$/i)?.[1];if(r)return[Number.parseInt(r.slice(0,2),16),Number.parseInt(r.slice(2,4),16),Number.parseInt(r.slice(4,6),16),1];let i=n.match(/^rgba?\(([\d.]+)[, ]+([\d.]+)[, ]+([\d.]+)(?:[, /]+([\d.]+))?\)$/i);if(!i)return;let a=i.slice(1,5).map(Number);if(!a.some(e=>!Number.isFinite(e)))return[a[0],a[1],a[2],a[3]??1]},Qe=(e,t=`#ffffff`)=>{let n=`${e??``}|${t}`;if(Xe.has(n))return Xe.get(n);let r=Ze(e),i=Ze(t)??[255,255,255,1];if(!r){Xe.set(n,void 0);return}let a=r[3],o=r.slice(0,3).map((e,t)=>e*a+i[t]*(1-a)).map(e=>{let t=e/255;return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}),s=o[0]*.2126+o[1]*.7152+o[2]*.0722,c=1.05/(s+.05)>=(s+.05)/.059?`#ffffff`:`#0f1e2a`;return Xe.set(n,c),c},$e=e=>{let[t,r]=(0,n.useState)(`light`);return(0,n.useEffect)(()=>{if(e!==`auto`||typeof matchMedia>`u`)return;let t=matchMedia(`(prefers-color-scheme: dark)`),n=()=>r(t.matches?`dark`:`light`);return n(),t.addEventListener(`change`,n),()=>t.removeEventListener(`change`,n)},[e]),e===`auto`?t:e},et=1e4,tt=1400,q=550,J=350,Y=.001,nt=6e4,rt=90,it=280,at=250,ot=250,st=e=>e.replace(/\[[^\]]{0,60}\]/g,` `).replace(/\(([^)]{0,60})\)/g,(e,t)=>ct.has(t.trim().toLowerCase().replace(/[.!?,…]+$/,``).replace(/\s+/g,` `))?` `:e).replace(/\*[^*]{0,60}\*/g,` `).replace(/\s+/g,` `).trim(),ct=new Set(`background noise.engine noise.noise.inaudible.unintelligible.silence.no speech.static.music.laughter.applause.wind.breathing.click.clicks.clicking.mouse click.mouse clicks.beep.beeps.beeping.tap.taps.tapping.typing.keyboard typing.cough.coughing.sigh.hmm.mm.mmm.uh.um.ah.oh`.split(`.`)),lt=e=>{let t=e.trim().toLowerCase().replace(/[()[\]*]/g,` `).replace(/[.!?,…]+$/,``).replace(/\s+/g,` `).trim();return!t||/^(?:sh+\s*)+$/.test(t)?!0:ct.has(t)},ut=e=>{let t=e.trim().toLowerCase().replace(/\s+/g,` `);return t?t.includes(`transcribe this audio recording verbatim`)||t.includes(`preserve the spoken language and any code-switching`)||t.includes(`output only the transcribed text, no commentary`):!1},dt={end:`end the call`,mute:`mute your microphone`,minimize:`minimize the chat`,expand:`expand the view`,shrink:`exit the expanded view`},ft=e=>e.trim().toLowerCase().replace(/[^\p{L}\p{N}\s']/gu,` `).replace(/\s+/g,` `).trim(),pt=[{action:`shrink`,re:/\b(?:exit|leave|quit|close)\b[\s\w]*\b(?:full ?screen|expanded|theat(?:er|re))\b|\bshrink\b|\bsmaller view\b/},{action:`end`,re:/\b(?:end|close|stop|finish|hang ?up|quit|exit)\b[\s\w]*\b(?:call|chat|conversation|convo|session|talking)\b|\bhang ?up\b|\bgood ?bye\b|^bye(?: bye)?$/},{action:`mute`,re:/\bmute\b|\bstop listening\b/},{action:`minimize`,re:/\bminimi[sz]e\b|\bhide\b[\s\w]*\b(?:chat|call|window|widget)\b/},{action:`expand`,re:/\bexpand\b|\bmaximi[sz]e\b|\bfull ?screen\b|\btheat(?:er|re) mode\b|\bbigger view\b/}],mt=/^(?:yes|yeah|yep|yup|sure|correct|confirm|affirmative|go ahead|do it|please do|ok(?:ay)?)\b/,ht=/^(?:no|nope|nah|cancel|never ?mind|don'?t|stop)\b/,gt=/^(?:end|close|stop|finish|hang ?up|quit|exit|bye|good ?bye)\b/,_t=e=>{let t=ft(e);if(!t)return null;for(let{action:e,re:n}of pt)if(n.test(t)){let n=t.split(` `).length;return{action:e,confident:e===`end`?n<=10:n<=6}}return null},vt=e=>`I didn't catch yes or no. Say yes to ${dt[e]}, or no to keep talking.`,yt=e=>`I caught some audio, but not enough clear words. Try again a little closer to the mic, or type your question for ${e?.agentName?.trim()||`the assistant`}.`,bt=e=>{let t=ft(e).replace(/\b(?:um|uh|erm|hmm)\b/g,``).trim();return!t||t.split(/\s+/).length<=2&&/^(?:can|could|would|will|do|does|is|are|what|why|how|where|when)\b/.test(t)?!0:/\b(?:can you|could you|would you|will you|do you|can i|could i|would i|i want to|i need to|tell me about|what about|how about|about|with|to|for|please)$/i.test(t)},xt=(e,t)=>{let n=window.AudioContext??window.webkitAudioContext;if(!n)return null;let r,i=!1,a=new n;try{let n=a.createMediaStreamSource(e),o=a.createAnalyser();o.fftSize=512,n.connect(o);let s=new Uint8Array(o.frequencyBinCount),c=()=>{if(i)return;o.getByteTimeDomainData(s);let e=0;for(let t of s){let n=(t-128)/128;e+=n*n}t(Math.sqrt(e/s.length),performance.now()),i||(r=requestAnimationFrame(c))};c()}catch{return a.close().catch(()=>void 0),null}return{stop:()=>{i||(i=!0,r!==void 0&&cancelAnimationFrame(r),r=void 0,a.close().catch(()=>void 0))}}},St=t=>e.d(t),Ct=({transport:t,config:i,bindControls:a,composerDraftStore:o})=>{let l=i.strings,[u,d]=(0,n.useState)(i.openByDefault),{persona:f,messages:p,sending:m,assistantSpeaking:h,visitor:g,hasEmail:_,liveMode:b,assignedAgentName:x,agentTypingName:S,starters:w,featuredLinks:k,send:A,sendGif:j,notifyTyping:ee,stop:N,retry:P,rateMessage:te,injectAssistant:F,appendUserDraft:I,patchMessage:ne,removeMessage:L,submitCsat:re,submitForm:ie,transcribe:ae,extract:oe,searchGifs:R,demoSlots:se,gifEnabled:z,identify:le,ended:B,endConversation:V,startNew:ue,history:fe,viewingSessionId:pe,viewMessages:me,openConversation:he,closeHistoryView:ge,shutdown:_e,stopSpeaking:ve,speakAssistantText:H}=e.n(t,i,u),[U,ye]=(0,n.useState)(0),[W,G]=(0,n.useState)(`idle`),[K,be]=(0,n.useState)(!1),[xe,Se]=(0,n.useState)(!1),[Ce,Te]=(0,n.useState)(0),[Ee,ke]=(0,n.useState)(!1),[Me,Ne]=(0,n.useState)(null),[Pe,Fe]=(0,n.useState)([]),[Ie,Le]=(0,n.useState)(``),[Re,ze]=(0,n.useState)(()=>{try{return localStorage.getItem(`centrinfo:muted`)===`1`}catch{return!1}}),Be=$e(i.theme),Ve=p.some(e=>e.role===`assistant`&&(e.pending||e.streaming)),He=m||Ve||h,Ue=f?.soundEnabled??!0;(0,n.useEffect)(()=>{e.i(i.sound&&Ue&&!Re)},[i.sound,Ue,Re]);let We=(0,n.useCallback)(()=>{ze(e=>{let t=!e;try{localStorage.setItem(`centrinfo:muted`,t?`1`:`0`)}catch{}return t})},[]),Ke=(0,n.useRef)(null),Xe=(0,n.useRef)(null),Ze=(0,n.useRef)(null),tt=(0,n.useRef)(0),q=(0,n.useRef)(!1),J=(0,n.useRef)(!1),Y=(0,n.useRef)(!1),rt=(0,n.useRef)(0),it=(0,n.useRef)(!1),at=(0,n.useRef)(null),ot=(0,n.useRef)(null),ct=(0,n.useRef)([]),pt=(0,n.useRef)(void 0),Ct=(0,n.useRef)(void 0),wt=(0,n.useRef)(null),Tt=(0,n.useRef)(0),Et=(0,n.useRef)(0),Dt=(0,n.useRef)(!1),Ot=(0,n.useRef)(0),kt=(0,n.useRef)(null),At=(0,n.useRef)(null),jt=(0,n.useRef)(0),X=(0,n.useRef)(null),Mt=(0,n.useRef)([]),Nt=(0,n.useRef)(0),Pt=(0,n.useRef)(0),Ft=(0,n.useRef)(0),It=(0,n.useRef)(null),Lt=(0,n.useRef)(!1),Rt=(0,n.useRef)(null),zt=(0,n.useRef)(``),Bt=(0,n.useRef)(()=>{}),Vt=(0,n.useRef)(``),Ht=(0,n.useRef)(m),Ut=(0,n.useRef)(h),Wt=(0,n.useRef)(He),Gt=(0,n.useRef)(W),Kt=(0,n.useRef)(0);(0,n.useEffect)(()=>{Ht.current=m},[m]),(0,n.useEffect)(()=>{Ut.current=h},[h]),(0,n.useEffect)(()=>{Wt.current=He},[He]),(0,n.useEffect)(()=>{Gt.current=W},[W]);let[qt,Jt]=(0,n.useState)(!0),[Yt,Xt]=(0,n.useState)(!1),Zt=(0,n.useRef)(0),[Qt,$t]=(0,n.useState)(!1),[en,tn]=(0,n.useState)(!1),nn=(0,n.useRef)(null),[rn,an]=(0,n.useState)(!1),on=(0,n.useRef)({value:``}),sn=o??on.current,cn=(0,n.useRef)({confirmEnd:Qt,confirmClear:en,showHistory:rn});cn.current={confirmEnd:Qt,confirmClear:en,showHistory:rn};let[ln,un]=(0,n.useState)(!1),Z=!!pe,dn=Z?me:p,fn=dn.find(e=>e.id===Me&&e.visualization)?.visualization;(0,n.useEffect)(()=>{!Me||fn||(Ne(null),ke(!1))},[fn,Me]);let pn=(0,n.useCallback)(()=>{d(!0),ye(0),e.r(`open`),i.onOpen?.(),i.onShow?.()},[i]),mn=(0,n.useCallback)(()=>{d(!1),ke(!1),Ne(null),i.onClose?.(),i.onHide?.(),Xe.current?.focus()},[i]),hn=(0,n.useCallback)(()=>u?mn():pn(),[u,pn,mn]),gn=(0,n.useCallback)(()=>$t(!0),[]),_n=(0,n.useCallback)(()=>{V(),$t(!1)},[V]),vn=(0,n.useCallback)(()=>{ue(),Xt(!1),Jt(!0)},[ue]);(0,n.useEffect)(()=>{Qt&&nn.current?.focus()},[Qt]),(0,n.useEffect)(()=>{a({open:pn,close:mn,toggle:hn,identify:le,startNew:ue,endConversation:V,shutdown:_e})},[a,pn,mn,hn,le,ue,V,_e]),(0,n.useEffect)(()=>{let e=p.filter(e=>e.role===`assistant`&&!e.pending).length;if(u){tt.current=e;return}e>tt.current&&ye(e-tt.current)},[p,u]),(0,n.useEffect)(()=>{i.onUnreadChange?.(U)},[U,i]),(0,n.useEffect)(()=>{let e=i.sessionDurationMinutes;if(!e||e<=0)return;let t=setTimeout(()=>_e(),e*60*1e3);return()=>clearTimeout(t)},[i.sessionDurationMinutes,p,u,_e]),(0,n.useEffect)(()=>{let e=i.customLauncherSelector;if(!e||typeof document>`u`)return;let t=[];try{t=Array.from(document.querySelectorAll(e))}catch{return}let n=e=>{e.preventDefault(),hn()};return t.forEach(e=>e.addEventListener(`click`,n)),()=>t.forEach(e=>e.removeEventListener(`click`,n))},[i.customLauncherSelector,hn]);let yn=(0,n.useRef)(!1);(0,n.useEffect)(()=>{let e=i.proactiveMessage?.trim();if(!e||yn.current)return;let t=i.proactiveOnPaths??[],n=typeof location<`u`?location.pathname:``;if(t.length>0&&!t.some(e=>n.includes(e)))return;let r=`centrinfo:proactive:${i.token.slice(0,12)}`;try{if(sessionStorage.getItem(r)===`1`)return}catch{}let a=setTimeout(()=>{if(!(u||B||p.some(e=>e.role===`user`))){yn.current=!0;try{sessionStorage.setItem(r,`1`)}catch{}F(e),pn()}},Math.max(0,i.proactiveDelaySeconds)*1e3);return()=>clearTimeout(a)},[i.proactiveMessage]),(0,n.useEffect)(()=>{let e=Ze.current;if(!u||!e)return;let t=p[p.length-1],n=Date.now()<Zt.current;t?.role===`user`||qt||n?(requestAnimationFrame(()=>{e.scrollTop=e.scrollHeight}),Xt(!1),n&&Jt(!0)):Xt(!0)},[p,u,m,qt]);let bn=(0,n.useCallback)(()=>{let e=Ze.current;if(!e)return;if(q.current&&!Z){Jt(!0),Xt(!1);return}let t=e.scrollHeight-e.scrollTop-e.clientHeight<80;Jt(t),t&&Xt(!1)},[Z]),xn=(0,n.useCallback)(()=>{let e=Ze.current;e&&(e.scrollTop=e.scrollHeight),Xt(!1),Jt(!0)},[]),Sn=(0,n.useCallback)(()=>{Zt.current=Date.now()+3e3,requestAnimationFrame(xn)},[xn]);(0,n.useEffect)(()=>{if(!u||Z||!K||W===`connecting`)return;Zt.current=Date.now()+6e4,xn();let e=requestAnimationFrame(()=>{xn(),requestAnimationFrame(xn)}),t=[80,180,360].map(e=>window.setTimeout(xn,e));return()=>{cancelAnimationFrame(e),t.forEach(e=>window.clearTimeout(e))}},[h,p,u,xn,m,K,Z,W]);let Cn=(0,n.useCallback)(()=>{Ke.current?.querySelector(`.cf-textarea`)?.focus()},[]),wn=(0,n.useCallback)(()=>{pt.current&&window.clearTimeout(pt.current),pt.current=void 0,Ct.current&&window.clearTimeout(Ct.current),Ct.current=void 0,wt.current?.stop(),wt.current=null,Te(0)},[]),Tn=(0,n.useCallback)(()=>{At.current?.stop(),At.current=null,e.f(X.current),kt.current?.getTracks().forEach(e=>e.stop()),kt.current=null,jt.current=0,Pt.current=0},[]),En=(0,n.useCallback)(()=>{wn(),ot.current?.getTracks().forEach(e=>e.stop()),ot.current=null},[wn]),Q=(0,n.useCallback)(()=>{q.current=!1,Y.current=!1,J.current=!1,it.current=!1,It.current=null,Lt.current=!1,Rt.current=null,zt.current=``,be(!1),Se(!1),ke(!1),Ne(null),Tn(),ve();let t=at.current;t?.state===`recording`?e.f(t):(En(),G(`idle`))},[Tn,ve,En]),Dn=(0,n.useCallback)(()=>{Ee&&Ne(null),ke(!Ee)},[Ee]),On=(0,n.useCallback)(e=>{Ne(e),ke(!0)},[]),kn=(0,n.useCallback)(()=>{let e=Me;Ne(null),ke(!1),window.requestAnimationFrame(()=>{Array.from(Ke.current?.querySelectorAll(`[data-visualization-message]`)??[]).find(t=>t.dataset.visualizationMessage===e)?.focus()})},[Me]),An=(0,n.useCallback)(()=>{Ne(null),ke(!1)},[]),jn=(0,n.useCallback)((e,t)=>{if(Date.now()-rt.current>=nt){G(`timeout`),Ct.current=window.setTimeout(()=>Q(),2400);return}G(e),Ct.current=window.setTimeout(()=>{q.current&&!J.current&&!Ut.current&&t()},1400)},[Q]),Mn=(0,n.useCallback)((e,t,n)=>{Date.now()-rt.current<nt&&!J.current&&(Y.current=!0,H(t)),jn(e,n)},[jn,H]),Nn=(0,n.useCallback)((e,t)=>{Sn(),rt.current=Date.now(),Y.current=!0,t&&ne(t,{content:e,pending:!0,streaming:!1});let n=()=>{if(q.current){if(Ht.current){window.setTimeout(n,80);return}t&&Rt.current===t&&(Rt.current=null),A(e,{forceVoicePlayback:!0,userMessageId:t})}};n()},[Sn,ne,A]),Pn=(0,n.useCallback)(async(e,t,n,r=`normal`,i)=>{let a=null,o=e=>a||(Sn(),a=Rt.current||I(e),Rt.current=a,ne(a,{content:zt.current||e,pending:!0,streaming:!1}),a),s=()=>{a&&(Rt.current===a&&(Rt.current=null),zt.current=``,L(a),a=null)},c=()=>{zt.current=``,G(`listening`),window.setTimeout(()=>{q.current&&!J.current&&!Ht.current&&!at.current&&n()},120)},l=e.size===0,u=e.size<350&&t<.001;if(l||u){if(r===`barge`){c();return}let e=It.current;Mn(`noise`,e?vt(e):yt(f),n),zt.current=``;return}G(`processing`);let d=++Kt.current,p=o(`Listening...`);try{let t=typeof navigator<`u`&&(navigator.languages?.[0]||navigator.language)||void 0;ne(p,{content:zt.current?`${zt.current} ...`:`Transcribing...`,pending:!0});let a=st(await ae(e,e.type,t,i));if(d!==Kt.current){s();return}let o=[zt.current,a].map(e=>e.trim()).filter(Boolean).join(` `).replace(/\s+/g,` `).trim();if(!o||lt(o)||ut(o)){if(s(),r===`barge`){c();return}let e=It.current;Mn(`misunderstood`,e?vt(e):yt(f),n);return}let l=It.current;if(l){let e=ft(o);if(mt.test(e)||l===`end`&>.test(e)){s(),It.current=null,Bt.current(l);return}if(ht.test(e)){s(),It.current=null;let e=`Okay, never mind — what would you like to know?`;F(e),Y.current=!0,G(`speaking`),H(e);return}s();let t=vt(l);F(t),Y.current=!0,G(`speaking`),H(t);return}let u=_t(o);if(u){if(s(),rt.current=Date.now(),u.confident){Bt.current(u.action);return}It.current=u.action;let e=`Just to confirm — you want me to ${dt[u.action]}? Please say yes or no.`;F(e),Y.current=!0,G(`speaking`),H(e);return}if(ne(p,{content:o,pending:!0}),bt(o)){zt.current=o,G(`listening`),n();return}zt.current=``,Nn(o,p)}catch(e){if(s(),r===`barge`){c();return}Mn(`misunderstood`,`I couldn't convert your speech to text. Please check the speech service configuration or type your question.${e instanceof Error&&e.message.trim()?` (${e.message.trim()})`:``}`,n)}},[I,Sn,Mn,F,ne,f,L,Nn,H,ae]),$=(0,n.useCallback)(async()=>{if(!(!q.current||J.current)&&!(!f?.allowVoiceInput||B||Z)&&!Ht.current&&!at.current){Tn(),Y.current=!1;try{G(`connecting`);let t=await navigator.mediaDevices.getUserMedia({audio:St(Vt.current)});if(!q.current||J.current){t.getTracks().forEach(e=>e.stop());return}navigator.mediaDevices.enumerateDevices().then(e=>{Fe(e.filter(e=>e.kind===`audioinput`).map((e,t)=>({deviceId:e.deviceId,label:e.label||`Microphone ${t+1}`})))}).catch(()=>{});let n=e.u(t);at.current=n,ot.current=t,ct.current=[],Tt.current=0,Dt.current=!1,Ot.current=0;let r=performance.now(),i=e.l();wt.current=xt(t,(t,a)=>{let o=i.observe(t);if(Tt.current=Math.max(Tt.current,t),o.speech)Dt.current=!0,Ot.current=0;else if(Dt.current&&o.quiet){Ot.current||(Ot.current=a);let t=a-Ot.current,i=a-r;if(t>=o.endOfSpeechDelayMs&&i>=550&&n.state===`recording`){e.f(n);return}}else Ot.current=0;a-Et.current>90&&(Et.current=a,Te(t))}),n.ondataavailable=e=>{e.data.size>0&&ct.current.push(e.data)},n.onstop=async()=>{if(En(),at.current=null,it.current){it.current=!1,q.current&&!J.current?(G(`idle`),$()):G(q.current&&J.current?`muted`:`idle`);return}if(!q.current){G(`idle`);return}await Pn(new Blob(ct.current,{type:n.mimeType||`audio/webm`}),Tt.current,$,`normal`,Math.max(0,(performance.now()-r)/1e3))},n.start(250),G(`listening`),pt.current=window.setTimeout(()=>{e.f(at.current)},et)}catch{G(`denied`),Ct.current=window.setTimeout(()=>Q(),3500)}}},[B,Q,Pn,f,f?.allowVoiceInput,Tn,En,Z]),Fn=(0,n.useCallback)(()=>{if(q.current){Q();return}Cn(),!(!f?.allowVoiceInput||Ht.current||B||Z)&&(rt.current=Date.now(),Y.current=!1,J.current=!1,q.current=!0,Se(!1),be(!0),G(`connecting`),$())},[B,Q,Cn,f,f?.allowVoiceInput,$,Z]),In=(0,n.useCallback)(()=>{Se(t=>{let n=!t;if(J.current=n,n){let t=at.current;t?.state===`recording`?(it.current=!0,e.f(t)):(En(),G(`muted`))}else q.current&&!B&&!Z&&(G(`idle`),$());return n})},[B,$,En,Z]),Ln=(0,n.useCallback)((e,t)=>{F(e),t&&(Y.current=!0),G(`speaking`),H(e)},[F,H]),Rn=(0,n.useCallback)(e=>{switch(rt.current=Date.now(),e){case`end`:Y.current=!1,Lt.current=!0,Ln(`Okay — ending our call now. Goodbye!`,!1),window.setTimeout(()=>{Lt.current&&(Lt.current=!1,Q())},2e3);break;case`mute`:{J.current||In();let e=`Muted. Tap the mic button when you want me to listen again.`;F(e),H(e);break}case`minimize`:mn(),Ln(`Minimized — I'm still listening. Tap the call pill to bring the chat back.`,!0);break;case`expand`:ke(!0),Ln(`Sure — expanding the view.`,!0);break;case`shrink`:Ne(null),ke(!1),Ln(`Okay — back to the smaller view.`,!0);break}},[mn,Q,F,H,Ln,In]);(0,n.useEffect)(()=>{Bt.current=Rn},[Rn]);let zn=(0,n.useRef)(!1);(0,n.useEffect)(()=>{zn.current&&!h&&Lt.current&&(Lt.current=!1,Q()),zn.current=h},[h,Q]);let Bn=(0,n.useCallback)(t=>{Vt.current=t,Le(t);let n=at.current;n?.state===`recording`&&(it.current=!0,e.f(n))},[]),Vn=(0,n.useCallback)(()=>{if(!(!q.current||J.current)){if(Tn(),N(),ve(),rt.current=Date.now(),G(`listening`),Ht.current){let e=()=>{if(!(!q.current||J.current)){if(Ht.current){window.setTimeout(e,70);return}Y.current=!1,$()}};window.setTimeout(e,70);return}Y.current=!1,$()}},[$,N,Tn,ve]),Hn=(0,n.useCallback)(async()=>{if(!(kt.current||At.current)&&!(!q.current||J.current))try{let t=await navigator.mediaDevices.getUserMedia({audio:St(Vt.current)});if(!q.current||J.current||at.current||kt.current||!Wt.current&&Gt.current!==`processing`){t.getTracks().forEach(e=>e.stop());return}kt.current=t,jt.current=0,Pt.current=0,Ft.current=0;let n=()=>{if(X.current)return;N(),ve(),Kt.current+=1,rt.current=Date.now(),Y.current=!1,G(`listening`);let n=e.u(t);X.current=n,Mt.current=[],Nt.current=performance.now(),Pt.current=0,n.ondataavailable=e=>{e.data.size>0&&Mt.current.push(e.data)},n.onstop=async()=>{let e=Mt.current,t=Ft.current,r=n.mimeType||`audio/webm`;X.current=null,Mt.current=[],Tn(),q.current&&await Pn(new Blob(e,{type:r}),t,$,`barge`,Math.max(0,(performance.now()-Nt.current)/1e3))},n.start(250)},r=e.l({speechToNoiseRatio:3.2});At.current=xt(t,(t,i)=>{let a=r.observe(t);if(Ft.current=Math.max(Ft.current,t),i-Et.current>90&&(Et.current=i,Te(t)),a.speech)jt.current||(jt.current=i),i-jt.current>=280&&n(),Pt.current=0;else if(X.current&&a.quiet){Pt.current||(Pt.current=i);let t=i-Pt.current,n=i-Nt.current;t>=a.endOfSpeechDelayMs&&n>=550&&X.current.state===`recording`&&e.f(X.current)}else X.current&&i-Nt.current>=et&&X.current.state===`recording`?e.f(X.current):(jt.current=0,Pt.current=0)}),At.current||Tn()}catch{}},[Pn,$,N,Tn,ve]);(0,n.useEffect)(()=>{if(!(K&&!xe&&!B&&!Z&&(He||W===`processing`))){Tn();return}let e=window.setTimeout(()=>void Hn(),250);return()=>window.clearTimeout(e)},[He,B,Hn,Tn,K,xe,W,Z]);let Un=K&&!xe&&(m||h||W===`processing`);(0,n.useEffect)(()=>{!K||xe||h&&G(`speaking`)},[h,K,xe]),(0,n.useEffect)(()=>{if(!K||xe||!Y.current||m||h||![`processing`,`speaking`,`noise`,`misunderstood`].includes(W))return;let e=window.setTimeout(()=>{!q.current||J.current||Ht.current||(Y.current=!1,$())},700);return()=>window.clearTimeout(e)},[h,m,$,K,xe,W]),(0,n.useEffect)(()=>()=>Q(),[Q]);let[Wn,Gn]=(0,n.useState)(``),Kn=(0,n.useRef)(!1);(0,n.useEffect)(()=>{if(Kn.current&&!m){let e=[...p].reverse().find(e=>e.role===`assistant`&&!e.streaming&&!e.pending&&e.content);e&&Gn(e.content)}Kn.current=m},[m,p]),(0,n.useLayoutEffect)(()=>{if(!u)return;let e=Ke.current,t=Qt||en?e?.querySelector(`.cf-confirm__card`):rn?e?.querySelector(`.cf-history`):null;if(!t)return;let n=t.getRootNode(),r=`activeElement`in n?n.activeElement:document.activeElement;(!r||!t.contains(r))&&t.querySelector(`button, [href], textarea, input, [tabindex]:not([tabindex="-1"])`)?.focus()},[en,Qt,u,rn]),(0,n.useEffect)(()=>{if(!u)return;let e=Ke.current,t=Qt||en?e?.querySelector(`.cf-confirm__card`):rn?e?.querySelector(`.cf-history`):null,n=e?.querySelectorAll(`:scope > .cf-header, :scope > .cf-panel__video, :scope > .cf-panel__chat`);n?.forEach(e=>{t?(e.setAttribute(`inert`,``),e.setAttribute(`aria-hidden`,`true`)):(e.removeAttribute(`inert`),e.removeAttribute(`aria-hidden`))}),t||requestAnimationFrame(()=>e?.querySelector(`.cf-textarea`)?.focus());let r=e=>{if(e.key===`Escape`){e.preventDefault();let t=cn.current;if(t.confirmEnd){$t(!1);return}if(t.confirmClear){tn(!1);return}if(t.showHistory){an(!1);return}mn();return}if(e.key!==`Tab`||!t)return;let n=t.querySelectorAll(`button, [href], textarea, input, [tabindex]:not([tabindex="-1"])`),r=Array.from(n).filter(e=>!e.hasAttribute(`disabled`));if(r.length===0)return;let i=r[0],a=r[r.length-1],o=t.getRootNode()instanceof ShadowRoot?t.getRootNode().activeElement:document.activeElement;e.shiftKey&&o===i?(e.preventDefault(),a.focus()):!e.shiftKey&&o===a&&(e.preventDefault(),i.focus())};return e?.addEventListener(`keydown`,r),()=>{e?.removeEventListener(`keydown`,r),n?.forEach(e=>{e.removeAttribute(`inert`),e.removeAttribute(`aria-hidden`)})}},[u,mn,Qt,en,rn]),(0,n.useEffect)(()=>{let e=Ke.current;e&&(u?e.removeAttribute(`inert`):e.setAttribute(`inert`,``))},[u]);let qn=i.accentColor??i.themeTokens?.accent??f?.accentColor,Jn=i.themeTokens?.accentText??Qe(qn,i.themeTokens?.background??(Be===`dark`?`#0f1c27`:`#ffffff`)),Yn={zIndex:i.zIndex,"--cf-h-pad":`${i.horizontalPadding}px`,"--cf-v-pad":`${i.verticalPadding}px`,...Jn?{"--cf-accent-ink":Jn}:{},...i.themeTokens?.accentStrong?{"--cf-accent-2":i.themeTokens.accentStrong}:{},...i.themeTokens?.background?{"--cf-bg":i.themeTokens.background}:{},...i.themeTokens?.surface?{"--cf-surface":i.themeTokens.surface}:{},...i.themeTokens?.surfaceMuted?{"--cf-surface-2":i.themeTokens.surfaceMuted}:{},...i.themeTokens?.text?{"--cf-text":i.themeTokens.text}:{},...i.themeTokens?.mutedText?{"--cf-muted":i.themeTokens.mutedText}:{},...i.themeTokens?.border?{"--cf-border":i.themeTokens.border}:{},...i.themeTokens?.shadow?{"--cf-shadow":i.themeTokens.shadow}:{},...i.themeTokens?.radius?{"--cf-radius":i.themeTokens.radius}:{},...i.themeTokens?.fontFamily?{"--cf-font":i.themeTokens.fontFamily}:{},...i.themeTokens?.success?{"--cf-success":i.themeTokens.success}:{},...i.themeTokens?.warning?{"--cf-warning":i.themeTokens.warning}:{},...i.themeTokens?.danger?{"--cf-danger":i.themeTokens.danger}:{},...qn?{"--cf-accent":qn,"--cf-accent-2":i.themeTokens?.accentStrong??`color-mix(in oklab, ${qn} 76%, #14141f)`}:{}},Xn=e=>A(e),Zn=[...p].reverse().find(e=>e.role===`user`&&e.content.trim())?.content??``,Qn=p.some(e=>e.role===`user`),$n=f?.talkbackMode===`avatar`||f?.widgetModule===`assistant`||!!f?.allowVoiceInput,er=!Z&&$n&&!Qn?dn.filter((e,t)=>!(t===0&&e.role===`assistant`)):dn,tr=b===`human`&&x?x:f?.agentName??l.chatName,nr=b===`human`?l.liveSupport:b===`queued`?l.waitingForTeam:f?.offline?l.statusOffline:l.statusOnline,rr=!B&&!Z?f?.availableActions:void 0,ir=!B&&!Z?f?.actions:void 0,ar=K&&W===`connecting`&&!Z;return(0,r.jsx)(e.o,{value:l,children:(0,r.jsxs)(`div`,{class:`cf-root`,"data-theme":Be,"data-align":i.alignment,"data-display":`floating`,style:Yn,children:[Ee&&u&&(0,r.jsx)(`div`,{class:`cf-theater-backdrop`,onClick:An}),(0,r.jsxs)(`div`,{ref:Ke,class:`cf-panel ${u?`is-open`:``} ${K?`cf-panel--call`:``} ${ar?`cf-panel--voice-connecting`:``} ${Ee&&u?`cf-panel--theater`:``} ${fn?`cf-panel--analytics-focus`:``}`,role:`dialog`,"aria-modal":`false`,"aria-label":`${l.chatName}: ${f?.agentName??l.assistantName}`,"aria-hidden":!u,children:[(0,r.jsxs)(`div`,{class:`cf-header`,children:[(0,r.jsx)(ce,{persona:f,hideWhenMissing:!0}),(0,r.jsxs)(`div`,{class:`cf-header__meta`,children:[(0,r.jsx)(`div`,{class:`cf-header__name`,children:tr}),(0,r.jsx)(`div`,{class:`cf-header__status ${b===`ai`&&f?.offline?`cf-header__status--offline`:``}`,children:(0,r.jsx)(`span`,{class:`cf-header__status-text`,children:nr})})]}),(0,r.jsxs)(`div`,{class:`cf-header__actions`,children:[fe.length>0&&(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":l.pastConversations,title:l.pastConversations,"aria-pressed":rn,onClick:()=>an(e=>!e),children:(0,r.jsx)(E,{})}),Qn&&!B&&!Z&&(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":l.endChat,title:l.endChat,onClick:gn,children:(0,r.jsx)(T,{})}),i.sound&&Ue&&(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":Re?l.unmuteSounds:l.muteSounds,"aria-pressed":Re,onClick:We,children:Re?(0,r.jsx)(y,{}):(0,r.jsx)(v,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn cf-header__close`,"aria-label":l.closeChat,onClick:mn,children:(0,r.jsx)(c,{})})]})]}),(0,r.jsx)(`div`,{class:`cf-panel__video`,children:fn?(0,r.jsx)(`div`,{class:`cf-analytics-focus`,role:`region`,"aria-label":l.expandedAnalyticsResult,children:(0,r.jsx)(je,{visualization:fn,expanded:!0,onClose:kn})}):!Z&&$n?(0,r.jsx)(de,{persona:f,starters:[],onPick:A,onFocusComposer:Fn,speaking:h,voiceState:W,replyPending:K&&m&&!h,pinned:!0,muted:xe,onToggleMute:In,onEndCall:Q,onTalkNow:Vn,showTalkNow:Un,micLevel:Ce,theaterMode:Ee,onToggleTheater:Dn,onMinimize:mn,audioDevices:Pe,selectedAudioDeviceId:Ie,onSelectAudioDevice:Bn,connectingOnly:ar}):null}),!ar&&(0,r.jsxs)(`div`,{class:`cf-panel__chat`,children:[i.preview&&(0,r.jsx)(`div`,{class:`cf-preview-banner`,children:l.previewBanner}),Z&&(0,r.jsx)(`div`,{class:`cf-viewing-banner`,children:l.viewingPast}),(0,r.jsxs)(`div`,{class:`cf-body`,ref:Ze,role:`log`,onScroll:bn,children:[er.map((e,t)=>(0,r.jsx)(Ae,{msg:e,persona:f,isLast:!Z&&t===er.length-1,visitor:g,hasEmail:_,lastQuestion:Zn,showActions:!Z&&t===er.length-1&&!!e.handoffOffered,onPickReply:Xn,onSubmitForm:ie,onDemoSlots:se,onRetry:P,ratable:!Z&&er.slice(0,t).some(e=>e.role===`user`),onRate:te,onExpandVisualization:Z?void 0:On},e.id)),!Qn&&!Z&&(0,r.jsxs)(r.Fragment,{children:[er.length===0&&(0,r.jsx)(Je,{name:f?.agentName??l.assistantName,greeting:f?.greeting}),(0,r.jsx)(De,{items:w,onPick:A}),(0,r.jsx)(Oe,{items:k})]}),Yt&&(0,r.jsxs)(`button`,{type:`button`,class:`cf-newmsg`,onClick:xn,children:[(0,r.jsx)(M,{}),l.newMessages]})]}),(0,r.jsx)(`div`,{class:`cf-sr-live`,"aria-live":`polite`,"aria-atomic":`true`,children:Wn}),m&&!B&&!Z&&(0,r.jsx)(`div`,{class:`cf-stopbar`,children:(0,r.jsxs)(`button`,{type:`button`,class:`cf-stop`,onClick:N,children:[(0,r.jsx)(C,{}),l.stop]})}),Z?(0,r.jsx)(`div`,{class:`cf-ended`,children:(0,r.jsx)(`button`,{type:`button`,class:`cf-ended__btn`,onClick:ge,children:l.backToChat})}):B?(0,r.jsxs)(`div`,{class:`cf-ended`,children:[(0,r.jsx)(`p`,{class:`cf-ended__text`,children:l.conversationEnded}),i.csat&&Qn?ln?(0,r.jsx)(`p`,{class:`cf-ended__text`,children:l.feedbackThanks}):(0,r.jsxs)(`div`,{class:`cf-csat`,children:[(0,r.jsx)(`span`,{class:`cf-csat__q`,children:l.csatPrompt}),(0,r.jsx)(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":l.feedbackHelpful,onClick:()=>{re(`up`),un(!0)},children:(0,r.jsx)(D,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":l.feedbackNotHelpful,onClick:()=>{re(`down`),un(!0)},children:(0,r.jsx)(O,{})})]}):null,(0,r.jsx)(`button`,{type:`button`,class:`cf-ended__btn`,onClick:vn,children:l.startNewChat})]}):(0,r.jsxs)(r.Fragment,{children:[S?(0,r.jsx)(`div`,{class:`cf-live-typing`,"aria-live":`polite`,children:e.s(l.agentTyping,{name:S})}):null,rr&&rr.length>0&&(0,r.jsx)(`div`,{class:`cf-footer-actions`,children:(0,r.jsx)(we,{actions:rr,descriptors:ir,visitor:g,onSubmitForm:ie,onDemoSlots:se,scheduler:f?.scheduler,translations:i.actionTranslations})},`footer-actions`),(0,r.jsx)(qe,{draftStore:sn,onSend:A,onSendGif:j,onTyping:ee,disabled:m,allowVoice:!!f?.allowVoiceInput,onTranscribe:ae,gifEnabled:z,onSearchGifs:R,allowAttach:i.attachments,onExtract:oe},`composer`)]}),!B&&f?.disclaimerText&&(0,r.jsx)(`div`,{class:`cf-disclaimer`,children:f.disclaimerText}),(0,r.jsxs)(`div`,{class:`cf-footer`,children:[(0,r.jsx)(`button`,{type:`button`,class:`cf-footer__privacy`,"aria-label":l.clearDeviceData,onClick:()=>tn(!0),children:l.privacyAndData}),(0,r.jsx)(`span`,{"aria-hidden":`true`,children:`·`}),l.poweredBy,` `,(0,r.jsx)(`a`,{href:`https://accurix.tech/centrinfo`,target:`_blank`,rel:`noopener noreferrer`,children:`Centrinfo`})]})]}),Qt&&(0,r.jsx)(`div`,{class:`cf-confirm`,onClick:()=>$t(!1),children:(0,r.jsxs)(`div`,{class:`cf-confirm__card`,role:`alertdialog`,"aria-modal":`true`,"aria-label":l.endChatConfirm,onClick:e=>e.stopPropagation(),onKeyDownCapture:e=>Ye(e,e.currentTarget,()=>$t(!1)),children:[(0,r.jsx)(`div`,{class:`cf-confirm__title`,children:l.endChatConfirm}),(0,r.jsx)(`div`,{class:`cf-confirm__body`,children:l.endChatConfirmBody}),(0,r.jsxs)(`div`,{class:`cf-confirm__actions`,children:[(0,r.jsx)(`button`,{ref:nn,type:`button`,class:`cf-confirm__btn cf-confirm__btn--cancel`,onClick:()=>$t(!1),children:l.cancel}),(0,r.jsx)(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--danger`,onClick:_n,children:l.endConfirmCta})]})]})},`confirm-end`),rn&&(0,r.jsx)(`div`,{class:`cf-confirm`,onClick:()=>an(!1),children:(0,r.jsxs)(`div`,{class:`cf-history`,role:`dialog`,"aria-modal":`true`,"aria-label":l.pastConversations,onClick:e=>e.stopPropagation(),onKeyDownCapture:e=>Ye(e,e.currentTarget,()=>an(!1)),children:[(0,r.jsxs)(`div`,{class:`cf-history__head`,children:[(0,r.jsx)(`span`,{children:l.pastConversations}),(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":l.closeHistory,onClick:()=>an(!1),children:(0,r.jsx)(c,{})})]}),(0,r.jsx)(`div`,{class:`cf-history__list`,children:fe.map(e=>(0,r.jsxs)(`button`,{type:`button`,class:`cf-history__item ${e.sessionId===pe?`is-active`:``}`,onClick:()=>{he(e.sessionId),an(!1)},children:[(0,r.jsx)(`span`,{class:`cf-history__title`,children:e.title}),(0,r.jsxs)(`span`,{class:`cf-history__meta`,children:[new Date(e.ts).toLocaleDateString(void 0,{month:`short`,day:`numeric`}),e.ended?` · ${l.historyEnded}`:``]})]},e.sessionId))}),(0,r.jsx)(`div`,{class:`cf-history__footer`,children:(0,r.jsx)(`button`,{type:`button`,class:`cf-history__clear`,onClick:()=>{an(!1),tn(!0)},children:l.clearDeviceData})})]})},`history`),en&&(0,r.jsx)(`div`,{class:`cf-confirm`,onClick:()=>tn(!1),children:(0,r.jsxs)(`div`,{class:`cf-confirm__card`,role:`alertdialog`,"aria-modal":`true`,"aria-label":l.clearDeviceData,onClick:e=>e.stopPropagation(),onKeyDownCapture:e=>Ye(e,e.currentTarget,()=>tn(!1)),children:[(0,r.jsx)(`div`,{class:`cf-confirm__title`,children:l.clearDeviceData}),(0,r.jsx)(`div`,{class:`cf-confirm__body`,children:l.clearDeviceDataBody}),(0,r.jsxs)(`div`,{class:`cf-confirm__actions`,children:[(0,r.jsx)(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--cancel`,onClick:()=>tn(!1),children:l.cancel}),(0,r.jsx)(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--danger`,onClick:()=>{tn(!1),_e()},children:l.clearDeviceDataCta})]})]})},`confirm-clear`)]}),K&&!u?(0,r.jsx)(Ge,{persona:f,voiceState:W,muted:xe,onToggleMute:In,onEndCall:Q,micLevel:Ce,onExpand:pn}):Ee&&u?null:!i.hideDefaultLauncher&&(0,r.jsxs)(`button`,{ref:Xe,type:`button`,class:`cf-launcher`,"aria-label":u?l.closeChat:U>0?`${l.openChat}. ${U===1?l.unreadMessage:e.s(l.unreadMessages,{count:String(U)})}`:l.openChat,"aria-expanded":u,onClick:hn,children:[i.launcherIcon?(0,r.jsx)(`img`,{class:`cf-launcher__img`,src:i.launcherIcon,alt:``}):(0,r.jsx)(s,{}),!u&&U>0&&(0,r.jsx)(`span`,{class:`cf-launcher__badge`,"aria-hidden":`true`,children:U>99?`99+`:U})]})]})})},wt=`
|
|
2
|
-
:host {
|
|
3
|
-
all: initial;
|
|
4
|
-
}
|
|
5
|
-
.cf-root {
|
|
6
|
-
--cf-accent: #2f7f55;
|
|
7
|
-
--cf-accent-2: #2f7de8;
|
|
8
|
-
--cf-accent-ink: #ffffff;
|
|
9
|
-
--cf-bg: #ffffff;
|
|
10
|
-
--cf-surface: #f4f6f8;
|
|
11
|
-
--cf-surface-2: #eef1f4;
|
|
12
|
-
--cf-text: #0f1e2a;
|
|
13
|
-
--cf-muted: #5b7186;
|
|
14
|
-
--cf-border: #e4e9ee;
|
|
15
|
-
--cf-danger: #b42318;
|
|
16
|
-
--cf-shadow: 0 12px 48px -12px rgba(15, 30, 42, 0.4), 0 4px 12px -4px rgba(15, 30, 42, 0.2);
|
|
17
|
-
--cf-radius: 18px;
|
|
18
|
-
--cf-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
|
19
|
-
|
|
20
|
-
position: fixed;
|
|
21
|
-
bottom: 0;
|
|
22
|
-
right: 0;
|
|
23
|
-
font-family: var(--cf-font);
|
|
24
|
-
font-size: 14px;
|
|
25
|
-
line-height: 1.45;
|
|
26
|
-
color: var(--cf-text);
|
|
27
|
-
-webkit-font-smoothing: antialiased;
|
|
28
|
-
}
|
|
29
|
-
.cf-root[data-theme='dark'] {
|
|
30
|
-
--cf-accent-ink: #ffffff;
|
|
31
|
-
--cf-bg: #0f1c27;
|
|
32
|
-
--cf-surface: #1a2a37;
|
|
33
|
-
--cf-surface-2: #213442;
|
|
34
|
-
--cf-text: #eef3f7;
|
|
35
|
-
--cf-muted: #93a7b6;
|
|
36
|
-
--cf-border: #2a3d4c;
|
|
37
|
-
--cf-shadow: 0 12px 48px -12px rgba(0, 0, 0, 0.6), 0 4px 12px -4px rgba(0, 0, 0, 0.4);
|
|
38
|
-
}
|
|
39
|
-
.cf-root *,
|
|
40
|
-
.cf-root *::before,
|
|
41
|
-
.cf-root *::after {
|
|
42
|
-
box-sizing: border-box;
|
|
43
|
-
}
|
|
44
|
-
/* :where() keeps this reset at ZERO added specificity, so component button
|
|
45
|
-
styles (.cf-launcher, .cf-send, .cf-chip, .cf-action) win over it. Without
|
|
46
|
-
it, ".cf-root button" (class+element) out-specifies ".cf-launcher" (class)
|
|
47
|
-
and silently wipes every button background — the launcher rendered white. */
|
|
48
|
-
.cf-root :where(button) {
|
|
49
|
-
font-family: inherit;
|
|
50
|
-
cursor: pointer;
|
|
51
|
-
border: none;
|
|
52
|
-
background: none;
|
|
53
|
-
padding: 0;
|
|
54
|
-
color: inherit;
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
/* ---------- Launcher ---------- */
|
|
58
|
-
.cf-launcher {
|
|
59
|
-
position: fixed;
|
|
60
|
-
bottom: var(--cf-v-pad, 20px);
|
|
61
|
-
right: var(--cf-h-pad, 20px);
|
|
62
|
-
z-index: 1;
|
|
63
|
-
/* The host element is pointer-events: none so it can't swallow
|
|
64
|
-
clicks on host-page UI behind it (see mount.tsx). Re-enable here
|
|
65
|
-
on the only two visible surfaces (launcher + panel) so they DO
|
|
66
|
-
receive clicks where they're actually drawn. */
|
|
67
|
-
pointer-events: auto;
|
|
68
|
-
width: 60px;
|
|
69
|
-
height: 60px;
|
|
70
|
-
border-radius: 50%;
|
|
71
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 140%);
|
|
72
|
-
color: var(--cf-accent-ink);
|
|
73
|
-
display: grid;
|
|
74
|
-
place-items: center;
|
|
75
|
-
box-shadow: 0 8px 24px -6px rgba(15, 30, 42, 0.45);
|
|
76
|
-
transition: transform 0.22s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.2s ease;
|
|
77
|
-
animation: cf-pop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
|
|
78
|
-
}
|
|
79
|
-
.cf-launcher:hover {
|
|
80
|
-
transform: scale(1.06);
|
|
81
|
-
box-shadow: 0 12px 28px -6px rgba(15, 30, 42, 0.5);
|
|
82
|
-
}
|
|
83
|
-
.cf-launcher:active {
|
|
84
|
-
transform: scale(0.95);
|
|
85
|
-
}
|
|
86
|
-
.cf-launcher:focus-visible {
|
|
87
|
-
outline: 3px solid var(--cf-accent-2);
|
|
88
|
-
outline-offset: 3px;
|
|
89
|
-
}
|
|
90
|
-
.cf-launcher svg {
|
|
91
|
-
width: 30px;
|
|
92
|
-
height: 30px;
|
|
93
|
-
transition: transform 0.25s ease, opacity 0.2s ease;
|
|
94
|
-
}
|
|
95
|
-
/* Custom org logo in the launcher (config.launcherIcon). */
|
|
96
|
-
.cf-launcher__img {
|
|
97
|
-
width: 34px;
|
|
98
|
-
height: 34px;
|
|
99
|
-
border-radius: 50%;
|
|
100
|
-
object-fit: cover;
|
|
101
|
-
}
|
|
102
|
-
.cf-launcher__badge {
|
|
103
|
-
position: absolute;
|
|
104
|
-
top: -2px;
|
|
105
|
-
right: -2px;
|
|
106
|
-
min-width: 20px;
|
|
107
|
-
height: 20px;
|
|
108
|
-
padding: 0 5px;
|
|
109
|
-
border-radius: 10px;
|
|
110
|
-
background: #f25767;
|
|
111
|
-
color: #fff;
|
|
112
|
-
font-size: 11px;
|
|
113
|
-
font-weight: 700;
|
|
114
|
-
display: grid;
|
|
115
|
-
place-items: center;
|
|
116
|
-
box-shadow: 0 0 0 2px var(--cf-bg);
|
|
117
|
-
animation: cf-badge-pop 0.3s ease both;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
/* ---------- Panel ---------- */
|
|
121
|
-
.cf-panel {
|
|
122
|
-
position: fixed;
|
|
123
|
-
/* Pair to .cf-launcher's pointer-events: auto — the host element
|
|
124
|
-
itself is pointer-events: none, so each visible surface re-enables. */
|
|
125
|
-
pointer-events: auto;
|
|
126
|
-
bottom: var(--cf-v-pad, 20px);
|
|
127
|
-
right: var(--cf-h-pad, 20px);
|
|
128
|
-
/* Above the launcher so the open chat covers it (no second button showing). */
|
|
129
|
-
z-index: 2;
|
|
130
|
-
width: 384px;
|
|
131
|
-
max-width: calc(100vw - 32px);
|
|
132
|
-
height: min(88vh, 820px);
|
|
133
|
-
min-height: 560px;
|
|
134
|
-
max-height: calc(100vh - 40px);
|
|
135
|
-
background: var(--cf-bg);
|
|
136
|
-
border-radius: var(--cf-radius);
|
|
137
|
-
box-shadow: var(--cf-shadow);
|
|
138
|
-
/* Grid (not flex) so theater mode below can reflow header/video/chat into a
|
|
139
|
-
two-column split purely in CSS, without reordering the DOM. */
|
|
140
|
-
display: grid;
|
|
141
|
-
grid-template-columns: 1fr;
|
|
142
|
-
grid-template-rows: auto auto minmax(0, 1fr);
|
|
143
|
-
grid-template-areas: 'header' 'video' 'chat';
|
|
144
|
-
overflow: hidden;
|
|
145
|
-
transform-origin: bottom right;
|
|
146
|
-
opacity: 0;
|
|
147
|
-
transform: scale(0.94);
|
|
148
|
-
pointer-events: none;
|
|
149
|
-
transition: opacity 0.22s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
|
|
150
|
-
height 0.28s ease, width 0.28s ease;
|
|
151
|
-
}
|
|
152
|
-
.cf-panel.is-open {
|
|
153
|
-
opacity: 1;
|
|
154
|
-
transform: scale(1);
|
|
155
|
-
pointer-events: auto;
|
|
156
|
-
}
|
|
157
|
-
|
|
158
|
-
.cf-panel > .cf-header { grid-area: header; }
|
|
159
|
-
/* Stacked ABOVE .cf-panel__chat (which sits right below it in the docked
|
|
160
|
-
layout) so the call bar's popover — which opens downward and overlaps
|
|
161
|
-
that space — paints over the transcript instead of getting interleaved
|
|
162
|
-
with message bubbles underneath it. */
|
|
163
|
-
.cf-panel__video {
|
|
164
|
-
grid-area: video;
|
|
165
|
-
position: relative;
|
|
166
|
-
z-index: 5;
|
|
167
|
-
min-width: 0;
|
|
168
|
-
}
|
|
169
|
-
.cf-panel__chat {
|
|
170
|
-
grid-area: chat;
|
|
171
|
-
display: flex;
|
|
172
|
-
flex-direction: column;
|
|
173
|
-
min-height: 0;
|
|
174
|
-
min-width: 0;
|
|
175
|
-
}
|
|
176
|
-
/* A live voice call gets more room for the transcript underneath the avatar card. */
|
|
177
|
-
.cf-panel.cf-panel--call {
|
|
178
|
-
height: min(90vh, 840px);
|
|
179
|
-
}
|
|
180
|
-
.cf-panel.cf-panel--voice-connecting {
|
|
181
|
-
height: min(72vh, 560px);
|
|
182
|
-
min-height: 420px;
|
|
183
|
-
grid-template-rows: auto minmax(0, 1fr);
|
|
184
|
-
grid-template-areas: 'header' 'video';
|
|
185
|
-
}
|
|
186
|
-
.cf-panel--voice-connecting .cf-panel__video {
|
|
187
|
-
display: grid;
|
|
188
|
-
min-height: 0;
|
|
189
|
-
}
|
|
190
|
-
/* Expanded "theater" view — video and chat side by side in a large centered
|
|
191
|
-
modal instead of the corner bubble. Only reachable from an active call's
|
|
192
|
-
expand button, so it never applies below the existing mobile breakpoint. */
|
|
193
|
-
@media (min-width: 640px) {
|
|
194
|
-
.cf-panel.cf-panel--theater {
|
|
195
|
-
inset: 0;
|
|
196
|
-
margin: auto;
|
|
197
|
-
width: min(1040px, calc(100vw - 48px));
|
|
198
|
-
height: min(760px, calc(100vh - 48px));
|
|
199
|
-
max-width: none;
|
|
200
|
-
max-height: none;
|
|
201
|
-
grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
|
|
202
|
-
grid-template-rows: auto minmax(0, 1fr);
|
|
203
|
-
grid-template-areas: 'header header' 'video chat';
|
|
204
|
-
}
|
|
205
|
-
.cf-panel.cf-panel--theater.is-open {
|
|
206
|
-
transform: none;
|
|
207
|
-
}
|
|
208
|
-
.cf-panel--theater .cf-panel__video { height: 100%; }
|
|
209
|
-
.cf-panel--theater .cf-assistant-card--pinned {
|
|
210
|
-
height: 100%;
|
|
211
|
-
margin: 0;
|
|
212
|
-
padding: 0;
|
|
213
|
-
border: 0;
|
|
214
|
-
border-right: 1px solid var(--cf-border);
|
|
215
|
-
}
|
|
216
|
-
.cf-panel--theater .cf-assistant-card--pinned .cf-assistant-card__stage {
|
|
217
|
-
height: 100%;
|
|
218
|
-
border-radius: 0;
|
|
219
|
-
}
|
|
220
|
-
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__face {
|
|
221
|
-
width: min(220px, 38vw);
|
|
222
|
-
height: min(220px, 38vw);
|
|
223
|
-
}
|
|
224
|
-
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__initials {
|
|
225
|
-
font-size: clamp(42px, 7vw, 76px);
|
|
226
|
-
transform: translateY(-14px);
|
|
227
|
-
}
|
|
228
|
-
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__eye {
|
|
229
|
-
top: 43%;
|
|
230
|
-
width: 11px;
|
|
231
|
-
height: 11px;
|
|
232
|
-
}
|
|
233
|
-
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__eye--left { left: 34%; }
|
|
234
|
-
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__eye--right { right: 34%; }
|
|
235
|
-
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__mouth {
|
|
236
|
-
bottom: 27%;
|
|
237
|
-
width: 52px;
|
|
238
|
-
height: 8px;
|
|
239
|
-
}
|
|
240
|
-
.cf-panel--theater .cf-avatar-wave {
|
|
241
|
-
bottom: 92px;
|
|
242
|
-
}
|
|
243
|
-
/* The call bar sits near the BOTTOM of the full-height theater video pane
|
|
244
|
-
(vs. near the top of the short docked card), so its popover flips to
|
|
245
|
-
open upward here — there's room above it, none below. */
|
|
246
|
-
.cf-panel--theater .cf-call-menu {
|
|
247
|
-
top: auto;
|
|
248
|
-
bottom: calc(100% + 8px);
|
|
249
|
-
}
|
|
250
|
-
}
|
|
251
|
-
.cf-theater-backdrop {
|
|
252
|
-
position: fixed;
|
|
253
|
-
inset: 0;
|
|
254
|
-
z-index: 1;
|
|
255
|
-
background: rgba(10, 14, 20, 0.55);
|
|
256
|
-
pointer-events: auto;
|
|
257
|
-
}
|
|
258
|
-
|
|
259
|
-
/* Left-aligned messenger (alignment: 'left') — dock to the left edge. */
|
|
260
|
-
.cf-root[data-align='left'] .cf-launcher { right: auto; left: var(--cf-h-pad, 20px); }
|
|
261
|
-
.cf-root[data-align='left'] .cf-panel { right: auto; left: var(--cf-h-pad, 20px); transform-origin: bottom left; }
|
|
262
|
-
|
|
263
|
-
/* ---------- Header ---------- */
|
|
264
|
-
.cf-header {
|
|
265
|
-
position: relative;
|
|
266
|
-
padding: 16px 14px 18px 18px;
|
|
267
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 150%);
|
|
268
|
-
color: var(--cf-accent-ink);
|
|
269
|
-
display: flex;
|
|
270
|
-
align-items: center;
|
|
271
|
-
gap: 10px;
|
|
272
|
-
flex-shrink: 0;
|
|
273
|
-
}
|
|
274
|
-
.cf-header__avatar {
|
|
275
|
-
width: 42px;
|
|
276
|
-
height: 42px;
|
|
277
|
-
border-radius: 50%;
|
|
278
|
-
background: rgba(255, 255, 255, 0.18);
|
|
279
|
-
display: grid;
|
|
280
|
-
place-items: center;
|
|
281
|
-
font-weight: 700;
|
|
282
|
-
font-size: 17px;
|
|
283
|
-
overflow: hidden;
|
|
284
|
-
flex-shrink: 0;
|
|
285
|
-
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25);
|
|
286
|
-
}
|
|
287
|
-
.cf-header__avatar img {
|
|
288
|
-
width: 100%;
|
|
289
|
-
height: 100%;
|
|
290
|
-
object-fit: cover;
|
|
291
|
-
}
|
|
292
|
-
.cf-header__avatar[class*='cf-avatar-preset--'],
|
|
293
|
-
.cf-msg__avatar[class*='cf-avatar-preset--'] {
|
|
294
|
-
background: linear-gradient(135deg, var(--cf-avatar-a, var(--cf-accent)), var(--cf-avatar-b, var(--cf-accent-2)));
|
|
295
|
-
}
|
|
296
|
-
.cf-header__meta {
|
|
297
|
-
min-width: 0;
|
|
298
|
-
flex: 1 1 auto;
|
|
299
|
-
}
|
|
300
|
-
.cf-header__name {
|
|
301
|
-
font-weight: 700;
|
|
302
|
-
font-size: 16px;
|
|
303
|
-
letter-spacing: -0.2px;
|
|
304
|
-
white-space: nowrap;
|
|
305
|
-
overflow: hidden;
|
|
306
|
-
text-overflow: ellipsis;
|
|
307
|
-
}
|
|
308
|
-
.cf-header__status {
|
|
309
|
-
display: flex;
|
|
310
|
-
align-items: center;
|
|
311
|
-
gap: 6px;
|
|
312
|
-
font-size: 12.5px;
|
|
313
|
-
opacity: 0.9;
|
|
314
|
-
margin-top: 1px;
|
|
315
|
-
min-width: 0;
|
|
316
|
-
}
|
|
317
|
-
.cf-header__status::before {
|
|
318
|
-
content: '';
|
|
319
|
-
width: 7px;
|
|
320
|
-
height: 7px;
|
|
321
|
-
border-radius: 50%;
|
|
322
|
-
background: #7ee2a8;
|
|
323
|
-
box-shadow: 0 0 0 2px rgba(126, 226, 168, 0.3);
|
|
324
|
-
flex-shrink: 0;
|
|
325
|
-
}
|
|
326
|
-
/* Keep the status on one line — the icons no longer squeeze it to wrap. */
|
|
327
|
-
.cf-header__status-text {
|
|
328
|
-
white-space: nowrap;
|
|
329
|
-
overflow: hidden;
|
|
330
|
-
text-overflow: ellipsis;
|
|
331
|
-
}
|
|
332
|
-
/* Action icons cluster tightly together, separated from the meta by the
|
|
333
|
-
header gap, and never shrink (so the meta yields space first). */
|
|
334
|
-
.cf-header__actions {
|
|
335
|
-
display: flex;
|
|
336
|
-
align-items: center;
|
|
337
|
-
gap: 2px;
|
|
338
|
-
flex-shrink: 0;
|
|
339
|
-
}
|
|
340
|
-
.cf-header__btn {
|
|
341
|
-
width: 30px;
|
|
342
|
-
height: 30px;
|
|
343
|
-
border-radius: 8px;
|
|
344
|
-
display: grid;
|
|
345
|
-
place-items: center;
|
|
346
|
-
color: var(--cf-accent-ink);
|
|
347
|
-
opacity: 0.85;
|
|
348
|
-
transition: background 0.15s ease, opacity 0.15s ease;
|
|
349
|
-
flex-shrink: 0;
|
|
350
|
-
}
|
|
351
|
-
.cf-header__btn:hover {
|
|
352
|
-
background: rgba(255, 255, 255, 0.16);
|
|
353
|
-
opacity: 1;
|
|
354
|
-
}
|
|
355
|
-
.cf-header__btn svg {
|
|
356
|
-
width: 17px;
|
|
357
|
-
height: 17px;
|
|
358
|
-
}
|
|
359
|
-
.cf-header__btn:focus-visible {
|
|
360
|
-
outline: 2px solid #fff;
|
|
361
|
-
outline-offset: 1px;
|
|
362
|
-
}
|
|
363
|
-
|
|
364
|
-
/* Preview-mode banner (data-preview) — sample replies, no AI. */
|
|
365
|
-
.cf-preview-banner {
|
|
366
|
-
flex-shrink: 0;
|
|
367
|
-
padding: 5px 12px;
|
|
368
|
-
text-align: center;
|
|
369
|
-
font-size: 11.5px;
|
|
370
|
-
font-weight: 600;
|
|
371
|
-
letter-spacing: 0.2px;
|
|
372
|
-
color: #7a5b00;
|
|
373
|
-
background: #fff3cd;
|
|
374
|
-
border-bottom: 1px solid #ffe69c;
|
|
375
|
-
}
|
|
376
|
-
.cf-root[data-theme='dark'] .cf-preview-banner {
|
|
377
|
-
color: #ffe08a;
|
|
378
|
-
background: #3a3320;
|
|
379
|
-
border-bottom-color: #4d4427;
|
|
380
|
-
}
|
|
381
|
-
|
|
382
|
-
/* ---------- Body / messages ---------- */
|
|
383
|
-
.cf-body {
|
|
384
|
-
flex: 1 1 0;
|
|
385
|
-
min-height: 0;
|
|
386
|
-
overflow-y: auto;
|
|
387
|
-
/* Never scroll/shift horizontally — a long source pill or code line is
|
|
388
|
-
clipped, not allowed to push the whole thread sideways. */
|
|
389
|
-
overflow-x: hidden;
|
|
390
|
-
padding: 12px 14px 8px;
|
|
391
|
-
display: flex;
|
|
392
|
-
flex-direction: column;
|
|
393
|
-
gap: 12px;
|
|
394
|
-
scroll-behavior: smooth;
|
|
395
|
-
background: var(--cf-bg);
|
|
396
|
-
}
|
|
397
|
-
.cf-body::-webkit-scrollbar {
|
|
398
|
-
width: 8px;
|
|
399
|
-
}
|
|
400
|
-
.cf-body::-webkit-scrollbar-thumb {
|
|
401
|
-
background: var(--cf-border);
|
|
402
|
-
border-radius: 4px;
|
|
403
|
-
}
|
|
404
|
-
.cf-empty-welcome {
|
|
405
|
-
display: flex;
|
|
406
|
-
flex-direction: column;
|
|
407
|
-
gap: 5px;
|
|
408
|
-
margin: 4px 0 2px;
|
|
409
|
-
padding: 14px 14px 13px;
|
|
410
|
-
border-radius: 18px;
|
|
411
|
-
background:
|
|
412
|
-
radial-gradient(circle at 14% 0%, color-mix(in oklab, var(--cf-accent) 20%, transparent), transparent 34%),
|
|
413
|
-
linear-gradient(135deg, color-mix(in oklab, var(--cf-surface) 88%, var(--cf-bg)), var(--cf-bg));
|
|
414
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 78%, var(--cf-accent));
|
|
415
|
-
}
|
|
416
|
-
.cf-empty-welcome__eyebrow {
|
|
417
|
-
color: var(--cf-accent);
|
|
418
|
-
font-size: 10px;
|
|
419
|
-
font-weight: 800;
|
|
420
|
-
letter-spacing: 0.11em;
|
|
421
|
-
text-transform: uppercase;
|
|
422
|
-
}
|
|
423
|
-
.cf-empty-welcome h2 {
|
|
424
|
-
margin: 0;
|
|
425
|
-
color: var(--cf-text);
|
|
426
|
-
font-size: 17px;
|
|
427
|
-
line-height: 1.15;
|
|
428
|
-
letter-spacing: -0.02em;
|
|
429
|
-
}
|
|
430
|
-
.cf-empty-welcome p {
|
|
431
|
-
margin: 0;
|
|
432
|
-
color: var(--cf-muted);
|
|
433
|
-
font-size: 12.8px;
|
|
434
|
-
line-height: 1.45;
|
|
435
|
-
}
|
|
436
|
-
.cf-msg {
|
|
437
|
-
display: flex;
|
|
438
|
-
gap: 8px;
|
|
439
|
-
max-width: 100%;
|
|
440
|
-
animation: cf-msg-in 0.32s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
441
|
-
}
|
|
442
|
-
.cf-msg--user {
|
|
443
|
-
justify-content: flex-end;
|
|
444
|
-
}
|
|
445
|
-
.cf-msg--system {
|
|
446
|
-
justify-content: center;
|
|
447
|
-
margin: 4px 0;
|
|
448
|
-
}
|
|
449
|
-
.cf-msg__avatar {
|
|
450
|
-
width: 26px;
|
|
451
|
-
height: 26px;
|
|
452
|
-
border-radius: 50%;
|
|
453
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55), var(--cf-accent-2, #2f7de8));
|
|
454
|
-
color: #fff;
|
|
455
|
-
display: grid;
|
|
456
|
-
place-items: center;
|
|
457
|
-
font-size: 11px;
|
|
458
|
-
font-weight: 700;
|
|
459
|
-
flex-shrink: 0;
|
|
460
|
-
overflow: hidden;
|
|
461
|
-
align-self: flex-end;
|
|
462
|
-
}
|
|
463
|
-
.cf-msg__avatar img { width: 100%; height: 100%; object-fit: cover; }
|
|
464
|
-
.cf-msg__bubble {
|
|
465
|
-
padding: 10px 13px;
|
|
466
|
-
border-radius: 16px;
|
|
467
|
-
max-width: 100%;
|
|
468
|
-
/* break-word (not anywhere) only breaks words too long to fit — so short
|
|
469
|
-
words like "Hello" never split mid-word. */
|
|
470
|
-
overflow-wrap: break-word;
|
|
471
|
-
white-space: pre-wrap;
|
|
472
|
-
font-size: 13.5px;
|
|
473
|
-
}
|
|
474
|
-
.cf-msg--agent .cf-msg__bubble {
|
|
475
|
-
background: var(--cf-surface);
|
|
476
|
-
border-bottom-left-radius: 5px;
|
|
477
|
-
color: var(--cf-text);
|
|
478
|
-
}
|
|
479
|
-
.cf-msg--user .cf-msg__bubble {
|
|
480
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 160%);
|
|
481
|
-
color: var(--cf-accent-ink);
|
|
482
|
-
border-bottom-right-radius: 5px;
|
|
483
|
-
}
|
|
484
|
-
.cf-msg__bubble a {
|
|
485
|
-
color: inherit;
|
|
486
|
-
text-decoration: underline;
|
|
487
|
-
}
|
|
488
|
-
.cf-msg__bubble strong { font-weight: 700; }
|
|
489
|
-
.cf-msg__bubble p { margin: 0 0 8px; }
|
|
490
|
-
.cf-msg__bubble p:last-child { margin-bottom: 0; }
|
|
491
|
-
.cf-msg__col { min-width: 0; max-width: 85%; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
|
|
492
|
-
.cf-msg--user .cf-msg__col { align-items: flex-end; }
|
|
493
|
-
.cf-artifact {
|
|
494
|
-
width: min(100%, 560px);
|
|
495
|
-
overflow: hidden;
|
|
496
|
-
margin: 0;
|
|
497
|
-
border: 1px solid var(--cf-border);
|
|
498
|
-
border-radius: 12px;
|
|
499
|
-
background: var(--cf-surface);
|
|
500
|
-
}
|
|
501
|
-
.cf-artifact figcaption { padding: 10px 12px 0; color: var(--cf-text); font-size: 12px; font-weight: 750; }
|
|
502
|
-
.cf-artifact img { display: block; width: 100%; height: auto; margin-top: 9px; }
|
|
503
|
-
.cf-artifact p { margin: 0 !important; padding: 8px 12px 10px; color: var(--cf-muted); font-size: 10px; }
|
|
504
|
-
.cf-artifact-link {
|
|
505
|
-
display: grid;
|
|
506
|
-
width: min(100%, 560px);
|
|
507
|
-
gap: 3px;
|
|
508
|
-
border: 1px solid var(--cf-border);
|
|
509
|
-
border-radius: 10px;
|
|
510
|
-
background: var(--cf-surface);
|
|
511
|
-
padding: 10px 12px;
|
|
512
|
-
color: var(--cf-text);
|
|
513
|
-
text-decoration: none;
|
|
514
|
-
}
|
|
515
|
-
.cf-artifact-link:hover { border-color: var(--cf-accent); }
|
|
516
|
-
.cf-artifact-link span { color: var(--cf-muted); font-size: 10px; }
|
|
517
|
-
.cf-system-event {
|
|
518
|
-
width: min(280px, 88%);
|
|
519
|
-
display: flex;
|
|
520
|
-
flex-direction: column;
|
|
521
|
-
align-items: center;
|
|
522
|
-
gap: 4px;
|
|
523
|
-
text-align: center;
|
|
524
|
-
color: var(--cf-muted);
|
|
525
|
-
}
|
|
526
|
-
.cf-system-event__mark {
|
|
527
|
-
width: 7px;
|
|
528
|
-
height: 7px;
|
|
529
|
-
border-radius: 999px;
|
|
530
|
-
background: color-mix(in srgb, var(--cf-accent, #2f7f55) 72%, transparent);
|
|
531
|
-
box-shadow: 0 0 0 4px color-mix(in srgb, var(--cf-accent, #2f7f55) 12%, transparent);
|
|
532
|
-
}
|
|
533
|
-
.cf-system-event__text {
|
|
534
|
-
max-width: 100%;
|
|
535
|
-
padding: 7px 11px;
|
|
536
|
-
border: 1px solid var(--cf-border);
|
|
537
|
-
border-radius: 999px;
|
|
538
|
-
background: color-mix(in srgb, var(--cf-surface, #ffffff) 86%, transparent);
|
|
539
|
-
font-size: 12.5px;
|
|
540
|
-
font-weight: 600;
|
|
541
|
-
line-height: 1.35;
|
|
542
|
-
color: var(--cf-muted);
|
|
543
|
-
overflow-wrap: break-word;
|
|
544
|
-
}
|
|
545
|
-
.cf-system-event__time {
|
|
546
|
-
font-size: 11px;
|
|
547
|
-
line-height: 1.2;
|
|
548
|
-
color: var(--cf-muted);
|
|
549
|
-
}
|
|
550
|
-
|
|
551
|
-
/* ---------- Markdown in answers ---------- */
|
|
552
|
-
.cf-msg__bubble .cf-md-h {
|
|
553
|
-
margin: 12px 0 5px;
|
|
554
|
-
color: var(--cf-text);
|
|
555
|
-
font-size: 14.5px;
|
|
556
|
-
font-weight: 750;
|
|
557
|
-
line-height: 1.3;
|
|
558
|
-
}
|
|
559
|
-
.cf-msg__bubble .cf-md-h:first-child { margin-top: 0; }
|
|
560
|
-
.cf-msg__bubble .cf-md-h--1,
|
|
561
|
-
.cf-msg__bubble .cf-md-h--2 { font-size: 15.5px; }
|
|
562
|
-
.cf-msg__bubble p.cf-md-list-intro {
|
|
563
|
-
margin: 11px 0 5px;
|
|
564
|
-
color: var(--cf-text);
|
|
565
|
-
font-weight: 750;
|
|
566
|
-
line-height: 1.35;
|
|
567
|
-
}
|
|
568
|
-
.cf-msg__bubble ul.cf-md-list,
|
|
569
|
-
.cf-msg__bubble ol.cf-md-list {
|
|
570
|
-
display: grid;
|
|
571
|
-
gap: 9px;
|
|
572
|
-
margin: 8px 0 11px;
|
|
573
|
-
padding: 0;
|
|
574
|
-
list-style: none;
|
|
575
|
-
}
|
|
576
|
-
.cf-msg__bubble .cf-md-list li {
|
|
577
|
-
position: relative;
|
|
578
|
-
min-width: 0;
|
|
579
|
-
padding-left: 18px;
|
|
580
|
-
line-height: 1.52;
|
|
581
|
-
}
|
|
582
|
-
.cf-msg__bubble ul.cf-md-list > li::before {
|
|
583
|
-
position: absolute;
|
|
584
|
-
top: .58em;
|
|
585
|
-
left: 2px;
|
|
586
|
-
width: 6px;
|
|
587
|
-
height: 6px;
|
|
588
|
-
border-radius: 50%;
|
|
589
|
-
background: var(--cf-accent);
|
|
590
|
-
content: "";
|
|
591
|
-
}
|
|
592
|
-
.cf-msg__bubble ol.cf-md-list { counter-reset: cf-answer-item; }
|
|
593
|
-
.cf-msg__bubble ol.cf-md-list > li { padding-left: 25px; counter-increment: cf-answer-item; }
|
|
594
|
-
.cf-msg__bubble ol.cf-md-list > li::before {
|
|
595
|
-
position: absolute;
|
|
596
|
-
top: .08em;
|
|
597
|
-
left: 0;
|
|
598
|
-
display: grid;
|
|
599
|
-
width: 19px;
|
|
600
|
-
height: 19px;
|
|
601
|
-
place-items: center;
|
|
602
|
-
border-radius: 50%;
|
|
603
|
-
color: var(--cf-accent);
|
|
604
|
-
background: var(--cf-accent-soft);
|
|
605
|
-
content: counter(cf-answer-item);
|
|
606
|
-
font-size: 10px;
|
|
607
|
-
font-weight: 750;
|
|
608
|
-
}
|
|
609
|
-
.cf-msg__bubble .cf-md-list li > strong:first-child {
|
|
610
|
-
display: inline;
|
|
611
|
-
color: var(--cf-text);
|
|
612
|
-
font-weight: 750;
|
|
613
|
-
}
|
|
614
|
-
.cf-md-code {
|
|
615
|
-
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
616
|
-
font-size: 0.86em;
|
|
617
|
-
background: var(--cf-surface-2);
|
|
618
|
-
padding: 1px 5px;
|
|
619
|
-
border-radius: 5px;
|
|
620
|
-
}
|
|
621
|
-
.cf-msg--user .cf-md-code { background: rgba(255, 255, 255, 0.22); }
|
|
622
|
-
.cf-md-pre {
|
|
623
|
-
margin: 6px 0;
|
|
624
|
-
padding: 10px 12px;
|
|
625
|
-
background: var(--cf-surface-2);
|
|
626
|
-
border: 1px solid var(--cf-border);
|
|
627
|
-
border-radius: 10px;
|
|
628
|
-
overflow-x: auto;
|
|
629
|
-
}
|
|
630
|
-
.cf-md-pre code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; white-space: pre; color: var(--cf-text); }
|
|
631
|
-
.cf-msg--user .cf-md-pre { background: rgba(0, 0, 0, 0.18); border-color: rgba(255, 255, 255, 0.18); }
|
|
632
|
-
.cf-msg--user .cf-md-pre code { color: var(--cf-accent-ink); }
|
|
633
|
-
|
|
634
|
-
/* streaming caret */
|
|
635
|
-
.cf-caret {
|
|
636
|
-
display: inline-block;
|
|
637
|
-
width: 7px;
|
|
638
|
-
height: 1em;
|
|
639
|
-
margin-left: 2px;
|
|
640
|
-
vertical-align: text-bottom;
|
|
641
|
-
background: var(--cf-accent);
|
|
642
|
-
border-radius: 1px;
|
|
643
|
-
animation: cf-blink 1s step-end infinite;
|
|
644
|
-
}
|
|
645
|
-
@keyframes cf-blink {
|
|
646
|
-
0%, 100% { opacity: 1; }
|
|
647
|
-
50% { opacity: 0; }
|
|
648
|
-
}
|
|
649
|
-
|
|
650
|
-
/* message tools (copy / retry) */
|
|
651
|
-
.cf-msg__actions { display: flex; align-items: flex-start; gap: 2px; }
|
|
652
|
-
.cf-msg__tools { display: flex; gap: 6px; }
|
|
653
|
-
.cf-tool {
|
|
654
|
-
display: inline-flex;
|
|
655
|
-
align-items: center;
|
|
656
|
-
gap: 5px;
|
|
657
|
-
font-size: 12px;
|
|
658
|
-
color: var(--cf-muted);
|
|
659
|
-
padding: 3px 7px;
|
|
660
|
-
border-radius: 7px;
|
|
661
|
-
opacity: 0.6;
|
|
662
|
-
transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
|
|
663
|
-
}
|
|
664
|
-
.cf-msg:hover .cf-tool { opacity: 1; }
|
|
665
|
-
.cf-tool:hover { background: var(--cf-surface); color: var(--cf-text); }
|
|
666
|
-
.cf-tool svg { width: 13px; height: 13px; }
|
|
667
|
-
|
|
668
|
-
/* Per-message 👍/👎 feedback. */
|
|
669
|
-
.cf-feedback { margin-top: 0; }
|
|
670
|
-
.cf-feedback__row { display: flex; align-items: center; gap: 4px; }
|
|
671
|
-
.cf-feedback__btn {
|
|
672
|
-
display: inline-flex;
|
|
673
|
-
align-items: center;
|
|
674
|
-
justify-content: center;
|
|
675
|
-
width: 26px;
|
|
676
|
-
height: 26px;
|
|
677
|
-
border-radius: 7px;
|
|
678
|
-
color: var(--cf-muted);
|
|
679
|
-
opacity: 0.6;
|
|
680
|
-
cursor: pointer;
|
|
681
|
-
transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
|
|
682
|
-
}
|
|
683
|
-
.cf-msg:hover .cf-feedback__btn { opacity: 1; }
|
|
684
|
-
.cf-feedback__btn:hover { background: var(--cf-surface); color: var(--cf-text); }
|
|
685
|
-
.cf-feedback__btn.is-active { opacity: 1; color: var(--cf-accent); background: var(--cf-surface); }
|
|
686
|
-
.cf-feedback__btn svg { width: 14px; height: 14px; }
|
|
687
|
-
.cf-feedback__thanks { margin-left: 4px; font-size: 11.5px; color: var(--cf-muted); }
|
|
688
|
-
.cf-feedback__comment { display: flex; flex-direction: column; gap: 6px; margin-top: 6px; max-width: 260px; }
|
|
689
|
-
.cf-feedback__input {
|
|
690
|
-
width: 100%;
|
|
691
|
-
resize: none;
|
|
692
|
-
font: inherit;
|
|
693
|
-
font-size: 12.5px;
|
|
694
|
-
line-height: 1.4;
|
|
695
|
-
color: var(--cf-text);
|
|
696
|
-
background: var(--cf-bg);
|
|
697
|
-
border: 1px solid var(--cf-border);
|
|
698
|
-
border-radius: 9px;
|
|
699
|
-
padding: 7px 9px;
|
|
700
|
-
box-sizing: border-box;
|
|
701
|
-
}
|
|
702
|
-
.cf-feedback__input:focus { outline: none; border-color: var(--cf-accent); }
|
|
703
|
-
.cf-feedback__send {
|
|
704
|
-
align-self: flex-end;
|
|
705
|
-
font-size: 12px;
|
|
706
|
-
font-weight: 600;
|
|
707
|
-
color: var(--cf-accent-ink);
|
|
708
|
-
background: var(--cf-accent);
|
|
709
|
-
border: none;
|
|
710
|
-
border-radius: 999px;
|
|
711
|
-
padding: 5px 14px;
|
|
712
|
-
cursor: pointer;
|
|
713
|
-
transition: opacity 0.15s ease;
|
|
714
|
-
}
|
|
715
|
-
.cf-feedback__send:hover { opacity: 0.9; }
|
|
716
|
-
|
|
717
|
-
/* conversation starters */
|
|
718
|
-
.cf-starters {
|
|
719
|
-
display: flex;
|
|
720
|
-
flex-direction: column;
|
|
721
|
-
align-items: flex-start;
|
|
722
|
-
min-width: 0;
|
|
723
|
-
gap: 8px;
|
|
724
|
-
margin: 2px 0 4px 34px;
|
|
725
|
-
}
|
|
726
|
-
.cf-starter {
|
|
727
|
-
max-width: 100%;
|
|
728
|
-
padding: 8px 12px;
|
|
729
|
-
border-radius: 14px;
|
|
730
|
-
border: 1px solid var(--cf-border);
|
|
731
|
-
background: var(--cf-bg);
|
|
732
|
-
color: var(--cf-text);
|
|
733
|
-
font-size: 12.8px;
|
|
734
|
-
font-weight: 500;
|
|
735
|
-
text-align: left;
|
|
736
|
-
overflow-wrap: anywhere;
|
|
737
|
-
transition: border-color 0.15s ease, transform 0.1s ease;
|
|
738
|
-
}
|
|
739
|
-
.cf-starter:hover { border-color: var(--cf-accent); }
|
|
740
|
-
.cf-starter:active { transform: scale(0.98); }
|
|
741
|
-
.cf-starter:focus-visible {
|
|
742
|
-
outline: 2px solid var(--cf-accent-2);
|
|
743
|
-
outline-offset: 2px;
|
|
744
|
-
}
|
|
745
|
-
.cf-featured-links {
|
|
746
|
-
display: flex;
|
|
747
|
-
flex-wrap: wrap;
|
|
748
|
-
align-items: flex-start;
|
|
749
|
-
min-width: 0;
|
|
750
|
-
gap: 8px;
|
|
751
|
-
margin: 2px 0 4px;
|
|
752
|
-
}
|
|
753
|
-
.cf-featured-link {
|
|
754
|
-
flex: 0 1 auto;
|
|
755
|
-
min-width: 0;
|
|
756
|
-
max-width: 100%;
|
|
757
|
-
display: inline-flex;
|
|
758
|
-
align-items: center;
|
|
759
|
-
gap: 7px;
|
|
760
|
-
min-width: 0;
|
|
761
|
-
min-height: 34px;
|
|
762
|
-
padding: 7px 11px;
|
|
763
|
-
border-radius: 999px;
|
|
764
|
-
border: 1px solid color-mix(in srgb, var(--cf-accent) 55%, var(--cf-border));
|
|
765
|
-
background: color-mix(in srgb, var(--cf-accent) 10%, var(--cf-bg));
|
|
766
|
-
color: var(--cf-text);
|
|
767
|
-
font-size: 13px;
|
|
768
|
-
font-weight: 500;
|
|
769
|
-
text-decoration: none;
|
|
770
|
-
transition: border-color 0.15s ease, background-color 0.15s ease;
|
|
771
|
-
}
|
|
772
|
-
.cf-featured-link svg {
|
|
773
|
-
width: 14px;
|
|
774
|
-
height: 14px;
|
|
775
|
-
flex: 0 0 14px;
|
|
776
|
-
}
|
|
777
|
-
.cf-featured-link svg {
|
|
778
|
-
width: 14px;
|
|
779
|
-
height: 14px;
|
|
780
|
-
flex: 0 0 14px;
|
|
781
|
-
color: var(--cf-accent);
|
|
782
|
-
}
|
|
783
|
-
.cf-featured-link span {
|
|
784
|
-
min-width: 0;
|
|
785
|
-
overflow: hidden;
|
|
786
|
-
text-overflow: ellipsis;
|
|
787
|
-
white-space: nowrap;
|
|
788
|
-
}
|
|
789
|
-
.cf-featured-link:hover {
|
|
790
|
-
border-color: var(--cf-accent);
|
|
791
|
-
background: color-mix(in srgb, var(--cf-accent) 16%, var(--cf-bg));
|
|
792
|
-
}
|
|
793
|
-
.cf-featured-link:focus-visible {
|
|
794
|
-
outline: 2px solid var(--cf-accent-2);
|
|
795
|
-
outline-offset: 2px;
|
|
796
|
-
}
|
|
797
|
-
|
|
798
|
-
/* stop generating */
|
|
799
|
-
.cf-stopbar { display: flex; justify-content: center; padding: 6px 0 2px; flex-shrink: 0; }
|
|
800
|
-
.cf-stop {
|
|
801
|
-
display: inline-flex;
|
|
802
|
-
align-items: center;
|
|
803
|
-
gap: 6px;
|
|
804
|
-
font-size: 12.5px;
|
|
805
|
-
font-weight: 600;
|
|
806
|
-
color: var(--cf-muted);
|
|
807
|
-
background: var(--cf-bg);
|
|
808
|
-
border: 1px solid var(--cf-border);
|
|
809
|
-
border-radius: 999px;
|
|
810
|
-
padding: 6px 14px;
|
|
811
|
-
box-shadow: var(--cf-shadow);
|
|
812
|
-
transition: border-color 0.15s ease, color 0.15s ease;
|
|
813
|
-
}
|
|
814
|
-
.cf-stop:hover { border-color: var(--cf-accent); color: var(--cf-text); }
|
|
815
|
-
.cf-stop svg { width: 13px; height: 13px; }
|
|
816
|
-
|
|
817
|
-
/* typing */
|
|
818
|
-
.cf-typing {
|
|
819
|
-
max-width: 100%;
|
|
820
|
-
flex-wrap: wrap;
|
|
821
|
-
display: inline-flex;
|
|
822
|
-
align-items: center;
|
|
823
|
-
gap: 4px;
|
|
824
|
-
padding: 10px 13px;
|
|
825
|
-
min-width: 98px;
|
|
826
|
-
}
|
|
827
|
-
.cf-typing__label {
|
|
828
|
-
min-width: 0;
|
|
829
|
-
overflow-wrap: anywhere;
|
|
830
|
-
margin-right: 3px;
|
|
831
|
-
color: var(--cf-muted);
|
|
832
|
-
font-size: 12px;
|
|
833
|
-
font-weight: 650;
|
|
834
|
-
}
|
|
835
|
-
.cf-typing__dot {
|
|
836
|
-
width: 5px;
|
|
837
|
-
height: 5px;
|
|
838
|
-
border-radius: 50%;
|
|
839
|
-
background: var(--cf-muted);
|
|
840
|
-
animation: cf-typing 1.1s infinite ease-in-out;
|
|
841
|
-
}
|
|
842
|
-
.cf-typing__dot:nth-child(2) { animation-delay: 0.15s; }
|
|
843
|
-
.cf-typing__dot:nth-child(3) { animation-delay: 0.3s; }
|
|
844
|
-
|
|
845
|
-
/* sources */
|
|
846
|
-
.cf-sources {
|
|
847
|
-
display: flex;
|
|
848
|
-
flex-wrap: wrap;
|
|
849
|
-
gap: 6px;
|
|
850
|
-
/* Tie the row to the message column so a long title can't widen the thread. */
|
|
851
|
-
max-width: 100%;
|
|
852
|
-
min-width: 0;
|
|
853
|
-
}
|
|
854
|
-
.cf-source {
|
|
855
|
-
display: inline-flex;
|
|
856
|
-
align-items: center;
|
|
857
|
-
gap: 5px;
|
|
858
|
-
padding: 5px 10px;
|
|
859
|
-
border-radius: 999px;
|
|
860
|
-
background: var(--cf-surface-2);
|
|
861
|
-
border: 1px solid var(--cf-border);
|
|
862
|
-
color: var(--cf-muted);
|
|
863
|
-
font-size: 12px;
|
|
864
|
-
text-decoration: none;
|
|
865
|
-
max-width: 100%;
|
|
866
|
-
min-width: 0;
|
|
867
|
-
transition: border-color 0.15s ease, color 0.15s ease;
|
|
868
|
-
}
|
|
869
|
-
.cf-source:hover { color: var(--cf-text); border-color: var(--cf-accent); }
|
|
870
|
-
.cf-source--more { color: var(--cf-muted); cursor: default; }
|
|
871
|
-
.cf-source--more:hover { border-color: var(--cf-border); color: var(--cf-muted); }
|
|
872
|
-
.cf-source svg { width: 12px; height: 12px; flex-shrink: 0; }
|
|
873
|
-
.cf-source span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
874
|
-
|
|
875
|
-
/* chips + actions */
|
|
876
|
-
.cf-chips, .cf-actions {
|
|
877
|
-
display: flex;
|
|
878
|
-
flex-wrap: wrap;
|
|
879
|
-
gap: 8px;
|
|
880
|
-
}
|
|
881
|
-
.cf-chip {
|
|
882
|
-
padding: 8px 13px;
|
|
883
|
-
border-radius: 999px;
|
|
884
|
-
background: var(--cf-bg);
|
|
885
|
-
border: 1.5px solid var(--cf-accent);
|
|
886
|
-
color: var(--cf-accent);
|
|
887
|
-
font-size: 13px;
|
|
888
|
-
font-weight: 600;
|
|
889
|
-
transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
|
|
890
|
-
}
|
|
891
|
-
.cf-root[data-theme='dark'] .cf-chip { color: var(--cf-text); border-color: var(--cf-border); }
|
|
892
|
-
.cf-chip:hover { background: var(--cf-accent); color: var(--cf-accent-ink); }
|
|
893
|
-
.cf-chip:active { transform: scale(0.97); }
|
|
894
|
-
.cf-chip:focus-visible { outline: 2px solid var(--cf-accent-2); outline-offset: 2px; }
|
|
895
|
-
.cf-action {
|
|
896
|
-
display: inline-flex;
|
|
897
|
-
align-items: center;
|
|
898
|
-
gap: 7px;
|
|
899
|
-
padding: 9px 14px;
|
|
900
|
-
border-radius: 12px;
|
|
901
|
-
background: var(--cf-surface);
|
|
902
|
-
border: 1px solid var(--cf-border);
|
|
903
|
-
color: var(--cf-text);
|
|
904
|
-
font-size: 12.8px;
|
|
905
|
-
font-weight: 600;
|
|
906
|
-
transition: border-color 0.15s ease, transform 0.1s ease;
|
|
907
|
-
}
|
|
908
|
-
.cf-action:hover { border-color: var(--cf-accent); }
|
|
909
|
-
.cf-action:active { transform: scale(0.98); }
|
|
910
|
-
.cf-action svg { width: 15px; height: 15px; color: var(--cf-accent); }
|
|
911
|
-
|
|
912
|
-
/* ---------- Inline forms + handoff card ---------- */
|
|
913
|
-
.cf-action-shell {
|
|
914
|
-
display: flex;
|
|
915
|
-
flex-direction: column;
|
|
916
|
-
gap: 8px;
|
|
917
|
-
}
|
|
918
|
-
|
|
919
|
-
.cf-form {
|
|
920
|
-
display: flex;
|
|
921
|
-
flex-direction: column;
|
|
922
|
-
gap: 8px;
|
|
923
|
-
width: 100%;
|
|
924
|
-
max-width: 300px;
|
|
925
|
-
padding: 12px;
|
|
926
|
-
border-radius: 14px;
|
|
927
|
-
border: 1px solid var(--cf-border);
|
|
928
|
-
background: var(--cf-surface);
|
|
929
|
-
animation: cf-msg-in 0.2s ease both;
|
|
930
|
-
}
|
|
931
|
-
.cf-form__title { font-size: 13.5px; font-weight: 700; color: var(--cf-fg, var(--cf-text)); }
|
|
932
|
-
.cf-form__as { font-size: 12.5px; color: var(--cf-muted); margin-top: -2px; }
|
|
933
|
-
.cf-form__input {
|
|
934
|
-
width: 100%;
|
|
935
|
-
padding: 9px 11px;
|
|
936
|
-
border: 1.5px solid var(--cf-border);
|
|
937
|
-
border-radius: 10px;
|
|
938
|
-
background: var(--cf-bg);
|
|
939
|
-
color: var(--cf-text);
|
|
940
|
-
font-family: inherit;
|
|
941
|
-
font-size: 14px;
|
|
942
|
-
outline: none;
|
|
943
|
-
resize: none;
|
|
944
|
-
}
|
|
945
|
-
.cf-form__input:focus { border-color: var(--cf-accent); }
|
|
946
|
-
.cf-form__input::placeholder { color: var(--cf-muted); }
|
|
947
|
-
.cf-form__actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 2px; }
|
|
948
|
-
.cf-form__submit {
|
|
949
|
-
padding: 8px 14px;
|
|
950
|
-
border-radius: 10px;
|
|
951
|
-
font-size: 13.5px;
|
|
952
|
-
font-weight: 600;
|
|
953
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 160%);
|
|
954
|
-
color: var(--cf-accent-ink);
|
|
955
|
-
transition: opacity 0.15s ease, transform 0.1s ease;
|
|
956
|
-
}
|
|
957
|
-
.cf-form__submit:disabled { opacity: 0.45; cursor: default; }
|
|
958
|
-
.cf-form__submit:not(:disabled):active { transform: scale(0.97); }
|
|
959
|
-
.cf-form__cancel { padding: 8px 12px; border-radius: 10px; font-size: 13.5px; font-weight: 600; color: var(--cf-muted); }
|
|
960
|
-
.cf-form__cancel:hover { color: var(--cf-text); }
|
|
961
|
-
.cf-form__err { font-size: 12.5px; color: #f25767; }
|
|
962
|
-
.cf-form--done {
|
|
963
|
-
flex-direction: row;
|
|
964
|
-
align-items: center;
|
|
965
|
-
gap: 8px;
|
|
966
|
-
font-size: 13.5px;
|
|
967
|
-
color: var(--cf-text);
|
|
968
|
-
}
|
|
969
|
-
.cf-form--done svg { width: 18px; height: 18px; color: var(--cf-accent); flex-shrink: 0; }
|
|
970
|
-
.cf-form--done { flex-wrap: wrap; }
|
|
971
|
-
.cf-booking__link {
|
|
972
|
-
display: inline-flex;
|
|
973
|
-
align-items: center;
|
|
974
|
-
gap: 4px;
|
|
975
|
-
font-size: 13px;
|
|
976
|
-
font-weight: 600;
|
|
977
|
-
color: var(--cf-accent);
|
|
978
|
-
text-decoration: none;
|
|
979
|
-
flex-basis: 100%;
|
|
980
|
-
}
|
|
981
|
-
.cf-booking__link svg { width: 13px; height: 13px; }
|
|
982
|
-
.cf-booking__link:hover { text-decoration: underline; }
|
|
983
|
-
|
|
984
|
-
.cf-handoff {
|
|
985
|
-
display: flex;
|
|
986
|
-
flex-direction: column;
|
|
987
|
-
gap: 8px;
|
|
988
|
-
width: 100%;
|
|
989
|
-
max-width: 300px;
|
|
990
|
-
padding: 12px;
|
|
991
|
-
border-radius: 14px;
|
|
992
|
-
border: 1.5px solid var(--cf-accent);
|
|
993
|
-
background: color-mix(in oklab, var(--cf-accent) 8%, var(--cf-bg));
|
|
994
|
-
animation: cf-msg-in 0.2s ease both;
|
|
995
|
-
}
|
|
996
|
-
.cf-handoff__title { font-size: 13.5px; font-weight: 700; color: var(--cf-text); }
|
|
997
|
-
|
|
998
|
-
/* ---------- Demo booking picker ---------- */
|
|
999
|
-
.cf-booking { max-width: 320px; }
|
|
1000
|
-
.cf-booking__hint { font-size: 12.5px; color: var(--cf-muted); margin-top: -2px; }
|
|
1001
|
-
.cf-booking__dur { font-weight: 600; color: var(--cf-text); }
|
|
1002
|
-
.cf-booking__state {
|
|
1003
|
-
padding: 12px;
|
|
1004
|
-
border: 1px dashed var(--cf-border);
|
|
1005
|
-
border-radius: 10px;
|
|
1006
|
-
background: var(--cf-bg-soft);
|
|
1007
|
-
color: var(--cf-muted);
|
|
1008
|
-
font-size: 12px;
|
|
1009
|
-
line-height: 1.45;
|
|
1010
|
-
text-align: center;
|
|
1011
|
-
}
|
|
1012
|
-
.cf-booking__dates {
|
|
1013
|
-
display: flex;
|
|
1014
|
-
gap: 6px;
|
|
1015
|
-
overflow-x: auto;
|
|
1016
|
-
padding-bottom: 4px;
|
|
1017
|
-
scrollbar-width: thin;
|
|
1018
|
-
}
|
|
1019
|
-
.cf-booking__dates::-webkit-scrollbar { height: 5px; }
|
|
1020
|
-
.cf-booking__dates::-webkit-scrollbar-thumb { background: var(--cf-border); border-radius: 3px; }
|
|
1021
|
-
.cf-booking__date {
|
|
1022
|
-
flex-shrink: 0;
|
|
1023
|
-
display: flex;
|
|
1024
|
-
flex-direction: column;
|
|
1025
|
-
align-items: center;
|
|
1026
|
-
gap: 1px;
|
|
1027
|
-
width: 46px;
|
|
1028
|
-
padding: 7px 0;
|
|
1029
|
-
border-radius: 10px;
|
|
1030
|
-
border: 1px solid var(--cf-border);
|
|
1031
|
-
background: var(--cf-bg);
|
|
1032
|
-
color: var(--cf-text);
|
|
1033
|
-
transition: border-color 0.15s ease, background 0.15s ease, transform 0.1s ease;
|
|
1034
|
-
}
|
|
1035
|
-
.cf-booking__date:hover { border-color: var(--cf-accent); }
|
|
1036
|
-
.cf-booking__date:active { transform: scale(0.96); }
|
|
1037
|
-
.cf-booking__date.is-selected {
|
|
1038
|
-
border-color: var(--cf-accent);
|
|
1039
|
-
background: color-mix(in oklab, var(--cf-accent) 14%, var(--cf-bg));
|
|
1040
|
-
color: var(--cf-accent);
|
|
1041
|
-
}
|
|
1042
|
-
.cf-root[data-theme='dark'] .cf-booking__date.is-selected { color: var(--cf-text); }
|
|
1043
|
-
.cf-booking__dow { font-size: 10px; text-transform: uppercase; letter-spacing: 0.4px; color: var(--cf-muted); }
|
|
1044
|
-
.cf-booking__date.is-selected .cf-booking__dow { color: inherit; }
|
|
1045
|
-
.cf-booking__dom { font-size: 15px; font-weight: 700; line-height: 1.1; }
|
|
1046
|
-
.cf-booking__slots {
|
|
1047
|
-
display: grid;
|
|
1048
|
-
grid-template-columns: repeat(3, 1fr);
|
|
1049
|
-
gap: 6px;
|
|
1050
|
-
max-height: 156px;
|
|
1051
|
-
overflow-y: auto;
|
|
1052
|
-
padding: 2px;
|
|
1053
|
-
}
|
|
1054
|
-
.cf-booking__slots::-webkit-scrollbar { width: 6px; }
|
|
1055
|
-
.cf-booking__slots::-webkit-scrollbar-thumb { background: var(--cf-border); border-radius: 3px; }
|
|
1056
|
-
.cf-booking__slot {
|
|
1057
|
-
padding: 8px 0;
|
|
1058
|
-
border-radius: 9px;
|
|
1059
|
-
border: 1px solid var(--cf-border);
|
|
1060
|
-
background: var(--cf-bg);
|
|
1061
|
-
color: var(--cf-accent);
|
|
1062
|
-
font-size: 13px;
|
|
1063
|
-
font-weight: 600;
|
|
1064
|
-
transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, transform 0.1s ease;
|
|
1065
|
-
}
|
|
1066
|
-
.cf-root[data-theme='dark'] .cf-booking__slot { color: var(--cf-text); }
|
|
1067
|
-
.cf-booking__slot:hover { border-color: var(--cf-accent); }
|
|
1068
|
-
.cf-booking__slot:active { transform: scale(0.96); }
|
|
1069
|
-
.cf-booking__slot.is-selected {
|
|
1070
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 160%);
|
|
1071
|
-
color: var(--cf-accent-ink);
|
|
1072
|
-
border-color: var(--cf-accent);
|
|
1073
|
-
}
|
|
1074
|
-
.cf-booking__slot.is-taken,
|
|
1075
|
-
.cf-booking__slot:disabled {
|
|
1076
|
-
color: var(--cf-muted);
|
|
1077
|
-
background: var(--cf-surface);
|
|
1078
|
-
border-color: var(--cf-border);
|
|
1079
|
-
text-decoration: line-through;
|
|
1080
|
-
cursor: not-allowed;
|
|
1081
|
-
opacity: 0.55;
|
|
1082
|
-
}
|
|
1083
|
-
.cf-booking__slot.is-taken:hover { border-color: var(--cf-border); }
|
|
1084
|
-
.cf-handoff--done {
|
|
1085
|
-
flex-direction: row;
|
|
1086
|
-
align-items: center;
|
|
1087
|
-
border-color: var(--cf-border);
|
|
1088
|
-
background: var(--cf-surface);
|
|
1089
|
-
font-size: 13.5px;
|
|
1090
|
-
}
|
|
1091
|
-
.cf-handoff--done svg { width: 18px; height: 18px; color: var(--cf-accent); flex-shrink: 0; }
|
|
1092
|
-
|
|
1093
|
-
/* note (action confirmation) */
|
|
1094
|
-
.cf-note {
|
|
1095
|
-
align-self: center;
|
|
1096
|
-
font-size: 12.5px;
|
|
1097
|
-
color: var(--cf-muted);
|
|
1098
|
-
background: var(--cf-surface);
|
|
1099
|
-
padding: 7px 12px;
|
|
1100
|
-
border-radius: 999px;
|
|
1101
|
-
animation: cf-msg-in 0.3s ease both;
|
|
1102
|
-
}
|
|
1103
|
-
|
|
1104
|
-
/* ---------- Composer ---------- */
|
|
1105
|
-
.cf-composer {
|
|
1106
|
-
flex-shrink: 0;
|
|
1107
|
-
padding: 10px 12px;
|
|
1108
|
-
border-top: 1px solid var(--cf-border);
|
|
1109
|
-
background: var(--cf-bg);
|
|
1110
|
-
}
|
|
1111
|
-
.cf-live-typing {
|
|
1112
|
-
flex-shrink: 0;
|
|
1113
|
-
padding: 8px 14px 0;
|
|
1114
|
-
color: var(--cf-muted);
|
|
1115
|
-
font-size: 12px;
|
|
1116
|
-
background: var(--cf-bg);
|
|
1117
|
-
}
|
|
1118
|
-
.cf-composer__field {
|
|
1119
|
-
display: flex;
|
|
1120
|
-
align-items: flex-end;
|
|
1121
|
-
gap: 6px;
|
|
1122
|
-
background: var(--cf-surface);
|
|
1123
|
-
border: 1.5px solid var(--cf-border);
|
|
1124
|
-
border-radius: 14px;
|
|
1125
|
-
padding: 6px 6px 6px 12px;
|
|
1126
|
-
transition: border-color 0.15s ease;
|
|
1127
|
-
}
|
|
1128
|
-
.cf-composer__field:focus-within { border-color: var(--cf-accent); }
|
|
1129
|
-
.cf-voice-state {
|
|
1130
|
-
display: inline-flex;
|
|
1131
|
-
align-items: center;
|
|
1132
|
-
gap: 8px;
|
|
1133
|
-
margin: 0 0 8px 2px;
|
|
1134
|
-
color: var(--cf-muted);
|
|
1135
|
-
font-size: 12.5px;
|
|
1136
|
-
}
|
|
1137
|
-
.cf-voice-state__dot {
|
|
1138
|
-
width: 8px;
|
|
1139
|
-
height: 8px;
|
|
1140
|
-
border-radius: 999px;
|
|
1141
|
-
background: var(--cf-accent);
|
|
1142
|
-
}
|
|
1143
|
-
.cf-voice-state__dot.is-live {
|
|
1144
|
-
animation: cf-pulse 1s infinite;
|
|
1145
|
-
}
|
|
1146
|
-
.cf-textarea {
|
|
1147
|
-
flex: 1;
|
|
1148
|
-
border: none;
|
|
1149
|
-
background: none;
|
|
1150
|
-
resize: none;
|
|
1151
|
-
outline: none;
|
|
1152
|
-
font-family: inherit;
|
|
1153
|
-
font-size: 14.5px;
|
|
1154
|
-
color: var(--cf-text);
|
|
1155
|
-
max-height: 110px;
|
|
1156
|
-
line-height: 1.45;
|
|
1157
|
-
padding: 6px 0;
|
|
1158
|
-
}
|
|
1159
|
-
.cf-textarea::placeholder { color: var(--cf-muted); }
|
|
1160
|
-
.cf-iconbtn {
|
|
1161
|
-
width: 36px;
|
|
1162
|
-
height: 36px;
|
|
1163
|
-
border-radius: 10px;
|
|
1164
|
-
display: grid;
|
|
1165
|
-
place-items: center;
|
|
1166
|
-
flex-shrink: 0;
|
|
1167
|
-
color: var(--cf-muted);
|
|
1168
|
-
transition: background 0.15s ease, color 0.15s ease;
|
|
1169
|
-
}
|
|
1170
|
-
.cf-iconbtn:hover { background: var(--cf-surface-2); color: var(--cf-text); }
|
|
1171
|
-
.cf-iconbtn:focus-visible { outline: 2px solid var(--cf-accent-2); outline-offset: 1px; }
|
|
1172
|
-
.cf-iconbtn svg { width: 19px; height: 19px; }
|
|
1173
|
-
.cf-send {
|
|
1174
|
-
width: 36px;
|
|
1175
|
-
height: 36px;
|
|
1176
|
-
border-radius: 10px;
|
|
1177
|
-
display: grid;
|
|
1178
|
-
place-items: center;
|
|
1179
|
-
flex-shrink: 0;
|
|
1180
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 160%);
|
|
1181
|
-
color: var(--cf-accent-ink);
|
|
1182
|
-
transition: opacity 0.15s ease, transform 0.1s ease;
|
|
1183
|
-
}
|
|
1184
|
-
.cf-send:disabled { opacity: 0.4; cursor: default; }
|
|
1185
|
-
.cf-send:not(:disabled):hover { transform: scale(1.05); }
|
|
1186
|
-
.cf-send:not(:disabled):active { transform: scale(0.94); }
|
|
1187
|
-
.cf-send svg { width: 18px; height: 18px; }
|
|
1188
|
-
.cf-mic.is-recording { color: #f25767; animation: cf-pulse 1s infinite; }
|
|
1189
|
-
|
|
1190
|
-
.cf-iconbtn.is-active { background: var(--cf-surface-2); color: var(--cf-accent); }
|
|
1191
|
-
.cf-gif-label { font-size: 11px; font-weight: 800; letter-spacing: 0.5px; }
|
|
1192
|
-
|
|
1193
|
-
/* ---------- Emoji + GIF pickers ---------- */
|
|
1194
|
-
.cf-composer { position: relative; }
|
|
1195
|
-
.cf-picker {
|
|
1196
|
-
position: absolute;
|
|
1197
|
-
left: 8px;
|
|
1198
|
-
right: 8px;
|
|
1199
|
-
bottom: calc(100% - 4px);
|
|
1200
|
-
background: var(--cf-bg);
|
|
1201
|
-
border: 1px solid var(--cf-border);
|
|
1202
|
-
border-radius: 14px;
|
|
1203
|
-
box-shadow: var(--cf-shadow);
|
|
1204
|
-
overflow: hidden;
|
|
1205
|
-
animation: cf-msg-in 0.18s ease both;
|
|
1206
|
-
z-index: 2;
|
|
1207
|
-
}
|
|
1208
|
-
.cf-emoji { max-height: 260px; overflow-y: auto; padding: 8px 10px 10px; }
|
|
1209
|
-
.cf-emoji__label {
|
|
1210
|
-
font-size: 11px;
|
|
1211
|
-
font-weight: 700;
|
|
1212
|
-
text-transform: uppercase;
|
|
1213
|
-
letter-spacing: 0.5px;
|
|
1214
|
-
color: var(--cf-muted);
|
|
1215
|
-
margin: 8px 2px 4px;
|
|
1216
|
-
}
|
|
1217
|
-
.cf-emoji__grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px; }
|
|
1218
|
-
.cf-emoji__btn {
|
|
1219
|
-
font-size: 21px;
|
|
1220
|
-
line-height: 1;
|
|
1221
|
-
height: 34px;
|
|
1222
|
-
border-radius: 8px;
|
|
1223
|
-
transition: background 0.12s ease, transform 0.08s ease;
|
|
1224
|
-
}
|
|
1225
|
-
.cf-emoji__btn:hover { background: var(--cf-surface); }
|
|
1226
|
-
.cf-emoji__btn:active { transform: scale(0.9); }
|
|
1227
|
-
|
|
1228
|
-
.cf-gif { display: flex; flex-direction: column; max-height: 320px; }
|
|
1229
|
-
.cf-gif__search {
|
|
1230
|
-
margin: 10px 10px 8px;
|
|
1231
|
-
padding: 9px 12px;
|
|
1232
|
-
border: 1.5px solid var(--cf-border);
|
|
1233
|
-
border-radius: 10px;
|
|
1234
|
-
background: var(--cf-surface);
|
|
1235
|
-
color: var(--cf-text);
|
|
1236
|
-
font-family: inherit;
|
|
1237
|
-
font-size: 14px;
|
|
1238
|
-
outline: none;
|
|
1239
|
-
}
|
|
1240
|
-
.cf-gif__search:focus { border-color: var(--cf-accent); }
|
|
1241
|
-
.cf-gif__search::placeholder { color: var(--cf-muted); }
|
|
1242
|
-
.cf-gif__grid {
|
|
1243
|
-
flex: 1;
|
|
1244
|
-
overflow-y: auto;
|
|
1245
|
-
display: grid;
|
|
1246
|
-
grid-template-columns: 1fr 1fr;
|
|
1247
|
-
gap: 6px;
|
|
1248
|
-
padding: 0 10px 8px;
|
|
1249
|
-
align-content: start;
|
|
1250
|
-
}
|
|
1251
|
-
.cf-gif__item {
|
|
1252
|
-
border-radius: 10px;
|
|
1253
|
-
overflow: hidden;
|
|
1254
|
-
background: var(--cf-surface);
|
|
1255
|
-
aspect-ratio: 1 / 1;
|
|
1256
|
-
transition: transform 0.1s ease, box-shadow 0.12s ease;
|
|
1257
|
-
}
|
|
1258
|
-
.cf-gif__item:hover { transform: scale(1.03); box-shadow: 0 0 0 2px var(--cf-accent); }
|
|
1259
|
-
.cf-gif__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
|
1260
|
-
.cf-gif__hint { grid-column: 1 / -1; text-align: center; color: var(--cf-muted); font-size: 13px; padding: 24px 0; }
|
|
1261
|
-
.cf-gif__powered { text-align: right; font-size: 10px; color: var(--cf-muted); padding: 0 12px 8px; }
|
|
1262
|
-
|
|
1263
|
-
/* Inline media (GIF) in a message bubble. */
|
|
1264
|
-
.cf-msg__bubble--media { padding: 4px; background: var(--cf-surface); overflow: hidden; }
|
|
1265
|
-
.cf-msg--user .cf-msg__bubble--media { background: var(--cf-surface-2); }
|
|
1266
|
-
.cf-msg__media { display: block; max-width: 200px; width: 100%; border-radius: 12px; }
|
|
1267
|
-
.cf-msg__caption { display: block; padding: 4px 6px 2px; font-size: 14px; }
|
|
1268
|
-
|
|
1269
|
-
.cf-footer {
|
|
1270
|
-
text-align: center;
|
|
1271
|
-
padding: 7px 0 9px;
|
|
1272
|
-
font-size: 11px;
|
|
1273
|
-
color: var(--cf-muted);
|
|
1274
|
-
}
|
|
1275
|
-
.cf-footer a { color: var(--cf-muted); text-decoration: none; font-weight: 600; }
|
|
1276
|
-
.cf-footer a:hover { color: var(--cf-accent); }
|
|
1277
|
-
|
|
1278
|
-
/* ---------- Footer lead actions ---------- */
|
|
1279
|
-
.cf-footer-actions {
|
|
1280
|
-
flex-shrink: 0;
|
|
1281
|
-
padding: 6px 14px 5px;
|
|
1282
|
-
background: var(--cf-bg);
|
|
1283
|
-
border-top: 1px solid var(--cf-border);
|
|
1284
|
-
}
|
|
1285
|
-
.cf-action-trigger {
|
|
1286
|
-
display: grid;
|
|
1287
|
-
grid-template-columns: 28px minmax(0, 1fr) 16px;
|
|
1288
|
-
align-items: center;
|
|
1289
|
-
gap: 8px;
|
|
1290
|
-
width: 100%;
|
|
1291
|
-
min-height: 40px;
|
|
1292
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 86%, var(--cf-accent));
|
|
1293
|
-
border-radius: 14px;
|
|
1294
|
-
padding: 6px 9px;
|
|
1295
|
-
background:
|
|
1296
|
-
radial-gradient(circle at 15% 0%, color-mix(in oklab, var(--cf-accent) 15%, transparent), transparent 40%),
|
|
1297
|
-
color-mix(in oklab, var(--cf-bg-soft) 78%, transparent);
|
|
1298
|
-
color: var(--cf-text);
|
|
1299
|
-
text-align: left;
|
|
1300
|
-
cursor: pointer;
|
|
1301
|
-
box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
|
|
1302
|
-
}
|
|
1303
|
-
.cf-action-trigger[hidden] {
|
|
1304
|
-
display: none;
|
|
1305
|
-
}
|
|
1306
|
-
.cf-action-trigger:hover {
|
|
1307
|
-
border-color: color-mix(in oklab, var(--cf-accent) 46%, var(--cf-border));
|
|
1308
|
-
}
|
|
1309
|
-
.cf-action-trigger > svg {
|
|
1310
|
-
width: 14px;
|
|
1311
|
-
height: 14px;
|
|
1312
|
-
color: var(--cf-muted);
|
|
1313
|
-
}
|
|
1314
|
-
.cf-action-trigger__icon {
|
|
1315
|
-
display: inline-flex;
|
|
1316
|
-
align-items: center;
|
|
1317
|
-
justify-content: center;
|
|
1318
|
-
width: 28px;
|
|
1319
|
-
height: 28px;
|
|
1320
|
-
border-radius: 10px;
|
|
1321
|
-
background: color-mix(in oklab, var(--cf-accent) 15%, transparent);
|
|
1322
|
-
color: var(--cf-accent);
|
|
1323
|
-
}
|
|
1324
|
-
.cf-action-trigger__icon svg { width: 14px; height: 14px; }
|
|
1325
|
-
.cf-action-trigger__copy {
|
|
1326
|
-
display: grid;
|
|
1327
|
-
gap: 1px;
|
|
1328
|
-
min-width: 0;
|
|
1329
|
-
}
|
|
1330
|
-
.cf-action-trigger__copy strong {
|
|
1331
|
-
font-size: 12px;
|
|
1332
|
-
line-height: 1.1;
|
|
1333
|
-
}
|
|
1334
|
-
.cf-action-trigger__copy small {
|
|
1335
|
-
overflow: hidden;
|
|
1336
|
-
color: var(--cf-muted);
|
|
1337
|
-
font-size: 10.5px;
|
|
1338
|
-
line-height: 1.2;
|
|
1339
|
-
text-overflow: ellipsis;
|
|
1340
|
-
white-space: nowrap;
|
|
1341
|
-
}
|
|
1342
|
-
.cf-action-drawer {
|
|
1343
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 86%, var(--cf-accent));
|
|
1344
|
-
border-radius: 18px 18px 12px 12px;
|
|
1345
|
-
padding: 7px;
|
|
1346
|
-
background:
|
|
1347
|
-
radial-gradient(circle at 18% 0%, color-mix(in oklab, var(--cf-accent) 16%, transparent), transparent 38%),
|
|
1348
|
-
color-mix(in oklab, var(--cf-bg) 94%, #ffffff);
|
|
1349
|
-
box-shadow: 0 -10px 34px rgba(15, 23, 42, 0.14);
|
|
1350
|
-
animation: cf-drawer-up 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
1351
|
-
}
|
|
1352
|
-
.cf-action-drawer__handle {
|
|
1353
|
-
width: 36px;
|
|
1354
|
-
height: 3px;
|
|
1355
|
-
margin: 0 auto 6px;
|
|
1356
|
-
border-radius: 999px;
|
|
1357
|
-
background: color-mix(in oklab, var(--cf-muted) 42%, transparent);
|
|
1358
|
-
}
|
|
1359
|
-
.cf-action-drawer__head {
|
|
1360
|
-
display: flex;
|
|
1361
|
-
align-items: center;
|
|
1362
|
-
justify-content: space-between;
|
|
1363
|
-
gap: 10px;
|
|
1364
|
-
padding: 0 3px 6px;
|
|
1365
|
-
color: var(--cf-text);
|
|
1366
|
-
}
|
|
1367
|
-
.cf-action-drawer__head strong {
|
|
1368
|
-
display: block;
|
|
1369
|
-
font-size: 13px;
|
|
1370
|
-
line-height: 1.2;
|
|
1371
|
-
}
|
|
1372
|
-
.cf-action-drawer__eyebrow {
|
|
1373
|
-
display: block;
|
|
1374
|
-
margin-bottom: 2px;
|
|
1375
|
-
font-size: 9px;
|
|
1376
|
-
font-weight: 800;
|
|
1377
|
-
letter-spacing: 0.16em;
|
|
1378
|
-
text-transform: uppercase;
|
|
1379
|
-
color: var(--cf-muted);
|
|
1380
|
-
}
|
|
1381
|
-
.cf-action-drawer__close {
|
|
1382
|
-
display: inline-flex;
|
|
1383
|
-
align-items: center;
|
|
1384
|
-
justify-content: center;
|
|
1385
|
-
width: 28px;
|
|
1386
|
-
height: 28px;
|
|
1387
|
-
border: 1px solid var(--cf-border);
|
|
1388
|
-
border-radius: 999px;
|
|
1389
|
-
background: var(--cf-bg-soft);
|
|
1390
|
-
color: var(--cf-muted);
|
|
1391
|
-
cursor: pointer;
|
|
1392
|
-
}
|
|
1393
|
-
.cf-action-drawer__close svg { width: 14px; height: 14px; }
|
|
1394
|
-
.cf-action-drawer__grid {
|
|
1395
|
-
display: grid;
|
|
1396
|
-
gap: 6px;
|
|
1397
|
-
}
|
|
1398
|
-
.cf-action-card {
|
|
1399
|
-
display: grid;
|
|
1400
|
-
grid-template-columns: 30px minmax(0, 1fr) 14px;
|
|
1401
|
-
align-items: center;
|
|
1402
|
-
gap: 8px;
|
|
1403
|
-
width: 100%;
|
|
1404
|
-
border: 1px solid var(--cf-border);
|
|
1405
|
-
border-radius: 14px;
|
|
1406
|
-
padding: 7px 8px;
|
|
1407
|
-
background: color-mix(in oklab, var(--cf-bg-soft) 72%, transparent);
|
|
1408
|
-
color: var(--cf-text);
|
|
1409
|
-
text-align: left;
|
|
1410
|
-
cursor: pointer;
|
|
1411
|
-
transition:
|
|
1412
|
-
transform 0.16s ease,
|
|
1413
|
-
border-color 0.16s ease,
|
|
1414
|
-
background 0.16s ease;
|
|
1415
|
-
}
|
|
1416
|
-
.cf-action-card:hover {
|
|
1417
|
-
border-color: color-mix(in oklab, var(--cf-accent) 44%, var(--cf-border));
|
|
1418
|
-
background: color-mix(in oklab, var(--cf-accent) 9%, var(--cf-bg-soft));
|
|
1419
|
-
}
|
|
1420
|
-
.cf-action-card:active { transform: translateY(1px); }
|
|
1421
|
-
.cf-action-card > svg {
|
|
1422
|
-
width: 13px;
|
|
1423
|
-
height: 13px;
|
|
1424
|
-
color: var(--cf-muted);
|
|
1425
|
-
transform: rotate(-90deg);
|
|
1426
|
-
}
|
|
1427
|
-
.cf-action-card__icon {
|
|
1428
|
-
display: inline-flex;
|
|
1429
|
-
align-items: center;
|
|
1430
|
-
justify-content: center;
|
|
1431
|
-
width: 30px;
|
|
1432
|
-
height: 30px;
|
|
1433
|
-
border-radius: 10px;
|
|
1434
|
-
background: color-mix(in oklab, var(--cf-accent) 14%, transparent);
|
|
1435
|
-
color: var(--cf-accent);
|
|
1436
|
-
}
|
|
1437
|
-
.cf-action-card__icon svg { width: 14px; height: 14px; }
|
|
1438
|
-
.cf-action-card__copy {
|
|
1439
|
-
display: grid;
|
|
1440
|
-
gap: 2px;
|
|
1441
|
-
min-width: 0;
|
|
1442
|
-
}
|
|
1443
|
-
.cf-action-card__copy strong {
|
|
1444
|
-
font-size: 12px;
|
|
1445
|
-
line-height: 1.2;
|
|
1446
|
-
}
|
|
1447
|
-
.cf-action-card__copy small {
|
|
1448
|
-
overflow: hidden;
|
|
1449
|
-
color: var(--cf-muted);
|
|
1450
|
-
font-size: 10.5px;
|
|
1451
|
-
line-height: 1.25;
|
|
1452
|
-
text-overflow: ellipsis;
|
|
1453
|
-
white-space: nowrap;
|
|
1454
|
-
}
|
|
1455
|
-
.cf-action-drawer__note {
|
|
1456
|
-
margin: 6px 3px 0;
|
|
1457
|
-
color: var(--cf-muted);
|
|
1458
|
-
font-size: 10px;
|
|
1459
|
-
line-height: 1.25;
|
|
1460
|
-
}
|
|
1461
|
-
|
|
1462
|
-
.cf-action-test-mode {
|
|
1463
|
-
display: inline-flex;
|
|
1464
|
-
width: fit-content;
|
|
1465
|
-
margin-top: 3px;
|
|
1466
|
-
padding: 2px 7px;
|
|
1467
|
-
border: 1px solid color-mix(in srgb, var(--cf-accent) 32%, transparent);
|
|
1468
|
-
border-radius: 999px;
|
|
1469
|
-
color: var(--cf-accent-strong);
|
|
1470
|
-
background: color-mix(in srgb, var(--cf-accent) 9%, white);
|
|
1471
|
-
font-size: 10px;
|
|
1472
|
-
font-weight: 700;
|
|
1473
|
-
letter-spacing: 0.04em;
|
|
1474
|
-
text-transform: uppercase;
|
|
1475
|
-
}
|
|
1476
|
-
.cf-action-drawer .cf-form,
|
|
1477
|
-
.cf-action-drawer .cf-booking {
|
|
1478
|
-
max-width: none;
|
|
1479
|
-
margin: 0;
|
|
1480
|
-
border: 0;
|
|
1481
|
-
background: transparent;
|
|
1482
|
-
box-shadow: none;
|
|
1483
|
-
}
|
|
1484
|
-
.cf-footer-actions .cf-actions {
|
|
1485
|
-
display: grid;
|
|
1486
|
-
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
1487
|
-
gap: 7px;
|
|
1488
|
-
}
|
|
1489
|
-
.cf-footer-actions .cf-action {
|
|
1490
|
-
justify-content: center;
|
|
1491
|
-
min-width: 0;
|
|
1492
|
-
gap: 5px;
|
|
1493
|
-
min-height: 32px;
|
|
1494
|
-
border-radius: 11px;
|
|
1495
|
-
padding: 6px 8px;
|
|
1496
|
-
font-size: 12px;
|
|
1497
|
-
line-height: 1.15;
|
|
1498
|
-
font-weight: 650;
|
|
1499
|
-
}
|
|
1500
|
-
.cf-footer-actions .cf-action svg {
|
|
1501
|
-
width: 13px;
|
|
1502
|
-
height: 13px;
|
|
1503
|
-
}
|
|
1504
|
-
.cf-footer-actions .cf-form,
|
|
1505
|
-
.cf-footer-actions .cf-booking {
|
|
1506
|
-
max-width: none;
|
|
1507
|
-
}
|
|
1508
|
-
|
|
1509
|
-
@keyframes cf-drawer-up {
|
|
1510
|
-
from {
|
|
1511
|
-
opacity: 0;
|
|
1512
|
-
transform: translateY(14px) scale(0.98);
|
|
1513
|
-
}
|
|
1514
|
-
to {
|
|
1515
|
-
opacity: 1;
|
|
1516
|
-
transform: translateY(0) scale(1);
|
|
1517
|
-
}
|
|
1518
|
-
}
|
|
1519
|
-
|
|
1520
|
-
/* ---------- Assistant card module ---------- */
|
|
1521
|
-
.cf-assistant-card {
|
|
1522
|
-
display: flex;
|
|
1523
|
-
flex-direction: column;
|
|
1524
|
-
gap: 12px;
|
|
1525
|
-
margin: 0 2px 4px;
|
|
1526
|
-
animation: cf-msg-in 0.32s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
1527
|
-
}
|
|
1528
|
-
.cf-assistant-card--pinned {
|
|
1529
|
-
flex-shrink: 0;
|
|
1530
|
-
gap: 0;
|
|
1531
|
-
margin: 0;
|
|
1532
|
-
padding: 8px 14px 10px;
|
|
1533
|
-
border-bottom: 1px solid var(--cf-border);
|
|
1534
|
-
background: var(--cf-bg);
|
|
1535
|
-
}
|
|
1536
|
-
.cf-assistant-card--compact {
|
|
1537
|
-
align-items: flex-start;
|
|
1538
|
-
padding-top: 10px;
|
|
1539
|
-
padding-bottom: 12px;
|
|
1540
|
-
}
|
|
1541
|
-
.cf-assistant-card__compact-speak {
|
|
1542
|
-
position: relative;
|
|
1543
|
-
isolation: isolate;
|
|
1544
|
-
display: inline-flex;
|
|
1545
|
-
align-items: center;
|
|
1546
|
-
gap: 8px;
|
|
1547
|
-
max-width: 100%;
|
|
1548
|
-
min-height: 44px;
|
|
1549
|
-
padding: 5px 15px 5px 6px;
|
|
1550
|
-
border-radius: 999px;
|
|
1551
|
-
background:
|
|
1552
|
-
linear-gradient(180deg, color-mix(in oklab, var(--cf-accent) 13%, var(--cf-surface)), color-mix(in oklab, var(--cf-bg) 92%, var(--cf-surface))),
|
|
1553
|
-
var(--cf-bg);
|
|
1554
|
-
border: 1px solid color-mix(in oklab, var(--cf-accent) 58%, var(--cf-border));
|
|
1555
|
-
color: var(--cf-text);
|
|
1556
|
-
box-shadow:
|
|
1557
|
-
inset 0 1px 0 color-mix(in oklab, #fff 13%, transparent),
|
|
1558
|
-
0 13px 30px -22px color-mix(in oklab, var(--cf-accent) 60%, #000);
|
|
1559
|
-
font-size: 12.25px;
|
|
1560
|
-
font-weight: 750;
|
|
1561
|
-
line-height: 1;
|
|
1562
|
-
transition: border-color 0.15s ease, transform 0.12s ease, background 0.15s ease, box-shadow 0.15s ease;
|
|
1563
|
-
overflow: hidden;
|
|
1564
|
-
}
|
|
1565
|
-
.cf-assistant-card__compact-speak::before {
|
|
1566
|
-
content: '';
|
|
1567
|
-
position: absolute;
|
|
1568
|
-
inset: 1px;
|
|
1569
|
-
z-index: -1;
|
|
1570
|
-
border-radius: inherit;
|
|
1571
|
-
background:
|
|
1572
|
-
radial-gradient(circle at 20% 10%, color-mix(in oklab, var(--cf-accent) 28%, transparent), transparent 42%),
|
|
1573
|
-
radial-gradient(circle at 85% 100%, color-mix(in oklab, var(--cf-accent-2) 18%, transparent), transparent 38%);
|
|
1574
|
-
opacity: 0.76;
|
|
1575
|
-
pointer-events: none;
|
|
1576
|
-
}
|
|
1577
|
-
.cf-assistant-card__compact-speak:hover {
|
|
1578
|
-
border-color: color-mix(in oklab, var(--cf-accent) 82%, var(--cf-border));
|
|
1579
|
-
box-shadow:
|
|
1580
|
-
inset 0 1px 0 color-mix(in oklab, #fff 15%, transparent),
|
|
1581
|
-
0 16px 34px -22px color-mix(in oklab, var(--cf-accent) 76%, #000);
|
|
1582
|
-
}
|
|
1583
|
-
.cf-assistant-card__compact-speak:active { transform: scale(0.98); }
|
|
1584
|
-
.cf-assistant-card__compact-speak:focus-visible {
|
|
1585
|
-
outline: 2px solid var(--cf-accent-2);
|
|
1586
|
-
outline-offset: 2px;
|
|
1587
|
-
}
|
|
1588
|
-
.cf-assistant-card__compact-mic {
|
|
1589
|
-
width: 24px;
|
|
1590
|
-
height: 24px;
|
|
1591
|
-
margin-left: -14px;
|
|
1592
|
-
border-radius: 999px;
|
|
1593
|
-
display: inline-flex;
|
|
1594
|
-
align-items: center;
|
|
1595
|
-
justify-content: center;
|
|
1596
|
-
flex-shrink: 0;
|
|
1597
|
-
color: var(--cf-accent);
|
|
1598
|
-
background: color-mix(in oklab, var(--cf-bg) 90%, transparent);
|
|
1599
|
-
border: 1px solid color-mix(in oklab, var(--cf-accent) 48%, var(--cf-border));
|
|
1600
|
-
box-shadow: 0 7px 18px -12px rgba(0, 0, 0, 0.75);
|
|
1601
|
-
}
|
|
1602
|
-
.cf-assistant-card__compact-mic svg {
|
|
1603
|
-
width: 13px;
|
|
1604
|
-
height: 13px;
|
|
1605
|
-
color: var(--cf-accent);
|
|
1606
|
-
flex-shrink: 0;
|
|
1607
|
-
}
|
|
1608
|
-
.cf-assistant-card__compact-mic:first-child {
|
|
1609
|
-
margin-left: 0;
|
|
1610
|
-
}
|
|
1611
|
-
.cf-assistant-card__compact-label {
|
|
1612
|
-
min-width: 0;
|
|
1613
|
-
overflow: hidden;
|
|
1614
|
-
text-overflow: ellipsis;
|
|
1615
|
-
white-space: nowrap;
|
|
1616
|
-
letter-spacing: 0.01em;
|
|
1617
|
-
}
|
|
1618
|
-
.cf-assistant-card__compact-avatar {
|
|
1619
|
-
width: 34px;
|
|
1620
|
-
height: 34px;
|
|
1621
|
-
border-radius: 999px;
|
|
1622
|
-
display: grid;
|
|
1623
|
-
place-items: center;
|
|
1624
|
-
flex-shrink: 0;
|
|
1625
|
-
overflow: hidden;
|
|
1626
|
-
color: #fff;
|
|
1627
|
-
background: linear-gradient(135deg, var(--cf-avatar-a, var(--cf-accent)), var(--cf-avatar-b, var(--cf-accent-2)));
|
|
1628
|
-
border: 1px solid color-mix(in oklab, #fff 24%, transparent);
|
|
1629
|
-
box-shadow:
|
|
1630
|
-
0 0 0 3px color-mix(in oklab, var(--cf-accent) 16%, transparent),
|
|
1631
|
-
inset 0 1px 0 color-mix(in oklab, #fff 18%, transparent);
|
|
1632
|
-
font-size: 11px;
|
|
1633
|
-
font-weight: 800;
|
|
1634
|
-
}
|
|
1635
|
-
.cf-assistant-card__compact-avatar img {
|
|
1636
|
-
width: 100%;
|
|
1637
|
-
height: 100%;
|
|
1638
|
-
object-fit: cover;
|
|
1639
|
-
}
|
|
1640
|
-
.cf-assistant-card--pinned .cf-assistant-card__stage {
|
|
1641
|
-
height: 132px;
|
|
1642
|
-
min-height: 0;
|
|
1643
|
-
border-radius: 13px;
|
|
1644
|
-
}
|
|
1645
|
-
/* The stage sizes/positions the card's video area; .cf-assistant-card__media
|
|
1646
|
-
inside it stays overflow: hidden for the rounded image/video corners,
|
|
1647
|
-
while interactive controls sit as a stage sibling so their popovers
|
|
1648
|
-
aren't clipped by it. */
|
|
1649
|
-
.cf-assistant-card__stage {
|
|
1650
|
-
position: relative;
|
|
1651
|
-
border-radius: 12px;
|
|
1652
|
-
aspect-ratio: 16 / 9;
|
|
1653
|
-
}
|
|
1654
|
-
.cf-assistant-card__voice-only {
|
|
1655
|
-
position: relative;
|
|
1656
|
-
display: flex;
|
|
1657
|
-
align-items: center;
|
|
1658
|
-
justify-content: center;
|
|
1659
|
-
width: 100%;
|
|
1660
|
-
min-height: 44px;
|
|
1661
|
-
align-self: stretch;
|
|
1662
|
-
}
|
|
1663
|
-
.cf-assistant-card__media {
|
|
1664
|
-
position: absolute;
|
|
1665
|
-
inset: 0;
|
|
1666
|
-
overflow: hidden;
|
|
1667
|
-
border-radius: inherit;
|
|
1668
|
-
background: var(--cf-surface);
|
|
1669
|
-
border: 1px solid var(--cf-border);
|
|
1670
|
-
}
|
|
1671
|
-
.cf-assistant-card__stage--local {
|
|
1672
|
-
isolation: isolate;
|
|
1673
|
-
overflow: hidden;
|
|
1674
|
-
background:
|
|
1675
|
-
radial-gradient(circle at 30% 18%, color-mix(in oklab, var(--cf-accent) 18%, transparent), transparent 36%),
|
|
1676
|
-
linear-gradient(145deg, color-mix(in oklab, var(--cf-surface) 72%, var(--cf-bg)), var(--cf-bg));
|
|
1677
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 82%, var(--cf-accent));
|
|
1678
|
-
box-shadow:
|
|
1679
|
-
inset 0 1px 0 color-mix(in oklab, #fff 9%, transparent),
|
|
1680
|
-
0 22px 44px -34px color-mix(in oklab, var(--cf-accent) 46%, #000);
|
|
1681
|
-
}
|
|
1682
|
-
.cf-assistant-card__stage--local.is-live {
|
|
1683
|
-
height: 188px;
|
|
1684
|
-
aspect-ratio: auto;
|
|
1685
|
-
}
|
|
1686
|
-
.cf-assistant-card--pinned .cf-assistant-card__stage--local.is-live {
|
|
1687
|
-
height: 154px;
|
|
1688
|
-
}
|
|
1689
|
-
.cf-assistant-card__stage--local.is-speaking {
|
|
1690
|
-
box-shadow:
|
|
1691
|
-
inset 0 1px 0 color-mix(in oklab, #fff 11%, transparent),
|
|
1692
|
-
0 20px 54px -28px color-mix(in oklab, var(--cf-accent) 72%, #000);
|
|
1693
|
-
}
|
|
1694
|
-
.cf-assistant-card__stage--local.is-listening {
|
|
1695
|
-
border-color: color-mix(in oklab, var(--cf-accent) 62%, var(--cf-border));
|
|
1696
|
-
}
|
|
1697
|
-
.cf-assistant-card__stage--local.is-muted {
|
|
1698
|
-
filter: saturate(0.72);
|
|
1699
|
-
}
|
|
1700
|
-
.cf-assistant-card__stage--local .cf-assistant-card__media {
|
|
1701
|
-
z-index: 1;
|
|
1702
|
-
border: 0;
|
|
1703
|
-
background:
|
|
1704
|
-
radial-gradient(circle at 50% 42%, color-mix(in oklab, var(--cf-accent) 18%, transparent), transparent 38%),
|
|
1705
|
-
color-mix(in oklab, var(--cf-bg) 92%, var(--cf-surface));
|
|
1706
|
-
}
|
|
1707
|
-
.cf-assistant-card__media--uploaded::after {
|
|
1708
|
-
content: '';
|
|
1709
|
-
position: absolute;
|
|
1710
|
-
inset: 0;
|
|
1711
|
-
pointer-events: none;
|
|
1712
|
-
background:
|
|
1713
|
-
radial-gradient(circle at 50% 50%, transparent 28%, rgba(2, 6, 23, 0.08) 62%, rgba(2, 6, 23, 0.34) 100%),
|
|
1714
|
-
linear-gradient(180deg, transparent 52%, rgba(2, 6, 23, 0.26));
|
|
1715
|
-
}
|
|
1716
|
-
.cf-assistant-card__media img,
|
|
1717
|
-
.cf-assistant-card__media video {
|
|
1718
|
-
width: 100%;
|
|
1719
|
-
height: 100%;
|
|
1720
|
-
display: block;
|
|
1721
|
-
object-fit: cover;
|
|
1722
|
-
}
|
|
1723
|
-
.cf-avatar-aura {
|
|
1724
|
-
position: absolute;
|
|
1725
|
-
left: 50%;
|
|
1726
|
-
top: 50%;
|
|
1727
|
-
width: 104px;
|
|
1728
|
-
height: 104px;
|
|
1729
|
-
border-radius: 999px;
|
|
1730
|
-
transform: translate(-50%, -50%) scale(0.88);
|
|
1731
|
-
border: 1px solid color-mix(in oklab, var(--cf-accent) 42%, transparent);
|
|
1732
|
-
opacity: 0;
|
|
1733
|
-
pointer-events: none;
|
|
1734
|
-
z-index: 3;
|
|
1735
|
-
}
|
|
1736
|
-
.cf-avatar-aura--two {
|
|
1737
|
-
width: 142px;
|
|
1738
|
-
height: 142px;
|
|
1739
|
-
}
|
|
1740
|
-
.cf-assistant-card__stage--local.is-speaking .cf-avatar-aura--one {
|
|
1741
|
-
animation: cf-avatar-breathe 1.35s ease-in-out infinite;
|
|
1742
|
-
}
|
|
1743
|
-
.cf-assistant-card__stage--local.is-speaking .cf-avatar-aura--two {
|
|
1744
|
-
animation: cf-avatar-breathe 1.35s ease-in-out infinite 0.32s;
|
|
1745
|
-
}
|
|
1746
|
-
.cf-avatar-listen-ring {
|
|
1747
|
-
position: absolute;
|
|
1748
|
-
left: 50%;
|
|
1749
|
-
top: 50%;
|
|
1750
|
-
width: calc(112px + (var(--cf-listen, 0.2) * 42px));
|
|
1751
|
-
height: calc(112px + (var(--cf-listen, 0.2) * 42px));
|
|
1752
|
-
border-radius: 999px;
|
|
1753
|
-
transform: translate(-50%, -50%);
|
|
1754
|
-
border: 2px solid color-mix(in oklab, var(--cf-accent) 58%, transparent);
|
|
1755
|
-
box-shadow: 0 0 calc(14px + (var(--cf-listen, 0.2) * 24px)) color-mix(in oklab, var(--cf-accent) 34%, transparent);
|
|
1756
|
-
opacity: 0;
|
|
1757
|
-
pointer-events: none;
|
|
1758
|
-
z-index: 4;
|
|
1759
|
-
}
|
|
1760
|
-
.cf-assistant-card__stage--local.is-listening .cf-avatar-listen-ring {
|
|
1761
|
-
opacity: calc(0.36 + (var(--cf-listen, 0.2) * 0.42));
|
|
1762
|
-
}
|
|
1763
|
-
.cf-avatar-wave {
|
|
1764
|
-
position: absolute;
|
|
1765
|
-
left: 50%;
|
|
1766
|
-
bottom: 46px;
|
|
1767
|
-
z-index: 6;
|
|
1768
|
-
display: inline-flex;
|
|
1769
|
-
align-items: center;
|
|
1770
|
-
justify-content: center;
|
|
1771
|
-
gap: 4px;
|
|
1772
|
-
min-width: 58px;
|
|
1773
|
-
height: 25px;
|
|
1774
|
-
padding: 5px 8px;
|
|
1775
|
-
border-radius: 999px;
|
|
1776
|
-
transform: translateX(-50%) translateY(8px);
|
|
1777
|
-
background: color-mix(in oklab, var(--cf-bg) 82%, transparent);
|
|
1778
|
-
border: 1px solid color-mix(in oklab, var(--cf-accent) 36%, transparent);
|
|
1779
|
-
opacity: 0;
|
|
1780
|
-
pointer-events: none;
|
|
1781
|
-
backdrop-filter: blur(10px);
|
|
1782
|
-
}
|
|
1783
|
-
.cf-avatar-wave span {
|
|
1784
|
-
width: 4px;
|
|
1785
|
-
height: 8px;
|
|
1786
|
-
border-radius: 999px;
|
|
1787
|
-
background: color-mix(in oklab, var(--cf-accent) 88%, #fff);
|
|
1788
|
-
transform-origin: center;
|
|
1789
|
-
}
|
|
1790
|
-
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave {
|
|
1791
|
-
opacity: 1;
|
|
1792
|
-
transform: translateX(-50%) translateY(0);
|
|
1793
|
-
}
|
|
1794
|
-
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span {
|
|
1795
|
-
animation: cf-avatar-wave 0.58s ease-in-out infinite;
|
|
1796
|
-
}
|
|
1797
|
-
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span:nth-child(2) { animation-delay: 0.1s; }
|
|
1798
|
-
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span:nth-child(3) { animation-delay: 0.2s; }
|
|
1799
|
-
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span:nth-child(4) { animation-delay: 0.3s; }
|
|
1800
|
-
.cf-assistant-card__stage--local.is-thinking .cf-assistant-card__media::before {
|
|
1801
|
-
content: '';
|
|
1802
|
-
position: absolute;
|
|
1803
|
-
inset: -35%;
|
|
1804
|
-
z-index: 5;
|
|
1805
|
-
pointer-events: none;
|
|
1806
|
-
background: linear-gradient(115deg, transparent 42%, color-mix(in oklab, var(--cf-accent) 20%, transparent) 50%, transparent 58%);
|
|
1807
|
-
animation: cf-avatar-thinking 1.45s ease-in-out infinite;
|
|
1808
|
-
}
|
|
1809
|
-
.cf-assistant-card__avatar-stage {
|
|
1810
|
-
position: absolute;
|
|
1811
|
-
inset: 0;
|
|
1812
|
-
display: grid;
|
|
1813
|
-
place-items: center;
|
|
1814
|
-
--cf-avatar-a: var(--cf-accent);
|
|
1815
|
-
--cf-avatar-b: color-mix(in oklab, var(--cf-accent) 70%, #0f1f2e);
|
|
1816
|
-
--cf-avatar-glow: color-mix(in oklab, var(--cf-accent) 38%, transparent);
|
|
1817
|
-
background:
|
|
1818
|
-
radial-gradient(circle at 35% 30%, var(--cf-avatar-glow), transparent 32%),
|
|
1819
|
-
linear-gradient(145deg, color-mix(in oklab, var(--cf-avatar-a) 18%, var(--cf-bg)), var(--cf-surface-2));
|
|
1820
|
-
}
|
|
1821
|
-
.cf-assistant-card__face {
|
|
1822
|
-
position: relative;
|
|
1823
|
-
width: 128px;
|
|
1824
|
-
height: 128px;
|
|
1825
|
-
border-radius: 999px;
|
|
1826
|
-
display: grid;
|
|
1827
|
-
place-items: center;
|
|
1828
|
-
color: #fff;
|
|
1829
|
-
background: linear-gradient(145deg, var(--cf-avatar-a), var(--cf-avatar-b));
|
|
1830
|
-
box-shadow: 0 22px 44px -28px rgba(0, 0, 0, 0.75);
|
|
1831
|
-
z-index: 2;
|
|
1832
|
-
}
|
|
1833
|
-
.cf-assistant-card__stage--local.is-speaking .cf-assistant-card__face {
|
|
1834
|
-
animation: cf-avatar-nod 1.6s ease-in-out infinite;
|
|
1835
|
-
}
|
|
1836
|
-
.cf-assistant-card__stage--local.is-listening .cf-assistant-card__face {
|
|
1837
|
-
box-shadow:
|
|
1838
|
-
0 22px 44px -28px rgba(0, 0, 0, 0.75),
|
|
1839
|
-
0 0 0 calc(5px + (var(--cf-listen, 0.2) * 6px)) color-mix(in oklab, var(--cf-accent) 16%, transparent);
|
|
1840
|
-
}
|
|
1841
|
-
.cf-assistant-card--pinned .cf-assistant-card__face {
|
|
1842
|
-
width: 72px;
|
|
1843
|
-
height: 72px;
|
|
1844
|
-
}
|
|
1845
|
-
.cf-avatar-preset--support-guide {
|
|
1846
|
-
--cf-avatar-a: #10b981;
|
|
1847
|
-
--cf-avatar-b: #0f766e;
|
|
1848
|
-
--cf-avatar-glow: rgba(16, 185, 129, 0.34);
|
|
1849
|
-
}
|
|
1850
|
-
.cf-avatar-preset--sales-host {
|
|
1851
|
-
--cf-avatar-a: #3b82f6;
|
|
1852
|
-
--cf-avatar-b: #4338ca;
|
|
1853
|
-
--cf-avatar-glow: rgba(59, 130, 246, 0.34);
|
|
1854
|
-
}
|
|
1855
|
-
.cf-avatar-preset--calm-advisor {
|
|
1856
|
-
--cf-avatar-a: #64748b;
|
|
1857
|
-
--cf-avatar-b: #0f172a;
|
|
1858
|
-
--cf-avatar-glow: rgba(100, 116, 139, 0.34);
|
|
1859
|
-
}
|
|
1860
|
-
.cf-avatar-preset--technical-guide {
|
|
1861
|
-
--cf-avatar-a: #06b6d4;
|
|
1862
|
-
--cf-avatar-b: #1d4ed8;
|
|
1863
|
-
--cf-avatar-glow: rgba(6, 182, 212, 0.34);
|
|
1864
|
-
}
|
|
1865
|
-
.cf-avatar-preset--school-desk {
|
|
1866
|
-
--cf-avatar-a: #8b5cf6;
|
|
1867
|
-
--cf-avatar-b: #6d28d9;
|
|
1868
|
-
--cf-avatar-glow: rgba(139, 92, 246, 0.34);
|
|
1869
|
-
}
|
|
1870
|
-
.cf-avatar-preset--front-office {
|
|
1871
|
-
--cf-avatar-a: #f59e0b;
|
|
1872
|
-
--cf-avatar-b: #c2410c;
|
|
1873
|
-
--cf-avatar-glow: rgba(245, 158, 11, 0.34);
|
|
1874
|
-
}
|
|
1875
|
-
.cf-assistant-card__initials {
|
|
1876
|
-
transform: translateY(-12px);
|
|
1877
|
-
font-size: 34px;
|
|
1878
|
-
font-weight: 800;
|
|
1879
|
-
}
|
|
1880
|
-
.cf-assistant-card--pinned .cf-assistant-card__initials {
|
|
1881
|
-
transform: translateY(-6px);
|
|
1882
|
-
font-size: 19px;
|
|
1883
|
-
}
|
|
1884
|
-
.cf-assistant-card__eye {
|
|
1885
|
-
position: absolute;
|
|
1886
|
-
top: 58px;
|
|
1887
|
-
width: 8px;
|
|
1888
|
-
height: 8px;
|
|
1889
|
-
border-radius: 999px;
|
|
1890
|
-
background: rgba(255, 255, 255, 0.9);
|
|
1891
|
-
}
|
|
1892
|
-
.cf-assistant-card__eye--left { left: 42px; }
|
|
1893
|
-
.cf-assistant-card__eye--right { right: 42px; }
|
|
1894
|
-
.cf-assistant-card--pinned .cf-assistant-card__eye {
|
|
1895
|
-
top: 33px;
|
|
1896
|
-
width: 5px;
|
|
1897
|
-
height: 5px;
|
|
1898
|
-
}
|
|
1899
|
-
.cf-assistant-card--pinned .cf-assistant-card__eye--left { left: 23px; }
|
|
1900
|
-
.cf-assistant-card--pinned .cf-assistant-card__eye--right { right: 23px; }
|
|
1901
|
-
.cf-assistant-card__mouth {
|
|
1902
|
-
position: absolute;
|
|
1903
|
-
left: 50%;
|
|
1904
|
-
bottom: 31px;
|
|
1905
|
-
width: 34px;
|
|
1906
|
-
height: 6px;
|
|
1907
|
-
transform: translateX(-50%);
|
|
1908
|
-
border-radius: 999px;
|
|
1909
|
-
background: rgba(255, 255, 255, 0.9);
|
|
1910
|
-
}
|
|
1911
|
-
.cf-assistant-card--pinned .cf-assistant-card__mouth {
|
|
1912
|
-
bottom: 18px;
|
|
1913
|
-
width: 20px;
|
|
1914
|
-
height: 4px;
|
|
1915
|
-
}
|
|
1916
|
-
.cf-assistant-card.is-speaking .cf-assistant-card__mouth {
|
|
1917
|
-
animation: cf-mouth-talk 0.24s ease-in-out infinite alternate;
|
|
1918
|
-
}
|
|
1919
|
-
.cf-assistant-card__stage--local.is-speaking .cf-assistant-card__mouth {
|
|
1920
|
-
animation: cf-mouth-talk 0.24s ease-in-out infinite alternate;
|
|
1921
|
-
}
|
|
1922
|
-
.cf-assistant-card__mouth--overlay {
|
|
1923
|
-
z-index: 6;
|
|
1924
|
-
bottom: 39px;
|
|
1925
|
-
width: 42px;
|
|
1926
|
-
height: 7px;
|
|
1927
|
-
opacity: 0;
|
|
1928
|
-
background: color-mix(in oklab, #fff 90%, var(--cf-accent));
|
|
1929
|
-
box-shadow:
|
|
1930
|
-
0 0 0 4px rgba(2, 6, 23, 0.22),
|
|
1931
|
-
0 10px 22px -10px rgba(0, 0, 0, 0.85);
|
|
1932
|
-
}
|
|
1933
|
-
.cf-assistant-card__stage--local.is-speaking .cf-assistant-card__mouth--overlay {
|
|
1934
|
-
opacity: 1;
|
|
1935
|
-
}
|
|
1936
|
-
.cf-assistant-card--pinned .cf-assistant-card__mouth--overlay {
|
|
1937
|
-
bottom: 42px;
|
|
1938
|
-
}
|
|
1939
|
-
@keyframes cf-mouth-talk {
|
|
1940
|
-
from { height: 5px; width: 28px; border-radius: 999px; }
|
|
1941
|
-
to { height: 20px; width: 22px; border-radius: 45% 45% 55% 55%; }
|
|
1942
|
-
}
|
|
1943
|
-
@keyframes cf-avatar-breathe {
|
|
1944
|
-
0%, 100% { opacity: 0.16; transform: translate(-50%, -50%) scale(0.82); }
|
|
1945
|
-
50% { opacity: 0.58; transform: translate(-50%, -50%) scale(1.12); }
|
|
1946
|
-
}
|
|
1947
|
-
@keyframes cf-avatar-wave {
|
|
1948
|
-
0%, 100% { transform: scaleY(0.62); opacity: 0.72; }
|
|
1949
|
-
50% { transform: scaleY(1.85); opacity: 1; }
|
|
1950
|
-
}
|
|
1951
|
-
@keyframes cf-avatar-thinking {
|
|
1952
|
-
0% { transform: translateX(-18%); opacity: 0; }
|
|
1953
|
-
38% { opacity: 1; }
|
|
1954
|
-
100% { transform: translateX(18%); opacity: 0; }
|
|
1955
|
-
}
|
|
1956
|
-
@keyframes cf-avatar-nod {
|
|
1957
|
-
0%, 100% { transform: translateY(0) scale(1); }
|
|
1958
|
-
45% { transform: translateY(-2px) scale(1.012); }
|
|
1959
|
-
}
|
|
1960
|
-
.cf-assistant-card__speak {
|
|
1961
|
-
position: absolute;
|
|
1962
|
-
left: 50%;
|
|
1963
|
-
bottom: 12px;
|
|
1964
|
-
transform: translateX(-50%);
|
|
1965
|
-
display: inline-flex;
|
|
1966
|
-
align-items: center;
|
|
1967
|
-
gap: 7px;
|
|
1968
|
-
max-width: calc(100% - 24px);
|
|
1969
|
-
padding: 8px 12px;
|
|
1970
|
-
border-radius: 999px;
|
|
1971
|
-
background: color-mix(in oklab, var(--cf-bg) 92%, transparent);
|
|
1972
|
-
color: var(--cf-accent);
|
|
1973
|
-
box-shadow: 0 10px 22px -14px rgba(15, 30, 42, 0.6);
|
|
1974
|
-
font-size: 12.5px;
|
|
1975
|
-
font-weight: 700;
|
|
1976
|
-
white-space: nowrap;
|
|
1977
|
-
}
|
|
1978
|
-
.cf-assistant-card--pinned .cf-assistant-card__speak {
|
|
1979
|
-
padding: 6px 10px;
|
|
1980
|
-
font-size: 11.5px;
|
|
1981
|
-
}
|
|
1982
|
-
.cf-assistant-card__speak svg { width: 15px; height: 15px; }
|
|
1983
|
-
.cf-assistant-card__voice-only .cf-assistant-card__speak,
|
|
1984
|
-
.cf-assistant-card__voice-only .cf-call-controls {
|
|
1985
|
-
position: static;
|
|
1986
|
-
transform: none;
|
|
1987
|
-
max-width: 100%;
|
|
1988
|
-
}
|
|
1989
|
-
.cf-assistant-card--connecting {
|
|
1990
|
-
min-height: 100%;
|
|
1991
|
-
display: grid;
|
|
1992
|
-
place-items: center;
|
|
1993
|
-
align-content: center;
|
|
1994
|
-
gap: 18px;
|
|
1995
|
-
padding: 34px 24px 42px;
|
|
1996
|
-
text-align: center;
|
|
1997
|
-
border-top: 1px solid var(--cf-border);
|
|
1998
|
-
background:
|
|
1999
|
-
radial-gradient(circle at 50% 38%, color-mix(in oklab, var(--cf-accent) 16%, transparent), transparent 36%),
|
|
2000
|
-
linear-gradient(180deg, color-mix(in oklab, var(--cf-surface) 72%, var(--cf-bg)), var(--cf-bg));
|
|
2001
|
-
}
|
|
2002
|
-
.cf-assistant-card__connecting-avatar {
|
|
2003
|
-
position: relative;
|
|
2004
|
-
width: 118px;
|
|
2005
|
-
height: 118px;
|
|
2006
|
-
display: grid;
|
|
2007
|
-
place-items: center;
|
|
2008
|
-
}
|
|
2009
|
-
.cf-assistant-card__connecting-avatar img,
|
|
2010
|
-
.cf-assistant-card__connecting-face {
|
|
2011
|
-
width: 92px;
|
|
2012
|
-
height: 92px;
|
|
2013
|
-
border-radius: 999px;
|
|
2014
|
-
display: grid;
|
|
2015
|
-
place-items: center;
|
|
2016
|
-
object-fit: cover;
|
|
2017
|
-
color: #fff;
|
|
2018
|
-
font-size: 28px;
|
|
2019
|
-
font-weight: 850;
|
|
2020
|
-
letter-spacing: -0.04em;
|
|
2021
|
-
background: linear-gradient(145deg, var(--cf-accent), var(--cf-accent-2));
|
|
2022
|
-
border: 1px solid color-mix(in oklab, #fff 30%, transparent);
|
|
2023
|
-
box-shadow:
|
|
2024
|
-
0 22px 48px -24px color-mix(in oklab, var(--cf-accent) 60%, #000),
|
|
2025
|
-
0 0 0 8px color-mix(in oklab, var(--cf-accent) 10%, transparent);
|
|
2026
|
-
z-index: 2;
|
|
2027
|
-
}
|
|
2028
|
-
.cf-assistant-card__connecting-copy {
|
|
2029
|
-
display: grid;
|
|
2030
|
-
gap: 6px;
|
|
2031
|
-
}
|
|
2032
|
-
.cf-assistant-card__connecting-eyebrow {
|
|
2033
|
-
color: var(--cf-muted);
|
|
2034
|
-
font-size: 11px;
|
|
2035
|
-
font-weight: 800;
|
|
2036
|
-
letter-spacing: 0.12em;
|
|
2037
|
-
text-transform: uppercase;
|
|
2038
|
-
}
|
|
2039
|
-
.cf-assistant-card__connecting-copy strong {
|
|
2040
|
-
color: var(--cf-text);
|
|
2041
|
-
font-size: 18px;
|
|
2042
|
-
line-height: 1.25;
|
|
2043
|
-
}
|
|
2044
|
-
.cf-assistant-card--connecting .cf-call-ripple {
|
|
2045
|
-
inset: -18px;
|
|
2046
|
-
border-radius: 999px;
|
|
2047
|
-
}
|
|
2048
|
-
.cf-assistant-card--connecting .cf-call-ripple span {
|
|
2049
|
-
width: 92px;
|
|
2050
|
-
height: 92px;
|
|
2051
|
-
}
|
|
2052
|
-
|
|
2053
|
-
/* ---------- Call "working" ripple ----------
|
|
2054
|
-
Concentric rings pulsing out from the avatar's center while the call is
|
|
2055
|
-
connecting / transcribing / waiting for the reply — the classic "ringing
|
|
2056
|
-
call" cue, so busy moments read as live activity instead of a freeze. */
|
|
2057
|
-
.cf-call-ripple {
|
|
2058
|
-
position: absolute;
|
|
2059
|
-
inset: 0;
|
|
2060
|
-
display: grid;
|
|
2061
|
-
place-items: center;
|
|
2062
|
-
pointer-events: none;
|
|
2063
|
-
overflow: hidden;
|
|
2064
|
-
border-radius: inherit;
|
|
2065
|
-
}
|
|
2066
|
-
.cf-call-ripple span {
|
|
2067
|
-
position: absolute;
|
|
2068
|
-
width: 74px;
|
|
2069
|
-
height: 74px;
|
|
2070
|
-
border-radius: 999px;
|
|
2071
|
-
border: 2px solid var(--cf-accent);
|
|
2072
|
-
opacity: 0;
|
|
2073
|
-
animation: cf-call-ripple 1.8s ease-out infinite;
|
|
2074
|
-
}
|
|
2075
|
-
.cf-call-ripple span:nth-child(2) { animation-delay: 0.6s; }
|
|
2076
|
-
.cf-call-ripple span:nth-child(3) { animation-delay: 1.2s; }
|
|
2077
|
-
@keyframes cf-call-ripple {
|
|
2078
|
-
0% { transform: scale(0.9); opacity: 0.55; }
|
|
2079
|
-
100% { transform: scale(2.6); opacity: 0; }
|
|
2080
|
-
}
|
|
2081
|
-
@media (prefers-reduced-motion: reduce) {
|
|
2082
|
-
.cf-call-ripple span { animation: none; opacity: 0.25; transform: scale(1.4); }
|
|
2083
|
-
.cf-call-ripple span:nth-child(2), .cf-call-ripple span:nth-child(3) { display: none; }
|
|
2084
|
-
}
|
|
2085
|
-
|
|
2086
|
-
/* ---------- In-call controls (mic / audio picker / expand / minimize / end) ---------- */
|
|
2087
|
-
.cf-call-controls {
|
|
2088
|
-
position: absolute;
|
|
2089
|
-
left: 50%;
|
|
2090
|
-
bottom: 12px;
|
|
2091
|
-
transform: translateX(-50%);
|
|
2092
|
-
display: inline-flex;
|
|
2093
|
-
align-items: center;
|
|
2094
|
-
gap: 4px;
|
|
2095
|
-
max-width: calc(100% - 24px);
|
|
2096
|
-
padding: 5px 7px;
|
|
2097
|
-
border-radius: 999px;
|
|
2098
|
-
background: color-mix(in oklab, var(--cf-bg) 94%, transparent);
|
|
2099
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 72%, transparent);
|
|
2100
|
-
box-shadow: 0 14px 34px -16px rgba(0, 0, 0, 0.7);
|
|
2101
|
-
z-index: 30;
|
|
2102
|
-
}
|
|
2103
|
-
.cf-assistant-card--pinned .cf-call-controls { padding: 4px 6px; gap: 4px; }
|
|
2104
|
-
.cf-call-btn {
|
|
2105
|
-
position: relative;
|
|
2106
|
-
flex-shrink: 0;
|
|
2107
|
-
width: 30px;
|
|
2108
|
-
height: 30px;
|
|
2109
|
-
border-radius: 999px;
|
|
2110
|
-
display: inline-flex;
|
|
2111
|
-
align-items: center;
|
|
2112
|
-
justify-content: center;
|
|
2113
|
-
gap: 6px;
|
|
2114
|
-
color: var(--cf-text);
|
|
2115
|
-
background: color-mix(in oklab, var(--cf-surface) 88%, transparent);
|
|
2116
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 76%, transparent);
|
|
2117
|
-
transition: background 0.15s ease, transform 0.12s ease, color 0.15s ease;
|
|
2118
|
-
}
|
|
2119
|
-
.cf-call-btn:hover { background: color-mix(in oklab, var(--cf-accent) 10%, var(--cf-surface)); }
|
|
2120
|
-
.cf-call-btn:active { transform: scale(0.94); }
|
|
2121
|
-
.cf-call-btn svg { width: 14px; height: 14px; }
|
|
2122
|
-
.cf-call-btn--microphones {
|
|
2123
|
-
width: 24px;
|
|
2124
|
-
margin-left: -5px;
|
|
2125
|
-
border-top-left-radius: 10px;
|
|
2126
|
-
border-bottom-left-radius: 10px;
|
|
2127
|
-
}
|
|
2128
|
-
.cf-call-btn--microphones svg { width: 13px; height: 13px; }
|
|
2129
|
-
.cf-call-btn--restore svg { width: 15px; height: 15px; }
|
|
2130
|
-
.cf-call-btn.is-muted {
|
|
2131
|
-
color: #fff;
|
|
2132
|
-
background: var(--cf-muted);
|
|
2133
|
-
border-color: transparent;
|
|
2134
|
-
}
|
|
2135
|
-
/* Live-listening cue: a soft ring around the mic button that breathes with
|
|
2136
|
-
the mic level, instead of a separate waveform element eating up row width. */
|
|
2137
|
-
.cf-call-btn.is-listening::after {
|
|
2138
|
-
content: '';
|
|
2139
|
-
position: absolute;
|
|
2140
|
-
inset: -4px;
|
|
2141
|
-
border-radius: inherit;
|
|
2142
|
-
border: 2px solid var(--cf-accent);
|
|
2143
|
-
opacity: calc(0.25 + var(--cf-wave, 0.2) * 0.5);
|
|
2144
|
-
transform: scale(calc(1 + var(--cf-wave, 0.2) * 0.22));
|
|
2145
|
-
transition: transform 0.09s ease, opacity 0.09s ease;
|
|
2146
|
-
pointer-events: none;
|
|
2147
|
-
}
|
|
2148
|
-
/* Your voice is actually registering: the mic fills with the accent color
|
|
2149
|
-
and the ring flares, so "it hears me" is unmistakable at a glance. */
|
|
2150
|
-
.cf-call-btn.is-listening.is-hot {
|
|
2151
|
-
color: var(--cf-accent-ink);
|
|
2152
|
-
background: var(--cf-accent);
|
|
2153
|
-
border-color: transparent;
|
|
2154
|
-
}
|
|
2155
|
-
.cf-call-btn.is-listening.is-hot::after {
|
|
2156
|
-
border-width: 3px;
|
|
2157
|
-
opacity: calc(0.5 + var(--cf-wave, 0.2) * 0.5);
|
|
2158
|
-
transform: scale(calc(1.08 + var(--cf-wave, 0.2) * 0.35));
|
|
2159
|
-
box-shadow: 0 0 12px 2px color-mix(in oklab, var(--cf-accent) 55%, transparent);
|
|
2160
|
-
}
|
|
2161
|
-
.cf-call-btn--talk {
|
|
2162
|
-
color: var(--cf-accent-ink);
|
|
2163
|
-
background: var(--cf-accent);
|
|
2164
|
-
border-color: transparent;
|
|
2165
|
-
}
|
|
2166
|
-
.cf-call-btn--end {
|
|
2167
|
-
color: #fff;
|
|
2168
|
-
background: #e5484d;
|
|
2169
|
-
border-color: transparent;
|
|
2170
|
-
}
|
|
2171
|
-
.cf-call-btn--end:hover { background: #dc3d42; }
|
|
2172
|
-
/* Microphone selector popover. */
|
|
2173
|
-
.cf-call-more { position: static; display: inline-flex; z-index: 40; }
|
|
2174
|
-
.cf-call-menu {
|
|
2175
|
-
position: absolute;
|
|
2176
|
-
top: calc(100% + 8px);
|
|
2177
|
-
bottom: auto;
|
|
2178
|
-
left: 50%;
|
|
2179
|
-
transform: translateX(-50%);
|
|
2180
|
-
display: flex;
|
|
2181
|
-
flex-direction: column;
|
|
2182
|
-
gap: 2px;
|
|
2183
|
-
width: min(240px, calc(var(--cf-panel-w, 388px) - 72px), calc(100vw - 64px));
|
|
2184
|
-
min-width: 0;
|
|
2185
|
-
max-width: calc(100vw - 64px);
|
|
2186
|
-
max-height: min(300px, calc(100vh - 220px));
|
|
2187
|
-
overflow-y: auto;
|
|
2188
|
-
padding: 8px;
|
|
2189
|
-
border-radius: 14px;
|
|
2190
|
-
background: color-mix(in oklab, var(--cf-bg) 98%, #000);
|
|
2191
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 74%, transparent);
|
|
2192
|
-
box-shadow: 0 18px 45px -20px rgba(0, 0, 0, 0.78);
|
|
2193
|
-
z-index: 60;
|
|
2194
|
-
}
|
|
2195
|
-
.cf-call-menu__label {
|
|
2196
|
-
margin: 8px 8px 4px;
|
|
2197
|
-
color: var(--cf-muted);
|
|
2198
|
-
font-size: 11px;
|
|
2199
|
-
font-weight: 700;
|
|
2200
|
-
text-transform: uppercase;
|
|
2201
|
-
letter-spacing: 0.08em;
|
|
2202
|
-
}
|
|
2203
|
-
.cf-call-menu__item {
|
|
2204
|
-
display: flex;
|
|
2205
|
-
align-items: center;
|
|
2206
|
-
gap: 8px;
|
|
2207
|
-
min-width: 0;
|
|
2208
|
-
padding: 8px 9px;
|
|
2209
|
-
border-radius: 10px;
|
|
2210
|
-
color: var(--cf-text);
|
|
2211
|
-
font-size: 12.5px;
|
|
2212
|
-
text-align: left;
|
|
2213
|
-
white-space: nowrap;
|
|
2214
|
-
overflow: hidden;
|
|
2215
|
-
}
|
|
2216
|
-
.cf-call-menu__item span:last-child {
|
|
2217
|
-
min-width: 0;
|
|
2218
|
-
overflow: hidden;
|
|
2219
|
-
text-overflow: ellipsis;
|
|
2220
|
-
}
|
|
2221
|
-
.cf-call-menu__item:hover { background: color-mix(in oklab, var(--cf-accent) 12%, var(--cf-surface)); }
|
|
2222
|
-
.cf-call-menu__item.is-active { color: var(--cf-accent); font-weight: 600; }
|
|
2223
|
-
.cf-call-menu__item svg { width: 13px; height: 13px; flex-shrink: 0; }
|
|
2224
|
-
.cf-call-menu__spacer { width: 13px; flex-shrink: 0; }
|
|
2225
|
-
/* Detached floating avatar card — replaces the launcher while a call runs minimized. */
|
|
2226
|
-
.cf-floating-call-card {
|
|
2227
|
-
position: fixed;
|
|
2228
|
-
bottom: var(--cf-v-pad, 20px);
|
|
2229
|
-
right: var(--cf-h-pad, 20px);
|
|
2230
|
-
z-index: 1;
|
|
2231
|
-
pointer-events: auto;
|
|
2232
|
-
width: min(340px, calc(100vw - 32px));
|
|
2233
|
-
aspect-ratio: 16 / 9;
|
|
2234
|
-
overflow: hidden;
|
|
2235
|
-
border-radius: 14px;
|
|
2236
|
-
background: var(--cf-bg);
|
|
2237
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 74%, transparent);
|
|
2238
|
-
box-shadow: 0 20px 48px -20px rgba(0, 0, 0, 0.72);
|
|
2239
|
-
animation: cf-pop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
|
|
2240
|
-
}
|
|
2241
|
-
.cf-root[data-align='left'] .cf-floating-call-card { right: auto; left: var(--cf-h-pad, 20px); }
|
|
2242
|
-
.cf-floating-call-card__media,
|
|
2243
|
-
.cf-floating-call-card__shade {
|
|
2244
|
-
position: absolute;
|
|
2245
|
-
inset: 0;
|
|
2246
|
-
}
|
|
2247
|
-
.cf-floating-call-card__media img,
|
|
2248
|
-
.cf-floating-call-card__media video {
|
|
2249
|
-
width: 100%;
|
|
2250
|
-
height: 100%;
|
|
2251
|
-
object-fit: cover;
|
|
2252
|
-
}
|
|
2253
|
-
.cf-floating-call-card__shade {
|
|
2254
|
-
background:
|
|
2255
|
-
linear-gradient(to bottom, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.18)),
|
|
2256
|
-
radial-gradient(circle at 50% 100%, rgba(255, 255, 255, 0.08), transparent 42%);
|
|
2257
|
-
pointer-events: none;
|
|
2258
|
-
}
|
|
2259
|
-
.cf-floating-call-card__avatar {
|
|
2260
|
-
position: absolute;
|
|
2261
|
-
inset: 0;
|
|
2262
|
-
display: flex;
|
|
2263
|
-
align-items: center;
|
|
2264
|
-
justify-content: center;
|
|
2265
|
-
color: #fff;
|
|
2266
|
-
background: linear-gradient(145deg, var(--cf-accent), var(--cf-accent-2));
|
|
2267
|
-
}
|
|
2268
|
-
.cf-floating-call-card.is-muted {
|
|
2269
|
-
filter: saturate(0.72);
|
|
2270
|
-
}
|
|
2271
|
-
.cf-floating-call-card.is-listening {
|
|
2272
|
-
border-color: color-mix(in oklab, var(--cf-accent) 62%, var(--cf-border));
|
|
2273
|
-
box-shadow:
|
|
2274
|
-
0 20px 48px -20px rgba(0, 0, 0, 0.72),
|
|
2275
|
-
0 0 calc(12px + (var(--cf-listen, 0.2) * 18px)) color-mix(in oklab, var(--cf-accent) 28%, transparent);
|
|
2276
|
-
}
|
|
2277
|
-
.cf-floating-call-card.is-thinking .cf-floating-call-card__shade::before {
|
|
2278
|
-
content: '';
|
|
2279
|
-
position: absolute;
|
|
2280
|
-
inset: -45%;
|
|
2281
|
-
background: linear-gradient(115deg, transparent 42%, color-mix(in oklab, var(--cf-accent) 22%, transparent) 50%, transparent 58%);
|
|
2282
|
-
animation: cf-avatar-thinking 1.45s ease-in-out infinite;
|
|
2283
|
-
}
|
|
2284
|
-
.cf-floating-call-card.is-speaking .cf-floating-call-card__avatar,
|
|
2285
|
-
.cf-floating-call-card.is-speaking .cf-floating-call-card__media img {
|
|
2286
|
-
animation: cf-avatar-nod 1.6s ease-in-out infinite;
|
|
2287
|
-
}
|
|
2288
|
-
.cf-floating-call-card__avatar > span:first-child {
|
|
2289
|
-
font-size: clamp(64px, 22vw, 118px);
|
|
2290
|
-
font-weight: 800;
|
|
2291
|
-
line-height: 1;
|
|
2292
|
-
}
|
|
2293
|
-
.cf-floating-call-card__eye,
|
|
2294
|
-
.cf-floating-call-card__mouth {
|
|
2295
|
-
position: absolute;
|
|
2296
|
-
background: rgba(255, 255, 255, 0.9);
|
|
2297
|
-
}
|
|
2298
|
-
.cf-floating-call-card__eye {
|
|
2299
|
-
top: 37%;
|
|
2300
|
-
width: 8px;
|
|
2301
|
-
height: 8px;
|
|
2302
|
-
border-radius: 999px;
|
|
2303
|
-
}
|
|
2304
|
-
.cf-floating-call-card__eye--left { left: 38%; }
|
|
2305
|
-
.cf-floating-call-card__eye--right { right: 38%; }
|
|
2306
|
-
.cf-floating-call-card__mouth {
|
|
2307
|
-
bottom: 31%;
|
|
2308
|
-
width: 34px;
|
|
2309
|
-
height: 6px;
|
|
2310
|
-
border-radius: 999px;
|
|
2311
|
-
}
|
|
2312
|
-
.cf-floating-call-card.is-speaking .cf-floating-call-card__mouth {
|
|
2313
|
-
animation: cf-mouth-talk 0.24s ease-in-out infinite alternate;
|
|
2314
|
-
}
|
|
2315
|
-
.cf-floating-call-card__controls {
|
|
2316
|
-
position: absolute;
|
|
2317
|
-
left: 50%;
|
|
2318
|
-
bottom: 12px;
|
|
2319
|
-
transform: translateX(-50%);
|
|
2320
|
-
display: inline-flex;
|
|
2321
|
-
align-items: center;
|
|
2322
|
-
gap: 4px;
|
|
2323
|
-
padding: 5px 7px;
|
|
2324
|
-
border-radius: 999px;
|
|
2325
|
-
background: color-mix(in oklab, var(--cf-bg) 92%, transparent);
|
|
2326
|
-
border: 1px solid color-mix(in oklab, var(--cf-border) 70%, transparent);
|
|
2327
|
-
box-shadow: 0 14px 30px -16px rgba(0, 0, 0, 0.74);
|
|
2328
|
-
}
|
|
2329
|
-
.cf-assistant-card__copy {
|
|
2330
|
-
margin: 0;
|
|
2331
|
-
color: var(--cf-text);
|
|
2332
|
-
font-size: 14px;
|
|
2333
|
-
line-height: 1.55;
|
|
2334
|
-
}
|
|
2335
|
-
.cf-assistant-card__chips {
|
|
2336
|
-
display: flex;
|
|
2337
|
-
flex-wrap: wrap;
|
|
2338
|
-
gap: 7px;
|
|
2339
|
-
}
|
|
2340
|
-
.cf-assistant-card__chip {
|
|
2341
|
-
max-width: 100%;
|
|
2342
|
-
border-radius: 6px;
|
|
2343
|
-
padding: 7px 9px;
|
|
2344
|
-
background: color-mix(in oklab, var(--cf-accent) 12%, var(--cf-bg));
|
|
2345
|
-
color: var(--cf-accent);
|
|
2346
|
-
font-size: 12.5px;
|
|
2347
|
-
line-height: 1.2;
|
|
2348
|
-
}
|
|
2349
|
-
.cf-assistant-card__chip:hover { background: color-mix(in oklab, var(--cf-accent) 18%, var(--cf-bg)); }
|
|
2350
|
-
.cf-assistant-card__privacy {
|
|
2351
|
-
margin: -2px 0 0;
|
|
2352
|
-
color: var(--cf-muted);
|
|
2353
|
-
font-size: 10.5px;
|
|
2354
|
-
line-height: 1.4;
|
|
2355
|
-
text-align: center;
|
|
2356
|
-
}
|
|
2357
|
-
.cf-assistant-card__privacy a {
|
|
2358
|
-
color: var(--cf-muted);
|
|
2359
|
-
text-decoration: underline;
|
|
2360
|
-
text-underline-offset: 2px;
|
|
2361
|
-
}
|
|
2362
|
-
|
|
2363
|
-
/* Offline presence dot (amber instead of green). */
|
|
2364
|
-
.cf-header__status--offline::before { background: #e2c07e; box-shadow: 0 0 0 2px rgba(226, 192, 126, 0.3); }
|
|
2365
|
-
|
|
2366
|
-
/* Disclaimer fine-print under the composer. */
|
|
2367
|
-
.cf-disclaimer { padding: 0 16px 2px; font-size: 10.5px; line-height: 1.45; color: var(--cf-muted); text-align: center; }
|
|
2368
|
-
|
|
2369
|
-
/* Read-only banner shown while viewing a past conversation. */
|
|
2370
|
-
.cf-viewing-banner {
|
|
2371
|
-
padding: 7px 16px;
|
|
2372
|
-
font-size: 12px;
|
|
2373
|
-
font-weight: 600;
|
|
2374
|
-
text-align: center;
|
|
2375
|
-
color: var(--cf-muted);
|
|
2376
|
-
background: var(--cf-surface);
|
|
2377
|
-
border-bottom: 1px solid var(--cf-border);
|
|
2378
|
-
flex-shrink: 0;
|
|
2379
|
-
}
|
|
2380
|
-
|
|
2381
|
-
/* Past-conversations history panel (over the chat, like the confirm dialog). */
|
|
2382
|
-
.cf-history {
|
|
2383
|
-
width: min(340px, 90%);
|
|
2384
|
-
max-height: 70%;
|
|
2385
|
-
display: flex;
|
|
2386
|
-
flex-direction: column;
|
|
2387
|
-
background: var(--cf-bg);
|
|
2388
|
-
border-radius: 14px;
|
|
2389
|
-
box-shadow: var(--cf-shadow);
|
|
2390
|
-
overflow: hidden;
|
|
2391
|
-
}
|
|
2392
|
-
.cf-history__head {
|
|
2393
|
-
display: flex;
|
|
2394
|
-
align-items: center;
|
|
2395
|
-
justify-content: space-between;
|
|
2396
|
-
padding: 12px 14px;
|
|
2397
|
-
font-size: 14px;
|
|
2398
|
-
font-weight: 700;
|
|
2399
|
-
color: var(--cf-text);
|
|
2400
|
-
border-bottom: 1px solid var(--cf-border);
|
|
2401
|
-
}
|
|
2402
|
-
.cf-history__list { overflow-y: auto; padding: 6px; }
|
|
2403
|
-
.cf-history__item {
|
|
2404
|
-
display: flex;
|
|
2405
|
-
flex-direction: column;
|
|
2406
|
-
gap: 2px;
|
|
2407
|
-
width: 100%;
|
|
2408
|
-
text-align: left;
|
|
2409
|
-
padding: 9px 10px;
|
|
2410
|
-
border-radius: 9px;
|
|
2411
|
-
cursor: pointer;
|
|
2412
|
-
transition: background 0.15s ease;
|
|
2413
|
-
}
|
|
2414
|
-
.cf-history__item:hover { background: var(--cf-surface); }
|
|
2415
|
-
.cf-history__item.is-active { background: var(--cf-surface); }
|
|
2416
|
-
.cf-history__title { font-size: 13px; color: var(--cf-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
2417
|
-
.cf-history__meta { font-size: 11px; color: var(--cf-muted); }
|
|
2418
|
-
|
|
2419
|
-
/* Ended-conversation bar — replaces the composer once the chat is closed. */
|
|
2420
|
-
.cf-ended {
|
|
2421
|
-
display: flex;
|
|
2422
|
-
flex-direction: column;
|
|
2423
|
-
align-items: center;
|
|
2424
|
-
gap: 10px;
|
|
2425
|
-
padding: 14px 16px 16px;
|
|
2426
|
-
flex-shrink: 0;
|
|
2427
|
-
text-align: center;
|
|
2428
|
-
}
|
|
2429
|
-
.cf-ended__text { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--cf-muted); }
|
|
2430
|
-
.cf-csat { display: inline-flex; align-items: center; gap: 8px; }
|
|
2431
|
-
.cf-csat__q { font-size: 12.5px; color: var(--cf-muted); }
|
|
2432
|
-
.cf-csat__btn {
|
|
2433
|
-
display: inline-flex;
|
|
2434
|
-
align-items: center;
|
|
2435
|
-
justify-content: center;
|
|
2436
|
-
width: 30px;
|
|
2437
|
-
height: 30px;
|
|
2438
|
-
border-radius: 8px;
|
|
2439
|
-
color: var(--cf-muted);
|
|
2440
|
-
cursor: pointer;
|
|
2441
|
-
transition: background 0.15s ease, color 0.15s ease;
|
|
2442
|
-
}
|
|
2443
|
-
.cf-csat__btn:hover { background: var(--cf-surface); color: var(--cf-accent); }
|
|
2444
|
-
.cf-csat__btn svg { width: 16px; height: 16px; }
|
|
2445
|
-
.cf-ended__btn {
|
|
2446
|
-
font-size: 13px;
|
|
2447
|
-
font-weight: 600;
|
|
2448
|
-
color: var(--cf-accent-ink);
|
|
2449
|
-
background: var(--cf-accent);
|
|
2450
|
-
border: none;
|
|
2451
|
-
border-radius: 999px;
|
|
2452
|
-
padding: 9px 18px;
|
|
2453
|
-
cursor: pointer;
|
|
2454
|
-
transition: opacity 0.15s ease;
|
|
2455
|
-
}
|
|
2456
|
-
.cf-ended__btn:hover { opacity: 0.9; }
|
|
2457
|
-
.cf-ended__btn:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 2px; }
|
|
2458
|
-
|
|
2459
|
-
/* "↓ New messages" pill — shown when a reply streams in while scrolled up. */
|
|
2460
|
-
.cf-newmsg {
|
|
2461
|
-
/* Sticky inside the scroll body: pins to the bottom of the visible thread,
|
|
2462
|
-
just above the composer (never overlapping it). Horizontal centering via
|
|
2463
|
-
align-self so it doesn't fight the entrance animation's transform. */
|
|
2464
|
-
position: sticky;
|
|
2465
|
-
bottom: 10px;
|
|
2466
|
-
align-self: center;
|
|
2467
|
-
z-index: 3;
|
|
2468
|
-
pointer-events: auto;
|
|
2469
|
-
display: inline-flex;
|
|
2470
|
-
align-items: center;
|
|
2471
|
-
gap: 6px;
|
|
2472
|
-
font-size: 12.5px;
|
|
2473
|
-
font-weight: 600;
|
|
2474
|
-
color: var(--cf-accent-ink);
|
|
2475
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 160%);
|
|
2476
|
-
border-radius: 999px;
|
|
2477
|
-
padding: 7px 14px;
|
|
2478
|
-
box-shadow: var(--cf-shadow);
|
|
2479
|
-
animation: cf-msg-in 0.2s ease both;
|
|
2480
|
-
}
|
|
2481
|
-
.cf-newmsg svg { width: 14px; height: 14px; }
|
|
2482
|
-
|
|
2483
|
-
/* ---------- Clear-chat confirm dialog (in-widget, replaces window.confirm) ---------- */
|
|
2484
|
-
.cf-confirm {
|
|
2485
|
-
position: absolute;
|
|
2486
|
-
inset: 0;
|
|
2487
|
-
z-index: 6;
|
|
2488
|
-
pointer-events: auto;
|
|
2489
|
-
display: grid;
|
|
2490
|
-
place-items: center;
|
|
2491
|
-
padding: 22px;
|
|
2492
|
-
background: color-mix(in oklab, var(--cf-bg) 62%, transparent);
|
|
2493
|
-
backdrop-filter: blur(2px);
|
|
2494
|
-
animation: cf-fade-in 0.14s ease both;
|
|
2495
|
-
}
|
|
2496
|
-
.cf-confirm__card {
|
|
2497
|
-
width: 100%;
|
|
2498
|
-
max-width: 300px;
|
|
2499
|
-
background: var(--cf-bg);
|
|
2500
|
-
border: 1px solid var(--cf-border);
|
|
2501
|
-
border-radius: 16px;
|
|
2502
|
-
box-shadow: var(--cf-shadow);
|
|
2503
|
-
padding: 18px;
|
|
2504
|
-
text-align: center;
|
|
2505
|
-
animation: cf-msg-in 0.18s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
2506
|
-
}
|
|
2507
|
-
.cf-confirm__title { font-size: 15px; font-weight: 700; color: var(--cf-text); }
|
|
2508
|
-
.cf-confirm__body { margin-top: 6px; font-size: 13px; line-height: 1.45; color: var(--cf-muted); }
|
|
2509
|
-
.cf-confirm__actions { margin-top: 16px; display: flex; gap: 8px; justify-content: center; }
|
|
2510
|
-
.cf-confirm__btn {
|
|
2511
|
-
padding: 9px 16px;
|
|
2512
|
-
border-radius: 10px;
|
|
2513
|
-
font-size: 13.5px;
|
|
2514
|
-
font-weight: 600;
|
|
2515
|
-
transition: transform 0.1s ease, opacity 0.15s ease, border-color 0.15s ease, background 0.15s ease;
|
|
2516
|
-
}
|
|
2517
|
-
.cf-confirm__btn:active { transform: scale(0.97); }
|
|
2518
|
-
.cf-confirm__btn:focus-visible { outline: 2px solid var(--cf-accent-2); outline-offset: 2px; }
|
|
2519
|
-
.cf-confirm__btn--cancel { background: var(--cf-surface); color: var(--cf-text); border: 1px solid var(--cf-border); }
|
|
2520
|
-
.cf-confirm__btn--cancel:hover { border-color: var(--cf-accent); }
|
|
2521
|
-
.cf-confirm__btn--danger { background: #f25767; color: #fff; }
|
|
2522
|
-
.cf-confirm__btn--danger:hover { opacity: 0.9; }
|
|
2523
|
-
|
|
2524
|
-
/* Visually-hidden live region (announces the final answer only). */
|
|
2525
|
-
.cf-sr-live {
|
|
2526
|
-
position: absolute;
|
|
2527
|
-
width: 1px;
|
|
2528
|
-
height: 1px;
|
|
2529
|
-
padding: 0;
|
|
2530
|
-
margin: -1px;
|
|
2531
|
-
overflow: hidden;
|
|
2532
|
-
clip: rect(0 0 0 0);
|
|
2533
|
-
white-space: nowrap;
|
|
2534
|
-
border: 0;
|
|
2535
|
-
}
|
|
2536
|
-
|
|
2537
|
-
/* ---------- Attachments ---------- */
|
|
2538
|
-
.cf-file-input { display: none; }
|
|
2539
|
-
.cf-iconbtn:disabled { opacity: 0.4; cursor: default; }
|
|
2540
|
-
.cf-attach-row { padding: 0 4px 8px; }
|
|
2541
|
-
.cf-attach-status { font-size: 12px; color: var(--cf-muted); }
|
|
2542
|
-
.cf-attach-status--err { color: #f25767; }
|
|
2543
|
-
.cf-attach-chip {
|
|
2544
|
-
display: inline-flex;
|
|
2545
|
-
align-items: center;
|
|
2546
|
-
gap: 6px;
|
|
2547
|
-
max-width: 100%;
|
|
2548
|
-
padding: 5px 6px 5px 10px;
|
|
2549
|
-
border-radius: 999px;
|
|
2550
|
-
background: var(--cf-surface-2);
|
|
2551
|
-
border: 1px solid var(--cf-border);
|
|
2552
|
-
color: var(--cf-text);
|
|
2553
|
-
font-size: 12px;
|
|
2554
|
-
}
|
|
2555
|
-
.cf-attach-chip > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
2556
|
-
.cf-attach-chip svg { width: 13px; height: 13px; flex-shrink: 0; color: var(--cf-muted); }
|
|
2557
|
-
.cf-attach-x { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: var(--cf-muted); flex-shrink: 0; }
|
|
2558
|
-
.cf-attach-x:hover { background: var(--cf-surface); color: var(--cf-text); }
|
|
2559
|
-
.cf-attach-x svg { width: 11px; height: 11px; }
|
|
2560
|
-
|
|
2561
|
-
/* ---------- Mobile: full-screen panel ---------- */
|
|
2562
|
-
@media (max-width: 480px) {
|
|
2563
|
-
.cf-panel {
|
|
2564
|
-
bottom: 0;
|
|
2565
|
-
right: 0;
|
|
2566
|
-
width: 100vw;
|
|
2567
|
-
max-width: 100vw;
|
|
2568
|
-
height: 100dvh;
|
|
2569
|
-
max-height: 100dvh;
|
|
2570
|
-
border-radius: 0;
|
|
2571
|
-
}
|
|
2572
|
-
.cf-launcher { bottom: 16px; right: 16px; }
|
|
2573
|
-
}
|
|
2574
|
-
|
|
2575
|
-
/* ---------- Keyframes ---------- */
|
|
2576
|
-
@keyframes cf-pop {
|
|
2577
|
-
from { transform: scale(0); opacity: 0; }
|
|
2578
|
-
to { transform: scale(1); opacity: 1; }
|
|
2579
|
-
}
|
|
2580
|
-
@keyframes cf-badge-pop {
|
|
2581
|
-
from { transform: scale(0); }
|
|
2582
|
-
to { transform: scale(1); }
|
|
2583
|
-
}
|
|
2584
|
-
@keyframes cf-msg-in {
|
|
2585
|
-
from { opacity: 0; transform: translateY(8px); }
|
|
2586
|
-
to { opacity: 1; transform: none; }
|
|
2587
|
-
}
|
|
2588
|
-
@keyframes cf-fade-in {
|
|
2589
|
-
from { opacity: 0; }
|
|
2590
|
-
to { opacity: 1; }
|
|
2591
|
-
}
|
|
2592
|
-
@keyframes cf-typing {
|
|
2593
|
-
0%, 80%, 100% { opacity: 0.35; transform: translateY(0); }
|
|
2594
|
-
40% { opacity: 1; transform: translateY(-4px); }
|
|
2595
|
-
}
|
|
2596
|
-
@keyframes cf-pulse {
|
|
2597
|
-
0%, 100% { opacity: 1; }
|
|
2598
|
-
50% { opacity: 0.4; }
|
|
2599
|
-
}
|
|
2600
|
-
|
|
2601
|
-
@media (prefers-reduced-motion: reduce) {
|
|
2602
|
-
.cf-root *, .cf-root *::before, .cf-root *::after {
|
|
2603
|
-
animation-duration: 0.01ms !important;
|
|
2604
|
-
animation-iteration-count: 1 !important;
|
|
2605
|
-
transition-duration: 0.01ms !important;
|
|
2606
|
-
scroll-behavior: auto !important;
|
|
2607
|
-
}
|
|
2608
|
-
}
|
|
2609
|
-
.cf-analytics-visualization {
|
|
2610
|
-
box-sizing: border-box;
|
|
2611
|
-
width: 100%;
|
|
2612
|
-
max-width: 100%;
|
|
2613
|
-
margin-top: 8px;
|
|
2614
|
-
min-width: 0;
|
|
2615
|
-
overflow: hidden;
|
|
2616
|
-
border: 1px solid var(--cf-border);
|
|
2617
|
-
border-radius: 13px;
|
|
2618
|
-
background: var(--cf-surface);
|
|
2619
|
-
padding: 12px;
|
|
2620
|
-
color: var(--cf-muted);
|
|
2621
|
-
font-size: 11px;
|
|
2622
|
-
}
|
|
2623
|
-
.cf-analytics-visualization.is-expanded {
|
|
2624
|
-
display: flex;
|
|
2625
|
-
min-height: 100%;
|
|
2626
|
-
flex-direction: column;
|
|
2627
|
-
margin: 0;
|
|
2628
|
-
border: 0;
|
|
2629
|
-
border-radius: 0;
|
|
2630
|
-
background: transparent;
|
|
2631
|
-
padding: 0;
|
|
2632
|
-
}
|
|
2633
|
-
.cf-analytics-visualization__header {
|
|
2634
|
-
display: flex;
|
|
2635
|
-
width: 100%;
|
|
2636
|
-
min-width: 0;
|
|
2637
|
-
min-height: 32px;
|
|
2638
|
-
align-items: center;
|
|
2639
|
-
justify-content: space-between;
|
|
2640
|
-
gap: 10px;
|
|
2641
|
-
}
|
|
2642
|
-
.cf-analytics-visualization__header > div:first-child {
|
|
2643
|
-
min-width: 0;
|
|
2644
|
-
}
|
|
2645
|
-
.cf-analytics-visualization__actions {
|
|
2646
|
-
display: flex;
|
|
2647
|
-
flex: 0 0 auto;
|
|
2648
|
-
align-items: center;
|
|
2649
|
-
gap: 6px;
|
|
2650
|
-
}
|
|
2651
|
-
.cf-analytics-chart-picker {
|
|
2652
|
-
position: relative;
|
|
2653
|
-
display: inline-flex;
|
|
2654
|
-
min-width: 0;
|
|
2655
|
-
color: var(--cf-muted);
|
|
2656
|
-
font-size: 9px;
|
|
2657
|
-
font-weight: 700;
|
|
2658
|
-
}
|
|
2659
|
-
|
|
2660
|
-
.cf-analytics-chart-picker summary {
|
|
2661
|
-
display: inline-flex;
|
|
2662
|
-
min-width: 92px;
|
|
2663
|
-
max-width: 138px;
|
|
2664
|
-
height: 30px;
|
|
2665
|
-
align-items: center;
|
|
2666
|
-
gap: 6px;
|
|
2667
|
-
border: 1px solid var(--cf-border);
|
|
2668
|
-
border-radius: 8px;
|
|
2669
|
-
background: var(--cf-bg);
|
|
2670
|
-
padding: 0 8px;
|
|
2671
|
-
color: var(--cf-text);
|
|
2672
|
-
list-style: none;
|
|
2673
|
-
cursor: pointer;
|
|
2674
|
-
box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
|
|
2675
|
-
transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
|
|
2676
|
-
}
|
|
2677
|
-
|
|
2678
|
-
.cf-analytics-chart-picker summary::-webkit-details-marker { display: none; }
|
|
2679
|
-
.cf-analytics-chart-picker summary:hover,
|
|
2680
|
-
.cf-analytics-chart-picker[open] summary {
|
|
2681
|
-
border-color: var(--cf-accent);
|
|
2682
|
-
background: color-mix(in oklab, var(--cf-accent) 9%, var(--cf-bg));
|
|
2683
|
-
}
|
|
2684
|
-
.cf-analytics-chart-picker summary:focus-visible {
|
|
2685
|
-
outline: 2px solid var(--cf-accent);
|
|
2686
|
-
outline-offset: 2px;
|
|
2687
|
-
}
|
|
2688
|
-
.cf-analytics-chart-picker summary > svg:last-child {
|
|
2689
|
-
width: 13px;
|
|
2690
|
-
height: 13px;
|
|
2691
|
-
flex: 0 0 13px;
|
|
2692
|
-
margin-left: auto;
|
|
2693
|
-
color: var(--cf-muted);
|
|
2694
|
-
transition: transform .16s ease;
|
|
2695
|
-
}
|
|
2696
|
-
.cf-analytics-chart-picker[open] summary > svg:last-child { transform: rotate(180deg); }
|
|
2697
|
-
.cf-analytics-chart-picker__current {
|
|
2698
|
-
display: inline-flex;
|
|
2699
|
-
min-width: 0;
|
|
2700
|
-
align-items: center;
|
|
2701
|
-
gap: 6px;
|
|
2702
|
-
}
|
|
2703
|
-
.cf-analytics-chart-picker__current > span {
|
|
2704
|
-
overflow: hidden;
|
|
2705
|
-
text-overflow: ellipsis;
|
|
2706
|
-
white-space: nowrap;
|
|
2707
|
-
}
|
|
2708
|
-
.cf-chart-type-icon {
|
|
2709
|
-
width: 17px;
|
|
2710
|
-
height: 17px;
|
|
2711
|
-
flex: 0 0 17px;
|
|
2712
|
-
}
|
|
2713
|
-
.cf-analytics-chart-picker__menu {
|
|
2714
|
-
position: absolute;
|
|
2715
|
-
top: calc(100% + 7px);
|
|
2716
|
-
right: 0;
|
|
2717
|
-
z-index: 60;
|
|
2718
|
-
display: grid;
|
|
2719
|
-
min-width: 196px;
|
|
2720
|
-
padding: 6px;
|
|
2721
|
-
border: 1px solid var(--cf-border);
|
|
2722
|
-
border-radius: 12px;
|
|
2723
|
-
background: var(--cf-bg);
|
|
2724
|
-
box-shadow: 0 18px 45px rgba(15, 23, 42, .18);
|
|
2725
|
-
}
|
|
2726
|
-
.cf-analytics-chart-picker__menu button {
|
|
2727
|
-
display: flex;
|
|
2728
|
-
width: 100%;
|
|
2729
|
-
min-height: 46px;
|
|
2730
|
-
align-items: flex-start;
|
|
2731
|
-
gap: 8px;
|
|
2732
|
-
border: 0;
|
|
2733
|
-
border-radius: 9px;
|
|
2734
|
-
background: transparent;
|
|
2735
|
-
padding: 7px;
|
|
2736
|
-
color: var(--cf-text);
|
|
2737
|
-
font: inherit;
|
|
2738
|
-
text-align: left;
|
|
2739
|
-
cursor: pointer;
|
|
2740
|
-
}
|
|
2741
|
-
.cf-analytics-chart-picker__menu button:hover,
|
|
2742
|
-
.cf-analytics-chart-picker__menu button.is-selected {
|
|
2743
|
-
background: color-mix(in oklab, var(--cf-accent) 10%, var(--cf-bg));
|
|
2744
|
-
color: var(--cf-accent);
|
|
2745
|
-
}
|
|
2746
|
-
.cf-analytics-chart-picker__menu button > svg:last-child {
|
|
2747
|
-
width: 13px;
|
|
2748
|
-
height: 13px;
|
|
2749
|
-
flex: 0 0 13px;
|
|
2750
|
-
margin-top: 4px;
|
|
2751
|
-
}
|
|
2752
|
-
.cf-analytics-chart-picker__icon {
|
|
2753
|
-
display: inline-flex;
|
|
2754
|
-
width: 30px;
|
|
2755
|
-
height: 30px;
|
|
2756
|
-
flex: 0 0 30px;
|
|
2757
|
-
align-items: center;
|
|
2758
|
-
justify-content: center;
|
|
2759
|
-
border-radius: 9px;
|
|
2760
|
-
background: var(--cf-bg-soft);
|
|
2761
|
-
box-shadow: inset 0 0 0 1px var(--cf-border);
|
|
2762
|
-
}
|
|
2763
|
-
.cf-analytics-chart-picker__icon .cf-chart-type-icon {
|
|
2764
|
-
width: 25px;
|
|
2765
|
-
height: 25px;
|
|
2766
|
-
flex-basis: 25px;
|
|
2767
|
-
}
|
|
2768
|
-
.cf-analytics-chart-picker__copy {
|
|
2769
|
-
display: grid;
|
|
2770
|
-
min-width: 0;
|
|
2771
|
-
flex: 1;
|
|
2772
|
-
gap: 2px;
|
|
2773
|
-
}
|
|
2774
|
-
.cf-analytics-chart-picker__copy strong {
|
|
2775
|
-
font-size: 10px;
|
|
2776
|
-
line-height: 1.25;
|
|
2777
|
-
}
|
|
2778
|
-
.cf-analytics-chart-picker__copy small {
|
|
2779
|
-
color: var(--cf-muted);
|
|
2780
|
-
font-size: 9px;
|
|
2781
|
-
font-weight: 560;
|
|
2782
|
-
line-height: 1.3;
|
|
2783
|
-
}
|
|
2784
|
-
.cf-analytics-visualization__title {
|
|
2785
|
-
overflow: hidden;
|
|
2786
|
-
color: var(--cf-muted);
|
|
2787
|
-
font-size: 10px;
|
|
2788
|
-
font-weight: 750;
|
|
2789
|
-
letter-spacing: .08em;
|
|
2790
|
-
text-overflow: ellipsis;
|
|
2791
|
-
text-transform: uppercase;
|
|
2792
|
-
white-space: nowrap;
|
|
2793
|
-
}
|
|
2794
|
-
.cf-analytics-meta {
|
|
2795
|
-
display: flex;
|
|
2796
|
-
flex-wrap: wrap;
|
|
2797
|
-
align-items: center;
|
|
2798
|
-
gap: 3px 7px;
|
|
2799
|
-
margin-top: 4px;
|
|
2800
|
-
color: var(--cf-muted);
|
|
2801
|
-
font-size: 9px;
|
|
2802
|
-
line-height: 1.35;
|
|
2803
|
-
}
|
|
2804
|
-
.cf-analytics-meta__dot {
|
|
2805
|
-
display: inline-block;
|
|
2806
|
-
width: 5px;
|
|
2807
|
-
height: 5px;
|
|
2808
|
-
margin-right: 4px;
|
|
2809
|
-
border-radius: 999px;
|
|
2810
|
-
background: var(--cf-accent);
|
|
2811
|
-
}
|
|
2812
|
-
.cf-analytics-visualization__download {
|
|
2813
|
-
width: fit-content;
|
|
2814
|
-
border: 1px solid var(--cf-border) !important;
|
|
2815
|
-
border-radius: 8px;
|
|
2816
|
-
background: var(--cf-surface) !important;
|
|
2817
|
-
padding: 6px 9px;
|
|
2818
|
-
color: var(--cf-text) !important;
|
|
2819
|
-
font-size: 10px;
|
|
2820
|
-
font-weight: 700;
|
|
2821
|
-
}
|
|
2822
|
-
.cf-analytics-visualization__download:hover {
|
|
2823
|
-
border-color: var(--cf-accent) !important;
|
|
2824
|
-
color: var(--cf-accent) !important;
|
|
2825
|
-
}
|
|
2826
|
-
.cf-analytics-table-wrap {
|
|
2827
|
-
box-sizing: border-box;
|
|
2828
|
-
width: 100%;
|
|
2829
|
-
max-width: 100%;
|
|
2830
|
-
margin-top: 9px;
|
|
2831
|
-
max-height: 210px;
|
|
2832
|
-
overflow: auto;
|
|
2833
|
-
border: 1px solid var(--cf-border);
|
|
2834
|
-
border-radius: 9px;
|
|
2835
|
-
scrollbar-width: thin;
|
|
2836
|
-
}
|
|
2837
|
-
.cf-analytics-visualization.is-expanded .cf-analytics-table-wrap {
|
|
2838
|
-
min-height: 0;
|
|
2839
|
-
max-height: none;
|
|
2840
|
-
flex: 1;
|
|
2841
|
-
margin-top: 14px;
|
|
2842
|
-
}
|
|
2843
|
-
.cf-analytics-table {
|
|
2844
|
-
width: 100%;
|
|
2845
|
-
border-collapse: collapse;
|
|
2846
|
-
color: var(--cf-text);
|
|
2847
|
-
font-size: 10px;
|
|
2848
|
-
white-space: nowrap;
|
|
2849
|
-
}
|
|
2850
|
-
.cf-analytics-table th,
|
|
2851
|
-
.cf-analytics-table td {
|
|
2852
|
-
border-bottom: 1px solid var(--cf-border);
|
|
2853
|
-
padding: 8px 9px;
|
|
2854
|
-
text-align: left;
|
|
2855
|
-
}
|
|
2856
|
-
.cf-analytics-table th {
|
|
2857
|
-
position: sticky;
|
|
2858
|
-
top: 0;
|
|
2859
|
-
background: var(--cf-surface-2);
|
|
2860
|
-
color: var(--cf-muted);
|
|
2861
|
-
font-weight: 700;
|
|
2862
|
-
text-transform: capitalize;
|
|
2863
|
-
}
|
|
2864
|
-
.cf-analytics-table tbody tr:last-child td { border-bottom: 0; }
|
|
2865
|
-
.cf-analytics-table-note {
|
|
2866
|
-
margin: 7px 2px 0;
|
|
2867
|
-
color: var(--cf-muted);
|
|
2868
|
-
font-size: 9px;
|
|
2869
|
-
line-height: 1.4;
|
|
2870
|
-
}
|
|
2871
|
-
.cf-data-table {
|
|
2872
|
-
display: flex;
|
|
2873
|
-
min-width: 0;
|
|
2874
|
-
min-height: 0;
|
|
2875
|
-
flex: 1;
|
|
2876
|
-
flex-direction: column;
|
|
2877
|
-
margin-top: 10px;
|
|
2878
|
-
overflow: hidden;
|
|
2879
|
-
border: 1px solid var(--cf-border);
|
|
2880
|
-
border-radius: 9px;
|
|
2881
|
-
background: var(--cf-bg);
|
|
2882
|
-
}
|
|
2883
|
-
.cf-table-fields {
|
|
2884
|
-
display: flex;
|
|
2885
|
-
min-width: 0;
|
|
2886
|
-
min-height: 38px;
|
|
2887
|
-
align-items: center;
|
|
2888
|
-
gap: 6px;
|
|
2889
|
-
padding: 7px 8px;
|
|
2890
|
-
border-bottom: 1px solid var(--cf-border);
|
|
2891
|
-
color: var(--cf-muted);
|
|
2892
|
-
font-size: 9px;
|
|
2893
|
-
}
|
|
2894
|
-
.cf-table-fields > strong {
|
|
2895
|
-
flex: 0 0 auto;
|
|
2896
|
-
color: var(--cf-muted);
|
|
2897
|
-
font-size: 8px;
|
|
2898
|
-
letter-spacing: .06em;
|
|
2899
|
-
text-transform: uppercase;
|
|
2900
|
-
}
|
|
2901
|
-
.cf-field-list {
|
|
2902
|
-
display: flex;
|
|
2903
|
-
min-width: 0;
|
|
2904
|
-
gap: 5px;
|
|
2905
|
-
overflow: auto hidden;
|
|
2906
|
-
scrollbar-width: none;
|
|
2907
|
-
}
|
|
2908
|
-
.cf-field-chip {
|
|
2909
|
-
flex: 0 0 auto;
|
|
2910
|
-
padding: 4px 6px;
|
|
2911
|
-
border-radius: 6px;
|
|
2912
|
-
background: color-mix(in srgb, var(--cf-accent) 11%, var(--cf-bg));
|
|
2913
|
-
color: var(--cf-accent);
|
|
2914
|
-
font-weight: 650;
|
|
2915
|
-
}
|
|
2916
|
-
.cf-table-field-count { margin-left: auto;white-space: nowrap; }
|
|
2917
|
-
.cf-table-controls {
|
|
2918
|
-
display: grid;
|
|
2919
|
-
grid-template-columns: minmax(110px, 1fr) auto;
|
|
2920
|
-
gap: 6px;
|
|
2921
|
-
padding: 7px 8px 5px;
|
|
2922
|
-
}
|
|
2923
|
-
.cf-table-search {
|
|
2924
|
-
display: flex;
|
|
2925
|
-
min-width: 0;
|
|
2926
|
-
align-items: center;
|
|
2927
|
-
gap: 5px;
|
|
2928
|
-
padding: 0 7px;
|
|
2929
|
-
border: 1px solid var(--cf-border);
|
|
2930
|
-
border-radius: 7px;
|
|
2931
|
-
background: var(--cf-bg);
|
|
2932
|
-
color: var(--cf-muted);
|
|
2933
|
-
}
|
|
2934
|
-
.cf-table-search input {
|
|
2935
|
-
width: 100%;
|
|
2936
|
-
min-width: 0;
|
|
2937
|
-
height: 28px;
|
|
2938
|
-
border: 0;
|
|
2939
|
-
outline: 0;
|
|
2940
|
-
background: transparent;
|
|
2941
|
-
color: var(--cf-text);
|
|
2942
|
-
font: 500 9px/1 var(--cf-font);
|
|
2943
|
-
}
|
|
2944
|
-
.cf-table-modes {
|
|
2945
|
-
display: inline-flex;
|
|
2946
|
-
padding: 2px;
|
|
2947
|
-
border: 1px solid var(--cf-border);
|
|
2948
|
-
border-radius: 8px;
|
|
2949
|
-
background: var(--cf-surface);
|
|
2950
|
-
}
|
|
2951
|
-
.cf-segment {
|
|
2952
|
-
min-height: 26px;
|
|
2953
|
-
border-radius: 6px;
|
|
2954
|
-
padding: 0 7px !important;
|
|
2955
|
-
color: var(--cf-muted) !important;
|
|
2956
|
-
font-size: 9px;
|
|
2957
|
-
font-weight: 650;
|
|
2958
|
-
}
|
|
2959
|
-
.cf-segment.is-active { background: var(--cf-accent) !important;color: var(--cf-accent-ink) !important; }
|
|
2960
|
-
.cf-table-column-bar { display: flex;align-items: center;padding: 0 8px 7px; }
|
|
2961
|
-
.cf-column-picker { position: relative; }
|
|
2962
|
-
.cf-column-picker > summary {
|
|
2963
|
-
min-height: 27px;
|
|
2964
|
-
padding: 6px 8px;
|
|
2965
|
-
border: 1px solid var(--cf-border);
|
|
2966
|
-
border-radius: 7px;
|
|
2967
|
-
cursor: pointer;
|
|
2968
|
-
list-style: none;
|
|
2969
|
-
color: var(--cf-text);
|
|
2970
|
-
font-size: 9px;
|
|
2971
|
-
font-weight: 650;
|
|
2972
|
-
}
|
|
2973
|
-
.cf-column-picker > summary::-webkit-details-marker { display: none; }
|
|
2974
|
-
.cf-column-menu {
|
|
2975
|
-
position: absolute;
|
|
2976
|
-
z-index: 5;
|
|
2977
|
-
top: calc(100% + 4px);
|
|
2978
|
-
left: 0;
|
|
2979
|
-
display: grid;
|
|
2980
|
-
min-width: 160px;
|
|
2981
|
-
gap: 6px;
|
|
2982
|
-
padding: 9px;
|
|
2983
|
-
border: 1px solid var(--cf-border);
|
|
2984
|
-
border-radius: 8px;
|
|
2985
|
-
background: var(--cf-bg);
|
|
2986
|
-
box-shadow: 0 10px 24px rgba(15,30,42,.16);
|
|
2987
|
-
}
|
|
2988
|
-
.cf-column-menu label { display: flex;align-items: center;gap: 7px;color: var(--cf-text);font-size: 9px; }
|
|
2989
|
-
.cf-table-wrap {
|
|
2990
|
-
position: relative;
|
|
2991
|
-
min-height: 0;
|
|
2992
|
-
max-height: 210px;
|
|
2993
|
-
overflow: auto;
|
|
2994
|
-
border-top: 1px solid var(--cf-border);
|
|
2995
|
-
scrollbar-width: thin;
|
|
2996
|
-
}
|
|
2997
|
-
.cf-analytics-visualization.is-expanded .cf-table-wrap { max-height: none;flex: 1; }
|
|
2998
|
-
.cf-table { width: 100%;border-collapse: separate;border-spacing: 0;color: var(--cf-text);font-size: 10px; }
|
|
2999
|
-
.cf-table th { position: sticky;top: 0;z-index: 1;background: var(--cf-surface);color: var(--cf-muted);font-size: 9px;font-weight: 720;text-align: left; }
|
|
3000
|
-
.cf-table th,.cf-table td { padding: 8px 9px;border-bottom: 1px solid var(--cf-border);white-space: nowrap; }
|
|
3001
|
-
.cf-table .cf-select-cell { width: 28px;padding-right: 3px;text-align: center; }
|
|
3002
|
-
.cf-table input[type="checkbox"],.cf-column-menu input[type="checkbox"] { width: 13px;height: 13px;accent-color: var(--cf-accent); }
|
|
3003
|
-
.cf-table-sort { display: flex !important;width: 100%;align-items: center;gap: 5px;color: inherit !important;font: inherit;text-align: left; }
|
|
3004
|
-
.cf-sort-direction { color: var(--cf-muted);font-size: 10px; }
|
|
3005
|
-
.cf-table.is-matrix tbody td:not(.cf-select-cell) { background: color-mix(in srgb,var(--cf-accent) 7%,var(--cf-bg)); }
|
|
3006
|
-
.cf-table tbody tr:hover,.cf-table tbody tr.is-selected { background: color-mix(in srgb,var(--cf-accent) 10%,var(--cf-bg)); }
|
|
3007
|
-
.cf-table tbody tr.is-selected td:first-child { box-shadow: inset 3px 0 0 var(--cf-accent); }
|
|
3008
|
-
.cf-show-more { position: sticky;left: 50%;bottom: 6px;transform: translateX(-50%);margin: 8px auto;padding: 6px 9px !important;border: 1px solid var(--cf-border) !important;border-radius: 7px;background: var(--cf-bg) !important;font-size: 9px;font-weight: 650; }
|
|
3009
|
-
.cf-table-summary { display: flex;align-items: center;justify-content: space-between;gap: 8px;padding: 7px 9px;color: var(--cf-muted);font-size: 8px; }
|
|
3010
|
-
.cf-visually-hidden { position: absolute;width: 1px;height: 1px;overflow: hidden;clip: rect(0 0 0 0); }
|
|
3011
|
-
@media (max-width: 430px) {
|
|
3012
|
-
.cf-table-modes { display: none; }
|
|
3013
|
-
.cf-table-controls { grid-template-columns: 1fr; }
|
|
3014
|
-
.cf-table-summary span:last-child { display: none; }
|
|
3015
|
-
}
|
|
3016
|
-
.cf-analytics-visualization__expand,
|
|
3017
|
-
.cf-analytics-visualization__close {
|
|
3018
|
-
display: grid;
|
|
3019
|
-
width: 30px;
|
|
3020
|
-
height: 30px;
|
|
3021
|
-
flex: 0 0 auto;
|
|
3022
|
-
place-items: center;
|
|
3023
|
-
border: 1px solid var(--cf-border) !important;
|
|
3024
|
-
border-radius: 9px;
|
|
3025
|
-
background: var(--cf-bg) !important;
|
|
3026
|
-
color: var(--cf-text) !important;
|
|
3027
|
-
}
|
|
3028
|
-
.cf-analytics-visualization__expand:hover,
|
|
3029
|
-
.cf-analytics-visualization__close:hover { background: var(--cf-surface-2) !important; }
|
|
3030
|
-
.cf-analytics-visualization__expand:focus-visible,
|
|
3031
|
-
.cf-analytics-visualization__close:focus-visible {
|
|
3032
|
-
outline: 2px solid var(--cf-accent);
|
|
3033
|
-
outline-offset: 2px;
|
|
3034
|
-
}
|
|
3035
|
-
.cf-analytics-visualization__expand svg,
|
|
3036
|
-
.cf-analytics-visualization__close svg { width: 15px; height: 15px; }
|
|
3037
|
-
.cf-analytics-visualization__kpi {
|
|
3038
|
-
padding: 8px 0 6px;
|
|
3039
|
-
color: var(--cf-text);
|
|
3040
|
-
font-size: 30px;
|
|
3041
|
-
font-weight: 750;
|
|
3042
|
-
letter-spacing: -.035em;
|
|
3043
|
-
}
|
|
3044
|
-
.cf-analytics-kpi {
|
|
3045
|
-
padding: 9px 0 5px;
|
|
3046
|
-
}
|
|
3047
|
-
.cf-analytics-kpi__label {
|
|
3048
|
-
color: var(--cf-muted);
|
|
3049
|
-
font-size: 9px;
|
|
3050
|
-
font-weight: 700;
|
|
3051
|
-
letter-spacing: .06em;
|
|
3052
|
-
text-transform: uppercase;
|
|
3053
|
-
}
|
|
3054
|
-
.cf-analytics-kpi__value {
|
|
3055
|
-
margin-top: 5px;
|
|
3056
|
-
color: var(--cf-text);
|
|
3057
|
-
font-size: 30px;
|
|
3058
|
-
font-weight: 750;
|
|
3059
|
-
letter-spacing: -.035em;
|
|
3060
|
-
line-height: 1;
|
|
3061
|
-
}
|
|
3062
|
-
.cf-analytics-empty {
|
|
3063
|
-
margin-top: 8px;
|
|
3064
|
-
border: 1px dashed var(--cf-border);
|
|
3065
|
-
border-radius: 11px;
|
|
3066
|
-
padding: 18px 14px;
|
|
3067
|
-
color: var(--cf-text);
|
|
3068
|
-
text-align: center;
|
|
3069
|
-
}
|
|
3070
|
-
.cf-analytics-empty p { margin: 0; }
|
|
3071
|
-
.cf-analytics-empty p + p {
|
|
3072
|
-
margin-top: 4px;
|
|
3073
|
-
color: var(--cf-muted);
|
|
3074
|
-
font-size: 10px;
|
|
3075
|
-
}
|
|
3076
|
-
.cf-analytics-echart {
|
|
3077
|
-
position: relative;
|
|
3078
|
-
width: 100%;
|
|
3079
|
-
height: 196px;
|
|
3080
|
-
min-width: 0;
|
|
3081
|
-
}
|
|
3082
|
-
.cf-analytics-visualization.is-expanded .cf-analytics-echart {
|
|
3083
|
-
height: auto;
|
|
3084
|
-
min-height: 310px;
|
|
3085
|
-
flex: 1;
|
|
3086
|
-
}
|
|
3087
|
-
.cf-analytics-echart canvas:focus-visible {
|
|
3088
|
-
outline: 2px solid var(--cf-accent);
|
|
3089
|
-
outline-offset: -2px;
|
|
3090
|
-
}
|
|
3091
|
-
.cf-analytics-echart__fallback {
|
|
3092
|
-
display: grid;
|
|
3093
|
-
height: 100%;
|
|
3094
|
-
place-items: center;
|
|
3095
|
-
border: 1px dashed var(--cf-border);
|
|
3096
|
-
border-radius: 9px;
|
|
3097
|
-
padding: 16px;
|
|
3098
|
-
color: var(--cf-muted);
|
|
3099
|
-
text-align: center;
|
|
3100
|
-
line-height: 1.5;
|
|
3101
|
-
}
|
|
3102
|
-
.cf-analytics-zoom {
|
|
3103
|
-
display: flex;
|
|
3104
|
-
min-width: 0;
|
|
3105
|
-
align-items: center;
|
|
3106
|
-
justify-content: space-between;
|
|
3107
|
-
gap: 8px;
|
|
3108
|
-
margin-top: 4px;
|
|
3109
|
-
border-top: 1px solid var(--cf-border);
|
|
3110
|
-
padding-top: 8px;
|
|
3111
|
-
}
|
|
3112
|
-
.cf-analytics-zoom__range {
|
|
3113
|
-
min-width: 0;
|
|
3114
|
-
overflow: hidden;
|
|
3115
|
-
color: var(--cf-muted);
|
|
3116
|
-
font-size: 10px;
|
|
3117
|
-
font-weight: 650;
|
|
3118
|
-
line-height: 1.3;
|
|
3119
|
-
text-overflow: ellipsis;
|
|
3120
|
-
white-space: nowrap;
|
|
3121
|
-
}
|
|
3122
|
-
.cf-analytics-zoom__controls {
|
|
3123
|
-
display: inline-flex;
|
|
3124
|
-
flex: 0 0 auto;
|
|
3125
|
-
align-items: center;
|
|
3126
|
-
overflow: hidden;
|
|
3127
|
-
border: 1px solid var(--cf-border);
|
|
3128
|
-
border-radius: 9px;
|
|
3129
|
-
background: var(--cf-bg);
|
|
3130
|
-
}
|
|
3131
|
-
.cf-analytics-zoom__controls button {
|
|
3132
|
-
display: grid;
|
|
3133
|
-
min-width: 40px;
|
|
3134
|
-
height: 40px;
|
|
3135
|
-
place-items: center;
|
|
3136
|
-
border: 0 !important;
|
|
3137
|
-
border-radius: 0;
|
|
3138
|
-
background: transparent !important;
|
|
3139
|
-
color: var(--cf-text) !important;
|
|
3140
|
-
font: inherit;
|
|
3141
|
-
font-size: 16px;
|
|
3142
|
-
font-weight: 700;
|
|
3143
|
-
line-height: 1;
|
|
3144
|
-
}
|
|
3145
|
-
.cf-analytics-zoom__controls button + button { border-left: 1px solid var(--cf-border) !important; }
|
|
3146
|
-
.cf-analytics-zoom__controls button:hover:not(:disabled) { background: var(--cf-surface-2) !important; }
|
|
3147
|
-
.cf-analytics-zoom__controls button:focus-visible {
|
|
3148
|
-
position: relative;
|
|
3149
|
-
z-index: 1;
|
|
3150
|
-
outline: 2px solid var(--cf-accent);
|
|
3151
|
-
outline-offset: -2px;
|
|
3152
|
-
}
|
|
3153
|
-
.cf-analytics-zoom__controls button:disabled { cursor: not-allowed; opacity: .38; }
|
|
3154
|
-
.cf-analytics-zoom__controls .cf-analytics-zoom__reset {
|
|
3155
|
-
min-width: 56px;
|
|
3156
|
-
padding: 0 10px;
|
|
3157
|
-
font-size: 10px;
|
|
3158
|
-
font-weight: 700;
|
|
3159
|
-
}
|
|
3160
|
-
.cf-analytics-focus {
|
|
3161
|
-
height: 100%;
|
|
3162
|
-
min-height: 0;
|
|
3163
|
-
overflow: auto;
|
|
3164
|
-
background: var(--cf-bg);
|
|
3165
|
-
padding: 18px;
|
|
3166
|
-
}
|
|
3167
|
-
@media (min-width: 640px) {
|
|
3168
|
-
.cf-panel.cf-panel--analytics-focus {
|
|
3169
|
-
grid-template-columns: minmax(0, 1fr);
|
|
3170
|
-
grid-template-rows: auto minmax(0, 1fr);
|
|
3171
|
-
grid-template-areas: 'header' 'video';
|
|
3172
|
-
}
|
|
3173
|
-
.cf-panel--analytics-focus .cf-panel__video { height: 100%; }
|
|
3174
|
-
.cf-panel--analytics-focus .cf-panel__chat { display: none; }
|
|
3175
|
-
}
|
|
3176
|
-
.cf-analytics-explanation {
|
|
3177
|
-
margin-top: 10px;
|
|
3178
|
-
overflow: hidden;
|
|
3179
|
-
border: 1px solid var(--cf-border);
|
|
3180
|
-
border-radius: 12px;
|
|
3181
|
-
background: var(--cf-surface);
|
|
3182
|
-
color: var(--cf-text);
|
|
3183
|
-
font-size: 12px;
|
|
3184
|
-
line-height: 1.55;
|
|
3185
|
-
}
|
|
3186
|
-
.cf-analytics-explanation h3,
|
|
3187
|
-
.cf-analytics-explanation h4,
|
|
3188
|
-
.cf-analytics-explanation p { margin: 0; }
|
|
3189
|
-
.cf-analytics-explanation__lead {
|
|
3190
|
-
border-bottom: 1px solid var(--cf-border);
|
|
3191
|
-
padding: 12px;
|
|
3192
|
-
}
|
|
3193
|
-
.cf-analytics-explanation__lead-meta {
|
|
3194
|
-
display: flex;
|
|
3195
|
-
flex-wrap: wrap;
|
|
3196
|
-
align-items: center;
|
|
3197
|
-
gap: 5px 8px;
|
|
3198
|
-
}
|
|
3199
|
-
.cf-analytics-explanation__eyebrow {
|
|
3200
|
-
color: var(--cf-accent);
|
|
3201
|
-
font-size: 9px;
|
|
3202
|
-
font-weight: 750;
|
|
3203
|
-
letter-spacing: .1em;
|
|
3204
|
-
text-transform: uppercase;
|
|
3205
|
-
}
|
|
3206
|
-
.cf-analytics-explanation__provenance {
|
|
3207
|
-
display: inline-flex;
|
|
3208
|
-
align-items: center;
|
|
3209
|
-
gap: 5px;
|
|
3210
|
-
color: var(--cf-muted);
|
|
3211
|
-
font-size: 9px;
|
|
3212
|
-
font-weight: 650;
|
|
3213
|
-
}
|
|
3214
|
-
.cf-analytics-explanation__provenance-dot {
|
|
3215
|
-
width: 5px;
|
|
3216
|
-
height: 5px;
|
|
3217
|
-
border-radius: 999px;
|
|
3218
|
-
background: var(--cf-accent);
|
|
3219
|
-
}
|
|
3220
|
-
.cf-analytics-explanation__headline {
|
|
3221
|
-
margin-top: 8px !important;
|
|
3222
|
-
color: var(--cf-text);
|
|
3223
|
-
font-size: 15px;
|
|
3224
|
-
font-weight: 750;
|
|
3225
|
-
letter-spacing: -.012em;
|
|
3226
|
-
line-height: 1.45;
|
|
3227
|
-
}
|
|
3228
|
-
.cf-analytics-explanation__summary {
|
|
3229
|
-
margin-top: 5px !important;
|
|
3230
|
-
color: var(--cf-muted);
|
|
3231
|
-
font-size: 12px;
|
|
3232
|
-
line-height: 1.6;
|
|
3233
|
-
}
|
|
3234
|
-
.cf-analytics-explanation__body {
|
|
3235
|
-
display: grid;
|
|
3236
|
-
gap: 14px;
|
|
3237
|
-
padding: 12px;
|
|
3238
|
-
}
|
|
3239
|
-
.cf-analytics-explanation__status { color: var(--cf-muted); }
|
|
3240
|
-
.cf-analytics-explanation__error {
|
|
3241
|
-
border-radius: 8px;
|
|
3242
|
-
background: color-mix(in srgb, #d97706 10%, var(--cf-surface));
|
|
3243
|
-
padding: 9px 10px;
|
|
3244
|
-
color: var(--cf-text);
|
|
3245
|
-
}
|
|
3246
|
-
.cf-analytics-explanation__heading {
|
|
3247
|
-
color: var(--cf-text);
|
|
3248
|
-
font-size: 12px;
|
|
3249
|
-
font-weight: 750;
|
|
3250
|
-
line-height: 1.45;
|
|
3251
|
-
}
|
|
3252
|
-
.cf-analytics-explanation__evidence {
|
|
3253
|
-
display: grid;
|
|
3254
|
-
gap: 7px;
|
|
3255
|
-
margin: 8px 0 0;
|
|
3256
|
-
padding: 0;
|
|
3257
|
-
list-style: none;
|
|
3258
|
-
color: var(--cf-muted);
|
|
3259
|
-
}
|
|
3260
|
-
.cf-analytics-explanation__evidence-item {
|
|
3261
|
-
display: flex;
|
|
3262
|
-
gap: 8px;
|
|
3263
|
-
align-items: flex-start;
|
|
3264
|
-
}
|
|
3265
|
-
.cf-analytics-explanation__evidence-bullet {
|
|
3266
|
-
width: 5px;
|
|
3267
|
-
height: 5px;
|
|
3268
|
-
flex: 0 0 auto;
|
|
3269
|
-
margin-top: 7px;
|
|
3270
|
-
border-radius: 999px;
|
|
3271
|
-
background: var(--cf-accent);
|
|
3272
|
-
}
|
|
3273
|
-
.cf-analytics-explanation__meaning {
|
|
3274
|
-
border-left: 2px solid var(--cf-accent);
|
|
3275
|
-
border-radius: 0 8px 8px 0;
|
|
3276
|
-
background: color-mix(in srgb, var(--cf-accent) 7%, var(--cf-surface));
|
|
3277
|
-
padding: 10px 11px;
|
|
3278
|
-
}
|
|
3279
|
-
.cf-analytics-explanation__paragraph {
|
|
3280
|
-
margin-top: 5px !important;
|
|
3281
|
-
color: var(--cf-muted);
|
|
3282
|
-
}
|
|
3283
|
-
.cf-analytics-explanation__section-heading,
|
|
3284
|
-
.cf-analytics-explanation__outlook-header {
|
|
3285
|
-
display: flex;
|
|
3286
|
-
flex-wrap: wrap;
|
|
3287
|
-
align-items: baseline;
|
|
3288
|
-
justify-content: space-between;
|
|
3289
|
-
gap: 4px 8px;
|
|
3290
|
-
}
|
|
3291
|
-
.cf-analytics-explanation__hint,
|
|
3292
|
-
.cf-analytics-explanation__outlook-badge {
|
|
3293
|
-
color: var(--cf-muted);
|
|
3294
|
-
font-size: 9px;
|
|
3295
|
-
font-weight: 650;
|
|
3296
|
-
}
|
|
3297
|
-
.cf-analytics-explanation__outlook-badge {
|
|
3298
|
-
color: var(--cf-accent);
|
|
3299
|
-
letter-spacing: .06em;
|
|
3300
|
-
text-transform: uppercase;
|
|
3301
|
-
}
|
|
3302
|
-
.cf-analytics-explanation__drivers,
|
|
3303
|
-
.cf-analytics-explanation__recommendations {
|
|
3304
|
-
display: grid;
|
|
3305
|
-
gap: 7px;
|
|
3306
|
-
margin-top: 8px;
|
|
3307
|
-
}
|
|
3308
|
-
.cf-analytics-explanation__driver {
|
|
3309
|
-
border-radius: 8px;
|
|
3310
|
-
background: var(--cf-bg);
|
|
3311
|
-
padding: 9px 10px;
|
|
3312
|
-
}
|
|
3313
|
-
.cf-analytics-explanation__driver-title,
|
|
3314
|
-
.cf-analytics-explanation__recommendation-title {
|
|
3315
|
-
color: var(--cf-text);
|
|
3316
|
-
font-weight: 750;
|
|
3317
|
-
}
|
|
3318
|
-
.cf-analytics-explanation__driver-body,
|
|
3319
|
-
.cf-analytics-explanation__recommendation-body {
|
|
3320
|
-
margin-top: 3px !important;
|
|
3321
|
-
color: var(--cf-muted);
|
|
3322
|
-
font-size: 11px;
|
|
3323
|
-
}
|
|
3324
|
-
.cf-analytics-explanation__driver-label { color: var(--cf-text); font-weight: 700; }
|
|
3325
|
-
.cf-analytics-explanation__recommendation {
|
|
3326
|
-
display: grid;
|
|
3327
|
-
grid-template-columns: 22px minmax(0, 1fr);
|
|
3328
|
-
gap: 8px;
|
|
3329
|
-
border-radius: 8px;
|
|
3330
|
-
background: var(--cf-bg);
|
|
3331
|
-
padding: 9px 10px;
|
|
3332
|
-
}
|
|
3333
|
-
.cf-analytics-explanation__recommendation-index {
|
|
3334
|
-
display: grid;
|
|
3335
|
-
width: 22px;
|
|
3336
|
-
height: 22px;
|
|
3337
|
-
place-items: center;
|
|
3338
|
-
border-radius: 999px;
|
|
3339
|
-
background: color-mix(in srgb, var(--cf-accent) 12%, var(--cf-surface));
|
|
3340
|
-
color: var(--cf-accent);
|
|
3341
|
-
font-size: 10px;
|
|
3342
|
-
font-weight: 750;
|
|
3343
|
-
}
|
|
3344
|
-
.cf-analytics-explanation__outlook {
|
|
3345
|
-
border-radius: 8px;
|
|
3346
|
-
background: var(--cf-bg);
|
|
3347
|
-
padding: 10px 11px;
|
|
3348
|
-
}
|
|
3349
|
-
.cf-analytics-explanation__follow-up {
|
|
3350
|
-
border-top: 1px solid var(--cf-border);
|
|
3351
|
-
padding-top: 12px;
|
|
3352
|
-
}
|
|
3353
|
-
.cf-analytics-explanation__questions {
|
|
3354
|
-
display: grid;
|
|
3355
|
-
gap: 6px;
|
|
3356
|
-
margin-top: 8px;
|
|
3357
|
-
}
|
|
3358
|
-
.cf-analytics-explanation__question {
|
|
3359
|
-
width: 100%;
|
|
3360
|
-
border: 1px solid var(--cf-border);
|
|
3361
|
-
border-radius: 8px;
|
|
3362
|
-
background: var(--cf-bg);
|
|
3363
|
-
padding: 8px 9px;
|
|
3364
|
-
color: var(--cf-text);
|
|
3365
|
-
font: inherit;
|
|
3366
|
-
text-align: left;
|
|
3367
|
-
cursor: pointer;
|
|
3368
|
-
}
|
|
3369
|
-
.cf-analytics-explanation__question:hover {
|
|
3370
|
-
border-color: color-mix(in srgb, var(--cf-accent) 45%, var(--cf-border));
|
|
3371
|
-
background: color-mix(in srgb, var(--cf-accent) 6%, var(--cf-bg));
|
|
3372
|
-
}
|
|
3373
|
-
.cf-analytics-explanation__question:focus-visible,
|
|
3374
|
-
.cf-analytics-explanation__limits-summary:focus-visible {
|
|
3375
|
-
outline: 2px solid var(--cf-accent);
|
|
3376
|
-
outline-offset: 2px;
|
|
3377
|
-
}
|
|
3378
|
-
.cf-analytics-explanation__limits {
|
|
3379
|
-
border-top: 1px solid var(--cf-border);
|
|
3380
|
-
padding-top: 10px;
|
|
3381
|
-
}
|
|
3382
|
-
.cf-analytics-explanation__limits-summary {
|
|
3383
|
-
cursor: pointer;
|
|
3384
|
-
color: var(--cf-text);
|
|
3385
|
-
font-weight: 700;
|
|
3386
|
-
}
|
|
3387
|
-
.cf-analytics-explanation__limits-list {
|
|
3388
|
-
margin: 8px 0 0;
|
|
3389
|
-
padding-left: 17px;
|
|
3390
|
-
color: var(--cf-muted);
|
|
3391
|
-
}
|
|
3392
|
-
.cf-analytics-explanation__source {
|
|
3393
|
-
border-top: 1px solid var(--cf-border);
|
|
3394
|
-
margin: 0;
|
|
3395
|
-
padding: 9px 12px;
|
|
3396
|
-
color: var(--cf-muted);
|
|
3397
|
-
font-size: 10px;
|
|
3398
|
-
}
|
|
3399
|
-
|
|
3400
|
-
@media (max-width: 639px) {
|
|
3401
|
-
.cf-panel.cf-panel--analytics-focus {
|
|
3402
|
-
inset: 12px;
|
|
3403
|
-
width: auto;
|
|
3404
|
-
height: auto;
|
|
3405
|
-
min-height: 0;
|
|
3406
|
-
max-width: none;
|
|
3407
|
-
max-height: none;
|
|
3408
|
-
grid-template-rows: auto minmax(0, 1fr);
|
|
3409
|
-
grid-template-areas: 'header' 'video';
|
|
3410
|
-
transform-origin: center;
|
|
3411
|
-
}
|
|
3412
|
-
.cf-panel--analytics-focus .cf-panel__video { height: 100%; }
|
|
3413
|
-
.cf-panel--analytics-focus .cf-panel__chat { display: none; }
|
|
3414
|
-
.cf-analytics-focus { padding: 14px; }
|
|
3415
|
-
.cf-analytics-visualization.is-expanded .cf-analytics-echart { min-height: 260px; }
|
|
3416
|
-
}
|
|
3417
|
-
|
|
3418
|
-
/* Production embed hardening: dynamic mobile viewports, safe areas, and touch. */
|
|
3419
|
-
@supports (height: 100dvh) {
|
|
3420
|
-
.cf-panel { height: min(88dvh, 820px); max-height: calc(100dvh - 40px); }
|
|
3421
|
-
.cf-panel.cf-panel--call { height: min(90dvh, 840px); }
|
|
3422
|
-
.cf-panel.cf-panel--voice-connecting { height: min(72dvh, 560px); }
|
|
3423
|
-
}
|
|
3424
|
-
.cf-history__footer {
|
|
3425
|
-
flex: 0 0 auto;
|
|
3426
|
-
border-top: 1px solid var(--cf-border);
|
|
3427
|
-
padding: 10px 12px;
|
|
3428
|
-
}
|
|
3429
|
-
.cf-history__clear {
|
|
3430
|
-
width: 100%;
|
|
3431
|
-
min-height: 38px;
|
|
3432
|
-
border-radius: 9px !important;
|
|
3433
|
-
color: var(--cf-danger) !important;
|
|
3434
|
-
font-size: 12px;
|
|
3435
|
-
font-weight: 700;
|
|
3436
|
-
}
|
|
3437
|
-
.cf-history__clear:hover { background: color-mix(in srgb, var(--cf-danger) 8%, var(--cf-bg)) !important; }
|
|
3438
|
-
.cf-history__clear:focus-visible { outline: 2px solid var(--cf-danger); outline-offset: 2px; }
|
|
3439
|
-
.cf-footer__privacy {
|
|
3440
|
-
border-radius: 5px !important;
|
|
3441
|
-
color: inherit !important;
|
|
3442
|
-
font: inherit;
|
|
3443
|
-
text-decoration: underline;
|
|
3444
|
-
text-underline-offset: 2px;
|
|
3445
|
-
}
|
|
3446
|
-
.cf-footer__privacy:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 2px; }
|
|
3447
|
-
.cf-composer.is-dragging { box-shadow: inset 0 0 0 2px var(--cf-accent); }
|
|
3448
|
-
.cf-attach-status { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
|
|
3449
|
-
.cf-attach-status button {
|
|
3450
|
-
min-height: 28px;
|
|
3451
|
-
border-radius: 7px !important;
|
|
3452
|
-
padding: 0 8px !important;
|
|
3453
|
-
color: var(--cf-accent) !important;
|
|
3454
|
-
font-size: 11px;
|
|
3455
|
-
font-weight: 700;
|
|
3456
|
-
}
|
|
3457
|
-
.cf-attach-preview {
|
|
3458
|
-
width: 32px;
|
|
3459
|
-
height: 32px;
|
|
3460
|
-
flex: 0 0 32px;
|
|
3461
|
-
border-radius: 7px;
|
|
3462
|
-
object-fit: cover;
|
|
3463
|
-
}
|
|
3464
|
-
.cf-attach-copy { display: grid; min-width: 0; gap: 1px; }
|
|
3465
|
-
.cf-attach-copy > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
3466
|
-
.cf-attach-copy small { color: var(--cf-muted); font-size: 9px; font-weight: 600; }
|
|
3467
|
-
|
|
3468
|
-
@media (max-width: 639px) {
|
|
3469
|
-
.cf-panel {
|
|
3470
|
-
top: max(8px, env(safe-area-inset-top));
|
|
3471
|
-
right: max(8px, env(safe-area-inset-right));
|
|
3472
|
-
bottom: max(8px, env(safe-area-inset-bottom));
|
|
3473
|
-
left: max(8px, env(safe-area-inset-left));
|
|
3474
|
-
width: auto;
|
|
3475
|
-
height: auto;
|
|
3476
|
-
min-height: 0;
|
|
3477
|
-
max-width: none;
|
|
3478
|
-
max-height: none;
|
|
3479
|
-
border-radius: 16px;
|
|
3480
|
-
}
|
|
3481
|
-
.cf-launcher {
|
|
3482
|
-
right: max(var(--cf-h-pad, 20px), env(safe-area-inset-right));
|
|
3483
|
-
bottom: max(var(--cf-v-pad, 20px), env(safe-area-inset-bottom));
|
|
3484
|
-
}
|
|
3485
|
-
.cf-root[data-align='left'] .cf-launcher {
|
|
3486
|
-
right: auto;
|
|
3487
|
-
left: max(var(--cf-h-pad, 20px), env(safe-area-inset-left));
|
|
3488
|
-
}
|
|
3489
|
-
.cf-root[data-align='left'] .cf-panel {
|
|
3490
|
-
right: max(8px, env(safe-area-inset-right));
|
|
3491
|
-
left: max(8px, env(safe-area-inset-left));
|
|
3492
|
-
}
|
|
3493
|
-
.cf-panel.cf-panel--call,
|
|
3494
|
-
.cf-panel.cf-panel--voice-connecting,
|
|
3495
|
-
.cf-panel.cf-panel--analytics-focus {
|
|
3496
|
-
top: max(8px, env(safe-area-inset-top));
|
|
3497
|
-
right: max(8px, env(safe-area-inset-right));
|
|
3498
|
-
bottom: max(8px, env(safe-area-inset-bottom));
|
|
3499
|
-
left: max(8px, env(safe-area-inset-left));
|
|
3500
|
-
width: auto;
|
|
3501
|
-
height: auto;
|
|
3502
|
-
min-height: 0;
|
|
3503
|
-
max-width: none;
|
|
3504
|
-
max-height: none;
|
|
3505
|
-
}
|
|
3506
|
-
.cf-header__btn { width: 40px; height: 40px; }
|
|
3507
|
-
.cf-feedback__btn { width: 36px; height: 36px; }
|
|
3508
|
-
.cf-iconbtn, .cf-send { min-width: 40px; min-height: 40px; }
|
|
3509
|
-
}
|
|
3510
|
-
@media (min-width: 640px) and (max-height: 599px) {
|
|
3511
|
-
.cf-panel,
|
|
3512
|
-
.cf-panel.cf-panel--call,
|
|
3513
|
-
.cf-panel.cf-panel--voice-connecting {
|
|
3514
|
-
height: calc(100dvh - 24px);
|
|
3515
|
-
min-height: 0;
|
|
3516
|
-
max-height: calc(100dvh - 24px);
|
|
3517
|
-
}
|
|
3518
|
-
}
|
|
3519
|
-
`;function Tt(e){"@babel/helpers - typeof";return Tt=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},Tt(e)}function Et(e,t){if(Tt(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(Tt(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function Dt(e){var t=Et(e,`string`);return Tt(t)==`symbol`?t:t+``}function Ot(e,t,n){return(t=Dt(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}const kt=`centrinfo-widget`;var At=class extends HTMLElement{constructor(...e){super(...e),Ot(this,`controls`,null),Ot(this,`composerDraftStore`,{value:``})}mountWith(n){let i=e.t(n),a=this.shadowRoot??this.attachShadow({mode:`open`});if(this.style.zIndex=String(i.zIndex),`adoptedStyleSheets`in Document.prototype&&typeof CSSStyleSheet<`u`&&typeof CSSStyleSheet.prototype.replaceSync==`function`){let e=new CSSStyleSheet;e.replaceSync(wt),a.adoptedStyleSheets=[e]}else{let e=document.createElement(`style`);i.styleNonce&&(e.nonce=i.styleNonce),e.textContent=wt,a.appendChild(e)}(0,t.render)((0,r.jsx)(Ct,{transport:i.demo?new e.S:i.preview?new e.x(new e.C(i.apiBaseUrl,i.token,i.gifApiKey,i.analyticsContextToken,{agentName:i.agentName,agentAvatarUrl:i.agentAvatarUrl},i.identityToken,i.getIdentityToken,i.chatSurface),i.strings):new e.C(i.apiBaseUrl,i.token,i.gifApiKey,i.analyticsContextToken,{agentName:i.agentName,agentAvatarUrl:i.agentAvatarUrl},i.identityToken,i.getIdentityToken,i.chatSurface),config:i,bindControls:e=>this.controls=e,composerDraftStore:this.composerDraftStore}),a)}open(){this.controls?.open()}close(){this.controls?.close()}toggle(){this.controls?.toggle()}identify(e){this.controls?.identify(e)}clear(){this.controls?.startNew()}shutdown(){this.controls?.shutdown()}unmount(){this.shadowRoot&&(0,t.render)(null,this.shadowRoot)}};typeof customElements<`u`&&!customElements.get(kt)&&customElements.define(kt,At);const jt=(e,t=document.body)=>{if(typeof document>`u`)throw Error(`[centrinfo-widget] createWidget must run in a browser.`);let n=document.createElement(kt);return n.style.pointerEvents=`none`,n.style.position=`fixed`,n.style.inset=`0`,n.style.width=`0`,n.style.height=`0`,t.appendChild(n),n.mountWith(e),{open:()=>n.open(),close:()=>n.close(),toggle:()=>n.toggle(),show:()=>n.open(),hide:()=>n.close(),identify:e=>n.identify(e),update:e=>n.identify(e),clear:()=>n.clear(),shutdown:()=>n.shutdown(),logout:()=>n.shutdown(),destroy:()=>{n.unmount(),n.remove()}}},X=e=>jt(e);let Mt=null;const Nt=e=>{Mt?.destroy();let t=X(e);return Mt=t,t},Pt={init:Nt,createWidget:X};exports.Centrinfo=Pt,exports.createWidget=X,exports.init=Nt;
|
|
1
|
+
const e=require(`./styles-BgWsSZsR.cjs`);let t=require(`preact`),n=require(`preact/hooks`),r=require(`preact/jsx-runtime`);const i=e=>e.startsWith(`image/`)?`image`:e===`application/pdf`?`pdf`:`other`,a=({state:t,onClose:a})=>{let o=e.z(),s=(0,n.useRef)(null);(0,n.useEffect)(()=>{s.current?.focus();let e=e=>{e.key===`Escape`&&(e.stopPropagation(),a())};return document.addEventListener(`keydown`,e,!0),()=>document.removeEventListener(`keydown`,e,!0)},[a]);let c=t.status===`ready`?i(t.mimeType):`other`;return(0,r.jsx)(`div`,{class:`cf-preview`,role:`dialog`,"aria-modal":`true`,"aria-label":e.R(o.attachPreviewTitle,{name:t.name}),onClick:e=>{e.target===e.currentTarget&&a()},children:(0,r.jsxs)(`div`,{class:`cf-preview__frame`,children:[(0,r.jsxs)(`div`,{class:`cf-preview__bar`,children:[(0,r.jsx)(`span`,{class:`cf-preview__name`,title:t.name,children:t.name}),t.status===`ready`&&(0,r.jsx)(`a`,{class:`cf-preview__btn`,href:t.url,download:t.name,children:o.attachDownload}),(0,r.jsx)(`button`,{ref:s,type:`button`,class:`cf-preview__btn cf-preview__close`,"aria-label":o.attachPreviewClose,onClick:a,children:`✕`})]}),(0,r.jsxs)(`div`,{class:`cf-preview__body`,children:[t.status===`loading`&&(0,r.jsx)(`p`,{class:`cf-preview__note`,children:o.attachPreviewLoading}),t.status===`error`&&(0,r.jsx)(`p`,{class:`cf-preview__note`,children:o.attachPreviewFailed}),t.status===`ready`&&c===`image`&&(0,r.jsx)(`img`,{class:`cf-preview__image`,src:t.url,alt:t.name}),t.status===`ready`&&c===`pdf`&&(0,r.jsx)(`iframe`,{class:`cf-preview__pdf`,src:t.url,title:t.name}),t.status===`ready`&&c===`other`&&(0,r.jsx)(`p`,{class:`cf-preview__note`,children:o.attachPreviewUnsupported})]})]})})},o=({name:t,greeting:n})=>{let i=e.z();return(0,r.jsxs)(`section`,{class:`cf-empty-welcome`,"aria-label":e.R(i.welcomeLabel,{name:t}),children:[(0,r.jsx)(`span`,{class:`cf-empty-welcome__eyebrow`,children:i.welcomeEyebrow}),(0,r.jsx)(`h2`,{children:t}),(0,r.jsx)(`p`,{children:n||i.welcomePrompt})]})},s=(e,t,n)=>{if(e.key===`Escape`){e.preventDefault(),e.stopPropagation(),n();return}if(e.key!==`Tab`)return;let r=Array.from(t.querySelectorAll(`button, [href], textarea, input, select, [tabindex]:not([tabindex="-1"])`)).filter(e=>!e.hasAttribute(`disabled`)&&e.getAttribute(`aria-hidden`)!==`true`&&e.tabIndex>=0);if(r.length===0)return;let i=t.getRootNode(),a=e.composedPath()[0],o=a instanceof HTMLElement?a:`activeElement`in i?i.activeElement:document.activeElement,s=r[0],c=r[r.length-1];e.shiftKey&&(o===s||!t.contains(o))?(e.preventDefault(),e.stopPropagation(),c.focus()):!e.shiftKey&&(o===c||!t.contains(o))&&(e.preventDefault(),e.stopPropagation(),s.focus())},c=new Map,ee=e=>{if(!e||typeof document>`u`||typeof CanvasRenderingContext2D>`u`)return;let t=document.createElement(`canvas`).getContext(`2d`);if(!t)return;t.fillStyle=`#010203`,t.fillStyle=e;let n=t.fillStyle;if(n===`#010203`&&e.trim().toLowerCase()!==`#010203`)return;let r=n.match(/^#([\da-f]{6})$/i)?.[1];if(r)return[Number.parseInt(r.slice(0,2),16),Number.parseInt(r.slice(2,4),16),Number.parseInt(r.slice(4,6),16),1];let i=n.match(/^rgba?\(([\d.]+)[, ]+([\d.]+)[, ]+([\d.]+)(?:[, /]+([\d.]+))?\)$/i);if(!i)return;let a=i.slice(1,5).map(Number);if(!a.some(e=>!Number.isFinite(e)))return[a[0],a[1],a[2],a[3]??1]},te=(e,t=`#ffffff`)=>{let n=`${e??``}|${t}`;if(c.has(n))return c.get(n);let r=ee(e),i=ee(t)??[255,255,255,1];if(!r){c.set(n,void 0);return}let a=r[3],o=r.slice(0,3).map((e,t)=>e*a+i[t]*(1-a)).map(e=>{let t=e/255;return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}),s=o[0]*.2126+o[1]*.7152+o[2]*.0722,te=1.05/(s+.05)>=(s+.05)/.059?`#ffffff`:`#0f1e2a`;return c.set(n,te),te},ne=e=>{let[t,r]=(0,n.useState)(`light`);return(0,n.useEffect)(()=>{if(e!==`auto`||typeof matchMedia>`u`)return;let t=matchMedia(`(prefers-color-scheme: dark)`),n=()=>r(t.matches?`dark`:`light`);return n(),t.addEventListener(`change`,n),()=>t.removeEventListener(`change`,n)},[e]),e===`auto`?t:e},l=6e4,u=90,re={end:`end the call`,mute:`mute your microphone`,minimize:`minimize the chat`,expand:`expand the view`,shrink:`exit the expanded view`},ie=e=>e.trim().toLowerCase().replace(/[^\p{L}\p{N}\s']/gu,` `).replace(/\s+/g,` `).trim(),ae=[{action:`shrink`,re:/\b(?:exit|leave|quit|close)\b[\s\w]*\b(?:full ?screen|expanded|theat(?:er|re))\b|\bshrink\b|\bsmaller view\b/},{action:`end`,re:/\b(?:end|close|stop|finish|hang ?up|quit|exit)\b[\s\w]*\b(?:call|chat|conversation|convo|session|talking)\b|\bhang ?up\b|\bgood ?bye\b|^bye(?: bye)?$/},{action:`mute`,re:/\bmute\b|\bstop listening\b/},{action:`minimize`,re:/\bminimi[sz]e\b|\bhide\b[\s\w]*\b(?:chat|call|window|widget)\b/},{action:`expand`,re:/\bexpand\b|\bmaximi[sz]e\b|\bfull ?screen\b|\btheat(?:er|re) mode\b|\bbigger view\b/}],oe=/^(?:yes|yeah|yep|yup|sure|correct|confirm|affirmative|go ahead|do it|please do|ok(?:ay)?)\b/,se=/^(?:no|nope|nah|cancel|never ?mind|don'?t|stop)\b/,ce=/^(?:end|close|stop|finish|hang ?up|quit|exit|bye|good ?bye)\b/,le=e=>{let t=ie(e);if(!t)return null;for(let{action:e,re:n}of ae)if(n.test(t)){let n=t.split(` `).length;return{action:e,confident:e===`end`?n<=10:n<=6}}return null},ue=e=>`I didn't catch yes or no. Say yes to ${re[e]}, or no to keep talking.`,d=({transport:t,config:i,bindControls:c,composerDraftStore:ee})=>{let l=i.strings,[u,ae]=(0,n.useState)(i.openByDefault),{persona:d,messages:f,sending:p,assistantSpeaking:m,visitor:de,hasEmail:fe,liveMode:h,assignedAgentName:pe,agentTypingName:me,starters:he,featuredLinks:ge,send:g,sendGif:_e,notifyTyping:ve,stop:ye,amend:be,hold:xe,resumeHeld:Se,duckSpeaking:Ce,retry:we,rateMessage:Te,injectAssistant:Ee,reconnectSupport:De,appendUserDraft:Oe,patchMessage:_,removeMessage:ke,submitCsat:Ae,submitForm:je,confirmHostedBooking:Me,transcribe:Ne,uploadAttachment:Pe,loadAttachment:Fe,searchGifs:Ie,demoSlots:Le,gifEnabled:Re,identify:ze,ended:v,endConversation:Be,startNew:Ve,history:He,viewingSessionId:Ue,viewMessages:We,openConversation:Ge,closeHistoryView:Ke,shutdown:qe,stopSpeaking:y,speakAssistantText:Je}=e.a(t,i,u),Ye=e.i(f,h),[Xe,Ze]=(0,n.useState)(null),Qe=(0,n.useRef)(0),$e=(0,n.useCallback)((e,t,n)=>{n===Qe.current&&Ze({status:`ready`,name:t,url:URL.createObjectURL(e),mimeType:e.type||`application/octet-stream`})},[]),et=(0,n.useCallback)((e,t,n)=>{let r=t.name,i=++Qe.current;Ze({status:`loading`,name:r}),Fe(e,t,n).then(e=>$e(e,r,i),()=>{i===Qe.current&&Ze({status:`error`,name:r})})},[Fe,$e]),tt=(0,n.useCallback)((e,t)=>$e(e,t,++Qe.current),[$e]),nt=(0,n.useCallback)(()=>{Qe.current+=1,Ze(null)},[]);(0,n.useEffect)(()=>()=>{Xe?.status===`ready`&&URL.revokeObjectURL(Xe.url)},[Xe]);let rt=!!e.r(d?.actions),[b,it]=(0,n.useState)(0),[x,at]=(0,n.useState)({mic:`off`,processing:!1}),[ot,st]=(0,n.useState)(null),[ct,lt]=(0,n.useState)(!1),[S,ut]=(0,n.useState)(!1),[dt,ft]=(0,n.useState)(!1),[pt,mt]=(0,n.useState)(!1),[ht,gt]=(0,n.useState)(0),[C,w]=(0,n.useState)(!1),[_t,T]=(0,n.useState)(null),[vt,yt]=(0,n.useState)([]),[bt,xt]=(0,n.useState)(``),[St,Ct]=(0,n.useState)(()=>{try{return localStorage.getItem(`centrinfo:muted`)===`1`}catch{return!1}}),wt=ne(i.theme),Tt=d?.soundEnabled??!0;(0,n.useEffect)(()=>{e.d(i.sound&&Tt&&!St)},[i.sound,Tt,St]);let Et=(0,n.useCallback)(()=>{Ct(e=>{let t=!e;try{localStorage.setItem(`centrinfo:muted`,t?`1`:`0`)}catch{}return t})},[]),E=(0,n.useRef)(null),Dt=(0,n.useRef)(null),Ot=(0,n.useRef)(null),kt=(0,n.useRef)(0),D=(0,n.useRef)(!1),O=(0,n.useRef)(!1),k=(0,n.useRef)(null),A=(0,n.useRef)(0),j=(0,n.useRef)(void 0),At=(0,n.useRef)(0),M=(0,n.useRef)(null),N=(0,n.useRef)(!1),P=(0,n.useRef)(null),F=(0,n.useRef)(``),jt=(0,n.useRef)(()=>{}),Mt=(0,n.useRef)(``),Nt=(0,n.useRef)(p),Pt=(0,n.useRef)(g);Pt.current=g;let Ft=(0,n.useRef)(be);Ft.current=be;let It=(0,n.useRef)(Ne);It.current=Ne;let I=(0,n.useRef)(!1),L=(0,n.useRef)(!1),Lt=(0,n.useRef)(``);Lt.current=[...f].reverse().find(e=>e.role===`assistant`)?.content??``;let Rt=(0,n.useRef)(m);Nt.current=p,Rt.current=m;let R=S?ct?`timeout`:pt||x.mic===`muted`?`muted`:x.mic===`unavailable`?x.reason===`permission-denied`||x.reason===`unsupported`?`denied`:`unavailable`:x.mic===`off`||x.mic===`starting`?`connecting`:x.mic===`hearing`?`hearing`:m?`speaking`:ot??(x.processing||p?`processing`:`listening`):`idle`,[zt,Bt]=(0,n.useState)(!0),[Vt,z]=(0,n.useState)(!1),Ht=(0,n.useRef)(0),[B,V]=(0,n.useState)(!1),[H,U]=(0,n.useState)(!1),Ut=(0,n.useRef)(null),[W,G]=(0,n.useState)(!1),Wt=(0,n.useRef)({value:``}),Gt=ee??Wt.current,Kt=(0,n.useRef)({confirmEnd:B,confirmClear:H,showHistory:W});Kt.current={confirmEnd:B,confirmClear:H,showHistory:W};let[qt,Jt]=(0,n.useState)(!1),K=!!Ue,Yt=K?We:f,Xt=Yt.find(e=>e.id===_t&&e.visualization)?.visualization;(0,n.useEffect)(()=>{!_t||Xt||(T(null),w(!1))},[Xt,_t]);let q=(0,n.useCallback)(()=>{ae(!0),it(0),e.u(`open`),i.onOpen?.(),i.onShow?.()},[i]),J=(0,n.useCallback)(()=>{ae(!1),w(!1),T(null),i.onClose?.(),i.onHide?.(),Dt.current?.focus()},[i]),Zt=(0,n.useCallback)(()=>u?J():q(),[u,q,J]),Qt=(0,n.useCallback)(()=>V(!0),[]),$t=(0,n.useCallback)(()=>{Be(),V(!1)},[Be]),en=(0,n.useCallback)(()=>{Ve(),z(!1),Bt(!0)},[Ve]);(0,n.useEffect)(()=>{B&&Ut.current?.focus()},[B]),(0,n.useEffect)(()=>{c({open:q,close:J,toggle:Zt,identify:ze,startNew:Ve,endConversation:Be,shutdown:qe})},[c,q,J,Zt,ze,Ve,Be,qe]),(0,n.useEffect)(()=>{let e=f.filter(e=>e.role===`assistant`&&!e.pending).length;if(u){kt.current=e;return}e>kt.current&&it(e-kt.current)},[f,u]),(0,n.useEffect)(()=>{i.onUnreadChange?.(b)},[b,i]),(0,n.useEffect)(()=>{let e=i.sessionDurationMinutes;if(!e||e<=0)return;let t=setTimeout(()=>qe(),e*60*1e3);return()=>clearTimeout(t)},[i.sessionDurationMinutes,f,u,qe]),(0,n.useEffect)(()=>{let e=i.customLauncherSelector;if(!e||typeof document>`u`)return;let t=[];try{t=Array.from(document.querySelectorAll(e))}catch{return}let n=e=>{e.preventDefault(),Zt()};return t.forEach(e=>e.addEventListener(`click`,n)),()=>t.forEach(e=>e.removeEventListener(`click`,n))},[i.customLauncherSelector,Zt]);let tn=(0,n.useRef)(!1);(0,n.useEffect)(()=>{let e=i.proactiveMessage?.trim();if(!e||tn.current)return;let t=i.proactiveOnPaths??[],n=typeof location<`u`?location.pathname:``;if(t.length>0&&!t.some(e=>n.includes(e)))return;let r=`centrinfo:proactive:${i.token.slice(0,12)}`;try{if(sessionStorage.getItem(r)===`1`)return}catch{}let a=setTimeout(()=>{if(!(u||v||f.some(e=>e.role===`user`))){tn.current=!0;try{sessionStorage.setItem(r,`1`)}catch{}Ee(e),q()}},Math.max(0,i.proactiveDelaySeconds)*1e3);return()=>clearTimeout(a)},[i.proactiveMessage]),(0,n.useEffect)(()=>{let e=Ot.current;if(!u||!e)return;let t=f[f.length-1],n=Date.now()<Ht.current;t?.role===`user`||zt||n?(requestAnimationFrame(()=>{e.scrollTop=e.scrollHeight}),z(!1),n&&Bt(!0)):z(!0)},[f,u,p,zt]);let nn=(0,n.useCallback)(()=>{let e=Ot.current;if(!e)return;if(D.current&&!K){Bt(!0),z(!1);return}let t=e.scrollHeight-e.scrollTop-e.clientHeight<80;Bt(t),t&&z(!1)},[K]),Y=(0,n.useCallback)(()=>{let e=Ot.current;e&&(e.scrollTop=e.scrollHeight),z(!1),Bt(!0)},[]),rn=(0,n.useCallback)(()=>{Ht.current=Date.now()+3e3,requestAnimationFrame(Y)},[Y]);(0,n.useEffect)(()=>{if(!u||K||!S||R===`connecting`)return;Ht.current=Date.now()+6e4,Y();let e=requestAnimationFrame(()=>{Y(),requestAnimationFrame(Y)}),t=[80,180,360].map(e=>window.setTimeout(Y,e));return()=>{cancelAnimationFrame(e),t.forEach(e=>window.clearTimeout(e))}},[m,f,u,Y,p,S,K,R]);let an=(0,n.useCallback)(()=>{E.current?.querySelector(`.cf-textarea`)?.focus()},[]),on=(0,n.useCallback)((e,t)=>{st(e),j.current&&window.clearTimeout(j.current),j.current=window.setTimeout(()=>st(null),3e3),t&&!O.current&&Je(t)},[Je]),sn=(0,n.useCallback)(e=>{let t=P.current;if(t)return t;rn();let n=Oe(e);return P.current=n,_(n,{content:F.current||e,pending:!0,streaming:!1}),n},[Oe,rn,_]),X=(0,n.useCallback)(()=>{let e=P.current;if(e){if(F.current){_(e,{content:F.current,pending:!0});return}P.current=null,ke(e)}},[_,ke]),Z=(0,n.useCallback)(()=>{L.current&&(L.current=!1,Ce(!1)),I.current&&(I.current=!1,Se())},[Ce,Se]),Q=(0,n.useCallback)(()=>{D.current=!1,k.current?.stop(`call-ended`),k.current=null,I.current=!1,L.current=!1,O.current=!1,M.current=null,N.current=!1;let e=P.current;P.current=null,F.current=``,e&&ke(e),j.current&&window.clearTimeout(j.current),st(null),lt(!1),at({mic:`off`,processing:!1}),gt(0),ut(!1),ft(!1),mt(!1),w(!1),T(null),y()},[ke,y]),cn=(0,n.useCallback)(()=>{C&&T(null),w(!C)},[C]),ln=(0,n.useCallback)(e=>{T(e),w(!0)},[]),un=(0,n.useCallback)(()=>{let e=_t;T(null),w(!1),window.requestAnimationFrame(()=>{Array.from(E.current?.querySelectorAll(`[data-visualization-message]`)??[]).find(t=>t.dataset.visualizationMessage===e)?.focus()})},[_t]),dn=(0,n.useCallback)(()=>{T(null),w(!1)},[]),fn=(0,n.useCallback)((e,t,n=!1)=>{if(rn(),t&&(_(t,{content:e,pending:!1,streaming:!1}),P.current===t&&(P.current=null)),F.current=``,n){y(),Ft.current(e,{forceVoicePlayback:!0,userMessageId:t});return}D.current&&(xe()?Ft.current(e,{forceVoicePlayback:!0,userMessageId:t}):Pt.current(e,{forceVoicePlayback:!0,userMessageId:t}))},[rn,xe,_,y]),$=(0,n.useCallback)(e=>{Ee(e),Je(e)},[Ee,Je]),pn=(0,n.useCallback)(()=>{if(A.current=Date.now(),st(null),Rt.current){L.current=!0,Ce(!0);return}I.current||(I.current=xe()),sn(`Listening...`)},[Ce,sn,xe]),mn=(0,n.useCallback)(e=>{let t=P.current;!t||L.current||_(t,{content:`${[F.current,e].filter(Boolean).join(` `)} ...`,pending:!0})},[_]),hn=(0,n.useCallback)(t=>{A.current=Date.now();let n=[F.current,t.text].map(e=>e.trim()).filter(Boolean).join(` `).replace(/\s+/g,` `).trim();if((L.current||t.overlappedOutput)&&e.V(t.text,Lt.current)){X(),Z();return}if(!n||e.p(n)||e.m(n)){let e=L.current||I.current;X(),Z(),e||on(`misunderstood`);return}L.current&&(L.current=!1,ye(),y());let r=M.current;if(r){F.current=``,X();let e=ie(n);if(oe.test(e)||r===`end`&&ce.test(e)){M.current=null,jt.current(r);return}if(se.test(e)){M.current=null,$(`Okay, never mind — what would you like to know?`);return}$(ue(r));return}let i=le(n);if(i){if(F.current=``,X(),Z(),i.confident){jt.current(i.action);return}M.current=i.action,$(`Just to confirm — you want me to ${re[i.action]}? Please say yes or no.`);return}let a=sn(n);_(a,{content:n,pending:!0});let o=I.current;I.current=!1,fn(n,a,o)},[sn,_,Z,fn,X,on,$,ye,y]),gn=(0,n.useCallback)(e=>{A.current=Date.now();let t=L.current||I.current;if(X(),Z(),!(t||e.overlappedOutput||e.reason===`too-short`)){if(e.reason===`transcribe-failed`){on(`misunderstood`,`I couldn't transcribe that. Please try again, or type your question.`);return}on(`noise`)}},[Z,X,on]),_n=(0,n.useRef)({speechStart:pn,partial:mn,turn:hn,noise:gn});_n.current={speechStart:pn,partial:mn,turn:hn,noise:gn};let vn=(0,n.useCallback)(()=>{navigator.mediaDevices?.enumerateDevices().then(e=>{yt(e.filter(e=>e.kind===`audioinput`).map((e,t)=>({deviceId:e.deviceId,label:e.label||`Microphone ${t+1}`})))}).catch(()=>{})},[]),yn=(0,n.useCallback)(()=>{if(D.current){Q();return}if(an(),!d?.allowVoiceInput||!d.talkbackMode||d.talkbackMode===`text`||Nt.current||v||K)return;A.current=Date.now(),O.current=!1,D.current=!0,mt(!1),ut(!0),ft(!1),lt(!1);let t=!1,n=new e.B({deviceId:Mt.current||void 0,transcribe:async({audio:t,mimeType:n,durationSeconds:r})=>{let i=typeof navigator<`u`&&(navigator.languages?.[0]||navigator.language)||void 0;return e.h(await It.current(t,n,i,r))},listener:{state:e=>{at(e),e.mic!==`starting`&&e.mic!==`off`&&ft(!0),!t&&e.mic===`listening`&&(t=!0,vn())},speechStart:()=>_n.current.speechStart(),partial:({text:e})=>_n.current.partial(e),turn:e=>_n.current.turn(e),noise:e=>_n.current.noise(e),level:e=>{let t=performance.now();t-At.current<90||(At.current=t,gt(e))}}});k.current=n,n.setOutputActive(Rt.current),n.start()},[Q,v,an,d,vn,K]),bn=(0,n.useCallback)(()=>{let e=!O.current;O.current=e,mt(e),k.current?.setMuted(e),e?(F.current=``,X(),Z()):A.current=Date.now()},[Z,X]),xn=(0,n.useCallback)(e=>{switch(A.current=Date.now(),e){case`end`:N.current=!0,$(`Okay — ending our call now. Goodbye!`),window.setTimeout(()=>{N.current&&(N.current=!1,Q())},2e3);break;case`mute`:O.current||bn(),$(`Muted. Tap the mic button when you want me to listen again.`);break;case`minimize`:J(),$(`Minimized — I'm still listening. Tap the call pill to bring the chat back.`);break;case`expand`:w(!0),$(`Sure — expanding the view.`);break;case`shrink`:T(null),w(!1),$(`Okay — back to the smaller view.`);break}},[J,Q,$,bn]);(0,n.useEffect)(()=>{jt.current=xn},[xn]);let Sn=(0,n.useRef)(!1);(0,n.useEffect)(()=>{Sn.current&&!m&&N.current&&(N.current=!1,Q()),Sn.current=m},[m,Q]);let Cn=(0,n.useCallback)(e=>{Mt.current=e,xt(e),k.current?.selectDevice(e||void 0)},[]),wn=(0,n.useCallback)(()=>{!D.current||O.current||(L.current=!1,I.current=!1,ye(),y(),A.current=Date.now())},[ye,y]);(0,n.useEffect)(()=>{k.current?.setOutputActive(m),A.current=Date.now()},[m]),(0,n.useEffect)(()=>{if(R!==`denied`)return;let e=window.setTimeout(()=>Q(),3500);return()=>window.clearTimeout(e)},[Q,R]),(0,n.useEffect)(()=>{if(!S)return;let e=window.setInterval(()=>{let e=k.current;!e||O.current||Nt.current||Rt.current||e.snapshot.mic===`hearing`||e.snapshot.processing||Date.now()-A.current<6e4||(k.current?.log.add(`call-timeout`),lt(!0),window.setTimeout(()=>Q(),2400))},5e3);return()=>window.clearInterval(e)},[Q,S]);let Tn=S&&!pt&&(p||m);(0,n.useEffect)(()=>()=>Q(),[Q]);let[En,Dn]=(0,n.useState)(``),On=(0,n.useRef)(!1);(0,n.useEffect)(()=>{if(On.current&&!p){let e=[...f].reverse().find(e=>e.role===`assistant`&&!e.streaming&&!e.pending&&e.content);e&&Dn(e.content)}On.current=p},[p,f]),(0,n.useLayoutEffect)(()=>{if(!u)return;let e=E.current,t=B||H?e?.querySelector(`.cf-confirm__card`):W?e?.querySelector(`.cf-history`):null;if(!t)return;let n=t.getRootNode(),r=`activeElement`in n?n.activeElement:document.activeElement;(!r||!t.contains(r))&&t.querySelector(`button, [href], textarea, input, [tabindex]:not([tabindex="-1"])`)?.focus()},[H,B,u,W]),(0,n.useEffect)(()=>{if(!u)return;let e=E.current,t=B||H?e?.querySelector(`.cf-confirm__card`):W?e?.querySelector(`.cf-history`):null,n=e?.querySelectorAll(`:scope > .cf-header, :scope > .cf-panel__video, :scope > .cf-panel__chat`);n?.forEach(e=>{t?(e.setAttribute(`inert`,``),e.setAttribute(`aria-hidden`,`true`)):(e.removeAttribute(`inert`),e.removeAttribute(`aria-hidden`))}),t||requestAnimationFrame(()=>e?.querySelector(`.cf-textarea`)?.focus());let r=e=>{if(e.key===`Escape`){e.preventDefault();let t=Kt.current;if(t.confirmEnd){V(!1);return}if(t.confirmClear){U(!1);return}if(t.showHistory){G(!1);return}J();return}if(e.key!==`Tab`||!t)return;let n=t.querySelectorAll(`button, [href], textarea, input, [tabindex]:not([tabindex="-1"])`),r=Array.from(n).filter(e=>!e.hasAttribute(`disabled`));if(r.length===0)return;let i=r[0],a=r[r.length-1],o=t.getRootNode()instanceof ShadowRoot?t.getRootNode().activeElement:document.activeElement;e.shiftKey&&o===i?(e.preventDefault(),a.focus()):!e.shiftKey&&o===a&&(e.preventDefault(),i.focus())};return e?.addEventListener(`keydown`,r),()=>{e?.removeEventListener(`keydown`,r),n?.forEach(e=>{e.removeAttribute(`inert`),e.removeAttribute(`aria-hidden`)})}},[u,J,B,H,W]),(0,n.useEffect)(()=>{let e=E.current;e&&(u?e.removeAttribute(`inert`):e.setAttribute(`inert`,``))},[u]);let kn=i.accentColor??i.themeTokens?.accent??d?.accentColor,An=i.themeTokens?.accentText??te(kn,i.themeTokens?.background??(wt===`dark`?`#0f1c27`:`#ffffff`)),jn={zIndex:i.zIndex,"--cf-h-pad":`${i.horizontalPadding}px`,"--cf-v-pad":`${i.verticalPadding}px`,...An?{"--cf-accent-ink":An}:{},...i.themeTokens?.accentStrong?{"--cf-accent-2":i.themeTokens.accentStrong}:{},...i.themeTokens?.background?{"--cf-bg":i.themeTokens.background}:{},...i.themeTokens?.surface?{"--cf-surface":i.themeTokens.surface}:{},...i.themeTokens?.surfaceMuted?{"--cf-surface-2":i.themeTokens.surfaceMuted}:{},...i.themeTokens?.text?{"--cf-text":i.themeTokens.text}:{},...i.themeTokens?.mutedText?{"--cf-muted":i.themeTokens.mutedText}:{},...i.themeTokens?.border?{"--cf-border":i.themeTokens.border}:{},...i.themeTokens?.shadow?{"--cf-shadow":i.themeTokens.shadow}:{},...i.themeTokens?.radius?{"--cf-radius":i.themeTokens.radius}:{},...i.themeTokens?.fontFamily?{"--cf-font":i.themeTokens.fontFamily}:{},...i.themeTokens?.success?{"--cf-success":i.themeTokens.success}:{},...i.themeTokens?.warning?{"--cf-warning":i.themeTokens.warning}:{},...i.themeTokens?.danger?{"--cf-danger":i.themeTokens.danger}:{},...kn?{"--cf-accent":kn,"--cf-accent-2":i.themeTokens?.accentStrong??`color-mix(in oklab, ${kn} 76%, #14141f)`}:{}},Mn=e=>g(e),Nn=[...f].reverse().find(e=>e.role===`user`&&e.content.trim())?.content??``,Pn=f.some(e=>e.role===`user`),Fn=!!(d?.allowVoiceInput&&d?.talkbackMode&&d.talkbackMode!==`text`),In=Fn,Ln=!K&&In&&!Pn?Yt.filter((e,t)=>!(t===0&&e.role===`assistant`)):Yt,Rn=h===`human`&&pe?pe:d?.agentName??l.chatName,zn=h===`human`?l.liveSupport:h===`queued`?l.waitingForTeam:d?.offline?l.statusOffline:l.statusOnline,Bn=!v&&!K?d?.availableActions:void 0,Vn=!v&&!K?d?.actions:void 0,Hn=S&&!dt&&R===`connecting`&&!K;return(0,r.jsx)(e.L,{value:l,children:(0,r.jsxs)(`div`,{class:`cf-root`,"data-theme":wt,"data-align":i.alignment,"data-display":`floating`,style:jn,children:[C&&u&&(0,r.jsx)(`div`,{class:`cf-theater-backdrop`,onClick:dn}),(0,r.jsxs)(`div`,{ref:E,class:`cf-panel ${u?`is-open`:``} ${S?`cf-panel--call`:``} ${Hn?`cf-panel--voice-connecting`:``} ${C&&u?`cf-panel--theater`:``} ${Xt?`cf-panel--analytics-focus`:``}`,role:`dialog`,"aria-modal":`false`,"aria-label":`${l.chatName}: ${d?.agentName??l.assistantName}`,"aria-hidden":!u,children:[Xe&&u&&(0,r.jsx)(a,{state:Xe,onClose:nt}),(0,r.jsxs)(`div`,{class:`cf-header`,children:[(0,r.jsx)(e.v,{persona:d,hideWhenMissing:!0}),(0,r.jsxs)(`div`,{class:`cf-header__meta`,children:[(0,r.jsx)(`div`,{class:`cf-header__name`,children:Rn}),(0,r.jsx)(`div`,{class:`cf-header__status ${h===`ai`&&d?.offline?`cf-header__status--offline`:``}`,children:(0,r.jsx)(`span`,{class:`cf-header__status-text`,children:zn})})]}),(0,r.jsxs)(`div`,{class:`cf-header__actions`,children:[He.length>0&&(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":l.pastConversations,title:l.pastConversations,"aria-pressed":W,onClick:()=>G(e=>!e),children:(0,r.jsx)(e.j,{})}),Pn&&!v&&!K&&(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":l.endChat,title:l.endChat,onClick:Qt,children:(0,r.jsx)(e.A,{})}),i.sound&&Tt&&(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":St?l.unmuteSounds:l.muteSounds,"aria-pressed":St,onClick:Et,children:St?(0,r.jsx)(e.M,{}):(0,r.jsx)(e.N,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn cf-header__close`,"aria-label":l.closeChat,onClick:J,children:(0,r.jsx)(e.k,{})})]})]}),(0,r.jsx)(`div`,{class:`cf-panel__video`,children:Xt?(0,r.jsx)(`div`,{class:`cf-analytics-focus`,role:`region`,"aria-label":l.expandedAnalyticsResult,children:(0,r.jsx)(e.T,{visualization:Xt,expanded:!0,onClose:un})}):!K&&In?(0,r.jsx)(e.y,{persona:d,starters:[],onPick:g,onFocusComposer:yn,speaking:m,voiceState:R,replyPending:S&&p&&!m,pinned:!0,muted:pt,onToggleMute:bn,onEndCall:Q,onTalkNow:wn,showTalkNow:Tn,micLevel:ht,theaterMode:C,onToggleTheater:cn,onMinimize:J,audioDevices:vt,selectedAudioDeviceId:bt,onSelectAudioDevice:Cn,connectingOnly:Hn}):null}),!Hn&&(0,r.jsxs)(`div`,{class:`cf-panel__chat`,children:[i.preview&&(0,r.jsx)(`div`,{class:`cf-preview-banner`,children:l.previewBanner}),K&&(0,r.jsx)(`div`,{class:`cf-viewing-banner`,children:l.viewingPast}),(0,r.jsxs)(`div`,{class:`cf-body`,ref:Ot,role:`log`,onScroll:nn,children:[Ln.map((t,n)=>(0,r.jsx)(e.C,{msg:t,persona:d,isLast:!K&&n===Ln.length-1,visitor:de,hasEmail:fe,lastQuestion:Nn,showActions:!K&&n===Ln.length-1&&!!(t.handoffOffered||t.selectedAction),onPickReply:Mn,onSubmitForm:je,onDemoSlots:Le,onConfirmHostedBooking:Me,onRetry:we,ratable:!K&&Ln.slice(0,n).some(e=>e.role===`user`),onRate:Te,onExpandVisualization:K?void 0:ln,onOpenAttachment:et,onReconnect:!K&&!v&&rt&&t.id===Ye?De:void 0},t.id)),!Pn&&!K&&(0,r.jsxs)(r.Fragment,{children:[Ln.length===0&&(0,r.jsx)(o,{name:d?.agentName??l.assistantName,greeting:d?.greeting}),(0,r.jsx)(e.w,{items:he,onPick:g}),(0,r.jsx)(e.x,{items:ge})]}),Vt&&(0,r.jsxs)(`button`,{type:`button`,class:`cf-newmsg`,onClick:Y,children:[(0,r.jsx)(e.D,{}),l.newMessages]})]}),(0,r.jsx)(`div`,{class:`cf-sr-live`,"aria-live":`polite`,"aria-atomic":`true`,children:En}),p&&!v&&!K&&(0,r.jsx)(`div`,{class:`cf-stopbar`,children:(0,r.jsxs)(`button`,{type:`button`,class:`cf-stop`,onClick:ye,children:[(0,r.jsx)(e.P,{}),l.stop]})}),K?(0,r.jsx)(`div`,{class:`cf-ended`,children:(0,r.jsx)(`button`,{type:`button`,class:`cf-ended__btn`,onClick:Ke,children:l.backToChat})}):v?(0,r.jsxs)(`div`,{class:`cf-ended`,children:[(0,r.jsx)(`p`,{class:`cf-ended__text`,children:l.conversationEnded}),i.csat&&Pn?qt?(0,r.jsx)(`p`,{class:`cf-ended__text`,children:l.feedbackThanks}):(0,r.jsxs)(`div`,{class:`cf-csat`,children:[(0,r.jsx)(`span`,{class:`cf-csat__q`,children:l.csatPrompt}),(0,r.jsx)(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":l.feedbackHelpful,onClick:()=>{Ae(`up`),Jt(!0)},children:(0,r.jsx)(e.I,{})}),(0,r.jsx)(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":l.feedbackNotHelpful,onClick:()=>{Ae(`down`),Jt(!0)},children:(0,r.jsx)(e.F,{})})]}):null,(0,r.jsx)(`button`,{type:`button`,class:`cf-ended__btn`,onClick:en,children:l.startNewChat})]}):(0,r.jsxs)(r.Fragment,{children:[me?(0,r.jsx)(`div`,{class:`cf-live-typing`,"aria-live":`polite`,children:e.R(l.agentTyping,{name:me})}):null,Bn&&Bn.length>0&&(0,r.jsx)(`div`,{class:`cf-footer-actions`,children:(0,r.jsx)(e._,{actions:Bn,descriptors:Vn,visitor:de,onSubmitForm:je,onDemoSlots:Le,onConfirmHostedBooking:Me,scheduler:d?.scheduler,translations:i.actionTranslations})},`footer-actions`),(0,r.jsx)(e.b,{draftStore:Gt,onSend:g,onSendGif:_e,onTyping:ve,disabled:p,allowVoice:Fn,onTranscribe:Ne,gifEnabled:Re,onSearchGifs:Ie,allowAttach:i.attachments,analyzeAttachments:!0,onUpload:Pe,onPreviewAttachment:tt},`composer`)]}),!v&&d?.disclaimerText&&(0,r.jsx)(`div`,{class:`cf-disclaimer`,children:d.disclaimerText}),(0,r.jsxs)(`div`,{class:`cf-footer`,children:[(0,r.jsx)(`button`,{type:`button`,class:`cf-footer__privacy`,"aria-label":l.clearDeviceData,onClick:()=>U(!0),children:l.privacyAndData}),(0,r.jsx)(`span`,{"aria-hidden":`true`,children:`·`}),l.poweredBy,` `,(0,r.jsx)(`a`,{href:`https://accurix.tech/centrinfo`,target:`_blank`,rel:`noopener noreferrer`,children:`Centrinfo`})]})]}),B&&(0,r.jsx)(`div`,{class:`cf-confirm`,onClick:()=>V(!1),children:(0,r.jsxs)(`div`,{class:`cf-confirm__card`,role:`alertdialog`,"aria-modal":`true`,"aria-label":l.endChatConfirm,onClick:e=>e.stopPropagation(),onKeyDownCapture:e=>s(e,e.currentTarget,()=>V(!1)),children:[(0,r.jsx)(`div`,{class:`cf-confirm__title`,children:l.endChatConfirm}),(0,r.jsx)(`div`,{class:`cf-confirm__body`,children:l.endChatConfirmBody}),(0,r.jsxs)(`div`,{class:`cf-confirm__actions`,children:[(0,r.jsx)(`button`,{ref:Ut,type:`button`,class:`cf-confirm__btn cf-confirm__btn--cancel`,onClick:()=>V(!1),children:l.cancel}),(0,r.jsx)(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--danger`,onClick:$t,children:l.endConfirmCta})]})]})},`confirm-end`),W&&(0,r.jsx)(`div`,{class:`cf-confirm`,onClick:()=>G(!1),children:(0,r.jsxs)(`div`,{class:`cf-history`,role:`dialog`,"aria-modal":`true`,"aria-label":l.pastConversations,onClick:e=>e.stopPropagation(),onKeyDownCapture:e=>s(e,e.currentTarget,()=>G(!1)),children:[(0,r.jsxs)(`div`,{class:`cf-history__head`,children:[(0,r.jsx)(`span`,{children:l.pastConversations}),(0,r.jsx)(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":l.closeHistory,onClick:()=>G(!1),children:(0,r.jsx)(e.k,{})})]}),(0,r.jsx)(`div`,{class:`cf-history__list`,children:He.map(e=>(0,r.jsxs)(`button`,{type:`button`,class:`cf-history__item ${e.sessionId===Ue?`is-active`:``}`,onClick:()=>{Ge(e.sessionId),G(!1)},children:[(0,r.jsx)(`span`,{class:`cf-history__title`,children:e.title}),(0,r.jsxs)(`span`,{class:`cf-history__meta`,children:[new Date(e.ts).toLocaleDateString(void 0,{month:`short`,day:`numeric`}),e.ended?` · ${l.historyEnded}`:``]})]},e.sessionId))}),(0,r.jsx)(`div`,{class:`cf-history__footer`,children:(0,r.jsx)(`button`,{type:`button`,class:`cf-history__clear`,onClick:()=>{G(!1),U(!0)},children:l.clearDeviceData})})]})},`history`),H&&(0,r.jsx)(`div`,{class:`cf-confirm`,onClick:()=>U(!1),children:(0,r.jsxs)(`div`,{class:`cf-confirm__card`,role:`alertdialog`,"aria-modal":`true`,"aria-label":l.clearDeviceData,onClick:e=>e.stopPropagation(),onKeyDownCapture:e=>s(e,e.currentTarget,()=>U(!1)),children:[(0,r.jsx)(`div`,{class:`cf-confirm__title`,children:l.clearDeviceData}),(0,r.jsx)(`div`,{class:`cf-confirm__body`,children:l.clearDeviceDataBody}),(0,r.jsxs)(`div`,{class:`cf-confirm__actions`,children:[(0,r.jsx)(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--cancel`,onClick:()=>U(!1),children:l.cancel}),(0,r.jsx)(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--danger`,onClick:()=>{U(!1),qe()},children:l.clearDeviceDataCta})]})]})},`confirm-clear`)]}),S&&!u?(0,r.jsx)(e.S,{persona:d,voiceState:R,muted:pt,onToggleMute:bn,onEndCall:Q,micLevel:ht,onExpand:q}):C&&u?null:!i.hideDefaultLauncher&&(0,r.jsxs)(`button`,{ref:Dt,type:`button`,class:`cf-launcher`,"aria-label":u?l.closeChat:b>0?`${l.openChat}. ${b===1?l.unreadMessage:e.R(l.unreadMessages,{count:String(b)})}`:l.openChat,"aria-expanded":u,onClick:Zt,children:[i.launcherIcon?(0,r.jsx)(`img`,{class:`cf-launcher__img`,src:i.launcherIcon,alt:``}):(0,r.jsx)(e.O,{}),!u&&b>0&&(0,r.jsx)(`span`,{class:`cf-launcher__badge`,"aria-hidden":`true`,children:b>99?`99+`:b})]})]})})},f=`centrinfo-widget`;var p=class extends HTMLElement{constructor(...t){super(...t),e.H(this,`controls`,null),e.H(this,`composerDraftStore`,{value:``})}mountWith(n){let i=e.n(n),a=this.shadowRoot??this.attachShadow({mode:`open`});if(this.style.zIndex=String(i.zIndex),`adoptedStyleSheets`in Document.prototype&&typeof CSSStyleSheet<`u`&&typeof CSSStyleSheet.prototype.replaceSync==`function`){let t=new CSSStyleSheet;t.replaceSync(e.t),a.adoptedStyleSheets=[t]}else{let t=document.createElement(`style`);i.styleNonce&&(t.nonce=i.styleNonce),t.textContent=e.t,a.appendChild(t)}(0,t.render)((0,r.jsx)(d,{transport:i.demo?new e.Y:i.preview?new e.J(new e.X(i.apiBaseUrl,i.token,i.gifApiKey,i.analyticsContextToken,{agentName:i.agentName,agentAvatarUrl:i.agentAvatarUrl},i.identityToken,i.getIdentityToken,i.chatSurface),i.strings):new e.X(i.apiBaseUrl,i.token,i.gifApiKey,i.analyticsContextToken,{agentName:i.agentName,agentAvatarUrl:i.agentAvatarUrl},i.identityToken,i.getIdentityToken,i.chatSurface),config:i,bindControls:e=>this.controls=e,composerDraftStore:this.composerDraftStore}),a)}open(){this.controls?.open()}close(){this.controls?.close()}toggle(){this.controls?.toggle()}identify(e){this.controls?.identify(e)}clear(){this.controls?.startNew()}shutdown(){this.controls?.shutdown()}unmount(){this.shadowRoot&&(0,t.render)(null,this.shadowRoot)}};typeof customElements<`u`&&!customElements.get(f)&&customElements.define(f,p);const m=(e,t=document.body)=>{if(typeof document>`u`)throw Error(`[centrinfo-widget] createWidget must run in a browser.`);let n=document.createElement(f);return n.style.pointerEvents=`none`,n.style.position=`fixed`,n.style.inset=`0`,n.style.width=`0`,n.style.height=`0`,t.appendChild(n),n.mountWith(e),{open:()=>n.open(),close:()=>n.close(),toggle:()=>n.toggle(),show:()=>n.open(),hide:()=>n.close(),identify:e=>n.identify(e),update:e=>n.identify(e),clear:()=>n.clear(),shutdown:()=>n.shutdown(),logout:()=>n.shutdown(),destroy:()=>{n.unmount(),n.remove()}}},de=e=>m(e);let fe=null;const h=e=>{fe?.destroy();let t=de(e);return fe=t,t},pe={init:h,createWidget:de};exports.Centrinfo=pe,exports.createWidget=de,exports.init=h;
|