← All changes | css/admin-style.css +135 -1505 8.7.8 → 7.2.5 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,25 +103,25 @@
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
146	118	.wp-chatbot-tabs nav ul li a {
147		- padding: 14px 15px;
	119	+ padding: 14px 20px;
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;
		@@ -169,13 +141,13 @@
169	141	}
170	142
171	143
172	144	.wp-chatbot-tabs nav .cxsc-settings_openai_border a {
173		- padding: 14px 15px;
	145	+ padding: 14px 20px;
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	}
		@@ -526,16 +498,15 @@
526	498	display: block;
527	499	}
528	500
529	501	div#wp-chatbot-icon-theme-settings input[type=radio]:checked::before {
530		- content: "\f12a";
531		- font-family: dashicons;
532		-
	502	+ content: "\f058";
	503	+ font: normal normal normal 14px / 1 FontAwesome;
533	504	border-radius: 0;
534	505	width: 100%;
535	506	height: 100%;
536	507	margin: 0;
537		- background-color: color-mix(in srgb, var(--woobot-primary) 74%, transparent) !important;
	508	+ background-color: #5b4e96bd !important;
538	509	line-height: 1.14285714;
539	510	position: absolute;
540	511	top: 0;
541	512	left: 0;
		@@ -644,12 +615,12 @@
