@snf/access-qa-bot 0.3.1 → 1.1.0-rc.1

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  # ACCESS Q&A Bot
2
2
 
3
- A React component and Web Component for integrating the ACCESS Q&A Bot into your application.
3
+ A React component and Web Component for integrating the ACCESS Q&A Bot into your application. The bot can operate in two modes: **floating** (chat button that opens/closes a window) or **embedded** (always visible inline).
4
4
 
5
5
  ## Installation
6
6
 
@@ -8,175 +8,318 @@ A React component and Web Component for integrating the ACCESS Q&A Bot into your
8
8
  npm install @snf/access-qa-bot
9
9
  ```
10
10
 
11
- ## Usage
11
+ ## Developing React App
12
12
 
13
- ### As a React Component
13
+ ```bash
14
+ npm install
15
+ npm run start
16
+ ```
14
17
 
15
- ```jsx
16
- import React, { useState } from 'react';
17
- import { QABot } from 'access-qa-bot';
18
+ ## Running the Demo
18
19
 
19
- function MyApp() {
20
- const [isOpen, setIsOpen] = useState(false);
21
- const isLoggedIn = true; // Determine based on your auth logic
22
-
23
- return (
24
- <div className="app">
25
- <h1>My React Application</h1>
26
-
27
- <button onClick={() => setIsOpen(!isOpen)}>
28
- {isOpen ? 'Close' : 'Open'} Q&A Bot
29
- </button>
30
-
31
- <QABot
32
- isLoggedIn={isLoggedIn}
33
- isOpen={isOpen}
34
- onClose={() => setIsOpen(false)}
35
- welcome="Welcome to the ACCESS Q&A Bot!"
36
- prompt="How can I help you today?"
37
- apiKey={process.env.REACT_APP_API_KEY}
38
- />
39
- </div>
40
- );
41
- }
20
+ This will serve the index.html file in the root directory, which demonsrates two different ways to integrate the bot.
21
+
22
+ ```bash
23
+ npm run build:lib
24
+ npm run build
25
+ npx serve
42
26
  ```
43
27
 
44
- ### As a Web Component
45
28
 
46
- #### Method 1: Using HTML directly
29
+ ### Floating vs Embedded Modes
30
+
31
+ The ACCESS Q&A Bot supports two display modes:
32
+
33
+ - **Floating Mode** (default): Shows a chat button that opens/closes a floating chat window
34
+ - **Embedded Mode**: Always visible, embedded directly in the page content
35
+
36
+ **All integration methods support both modes**, but have different defaults:
37
+
38
+ | Method | Default Mode | Override |
39
+ |--------|--------------|----------|
40
+ | Element ID (`#qa-bot`) | Floating | Set `embedded: true` |
41
+ | CSS Class (`.embedded-qa-bot`) | Embedded | n/a |
42
+ | JavaScript API | Floating | Set `embedded: true` |
43
+ | Custom Element (`<access-qa-bot>`) | Floating | Add `embedded` attribute |
44
+
45
+ ## Integration Methods
46
+
47
+ ### Method 1: Auto-Detection by Element ID (Floating by Default)
48
+
49
+ Simply add a div with id `qa-bot` to your HTML:
47
50
 
48
51
  ```html
49
52
  <script src="https://unpkg.com/@snf/access-qa-bot@0.2.0/dist/access-qa-bot.standalone.js"></script>
50
53
 
51
- <access-qa-bot
52
- welcome="Welcome to the Q&A Bot!"
53
- prompt="Ask me anything about ACCESS..."
54
- is-logged-in
55
- is-open>
56
- </access-qa-bot>
54
+ <!-- Automatically creates a floating chat button -->
55
+ <div id="qa-bot"></div>
57
56
  ```
58
57
 
59
- #### Method 2: Creating programmatically
58
+ ### Method 2: Auto-Detection by CSS Class (Embedded by Default)
59
+
60
+ Use the `embedded-qa-bot` class with optional data attributes:
60
61
 
61
62
  ```html
62
63
  <script src="https://unpkg.com/@snf/access-qa-bot@0.2.0/dist/access-qa-bot.standalone.js"></script>
63
64
 
64
- <div id="qa-container"></div>
65
-
66
- <script>
67
- const container = document.getElementById('qa-container');
68
- const qaBot = document.createElement('access-qa-bot');
69
- qaBot.setAttribute('welcome', 'Hello!');
70
- qaBot.setAttribute('prompt', 'Ask something...');
71
- qaBot.setAttribute('is-logged-in', '');
72
- container.appendChild(qaBot);
73
- </script>
65
+ <!-- Automatically creates an embedded chat widget -->
66
+ <div class="embedded-qa-bot"
67
+ data-welcome="Hello!"
68
+ data-prompt="Ask me anything..."></div>
74
69
  ```
75
70
 
76
- #### Method 3: Using the JavaScript API
71
+ ### Method 3: Programmatic JavaScript API (Floating by Default)
72
+
73
+ Call the `accessQABot()` function with full control:
77
74
 
78
75
  ```html
79
76
  <script src="https://unpkg.com/@snf/access-qa-bot@0.2.0/dist/access-qa-bot.standalone.js"></script>
80
77
 
81
- <div id="js-api-container"></div>
78
+ <div id="my-bot-container"></div>
82
79
 
83
80
  <script>
84
- window.addEventListener('load', function() {
85
- if (window.accessQABot && window.accessQABot.qAndATool) {
86
- window.accessQABot.qAndATool({
87
- target: document.getElementById('js-api-container'),
88
- welcome: "This is created using the JavaScript API!",
89
- prompt: "Ask a question about ACCESS...",
81
+ window.addEventListener('load', function() {
82
+ const controller = accessQABot({
83
+ target: document.getElementById('my-bot-container'),
84
+ embedded: false, // false = floating (default), true = embedded
85
+ welcome: "Custom welcome message!",
86
+ prompt: "Ask me about ACCESS...",
90
87
  isLoggedIn: true,
91
- embedded: true,
92
- isOpen: true
93
- });
94
- }
95
- });
88
+ defaultOpen: false,
89
+ ringEffect: true // Enable phone ring animation on tooltip
90
+ });
91
+
92
+ // Use the controller to interact with the bot
93
+ controller.addMessage("Hello from JavaScript!");
94
+ controller.openChat(); // Only works in floating mode
95
+ });
96
96
  </script>
97
97
  ```
98
98
 
99
- ### Direct Deployment via jsDelivr CDN
99
+ ### Method 4: Custom Web Component Element (Floating by Default)
100
100
 
101
- For websites that don't use npm packages, you can directly include the ACCESS Q&A Bot using jsDelivr CDN:
101
+ Use the `<access-qa-bot>` custom element directly in your HTML:
102
102
 
