@botfabrik/engine-webclient 4.67.3 → 4.69.0

package/README.md

@@ -22,7 +22,83 @@ Nachfolgende Properties können dem Client mitgegeben werden:
 
 Legt fest, ob vor dem Beginn eines neuen Chats ein Startbildschirm angezeigt wird. Dieser ist besonders nützlich, wenn vom Benutzer eine ausdrückliche Zustimmung, wie beispielsweise die Akzeptanz der Nutzungsbedingungen, erforderlich ist.
 
-Auf dem Startbildschirm werden ein Text (Markdown `start-screen.body`) sowie ein Button (Label `start-screen.start-chat`) angezeigt. Klickt der Benutzer auf den Button, verschwindet der Startbildschirm und der Chat beginnt mit der Begrüssung des Chatbots.
+Der Startbildschirm ist in drei Breiche unterteilt:
+
+##### Einleitung
+
+Die Einleitung wird durch einen Text repräsentiert, der via Übersetzungs-Key `start-screen.intro` konfiguriert werden kann. Der Text kann mit Markdown formatiert werden.
+
+#### Formular
+
+Optional kann unterhalb des Bodies ein Formular integriert werden. Dies kann u.A. verwendet werden, um Informationen über den Benutzer abzufragen, bevor ein Chat gestartet wird. Die Konfiguration des Formulars wird via Übersetzungs-Keys gemacht.
+
+##### Anzuzeigende Felder
+
+Via Übersetzungs-Key `start-screen.form.fields` wird bestimmt, welche Felder im Formular angezeigt werden sollen. Die Namen der Felder werden durch `;` Getrennt definiert.
+
+Beispiel `start-screen.form.fields : name;email;accept`
+
+Danach wird pro Feld ein Objekt definiert, das als Key den Feldname und als Value ein Objekt mit folgende Attributen enthalten kann:
+
+| Attribut     | Zwingen / Optional                 | Mögliche Werte                                                                                       | Beschreibung                                                                  |
+| ------------ | ---------------------------------- | ---------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------- |
+| type         | zwingend                           | text, email, tel, number, date, time, datetime-local, week, month, password, radio, checkbox, select | Bestimmt das Aussehen und Verhalten des Feldes.                               |
+| name         | zwingend                           |                                                                                                      | Name des Feldes                                                               |
+| label        | zwingend                           | Text                                                                                                 | Label das beim Feld angezeigt wird                                            |
+| placeholder  | optional                           | Text                                                                                                 | Platzhalter, u.A. bei Texteingaben                                            |
+| defaultValue | optional                           |                                                                                                      | Standardwert                                                                  |
+| options      | zwingend bei Type radio und select | z.B. man:Mann;woman:Frau                                                                             | Bestimmt die Radio Buttons die angezeigt werden                               |
+| required     | optional                           | 'true' oder 'false'                                                                                  | Bestimmt, ob das Feld zwingend ausgefüllt werden muss                         |
+| min          | optional                           | eine Zahl als String                                                                                 | siehe https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#min     |
+| max          | optional                           | eine Zahl als String                                                                                 | siehe https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#max     |
+| pattern      | optional                           | Gültiges Regex Pattern                                                                               | siehe https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#pattern |
+
+Beispiel:
+
+```
+"start-screen": {
+  "form": {
+    "fields": "email;accept",
+    "email": {
+        "label": "E-Mail",
+        "type": "email",
+        "placeholder": "Deine E-Mail",
+        "required": "true"
+    },
+    "accept": {
+        "label": "Ich akzeptiere die Nutzungsbedingungen",
+        "type": "checkbox",
+        "required": "true"
+    },
+  }
+}
+
+```
+
+##### Fromulardaten nutzen
+
+Die Formulardaten werden in der Session-Info des Benutzers gespeichert, nachdem er den "Start-Chat-Button" klickt.
+
+Pfad: `sessionInfo.client.payload.querystrings`
+
+Beispiel:
+
+```
+{
+  client: {
+    payload: {
+      querystrings: {
+        "email": "hans@example.com",
+        "accept: "true",
+      }
+    }
+  }
+}
+```
+
+#### Start-Chat-Button
+
+Zuunterst im Startbildschirm wird der Start-Chat-Button angezeigt. Das Label kann via Übersetzungs-Key `start-screen.start-chat` konfiguriert werden kann. Klickt der Benutzer auf den Button, verschwindet der Startbildschirm und der Chat beginnt mit der Begrüssung des Chatbots.
 
 Es werden keine Benutzerdaten erfasst, bis der Benutzer durch den Klick auf den Button den Chat startet.
 