644	615	object-fit: cover;
645	616	}
646	617
647	618	.wpbot_single_addon a.button.button-secondary {
648		- background: var(--woobot-primary);
	619	+ background: #5B4E96;
649	620	color: #ffffff;
650	621	text-decoration: none;
651		- border: 1px solid var(--woobot-primary);
	622	+ border: 1px solid #5B4E96;
652	623	}
653	624
654	625	.wp-chatbot-wrap .wpbot_single_addon p {
655	626	font-size: 14px;
		@@ -677,25 +648,21 @@
677	648	position: relative;
678	649	}
679	650
680	651	section.wp-chatbot-tab-container-inner h4.panel-title a.collapsed:after {
681		- content: "\f10f";
682		- font-family: dashicons;
	652	+ font: normal normal normal 24px / 1 FontAwesome;
	653	+ content: "\f055";
683	654	position: absolute;
684	655	right: 18px;
685	656	top: 12px;
686		- font-size: 25px;
687		- font-weight: normal;
688	657	}
689	658
690	659	section.wp-chatbot-tab-container-inner h4.panel-title a:after {
691		- content: "\f14f";
692		- font-family: dashicons;
	660	+ font: normal normal normal 24px / 1 FontAwesome;
	661	+ content: "\f056";
693	662	position: absolute;
694	663	right: 18px;
695	664	top: 12px;
696		- font-size: 25px;
697		- font-weight: normal;
698	665	}
699	666
700	667	.wpbot_single_addon_wrapper .wpbot_single_addon .wpbot_single_content:hover {
701	668	background: linear-gradient(1deg, #ffffff 70%, #e9e4ff 96%);
		@@ -735,11 +702,11 @@
735	702	}
736	703
737	704
738	705	.qcld-wp-chatbot-wrap-header-doc-details a {
739		- border: 2px solid var(--woobot-primary);
	706	+ border: 2px solid #5b4e96;
740	707	background: #fff;
741		- color: var(--woobot-primary);
	708	+ color: #5b4e96;
742	709	padding: 8px 20px;
743	710	border-radius: 8px;
744	711	display: inline-block;
745	712	margin: 4px 0 0 0;
		@@ -745,10 +712,10 @@
745	712	margin: 4px 0 0 0;
746	713	}
747	714
748	715	.qcld-wp-chatbot-wrap-header-doc-details a:hover {
749		- border: 2px solid var(--woobot-primary);
750		- background: var(--woobot-primary);
	716	+ border: 2px solid #5b4e96;
	717	+ background: #5b4e96;
751	718	color: #fff;
752	719	padding: 8px 20px;
753	720	border-radius: 8px;
754	721	display: inline-block;
		@@ -789,9 +756,9 @@
789	756	display: block;
790	757	display: flex !important;
791	758	align-items: center;
792	759	gap: 8px;
793		- background: var(--woobot-primary);
	760	+ background: #5B4E96;
794	761	padding: 10px 25px !important;
795	762	border-radius: 8px;
796	763	width: 100%;
797	764	justify-content: center;
		@@ -835,15 +802,15 @@
835	802	padding: 14px 20px;
836	803	width: auto;
837	804	font-size: 16px;
838	805	font-weight: 500;
839		- color: var(--woobot-nav-muted);
	806	+ color: #988FBD;
840	807	border-radius: 8px;
841	808	position: relative;
842	809	display: inline-block;
843	810	align-items: center;
844	811	gap: 15px;
845		- background: var(--woobot-primary);
	812	+ background: #5B4E96;
846	813	color: #ffffff;
847	814	text-decoration: none;
848	815	}
849	816
		@@ -972,9 +939,9 @@
972	939	padding: 12px;
973	940	}
974	941
975	942	.qc_menu_area_box ul li span {
976		- background-image: linear-gradient(to right, #868afa 0%, var(--woobot-primary) 51%, var(--woobot-primary) 100%);
	943	+ background-image: linear-gradient(to right, #868afa 0%, #5b4e96 51%, #5b4e96 100%);
977	944	box-shadow: 0 5px 15px #c3c3c3;
978	945	border: 1px solid #ffffff;
979	946	color: #fff;
980	947	display: block;
		@@ -982,9 +949,9 @@
982	949	padding: 12px 30px;
983	950	}
984	951
985	952	.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%);
	953	+ background-image: linear-gradient(to right, #868afa 0%, #5b4e96 51%, #5b4e96 100%);
987	954	box-shadow: 0 5px 15px #c3c3c3;
988	955	border: 1px solid #ffffff;
989	956	color: #fff;
990	957	display: block;
		@@ -993,9 +960,9 @@
993	960	}
994	961
995	962	.qc_menu_area_box .qc_menu_area_container span:hover,
996	963	.qc_menu_area_box ul li span:hover {
997		- background-image: linear-gradient(to right, var(--woobot-primary) 0%, #868afa 51%, #868afa 100%);
	964	+ background-image: linear-gradient(to right, #5b4e96 0%, #868afa 51%, #868afa 100%);
998	965	}
999	966
1000	967	.qc_menu_list_container {
1001	968	position: relative;
		@@ -1024,59 +991,8 @@
1024	991	.lp-submenu-wpbot_openAi .swal2-actions {
1025	992	display: flex;
1026	993	width: auto;
1027	994	}
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	995	.lp-submenu-wpbot_openAi button.swal2-confirm.btn.btn-lg.swal2-styled{
1080	996	width: auto !important;
1081	997	}
1082	998
		@@ -1097,9 +1013,9 @@
1097	1013	.wp-chatbot-wrap .form-group input[type=checkbox]+label {
1098	1014	position: relative;
1099	1015	width: 18px;
1100	1016	height: 18px;
1101		- border: 2px solid var(--woobot-primary);
	1017	+ border: 2px solid #5b4e96;
1102	1018	border-radius: 4px;
1103	1019	top: 0;
1104	1020	left: 0;
1105	1021	transform: translate(0%, 0%);
		@@ -1168,9 +1084,9 @@
1168	1084	padding: 0;
1169	1085	display: flex;
1170	1086	flex-direction: column;
1171	1087	align-content: flex-start;
1172		- border: 15px solid var(--woobot-page-bg);
	1088	+ border: 15px solid #f5f7fd;
1173	1089	border-radius: 16px;
1174	1090	min-height: 480px;
1175	1091	}
1176	1092
		@@ -1191,13 +1107,12 @@
1191	1107
1192	1108	.admin-maxwith.qcld-openai-main-box .col-auto.me-auto.ai-settings-title-container {
1193	1109	display: flex;
1194	1110	justify-content: flex-start;
1195		- padding: 8px 20px;
	1111	+ padding: 20px;
1196	1112	border-radius: 16px;
1197	1113	background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
1198		- margin: 20px 0 0 0;
1199		- gap: 30px;
	1114	+ margin: 20px 0 20px 0;
1200	1115	}
1201	1116
1202	1117	.admin-maxwith.qcld-openai-main-box .tab-content {
1203	1118	padding: 0 12px 0 12px;
		@@ -1211,12 +1126,12 @@
1211	1126	padding: 0;
1212	1127	border: none;
1213	1128	box-shadow: none;
1214	1129	background: #fff !important;
1215		- color: var(--woobot-primary) !important;
	1130	+ color: #5B4E96 !important;
1216	1131	text-decoration: none !important;
1217	1132	border-radius: 8px;
1218		- border: 2px solid var(--woobot-primary);
	1133	+ border: 2px solid #5B4E96;
1219	1134	}
1220	1135
1221	1136	.admin-maxwith.qcld-openai-main-box div#qcldopenaiaccordion .card h2 {
1222	1137	margin: 0;
		@@ -1228,9 +1143,9 @@
1228	1143	font-weight: bold;
1229	1144	display: block;
1230	1145	padding: 15px 12px;
1231	1146	font-size: 16px;
1232		- color: var(--woobot-primary);
	1147	+ color: #5B4E96;
1233	1148	width: 100%;
1234	1149	text-align: left;
1235	1150	}
1236	1151
		@@ -1235,27 +1150,22 @@
1235	1150	}
1236	1151
1237	1152
1238	1153	.admin-maxwith.qcld-openai-main-box button.btn.btn-link:after {
1239		- content: "\f14f";
1240		- font-family: dashicons;
	1154	+ font: normal normal normal 24px / 1 FontAwesome;
	1155	+ content: "\f056";
1241	1156	position: absolute;
1242	1157	right: 18px;
1243	1158	top: 12px;
1244		- font-size: 22px;
1245		- font-weight: normal;
1246	1159	}
1247	1160
1248	1161
1249	1162	.admin-maxwith.qcld-openai-main-box button.btn.btn-link.collapsed:after{
1250		-
1251		- content: "\f10f";
1252		- font-family: dashicons;
	1163	+ font: normal normal normal 24px / 1 FontAwesome;
	1164	+ content: "\f055";
1253	1165	position: absolute;
1254	1166	right: 18px;
1255	1167	top: 12px;
1256		- font-size: 22px;
1257		- font-weight: normal;
1258	1168	}
1259	1169
1260	1170
1261	1171	.admin-maxwith.qcld-openai-main-box .btn.active.focus,
		@@ -1280,16 +1190,18 @@
1280	1190	font-size: 15px;
1281	1191	}
1282	1192
1283	1193	.admin-maxwith.qcld-openai-main-box .tab-content .alert.alert-info {
1284		- margin: 15px 0 0 0;
	1194	+ margin: 15px 0 0 15px;
1285	1195	}
	1196	+
	1197	+
1286	1198	.admin-maxwith.qcld-openai-main-box ul.nav.nav-tabs li a {
1287	1199	padding: 14px 20px;
1288	1200	width: 100%;
1289	1201	font-size: 16px;
1290	1202	font-weight: 500;
1291		- color: var(--woobot-nav-muted);
	1203	+ color: #988FBD;
1292	1204	border-radius: 8px;
1293	1205	position: relative;
1294	1206	display: flex;
1295	1207	align-items: center;
		@@ -1305,15 +1217,15 @@
1305	1217	padding: 14px 20px;
1306	1218	width: 100%;
1307	1219	font-size: 16px;
1308	1220	font-weight: 500;
1309		- color: var(--woobot-nav-muted);
	1221	+ color: #988FBD;
1310	1222	border-radius: 8px;
1311	1223	position: relative;
1312	1224	display: flex;
1313	1225	align-items: center;
1314	1226	gap: 15px;
1315		- background: var(--woobot-primary);
	1227	+ background: #5B4E96;
1316	1228	color: #ffffff;
1317	1229	text-decoration: none;
1318	1230	border: none;
1319	1231	margin: 2px 0;
		@@ -1324,9 +1236,9 @@
1324	1236	.wp-chatbot-wrap div#wp-chatbot-exclude-post-list input[type=checkbox]+label {
1325	1237	position: relative;
1326	1238	width: 18px;
1327	1239	height: 18px;
1328		- border: 2px solid var(--woobot-primary);
	1240	+ border: 2px solid #5b4e96;
1329	1241	border-radius: 4px;
1330	1242	top: 0;
1331	1243	left: 0;
1332	1244	transform: translate(0%, 0%);
		@@ -1384,13 +1296,13 @@
1384	1296	.qcld-main-wrapper div#headingTwoControl a {
1385	1297	font-weight: bold;
1386	1298	}
1387	1299
1388		-.qcl-openai input[type=checkbox]+label {
	1300	+.qcl-openai div#wp-chatbot-openai-settings input[type=checkbox]+label {
1389	1301	position: relative;
1390	1302	width: 18px;
1391	1303	height: 18px;
1392		- border: 2px solid var(--woobot-primary);
	1304	+ border: 2px solid #5b4e96;
1393	1305	border-radius: 4px;
1394	1306	top: 0;
1395	1307	left: 0;
1396	1308	transform: translate(0%, 0%);
		@@ -1403,13 +1315,13 @@
1403	1315	-ms-user-select: none;
1404	1316	user-select: none;
1405	1317	display: flex;
1406	1318	align-items: center;
1407		- margin-bottom: 10px;
	1319	+ margin-bottom: 0;
1408	1320	line-height: 30px;
1409	1321	}
1410	1322
1411		-.qcl-openai input[type=checkbox]+label:after {
	1323	+.qcl-openai div#wp-chatbot-openai-settings input[type=checkbox]+label:after {
1412	1324	content: "";
1413	1325	position: absolute;
1414	1326	width: 0px;
1415	1327	height: 8px;
		@@ -1422,23 +1334,23 @@
1422	1334	opacity: 0;
1423	1335	transition: all ease-out 200ms;
1424	1336	}
1425	1337
1426		-.qcl-openai input[type=checkbox]:checked+label {
	1338	+.qcl-openai div#wp-chatbot-openai-settings input[type=checkbox]:checked+label {
1427	1339	border: 2px solid #22b573;
1428	1340	}
1429	1341
1430		-.qcl-openai input[type=checkbox]:checked+label:after {
	1342	+.qcl-openai div#wp-chatbot-openai-settings input[type=checkbox]:checked+label:after {
1431	1343	opacity: 1;
1432	1344	width: 22px;
1433	1345	}
1434	1346
1435		-.qcl-openai input[type=checkbox] {
	1347	+.qcl-openai div#wp-chatbot-openai-settings input[type=checkbox] {
1436	1348	display: none;
1437	1349	}
1438	1350
1439	1351
1440		-.qcl-openai .form-check {
	1352	+.qcl-openai div#wp-chatbot-openai-settings .form-check {
1441	1353	margin-bottom: 15px;
1442	1354	border: 1px solid #E5E6F2;
1443	1355	padding: 12px 12px;
1444	1356	border-radius: 8px;
		@@ -1443,17 +1355,17 @@
1443	1355	padding: 12px 12px;
1444	1356	border-radius: 8px;
1445	1357	}
1446	1358
1447		-.qcl-openai label.form-check-label span {
	1359	+.qcl-openai div#wp-chatbot-openai-settings label.form-check-label span {
1448	1360	font-size: 12px;
1449	1361	}
1450	1362
1451		-.qcl-openai label.form-check-label span.pro-badge {
	1363	+.qcl-openai div#wp-chatbot-openai-settings label.form-check-label span.pro-badge {
1452	1364	font-size: 9px;
1453	1365	font-weight: 400;
1454	1366	color: #ffffff;
1455		- background: var(--woobot-primary);
	1367	+ background: #5B4E96;
1456	1368	border-radius: 20px;
1457	1369	padding: 2px 8px;
1458	1370	margin-left: 5px;
1459	1371	text-transform: uppercase;
		@@ -1460,10 +1372,10 @@
1460	1372	text-indent: initial;
1461	1373	line-height: 16px;
1462	1374	}
1463	1375
1464		-.qcl-openai a#save_setting {
1465		- margin: 0 0 0 0;
	1376	+.qcl-openai div#wp-chatbot-openai-settings a#save_setting {
	1377	+ margin: 0 0 15px 0;
1466	1378	}
1467	1379
1468	1380	.qcl-openai div#wp-chatbot-openrouter-settings input[type=checkbox]+label {
1469	1381	position: relative;
		@@ -1468,9 +1380,9 @@