103
103
  ```html
104
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/necyberteam/qa-bot@v0.2.0/build/static/css/main.css">
105
- <div style="display:none;" id="qa-bot">
106
- &nbsp;
107
- </div>
108
- <script src="https://cdn.jsdelivr.net/gh/necyberteam/qa-bot@v0.2.0/build/static/js/main.js"></script>
109
- <script src="https://cdn.jsdelivr.net/gh/necyberteam/qa-bot@v0.2.0/build/static/js/453.chunk.js"></script>
104
+ <script src="https://unpkg.com/@snf/access-qa-bot@0.2.0/dist/access-qa-bot.standalone.js"></script>
105
+
106
+ <!-- Floating mode (default) -->
107
+ <access-qa-bot
108
+ welcome="Welcome to the Q&A Bot!"
109
+ prompt="Ask me anything about ACCESS..."
110
+ is-logged-in
111
+ default-open
112
+ ring-effect>
113
+ </access-qa-bot>
114
+
115
+ <!-- Embedded mode -->
116
+ <access-qa-bot
117
+ embedded
118
+ welcome="This is an embedded bot!"
119
+ prompt="Ask your questions here...">
120
+ </access-qa-bot>
121
+ ```
122
+
123
+ **Custom Element Attributes:**
124
+ - `api-key` - API key for authentication
125
+ - `default-open` - Initially open floating chat (boolean attribute)
126
+ - `disabled` - Disable chat input (boolean attribute)
127
+ - `embedded` - Use embedded mode (boolean attribute)
128
+ - `is-logged-in` - User is logged in (boolean attribute)
129
+ - `login-url` - URL for login redirect
130
+ - `prompt` - Input placeholder text
131
+ - `ring-effect` - Enable phone ring animation on tooltip (boolean attribute)
132
+ - `welcome` - Welcome message
133
+
134
+ **Accessing the Custom Element Programmatically:**
135
+ ```javascript
136
+ // Get reference to the custom element
137
+ const botElement = document.querySelector('access-qa-bot');
138
+
139
+ // Call methods directly on the element
140
+ botElement.addMessage("Hello World!");
141
+ botElement.setBotIsLoggedIn(true);
142
+ botElement.openChat(); // Floating mode only
143
+ botElement.closeChat(); // Floating mode only
144
+ botElement.toggleChat(); // Floating mode only
110
145
  ```
111
146
 
112
- Replace `v0.2.0` with the specific version you want to use. This method provides the React version of the bot and automatically initializes it when the page loads.
147
+ ## Programmatic Control
148
+
149
+ When using the JavaScript API, you get a controller object with these methods:
150
+
151
+ ```javascript
152
+ const controller = accessQABot({...});
153
+
154
+ // Add a message to the chat
155
+ controller.addMessage("Hello World!");
156
+
157
+ // Set user login status
158
+ controller.setBotIsLoggedIn(true);
159
+
160
+ // Control chat window (floating mode only)
161
+ controller.openChat();
162
+ controller.closeChat();
163
+ controller.toggleChat();
164
+
165
+ // Cleanup
166
+ controller.destroy();
167
+ ```
168
+
169
+ ## As a React Component
170
+
171
+ For React applications, import and use the component directly:
172
+
173
+ ```jsx
174
+ import React, { useRef, useState } from 'react';
175
+ import { QABot, accessQABot } from '@snf/access-qa-bot';
176
+
177
+ function MyApp() {
178
+ const [isLoggedIn, setIsLoggedIn] = useState(false);
179
+ const botRef = useRef();
180
+
181
+ const handleAddMessage = () => {
182
+ botRef.current?.addMessage("Hello from React!");
183
+ };
184
+
185
+ // You can also use the programmatic API in React if needed
186
+ const handleCreateProgrammaticBot = () => {
187
+ const container = document.getElementById('programmatic-bot');
188
+ if (container) {
189
+ accessQABot({
190
+ target: container,
191
+ embedded: true,
192
+ welcome: "Programmatically created bot!",
193
+ isLoggedIn: isLoggedIn,
194
+ ringEffect: true
195
+ });
196
+ }
197
+ };
198
+
199
+ return (
200
+ <div className="app">
201
+ <h1>My React Application</h1>
202
+
203
+ <button onClick={handleAddMessage}>
204
+ Send Message to Bot
205
+ </button>
206
+
207
+ <button onClick={handleCreateProgrammaticBot}>
208
+ Create Programmatic Bot
209
+ </button>
210
+
211
+ <QABot
212
+ ref={botRef}
213
+ embedded={false} // true for embedded, false for floating
214
+ isLoggedIn={isLoggedIn}
215
+ defaultOpen={false}
216
+ welcome="Welcome to the ACCESS Q&A Bot!"
217
+ prompt="How can I help you today?"
218
+ ringEffect={true}
219
+ apiKey={process.env.REACT_APP_API_KEY}
220
+ />
221
+
222
+ <div id="programmatic-bot"></div>
223
+ </div>
224
+ );
225
+ }
226
+ ```
113
227
 
114
- ## Properties
228
+ ## Configuration Properties
115
229
 
116
230
  | Property | Type | Description |
117
231
  |----------|------|-------------|
118
- | welcome | string | Welcome message shown to the user |
119
- | prompt | string | Text shown in the input field |
120
- | embedded | boolean | Display in embedded mode |
121
- | isLoggedIn / is-logged-in | boolean | Whether the user is logged in |
122
- | isAnonymous / is-anonymous | boolean | Whether the user is anonymous |
123
- | disabled | boolean | Disable the chat input |
124
- | isOpen / is-open | boolean | Whether the chat is open |
125
- | apiKey / api-key | string | API key for authentication |
126
- | onClose | function | Callback when the chat is closed (React only) |
232
+ | `apiKey` / `api-key` | string | API key for authentication (defaults to demo key) |
233
+ | `defaultOpen` / `default-open` | boolean | Whether floating chat opens initially (ignored in embedded mode) |
234
+ | `disabled` | boolean | Disable the chat input |
235
+ | `embedded` | boolean | **false** = floating mode, **true** = embedded mode |
236
+ | `isLoggedIn` / `is-logged-in` | boolean | Whether the user is logged in |
237
+ | `loginUrl` / `login-url` | string | URL to redirect for login (default: '/login') |
238
+ | `prompt` | string | Placeholder text shown in the input field |
239
+ | `ringEffect` / `ring-effect` | boolean | Enable phone ring animation on tooltip (floating mode only) |
240
+ | `welcome` | string | Welcome message shown to the user |
127
241
 
128
- ## Events
242
+ ### CSS Custom Properties (Theming)
129
243
 
130
- When using as a Web Component, you can listen for the following events:
244
+ Customize the appearance by setting CSS custom properties on the container:
131
245
 
