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 | includes/chat-sessions/css/history-style.css +2052 -742 8.5.7 → 8.8.0 View file →
@@ -1,743 +1,2053 @@
1 -.wp-chatbot-messages-wrapper{padding: 15px;padding-left: 43px;padding-right: 43px;}
2 -.wp-chatbot-messages-wrapper ul{overflow:inherit !Important}
3 -a.page-numbers {
4 - margin-right: 5px;
5 - padding-right: 5px;
6 - line-height: 18px;
7 -}
8 -.sld_menu_title_align {
9 - text-align: right;
10 -}
11 -
12 -#wpbot_checked_all{opacity:1 !important}
13 -.wpbot_sessions_checkbox{opacity:1 !important}
14 -
15 -/* The Modal (background) */
16 -.wpcsmodal {
17 - display: none; /* Hidden by default */
18 - position: fixed; /* Stay in place */
19 - z-index: 1; /* Sit on top */
20 - padding-top: 100px; /* Location of the box */
21 - left: 0;
22 - top: 0;
23 - width: 100%; /* Full width */
24 - height: 100%; /* Full height */
25 - overflow: auto; /* Enable scroll if needed */
26 - background-color: rgb(0,0,0); /* Fallback color */
27 - background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
28 -}
29 -
30 -/* Modal Content */
31 -.wpcsmodal-content {
32 - background-color: #fefefe;
33 - margin: auto;
34 - padding: 20px;
35 - border: 1px solid #888;
36 - width: 80%;
37 -}
38 -
39 -/* The Close Button */
40 -.wpcsclose {
41 - color: #aaaaaa;
42 - float: right;
43 - font-size: 28px;
44 - font-weight: bold;
45 -}
46 -
47 -.wpcsclose:hover,
48 -.wpcsclose:focus {
49 - color: #000;
50 - text-decoration: none;
51 - cursor: pointer;
52 -}
53 -
54 -
55 -.wpcs_text_field {
56 - width: 100%;
57 - padding: 12px 20px;
58 - margin: 8px 0;
59 - display: inline-block;
60 - border: 1px solid #ccc;
61 - border-radius: 4px;
62 - box-sizing: border-box;
63 -}
64 -
65 -.wpcs_submit_field {
66 - background-color: #4CAF50;
67 - color: white;
68 - padding: 10px 20px;
69 - margin: 8px 0;
70 - border: none;
71 - border-radius: 4px;
72 - cursor: pointer;
73 -}
74 -
75 -.wpcs_submit_field:hover {
76 - background-color: #45a049;
77 -}
78 -
79 -.wpcs_form_container {
80 - border-radius: 5px;
81 - background-color: #f2f2f2;
82 - padding: 20px;
83 -}
84 -.wpcs_form_container form{width:100%}
85 -.wpvo_filter_session{
86 - float: right;
87 -}
88 -.wpvo_filter_session .filter_session_start_date,.wpvo_filter_session .filter_session_end_date, .wpvo_filter_session .filter_session_button{
89 - float: left;
90 - margin-right: 5px;
91 -}
92 -.wpvo_filter_session .filter_session_button{
93 - background-color: #00cec9;
94 - border-radius: 5px;
95 - padding: 7px 15px;
96 - color: #fff;
97 -}
98 -
99 -.qcld-session-history_menu_box {
100 - background: #ffffff00;
101 -}
102 -.qcld-session-history_menu_title{
103 - display: flex;
104 - column-gap: 15px;
105 - row-gap: 10px;
106 - background: #fff;
107 - padding: 20px;
108 - margin: 0 0 0 0;
109 - border-radius: 16px;
110 - justify-content: space-between;
111 - width: 100%;
112 - flex-direction: column;
113 -}
114 -.qcld-session-history_menu_box form#wpcs_form_sessions {
115 - row-gap: 10px;
116 - background: #fff;
117 - padding: 20px;
118 - margin: 20px 0 0 0;
119 - border-radius: 16px;
120 - width: 100%;
121 -}
122 -.qcld-session-history_menu_box .btn.btn-primary {
123 - padding: 8px 24px;
124 - width: auto;
125 - font-size: 15px;
126 - font-weight: 500;
127 - border-radius: 8px;
128 - position: relative;
129 - background: #fff;
130 - color: var(--woobot-primary-color);
131 - text-decoration: none;
132 - line-height: normal;
133 - border: 2px solid var(--woobot-primary-color);
134 -}
135 -
136 -.qcld-session-history_menu_box .btn.btn-primary:hover {
137 - padding: 8px 24px;
138 - width: auto;
139 - font-size: 15px;
140 - font-weight: 500;
141 - border-radius: 8px;
142 - position: relative;
143 - background: var(--woobot-primary-color);
144 - color: #34079b;
145 - text-decoration: none;
146 - line-height: normal;
147 - border: 2px solid var(--woobot-primary-color);
148 -}
149 -
150 -.qcld-session-history_menu_box a.btn.btn-success {
151 - padding: 8px 24px;
152 - width: auto;
153 - font-size: 15px;
154 - font-weight: 500;
155 - border-radius: 8px;
156 - position: relative;
157 - background: #fff;
158 - color: var(--woobot-primary-color);
159 - text-decoration: none;
160 - line-height: normal;
161 - border: 2px solid var(--woobot-primary-color);
162 -}
163 -
164 -.qcld-session-history_menu_box a.btn.btn-success:hover {
165 - padding: 8px 24px;
166 - width: auto;
167 - font-size: 15px;
168 - font-weight: 500;
169 - border-radius: 8px;
170 - position: relative;
171 - background: var(--woobot-primary-color);
172 - color: #fff;
173 - text-decoration: none;
174 - line-height: normal;
175 - border: 2px solid var(--woobot-primary-color);
176 -}
177 -
178 -.qcld-session-history_menu_box .table>:not(caption)>*>* {
179 - color: var(--woobot-primary-color);
180 - background: var(--woobot-primary-color);
181 - border-radius: 4px;
182 - border: 3px solid #fff;
183 - background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
184 -}
185 -
186 -.qcld-session-history_menu_box table#chatsession-table a {
187 - color: var(--woobot-primary-color);
188 -}
189 -
190 -.qcld-session-history_menu_box table#chatsession-table a.btn.btn-info {
191 - background: #fff;
192 - border: none;
193 - color: #fff;
194 - font-size: 13px;
195 - font-weight: bold;
196 - background: #564a8e;
197 -}
198 -
199 -.qcld-session-history_menu_box table#chatsession-table a.btn.btn-danger{
200 - background: #dc3545;
201 - border: none;
202 - color: #fff;
203 - border: none;
204 - color: #fff;
205 - font-size: 13px;
206 - font-weight: bold;
207 -}
208 -
209 -table#chatsession-table {
210 - margin: 0;
211 - padding: 0;
212 -}
213 -
214 -.qcld_session_history_result {
215 -
216 - background: #fff;
217 - padding: 20px;
218 - margin: 20px 0 20px 0;
219 - border-radius: 16px;
220 - width: 100%;
221 -}
222 -.single-chat-container-wrapper {
223 - background-color: #fff;
224 - border-left: none;
225 - margin-top: 20px;
226 - padding: 25px;
227 - background: #fff;
228 - padding: 20px;
229 - margin: 20px 0 20px 0;
230 - border-radius: 16px;
231 - width: 100%;
232 -}
233 -
234 -.qcld_session_history_result .btn.btn-primary {
235 - padding: 10px 24px;
236 - width: auto;
237 - font-size: 15px;
238 - font-weight: 500;
239 - border-radius: 8px;
240 - position: relative;
241 - background: #fff;
242 - color: var(--woobot-primary-color);
243 - text-decoration: none;
244 - line-height: normal;
245 - border: 2px solid var(--woobot-primary-color);
246 -}
247 -
248 -.qcld_session_history_result a.btn.btn-secondary {
249 - padding: 10px 24px;
250 - width: auto;
251 - font-size: 15px;
252 - font-weight: 500;
253 - border-radius: 8px;
254 - position: relative;
255 - background: var(--woobot-primary-color);
256 - color: #fff;
257 - text-decoration: none;
258 - line-height: normal;
259 - border: 2px solid var(--woobot-primary-color);
260 -}
261 -input#is_enabled_session_email_notice {
262 - margin: 3px 8px 0 0 !important;
263 - padding: 12px 12px !important;
264 -}
265 -input#is_enabled_session_email_notice:checked::before {
266 - height: 20px !important;
267 - width: 20px !important;
268 - margin: -9px -6px 7px -9px !important;
269 -}
270 -
271 -.sld_menu_title.qcld_session_chat_menu_title {
272 - display: flex
273 -;
274 - column-gap: 15px;
275 - row-gap: 10px;
276 - background: #fff;
277 - padding: 20px;
278 - margin: 20px 0 20px 0;
279 - border-radius: 16px;
280 - justify-content: space-between;
281 - width: 99%;
282 -}
283 -
284 -.qcld-session-yes-record-found{
285 - display: flex
286 -;
287 - column-gap: 15px;
288 - row-gap: 10px;
289 - background: #fff;
290 - padding: 20px;
291 - margin: 20px 0 20px 0;
292 - border-radius: 16px;
293 - justify-content: space-between;
294 - width: 99%;
295 -}
296 -.qcld-session-no-record-found{
297 - display: flex
298 -;
299 - column-gap: 15px;
300 - row-gap: 10px;
301 - background: #fff;
302 - padding: 20px;
303 - margin: 20px 0 20px 0;
304 - border-radius: 16px;
305 - justify-content: space-between;
306 - width: 99%;
307 -}
308 -.sld_menu_title.qcld_session_chat_menu_title h2 {
309 - margin: 0 !important;
310 - padding: 0 0 0 0 !important;
311 - font-weight: bold;
312 - font-size: 24px;
313 - color: var(--woobot-primary-color) !important;
314 - line-height: normal;
315 -}
316 -.toplevel_page_wbcs-botsessions-page .wp-chatbot-agent {
317 - display: none;
318 -}
319 -.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
320 - display: flex;
321 - align-items: center;
322 - gap: 6px;
323 - width: 90%;
324 -}
325 -.toplevel_page_wbcs-botsessions-page li.wp-chat-user-msg {
326 - display: flex;
327 - justify-content: flex-end;
328 - text-align: right;
329 - align-items: center;
330 - gap: 20px;
331 - width: 90%;
332 - float: right;
333 - margin-right: 40px;
334 -}
335 -.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
336 - display: flex;
337 - align-items: center;
338 - gap: 6px;
339 - width: 90%;
340 -}
341 -.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph p {
342 - margin: 0;
343 - padding: 0;
344 -}
345 -.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph {
346 - background: #eee;
347 - padding: 6px 12px;
348 - border-radius: 8px;
349 -}
350 -
351 -.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
352 - text-align: right;
353 - float: right;
354 -}
355 -.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
356 - right: 12px;
357 - position: absolute;
358 -}
359 -.toplevel_page_wbcs-botsessions-page #wp-chatbot-messages-container .wp-chatbot-avatar img, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar img {
360 - width: 40px !important;
361 - height: 40px !important;
362 -border-radius:50%;
363 -}
364 -.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
365 - display: flex;
366 - align-items: center;
367 - gap: 6px;
368 -}
369 -div#session_details_modal {
370 - width: 700px;
371 - height: auto;
372 - height: 500px;
373 - position: fixed;
374 - top: 250px;
375 - background-color: unset !important;
376 - box-shadow: -2px 3px 7px #66339994
377 -
378 -}
379 -div#session_details_modal .modal-content {
380 - background-color: #fefefe;
381 - margin: auto;
382 - border: 1px solid #888;
383 - width: 100%;
384 -}
385 -div#session_details_modal .details_session_close{
386 - position: absolute;
387 - top: 0px;
388 - right: 5px;
389 - color: black;
390 - font-size: 25px;
391 - cursor: pointer;
392 -}
393 -.loader-mask {
394 - height: 200px;
395 -}
396 -.loader {
397 - position: absolute;
398 - left: 50%;
399 - top: 50%;
400 - width: 50px;
401 - height: 50px;
402 - font-size: 0;
403 - color: #00c9d0;
404 - display: inline-block !important;
405 - margin: -25px 0 0 -25px;
406 - text-indent: -9999em;
407 - -webkit-transform: translateZ(0);
408 - -ms-transform: translateZ(0);
409 - transform: translateZ(0);
410 -}
411 -.lead{
412 - font-size:13px;
413 -}
414 -.loader div {
415 - background-color: #d9b06a;
416 - display: inline-block;
417 - float: none;
418 - position: absolute;
419 - top: 0;
420 - left: 0;
421 - width: 50px;
422 - height: 50px;
423 - opacity: .5;
424 - border-radius: 50%;
425 - -webkit-animation: ballPulseDouble 2s ease-in-out infinite;
426 - animation: ballPulseDouble 2s ease-in-out infinite;
427 -}
428 -.loader div:last-child {
429 - -webkit-animation-delay: -1s;
430 - animation-delay: -1s;
431 -}
432 -@-webkit-keyframes ballPulseDouble {
433 - 0%,
434 - 100% {
435 - -webkit-transform: scale(0);
436 - transform: scale(0);
437 - }
438 - 50% {
439 - -webkit-transform: scale(1);
440 - transform: scale(1);
441 - }
442 -}
443 -@keyframes ballPulseDouble {
444 - 0%,
445 - 100% {
446 - -webkit-transform: scale(0);
447 - transform: scale(0);
448 - }
449 - 50% {
450 - -webkit-transform: scale(1);
451 - transform: scale(1);
452 - }
453 -}
454 -
455 -.toplevel_page_wbcs-botsessions-page .wp-chatbot-agent {
456 - display: none;
457 -}
458 -.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
459 - display: flex;
460 - align-items: center;
461 - gap: 6px;
462 - width: 90%;
463 -}
464 -.toplevel_page_wbcs-botsessions-page li.wp-chat-user-msg {
465 - display: flex;
466 - justify-content: flex-end;
467 - text-align: right;
468 - align-items: center;
469 - gap: 20px;
470 - width: 90%;
471 - float: right;
472 - margin-right: 40px;
473 -}
474 -.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
475 - display: flex;
476 - align-items: center;
477 - gap: 6px;
478 - width: 90%;
479 -}
480 -.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph p {
481 - margin: 0;
482 - padding: 0;
483 -}
484 -.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph {
485 - background: #eee;
486 - padding: 6px 12px;
487 - border-radius: 8px;
488 -}
489 -
490 -.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
491 - text-align: right;
492 - float: right;
493 -}
494 -.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
495 - right: 12px;
496 - position: absolute;
497 -}
498 -.toplevel_page_wbcs-botsessions-page #wp-chatbot-messages-container .wp-chatbot-avatar img, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar img {
499 - width: 40px !important;
500 - height: 40px !important;
501 -border-radius:50%;
502 -}
503 -.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
504 - display: flex;
505 - align-items: center;
506 - gap: 6px;
507 -}
508 -
509 -#session_details_modal ul{
510 -margin: 0;
511 -padding: 0;
512 -}
513 -div#session_details_modal {
514 - background: #fff !important;
515 - border-radius: 6px;
516 -}
517 -div#session_details_modal .modal-content {
518 - height: 700px;
519 -}
520 -table#chatsession-table td.text-left:nth-child(2) {
521 - max-width: 220px;
522 -}
523 -
524 -
525 -div#wpchatbot-sessioncorn-settings {
526 - display: flex;
527 - column-gap: 15px;
528 - row-gap: 10px;
529 - background: #fff;
530 - padding: 20px;
531 - margin: 0 0 0 0;
532 - border-radius: 16px;
533 - justify-content: space-between;
534 - width: 96%;
535 - flex-direction: column;
536 -}
537 -div#wpchatbot-sessioncorn-settings button#save_wpsseion_corn_setting {
538 - display: block;
539 - max-width: 220px;
540 - border: none;
541 -}
542 -div#wpchatbot-sessioncorn-mannual {
543 - width: 100%;
544 -}
545 -div#wpchatbot-sessioncorn-mannual {
546 - width: 98%;
547 - margin: 20px 0 0 0;
548 -}
549 -div#wpchatbot-sessioncorn-mannual #swpsseion_mannual_scraper_corn {
550 - width: 98%;
551 - border: none;
552 -}
553 -div#wpchatbot-sessioncorn-settings textarea {
554 - width: 100%;
555 - height: 120px !important;
556 -}
557 -div#wpchatbot-sessioncorn-mannual {
558 - width: 98%;
559 - margin: 20px 0 0 0;
560 - border-radius: 16px;
561 -}
562 -
563 -div#wpchatbot-sessioncorn-mannual #swpsseion_mannual_scraper_corn {
564 - width: auto;
565 - border: none;
566 - margin: 0 !important;
567 -}
568 -div#wpchatbot-sessioncorn-mannual input#wpchatbot-sessioncorn-mannual-number {
569 - padding: 0 10px;
570 - margin: 0 12px;
571 -}
572 -
573 -div#wpchatbot-sessioncorn-mannual {
574 - width: 96%;
575 - padding: 20px;
576 -}
577 -.qcld-bit-session-form-group-outer {
578 - display: flex;
579 - justify-content: space-between;
580 - width: 100%;
581 - gap: 20px;
582 -}
583 -.qcld-bit-session-form-group-outer .form-group {
584 - width: 100%;
585 -}
586 -
587 -.qcld-bit-session-form-group-outer .form-group input{
588 - width: 100%;
589 -}
590 -
591 -
592 -.qcld-bit-session-form-group-outer .form-group select{
593 - width: 100% !important;
594 - max-width: inherit !important;
595 -}
596 -
597 -/**Admin notice style**/
598 -.qcld-wpbot-updated {
599 - display: flex;
600 - column-gap: 15px;
601 - row-gap: 10px;
602 - background: #fff;
603 - padding: 22px 20px;
604 - margin: 20px 0 20px 0;
605 - border-radius: 16px;
606 - flex-direction: column;
607 - width: 96%;
608 -}
609 -.qcld-wpbot-updated p {
610 - margin: 0;
611 - padding: 0;
612 - font-size: 16px;
613 - font-family: "DM Sans", sans-serif !important;
614 -}
615 -
616 -.qcld-wpbot-updated a.button-primary.button-large {
617 - background: var(--woobot-primary-color);
618 - color: #ffffff;
619 - border: none;
620 - padding: 5px 25px;
621 - line-height: 28px;
622 - font-weight: bold;
623 - border: 2px solid var(--woobot-primary-color);
624 - border-radius: 8px;
625 -}
626 -.qcld-wpbot-updated a.button-primary.button-large:hover {
627 - background: #fff;
628 - color: var(--woobot-primary-color);;
629 - border: none;
630 - padding: 5px 25px;
631 - line-height: 28px;
632 - font-weight: bold;
633 - border: 2px solid var(--woobot-primary-color);
634 - border-radius: 8px;
635 -}
636 -#swpsseion_mannual_scraper_corn, #save_wpsseion_corn_setting {
637 - padding: 14px 30px;
638 - width: auto;
639 - font-size: 16px;
640 - font-weight: 500;
641 - color: #988FBD;
642 - border-radius: 8px;
643 - position: relative;
644 - display: inline-block;
645 - align-items: center;
646 - gap: 15px;
647 - background: var(--woobot-primary-color);
648 - color: #ffffff;
649 - text-decoration: none;
650 - border-color: var(--woobot-primary-color) !important;
651 - line-height: normal;
652 - margin: 20px 0 20px 0 !important;
653 - cursor: pointer;
654 -}
655 -.qcld-wpbot-updated a.button-secondary.button-large {
656 - border: 2px solid var(--woobot-primary-color);
657 - background: #fff;
658 - color: var(--woobot-primary-color);
659 - padding: 8px 20px;
660 - border-radius: 8px;
661 - display: inline-block;
662 - margin: 0;
663 - line-height: 28px;
664 - padding: 5px 25px;
665 - line-height: 28px;
666 - font-weight: bold;
667 -}
668 -.qcld-wpbot-updated a.button-secondary.button-large:hover {
669 - border: 2px solid var(--woobot-primary-color);
670 - background: var(--woobot-primary-color);
671 - color: #fff;
672 - padding: 8px 20px;
673 - border-radius: 8px;
674 - display: inline-block;
675 - margin: 0;
676 - line-height: 28px;
677 - padding: 5px 25px;
678 - line-height: 28px;
679 - font-weight: bold;
680 -}
681 -div#wpchatbot-sessioncorn-mannual input#wpchatbot-sessioncorn-mannual-number {
682 - padding: 2px 5px;
683 - margin: 0 12px;
684 - max-width: 60px;
685 - background: transparent;
686 - /* color: #ffff;
687 - border-color: #fff; */
688 -}
689 -
690 -
691 -.qcld-session-history_menu_box .btn.btn-primary {
692 - background: #564a8e !important;
693 - color: #fff !important;
694 -}
695 -.qcld-session-history_menu_box a.btn.btn-success {
696 - padding: 8px 24px;
697 - width: auto;
698 - font-size: 15px;
699 - font-weight: 500;
700 - border-radius: 8px;
701 - position: relative;
702 - background: #ffffff;
703 - color: #564a8e;
704 - text-decoration: none;
705 - line-height: normal;
706 - border: 2px solid #564a8e;
707 -}
708 -.qcld-session-history_menu_box a.btn.btn-success:hover {
709 - padding: 8px 24px;
710 - width: auto;
711 - font-size: 15px;
712 - font-weight: 500;
713 - border-radius: 8px;
714 - position: relative;
715 - background: #564a8e;
716 - color: #fff;
717 - text-decoration: none;
718 - line-height: normal;
719 - border: 2px solid #564a8e;
720 -}
721 -div.dt-container select.dt-input {
722 - padding: 4px;
723 - min-width: 60px;
724 -}
725 -
726 -@media screen and (min-width: 1921px) {
727 - div#session_details_modal {
728 - left: 20% !important;
729 - right: 0;
730 - }
731 - }
732 -@media screen and (max-width: 1920px) {
733 - div#session_details_modal {
734 - left: 32% !important;
735 - right: 0;
736 - }
737 -}
738 -@media screen and (max-width: 1200px) {
739 - div#session_details_modal {
740 - left: 32% !important;
741 - right: 0;
742 - }
1 +/* WPBot design tokens — change colors here to theme the whole admin UI */
2 +:root {
3 + --woobot-primary: #5B4E96;
4 + --woobot-primary-color: #5B4E96;
5 + --woobot-primary-dark: #463a7a;
6 + --woobot-primary-soft: #f3f1fa;
7 + --woobot-primary-border: #e4e0f2;
8 + --woobot-surface: #ffffff;
9 + --woobot-page-bg: #F5F7FD;
10 + --woobot-text: #2d2a3a;
11 + --woobot-muted: #6b6680;
12 + --woobot-danger: #e25563;
13 + --woobot-nav-muted: #988FBD;
14 + --woobot-primary-rgb: 91, 78, 150;
15 +}
16 +.wp-chatbot-messages-wrapper{padding: 15px;padding-left: 43px;padding-right: 43px;}
17 +.wp-chatbot-messages-wrapper ul{overflow:inherit !Important}
18 +.sld_menu_title_align {
19 + text-align: right;
20 +}
21 +
22 +#wpbot_checked_all{opacity:1 !important}
23 +.wpbot_sessions_checkbox{opacity:1 !important}
24 +
25 +/* The Modal (background) */
26 +.wpcsmodal {
27 + display: none; /* Hidden by default */
28 + position: fixed; /* Stay in place */
29 + z-index: 1; /* Sit on top */
30 + padding-top: 100px; /* Location of the box */
31 + left: 0;
32 + top: 0;
33 + width: 100%; /* Full width */
34 + height: 100%; /* Full height */
35 + overflow: auto; /* Enable scroll if needed */
36 + background-color: rgb(0,0,0); /* Fallback color */
37 + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
38 +}
39 +
40 +/* Modal Content */
41 +.wpcsmodal-content {
42 + background-color: #fefefe;
43 + margin: auto;
44 + padding: 20px;
45 + border: 1px solid #888;
46 + width: 80%;
47 +}
48 +
49 +/* The Close Button */
50 +.wpcsclose {
51 + color: #aaaaaa;
52 + float: right;
53 + font-size: 28px;
54 + font-weight: bold;
55 +}
56 +
57 +.wpcsclose:hover,
58 +.wpcsclose:focus {
59 + color: #000;
60 + text-decoration: none;
61 + cursor: pointer;
62 +}
63 +
64 +
65 +.wpcs_text_field {
66 + width: 100%;
67 + padding: 12px 20px;
68 + margin: 8px 0;
69 + display: inline-block;
70 + border: 1px solid #ccc;
71 + border-radius: 4px;
72 + box-sizing: border-box;
73 +}
74 +
75 +.wpcs_submit_field {
76 + background-color: #4CAF50;
77 + color: white;
78 + padding: 10px 20px;
79 + margin: 8px 0;
80 + border: none;
81 + border-radius: 4px;
82 + cursor: pointer;
83 +}
84 +
85 +.wpcs_submit_field:hover {
86 + background-color: #45a049;
87 +}
88 +
89 +.wpcs_form_container {
90 + border-radius: 5px;
91 + background-color: #f2f2f2;
92 + padding: 20px;
93 +}
94 +.wpcs_form_container form{width:100%}
95 +.wpvo_filter_session{
96 + float: right;
97 +}
98 +.wpvo_filter_session .filter_session_start_date,.wpvo_filter_session .filter_session_end_date, .wpvo_filter_session .filter_session_button{
99 + float: left;
100 + margin-right: 5px;
101 +}
102 +.wpvo_filter_session .filter_session_button{
103 + background-color: #00cec9;
104 + border-radius: 5px;
105 + padding: 7px 15px;
106 + color: #fff;
107 +}
108 +
109 +.qcld-session-history_menu_box {
110 + background: #ffffff00;
111 + width: 100%;
112 +}
113 +.sld_menu_title.sld_menu_title_align {
114 + width: 98%;
115 +}
116 +.qcld-session-history_menu_title{
117 + display: flex;
118 + column-gap: 15px;
119 + row-gap: 10px;
120 + background: #fff;
121 + padding: 20px;
122 + margin: 20px 0 0 0;
123 + border-radius: 16px;
124 + justify-content: space-between;
125 + width: 100%;
126 + box-sizing: border-box;
127 + flex-direction: column;
128 +}
129 +.qcld-session-history_menu_title h2 {
130 + margin: 0 !important;
131 + padding: 0 !important;
132 + font-weight: 700;
133 + font-size: 24px;
134 + color: var(--woobot-primary) !important;
135 + line-height: normal;
136 +}
137 +.qcld-session-history_menu_box form#wpcs_form_sessions {
138 + row-gap: 10px;
139 + background: #fff;
140 + padding: 20px;
141 + margin: 20px 0 0 0;
142 + border-radius: 16px;
143 + width: 100%;
144 + box-sizing: border-box;
145 +}
146 +.qcld-session-history_menu_box .btn.btn-primary {
147 + padding: 8px 24px;
148 + width: auto;
149 + font-size: 15px;
150 + font-weight: 500;
151 + border-radius: 8px;
152 + position: relative;
153 + background: #fff;
154 + color: var(--woobot-primary-color);
155 + text-decoration: none;
156 + line-height: normal;
157 + border: 2px solid var(--woobot-primary-color);
158 +}
159 +
160 +.qcld-session-history_menu_box .btn.btn-primary:hover {
161 + padding: 8px 24px;
162 + width: auto;
163 + font-size: 15px;
164 + font-weight: 500;
165 + border-radius: 8px;
166 + position: relative;
167 + background: var(--woobot-primary-color);
168 + color: #34079b;
169 + text-decoration: none;
170 + line-height: normal;
171 + border: 2px solid var(--woobot-primary-color);
172 +}
173 +
174 +.qcld-session-history_menu_box a.btn.btn-success {
175 + padding: 8px 24px;
176 + width: auto;
177 + font-size: 15px;
178 + font-weight: 500;
179 + border-radius: 8px;
180 + position: relative;
181 + background: #fff;
182 + color: var(--woobot-primary-color);
183 + text-decoration: none;
184 + line-height: normal;
185 + border: 2px solid var(--woobot-primary-color);
186 +}
187 +
188 +.qcld-session-history_menu_box a.btn.btn-success:hover {
189 + padding: 8px 24px;
190 + width: auto;
191 + font-size: 15px;
192 + font-weight: 500;
193 + border-radius: 8px;
194 + position: relative;
195 + background: var(--woobot-primary-color);
196 + color: #fff;
197 + text-decoration: none;
198 + line-height: normal;
199 + border: 2px solid var(--woobot-primary-color);
200 +}
201 +
202 +.qcld-session-history_menu_box table#chatsession-table a:not(.btn) {
203 + color: var(--woobot-primary);
204 + font-weight: 500;
205 + text-decoration: none;
206 +}
207 +
208 +.qcld-session-history_menu_box table#chatsession-table a:not(.btn):hover {
209 + color: var(--woobot-primary-dark);
210 + text-decoration: underline;
211 +}
212 +
213 +table#chatsession-table {
214 + margin: 0;
215 + padding: 0;
216 +}
217 +
218 +.qcld_session_history_result {
219 +
220 + background: #fff;
221 + padding: 20px;
222 + margin: 20px 0 20px 0;
223 + border-radius: 16px;
224 + width: 100%;
225 +}
226 +.single-chat-container-wrapper {
227 + background-color: #fff;
228 + border-left: none;
229 + margin-top: 20px;
230 + padding: 25px;
231 + background: #fff;
232 + padding: 20px;
233 + margin: 20px 0 20px 0;
234 + border-radius: 16px;
235 + width: 100%;
236 +}
237 +
238 +.qcld_session_history_result .btn.btn-primary {
239 + padding: 10px 24px;
240 + width: auto;
241 + font-size: 15px;
242 + font-weight: 500;
243 + border-radius: 8px;
244 + position: relative;
245 + background: #fff;
246 + color: var(--woobot-primary-color);
247 + text-decoration: none;
248 + line-height: normal;
249 + border: 2px solid var(--woobot-primary-color);
250 +}
251 +
252 +.qcld_session_history_result a.btn.btn-secondary {
253 + padding: 10px 24px;
254 + width: auto;
255 + font-size: 15px;
256 + font-weight: 500;
257 + border-radius: 8px;
258 + position: relative;
259 + background: var(--woobot-primary-color);
260 + color: #fff;
261 + text-decoration: none;
262 + line-height: normal;
263 + border: 2px solid var(--woobot-primary-color);
264 +}
265 +
266 +.sld_menu_title.qcld_session_chat_menu_title {
267 + display: flex
268 +;
269 + column-gap: 15px;
270 + row-gap: 10px;
271 + background: #fff;
272 + padding: 20px;
273 + margin: 20px 0 20px 0;
274 + border-radius: 16px;
275 + justify-content: space-between;
276 + width: 99%;
277 +}
278 +
279 +.qcld-session-yes-record-found{
280 + display: flex
281 +;
282 + column-gap: 15px;
283 + row-gap: 10px;
284 + background: #fff;
285 + padding: 20px;
286 + margin: 20px 0 20px 0;
287 + border-radius: 16px;
288 + justify-content: space-between;
289 + width: 99%;
290 +}
291 +.qcld-session-no-record-found{
292 + display: flex
293 +;
294 + column-gap: 15px;
295 + row-gap: 10px;
296 + background: #fff;
297 + padding: 20px;
298 + margin: 20px 0 20px 0;
299 + border-radius: 16px;
300 + justify-content: space-between;
301 + width: 99%;
302 +}
303 +.sld_menu_title.qcld_session_chat_menu_title h2 {
304 + margin: 0 !important;
305 + padding: 0 0 0 0 !important;
306 + font-weight: bold;
307 + font-size: 24px;
308 + color: var(--woobot-primary-color) !important;
309 + line-height: normal;
310 +}
311 +.toplevel_page_wbcs-botsessions-page .wp-chatbot-agent {
312 + display: none;
313 +}
314 +.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
315 + display: flex;
316 + align-items: center;
317 + gap: 6px;
318 + width: 90%;
319 +}
320 +.toplevel_page_wbcs-botsessions-page li.wp-chat-user-msg {
321 + flex-direction: row-reverse;
322 + justify-content: flex-start;
323 + display: flex;
324 + text-align: right;
325 + align-items: center;
326 + gap: 20px;
327 + width: 90%;
328 + float: right;
329 + margin-right: 40px;
330 +}
331 +.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
332 + display: flex;
333 + align-items: center;
334 + gap: 6px;
335 + width: 90%;
336 +}
337 +.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph p {
338 + margin: 0;
339 + padding: 0;
340 +}
341 +.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph {
342 + background: #eee;
343 + padding: 6px 12px;
344 + border-radius: 8px;
345 +}
346 +
347 +.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
348 + text-align: right;
349 + float: right;
350 +}
351 +.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
352 + right: 12px;
353 + position: relative;
354 +}
355 +.toplevel_page_wbcs-botsessions-page #wp-chatbot-messages-container .wp-chatbot-avatar img, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar img {
356 + width: 40px !important;
357 + height: 40px !important;
358 + border-radius:50%;
359 +}
360 +.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
361 + display: flex;
362 + align-items: center;
363 + gap: 6px;
364 +}
365 +div#session_details_modal {
366 + display: none;
367 + position: fixed;
368 + inset: 0;
369 + width: 100%;
370 + height: 100%;
371 + top: 0;
372 + left: 0 !important;
373 + right: 0;
374 + background: rgba(45, 42, 58, 0.45) !important;
375 + border-radius: 0;
376 + box-shadow: none;
377 + overflow: auto;
378 + z-index: 100000;
379 +}
380 +
381 +div#session_details_modal .modal-content {
382 + position: absolute;
383 + top: 50%;
384 + left: 50%;
385 + transform: translate(-50%, -50%);
386 + margin: 0;
387 + padding: 0;
388 + border: 1px solid var(--woobot-primary-border);
389 + width: calc(100% - 40px);
390 + max-width: 720px;
391 + height: auto;
392 + max-height: min(860px, calc(100vh - 48px));
393 + background: #fff;
394 + border-radius: 16px;
395 + box-shadow: 0 16px 48px rgba(var(--woobot-primary-rgb), 0.22);
396 + overflow: hidden;
397 + display: flex;
398 + flex-direction: column;
399 +}
400 +
401 +div#session_details_modal .details_session_close {
402 + position: absolute;
403 + top: 12px;
404 + right: 12px;
405 + z-index: 10001;
406 + color: #fff;
407 + background: var(--woobot-primary);
408 + font-size: 20px;
409 + font-weight: 600;
410 + cursor: pointer;
411 + height: 32px;
412 + width: 32px;
413 + border-radius: 50%;
414 + text-align: center;
415 + line-height: 30px;
416 + box-shadow: 0 2px 8px rgba(var(--woobot-primary-rgb), 0.25);
417 + transition: background 0.15s ease;
418 +}
419 +
420 +div#session_details_modal .details_session_close:hover {
421 + background: var(--woobot-primary-dark);
422 +}
423 +
424 +div#session_details_modal .details_modal_body {
425 + display: flex;
426 + flex-direction: column;
427 + height: 100%;
428 + max-height: min(860px, calc(100vh - 48px));
429 + overflow: hidden;
430 + background: #fff;
431 +}
432 +
433 +div#session_details_modal .session-details-sction-modal {
434 + flex: 1 1 auto;
435 + max-height: none;
436 + overflow-x: hidden;
437 + overflow-y: auto;
438 + padding: 16px 20px 12px;
439 + background: #faf9fd;
440 +}
441 +
442 +div#session_details_modal .session-details-sction-modal::-webkit-scrollbar {
443 + width: 8px;
444 +}
445 +
446 +div#session_details_modal .session-details-sction-modal::-webkit-scrollbar-thumb {
447 + background: #c9c4db;
448 + border-radius: 8px;
449 +}
450 +
451 +/* Source URL bar inside modal */
452 +div#session_details_modal li.session_start_url {
453 + background: var(--woobot-primary) !important;
454 + padding: 12px 16px;
455 + margin: 0 0 16px;
456 + color: #fff;
457 + border-radius: 10px;
458 + list-style: none;
459 + font-size: 13px;
460 +}
461 +
462 +div#session_details_modal li.session_start_url span {
463 + font-weight: 600;
464 +}
465 +
466 +div#session_details_modal li.session_start_url a {
467 + color: #fff;
468 + text-decoration: underline;
469 + word-break: break-all;
470 +}
471 +
472 +/* Chat bubbles in modal */
473 +div#session_details_modal .wp-chatbot-paragraph {
474 + background: #fff !important;
475 + border: 1px solid var(--woobot-primary-border);
476 + padding: 10px 14px !important;
477 + border-radius: 12px !important;
478 + box-shadow: 0 1px 3px rgba(var(--woobot-primary-rgb), 0.06);
479 +}
480 +
481 +div#session_details_modal li.wp-chat-user-msg .wp-chatbot-paragraph {
482 + background: var(--woobot-primary-soft) !important;
483 + border-color: #ddd6f3;
484 +}
485 +
486 +div#session_details_modal .wp-chatbot-avatar img {
487 + width: 36px !important;
488 + height: 36px !important;
489 + border-radius: 50%;
490 + border: 2px solid var(--woobot-primary-border);
491 +}
492 +
493 +/* Email reply panel */
494 +div#session_details_modal .email-reply-container {
495 + flex: 0 0 auto;
496 + margin: 0 !important;
497 + padding: 18px 20px 20px !important;
498 + border-top: 1px solid var(--woobot-primary-border) !important;
499 + background: #fff !important;
500 + border-radius: 0 !important;
501 +}
502 +
503 +div#session_details_modal .email-reply-container .email-reply-meta {
504 + display: flex;
505 + flex-wrap: wrap;
506 + align-items: center;
507 + gap: 8px 14px;
508 + margin: 0 0 12px;
509 + font-size: 13px;
510 + color: var(--woobot-text);
511 +}
512 +
513 +div#session_details_modal .email-reply-container .email-reply-meta strong {
514 + color: var(--woobot-primary);
515 + font-weight: 600;
516 +}
517 +
518 +div#session_details_modal .email-reply-container .email-reply-meta a {
519 + color: var(--woobot-primary);
520 + font-weight: 500;
521 +}
522 +
523 +div#session_details_modal .email-reply-container #reply_from_email,
524 +div#session_details_modal .email-reply-container #reply_subject,
525 +div#session_details_modal .email-reply-container #reply_message {
526 + width: 100%;
527 + box-sizing: border-box;
528 + border: 1px solid var(--woobot-primary-border);
529 + border-radius: 8px;
530 + padding: 10px 12px;
531 + font-size: 13px;
532 + color: var(--woobot-text);
533 + background: #fff;
534 + box-shadow: none;
535 + outline: none;
536 + transition: border-color 0.15s ease, box-shadow 0.15s ease;
537 +}
538 +
539 +div#session_details_modal .email-reply-container #reply_from_email {
540 + width: auto;
541 + min-width: 200px;
542 + max-width: 100%;
543 + padding: 8px 12px;
544 +}
545 +
546 +div#session_details_modal .email-reply-container #reply_from_email:focus,
547 +div#session_details_modal .email-reply-container #reply_subject:focus,
548 +div#session_details_modal .email-reply-container #reply_message:focus {
549 + border-color: var(--woobot-primary);
550 + box-shadow: 0 0 0 3px rgba(var(--woobot-primary-rgb), 0.15);
551 +}
552 +
553 +div#session_details_modal .email-reply-container .form-group {
554 + margin-bottom: 10px !important;
555 +}
556 +
557 +div#session_details_modal .email-reply-container #btn_send_reply_email {
558 + background: var(--woobot-primary) !important;
559 + color: #fff !important;
560 + border: none !important;
561 + padding: 10px 20px !important;
562 + border-radius: 8px !important;
563 + font-size: 14px;
564 + font-weight: 600;
565 + cursor: pointer;
566 + transition: background 0.15s ease;
567 +}
568 +
569 +div#session_details_modal .email-reply-container #btn_send_reply_email:hover:not(:disabled) {
570 + background: var(--woobot-primary-dark) !important;
571 +}
572 +
573 +div#session_details_modal .email-reply-container #btn_send_reply_email:disabled {
574 + opacity: 0.55;
575 + cursor: not-allowed;
576 +}
577 +
578 +div#session_details_modal .email-reply-warning {
579 + margin: 0 0 12px;
580 + color: #c93f4d;
581 + font-weight: 600;
582 + font-size: 13px;
583 +}
584 +
585 +.loader-mask {
586 + height: 200px;
587 +}
588 +.loader {
589 + position: absolute;
590 + left: 50%;
591 + top: 50%;
592 + width: 50px;
593 + height: 50px;
594 + font-size: 0;
595 + color: var(--woobot-primary);
596 + display: inline-block !important;
597 + margin: -25px 0 0 -25px;
598 + text-indent: -9999em;
599 + -webkit-transform: translateZ(0);
600 + -ms-transform: translateZ(0);
601 + transform: translateZ(0);
602 +}
603 +.lead{
604 + font-size:13px;
605 +}
606 +.loader div {
607 + background-color: var(--woobot-primary);
608 + display: inline-block;
609 + float: none;
610 + position: absolute;
611 + top: 0;
612 + left: 0;
613 + width: 50px;
614 + height: 50px;
615 + opacity: .5;
616 + border-radius: 50%;
617 + -webkit-animation: ballPulseDouble 2s ease-in-out infinite;
618 + animation: ballPulseDouble 2s ease-in-out infinite;
619 +}
620 +.loader div:last-child {
621 + -webkit-animation-delay: -1s;
622 + animation-delay: -1s;
623 +}
624 +@-webkit-keyframes ballPulseDouble {
625 + 0%,
626 + 100% {
627 + -webkit-transform: scale(0);
628 + transform: scale(0);
629 + }
630 + 50% {
631 + -webkit-transform: scale(1);
632 + transform: scale(1);
633 + }
634 +}
635 +@keyframes ballPulseDouble {
636 + 0%,
637 + 100% {
638 + -webkit-transform: scale(0);
639 + transform: scale(0);
640 + }
641 + 50% {
642 + -webkit-transform: scale(1);
643 + transform: scale(1);
644 + }
645 +}
646 +
647 +.toplevel_page_wbcs-botsessions-page .wp-chatbot-agent {
648 + display: none;
649 +}
650 +.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
651 + display: flex;
652 + align-items: center;
653 + gap: 6px;
654 + width: 90%;
655 +}
656 +.qcld-like-dislike-icon {
657 + display: flex;
658 + gap: 6px;
659 + padding-top: 5px;
660 +}
661 +.toplevel_page_wbcs-botsessions-page li.wp-chat-user-msg {
662 + display: flex;
663 + justify-content: flex-start;
664 + text-align: right;
665 + align-items: center;
666 + gap: 20px;
667 + width: 90%;
668 + float: right;
669 + margin-right: 0px;
670 +}
671 +
672 +.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
673 + display: flex;
674 + align-items: center;
675 + gap: 6px;
676 + width: 90%;
677 +}
678 +.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph p {
679 + margin: 0;
680 + padding: 0;
681 +}
682 +.toplevel_page_wbcs-botsessions-page .wp-chatbot-paragraph {
683 + background: #eee;
684 + padding: 6px 12px;
685 + border-radius: 8px;
686 +}
687 +
688 +.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-paragraph {
689 + text-align: right;
690 + float: right;
691 +}
692 +.toplevel_page_wbcs-botsessions-page ul.wp-chatbot-messages-container > li.wp-chat-user-msg .wp-chatbot-avatar {
693 + right: 12px;
694 + position: relative;
695 +}
696 +.toplevel_page_wbcs-botsessions-page #wp-chatbot-messages-container .wp-chatbot-avatar img, .wp-chatbot-agent-profile .wp-chatbot-widget-avatar img {
697 + width: 40px !important;
698 + height: 40px !important;
699 +border-radius:50%;
700 +}
701 +.toplevel_page_wbcs-botsessions-page li.wp-chatbot-msg {
702 + display: flex;
703 + align-items: center;
704 + gap: 6px;
705 +}
706 +
707 +#session_details_modal ul{
708 + margin: 0;
709 + padding: 0;
710 +}
711 +table#chatsession-table td.text-left:nth-child(2) {
712 + max-width: 220px;
713 +}
714 +
715 +
716 +div#wpchatbot-sessioncorn-settings {
717 + display: flex;
718 + column-gap: 15px;
719 + row-gap: 10px;
720 + background: #fff;
721 + padding: 20px;
722 + margin: 0 0 0 0;
723 + border-radius: 16px;
724 + justify-content: space-between;
725 + width: 96%;
726 + flex-direction: column;
727 +}
728 +div#wpchatbot-sessioncorn-settings button#save_wpsseion_corn_setting {
729 + display: block;
730 + max-width: 220px;
731 + border: none;
732 +}
733 +div#wpchatbot-sessioncorn-mannual {
734 + width: 100%;
735 +}
736 +div#wpchatbot-sessioncorn-mannual {
737 + width: 98%;
738 + margin: 20px 0 0 0;
739 +}
740 +div#wpchatbot-sessioncorn-mannual #swpsseion_mannual_scraper_corn {
741 + width: 98%;
742 + border: none;
743 +}
744 +div#wpchatbot-sessioncorn-settings textarea {
745 + width: 100%;
746 + height: 120px !important;
747 +}
748 +div#wpchatbot-sessioncorn-mannual {
749 + width: 98%;
750 + margin: 20px 0 0 0;
751 + border-radius: 16px;
752 +}
753 +
754 +div#wpchatbot-sessioncorn-mannual #swpsseion_mannual_scraper_corn {
755 + width: auto;
756 + border: none;
757 + margin: 0 !important;
758 +}
759 +div#wpchatbot-sessioncorn-mannual input#wpchatbot-sessioncorn-mannual-number {
760 + padding: 0 10px;
761 + margin: 0 12px;
762 +}
763 +
764 +div#wpchatbot-sessioncorn-mannual {
765 + width: 96%;
766 + padding: 20px;
767 +}
768 +.qcld-bit-session-form-group-outer {
769 + display: flex;
770 + justify-content: space-between;
771 + width: 100%;
772 + gap: 20px;
773 +}
774 +.qcld-bit-session-form-group-outer .form-group {
775 + width: 100%;
776 +}
777 +
778 +.qcld-bit-session-form-group-outer .form-group input{
779 + width: 100%;
780 +}
781 +
782 +
783 +.qcld-bit-session-form-group-outer .form-group select{
784 + width: 100% !important;
785 + max-width: inherit !important;
786 +}
787 +
788 +/**Admin notice style**/
789 +.qcld-wpbot-updated {
790 + display: flex;
791 + column-gap: 15px;
792 + row-gap: 10px;
793 + background: #fff;
794 + padding: 22px 20px;
795 + margin: 20px 0 20px 0;
796 + border-radius: 16px;
797 + flex-direction: column;
798 + width: 96%;
799 +}
800 +.qcld-wpbot-updated p {
801 + margin: 0;
802 + padding: 0;
803 + font-size: 16px;
804 + font-family: "DM Sans", sans-serif !important;
805 +}
806 +
807 +.qcld-wpbot-updated a.button-primary.button-large {
808 + background: var(--woobot-primary-color);
809 + color: #ffffff;
810 + border: none;
811 + padding: 5px 25px;
812 + line-height: 28px;
813 + font-weight: bold;
814 + border: 2px solid var(--woobot-primary-color);
815 + border-radius: 8px;
816 +}
817 +.qcld-wpbot-updated a.button-primary.button-large:hover {
818 + background: #fff;
819 + color: var(--woobot-primary-color);;
820 + border: none;
821 + padding: 5px 25px;
822 + line-height: 28px;
823 + font-weight: bold;
824 + border: 2px solid var(--woobot-primary-color);
825 + border-radius: 8px;
826 +}
827 +#swpsseion_mannual_scraper_corn, #save_wpsseion_corn_setting {
828 + padding: 14px 30px;
829 + width: auto;
830 + font-size: 16px;
831 + font-weight: 500;
832 + color: var(--woobot-nav-muted);
833 + border-radius: 8px;
834 + position: relative;
835 + display: inline-block;
836 + align-items: center;
837 + gap: 15px;
838 + background: var(--woobot-primary-color);
839 + color: #ffffff;
840 + text-decoration: none;
841 + border-color: var(--woobot-primary-color) !important;
842 + line-height: normal;
843 + margin: 20px 0 20px 0 !important;
844 + cursor: pointer;
845 +}
846 +.qcld-wpbot-updated a.button-secondary.button-large {
847 + border: 2px solid var(--woobot-primary-color);
848 + background: #fff;
849 + color: var(--woobot-primary-color);
850 + padding: 8px 20px;
851 + border-radius: 8px;
852 + display: inline-block;
853 + margin: 0;
854 + line-height: 28px;
855 + padding: 5px 25px;
856 + line-height: 28px;
857 + font-weight: bold;
858 +}
859 +.qcld-wpbot-updated a.button-secondary.button-large:hover {
860 + border: 2px solid var(--woobot-primary-color);
861 + background: var(--woobot-primary-color);
862 + color: #fff;
863 + padding: 8px 20px;
864 + border-radius: 8px;
865 + display: inline-block;
866 + margin: 0;
867 + line-height: 28px;
868 + padding: 5px 25px;
869 + line-height: 28px;
870 + font-weight: bold;
871 +}
872 +div#wpchatbot-sessioncorn-mannual input#wpchatbot-sessioncorn-mannual-number {
873 + padding: 2px 5px;
874 + margin: 0 12px;
875 + max-width: 60px;
876 + background: transparent;
877 + /* color: #ffff;
878 + border-color: #fff; */
879 +}
880 +
881 +
882 +.qcld-session-history_menu_box .btn.btn-primary {
883 + background: var(--woobot-primary) !important;
884 + color: #fff !important;
885 + margin: 0 0 3px 0;
886 +}
887 +.qcld-session-history_menu_box a.btn.btn-success {
888 + padding: 8px 24px;
889 + width: auto;
890 + font-size: 15px;
891 + font-weight: 500;
892 + border-radius: 8px;
893 + position: relative;
894 + background: #ffffff;
895 + color: var(--woobot-primary);
896 + text-decoration: none;
897 + line-height: normal;
898 + border: 2px solid var(--woobot-primary);
899 +}
900 +.qcld-session-history_menu_box a.btn.btn-success:hover {
901 + padding: 8px 24px;
902 + width: auto;
903 + font-size: 15px;
904 + font-weight: 500;
905 + border-radius: 8px;
906 + position: relative;
907 + background: var(--woobot-primary);
908 + color: #fff;
909 + text-decoration: none;
910 + line-height: normal;
911 + border: 2px solid var(--woobot-primary);
912 +}
913 +
914 +li.session_start_url span {
915 + font-weight: bold;
916 +}
917 +li.session_start_url {
918 + background: var(--woobot-primary) !important;
919 + padding: 8px 8px;
920 + color: #fff;
921 + border-radius: 6px;
922 +}
923 +li.session_start_url a {
924 + color: #fff;
925 +}
926 +.qcld-like-dislike-icon a i {
927 + font-size: 16px;
928 +}
929 +
930 +.forward-session-wrapper-detailspage {
931 + position: fixed;
932 + bottom: 0;
933 + left: 160px;
934 + right: 0;
935 + width: auto;
936 + max-width: none;
937 + margin: 0;
938 + background: #fff;
939 + padding: 18px 24px;
940 + z-index: 10050;
941 + opacity: 0;
942 + visibility: hidden;
943 + pointer-events: none;
944 + transform: translateY(100%);
945 + transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
946 + box-shadow: 0 -8px 28px rgba(var(--woobot-primary-rgb), 0.12);
947 + border-top: 1px solid var(--woobot-primary-border);
948 + max-height: 55vh;
949 + overflow-y: auto;
950 + box-sizing: border-box;
951 +}
952 +
953 +.forward-session-wrapper-detailspage.is-visible {
954 + opacity: 1;
955 + visibility: visible;
956 + pointer-events: auto;
957 + transform: translateY(0);
958 +}
959 +
960 +body.folded .forward-session-wrapper-detailspage {
961 + left: 36px;
962 +}
963 +
964 +@media screen and (max-width: 960px) {
965 + .forward-session-wrapper-detailspage,
966 + body.folded .forward-session-wrapper-detailspage {
967 + left: 0;
968 + }
969 +}
970 +
971 +@media screen and (max-width: 782px) {
972 + div#session_details_modal .modal-content {
973 + width: calc(100% - 24px);
974 + max-height: calc(100vh - 24px);
975 + border-radius: 12px;
976 + }
977 +
978 + div#session_details_modal .email-reply-container #reply_from_email {
979 + min-width: 100%;
980 + }
981 +}
982 +
983 +/* ─── Modern Sessions UI (plugin palette) ─────────────────────────────────── */
984 +.qcld-session-history_menu_box {
985 + --woobot-primary: #5B4E96;
986 + --woobot-primary-color: #5B4E96;
987 + --woobot-primary-dark: #463a7a;
988 + --woobot-primary-soft: #f3f1fa;
989 + --woobot-primary-border: #e4e0f2;
990 + --woobot-surface: #ffffff;
991 + --woobot-page-bg: #F5F7FD;
992 + --woobot-text: #2d2a3a;
993 + --woobot-muted: #6b6680;
994 + font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
995 +}
996 +
997 +/* Email notification toggle */
998 +.qcld-session-email-notice {
999 + display: flex;
1000 + align-items: center;
1001 + background: var(--woobot-primary-soft);
1002 + border: 1px solid var(--woobot-primary-border);
1003 + border-radius: 12px;
1004 + padding: 14px 18px;
1005 + margin: 8px 0 20px;
1006 + max-width: 100%;
1007 +}
1008 +
1009 +.qcld-session-email-notice__label {
1010 + display: flex;
1011 + align-items: center;
1012 + gap: 12px;
1013 + margin: 0;
1014 + cursor: pointer;
1015 + font-size: 14px;
1016 + font-weight: 500;
1017 + color: var(--woobot-primary-color);
1018 + line-height: 1.4;
1019 +}
1020 +
1021 +.qcld-session-email-notice__input {
1022 + position: absolute !important;
1023 + opacity: 0 !important;
1024 + width: 0 !important;
1025 + height: 0 !important;
1026 + margin: 0 !important;
1027 + padding: 0 !important;
1028 +}
1029 +
1030 +.qcld-session-email-notice__switch {
1031 + position: relative;
1032 + flex-shrink: 0;
1033 + width: 44px;
1034 + height: 24px;
1035 + background: #c9c4db;
1036 + border-radius: 999px;
1037 + transition: background 0.2s ease;
1038 +}
1039 +
1040 +.qcld-session-email-notice__switch::after {
1041 + content: "";
1042 + position: absolute;
1043 + top: 3px;
1044 + left: 3px;
1045 + width: 18px;
1046 + height: 18px;
1047 + background: #fff;
1048 + border-radius: 50%;
1049 + box-shadow: 0 1px 3px rgba(var(--woobot-primary-rgb), 0.25);
1050 + transition: transform 0.2s ease;
1051 +}
1052 +
1053 +.qcld-session-email-notice__input:checked + .qcld-session-email-notice__switch {
1054 + background: var(--woobot-primary-color);
1055 +}
1056 +
1057 +.qcld-session-email-notice__input:checked + .qcld-session-email-notice__switch::after {
1058 + transform: translateX(20px);
1059 +}
1060 +
1061 +.qcld-session-email-notice__input:focus-visible + .qcld-session-email-notice__switch {
1062 + outline: 2px solid var(--woobot-primary-color);
1063 + outline-offset: 2px;
1064 +}
1065 +
1066 +.qcld-session-email-notice__text {
1067 + color: var(--woobot-text);
1068 +}
1069 +
1070 +/* Top page pagination bar */
1071 +.qcld-session-history_menu_box .sld_menu_title.sld_menu_title_align,
1072 +.qcld-session-history_menu_box .qcld-session-pagination-bar {
1073 + display: flex;
1074 + justify-content: flex-end;
1075 + align-items: center;
1076 + background: var(--woobot-surface);
1077 + padding: 14px 20px;
1078 + margin: 16px 0 0;
1079 + border-radius: 16px;
1080 + width: 98%;
1081 + box-sizing: border-box;
1082 +}
1083 +
1084 +.qcld-session-pagination {
1085 + display: flex;
1086 + align-items: center;
1087 + flex-wrap: wrap;
1088 + gap: 8px;
1089 +}
1090 +
1091 +.qcld-session-history_menu_box .wpbot_pagination {
1092 + margin-right: 8px;
1093 + font-size: 13px;
1094 + font-weight: 600;
1095 + color: var(--woobot-muted);
1096 +}
1097 +
1098 +.qcld-session-history_menu_box a.page-numbers,
1099 +.qcld-session-history_menu_box span.page-numbers {
1100 + display: inline-flex;
1101 + align-items: center;
1102 + justify-content: center;
1103 + min-width: 34px;
1104 + height: 34px;
1105 + padding: 0 10px;
1106 + margin: 0 2px;
1107 + border-radius: 8px;
1108 + border: 1px solid var(--woobot-primary-border);
1109 + background: #fff;
1110 + color: var(--woobot-primary-color);
1111 + font-size: 13px;
1112 + font-weight: 600;
1113 + line-height: 1;
1114 + text-decoration: none;
1115 + transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
1116 +}
1117 +
1118 +.qcld-session-history_menu_box a.page-numbers:hover {
1119 + background: var(--woobot-primary-soft);
1120 + border-color: var(--woobot-primary-color);
1121 + color: var(--woobot-primary-dark);
1122 +}
1123 +
1124 +.qcld-session-history_menu_box span.page-numbers.current {
1125 + background: var(--woobot-primary-color);
1126 + border-color: var(--woobot-primary-color);
1127 + color: #fff;
1128 +}
1129 +
1130 +.qcld-session-history_menu_box span.page-numbers.dots {
1131 + border: none;
1132 + background: transparent;
1133 + color: var(--woobot-muted);
1134 + min-width: auto;
1135 + padding: 0 4px;
1136 +}
1137 +
1138 +/* DataTables toolbar: entries + search */
1139 +.qcld-session-history_menu_box div.dt-container {
1140 + margin-top: 8px;
1141 +}
1142 +
1143 +.qcld-session-history_menu_box div.dt-container .dt-layout-row {
1144 + display: flex;
1145 + flex-wrap: wrap;
1146 + align-items: center;
1147 + justify-content: space-between;
1148 + gap: 12px;
1149 + margin-bottom: 14px;
1150 +}
1151 +
1152 +.qcld-session-history_menu_box div.dt-container .dt-length,
1153 +.qcld-session-history_menu_box div.dt-container .dt-search {
1154 + display: flex;
1155 + align-items: center;
1156 + gap: 8px;
1157 + font-size: 13px;
1158 + font-weight: 500;
1159 + color: var(--woobot-muted);
1160 +}
1161 +
1162 +.qcld-session-history_menu_box div.dt-container select.dt-input,
1163 +.qcld-session-history_menu_box div.dt-container input.dt-input {
1164 + min-width: 72px;
1165 + height: 38px;
1166 + padding: 6px 12px;
1167 + border: 1px solid var(--woobot-primary-border);
1168 + border-radius: 8px;
1169 + background: #fff;
1170 + color: var(--woobot-text);
1171 + font-size: 13px;
1172 + font-weight: 500;
1173 + box-shadow: none;
1174 + outline: none;
1175 + transition: border-color 0.15s ease, box-shadow 0.15s ease;
1176 + line-height: 28px;
1177 +}
1178 +
1179 +.qcld-like-dislike-icon a:focus {
1180 + outline: 0;
1181 + outline-offset: 0;
1182 + box-shadow: none;
1183 + text-decoration: none;
1184 +}
1185 +
1186 +.qcld-session-history_menu_box div.dt-container input.dt-input {
1187 + min-width: 200px;
1188 +}
1189 +
1190 +.qcld-session-history_menu_box div.dt-container select.dt-input:focus,
1191 +.qcld-session-history_menu_box div.dt-container input.dt-input:focus {
1192 + border-color: var(--woobot-primary-color);
1193 + box-shadow: 0 0 0 3px rgba(var(--woobot-primary-rgb), 0.15);
1194 +}
1195 +
1196 +/* Sessions table */
1197 +.qcld-session-history_menu_box .chatsession_table_area {
1198 + overflow-x: auto;
1199 +}
1200 +
1201 +.qcld-session-history_menu_box table#chatsession-table {
1202 + width: 100% !important;
1203 + border-collapse: separate;
1204 + border-spacing: 0;
1205 + border: 1px solid var(--woobot-primary-border);
1206 + border-radius: 12px;
1207 + overflow: hidden;
1208 + background: #fff;
1209 +}
1210 +
1211 +.qcld-session-history_menu_box table#chatsession-table thead tr.table-primary,
1212 +.qcld-session-history_menu_box table#chatsession-table thead tr {
1213 + background: var(--woobot-primary-color) !important;
1214 +}
1215 +
1216 +.qcld-session-history_menu_box table#chatsession-table thead th {
1217 + background: var(--woobot-primary-color) !important;
1218 + color: #fff !important;
1219 + font-size: 13px;
1220 + font-weight: 600;
1221 + letter-spacing: 0.02em;
1222 + padding: 14px 12px !important;
1223 + border: none !important;
1224 + vertical-align: middle;
1225 + white-space: nowrap;
1226 +}
1227 +
1228 +.qcld-session-history_menu_box table#chatsession-table tbody td {
1229 + background: #fff !important;
1230 + color: var(--woobot-text) !important;
1231 + font-size: 13px;
1232 + padding: 14px 12px !important;
1233 + border-top: 1px solid #eef0f6 !important;
1234 + border-bottom: none !important;
1235 + border-left: none !important;
1236 + border-right: none !important;
1237 + border-radius: 0 !important;
1238 + vertical-align: middle;
1239 +}
1240 +
1241 +.qcld-session-history_menu_box table#chatsession-table.table-striped > tbody > tr:nth-of-type(odd) > * {
1242 + background: #faf9fd !important;
1243 + box-shadow: none !important;
1244 +}
1245 +
1246 +.qcld-session-history_menu_box table#chatsession-table tbody tr:hover > * {
1247 + background: var(--woobot-primary-soft) !important;
1248 +}
1249 +
1250 +.qcld-session-history_menu_box table#chatsession-table .wpbot_sessions_checkbox,
1251 +.qcld-session-history_menu_box table#chatsession-table #wpbot_checked_all {
1252 + width: 16px;
1253 + height: 16px;
1254 + accent-color: var(--woobot-primary-color);
1255 + cursor: pointer;
1256 +}
1257 +
1258 +/* Row action buttons */
1259 +.qcld-session-history_menu_box table#chatsession-table .btn {
1260 + display: inline-flex;
1261 + align-items: center;
1262 + justify-content: center;
1263 + gap: 4px;
1264 + margin: 2px 2px 2px 0;
1265 + padding: 7px 10px;
1266 + border-radius: 8px;
1267 + font-size: 12px;
1268 + font-weight: 600;
1269 + line-height: 1.2;
1270 + border: none;
1271 + cursor: pointer;
1272 + text-decoration: none;
1273 + transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
1274 +}
1275 +
1276 +.qcld-session-history_menu_box table#chatsession-table a.btn.btn-danger,
1277 +.qcld-session-history_menu_box table#chatsession-table .btn.btn-danger {
1278 + background: var(--woobot-danger);
1279 + color: #fff;
1280 +}
1281 +
1282 +.qcld-session-history_menu_box table#chatsession-table a.btn.btn-danger:hover,
1283 +.qcld-session-history_menu_box table#chatsession-table .btn.btn-danger:hover {
1284 + background: #c93f4d;
1285 + color: #fff;
1286 +}
1287 +
1288 +.qcld-session-history_menu_box table#chatsession-table .btn.btn-secondary {
1289 + background: #fff;
1290 + color: var(--woobot-primary-color);
1291 + border: 1px solid var(--woobot-primary-border);
1292 +}
1293 +
1294 +.qcld-session-history_menu_box table#chatsession-table .btn.btn-secondary:hover {
1295 + background: var(--woobot-primary-soft);
1296 + border-color: var(--woobot-primary-color);
1297 + color: var(--woobot-primary-dark);
1298 +}
1299 +
1300 +.qcld-session-history_menu_box table#chatsession-table a.btn.btn-info,
1301 +.qcld-session-history_menu_box table#chatsession-table .btn.btn-info,
1302 +.qcld-session-history_menu_box table#chatsession-table span.btn.btn-info {
1303 + background: var(--woobot-primary-color);
1304 + color: #fff;
1305 +}
1306 +
1307 +.qcld-session-history_menu_box table#chatsession-table a.btn.btn-info:hover,
1308 +.qcld-session-history_menu_box table#chatsession-table .btn.btn-info:hover,
1309 +.qcld-session-history_menu_box table#chatsession-table span.btn.btn-info:hover {
1310 + background: var(--woobot-primary-dark);
1311 + color: #fff;
1312 +}
1313 +
1314 +/* DataTables bottom pagination */
1315 +.qcld-session-history_menu_box div.dt-container .dt-paging {
1316 + display: flex;
1317 + justify-content: flex-end;
1318 + margin-top: 8px;
1319 +}
1320 +
1321 +.qcld-session-history_menu_box div.dt-container .dt-paging .dt-paging-button {
1322 + display: inline-flex;
1323 + align-items: center;
1324 + justify-content: center;
1325 + min-width: 34px;
1326 + height: 34px;
1327 + margin: 0 2px;
1328 + padding: 0 10px;
1329 + border-radius: 8px !important;
1330 + border: 1px solid var(--woobot-primary-border) !important;
1331 + background: #fff !important;
1332 + color: var(--woobot-primary-color) !important;
1333 + font-size: 13px;
1334 + font-weight: 600;
1335 + box-shadow: none !important;
1336 + cursor: pointer;
1337 + transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
1338 +}
1339 +
1340 +.qcld-session-history_menu_box div.dt-container .dt-paging .dt-paging-button:hover:not(.disabled):not(.current) {
1341 + background: var(--woobot-primary-soft) !important;
1342 + border-color: var(--woobot-primary-color) !important;
1343 + color: var(--woobot-primary-dark) !important;
1344 +}
1345 +
1346 +.qcld-session-history_menu_box div.dt-container .dt-paging .dt-paging-button.current {
1347 + background: var(--woobot-primary-color) !important;
1348 + border-color: var(--woobot-primary-color) !important;
1349 + color: #fff !important;
1350 +}
1351 +
1352 +.qcld-session-history_menu_box div.dt-container .dt-paging .dt-paging-button.disabled {
1353 + opacity: 0.45;
1354 + cursor: default;
1355 +}
1356 +
1357 +@media screen and (max-width: 782px) {
1358 + .qcld-session-email-notice {
1359 + padding: 12px 14px;
1360 + }
1361 +
1362 + .qcld-session-history_menu_box div.dt-container input.dt-input {
1363 + min-width: 140px;
1364 + }
1365 +
1366 + .qcld-session-history_menu_box table#chatsession-table .btn {
1367 + width: 100%;
1368 + margin: 3px 0;
1369 + }
1370 +}
1371 +
1372 +.chatsession_table_area .col-md-6{
1373 + padding-left: 0 !important;
1374 +}
1375 +
1376 +.dt-layout-cell.dt-layout-full table#chatsession-table input[type=checkbox]:checked::before {
1377 + margin: 0;
1378 +}
1379 +
1380 +/* ─── Session details page ────────────────────────────────────────────────── */
1381 +.wpbot-session-details-page {
1382 + --woobot-primary: #5B4E96;
1383 + --woobot-primary-dark: #463a7a;
1384 + --woobot-primary-soft: #f3f1fa;
1385 + --woobot-primary-border: #e4e0f2;
1386 + --woobot-text: #2d2a3a;
1387 + --woobot-muted: #6b6680;
1388 + --woobot-danger: #e25563;
1389 + font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
1390 + margin: 12px 20px 40px 0;
1391 + padding-bottom: 0px;
1392 + color: var(--woobot-text);
1393 + max-width: 1280px;
1394 + margin: 0 auto;
1395 +}
1396 +
1397 +.wpbot-session-details-page .wpbot-session-meta-card,
1398 +.wpbot-session-details-page .wpbot-session-chat-card {
1399 + background: #fff;
1400 + border: 1px solid var(--woobot-primary-border);
1401 + border-radius: 16px;
1402 + box-shadow: 0 6px 22px rgba(var(--woobot-primary-rgb), 0.06);
1403 + width: 100%;
1404 + box-sizing: border-box;
1405 +}
1406 +
1407 +.wpbot-session-details-page .wpbot-session-meta-card {
1408 + padding: 22px 24px;
1409 + margin: 20px 0 20px;
1410 +}
1411 +
1412 +.wpbot-session-details-page .wpbot-session-meta-card__header {
1413 + display: flex;
1414 + align-items: center;
1415 + justify-content: space-between;
1416 + flex-wrap: wrap;
1417 + gap: 14px;
1418 + margin-bottom: 18px;
1419 + padding-bottom: 16px;
1420 + border-bottom: 1px solid var(--woobot-primary-soft);
1421 +}
1422 +ul.wp-chatbot-messages-container > li.wp-chat-user-msg {
1423 + padding-right: 0 !important;
1424 +}
1425 +.wpbot-session-details-page .wpbot-session-meta-card__header h2 {
1426 + margin: 0 !important;
1427 + padding: 0 !important;
1428 + font-size: 22px;
1429 + font-weight: 700;
1430 + color: var(--woobot-primary) !important;
1431 + line-height: 1.3;
1432 +}
1433 +
1434 +.wpbot-session-details-page .wpbot-session-meta-card__actions {
1435 + display: flex;
1436 + flex-wrap: wrap;
1437 + gap: 10px;
1438 +}
1439 +
1440 +.wpbot-session-details-page .wpbot-session-meta-grid {
1441 + display: grid;
1442 + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
1443 + gap: 14px;
1444 +}
1445 +
1446 +.wpbot-session-details-page .wpbot-session-meta-item {
1447 + background: var(--woobot-primary-soft);
1448 + border: 1px solid var(--woobot-primary-border);
1449 + border-radius: 12px;
1450 + padding: 14px 16px;
1451 +}
1452 +
1453 +.wpbot-session-details-page .wpbot-session-meta-item__label {
1454 + display: block;
1455 + font-size: 12px;
1456 + font-weight: 600;
1457 + letter-spacing: 0.03em;
1458 + text-transform: uppercase;
1459 + color: var(--woobot-muted);
1460 + margin-bottom: 6px;
1461 +}
1462 +
1463 +.wpbot-session-details-page .wpbot-session-meta-item__value {
1464 + display: block;
1465 + font-size: 15px;
1466 + font-weight: 600;
1467 + color: var(--woobot-text);
1468 + word-break: break-word;
1469 +}
1470 +
1471 +.wpbot-session-details-page .btn {
1472 + display: inline-flex;
1473 + align-items: center;
1474 + justify-content: center;
1475 + gap: 6px;
1476 + border-radius: 8px !important;
1477 + font-size: 13px !important;
1478 + font-weight: 600 !important;
1479 + line-height: 1.2 !important;
1480 + padding: 9px 16px !important;
1481 + text-decoration: none !important;
1482 + border-width: 2px !important;
1483 + transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
1484 +}
1485 +
1486 +.wpbot-session-details-page .btn.btn-primary,
1487 +.wpbot-session-details-page .wpbot-session-back-btn.btn-primary {
1488 + background: var(--woobot-primary) !important;
1489 + border-color: var(--woobot-primary) !important;
1490 + color: #fff !important;
1491 +}
1492 +
1493 +.wpbot-session-details-page .btn.btn-primary:hover,
1494 +.wpbot-session-details-page .wpbot-session-back-btn.btn-primary:hover {
1495 + background: var(--woobot-primary-dark) !important;
1496 + border-color: var(--woobot-primary-dark) !important;
1497 + color: #fff !important;
1498 +}
1499 +
1500 +.wpbot-session-details-page .btn.btn-secondary {
1501 + background: #fff !important;
1502 + border-color: var(--woobot-primary) !important;
1503 + color: var(--woobot-primary) !important;
1504 +}
1505 +
1506 +.wpbot-session-details-page .btn.btn-secondary:hover {
1507 + background: var(--woobot-primary) !important;
1508 + color: #fff !important;
1509 +}
1510 +
1511 +.wpbot-session-details-page .btn.btn-danger {
1512 + background: #fff !important;
1513 + border: 2px solid var(--woobot-danger) !important;
1514 + color: var(--woobot-danger) !important;
1515 +}
1516 +
1517 +.wpbot-session-details-page .btn.btn-danger:hover {
1518 + background: var(--woobot-danger) !important;
1519 + color: #fff !important;
1520 +}
1521 +
1522 +.wpbot-session-details-page .wpbot-session-chat-card {
1523 + padding: 0;
1524 + margin: 0 0 20px;
1525 + overflow: hidden;
1526 +}
1527 +
1528 +.wpbot-session-details-page .wpbot-session-chat-card__header {
1529 + display: flex;
1530 + align-items: center;
1531 + justify-content: space-between;
1532 + flex-wrap: wrap;
1533 + gap: 12px;
1534 + padding: 18px 22px;
1535 + border-bottom: 1px solid var(--woobot-primary-border);
1536 + background: #fff;
1537 +}
1538 +
1539 +.wpbot-session-details-page .wpbot-session-chat-card__header h3 {
1540 + margin: 0 !important;
1541 + padding: 0 !important;
1542 + font-size: 18px;
1543 + font-weight: 700;
1544 + color: var(--woobot-primary) !important;
1545 +}
1546 +
1547 +.wpbot-session-details-page .wpbot-session-chat-card__header .wpbot-session-back-btn {
1548 + margin: 0;
1549 +}
1550 +
1551 +.wpbot-session-details-page .wp-chatbot-messages-wrapper {
1552 + padding: 18px 22px 24px;
1553 + background: #faf9fd;
1554 +}
1555 +
1556 +.wpbot-session-details-page .wp-chatbot-messages-wrapper ul {
1557 + margin: 0;
1558 + padding: 0;
1559 + list-style: none;
1560 +}
1561 +
1562 +.wpbot-session-details-page li.session_start_url {
1563 + background: var(--woobot-primary) !important;
1564 + padding: 12px 16px !important;
1565 + margin: 0 0 18px !important;
1566 + color: #fff !important;
1567 + border-radius: 10px !important;
1568 + font-size: 13px !important;
1569 + font-weight: 500;
1570 +}
1571 +
1572 +.wpbot-session-details-page li.session_start_url a {
1573 + color: #fff !important;
1574 + text-decoration: underline;
1575 + word-break: break-all;
1576 +}
1577 +
1578 +.wpbot-session-details-page .wp-chatbot-paragraph {
1579 + background: #fff !important;
1580 + border: 1px solid var(--woobot-primary-border);
1581 + padding: 10px 14px !important;
1582 + border-radius: 12px !important;
1583 + box-shadow: 0 1px 3px rgba(var(--woobot-primary-rgb), 0.06);
1584 + text-align: left !important;
1585 +}
1586 +
1587 +.wpbot-session-details-page li.wp-chat-user-msg .wp-chatbot-paragraph {
1588 + background: var(--woobot-primary-soft) !important;
1589 + border-color: #ddd6f3;
1590 +}
1591 +
1592 +.wpbot-session-details-page .wp-chatbot-avatar img {
1593 + width: 36px !important;
1594 + height: 36px !important;
1595 + border-radius: 50%;
1596 + border: 2px solid var(--woobot-primary-border);
1597 +}
1598 +
1599 +.wpbot-session-details-page .forward-session-wrapper-detailspage {
1600 + display: none;
1601 +}
1602 +
1603 +.wpbot-session-details-page .wpbot-reply-fab {
1604 + position: fixed;
1605 + right: 28px;
1606 + bottom: 28px;
1607 + z-index: 10060;
1608 + display: inline-flex;
1609 + align-items: center;
1610 + gap: 10px;
1611 + padding: 14px 20px;
1612 + border: none;
1613 + border-radius: 999px;
1614 + background: var(--woobot-primary);
1615 + color: #fff;
1616 + font-size: 14px;
1617 + font-weight: 600;
1618 + font-family: inherit;
1619 + box-shadow: 0 10px 28px rgba(var(--woobot-primary-rgb), 0.35);
1620 + cursor: pointer;
1621 + transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
1622 +}
1623 +
1624 +.wpbot-session-details-page .wpbot-reply-fab i {
1625 + font-size: 18px;
1626 + line-height: 1;
1627 +}
1628 +
1629 +.wpbot-session-details-page .wpbot-reply-fab:hover,
1630 +.wpbot-session-details-page .wpbot-reply-fab.is-active {
1631 + background: var(--woobot-primary-dark);
1632 + transform: translateY(-2px);
1633 + box-shadow: 0 12px 32px rgba(var(--woobot-primary-rgb), 0.4);
1634 +}
1635 +
1636 +.wpbot-session-details-page .wpbot-reply-panel {
1637 + position: fixed;
1638 + right: 28px;
1639 + bottom: 88px;
1640 + z-index: 10061;
1641 + width: min(720px, calc(100vw - 40px));
1642 + max-height: min(70vh, 720px);
1643 + overflow: hidden;
1644 + display: flex;
1645 + flex-direction: column;
1646 + background: #fff;
1647 + border: 1px solid var(--woobot-primary-border);
1648 + border-radius: 16px;
1649 + box-shadow: 0 16px 40px rgba(var(--woobot-primary-rgb), 0.2);
1650 + opacity: 0;
1651 + visibility: hidden;
1652 + transform: translateY(12px) scale(0.98);
1653 + transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
1654 +}
1655 +
1656 +.wpbot-session-details-page .wpbot-reply-panel.is-open {
1657 + opacity: 1;
1658 + visibility: visible;
1659 + transform: translateY(0) scale(1);
1660 +}
1661 +
1662 +.wpbot-session-details-page .wpbot-reply-panel[hidden] {
1663 + display: none !important;
1664 +}
1665 +
1666 +.wpbot-session-details-page .wpbot-reply-panel.is-open[hidden] {
1667 + display: flex !important;
1668 +}
1669 +
1670 +.wpbot-session-details-page .wpbot-reply-panel__header {
1671 + display: flex;
1672 + align-items: center;
1673 + justify-content: space-between;
1674 + gap: 12px;
1675 + padding: 14px 16px;
1676 + border-bottom: 1px solid var(--woobot-primary-border);
1677 + background: var(--woobot-primary-soft);
1678 +}
1679 +
1680 +.wpbot-session-details-page .wpbot-reply-panel__header h4 {
1681 + margin: 0 !important;
1682 + font-size: 15px;
1683 + font-weight: 700;
1684 + color: var(--woobot-primary);
1685 +}
1686 +
1687 +.wpbot-session-details-page .wpbot-reply-panel__close {
1688 + width: 30px;
1689 + height: 30px;
1690 + border: none;
1691 + border-radius: 50%;
1692 + background: var(--woobot-primary);
1693 + color: #fff;
1694 + font-size: 20px;
1695 + line-height: 28px;
1696 + cursor: pointer;
1697 + padding: 0;
1698 +}
1699 +
1700 +.wpbot-session-details-page .wpbot-reply-panel__close:hover {
1701 + background: var(--woobot-primary-dark);
1702 +}
1703 +
1704 +.wpbot-session-details-page .wpbot-reply-panel__body {
1705 + padding: 16px;
1706 + overflow-y: auto;
1707 +}
1708 +
1709 +.wpbot-session-details-page .wpbot-reply-panel__to {
1710 + margin: 0 0 12px;
1711 + font-size: 13px;
1712 + color: var(--woobot-text);
1713 +}
1714 +
1715 +.wpbot-session-details-page .wpbot-reply-panel__warning {
1716 + margin: 0 0 14px;
1717 + padding: 12px;
1718 + border-radius: 8px;
1719 + background: #fdebec;
1720 + color: var(--woobot-danger);
1721 + font-size: 13px;
1722 + font-weight: 600;
1723 +}
1724 +
1725 +.wpbot-session-details-page .email-reply-container {
1726 + background: var(--woobot-primary-soft);
1727 + border: 1px solid var(--woobot-primary-border);
1728 + border-radius: 12px;
1729 + padding: 14px;
1730 + margin-bottom: 14px;
1731 +}
1732 +
1733 +.wpbot-session-details-page .email-reply-container h4 {
1734 + margin: 0 0 14px !important;
1735 + font-size: 15px;
1736 + font-weight: 600;
1737 + color: var(--woobot-primary);
1738 +}
1739 +
1740 +.wpbot-session-details-page .email-reply-container .form-label {
1741 + font-size: 13px;
1742 + font-weight: 600;
1743 + color: var(--woobot-muted);
1744 + margin-bottom: 6px;
1745 +}
1746 +
1747 +.wpbot-session-details-page .email-reply-container .form-control,
1748 +.wpbot-session-details-page .forward-session-wrapper #details_session_email {
1749 + border: 1px solid var(--woobot-primary-border);
1750 + border-radius: 8px;
1751 + padding: 10px 12px;
1752 + font-size: 13px;
1753 + color: var(--woobot-text);
1754 + box-shadow: none;
1755 + outline: none;
1756 +}
1757 +
1758 +.wpbot-session-details-page .email-reply-container .form-control:focus,
1759 +.wpbot-session-details-page .forward-session-wrapper #details_session_email:focus {
1760 + border-color: var(--woobot-primary);
1761 + box-shadow: 0 0 0 3px rgba(var(--woobot-primary-rgb), 0.15);
1762 +}
1763 +
1764 +.wpbot-session-details-page .forward-session-wrapper {
1765 + display: flex;
1766 + align-items: stretch;
1767 + gap: 0;
1768 +}
1769 +
1770 +.wpbot-session-details-page .forward-session-wrapper #details_session_email {
1771 + flex: 1;
1772 + border-radius: 8px 0 0 8px !important;
1773 + min-height: 42px;
1774 +}
1775 +
1776 +.wpbot-session-details-page .forward-session-wrapper .forward_session {
1777 + min-width: 140px;
1778 + border-radius: 0 8px 8px 0 !important;
1779 + background: var(--woobot-primary) !important;
1780 + border-color: var(--woobot-primary) !important;
1781 + color: #fff !important;
1782 + cursor: pointer;
1783 +}
1784 +
1785 +.wpbot-session-details-page .forward-session-wrapper .forward_session:hover {
1786 + background: var(--woobot-primary-dark) !important;
1787 + border-color: var(--woobot-primary-dark) !important;
1788 +}
1789 +
1790 +@media screen and (max-width: 782px) {
1791 + .wpbot-session-details-page .wpbot-reply-fab {
1792 + right: 16px;
1793 + bottom: 16px;
1794 + padding: 12px 16px;
1795 + }
1796 +
1797 + .wpbot-session-details-page .wpbot-reply-panel {
1798 + right: 16px;
1799 + bottom: 76px;
1800 + width: calc(100vw - 32px);
1801 + }
1802 +
1803 + .wpbot-session-details-page .forward-session-wrapper {
1804 + flex-direction: column;
1805 + gap: 8px;
1806 + }
1807 +
1808 + .wpbot-session-details-page .forward-session-wrapper #details_session_email,
1809 + .wpbot-session-details-page .forward-session-wrapper .forward_session {
1810 + width: 100%;
1811 + border-radius: 8px !important;
1812 + min-width: 0;
1813 + }
1814 +}
1815 +
1816 +/* ─── AI Insight locked page ──────────────────────────────────────────────── */
1817 +.wpbot-ai-insight-page {
1818 + --woobot-primary: #5B4E96;
1819 + --woobot-primary-dark: #463a7a;
1820 + --woobot-primary-soft: #f3f1fa;
1821 + --woobot-primary-border: #e4e0f2;
1822 + --woobot-text: #2d2a3a;
1823 + --woobot-muted: #6b6680;
1824 + font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
1825 + max-width: 1280px;
1826 + margin: 20px auto 40px auto;
1827 +}
1828 +
1829 +.wpbot-ai-insight-page .wpbot-ai-insight-header {
1830 + background: #fff;
1831 + border: 1px solid var(--woobot-primary-border);
1832 + border-radius: 16px;
1833 + padding: 20px 24px;
1834 + margin: 0 0 20px;
1835 +}
1836 +
1837 +.wpbot-ai-insight-page .wpbot-ai-insight-header h2 {
1838 + margin: 0 0 4px !important;
1839 + padding: 0 !important;
1840 + font-size: 24px;
1841 + font-weight: 700;
1842 + color: var(--woobot-primary) !important;
1843 + line-height: 1.3;
1844 +}
1845 +
1846 +.wpbot-ai-insight-page .wpbot-ai-insight-header p {
1847 + margin: 0;
1848 + font-size: 14px;
1849 + color: var(--woobot-muted);
1850 +}
1851 +
1852 +.wpbot-ai-insight-page .wpbot-ai-insight-locked {
1853 + display: flex;
1854 + flex-direction: column;
1855 + align-items: center;
1856 + text-align: center;
1857 + background: #fff;
1858 + border: 1px solid var(--woobot-primary-border);
1859 + border-radius: 16px;
1860 + padding: 48px 36px;
1861 + box-shadow: 0 8px 28px rgba(var(--woobot-primary-rgb), 0.08);
1862 +}
1863 +
1864 +.wpbot-ai-insight-page .wpbot-ai-insight-locked__icon {
1865 + display: flex;
1866 + align-items: center;
1867 + justify-content: center;
1868 + width: 72px;
1869 + height: 72px;
1870 + margin-bottom: 18px;
1871 + border-radius: 50%;
1872 + background: var(--woobot-primary-soft);
1873 + border: 1px solid var(--woobot-primary-border);
1874 +}
1875 +
1876 +.wpbot-ai-insight-page .wpbot-ai-insight-locked__icon .dashicons {
1877 + width: 36px;
1878 + height: 36px;
1879 + font-size: 36px;
1880 + color: var(--woobot-primary);
1881 +}
1882 +
1883 +.wpbot-ai-insight-page .wpbot-ai-insight-locked h3 {
1884 + margin: 0 0 12px !important;
1885 + padding: 0 !important;
1886 + font-size: 22px;
1887 + font-weight: 700;
1888 + color: var(--woobot-primary) !important;
1889 + line-height: 1.3;
1890 +}
1891 +
1892 +.wpbot-ai-insight-page .wpbot-ai-insight-locked__desc {
1893 + max-width: 560px;
1894 + margin: 0 0 14px;
1895 + font-size: 15px;
1896 + line-height: 1.6;
1897 + color: var(--woobot-text);
1898 +}
1899 +
1900 +.wpbot-ai-insight-page .wpbot-ai-insight-locked__cta {
1901 + margin: 0 0 24px;
1902 + font-size: 15px;
1903 + font-weight: 700;
1904 + color: var(--woobot-primary-dark);
1905 +}
1906 +
1907 +.wpbot-ai-insight-page .wpbot-ai-insight-locked__btn {
1908 + display: inline-flex;
1909 + align-items: center;
1910 + justify-content: center;
1911 + padding: 12px 28px;
1912 + border-radius: 8px;
1913 + background: var(--woobot-primary);
1914 + border: 2px solid var(--woobot-primary);
1915 + color: #fff !important;
1916 + font-size: 15px;
1917 + font-weight: 600;
1918 + text-decoration: none !important;
1919 + line-height: 1.2;
1920 + transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
1921 +}
1922 +
1923 +.wpbot-ai-insight-page .wpbot-ai-insight-locked__btn:hover {
1924 + background: var(--woobot-primary-dark);
1925 + border-color: var(--woobot-primary-dark);
1926 + color: #fff !important;
1927 + transform: translateY(-1px);
1928 +}
1929 +
1930 +.qchero_sliders_list_wrapper.qcld-session-history_menu_box {
1931 + max-width: 1280px;
1932 + margin: 20px auto 40px auto;
1933 +}
1934 +
1935 +table.dataTable th.dt-type-numeric, table.dataTable th.dt-type-date, table.dataTable td.dt-type-numeric, table.dataTable td.dt-type-date {
1936 + text-align: left;
1937 +}
1938 +
1939 +.sld_menu_title.qcld_session_chat_menu_title {
1940 + width: 100%;
1941 + max-width: 1280px;
1942 + margin: 20px auto 20px auto;
1943 +}
1944 +.qcld-session-no-record-found {
1945 + width: 100%;
1946 + max-width: 1280px;
1947 + margin: 0 auto;
1948 +}
1949 +
1950 +/* Sessions page shell — match other WPBot admin pages */
1951 +body.chatbot-wpbot-lite_page_wbcs-botsessions-page,
1952 +body.wpbot-panel_page_wbcs-botsessions-page {
1953 + background-color: var(--woobot-page-bg);
1954 +}
1955 +
1956 +.qcld-chat-sessions-wrap {
1957 + font-family: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
1958 +}
1959 +
1960 +.qcld-chat-sessions-wrap .qcld-wp-chatbot-wrap-header,
1961 +.qcld-chat-sessions-wrap .qcld-wp-chatbot-wrap-header_inn,
1962 +.qcld-chat-sessions-wrap .qchero_sliders_list_wrapper.qcld-session-history_menu_box,
1963 +.qcld-chat-sessions-wrap .sld_menu_title.qcld_session_chat_menu_title,
1964 +.qcld-chat-sessions-wrap .qcld-session-no-record-found,
1965 +.qcld-chat-sessions-wrap .wpbot-ai-insight-page {
1966 + max-width: 1280px;
1967 + width: 100%;
1968 + box-sizing: border-box;
1969 + margin-left: auto;
1970 + margin-right: auto;
1971 +}
1972 +
1973 +.qcld-chat-sessions-wrap .qcld-wp-chatbot-wrap-header_inn {
1974 + background: #fff;
1975 + border-radius: 16px;
1976 + padding: 20px;
1977 +}
1978 +
1979 +.qcld-chat-sessions-wrap .qcld-wp-chatbot-wrap-header_inn_heading h1.wp-heading-inline {
1980 + display: block;
1981 + border-bottom: 1px solid #eee;
1982 + padding: 0 0 15px 0;
1983 + margin: 0 0 16px 0;
1984 + font-weight: 700;
1985 + font-size: 22px !important;
1986 + color: var(--woobot-primary) !important;
1987 + line-height: 1.3;
1988 +}
1989 +
1990 +.qcld-chat-sessions-wrap .qcld-chat-sessions-tabs {
1991 + display: flex;
1992 + flex-wrap: wrap;
1993 + gap: 10px;
1994 + border: none;
1995 + padding: 0;
1996 + margin: 0;
1997 +}
1998 +
1999 +.qcld-chat-sessions-wrap .qcld-chat-sessions-tabs .nav-tab {
2000 + display: inline-flex;
2001 + align-items: center;
2002 + gap: 8px;
2003 + float: none;
2004 + margin: 0;
2005 +}
2006 +
2007 +.qcld-chat-sessions-wrap .qcld-chat-sessions-tabs .nav-tab .dashicons {
2008 + font-size: 18px;
2009 + width: 18px;
2010 + height: 18px;
2011 + line-height: 18px;
2012 +}
2013 +
2014 +.qcld-chat-sessions-wrap .qcld-chat-sessions-tabs .nav-tab:hover,
2015 +.qcld-chat-sessions-wrap .qcld-chat-sessions-tabs .nav-tab:focus {
2016 + background: var(--woobot-primary);
2017 + color: #fff;
2018 + border-color: var(--woobot-primary);
2019 + box-shadow: none;
2020 + outline: none;
2021 +}
2022 +
2023 +.qcld-chat-sessions-tab-content {
2024 + margin-top: 0;
2025 +}
2026 +
2027 +.qcld-chat-sessions-wrap .wpbot-ai-insight-page {
2028 + max-width: 1280px;
2029 + margin: 20px auto 40px auto;
2030 +}
2031 +
2032 +.qcld-chat-sessions-wrap form#wpcs_form_sessions {
2033 + width: 100% !important;
2034 +}
2035 +
2036 +@media screen and (max-width: 782px) {
2037 + .wpbot-ai-insight-page {
2038 + margin: 12px 0 24px;
2039 + }
2040 +
2041 + .wpbot-ai-insight-page .wpbot-ai-insight-locked {
2042 + padding: 36px 20px;
2043 + border-radius: 12px;
2044 + }
2045 +
2046 + .qcld-chat-sessions-wrap .qcld-wp-chatbot-wrap-header,
2047 + .qcld-chat-sessions-wrap .qcld-wp-chatbot-wrap-header_inn,
2048 + .qcld-chat-sessions-wrap .qchero_sliders_list_wrapper.qcld-session-history_menu_box,
2049 + .qcld-chat-sessions-wrap .sld_menu_title.qcld_session_chat_menu_title,
2050 + .qcld-chat-sessions-wrap .wpbot-ai-insight-page {
2051 + margin-right: 0;
2052 + }
743 2053 }