PluginProbe
King Addons for Elementor – 100+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce Builder, Mega Menu, Popup Builder / 51.1.83
King Addons for Elementor – 100+ Elementor Widgets, 4 000+ Elementor Templates, WooCommerce Builder, Mega Menu, Popup Builder v51.1.83
51.1.84 51.1.85 51.1.83 51.1.82 51.1.81 51.1.79 51.1.78 51.1.77 51.1.76 51.1.74 51.1.75 51.1.65 51.1.64 51.1.63 trunk 51.1.14 51.1.2 51.1.35 51.1.36 51.1.37 51.1.38 51.1.39 51.1.44 51.1.45 51.1.46 All 39 releases
← All changes | includes/admin/css/account.css +892 -96 51.1.3751.1.83 View file →
@@ -1,167 +1,963 @@
1 -.postbox {
2 - border-radius: 5px;
3 - border: 1px solid #f1f1f4;
4 - box-shadow: none;
1 +/**
2 + * King Addons Account Page Styles
3 + *
4 + * Premium style for Freemius account page.
5 + * Supports both light and dark themes via ka-v3-dark class.
6 + *
7 + * @package King_Addons
8 + */
9 +
10 +@font-face {
11 + font-family: 'Inter';
12 + font-style: normal;
13 + font-weight: 100 900;
14 + font-display: swap;
15 + src: url('../fonts/Inter.woff2') format('woff2');
5 16 }
6 17
7 -#wpbody-content .fs-notice.fs-has-title {
8 - margin-top: 15px;
18 +/* ===== CSS CUSTOM PROPERTIES ===== */
19 +:root {
20 + --ka-account-bg: #f5f5f7;
21 + --ka-account-text: #1d1d1f;
22 + --ka-account-text-secondary: #86868b;
23 + --ka-account-card-bg: rgba(255, 255, 255, 0.8);
24 + --ka-account-card-border: rgba(0, 0, 0, 0.04);
25 + --ka-account-card-shadow: 0 4px 30px rgba(0, 0, 0, 0.06);
26 + --ka-account-input-bg: #fff;
27 + --ka-account-input-border: rgba(0, 0, 0, 0.1);
28 + --ka-account-link: #0071e3;
29 + --ka-account-link-hover: #0077ed;
30 + --ka-account-accent: #0071e3;
31 + --ka-account-accent-hover: #0077ed;
32 + --ka-account-success: #22c55e;
33 + --ka-account-warning: #f59e0b;
34 + --ka-account-error: #ef4444;
35 + --ka-account-table-stripe: rgba(0, 0, 0, 0.02);
36 + --ka-account-divider: rgba(0, 0, 0, 0.06);
37 + --ka-account-btn-bg: rgba(0, 0, 0, 0.06);
38 + --ka-account-btn-text: #1d1d1f;
9 39 }
10 40
11 -#poststuff {
12 - margin-top: -15px;
41 +/* Dark theme variables */
42 +body.ka-v3-dark,
43 +html.ka-v3-dark body {
44 + --ka-account-bg: #000000;
45 + --ka-account-text: #f5f5f7;
46 + --ka-account-text-secondary: #a1a1a6;
47 + --ka-account-card-bg: rgba(28, 28, 30, 0.8);
48 + --ka-account-card-border: rgba(255, 255, 255, 0.08);
49 + --ka-account-card-shadow: 0 4px 30px rgba(0, 0, 0, 0.3);
50 + --ka-account-input-bg: rgba(44, 44, 46, 0.8);
51 + --ka-account-input-border: rgba(255, 255, 255, 0.1);
52 + --ka-account-link: #64b5f6;
53 + --ka-account-link-hover: #90caf9;
54 + --ka-account-table-stripe: rgba(255, 255, 255, 0.03);
55 + --ka-account-divider: rgba(255, 255, 255, 0.08);
56 + --ka-account-btn-bg: rgba(255, 255, 255, 0.1);
57 + --ka-account-btn-text: #f5f5f7;
13 58 }
14 59
15 -#fs_promo_tab {
60 +/* ===== BASE STYLES ===== */
61 +body.king-addons_page_king-addons-account #wpcontent,
62 +body.king-addons_page_king-addons-account #wpbody,
63 +body.king-addons_page_king-addons-account #wpbody-content {
64 + background: var(--ka-account-bg) !important;
65 + padding: 0 !important;
66 +}
67 +
68 +body.king-addons_page_king-addons-account {
69 + background: var(--ka-account-bg) !important;
70 +}
71 +
72 +/* ===== HIDE NAV TAB WRAPPER ===== */
73 +body.king-addons_page_king-addons-account h2.nav-tab-wrapper,
74 +body.king-addons_page_king-addons-account .nav-tab-wrapper {
16 75 display: none !important;
17 76 }
18 77
19 -#fs_account .postbox,
20 -#fs_account .widefat {
21 - border-color: #f1f1f4;
78 +/* ===== MAIN WRAPPER ===== */
79 +body.king-addons_page_king-addons-account .wrap.fs-section {
80 + font-family: 'Inter', -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
81 + max-width: 1000px;
82 + margin: 0 auto;
83 + padding: 48px 32px;
84 + color: var(--ka-account-text);
22 85 }
23 86
24 -.widefat thead td,
25 -.widefat thead th {
26 - border-bottom: 1px solid #f1f1f4;
87 +body.king-addons_page_king-addons-account #poststuff {
88 + margin-top: 0;
89 + padding-top: 0;
27 90 }
28 91
29 -div.updated {
30 - border: 1px solid #f1f1f4;
31 - box-shadow: none;
92 +/* ===== POSTBOX / CARDS ===== */
93 +body.king-addons_page_king-addons-account .postbox {
94 + background: var(--ka-account-card-bg);
95 + backdrop-filter: blur(20px);
96 + -webkit-backdrop-filter: blur(20px);
97 + border: 1px solid var(--ka-account-card-border);
98 + border-radius: 20px;
99 + box-shadow: var(--ka-account-card-shadow);
100 + margin-bottom: 24px;
101 + overflow: hidden;
102 + position: relative;
103 + transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
32 104 }
33 105
34 -.fs-notice.updated.success.fs-has-title.fs-slug-king-addons.fs-type-plugin {
35 - border-left-width: 4px;
106 +/* Postbox headers */
107 +body.king-addons_page_king-addons-account #fs_account h3 {
108 + background: transparent;
109 + border-bottom: 1px solid var(--ka-account-divider);
110 + font-size: 17px;
111 + font-weight: 600;
112 + letter-spacing: -0.01em;
113 + margin: 0;
114 + padding: 20px 24px;
115 + color: var(--ka-account-text);
116 + display: flex;
117 + align-items: center;
118 + gap: 12px;
36 119 }
37 120
38 -.nav-tab-active {
39 - border: none;
121 +body.king-addons_page_king-addons-account #fs_account h3 .dashicons {
122 + font-size: 20px;
123 + width: 20px;
124 + height: 20px;
125 + color: var(--ka-account-accent);
126 +}
127 +
128 +/* ===== HEADER ACTIONS ===== */
129 +body.king-addons_page_king-addons-account #fs_account .fs-header-actions {
130 + position: absolute;
131 + right: 24px;
132 + top: 16px;
133 + font-size: 13px;
134 +}
135 +
136 +body.king-addons_page_king-addons-account #fs_account .fs-header-actions ul {
137 + margin: 0;
138 + display: flex;
139 + align-items: center;
140 + gap: 4px;
141 + padding: 2px;
142 + border-radius: 980px;
143 + background: rgba(255, 255, 255, 0.72);
144 + border: 1px solid rgba(0, 0, 0, 0.06);
145 + backdrop-filter: saturate(180%) blur(16px);
146 + -webkit-backdrop-filter: saturate(180%) blur(16px);
147 +}
148 +
149 +body.ka-v3-dark.king-addons_page_king-addons-account #fs_account .fs-header-actions ul {
150 + background: rgba(28, 28, 30, 0.72);
151 + border-color: rgba(255, 255, 255, 0.08);
152 +}
153 +
154 +body.king-addons_page_king-addons-account #fs_account .fs-header-actions li {
155 + float: none;
156 + font-weight: 400;
157 + margin: 0;
158 +}
159 +
160 +body.king-addons_page_king-addons-account #fs_account .fs-header-actions li a {
161 + color: var(--ka-account-link);
162 + text-decoration: none;
163 + padding: 6px 10px;
164 + border-radius: 980px;
165 + transition: all 0.2s ease;
40 166 display: inline-flex;
167 + align-items: center;
168 + gap: 6px;
41 169 line-height: 1;
42 - padding: 15px 25px;
43 - border-radius: 12px;
44 - margin-right: 10px;
45 - background: #1a1b1b;
46 - flex-flow: row;
170 +}
171 +
172 +body.king-addons_page_king-addons-account #fs_account .fs-header-actions li a:hover {
173 + background: var(--ka-account-btn-bg);
174 + color: var(--ka-account-link-hover);
175 +}
176 +
177 +body.king-addons_page_king-addons-account #fs_account h3 {
178 + padding-right: 220px;
179 +}
180 +
181 +body.king-addons_page_king-addons-account #fs_account .fs-header-actions li a .dashicons {
182 + font-size: 14px;
183 + width: 14px;
184 + height: 14px;
185 +}
186 +
187 +/* ===== INSIDE / CONTENT ===== */
188 +body.king-addons_page_king-addons-account .postbox .inside {
189 + padding: 0;
190 + margin: 0;
191 + background: transparent;
192 +}
193 +
194 +/* ===== KEY-VALUE TABLE ===== */
195 +body.king-addons_page_king-addons-account .fs-key-value-table {
196 + width: 100%;
197 + border-collapse: collapse;
198 +}
199 +
200 +body.king-addons_page_king-addons-account .fs-key-value-table td,
201 +body.king-addons_page_king-addons-account .fs-key-value-table th {
202 + padding: 16px 24px;
203 + border-bottom: 1px solid var(--ka-account-divider);
204 +}
205 +
206 +body.king-addons_page_king-addons-account .fs-key-value-table tr:last-child td {
207 + border-bottom: none;
208 +}
209 +
210 +body.king-addons_page_king-addons-account .fs-key-value-table tr td:first-child {
211 + text-align: left;
212 + width: 140px;
213 +}
214 +
215 +body.king-addons_page_king-addons-account .fs-key-value-table tr td:first-child nobr {
216 + font-weight: 500;
217 + color: var(--ka-account-text-secondary);
218 + font-size: 14px;
219 +}
220 +
221 +body.king-addons_page_king-addons-account .fs-key-value-table code,
222 +body.king-addons_page_king-addons-account .fs-key-value-table input[type=text],
223 +body.king-addons_page_king-addons-account .fs-key-value-table var {
224 + background: none;
225 + color: var(--ka-account-text);
226 + font-size: 15px;
227 + font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
228 + font-weight: 400;
229 +}
230 +
231 +body.king-addons_page_king-addons-account .fs-key-value-table tr.alternate,
232 +body.king-addons_page_king-addons-account .fs-key-value-table tr:nth-child(odd) {
233 + background-color: var(--ka-account-table-stripe);
234 +}
235 +
236 +body.king-addons_page_king-addons-account .fs-key-value-table .fs-right {
237 + text-align: right;
238 +}
239 +
240 +/* ===== BUTTONS ===== */
241 +
242 +body.king-addons_page_king-addons-account .button {
243 + border-radius: 980px !important;
244 + transition: all 250ms ease !important;
245 + /* transition: all 0.25s cubic-bezier(0.25, 1, 0.5, 1) !important; */
246 +}
247 +
248 +body.king-addons_page_king-addons-account .button,
249 +body.king-addons_page_king-addons-account .wp-core-ui .button,
250 +body.king-addons_page_king-addons-account .wp-core-ui .button-secondary {
251 + display: inline-flex;
47 252 align-items: center;
253 + justify-content: center;
254 + gap: 6px;
255 + padding: 8px 18px;
256 + border-radius: 980px;
257 + font-size: 14px;
258 + font-weight: 500;
48 259 text-decoration: none;
49 - color: white;
260 + transition: all 0.25s cubic-bezier(0.25, 1, 0.5, 1);
261 + cursor: pointer;
262 + border: none;
263 + background: var(--ka-account-btn-bg);
264 + color: var(--ka-account-btn-text);
265 + line-height: 1.4;
266 + min-height: auto;
267 + height: auto;
268 +}
269 +
270 +body.king-addons_page_king-addons-account .button:hover,
271 +body.king-addons_page_king-addons-account .wp-core-ui .button:hover,
272 +body.king-addons_page_king-addons-account .wp-core-ui .button-secondary:hover {
273 + background: rgba(0, 0, 0, 0.12);
274 + color: var(--ka-account-btn-text);
275 + transform: scale(1.02);
276 +}
277 +
278 +body.ka-v3-dark.king-addons_page_king-addons-account .button:hover,
279 +body.ka-v3-dark.king-addons_page_king-addons-account .wp-core-ui .button:hover,
280 +body.ka-v3-dark.king-addons_page_king-addons-account .wp-core-ui .button-secondary:hover {
281 + background: rgba(255, 255, 255, 0.16);
282 +}
283 +
284 +body.king-addons_page_king-addons-account .button-primary,
285 +body.king-addons_page_king-addons-account .wp-core-ui .button-primary {
286 + background: var(--ka-account-accent);
287 + color: #fff;
288 + border: none;
289 + box-shadow: none;
290 +}
291 +
292 +body.king-addons_page_king-addons-account .button-primary:hover,
293 +body.king-addons_page_king-addons-account .wp-core-ui .button-primary:hover {
294 + background: var(--ka-account-accent-hover);
295 + color: #fff;
296 + transform: scale(1.02);
297 + box-shadow: none;
298 +}
299 +
300 +body.king-addons_page_king-addons-account .button-small,
301 +body.king-addons_page_king-addons-account .wp-core-ui .button-small {
302 + padding: 6px 14px;
303 + font-size: 13px;
304 +}
305 +
306 +/* Activate License Button */
307 +body.king-addons_page_king-addons-account .fs-activate-license {
308 + background: var(--ka-account-accent);
309 + box-shadow: none;
310 + color: #fff;
311 +}
312 +
313 +body.king-addons_page_king-addons-account .fs-activate-license:hover {
314 + background: var(--ka-account-accent-hover);
315 + box-shadow: none;
316 + color: #fff;
317 +}
318 +
319 +/* ===== LINKS ===== */
320 +body.king-addons_page_king-addons-account a {
321 + color: var(--ka-account-link);
322 + text-decoration: none;
323 + transition: color 0.2s ease;
324 +}
325 +
326 +body.king-addons_page_king-addons-account a:hover {
327 + color: var(--ka-account-link-hover);
328 +}
329 +
330 +/* ===== BILLING SECTION ===== */
331 +body.king-addons_page_king-addons-account #fs_billing h3 {
332 + background: transparent;
333 + border-bottom: 1px solid var(--ka-account-divider);
334 + font-size: 17px;
335 + font-weight: 600;
336 + letter-spacing: -0.01em;
337 + margin: 0;
338 + padding: 20px 24px;
339 + color: var(--ka-account-text);
340 +}
341 +
342 +body.king-addons_page_king-addons-account #fs_billing_address {
343 + width: 100%;
344 + padding: 24px;
345 +}
346 +
347 +body.king-addons_page_king-addons-account #fs_billing_address tr td {
348 + padding: 12px;
349 + width: 50%;
350 +}
351 +
352 +body.king-addons_page_king-addons-account #fs_billing_address label span {
353 + font-weight: 500;
354 + color: var(--ka-account-text-secondary);
355 + font-size: 13px;
356 + display: block;
357 + margin-bottom: 6px;
358 +}
359 +
360 +body.king-addons_page_king-addons-account #fs_billing_address input,
361 +body.king-addons_page_king-addons-account #fs_billing_address select {
362 + width: 100%;
363 + padding: 12px 16px;
364 + border: 1px solid var(--ka-account-input-border);
365 + border-radius: 12px;
366 + font-size: 15px;
367 + font-family: inherit;
368 + background: var(--ka-account-input-bg);
369 + color: var(--ka-account-text);
370 + transition: border-color 0.2s, box-shadow 0.2s;
371 + margin-top: 0;
372 +}
373 +
374 +body.king-addons_page_king-addons-account #fs_billing_address input:focus,
375 +body.king-addons_page_king-addons-account #fs_billing_address select:focus {
376 + outline: none;
377 + border-color: var(--ka-account-accent);
378 + box-shadow: 0 0 0 4px rgba(0, 113, 227, 0.12);
379 +}
380 +
381 +body.king-addons_page_king-addons-account #fs_billing_address.fs-read-mode input,
382 +body.king-addons_page_king-addons-account #fs_billing_address.fs-read-mode select {
383 + background: transparent;
384 + border: none;
385 + border-bottom: 1px dashed var(--ka-account-divider);
386 + border-radius: 0;
387 + padding-left: 0;
388 + padding-right: 0;
389 + color: var(--ka-account-text);
390 +}
391 +
392 +body.king-addons_page_king-addons-account #fs_billing_address button {
393 + width: 100%;
394 + margin-top: 12px;
395 +}
396 +
397 +/* ===== PAYMENTS TABLE ===== */
398 +body.king-addons_page_king-addons-account #fs_payments h3 {
399 + background: transparent;
400 + border-bottom: 1px solid var(--ka-account-divider);
401 + font-size: 17px;
402 + font-weight: 600;
403 + letter-spacing: -0.01em;
404 + margin: 0;
405 + padding: 20px 24px;
406 + color: var(--ka-account-text);
407 +}
408 +
409 +body.king-addons_page_king-addons-account .widefat {
410 + border: none;
411 + border-collapse: collapse;
412 + width: 100%;
413 + background: transparent;
414 +}
415 +
416 +body.king-addons_page_king-addons-account .widefat thead,
417 +body.king-addons_page_king-addons-account .widefat tbody,
418 +body.king-addons_page_king-addons-account .widefat tr,
419 +body.king-addons_page_king-addons-account .widefat td,
420 +body.king-addons_page_king-addons-account .widefat th {
421 + background: transparent;
422 +}
423 +
424 +body.king-addons_page_king-addons-account .widefat thead td,
425 +body.king-addons_page_king-addons-account .widefat thead th {
426 + border-bottom: 1px solid var(--ka-account-divider);
427 + font-weight: 600;
428 + font-size: 13px;
429 + color: var(--ka-account-text-secondary);
430 + padding: 14px 24px;
431 + background: transparent;
432 + text-transform: uppercase;
433 + letter-spacing: 0.02em;
434 +}
435 +
436 +body.ka-v3-dark.king-addons_page_king-addons-account .widefat thead td,
437 +body.ka-v3-dark.king-addons_page_king-addons-account .widefat thead th {
438 + color: rgba(245, 245, 247, 0.72);
439 +}
440 +
441 +body.king-addons_page_king-addons-account .widefat tbody td {
442 + padding: 16px 24px;
443 + border-bottom: 1px solid var(--ka-account-divider);
444 + color: var(--ka-account-text);
445 + font-size: 14px;
446 +}
447 +
448 +body.ka-v3-dark.king-addons_page_king-addons-account .widefat tbody td {
449 + color: var(--ka-account-text);
450 +}
451 +
452 +body.king-addons_page_king-addons-account .widefat tbody tr:last-child td {
453 + border-bottom: none;
454 +}
455 +
456 +body.king-addons_page_king-addons-account .widefat tbody tr:nth-child(odd) {
457 + background-color: var(--ka-account-table-stripe);
458 +}
459 +
460 +body.ka-v3-dark.king-addons_page_king-addons-account .widefat tbody tr:nth-child(odd),
461 +body.ka-v3-dark.king-addons_page_king-addons-account .widefat tbody tr.alternate {
462 + background-color: var(--ka-account-table-stripe) !important;
463 +}
464 +
465 +body.king-addons_page_king-addons-account .widefat tbody tr:hover {
466 + background-color: rgba(0, 113, 227, 0.05);
467 +}
468 +
469 +body.ka-v3-dark.king-addons_page_king-addons-account .widefat tbody tr:hover {
470 + background-color: rgba(100, 181, 246, 0.12);
471 +}
472 +
473 +/* Invoice button */
474 +body.king-addons_page_king-addons-account .widefat .button {
475 + padding: 6px 14px;
476 + font-size: 12px;
477 + border-radius: 8px;
478 +}
479 +
480 +/* ===== TAGS & BADGES ===== */
481 +body.king-addons_page_king-addons-account label.fs-tag,
482 +body.king-addons_page_king-addons-account span.fs-tag {
483 + background: rgba(0, 113, 227, 0.12);
484 + border: 1px solid rgba(0, 113, 227, 0.18);
485 + border-radius: 980px;
486 + color: var(--ka-account-accent);
487 + display: inline-block;
488 + font-size: 11px;
489 + font-weight: 600;
490 + line-height: 1;
491 + padding: 6px 12px;
492 + vertical-align: middle;
493 + text-transform: uppercase;
494 + letter-spacing: 0.03em;
495 +}
496 +
497 +body.ka-v3-dark.king-addons_page_king-addons-account label.fs-tag,
498 +body.ka-v3-dark.king-addons_page_king-addons-account span.fs-tag {
499 + background: rgba(100, 181, 246, 0.18);
500 + border-color: rgba(100, 181, 246, 0.22);
501 + color: #64b5f6;
502 +}
503 +
504 +body.king-addons_page_king-addons-account label.fs-tag.fs-error,
505 +body.king-addons_page_king-addons-account span.fs-tag.fs-error {
506 + background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
507 +}
508 +
509 +body.king-addons_page_king-addons-account label.fs-tag.fs-info,
510 +body.king-addons_page_king-addons-account span.fs-tag.fs-info {
511 + background: linear-gradient(135deg, #0071e3 0%, #0077ed 100%);
512 +}
513 +
514 +/* ===== MODALS ===== */
515 +body.king-addons_page_king-addons-account .fs-modal {
516 + z-index: 100100;
517 +}
518 +
519 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-dialog {
520 + background: var(--ka-account-card-bg);
521 + backdrop-filter: blur(20px);
522 + -webkit-backdrop-filter: blur(20px);
523 + border: 1px solid var(--ka-account-card-border);
524 + border-radius: 20px;
525 + box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
526 + overflow: hidden;
527 + padding-bottom: 0;
528 + background: rgb(248 248 248);
529 +}
530 +
531 +body.king-addons_page_king-addons-account .fs-modal.fs-modal-email-address-update p {
50 532 margin-bottom: 10px;
51 533 }
52 534
53 -h2.nav-tab-wrapper {
54 - padding: 25px 15px 15px 30px;
55 - background: #1a1b1b;
56 - margin-bottom: 20px;
57 - border-radius: 8px;
535 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-body,
536 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-panel {
537 + background: transparent;
538 + color: var(--ka-account-text);
58 539 }
59 540
60 -.nav-tab-active:hover {
61 - border-bottom: none;
62 - background: #1a1b1b;
63 - color: white;
541 +/* Some Freemius modals inject white panels; force them to match the theme */
542 +body.ka-v3-dark.king-addons_page_king-addons-account .fs-modal .fs-modal-dialog,
543 +body.ka-v3-dark.king-addons_page_king-addons-account .fs-modal .fs-modal-body,
544 +body.ka-v3-dark.king-addons_page_king-addons-account .fs-modal .fs-modal-panel {
545 + background: var(--ka-account-card-bg) !important;
546 + color: var(--ka-account-text) !important;
64 547 }
65 548
66 -.wp-core-ui .button:not(.king-addons-upgrade-notice a),
67 -.wp-core-ui .button-secondary {
68 - color: #191919;
69 - border-color: #191919;
70 - background: white;
71 - border-radius: 5px !important;
549 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-header {
550 + background: transparent;
551 + border-bottom: 1px solid var(--ka-account-divider);
552 + padding: 20px 24px;
553 + border-radius: 0;
72 554 }
73 555
74 -.alternate,
75 -.striped > tbody > :nth-child(odd),
76 -ul.striped > :nth-child(odd) {
77 - background-color: #f2f4f5;
556 +body.ka-v3-dark.king-addons_page_king-addons-account .button.button-primary:hover {
557 + background: #0077ed;
78 558 }
79 559
80 -html, #wpcontent {
81 - background: #f8f8f8;
560 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-header h4 {
561 + color: var(--ka-account-text) !important;
562 + font-size: 17px;
563 + font-weight: 600;
564 + margin: 0;
82 565 }
83 566
84 -#wpcontent {
85 - min-height: 100vh;
567 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-header .fs-close {
568 + color: var(--ka-account-text-secondary);
569 + opacity: 1;
86 570 }
87 571
88 -a {
89 - color: #6957F0;
572 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-header .fs-close:hover {
573 + color: var(--ka-account-text);
574 + background: #e8e8e8;
90 575 }
91 576
92 -a:hover {
93 - color: #191919;
577 +body.ka-v3-dark.king-addons_page_king-addons-account .fs-modal .fs-modal-header .fs-close:hover {
578 + background: #29292b;
94 579 }
95 580
96 -.fs-key-value-table code,
97 -.fs-key-value-table input[type=text],
98 -.fs-key-value-table var {
99 - color: #191919;
581 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-body {
582 + padding: 24px 24px 16px;
583 + color: var(--ka-account-text);
584 +}
585 +
586 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-footer {
587 + background: transparent;
588 + border-top: 1px solid var(--ka-account-divider);
589 + padding: 16px 24px;
590 + border-radius: 0;
591 + display: flex;
592 + justify-content: flex-end;
593 + gap: 12px;
594 +}
595 +
596 +body.king-addons_page_king-addons-account .fs-modal input[type="text"],
597 +body.king-addons_page_king-addons-account .fs-modal input[type="email"],
598 +body.king-addons_page_king-addons-account .fs-modal select {
599 + width: 100%;
600 + padding: 12px 16px;
601 + border: 1px solid var(--ka-account-input-border);
602 + border-radius: 12px;
100 603 font-size: 15px;
604 + font-family: inherit;
605 + background: var(--ka-account-input-bg);
606 + color: var(--ka-account-text);
607 + transition: border-color 0.2s, box-shadow 0.2s;
101 608 }
102 609
103 -#wpfooter {
610 +body.king-addons_page_king-addons-account .fs-modal input[type="text"]:focus,
611 +body.king-addons_page_king-addons-account .fs-modal input[type="email"]:focus,
612 +body.king-addons_page_king-addons-account .fs-modal select:focus {
613 + outline: none;
614 + border-color: var(--ka-account-accent);
615 + box-shadow: 0 0 0 4px rgba(0, 113, 227, 0.12);
616 +}
617 +
618 +/* Update License modal: avoid clipped inputs and extra spacing */
619 +body.king-addons_page_king-addons-account .fs-modal .fs-license-options-container {
620 + max-width: 100%;
621 +}
622 +
623 +body.king-addons_page_king-addons-account .fs-modal .fs-license-options-container table {
624 + width: 100%;
625 + table-layout: fixed;
626 +}
627 +
628 +body.king-addons_page_king-addons-account .fs-modal .fs-license-options-container td {
629 + overflow: visible;
630 +}
631 +
632 +body.king-addons_page_king-addons-account .fs-license-options-container table td:first-child {
633 + width: 30px;
634 +}
635 +
636 +body.king-addons_page_king-addons-account .fs-license-options-container table .fs-other-license-key-container label {
637 + top: 0;
638 +}
639 +
640 +body.king-addons_page_king-addons-account .fs-modal .fs-other-license-key-container {
641 + min-width: 0;
642 + width: 100%;
643 +}
644 +
645 +body.king-addons_page_king-addons-account .fs-modal .fs-other-license-key-container > div {
646 + min-width: 0;
647 + width: 100%;
648 + height: auto;
649 +}
650 +
651 +body.king-addons_page_king-addons-account .fs-modal .fs-other-license-key-container input[type="text"] {
652 + max-width: 100%;
653 +}
654 +
655 +body.king-addons_page_king-addons-account .fs-modal .fs-modal-body > *:last-child {
656 + margin-bottom: 0;
657 +}
658 +
659 +/* Modal overlay */
660 +body.king-addons_page_king-addons-account.has-fs-modal::before {
661 + background: rgba(0, 0, 0, 0.5);
662 + backdrop-filter: blur(4px);
663 + -webkit-backdrop-filter: blur(4px);
664 +}
665 +
666 +/* ===== NOTICES ===== */
667 +body.king-addons_page_king-addons-account .notice,
668 +body.king-addons_page_king-addons-account .updated,
669 +body.king-addons_page_king-addons-account .error,
670 +body.king-addons_page_king-addons-account .fs-notice {
671 + background: var(--ka-account-card-bg);
672 + backdrop-filter: blur(20px);
673 + -webkit-backdrop-filter: blur(20px);
674 + border: 1px solid var(--ka-account-card-border);
675 + border-radius: 16px;
676 + box-shadow: var(--ka-account-card-shadow);
677 + padding: 16px 20px;
678 + margin: 0 0 20px 0;
679 + border-left-width: 4px;
680 +}
681 +
682 +/* Freemius notice internals */
683 +body.king-addons_page_king-addons-account .fs-notice {
684 + position: relative;
685 +}
686 +
687 +body.king-addons_page_king-addons-account .fs-notice .fs-plugin-title {
104 688 display: none;
105 689 }
106 690
107 -#wpbody-content {
691 +body.king-addons_page_king-addons-account .fs-notice .fs-notice-body {
692 + color: var(--ka-account-text);
693 + font-size: 14px;
694 + line-height: 1.6;
695 +}
696 +
697 +body.king-addons_page_king-addons-account .fs-notice .fs-notice-body strong {
698 + font-weight: 600;
699 +}
700 +
701 +body.king-addons_page_king-addons-account .fs-notice .fs-notice-body a {
702 + color: var(--ka-account-link);
703 + text-decoration: none;
704 + font-weight: 500;
705 +}
706 +
707 +body.king-addons_page_king-addons-account .fs-notice .fs-notice-body a:hover {
708 + color: var(--ka-account-link-hover);
709 +}
710 +
711 +body.king-addons_page_king-addons-account .fs-notice.updated.success {
712 + border-left-color: var(--ka-account-success);
713 +}
714 +
715 +body.king-addons_page_king-addons-account .fs-notice.updated.error,
716 +body.king-addons_page_king-addons-account .fs-notice.error {
717 + border-left-color: var(--ka-account-error);
718 +}
719 +
720 +body.king-addons_page_king-addons-account .fs-notice.updated.warning,
721 +body.king-addons_page_king-addons-account .fs-notice.warning {
722 + border-left-color: var(--ka-account-warning);
723 +}
724 +
725 +body.king-addons_page_king-addons-account .notice p,
726 +body.king-addons_page_king-addons-account .updated p,
727 +body.king-addons_page_king-addons-account .error p,
728 +body.king-addons_page_king-addons-account .fs-notice p {
729 + margin: 0;
730 + padding: 0;
731 + color: var(--ka-account-text);
732 +}
733 +
734 +body.king-addons_page_king-addons-account .notice.notice-success,
735 +body.king-addons_page_king-addons-account .updated.notice-success {
736 + border-left-color: var(--ka-account-success);
737 +}
738 +
739 +body.king-addons_page_king-addons-account .notice.notice-warning {
740 + border-left-color: var(--ka-account-warning);
741 +}
742 +
743 +body.king-addons_page_king-addons-account .notice.notice-error,
744 +body.king-addons_page_king-addons-account .error {
745 + border-left-color: var(--ka-account-error);
746 +}
747 +
748 +body.king-addons_page_king-addons-account .notice.notice-info {
749 + border-left-color: var(--ka-account-link);
750 +}
751 +
752 +body.king-addons_page_king-addons-account .fs-notice[data-id="license_not_whitelabeled"].success,
753 +body.king-addons_page_king-addons-account .fs-notice[data-id="license_whitelabeled"].success {
754 + border-left-color: var(--ka-account-success);
755 +}
756 +
757 +/* ===== INLINE BUTTON ===== */
758 +body.king-addons_page_king-addons-account .fs-button-inline {
759 + display: inline-flex;
760 + align-items: center;
761 + gap: 6px;
762 + color: var(--ka-account-text-secondary);
763 + font-size: 13px;
764 + transition: color 0.2s ease;
765 +}
766 +
767 +body.king-addons_page_king-addons-account .fs-button-inline:hover {
768 + color: var(--ka-account-error);
769 +}
770 +
771 +body.king-addons_page_king-addons-account .fs-button-inline .dashicons {
772 + font-size: 14px;
773 + width: 14px;
774 + height: 14px;
775 +}
776 +
777 +/* ===== SCROLLABLE TABLE ===== */
778 +body.king-addons_page_king-addons-account #fs_sites .fs-scrollable-table .fs-table-body {
779 + border: 1px solid var(--ka-account-divider);
780 + border-radius: 12px;
781 + max-height: 200px;
782 + overflow: auto;
783 +}
784 +
785 +body.king-addons_page_king-addons-account #fs_sites .fs-scrollable-table .fs-table-body > table.widefat {
786 + border: none !important;
787 +}
788 +
789 +/* ===== ADDONS SECTION ===== */
790 +body.king-addons_page_king-addons-account #fs_addons h3 {
791 + border: none;
792 + margin-bottom: 0;
793 + padding: 4px 5px;
794 +}
795 +
796 +body.king-addons_page_king-addons-account #fs_addons td {
797 + vertical-align: middle;
798 +}
799 +
800 +/* ===== DASHICONS COLOR IN DARK MODE ===== */
801 +body.ka-v3-dark.king-addons_page_king-addons-account .dashicons {
802 + color: var(--ka-account-text);
803 +}
804 +
805 +body.ka-v3-dark.king-addons_page_king-addons-account #fs_account h3 .dashicons {
806 + color: #64b5f6;
807 +}
808 +
809 +/* ===== FOOTER ===== */
810 +body.king-addons_page_king-addons-account #wpfooter {
811 + display: none;
812 +}
813 +
814 +body.king-addons_page_king-addons-account #wpbody-content {
108 815 padding-bottom: 0;
109 816 }
110 817
111 -code {
112 - font-family: inherit;
818 +/* ===== CODE ELEMENT ===== */
819 +body.king-addons_page_king-addons-account code {
820 + font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
821 + background: none;
113 822 }
114 823
115 -.fs-key-value-table td, .fs-key-value-table th {
116 - padding: 8px;
824 +/* ===== RESPONSIVE ADJUSTMENTS ===== */
825 +@media screen and (max-width: 782px) {
826 + body.king-addons_page_king-addons-account .wrap.fs-section {
827 + padding: 24px 16px;
828 + }
829 +
830 + body.king-addons_page_king-addons-account .postbox {
831 + border-radius: 16px;
832 + }
833 +
834 + body.king-addons_page_king-addons-account #fs_account .fs-header-actions {
835 + position: static;
836 + margin: 0 0 12px;
837 + padding: 0 24px 12px;
838 + }
839 +
840 + body.king-addons_page_king-addons-account #fs_account .fs-header-actions ul {
841 + flex-wrap: wrap;
842 + }
843 +
844 + body.king-addons_page_king-addons-account .fs-key-value-table td {
845 + display: block;
846 + padding: 12px 24px;
847 + }
848 +
849 + body.king-addons_page_king-addons-account .fs-key-value-table tr td:first-child {
850 + width: 100%;
851 + padding-bottom: 4px;
852 + }
853 +
854 + body.king-addons_page_king-addons-account .fs-key-value-table tr td:nth-child(2) {
855 + padding-top: 0;
856 + }
857 +
858 + body.king-addons_page_king-addons-account #fs_billing_address tr td {
859 + display: block;
860 + width: 100%;
861 + }
117 862 }
118 863
119 -.fs-notice[data-id=license_not_whitelabeled].success,
120 -.fs-notice[data-id=license_whitelabeled].success {
121 - border-left-color: #6957F0;
122 - color: inherit;
864 +/* ===== SMOOTH TRANSITIONS FOR THEME SWITCH ===== */
865 +body.king-addons_page_king-addons-account,
866 +body.king-addons_page_king-addons-account #wpcontent,
867 +body.king-addons_page_king-addons-account #wpbody,
868 +body.king-addons_page_king-addons-account #wpbody-content,
869 +body.king-addons_page_king-addons-account .postbox,
870 +body.king-addons_page_king-addons-account .fs-key-value-table td,
871 +body.king-addons_page_king-addons-account .widefat tbody td,
872 +body.king-addons_page_king-addons-account a,
873 +body.king-addons_page_king-addons-account .button {
874 + transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
123 875 }
124 876
125 -#fs_account h3 .dashicons {
126 - font-size: 1.2em;
127 - height: 24px;
128 - width: 24px;
877 +/* ===== PREVENT FLASH ON INITIAL LOAD ===== */
878 +body.king-addons_page_king-addons-account.ka-no-transition,
879 +body.king-addons_page_king-addons-account.ka-no-transition * {
880 + transition: none !important;
129 881 }
130 882
131 -.fs-modal .fs-modal-header h4 {
132 - color: #191919 !important;
883 +/* ===== BUTTON GROUP ===== */
884 +body.king-addons_page_king-addons-account .button-group {
885 + display: flex;
886 + gap: 8px;
887 + align-items: center;
888 + flex-wrap: wrap;
133 889 }
134 890
135 -.fs-modal .fs-modal-header {
136 - border-top-left-radius: 5px;
137 - border-top-right-radius: 5px;
891 +body.king-addons_page_king-addons-account .button-group .button {
892 + margin: 8px 8px 0 0;
138 893 }
139 894
140 -.fs-modal .fs-modal-footer {
141 - border-bottom-left-radius: 5px;
142 - border-bottom-right-radius: 5px;
895 +body.king-addons_page_king-addons-account .fs-header-actions li:has(a[href*="king-addons-pricing"]),
896 +body.king-addons_page_king-addons-account .fs-header-actions li:has(a[href*="king-addons-pricing"]) + li {
897 + display: none;
143 898 }
144 899
900 +body.king-addons_page_king-addons-account a.button.fs-change-plan.button-upgrade {
901 + display: none;
902 +}
145 903
146 -#fs_account .fs-header-actions li {
147 - float: left;
148 - font-weight: 400;
149 - margin: 0 2px;
904 +/* ===== FORM INLINE ===== */
905 +body.king-addons_page_king-addons-account .fs-key-value-table form {
906 + display: inline-block;
150 907 }
151 908
152 -.updated a {
153 - text-decoration: none;
154 - padding-bottom: 0 !important;
909 +body.king-addons_page_king-addons-account .fs-key-value-table tr td:first-child form {
910 + display: block;
155 911 }
156 912
157 -#fs_account h3 {
158 - border-bottom: 1px solid #f1f1f4;
159 - font-size: 1.2em;
160 - line-height: 1.4;
161 - margin: 0 0 12px;
162 - padding: 12px 15px;
913 +/* ===== LICENSE OPTIONS IN MODAL ===== */
914 +body.king-addons_page_king-addons-account .fs-license-options-container table {
915 + width: 100%;
163 916 }
164 917
165 -.button.fs-change-plan.button-upgrade {
166 - margin-left: 5px;
918 +body.king-addons_page_king-addons-account .fs-license-options-container td {
919 + padding: 8px 0;
920 + vertical-align: middle;
921 +}
922 +
923 +body.king-addons_page_king-addons-account .fs-license-options-container input[type="radio"] {
924 + margin-right: 8px;
925 +}
926 +
927 +body.king-addons_page_king-addons-account .fs-license-options-container select {
928 + width: 100%;
929 +}
930 +
931 +body.king-addons_page_king-addons-account .fs-other-license-key-container {
932 + display: flex;
933 + align-items: center;
934 + gap: 8px;
935 + flex-wrap: wrap;
936 +}
937 +
938 +body.king-addons_page_king-addons-account .fs-other-license-key-container > div {
939 + flex: 1;
940 + min-width: 200px;
941 +}
942 +
943 +body.king-addons_page_king-addons-account .show-license-resend-modal {
944 + font-size: 13px;
945 + color: var(--ka-account-link);
946 + display: block;
947 + margin-top: 16px;
948 +}
949 +
950 +body.king-addons_page_king-addons-account .show-license-resend-modal:hover {
951 + color: var(--ka-account-link-hover);
952 +}
953 +
954 +/* ===== TOGGLE VISIBILITY BUTTON ===== */
955 +body.king-addons_page_king-addons-account .fs-toggle-visibility {
956 + padding: 6px 12px;
957 + font-size: 12px;
958 +}
959 +
960 +/* ===== HIDE PROMO TAB ===== */
961 +#fs_promo_tab {
962 + display: none !important;
167 963 }