132
- ```javascript
133
- document.querySelector('access-qa-bot').addEventListener('qabot-close', () => {
134
- console.log('Chat was closed');
135
- });
246
+ ```html
247
+ <div id="qa-bot" style="
248
+ --primary-color: #007bff;
249
+ --secondary-color: #6c757d;
250
+ --font-family: 'Arial', sans-serif;
251
+ "></div>
136
252
  ```
137
253
 
138
- ## Disambiguating all the different html files here
254
+ ## Direct CDN Deployment
139
255
 
140
- - **index.html**: The main demo file showcasing React-based integration methods with three different approaches to integrate the QA Bot: auto-mounting to a specific div ID, using class-based selectors, and explicitly calling the JavaScript function.
256
+ For websites that don't use npm, include directly via CDN:
141
257
 
142
- - **public/index.html**: The standard React application template file created by Create React App. This serves as the base HTML template that gets processed during the React build process.
143
-
144
- - **build/index.html**: The minified production version of the public/index.html file after the build process has completed. This contains all the necessary script and link tags to load the compiled React application.
258
+ ```html
259
+ <!-- CSS (optional, for embedded styling) -->
260
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/necyberteam/qa-bot@v0.2.0/build/static/css/main.css">
145
261
 
146
- - **web-component-demo.html**: A standalone demo specifically showcasing the Web Component implementation (using the custom `<access-qa-bot>` element). This demonstrates three integration methods: standard floating button, embedded mode, and using the JavaScript API with the Web Component.
262
+ <!-- JavaScript -->
263
+ <script src="https://cdn.jsdelivr.net/gh/necyberteam/qa-bot@v0.2.0/dist/access-qa-bot.standalone.js"></script>
147
264
 
148
- The **index.html** file is focused on the React component usage, while **web-component-demo.html** focuses on the Web Component usage, providing complete examples for both integration approaches.
265
+ <!-- Your content -->
266
+ <div id="qa-bot"></div>
267
+ ```
149
268
 
150
269
  ## Development and Testing
151
270
 
152
- ### Development Server
153
- When running the default development script (`npm start` or `yarn start`), the application serves the content from the `public` directory using React's development server. This shows the default React implementation with hot reloading enabled. Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
154
-
271
+ ### Development Server (React Implementation)
155
272
  ```bash
156
- # Start the development server (React implementation)
157
273
  npm start
274
+ # Opens http://localhost:3000 with React dev server
158
275
  ```
159
276
 
160
- ### Testing Standalone Demo Files
161
- To test the standalone demo files (`index.html` and `web-component-demo.html`) at the root level, you need to:
162
-
163
- 1. Stop the development server (if running)
164
- 2. Build the project (`npm run build`)
165
- 3. Serve the root directory using a static file server:
166
-
277
+ ### Testing Standalone Integration
167
278
  ```bash
168
- # After building, serve the files from root
279
+ # Build the library and project
280
+ npm run build:lib
281
+ npm run build
282
+
283
+ # Serve the standalone demo files
169
284
  npx serve
285
+
286
+ # Then visit:
287
+ # http://localhost:3000/index.html (integration demos)
288
+ # http://localhost:3000/web-component-demo.html (web component demos)
170
289
  ```
171
290
 
172
- Then you can access:
173
- - The React demo at `/index.html` (or just `/`)
174
- - The Web Component demo at `/web-component-demo.html`
291
+ ## File Structure Guide
292
+
293
+ - **`index.html`** - Main demo showing all integration methods
294
+ - **`web-component-demo.html`** - Web Component specific demos
295
+ - **`public/index.html`** - React app template (Create React App)
296
+ - **`build/index.html`** - Built React app
297
+ - **`src/`** - Source code
298
+ - **`components/QABot.js`** - Main React component
299
+ - **`web-component.js`** - Web Component implementation
300
+ - **`lib.js`** - JavaScript API
301
+
302
+ ## Important Notes
303
+
304
+ 1. **Embedded vs Floating**:
305
+ - Embedded mode is always visible and ignores `defaultOpen`
306
+ - Floating mode shows a chat button; `defaultOpen` controls initial state
307
+ - Chat window controls (`openChat`, `closeChat`, `toggleChat`) only work in floating mode
308
+
309
+ 2. **Ring Effect**:
310
+ - Only works in floating mode when the tooltip is visible
311
+ - Triggers a phone-like ring animation to draw attention
312
+ - Activates once when the bot is first loaded (500ms delay)
313
+ - Won't repeat if user has already interacted with the chat
314
+
315
+ 3. **Auto-Detection**: The standalone script automatically detects and initializes:
316
+ - `#qa-bot` → Floating mode
317
+ - `.embedded-qa-bot` → Embedded mode
175
318
 
176
- This allows testing both integration approaches (React components and Web Components) in their respective demo environments.
319
+ 4. **API Key**: Defaults to demo key if not provided
177
320
 
178
- Note: The standalone demos rely on the built files in the `dist` and `build` directories, so make sure to build the project before testing.
321
+ 5. **Browser Support**: Uses modern browser features; consider polyfills for older browsers
179
322
 
180
- ## Browser Support
323
+ ## Examples Repository
181
324
 