1468	1380	.qcl-openai div#wp-chatbot-openrouter-settings input[type=checkbox]+label {
1469	1381	position: relative;
1470	1382	width: 18px;
1471	1383	height: 18px;
1472		- border: 2px solid var(--woobot-primary);
	1384	+ border: 2px solid #5b4e96;
1473	1385	border-radius: 4px;
1474	1386	top: 0;
1475	1387	left: 0;
1476	1388	transform: translate(0%, 0%);
		@@ -1531,9 +1443,9 @@
1531	1443	.qcl-openai div#wp-chatbot-openrouter-settings label.form-check-label span.pro-badge {
1532	1444	font-size: 9px;
1533	1445	font-weight: 400;
1534	1446	color: #ffffff;
1535		- background: var(--woobot-primary);
	1447	+ background: #5B4E96;
1536	1448	border-radius: 20px;
1537	1449	padding: 2px 8px;
1538	1450	margin-left: 5px;
1539	1451	text-transform: uppercase;
		@@ -1564,163 +1476,17 @@
1564	1476	}
1565	1477
1566	1478
1567	1479	.admin-maxwith.qcld-openai-main-box .col-auto.me-auto.ai-settings-title-container h4 {
1568		- width: 365px;
	1480	+ width: 396px;
1569	1481	}
1570	1482
1571	1483	.admin-maxwith.qcld-openai-main-box .col-auto.me-auto.ai-settings-title-container select {
1572		- display: none;
	1484	+ border-color: #ffffff;
	1485	+ width: 220px;
1573	1486	}
1574	1487
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	1488
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	1489	.admin-maxwith.qcld-openai-main-box .tab-content div#wp-chatbot-openai-training-model .row.my-4 {
1724	1490	font-size: 15px;
1725	1491	display: flex;
1726	1492	width: 100%;
		@@ -1803,9 +1569,9 @@