package/dist/client/assets/index-C1QXALqF.css

@@ -0,0 +1 @@
+@charset "UTF-8";body{margin:0}._app_wkun7_5{display:flex;flex-direction:row;height:100vh;height:100svh}:root{--aspect-ratio: calc(16 / 9);--body-background-color: white;--brand-primary-color: rgb(4, 47, 97);--brand-secondary-color: white;--danger-color: #b11106;--scrollbar-thumb-color: #adadad;--avatar-size: 2rem;--avatar-radius: 50%;--bot-avatar-background-color: rgb(233, 239, 246);--agent-avatar-background-color: rgb(233, 239, 246);--bubble-padding: .9em 1.3em;--bubble-margin-small: 3px;--bubble-margin-large: 1.2rem;--bubble-radius-large: 20px;--bubble-radius-small: 4px;--bot-bubble-background-color: white;--bot-bubble-text-color: #2e2e2e;--bot-bubble-border-color: #434343;--bot-bubble-border-width: 2px;--bot-bubble-top-left-radius: var(--bubble-radius-small);--bot-bubble-top-right-radius: var(--bubble-radius-large);--bot-bubble-bottom-right-radius: var(--bubble-radius-large);--bot-bubble-bottom-left-radius: var(--bubble-radius-small);--guest-bubble-background-color: var(--brand-primary-color);--guest-bubble-text-color: white;--guest-bubble-border-color: white;--guest-bubble-border-width: 0px;--guest-bubble-top-left-radius: var(--bubble-radius-large);--guest-bubble-top-right-radius: var(--bubble-radius-small);--guest-bubble-bottom-right-radius: var(--bubble-radius-small);--guest-bubble-bottom-left-radius: var(--bubble-radius-large)}::-webkit-scrollbar{width:8px;border:none}::-webkit-scrollbar-track{background:var(--body-background-color)}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb-color)}input::placeholder,textarea::placeholder{color:#666;opacity:1}._button_1e5of_54{display:inline-block;font-family:inherit;font-size:1em;padding:.5em 1em;border-radius:.2rem;background-color:#fff;cursor:pointer;transition:all .2s linear;text-align:center}._buttonDefault_1e5of_66{color:#000000d9;background-color:#fff;border:2px solid #adadad}._buttonDefault_1e5of_66:hover{color:var(--brand-primary-color);border:2px solid var(--brand-primary-color)}._buttonDefault_1e5of_66:disabled{cursor:not-allowed;opacity:.3}._buttonPrimary_1e5of_80{color:var(--brand-secondary-color);background-color:var(--brand-primary-color);border:2px solid var(--brand-primary-color)}._buttonPrimary_1e5of_80:hover{color:var(--brand-primary-color);background-color:var(--brand-secondary-color);border:2px solid var(--brand-primary-color)}._buttonPrimary_1e5of_80:disabled{cursor:not-allowed;opacity:.3;color:var(--brand-secondary-color);background-color:var(--brand-primary-color)}svg{fill:currentColor}._accessabilityHidden_1e5of_132{visibility:hidden}._messageContainer_1wdci_1{flex:1;overflow-y:scroll;overscroll-behavior:contain;padding-top:1rem;position:relative;-webkit-overflow-scrolling:touch}._messages_1wdci_10{position:relative;list-style:none;font-size:.9rem;line-height:1.4;padding:0 1rem;margin:0;overflow-wrap:break-word;word-wrap:break-word}@media (min-width: 36rem){._messageContainer_1wdci_1{padding-top:2rem}._messages_1wdci_10{font-size:1rem;line-height:1.8}}._generalConditionsContainer_1ijeb_1{margin-bottom:1.2rem;margin-left:1rem;margin-right:1rem}._generalConditions_1ijeb_1{transition:all .5s linear;background-color:var(--bot-bubble-background-color);color:var(--bot-bubble-text-color);padding:.9em 1.3em;font-size:.9rem}._generalConditionsHeader_1ijeb_15{display:flex;align-items:flex-end;justify-content:space-between;cursor:pointer}._generalConditionsHeader_1ijeb_15:focus{outline:none}._generalConditionsBody_1ijeb_25{display:flex;align-items:flex-end}._generalConditionsBody_1ijeb_25:focus{outline:none}._generalConditionsAccept_1ijeb_33{padding:.9em 1.3em;font-size:.9rem}._generalConditionsAccept_1ijeb_33:focus{outline:none}._message_1exlf_5{--bubble-margin: var(--bubble-margin-small);margin-bottom:var(--bubble-margin);transition:border-radius .5s}._messageBot_1exlf_11{display:flex;align-items:flex-end}._messageBot_1exlf_11:not(._messageBotLast_1exlf_15) ._avatar_1exlf_15{visibility:hidden}._messageBotFirst_1exlf_19{--bot-bubble-top-left-radius: var(--bubble-radius-large);--bot-bubble-top-right-radius: var(--bubble-radius-large);--bot-bubble-bottom-right-radius: var(--bubble-radius-large)}._messageBotLast_1exlf_15{--bot-bubble-top-right-radius: var(--bubble-radius-large);--bot-bubble-bottom-left-radius: var(--bubble-radius-large);--bot-bubble-bottom-right-radius: var(--bubble-radius-large);--bubble-margin: var(--bubble-margin-large)}._messageBotAnimated_1exlf_32{animation-duration:.25s;animation-timing-function:ease-in;animation-delay:0s;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:forwards;animation-play-state:running;animation-name:_fadeInLeft_1exlf_1}._messageGuest_1exlf_43{display:flex;align-items:flex-end;justify-content:flex-end}._messageGuestFirst_1exlf_49{--guest-bubble-top-left-radius: var(--bubble-radius-large);--guest-bubble-top-right-radius: var(--bubble-radius-large);--guest-bubble-bottom-left-radius: var(--bubble-radius-large)}._messageGuestLast_1exlf_55{--guest-bubble-top-left-radius: var(--bubble-radius-large);--guest-bubble-bottom-left-radius: var(--bubble-radius-large);--guest-bubble-bottom-right-radius: var(--bubble-radius-large);--bubble-margin: var(--bubble-margin-large);margin-bottom:var(--bubble-margin)}._avatar_1exlf_15{width:var(--avatar-size);height:var(--avatar-size);border-radius:var(--avatar-radius, 50%)}._botAvatar_1exlf_69{background-color:var(--bot-avatar-background-color)}._agentAvatar_1exlf_73{background-color:var(--agent-avatar-background-color)}._bubble_1exlf_77{display:inline-block;max-width:calc(100% - 4.3rem);position:relative}._bubbleContent_1exlf_83{padding:var(--bubble-padding);color:inherit;font-size:inherit}._bubbleContent_1exlf_83 *>:first-child{margin-top:0}._bubbleContent_1exlf_83 *>:last-child{margin-bottom:0}._bubbleContent_1exlf_83 h1,._bubbleContent_1exlf_83 h2,._bubbleContent_1exlf_83 h3,._bubbleContent_1exlf_83 h4,._bubbleContent_1exlf_83 h5,._bubbleContent_1exlf_83 p,._bubbleContent_1exlf_83 a,._bubbleContent_1exlf_83 ul,._bubbleContent_1exlf_83 ol{color:inherit;margin-block-start:.4em;margin-block-end:.4em;margin-inline-start:0px;margin-inline-end:0px}._bubbleContent_1exlf_83 h1{font-size:1.2rem;white-space:pre-wrap}._bubbleContent_1exlf_83 h2{font-size:1.1rem;white-space:pre-wrap}._bubbleContent_1exlf_83 h3,._bubbleContent_1exlf_83 h4,._bubbleContent_1exlf_83 h5{font-size:1rem;white-space:pre-wrap}._bubbleContent_1exlf_83 a{text-decoration:underline;cursor:pointer}._bubbleContent_1exlf_83 a:hover{opacity:.8}._bubbleContent_1exlf_83 img{max-width:100%;margin-block-start:0;margin-block-end:0}._bubbleContent_1exlf_83 ul{padding:0 0 0 1.1em}._bubbleContent_1exlf_83 ul>li{list-style-type:disc}._bubbleContent_1exlf_83 ul>li ul{margin-block-start:0}._bubbleContent_1exlf_83 ul>li p{margin-bottom:0}._bubbleContent_1exlf_83 ol{padding:0 0 0 1.1em}._bubbleContent_1exlf_83 ol>li{list-style-type:decimal}._bubbleContent_1exlf_83 table{width:100%}._bubbleContent_1exlf_83 td:not(:last-child){padding-right:1rem}._bubbleContent_1exlf_83 hr{margin-top:1rem;margin-bottom:1rem;border-top:1px solid;border-left:0;border-bottom:0;border-right:0}._bubbleLeft_1exlf_174{border-radius:var(--bot-bubble-top-left-radius) var(--bot-bubble-top-right-radius) var(--bot-bubble-bottom-right-radius) var(--bot-bubble-bottom-left-radius);border-color:var(--bot-bubble-border-color);border-width:var(--bot-bubble-border-width);border-style:solid;background-color:var(--bot-bubble-background-color);margin-left:1rem}._leftText_1exlf_183{color:var(--bot-bubble-text-color)}._leftText_1exlf_183 a{color:var(--bot-bubble-text-color)!important}._bubbleRight_1exlf_190{border-radius:var(--guest-bubble-top-left-radius) var(--guest-bubble-top-right-radius) var(--guest-bubble-bottom-right-radius) var(--guest-bubble-bottom-left-radius);border-color:var(--guest-bubble-border-color);border-width:var(--guest-bubble-border-width);border-style:solid;background-color:var(--guest-bubble-background-color)}._rightText_1exlf_198,._rightText_1exlf_198 a{color:var(--guest-bubble-text-color)}@keyframes _fadeInLeft_1exlf_1{0%{transform:translate(-100vw)}to{transform:translate(0)}}._problemReport_j3gru_1{display:flex;flex-direction:column;align-self:center}._problemReportIcon_j3gru_7{height:1rem;width:1rem;margin-left:.5rem}._problemReportIconActive_j3gru_13{cursor:pointer;opacity:1}._problemReportIconActive_j3gru_13:hover{opacity:.5}._problemReportIconInactive_j3gru_21{cursor:pointer;opacity:.5}._problemReportIconInactive_j3gru_21:hover{opacity:1}._title_1mhh2_1{margin-top:0;margin-block-start:0}._subtitle_1mhh2_6{margin-top:.5rem;margin-bottom:.5rem}._buttons_1mhh2_11{margin-top:1rem;display:flex;flex-direction:row;flex-wrap:wrap;gap:.5rem}._button_1mhh2_11{font-size:.9em;margin:0;background-color:var(--bot-bubble-text-color);color:var(--bot-bubble-background-color);border:2px solid var(--bot-bubble-text-color);width:100%}._button_1mhh2_11:hover{color:var(--bot-bubble-text-color);background-color:var(--bot-bubble-background-color);border:2px solid var(--bot-bubble-text-color)}._imageContainer_1mhh2_33{display:flex}._image_1mhh2_33{height:100%;width:100%;object-fit:cover;border-radius:calc(var(--bot-bubble-top-left-radius) - var(--bot-bubble-border-width)) calc(var(--bot-bubble-top-right-radius) - var(--bot-bubble-border-width)) 0 0}._video_container_1mhh2_44{display:flex}._video_1mhh2_44{width:100%;height:100%;border-radius:calc(var(--bot-bubble-top-left-radius) - var(--bot-bubble-border-width)) calc(var(--bot-bubble-top-right-radius) - var(--bot-bubble-border-width)) 0 0}._only_1mhh2_54{border-radius:calc(var(--bot-bubble-top-left-radius) - var(--bot-bubble-border-width)) calc(var(--bot-bubble-top-right-radius) - var(--bot-bubble-border-width)) calc(var(--bot-bubble-bottom-right-radius) - var(--bot-bubble-border-width)) calc(var(--bot-bubble-bottom-left-radius) - var(--bot-bubble-border-width))}._text_1k7aq_1{overflow-wrap:break-word}._ticontainer_wftg7_1{padding:var(--bubble-padding)}._tiblock_wftg7_5{align-items:center;display:flex;height:1rem;margin:2.1px}._tidot_wftg7_12{background-color:var(--bot-bubble-text-color);animation:_mercuryTypingAnimation_wftg7_1 1s infinite ease-in-out;border-radius:3px;display:inline-block;height:6px;margin-right:3px;width:6px}@keyframes _mercuryTypingAnimation_wftg7_1{0%{transform:translateY(0)}28%{transform:translateY(-5px)}44%{transform:translateY(0)}}._tidot_wftg7_12:nth-child(1){animation-delay:50ms}._tidot_wftg7_12:nth-child(2){animation-delay:.15s}._tidot_wftg7_12:nth-child(3){animation-delay:.25s}._container_t5oqt_1{padding:.5rem;display:flex;justify-content:center;align-items:center;border-top:1px solid #bfbfbf;background-color:#fff;font-size:.7rem;color:#717171}._container_t5oqt_1 a{color:var(--brand-primary-color);text-decoration:none}._container_fgqz2_1{visibility:hidden;position:absolute;z-index:3000;padding:1rem;height:100%;width:100%;background-color:#fff;top:0;bottom:0;transform:translateY(100%);overflow-y:auto;overscroll-behavior:contain}._container_fgqz2_1 h1{font-size:1.6em}._container_fgqz2_1 h2{font-size:1em}._container_fgqz2_1 p{line-height:1.5}@keyframes _slide-in_fgqz2_1{0%{transform:translateY(100%);visibility:visible}to{transform:translateY(0);visibility:visible}}@keyframes _slide-out_fgqz2_1{0%{transform:translateY(0);visibility:visible}99%{visibility:visible}to{transform:translateY(100%);visibility:hidden}}._containerOpen_fgqz2_48{animation:_slide-in_fgqz2_1 .2s forwards}._containerClose_fgqz2_52{animation:_slide-out_fgqz2_1 .2s forwards}._formContainer_fgqz2_56{display:flex;flex-direction:column}._emailInput_fgqz2_61{box-sizing:border-box;margin:1rem 0 0;font-variant:tabular-nums;list-style:none;font-feature-settings:"tnum";position:relative;display:inline-block;width:100%;min-width:0;padding:4px 11px;color:#000000a6;font-size:14px;line-height:1.5715;background-color:#fff;background-image:none;border:1px solid #d9d9d9;border-radius:2px;transition:all .3s;outline:none}._emailInput_fgqz2_61:hover{border:1px solid var(--brand-primary-color)}._emailInput_fgqz2_61:focus{border:1px solid var(--brand-primary-color)}._description_fgqz2_90{font-size:.9rem;-webkit-hyphens:auto;hyphens:auto}._actions_fgqz2_95{margin-top:1rem;padding-bottom:3rem;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;gap:.5rem}._validationError_fgqz2_105{padding-top:.5em;color:var(--danger-color);font-size:.8em;height:1rem}._submitted_fgqz2_112{margin-top:3rem;padding:1rem;border:1px solid var(--brand-primary-color);border-radius:2px}._inputContainer_1px77_1{z-index:2000}._blockUserInput_rv0dg_1{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:left;position:relative;background-color:#fff;color:#717171;font-size:.9rem;border-top:1px solid #bfbfbf;padding:.6rem 1rem;animation:_append-animate_rv0dg_1 .2s ease-in;z-index:0}@keyframes _append-animate_rv0dg_1{0%{opacity:0;top:6rem}to{opacity:1;top:0}}._callToActionContainer_1t611_1{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;position:relative;background-color:#fff;border-top:1px solid #bfbfbf;padding:.6rem 1rem .3rem;animation:_append-animate_1t611_1 .2s ease-in;z-index:0}@keyframes _append-animate_1t611_1{0%{opacity:0;top:6rem}to{opacity:1;top:0}}._callToActionTitle_1t611_24{font-size:.9rem;color:#717171;margin-bottom:.2rem;padding-right:.5rem}._rateOverlay_1t611_31{visibility:hidden;position:absolute;z-index:3000;display:flex;flex-direction:column;justify-content:space-between;height:100%;width:100%;background-color:var(--body-background-color);top:0;bottom:0;transform:translateY(100%);overflow-y:auto;overscroll-behavior:contain}._rateOverlay_1t611_31 h2{font-size:1em;text-align:center}._rateOverlay_1t611_31 p{line-height:1.5}._rateOverlay_1t611_31 form{display:flex;flex:1;flex-direction:column;justify-content:space-between}._body_1t611_61{height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:1rem}@keyframes _slide-in_1t611_1{0%{transform:translateY(100%);visibility:visible}to{transform:translateY(0);visibility:visible}}@keyframes _slide-out_1t611_1{0%{transform:translateY(0);visibility:visible}99%{visibility:visible}to{transform:translateY(100%);visibility:hidden}}._rateOverlayOpen_1t611_92{animation:_slide-in_1t611_1 .2s forwards}._rateOverlayClose_1t611_96{animation:_slide-out_1t611_1 .2s forwards}._footer_1t611_100{border-top:1px solid #bfbfbf;background-color:#fff}._footer_1t611_100 input{font-size:1rem;border:none;box-sizing:border-box;width:100%;outline-width:0;padding:1.3rem 1rem 1rem;text-overflow:ellipsis;color:#717171}._actions_1t611_115{display:flex;padding:.5rem;justify-content:flex-end;align-items:center;line-height:0}._actions_1t611_115 button{width:100%;font-size:.8rem}._bubbles_1t611_127{display:flex;flex-direction:column}@keyframes _appear_1t611_1{0%{opacity:0}66%{opacity:0}to{opacity:1}}@keyframes _fadeInLeft_1t611_1{0%{transform:translate(-3rem)}80%{transform:translate(-3rem)}to{transform:translate(0)}}._rateFeedbackBotBubble_1t611_154{display:flex;align-items:flex-end;margin:1rem 0}._rateFeedbackGuestBubble_1t611_160{display:flex;align-items:flex-end;justify-content:flex-end}._avatar_1t611_166{width:var(--avatar-size);height:var(--avatar-size);animation-duration:.5s;animation-timing-function:ease-in;animation-delay:0s;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:forwards;animation-play-state:running;animation-name:_fadeInLeft_1t611_1}._bubble_1t611_127{padding:var(--bubble-padding);font-size:.9rem;animation-duration:1s;animation-delay:0s;animation-timing-function:ease;animation-iteration-count:1;animation-direction:normal;animation-fill-mode:forwards;animation-play-state:running;animation-name:_appear_1t611_1}._botBubble_1t611_192{border-radius:var(--bubble-radius-large);background-color:var(--bot-bubble-background-color);margin-left:1rem;color:var(--bot-bubble-text-color)}._botBubble_1t611_192 a{color:var(--bot-bubble-text-color)!important}._guestBubble_1t611_202{animation-duration:.25s;align-self:end;border-radius:var(--bubble-radius-large);background-color:var(--guest-bubble-background-color);color:var(--guest-bubble-text-color);margin-left:1rem;display:box;line-clamp:3;box-orient:vertical;overflow:hidden}._guestBubble_1t611_202 a{color:var(--guest-bubble-text-color)}._rateText_1t611_218{padding:.75rem;font-size:.9rem}._stars_1t611_223{box-sizing:border-box;font-variant:tabular-nums;font-feature-settings:"tnum";display:inline-block;margin:0;padding:0;color:#c4c4c4;line-height:unset;list-style:none;outline:none}._starsSmall_1t611_236{font-size:1.2rem}._starsLarge_1t611_240{font-size:2rem}._starsLarge_1t611_240 ._star_1t611_223:not(:last-child){margin-right:1.5rem}._star_1t611_223{display:inline-block;color:inherit;cursor:pointer}._star_1t611_223:not(:last-child){margin-right:8px}._starReadonly_1t611_257{cursor:inherit}._star_1t611_223>div{transition:all .3s,outline 0s}._starIcon_1t611_265{display:inline-block;color:inherit;font-style:normal;line-height:0;text-align:center;text-transform:none;text-rendering:optimizelegibility}._star_1t611_223 [aria-checked=true]{color:var(--brand-primary-color, #fadb14)}._star_1t611_223 [aria-checked=false]{color:#adadad}._starsDescriptionContainer_1t611_283{display:flex;flex-direction:column;width:fit-content;padding-top:1rem;padding-bottom:1rem;margin:auto}._starsDescription_1t611_283{display:flex;flex-direction:row;justify-content:space-between;font-size:.7rem;color:#000000a6}._inputWrapper_lbrof_5{display:flex;justify-content:center;align-items:center;line-height:0;border-top:1px solid #bfbfbf;background-color:#fff}._messageInputWrapper_lbrof_14{flex:1;margin-right:.5rem}._messageInput_lbrof_14{resize:none;font-size:1rem;font-family:inherit;border:none;height:calc(1em + 3rem);box-sizing:border-box;width:100%;outline-width:0;padding:1.3rem 1rem;text-overflow:ellipsis}._messageInput_lbrof_14:focus{outline:none}._buttons_lbrof_36{padding-right:.5rem;display:flex;justify-content:center;align-items:center}._button_lbrof_36[disabled]{opacity:.4}._button_lbrof_36{display:flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--brand-primary-color);background-color:var(--brand-secondary-color);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:50%;border:none;text-align:center}._button_lbrof_36 svg{margin:2px;height:2em;width:2em;fill:currentColor}._button_lbrof_36:hover,._button_lbrof_36:active,._button_lbrof_36:focus{border:none;outline:none;color:var(--brand-secondary-color);background-color:var(--brand-primary-color)}._button_lbrof_36:not(:last-child){margin-right:.5em}*{box-sizing:border-box}._audioRecorder_xps9k_5{display:flex;margin-left:-5px}._recordButton_xps9k_10{display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;width:40px;height:40px;border-radius:50%;border:none;text-align:center;color:var(--brand-primary-color);background-color:var(--brand-secondary-color)}._recordButton_xps9k_10:hover,._recordButton_xps9k_10:active,._recordButton_xps9k_10:focus{background-color:var(--brand-primary-color);color:var(--brand-secondary-color);border:none;outline:none}._recordButton_xps9k_10 svg{margin:2px;height:2em;width:2em;fill:currentColor}._submitButton_xps9k_37{display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;width:40px;height:40px;border-radius:50%;border:none;text-align:center;color:var(--brand-primary-color);background-color:var(--brand-secondary-color)}._submitButton_xps9k_37:hover,._submitButton_xps9k_37:active,._submitButton_xps9k_37:focus{background-color:var(--brand-primary-color);color:var(--brand-secondary-color);border:none;outline:none}._submitButton_xps9k_37 svg{margin:2px;height:2em;width:2em;fill:currentColor}._cancelButton_xps9k_64{display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-user-select:none;user-select:none;width:40px;height:40px;border-radius:50%;border:none;text-align:center;color:var(--brand-primary-color);background-color:var(--brand-secondary-color)}._cancelButton_xps9k_64:hover,._cancelButton_xps9k_64:active,._cancelButton_xps9k_64:focus{background-color:var(--brand-primary-color);color:var(--brand-secondary-color);border:none;outline:none}._cancelButton_xps9k_64 svg{margin:2px;height:2em;width:2em;fill:currentColor}._recorderIcon_xps9k_91{width:1.3em;height:1.3em;border-radius:50%;animation:_pulse_xps9k_1 2s infinite;margin:auto .6em}@keyframes _pulse_xps9k_1{0%{background-color:#fff}40%{background-color:var(--danger-color)}60%{background-color:var(--danger-color)}to{background-color:#fff}}._spinning_xps9k_113{width:40px;height:40px;padding:5px;display:block;margin:auto;color:var(--brand-primary-color);animation:_spin_xps9k_113 1.2s linear infinite}@keyframes _spin_xps9k_113{to{transform:rotate(360deg)}}._quickReplies_11l22_1{display:flex;flex-flow:row wrap;justify-content:flex-end;padding:.4rem 1rem;gap:.5rem}._quickReply_11l22_9{font-size:.8rem;background-color:var(--brand-secondary-color);color:var(--brand-primary-color);border:1px solid var(--brand-primary-color)}._quickReply_11l22_9:active,._quickReply_11l22_9:focus,._quickReply_11l22_9:hover{background-color:var(--brand-primary-color);color:var(--brand-secondary-color);border:1px solid var(--brand-secondary-color);outline:none}._chatwindow_phukm_1{position:relative;width:100%;height:100vh;height:100svh;max-width:48rem;margin-left:auto;margin-right:auto;overflow:hidden;background-color:var(--body-background-color)}._chatcontent_phukm_13{display:flex;flex-flow:column nowrap;width:100%;height:100vh;height:100svh}._container_c5lw5_2{display:grid;grid-template-rows:1fr auto;height:100%}._body_c5lw5_8{padding:1rem;overflow-y:auto}._intro_c5lw5_13{margin-bottom:1em}._intro_c5lw5_13 h1{font-size:1.3em}._intro_c5lw5_13 h2{font-size:1em}._intro_c5lw5_13 p{line-height:1.5}._footer_c5lw5_26{padding:1rem}._startChatButton_c5lw5_30{width:100%}._formFields_c5lw5_34{display:flex;flex-direction:column;gap:.75em}._formField_c5lw5_34{display:flex;flex-direction:column;gap:8px}._radio_c5lw5_46{display:flex;gap:6px;accent-color:var(--brand-primary-color)}._checkbox_c5lw5_52{display:flex;gap:6px;padding:6px 0;accent-color:var(--brand-primary-color)}._input_c5lw5_59 input{border-width:1px;border-style:solid;border-color:#d9d9d9;box-sizing:border-box;margin:0;padding:4px 11px;color:#000000e0;font-size:1em;line-height:1.57;list-style:none;font-family:inherit;position:relative;display:inline-block;width:100%;min-width:0;border-radius:6px;transition:all .2s;accent-color:var(--brand-primary-color)}._input_c5lw5_59 input:focus,._input_c5lw5_59 input:focus-within{border-color:var(--brand-primary-color);box-shadow:0 0 0 2px #0591ff1a;outline:0;background-color:#fff}._input_c5lw5_59 input:hover{border-color:var(--brand-primary-color)}._inputLabel_c5lw5_89{margin-bottom:8px}._selectWrapper_c5lw5_93{position:relative}._selectWrapper_c5lw5_93:after{content:"⌄";font-size:1rem;top:2px;right:14px;position:absolute}._select_c5lw5_93 select{border-width:1px;border-style:solid;border-color:#d9d9d9;box-sizing:border-box;margin:0;padding:4px 11px;color:#000000e0;font-size:1em;line-height:1.57;list-style:none;font-family:inherit;position:relative;display:inline-block;width:100%;min-width:0;border-radius:6px;transition:all .2s;accent-color:var(--brand-primary-color);-webkit-appearance:none;-moz-appearance:none;appearance:none}._select_c5lw5_93 select:focus,._select_c5lw5_93 select:focus-within{border-color:var(--brand-primary-color);box-shadow:0 0 0 2px #0591ff1a;outline:0;background-color:#fff}._select_c5lw5_93 select:hover{border-color:var(--brand-primary-color)}._selectLabel_c5lw5_135{margin-bottom:8px}