182
- The Web Component implementation uses modern browser features. For older browsers, consider using a polyfill.
325
+ See the demo files in this repository for complete working examples of all integration methods.
@@ -1,2 +1,2 @@
1
- body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.rcb-toggle-button.rcb-button-show{background-color:#1a5b6e;background-position:50%;background-repeat:no-repeat;background-size:72%}.rcb-chat-window{max-width:100%;width:550px!important;.rcb-bot-avatar{background-position:50%;background-repeat:no-repeat;background-size:contain;border-radius:0}.rcb-chat-header{align-items:center;display:flex;flex-direction:row;font-weight:700}a{color:#000;font-weight:700;text-decoration:underline}a:hover{color:#107180}.rcb-bot-message a{color:#fff;text-decoration:none}.rcb-bot-message a:hover{text-decoration:underline}.rcb-chat-input-textarea{overflow-y:auto}.rcb-chat-footer-container{font-size:10px}}.embedded-qa-bot{.rcb-chat-window{max-width:100%;width:100%!important}}.rcb-chat-header-container{border-bottom:1px solid #ccc;color:#fff;display:flex;justify-content:space-between;max-height:55px;padding:12px}.rcb-chat-header{display:flex;flex-direction:row}.rcb-bot-avatar{background-size:cover;border-radius:50%;height:30px;margin-right:12px;width:30px}.rcb-message-prompt-container.visible{align-items:center;animation:rcb-animation-pop-in .3s ease-in-out;bottom:0;display:flex;justify-content:center;margin:auto;opacity:1;pointer-events:auto;position:-webkit-sticky;position:sticky}.rcb-message-prompt-container.hidden{height:0;opacity:0;pointer-events:none;visibility:hidden}.rcb-message-prompt-text{background-color:#fff;border:.5px solid #adadad;border-radius:20px;color:#adadad;cursor:pointer;font-size:12px;padding:6px 12px;transition:color .3s ease,border-color .3s ease;z-index:9999}.rcb-message-prompt-container.hidden .rcb-message-prompt-text{padding:0}.rcb-user-message-container{display:flex;flex-direction:row;justify-content:right}.rcb-user-message{border-radius:22px;font-size:15px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;margin-right:16px;margin-top:8px;min-height:20px;overflow:hidden;overflow-wrap:anywhere;padding:12px 16px;text-align:right;white-space:pre-wrap;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.rcb-user-message-offset{margin-right:50px}.rcb-user-message-entry{animation:rcb-animation-user-message-entry .3s ease-in backwards}.rcb-message-user-avatar{background-size:cover;border-radius:50%;height:40px;margin-left:-10px;margin-right:6px;margin-top:9px;width:40px}.rcb-bot-message-container{display:flex;flex-direction:row}.rcb-bot-message{border-radius:22px;font-size:15px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;margin-left:16px;margin-top:8px;min-height:20px;overflow:hidden;overflow-wrap:anywhere;padding:12px 16px;text-align:left;white-space:pre-wrap;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.rcb-bot-message-offset{margin-left:50px}.rcb-bot-message-entry{animation:rcb-animation-bot-message-entry .3s ease-in backwards}.rcb-message-bot-avatar{background-size:cover;border-radius:50%;height:40px;margin-left:6px;margin-right:-10px;margin-top:9px;width:40px}.rcb-typing-indicator{align-items:center;display:flex}.rcb-dot{animation:rcb-animation-bot-typing 1s infinite;background-color:#ccc;border-radius:50%;height:8px;margin-right:4px;width:8px}.rcb-dot:nth-child(2){animation-delay:.2s}.rcb-dot:nth-child(3){animation-delay:.4s}.rcb-chat-body-container{height:100%;overflow-x:hidden;overflow-y:scroll;padding-bottom:16px;position:relative;touch-action:pan-y;width:100%}.rcb-chat-body-container::-webkit-scrollbar-track{background-color:#f1f1f1}.rcb-chat-body-container::-webkit-scrollbar-thumb{background-color:#ddd;border-radius:4px}.rcb-chat-body-container::-webkit-scrollbar-thumb:hover{background-color:#cfcfcf}.rcb-chat-body-container::-webkit-scrollbar-corner{background-color:#f1f1f1}.rcb-checkbox-container{display:flex;flex-wrap:wrap;gap:10px;margin-left:16px;padding-top:12px}.rcb-checkbox-offset{margin-left:50px!important}.rcb-checkbox-row-container{align-items:center;animation:rcb-animations-checkboxes-entry .5s ease-out;background-color:#fff;border-radius:10px;border-style:solid;border-width:.5px;cursor:pointer;display:flex;gap:5px;max-height:32px;min-height:30px;overflow:hidden;width:80%}.rcb-checkbox-row-container:hover{box-shadow:0 0 5px #0003}.rcb-checkbox-row{align-items:center;cursor:pointer;display:inline-flex;margin-left:10px}.rcb-checkbox-mark{align-items:center;background-color:#f2f2f2;border:none;border-radius:50%;cursor:pointer;display:flex;height:20px;justify-content:center;margin-right:10px;transition:all .3s ease;width:20px}.rcb-checkbox-mark:hover{background-color:#c2c2c2}.rcb-checkbox-mark:before{content:"✓";transition:all .3s ease}.rcb-checkbox-label{font-size:14px}.rcb-checkbox-next-button{align-items:center;animation:rcb-animations-checkboxes-entry .5s ease-out;background-color:#fff;border-radius:10px;border-style:solid;border-width:.5px;cursor:pointer;display:inline-block;font-size:24px;max-height:32px;min-height:30px;text-align:center;width:80%}.rcb-checkbox-next-button:before{content:"→"}.rcb-checkbox-next-button:hover{box-shadow:0 0 5px #0003}.rcb-options-container{display:flex;flex-wrap:wrap;gap:10px;margin-left:16px;max-width:70%;padding-top:12px}.rcb-options-offset{margin-left:50px!important}.rcb-options{align-items:center;animation:rcb-animation-options-entry .5s ease-out;border-radius:20px;border-style:solid;border-width:.5px;cursor:pointer;display:inline-flex;font-size:14px;justify-content:center;overflow:hidden;padding:10px 20px;transition:background-color .3s ease}.rcb-options:hover{box-shadow:0 0 5px #0003}.rcb-line-break-container{align-items:center;display:flex;justify-content:center;max-height:45px;padding-bottom:5px;padding-top:10px}.rcb-line-break-text{color:#adadad;font-size:12px;padding:6px 12px}.rcb-spinner-container{align-items:center;display:flex;justify-content:center;max-height:45px;min-height:35px;padding-bottom:5px;padding-top:10px}.rcb-spinner{animation:rcb-animation-spin 1s linear infinite;border:4px solid #f3f3f3;border-radius:50%;height:22px;width:22px}.rcb-chat-input{align-items:center;background-color:#fff;border-top:1px solid #ccc;display:flex;padding:8px 16px}.rcb-chat-input::placeholder{color:#999}.rcb-chat-input-textarea{background-color:#fff;border:none;border-radius:4px;color:#000;flex:1 1;font-family:inherit;font-size:16px;height:auto;min-height:38px;outline:none;overflow-y:scroll;padding:8px;resize:none;touch-action:none}.rcb-chat-input-textarea::-webkit-scrollbar,.rcb-chat-input-textarea::-webkit-scrollbar-thumb{background-color:initial}.rcb-chat-input-textarea::-webkit-scrollbar-thumb:hover{background-color:initial}.rcb-chat-input-char-counter{font-size:14px;margin-left:8px;margin-top:3px}.rcb-chat-footer-container{align-items:flex-end;background-color:#f2f2f2;border-top:1px solid #ccc;color:#000;display:flex;font-size:12px;justify-content:space-between;max-height:55px;padding:12px 16px 8px 10px}.rcb-chat-footer,.rcb-toggle-button{display:flex;flex-direction:row}.rcb-toggle-button{border:none;border-radius:50%;bottom:20px;box-shadow:0 2px 4px #0003;cursor:pointer;height:75px;position:fixed;right:20px;width:75px;z-index:9999}.rcb-toggle-button.rcb-button-hide{animation:rcb-animation-collapse .3s ease-in-out forwards;opacity:0;visibility:hidden}.rcb-toggle-button.rcb-button-show{animation:rcb-animation-expand .3s ease-in-out forwards;opacity:1;visibility:visible}.rcb-toggle-icon{background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:inherit;height:100%;margin:auto;width:100%}.rcb-badge,.rcb-toggle-icon{align-items:center;display:flex;justify-content:center}.rcb-badge{background-color:red;border-radius:50%;color:#fff;height:25px;position:absolute;right:-6px;top:-6px;width:25px}.rcb-chat-tooltip{border-radius:20px;box-shadow:0 2px 6px #0003;cursor:pointer;font-size:20px;padding:16px;position:fixed;transition:transform .3s ease;white-space:nowrap;z-index:9999}.rcb-chat-tooltip-tail{border-style:solid;border-width:10px 0 10px 10px;content:"";margin-top:-10px;position:absolute;right:-10px;top:50%}.rcb-chat-tooltip.rcb-tooltip-hide{animation:rcb-animation-tooltip-out .5s ease-in-out;opacity:0;visibility:hidden}.rcb-chat-tooltip.rcb-tooltip-show{animation:rcb-animation-tooltip-in .5s ease-in-out;opacity:1;visibility:visible}.rcb-toast-prompt{animation:rcb-animation-pop-in .3s ease-in-out;background-color:#fff;border:.5px solid #7a7a7a;border-radius:5px;color:#7a7a7a;cursor:pointer;font-size:12px;margin-top:6px;padding:6px 12px;text-align:center;transition:color .3s ease,border-color .3s ease;width:100%;z-index:9999}.rcb-toast-prompt-container{align-items:center;animation:popIn .3s ease-in-out;bottom:0;display:flex;flex-direction:column;justify-content:flex-end;left:50%;margin:200 auto auto;opacity:1;pointer-events:auto;position:absolute;transform:translate(-50%)}.rcb-media-display-image-container,.rcb-media-display-video-container{border-radius:22px;margin-right:16px;margin-top:8px;padding:16px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.rcb-media-display-offset{margin-right:50px!important}.rcb-media-display-image{border-radius:22px;height:auto;object-fit:cover;width:100%}.rcb-media-display-video{background-color:#000;border-radius:22px;height:auto;width:100%}.rcb-media-display-audio{border-radius:22px;height:auto;margin-right:16px;margin-top:8px;width:100%}.rcb-media-entry{animation:rcb-animation-user-message-entry .3s ease-in backwards}.rcb-attach-button-disabled,.rcb-attach-button-enabled{background-size:cover;border-radius:6px;display:inline-block;height:30px;position:relative;text-align:center;width:30px}.rcb-attach-button-disabled input[type=file],.rcb-attach-button-enabled input[type=file]{display:none;height:100%;position:absolute;width:100%}.rcb-attach-button-enabled{cursor:pointer}.rcb-attach-button-disabled{opacity:.5}.rcb-attach-button-enabled:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-attach-button-enabled:hover:after{height:130%;opacity:1;width:130%}.rcb-attach-icon-disabled,.rcb-attach-icon-enabled{background-repeat:no-repeat;background-size:cover;display:inline-block;height:24px;margin-top:2px;transition:background-image .3s ease;width:24px}.rcb-attach-icon-enabled{cursor:pointer}.rcb-emoji-button-disabled,.rcb-emoji-button-enabled{background-size:cover;border-radius:6px;cursor:pointer;display:inline-block;height:30px;position:relative;text-align:center;width:30px}.rcb-emoji-icon-disabled,.rcb-emoji-icon-enabled{background-repeat:no-repeat;background-size:cover;display:inline-block;font-size:20px;height:24px;margin-top:2px;position:relative;width:24px}.rcb-emoji-icon-enabled{cursor:pointer}.rcb-emoji-icon-disabled{opacity:.5}.rcb-emoji-button-enabled:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-emoji-button-enabled:hover:after{height:130%;opacity:1;width:130%}.rcb-emoji-button-popup{background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 2px 4px #0003;max-height:200px;overflow-y:auto;padding:8px;position:absolute;transform:translateY(calc(-100% - 30px));width:158px}.rcb-emoji{cursor:pointer;font-size:24px;padding:3px;transition:transform .2s ease-in-out}.rcb-emoji:hover{transform:scale(1.2)}.rcb-audio-icon{background-size:cover;border:none;cursor:pointer;display:inline-block;height:30px;margin-left:5px;position:relative;width:30px}.rcb-audio-icon:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-audio-icon:hover:after{height:130%;opacity:1;width:130%}.rcb-close-chat-icon{background-size:cover;border:none;cursor:pointer;display:inline-block;height:30px;margin-left:5px;position:relative;width:30px}.rcb-close-chat-icon:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-close-chat-icon:hover:after{height:130%;opacity:1;width:130%}.rcb-notification-icon{background-size:cover;border:none;cursor:pointer;display:inline-block;height:30px;margin-left:5px;position:relative;width:30px}.rcb-notification-icon:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-notification-icon:hover:after{height:130%;opacity:1;width:130%}.rcb-voice-button-disabled,.rcb-voice-button-enabled{align-items:center;background-color:#fff;border-radius:4px;box-shadow:0 0 3px #0000004d;cursor:pointer;display:inline-flex;height:32px;justify-content:center;margin-left:8px;text-transform:uppercase;transition:all .3s ease;width:32px}.rcb-voice-button-enabled{border:1px solid red;box-shadow:0 0 3px #ff000080}.rcb-voice-button-enabled:hover{border:1px solid #3d0000}.rcb-voice-button-disabled{border:1px;border-color:#0003;border-style:solid}.rcb-voice-button-disabled:hover{box-shadow:0 0 3px #8a0000}.rcb-voice-icon{background-position:50%;background-repeat:no-repeat;background-size:cover;background-size:contain;height:60%;object-fit:cover;width:60%}.rcb-voice-icon.on{animation:rcb-animation-ping 1s infinite}.rcb-send-button{border:none;border-radius:4px;box-shadow:0 0 3px #0000004d;cursor:pointer;display:inline-flex;height:32px;justify-content:center;margin-left:8px;text-transform:uppercase;transition:background-color .3s ease;width:51px}.rcb-send-icon{background-position:50%;background-repeat:no-repeat;background-size:cover;background-size:contain;height:50%;object-fit:cover;transform:translateY(20%);width:50%}.rcb-view-history-container{align-items:center;display:flex;justify-content:center;max-height:45px;min-height:35px;padding-bottom:5px;padding-top:10px}.rcb-view-history-button{align-items:center;background-color:#fff;border:.5px solid #adadad;border-radius:20px;color:#adadad;cursor:pointer;display:inline-flex;font-size:12px;justify-content:center;max-width:60%;padding:6px 12px;transition:color .3s ease,border-color .3s ease}.rcb-view-history-button>p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rcb-chatbot-global{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;z-index:9999}.rcb-chat-window{background-color:#fff;border-radius:10px;bottom:20px;box-shadow:0 2px 4px #0003;display:flex;flex-direction:column;height:550px;overflow:hidden;position:fixed;right:20px;transition:all .3s ease;width:375px}.rcb-window-embedded .rcb-chat-window{bottom:auto;opacity:1;position:relative;right:auto;visibility:visible}.rcb-window-open .rcb-chat-window{animation:rcb-animation-expand .3s ease-in-out forwards;opacity:1;visibility:visible}.rcb-window-close .rcb-chat-window{animation:rcb-animation-collapse .3s ease-in-out forwards;opacity:0;visibility:hidden}@keyframes rcb-animation-expand{0%{opacity:0;transform:translate(100%,100%) scale(0)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes rcb-animation-collapse{0%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(100%,100%) scale(0)}}@keyframes rcb-animation-ping{0%{filter:brightness(100%);opacity:1}50%{filter:brightness(50%);opacity:.8}}@keyframes rcb-animation-bot-message-entry{0%{opacity:0;transform:translate(-100%,50%) scale(0)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes rcb-animation-user-message-entry{0%{opacity:0;transform:translate(100%,50%) scale(0)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes rcb-animation-bot-typing{0%{opacity:.4}50%{opacity:1}to{opacity:.4}}@keyframes rcb-animation-pop-in{0%{opacity:0;transform:scale(.8)}70%{opacity:1;transform:scale(1.1)}to{transform:scale(1)}}@keyframes rcb-animations-checkboxes-entry{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes rcb-animation-options-entry{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes rcb-animation-tooltip-in{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes rcb-animation-tooltip-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-5px)}}@keyframes rcb-animation-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}
1
+ body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.rcb-chat-header-container{border-bottom:1px solid #ccc;color:#fff;display:flex;justify-content:space-between;max-height:55px;padding:12px}.rcb-chat-header{display:flex;flex-direction:row}.rcb-bot-avatar{background-size:cover;border-radius:50%;height:30px;margin-right:12px;width:30px}.rcb-message-prompt-container.visible{align-items:center;animation:rcb-animation-pop-in .3s ease-in-out;bottom:0;display:flex;justify-content:center;margin:auto;opacity:1;pointer-events:auto;position:-webkit-sticky;position:sticky}.rcb-message-prompt-container.hidden{height:0;opacity:0;pointer-events:none;visibility:hidden}.rcb-message-prompt-text{background-color:#fff;border:.5px solid #adadad;border-radius:20px;color:#adadad;cursor:pointer;font-size:12px;padding:6px 12px;transition:color .3s ease,border-color .3s ease;z-index:9999}.rcb-message-prompt-container.hidden .rcb-message-prompt-text{padding:0}.rcb-user-message-container{display:flex;flex-direction:row;justify-content:right}.rcb-user-message{border-radius:22px;font-size:15px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;margin-right:16px;margin-top:8px;min-height:20px;overflow:auto;overflow-wrap:anywhere;padding:12px 16px;text-align:right;white-space:pre-wrap;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.rcb-user-message-offset{margin-right:50px}.rcb-user-message-entry{animation:rcb-animation-user-message-entry .3s ease-in backwards}.rcb-message-user-avatar{background-size:cover;border-radius:50%;height:40px;margin-left:-10px;margin-right:6px;margin-top:9px;width:40px}.rcb-bot-message-container{display:flex;flex-direction:row}.rcb-bot-message{border-radius:22px;font-size:15px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;margin-left:16px;margin-top:8px;min-height:20px;overflow:auto;overflow-wrap:anywhere;padding:12px 16px;text-align:left;white-space:pre-wrap;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.rcb-bot-message-offset{margin-left:50px}.rcb-bot-message-entry{animation:rcb-animation-bot-message-entry .3s ease-in backwards}.rcb-message-bot-avatar{background-size:cover;border-radius:50%;height:40px;margin-left:6px;margin-right:-10px;margin-top:9px;width:40px}.rcb-typing-indicator{align-items:center;display:flex}.rcb-dot{animation:rcb-animation-bot-typing 1s infinite;background-color:#ccc;border-radius:50%;height:8px;margin-right:4px;width:8px}.rcb-dot:nth-child(2){animation-delay:.2s}.rcb-dot:nth-child(3){animation-delay:.4s}.rcb-chat-body-container{height:100%;overflow-x:hidden;overflow-y:scroll;padding-bottom:16px;position:relative;touch-action:pan-y;width:100%}.rcb-chat-body-container::-webkit-scrollbar-track{background-color:#f1f1f1}.rcb-chat-body-container::-webkit-scrollbar-thumb{background-color:#ddd;border-radius:4px}.rcb-chat-body-container::-webkit-scrollbar-thumb:hover{background-color:#cfcfcf}.rcb-chat-body-container::-webkit-scrollbar-corner{background-color:#f1f1f1}.rcb-checkbox-container{display:flex;flex-wrap:wrap;gap:10px;margin-left:16px;padding-top:12px}.rcb-checkbox-offset{margin-left:50px!important}.rcb-checkbox-row-container{align-items:center;animation:rcb-animations-checkboxes-entry .5s ease-out;background-color:#fff;border-radius:10px;border-style:solid;border-width:.5px;cursor:pointer;display:flex;gap:5px;max-height:32px;min-height:30px;overflow:hidden;width:80%}.rcb-checkbox-row-container:hover{box-shadow:0 0 5px #0003}.rcb-checkbox-row{align-items:center;cursor:pointer;display:inline-flex;margin-left:10px}.rcb-checkbox-mark{align-items:center;background-color:#f2f2f2;border:none;border-radius:50%;cursor:pointer;display:flex;height:20px;justify-content:center;margin-right:10px;transition:all .3s ease;width:20px}.rcb-checkbox-mark:hover{background-color:#c2c2c2}.rcb-checkbox-mark:before{content:"✓";transition:all .3s ease}.rcb-checkbox-label{font-size:14px}.rcb-checkbox-next-button{align-items:center;animation:rcb-animations-checkboxes-entry .5s ease-out;background-color:#fff;border-radius:10px;border-style:solid;border-width:.5px;cursor:pointer;display:inline-block;font-size:24px;max-height:32px;min-height:30px;text-align:center;width:80%}.rcb-checkbox-next-button:before{content:"→"}.rcb-checkbox-next-button:hover{box-shadow:0 0 5px #0003}.rcb-options-container{display:flex;flex-wrap:wrap;gap:10px;margin-left:16px;max-width:70%;padding-top:12px}.rcb-options-offset{margin-left:50px!important}.rcb-options{align-items:center;animation:rcb-animation-options-entry .5s ease-out;border-radius:20px;border-style:solid;border-width:.5px;cursor:pointer;display:inline-flex;font-size:14px;justify-content:center;overflow:hidden;padding:10px 20px;transition:background-color .3s ease}.rcb-options:hover{box-shadow:0 0 5px #0003}.rcb-line-break-container{align-items:center;display:flex;justify-content:center;max-height:45px;padding-bottom:5px;padding-top:10px}.rcb-line-break-text{color:#adadad;font-size:12px;padding:6px 12px}.rcb-spinner-container{align-items:center;display:flex;justify-content:center;max-height:45px;min-height:35px;padding-bottom:5px;padding-top:10px}.rcb-spinner{animation:rcb-animation-spin 1s linear infinite;border:4px solid #f3f3f3;border-radius:50%;height:22px;width:22px}.rcb-chat-input{align-items:center;background-color:#fff;border-top:1px solid #ccc;display:flex;padding:8px 16px}.rcb-chat-input::placeholder{color:#999}.rcb-chat-input-textarea{background-color:#fff;border:none;border-radius:4px;color:#000;flex:1 1;font-family:inherit;font-size:16px;height:auto;min-height:38px;outline:none;overflow-y:scroll;padding:8px;resize:none;touch-action:none}.rcb-chat-input-textarea::-webkit-scrollbar,.rcb-chat-input-textarea::-webkit-scrollbar-thumb{background-color:initial}.rcb-chat-input-textarea::-webkit-scrollbar-thumb:hover{background-color:initial}.rcb-chat-input-char-counter{font-size:14px;margin-left:8px;margin-top:3px}.rcb-chat-footer-container{align-items:flex-end;background-color:#f2f2f2;border-top:1px solid #ccc;color:#000;display:flex;font-size:12px;justify-content:space-between;max-height:55px;padding:12px 16px 8px 10px}.rcb-chat-footer,.rcb-toggle-button{display:flex;flex-direction:row}.rcb-toggle-button{border:none;border-radius:50%;bottom:20px;box-shadow:0 2px 4px #0003;cursor:pointer;height:75px;position:fixed;right:20px;width:75px;z-index:9999}.rcb-toggle-button.rcb-button-hide{animation:rcb-animation-collapse .3s ease-in-out forwards;opacity:0;visibility:hidden}.rcb-toggle-button.rcb-button-show{animation:rcb-animation-expand .3s ease-in-out forwards;opacity:1;visibility:visible}.rcb-toggle-icon{background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:inherit;height:100%;margin:auto;width:100%}.rcb-badge,.rcb-toggle-icon{align-items:center;display:flex;justify-content:center}.rcb-badge{background-color:red;border-radius:50%;color:#fff;height:25px;position:absolute;right:-6px;top:-6px;width:25px}.rcb-chat-tooltip{border-radius:20px;box-shadow:0 2px 6px #0003;cursor:pointer;font-size:20px;padding:16px;position:fixed;transition:transform .3s ease;white-space:nowrap;z-index:9999}.rcb-chat-tooltip-tail{border-style:solid;border-width:10px 0 10px 10px;content:"";margin-top:-10px;position:absolute;right:-10px;top:50%}.rcb-chat-tooltip.rcb-tooltip-hide{animation:rcb-animation-tooltip-out .5s ease-in-out;opacity:0;visibility:hidden}.rcb-chat-tooltip.rcb-tooltip-show{animation:rcb-animation-tooltip-in .5s ease-in-out;opacity:1;visibility:visible}.rcb-toast-prompt{animation:rcb-animation-pop-in .3s ease-in-out;background-color:#fff;border:.5px solid #7a7a7a;border-radius:5px;color:#7a7a7a;cursor:pointer;font-size:12px;margin-top:6px;padding:6px 12px;text-align:center;transition:color .3s ease,border-color .3s ease;width:100%;z-index:9999}.rcb-toast-prompt-container{align-items:center;animation:popIn .3s ease-in-out;bottom:0;display:flex;flex-direction:column;justify-content:flex-end;left:50%;margin:200 auto auto;opacity:1;pointer-events:auto;position:absolute;transform:translate(-50%)}.rcb-media-display-image-container,.rcb-media-display-video-container{border-radius:22px;margin-right:16px;margin-top:8px;padding:16px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.rcb-media-display-offset{margin-right:50px!important}.rcb-media-display-image{border-radius:22px;height:auto;object-fit:cover;width:100%}.rcb-media-display-video{background-color:#000;border-radius:22px;height:auto;width:100%}.rcb-media-display-audio{border-radius:22px;height:auto;margin-right:16px;margin-top:8px;width:100%}.rcb-media-entry{animation:rcb-animation-user-message-entry .3s ease-in backwards}.rcb-attach-button-disabled,.rcb-attach-button-enabled{background-size:cover;border-radius:6px;display:inline-block;height:30px;position:relative;text-align:center;width:30px}.rcb-attach-button-disabled input[type=file],.rcb-attach-button-enabled input[type=file]{display:none;height:100%;position:absolute;width:100%}.rcb-attach-button-enabled{cursor:pointer}.rcb-attach-button-disabled{opacity:.5}.rcb-attach-button-enabled:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-attach-button-enabled:hover:after{height:130%;opacity:1;width:130%}.rcb-attach-icon-disabled,.rcb-attach-icon-enabled{background-repeat:no-repeat;background-size:cover;display:inline-block;height:24px;margin-top:2px;transition:background-image .3s ease;width:24px}.rcb-attach-icon-enabled{cursor:pointer}.rcb-emoji-button-disabled,.rcb-emoji-button-enabled{background-size:cover;border-radius:6px;cursor:pointer;display:inline-block;height:30px;position:relative;text-align:center;width:30px}.rcb-emoji-icon-disabled,.rcb-emoji-icon-enabled{background-repeat:no-repeat;background-size:cover;display:inline-block;font-size:20px;height:24px;margin-top:2px;position:relative;width:24px}.rcb-emoji-icon-enabled{cursor:pointer}.rcb-emoji-icon-disabled{opacity:.5}.rcb-emoji-button-enabled:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-emoji-button-enabled:hover:after{height:130%;opacity:1;width:130%}.rcb-emoji-button-popup{background-color:#fff;border:1px solid #ccc;border-radius:4px;box-shadow:0 2px 4px #0003;max-height:200px;overflow-y:auto;padding:8px;position:absolute;transform:translateY(calc(-100% - 30px));width:158px}.rcb-emoji{cursor:pointer;font-size:24px;padding:3px;transition:transform .2s ease-in-out}.rcb-emoji:hover{transform:scale(1.2)}.rcb-audio-icon{background-size:cover;border:none;cursor:pointer;display:inline-block;height:30px;margin-left:5px;position:relative;width:30px}.rcb-audio-icon:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-audio-icon:hover:after{height:130%;opacity:1;width:130%}.rcb-close-chat-icon{background-size:cover;border:none;cursor:pointer;display:inline-block;height:30px;margin-left:5px;position:relative;width:30px}.rcb-close-chat-icon:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-close-chat-icon:hover:after{height:130%;opacity:1;width:130%}.rcb-notification-icon{background-size:cover;border:none;cursor:pointer;display:inline-block;height:30px;margin-left:5px;position:relative;width:30px}.rcb-notification-icon:after{background-color:#0000001a;border-radius:50%;content:"";height:0;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .2s ease-out,height .2s ease-out,opacity .2s ease-out;width:0}.rcb-notification-icon:hover:after{height:130%;opacity:1;width:130%}.rcb-voice-button-disabled,.rcb-voice-button-enabled{align-items:center;background-color:#fff;border-radius:4px;box-shadow:0 0 3px #0000004d;cursor:pointer;display:inline-flex;height:32px;justify-content:center;margin-left:8px;text-transform:uppercase;transition:all .3s ease;width:32px}.rcb-voice-button-enabled{border:1px solid red;box-shadow:0 0 3px #ff000080}.rcb-voice-button-enabled:hover{border:1px solid #3d0000}.rcb-voice-button-disabled{border:1px;border-color:#0003;border-style:solid}.rcb-voice-button-disabled:hover{box-shadow:0 0 3px #8a0000}.rcb-voice-icon{background-position:50%;background-repeat:no-repeat;background-size:cover;background-size:contain;height:60%;object-fit:cover;width:60%}.rcb-voice-icon.on{animation:rcb-animation-ping 1s infinite}.rcb-send-button{border:none;border-radius:4px;box-shadow:0 0 3px #0000004d;cursor:pointer;display:inline-flex;height:32px;justify-content:center;margin-left:8px;text-transform:uppercase;transition:background-color .3s ease;width:51px}.rcb-send-icon{background-position:50%;background-repeat:no-repeat;background-size:cover;background-size:contain;height:50%;object-fit:cover;transform:translateY(20%);width:50%}.rcb-view-history-container{align-items:center;display:flex;justify-content:center;max-height:45px;min-height:35px;padding-bottom:5px;padding-top:10px}.rcb-view-history-button{align-items:center;background-color:#fff;border:.5px solid #adadad;border-radius:20px;color:#adadad;cursor:pointer;display:inline-flex;font-size:12px;justify-content:center;max-width:60%;padding:6px 12px;transition:color .3s ease,border-color .3s ease}.rcb-view-history-button>p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rcb-chatbot-global{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5;z-index:9999}.rcb-chat-window{background-color:#fff;border-radius:10px;bottom:20px;box-shadow:0 2px 4px #0003;display:flex;flex-direction:column;height:550px;overflow:hidden;position:fixed;right:20px;transition:all .3s ease;width:375px}.rcb-window-embedded .rcb-chat-window{bottom:auto;opacity:1;position:relative;right:auto;visibility:visible}.rcb-window-open .rcb-chat-window{animation:rcb-animation-expand .3s ease-in-out forwards;opacity:1;visibility:visible}.rcb-window-close .rcb-chat-window{animation:rcb-animation-collapse .3s ease-in-out forwards;opacity:0;visibility:hidden}@keyframes rcb-animation-expand{0%{opacity:0;transform:translate(100%,100%) scale(0)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes rcb-animation-collapse{0%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(100%,100%) scale(0)}}@keyframes rcb-animation-ping{0%{filter:brightness(100%);opacity:1}50%{filter:brightness(50%);opacity:.8}}@keyframes rcb-animation-bot-message-entry{0%{opacity:0;transform:translate(-100%,50%) scale(0)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes rcb-animation-user-message-entry{0%{opacity:0;transform:translate(100%,50%) scale(0)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes rcb-animation-bot-typing{0%{opacity:.4}50%{opacity:1}to{opacity:.4}}@keyframes rcb-animation-pop-in{0%{opacity:0;transform:scale(.8)}70%{opacity:1;transform:scale(1.1)}to{transform:scale(1)}}@keyframes rcb-animations-checkboxes-entry{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes rcb-animation-options-entry{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes rcb-animation-tooltip-in{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes rcb-animation-tooltip-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-5px)}}@keyframes rcb-animation-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.rcb-toggle-button.rcb-button-show{background-color:#1a5b6e;background-position:50%;background-repeat:no-repeat;background-size:72%}.rcb-chat-window{max-height:600px;max-width:100%;width:550px!important}.rcb-chat-window .rcb-bot-avatar{background-position:50%;background-repeat:no-repeat;background-size:contain;border-radius:0}.rcb-chat-window .rcb-chat-header{align-items:center;display:flex;flex-direction:row;font-weight:700}.rcb-chat-window a{color:#000;font-weight:700;text-decoration:underline}.rcb-chat-window a:hover{color:#107180}.rcb-chat-window .rcb-bot-message a{color:#fff;text-decoration:none}.rcb-chat-window .rcb-bot-message a:hover{text-decoration:underline}.rcb-chat-window .rcb-chat-input-textarea{overflow-y:auto}.rcb-chat-window .rcb-chat-footer-container{font-size:10px}.embedded-qa-bot .rcb-chat-window{max-width:100%;width:100%!important}.access-qa-bot.hidden{display:none}.embedded-qa-bot .rcb-bot-message,.embedded-qa-bot .rcb-user-message{max-width:90%!important;word-break:break-word}.embedded-qa-bot .rcb-chat-input-textarea{width:100%!important}.qa-bot-container{max-width:100%;width:100%}.access-qa-bot .user-login-icon{display:none!important}.access-qa-bot.bot-logged-in .user-login-icon{display:flex!important}.access-qa-bot.bot-logged-in .user-login-icon svg{transform:scale(1.3) translateY(-2px)}.rcb-tooltip-show.phone-ring{animation:phone-ring 3s ease-out!important;z-index:10000!important}@keyframes phone-ring{0%{transform:translateX(0) translateY(0) rotate(0deg)}2%{transform:translateX(0) translateY(-8px) rotate(-2deg)}4%{transform:translateX(0) translateY(-6px) rotate(2deg)}6%{transform:translateX(0) translateY(-8px) rotate(-1deg)}8%{transform:translateX(0) translateY(-6px) rotate(1deg)}10%{transform:translateX(0) translateY(-8px) rotate(-2deg)}12%{transform:translateX(0) translateY(-6px) rotate(2deg)}20%{transform:translateX(0) translateY(0) rotate(0deg)}30%{transform:translateX(0) translateY(0) rotate(0deg)}40%{transform:translateX(0) translateY(0) rotate(0deg)}49%{transform:translateX(0) translateY(0) rotate(0deg)}50%{transform:translateX(0) translateY(-8px) rotate(-2deg)}52%{transform:translateX(0) translateY(-6px) rotate(2deg)}54%{transform:translateX(0) translateY(-8px) rotate(-1deg)}56%{transform:translateX(0) translateY(-6px) rotate(1deg)}58%{transform:translateX(0) translateY(-8px) rotate(-2deg)}60%{transform:translateX(0) translateY(-6px) rotate(2deg)}70%{transform:translateX(0) translateY(0) rotate(0deg)}to{transform:translateX(0) translateY(0) rotate(0deg)}}@media (max-width:768px){.embedded-chat-container.open{height:400px}.embedded-chat-closed{font-size:14px;height:40px}.embedded-chat-open-btn{font-size:12px;padding:3px 10px}}@media (max-width:480px){.embedded-chat-container.open{height:350px}}
2
2
  /*# sourceMappingURL=main.css.map*/