1803	1569	margin: 2px 10px;
1804	1570	font-size: 15px;
1805	1571	font-weight: 500;
1806	1572	border: none;
1807		- background: var(--woobot-primary);
	1573	+ background: #5b4e96;
1808	1574	color: #fff;
1809	1575	padding: 14px 20px !important;
1810	1576	display: flex;
1811	1577	align-items: center;
		@@ -1814,20 +1580,20 @@
1814	1580
1815	1581	.content_qcbot_help_secion .panel-default>.panel-heading {
1816	1582	color: #333;
1817	1583	background-color: #f5f5f5;
1818		- border-color: var(--woobot-primary);
	1584	+ border-color: #5B4E96;
1819	1585	background: #fff !important;
1820		- color: var(--woobot-primary) !important;
	1586	+ color: #5B4E96 !important;
1821	1587	text-decoration: none !important;
1822	1588	border-radius: 8px;
1823		- border: 2px solid var(--woobot-primary);
	1589	+ border: 2px solid #5B4E96;
1824	1590	padding: 0;
1825	1591	}
1826	1592
1827	1593
1828	1594	.content_qcbot_help_secion .panel-default>.panel-heading:hover {
1829		- background: var(--woobot-primary) !important;
	1595	+ background: #5B4E96 !important;
1830	1596	color: #ffffff !important;
1831	1597	text-decoration: none !important;
1832	1598	border-radius: 8px;
1833	1599	}
		@@ -1848,9 +1614,9 @@
1848	1614	display: block;
1849	1615	padding: 15px 12px;
1850	1616	font-size: 16px;
1851	1617	font-weight: bold;
1852		- color: var(--woobot-primary);
	1618	+ color: #5B4E96;
