PluginProbe
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services / 7.6.9
WPBot – AI ChatBot for Live Support, Lead Generation, WordPress Automation, AI Services v7.6.9
8.8.4 8.8.3 8.8.2 8.8.1 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 All 540 releases
← All changes | css/admin-style.css +125 -1279 8.7.7 → 7.6.9 View file →
@@ -1,36 +1,8 @@
1 1 @import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');
2 2
3 -/* WPBot design tokens — change colors here to theme the whole admin UI */
4 -:root {
5 - --woobot-primary: #5B4E96;
6 - --woobot-primary-color: #5B4E96;
7 - --woobot-primary-dark: #463a7a;
8 - --woobot-primary-soft: #f3f1fa;
9 - --woobot-primary-border: #e4e0f2;
10 - --woobot-surface: #ffffff;
11 - --woobot-page-bg: #F5F7FD;
12 - --woobot-text: #2d2a3a;
13 - --woobot-muted: #6b6680;
14 - --woobot-danger: #e25563;
15 - --woobot-nav-muted: #988FBD;
16 - --woobot-primary-rgb: 91, 78, 150;
17 -}
18 -
19 3 .qcld-main-wrapper {
20 - --woobot-primary: #5B4E96;
21 - --woobot-primary-color: #5B4E96;
22 - --woobot-primary-dark: #463a7a;
23 - --woobot-primary-soft: #f3f1fa;
24 - --woobot-primary-border: #e4e0f2;
25 - --woobot-surface: #ffffff;
26 - --woobot-page-bg: #F5F7FD;
27 - --woobot-text: #2d2a3a;
28 - --woobot-muted: #6b6680;
29 - --woobot-danger: #e25563;
30 - --woobot-nav-muted: #988FBD;
31 - --woobot-primary-rgb: 91, 78, 150;
32 - background-color: var(--woobot-page-bg);
4 + background-color: #F5F7FD;
33 5 font-family: "DM Sans", sans-serif !important;
34 6 font-optical-sizing: auto;
35 7 font-size: 16px;
36 8 font-weight: normal;
@@ -39,11 +11,11 @@
39 11 .wp-chatbot-wrap .fa{
40 12 font: normal normal normal 14px / 1 FontAwesome !important;
41 13 }
42 14
43 -/* .chatbot-wpbot-lite_page_wpbot, .chatbot-wpbot-lite_page_wpbot_help_page, .chatbot-wpbot-lite_page_wpbot_openAi, .toplevel_page_wpbot-panel{
44 - background-color: var(--woobot-page-bg);
45 -} */
15 +.chatbot-wpbot-lite_page_wpbot, .chatbot-wpbot-lite_page_wpbot_help_page, .chatbot-wpbot-lite_page_wpbot_openAi, .toplevel_page_wpbot-panel{
16 + background-color: #F5F7FD;
17 +}
46 18
47 19 .qcld-main-wrapper .h1,
48 20 .qcld-main-wrapper .h2,
49 21 .qcld-main-wrapper .h3,
@@ -55,9 +27,9 @@
55 27 .qcld-main-wrapper h3,
56 28 .qcld-main-wrapper h4,
57 29 .qcld-main-wrapper h5,
58 30 .qcld-main-wrapper h6 {
59 - color: var(--woobot-primary) !important;
31 + color: #5b4e96 !important;
60 32 }
61 33
62 34 .qcld-wp-chatbot-wrap-header {
63 35 display: flex;
@@ -84,10 +56,10 @@
84 56
85 57 .qcld-wp-chatbot-wrap-header a.wpchatbot-Upgrade {
86 58 padding: 12px 25px;
87 59 background: #ffffff;
88 - color: var(--woobot-primary);
89 - border: 2px solid var(--woobot-primary);
60 + color: #5B4E96;
61 + border: 2px solid #5B4E96;
90 62 border-radius: 6px;
91 63 font-weight: bold;
92 64 }
93 65
@@ -92,11 +64,11 @@
92 64 }
93 65
94 66 .qcld-wp-chatbot-wrap-header a.wpchatbot-Upgrade:hover {
95 67 padding: 12px 25px;
96 - background: var(--woobot-primary);
68 + background: #5B4E96;
97 69 color: #fff;
98 - border: 2px solid var(--woobot-primary);
70 + border: 2px solid #5B4E96;
99 71 border-radius: 6px;
100 72 font-weight: bold;
101 73 text-decoration: none;
102 74 }
@@ -131,15 +103,15 @@
131 103 }
132 104
133 105
134 106 .wp-chatbot-tabs nav ul li.tab-current a {
135 - background: var(--woobot-primary);
107 + background: #5B4E96;
136 108 color: #ffffff;
137 109 text-decoration: none;
138 110 }
139 111
140 112 .wp-chatbot-tabs nav ul li a:hover {
141 - background: var(--woobot-primary);
113 + background: #5B4E96;
142 114 color: #ffffff;
143 115 text-decoration: none;
144 116 }
145 117
@@ -147,9 +119,9 @@
147 119 padding: 14px 15px;
148 120 width: 100%;
149 121 font-size: 16px;
150 122 font-weight: 500;
151 - color: var(--woobot-nav-muted);
123 + color: #988FBD;
152 124 border-radius: 8px;
153 125 position: relative;
154 126 display: flex;
155 127 align-items: center;
@@ -173,9 +145,9 @@
173 145 padding: 14px 15px;
174 146 width: 100%;
175 147 font-size: 16px;
176 148 font-weight: 500;
177 - color: var(--woobot-nav-muted);
149 + color: #988FBD;
178 150 border-radius: 8px;
179 151 position: relative;
180 152 display: flex;
181 153 align-items: center;
@@ -195,9 +167,9 @@
195 167 font-size: 18px;
196 168 }
197 169
198 170 .wp-chatbot-tabs nav .cxsc-settings_openai_border a:hover {
199 - background: var(--woobot-primary);
171 + background: #5B4E96;
200 172 color: #ffffff;
201 173 text-decoration: none;
202 174 }
203 175
@@ -230,9 +202,9 @@
230 202 max-width: 18px;
231 203 }
232 204
233 205 a.wp-chatbot-admin-pro-upgrade-button {
234 - background: var(--woobot-primary);
206 + background: #5B4E96;
235 207 color: #ffffff;
236 208 text-decoration: none;
237 209 padding: 4px 20px;
238 210 border-radius: 6px;
@@ -271,15 +243,15 @@
271 243 padding: 14px 20px;
272 244 width: auto;
273 245 font-size: 16px;
274 246 font-weight: 500;
275 - color: var(--woobot-nav-muted);
247 + color: #988FBD;
276 248 border-radius: 8px;
277 249 position: relative;
278 250 display: flex;
279 251 align-items: center;
280 252 gap: 15px;
281 - background: var(--woobot-primary);
253 + background: #5B4E96;
282 254 color: #ffffff;
283 255 text-decoration: none;
284 256 margin: 0 0 10px 15px;
285 257 }
@@ -308,12 +280,12 @@
308 280 font-size: 14px;
309 281 line-height: 1.71428571;
310 282 font-weight: 600;
311 283 background: #ffffff;
312 - color: var(--woobot-primary);
284 + color: #5b4e96;
313 285 text-decoration: none;
314 286 white-space: nowrap;
315 - border: 1px solid var(--woobot-primary);
287 + border: 1px solid #5b4e96;
316 288 padding: 10px 20px !important;
317 289 border-radius: 8px;
318 290 line-height: normal !important;
319 291 text-decoration: none;
@@ -322,16 +294,16 @@
322 294 .qcld-main-wrapper .nav-tab-active,
323 295 .qcld-main-wrapper .nav-tab-active:focus,
324 296 .qcld-main-wrapper .nav-tab-active:focus:active,
325 297 .qcld-main-wrapper .nav-tab-active:hover {
326 - border-bottom: 1px solid var(--woobot-primary);
327 - background: var(--woobot-primary);
298 + border-bottom: 1px solid #5b4e96;
299 + background: #5b4e96;
328 300 color: #fff;
329 301 text-decoration: none;
330 302 }
331 303
332 304 .qcld-main-wrapper .btn-primary {
333 - border-color: var(--woobot-primary) !important;
305 + border-color: #5b4e96 !important;
334 306 }
335 307
336 308 .qcld-main-wrapper ul.feature-list li img {
337 309 max-width: 16px;
@@ -350,12 +322,12 @@
350 322
351 323
352 324 section.wp-chatbot-tab-container-inner .panel-default>.panel-heading {
353 325 background: #fff !important;
354 - color: var(--woobot-primary) !important;
326 + color: #5B4E96 !important;
355 327 text-decoration: none !important;
356 328 border-radius: 8px;
357 - border: 2px solid var(--woobot-primary);
329 + border: 2px solid #5B4E96;
358 330 }
359 331
360 332 section.wp-chatbot-tab-container-inner .panel-default>.panel-heading+.panel-collapse>.panel-body {
361 333 border-top-color: #ddd;
@@ -365,9 +337,9 @@
365 337 margin: 15px 0 0 0;
366 338 }
367 339
368 340 section.wp-chatbot-tab-container-inner .panel-default>.panel-heading:hover {
369 - background: var(--woobot-primary) !important;
341 + background: #5B4E96 !important;
370 342 color: #ffffff !important;
371 343 text-decoration: none !important;
372 344 border-radius: 8px;
373 345 }
@@ -452,14 +424,14 @@
452 424
453 425 .wp-chatbot-wrap .nav-tabs>li>a {
454 426 margin-right: .5em;
455 427 line-height: 1.42857143;
456 - border: 1px solid var(--woobot-primary);
428 + border: 1px solid #5b4e96;
457 429 border-radius: 6px;
458 - border: 1px solid var(--woobot-primary);
430 + border: 1px solid #5b4e96;
459 431 padding: 10px 20px !important;
460 432 border-radius: 8px;
461 - color: var(--woobot-primary);
433 + color: #5b4e96;
462 434 font-size: 15px;
463 435 font-weight: 600;
464 436 line-height: normal !important;
465 437 }
@@ -468,10 +440,10 @@
468 440 .wp-chatbot-wrap .nav-tabs>li.active>a:focus,
469 441 .wp-chatbot-wrap .nav-tabs>li.active>a:hover {
470 442 color: #ffffff;
471 443 cursor: default;
472 - background-color: var(--woobot-primary);
473 - border: 1px solid var(--woobot-primary);
444 + background-color: #5b4e96;
445 + border: 1px solid #5b4e96;
474 446 border-bottom-color: transparent;
475 447 }
476 448
477 449 .wp-chatbot-wrap .nav-tabs {
@@ -481,22 +453,22 @@
481 453
482 454 .wp-chatbot-wrap .nav>li>a:focus,
483 455 .wp-chatbot-wrap .nav>li>a:hover {
484 456 text-decoration: none;
485 - background-color: var(--woobot-primary);
486 - border-color: var(--woobot-primary) #eee #ddd;
457 + background-color: #5b4e96;
458 + border-color: #5b4e96 #eee #ddd;
487 459 color: #fff;
488 460 }
489 461
490 462
491 463 .cxsc-settings-blocks.cxsc-settings-faq-blocks {
492 - background: var(--woobot-page-bg) !important;
464 + background: #f5f7fd !important;
493 465 padding: 12px !important;
494 466 border-radius: 6px;
495 467 }
496 468
497 469 .qcld-faq-block .cxsc-settings-blocks {
498 - background: var(--woobot-page-bg) !important;
470 + background: #f5f7fd !important;
499 471 padding: 12px !important;
500 472 border-radius: 6px !important;
501 473 margin: 0 0 15px 0 !important;
502 474 }
@@ -533,9 +505,9 @@
533 505 border-radius: 0;
534 506 width: 100%;
535 507 height: 100%;
536 508 margin: 0;
537 - background-color: color-mix(in srgb, var(--woobot-primary) 74%, transparent) !important;
509 + background-color: #5b4e96bd !important;
538 510 line-height: 1.14285714;
539 511 position: absolute;
540 512 top: 0;
541 513 left: 0;
@@ -644,12 +616,12 @@
644 616 object-fit: cover;
645 617 }
646 618
647 619 .wpbot_single_addon a.button.button-secondary {
648 - background: var(--woobot-primary);
620 + background: #5B4E96;
649 621 color: #ffffff;
650 622 text-decoration: none;
651 - border: 1px solid var(--woobot-primary);
623 + border: 1px solid #5B4E96;
652 624 }
653 625
654 626 .wp-chatbot-wrap .wpbot_single_addon p {
655 627 font-size: 14px;
@@ -735,11 +707,11 @@
735 707 }
736 708
737 709
738 710 .qcld-wp-chatbot-wrap-header-doc-details a {
739 - border: 2px solid var(--woobot-primary);
711 + border: 2px solid #5b4e96;
740 712 background: #fff;
741 - color: var(--woobot-primary);
713 + color: #5b4e96;
742 714 padding: 8px 20px;
743 715 border-radius: 8px;
744 716 display: inline-block;
745 717 margin: 4px 0 0 0;
@@ -745,10 +717,10 @@
745 717 margin: 4px 0 0 0;
746 718 }
747 719
748 720 .qcld-wp-chatbot-wrap-header-doc-details a:hover {
749 - border: 2px solid var(--woobot-primary);
750 - background: var(--woobot-primary);
721 + border: 2px solid #5b4e96;
722 + background: #5b4e96;
751 723 color: #fff;
752 724 padding: 8px 20px;
753 725 border-radius: 8px;
754 726 display: inline-block;
@@ -789,9 +761,9 @@
789 761 display: block;
790 762 display: flex !important;
791 763 align-items: center;
792 764 gap: 8px;
793 - background: var(--woobot-primary);
765 + background: #5B4E96;
794 766 padding: 10px 25px !important;
795 767 border-radius: 8px;
796 768 width: 100%;
797 769 justify-content: center;
@@ -835,15 +807,15 @@
835 807 padding: 14px 20px;
836 808 width: auto;
837 809 font-size: 16px;
838 810 font-weight: 500;
839 - color: var(--woobot-nav-muted);
811 + color: #988FBD;
840 812 border-radius: 8px;
841 813 position: relative;
842 814 display: inline-block;
843 815 align-items: center;
844 816 gap: 15px;
845 - background: var(--woobot-primary);
817 + background: #5B4E96;
846 818 color: #ffffff;
847 819 text-decoration: none;
848 820 }
849 821
@@ -972,9 +944,9 @@
972 944 padding: 12px;
973 945 }
974 946
975 947 .qc_menu_area_box ul li span {
976 - background-image: linear-gradient(to right, #868afa 0%, var(--woobot-primary) 51%, var(--woobot-primary) 100%);
948 + background-image: linear-gradient(to right, #868afa 0%, #5b4e96 51%, #5b4e96 100%);
977 949 box-shadow: 0 5px 15px #c3c3c3;
978 950 border: 1px solid #ffffff;
979 951 color: #fff;
980 952 display: block;
@@ -982,9 +954,9 @@
982 954 padding: 12px 30px;
983 955 }
984 956
985 957 .qc_menu_area_box .qc_menu_area_container span {
986 - background-image: linear-gradient(to right, #868afa 0%, var(--woobot-primary) 51%, var(--woobot-primary) 100%);
958 + background-image: linear-gradient(to right, #868afa 0%, #5b4e96 51%, #5b4e96 100%);
987 959 box-shadow: 0 5px 15px #c3c3c3;
988 960 border: 1px solid #ffffff;
989 961 color: #fff;
990 962 display: block;
@@ -993,9 +965,9 @@
993 965 }
994 966
995 967 .qc_menu_area_box .qc_menu_area_container span:hover,
996 968 .qc_menu_area_box ul li span:hover {
997 - background-image: linear-gradient(to right, var(--woobot-primary) 0%, #868afa 51%, #868afa 100%);
969 + background-image: linear-gradient(to right, #5b4e96 0%, #868afa 51%, #868afa 100%);
998 970 }
999 971
1000 972 .qc_menu_list_container {
1001 973 position: relative;
@@ -1024,59 +996,8 @@
1024 996 .lp-submenu-wpbot_openAi .swal2-actions {
1025 997 display: flex;
1026 998 width: auto;
1027 999 }
1028 -
1029 -/* Icon-only centered loading overlay for Save settings */
1030 -.swal2-popup.qcld-swal-loading-only {
1031 - background: transparent !important;
1032 - box-shadow: none !important;
1033 - padding: 0 !important;
1034 - width: auto !important;
1035 - min-width: 0 !important;
1036 -}
1037 -.swal2-popup.qcld-swal-loading-only .swal2-header,
1038 -.swal2-popup.qcld-swal-loading-only .swal2-title,
1039 -.swal2-popup.qcld-swal-loading-only .swal2-actions,
1040 -.swal2-popup.qcld-swal-loading-only .swal2-footer,
1041 -.swal2-popup.qcld-swal-loading-only .swal2-close {
1042 - display: none !important;
1043 -}
1044 -.swal2-popup.qcld-swal-loading-only .swal2-html-container {
1045 - margin: 0 !important;
1046 - padding: 0 !important;
1047 - overflow: visible !important;
1048 - color: transparent !important;
1049 -}
1050 -.qcld-save-settings-spinner {
1051 - position: relative;
1052 - width: 56px;
1053 - height: 56px;
1054 - margin: 0 auto;
1055 -}
1056 -.qcld-save-settings-spinner::before,
1057 -.qcld-save-settings-spinner::after {
1058 - content: '';
1059 - position: absolute;
1060 - inset: 0;
1061 - border-radius: 50%;
1062 - border: 4px solid transparent;
1063 -}
1064 -.qcld-save-settings-spinner::before {
1065 - border-top-color: #8b5cf6;
1066 - border-right-color: #8b5cf6;
1067 - animation: qcld-save-settings-spin 0.9s linear infinite;
1068 -}
1069 -.qcld-save-settings-spinner::after {
1070 - inset: 8px;
1071 - border-bottom-color: #ffffff;
1072 - border-left-color: #ffffff;
1073 - animation: qcld-save-settings-spin 0.7s linear infinite reverse;
1074 -}
1075 -@keyframes qcld-save-settings-spin {
1076 - 0% { transform: rotate(0deg); }
1077 - 100% { transform: rotate(360deg); }
1078 -}
1079 1000 .lp-submenu-wpbot_openAi button.swal2-confirm.btn.btn-lg.swal2-styled{
1080 1001 width: auto !important;
1081 1002 }
1082 1003
@@ -1097,9 +1018,9 @@
1097 1018 .wp-chatbot-wrap .form-group input[type=checkbox]+label {
1098 1019 position: relative;
1099 1020 width: 18px;
1100 1021 height: 18px;
1101 - border: 2px solid var(--woobot-primary);
1022 + border: 2px solid #5b4e96;
1102 1023 border-radius: 4px;
1103 1024 top: 0;
1104 1025 left: 0;
1105 1026 transform: translate(0%, 0%);
@@ -1168,9 +1089,9 @@
1168 1089 padding: 0;
1169 1090 display: flex;
1170 1091 flex-direction: column;
1171 1092 align-content: flex-start;
1172 - border: 15px solid var(--woobot-page-bg);
1093 + border: 15px solid #f5f7fd;
1173 1094 border-radius: 16px;
1174 1095 min-height: 480px;
1175 1096 }
1176 1097
@@ -1191,12 +1112,12 @@
1191 1112
1192 1113 .admin-maxwith.qcld-openai-main-box .col-auto.me-auto.ai-settings-title-container {
1193 1114 display: flex;
1194 1115 justify-content: flex-start;
1195 - padding: 8px 20px;
1116 + padding: 20px;
1196 1117 border-radius: 16px;
1197 1118 background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
1198 - margin: 20px 0 0 0;
1119 + margin: 20px 0 20px 0;
1199 1120 gap: 30px;
1200 1121 }
1201 1122
1202 1123 .admin-maxwith.qcld-openai-main-box .tab-content {
@@ -1211,12 +1132,12 @@
1211 1132 padding: 0;
1212 1133 border: none;
1213 1134 box-shadow: none;
1214 1135 background: #fff !important;
1215 - color: var(--woobot-primary) !important;
1136 + color: #5B4E96 !important;
1216 1137 text-decoration: none !important;
1217 1138 border-radius: 8px;
1218 - border: 2px solid var(--woobot-primary);
1139 + border: 2px solid #5B4E96;
1219 1140 }
1220 1141
1221 1142 .admin-maxwith.qcld-openai-main-box div#qcldopenaiaccordion .card h2 {
1222 1143 margin: 0;
@@ -1228,9 +1149,9 @@
1228 1149 font-weight: bold;
1229 1150 display: block;
1230 1151 padding: 15px 12px;
1231 1152 font-size: 16px;
1232 - color: var(--woobot-primary);
1153 + color: #5B4E96;
1233 1154 width: 100%;
1234 1155 text-align: left;
1235 1156 }
1236 1157
@@ -1280,16 +1201,18 @@
1280 1201 font-size: 15px;
1281 1202 }
1282 1203
1283 1204 .admin-maxwith.qcld-openai-main-box .tab-content .alert.alert-info {
1284 - margin: 15px 0 0 0;
1205 + margin: 15px 0 0 15px;
1285 1206 }
1207 +
1208 +
1286 1209 .admin-maxwith.qcld-openai-main-box ul.nav.nav-tabs li a {
1287 1210 padding: 14px 20px;
1288 1211 width: 100%;
1289 1212 font-size: 16px;
1290 1213 font-weight: 500;
1291 - color: var(--woobot-nav-muted);
1214 + color: #988FBD;
1292 1215 border-radius: 8px;
1293 1216 position: relative;
1294 1217 display: flex;
1295 1218 align-items: center;
@@ -1305,15 +1228,15 @@
1305 1228 padding: 14px 20px;
1306 1229 width: 100%;
1307 1230 font-size: 16px;
1308 1231 font-weight: 500;
1309 - color: var(--woobot-nav-muted);
1232 + color: #988FBD;
1310 1233 border-radius: 8px;
1311 1234 position: relative;
1312 1235 display: flex;
1313 1236 align-items: center;
1314 1237 gap: 15px;
1315 - background: var(--woobot-primary);
1238 + background: #5B4E96;
1316 1239 color: #ffffff;
1317 1240 text-decoration: none;
1318 1241 border: none;
1319 1242 margin: 2px 0;
@@ -1324,9 +1247,9 @@
1324 1247 .wp-chatbot-wrap div#wp-chatbot-exclude-post-list input[type=checkbox]+label {
1325 1248 position: relative;
1326 1249 width: 18px;
1327 1250 height: 18px;
1328 - border: 2px solid var(--woobot-primary);
1251 + border: 2px solid #5b4e96;
1329 1252 border-radius: 4px;
1330 1253 top: 0;
1331 1254 left: 0;
1332 1255 transform: translate(0%, 0%);
@@ -1388,9 +1311,9 @@
1388 1311 .qcl-openai input[type=checkbox]+label {
1389 1312 position: relative;
1390 1313 width: 18px;
1391 1314 height: 18px;
1392 - border: 2px solid var(--woobot-primary);
1315 + border: 2px solid #5b4e96;
1393 1316 border-radius: 4px;
1394 1317 top: 0;
1395 1318 left: 0;
1396 1319 transform: translate(0%, 0%);
@@ -1451,9 +1374,9 @@
1451 1374 .qcl-openai label.form-check-label span.pro-badge {
1452 1375 font-size: 9px;
1453 1376 font-weight: 400;
1454 1377 color: #ffffff;
1455 - background: var(--woobot-primary);
1378 + background: #5B4E96;
1456 1379 border-radius: 20px;
1457 1380 padding: 2px 8px;
1458 1381 margin-left: 5px;
1459 1382 text-transform: uppercase;
@@ -1461,9 +1384,9 @@
1461 1384 line-height: 16px;
1462 1385 }
1463 1386
1464 1387 .qcl-openai a#save_setting {
1465 - margin: 0 0 0 0;
1388 + margin: 0 0 15px 0;
1466 1389 }
1467 1390
1468 1391 .qcl-openai div#wp-chatbot-openrouter-settings input[type=checkbox]+label {
1469 1392 position: relative;
@@ -1468,9 +1391,9 @@
1468 1391 .qcl-openai div#wp-chatbot-openrouter-settings input[type=checkbox]+label {
1469 1392 position: relative;
1470 1393 width: 18px;
1471 1394 height: 18px;
1472 - border: 2px solid var(--woobot-primary);
1395 + border: 2px solid #5b4e96;
1473 1396 border-radius: 4px;
1474 1397 top: 0;
1475 1398 left: 0;
1476 1399 transform: translate(0%, 0%);
@@ -1531,9 +1454,9 @@
1531 1454 .qcl-openai div#wp-chatbot-openrouter-settings label.form-check-label span.pro-badge {
1532 1455 font-size: 9px;
1533 1456 font-weight: 400;
1534 1457 color: #ffffff;
1535 - background: var(--woobot-primary);
1458 + background: #5B4E96;
1536 1459 border-radius: 20px;
1537 1460 padding: 2px 8px;
1538 1461 margin-left: 5px;
1539 1462 text-transform: uppercase;
@@ -1564,163 +1487,17 @@
1564 1487 }
1565 1488
1566 1489
1567 1490 .admin-maxwith.qcld-openai-main-box .col-auto.me-auto.ai-settings-title-container h4 {
1568 - width: 365px;
1491 + width: 396px;
1569 1492 }
1570 1493
1571 1494 .admin-maxwith.qcld-openai-main-box .col-auto.me-auto.ai-settings-title-container select {
1572 - display: none;
1495 + border-color: #ffffff;
1496 + width: 220px;
1573 1497 }
1574 1498
1575 -/* Avatar Location Selector */
1576 -.avatar-location-wrapper {
1577 - background: #ffffff;
1578 - border-radius: 12px;
1579 - padding: 0 0 25px 0;
1580 - margin: 0 0 0 0;
1581 -}
1582 1499
1583 -.avatar-location-title {
1584 - font-size: 13px;
1585 - font-weight: 600;
1586 - color: #6B7280;
1587 - margin: 0 0 10px 0;
1588 - text-transform: none;
1589 - letter-spacing: 0;
1590 -}
1591 -
1592 -.avatar-location-cards {
1593 - display: inline-flex;
1594 - gap: 0;
1595 - background: #F3F4F6;
1596 - border-radius: 10px;
1597 - padding: 4px;
1598 -}
1599 -
1600 -.avatar-location-card {
1601 - display: flex;
1602 - align-items: center;
1603 - gap: 6px;
1604 - padding: 8px 18px;
1605 - border-radius: 8px;
1606 - cursor: pointer;
1607 - font-size: 13px;
1608 - font-weight: 500;
1609 - color: #6B7280;
1610 - background: transparent;
1611 - border: none;
1612 - transition: all 0.2s ease;
1613 - user-select: none;
1614 -}
1615 -
1616 -.avatar-location-card:hover {
1617 - color: #374151;
1618 - background: #E5E7EB;
1619 -}
1620 -
1621 -.avatar-location-card.active {
1622 - background: #ffffff;
1623 - color: #111827;
1624 - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
1625 -}
1626 -
1627 -.avatar-location-card svg {
1628 - flex-shrink: 0;
1629 - color: inherit;
1630 -}
1631 -
1632 -.avatar-location-card.active svg {
1633 - color: #4B5563;
1634 -}
1635 -
1636 -/* AI Provider Cards Wrapper */
1637 -.ai-provider-cards-wrapper {
1638 - background: #ffffff;
1639 - border-radius: 12px;
1640 - padding: 20px 24px 20px 6px;
1641 - margin: 0 0 0 0;
1642 -}
1643 -
1644 -.ai-provider-cards {
1645 - display: flex;
1646 - gap: 12px;
1647 - flex-wrap: wrap;
1648 - padding: 4px 0;
1649 -}
1650 -
1651 -.ai-provider-card {
1652 - display: flex;
1653 - flex-direction: column;
1654 - align-items: center;
1655 - justify-content: center;
1656 - gap: 8px;
1657 - padding: 8px 12px;
1658 - min-width: 110px;
1659 - background: #ffffff;
1660 - border: 2px solid #E5E7EB;
1661 - border-radius: 12px;
1662 - cursor: pointer;
1663 - position: relative;
1664 - transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
1665 - user-select: none;
1666 -}
1667 -
1668 -.ai-provider-card:hover {
1669 - border-color: #93C5FD;
1670 - background: #F0F7FF;
1671 - transform: translateY(-2px);
1672 - box-shadow: 0 4px 12px rgba(37, 99, 235, 0.10);
1673 -}
1674 -
1675 -.ai-provider-card.active {
1676 - border-color: #2563EB;
1677 - background: #EFF6FF;
1678 - box-shadow: 0 2px 8px rgba(37, 99, 235, 0.13);
1679 -}
1680 -
1681 -.ai-provider-check {
1682 - position: absolute;
1683 - top: 6px;
1684 - right: 6px;
1685 - opacity: 0;
1686 - transform: scale(0.5);
1687 - transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
1688 - line-height: 0;
1689 -}
1690 -
1691 -.ai-provider-card.active .ai-provider-check {
1692 - opacity: 1;
1693 - transform: scale(1);
1694 -}
1695 -
1696 -.ai-provider-icon {
1697 - width: 40px;
1698 - height: 40px;
1699 - display: flex;
1700 - align-items: center;
1701 - justify-content: center;
1702 -}
1703 -
1704 -.ai-provider-icon svg {
1705 - width: 32px;
1706 - height: 32px;
1707 -}
1708 -
1709 -.ai-provider-name {
1710 - font-size: 12px;
1711 - font-weight: 600;
1712 - color: #4B5563;
1713 - text-align: center;
1714 - white-space: nowrap;
1715 - line-height: 1.2;
1716 -}
1717 -
1718 -.ai-provider-card.active .ai-provider-name {
1719 - color: #1E40AF;
1720 -}
1721 -
1722 -
1723 1500 .admin-maxwith.qcld-openai-main-box .tab-content div#wp-chatbot-openai-training-model .row.my-4 {
1724 1501 font-size: 15px;
1725 1502 display: flex;
1726 1503 width: 100%;
@@ -1803,9 +1580,9 @@
1803 1580 margin: 2px 10px;
1804 1581 font-size: 15px;
1805 1582 font-weight: 500;
1806 1583 border: none;
1807 - background: var(--woobot-primary);
1584 + background: #5b4e96;
1808 1585 color: #fff;
1809 1586 padding: 14px 20px !important;
1810 1587 display: flex;
1811 1588 align-items: center;
@@ -1814,20 +1591,20 @@
1814 1591
1815 1592 .content_qcbot_help_secion .panel-default>.panel-heading {
1816 1593 color: #333;
1817 1594 background-color: #f5f5f5;
1818 - border-color: var(--woobot-primary);
1595 + border-color: #5B4E96;
1819 1596 background: #fff !important;
1820 - color: var(--woobot-primary) !important;
1597 + color: #5B4E96 !important;
1821 1598 text-decoration: none !important;
1822 1599 border-radius: 8px;
1823 - border: 2px solid var(--woobot-primary);
1600 + border: 2px solid #5B4E96;
1824 1601 padding: 0;
1825 1602 }
1826 1603
1827 1604
1828 1605 .content_qcbot_help_secion .panel-default>.panel-heading:hover {
1829 - background: var(--woobot-primary) !important;
1606 + background: #5B4E96 !important;
1830 1607 color: #ffffff !important;
1831 1608 text-decoration: none !important;
1832 1609 border-radius: 8px;
1833 1610 }
@@ -1848,9 +1625,9 @@
1848 1625 display: block;
1849 1626 padding: 15px 12px;
1850 1627 font-size: 16px;
1851 1628 font-weight: bold;
1852 - color: var(--woobot-primary);
1629 + color: #5B4E96;
1853 1630 }
1854 1631
1855 1632 .content_qcbot_help_secion p {
1856 1633 font-size: 15px;
@@ -1940,9 +1717,9 @@
1940 1717 display: block;
1941 1718 padding: 15px 12px;
1942 1719 font-size: 16px;
1943 1720 color: #fff;
1944 - background: var(--woobot-primary);
1721 + background: #5B4E96;
1945 1722 width: 100%;
1946 1723 text-align: left;
1947 1724 }
1948 1725
@@ -1970,12 +1747,12 @@
1970 1747 font-size: 16px;
1971 1748 line-height: 1.71428571;
1972 1749 font-weight: 600;
1973 1750 background: #ffffff;
1974 - color: var(--woobot-primary);
1751 + color: #5b4e96;
1975 1752 text-decoration: none;
1976 1753 white-space: nowrap;
1977 - border: 1px solid var(--woobot-primary);
1754 + border: 1px solid #5b4e96;
1978 1755 padding: 14px 20px !important;
1979 1756 line-height: normal !important;
1980 1757 border-radius: 6px;
1981 1758
@@ -1988,13 +1765,13 @@
1988 1765 margin-left: .5em;
1989 1766 font-size: 16px;
1990 1767 line-height: 1.71428571;
1991 1768 font-weight: 600;
1992 - background: var(--woobot-primary);
1769 + background: #5b4e96;
1993 1770 color: #fff;
1994 1771 text-decoration: none;
1995 1772 white-space: nowrap;
1996 - border: 1px solid var(--woobot-primary);
1773 + border: 1px solid #5b4e96;
1997 1774 padding: 14px 20px !important;
1998 1775 line-height: normal !important;
1999 1776
2000 1777 }
@@ -2016,18 +1793,18 @@
2016 1793 padding: 14px 20px;
2017 1794 width: 100%;
2018 1795 font-size: 16px;
2019 1796 font-weight: 500;
2020 - color: var(--woobot-nav-muted);
1797 + color: #988FBD;
2021 1798 border-radius: 8px;
2022 1799 position: relative;
2023 1800 display: flex;
2024 1801 align-items: center;
2025 1802 gap: 15px;
2026 - background: var(--woobot-primary);
1803 + background: #5B4E96;
2027 1804 color: #ffffff;
2028 1805 text-decoration: none;
2029 - border-color: var(--woobot-primary) !important;
1806 + border-color: #5b4e96 !important;
2030 1807 }
2031 1808
2032 1809
2033 1810
@@ -2040,9 +1817,9 @@
2040 1817 .wp-chatbot-language-center-summmery-checkbox input[type=checkbox]+label {
2041 1818 position: relative;
2042 1819 width: 18px;
2043 1820 height: 18px;
2044 - border: 2px solid var(--woobot-primary);
1821 + border: 2px solid #5b4e96;
2045 1822 border-radius: 4px;
2046 1823 top: 0;
2047 1824 left: 0;
2048 1825 transform: translate(0%, 0%);
@@ -2149,9 +1926,9 @@
2149 1926 text-align: center;
2150 1927 display: flex;
2151 1928 align-items: center;
2152 1929 justify-content: center;
2153 - background: color-mix(in srgb, var(--woobot-primary) 56%, transparent);
1930 + background: #5b4e968f;
2154 1931 color: #ffffff;
2155 1932 font-size: 60px;
2156 1933 border-radius: 8px;
2157 1934 }
@@ -2159,9 +1936,9 @@
2159 1936 text-decoration: none !important;
2160 1937 position: relative;
2161 1938 }
2162 1939 .docs_icon span {
2163 - background: var(--woobot-primary);
1940 + background: #5b4e96;
2164 1941 padding: 25px 25px;
2165 1942 border-radius: 50%;
2166 1943 font-size: 82px;
2167 1944 width: auto;
@@ -2195,14 +1972,14 @@
2195 1972
2196 1973 .wp-chatbot-wrap a.nav-tab.sld_click_handle {
2197 1974 margin-right: .5em;
2198 1975 line-height: 1.42857143;
2199 - border: 1px solid var(--woobot-primary) !important;
1976 + border: 1px solid #5b4e96 !important;
2200 1977 border-radius: 6px !important;
2201 - border: 1px solid var(--woobot-primary) !important;
1978 + border: 1px solid #5b4e96 !important;
2202 1979 padding: 10px 20px !important;
2203 1980 border-radius: 8px !important;
2204 - color: var(--woobot-primary) !important;
1981 + color: #5b4e96 !important;
2205 1982 font-size: 15px !important;
2206 1983 font-weight: 600;
2207 1984 line-height: normal !important;
2208 1985 background: #fff;
@@ -2210,11 +1987,11 @@
2210 1987
2211 1988 .wp-chatbot-wrap a.nav-tab.sld_click_handle:hover, .wp-chatbot-wrap a.nav-tab.sld_click_handle.nav-tab-active{
2212 1989 margin-right: .5em;
2213 1990 line-height: 1.42857143;
2214 - border: 1px solid var(--woobot-primary) !important;
1991 + border: 1px solid #5b4e96 !important;
2215 1992 border-radius: 6px !important;
2216 - border: 1px solid var(--woobot-primary) !important;
1993 + border: 1px solid #5b4e96 !important;
2217 1994 padding: 10px 20px !important;
2218 1995 border-radius: 8px !important;
2219 1996 color: #fff !important;
2220 1997 font-size: 15px !important;
@@ -2219,9 +1996,9 @@
2219 1996 color: #fff !important;
2220 1997 font-size: 15px !important;
2221 1998 font-weight: 600;
2222 1999 line-height: normal !important;
2223 - background: var(--woobot-primary);
2000 + background: #5b4e96;
2224 2001 }
2225 2002
2226 2003
2227 2004
@@ -2251,9 +2028,9 @@
2251 2028 padding: 14px 20px;
2252 2029 width: auto;
2253 2030 font-size: 16px;
2254 2031 font-weight: 500;
2255 - color: var(--woobot-nav-muted);
2032 + color: #988FBD;
2256 2033 border-radius: 8px;
2257 2034 position: relative;
2258 2035 display: flex;
2259 2036 align-items: center;
@@ -2260,9 +2037,9 @@
2260 2037 gap: 15px;
2261 2038 background: #d14529;
2262 2039 color: #ffffff;
2263 2040 text-decoration: none;
2264 - border-color: var(--woobot-primary) !important;
2041 + border-color: #5b4e96 !important;
2265 2042 }
2266 2043
2267 2044
2268 2045 button.swal2-confirm.btn.btn-lg.swal2-styled {
@@ -2272,9 +2049,9 @@
2272 2049 .chatbot-wpbot-lite_page_wpbot button.swal2-deny.swal2-styled {
2273 2050 display: none !important;
2274 2051 }
2275 2052 a#qcld_save_openrouter_setting {
2276 - background: var(--woobot-primary);
2053 + background: #5B4E96;
2277 2054 color: #ffffff;
2278 2055 border: none;
2279 2056 padding: 12px 30px;
2280 2057 }
@@ -2279,9 +2056,9 @@
2279 2056 padding: 12px 30px;
2280 2057 }
2281 2058
2282 2059 a#save_setting {
2283 - background: var(--woobot-primary);
2060 + background: #5B4E96;
2284 2061 color: #ffffff;
2285 2062 border: none;
2286 2063 padding: 12px 30px;
2287 2064 }
@@ -2401,12 +2178,12 @@
2401 2178 width: auto;
2402 2179 font-size: 16px;
2403 2180 align-items: center;
2404 2181 gap: 15px;
2405 - background: var(--woobot-primary);
2182 + background: #5B4E96;
2406 2183 color: #ffffff;
2407 2184 text-decoration: none;
2408 - border-color: var(--woobot-primary) !important;
2185 + border-color: #5b4e96 !important;
2409 2186 }
2410 2187
2411 2188 .wrap.qcld-main-wrapper a:focus {
2412 2189 outline: none !important;
@@ -2420,9 +2197,9 @@
2420 2197
2421 2198
2422 2199 .qcld-general-settings-connection-notic {
2423 2200 background: #eee;
2424 - border: 2px solid var(--woobot-primary);
2201 + border: 2px solid #5b4e96;
2425 2202 border-radius: 8px;
2426 2203 margin: 0 0 15px 0;
2427 2204 padding: 12px;
2428 2205 background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
@@ -2443,9 +2220,9 @@
2443 2220 transition: all 200ms;
2444 2221 font-size: 30px;
2445 2222 font-weight: bold;
2446 2223 text-decoration: none;
2447 - color: var(--woobot-primary);
2224 + color: #5b4e96;
2448 2225 }
2449 2226 .qcld-general-settings-close:hover {
2450 2227 color: orange;
2451 2228 }
@@ -2475,9 +2252,9 @@
2475 2252 font-weight: bold;
2476 2253 }
2477 2254
2478 2255 #qcld-show-more-wrapper-box .qcld-show-more-show-more-height {
2479 - height: 338px;
2256 + height: 190px;
2480 2257 overflow:hidden;
2481 2258 }
2482 2259
2483 2260 #qcld-show-more-wrapper-box .qcld-show-more-show-more i {
@@ -2482,9 +2259,9 @@
2482 2259
2483 2260 #qcld-show-more-wrapper-box .qcld-show-more-show-more i {
2484 2261 display: block;
2485 2262 padding: 0 0 0 0;
2486 - background: var(--woobot-primary);
2263 + background: #5b4e96;
2487 2264 width: 30px;
2488 2265 height: 30px;
2489 2266 line-height: 30px;
2490 2267 border-radius: 50%;
@@ -2496,9 +2273,9 @@
2496 2273 .qcl-openai div#wp-chatbot-gemini-settings input[type=checkbox]+label {
2497 2274 position: relative;
2498 2275 width: 18px;
2499 2276 height: 18px;
2500 - border: 2px solid var(--woobot-primary);
2277 + border: 2px solid #5b4e96;
2501 2278 border-radius: 4px;
2502 2279 top: 0;
2503 2280 left: 0;
2504 2281 transform: translate(0%, 0%);
@@ -2560,9 +2337,9 @@
2560 2337 .qcl-openai div#wp-chatbot-gemini-settings label.form-check-label span.pro-badge {
2561 2338 font-size: 9px;
2562 2339 font-weight: 400;
2563 2340 color: #ffffff;
2564 - background: var(--woobot-primary);
2341 + background: #5B4E96;
2565 2342 border-radius: 20px;
2566 2343 padding: 2px 8px;
2567 2344 margin-left: 5px;
2568 2345 text-transform: uppercase;
@@ -2586,56 +2363,8 @@
2586 2363 textarea#qcld_openai_system_content {
2587 2364 height: 120px;
2588 2365 line-height: 28px;
2589 2366 }
2590 -.qcld-openai-system-presets {
2591 - display: flex;
2592 - gap: 10px;
2593 - margin: 12px 0;
2594 - overflow-x: auto;
2595 - padding-bottom: 8px;
2596 - scroll-snap-type: x proximity;
2597 - flex-wrap: wrap;
2598 -}
2599 -.qcld-openai-system-preset {
2600 - align-items: center;
2601 - border: 1px solid #dcdcde;
2602 - border-radius: 6px;
2603 - cursor: pointer;
2604 - display: flex;
2605 - flex: 0 0 220px;
2606 - gap: 10px;
2607 - justify-content: center;
2608 - margin: 0;
2609 - min-height: 70px;
2610 - padding: 12px;
2611 - scroll-snap-align: start;
2612 - text-align: center;
2613 -}
2614 -.qcld-openai-system-preset input {
2615 - display: none;
2616 -}
2617 -.qcld-openai-system-preset.is-selected {
2618 - background: #f0f6fc;
2619 - border-color: #2271b1;
2620 -}
2621 -.qcld-openai-system-preset-content {
2622 - display: grid;
2623 - gap: 4px;
2624 - line-height: 22px;
2625 -}
2626 -.qcld-openai-system-preset-title {
2627 - color: #1d2327;
2628 - font-weight: 600;
2629 -}
2630 -.qcld-openai-system-preset-value {
2631 - display: none;
2632 -}
2633 -@media (max-width: 782px) {
2634 - .qcld-openai-system-preset {
2635 - flex-basis: 180px;
2636 - }
2637 -}
2638 2367 .qcld-main-wrapper .alert.alert-warning {
2639 2368 background: linear-gradient(130deg, #ffffff 70%, #e9e4ff 96% 96%);
2640 2369 border-radius: 6px;
2641 2370 color: #721c24;
@@ -2654,9 +2383,9 @@
2654 2383 font-weight: bold;
2655 2384 }
2656 2385
2657 2386 a#qcld_save_gemini_setting {
2658 - background: var(--woobot-primary);
2387 + background: #5B4E96;
2659 2388 color: #ffffff;
2660 2389 border: none;
2661 2390 padding: 12px 30px;
2662 2391 }
@@ -2695,9 +2424,9 @@
2695 2424 }
2696 2425
2697 2426 .wp-chatbot-wrap .qc-opt-language-title{
2698 2427 font-weight: bold !important;
2699 - color: var(--woobot-primary) !important;
2428 + color: #5b4e96 !important;
2700 2429 font-size: 16px;
2701 2430 }
2702 2431
2703 2432 button.qcld_chatbot_custom_icon_button.button, button.wp_chatbot_custom_agent_button.button {
@@ -2704,22 +2433,22 @@
2704 2433 padding: 2px 20px;
2705 2434 width: auto;
2706 2435 font-size: 14px;
2707 2436 font-weight: 500;
2708 - color: var(--woobot-nav-muted);
2437 + color: #988FBD;
2709 2438 border-radius: 8px;
2710 2439 background: #fff;
2711 - color: var(--woobot-primary);
2440 + color: #5B4E96;
2712 2441 text-decoration: none;
2713 2442 margin: 0;
2714 - border: 2px solid var(--woobot-primary);
2443 + border: 2px solid #5B4E96;
2715 2444
2716 2445 }
2717 2446
2718 2447 button.qcld_chatbot_custom_icon_button.button:hover, button.wp_chatbot_custom_agent_button.button:hover {
2719 - background: var(--woobot-primary);
2448 + background: #5B4E96;
2720 2449 color: #fff;
2721 - border: 2px solid var(--woobot-primary);
2450 + border: 2px solid #5B4E96;
2722 2451
2723 2452 }
2724 2453
2725 2454
@@ -2785,18 +2514,18 @@
2785 2514 padding: 14px 30px;
2786 2515 width: auto;
2787 2516 font-size: 16px;
2788 2517 font-weight: 500;
2789 - color: var(--woobot-nav-muted);
2518 + color: #988FBD;
2790 2519 border-radius: 8px;
2791 2520 position: relative;
2792 2521 display: inline-block;
2793 2522 align-items: center;
2794 2523 gap: 15px;
2795 - background: var(--woobot-primary);
2524 + background: #5B4E96;
2796 2525 color: #ffffff;
2797 2526 text-decoration: none;
2798 - border-color: var(--woobot-primary) !important;
2527 + border-color: #5b4e96 !important;
2799 2528 line-height: normal;
2800 2529 }
2801 2530 div#wpfooter {
2802 2531 display: none;
@@ -2811,9 +2540,9 @@
2811 2540 padding: 0 0 8px 0;
2812 2541 margin: 20px 0 12px 0;
2813 2542 font-weight: bold;
2814 2543 font-size: 22px !important;
2815 - color: var(--woobot-primary) !important;
2544 + color: #5b4e96 !important;
2816 2545 }
2817 2546
2818 2547 div#rag-sync .wrap h3 {
2819 2548 padding: 0 0 8px 0;
@@ -2819,20 +2548,20 @@
2819 2548 padding: 0 0 8px 0;
2820 2549 margin: 10px 0 12px 0;
2821 2550 font-weight: bold;
2822 2551 font-size: 22px !important;
2823 - color: var(--woobot-primary) !important;
2552 + color: #5b4e96 !important;
2824 2553 }
2825 2554
2826 2555 div#rag-settings h2.nav-tab-wrapper a {
2827 - margin-right: 0;
2556 + margin-right: .5em;
2828 2557 line-height: 1.42857143;
2829 - border: 1px solid var(--woobot-primary);
2558 + border: 1px solid #5b4e96;
2830 2559 border-radius: 6px;
2831 - border: 1px solid var(--woobot-primary);
2560 + border: 1px solid #5b4e96;
2832 2561 padding: 10px 20px !important;
2833 2562 border-radius: 8px;
2834 - color: var(--woobot-primary);
2563 + color: #5b4e96;
2835 2564 font-size: 15px;
2836 2565 font-weight: 600;
2837 2566 line-height: normal !important;
2838 2567 background: #fff;
@@ -2845,11 +2574,11 @@
2845 2574 }
2846 2575
2847 2576 div#rag-settings h2.nav-tab-wrapper a:hover, div#rag-settings h2.nav-tab-wrapper a.nav-tab-active, div#rag-settings h2.nav-tab-wrapper a:focus {
2848 2577 color: #fff;
2849 - background: var(--woobot-primary);
2578 + background: #5b4e96;
2850 2579 text-decoration: none !important;
2851 - border: 1px solid var(--woobot-primary);
2580 + border: 1px solid #5b4e96;
2852 2581 }
2853 2582
2854 2583
2855 2584
@@ -2857,18 +2586,18 @@
2857 2586 padding: 8px 15px;
2858 2587 width: auto;
2859 2588 font-size: 16px;
2860 2589 font-weight: 500;
2861 - color: var(--woobot-nav-muted);
2590 + color: #988FBD;
2862 2591 border-radius: 8px;
2863 2592 position: relative;
2864 2593 display: inline-block;
2865 2594 align-items: center;
2866 2595 gap: 15px;
2867 - background: var(--woobot-primary);
2596 + background: #5B4E96;
2868 2597 color: #ffffff;
2869 2598 text-decoration: none;
2870 - border-color: var(--woobot-primary) !important;
2599 + border-color: #5b4e96 !important;
2871 2600 line-height: normal;
2872 2601 }
2873 2602
2874 2603 div#rag-sync .wrap {
@@ -2892,890 +2621,7 @@
2892 2621
2893 2622 .tablenav-pages {
2894 2623 text-align: right;
2895 2624 padding: 8px 0;
2896 -}
2897 -button#botmaster_submit_sitemap_btn {
2898 - background: var(--woobot-primary);
2899 - border-color: var(--woobot-primary);
2900 -}
2901 -div#rag-database h3 {
2902 - padding: 0 0 8px 0;
2903 - margin: 15px 0 8px 0;
2904 - font-weight: bold;
2905 - font-size: 22px !important;
2906 - color: var(--woobot-primary) !important;
2907 -}
2908 -
2909 -.qcl-openai div#rag-settings h2.nav-tab-wrapper a:focus {
2910 - border: 1px solid var(--woobot-primary) !important;
2911 -}
2912 -button#rag-delete-all {
2913 - background: var(--woobot-primary);
2914 - color: #fff;
2915 - border-color: var(--woobot-primary);
2916 -}
2917 -
2918 -div#rag-database table.widefat {
2919 - border: 1px solid #ffffff;
2920 - box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
2921 -}
2922 -div#rag-database .widefat thead td, div#rag-database .widefat thead th {
2923 - border-bottom: 1px solid #ffffff;
2924 -}
2925 -
2926 -div#rag-database table.widefat thead {
2927 - background: var(--woobot-primary);
2928 - color: #fff;
2929 -}
2930 -div#rag-database table.widefat thead th {
2931 - color: #fff;
2932 -}
2933 -.qcl-openai div#rag-database input[type=checkbox] {
2934 - display: block;
2935 - width: 18px;
2936 - height: 18px;
2937 -}
2938 -div#wp-chatbot-openai-rag input[type=checkbox]+label {
2939 - margin-bottom: 0;
2940 -}
2941 -.qcl-openai input[type=checkbox]+label {
2942 - margin-bottom: 0;
2943 -}
2944 -div#qcld-rag-settings-tab .wrap .mb-3 {
2945 - padding: 5px 0;
2946 -}
2947 -div#rag-database input#search-submit {
2948 - background: var(--woobot-primary);
2949 - color: #fff;
2950 - border-color: var(--woobot-primary);
2951 -}
2952 -.rag_embed_cpts_wrapper {
2953 - display: flex;
2954 - flex-direction: column;
2955 - gap: 6px;
2956 -}
2957 -div#wp-chatbot-gemini-settings .input-group {
2958 - display: flex;
2959 - gap: 10px;
2960 -}
2961 -div#wp-chatbot-grok-settings a#qcld_save_grok_setting {
2962 - background: var(--woobot-primary);
2963 - color: #ffffff;
2964 - border: none;
2965 - padding: 12px 30px;
2966 -}
2967 -button#qcld_gemini_fetch_models {
2968 - background: var(--woobot-primary);
2969 - color: #ffffff;
2970 - border: none;
2971 -}
2972 -.wp-chatbot-wrap label.block.text-sm.font-medium.text-gray-700.mb-2.qc-opt-language-title {
2973 - display: block;
2974 - padding: 0 0 5px 0;
2975 -}
2976 -select#qcld_language_center_select {
2977 - padding: 0 0 0 0;
2978 - margin: 0 0 6px 0;
2979 - padding: 0 4px;
2980 - min-width: 220px;
2981 -}
2982 -select#qcld_language_center_select:focus {
2983 - border-color: var(--woobot-primary);
2984 - color: var(--woobot-primary);
2985 - box-shadow: 0 0 0 1px var(--woobot-primary);
2986 -}
2987 -div#common-ai-settings h2 a {
2988 - background: var(--woobot-primary);
2989 - color: #ffffff;
2990 - display: inline-block !important;
2991 - font-size: 16px;
2992 - padding: 8px 15px;
2993 - border-radius: 8px;
2994 -}
2995 -div#common-ai-settings h2.nav-tab-wrapper {
2996 - border: none;
2997 -}
2998 -div#qcld-rate-settings-tab {
2999 - display: block !important;
3000 -}
3001 -div#common-ai-settings .form-check {
3002 - margin-bottom: 15px;
3003 - border: 0px solid #E5E6F2;
3004 - padding: 12px 12px;
3005 - border-radius: 8px;
3006 -}
3007 -.cxsc-settings-blocks.cxsc-settings-blocks-style input[type=radio]:checked::before {
3008 - width: 1.5rem;
3009 - height: 1.5rem;
3010 - margin: -1px 0 0 -1px;
3011 -}
3012 -.cxsc-settings-blocks.cxsc-settings-blocks-style .radio-inline input[type=radio] {
3013 - width: 1.5rem;
3014 - height: 1.5rem;
3015 -}
3016 -button#rag-docx-submit, button#rag-migrate-btn, button#rag-media-docx-btn, button#qcld-rag-list-docx-btn, button#rag-media-pdf-btn, button#qcld-rag-list-pdf-btn {
3017 - padding: 8px 15px;
3018 - width: auto;
3019 - font-size: 16px;
3020 - font-weight: 500;
3021 - color: var(--woobot-nav-muted);
3022 - border-radius: 8px;
3023 - position: relative;
3024 - display: inline-block;
3025 - align-items: center;
3026 - gap: 15px;
3027 - background: var(--woobot-primary);
3028 - color: #ffffff;
3029 - text-decoration: none;
3030 - border-color: var(--woobot-primary) !important;
3031 - line-height: normal;
3032 -}
3033 -button#botmaster_submit_googlesheet_btn, button#botmaster_submit_googledoc_btn {
3034 - background: var(--woobot-primary);
3035 - border-color: var(--woobot-primary);
3036 -}
3037 -.wpbot-wizard-field select#wizard_ai_provider {
3038 - background: transparent;
3039 - color: #fff;
3040 - width: 100%;
3041 - display: block;
3042 - max-width: unset;
3043 -}
3044 -.wpbot-wizard-field select#wizard_ai_provider:hover {
3045 - border-color: var(--woobot-primary);
3046 - color: var(--woobot-primary);
3047 - box-shadow: 0 0 0 1px var(--woobot-primary);
3048 -}
3049 -div#wizard_api_key_container input#wizard_api_key {
3050 - background: transparent;
3051 - color: #fff;
3052 -}
3053 -div#collapseTwoControl input[type=radio]:checked::before {
3054 - background-color: var(--woobot-primary);
3055 -}
3056 -.nav-tab-wrapper.sld_nav_container.wppt_nav_container.qcld_help_wppt_nav_container{
3057 - width: 320px !important;
3058 - gap: 0;
3059 -}
3060 -div#rag-settings tbody#rag-knowledge-base-list tr td button {
3061 - padding: 6px 20px;
3062 - font-weight: bold;
3063 - font-size: 12px;
3064 -}
3065 -div#rag-settings tbody#rag-knowledge-base-list tr td button.button.button-small.button-link-delete.rag-delete-doc{
3066 - background: #d14529;
3067 - color: #fff;
3068 - border-color: #d14529;
3069 -}
3070 -button#ai-knowledge-base-tab {
3071 - animation: pulse 2s infinite;
3072 -}
3073 -@keyframes pulse {
3074 - 0% {
3075 - transform: scale(1);
3076 - }
3077 - 50% {
3078 - transform: scale(1.05);
3079 - }
3080 - 100% {
3081 - transform: scale(1);
3082 - }
3083 -}
3084 -footer.wp-chatbot-admin-footer input#submit {
3085 - background: var(--woobot-primary);
3086 - padding: 12px 30px;
3087 -}
3088 -footer.wp-chatbot-admin-footer {
3089 - padding: 0 20px 20px 20px;
3090 - margin: 0 20px;
3091 -}
3092 -.qcld-wp-chatbot-wrap-header_inn a.button.page-title-action {
3093 - padding: 8px 15px;
3094 - background: #ffffff;
3095 - color: var(--woobot-primary);
3096 - border: 2px solid var(--woobot-primary);
3097 - border-radius: 6px;
3098 - font-weight: bold;
3099 - position: absolute;
3100 - top: 30px;
3101 - left: 280px;
3102 - line-height: normal;
3103 - min-height: unset;
3104 -}
3105 -.qcld-wp-chatbot-wrap-header_inn a.button.page-title-action:hover {
3106 - padding: 8px 15px;
3107 - background: var(--woobot-primary);
3108 - color: #fff;
3109 - border: 2px solid var(--woobot-primary);
3110 - border-radius: 6px;
3111 - font-weight: bold;
3112 - position: absolute;
3113 - top: 31px;
3114 - left: 280px;
3115 -}
3116 -.qcld-session-history_menu_box .btn.btn-primary {
3117 - background: var(--woobot-primary) !important;
3118 - color: #fff !important;
3119 -}
3120 -.qcld-session-history_menu_box a.btn.btn-success {
3121 - padding: 8px 24px;
3122 - width: auto;
3123 - font-size: 15px;
3124 - font-weight: 500;
3125 - border-radius: 8px;
3126 - position: relative;
3127 - background: #ffffff;
3128 - color: var(--woobot-primary);
3129 - text-decoration: none;
3130 - line-height: normal;
3131 - border: 2px solid var(--woobot-primary);
3132 -}
3133 -.qcld-session-history_menu_box a.btn.btn-success:hover {
3134 - padding: 8px 24px;
3135 - width: auto;
3136 - font-size: 15px;
3137 - font-weight: 500;
3138 - border-radius: 8px;
3139 - position: relative;
3140 - background: var(--woobot-primary);
3141 - color: #fff;
3142 - text-decoration: none;
3143 - line-height: normal;
3144 - border: 2px solid var(--woobot-primary);
3145 -}
3146 -.Expandmore {
3147 - background: #23ab10;
3148 - display: inline-block;
3149 - padding: 4px 10px;
3150 - font-size: 14px;
3151 - border-radius: 6px;
3152 - position: relative;
3153 - top: -15px;
3154 -}
3155 -.Collapsemore {
3156 - background: #ff0000;
3157 - display: inline-block;
3158 - padding: 4px 10px;
3159 - font-size: 14px;
3160 - border-radius: 6px;
3161 - position: relative;
3162 - top: -15px;
3163 -}
3164 -.Expandmore span {
3165 - color: #fff;
3166 - margin: 0 0 0 8px;
3167 - padding: 0 5px;
3168 - font-size: 18px;
3169 -}
3170 -.admin-maxwith.qcld-openai-main-box .col-auto.me-auto.ai-settings-title-container {
3171 - display: flex;
3172 - justify-content: flex-start;
3173 - align-items: center;
3174 -}
3175 -.avatar-location-wrapper {
3176 - padding: 0 0 25px 0;
3177 -}
3178 -.avatar-location-card.active {
3179 - background: var(--woobot-primary);
3180 - color: #ffffff;
3181 -}
3182 -.avatar-location-card.active svg {
3183 - color: #ffffff;
3184 -}
3185 -.ai-provider-cards {
3186 - margin: 0 0 0 0%;
3187 -}
3188 -.qcld-wp-chatbot-wrap-header_inn_heading a.button.page-title-action {
3189 - margin: 0 0 0 4px;
3190 -}
3191 -label.qcld_label_width_full.qcld_label_width_half {
3192 - font-size: 12px;
3193 - padding: 6px 0 0 0;
3194 -}
3195 -.qc_menu_setup_area {
3196 - margin: 40px 0 0 0;
3197 -}
3198 -input#chatbot_content_max_height, input#chatbot_content_max_height_responsive {
3199 - width: 170px;
3200 - border: 1px solid #eee;
3201 - border-radius: 6px;
3202 -}
3203 -.ai-provider-cards-wrapper h4 {
3204 - width: 410px;
3205 -}
3206 -.ai-provider-cards-wrapper {
3207 - display: flex;
3208 -}
3209 -
3210 -/* AI Actions page — match WPBot Control Panel layout */
3211 -body.chatbot-wpbot-lite_page_wpbot_ai_actions,
3212 -body.chatbot-wpbot-lite_page_wbcs-botsessions-page,
3213 -body.wpbot-panel_page_wbcs-botsessions-page {
3214 - background-color: var(--woobot-page-bg);
3215 -}
3216 -
3217 -.wp-chatbot-tabs.qcld-ai-actions-layout {
3218 - display: flex;
3219 - align-items: flex-start;
3220 - gap: 20px;
3221 - overflow: visible;
3222 -}
3223 -
3224 -.wp-chatbot-tabs.qcld-ai-actions-layout > nav {
3225 - width: 240px;
3226 - min-width: 240px;
3227 - flex-shrink: 0;
3228 - float: none;
3229 - margin-right: 0;
3230 - position: sticky;
3231 - top: 32px;
3232 -}
3233 -
3234 -.wp-chatbot-tabs.qcld-ai-actions-layout .content-wrap {
3235 - flex: 1 1 auto;
3236 - min-width: 0;
3237 - width: auto !important;
3238 - float: none;
3239 - padding: 24px;
3240 - background: #fff;
3241 - border-radius: 16px;
3242 -}
3243 -
3244 -.wp-chatbot-tabs.qcld-ai-actions-layout .qcld-ai-actions-playground {
3245 - width: 360px;
3246 - min-width: 320px;
3247 - flex-shrink: 0;
3248 - float: none;
3249 - margin: 0;
3250 - padding: 0;
3251 - background: transparent;
3252 - position: sticky;
3253 - top: 32px;
3254 -}
3255 -
3256 -.qcld-ai-actions-layout .ai-saved-actions-submenu {
3257 - list-style: none;
3258 - margin: 4px 0 0;
3259 - padding: 0 0 6px;
3260 -}
3261 -
3262 -.qcld-ai-actions-layout .ai-saved-actions-submenu li a {
3263 - padding: 10px 12px 10px 48px;
3264 - font-size: 14px;
3265 - font-weight: 500;
3266 - color: var(--woobot-nav-muted);
3267 - border-radius: 8px;
3268 -}
3269 -
3270 -.qcld-ai-actions-layout .ai-saved-actions-submenu li.tab-current a,
3271 -.qcld-ai-actions-layout .ai-saved-actions-submenu li a:hover {
3272 - background: var(--woobot-primary);
3273 - color: #fff;
3274 -}
3275 -
3276 -.qcld-ai-actions-layout .ai-no-saved-actions {
3277 - padding: 8px 12px 8px 48px;
3278 - color: var(--woobot-nav-muted);
3279 - font-size: 13px;
3280 - font-style: italic;
3281 -}
3282 -
3283 -.qcld-ai-actions-layout .ai-sidebar-parent-link {
3284 - position: relative;
3285 -}
3286 -
3287 -.qcld-ai-actions-layout .qcld-ai-saved-toggle {
3288 - margin-left: auto;
3289 - font-size: 16px;
3290 - width: 16px;
3291 - height: 16px;
3292 -}
3293 -
3294 -.qcld-ai-template-grid {
3295 - display: grid;
3296 - grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
3297 - gap: 16px;
3298 - margin-top: 20px;
3299 -}
3300 -
3301 -.qcld-ai-actions-page .ai-template-card {
3302 - background: #fff;
3303 - border: 1px solid #E5E6F2;
3304 - border-radius: 16px;
3305 - padding: 22px 16px;
3306 - cursor: pointer;
3307 - text-align: center;
3308 - transition: all 0.2s ease;
3309 -}
3310 -
3311 -.qcld-ai-actions-page .ai-template-card:hover {
3312 - border-color: var(--woobot-primary);
3313 - box-shadow: 0 8px 20px rgba(var(--woobot-primary-rgb), 0.12);
3314 - transform: translateY(-2px);
3315 - background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
3316 -}
3317 -
3318 -.qcld-ai-actions-page .ai-template-card-icon {
3319 - color: var(--woobot-primary);
3320 - margin-bottom: 12px;
3321 -}
3322 -
3323 -.qcld-ai-actions-page .ai-template-card-icon .dashicons {
3324 - font-size: 36px;
3325 - width: 36px;
3326 - height: 36px;
3327 -}
3328 -
3329 -.qcld-ai-actions-page .ai-template-card h4 {
3330 - margin: 0 0 8px;
3331 - font-size: 15px;
3332 - font-weight: 700;
3333 - color: var(--woobot-primary);
3334 -}
3335 -
3336 -.qcld-ai-actions-page .ai-template-card p {
3337 - margin: 0;
3338 - font-size: 13px;
3339 - color: #6b638f;
3340 - line-height: 1.45;
3341 -}
3342 -
3343 -.qcld-ai-actions-alert {
3344 - color: #fff;
3345 - background: #e64340;
3346 - padding: 12px 16px;
3347 - border-radius: 8px;
3348 - margin-bottom: 20px;
3349 -}
3350 -
3351 -.qcld-ai-action-edit-head {
3352 - display: flex;
3353 - justify-content: space-between;
3354 - align-items: center;
3355 - gap: 12px;
3356 - margin-bottom: 16px;
3357 - border-bottom: 1px solid #E5E6F2;
3358 - padding-bottom: 12px;
3359 -}
3360 -
3361 -.qcld-ai-action-edit-head .qcld-wpbot-main-tabs-title {
3362 - margin: 0;
3363 - border-bottom: 0;
3364 - padding: 0;
3365 -}
3366 -
3367 -.qcld-ai-action-edit-actions {
3368 - display: flex;
3369 - align-items: center;
3370 - gap: 10px;
3371 - flex-wrap: wrap;
3372 - justify-content: flex-end;
3373 -}
3374 -
3375 -.qcld-ai-actions-page .qcld-ai-goto-new-action {
3376 - padding: 10px 18px;
3377 - font-size: 14px;
3378 - line-height: 1.2;
3379 - white-space: nowrap;
3380 -}
3381 -
3382 -.qcld-ai-actions-page .remove-ai-form {
3383 - color: #e64340;
3384 - border: 1px solid #e64340;
3385 - background: #fff;
3386 - border-radius: 8px;
3387 -}
3388 -
3389 -.qcld-ai-actions-page .remove-ai-form:hover {
3390 - background: #e64340;
3391 - color: #fff;
3392 -}
3393 -
3394 -.qcld-ai-actions-page .wpbot-ai-inner-tabs {
3395 - margin-bottom: 20px;
3396 -}
3397 -
3398 -.qcld-ai-history-pro-tab {
3399 - opacity: 0.65;
3400 - cursor: not-allowed !important;
3401 -}
3402 -
3403 -.qcld-ai-actions-page .qc_wpbot_pro {
3404 - background: #e64340;
3405 - color: #fff;
3406 - font-size: 10px;
3407 - padding: 2px 6px;
3408 - border-radius: 4px;
3409 - margin-left: 5px;
3410 - vertical-align: middle;
3411 -}
3412 -
3413 -.qcld-ai-actions-page .form-group label,
3414 -.qcld-ai-actions-page .qcld-ai-email-field label {
3415 - display: block;
3416 - font-weight: 600;
3417 - margin-bottom: 6px;
3418 - color: var(--woobot-primary);
3419 -}
3420 -
3421 -.qcld-ai-actions-page .form-group.qcld-ai-email-toggle {
3422 - display: flex;
3423 - align-items: center;
3424 - border: none;
3425 - padding: 4px 0 10px;
3426 - margin-bottom: 8px;
3427 -}
3428 -
3429 -.qcld-ai-actions-page .wp-chatbot-wrap .form-group.qcld-ai-email-toggle input[type=checkbox] {
3430 - position: absolute;
3431 - opacity: 0;
3432 - width: 1px;
3433 - height: 1px;
3434 - pointer-events: none;
3435 -}
3436 -
3437 -.qcld-ai-actions-page .wp-chatbot-wrap .form-group.qcld-ai-email-toggle input[type=checkbox] + label {
3438 - position: relative;
3439 - display: flex;
3440 - align-items: center;
3441 - width: auto;
3442 - height: auto;
3443 - min-height: 22px;
3444 - margin: 0;
3445 - padding: 0 0 0 34px;
3446 - border: none;
3447 - border-radius: 0;
3448 - text-indent: 0;
3449 - font: 600 16px/22px "DM Sans", sans-serif;
3450 - color: var(--woobot-primary);
3451 - cursor: pointer;
3452 - white-space: nowrap;
3453 - user-select: none;
3454 -}
3455 -
3456 -.qcld-ai-actions-page .wp-chatbot-wrap .form-group.qcld-ai-email-toggle input[type=checkbox] + label:before {
3457 - content: "";
3458 - position: absolute;
3459 - left: 0;
3460 - top: 50%;
3461 - width: 22px;
3462 - height: 22px;
3463 - margin-top: -11px;
3464 - border: 2px solid var(--woobot-primary);
3465 - border-radius: 4px;
3466 - background: #fff;
3467 - box-sizing: border-box;
3468 - transition: all ease-out 200ms;
3469 -}
3470 -
3471 -.qcld-ai-actions-page .wp-chatbot-wrap .form-group.qcld-ai-email-toggle input[type=checkbox] + label:after {
3472 - content: "";
3473 - position: absolute;
3474 - left: 7px;
3475 - top: 8px;
3476 - width: 6px;
3477 - height: 11px;
3478 - margin-top: -7px;
3479 - border-bottom: 2px solid #fff;
3480 - border-right: 2px solid #fff;
3481 - border-left: none;
3482 - transform: rotate(45deg);
3483 - opacity: 0;
3484 - transition: opacity ease-out 200ms;
3485 -}
3486 -
3487 -.qcld-ai-actions-page .wp-chatbot-wrap .form-group.qcld-ai-email-toggle input[type=checkbox]:checked + label {
3488 - border: none;
3489 -}
3490 -
3491 -.qcld-ai-actions-page .wp-chatbot-wrap .form-group.qcld-ai-email-toggle input[type=checkbox]:checked + label:before {
3492 - background: #22b573;
3493 - border-color: #22b573;
3494 -}
3495 -
3496 -.qcld-ai-actions-page .wp-chatbot-wrap .form-group.qcld-ai-email-toggle input[type=checkbox]:checked + label:after {
3497 - opacity: 1;
3498 - width: 6px;
3499 -}
3500 -
3501 -.qcld-ai-actions-page .form-group input[type="text"],
3502 -.qcld-ai-actions-page .form-group textarea,
3503 -.qcld-ai-actions-page .qcld-ai-email-field input[type="text"] {
3504 - width: 100%;
3505 - max-width: 100%;
3506 - border: 1px solid #E5E6F2;
3507 - border-radius: 8px;
3508 - padding: 10px 12px;
3509 -}
3510 -
3511 -.qcld-ai-email-field {
3512 - margin-top: 12px;
3513 -}
3514 -
3515 -.qcld-ai-field-hint,
3516 -.qcld-ai-muted {
3517 - margin: 6px 0 0;
3518 - font-size: 13px;
3519 - color: #888;
3520 - font-style: italic;
3521 -}
3522 -
3523 -.qcld-ai-save-footer {
3524 - display: flex;
3525 - flex-direction: column;
3526 - align-items: flex-start;
3527 - gap: 12px;
3528 - padding: 16px 0 0;
3529 -}
3530 -
3531 -.qcld-ai-save-footer .cxsc-settings-blocks-notic {
3532 - width: 100%;
3533 -}
3534 -
3535 -.qcld-ai-save-footer .cxsc-settings-blocks-notic a {
3536 - color: var(--woobot-primary);
3537 - font-weight: 700;
3538 -}
3539 -
3540 -.qcld-ai-playground {
3541 - background: #fff;
3542 - border-radius: 16px;
3543 - overflow: hidden;
3544 - box-shadow: 0 8px 24px rgba(var(--woobot-primary-rgb), 0.08);
3545 - border: 1px solid #E5E6F2;
3546 -}
3547 -
3548 -.qcld-ai-playground-header {
3549 - background: var(--woobot-primary);
3550 - color: #fff;
3551 - padding: 14px 16px;
3552 - font-weight: 700;
3553 - text-align: center;
3554 - position: relative;
3555 -}
3556 -
3557 -.qcld-ai-playground-header #ai-playground-refresh {
3558 - position: absolute;
3559 - right: 12px;
3560 - top: 10px;
3561 - background: transparent;
3562 - border: none;
3563 - color: #fff;
3564 - cursor: pointer;
3565 - padding: 0;
3566 -}
3567 -
3568 -.qcld-ai-playground-header #ai-playground-refresh .dashicons {
3569 - font-size: 20px;
3570 - width: 20px;
3571 - height: 20px;
3572 -}
3573 -
3574 -#ai-actions-playground-container {
3575 - padding: 16px;
3576 - display: flex;
3577 - flex-direction: column;
3578 - height: 420px;
3579 - overflow-y: auto;
3580 - background: var(--woobot-page-bg);
3581 -}
3582 -
3583 -#ai-actions-playground-messages {
3584 - display: flex;
3585 - flex-direction: column;
3586 - justify-content: flex-end;
3587 - flex: 1;
3588 -}
3589 -
3590 -.qcld-ai-pg-bot-row {
3591 - display: flex;
3592 - gap: 10px;
3593 - align-items: flex-end;
3594 - margin-bottom: 12px;
3595 -}
3596 -
3597 -.qcld-ai-pg-user-row {
3598 - display: flex;
3599 - justify-content: flex-end;
3600 - margin-bottom: 12px;
3601 -}
3602 -
3603 -.qcld-ai-pg-avatar {
3604 - width: 36px;
3605 - height: 36px;
3606 - background: var(--woobot-primary);
3607 - border-radius: 50%;
3608 - flex-shrink: 0;
3609 - background-size: cover;
3610 - background-position: center;
3611 -}
3612 -
3613 -.qcld-ai-pg-bubble {
3614 - background: #fff;
3615 - padding: 12px;
3616 - border-radius: 16px;
3617 - border-bottom-left-radius: 4px;
3618 - box-shadow: 0 2px 6px rgba(var(--woobot-primary-rgb), 0.08);
3619 - width: 100%;
3620 - max-width: 80%;
3621 - font-size: 13px;
3622 - color: #333;
3623 - line-height: 1.45;
3624 - overflow-wrap: break-word;
3625 -}
3626 -
3627 -.qcld-ai-pg-bubble p {
3628 - margin: 0 0 10px;
3629 - font-size: 13px;
3630 -}
3631 -
3632 -.qcld-ai-pg-bubble.is-loading {
3633 - color: var(--woobot-nav-muted);
3634 -}
3635 -
3636 -.qcld-ai-pg-user-bubble {
3637 - background: var(--woobot-primary);
3638 - color: #fff;
3639 - padding: 8px 12px;
3640 - border-radius: 16px;
3641 - border-bottom-right-radius: 4px;
3642 - max-width: 80%;
3643 - font-size: 13px;
3644 -}
3645 -
3646 -#ai-actions-live-preview {
3647 - display: flex;
3648 - flex-wrap: wrap;
3649 - gap: 6px;
3650 -}
3651 -
3652 -.playground-ai-action-btn {
3653 - background: #fff;
3654 - border: 1px solid var(--woobot-primary);
3655 - padding: 6px 12px;
3656 - border-radius: 16px;
3657 - font-size: 12px;
3658 - color: var(--woobot-primary);
3659 - cursor: pointer;
3660 - display: inline-block;
3661 - transition: all 0.2s;
3662 -}
3663 -
3664 -.playground-ai-action-btn:hover {
3665 - background: var(--woobot-primary);
3666 - color: #fff;
3667 -}
3668 -
3669 -.playground-ai-action-btn.is-empty {
3670 - cursor: default;
3671 - border-color: #E5E6F2;
3672 - color: #888;
3673 - background: #f7f7fb;
3674 -}
3675 -
3676 -.playground-ai-action-btn.is-empty:hover {
3677 - background: #f7f7fb;
3678 - color: #888;
3679 -}
3680 -
3681 -.qcld-ai-pg-form-data {
3682 - background: var(--woobot-page-bg);
3683 - padding: 10px;
3684 - border-left: 3px solid var(--woobot-primary);
3685 - margin: 10px 0;
3686 - border-radius: 6px;
3687 -}
3688 -
3689 -.qcld-ai-pg-form-data strong {
3690 - display: block;
3691 - margin-bottom: 5px;
3692 - color: var(--woobot-primary);
3693 - text-transform: capitalize;
3694 -}
3695 -
3696 -.qcld-ai-pg-form-data ul {
3697 - margin: 0;
3698 - padding-left: 15px;
3699 - font-size: 13px;
3700 - color: #333;
3701 -}
3702 -
3703 -.qcld-ai-playground-footer {
3704 - padding: 12px;
3705 - background: #fff;
3706 - border-top: 1px solid #E5E6F2;
3707 - display: flex;
3708 - gap: 8px;
3709 - align-items: center;
3710 -}
3711 -
3712 -.qcld-ai-playground-footer #playground-input {
3713 - width: 100%;
3714 - background: var(--woobot-page-bg);
3715 - border: 1px solid #E5E6F2;
3716 - border-radius: 20px;
3717 - padding: 10px 14px;
3718 - color: #333;
3719 - font-size: 13px;
3720 - outline: none;
3721 -}
3722 -
3723 -.qcld-ai-playground-footer #playground-send-btn {
3724 - border: none;
3725 - border-radius: 50%;
3726 - width: 40px;
3727 - height: 40px;
3728 - background: var(--woobot-primary);
3729 - color: #fff;
3730 - cursor: pointer;
3731 - display: flex;
3732 - align-items: center;
3733 - justify-content: center;
3734 - flex-shrink: 0;
3735 -}
3736 -
3737 -.qcld-ai-playground-footer #playground-send-btn .dashicons {
3738 - font-size: 18px;
3739 - width: 18px;
3740 - height: 18px;
3741 - line-height: 1;
3742 -}
3743 -
3744 -.qcld-ai-actions-page .ai-content-pane {
3745 - animation: qcldAiFadeIn 0.3s ease-in-out;
3746 -}
3747 -
3748 -div#ai-saved-actions-container h2.nav-tab-wrapper.wpbot-ai-inner-tabs {
3749 - padding: 0 0 12px 0;
3750 - border: none;
3751 -}
3752 -
3753 -@keyframes qcldAiFadeIn {
3754 - from { opacity: 0; transform: translateY(5px); }
3755 - to { opacity: 1; transform: translateY(0); }
3756 -}
3757 -
3758 -@media (max-width: 1280px) {
3759 - .wp-chatbot-tabs.qcld-ai-actions-layout .content-wrap {
3760 - width: auto !important;
3761 - }
3762 - .wp-chatbot-tabs.qcld-ai-actions-layout .qcld-ai-actions-playground {
3763 - width: 300px;
3764 - min-width: 280px;
3765 - }
3766 -}
3767 -
3768 -@media (max-width: 992px) {
3769 - .wp-chatbot-tabs.qcld-ai-actions-layout {
3770 - flex-wrap: wrap;
3771 - }
3772 - .wp-chatbot-tabs.qcld-ai-actions-layout > nav,
3773 - .wp-chatbot-tabs.qcld-ai-actions-layout .content-wrap,
3774 - .wp-chatbot-tabs.qcld-ai-actions-layout .qcld-ai-actions-playground {
3775 - width: 100% !important;
3776 - min-width: 0;
3777 - position: static;
3778 - }
3779 2625 }
3780 2626
3781 2627