PluginProbe
MxChat – AI Chatbot & Content Generation for WordPress / 1.5.9
MxChat – AI Chatbot & Content Generation for WordPress v1.5.9
3.2.21 3.2.20 3.2.19 3.2.18 3.2.17 3.2.16 3.2.15 3.2.14 3.2.12 3.2.13 3.2.11 3.2.10 3.2.9 3.2.8 3.2.7 3.2.6 3.2.5 3.2.4 3.2.3 3.2.2 3.2.1 2.0.3 2.0.4 2.0.5 2.0.6 All 152 releases
← All changes | css/admin-style.css +62 -1078 2.0.41.5.9 View file →
@@ -1,291 +1,6 @@
1 -.wp-core-ui .notice.is-dismissible {
2 - z-index: 10000;
3 -}
4 1
5 -.mxchat-form-intent {
6 - background-color: rgba(240, 240, 245, 0.5);
7 -}
8 2
9 -.mxchat-badge {
10 - display: inline-block;
11 - padding: 2px 8px;
12 - border-radius: 12px;
13 - background: #7873f5;
14 - color: white;
15 - font-size: 12px;
16 - margin-left: 8px;
17 -}
18 -
19 -.mxchat-threshold-readonly {
20 - padding: 8px;
21 - background: rgba(120, 115, 245, 0.1);
22 - border-radius: 4px;
23 - text-align: center;
24 -}
25 -
26 -.mxchat-form-intent .mxchat-button-secondary {
27 - background: #7873f5;
28 - color: white;
29 - border: none;
30 - padding: 6px 12px;
31 - border-radius: 4px;
32 - text-decoration: none;
33 - display: inline-block;
34 -}
35 -
36 -.mxchat-form-intent .mxchat-button-secondary:hover {
37 - background: #6863e5;
38 -}
39 -
40 -/* Tab Navigation */
41 -.mxchat-tabs {
42 - border-bottom: 1px solid #ccc;
43 - margin-bottom: 20px;
44 - padding-bottom: 0;
45 -}
46 -
47 -.mxchat-default-db-h2 {
48 - text-align: center;
49 - margin: 0px;
50 - padding: 0px;
51 -}
52 -
53 -.mxchat-tab-button {
54 - background: #f1f1f1;
55 - border: 1px solid #ccc;
56 - border-bottom: none;
57 - color: #555;
58 - cursor: pointer;
59 - font-size: 14px;
60 - margin: 0 5px -1px 0;
61 - padding: 10px 15px;
62 - transition: all 0.3s ease;
63 -}
64 -
65 -.mxchat-tab-button.active {
66 - background: #fff;
67 - border-bottom: 1px solid #fff;
68 - color: #000;
69 -}
70 -
71 -/* Tab Content */
72 -.mxchat-tab-content {
73 - display: none;
74 - padding: 25px;
75 - background: white;
76 - border: 1px solid #ddd;
77 - border-radius: 10px;
78 - box-shadow: 0 2px 15px rgba(0,0,0,0.05);
79 - animation: fadeIn 0.3s ease-in-out;
80 -}
81 -
82 -#default-db.mxchat-tab-content, #pinecone-db.mxchat-tab-content {
83 - border: none;
84 - box-shadow: none;
85 - padding: 0px;
86 -}
87 -
88 -.mxchat-tab-content.active {
89 - display: block;
90 -}
91 -
92 -@keyframes fadeIn {
93 - from { opacity: 0; }
94 - to { opacity: 1; }
95 -}
96 -
97 -.mxchat-tab-content.active {
98 - display: block;
99 -}
100 -
101 -/* Pinecone Settings Styling */
102 -.mxchat-input-group {
103 - margin-bottom: 20px;
104 -}
105 -
106 -.mxchat-input-group label {
107 - display: block;
108 - font-weight: 600;
109 - margin-bottom: 5px;
110 -}
111 -
112 -.mxchat-input-group .description {
113 - color: #666;
114 - font-style: italic;
115 - margin-top: 5px;
116 -}
117 -
118 -
119 -.mxchat-sync-settings {
120 - background: #fff;
121 - border-radius: 5px;
122 -}
123 -
124 -.mxchat-toggle-container {
125 - margin-bottom: 15px;
126 -}
127 -
128 -.mxchat-toggle-switch {
129 - position: relative;
130 - display: inline-block;
131 - width: 60px;
132 - height: 34px;
133 -}
134 -
135 -.mxchat-toggle-switch input {
136 - opacity: 0;
137 - width: 0;
138 - height: 0;
139 -}
140 -
141 -.mxchat-toggle-slider {
142 - position: absolute;
143 - cursor: pointer;
144 - top: 0;
145 - left: 0;
146 - right: 0;
147 - bottom: 0;
148 - background-color: #ccc;
149 - transition: .4s;
150 - border-radius: 34px;
151 -}
152 -
153 -.mxchat-toggle-slider:before {
154 - position: absolute;
155 - content: "";
156 - height: 26px;
157 - width: 26px;
158 - left: 4px;
159 - bottom: 4px;
160 - background-color: white;
161 - transition: .4s;
162 - border-radius: 50%;
163 -}
164 -
165 -input:checked + .mxchat-toggle-slider {
166 - background-color: #2196F3;
167 -}
168 -
169 -input:checked + .mxchat-toggle-slider:before {
170 - transform: translateX(26px);
171 -}
172 -
173 -.mxchat-toggle-label {
174 - vertical-align: super;
175 - font-weight: 500;
176 -}
177 -.mxchat-knowledge-container {
178 - display: flex;
179 - flex-direction: column;
180 - gap: 1rem;
181 - margin: 1.5rem 0;
182 - padding: 1rem;
183 - background: #fff;
184 - border-radius: 10px;
185 - border: 1px solid #ddd;
186 - box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
187 -}
188 -
189 -/* Left Column */
190 -.mxchat-knowledge-controls {
191 - flex: 1;
192 - display: flex;
193 - gap: 1rem;
194 - justify-content: space-between;
195 - align-items: center;
196 -}
197 -
198 -.mxchat-controls-header {
199 - display: flex;
200 - justify-content: space-between;
201 - align-items: center;
202 -}
203 -
204 -.displaying-num {
205 - color: #666;
206 - font-size: 0.9rem;
207 -}
208 -
209 -.mxchat-delete-all {
210 - color: #dc3545;
211 - border-color: #dc3545;
212 -}
213 -
214 -.mxchat-delete-all:hover {
215 - background: #dc3545;
216 - color: #fff;
217 -}
218 -
219 -.mxchat-pagination .page-numbers {
220 - padding: 0.25rem 0.5rem;
221 - margin: 0 0.25rem;
222 - border: 1px solid #ddd;
223 - border-radius: 4px;
224 - text-decoration: none;
225 -}
226 -
227 -.mxchat-pagination .current {
228 - background: #2271b1;
229 - color: #fff;
230 - border-color: #2271b1;
231 -}
232 -
233 -/* Right Column */
234 -.mxchat-knowledge-search {
235 - flex: 1;
236 -}
237 -.search-input {
238 - flex: 1;
239 - padding: 0.5rem;
240 - border: 1px solid #ddd;
241 - border-radius: 4px;
242 -}
243 -
244 -.search-button {
245 - display: flex;
246 - align-items: center;
247 - gap: 0.5rem;
248 - padding: 0.5rem 1rem;
249 -}
250 -
251 -/* Mobile Responsiveness */
252 -@media screen and (max-width: 782px) {
253 - .mxchat-knowledge-controls {
254 - flex-direction: column;
255 - }
256 -
257 - .mxchat-grid-container {
258 - display: grid;
259 - /* Add these properties */
260 - max-width: 100%; /* Constrain to parent width */
261 - width: 100%;
262 - overflow-x: hidden; /* Prevent horizontal scrolling */
263 - grid-template-columns: 1fr; /* Single column layout */
264 - grid-gap: 20px;
265 - }
266 -
267 - .mxchat-controls-header {
268 - flex-direction: column;
269 - gap: 1rem;
270 - align-items: flex-start;
271 - }
272 -
273 - .mxchat-search-group {
274 - flex-direction: column;
275 - }
276 -
277 -}
278 -
279 -
280 -
281 -
282 -
283 -
284 -
285 -
286 -
287 -
288 3 .mxchat-modal {
289 4 display: none;
290 5 position: fixed;
291 6 z-index: 1000;
@@ -593,8 +308,11 @@
593 308 }
594 309 .description {
595 310 margin-top: -10px;
596 311 }
312 +.mxchat-search-group {
313 + margin-top: 20px;
314 +}
597 315
598 316 .tablenav .tablenav-pages {
599 317 display: flex;
600 318 align-items: center;
@@ -618,8 +336,9 @@
618 336 padding: 20px;
619 337 background: #f9f9f9;
620 338 box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
621 339 }
340 +
622 341 /* Header */
623 342 .mxchat-admin .wrap h2 {
624 343 border-bottom: 2px solid #ddd;
625 344 padding-bottom: 10px;
@@ -653,9 +372,8 @@
653 372 background: #fff;
654 373 border: 1px solid #ddd;
655 374 box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
656 375 padding: 20px;
657 - border-radius: 10px;
658 376 }
659 377
660 378 /* Full Width for Submit Content */
661 379 .mxchat-admin .mxchat-grid-item.full-width {
@@ -676,9 +394,8 @@
676 394 }
677 395
678 396 .mxchat-admin .mxchat-form-group input[type="url"],
679 397 .mxchat-admin .mxchat-form-group input[type="text"],
680 -.mxchat-admin .mxchat-form-group input[type="password"],
681 398 .mxchat-admin .mxchat-form-group textarea {
682 399 padding: 10px;
683 400 border: 1px solid #ddd;
684 401 border-radius: 4px;
@@ -711,19 +428,8 @@
711 428 border: none;
712 429 cursor: pointer;
713 430 }
714 431
715 -.mxchat-search-group .button.button-primary.search-button {
716 - box-shadow: none;
717 - border-radius: 0px 20px 20px 0px;
718 - margin-bottom: 0px;
719 - padding: 0px 15px;
720 -}
721 -
722 -.mxchat-search-group .button.button-primary.search-button:hover {
723 - opacity: .8px;
724 -}
725 -
726 432 .mxchat-admin .button.button-primary:hover,
727 433 .mxchat-admin .button.button-primary:active {
728 434 background: #444;
729 435 }
@@ -734,27 +440,17 @@
734 440
735 441 /* Search and Sitemap Group */
736 442 .mxchat-admin .mxchat-search-group {
737 443 display: flex;
738 - gap: 0px;
739 - max-width: 800px;
740 - margin: auto;
741 - margin-top: 20px;
742 - align-items: stretch;
743 - flex-direction: row;
444 + align-items: center;
445 + gap: 10px;
744 446 }
745 447
746 448 .mxchat-admin .mxchat-search-group input[type="text"],
747 449 .mxchat-admin .mxchat-search-group input[type="url"] {
748 450 flex-grow: 1;
749 - border-radius: 20px 0px 0px 20px;
750 - padding: 8px;
751 451 }
752 452
753 -.mxchat-search-group #mxchat-intent-search {
754 - border-radius: 0px 0px 0px 0px;
755 -}
756 -
757 453 .mxchat-admin .mxchat-search-group input[type="submit"] {
758 454 background: #212121;
759 455 color: #fff;
760 456 border-radius: 20px;
@@ -770,13 +466,13 @@
770 466 .mxchat-admin .mxchat-search-group input[type="submit"]:hover {
771 467 background-color: #444;
772 468 }
773 469
774 -.mxchat-admin .mxchat-delete-all, .button.button-link-delete.mxchat-delete-all {
470 +.mxchat-admin .mxchat-delete-all {
775 471 background: #e74c3c;
776 472 color: #fff;
777 473 border-radius: 20px;
778 - padding: 0px 15px !important;
474 + padding: 10px 20px !important;
779 475 font-size: 1rem;
780 476 font-weight: 700;
781 477 text-decoration: none;
782 478 transition: all .2s;
@@ -783,9 +479,9 @@
783 479 justify-content: center;
784 480 align-items: center;
785 481 box-shadow: 4px 4px #c0392b;
786 482 cursor: pointer;
787 - margin-bottom: 10px;
483 + margin-top: 10px;
788 484 border: none;
789 485 }
790 486
791 487 .mxchat-admin .mxchat-delete-all:hover {
@@ -971,9 +667,26 @@
971 667 justify-content: center;
972 668 align-items: center;
973 669 }
974 670
671 +#mxchat-intent-loading {
672 + border: 8px solid #f3f3f3;
673 + border-top: 8px solid #333;
674 + border-radius: 50%;
675 + width: 30px;
676 + height: 30px;
677 + animation: mxchat-spin 1s linear infinite;
678 + display: inline-block; /* Display as inline for better alignment */
679 + margin-left: 10px;
680 + vertical-align: middle;
681 +}
975 682
683 +#mxchat-intent-loading-text {
684 + display: none;
685 + margin-top: 10px;
686 + color: #333;
687 +}
688 +
976 689 #mxchat-activation-spinner {
977 690 border: 4px solid #f3f3f3;
978 691 border-top: 4px solid #007cba; /* Match the WordPress primary button color */
979 692 border-radius: 50%;
@@ -1134,10 +847,15 @@
1134 847 border-bottom: 1px solid #fff;
1135 848 color: #0073aa;
1136 849 }
1137 850
851 +.mxchat-tab-content {
852 + display: none;
853 + padding: 20px;
854 + background: #fff;
855 + border: 1px solid #ddd;
856 +}
1138 857
1139 -
1140 858 .mxchat-tab-content.active {
1141 859 display: block;
1142 860 }
1143 861
@@ -1395,8 +1113,14 @@
1395 1113 .mxchat-nav-tab {
1396 1114 padding: 10px 12px;
1397 1115 }
1398 1116
1117 + /* Search and Sitemap Group */
1118 + .mxchat-admin .mxchat-search-group {
1119 + align-items: normal;
1120 + flex-direction: column;
1121 + }
1122 +
1399 1123 .mxchat-admin .mxchat-nav-tab-wrapper,
1400 1124 .mxchat-admin .wrap h2.mxchat-nav-tab-wrapper,
1401 1125 .mxchat-admin h1.mxchat-nav-tab-wrapper {
1402 1126 border-bottom: 0;
@@ -1500,8 +1224,25 @@
1500 1224 margin: 0;
1501 1225 }
1502 1226 }
1503 1227
1228 +/* Filter section responsive styles */
1229 +@media screen and (max-width: 782px) {
1230 + .mxchat-search-group {
1231 + display: flex;
1232 + flex-direction: column;
1233 + gap: 0.5rem;
1234 + }
1235 +
1236 + .mxchat-search-group input,
1237 + .mxchat-search-group select,
1238 + .mxchat-search-group button {
1239 + width: 100%;
1240 + margin: 0;
1241 + }
1242 +}
1243 +
1244 +
1504 1245 /* Stats Grid */
1505 1246 .mxchat-stats-grid {
1506 1247 display: grid;
1507 1248 grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
@@ -1735,8 +1476,15 @@
1735 1476
1736 1477
1737 1478
1738 1479
1480 +/* Settings Page Container */
1481 +.mxchat-tab-content {
1482 + background: white;
1483 + padding: 25px;
1484 + border-radius: 10px;
1485 + box-shadow: 0 2px 15px rgba(0,0,0,0.05);
1486 +}
1739 1487
1740 1488 /* Form Table Layout */
1741 1489 .form-table {
1742 1490 border-collapse: separate;
@@ -2042,768 +1790,4 @@
2042 1790 .mxchat-remove-question {
2043 1791 width: 100%;
2044 1792 }
2045 1793 }
2046 -
2047 -
2048 -
2049 -
2050 -
2051 -
2052 -
2053 -
2054 -
2055 -
2056 -
2057 -.mxchat-flex-section h2 {
2058 - margin: 0 0 1rem;
2059 - padding-bottom: 0.5rem;
2060 - border-bottom: 1px solid #eee;
2061 -}
2062 -
2063 -.mxchat-sync-settings,
2064 -.mxchat-import-section {
2065 - flex: 1;
2066 -}
2067 -
2068 -.mxchat-toggle-group {
2069 - display: flex;
2070 - flex-direction: column;
2071 - gap: 0.75rem;
2072 -}
2073 -
2074 -.mxchat-toggle-container {
2075 - display: flex;
2076 - align-items: center;
2077 - gap: 0.75rem;
2078 -}
2079 -
2080 -.mxchat-toggle-switch {
2081 - position: relative;
2082 - display: inline-block;
2083 - width: 44px;
2084 - height: 22px;
2085 -}
2086 -
2087 -.mxchat-toggle-slider {
2088 - position: absolute;
2089 - cursor: pointer;
2090 - top: 0;
2091 - left: 0;
2092 - right: 0;
2093 - bottom: 0;
2094 - background-color: #ccc;
2095 - transition: .4s;
2096 - border-radius: 22px;
2097 -}
2098 -
2099 -.mxchat-toggle-slider:before {
2100 - position: absolute;
2101 - content: "";
2102 - height: 18px;
2103 - width: 18px;
2104 - left: 2px;
2105 - bottom: 2px;
2106 - background-color: white;
2107 - transition: .4s;
2108 - border-radius: 50%;
2109 -}
2110 -
2111 -input:checked + .mxchat-toggle-slider {
2112 - background-color: #2196F3;
2113 -}
2114 -
2115 -input:checked + .mxchat-toggle-slider:before {
2116 - transform: translateX(22px);
2117 -}
2118 -
2119 -.mxchat-url-input-group {
2120 - display: flex;
2121 - gap: 0.5rem;
2122 -}
2123 -
2124 -.mxchat-url-input-group input[type="url"] {
2125 - flex: 1;
2126 -}
2127 -
2128 -.mxchat-status-section {
2129 - margin-top: 1rem;
2130 - padding-top: 1rem;
2131 - border-top: 1px solid #eee;
2132 -}
2133 -
2134 -.mxchat-process-status {
2135 - background: #f8f9fa;
2136 - border-radius: 4px;
2137 - padding: 1rem;
2138 - margin-bottom: 1rem;
2139 -}
2140 -
2141 -.status-header {
2142 - display: flex;
2143 - justify-content: space-between;
2144 - align-items: center;
2145 - margin-bottom: 0.5rem;
2146 -}
2147 -
2148 -.status-header h4 {
2149 - margin: 0;
2150 -}
2151 -
2152 -.progress-bar {
2153 - background: #eee;
2154 - border-radius: 4px;
2155 - height: 8px;
2156 - margin-bottom: 0.5rem;
2157 -}
2158 -
2159 -.progress {
2160 - background: #2196F3;
2161 - height: 100%;
2162 - border-radius: 4px;
2163 - transition: width 0.3s ease;
2164 -}
2165 -
2166 -.status-details {
2167 - display: flex;
2168 - justify-content: space-between;
2169 - font-size: 0.9em;
2170 - color: #666;
2171 -}
2172 -
2173 -.save-button-settings {
2174 - background: #3498db !important;
2175 - color: #fff !important;
2176 - border-radius: 20px !important;
2177 - padding: 0px 20px !important;
2178 - font-size: 1rem !important;
2179 - font-weight: 700 !important;
2180 - text-decoration: none !important;
2181 - transition: all .2s !important;
2182 - box-shadow: 4px 4px #2980b9 !important;
2183 - cursor: pointer !important;
2184 - margin-top: 10px !important;
2185 - border: none !important;
2186 - margin-bottom: 10px !important;
2187 -}
2188 -
2189 -.mxchat-import-description {
2190 - margin-bottom: 1rem;
2191 -}
2192 -
2193 -.description-text {
2194 - margin: 0 0 0.5rem;
2195 - color: #666;
2196 -}
2197 -
2198 -.import-options {
2199 - margin: 0 0 1rem;
2200 - padding-left: 1.5rem;
2201 -}
2202 -
2203 -.import-options li {
2204 - margin-bottom: 0.25rem;
2205 - color: #666;
2206 -}
2207 -
2208 -.import-options strong {
2209 - color: #333;
2210 -}
2211 -
2212 -.import-section {
2213 - margin-top: 50px;
2214 -}
2215 -
2216 -
2217 -/* Mobile Responsiveness */
2218 -@media screen and (max-width: 782px) {
2219 - .mxchat-settings-row {
2220 - flex-direction: column;
2221 - }
2222 - .mxchat-url-input-group input[type="submit"] {
2223 - width: 100%;
2224 - }
2225 -}
2226 -
2227 -
2228 -
2229 -
2230 -
2231 -/* Feedback container for saving indicator */
2232 -.feedback-container {
2233 - display: inline-flex;
2234 - align-items: right;
2235 - margin-left: 10px;
2236 - position: relative;
2237 - z-index: 2;
2238 -}
2239 -
2240 -/* Spinner animation */
2241 -.saving-spinner {
2242 - width: 16px;
2243 - height: 16px;
2244 - border: 2px solid #ccc;
2245 - border-top-color: #007cba; /* WordPress blue */
2246 - border-radius: 50%;
2247 - animation: spin 0.6s linear infinite;
2248 -}
2249 -
2250 -/* Checkmark icon */
2251 -.success-icon {
2252 - display: none;
2253 - color: #28a745; /* Green for success */
2254 - font-size: 16px;
2255 - font-weight: bold;
2256 - margin-left: 5px;
2257 - animation: fadeInOut 1.5s ease-in-out forwards;
2258 -}
2259 -
2260 -/* Spinner animation keyframes */
2261 -@keyframes spin {
2262 - to {
2263 - transform: rotate(360deg);
2264 - }
2265 -}
2266 -
2267 -/* Success icon fade animation */
2268 -@keyframes fadeInOut {
2269 - 0% {
2270 - opacity: 0;
2271 - }
2272 - 20% {
2273 - opacity: 1;
2274 - }
2275 - 80% {
2276 - opacity: 1;
2277 - }
2278 - 100% {
2279 - opacity: 0;
2280 - }
2281 -}
2282 -
2283 -
2284 -.slider-container {
2285 - display: flex;
2286 - align-items: center;
2287 - gap: 10px;
2288 - margin-bottom: 10px;
2289 -}
2290 -
2291 -.range-slider {
2292 - flex-grow: 1;
2293 - max-width: 300px;
2294 -}
2295 -
2296 -.range-value {
2297 - min-width: 30px;
2298 - text-align: center;
2299 -}
2300 -
2301 -/* Optional: Style the range input */
2302 -input[type="range"] {
2303 - -webkit-appearance: none;
2304 - width: 100%;
2305 - height: 8px;
2306 - background: #ddd;
2307 - border-radius: 4px;
2308 - outline: none;
2309 -}
2310 -
2311 -input[type="range"]::-webkit-slider-thumb {
2312 - -webkit-appearance: none;
2313 - width: 16px;
2314 - height: 16px;
2315 - background: #2271b1;
2316 - border-radius: 50%;
2317 - cursor: pointer;
2318 -}
2319 -
2320 -
2321 -
2322 -
2323 -
2324 -
2325 -
2326 -
2327 -
2328 -
2329 -
2330 -
2331 -
2332 -
2333 -
2334 -
2335 -
2336 -/* Container Styles */
2337 -.mxchat-import-container {
2338 - background: #fff;
2339 - padding: 20px;
2340 - border: 1px solid #e1e1e1;
2341 - border-radius: 10px;
2342 - box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
2343 -}
2344 -
2345 -
2346 -
2347 -/* Tabs Navigation */
2348 -.mxchat-tabs {
2349 - display: flex;
2350 - border-bottom: 2px solid #e1e1e1;
2351 - margin-bottom: 20px;
2352 -}
2353 -.mxchat-tab-button {
2354 - padding: 10px 20px;
2355 - cursor: pointer;
2356 - background: transparent;
2357 - border: none;
2358 - border-bottom: 2px solid transparent;
2359 - transition: all 0.3s ease;
2360 - font-size: 16px;
2361 - color: #333;
2362 -}
2363 -.mxchat-tab-button:hover,
2364 -.mxchat-tab-button:focus {
2365 - background: #f9f9f9;
2366 -}
2367 -.mxchat-tab-button.active {
2368 - border-bottom: 2px solid #0073aa;
2369 - font-weight: bold;
2370 - color: #0073aa;
2371 -}
2372 -
2373 -
2374 -
2375 -/* Flex Container for Default DB Tab */
2376 -.mxchat-flex-container {
2377 - display: flex;
2378 - gap: 20px;
2379 - flex-wrap: wrap;
2380 -}
2381 -.mxchat-sync-column,
2382 -.mxchat-import-column {
2383 - flex: 1;
2384 - min-width: 300px;
2385 -}
2386 -
2387 -/* Section Headings and Descriptions */
2388 -.mxchat-section h3 {
2389 - font-size: 18px;
2390 - margin-bottom: 10px;
2391 - color: #0073aa;
2392 -}
2393 -.mxchat-description {
2394 - font-size: 14px;
2395 - margin-bottom: 15px;
2396 - color: #555;
2397 -}
2398 -
2399 -/* Toggle Switches */
2400 -.mxchat-toggle-container {
2401 - display: flex;
2402 - align-items: center;
2403 - margin-bottom: 15px;
2404 -}
2405 -.mxchat-toggle-switch {
2406 - position: relative;
2407 - display: inline-block;
2408 - width: 50px;
2409 - height: 24px;
2410 - margin-right: 10px;
2411 -}
2412 -.mxchat-toggle-switch input {
2413 - opacity: 0;
2414 - width: 0;
2415 - height: 0;
2416 -}
2417 -.mxchat-toggle-slider {
2418 - position: absolute;
2419 - cursor: pointer;
2420 - top: 0;
2421 - left: 0;
2422 - right: 0;
2423 - bottom: 0;
2424 - background-color: #ccc;
2425 - transition: 0.4s;
2426 - border-radius: 24px;
2427 -}
2428 -.mxchat-toggle-switch input:checked + .mxchat-toggle-slider {
2429 - background-color: #212121;
2430 -}
2431 -.mxchat-toggle-slider:before {
2432 - position: absolute;
2433 - content: "";
2434 - height: 18px;
2435 - width: 18px;
2436 - left: 3px;
2437 - bottom: 3px;
2438 - background-color: white;
2439 - transition: 0.4s;
2440 - border-radius: 50%;
2441 -}
2442 -.mxchat-toggle-switch input:checked + .mxchat-toggle-slider:before {
2443 - transform: translateX(26px);
2444 -}
2445 -.mxchat-toggle-label {
2446 - font-size: 14px;
2447 - color: #333;
2448 -}
2449 -
2450 -/* Form Groups */
2451 -.mxchat-form-group {
2452 - margin-bottom: 15px;
2453 -}
2454 -.mxchat-form-group label {
2455 - display: block;
2456 - margin-bottom: 5px;
2457 - font-weight: bold;
2458 - color: #333;
2459 -}
2460 -
2461 -.mxchat-form-group .description {
2462 - font-size: 12px;
2463 - color: #777;
2464 -}
2465 -
2466 -/* URL and Pinecone Input Groups */
2467 -.mxchat-url-input-group,
2468 -.mxchat-pinecone-input-group {
2469 - display: flex;
2470 - gap: 0px;
2471 - margin-bottom: 15px;
2472 -}
2473 -.mxchat-url-input-group input[type="url"],
2474 -.mxchat-pinecone-input-group input[type="url"] {
2475 - flex: 1;
2476 - padding: 8px;
2477 - border: 1px solid #ccc;
2478 -border-radius: 4px 0px 0px 4px;
2479 -}
2480 -.mxchat-url-input-group input[type="submit"],
2481 -.mxchat-pinecone-input-group input[type="submit"] {
2482 - padding: 8px 16px;
2483 - background-color: #0073aa;
2484 - color: #fff;
2485 - border: none;
2486 - border-radius: 4px;
2487 - cursor: pointer;
2488 - transition: background-color 0.3s ease;
2489 -}
2490 -.mxchat-url-input-group input[type="submit"]:hover,
2491 -.mxchat-pinecone-input-group input[type="submit"]:hover {
2492 - background-color: #005177;
2493 -}
2494 -
2495 -/* Submit Wrapper */
2496 -.mxchat-submit-wrapper {
2497 - margin-top: 20px;
2498 -}
2499 -
2500 -/* Import & Pinecone Options List */
2501 -.import-options,
2502 -.pinecone-options {
2503 - margin: 10px 0 15px 20px;
2504 - color: #555;
2505 -}
2506 -.import-options li,
2507 -.pinecone-options li {
2508 - margin-bottom: 5px;
2509 -}
2510 -
2511 -/* Spinner Styles */
2512 -.mxchat-spinner,
2513 -.mxchat-pinecone-spinner {
2514 - border: 4px solid #f3f3f3;
2515 - border-top: 4px solid #0073aa;
2516 - border-radius: 50%;
2517 - width: 30px;
2518 - height: 30px;
2519 - animation: spin 1s linear infinite;
2520 - margin: 10px auto;
2521 -}
2522 -@keyframes spin {
2523 - 0% { transform: rotate(0deg); }
2524 - 100% { transform: rotate(360deg); }
2525 -}
2526 -
2527 -/* Processing Status Messages */
2528 -.mxchat-process-status,
2529 -.mxchat-pinecone-status {
2530 - border: 1px solid #0073aa;
2531 - background-color: #f1f8ff;
2532 - padding: 10px;
2533 - border-radius: 4px;
2534 - margin-top: 15px;
2535 -}
2536 -.mxchat-process-status h3,
2537 -.mxchat-pinecone-status h3 {
2538 - margin-top: 0;
2539 - font-size: 16px;
2540 - color: #0073aa;
2541 -}
2542 -.mxchat-process-status p,
2543 -.mxchat-pinecone-status p {
2544 - margin: 5px 0;
2545 - font-size: 14px;
2546 - color: #333;
2547 -}
2548 -
2549 -/* Responsive Adjustments */
2550 -@media (max-width: 768px) {
2551 - .mxchat-flex-container {
2552 - flex-direction: column;
2553 - }
2554 -}
2555 -
2556 -
2557 -
2558 -.button.button-primary.pinecone-submit {
2559 - box-shadow: none;
2560 - border-radius: 0px 4px 4px 0px;
2561 - background: linear-gradient(135deg, #fa73e6, #7873f5, #3ac9d1);
2562 - margin-bottom: 0px;
2563 -}
2564 -
2565 -.button.button-primary.pinecone-submit:hover {
2566 - opacity: .8;
2567 - background: linear-gradient(135deg, #fa73e6, #7873f5, #3ac9d1);
2568 -
2569 -}
2570 -
2571 -/* Pro Hero Section */
2572 -body.wp-admin .mxchat-pro-hero {
2573 - text-align: center;
2574 - padding: 3.5rem 2rem;
2575 - position: relative;
2576 - background: #212121;
2577 - border-bottom: 4px solid transparent;
2578 - border-image: linear-gradient(135deg, #fa73e6, #7873f5, #3ac9d1);
2579 - border-image-slice: 1;
2580 -}
2581 -
2582 -body.wp-admin .mxchat-pro-hero::before {
2583 - content: '';
2584 - position: absolute;
2585 - top: 0;
2586 - left: 0;
2587 - width: 100%;
2588 - height: 100%;
2589 - background: radial-gradient(
2590 - circle at center,
2591 - rgba(250, 115, 230, 0.08) 0%,
2592 - rgba(120, 115, 245, 0.08) 50%,
2593 - rgba(58, 201, 209, 0.08) 100%
2594 - );
2595 - z-index: 1;
2596 -}
2597 -
2598 -body.wp-admin .mxchat-pro-hero::after {
2599 - content: '';
2600 - position: absolute;
2601 - bottom: -20px;
2602 - left: 0;
2603 - width: 100%;
2604 - height: 20px;
2605 - background: linear-gradient(180deg, rgba(33, 33, 33, 0.2) 0%, transparent 100%);
2606 - z-index: 2;
2607 -}
2608 -
2609 -body.wp-admin .pro-title {
2610 - font-size: 3.5rem;
2611 - margin: 0 0 1.5rem;
2612 - line-height: 1.2;
2613 - color: white;
2614 - position: relative;
2615 - z-index: 2;
2616 - font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
2617 -}
2618 -
2619 -body.wp-admin .pro-gradient-text {
2620 - font-weight: 700;
2621 - background: linear-gradient(135deg, #fa73e6, #7873f5, #3ac9d1);
2622 - -webkit-background-clip: text;
2623 - -webkit-text-fill-color: transparent;
2624 - display: inline-block;
2625 -}
2626 -
2627 -body.wp-admin .pro-subtitle {
2628 - font-size: 1.25rem;
2629 - color: rgba(255, 255, 255, 0.9);
2630 - max-width: 600px;
2631 - margin: 0 auto;
2632 - position: relative;
2633 - z-index: 2;
2634 - line-height: 1.6;
2635 -}
2636 -
2637 -/* Responsive Design */
2638 -@media (max-width: 768px) {
2639 - body.wp-admin .pro-title {
2640 - font-size: 2.1rem;
2641 - margin-bottom: 1rem;
2642 - }
2643 -
2644 - body.wp-admin .mxchat-pro-hero {
2645 - padding: 2.5rem 1.5rem;
2646 - }
2647 -
2648 - body.wp-admin .pro-subtitle {
2649 - font-size: 1.1rem;
2650 - }
2651 -}
2652 -
2653 -
2654 -/* Form Container Styles */
2655 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-form-container {
2656 - max-width: 600px;
2657 - margin: 2rem auto;
2658 - background: white;
2659 - padding: 2rem;
2660 - border-radius: 12px;
2661 - box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
2662 -}
2663 -
2664 -/* Form Table Styles */
2665 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-form .form-table {
2666 - margin: 0;
2667 - border-collapse: separate;
2668 - border-spacing: 0 1rem;
2669 -}
2670 -
2671 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-form .form-table th {
2672 - padding: 0 1rem 0 0;
2673 - width: 140px;
2674 - font-weight: 600;
2675 - color: #212121;
2676 - font-size: 15px;
2677 - vertical-align: middle;
2678 -}
2679 -
2680 -/* Input Field Styles */
2681 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-input {
2682 - width: 100%;
2683 - padding: 10px 16px;
2684 - border: 2px solid #e0e0e0;
2685 - border-radius: 8px;
2686 - font-size: 15px;
2687 - transition: all 0.3s ease;
2688 - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
2689 -}
2690 -
2691 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-input:focus {
2692 - border-color: #7873f5;
2693 - box-shadow: 0 0 0 3px rgba(120, 115, 245, 0.1);
2694 - outline: none;
2695 -}
2696 -
2697 -/* Button Container and Button Styles */
2698 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-button-container {
2699 - margin-top: 2rem;
2700 - text-align: right;
2701 - display: flex;
2702 - align-items: center;
2703 - justify-content: flex-end;
2704 - gap: 1rem;
2705 -}
2706 -
2707 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-button {
2708 - background: linear-gradient(135deg, #fa73e6, #7873f5);
2709 - border: none;
2710 - padding: 12px 24px;
2711 - border-radius: 8px;
2712 - color: white;
2713 - font-weight: 600;
2714 - font-size: 15px;
2715 - cursor: pointer;
2716 - transition: all 0.3s ease;
2717 - text-shadow: none;
2718 - box-shadow: 0 4px 12px rgba(120, 115, 245, 0.2);
2719 - height: auto;
2720 - line-height: 1.4;
2721 -}
2722 -
2723 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-button:hover {
2724 - transform: translateY(-2px);
2725 - box-shadow: 0 6px 16px rgba(120, 115, 245, 0.3);
2726 -}
2727 -
2728 -/* Error Notice Styles */
2729 -body.wp-admin .wrap.mxchat-admin-activation .error.notice {
2730 - margin: 2rem auto;
2731 - max-width: 600px;
2732 - border-left-color: #dc3232;
2733 - background: #fff;
2734 - border-radius: 4px;
2735 - box-shadow: 0 2px 8px rgba(220, 50, 50, 0.1);
2736 -}
2737 -
2738 -/* License Status Styles */
2739 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-status {
2740 - max-width: 600px;
2741 - margin: 2rem;
2742 - padding: 1.5rem;
2743 - background: white;
2744 - border-radius: 12px;
2745 - box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
2746 -}
2747 -
2748 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-status h3 {
2749 - margin: 0;
2750 - font-size: 15px;
2751 - color: #212121;
2752 - display: flex;
2753 - align-items: center;
2754 - gap: 0.5rem;
2755 -}
2756 -
2757 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-status-badge {
2758 - padding: 6px 12px;
2759 - border-radius: 20px;
2760 - font-size: 13px;
2761 - font-weight: 600;
2762 -}
2763 -
2764 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-status-badge.active {
2765 - background: #e8f5e9;
2766 - color: #2e7d32;
2767 -}
2768 -
2769 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-status-badge.inactive {
2770 - background: #fff3e0;
2771 - color: #ef6c00;
2772 -}
2773 -
2774 -/* Spinner Styles */
2775 -body.wp-admin .wrap.mxchat-admin-activation .mxchat-activation-spinner {
2776 - width: 20px;
2777 - height: 20px;
2778 - border: 2px solid rgba(120, 115, 245, 0.3);
2779 - border-radius: 50%;
2780 - border-top-color: #7873f5;
2781 - animation: spin 1s linear infinite;
2782 -}
2783 -
2784 -@keyframes spin {
2785 - to {
2786 - transform: rotate(360deg);
2787 - }
2788 -}
2789 -
2790 -/* Responsive Adjustments */
2791 -@media (max-width: 782px) {
2792 - body.wp-admin .wrap.mxchat-admin-activation .mxchat-pro-form .form-table th {
2793 - padding-bottom: 0.5rem;
2794 - }
2795 -
2796 - body.wp-admin .wrap.mxchat-admin-activation .form-table,
2797 - body.wp-admin .wrap.mxchat-admin-activation .form-table tbody,
2798 - body.wp-admin .wrap.mxchat-admin-activation .form-table tr,
2799 - body.wp-admin .wrap.mxchat-admin-activation .form-table th,
2800 - body.wp-admin .wrap.mxchat-admin-activation .form-table td {
2801 - display: block;
2802 - width: 100%;
2803 - padding: 0;
2804 - }
2805 -
2806 - body.wp-admin .wrap.mxchat-admin-activation .form-table td {
2807 - margin-bottom: 1.5rem;
2808 - }
2809 -}