1853	1619	}
1854	1620
1855	1621	.content_qcbot_help_secion p {
1856	1622	font-size: 15px;
		@@ -1856,25 +1622,21 @@
1856	1622	font-size: 15px;
1857	1623	}
1858	1624
1859	1625	.content_qcbot_help_secion .panel-title a.collapsed:after {
1860		- content: "\f10f";
	1626	+ font: normal normal normal 24px / 1 FontAwesome;
	1627	+ content: "\f055";
1861	1628	position: absolute;
1862	1629	right: 18px;
1863	1630	top: 12px;
1864		- font-family: dashicons;
1865		- font-size: 24PX;
1866		- font-weight: normal;
1867	1631	}
1868	1632
1869	1633	.content_qcbot_help_secion .panel-title a:after {
1870		- content: "\f14f";
	1634	+ font: normal normal normal 24px / 1 FontAwesome;
	1635	+ content: "\f056";
1871	1636	position: absolute;
1872	1637	right: 18px;
1873	1638	top: 12px;
1874		- font-family: dashicons;
1875		- font-size: 24PX;
1876		- font-weight: normal;
1877	1639	}
1878	1640
1879	1641
1880	1642	.content_qcbot_help_secion .panel-default>.panel-heading+.panel-collapse>.panel-body {
		@@ -1940,9 +1702,9 @@
1940	1702	display: block;
1941	1703	padding: 15px 12px;
1942	1704	font-size: 16px;
1943	1705	color: #fff;
1944		- background: var(--woobot-primary);
	1706	+ background: #5B4E96;
1945	1707	width: 100%;
1946	1708	text-align: left;
1947	1709	}
1948	1710
		@@ -1970,12 +1732,12 @@
1970	1732	font-size: 16px;
1971	1733	line-height: 1.71428571;
1972	1734	font-weight: 600;
1973	1735	background: #ffffff;
1974		- color: var(--woobot-primary);
	1736	+ color: #5b4e96;
1975	1737	text-decoration: none;
1976	1738	white-space: nowrap;
1977		- border: 1px solid var(--woobot-primary);
	1739	+ border: 1px solid #5b4e96;
1978	1740	padding: 14px 20px !important;
1979	1741	line-height: normal !important;
1980	1742	border-radius: 6px;
1981	1743
		@@ -1988,13 +1750,13 @@
1988	1750	margin-left: .5em;
1989	1751	font-size: 16px;
1990	1752	line-height: 1.71428571;
1991	1753	font-weight: 600;
1992		- background: var(--woobot-primary);
	1754	+ background: #5b4e96;
1993	1755	color: #fff;
1994	1756	text-decoration: none;
1995	1757	white-space: nowrap;
1996		- border: 1px solid var(--woobot-primary);
	1758	+ border: 1px solid #5b4e96;
1997	1759	padding: 14px 20px !important;
1998	1760	line-height: normal !important;
1999	1761
2000	1762	}
		@@ -2016,18 +1778,18 @@
2016	1778	padding: 14px 20px;
2017	1779	width: 100%;
2018	1780	font-size: 16px;
2019	1781	font-weight: 500;
2020		- color: var(--woobot-nav-muted);
	1782	+ color: #988FBD;
2021	1783	border-radius: 8px;
2022	1784	position: relative;
2023	1785	display: flex;
2024	1786	align-items: center;
2025	1787	gap: 15px;
2026		- background: var(--woobot-primary);
	1788	+ background: #5B4E96;
2027	1789	color: #ffffff;
2028	1790	text-decoration: none;
2029		- border-color: var(--woobot-primary) !important;
	1791	+ border-color: #5b4e96 !important;
2030	1792	}
2031	1793
2032	1794
2033	1795
		@@ -2040,9 +1802,9 @@
2040	1802	.wp-chatbot-language-center-summmery-checkbox input[type=checkbox]+label {
2041	1803	position: relative;
2042	1804	width: 18px;
2043	1805	height: 18px;
2044		- border: 2px solid var(--woobot-primary);
	1806	+ border: 2px solid #5b4e96;
2045	1807	border-radius: 4px;
2046	1808	top: 0;
2047	1809	left: 0;
2048	1810	transform: translate(0%, 0%);
		@@ -2131,9 +1893,9 @@
2131	1893	display: inline-block;
2132	1894	min-width: 310px;
2133	1895	margin: 0;
2134	1896	}
2135		-#rotationloader
	1897	+#rotationloader.fa.fa-spinner
2136	1898	{
2137	1899	display: none;
2138	1900	rotate: initial;
2139	1901	-webkit-animation: rotation 2s infinite linear;
		@@ -2149,9 +1911,9 @@
2149	1911	text-align: center;
2150	1912	display: flex;
2151	1913	align-items: center;
2152	1914	justify-content: center;
2153		- background: color-mix(in srgb, var(--woobot-primary) 56%, transparent);
	1915	+ background: #5b4e968f;
2154	1916	color: #ffffff;
2155	1917	font-size: 60px;
2156	1918	border-radius: 8px;
2157	1919	}
		@@ -2158,15 +1920,12 @@
