PluginProbe
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services / 8.8.0
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services v8.8.0
8.8.0 8.7.9 8.7.8 8.7.7 8.7.6 8.7.5 8.7.4 8.7.3 8.7.2 8.7.1 8.7.0 8.6.9 8.6.8 8.6.7 8.6.6 8.6.5 8.6.4 8.6.2 8.6.1 8.6.0 8.5.9 8.5.8 8.5.7 8.5.6 8.5.5 All 536 releases
← All changes | templates/template-00/style.css +1278 -1278 8.7.3 → 8.8.0 View file →
@@ -1,1279 +1,1279 @@
1 -/*
2 -
3 -01. Ball content
4 -
5 -02. wp Chat bot Message container
6 -
7 - -A Link Item
8 -
9 - -B Loading
10 -
11 -03. wp Chat bot Message Editor
12 -
13 -04. wp Chat bottom Tab Nav Editor
14 -05. Tab Feature Product
15 -
16 -06. Tab Cart
17 -
18 -07. Product Details
19 -
20 -*/
21 -
22 -/*********************
23 -
24 -01. ball content wrapper
25 -
26 -**********************/
27 -
28 -.wp-chatbot-board-container {
29 - border-radius: 5px;
30 - overflow: hidden;
31 -}
32 -
33 -.wp-chatbot-board-container:after {
34 - content: "";
35 - position: absolute;
36 - right: 0;
37 - bottom: -26px;
38 - width: 0;
39 - height: 0;
40 - border-left: 30px solid transparent;
41 - border-right: 0 solid transparent;
42 - border-top: 30px solid #ffffff;
43 -
44 -}
45 -
46 -/******************************
47 -
48 -02. wp Chat bot Message container
49 -
50 -*********************************/
51 -
52 -
53 -.wp-chatbot-header h3 {
54 -
55 - color: #ffffff;
56 -
57 - font-size: 18px !important;
58 -
59 - letter-spacing: 1px;
60 -
61 -}
62 -
63 -
64 -ul.wp-chatbot-messages-container li {
65 -
66 - font-size: 14px;
67 -
68 -}
69 -
70 -ul.wp-chatbot-messages-container > li.wp-chatbot-msg {
71 -
72 - padding-left: 50px;
73 -
74 -}
75 -
76 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
77 -
78 - padding-right: 50px;
79 -
80 -}
81 -ul li .wp-chatbot-avatar {
82 - margin-top: 0 !important;
83 -}
84 -ul.wp-chatbot-messages-container > li .wp-chatbot-avatar, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar {
85 -
86 - position: absolute;
87 -
88 - top: 0;
89 -
90 - width: 40px;
91 -
92 - height: 40px;
93 -
94 - overflow: hidden;
95 -
96 - border-radius: 50%;
97 -
98 -}
99 -
100 -ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-avatar, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar {
101 -
102 - left: 0;
103 -
104 -}
105 -
106 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
107 -
108 - right: 0;
109 -
110 -}
111 -
112 -ul.wp-chatbot-messages-container > li > .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
113 -
114 - padding: 8px 15px;
115 -
116 - max-width: 90%;
117 -
118 - box-shadow: 0 2px 8px #bfbfbf;
119 -
120 - line-height: 150%;
121 -
122 - display: table;
123 -
124 -}
125 -
126 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
127 -
128 - text-align: right;
129 -
130 - float: right;
131 -
132 -}
133 -
134 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
135 -
136 - background-color: #eaf1f6;
137 -
138 - color: #494949;
139 -
140 - margin-left: 10%;
141 -
142 - border-radius: 10px 10px 0 10px;
143 -
144 -}
145 -
146 -ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
147 -
148 - background-color: #1f8ceb;
149 -
150 - color: #ffffff;
151 -
152 - border-radius: 0 10px 10px 10px;
153 - width: 100%;
154 -}
155 -
156 -ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph {
157 -
158 - background-color: transparent;
159 -
160 -}
161 -
162 -/************ 02 (A). Link Item *************/
163 -
164 -span.qcld-chatbot-product-category,
165 -span.qcld-chatbot-support-items,
166 -span.qcld-chatbot-wildcard,
167 -span.qcld-chatbot-suggest-email,
168 -span.qcld-chatbot-reset-btn,
169 -#wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
170 -
171 - color: #000000;
172 - background-size: 200% auto;
173 - border: 1px solid #ffffff;
174 - display: inline-block;
175 - margin: 3px auto;
176 - padding: 6px 11px;
177 -
178 -
179 -}
180 -
181 -span.qcld-chatbot-product-category:hover,
182 -span.qcld-chatbot-support-items:hover,
183 -span.qcld-chatbot-wildcard:hover,
184 -span.qcld-chatbot-suggest-email:hover,
185 -span.qcld-chatbot-reset-btn:hover,
186 -#wp-chatbot-loadmore:hover, .wp-chatbot-loadmore:hover {
187 -
188 - background-position: right center;
189 -
190 -
191 -}
192 -
193 -/**************** 02. (B) Loading **********/
194 -
195 -ul.wp-chatbot-messages-container > li .wp-chatbot-paragraph img.wp-chatbot-comment-loader {
196 -
197 - background-color: #fff;
198 -
199 - padding: 1px;
200 -
201 - border-radius: 5px;
202 -
203 - margin: 0 auto;
204 -
205 - display: block;
206 -
207 -}
208 -
209 -/*******************************
210 -
211 -03. wp Chat bot Message Editor
212 -
213 -**********************************/
214 -
215 -
216 -
217 -.wp-chatbot-editor-container input, .wp-chatbot-editor-area input::-webkit-input-placeholder, .wp-chatbot-editor-area input::-moz-placeholder, .wp-chatbot-editor-area input:-ms-input-placeholder, .wp-chatbot-editor-area input:-moz-placeholder {
218 -
219 - color: #fff;
220 -
221 -}
222 -
223 -/*******************************
224 -
225 -04. wp Chat bottom Tab Nav Editor
226 -
227 -**********************************/
228 -
229 -.wp-chatbot-footer {
230 -
231 - padding: 0;
232 -
233 -}
234 -
235 -.wp-chatbot-tab-nav ul li a[data-option="recent"] {
236 -
237 - background-position: -7px -47px;
238 -
239 -}
240 -
241 -.wp-chatbot-tab-nav ul li a[data-option="cart"] {
242 -
243 - background-position: -47px -47px;
244 -
245 -}
246 -
247 -.wp-chatbot-tab-nav ul li a[data-option="chat"] {
248 -
249 - background-position: -82px -42px;
250 -
251 -}
252 -
253 -.wp-chatbot-tab-nav ul li a[data-option="help"] {
254 -
255 - background-position: -129px -47px;
256 -
257 -}
258 -
259 -
260 -
261 -.wp-chatbot-tab-nav ul li a[data-option="chat"]:after {
262 -
263 - content: "";
264 -
265 - position: absolute;
266 -
267 - border-radius: 50%;
268 -
269 - border: 3px solid #1f8ceb;
270 -
271 - left: -9px;
272 -
273 - right: -9px;;
274 -
275 - bottom: -9px;
276 -
277 - top: -9px;
278 -
279 -}
280 -
281 -.wp-chatbot-tab-nav ul li.wp-chatbot-operation-active a:before, .wp-chatbot-tab-nav ul li:hover a:before {
282 -
283 - border: 2px solid #1f8ceb;
284 -
285 -}
286 -
287 -/***************************
288 -
289 -05. Tab Feature Product
290 -
291 -***************************/
292 -
293 -.wp-chatbot-agent-profile {
294 -
295 - position: relative;
296 -
297 - padding-left: 50px;
298 -
299 - box-sizing: border-box;
300 -
301 - word-wrap: break-word;
302 -
303 - list-style: none;
304 -
305 - display: block;
306 -
307 - clear: both;
308 -
309 - line-height: 150%;
310 -
311 - min-height: 50px;
312 -
313 - margin: 0 0 10px 0;
314 -
315 -}
316 -
317 -.wp-chatbot-widget-title {
318 -
319 - color: #353535;
320 -
321 - text-align: center;
322 -
323 - padding-bottom: 10px;
324 -
325 -}
326 -
327 -/**************************
328 -
329 -06. Tab Cart
330 -
331 -*************************/
332 -
333 -.wp-chatbot-cart-header {
334 -
335 - background-color: #F5F5F5;
336 -
337 -}
338 -
339 -.wp-chatbot-cart-single {
340 -
341 - background-color: rgba(245, 245, 245, 0.1);
342 -
343 - border-bottom: 1px solid #dddddd;
344 -
345 -}
346 -
347 -.wp-chatbot-cart-single:nth-child(2n+1) {
348 -
349 - background-color: rgba(245, 245, 245, 0.5);
350 -
351 -}
352 -
353 -.wp-chatbot-cart-footer div a {
354 -
355 - text-decoration: none;
356 -
357 - background: #1f8ceb;
358 -
359 - color: #ffffff;
360 -
361 -}
362 -
363 -.wp-chatbot-cart-footer div a:hover, .wp-chatbot-cart-footer div:last-child a {
364 -
365 - background: #1c7ed4;
366 -
367 -}
368 -
369 -/**************************
370 -
371 -07. Product Details
372 -
373 -***************************/
374 -
375 -.wp-chatbot-product-details {
376 -
377 - box-shadow: 0 0 10px #ccc;
378 -
379 - background-color: #ffffff;
380 -
381 -}
382 -
383 -.wp-chatbot-product-cart-button input[type="button"] {
384 -
385 - border: 1px solid #e4e5e7;
386 -
387 - background: #1f8ceb;
388 -
389 - color: #ffffff;
390 -
391 - box-shadow: 0 0 2px #999;
392 -
393 -}
394 -
395 -.wp-chatbot-product-cart-button input[type="button"]:hover {
396 -
397 - background: #1c7ed4;
398 -
399 - color: #ffffff;
400 -
401 -}
402 -
403 -/*************************
404 -
405 -Right-to-left text direction
406 -
407 -**************************/
408 -
409 -.wp-chatbot-rtl {
410 -
411 - text-align: right;
412 -
413 - direction: RTL;
414 -
415 -}
416 -
417 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg, .wp-chatbot-rtl .wp-chatbot-agent-profile {
418 -
419 - padding: 0 50px 0 0;
420 -
421 -}
422 -
423 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg.wp-chatbot-msg-flat {
424 -
425 - padding: 0;
426 -
427 -}
428 -
429 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg > .wp-chatbot-paragraph {
430 -
431 - display: table;
432 -
433 - max-width: 90%;
434 -
435 - float: right;
436 -
437 - text-align: right;
438 -
439 -}
440 -
441 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-avatar,
442 -.wp-chatbot-rtl .wp-chatbot-agent-profile .wp-chatbot-widget-avatar {
443 -
444 - right: 0;
445 -
446 - left: auto;
447 -
448 -}
449 -
450 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
451 -
452 - padding: 0 0 0 50px;
453 -
454 -}
455 -
456 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
457 -
458 - left: 0;
459 -
460 - right: auto;
461 -
462 -}
463 -
464 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg > .wp-chatbot-paragraph {
465 -
466 - display: table;
467 -
468 - max-width: 90%;
469 -
470 - float: left;
471 -
472 - text-align: left;
473 -
474 -}
475 -
476 -.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
477 -
478 - margin-left: 0;
479 -
480 -}
481 -
482 -.wp-chatbot-rtl .wp-chatbot-editor-container input {
483 -
484 - text-align: right;
485 -
486 - direction: RTL;
487 -
488 -}
489 -
490 -.wp-chatbot-rtl .wp-chatbot-products-area ul li:nth-child(2n+2) {
491 -
492 - margin: auto;
493 -
494 -}
495 -.wp-chatbot-rtl .wp-chatbot-products-area ul li {
496 - margin: 1%;
497 - vertical-align: middle;
498 -}
499 -
500 -.wpb-search-result a {
501 - display: block;
502 - background: #eee;
503 - padding: 4px 5px;
504 - line-height: 20px;
505 - padding-left: 20px;
506 - margin-bottom: 0;
507 -}
508 -.wpb-search-result a:before {
509 - content: "";
510 - font-style: normal;
511 - font-weight: normal;
512 - text-decoration: inherit;
513 - color: #000;
514 - font-size: 18px;
515 - position: absolute;
516 - left: 68px;
517 - line-height: 1;
518 - font-weight: bold;
519 - color: #7d7b7b;
520 -}
521 -.wpbot-saas-live-chat{
522 - width: 310px !important;
523 - height: 500px;
524 - box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
525 - display:none;
526 -}
527 -.wpchat_header_left{
528 - display:inline-block;
529 -}
530 -.wpchat_header_left span{ font-size: 22px;
531 - padding: 0px 10px; }
532 -.wpchat_header_right {
533 - float: right;
534 - margin-right: 12px;
535 -}
536 -
537 -
538 -/* Css Updated - 06-06-24 */
539 -
540 -.wp-chatbot-header {
541 - color: rgb(255, 255, 255);
542 -}
543 -ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
544 - color: rgb(255, 255, 255);
545 - background: linear-gradient(135deg, rgb(42, 39, 218) 0%, rgb(0, 204, 255) 100%);
546 -}
547 -ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph {
548 - background: linear-gradient(135deg, rgb(42, 39, 218) 0%, rgb(0, 204, 255) 100%);
549 -}
550 -
551 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
552 - color: rgb(255, 255, 255);
553 - background: linear-gradient(135deg, rgb(0, 204, 255) 0%, rgb(42, 39, 218) 100%);
554 -}
555 -span.qcld-chatbot-product-category, span.qcld-chatbot-support-items, span.qcld-chatbot-wildcard, span.qcld-chatbot-suggest-email, span.qcld-chatbot-reset-btn, #wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
556 - background: rgba(0, 0, 0, 0);
557 - padding: 8px 12px 6px 12px;
558 -}
559 -
560 -h2.oneline {
561 - font-size: 18px;
562 - color: #fff;
563 -}
564 -
565 -h2.oneline img{
566 - margin: 0 0 0 10px !important;
567 -}
568 -.wp-chatbot-header {
569 - display: flex;
570 - align-content: center;
571 - align-items: center;
572 -}
573 -
574 -div#wp-chatbot-desktop-reload {
575 - top: -14px;
576 -}
577 -#wp-chatbot-desktop-close {
578 - top: -14px;
579 -}
580 -div#wp-chatbot-ball-container {
581 - box-shadow: rgba(0, 18, 46, 0.16) 0px 8px 36px 0px;
582 - border-radius: 8px;
583 -}
584 -
585 -
586 -.wp-chatbot-tab-nav ul li a {
587 - width: 32px;
588 - height: 32px;
589 - background: url(../../images/tab-btn-icon-new.png) no-repeat;
590 -
591 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
592 - background-color: rgb(255 255 255 / 25%);
593 - backdrop-filter: blur(0px);
594 - isolation: isolate;
595 -
596 -
597 -}
598 -.wp-chatbot-tab-nav ul li a[data-option="help"] {
599 - background-position: -125px -44px;
600 -}
601 -.wp-chatbot-tab-nav ul li a[data-option="support"] {
602 - background-position: -166px -44px;
603 -}
604 -
605 -.wp-chatbot-board-container:after {
606 - border-top: 30px solid #ffffff00;
607 -}
608 -
609 -.wp-chatbot-header {
610 - padding: 6px 15px;
611 -}
612 -.wp-chatbot-ball {
613 - box-shadow: rgba(0, 77, 255, 0.5) 0px 4px 24px;
614 -}
615 -
616 -.wp-chatbot-tab-nav ul {
617 - margin: 0 !important;
618 - padding: 0 !important;
619 - list-style: none;
620 - text-align: center;
621 - display: flex;
622 - justify-content: space-between;
623 - vertical-align: bottom;
624 -}
625 -.wp-chatbot-tab-nav ul li a[data-option="chat"]:after {
626 - border: 0 solid #1f8ceb;
627 -}
628 -.wp-chatbot-tab-nav ul li.wp-chatbot-operation-active a:before, .wp-chatbot-tab-nav ul li:hover a:before {
629 - border: 0px solid #1f8ceb;
630 -}
631 -.wp-chatbot-tab-nav ul li a[data-option="chat"] {
632 - background-position: -82px -41px;
633 -}
634 -
635 -.wp-chatbot-tab-nav {
636 - padding: 4px 5px;
637 -}
638 -
639 -ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
640 - border-radius: 10px;
641 -}
642 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
643 - border-radius: 10px;
644 -}
645 -
646 -.wp-chatbot-board-container {
647 - overflow: visible;
648 -}
649 -
650 -
651 -
652 -.wp-chatbot-header-welcome-text img {
653 - border-radius: 50%;
654 - padding: 3px;
655 -}
656 -
657 -.wp-chatbot-footer {
658 - padding: 0;
659 -}
660 -.wp-chatbot-header-welcome-text {
661 - align-items: center;
662 - display: flex;
663 - justify-content: center;
664 -}
665 -span.qcld-chatbot-wildcard {
666 - width: 100%;
667 - max-width: 255px;
668 -}
669 -
670 -.wp-chatbot-textanimation span {
671 - display: inline-block;
672 - width: auto;
673 - margin: 3px 2px;
674 -}
675 -
676 -.wp-chatbot-textanimation span:hover {
677 -color: rgb(255, 255, 255);
678 -background: linear-gradient(135deg, rgb(42, 39, 218) 0%, rgb(0, 204, 255) 100%);
679 -}
680 -
681 -
682 -
683 -.wpb-search-result a {
684 - color: #222 !important;
685 -}
686 -.wpbot_card_caption p {
687 - color: #222 !important;
688 -}
689 -
690 -
691 -@media screen and (max-width: 768px) {
692 - .wp-chatbot-editor-container button {
693 - right: 0;
694 - }
695 -
696 -}
697 -
698 -
699 -div#wp-chatbot-board-container {
700 - background: url(../../images/bg-03.jpg) no-repeat;
701 - position: relative;
702 - background-size: 100% 100%;
703 - background-position: center bottom;
704 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
705 - backdrop-filter: blur(0px);
706 - isolation: isolate;
707 - box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 50px -10px;
708 - border-radius: 8px;
709 -}
710 -
711 -.wp-chatbot-template-01 #wp-chatbot-board-container.wp-chatbot-expanded {
712 - width: 620px;
713 - max-width: calc(100vw - 40px);
714 -}
715 -div#wp-chatbot-board-container:before {
716 - isolation: isolate;
717 - content: '';
718 - position: absolute;
719 - height: 100%;
720 - width: 100%;
721 - backdrop-filter: blur(0px);
722 - border-radius: 8px !important;
723 - left: 0;
724 - right: 0;
725 - width: 100%;
726 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
727 - backdrop-filter: blur(0px);
728 - isolation: isolate;
729 -}
730 -ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
731 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
732 - background: rgb(255 255 255 / 30%);
733 - backdrop-filter: blur(0px);
734 - isolation: isolate;
735 -}
736 -ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph{
737 -
738 - background: rgb(255 255 255 / 30%);
739 - backdrop-filter: blur(0px);
740 - isolation: isolate;
741 -}
742 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph{
743 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
744 - background: rgb(255 255 255 / 30%);
745 - backdrop-filter: blur(0px);
746 - isolation: isolate;
747 -}
748 -
749 -span.qcld-chatbot-product-category, span.qcld-chatbot-support-items, span.qcld-chatbot-wildcard, span.qcld-chatbot-suggest-email, span.qcld-chatbot-reset-btn, #wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
750 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
751 - background: rgb(255 255 255 / 25%);
752 - backdrop-filter: blur(0px);
753 - isolation: isolate;
754 - color: #fff;
755 -}
756 -
757 -div#wp-chatbot-editor-container {
758 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
759 - background: #5755bd61;
760 - backdrop-filter: blur(0px);
761 - isolation: isolate;
762 - margin: 0 12px 0 12px;
763 - border-radius: 6PX;
764 -}
765 -div#wp-chatbot-desktop-reload {
766 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
767 - background: rgb(255 255 255 / 25%);
768 - backdrop-filter: blur(0px);
769 - isolation: isolate;
770 -}
771 -div#wp-chatbot-desktop-close {
772 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
773 - background: rgb(255 255 255 / 25%);
774 - backdrop-filter: blur(0px);
775 - isolation: isolate;
776 -}
777 -div#wp-chatbot-desktop-reload {
778 - right: 38px;
779 -}
780 -button#wp-chatbot-send-message {
781 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
782 - background: #ffffff91;
783 - backdrop-filter: blur(0px);
784 - isolation: isolate;
785 - color: #3f3f3f;
786 -}
787 -
788 -.wp-chatbot-textanimation span:hover {
789 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
790 - background: rgb(255 255 255 / 25%);
791 - backdrop-filter: blur(0px);
792 - isolation: isolate;
793 - backdrop-filter: blur(2px);
794 -}
795 -.wp-chatbot-editor-container input {
796 - width:100%;
797 -}
798 -
799 -.wp-chatbot-editor-container input, .wp-chatbot-editor-area input::-webkit-input-placeholder, .wp-chatbot-editor-area input::-moz-placeholder, .wp-chatbot-editor-area input:-ms-input-placeholder, .wp-chatbot-editor-area input:-moz-placeholder {
800 -
801 - color: #222 !important;
802 -
803 -}
804 -.wp-chatbot-header-welcome-text img {
805 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
806 - background: rgb(255 255 255 / 25%);
807 - backdrop-filter: blur(0px);
808 - isolation: isolate;
809 -}
810 -.wp-chatbot-header-welcome-text img {
811 - max-width: 38px !important;
812 -}
813 -
814 -div#wp-chatbot-editor-container input{
815 - color: #222;
816 -}
817 -div#wp-chatbot-editor-container input::placeholder {
818 - color: #fff;
819 -}
820 -div#wp-chatbot-editor-container input::-webkit-input-placeholder {
821 - color: #fff;
822 -}
823 -div#wp-chatbot-editor-container input::-moz-placeholder {
824 - color: #fff;
825 -}
826 -div#wp-chatbot-editor-container input:-ms-input-placeholder {
827 - color: #fff;
828 -}
829 -
830 -/* Keep editor autofill transparent */
831 -.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill,
832 -.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill:hover,
833 -.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill:focus,
834 -.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill:active,
835 -.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill,
836 -.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill:hover,
837 -.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill:focus,
838 -.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill:active {
839 - -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
840 - box-shadow: 0 0 0 1000px transparent inset !important;
841 - -webkit-text-fill-color: inherit !important;
842 - background-color: transparent !important;
843 - transition: background-color 9999s ease-out 0s;
844 -}
845 -
846 -
847 -.wp-chatbot-tab-nav ul li a:hover {
848 - transform: scale(0.95);
849 -}
850 -.wp-chatbot-tab-nav ul li a{
851 - transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
852 -}
853 -
854 -.wp-chatbot-textanimation span:hover {
855 - transform: scale(0.95);
856 -}
857 -.wp-chatbot-textanimation span{
858 - transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
859 -}
860 -
861 -button#wp-chatbot-send-message:hover {
862 - transform: scale(0.95);
863 -}
864 -button#wp-chatbot-send-message{
865 - transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
866 -}
867 -
868 -.wp-chatbot-tab-nav ul li:before {
869 - top: 0;
870 -}
871 -
872 -span.qcld-chatbot-wildcard:hover {
873 - transform: scale(0.95);
874 -}
875 -span.qcld-chatbot-wildcard{
876 - transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
877 -}
878 -
879 -.wp-chatbot-tab-nav ul {
880 - margin: 5px 0 !important;
881 - padding: 0 !important;
882 - list-style: none;
883 - text-align: center;
884 - display: flex;
885 - gap: 30px;
886 - vertical-align: bottom;
887 - align-items: center;
888 - justify-content: center;
889 - width: 100%;
890 -}
891 -
892 -ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
893 - color: rgb(33 33 33);
894 -}
895 -ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
896 - color: rgb(33 33 33) ;
897 -}
898 -
899 -
900 -div#wp-chatbot-desktop-reload {
901 - color: #3f3f3f;
902 -}
903 -#wp-chatbot-desktop-close {
904 - color: #3f3f3f;
905 -
906 -}
907 -.wp-chatbot-ball {
908 - background: #fbf7ff;
909 -}
910 -.wp-chatbot-ball {
911 - background: #ffffff;
912 -}
913 -.wp-chatbot-ball:hover, .wp-chatbot-ball:focus {
914 - background: #ffffff;
915 -}
916 -.wp-chatbot-header {
917 - border-bottom: 1px solid #fff;
918 - box-shadow: inset 1px 1px 0 rgb(255 255 255), inset 0 0 5px rgb(255 255 255);
919 -}
920 -
921 -
922 -.wpbot_chatopen_iconanimation .wp-chatbot-ball {
923 - border: 1px solid #dadada;
924 - background-color: #dadada;
925 -}
926 -div#wp-chatbot-desktop-reload {
927 - top: -10px;
928 -}
929 -#wp-chatbot-desktop-close {
930 - top: -10px;
931 - right: 8px;
932 -}
933 -div#wp-chatbot-desktop-reload {
934 - right: 45px;
935 -}
936 -div#wp-chatbot-desktop-expand {
937 - top: -10px;
938 - right: 45px;
939 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
940 - background: rgb(255 255 255 / 25%);
941 - backdrop-filter: blur(0px);
942 - isolation: isolate;
943 - color: #3f3f3f;
944 - cursor: pointer;
945 -}
946 -
947 -div#wp-chatbot-desktop-expand span {
948 - position: relative;
949 -}
950 -div#wp-chatbot-desktop-reload {
951 - right: 82px;
952 -}
953 -#wp-chatbot-desktop-close {
954 - right: 8px;
955 -}
956 -
957 -
958 -.notice.is-dismissible.qcbot-feedback {
959 - display: flex;
960 - column-gap: 15px;
961 - row-gap: 10px;
962 - background: #fff;
963 - padding: 15px 15px;
964 - margin: 20px 20px 20px 0;
965 - border-radius: 16px;
966 - align-items: center;
967 - justify-content: space-between;
968 - border: none;
969 -}
970 -
971 -
972 -
973 -
974 -.wp-chatbot-template-01 .wpbot_card_image span {
975 - display: none !important;
976 -}
977 -.wp-chatbot-template-01 .wpbot_card_image a {
978 - display: flex !important;
979 - gap: 6px !important;
980 -}
981 -.wp-chatbot-template-01 .wpbot_card_image.wpbot_card_image_saas a{
982 - display: flex !important;
983 - gap: 6px !important;
984 -}
985 -.wp-chatbot-template-01 .wpbot_card_image img{
986 - max-width: 25px !important;
987 - height: 25px !important;
988 - border-radius: 50%;
989 -}
990 -.wp-chatbot-template-01 .wpbot_card_caption.wpbot_card_caption_saas span {
991 - display: flex !important;
992 - gap: 10px !important;
993 - margin: 0 10px 0 0 !important;
994 -}
995 -.wp-chatbot-template-01 .wpbot_card_image.wpbot_card_image_saas .wpbot_card_caption.wpbot_card_caption_saas p {
996 - display: flex;
997 -}
998 -.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper {
999 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1000 - background: rgb(255 255 255 / 30%);
1001 - backdrop-filter: blur(0px);
1002 - isolation: isolate;
1003 - margin: 5px 0;
1004 - padding: 5px;
1005 -}
1006 -.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper p.wpbot_card_caption_title{
1007 - margin: 0;
1008 - padding: 0;
1009 - color: rgb(29 115 180) !important;
1010 - font-weight: 600;
1011 -}
1012 -.wp-chatbot-template-01 .wpbot_card_caption.wpbot_card_caption_saas p.wpbot_card_description {
1013 - padding: 0 0 0 28px;
1014 -}
1015 -.wp-chatbot-template-01 .wpbot_card_caption p.wpbot_card_description {
1016 - margin: 0;
1017 - padding: 0;
1018 -}
1019 -.wp-chatbot-template-01 .wp-chatbot-template-01 .wpbot_card_caption h2 {
1020 - margin: 0;
1021 - padding: 0;
1022 - color: rgb(29 115 180) !important;
1023 - font-weight: 600;
1024 - font-size: 14px;
1025 -}
1026 -
1027 -.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper a{
1028 - text-decoration: none !important;
1029 -}
1030 -
1031 -.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper a p:first-child {
1032 - margin: 0;
1033 - padding: 0;
1034 - color: rgb(29 115 180) !important;
1035 - font-weight: 600;
1036 -}
1037 -
1038 -.wp-chatbot-template-01 .wpb-search-result a p {
1039 - margin: 0;
1040 -}
1041 -ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph {
1042 - color: rgb(0 0 0) ;
1043 - background: transparent !important;
1044 - backdrop-filter: none !important;
1045 -}
1046 -span.qcld-chatbot-product-category, span.qcld-chatbot-support-items, span.qcld-chatbot-wildcard, span.qcld-chatbot-suggest-email, span.qcld-chatbot-reset-btn, #wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
1047 - color: #3289c8;
1048 -}
1049 -
1050 -
1051 -.wp-chatbot-textanimation span:hover {
1052 - color: rgb(50 137 200);
1053 -}
1054 -@media screen and (max-width: 768px) {
1055 - .wp-chatbot-editor-container button {
1056 - right: 7px;
1057 - }
1058 - .wp-chatbot-template-01 #wp-chatbot-desktop-expand {
1059 - display: none !important;
1060 - }
1061 -}
1062 -
1063 -/* Template-00 open/expand/close motion (chatbot.com-like) */
1064 -@keyframes wpbotTemplate00RevealMotion {
1065 - 0% {
1066 - opacity: 0;
1067 - transform: translate3d(0, 22px, 0) scale(0.96);
1068 - }
1069 - 70% {
1070 - opacity: 1;
1071 - transform: translate3d(0, -2px, 0) scale(1.002);
1072 - }
1073 - 100% {
1074 - opacity: 1;
1075 - transform: translate3d(0, 0, 0) scale(1);
1076 - }
1077 -}
1078 -
1079 -@keyframes wpbotTemplate00HideMotion {
1080 - 0% {
1081 - opacity: 1;
1082 - transform: translate3d(0, 0, 0) scale(1);
1083 - }
1084 - 100% {
1085 - opacity: 0;
1086 - transform: translate3d(0, 18px, 0) scale(0.97);
1087 - }
1088 -}
1089 -
1090 -.wp-chatbot-template-01 #wp-chatbot-board-container {
1091 - transform-origin: right bottom;
1092 - will-change: transform, opacity, width, height;
1093 - transition: width 0.34s cubic-bezier(0.16, 1, 0.3, 1), max-width 0.34s cubic-bezier(0.16, 1, 0.3, 1), height 0.34s cubic-bezier(0.16, 1, 0.3, 1);
1094 -}
1095 -
1096 -.wp-chatbot-template-01 #wp-chatbot-board-container.active-chat-board.wp-chatbot-open-anim,
1097 -.wp-chatbot-template-01 #wp-chatbot-board-container.wp-chatbot-expand-anim {
1098 - animation: wpbotTemplate00RevealMotion 0.34s cubic-bezier(0.16, 1, 0.3, 1) both;
1099 -}
1100 -
1101 -.wp-chatbot-template-01 #wp-chatbot-board-container.wp-chatbot-collapse-anim,
1102 -.wp-chatbot-template-01 #wp-chatbot-board-container.active-chat-board.wp-chatbot-close-anim {
1103 - animation: wpbotTemplate00HideMotion 0.28s cubic-bezier(0.4, 0, 1, 1) both;
1104 -}
1105 -
1106 -/* Keep reset/expand/close grouped on right side */
1107 -.wp-chatbot-template-01 .wp-chatbot-header {
1108 - position: relative;
1109 -}
1110 -
1111 -.wp-chatbot-template-01 .wp-chatbot-header-icon-right {
1112 - position: absolute;
1113 - right: 8px;
1114 - top: 50%;
1115 - transform: translateY(-50%);
1116 - display: flex;
1117 - align-items: center;
1118 - gap: 8px;
1119 - z-index: 3;
1120 -}
1121 -
1122 -.wp-chatbot-template-01 .wp-chatbot-header-icon-right #wp-chatbot-desktop-reload,
1123 -.wp-chatbot-template-01 .wp-chatbot-header-icon-right #wp-chatbot-desktop-expand,
1124 -.wp-chatbot-template-01 .wp-chatbot-header-icon-right #wp-chatbot-desktop-close {
1125 - position: static !important;
1126 - top: auto !important;
1127 - right: auto !important;
1128 - transform: none !important;
1129 -}
1130 -
1131 -
1132 -.wp-chatbot-footer button#wp-chatbot-send-message {
1133 - width: 34px !important;
1134 - height: 34px !important;
1135 - box-shadow: none !important;
1136 - opacity: 0.9;
1137 - padding: 0;
1138 -}
1139 -
1140 -.wp-chatbot-editor-container {
1141 - padding: 4px 10px;
1142 -}
1143 -
1144 -.wp-chatbot-footer div#wp-chatbot-editor-container {
1145 - display: flex;
1146 - align-items: center;
1147 -}
1148 -
1149 -div#wp-chatbot-desktop-expand {
1150 - width: 30px;
1151 - height: 30px;
1152 - border-radius: 50%;
1153 - line-height: 30px;
1154 -}
1155 -
1156 -div#wp-chatbot-desktop-expand span.dashicons.dashicons-editor-expand {
1157 - top: 5px;
1158 -}
1159 -div#wp-chatbot-desktop-expand span.dashicons.dashicons-editor-contract {
1160 - top: 6px;
1161 -}
1162 -
1163 -.wp-chatbot-board-container.active-chat-board .dashicons-fullscreen-alt:before {
1164 - content: "\f188";
1165 -}
1166 -
1167 -
1168 -.wp-chatbot-board-container.active-chat-board.wp-chatbot-expanded .dashicons-fullscreen-alt:before {
1169 - content: "\f189";
1170 -}
1171 -
1172 -.wp-chatbot-send-message-active{
1173 - background: #00000066 !important;
1174 - color: #ffffff !important;
1175 -}
1176 -.wp-chatbot-footer button#wp-chatbot-send-message {
1177 - border: none;
1178 -}
1179 -.wp-chatbot-template-01 div#wp-chatbot-board-container {
1180 - width: 400px;
1181 -}
1182 -@media screen and (max-width: 480px) {
1183 - .wp-chatbot-template-01 div#wp-chatbot-board-container {
1184 - width: 100%;
1185 - }
1186 -}
1187 -
1188 -.wp-chatbot-rtl .wp-chatbot-template-01 .wp-chatbot-header-icon-right {
1189 - right: 95px;
1190 -}
1191 -
1192 -
1193 -
1194 -
1195 -
1196 -
1197 -.wp-chatbot-avatar-hidden .wp-chatbot-avatar {
1198 - display: none;
1199 -}
1200 -.wp-chatbot-avatar-hidden ul.wp-chatbot-messages-container > li.wp-chatbot-msg {
1201 - padding-left: 0;
1202 -}
1203 -
1204 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chatbot-msg {
1205 - padding-left: 0px;
1206 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1207 - background: rgb(255 255 255 / 30%);
1208 - backdrop-filter: blur(0px);
1209 - isolation: isolate;
1210 - border-radius: 10px;
1211 - padding: 8px 15px;
1212 - min-height: auto;
1213 -}
1214 -
1215 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container>li.wp-chatbot-msg .chat-container {
1216 - box-shadow: none;
1217 - background: rgba(255, 255, 255, 0);
1218 - backdrop-filter: none;
1219 - isolation: isolate;
1220 - border-radius: 0px;
1221 - padding: 0;
1222 -}
1223 -
1224 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li .wp-chatbot-avatar{
1225 - position: relative;
1226 -}
1227 -
1228 -.wp-chatbot-avatar-inside .wp-chatbot-avatar img, .wp-chatbot-avatar-inside .wp-chatbot-widget-avatar img {
1229 - width: 32px !important;
1230 - height: 32px !important;
1231 - object-fit: cover;
1232 -}
1233 -
1234 -
1235 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
1236 - padding-right: 0;
1237 -}
1238 -
1239 -
1240 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
1241 - padding-left: 0px;
1242 - box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1243 - background: rgb(255 255 255 / 30%);
1244 - backdrop-filter: blur(0px);
1245 - isolation: isolate;
1246 - border-radius: 10px;
1247 - padding: 8px 15px;
1248 - min-height: auto;
1249 - display: flex;
1250 - flex-direction: column;
1251 - align-content: flex-end;
1252 - flex-wrap: wrap;
1253 -}
1254 -
1255 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
1256 - box-shadow: none;
1257 - background: rgba(255, 255, 255, 0);
1258 - backdrop-filter: none;
1259 - isolation: isolate;
1260 - border-radius: 0px;
1261 - padding: 0;
1262 -}
1263 -
1264 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
1265 - width: 32px;
1266 - height: 32px;
1267 - text-align: right;
1268 - margin: 0 0 6px auto;
1269 -}
1270 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li .wp-chatbot-avatar {
1271 - position: relative;
1272 - border-radius: 0;
1273 -}
1274 -.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li .wp-chatbot-avatar img{
1275 - border-radius: 50%;
1276 -}
1277 -.wp-chatbot-avatar-hidden ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
1278 - padding-right: 0;
1 +/*
2 +
3 +01. Ball content
4 +
5 +02. wp Chat bot Message container
6 +
7 + -A Link Item
8 +
9 + -B Loading
10 +
11 +03. wp Chat bot Message Editor
12 +
13 +04. wp Chat bottom Tab Nav Editor
14 +05. Tab Feature Product
15 +
16 +06. Tab Cart
17 +
18 +07. Product Details
19 +
20 +*/
21 +
22 +/*********************
23 +
24 +01. ball content wrapper
25 +
26 +**********************/
27 +
28 +.wp-chatbot-board-container {
29 + border-radius: 5px;
30 + overflow: hidden;
31 +}
32 +
33 +.wp-chatbot-board-container:after {
34 + content: "";
35 + position: absolute;
36 + right: 0;
37 + bottom: -26px;
38 + width: 0;
39 + height: 0;
40 + border-left: 30px solid transparent;
41 + border-right: 0 solid transparent;
42 + border-top: 30px solid #ffffff;
43 +
44 +}
45 +
46 +/******************************
47 +
48 +02. wp Chat bot Message container
49 +
50 +*********************************/
51 +
52 +
53 +.wp-chatbot-header h3 {
54 +
55 + color: #ffffff;
56 +
57 + font-size: 18px !important;
58 +
59 + letter-spacing: 1px;
60 +
61 +}
62 +
63 +
64 +ul.wp-chatbot-messages-container li {
65 +
66 + font-size: 14px;
67 +
68 +}
69 +
70 +ul.wp-chatbot-messages-container > li.wp-chatbot-msg {
71 +
72 + padding-left: 50px;
73 +
74 +}
75 +
76 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
77 +
78 + padding-right: 50px;
79 +
80 +}
81 +ul li .wp-chatbot-avatar {
82 + margin-top: 0 !important;
83 +}
84 +ul.wp-chatbot-messages-container > li .wp-chatbot-avatar, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar {
85 +
86 + position: absolute;
87 +
88 + top: 0;
89 +
90 + width: 40px;
91 +
92 + height: 40px;
93 +
94 + overflow: hidden;
95 +
96 + border-radius: 50%;
97 +
98 +}
99 +
100 +ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-avatar, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar {
101 +
102 + left: 0;
103 +
104 +}
105 +
106 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
107 +
108 + right: 0;
109 +
110 +}
111 +
112 +ul.wp-chatbot-messages-container > li > .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
113 +
114 + padding: 8px 15px;
115 +
116 + max-width: 90%;
117 +
118 + box-shadow: 0 2px 8px #bfbfbf;
119 +
120 + line-height: 150%;
121 +
122 + display: table;
123 +
124 +}
125 +
126 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
127 +
128 + text-align: right;
129 +
130 + float: right;
131 +
132 +}
133 +
134 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
135 +
136 + background-color: #eaf1f6;
137 +
138 + color: #494949;
139 +
140 + margin-left: 10%;
141 +
142 + border-radius: 10px 10px 0 10px;
143 +
144 +}
145 +
146 +ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
147 +
148 + background-color: #1f8ceb;
149 +
150 + color: #ffffff;
151 +
152 + border-radius: 0 10px 10px 10px;
153 + width: 100%;
154 +}
155 +
156 +ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph {
157 +
158 + background-color: transparent;
159 +
160 +}
161 +
162 +/************ 02 (A). Link Item *************/
163 +
164 +span.qcld-chatbot-product-category,
165 +span.qcld-chatbot-support-items,
166 +span.qcld-chatbot-wildcard,
167 +span.qcld-chatbot-suggest-email,
168 +span.qcld-chatbot-reset-btn,
169 +#wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
170 +
171 + color: #000000;
172 + background-size: 200% auto;
173 + border: 1px solid #ffffff;
174 + display: inline-block;
175 + margin: 3px auto;
176 + padding: 6px 11px;
177 +
178 +
179 +}
180 +
181 +span.qcld-chatbot-product-category:hover,
182 +span.qcld-chatbot-support-items:hover,
183 +span.qcld-chatbot-wildcard:hover,
184 +span.qcld-chatbot-suggest-email:hover,
185 +span.qcld-chatbot-reset-btn:hover,
186 +#wp-chatbot-loadmore:hover, .wp-chatbot-loadmore:hover {
187 +
188 + background-position: right center;
189 +
190 +
191 +}
192 +
193 +/**************** 02. (B) Loading **********/
194 +
195 +ul.wp-chatbot-messages-container > li .wp-chatbot-paragraph img.wp-chatbot-comment-loader {
196 +
197 + background-color: #fff;
198 +
199 + padding: 1px;
200 +
201 + border-radius: 5px;
202 +
203 + margin: 0 auto;
204 +
205 + display: block;
206 +
207 +}
208 +
209 +/*******************************
210 +
211 +03. wp Chat bot Message Editor
212 +
213 +**********************************/
214 +
215 +
216 +
217 +.wp-chatbot-editor-container input, .wp-chatbot-editor-area input::-webkit-input-placeholder, .wp-chatbot-editor-area input::-moz-placeholder, .wp-chatbot-editor-area input:-ms-input-placeholder, .wp-chatbot-editor-area input:-moz-placeholder {
218 +
219 + color: #fff;
220 +
221 +}
222 +
223 +/*******************************
224 +
225 +04. wp Chat bottom Tab Nav Editor
226 +
227 +**********************************/
228 +
229 +.wp-chatbot-footer {
230 +
231 + padding: 0;
232 +
233 +}
234 +
235 +.wp-chatbot-tab-nav ul li a[data-option="recent"] {
236 +
237 + background-position: -7px -47px;
238 +
239 +}
240 +
241 +.wp-chatbot-tab-nav ul li a[data-option="cart"] {
242 +
243 + background-position: -47px -47px;
244 +
245 +}
246 +
247 +.wp-chatbot-tab-nav ul li a[data-option="chat"] {
248 +
249 + background-position: -82px -42px;
250 +
251 +}
252 +
253 +.wp-chatbot-tab-nav ul li a[data-option="help"] {
254 +
255 + background-position: -129px -47px;
256 +
257 +}
258 +
259 +
260 +
261 +.wp-chatbot-tab-nav ul li a[data-option="chat"]:after {
262 +
263 + content: "";
264 +
265 + position: absolute;
266 +
267 + border-radius: 50%;
268 +
269 + border: 3px solid #1f8ceb;
270 +
271 + left: -9px;
272 +
273 + right: -9px;;
274 +
275 + bottom: -9px;
276 +
277 + top: -9px;
278 +
279 +}
280 +
281 +.wp-chatbot-tab-nav ul li.wp-chatbot-operation-active a:before, .wp-chatbot-tab-nav ul li:hover a:before {
282 +
283 + border: 2px solid #1f8ceb;
284 +
285 +}
286 +
287 +/***************************
288 +
289 +05. Tab Feature Product
290 +
291 +***************************/
292 +
293 +.wp-chatbot-agent-profile {
294 +
295 + position: relative;
296 +
297 + padding-left: 50px;
298 +
299 + box-sizing: border-box;
300 +
301 + word-wrap: break-word;
302 +
303 + list-style: none;
304 +
305 + display: block;
306 +
307 + clear: both;
308 +
309 + line-height: 150%;
310 +
311 + min-height: 50px;
312 +
313 + margin: 0 0 10px 0;
314 +
315 +}
316 +
317 +.wp-chatbot-widget-title {
318 +
319 + color: #353535;
320 +
321 + text-align: center;
322 +
323 + padding-bottom: 10px;
324 +
325 +}
326 +
327 +/**************************
328 +
329 +06. Tab Cart
330 +
331 +*************************/
332 +
333 +.wp-chatbot-cart-header {
334 +
335 + background-color: #F5F5F5;
336 +
337 +}
338 +
339 +.wp-chatbot-cart-single {
340 +
341 + background-color: rgba(245, 245, 245, 0.1);
342 +
343 + border-bottom: 1px solid #dddddd;
344 +
345 +}
346 +
347 +.wp-chatbot-cart-single:nth-child(2n+1) {
348 +
349 + background-color: rgba(245, 245, 245, 0.5);
350 +
351 +}
352 +
353 +.wp-chatbot-cart-footer div a {
354 +
355 + text-decoration: none;
356 +
357 + background: #1f8ceb;
358 +
359 + color: #ffffff;
360 +
361 +}
362 +
363 +.wp-chatbot-cart-footer div a:hover, .wp-chatbot-cart-footer div:last-child a {
364 +
365 + background: #1c7ed4;
366 +
367 +}
368 +
369 +/**************************
370 +
371 +07. Product Details
372 +
373 +***************************/
374 +
375 +.wp-chatbot-product-details {
376 +
377 + box-shadow: 0 0 10px #ccc;
378 +
379 + background-color: #ffffff;
380 +
381 +}
382 +
383 +.wp-chatbot-product-cart-button input[type="button"] {
384 +
385 + border: 1px solid #e4e5e7;
386 +
387 + background: #1f8ceb;
388 +
389 + color: #ffffff;
390 +
391 + box-shadow: 0 0 2px #999;
392 +
393 +}
394 +
395 +.wp-chatbot-product-cart-button input[type="button"]:hover {
396 +
397 + background: #1c7ed4;
398 +
399 + color: #ffffff;
400 +
401 +}
402 +
403 +/*************************
404 +
405 +Right-to-left text direction
406 +
407 +**************************/
408 +
409 +.wp-chatbot-rtl {
410 +
411 + text-align: right;
412 +
413 + direction: RTL;
414 +
415 +}
416 +
417 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg, .wp-chatbot-rtl .wp-chatbot-agent-profile {
418 +
419 + padding: 0 50px 0 0;
420 +
421 +}
422 +
423 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg.wp-chatbot-msg-flat {
424 +
425 + padding: 0;
426 +
427 +}
428 +
429 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg > .wp-chatbot-paragraph {
430 +
431 + display: table;
432 +
433 + max-width: 90%;
434 +
435 + float: right;
436 +
437 + text-align: right;
438 +
439 +}
440 +
441 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-avatar,
442 +.wp-chatbot-rtl .wp-chatbot-agent-profile .wp-chatbot-widget-avatar {
443 +
444 + right: 0;
445 +
446 + left: auto;
447 +
448 +}
449 +
450 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
451 +
452 + padding: 0 0 0 50px;
453 +
454 +}
455 +
456 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
457 +
458 + left: 0;
459 +
460 + right: auto;
461 +
462 +}
463 +
464 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg > .wp-chatbot-paragraph {
465 +
466 + display: table;
467 +
468 + max-width: 90%;
469 +
470 + float: left;
471 +
472 + text-align: left;
473 +
474 +}
475 +
476 +.wp-chatbot-rtl ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
477 +
478 + margin-left: 0;
479 +
480 +}
481 +
482 +.wp-chatbot-rtl .wp-chatbot-editor-container input {
483 +
484 + text-align: right;
485 +
486 + direction: RTL;
487 +
488 +}
489 +
490 +.wp-chatbot-rtl .wp-chatbot-products-area ul li:nth-child(2n+2) {
491 +
492 + margin: auto;
493 +
494 +}
495 +.wp-chatbot-rtl .wp-chatbot-products-area ul li {
496 + margin: 1%;
497 + vertical-align: middle;
498 +}
499 +
500 +.wpb-search-result a {
501 + display: block;
502 + background: #eee;
503 + padding: 4px 5px;
504 + line-height: 20px;
505 + padding-left: 20px;
506 + margin-bottom: 0;
507 +}
508 +.wpb-search-result a:before {
509 + content: "";
510 + font-style: normal;
511 + font-weight: normal;
512 + text-decoration: inherit;
513 + color: #000;
514 + font-size: 18px;
515 + position: absolute;
516 + left: 68px;
517 + line-height: 1;
518 + font-weight: bold;
519 + color: #7d7b7b;
520 +}
521 +.wpbot-saas-live-chat{
522 + width: 310px !important;
523 + height: 500px;
524 + box-shadow: 0 5px 40px rgba(0,0,0,.16)!important;
525 + display:none;
526 +}
527 +.wpchat_header_left{
528 + display:inline-block;
529 +}
530 +.wpchat_header_left span{ font-size: 22px;
531 + padding: 0px 10px; }
532 +.wpchat_header_right {
533 + float: right;
534 + margin-right: 12px;
535 +}
536 +
537 +
538 +/* Css Updated - 06-06-24 */
539 +
540 +.wp-chatbot-header {
541 + color: rgb(255, 255, 255);
542 +}
543 +ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
544 + color: rgb(255, 255, 255);
545 + background: linear-gradient(135deg, rgb(42, 39, 218) 0%, rgb(0, 204, 255) 100%);
546 +}
547 +ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph {
548 + background: linear-gradient(135deg, rgb(42, 39, 218) 0%, rgb(0, 204, 255) 100%);
549 +}
550 +
551 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
552 + color: rgb(255, 255, 255);
553 + background: linear-gradient(135deg, rgb(0, 204, 255) 0%, rgb(42, 39, 218) 100%);
554 +}
555 +span.qcld-chatbot-product-category, span.qcld-chatbot-support-items, span.qcld-chatbot-wildcard, span.qcld-chatbot-suggest-email, span.qcld-chatbot-reset-btn, #wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
556 + background: rgba(0, 0, 0, 0);
557 + padding: 8px 12px 6px 12px;
558 +}
559 +
560 +h2.oneline {
561 + font-size: 18px;
562 + color: #fff;
563 +}
564 +
565 +h2.oneline img{
566 + margin: 0 0 0 10px !important;
567 +}
568 +.wp-chatbot-header {
569 + display: flex;
570 + align-content: center;
571 + align-items: center;
572 +}
573 +
574 +div#wp-chatbot-desktop-reload {
575 + top: -14px;
576 +}
577 +#wp-chatbot-desktop-close {
578 + top: -14px;
579 +}
580 +div#wp-chatbot-ball-container {
581 + box-shadow: rgba(0, 18, 46, 0.16) 0px 8px 36px 0px;
582 + border-radius: 8px;
583 +}
584 +
585 +
586 +.wp-chatbot-tab-nav ul li a {
587 + width: 32px;
588 + height: 32px;
589 + background: url(../../images/tab-btn-icon-new.png) no-repeat;
590 +
591 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
592 + background-color: rgb(255 255 255 / 25%);
593 + backdrop-filter: blur(0px);
594 + isolation: isolate;
595 +
596 +
597 +}
598 +.wp-chatbot-tab-nav ul li a[data-option="help"] {
599 + background-position: -125px -44px;
600 +}
601 +.wp-chatbot-tab-nav ul li a[data-option="support"] {
602 + background-position: -166px -44px;
603 +}
604 +
605 +.wp-chatbot-board-container:after {
606 + border-top: 30px solid #ffffff00;
607 +}
608 +
609 +.wp-chatbot-header {
610 + padding: 6px 15px;
611 +}
612 +.wp-chatbot-ball {
613 + box-shadow: rgba(0, 77, 255, 0.5) 0px 4px 24px;
614 +}
615 +
616 +.wp-chatbot-tab-nav ul {
617 + margin: 0 !important;
618 + padding: 0 !important;
619 + list-style: none;
620 + text-align: center;
621 + display: flex;
622 + justify-content: space-between;
623 + vertical-align: bottom;
624 +}
625 +.wp-chatbot-tab-nav ul li a[data-option="chat"]:after {
626 + border: 0 solid #1f8ceb;
627 +}
628 +.wp-chatbot-tab-nav ul li.wp-chatbot-operation-active a:before, .wp-chatbot-tab-nav ul li:hover a:before {
629 + border: 0px solid #1f8ceb;
630 +}
631 +.wp-chatbot-tab-nav ul li a[data-option="chat"] {
632 + background-position: -82px -41px;
633 +}
634 +
635 +.wp-chatbot-tab-nav {
636 + padding: 4px 5px;
637 +}
638 +
639 +ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
640 + border-radius: 10px;
641 +}
642 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
643 + border-radius: 10px;
644 +}
645 +
646 +.wp-chatbot-board-container {
647 + overflow: visible;
648 +}
649 +
650 +
651 +
652 +.wp-chatbot-header-welcome-text img {
653 + border-radius: 50%;
654 + padding: 3px;
655 +}
656 +
657 +.wp-chatbot-footer {
658 + padding: 0;
659 +}
660 +.wp-chatbot-header-welcome-text {
661 + align-items: center;
662 + display: flex;
663 + justify-content: center;
664 +}
665 +span.qcld-chatbot-wildcard {
666 + width: 100%;
667 + max-width: 255px;
668 +}
669 +
670 +.wp-chatbot-textanimation span {
671 + display: inline-block;
672 + width: auto;
673 + margin: 3px 2px;
674 +}
675 +
676 +.wp-chatbot-textanimation span:hover {
677 +color: rgb(255, 255, 255);
678 +background: linear-gradient(135deg, rgb(42, 39, 218) 0%, rgb(0, 204, 255) 100%);
679 +}
680 +
681 +
682 +
683 +.wpb-search-result a {
684 + color: #222 !important;
685 +}
686 +.wpbot_card_caption p {
687 + color: #222 !important;
688 +}
689 +
690 +
691 +@media screen and (max-width: 768px) {
692 + .wp-chatbot-editor-container button {
693 + right: 0;
694 + }
695 +
696 +}
697 +
698 +
699 +div#wp-chatbot-board-container {
700 + background: url(../../images/bg-03.jpg) no-repeat;
701 + position: relative;
702 + background-size: 100% 100%;
703 + background-position: center bottom;
704 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
705 + backdrop-filter: blur(0px);
706 + isolation: isolate;
707 + box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 50px -10px;
708 + border-radius: 8px;
709 +}
710 +
711 +.wp-chatbot-template-01 #wp-chatbot-board-container.wp-chatbot-expanded {
712 + width: 620px;
713 + max-width: calc(100vw - 40px);
714 +}
715 +div#wp-chatbot-board-container:before {
716 + isolation: isolate;
717 + content: '';
718 + position: absolute;
719 + height: 100%;
720 + width: 100%;
721 + backdrop-filter: blur(0px);
722 + border-radius: 8px !important;
723 + left: 0;
724 + right: 0;
725 + width: 100%;
726 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
727 + backdrop-filter: blur(0px);
728 + isolation: isolate;
729 +}
730 +ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
731 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
732 + background: rgb(255 255 255 / 30%);
733 + backdrop-filter: blur(0px);
734 + isolation: isolate;
735 +}
736 +ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph{
737 +
738 + background: rgb(255 255 255 / 30%);
739 + backdrop-filter: blur(0px);
740 + isolation: isolate;
741 +}
742 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph{
743 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
744 + background: rgb(255 255 255 / 30%);
745 + backdrop-filter: blur(0px);
746 + isolation: isolate;
747 +}
748 +
749 +span.qcld-chatbot-product-category, span.qcld-chatbot-support-items, span.qcld-chatbot-wildcard, span.qcld-chatbot-suggest-email, span.qcld-chatbot-reset-btn, #wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
750 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
751 + background: rgb(255 255 255 / 25%);
752 + backdrop-filter: blur(0px);
753 + isolation: isolate;
754 + color: #fff;
755 +}
756 +
757 +div#wp-chatbot-editor-container {
758 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
759 + background: #5755bd61;
760 + backdrop-filter: blur(0px);
761 + isolation: isolate;
762 + margin: 0 12px 0 12px;
763 + border-radius: 6PX;
764 +}
765 +div#wp-chatbot-desktop-reload {
766 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
767 + background: rgb(255 255 255 / 25%);
768 + backdrop-filter: blur(0px);
769 + isolation: isolate;
770 +}
771 +div#wp-chatbot-desktop-close {
772 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
773 + background: rgb(255 255 255 / 25%);
774 + backdrop-filter: blur(0px);
775 + isolation: isolate;
776 +}
777 +div#wp-chatbot-desktop-reload {
778 + right: 38px;
779 +}
780 +button#wp-chatbot-send-message {
781 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
782 + background: #ffffff91;
783 + backdrop-filter: blur(0px);
784 + isolation: isolate;
785 + color: #3f3f3f;
786 +}
787 +
788 +.wp-chatbot-textanimation span:hover {
789 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
790 + background: rgb(255 255 255 / 25%);
791 + backdrop-filter: blur(0px);
792 + isolation: isolate;
793 + backdrop-filter: blur(2px);
794 +}
795 +.wp-chatbot-editor-container input {
796 + width:100%;
797 +}
798 +
799 +.wp-chatbot-editor-container input, .wp-chatbot-editor-area input::-webkit-input-placeholder, .wp-chatbot-editor-area input::-moz-placeholder, .wp-chatbot-editor-area input:-ms-input-placeholder, .wp-chatbot-editor-area input:-moz-placeholder {
800 +
801 + color: #222 !important;
802 +
803 +}
804 +.wp-chatbot-header-welcome-text img {
805 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
806 + background: rgb(255 255 255 / 25%);
807 + backdrop-filter: blur(0px);
808 + isolation: isolate;
809 +}
810 +.wp-chatbot-header-welcome-text img {
811 + max-width: 38px !important;
812 +}
813 +
814 +div#wp-chatbot-editor-container input{
815 + color: #222;
816 +}
817 +div#wp-chatbot-editor-container input::placeholder {
818 + color: #fff;
819 +}
820 +div#wp-chatbot-editor-container input::-webkit-input-placeholder {
821 + color: #fff;
822 +}
823 +div#wp-chatbot-editor-container input::-moz-placeholder {
824 + color: #fff;
825 +}
826 +div#wp-chatbot-editor-container input:-ms-input-placeholder {
827 + color: #fff;
828 +}
829 +
830 +/* Keep editor autofill transparent */
831 +.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill,
832 +.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill:hover,
833 +.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill:focus,
834 +.wp-chatbot-template-01 #wp-chatbot-editor-container input:-webkit-autofill:active,
835 +.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill,
836 +.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill:hover,
837 +.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill:focus,
838 +.wp-chatbot-template-01 #wp-chatbot-editor-container textarea:-webkit-autofill:active {
839 + -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
840 + box-shadow: 0 0 0 1000px transparent inset !important;
841 + -webkit-text-fill-color: inherit !important;
842 + background-color: transparent !important;
843 + transition: background-color 9999s ease-out 0s;
844 +}
845 +
846 +
847 +.wp-chatbot-tab-nav ul li a:hover {
848 + transform: scale(0.95);
849 +}
850 +.wp-chatbot-tab-nav ul li a{
851 + transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
852 +}
853 +
854 +.wp-chatbot-textanimation span:hover {
855 + transform: scale(0.95);
856 +}
857 +.wp-chatbot-textanimation span{
858 + transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
859 +}
860 +
861 +button#wp-chatbot-send-message:hover {
862 + transform: scale(0.95);
863 +}
864 +button#wp-chatbot-send-message{
865 + transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
866 +}
867 +
868 +.wp-chatbot-tab-nav ul li:before {
869 + top: 0;
870 +}
871 +
872 +span.qcld-chatbot-wildcard:hover {
873 + transform: scale(0.95);
874 +}
875 +span.qcld-chatbot-wildcard{
876 + transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 2.2);
877 +}
878 +
879 +.wp-chatbot-tab-nav ul {
880 + margin: 5px 0 !important;
881 + padding: 0 !important;
882 + list-style: none;
883 + text-align: center;
884 + display: flex;
885 + gap: 30px;
886 + vertical-align: bottom;
887 + align-items: center;
888 + justify-content: center;
889 + width: 100%;
890 +}
891 +
892 +ul.wp-chatbot-messages-container > li.wp-chatbot-msg .wp-chatbot-paragraph, .wp-chatbot-agent-profile .wp-chatbot-bubble {
893 + color: rgb(33 33 33);
894 +}
895 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
896 + color: rgb(33 33 33) ;
897 +}
898 +
899 +
900 +div#wp-chatbot-desktop-reload {
901 + color: #3f3f3f;
902 +}
903 +#wp-chatbot-desktop-close {
904 + color: #3f3f3f;
905 +
906 +}
907 +.wp-chatbot-ball {
908 + background: #fbf7ff;
909 +}
910 +.wp-chatbot-ball {
911 + background: #ffffff;
912 +}
913 +.wp-chatbot-ball:hover, .wp-chatbot-ball:focus {
914 + background: #ffffff;
915 +}
916 +.wp-chatbot-header {
917 + border-bottom: 1px solid #fff;
918 + box-shadow: inset 1px 1px 0 rgb(255 255 255), inset 0 0 5px rgb(255 255 255);
919 +}
920 +
921 +
922 +.wpbot_chatopen_iconanimation .wp-chatbot-ball {
923 + border: 1px solid #dadada;
924 + background-color: #dadada;
925 +}
926 +div#wp-chatbot-desktop-reload {
927 + top: -10px;
928 +}
929 +#wp-chatbot-desktop-close {
930 + top: -10px;
931 + right: 8px;
932 +}
933 +div#wp-chatbot-desktop-reload {
934 + right: 45px;
935 +}
936 +div#wp-chatbot-desktop-expand {
937 + top: -10px;
938 + right: 45px;
939 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
940 + background: rgb(255 255 255 / 25%);
941 + backdrop-filter: blur(0px);
942 + isolation: isolate;
943 + color: #3f3f3f;
944 + cursor: pointer;
945 +}
946 +
947 +div#wp-chatbot-desktop-expand span {
948 + position: relative;
949 +}
950 +div#wp-chatbot-desktop-reload {
951 + right: 82px;
952 +}
953 +#wp-chatbot-desktop-close {
954 + right: 8px;
955 +}
956 +
957 +
958 +.notice.is-dismissible.qcbot-feedback {
959 + display: flex;
960 + column-gap: 15px;
961 + row-gap: 10px;
962 + background: #fff;
963 + padding: 15px 15px;
964 + margin: 20px 20px 20px 0;
965 + border-radius: 16px;
966 + align-items: center;
967 + justify-content: space-between;
968 + border: none;
969 +}
970 +
971 +
972 +
973 +
974 +.wp-chatbot-template-01 .wpbot_card_image span {
975 + display: none !important;
976 +}
977 +.wp-chatbot-template-01 .wpbot_card_image a {
978 + display: flex !important;
979 + gap: 6px !important;
980 +}
981 +.wp-chatbot-template-01 .wpbot_card_image.wpbot_card_image_saas a{
982 + display: flex !important;
983 + gap: 6px !important;
984 +}
985 +.wp-chatbot-template-01 .wpbot_card_image img{
986 + max-width: 25px !important;
987 + height: 25px !important;
988 + border-radius: 50%;
989 +}
990 +.wp-chatbot-template-01 .wpbot_card_caption.wpbot_card_caption_saas span {
991 + display: flex !important;
992 + gap: 10px !important;
993 + margin: 0 10px 0 0 !important;
994 +}
995 +.wp-chatbot-template-01 .wpbot_card_image.wpbot_card_image_saas .wpbot_card_caption.wpbot_card_caption_saas p {
996 + display: flex;
997 +}
998 +.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper {
999 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1000 + background: rgb(255 255 255 / 30%);
1001 + backdrop-filter: blur(0px);
1002 + isolation: isolate;
1003 + margin: 5px 0;
1004 + padding: 5px;
1005 +}
1006 +.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper p.wpbot_card_caption_title{
1007 + margin: 0;
1008 + padding: 0;
1009 + color: rgb(29 115 180) !important;
1010 + font-weight: 600;
1011 +}
1012 +.wp-chatbot-template-01 .wpbot_card_caption.wpbot_card_caption_saas p.wpbot_card_description {
1013 + padding: 0 0 0 28px;
1014 +}
1015 +.wp-chatbot-template-01 .wpbot_card_caption p.wpbot_card_description {
1016 + margin: 0;
1017 + padding: 0;
1018 +}
1019 +.wp-chatbot-template-01 .wp-chatbot-template-01 .wpbot_card_caption h2 {
1020 + margin: 0;
1021 + padding: 0;
1022 + color: rgb(29 115 180) !important;
1023 + font-weight: 600;
1024 + font-size: 14px;
1025 +}
1026 +
1027 +.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper a{
1028 + text-decoration: none !important;
1029 +}
1030 +
1031 +.wp-chatbot-template-01 .wpb-search-result .wpbot_card_wraper a p:first-child {
1032 + margin: 0;
1033 + padding: 0;
1034 + color: rgb(29 115 180) !important;
1035 + font-weight: 600;
1036 +}
1037 +
1038 +.wp-chatbot-template-01 .wpb-search-result a p {
1039 + margin: 0;
1040 +}
1041 +ul.wp-chatbot-messages-container li:first-child.wp-chatbot-msg .wp-chatbot-paragraph {
1042 + color: rgb(0 0 0) ;
1043 + background: transparent !important;
1044 + backdrop-filter: none !important;
1045 +}
1046 +span.qcld-chatbot-product-category, span.qcld-chatbot-support-items, span.qcld-chatbot-wildcard, span.qcld-chatbot-suggest-email, span.qcld-chatbot-reset-btn, #wp-chatbot-loadmore, .wp-chatbot-loadmore, span.qcld-chatbot-suggest-phone {
1047 + color: #3289c8;
1048 +}
1049 +
1050 +
1051 +.wp-chatbot-textanimation span:hover {
1052 + color: rgb(50 137 200);
1053 +}
1054 +@media screen and (max-width: 768px) {
1055 + .wp-chatbot-editor-container button {
1056 + right: 7px;
1057 + }
1058 + .wp-chatbot-template-01 #wp-chatbot-desktop-expand {
1059 + display: none !important;
1060 + }
1061 +}
1062 +
1063 +/* Template-00 open/expand/close motion (chatbot.com-like) */
1064 +@keyframes wpbotTemplate00RevealMotion {
1065 + 0% {
1066 + opacity: 0;
1067 + transform: translate3d(0, 22px, 0) scale(0.96);
1068 + }
1069 + 70% {
1070 + opacity: 1;
1071 + transform: translate3d(0, -2px, 0) scale(1.002);
1072 + }
1073 + 100% {
1074 + opacity: 1;
1075 + transform: translate3d(0, 0, 0) scale(1);
1076 + }
1077 +}
1078 +
1079 +@keyframes wpbotTemplate00HideMotion {
1080 + 0% {
1081 + opacity: 1;
1082 + transform: translate3d(0, 0, 0) scale(1);
1083 + }
1084 + 100% {
1085 + opacity: 0;
1086 + transform: translate3d(0, 18px, 0) scale(0.97);
1087 + }
1088 +}
1089 +
1090 +.wp-chatbot-template-01 #wp-chatbot-board-container {
1091 + transform-origin: right bottom;
1092 + will-change: transform, opacity, width, height;
1093 + transition: width 0.34s cubic-bezier(0.16, 1, 0.3, 1), max-width 0.34s cubic-bezier(0.16, 1, 0.3, 1), height 0.34s cubic-bezier(0.16, 1, 0.3, 1);
1094 +}
1095 +
1096 +.wp-chatbot-template-01 #wp-chatbot-board-container.active-chat-board.wp-chatbot-open-anim,
1097 +.wp-chatbot-template-01 #wp-chatbot-board-container.wp-chatbot-expand-anim {
1098 + animation: wpbotTemplate00RevealMotion 0.34s cubic-bezier(0.16, 1, 0.3, 1) both;
1099 +}
1100 +
1101 +.wp-chatbot-template-01 #wp-chatbot-board-container.wp-chatbot-collapse-anim,
1102 +.wp-chatbot-template-01 #wp-chatbot-board-container.active-chat-board.wp-chatbot-close-anim {
1103 + animation: wpbotTemplate00HideMotion 0.28s cubic-bezier(0.4, 0, 1, 1) both;
1104 +}
1105 +
1106 +/* Keep reset/expand/close grouped on right side */
1107 +.wp-chatbot-template-01 .wp-chatbot-header {
1108 + position: relative;
1109 +}
1110 +
1111 +.wp-chatbot-template-01 .wp-chatbot-header-icon-right {
1112 + position: absolute;
1113 + right: 8px;
1114 + top: 50%;
1115 + transform: translateY(-50%);
1116 + display: flex;
1117 + align-items: center;
1118 + gap: 8px;
1119 + z-index: 3;
1120 +}
1121 +
1122 +.wp-chatbot-template-01 .wp-chatbot-header-icon-right #wp-chatbot-desktop-reload,
1123 +.wp-chatbot-template-01 .wp-chatbot-header-icon-right #wp-chatbot-desktop-expand,
1124 +.wp-chatbot-template-01 .wp-chatbot-header-icon-right #wp-chatbot-desktop-close {
1125 + position: static !important;
1126 + top: auto !important;
1127 + right: auto !important;
1128 + transform: none !important;
1129 +}
1130 +
1131 +
1132 +.wp-chatbot-footer button#wp-chatbot-send-message {
1133 + width: 34px !important;
1134 + height: 34px !important;
1135 + box-shadow: none !important;
1136 + opacity: 0.9;
1137 + padding: 0;
1138 +}
1139 +
1140 +.wp-chatbot-editor-container {
1141 + padding: 4px 10px;
1142 +}
1143 +
1144 +.wp-chatbot-footer div#wp-chatbot-editor-container {
1145 + display: flex;
1146 + align-items: center;
1147 +}
1148 +
1149 +div#wp-chatbot-desktop-expand {
1150 + width: 30px;
1151 + height: 30px;
1152 + border-radius: 50%;
1153 + line-height: 30px;
1154 +}
1155 +
1156 +div#wp-chatbot-desktop-expand span.dashicons.dashicons-editor-expand {
1157 + top: 5px;
1158 +}
1159 +div#wp-chatbot-desktop-expand span.dashicons.dashicons-editor-contract {
1160 + top: 6px;
1161 +}
1162 +
1163 +.wp-chatbot-board-container.active-chat-board .dashicons-fullscreen-alt:before {
1164 + content: "\f188";
1165 +}
1166 +
1167 +
1168 +.wp-chatbot-board-container.active-chat-board.wp-chatbot-expanded .dashicons-fullscreen-alt:before {
1169 + content: "\f189";
1170 +}
1171 +
1172 +.wp-chatbot-send-message-active{
1173 + background: #00000066 !important;
1174 + color: #ffffff !important;
1175 +}
1176 +.wp-chatbot-footer button#wp-chatbot-send-message {
1177 + border: none;
1178 +}
1179 +.wp-chatbot-template-01 div#wp-chatbot-board-container {
1180 + width: 400px;
1181 +}
1182 +@media screen and (max-width: 480px) {
1183 + .wp-chatbot-template-01 div#wp-chatbot-board-container {
1184 + width: 100%;
1185 + }
1186 +}
1187 +
1188 +.wp-chatbot-rtl .wp-chatbot-template-01 .wp-chatbot-header-icon-right {
1189 + right: 95px;
1190 +}
1191 +
1192 +
1193 +
1194 +
1195 +
1196 +
1197 +.wp-chatbot-avatar-hidden .wp-chatbot-avatar {
1198 + display: none;
1199 +}
1200 +.wp-chatbot-avatar-hidden ul.wp-chatbot-messages-container > li.wp-chatbot-msg {
1201 + padding-left: 0;
1202 +}
1203 +
1204 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chatbot-msg {
1205 + padding-left: 0px;
1206 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1207 + background: rgb(255 255 255 / 30%);
1208 + backdrop-filter: blur(0px);
1209 + isolation: isolate;
1210 + border-radius: 10px;
1211 + padding: 8px 15px;
1212 + min-height: auto;
1213 +}
1214 +
1215 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container>li.wp-chatbot-msg .chat-container {
1216 + box-shadow: none;
1217 + background: rgba(255, 255, 255, 0);
1218 + backdrop-filter: none;
1219 + isolation: isolate;
1220 + border-radius: 0px;
1221 + padding: 0;
1222 +}
1223 +
1224 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li .wp-chatbot-avatar{
1225 + position: relative;
1226 +}
1227 +
1228 +.wp-chatbot-avatar-inside .wp-chatbot-avatar img, .wp-chatbot-avatar-inside .wp-chatbot-widget-avatar img {
1229 + width: 32px !important;
1230 + height: 32px !important;
1231 + object-fit: cover;
1232 +}
1233 +
1234 +
1235 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
1236 + padding-right: 0;
1237 +}
1238 +
1239 +
1240 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
1241 + padding-left: 0px;
1242 + box-shadow: inset 1px 1px 0 rgb(255 255 255 / 75%), inset 0 0 5px rgb(255 255 255 / 76%);
1243 + background: rgb(255 255 255 / 30%);
1244 + backdrop-filter: blur(0px);
1245 + isolation: isolate;
1246 + border-radius: 10px;
1247 + padding: 8px 15px;
1248 + min-height: auto;
1249 + display: flex;
1250 + flex-direction: column;
1251 + align-content: flex-end;
1252 + flex-wrap: wrap;
1253 +}
1254 +
1255 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
1256 + box-shadow: none;
1257 + background: rgba(255, 255, 255, 0);
1258 + backdrop-filter: none;
1259 + isolation: isolate;
1260 + border-radius: 0px;
1261 + padding: 0;
1262 +}
1263 +
1264 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
1265 + width: 32px;
1266 + height: 32px;
1267 + text-align: right;
1268 + margin: 0 0 6px auto;
1269 +}
1270 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li .wp-chatbot-avatar {
1271 + position: relative;
1272 + border-radius: 0;
1273 +}
1274 +.wp-chatbot-avatar-inside ul.wp-chatbot-messages-container > li .wp-chatbot-avatar img{
1275 + border-radius: 50%;
1276 +}
1277 +.wp-chatbot-avatar-hidden ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
1278 + padding-right: 0;
1279 1279 }