PluginProbe
User Profile Builder – Beautiful User Registration Forms, User Profiles & User Role Editor / 3.9.9
User Profile Builder – Beautiful User Registration Forms, User Profiles & User Role Editor v3.9.9
4.0.3 4.0.2 4.0.1 4.0.0 3.16.6 3.16.5 3.16.4 3.16.3 3.16.2 3.16.1 3.16.0 3.15.9 3.9.9 3.9.5 3.9.6 3.9.7 3.9.8 1.1.7 1.1.8 1.1.9 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 All 341 releases
profile-builder / assets / css / style-back-end.css

style-back-end.css in User Profile Builder – Beautiful User Registration Forms, User Profiles & User Role Editor 3.9.9, at assets/css/style-back-end.css

2,492 lines 66.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .cozmoslabs-wrap {
2 max-width: 900px !important;
3 margin: 0 auto;
4 box-sizing: border-box;
5 display: flex;
6 flex-direction: column;
7 }
8
9 body[class*="profile-builder_page_"] #screen-meta-links {
10 margin-left: 20px;
11 position: absolute;
12 right: 0;
13 top: auto;
14 }
15
16 .wppb-backend-notice {
17 display: inline-block;
18 background-color: #FDFBE6;
19 border: 1px solid #ffb900;
20 font-style: normal;
21 font-weight: 400;
22 font-size: 14px;
23 line-height: 16px;
24 color: #1E1E1E;
25 padding: 10px 20px;
26 border-radius: 2px;
27 margin: 5px 0;
28 }
29
30 .cozmoslabs-columns-container {
31 display: flex;
32 align-items: flex-start;
33 justify-content: flex-start;
34 }
35
36 .cozmoslabs-columns-container .cozmoslabs-column {
37 box-sizing: border-box;
38 flex: 1;
39 }
40
41 .cozmoslabs-columns-container .cozmoslabs-column:not(:first-of-type) {
42 border-left: 1px solid #c3c4c7;
43 }
44
45 .cozmoslabs-columns-container .cozmoslabs-column:not(:last-of-type) {
46 padding-right: 20px;
47 }
48
49 .cozmoslabs-columns-container .cozmoslabs-column:last-of-type {
50 padding-left: 20px;
51 }
52
53
54 /***********************************************************/
55 /* Settings Page Header
56 /***********************************************************/
57
58 .cozmoslabs-page-header {
59 display: flex;
60 flex-direction: row;
61 align-items: center;
62 justify-content: space-between;
63 margin: 40px 0;
64 }
65
66 .cozmoslabs-section-title {
67 display: flex;
68 flex-direction: row;
69 align-items: center;
70 justify-content: flex-start;
71 gap: 10px;
72 margin: 0;
73 }
74
75 .cozmoslabs-wrap .cozmoslabs-page-title {
76 font-style: normal;
77 font-weight: 400;
78 font-size: 26px;
79 line-height: 28px;
80 color: #1E1E1E;
81 margin: 0;
82 }
83
84
85 /***********************************************************/
86 /* Primary Tab Navigation
87 /***********************************************************/
88
89 .cozmoslabs-nav-tab-wrapper {
90 display: flex;
91 flex-direction: row;
92 align-items: center;
93 justify-content: flex-start;
94 flex-wrap: nowrap;
95 gap: 10px;
96 height: 50px;
97 padding: 0 10px;
98 margin-top: 0;
99 background: #FFFFFF;
100 border: 1px solid #CCCCCC;
101 border-bottom-width: 2px;
102 box-shadow: 0 1px 1px rgb(0 0 0 / 10%);
103 border-radius: 2px 2px 0 0;
104 }
105
106 .cozmoslabs-nav-tab-wrapper a.nav-tab {
107 background: none;
108 border: none;
109 border-bottom: 2px solid transparent;
110 margin: 0 0 -2px 0;
111 padding: 0 15px;
112 line-height: 50px;
113 font-style: normal;
114 font-weight: 500;
115 font-size: 13px;
116 color: #1E1E1E;
117 }
118
119 .cozmoslabs-nav-tab-wrapper a.nav-tab:hover,
120 .cozmoslabs-nav-tab-wrapper a.nav-tab.nav-tab-active {
121 border-bottom: 2px solid #3858E9;
122 }
123
124 .cozmoslabs-nav-tab-wrapper a.nav-tab:focus {
125 box-shadow: none;
126 outline: none;
127 }
128
129
130 /***********************************************************/
131 /* Secondary Tab Navigation
132 /***********************************************************/
133
134 .cozmoslabs-nav-sub-tab-wrapper {
135 display: flex;
136 flex-direction: row;
137 align-items: center;
138 justify-content: flex-start;
139 gap: 30px;
140 height: 40px;
141 background: #FFFFFF;
142 border: 1px solid #CCCCCC;
143 border-top: 0;
144 border-radius: 2px 2px 0 0;
145 padding: 0 15px;
146 margin-top: 0;
147 float: none;
148 }
149
150 .cozmoslabs-nav-sub-tab-wrapper li {
151 border: none;
152 }
153
154 .cozmoslabs-nav-sub-tab-wrapper a.nav-sub-tab {
155 font-style: normal;
156 font-weight: 400;
157 font-size: 13px;
158 line-height: 16px;
159 color: #757575;
160 }
161
162 .cozmoslabs-nav-sub-tab-wrapper a.nav-sub-tab:hover,
163 .cozmoslabs-nav-sub-tab-wrapper a.nav-sub-tab.current {
164 text-decoration: underline;
165 color: #3858E9;
166 font-weight: 400;
167 }
168
169 .cozmoslabs-nav-sub-tab-wrapper a:focus {
170 outline: none;
171 box-shadow: none;
172 }
173
174 .cozmoslabs-nav-sub-tab-wrapper .subsubsub-sub-tab:after {
175 display: none;
176 }
177
178
179 /***********************************************************/
180 /* Page Banner
181 /***********************************************************/
182
183 body[class*="profile-builder_page_"] .cozmoslabs-banner,
184 body[class*="post-type-wppb-"] .cozmoslabs-banner {
185 margin-left: -20px;
186 }
187
188 .cozmoslabs-banner {
189 display: flex;
190 flex-direction: row;
191 align-items: center;
192 justify-content: space-between;
193 flex-wrap: wrap;
194 box-sizing: border-box;
195 background: #E8F2FF;
196 border: 1px solid #9FAAB8;
197 border-radius: 0;
198 padding: 15px;
199 }
200
201 .cozmoslabs-banner-title {
202 display: flex;
203 flex-direction: row;
204 align-items: center;
205 justify-content: flex-start;
206 gap: 10px;
207 }
208
209 .cozmoslabs-banner-title h4 {
210 font-family: 'Poppins', sans-serif;
211 font-style: normal;
212 font-weight: 600;
213 font-size: 24px;
214 line-height: 34px;
215 letter-spacing: -0.03em;
216 text-transform: capitalize;
217 margin: 0;
218 color: #212121;
219 }
220
221 .cozmoslabs-banner-title img {
222 width: 30px;
223 height: 30px;
224 }
225
226 .cozmoslabs-banner-buttons {
227 display: flex;
228 flex-direction: row;
229 align-items: center;
230 justify-content: flex-start;
231 flex-wrap: wrap;
232 gap: 15px;
233 }
234
235 .cozmoslabs-banner-link {
236 display: flex;
237 flex-direction: row;
238 justify-content: center;
239 align-items: center;
240 gap: 5px;
241 border: 1px solid #9FAAB8;
242 border-radius: 2px;
243 padding: 8px 12px;
244 font-style: normal;
245 font-size: 13px;
246 text-decoration: none;
247 }
248
249 .cozmoslabs-banner-link:focus {
250 outline: none;
251 box-shadow: none;
252 }
253
254 .cozmoslabs-support-link,
255 .cozmoslabs-documentation-link {
256 background: #FFFFFF;
257 color: #1E1E1E;
258 font-weight: 400;
259 }
260
261 .cozmoslabs-support-link:hover,
262 .cozmoslabs-documentation-link:hover,
263 .cozmoslabs-support-link:focus,
264 .cozmoslabs-documentation-link:focus {
265 background: #F0F0F0;
266 color: #1E1E1E;
267 }
268
269 .cozmoslabs-upgrade-link {
270 background: #0F15B0;
271 border: none;
272 color: #FFFFFF;
273 font-weight: 600;
274 }
275
276 .cozmoslabs-upgrade-link:focus,
277 .cozmoslabs-upgrade-link:hover {
278 background: #0e1294;
279 color: #FFFFFF;
280 }
281
282
283 /***********************************************************/
284 /* Form Settings
285 /***********************************************************/
286
287
288 .cozmoslabs-form-subsection-wrapper {
289 background: #FFFFFF;
290 border: 1px solid #CCCCCC;
291 border-radius: 2px;
292 padding: 25px 15px;
293 margin-top: 20px;
294 }
295
296 .cozmoslabs-subsection-title {
297 font-weight: 600;
298 font-size: 11px !important;
299 line-height: 16px !important;
300 text-transform: uppercase;
301 color: #1E1E1E;
302 margin: 0 0 10px 0 !important;
303 padding: 0 !important;
304 display: flex;
305 justify-content: space-between;
306 }
307
308 .cozmoslabs-form-subsection-wrapper .inside {
309 margin: 0;
310 padding: 0;
311 }
312
313 .cozmoslabs-form-field-wrapper {
314 display: flex;
315 flex-direction: row;
316 align-items: center;
317 justify-content: flex-start;
318 flex-wrap: wrap;
319 gap: 10px;
320 margin-top: 35px !important;
321 }
322
323 .cozmoslabs-form-subsection-wrapper.cozmoslabs-no-title-section > .cozmoslabs-form-field-wrapper:first-of-type {
324 margin-top: 0 !important;
325 }
326
327 .cozmoslabs-form-field-wrapper label.cozmoslabs-form-field-label {
328 flex-basis: 220px;
329 font-weight: 600;
330 font-size: 13px;
331 line-height: 16px;
332 display: flex;
333 align-items: center;
334 gap: 10px;
335 color: #1E1E1E;
336 }
337
338 .cozmoslabs-form-field-wrapper .chosen-container,
339 .cozmoslabs-form-field-wrapper .select2-container,
340 .cozmoslabs-form-field-wrapper select,
341 .cozmoslabs-form-field-wrapper input[type="date"],
342 .cozmoslabs-form-field-wrapper input[type="password"],
343 .cozmoslabs-form-field-wrapper input[type="number"]:not(.wppb-rpf-rule-value),
344 .cozmoslabs-form-field-wrapper input[type="file"],
345 .cozmoslabs-form-field-wrapper input[type="text"]:not(#paypal-ipn-url, #stripe-connect-webhook-url, .wck-woocheckbox-field-label) {
346 flex-basis: 330px;
347 width: 330px;
348 }
349
350 .cozmoslabs-form-field-wrapper textarea,
351 .cozmoslabs-form-field-wrapper .chosen-container .chosen-single,
352 .cozmoslabs-form-field-wrapper .select2-container .select2-selection,
353 .cozmoslabs-form-field-wrapper select,
354 .cozmoslabs-form-field-wrapper input[type="password"],
355 .cozmoslabs-form-field-wrapper input[type="date"],
356 .cozmoslabs-form-field-wrapper input[type="number"],
357 .cozmoslabs-form-field-wrapper input[type="text"]:not(#paypal-ipn-url, #stripe-connect-webhook-url, .wck-woocheckbox-field-label) {
358 border: 1px solid #949494;
359 border-radius: 2px;
360 font-size: 13px;
361 line-height: 20px;
362 color: #1E1E1E;
363 padding: 0 10px;
364 margin: 0;
365 }
366
367 .cozmoslabs-form-field-wrapper textarea {
368 flex-basis: 330px;
369 width: 330px;
370 height: 100px;
371 padding: 10px !important;
372 }
373
374 .cozmoslabs-form-field-wrapper .select2-container .select2-selection--single,
375 .cozmoslabs-form-field-wrapper .chosen-container .chosen-single,
376 .cozmoslabs-form-field-wrapper select,
377 .cozmoslabs-form-field-wrapper input[type="password"],
378 .cozmoslabs-form-field-wrapper input[type="date"],
379 .cozmoslabs-form-field-wrapper input[type="number"],
380 .cozmoslabs-form-field-wrapper input[type="text"]:not(#paypal-ipn-url, #stripe-connect-webhook-url, .wck-woocheckbox-field-label) {
381 height: 40px;
382 }
383
384 .cozmoslabs-form-field-wrapper .select2-container .select2-selection--single .select2-selection__rendered,
385 .cozmoslabs-form-field-wrapper .chosen-container-multi .chosen-choices {
386 min-height: 40px;
387 line-height: 40px;
388 }
389
390 .cozmoslabs-form-field-wrapper .select2-selection--multiple .select2-selection__rendered {
391 min-height: 40px;
392 display: flex !important;
393 flex-wrap: wrap;
394 justify-content: flex-start;
395 align-items: center;
396 }
397
398 .cozmoslabs-form-field-wrapper .select2-selection--multiple .select2-selection__rendered .select2-selection__choice__remove:hover {
399 color: #e76054;
400 }
401
402 .cozmoslabs-form-field-wrapper .select2-selection--multiple .select2-selection__rendered .select2-selection__choice,
403 .cozmoslabs-form-field-wrapper .chosen-container .chosen-single {
404 display: flex;
405 align-items: center;
406 background: #ffffff;
407 }
408
409 .cozmoslabs-form-field-wrapper .select2-container .select2-selection,
410 .cozmoslabs-form-field-wrapper .chosen-container .chosen-single div b {
411 background: url('data:image/svg+xml;charset=US-ASCII,<svg width="20" height="20" xmlns="http://www.w3.org/2000/svg"><path d="M5 6l5 5 5-5 2 1-7 7-7-7 2-1z" fill="%23555"/></svg>') no-repeat right 5px top 55% !important;
412 background-size: 16px 16px !important;
413 }
414
415 .cozmoslabs-form-field-wrapper .select2-container .select2-selection .select2-selection__arrow {
416 display: none;
417 }
418
419 .cozmoslabs-form-field-wrapper textarea:not(:disabled, :read-only):hover,
420 .cozmoslabs-form-field-wrapper .chosen-container .chosen-single:hover,
421 .cozmoslabs-form-field-wrapper .select2-container .select2-selection:hover,
422 .cozmoslabs-form-field-wrapper select:hover,
423 .cozmoslabs-form-field-wrapper input[type="password"]:not(:disabled, :read-only):hover,
424 .cozmoslabs-form-field-wrapper input[type="date"]:not(:disabled, :read-only):hover,
425 .cozmoslabs-form-field-wrapper input[type="number"]:not(:disabled, :read-only):hover,
426 .cozmoslabs-form-field-wrapper input[type="text"]:not(:disabled, :read-only, #paypal-ipn-url, #stripe-connect-webhook-url):hover {
427 border-color: #3858E9;
428 color: #1E1E1E;
429 }
430
431 .cozmoslabs-form-field-wrapper textarea:focus,
432 .cozmoslabs-form-field-wrapper .chosen-container-active,
433 .cozmoslabs-form-field-wrapper .select2-container--focus .select2-selection--multiple,
434 .cozmoslabs-form-field-wrapper select:focus,
435 .cozmoslabs-form-field-wrapper input[type="password"]:not(:disabled):focus,
436 .cozmoslabs-form-field-wrapper input[type="date"]:not(:disabled):focus,
437 .cozmoslabs-form-field-wrapper input[type="number"]:not(:disabled):focus,
438 .cozmoslabs-form-field-wrapper input[type="text"]:not(:disabled, #paypal-ipn-url, #stripe-connect-webhook-url):focus {
439 border: 1px solid #3858E9 !important;
440 box-shadow: 0 0 0 1px #3858E9;
441 }
442
443 .cozmoslabs-form-field-wrapper .chosen-container-active,
444 .cozmoslabs-form-field-wrapper select:focus {
445 color: #3858E9;
446 }
447
448 .cozmoslabs-form-field-wrapper textarea:disabled,
449 .cozmoslabs-form-field-wrapper select:disabled,
450 .cozmoslabs-form-field-wrapper input[type="password"]:disabled,
451 .cozmoslabs-form-field-wrapper input[type="date"]:disabled,
452 .cozmoslabs-form-field-wrapper input[type="number"]:disabled,
453 .cozmoslabs-form-field-wrapper input[type="text"]:not(#paypal-ipn-url, #stripe-connect-webhook-url):disabled {
454 opacity: 0.5;
455 pointer-events: none;
456 }
457
458 .cozmoslabs-wrap a:not(.button-secondary, .button-primary, .submitdelete, .mbdelete, .chosen-single, .cozmoslabs-remove-item, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab ),
459 .cozmoslabs-form-subsection-wrapper a,
460 .cozmoslabs-form-field-wrapper a {
461 color: #3858E9;
462 text-decoration: none;
463 }
464
465 .cozmoslabs-wrap a:not(.button-secondary, .button-primary, .submitdelete, .mbdelete, .chosen-single, .cozmoslabs-remove-item, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab ):hover,
466 .cozmoslabs-form-subsection-wrapper a:not(.button-secondary, .button-primary, .chosen-single, .cozmoslabs-remove-item, .submitdelete ):hover,
467 .cozmoslabs-form-field-wrapper a:not(.button-secondary, .button-primary, .chosen-single, .cozmoslabs-remove-item, .submitdelete ):hover {
468 text-decoration: underline;
469 }
470
471 .cozmoslabs-wrap a:not(.button-secondary, .button-primary, .submitdelete, .mbdelete, .chosen-single, .cozmoslabs-remove-item, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab):focus,
472 .cozmoslabs-form-subsection-wrapper a:not(.button-secondary, .button-primary):focus,
473 .cozmoslabs-form-field-wrapper a:not(.button-secondary, .button-primary):focus {
474 box-shadow: none;
475 outline: none;
476 }
477
478 /* form field description */
479 .cozmoslabs-description {
480 font-weight: 400;
481 font-size: 13px !important;
482 line-height: 20px !important;
483 color: #757575 !important;
484 margin: 0 !important;
485 }
486
487 .cozmoslabs-description strong {
488 display: unset !important;
489 padding: 0 !important;
490 }
491
492 .cozmoslabs-description-space-left {
493 padding-left: 230px;
494 }
495
496 .cozmoslabs-form-field-wrapper .cozmoslabs-description-space-left {
497 flex-basis: 100%;
498 }
499
500 .cozmoslabs-form-field-wrapper .cozmoslabs-description-align-right {
501 flex-basis: 280px;
502 flex-grow: 1;
503 padding-left: 10px;
504 }
505
506 .cozmoslabs-group-fields-row {
507 display: flex;
508 flex-direction: row;
509 justify-content: space-between;
510 align-items: center;
511
512 margin-top: 35px;
513 }
514
515 .cozmoslabs-group-fields-row .cozmoslabs-form-field-wrapper {
516 flex-basis: 45%;
517 margin: 0;
518 }
519
520 .cozmoslabs-group-fields-row .cozmoslabs-form-field-wrapper .cozmoslabs-form-field-label {
521 flex-basis: auto;
522 }
523
524 .cozmoslabs-disabled-input {
525 flex-basis: 260px;
526 width: 100%;
527 display: flex;
528 align-items: center;
529 height: 40px;
530 border: 1px solid #949494;
531 border-radius: 2px;
532 font-size: 13px;
533 line-height: 20px;
534 color: #1E1E1E;
535 padding: 0 10px;
536 box-sizing: border-box;
537 opacity: 0.5;
538 }
539
540 #wppb-toolbox-redirect-if-empty-required-url,
541 .cozmoslabs-wrap .wppb-toolbox-accordion {
542 display: none;
543 }
544
545
546 /***********************************************************/
547 /* Buttons
548 /***********************************************************/
549
550 /* primary */
551 .cozmoslabs-wrap .button-primary {
552 background: #3858E9;
553 border: 1px solid #3858E9;
554 border-radius: 2px;
555 box-sizing: border-box;
556 /*padding: 13px 30px;*/
557 padding: 8px 12px;
558 font-weight: 500;
559 font-size: 13px;
560 line-height: 16px;
561 color: #FFFFFF;
562 height: 45px;
563 min-width: 140px;
564 display: inline-flex;
565 align-items: center;
566 justify-content: center;
567 cursor: pointer;
568 }
569
570 .cozmoslabs-wrap .button-primary:hover,
571 .cozmoslabs-wrap .button-primary:focus {
572 background: #1D35B4;
573 border-color: #1D35B4;
574 box-shadow: none;
575 }
576
577 .cozmoslabs-wrap .button-primary.button-disabled {
578 background: #1D35B4 !important;
579 border: 1px solid #1D35B4;
580 color: #CCCCCC !important;
581
582 pointer-events: none;
583 opacity: 0.5;
584 }
585
586 /* secondary */
587 .cozmoslabs-wrap input[type="file"]::file-selector-button,
588 .cozmoslabs-wrap .button-secondary {
589 height: 40px;
590 background: #FFFFFF;
591 border: 1px solid #3858E9;
592 border-radius: 2px;
593 padding: 8px 16px;
594 font-weight: 400;
595 font-size: 13px;
596 line-height: 20px;
597 color: #3858E9;
598 }
599
600 .cozmoslabs-wrap input[type="file"]::file-selector-button {
601 margin-right: 10px;
602 }
603
604 .cozmoslabs-wrap .button-secondary {
605 display: flex;
606 align-items: center;
607 justify-content: center;
608 cursor: pointer;
609 }
610
611 .cozmoslabs-wrap input[type="file"]::file-selector-button:hover,
612 .cozmoslabs-wrap .button-secondary:hover,
613 .cozmoslabs-wrap input[type="file"]::file-selector-button:focus,
614 .cozmoslabs-wrap .button-secondary:focus {
615 background: #F0F0F0;
616 border-color: #3858E9;
617 color: #3858E9;
618 box-shadow: none;
619 }
620
621 .cozmoslabs-wrap .button-secondary.button-disabled {
622 background: #F0F0F0 !important;
623 border-color: #3858E9 !important;
624 color: #3858E9 !important;
625 pointer-events: none;
626 opacity: 0.5;
627 }
628
629 .cozmoslabs-remove-item {
630 color: grey !important;
631 }
632
633 .cozmoslabs-remove-item:hover {
634 color: #e76054 !important;
635 }
636
637 .cozmoslabs-remove-item:focus {
638 outline: none;
639 box-shadow: none;
640 }
641
642 /* delete */
643 body[class*="post-type-wppb-"] .submitdelete,
644 .cozmoslabs-wrap .submitdelete {
645 color: #e76054;
646 text-decoration: underline;
647 }
648
649 body[class*="post-type-wppb-"] .submitdelete:hover,
650 body[class*="post-type-wppb-"] .submitdelete:focus,
651 .cozmoslabs-wrap .submitdelete:hover,
652 .cozmoslabs-wrap .submitdelete:focus {
653 color: #c93f32;
654 text-decoration: none;
655 }
656
657
658 /***********************************************************/
659 /* Toggle Switch
660 /***********************************************************/
661
662 .cozmoslabs-toggle-switch {
663 align-items: flex-start;
664 }
665
666 .cozmoslabs-toggle-container {
667 position: relative;
668 width: 36px;
669 height: 18px;
670 margin-right: 15px;
671 }
672
673 .cozmoslabs-toggle-container input {
674 display: none !important;
675 }
676
677 .cozmoslabs-toggle-track {
678 position: relative;
679 display: flex;
680 align-items: center;
681 cursor: pointer;
682 width: 100%;
683 height: 100%;
684 background: #FFFFFF;
685 border: 1px solid #1E1E1E;
686 border-radius: 100px;
687 box-sizing: border-box;
688 transition: background-color 0.3s, border-color 0.3s;
689 }
690
691 .cozmoslabs-toggle-track:before {
692 content: "";
693 position: absolute;
694 left: 3px;
695 width: 12px;
696 height: 12px;
697 background-color: #1E1E1E;
698 border-radius: 50%;
699 transition: transform 0.3s;
700 pointer-events: none;
701 }
702
703 .cozmoslabs-toggle-container input:checked + .cozmoslabs-toggle-track {
704 background-color: #3858E9;
705 border-color: #3858E9;
706 }
707
708 .cozmoslabs-toggle-container input:checked + .cozmoslabs-toggle-track:before {
709 transform: translateX(18px);
710 background-color: #ffffff;
711 }
712
713 .cozmoslabs-toggle-container input:disabled + .cozmoslabs-toggle-track {
714 opacity: 0.3;
715 pointer-events: none;
716 }
717
718 .cozmoslabs-toggle-description {
719 flex-basis: 250px;
720 flex-grow: 1;
721 display: flex;
722 flex-direction: column;
723 gap: 10px;
724 }
725
726 .cozmoslabs-toggle-description .cozmoslabs-description,
727 .cozmoslabs-toggle-switch > label {
728 line-height: 18px !important;
729 }
730
731
732 /***********************************************************/
733 /* RADIO Inputs
734 /***********************************************************/
735
736 .cozmoslabs-radio-inputs-row {
737 display: flex;
738 flex-direction: row;
739 justify-content: flex-start;
740 align-items: center;
741 flex-wrap: wrap;
742 gap: 20px;
743 flex-basis: calc( 100% - 230px );
744 }
745
746 .cozmoslabs-radio-inputs-column {
747 display: flex;
748 flex-direction: column;
749 justify-content: center;
750 align-items: flex-start;
751 gap: 10px;
752 flex-basis: calc( 100% - 230px );
753 }
754
755 .cozmoslabs-radio-inputs-row label,
756 .cozmoslabs-radio-inputs-column label {
757 font-style: normal;
758 font-weight: 400;
759 font-size: 13px;
760 line-height: 18px;
761 color: #1E1E1E;
762 }
763
764 .cozmoslabs-radio-inputs-row input[type=radio],
765 .cozmoslabs-radio-inputs-column input[type=radio] {
766 display: inline-flex;
767 justify-content: center;
768 align-items: center;
769
770 border: 1px solid #949494;
771 border-radius: 50%;
772 width: 20px;
773 height: 20px;
774 }
775
776 .cozmoslabs-radio-inputs-row input[type=radio]:checked,
777 .cozmoslabs-radio-inputs-column input[type=radio]:checked {
778 background: #3858E9;
779 border-color: #3858E9;
780 }
781
782 .cozmoslabs-radio-inputs-row input[type=radio]:checked::before,
783 .cozmoslabs-radio-inputs-column input[type=radio]:checked::before {
784 background: #FFFFFF;
785 width: 8px;
786 height: 8px;
787 margin: 0;
788 }
789
790 .cozmoslabs-radio-inputs-row input[type=radio]:hover,
791 .cozmoslabs-radio-inputs-column input[type=radio]:hover,
792 .cozmoslabs-radio-inputs-row input[type=radio]:focus,
793 .cozmoslabs-radio-inputs-column input[type=radio]:focus {
794 outline: none;
795 box-shadow: none;
796 border-color: #3858E9;
797 }
798
799 .cozmoslabs-column-radios-wrapper {
800 align-items: flex-start;
801 }
802
803
804 /***********************************************************/
805 /* CHECKBOX Inputs
806 /***********************************************************/
807
808 .cozmoslabs-checkbox-list-wrapper {
809 align-items: flex-start;
810 }
811
812 .cozmoslabs-checkbox-list {
813 flex-basis: calc( 100% - 230px );
814 display: flex;
815 flex-direction: row;
816 align-items: flex-start;
817 flex-wrap: wrap;
818 gap: 10px;
819 }
820
821 .cozmoslabs-checkbox-list label {
822 font-style: normal;
823 font-weight: 400;
824 font-size: 13px;
825 line-height: 26px;
826 color: #1E1E1E;
827
828 max-width: calc( 100% - 30px );
829 white-space: nowrap;
830 overflow: hidden;
831 text-overflow: ellipsis;
832 }
833
834 .cozmoslabs-checkbox-list .cozmoslabs-chckbox-container {
835 display: flex;
836 align-items: center;
837 gap: 10px;
838 }
839
840 .cozmoslabs-checkbox-1-col-list .cozmoslabs-chckbox-container {
841 width: calc( 100% - 230px );
842 }
843
844 .cozmoslabs-checkbox-2-col-list .cozmoslabs-chckbox-container {
845 width: 45%;
846 }
847
848 .cozmoslabs-checkbox-3-col-list .cozmoslabs-chckbox-container {
849 width: 30%;
850 }
851
852 .cozmoslabs-checkbox-4-col-list .cozmoslabs-chckbox-container {
853 width: 23%;
854 }
855
856 .cozmoslabs-checkbox-list input[type="checkbox"] {
857 display: flex;
858 justify-content: center;
859 align-items: center;
860 border: 1px solid #949494;
861 border-radius: 2px;
862 width: 20px;
863 height: 20px;
864 margin: 0;
865 }
866
867 .cozmoslabs-checkbox-list input[type="checkbox"]:checked {
868 background: #3858E9;
869 border-color: #3858E9;
870 }
871
872 .cozmoslabs-checkbox-list input[type="checkbox"]:checked::before {
873 content: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 24 24'><title>check</title><path d='M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z' fill='rgb(255, 255, 255)' /></svg>");
874 width: 15px;
875 height: auto;
876 margin: 0;
877 transform: rotate(-8deg);
878 }
879
880 .cozmoslabs-checkbox-list input[type="checkbox"]:not(:disabled):hover,
881 .cozmoslabs-checkbox-list input[type="checkbox"]:not(:disabled):focus {
882 outline: none;
883 box-shadow: none;
884 border-color: #3858E9;
885 }
886
887
888 /***********************************************************/
889 /* WYSIWYG
890 /***********************************************************/
891
892 .cozmoslabs-wysiwyg-wrapper {
893 display: block;
894 background: #FFFFFF;
895 border-radius: 2px;
896 }
897
898 .cozmoslabs-wysiwyg-indented {
899 margin-left: 20px;
900 margin-right: 20px;
901 border: 1px solid #CCCCCC;
902 padding: 20px;
903 }
904
905 .tmce-active .quicktags-toolbar {
906 display: none !important;
907 }
908
909 .cozmoslabs-wysiwyg-wrapper .wp-editor-container .mce-toolbar-grp,
910 .cozmoslabs-wysiwyg-wrapper .quicktags-toolbar {
911 background-color: #ffffff;
912 padding: 0 30px;
913
914 height: 90px;
915 display: flex;
916 align-items: center;
917 }
918
919 .cozmoslabs-wysiwyg-wrapper .mce-top-part::before {
920 box-shadow: none;
921 }
922
923 .cozmoslabs-wysiwyg-wrapper label {
924 margin-bottom: 20px;
925 font-size: 13px !important;
926 }
927
928 .cozmoslabs-wysiwyg-wrapper .quicktags-toolbar,
929 .cozmoslabs-wysiwyg-wrapper .mce-toolbar .mce-btn-group > div {
930 display: flex;
931 flex-direction: row;
932 flex-wrap: wrap;
933 align-items: center;
934 justify-content: flex-start;
935 gap: 5px;
936 }
937
938 .cozmoslabs-wysiwyg-wrapper .quicktags-toolbar input[type="button"],
939 .cozmoslabs-wysiwyg-wrapper .wp-media-buttons .insert-media {
940 background: #FFFFFF;
941 border: 1px solid #3858E9;
942 border-radius: 2px;
943 color: #3858E9;
944 }
945
946 .cozmoslabs-wysiwyg-wrapper .quicktags-toolbar input[type="button"]:hover,
947 .cozmoslabs-wysiwyg-wrapper .wp-media-buttons .insert-media:hover {
948 background: #F0F0F0;
949 border-color: #3858E9;
950 color: #3858E9;
951 }
952
953 .cozmoslabs-wysiwyg-wrapper .quicktags-toolbar input[type="button"]:focus,
954 .cozmoslabs-wysiwyg-wrapper .wp-media-buttons .insert-media:focus {
955 background: #ffffff;
956 border-color: #3858E9;
957 color: #3858E9;
958 box-shadow: 0 0 0 1px #3858E9;
959 }
960
961 .cozmoslabs-wysiwyg-wrapper .mce-toolbar .mce-btn-group .mce-btn.mce-listbox {
962 height: 40px;
963 border: 1px solid #949494;
964 border-radius: 2px;
965 line-height: 20px;
966 font-size: 13px;
967 padding: 0 10px;
968 display: flex;
969 align-items: center;
970 }
971
972 .cozmoslabs-wysiwyg-wrapper .mce-toolbar .mce-btn-group .mce-btn:hover,
973 .cozmoslabs-wysiwyg-wrapper .qt-dfw:hover {
974 border-color: #3858E9 !important;
975 background: #FFFFFF;
976 }
977
978 .cozmoslabs-wysiwyg-wrapper .mce-toolbar .mce-btn-group .mce-btn.mce-active,
979 .cozmoslabs-wysiwyg-wrapper .mce-toolbar .mce-btn-group .mce-btn:active,
980 .cozmoslabs-wysiwyg-wrapper .qt-dfw.active {
981 border-color: #3858E9 !important;
982 box-shadow: 0 0 0 1px #3858e9 !important;
983 background: #FFFFFF;
984 }
985
986 .cozmoslabs-wysiwyg-wrapper .wp-switch-editor,
987 .cozmoslabs-wysiwyg-wrapper .mce-toolbar .mce-btn-group .mce-btn .mce-txt,
988 .cozmoslabs-wysiwyg-wrapper .mce-toolbar .mce-btn-group .mce-btn .mce-ico {
989 color: #1E1E1E;
990 }
991
992 .cozmoslabs-wysiwyg-wrapper .tmce-active .switch-tmce,
993 .cozmoslabs-wysiwyg-wrapper .html-active .switch-html {
994 font-weight: 500;
995 }
996
997 .cozmoslabs-wysiwyg-wrapper .html-active .switch-tmce,
998 .cozmoslabs-wysiwyg-wrapper .tmce-active .switch-html {
999 opacity: 0.7;
1000 }
1001
1002 .cozmoslabs-wysiwyg-wrapper .wp-editor-container textarea.wp-editor-area {
1003 padding: 20px 40px;
1004 height: 215px !important;
1005 }
1006
1007 .cozmoslabs-wysiwyg-wrapper .mce-statusbar {
1008 display: none;
1009 }
1010
1011 .cozmoslabs-wysiwyg-wrapper .cozmoslabs-description {
1012 padding: 10px 5px;
1013 }
1014
1015
1016 /**************************************************/
1017 /* Register Version
1018 /**************************************************/
1019
1020 .cozmoslabs-form-field-wrapper .cozmoslabs-serial-wrap__holder {
1021 display: flex;
1022 flex-direction: row;
1023 align-items: center;
1024 justify-content: flex-start;
1025 gap: 10px;
1026 }
1027
1028 .cozmoslabs-form-field-wrapper .cozmoslabs-active-license {
1029 margin-right: 8px;
1030 color: #008000;
1031 }
1032
1033 .cozmoslabs-form-field-wrapper.cozmoslabs-invalid-license {
1034 margin-right: 8px;
1035 color: #ca4a1f;
1036 }
1037
1038 #wppb-register-version .cozmoslabs-description-container {
1039 flex-basis: calc( 100% - 230px);
1040 display: flex;
1041 flex-direction: column;
1042 gap: 20px;
1043 background: #E7F3EE;
1044 border-radius: 2px;
1045 padding: 10px 15px;
1046 margin: 5px 0 0 230px;
1047 }
1048
1049
1050
1051 /**********************************************************************************************************************/
1052
1053
1054 /**************************************************/
1055 /* Form Designs - Admin UI styles
1056 /**************************************************/
1057
1058 #wppb-forms-design-browser {
1059 display: flex;
1060 flex-wrap: wrap;
1061 flex-direction: row;
1062 gap: 20px;
1063 justify-content: start;
1064 padding-bottom: 20px;
1065 }
1066
1067 .wppb-forms-design {
1068 width: 180px;
1069 flex-basis: unset;
1070 }
1071
1072 .wppb-forms-design label {
1073 font-style: normal;
1074 font-weight: 400;
1075 font-size: 14px;
1076 line-height: 18px;
1077 color: #1E1E1E;
1078 }
1079
1080 .wppb-forms-design label input[type="radio"] {
1081 margin-left: 10px;
1082 }
1083
1084 .wppb-forms-design-preview {
1085 position: absolute;
1086 display: none !important;
1087 height: 32px !important;
1088 }
1089
1090 .wppb-forms-design:hover .wppb-forms-design-screenshot .wppb-forms-design-preview {
1091 display: flex !important;
1092 }
1093
1094 .wppb-forms-design-screenshot {
1095 width: 100%;
1096 max-width: 180px;
1097 height: 100px;
1098 display: flex;
1099 align-items: center;
1100 justify-content: center;
1101 background: #F8F9FD;
1102 border: 1px solid #cccccc;
1103 border-radius: 2px;
1104 box-sizing: border-box;
1105 position: relative;
1106 margin-top: 10px;
1107 }
1108
1109 .wppb-forms-design:not(#form-style-default) .wppb-forms-design-screenshot:before {
1110 content: "";
1111 position: absolute;
1112 top: 0;
1113 left: 0;
1114 width: 100%;
1115 height: 100%;
1116 background-color: rgba(0, 0, 0, 0.3);
1117 opacity: 0;
1118 transition: opacity 0.3s ease;
1119 }
1120
1121 .wppb-forms-design:not(#form-style-default):hover .wppb-forms-design-screenshot:before {
1122 opacity: 1;
1123 }
1124
1125 .wppb-forms-design-screenshot:not(#form-style-default .wppb-forms-design-screenshot) img {
1126 max-width: 100%;
1127 max-height: 100%;
1128 }
1129
1130 #form-style-default .wppb-forms-design-screenshot img {
1131 max-width: 100%;
1132 overflow: hidden;
1133 }
1134
1135 #form-style-default .wppb-forms-design-screenshot {
1136 overflow: hidden;
1137 }
1138
1139 .wppb-forms-design-modal {
1140 display: none;
1141 padding: 16px 24px;
1142 }
1143
1144 .wppb-forms-design-modal .wppb-forms-design-preview-image {
1145 width: 100%;
1146 height: auto;
1147 display: none;
1148 }
1149
1150 .wppb-forms-design-modal .wppb-forms-design-preview-image.active {
1151 display: block;
1152 }
1153
1154
1155 .wppb-forms-design-modal .pms-slideshow-button {
1156 font-size: 50px;
1157 cursor: pointer;
1158 color: #6E7A86;
1159 }
1160
1161 .wppb-forms-design-modal .pms-slideshow-button.disabled {
1162 visibility: hidden;
1163 }
1164
1165 .wppb-forms-design-modal .wppb-forms-design-modal-slideshow {
1166 display: flex;
1167 flex-direction: row;
1168 align-items: center;
1169 gap: 20px;
1170 }
1171
1172 .wppb-forms-design-modal .wppb-slideshow-button {
1173 font-size: 50px;
1174 cursor: pointer;
1175 color: #6E7A86;
1176 }
1177
1178 .wppb-forms-design-modal .wppb-slideshow-button.disabled {
1179 visibility: hidden;
1180 }
1181
1182 .ui-dialog[aria-describedby^='modal-form-style'] .ui-widget-header {
1183 background: transparent;
1184 border: none;
1185 border-bottom: 1px solid #dcdcde;
1186 }
1187
1188 .ui-dialog[aria-describedby^='modal-form-style'] .ui-button,
1189 .ui-dialog[aria-describedby^='modal-form-style'] .ui-button:focus,
1190 .ui-dialog[aria-describedby^='modal-form-style'] .ui-button:hover {
1191 background: transparent;
1192 border: none;
1193 box-shadow: none;
1194 }
1195
1196 .ui-widget.ui-widget-content {
1197 max-width: 95%;
1198 }
1199
1200
1201 /* Tables */
1202 body[class*="profile-builder_page_"] .wp-list-table th {
1203 font-weight: 600;
1204 font-size: 14px;
1205 line-height: 40px;
1206 color: #1E1E1E;
1207 }
1208
1209 body[class*="profile-builder_page_"] a:not(.button-secondary, .button-primary, .submitdelete, .mbdelete, .chosen-single, .cozmoslabs-remove-item, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab) {
1210 color: #3858E9;
1211 text-decoration: none;
1212 }
1213
1214 body[class*="profile-builder_page_"] a:not(.button-secondary, .button-primary, .submitdelete, .mbdelete, .chosen-single, .cozmoslabs-remove-item, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab):hover {
1215 text-decoration: underline;
1216 }
1217
1218 body[class*="profile-builder_page_"] a:not(.button-secondary, .button-primary, .submitdelete, .mbdelete, .chosen-single, .cozmoslabs-remove-item, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab):focus {
1219 box-shadow: none;
1220 outline: none;
1221 }
1222
1223
1224 /**********************************************************************************/
1225 /* Link (question mark icon) to PB Docs set in pages/custom-posts/settings titles
1226 /**********************************************************************************/
1227 .wp-admin a.wppb-docs-link:before {
1228 display: none;
1229 }
1230
1231 .wp-admin a.wppb-docs-link {
1232 text-decoration: none;
1233 box-shadow: none;
1234 outline: none;
1235 height: auto;
1236 width: auto;
1237 font-size: 30px;
1238 }
1239
1240 [class*="profile-builder"].wp-admin .wrap form > h2 {
1241 line-height: 30px;
1242 }
1243
1244 .wp-admin.post-type-wppb-ul-cpt #wppb-single-ul-templates .inside .wppb-docs-link,
1245 .wp-admin.post-type-wppb-ul-cpt #wppb-ul-templates .inside .wppb-docs-link,
1246 .wp-admin.profile-builder_page_manage-fields #wppb-msf-side .wppb-docs-link,
1247 .wp-admin.profile-builder_page_custom-redirects .wck-post-box .wppb-docs-link,
1248 .wp-admin.post-type-wppb-ul-cpt #wppb-ul-themes-settings .inside .wppb-docs-link,
1249 .wp-admin.post-type-wppb-ul-cpt .wck-add-form .wppb-docs-link {
1250 position: absolute;
1251 right: 5px;
1252 top: 0;
1253 }
1254
1255 .wp-admin.profile-builder_page_manage-fields .update_container_wppb_manage_fields ul.mb-list-entry-fields li.row-edit-profile-approved-by-admin,
1256 .wp-admin.profile-builder_page_manage-fields .update_container_wppb_manage_fields ul.mb-list-entry-fields li.row-conditional-logic-enabled,
1257 .wp-admin.profile-builder_page_manage-fields .update_container_wppb_manage_fields ul.mb-list-entry-fields li.row-location-visibility,
1258 .wp-admin.profile-builder_page_manage-fields .update_container_wppb_manage_fields ul.mb-list-entry-fields li.row-user-role-visibility {
1259 line-height: 30px;
1260 }
1261
1262 .wp-admin.profile-builder_page_manage-fields .update_container_wppb_manage_fields ul.mb-list-entry-fields li.row-visibility .mb-right-column {
1263 position: relative;
1264 }
1265
1266 .wp-admin.profile-builder_page_manage-fields .update_container_wppb_manage_fields ul.mb-list-entry-fields li.row-visibility .mb-right-column .wppb-docs-link {
1267 position: absolute;
1268 top: 0;
1269 left: 255px;
1270 }
1271
1272 .wppb-docs-link {
1273 width: 30px;
1274 height: 30px;
1275 }
1276
1277 .wppb-docs-link:focus {
1278 outline: none;
1279 box-shadow: none;
1280 }
1281
1282 .cozmoslabs-description .wppb-docs-link {
1283 margin-top: -5px;
1284 }
1285
1286 .wppb-docs-link:before {
1287 display: none;
1288 }
1289
1290 .wppb-docs-link:after {
1291 content: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='currentColor' class='bi bi-person' viewBox='0 0 24 24' transform='scale(1,1)'> <path d='M20 2H4C3.47 2 2.96 2.21 2.59 2.59C2.21 2.96 2 3.47 2 4V16C2 16.53 2.21 17.04 2.59 17.41C2.96 17.79 3.47 18 4 18H8L12 22L16 18H20C20.53 18 21.04 17.79 21.41 17.41S22 16.53 22 16V4C22 3.47 21.79 2.96 21.41 2.59C21.04 2.21 20.53 2 20 2M4 16V4H20V16H15.17L12 19.17L8.83 16M10.05 6.04C10.59 5.68 11.3 5.5 12.19 5.5C13.13 5.5 13.88 5.71 14.42 6.12C14.96 6.54 15.23 7.1 15.23 7.8C15.23 8.24 15.08 8.63 14.79 9C14.5 9.36 14.12 9.64 13.66 9.85C13.4 10 13.23 10.15 13.14 10.32C13.05 10.5 13 10.72 13 11H11C11 10.5 11.1 10.16 11.29 9.92C11.5 9.68 11.84 9.4 12.36 9.08C12.62 8.94 12.83 8.76 13 8.54C13.14 8.33 13.22 8.08 13.22 7.8C13.22 7.5 13.13 7.28 12.95 7.11C12.77 6.93 12.5 6.85 12.19 6.85C11.92 6.85 11.7 6.92 11.5 7.06C11.34 7.2 11.24 7.41 11.24 7.69H9.27C9.22 7 9.5 6.4 10.05 6.04M11 14V12H13V14Z' id='mainIconPathAttribute' fill='rgb(30, 30, 30)'></path> </svg>");
1292 opacity: 0.3;
1293 }
1294
1295 .wppb-docs-link:hover:after {
1296 opacity: 1;
1297 content: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='30' height='30' fill='currentColor' class='bi bi-person' viewBox='0 0 24 24' transform='scale(1,1)'> <path d='M20 2H4C3.47 2 2.96 2.21 2.59 2.59C2.21 2.96 2 3.47 2 4V16C2 16.53 2.21 17.04 2.59 17.41C2.96 17.79 3.47 18 4 18H8L12 22L16 18H20C20.53 18 21.04 17.79 21.41 17.41S22 16.53 22 16V4C22 3.47 21.79 2.96 21.41 2.59C21.04 2.21 20.53 2 20 2M4 16V4H20V16H15.17L12 19.17L8.83 16M10.05 6.04C10.59 5.68 11.3 5.5 12.19 5.5C13.13 5.5 13.88 5.71 14.42 6.12C14.96 6.54 15.23 7.1 15.23 7.8C15.23 8.24 15.08 8.63 14.79 9C14.5 9.36 14.12 9.64 13.66 9.85C13.4 10 13.23 10.15 13.14 10.32C13.05 10.5 13 10.72 13 11H11C11 10.5 11.1 10.16 11.29 9.92C11.5 9.68 11.84 9.4 12.36 9.08C12.62 8.94 12.83 8.76 13 8.54C13.14 8.33 13.22 8.08 13.22 7.8C13.22 7.5 13.13 7.28 12.95 7.11C12.77 6.93 12.5 6.85 12.19 6.85C11.92 6.85 11.7 6.92 11.5 7.06C11.34 7.2 11.24 7.41 11.24 7.69H9.27C9.22 7 9.5 6.4 10.05 6.04M11 14V12H13V14Z' id='mainIconPathAttribute' fill='rgb(56, 88, 233)'></path> </svg>");
1298 }
1299
1300
1301
1302 /**************************************************/
1303 /* CPTs and Custom Pages
1304 /**************************************************/
1305
1306 /* page title */
1307 body[class*="post-type-wppb-"] .wp-heading-inline {
1308 font-style: normal;
1309 font-weight: 400;
1310 font-size: 26px;
1311 line-height: 28px;
1312 color: #1E1E1E;
1313 margin-bottom: 35px;
1314 display: inline-flex;
1315 align-items: baseline;
1316 gap: 10px;
1317 }
1318
1319 /* buttons */
1320 body[class*="post-type-wppb-"] .button:not(.button-primary),
1321 body[class*="post-type-wppb-"] .page-title-action {
1322 background: #FFFFFF;
1323 border: 1px solid #3858E9;
1324 box-sizing: border-box;
1325 border-radius: 2px;
1326 font-weight: 400;
1327 color: #3858E9;
1328 }
1329
1330 body[class*="post-type-wppb-"] .button:not(.button-primary, .wppb-ul-theme-activate .button),
1331 body[class*="post-type-wppb-"] .page-title-action {
1332 line-height: 20px;
1333 font-size: 13px;
1334 margin: 0;
1335 display: inline-flex;
1336 align-items: center;
1337 justify-content: center;
1338 cursor: pointer;
1339 }
1340
1341 body[class*="post-type-wppb-"] .button:not(.button-primary, .cozmoslabs-wysiwyg-wrapper .insert-media, .pagination-links .button, .wppb-ul-theme-activate .button) {
1342 height: 40px;
1343 }
1344
1345 body[class*="post-type-wppb-"] .page-title-action {
1346 height: 30px;
1347 }
1348
1349 body[class*="post-type-wppb-"] .button:not(.button-primary, .wppb-ul-theme-activate .button.reset):hover,
1350 body[class*="post-type-wppb-"] .button:not(.button-primary, .wppb-ul-theme-activate .button.reset):focus,
1351 body[class*="post-type-wppb-"] .button:not(.button-primary, .wppb-ul-theme-activate .button.reset):active,
1352 body[class*="post-type-wppb-"] .page-title-action:hover,
1353 body[class*="post-type-wppb-"] .page-title-action:focus,
1354 body[class*="post-type-wppb-"] .page-title-action:active {
1355 font-weight: 400;
1356 background: #F0F0F0;
1357 border-color: #3858E9;
1358 color: #3858E9;
1359 box-shadow: none;
1360 margin: 0;
1361 }
1362
1363 body[class*="post-type-wppb-"] .button-primary {
1364 background: #3858E9;
1365 border: 1px solid #3858E9;
1366 border-radius: 2px;
1367 box-sizing: border-box;
1368 padding: 8px 12px;
1369 font-weight: 500;
1370 font-size: 13px;
1371 line-height: 16px;
1372 color: #FFFFFF;
1373 height: 45px;
1374 min-width: 140px;
1375 display: inline-flex;
1376 align-items: center;
1377 justify-content: center;
1378 cursor: pointer;
1379 }
1380
1381 body[class*="post-type-wppb-"] .button-primary:hover,
1382 body[class*="post-type-wppb-"] .button-primary:focus {
1383 background: #1D35B4;
1384 border-color: #1D35B4;
1385 box-shadow: none;
1386 }
1387
1388 body[class*="post-type-wppb-"] .button-primary.button-disabled {
1389 background: #1D35B4 !important;
1390 border: 1px solid #1D35B4;
1391 color: #CCCCCC !important;
1392 pointer-events: none;
1393 opacity: 0.5;
1394 }
1395
1396 /* User Listing */
1397 #wppb_ul_search_settings .cozmoslabs-checkbox-list .cozmoslabs-chckbox-container,
1398 #wppb-ul-settings-args .cozmoslabs-checkbox-list .cozmoslabs-chckbox-container {
1399 width: 30%;
1400 }
1401
1402 #container_wppb_ul_faceted_settings .wck-edit .button {
1403 min-width: 75px;
1404 }
1405
1406 #wppb-ul-side .cozmoslabs-form-field-wrapper:first-of-type {
1407 margin-top: 0 !important;
1408 }
1409
1410 #wppb-ul-side textarea {
1411 height: 60px;
1412 }
1413
1414 #wppb_ul_page_settings .row-visible-to-following-roles, .update_container_wppb_ul_page_settings.visible_to_logged_ .row-visible-to-following-roles {
1415 display:none;
1416 }
1417
1418 #wppb_ul_page_settings.update_container_wppb_ul_page_settings.visible_to_logged_yes .row-visible-to-following-roles {
1419 display: block;
1420 }
1421
1422
1423 /* Tables */
1424 body[class*="post-type-wppb-"] .wp-list-table th {
1425 font-weight: 600;
1426 font-size: 14px;
1427 line-height: 40px !important;
1428 color: #1E1E1E !important;
1429 }
1430
1431 body[class*="post-type-wppb-"] .wp-list-table td {
1432 font-style: normal;
1433 font-weight: 400;
1434 font-size: 13px;
1435 line-height: 25px;
1436 color: #1E1E1E !important;
1437 vertical-align: middle;
1438 }
1439
1440 body[class*="post-type-wppb-"] .wp-list-table th.sortable a {
1441 display: flex;
1442 align-items: center;
1443 gap: 5px;
1444 }
1445
1446 body[class*="post-type-wppb-"] .wp-list-table th.sortable a .sorting-indicator {
1447 margin: 0;
1448 }
1449
1450
1451 /* table page navigation */
1452 body[class*="post-type-wppb-"] .tablenav-pages {
1453 display: flex;
1454 align-items: center;
1455 justify-content: flex-end;
1456 gap: 10px;
1457 }
1458
1459 body[class*="post-type-wppb-"] .tablenav-pages .pagination-links {
1460 display: flex;
1461 flex-direction: row;
1462 align-items: center;
1463 justify-content: flex-end;
1464 gap: 5px;
1465 }
1466
1467 body[class*="post-type-wppb-"] .tablenav-pages.one-page .pagination-links,
1468 body[class*="post-type-wppb-"] .tablenav-pages.no-pages .pagination-links {
1469 display: none !important;
1470 }
1471
1472 body[class*="post-type-wppb-"] .pagination-links .button {
1473 height: 30px;
1474 background: #FFFFFF;
1475 border: 1px solid #3858E9;
1476 border-radius: 2px;
1477 box-sizing: border-box;
1478 padding-bottom: 2px;
1479 font-weight: 400;
1480 font-size: 20px !important;
1481 line-height: 20px !important;
1482 color: #3858E9;
1483 }
1484
1485 body[class*="post-type-wppb-"] .pagination-links .button:hover,
1486 body[class*="post-type-wppb-"] .pagination-links .button:focus {
1487 background: #F0F0F0;
1488 border-color: #3858E9;
1489 color: #3858E9;
1490 box-shadow: none;
1491 text-decoration: none;
1492 }
1493
1494 body[class*="post-type-wppb-"] .pagination-links .button.disabled {
1495 background: #F0F0F0 !important;
1496 border-color: #3858E9 !important;
1497 color: #3858E9 !important;
1498 pointer-events: none;
1499 opacity: 0.5;
1500 }
1501
1502 body[class*="post-type-wppb-"] .pagination-links .paging-input {
1503 display: flex;
1504 flex-direction: row;
1505 align-items: center;
1506 justify-content: center;
1507 gap: 5px;
1508 }
1509
1510 body[class*="post-type-wppb-"] .pagination-links .current-page {
1511 border: 1px solid #949494;
1512 border-radius: 2px;
1513 font-size: 13px;
1514 line-height: 20px;
1515 color: #1E1E1E;
1516 padding: 0 10px;
1517 margin: 0;
1518 min-height: 30px;
1519 }
1520
1521 body[class*="post-type-wppb-"] .pagination-links .current-page:hover {
1522 border-color: #3858E9;
1523 color: #1E1E1E;
1524 }
1525
1526 body[class*="post-type-wppb-"] .pagination-links .current-page:focus {
1527 border-color: #3858E9;
1528 box-shadow: 0 0 0 1px #3858e9;
1529 }
1530
1531
1532 /* Fields */
1533 body[class*="post-type-wppb-"] .tablenav {
1534 height: 40px;
1535 padding: 10px 0;
1536 margin: 0;
1537 }
1538
1539 body[class*="post-type-wppb-"] #titlediv #title,
1540 body[class*="post-type-wppb-"] .wp-list-table input[type="text"],
1541 body[class*="post-type-wppb-"] .search-box input[type="search"],
1542 body[class*="post-type-wppb-"] .tablenav select {
1543 height: 40px;
1544 border: 1px solid #949494;
1545 border-radius: 2px;
1546 font-size: 13px;
1547 line-height: 20px;
1548 color: #1E1E1E;
1549 max-width: 100%;
1550 }
1551
1552 body[class*="post-type-wppb-"] .wp-list-table input[type="text"]:not(.wppb-shortcode.input),
1553 body[class*="post-type-wppb-"] .search-box input[type="search"],
1554 body[class*="post-type-wppb-"] .tablenav select {
1555 width: 330px !important;
1556 }
1557
1558 body[class*="post-type-wppb-"] #titlediv #title:hover,
1559 body[class*="post-type-wppb-"] .wp-list-table input[type="text"]:not(input[readonly]):hover,
1560 body[class*="post-type-wppb-"] .search-box input[type="search"]:hover,
1561 body[class*="post-type-wppb-"] .tablenav select:hover {
1562 border-color: #3858E9;
1563 }
1564
1565 #titlediv #title:focus,
1566 body[class*="post-type-wppb-"] .wp-list-table input[type="text"]:focus,
1567 body[class*="post-type-wppb-"] .search-box input[type="search"]:focus,
1568 body[class*="post-type-wppb-"] .tablenav select:focus {
1569 border-color: #3858E9;
1570 box-shadow: 0 0 0 1px #3858e9 !important;
1571 }
1572
1573 body[class*="post-type-wppb-"] .wp-list-table input[type="text"]:disabled,
1574 body[class*="post-type-wppb-"] .search-box input[type="search"]:disabled,
1575 body[class*="post-type-wppb-"] .tablenav select:disabled {
1576 opacity: 0.5;
1577 pointer-events: none;
1578 }
1579
1580 body[class*="post-type-wppb-"] .wp-list-table input[type="text"][readonly] {
1581 opacity: 0.8;
1582 }
1583
1584 #container_wppb_epf_fields .row-id,
1585 #wppb_epf_fields .row-id,
1586 #container_wppb_rf_fields .row-id,
1587 #wppb_rf_fields .row-id{
1588 display:none;
1589 }
1590
1591 /***********************************************************/
1592 /* Links
1593 /***********************************************************/
1594
1595 body[class*="post-type-wppb-"] .button-link,
1596 body[class*="post-type-wppb-"] a:not(.button-secondary, .button-primary, .chosen-single, .cozmoslabs-remove-item, .submitdelete, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab) {
1597 color: #3858E9;
1598 text-decoration: none;
1599 }
1600
1601 body[class*="post-type-wppb-"] .trash a,
1602 body[class*="post-type-wppb-"] .delete a {
1603 color: #e76054 !important;
1604 text-decoration: none;
1605 }
1606
1607 body[class*="post-type-wppb-"] .trash a:hover,
1608 body[class*="post-type-wppb-"] .delete a:hover {
1609 color: #e76054;
1610 text-decoration: underline;
1611 }
1612
1613 body[class*="post-type-wppb-"] .button-link:hover,
1614 body[class*="post-type-wppb-"] a:not(.button-secondary, .button-primary, .chosen-single, .cozmoslabs-remove-item, .submitdelete, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab):hover {
1615 color: #3858E9;
1616 text-decoration: underline;
1617 }
1618
1619 body[class*="post-type-wppb-"] .button-link:focus,
1620 body[class*="post-type-wppb-"] a:not(.button-secondary, .button-primary, .chosen-single, .cozmoslabs-remove-item, .submitdelete, .page-title-action, .cozmoslabs-banner-link, .nav-tab, .nav-sub-tab):focus {
1621 box-shadow: none;
1622 outline: none;
1623 }
1624
1625
1626 /***********************************************************/
1627 /* Admin notices
1628 /***********************************************************/
1629
1630 div.wppb-notice {
1631 position: relative;
1632 }
1633
1634 div.wppb-notice:after {
1635 display: block;
1636 content: '';
1637 clear: both;
1638 }
1639
1640 div.wppb-notice.wppb-narrow {
1641 max-width: 825px;
1642 }
1643
1644 div.wppb-notice .notice-dismiss {
1645 text-decoration: none !important;
1646 }
1647
1648 .wrap div.wppb-admin-notice {
1649 margin-bottom: 0;
1650 }
1651
1652 div.wppb-serial-notification .button-primary,
1653 div.wppb-notice .button-primary {
1654 height: 30px;
1655 min-width: 100px;
1656 margin-left: 10px
1657 }
1658
1659
1660 /***********************************************************/
1661 /* Manage Fields Page
1662 /***********************************************************/
1663
1664 .profile-builder_page_manage-fields .cozmoslabs-wrap {
1665 max-width: 1200px !important;
1666 }
1667
1668 .profile-builder_page_manage-fields .metabox-holder .column-1 {
1669 margin-right:0;
1670 }
1671
1672 #container_wppb_manage_fields li strong {
1673 display:none !important;
1674 }
1675
1676 #container_wppb_manage_fields li .description strong {
1677 display: inline !important;
1678 }
1679
1680 #container_wppb_manage_fields .added_fields_list li.row-meta-name {
1681 display:list-item !important;
1682 }
1683
1684 #container_wppb_manage_fields li.row-field-title pre,
1685 #container_wppb_manage_fields li.row-meta-name pre {
1686 min-height:10px;
1687 }
1688
1689 #wppb_manage_fields .ui-sortable label:not(.cozmoslabs-toggle-track),
1690 #container_wppb_manage_fields .ui-sortable label:not(.cozmoslabs-toggle-track) {
1691 background: #fff;
1692 }
1693
1694 #wppb_manage_fields .sortable-handle,
1695 #container_wppb_manage_fields .sortable-handle {
1696 display: inline-block;
1697 width: 16px;
1698 height: 16px;
1699 background: url('../images/sorting-icon-dots.png') no-repeat center center;;
1700 vertical-align: middle;
1701 margin-right: 7px;
1702 cursor: move;
1703 margin-top: -1px;
1704 }
1705
1706 #container_wppb_manage_fields pre {
1707 display:block;
1708 float:left;
1709 width:27%;
1710 font-family:"Open Sans", Arial, sans-serif;
1711 font-size:14px;
1712 }
1713
1714 #container_wppb_manage_fields pre.wppb-mb-head-required,
1715 #container_wppb_manage_fields li.row-required pre {
1716 width:auto;
1717 text-align: center;
1718 }
1719
1720 #container_wppb_manage_fields tbody tr.update_container_wppb_manage_fields:hover {
1721 background:#fff;
1722 }
1723
1724 #container_wppb_manage_fields tbody tr:hover {
1725 background:#E8F2FF;
1726 }
1727
1728 #wppb_manage_fields_info {
1729 display: none;
1730 }
1731
1732 .profile-builder_page_manage-fields input[type="search"] {
1733 height: 40px;
1734 border: 1px solid #949494;
1735 border-radius: 2px;
1736 font-size: 13px;
1737 line-height: 20px;
1738 color: #1E1E1E;
1739 max-width: 100%;
1740 }
1741
1742 .profile-builder_page_manage-fields input[type="search"]:hover {
1743 border-color: #3858E9;
1744 }
1745
1746 .profile-builder_page_manage-fields input[type="search"]:focus {
1747 border-color: #3858E9;
1748 box-shadow: 0 0 0 1px #3858e9 !important;
1749 }
1750
1751 .profile-builder_page_manage-fields input[type="search"]:disabled {
1752 opacity: 0.5;
1753 pointer-events: none;
1754 }
1755
1756 /* Sortable options */
1757 .profile-builder_page_manage-fields .wppb_manage_fields_sortables {
1758 background: #FFFFFF;
1759 border: 1px solid #949494;
1760 margin: 0 0 10px 32px;
1761 padding: 5px 10px;
1762 width: 80% !important;
1763 }
1764
1765 .profile-builder_page_manage-fields .wppb_manage_fields_sortables:first-of-type {
1766 margin-top: 10px;
1767 }
1768
1769 .profile-builder_page_manage-fields .wppb_manage_fields_sortables:hover {
1770 cursor: pointer;
1771 border-color: #3858E9;
1772 }
1773
1774 .profile-builder_page_manage-fields .wppb_manage_fields_sortables label {
1775 background: transparent !important;
1776 }
1777
1778 .profile-builder_page_manage-fields .wppb_manage_fields_sortables > .dashicons {
1779 color: #949494;
1780 position: absolute;
1781 margin-left: -36px;
1782 }
1783
1784 .profile-builder_page_manage-fields .wppb_manage_fields_sortables:hover > .dashicons {
1785 color: #3858E9;
1786 }
1787
1788 .profile-builder_page_manage-fields .row-map-bubble-fields.cozmoslabs-checkbox-list-wrapper {
1789 align-items: center;
1790 }
1791
1792 .profile-builder_page_manage-fields .row-map-bubble-fields .wppb_sortable_checkboxes_wrap .cozmoslabs-checkbox-list {
1793 width: 330px;
1794 flex-direction: column;
1795 gap: 0;
1796 margin-bottom: 10px;
1797 background: #E8F2FF;
1798 }
1799
1800 .profile-builder_page_manage-fields .row-map-bubble-fields .wppb_sortable_checkboxes_wrap .cozmoslabs-toggle-container {
1801 display: none;
1802 }
1803
1804 .profile-builder_page_manage-fields .row-map-bubble-fields .wppb_sortable_checkboxes_wrap .cozmoslabs-toggle-description {
1805 display: none;
1806 }
1807
1808 .profile-builder_page_manage-fields #normal-sortables {
1809 display: flex;
1810 flex-direction: column;
1811 }
1812
1813 .profile-builder_page_manage-fields #normal-sortables #manage-fields {
1814 order: 3;
1815 }
1816
1817 .profile-builder_page_manage-fields #normal-sortables #manage-fields-info {
1818 order: 1;
1819 }
1820
1821 .profile-builder_page_manage-fields #normal-sortables #wppb-msf-side {
1822 order: 2;
1823 }
1824
1825
1826 /* AddNew/Edit Register & Edit Profile Forms */
1827 .post-type-wppb-epf-cpt #normal-sortables,
1828 .post-type-wppb-rf-cpt #normal-sortables {
1829 display: flex;
1830 flex-direction: column;
1831 }
1832
1833 .post-type-wppb-epf-cpt #normal-sortables #wppb-epf-settings-args,
1834 .post-type-wppb-rf-cpt #normal-sortables #wppb-rf-settings-args {
1835 order: 2;
1836 }
1837
1838 .post-type-wppb-epf-cpt #normal-sortables #wppb-epf-fields,
1839 .post-type-wppb-rf-cpt #normal-sortables #wppb-rf-fields {
1840 order: 6;
1841 }
1842
1843 .post-type-wppb-epf-cpt #normal-sortables #wppb-epf-side,
1844 .post-type-wppb-rf-cpt #normal-sortables #wppb-rf-side {
1845 order: 1;
1846 }
1847
1848 .post-type-wppb-epf-cpt #normal-sortables #wppb-sc-epf-side,
1849 .post-type-wppb-rf-cpt #normal-sortables #wppb-sc-rf-side {
1850 order: 4;
1851 }
1852
1853 .post-type-wppb-epf-cpt #normal-sortables #pbpl-epf-side,
1854 .post-type-wppb-rf-cpt #normal-sortables #pbpl-rf-side {
1855 order: 3;
1856 }
1857
1858 .post-type-wppb-epf-cpt #normal-sortables #wppb-msf-side,
1859 .post-type-wppb-rf-cpt #normal-sortables #wppb-msf-side {
1860 order: 5;
1861 }
1862
1863 #wppb_rf_page_settings .row-url,
1864 #wppb_rf_page_settings .row-display-messages,
1865 .update_container_wppb_rf_page_settings.redirect_ .row-url,
1866 .update_container_wppb_rf_page_settings.redirect_ .row-display-messages,
1867 .update_container_wppb_rf_page_settings.redirect_no .row-url,
1868 .update_container_wppb_rf_page_settings.redirect_no .row-display-messages {
1869 display:none;
1870 }
1871
1872 #wppb_rf_page_settings.update_container_wppb_rf_page_settings.redirect_yes .row-url,
1873 #wppb_rf_page_settings.update_container_wppb_rf_page_settings.redirect_yes .row-display-messages {
1874 display: flex;
1875 }
1876
1877
1878 @media screen and ( min-width: 1280px ) {
1879 .profile-builder_page_manage-fields #wppb_manage_fields .row-field .select2-container.select2-container--open {
1880 flex-grow: 1;
1881 }
1882
1883 .profile-builder_page_manage-fields .select2-results__option[role="group"] {
1884 width: 23%;
1885 margin: 0 1%;
1886 float: left;
1887 }
1888
1889 .profile-builder_page_manage-fields .select2-container--default .select2-results > .select2-results__options,
1890 .profile-builder_page_manage-fields .select2-results{
1891 max-height: 800px;
1892 }
1893 }
1894
1895
1896 /***********************************************************/
1897 /* Basic Information Page
1898 /***********************************************************/
1899
1900 .wppb-badge{
1901 font-size: 14px;
1902 font-weight: 600;
1903 width: 150px;
1904 height: 150px;
1905 margin-bottom: 25px;
1906 text-align: center;
1907 text-rendering: optimizelegibility;
1908 background:url(../images/pb-logo.svg) top no-repeat #E8F2FF;
1909 border: 1px solid #9FAAB8;
1910 background-size: 100px;
1911 background-position-y: 10px;
1912 }
1913
1914 .wppb-badge span {
1915 display: inline-block;
1916 text-transform: uppercase;
1917 color: #9FAAB8;
1918 margin-top: 115px;
1919 font-size: 90%;
1920 }
1921
1922 .cozmoslabs-notice-message {
1923 font-size: 15px;
1924 font-weight: 600;
1925 }
1926
1927 #basic-info-extra-features > .button,
1928 #basic-info-add-ons > .button,
1929 #basic-info-customize-forms > .button {
1930 display: inline-flex;
1931 margin-top: 10px;
1932 }
1933
1934 #basic-info-add-ons > .button.wppb-button-free,
1935 #basic-info-customize-forms > .button.wppb-button-free {
1936 height: 40px;
1937 }
1938
1939 #basic-info-extra-fields-list {
1940 justify-content: center;
1941 }
1942
1943 #basic-info-extra-fields-list ul {
1944 display: flex;
1945 flex-wrap: wrap;
1946 list-style: none;
1947 padding: 0;
1948 width: 90%;
1949 margin: 0;
1950 }
1951
1952 #basic-info-extra-fields-list ul li {
1953 width: calc( 25% - 10px );
1954 margin: 5px 0;
1955 font-weight: 600;
1956 font-size: 13px;
1957 line-height: 20px;
1958 color: #757575;
1959 text-align: center;
1960 }
1961
1962 #basic-info-extra-fields-list .wppb-fields-image {
1963 max-width: 80%;
1964 }
1965
1966 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended {
1967 display: flex;
1968 flex-direction: row;
1969 align-items: center;
1970 justify-content: space-between;
1971 margin-top: 35px;
1972 }
1973
1974 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended .cozmoslabs-basic-info-recommended-img {
1975 flex-basis: 37%;
1976 }
1977
1978 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended .cozmoslabs-basic-info-recommended-img img {
1979 width: 100%;
1980 }
1981
1982 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended-info {
1983 flex-basis: 60%;
1984 display: flex;
1985 flex-direction: column;
1986 gap: 5px;
1987 }
1988
1989 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended-info .cozmoslabs-form-field-wrapper {
1990 margin: 0 !important;
1991 }
1992
1993 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended-info .cozmoslabs-form-field-label {
1994 flex-basis: 100%;
1995 cursor: default;
1996 }
1997
1998 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended-info > .button-secondary {
1999 width: 120px;
2000 margin-top: 10px;
2001 }
2002
2003 .cozmoslabs-version-notice {
2004 text-transform: none;
2005 font-weight: 500;
2006 color: #e76054;
2007 }
2008
2009 #basic-info-admin-approval .cozmoslabs-form-field-label {
2010 flex-direction: column;
2011 align-items: flex-start;
2012 justify-content: center;
2013 }
2014
2015 #basic-info-admin-approval .cozmoslabs-version-notice {
2016 text-transform: none;
2017 font-weight: 500;
2018 color: #e76054;
2019 font-size: 11px;
2020 }
2021
2022
2023 /***********************************************************/
2024 /* Publish Metabox
2025 /***********************************************************/
2026
2027 body[class*="post-type-wppb-"] #side-sortables .submitbox #major-publishing-actions {
2028 display: flex;
2029 flex-direction: row;
2030 align-items: center;
2031 justify-content: space-evenly;
2032 }
2033
2034 body[class*="post-type-wppb-"] #side-sortables .submitbox #major-publishing-actions .button-primary {
2035 min-width: 100px;
2036 }
2037
2038 /* WordPress Dashboard Breaking Points */
2039 /* mobile: <= 850px */
2040 /* desktop: >= 851px */
2041 /* additional style: 783px <-> 850px */
2042
2043 @media screen and (max-width:850px) {
2044 .cozmoslabs-publish-metabox-fixed #publishing-action {
2045 position: fixed !important;
2046 bottom: 0;
2047 left: 5%;
2048 right: 5%;
2049 z-index: 999;
2050 width: 90% !important;
2051 }
2052
2053 .cozmoslabs-publish-metabox-fixed #publishing-action #publish {
2054 width: 100%;
2055 }
2056
2057 .cozmoslabs-publish-metabox-fixed #publishing-action .spinner {
2058 position: absolute;
2059 left: 5%;
2060 top: 50%;
2061 transform: translateY(-50%);
2062 margin: 0;
2063 }
2064
2065 body[class*="post-type-wppb-"] #wpbody-content {
2066 padding-bottom: 50px;
2067 }
2068 }
2069
2070 @media screen and (min-width: 783px) and (max-width: 850px) {
2071 .cozmoslabs-publish-metabox-fixed #publishing-action {
2072 left: calc(5% + 36px);
2073 right: calc(5% - 36px);
2074 width: calc(90% - 36px) !important;
2075 }
2076
2077 #wpwrap, #wpfooter, #wpbody-content {
2078 padding-bottom: 50px;
2079 }
2080 }
2081
2082 @media screen and (min-width:851px) {
2083 .cozmoslabs-publish-metabox-fixed #submitdiv {
2084 position: fixed !important;
2085 top: 50px;
2086 z-index: 1;
2087 width: 280px;
2088 box-shadow: 0 3px 10px 0 #aaa;
2089 }
2090
2091 }
2092
2093
2094 /***********************************************************/
2095 /* Mobile
2096 /***********************************************************/
2097
2098 @media screen and (max-width: 782px) {
2099
2100 /* General Styles */
2101 .cozmoslabs-form-field-wrapper p.cozmoslabs-description {
2102 padding-left: 0;
2103 }
2104
2105 .cozmoslabs-toggle-switch {
2106 justify-content: space-between;
2107 }
2108
2109 .cozmoslabs-form-field-wrapper textarea,
2110 .cozmoslabs-form-field-wrapper .chosen-container .chosen-single,
2111 .cozmoslabs-form-field-wrapper .select2-container,
2112 .cozmoslabs-form-field-wrapper select,
2113 .cozmoslabs-form-field-wrapper input[type="password"],
2114 .cozmoslabs-form-field-wrapper input[type="date"],
2115 .cozmoslabs-form-field-wrapper input[type="number"],
2116 .cozmoslabs-form-field-wrapper input[type="text"]:not(#paypal-ipn-url, #stripe-connect-webhook-url, .wck-woocheckbox-field-label) {
2117 flex-grow: 1;
2118 max-width: 100% !important;
2119 width: 100%;
2120 }
2121
2122 .cozmoslabs-wysiwyg-wrapper .wp-editor-container .mce-toolbar-grp {
2123 padding: 10px;
2124 }
2125
2126 .cozmoslabs-wysiwyg-wrapper button.wp-switch-editor {
2127 font-size: 13px;
2128 }
2129
2130 .cozmoslabs-wysiwyg-indented {
2131 margin-left: 0;
2132 margin-right: 0;
2133 }
2134
2135 .cozmoslabs-wysiwyg-indented .mce-toolbar .mce-btn-group > div {
2136 gap: 2px;
2137 }
2138
2139 .cozmoslabs-checkbox-list,
2140 .cozmoslabs-radio-inputs-row,
2141 .cozmoslabs-radio-inputs-column {
2142 flex-basis: 100%;
2143 }
2144
2145 .cozmoslabs-checkbox-list .cozmoslabs-chckbox-container {
2146 width: 100%;
2147 }
2148
2149
2150 /* Page Header (Banner, Title, Navigation) */
2151 .cozmoslabs-wrap {
2152 padding-top: 50px;
2153 }
2154
2155 .cozmoslabs-wrap,
2156 .cozmoslabs-page-header {
2157 margin-right: 10px;
2158 }
2159
2160 .cozmoslabs-banner {
2161 margin-left: -10px !important;
2162 padding: 60px 8px 15px 8px;
2163
2164 flex-direction: column;
2165 align-items: flex-start;
2166 justify-content: center;
2167 gap: 15px;
2168
2169 box-sizing: border-box;
2170 }
2171
2172 .cozmoslabs-banner-buttons {
2173 gap: 5px;
2174 }
2175
2176 body[class*="post-type-wppb-"] #wpbody,
2177 body[class*="profile-builder_page_"] #wpbody {
2178 padding-top: 0;
2179 }
2180
2181 body[class*="post-type-wppb-"] .update-nag,
2182 body[class*="profile-builder_page_"] .update-nag {
2183 margin-top: 50px;
2184 }
2185
2186 .cozmoslabs-nav-tab-wrapper {
2187 height: unset;
2188
2189 flex-direction: column;
2190 align-items: flex-start;
2191 justify-content: center;
2192 padding: 15px;
2193 }
2194
2195 .cozmoslabs-nav-tab-wrapper a.nav-tab {
2196 line-height: 26px;
2197 }
2198
2199 .cozmoslabs-nav-sub-tab-wrapper {
2200 gap: 20px;
2201 }
2202
2203 .cozmoslabs-wrap .cozmoslabs-page-title {
2204 font-size: 22px;
2205 }
2206
2207
2208 /* Basic Info Page */
2209 .profile-builder_page_profile-builder-basic-info .cozmoslabs-page-header {
2210 flex-direction: column-reverse;
2211 align-items: flex-start;
2212 justify-content: flex-start;
2213 }
2214
2215 #basic-info-extra-fields-list ul li {
2216 width: calc( 50% - 10px );
2217 }
2218
2219 #basic-info-extra-features .cozmoslabs-form-field-wrapper label {
2220 flex-basis: 100%;
2221 }
2222
2223 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended {
2224 flex-direction: column;
2225 align-items: center;
2226 justify-content: flex-start;
2227 }
2228
2229 #basic-info-recommended-plugins .cozmoslabs-basic-info-recommended .cozmoslabs-basic-info-recommended-img {
2230 width: 100%;
2231 }
2232
2233
2234 /* Settings Views */
2235 .cozmoslabs-form-field-wrapper .cozmoslabs-serial-wrap__holder {
2236 flex-wrap: wrap;
2237 }
2238
2239 #wppb-register-version .cozmoslabs-description-container {
2240 flex-basis: 100%;
2241 margin: 10px 0 0 0;
2242 }
2243
2244 .wppb-forms-design {
2245 flex-basis: 150px;
2246 }
2247
2248 #wppb-forms-design-browser {
2249 justify-content: space-evenly;
2250 }
2251
2252 #advanced-settings-shortcodes .cozmoslabs-toggle-switch .cozmoslabs-toggle-description {
2253 display: none;
2254 }
2255
2256 #advanced-settings-shortcodes .cozmoslabs-toggle-switch .cozmoslabs-description {
2257 font-size: 12px !important;
2258 }
2259
2260 body.profile-builder_page_user-email-customizer .metabox-holder .column-2,
2261 body.profile-builder_page_admin-email-customizer .metabox-holder .column-2 {
2262 position: unset;
2263 }
2264
2265 body.profile-builder_page_user-email-customizer .cozmoslabs-form-field-wrapper,
2266 body.profile-builder_page_admin-email-customizer .cozmoslabs-form-field-wrapper {
2267 display: flex;
2268 }
2269
2270
2271 /* Labels Edit */
2272 body.profile-builder_page_pb-labels-edit #pble-id-side-info p.cozmoslabs-description {
2273 flex-basis: 100%;
2274 padding-left: 0;
2275 }
2276
2277
2278 /* Form Fields */
2279 .cozmoslabs-columns-container {
2280 flex-direction: column;
2281 gap: 25px;
2282 }
2283
2284 .cozmoslabs-columns-container .cozmoslabs-column {
2285 width: 100%;
2286 padding-right: 0;
2287 }
2288
2289 .cozmoslabs-columns-container .cozmoslabs-column:last-of-type {
2290 padding-left: 0;
2291 }
2292
2293 .cozmoslabs-columns-container .cozmoslabs-column:not(:first-of-type) {
2294 border: none;
2295 border-top: 1px solid #c3c4c7 ;
2296 padding-top: 24px;
2297 }
2298
2299 body.profile-builder_page_manage-fields #container_wppb_manage_fields thead .wck-number {
2300 width: 10%;
2301 }
2302
2303 body.profile-builder_page_manage-fields #container_wppb_manage_fields thead .wck-content {
2304 width: 50%;
2305 }
2306
2307 body.profile-builder_page_manage-fields #container_wppb_manage_fields thead .wck-content pre:first-of-type {
2308 width: 100%;
2309 }
2310
2311 body.profile-builder_page_manage-fields #container_wppb_manage_fields thead .wck-content pre:not(:first-of-type) {
2312 display: none;
2313 }
2314
2315 body.profile-builder_page_manage-fields #container_wppb_manage_fields thead .wck-edit,
2316 body.profile-builder_page_manage-fields #container_wppb_manage_fields thead .wck-delete {
2317 width: 20%;
2318 }
2319
2320 body.profile-builder_page_manage-fields #container_wppb_manage_fields tbody td.wck-content ul li:not(.row-field) {
2321 display: none !important;
2322 }
2323
2324 body.profile-builder_page_manage-fields #container_wppb_manage_fields tbody td.wck-content ul li.row-field pre {
2325 width: 100%;
2326 }
2327
2328 body.profile-builder_page_manage-fields #container_wppb_manage_fields tbody .wck-edit a.button-secondary {
2329 width: 60px;
2330 }
2331
2332 body.profile-builder_page_manage-fields .row-map-bubble-fields .wppb_sortable_checkboxes_wrap {
2333 width: 100%;
2334 }
2335
2336 body.post-type-wppb-epf-cpt #container_wppb_epf_fields td.wck-content li.row-field strong,
2337 body.post-type-wppb-rf-cpt #container_wppb_rf_fields td.wck-content li.row-field strong {
2338 display: none;
2339 }
2340
2341 body.post-type-wppb-epf-cpt #container_wppb_epf_fields thead .wck-number,
2342 body.post-type-wppb-rf-cpt #container_wppb_rf_fields thead .wck-number {
2343 width: 10%;
2344 }
2345
2346 body.post-type-wppb-epf-cpt #container_wppb_epf_fields thead .wck-content,
2347 body.post-type-wppb-rf-cpt #container_wppb_rf_fields thead .wck-content {
2348 width: 50%;
2349 }
2350
2351 body.post-type-wppb-epf-cpt #container_wppb_epf_fields thead .wck-edit,
2352 body.post-type-wppb-epf-cpt #container_wppb_epf_fields thead .wck-delete,
2353 body.post-type-wppb-rf-cpt #container_wppb_rf_fields thead .wck-edit,
2354 body.post-type-wppb-rf-cpt #container_wppb_rf_fields thead .wck-delete {
2355 width: 20%;
2356 padding: 0;
2357 }
2358
2359 body.post-type-wppb-epf-cpt #container_wppb_epf_fields tbody .wck-edit .button-secondary,
2360 body.post-type-wppb-rf-cpt #container_wppb_rf_fields tbody .wck-edit .button-secondary {
2361 width: 60px;
2362 }
2363
2364
2365 /* CPTs */
2366 body[class*="post-type-wppb-"] #posts-filter .search-box {
2367 flex-wrap: wrap;
2368 }
2369
2370 body[class*="post-type-wppb-"] .tablenav.bottom .displaying-num,
2371 body[class*="post-type-wppb-"] .tablenav-pages .tablenav-paging-text,
2372 body[class*="post-type-wppb-"] .pagination-links .button {
2373 padding: 0;
2374 }
2375
2376
2377 /* User Listing */
2378 body.post-type-wppb-ul-cpt #wpbody-content > .wrap {
2379 margin-right: 10px !important;
2380 }
2381
2382 body.post-type-wppb-ul-cpt .ul-themes-browser {
2383 padding-top: 35px;
2384 }
2385
2386 body.post-type-wppb-ul-cpt tbody tr td.wck-number {
2387 display: none;
2388 }
2389
2390 body.post-type-wppb-ul-cpt #wppb-ul-templates .wppb-ul-templates,
2391 body.post-type-wppb-ul-cpt #wppb-single-ul-templates .wppb-single-ul-templates {
2392 max-width: 100%;
2393 }
2394
2395 body.post-type-wppb-ul-cpt #wppb-ul-templates .form-table tr,
2396 body.post-type-wppb-ul-cpt #wppb-single-ul-templates .form-table tr {
2397 border-bottom: none;
2398 padding-bottom: 0;
2399 }
2400
2401
2402 /* Custom Redirects & User Listing */
2403 body.post-type-wppb-ul-cpt #container_wppb_ul_faceted_settings thead,
2404 body.profile-builder_page_custom-redirects thead {
2405 display: none;
2406 }
2407
2408 body.post-type-wppb-ul-cpt #container_wppb_ul_faceted_settings tbody tr,
2409 body.profile-builder_page_custom-redirects tbody tr {
2410 display: flex;
2411 flex-direction: row;
2412 flex-wrap: wrap;
2413 justify-content: space-between;
2414 align-items: center;
2415 border-bottom: 1px solid #c3c4c7;
2416 padding-bottom: 15px;
2417 }
2418
2419 body.post-type-wppb-ul-cpt tbody tr td,
2420 body.profile-builder_page_custom-redirects tbody tr td {
2421 border: none;
2422 }
2423
2424 body.post-type-wppb-ul-cpt tbody tr td.wck-content,
2425 body.profile-builder_page_custom-redirects tbody tr td.wck-content {
2426 flex-basis: 100%;
2427 }
2428
2429 body.post-type-wppb-ul-cpt tbody tr td.wck-edit,
2430 body.post-type-wppb-ul-cpt tbody tr td.wck-delete,
2431 body.profile-builder_page_custom-redirects tbody tr td.wck-edit,
2432 body.profile-builder_page_custom-redirects tbody tr td.wck-delete {
2433 flex-basis: 40%;
2434 }
2435
2436 body.post-type-wppb-ul-cpt tbody tr td.wck-content ul li,
2437 body.profile-builder_page_custom-redirects tbody tr td.wck-content ul li {
2438 display: flex;
2439 flex-wrap: wrap;
2440 gap: 10px;
2441 margin-bottom: 15px;
2442 }
2443
2444 body.post-type-wppb-ul-cpt tbody tr td.wck-content ul li strong,
2445 body.profile-builder_page_custom-redirects tbody tr td.wck-content ul li strong {
2446 flex-basis: 35%;
2447 padding: 0;
2448 }
2449
2450 body.post-type-wppb-ul-cpt tbody tr td.wck-content ul li pre,
2451 body.profile-builder_page_custom-redirects tbody tr td.wck-content ul li pre {
2452 flex-basis: 60%;
2453 padding: 0;
2454 width: auto;
2455 word-break: break-word;
2456 }
2457
2458
2459 /* Import/Export */
2460 body.profile-builder_page_pbie-import-export .cozmoslabs-form-field-wrapper label {
2461 flex-basis: 120px;
2462 }
2463
2464 body.profile-builder_page_pbie-import-export .cozmoslabs-form-field-wrapper input[type="file"] {
2465 flex-basis: 150px;
2466 flex-grow: 1;
2467 }
2468
2469
2470 /* Campaign Monitor */
2471 body.profile-builder_page_profile-builder-campaign-monitor #wppb-cmi-page-api-key-input,
2472 body.profile-builder_page_profile-builder-campaign-monitor #wppb-cmi-page-client-selector-select {
2473 min-width: unset;
2474 flex-basis: 90% !important;
2475 }
2476
2477 body.profile-builder_page_profile-builder-campaign-monitor #wppb-cmi-list-table-client-data thead th:nth-child(2) span {
2478 display: none;
2479 }
2480
2481
2482 /* AddOns */
2483 #cl-add-ons-listing .wp-list-table .column-add_on {
2484 display: block;
2485 flex-basis: 100px !important;
2486 }
2487
2488 #cl-add-ons-listing .wp-list-table .column-add_on:before,
2489 #cl-add-ons-listing .wp-list-table .column-icon .toggle-row {
2490 display: none;
2491 }
2492 }