2158	1920	a.qcld-wp-chatbot-wrap--doc_logo {
2159	1921	text-decoration: none !important;
2160	1922	position: relative;
2161	1923	}
2162		-.docs_icon span {
2163		- background: var(--woobot-primary);
	1924	+.docs_icon i {
	1925	+ background: #5b4e96;
2164	1926	padding: 25px 25px;
2165	1927	border-radius: 50%;
2166		- font-size: 82px;
2167		- width: auto;
2168		- height: auto;
2169	1928	}
2170	1929
2171	1930
2172	1931	/* .lp-submenu-wpbot_openAi button.swal2-deny.swal2-styled {
		@@ -2195,14 +1954,14 @@
2195	1954
2196	1955	.wp-chatbot-wrap a.nav-tab.sld_click_handle {
2197	1956	margin-right: .5em;
2198	1957	line-height: 1.42857143;
2199		- border: 1px solid var(--woobot-primary) !important;
	1958	+ border: 1px solid #5b4e96 !important;
2200	1959	border-radius: 6px !important;
2201		- border: 1px solid var(--woobot-primary) !important;
	1960	+ border: 1px solid #5b4e96 !important;
2202	1961	padding: 10px 20px !important;
2203	1962	border-radius: 8px !important;
2204		- color: var(--woobot-primary) !important;
	1963	+ color: #5b4e96 !important;
2205	1964	font-size: 15px !important;
2206	1965	font-weight: 600;
2207	1966	line-height: normal !important;
2208	1967	background: #fff;
		@@ -2210,11 +1969,11 @@
2210	1969
2211	1970	.wp-chatbot-wrap a.nav-tab.sld_click_handle:hover, .wp-chatbot-wrap a.nav-tab.sld_click_handle.nav-tab-active{
2212	1971	margin-right: .5em;
2213	1972	line-height: 1.42857143;
2214		- border: 1px solid var(--woobot-primary) !important;
	1973	+ border: 1px solid #5b4e96 !important;
2215	1974	border-radius: 6px !important;
2216		- border: 1px solid var(--woobot-primary) !important;
	1975	+ border: 1px solid #5b4e96 !important;
2217	1976	padding: 10px 20px !important;
2218	1977	border-radius: 8px !important;
2219	1978	color: #fff !important;
2220	1979	font-size: 15px !important;
		@@ -2219,9 +1978,9 @@
2219	1978	color: #fff !important;
2220	1979	font-size: 15px !important;
2221	1980	font-weight: 600;
2222	1981	line-height: normal !important;
2223		- background: var(--woobot-primary);
	1982	+ background: #5b4e96;
2224	1983	}
2225	1984
2226	1985
2227	1986
		@@ -2251,9 +2010,9 @@
2251	2010	padding: 14px 20px;
2252	2011	width: auto;
2253	2012	font-size: 16px;
2254	2013	font-weight: 500;
2255		- color: var(--woobot-nav-muted);
	2014	+ color: #988FBD;
2256	2015	border-radius: 8px;
2257	2016	position: relative;
2258	2017	display: flex;
2259	2018	align-items: center;
		@@ -2260,9 +2019,9 @@
2260	2019	gap: 15px;
2261	2020	background: #d14529;
2262	2021	color: #ffffff;
2263	2022	text-decoration: none;
2264		- border-color: var(--woobot-primary) !important;
	2023	+ border-color: #5b4e96 !important;
2265	2024	}
2266	2025
2267	2026
2268	2027	button.swal2-confirm.btn.btn-lg.swal2-styled {
		@@ -2272,9 +2031,9 @@
2272	2031	.chatbot-wpbot-lite_page_wpbot button.swal2-deny.swal2-styled {
2273	2032	display: none !important;
2274	2033	}
2275	2034	a#qcld_save_openrouter_setting {
2276		- background: var(--woobot-primary);
	2035	+ background: #5B4E96;
2277	2036	color: #ffffff;
2278	2037	border: none;
2279	2038	padding: 12px 30px;
2280	2039	}
		@@ -2279,9 +2038,9 @@
2279	2038	padding: 12px 30px;
2280	2039	}
2281	2040
2282	2041	a#save_setting {
2283		- background: var(--woobot-primary);
	2042	+ background: #5B4E96;
2284	2043	color: #ffffff;
2285	2044	border: none;
2286	2045	padding: 12px 30px;
2287	2046	}
		@@ -2401,12 +2160,12 @@
2401	2160	width: auto;
2402	2161	font-size: 16px;
2403	2162	align-items: center;
2404	2163	gap: 15px;
2405		- background: var(--woobot-primary);
	2164	+ background: #5B4E96;
2406	2165	color: #ffffff;
2407	2166	text-decoration: none;
2408		- border-color: var(--woobot-primary) !important;
	2167	+ border-color: #5b4e96 !important;
2409	2168	}
2410	2169
2411	2170	.wrap.qcld-main-wrapper a:focus {
2412	2171	outline: none !important;
		@@ -2420,9 +2179,9 @@
2420	2179
2421	2180
2422	2181	.qcld-general-settings-connection-notic {
2423	2182	background: #eee;
2424		- border: 2px solid var(--woobot-primary);
	2183	+ border: 2px solid #5b4e96;
2425	2184	border-radius: 8px;
2426	2185	margin: 0 0 15px 0;
2427	2186	padding: 12px;
2428	2187	background: linear-gradient(192deg, #FFE3E1 4%, #E9E4FF 98.26%);
		@@ -2443,9 +2202,9 @@
2443	2202	transition: all 200ms;
2444	2203	font-size: 30px;
2445	2204	font-weight: bold;
2446	2205	text-decoration: none;
2447		- color: var(--woobot-primary);
	2206	+ color: #5b4e96;
2448	2207	}
2449	2208	.qcld-general-settings-close:hover {
2450	2209	color: orange;
2451	2210	}
		@@ -2475,16 +2234,16 @@
2475	2234	font-weight: bold;
2476	2235	}
2477	2236
2478	2237	#qcld-show-more-wrapper-box .qcld-show-more-show-more-height {
2479		- height: 338px;
	2238	+ height: 190px;
2480	2239	overflow:hidden;
2481	2240	}
2482	2241
2483	2242	#qcld-show-more-wrapper-box .qcld-show-more-show-more i {
2484	2243	display: block;
2485		- padding: 0 0 0 0;
2486		- background: var(--woobot-primary);
	2244	+ padding: 6px 0 0 0;
	2245	+ background: #5b4e96;
2487	2246	width: 30px;
2488	2247	height: 30px;
2489	2248	line-height: 30px;
2490	2249	border-radius: 50%;
		@@ -2496,9 +2255,9 @@
2496	2255	.qcl-openai div#wp-chatbot-gemini-settings input[type=checkbox]+label {
2497	2256	position: relative;
2498	2257	width: 18px;
2499	2258	height: 18px;
2500		- border: 2px solid var(--woobot-primary);
	2259	+ border: 2px solid #5b4e96;
2501	2260	border-radius: 4px;
2502	2261	top: 0;
2503	2262	left: 0;
2504	2263	transform: translate(0%, 0%);
		@@ -2560,9 +2319,9 @@
2560	2319	.qcl-openai div#wp-chatbot-gemini-settings label.form-check-label span.pro-badge {
2561	2320	font-size: 9px;
2562	2321	font-weight: 400;
2563	2322	color: #ffffff;
2564		- background: var(--woobot-primary);
	2323	+ background: #5B4E96;
2565	2324	border-radius: 20px;
2566	2325	padding: 2px 8px;
2567	2326	margin-left: 5px;
2568	2327	text-transform: uppercase;
		@@ -2586,56 +2345,8 @@
2586	2345	textarea#qcld_openai_system_content {
2587	2346	height: 120px;
2588	2347	line-height: 28px;
2589	2348	}
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	2349	.qcld-main-wrapper .alert.alert-warning {
2639	2350	background: linear-gradient(130deg, #ffffff 70%, #e9e4ff 96% 96%);
2640	2351	border-radius: 6px;
2641	2352	color: #721c24;
		@@ -2654,9 +2365,9 @@
2654	2365	font-weight: bold;
2655	2366	}
2656	2367
2657	2368	a#qcld_save_gemini_setting {
2658		- background: var(--woobot-primary);
	2369	+ background: #5B4E96;
2659	2370	color: #ffffff;
2660	2371	border: none;
2661	2372	padding: 12px 30px;
2662	2373	}
		@@ -2692,1090 +2403,9 @@
2692	2403	border-color: #e1dbff;
2693	2404	box-shadow: none !important;
2694	2405	outline: none !important;
2695	2406	}
2696		-
2697		-.wp-chatbot-wrap .qc-opt-language-title{
2698		- font-weight: bold !important;
2699		- color: var(--woobot-primary) !important;
2700		- font-size: 16px;
2701		-}
2702		-
2703		-button.qcld_chatbot_custom_icon_button.button, button.wp_chatbot_custom_agent_button.button {
2704		- padding: 2px 20px;
2705		- width: auto;
2706		- font-size: 14px;
2707		- font-weight: 500;
2708		- color: var(--woobot-nav-muted);
2709		- border-radius: 8px;
2710		- background: #fff;
2711		- color: var(--woobot-primary);
2712		- text-decoration: none;
2713		- margin: 0;
2714		- border: 2px solid var(--woobot-primary);
2715		-
2716		-}
2717		-
2718		-button.qcld_chatbot_custom_icon_button.button:hover, button.wp_chatbot_custom_agent_button.button:hover {
2719		- background: var(--woobot-primary);
2720		- color: #fff;
2721		- border: 2px solid var(--woobot-primary);
2722		-
2723		-}
2724		-
2725		-
2726	2407	@media (min-width: 993px) and (max-width: 1350px) {
2727	2408	.wp-chatbot-admin-upgrade-pro-sidebar {
2728	2409	width: 25%;
2729	2410	}
2730		-}
2731		-
2732		-.wp-chatbot-tabs nav ul li a span.dashicons {
2733		- font-size: 20px;
2734		- width: auto;
2735		- height: auto;
2736		-}
2737		-.wp-chatbot-tabs nav .cxsc-settings_openai_border a span.dashicons {
2738		- font-size: 20px;
2739		-}
2740		-
2741		-
2742		-.dashicons, .dashicons-before:before {
2743		- font-family: dashicons;
2744		- display: inline-block;
2745		- line-height: 1;
2746		- font-weight: 400;
2747		- font-weight: normal;
2748		-}
2749		-
2750		-.qcl-openai a:focus {
2751		- outline: 0 auto -webkit-focus-ring-color;
2752		- outline-offset: 0;
2753		- border: none !important;
2754		- outline: none !important;
2755		- box-shadow: none;
2756		-}
2757		-
2758		-#qcld_check_connection i{
2759		- animation: rotation infinite 3s linear;
2760		-}
2761		-
2762		-.wp-chatbot-wrap div#wp-chatbot-custom-color-options .form-group {
2763		- min-height: 90px;
2764		-}
2765		-
2766		-div#promotion-wpchatbot .qc-review-text a {
2767		- display: block;
2768		-}
2769		-.qcld-wp-chatbot-wrap-header-logo {
2770		- display: flex;
2771		- align-items: center;
2772		- gap: 10px;
2773		-}
2774		-@keyframes rotation{
2775		- from{
2776		- transform:rotate(360deg);
2777		- }
2778		-
2779		- to{
2780		- transform:rotate(0deg);
2781		- }
2782		-}
2783		-
2784		-.qcld-btn-primary {
2785		- padding: 14px 30px;
2786		- width: auto;
2787		- font-size: 16px;
2788		- font-weight: 500;
2789		- color: var(--woobot-nav-muted);
2790		- border-radius: 8px;
2791		- position: relative;
2792		- display: inline-block;
2793		- align-items: center;
2794		- gap: 15px;
2795		- background: var(--woobot-primary);
2796		- color: #ffffff;
2797		- text-decoration: none;
2798		- border-color: var(--woobot-primary) !important;
2799		- line-height: normal;
2800		-}
2801		-div#wpfooter {
2802		- display: none;
2803		-}
2804		-
2805		-.qcld-btn-primary {
2806		-
2807		- border: none;
2808		-}
2809		-
2810		-div#qcld-rag-settings-tab .wrap h3 {
2811		- padding: 0 0 8px 0;
2812		- margin: 20px 0 12px 0;
2813		- font-weight: bold;
2814		- font-size: 22px !important;
2815		- color: var(--woobot-primary) !important;
2816		-}
2817		-
2818		-div#rag-sync .wrap h3 {
2819		- padding: 0 0 8px 0;
2820		- margin: 10px 0 12px 0;
2821		- font-weight: bold;
2822		- font-size: 22px !important;
2823		- color: var(--woobot-primary) !important;
2824		-}
2825		-
2826		-div#rag-settings h2.nav-tab-wrapper a {
2827		- margin-right: 0;
2828		- line-height: 1.42857143;
2829		- border: 1px solid var(--woobot-primary);
2830		- border-radius: 6px;
2831		- border: 1px solid var(--woobot-primary);
2832		- padding: 10px 20px !important;
2833		- border-radius: 8px;
2834		- color: var(--woobot-primary);
2835		- font-size: 15px;
2836		- font-weight: 600;
2837		- line-height: normal !important;
2838		- background: #fff;
2839		-}
2840		-
2841		-div#rag-settings h2.nav-tab-wrapper {
2842		- margin: 0;
2843		- padding: 0;
2844		- border: none;
2845		-}
2846		-
2847		-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		- color: #fff;
2849		- background: var(--woobot-primary);
2850		- text-decoration: none !important;
2851		- border: 1px solid var(--woobot-primary);
2852		-}
2853		-
2854		-
2855		-
2856		-button#rag-pdf-submit, button#rag-csv-submit, button#rag-xaml-submit, button#rag_embed_btn {
2857		- padding: 8px 15px;
2858		- width: auto;
2859		- font-size: 16px;
2860		- font-weight: 500;
2861		- color: var(--woobot-nav-muted);
2862		- border-radius: 8px;
2863		- position: relative;
2864		- display: inline-block;
2865		- align-items: center;
2866		- gap: 15px;
2867		- background: var(--woobot-primary);
2868		- color: #ffffff;
2869		- text-decoration: none;
2870		- border-color: var(--woobot-primary) !important;
2871		- line-height: normal;
2872		-}
2873		-
2874		-div#rag-sync .wrap {
2875		- border: 1px solid #eee;
2876		- padding: 8px 12px;
2877		- border-radius: 6px;
2878		-}
2879		-
2880		-
2881		-
2882		-div#qcld-rag-settings-tab .wrap:first-child {
2883		- border: 1px solid #eee;
2884		- padding: 8px 12px;
2885		- border-radius: 6px;
2886		-}
2887		-
2888		-
2889		-.qcl-openai div#rag-database input[type=checkbox] {
2890		- display: block;
2891		-}
2892		-
2893		-.tablenav-pages {
2894		- text-align: right;
2895		- 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		-}
3780		-
3781		-
	2411	+}