PluginProbe ʕ •ᴥ•ʔ
Everest Forms – Contact Form, Payment Form, Quiz, Survey & Custom Form Builder with AI / 2.0.3
Everest Forms – Contact Form, Payment Form, Quiz, Survey & Custom Form Builder with AI v2.0.3
3.5.2 3.5.1 3.5.0 3.4.8 3.4.7 3.4.6 1.1.0 1.1.1 1.1.2 1.1.3 1.1.4 1.1.5 1.1.5.1 1.1.6 1.1.7 1.1.8 1.1.9 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.4.6 1.4.7 1.4.8 1.4.9 1.5.0 1.5.1 1.5.10 1.5.2 1.5.3 1.5.4 1.5.5 1.5.6 1.5.7 1.5.8 1.5.9 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 1.6.6 1.6.6.1 1.6.7 1.7.0 1.7.0.1 1.7.0.2 1.7.0.3 1.7.1 1.7.2 1.7.2.1 1.7.2.2 1.7.3 1.7.4 1.7.5 1.7.5.1 1.7.5.2 1.7.6 1.7.7 1.7.7.1 1.7.7.2 1.7.8 1.7.9 1.8.0 1.8.0.1 1.8.1 1.8.2 1.8.2.1 1.8.2.2 1.8.2.3 1.8.3 1.8.4 1.8.5 1.8.6 1.8.7 1.8.8 1.8.9 1.9.0 1.9.0.1 1.9.1 1.9.2 1.9.3 1.9.4 1.9.4.1 1.9.5 1.9.6 1.9.7 1.9.8 1.9.9 2.0.0 2.0.0.1 2.0.1 2.0.2 2.0.3 2.0.3.1 2.0.4 2.0.4.1 2.0.5 2.0.6 2.0.7 2.0.8 2.0.8.1 2.0.9 3.0.0 3.0.0.1 3.0.1 3.0.2 3.0.3 3.0.3.1 3.0.4 3.0.4.1 3.0.4.2 3.0.5 3.0.5.1 3.0.5.2 3.0.6 3.0.6.1 3.0.7.1 3.0.8 3.0.8.1 3.0.9 3.0.9.1 3.0.9.2 3.0.9.3 3.0.9.4 3.0.9.5 3.1.0 3.1.1 3.1.2 3.2.0 3.2.1 3.2.2 3.2.3 3.2.4 3.2.5 3.2.6 3.3.0 3.4.0 3.4.1 3.4.2 3.4.2.1 3.4.3 3.4.4 3.4.5 trunk 1.0 1.0.1 1.0.2 1.0.3
everest-forms / assets / css / admin.scss
everest-forms / assets / css Last commit date
components 5 years ago jquery-confirm 8 years ago jquery-ui 8 years ago mixins 5 years ago perfect-scrollbar 7 years ago utility 5 years ago variables 5 years ago _animation.scss 6 years ago _backbone.scss 6 years ago _clearings.scss 6 years ago _colors.scss 5 years ago _confirm.scss 4 years ago _containers.scss 5 years ago _fonts.scss 5 years ago _grid.scss 5 years ago activation-rtl.css 3 years ago activation.css 3 years ago activation.css.map 5 years ago activation.scss 3 years ago admin-rtl.css 2 years ago admin.css 2 years ago admin.css.map 4 years ago admin.scss 2 years ago deactivation-feedback-rtl.css 3 years ago deactivation-feedback.css 3 years ago deactivation-feedback.scss 3 years ago everest-forms-rtl.css 3 years ago everest-forms.css 3 years ago everest-forms.css.map 4 years ago everest-forms.scss 3 years ago flatpickr-rtl.css 4 years ago flatpickr.css 4 years ago flatpickr.css.map 5 years ago flatpickr.scss 6 years ago menu-rtl.css 2 years ago menu.css 2 years ago menu.css.map 5 years ago menu.scss 2 years ago select2-rtl.css 4 years ago select2.css 4 years ago select2.css.map 5 years ago select2.scss 5 years ago
admin.scss
6295 lines
1 /**
2 * admin.scss
3 * General EverestForms admin styles.
4 */
5
6 /**
7 * Import
8 */
9 @import 'variables/variables';
10 @import 'mixins/mixins';
11 @import 'fonts';
12 @import 'animation';
13 @import 'clearings';
14 @import 'confirm';
15
16 // Components
17 @import 'components/badge', 'components/forms', 'components/buttons',
18 'components/card', 'components/table';
19
20 @import 'colors';
21 @import 'containers';
22 @import 'grid';
23
24 //Utilities
25 @import 'utility/display', 'utility/spacing', 'utility/border';
26
27 //Everest-forms icon
28 @font-face {
29 font-family: 'EverestForms';
30 src: url('../fonts/EverestForms.eot?5c6kq4');
31 src: url('../fonts/EverestForms.eot?5c6kq4#iefix') format('embedded-opentype'),
32 url('../fonts/EverestForms.ttf?5c6kq4') format('truetype'),
33 url('../fonts/EverestForms.woff?5c6kq4') format('woff'),
34 url('../fonts/EverestForms.svg?5c6kq4#EverestForms') format('svg');
35 font-weight: normal;
36 font-style: normal;
37 font-display: block;
38 }
39
40 /**
41 * Styling begins
42 */
43 .blockUI.blockOverlay {
44 @include loader();
45 }
46
47 // Loader
48 .evf-loading {
49 background: url(../images/icons/loader.svg);
50 background-size: 20px 20px;
51 display: inline-block;
52 visibility: hidden;
53 vertical-align: middle;
54 opacity: 0.7;
55 width: 20px;
56 height: 20px;
57 margin: 2px 0 0 5px;
58 float: right;
59
60 &.evf-loading-active {
61 visibility: visible;
62 -webkit-animation: rotating 1s linear infinite;
63 -moz-animation: rotating 1s linear infinite;
64 -ms-animation: rotating 1s linear infinite;
65 -o-animation: rotating 1s linear infinite;
66 animation: rotating 1s linear infinite;
67 }
68 }
69
70 /**
71 * Grid Styles
72 **/
73
74 .evf-form-row {
75 display: flex;
76 flex-wrap: wrap;
77 margin-left: -15px;
78 margin-right: -15px;
79 }
80
81 // Gutter for all col
82 .evf-form-col-4,
83 .evf-form-col-6 {
84 position: relative;
85 width: 100%;
86 padding-left: 15px;
87 padding-right: 15px;
88 }
89
90 .evf_addons_wrap {
91 p.refresh {
92 margin: 0 0 2em;
93 }
94
95 .wp-filter {
96 display: none;
97 }
98
99 .plugin-card {
100 .name,
101 .desc {
102 margin-right: 0;
103 }
104 .plugin-card-top {
105 padding: 20px;
106 min-height: 130px;
107
108 .plugin-desc {
109 overflow: hidden;
110 display: -webkit-box;
111 -webkit-line-clamp: 4;
112 -webkit-box-orient: vertical;
113 }
114
115 .plugin-icon {
116 border: 1px solid #eee;
117 }
118 }
119
120 .plugin-card-bottom {
121 .status {
122 text-align: left;
123 float: left;
124 clear: left;
125 width: 65%;
126 padding-top: 5px;
127 width: calc(100% - 180px);
128
129 span.status-label {
130 color: #666;
131
132 &.status-active {
133 color: #2a9b39;
134 }
135
136 &.status-inactive {
137 color: #a00;
138 }
139 }
140 }
141
142 .action-buttons {
143 float: right;
144 clear: right;
145 max-width: 180px;
146
147 &.upgrade-plan {
148 margin: 0 auto;
149 }
150 }
151 }
152 }
153
154 .plugin-card-update-failed {
155 .notice-error {
156 margin: 0;
157 padding: 9px 16px 8px;
158
159 .notice-dismiss {
160 padding: 17px;
161 }
162 }
163 }
164
165 @media screen and (max-width: 782px) {
166 .plugin-card {
167 .plugin-card-bottom {
168 .status {
169 padding-top: 9px;
170 }
171
172 .action-buttons {
173 .button.updating-message {
174 &::before,
175 &::after {
176 margin-top: -1px;
177 }
178 }
179 }
180 }
181 }
182
183 .plugin-card-update-failed {
184 .notice-error {
185 padding: 13px 20px;
186
187 .notice-dismiss {
188 padding: 21px;
189 }
190 }
191 }
192 }
193 }
194
195 .clear {
196 clear: both;
197 }
198
199 .wrap.everest-forms div.updated,
200 .wrap.everest-forms div.error {
201 margin-top: 10px;
202 }
203
204 /**
205 * Help Tip
206 */
207 .everest-forms-help-tip {
208 cursor: help;
209 color: #666;
210 display: inline-block;
211 font-size: 1.2em;
212 font-style: normal;
213 height: 16px;
214 line-height: 16px;
215 position: relative;
216 vertical-align: middle;
217 width: 16px;
218
219 &::after {
220 cursor: help;
221 @include icon_dashicons('\f223');
222 }
223 }
224
225 /**
226 * Notice info
227 */
228 .everest-forms-notice {
229 display: inline-block;
230 padding: 5px 15px;
231 margin-bottom: 15px;
232 border-radius: 4px;
233 min-width: 500px;
234
235 &::before {
236 content: '\f348';
237 font-size: 22px;
238 vertical-align: middle;
239 font-family: dashicons;
240 margin-right: 10px;
241 }
242
243 &.everest-forms-notice-info {
244 background: lighten($blue, 45%);
245 border: 1px solid $blue;
246
247 &::before {
248 color: $blue;
249 }
250 }
251
252 &.everest-forms-notice-success {
253 background: lighten($green, 40%);
254 border: 1px solid $green;
255
256 &::before {
257 color: $green;
258 }
259 }
260
261 &.everest-forms-notice-warning {
262 background: lighten($orange, 45%);
263 border: 1px solid $orange;
264
265 &::before {
266 color: $orange;
267 }
268 }
269
270 &.everest-forms-notice-danger {
271 background: lighten($red, 30%);
272 border: 1px solid $red;
273
274 &.everest-forms-notice-danger-text {
275 color: $red;
276 }
277
278 &::before {
279 color: $red;
280 }
281 }
282 }
283
284 .evf-handler-counter {
285 display: flex;
286
287 .evf-handler-counter__button {
288 background: $color_gray-light-skin;
289 width: 30px;
290 height: 30px;
291 display: flex;
292 align-items: center;
293 justify-content: center;
294 border: 1px solid $color_gray-lighten;
295
296 &.evf-handler-counter__button-minus {
297 border-radius: 3px 0 0 3px;
298 }
299
300 &.evf-handler-counter__button-plus {
301 border-radius: 0 3px 3px 0;
302 }
303
304 &.dashicons {
305 font-size: 20px;
306 }
307 }
308
309 .evf-handler-counter__input {
310 width: 80px;
311 border-radius: 0;
312
313 &::-webkit-outer-spin-button,
314 &::-webkit-inner-spin-button {
315 -webkit-appearance: none;
316 margin: 0;
317 }
318
319 &[type='number']='number'] {
320 -moz-appearance: textfield;
321 }
322 }
323 }
324
325 .everest-forms-text-info {
326 color: $blue;
327 }
328
329 .everest-forms-text-success {
330 color: $green;
331 }
332
333 .everest-forms-text-warming {
334 color: $orange;
335 }
336
337 .everest-forms-text-danger {
338 color: $red;
339 }
340
341 /**
342 * Help tip
343 */
344
345 h2 .everest-forms-help-tip {
346 margin-top: -5px;
347 margin-left: 0.25em;
348 }
349
350 img.help_tip {
351 margin: 0 0 0 9px;
352 vertical-align: middle;
353 }
354
355 .postbox img.help_tip {
356 margin-top: 0;
357 }
358
359 .postbox .everest-forms-help-tip {
360 margin: 0 0 0 9px;
361 }
362
363 /**
364 * Toggle class.
365 */
366 .everest-forms-show {
367 display: block;
368 }
369
370 .everest-forms-hidden {
371 display: none;
372 }
373
374 /**
375 * Core Styling
376 */
377 .everest-forms_page_evf-builder {
378 .evf-shortcode-field {
379 display: flex;
380
381 .widefat {
382 width: 100%;
383 }
384
385 .evf-copy-shortcode {
386 margin-left: 4px;
387 padding: 0 4px;
388 line-height: 1;
389 }
390 }
391 }
392
393 body.everest-forms-builder {
394 &.everest-forms_page_evf-builder {
395 #wpcontent {
396 padding-left: 0;
397 }
398 #wpfooter {
399 position: fixed;
400 padding: 11px 20px;
401 background: #f1f1f1;
402 border-top: 1px solid $color_gray-lighten;
403 display: none;
404 }
405 }
406
407 @media screen and (max-width: 782px) {
408 &.everest-forms_page_evf-builder {
409 .auto-fold {
410 #wpcontent {
411 padding-left: 0;
412 }
413 }
414 }
415 }
416 }
417
418 .everest-forms-builder,
419 .everest-forms-builder-setup,
420 .everest-forms_page_evf-settings,
421 .everest-forms_page_evf-tools {
422 .everest-forms {
423 margin: 0;
424 }
425
426 #wpcontent {
427 padding-left: 0;
428 }
429 }
430
431 /**
432 * Welcome page.
433 */
434 .dashboard_page_evf-welcome {
435 #message {
436 &.updated {
437 display: none;
438 }
439 }
440 }
441
442 #everest-forms-welcome {
443 max-width: 760px;
444 border-radius: 4px;
445 margin: 3rem auto;
446 background: $color-white;
447 border: 1px solid $color_gray-lighten;
448 box-shadow: 0 2px 10px transparentize($color_gray-base, 0.9);
449
450 a {
451 text-decoration: none;
452
453 &:focus {
454 box-shadow: none;
455 outline: none;
456 }
457 }
458
459 p {
460 font-size: 1.25em;
461 color: $color_gray-base;
462 }
463
464 .eveverest-forms-welcome-header {
465 display: flex;
466 align-items: center;
467 justify-content: space-between;
468 padding: 1em;
469 border-bottom: 1px solid $color_gray-lighten;
470 }
471
472 .eveverest-forms-welcome-header__logo-wrap {
473 display: flex;
474 align-items: center;
475
476 .eveverest-forms-welcome-header__logo-icon {
477 margin-right: 16px;
478 padding-right: 16px;
479 border-right: 1px solid $color_gray-lighten;
480
481 svg {
482 display: block;
483 fill: $everestforms;
484 width: 24px;
485 height: 24px;
486 }
487 }
488
489 span {
490 font-size: 14px;
491 font-weight: 600;
492 }
493 }
494
495 .everest-forms-welcome-container {
496 text-align: center;
497
498 .everest-forms-welcome-container__header {
499 padding: 0 1em;
500
501 h2 {
502 font-size: 1.75em;
503 margin-top: 1.75em;
504 }
505
506 p {
507 margin-bottom: 1.5em;
508 }
509 }
510
511 .everest-forms-welcome-video {
512 cursor: pointer;
513 display: flex;
514 position: relative;
515 align-items: center;
516 justify-content: center;
517
518 .everest-forms-welcome-video__button {
519 border: none;
520 cursor: pointer;
521 font-size: 24px;
522 height: 40px;
523 width: 54px;
524 border-radius: 12px;
525 padding: 8px 15px;
526 position: absolute;
527 color: $color-white;
528 opacity: 0;
529 visibility: hidden;
530 transition: 0.25s ease;
531 background: transparentize($color_gray-base, 0.25);
532
533 svg {
534 height: 24px;
535 width: 224px;
536 }
537
538 &:hover {
539 background: $red;
540 visibility: visible;
541 opacity: 1;
542 }
543 }
544
545 img {
546 display: block;
547 max-width: 100%;
548
549 &:hover {
550 & + .everest-forms-welcome-video__button {
551 visibility: visible;
552 opacity: 1;
553 }
554 }
555 }
556 }
557
558 .everest-forms-welcome-container__action {
559 padding: 0 32px;
560 margin: 3rem 0;
561 display: flex;
562 justify-content: space-between;
563
564 .everest-forms-welcome-container__action-card {
565 padding: 1em;
566 margin: 0 1em;
567 width: 100%;
568 border-radius: 4px;
569 width: calc(50% - 38px);
570 border: 1px solid $color_gray-lighten;
571 transition: 0.3s ease;
572
573 .everest-forms-welcome-container__action-card-img {
574 svg {
575 height: 64px;
576 width: 64px;
577 }
578 }
579
580 .everest-forms-welcome-container__action-card-content {
581 h3 {
582 font-size: 1.23em;
583 margin-bottom: 0.5em;
584 }
585
586 p {
587 margin-top: 0.5em;
588 }
589 }
590
591 &:hover {
592 box-shadow: 0 2px 20px 0
593 transparentize($color_gray-base, 0.85);
594 }
595 }
596 }
597 }
598 }
599
600 /**
601 * Branding
602 */
603 .everest-forms_page_evf-builder,
604 .everest-forms_page_evf-settings,
605 .everest-forms_page_evf-entries,
606 .everest-forms_page_evf-tools {
607 select {
608 max-width: inherit;
609 }
610
611 .clearfix {
612 height: auto;
613 }
614
615 // Toggle switch.
616 .everest-forms-toggle-form {
617 width: 28px;
618 height: 16px;
619 float: left;
620 margin-top: 3px;
621 margin-right: 4px;
622 position: relative;
623
624 input[type='checkbox']='checkbox'] {
625 position: absolute;
626 top: 0;
627 bottom: 0;
628 width: 100%;
629 opacity: 0;
630 z-index: 1;
631
632 &:checked {
633 + .slider {
634 background-color: $green;
635
636 &::before {
637 transform: translateX(100%);
638 }
639 }
640 }
641 }
642
643 .slider {
644 cursor: pointer;
645 position: absolute;
646 top: 0;
647 left: 0;
648 right: 0;
649 bottom: 0;
650 transition: 0.4s;
651 background-color: #cdd0d2;
652
653 &::before {
654 content: '';
655 width: 12px;
656 height: 12px;
657 position: absolute;
658 left: 2px;
659 bottom: 2px;
660 transition: 0.4s;
661 background-color: $color-white;
662 }
663
664 &.round {
665 border-radius: 16px;
666
667 &::before {
668 border-radius: 50%;
669 }
670 }
671 }
672 }
673
674 .evf-toggle-section {
675 display: inline-block;
676
677 .evf-toggle-switch {
678 display: inline-flex;
679 position: relative;
680 line-height: 1;
681 margin-bottom: 0;
682 position: relative;
683
684 input {
685 top: 0;
686 left: 0;
687 margin: 0;
688 z-index: 1;
689 opacity: 0;
690 padding: 0;
691 width: 100%;
692 height: 100%;
693 border: none;
694 position: absolute;
695
696 &:checked {
697 + .evf-toggle-switch-wrap {
698 background-color: #11a0d2;
699 border: 2px solid #11a0d2;
700 border: 9px solid transparent;
701
702 &::before {
703 content: '';
704 height: 6px;
705 width: 2px;
706 background: #fff;
707 position: absolute;
708 left: 0;
709 top: 0;
710 transform: translateY(-50%);
711 }
712
713 &::after {
714 border: 2px solid transparent;
715 }
716 }
717
718 ~ .evf-toggle-switch-control {
719 background-color: #fff;
720 border-width: 0;
721 transform: translateX(18px) translateY(-50%);
722 }
723
724 &::before {
725 display: none;
726 }
727 }
728
729 &:focus {
730 + .evf-toggle-switch-wrap {
731 box-shadow: 0 0 0 2px #fff, 0 0 0 3px #6c7781;
732 }
733 }
734 }
735
736 .evf-toggle-switch-wrap {
737 width: 36px;
738 height: 18px;
739 display: inline-flex;
740 background-color: #fff;
741 border: 2px solid #6c7781;
742 border-radius: 9px;
743 transition: 0.2s background ease;
744 position: relative;
745 align-items: center;
746 justify-content: flex-end;
747
748 &::after {
749 content: '';
750 width: 4px;
751 height: 4px;
752 margin-right: 2px;
753 border-radius: 50%;
754 display: inline-block;
755 border: 2px solid $color_gray-normal;
756 }
757 }
758
759 .evf-toggle-switch-control {
760 display: block;
761 position: absolute;
762 top: 50%;
763 left: 4px;
764 width: 10px;
765 height: 10px;
766 border-radius: 50%;
767 transition: 0.1s transform ease;
768 background-color: #6c7781;
769 border: 5px solid #6c7781;
770 transform: translateY(-50%);
771 }
772 }
773
774 label.evf-toggle-label {
775 display: inline-block;
776 margin-bottom: 0;
777 margin-left: 4px;
778 }
779 }
780
781 .everest-forms-disabled {
782 opacity: 0.5;
783 pointer-events: none;
784 }
785
786 // Radio and checkbox list option
787 .everest-forms-checklist {
788 margin-bottom: 14px;
789
790 ul {
791 margin-bottom: 0;
792
793 label {
794 font-weight: normal;
795 margin-bottom: 0;
796 margin-top: 0;
797 }
798 }
799
800 &.everest-forms-checklist-inline {
801 ul {
802 display: flex;
803 flex-wrap: wrap;
804
805 li {
806 margin-right: 10px;
807 margin-bottom: 0;
808 }
809 }
810 }
811 }
812
813 .everest-forms-label-edit {
814 display: flex;
815 justify-content: space-between;
816
817 .dashicons {
818 color: $color_gray-light;
819 height: 24px;
820 width: 24px;
821 cursor: pointer;
822 flex: 0 0 24px;
823 margin: 4px;
824 border-radius: 3px;
825 display: flex;
826 align-items: center;
827 justify-content: center;
828 opacity: 0;
829 visibility: hidden;
830 }
831
832 &:hover,
833 &:active,
834 &:focus,
835 &:focus-within {
836 .dashicons {
837 visibility: visible;
838 opacity: 1;
839 }
840 }
841
842 input {
843 margin-right: 6px;
844 }
845 }
846
847 .everest-forms {
848 .loading-dot {
849 background: url(../images/icons/three-dots.svg);
850 opacity: 0.7;
851 width: 25px;
852 height: 10px;
853 display: inline-block;
854 vertical-align: middle;
855 background-size: 25px 10px;
856 }
857
858 .everest-forms-overlay {
859 width: 100%;
860 z-index: 99999;
861 overflow: hidden;
862 background: #f1f1f1;
863 position: absolute;
864 top: 0;
865 bottom: 0;
866 height: auto;
867 min-height: 100vh;
868
869 .everest-forms-overlay-content {
870 position: absolute;
871 top: 50%;
872 left: 0;
873 right: 0;
874 width: 128px;
875 height: 128px;
876 margin: 0 auto;
877 transform: translateY(-50%);
878
879 span.loading {
880 display: block;
881 font-size: 20px;
882 text-align: center;
883 letter-spacing: 0.05em;
884 }
885 }
886 }
887
888 nav.evf-nav-tab-wrapper {
889 padding: 0;
890 border: none;
891 display: flex;
892 margin: 0 0 1.5em;
893 position: relative;
894 border-bottom: none;
895 background-color: $everestforms;
896
897 a.nav-tab {
898 color: $color-white;
899 margin-left: 0;
900 display: block;
901 cursor: pointer;
902 font-size: 12px;
903 font-weight: 400;
904 line-height: 24px;
905 padding: 10px 30px;
906 border: none transparent;
907 background-color: transparent;
908 transition: 0.5s background-color ease-in-out;
909
910 span {
911 &.evf-nav-icon {
912 float: none;
913 width: auto;
914 height: auto;
915 display: block;
916 font-size: 32px;
917 text-align: center;
918
919 &::before {
920 @include iconbefore('\e001');
921 margin-right: 0;
922 }
923
924 &.general::before {
925 content: '\e001';
926 }
927
928 &.settings::before {
929 content: '\e002';
930 }
931
932 &.recaptcha::before {
933 content: '\e003';
934 }
935
936 &.email::before {
937 content: '\e006';
938 }
939
940 &.validation::before {
941 content: '\e910';
942 }
943
944 &.pdf-submission::before {
945 content: '\e023';
946 }
947
948 &.fields::before {
949 content: '\e00b';
950 }
951
952 &.payment,
953 &.payments {
954 &::before {
955 content: '\e01f';
956 }
957 }
958
959 &.integration,
960 &.integrations {
961 &::before {
962 content: '\e01e';
963 }
964 }
965
966 &.logs::before {
967 content: '\e02d';
968 }
969
970 &.import::before {
971 content: '\e02e';
972 }
973
974 &.export::before {
975 content: '\e02f';
976 }
977 &.permission::before {
978 content: '\e030';
979 }
980 &.evf-widget::before {
981 content: '\e902';
982 }
983 &.geolocation::before {
984 content: '\e900';
985 }
986 &.delete::before {
987 content: '\e906';
988 }
989 &.misc::before {
990 content: '\e911';
991 }
992 &.ai::before {
993 content: '\e912';
994 }
995 &.lookup::before {
996 content: '\e914';
997 }
998 &.analytics::before {
999 content: '\e915';
1000 }
1001 }
1002 }
1003
1004 &.nav-tab-active {
1005 margin-bottom: 0;
1006 background-color: adjust-color($everestforms, $saturation: +20%, $lightness: +6%);
1007
1008 &:focus {
1009 box-shadow: none;
1010 }
1011 }
1012
1013 &:focus {
1014 box-shadow: none;
1015 }
1016
1017 &:hover:not(.nav-tab-active) {
1018 background-color: adjust-color($everestforms, $saturation: -4%, $lightness: -4%);
1019 }
1020 }
1021 }
1022
1023 .everest-forms-tools,
1024 .everest-forms-settings {
1025 padding-left: 20px;
1026 padding-right: 20px;
1027
1028 h2 {
1029 font-size: 20px;
1030 }
1031
1032 .form-table {
1033 tr {
1034 border-bottom: 1px solid $color_gray-lighten;
1035
1036 &:first-child {
1037 border-top: 1px solid $color_gray-lighten;
1038 }
1039 }
1040
1041 th {
1042 padding-top: 31px;
1043
1044 .everest-forms-help-tip {
1045 margin: 0;
1046 transform: translateY(-50%);
1047 }
1048 }
1049
1050 td:not(.everest-forms-permissions) {
1051 padding: 25px 0;
1052 }
1053
1054 .forminp-radio-image {
1055 ul {
1056 margin: 0;
1057 display: flex;
1058
1059 li {
1060 margin-right: 30px;
1061
1062 label,
1063 img {
1064 display: block;
1065 }
1066
1067 img {
1068 margin-bottom: 15px;
1069 border: 2px solid $color_gray-lighten;
1070 }
1071 }
1072 }
1073 }
1074 }
1075 }
1076 }
1077 }
1078
1079 /**
1080 * Tabs
1081 */
1082 .everest-forms-tab {
1083 ul {
1084 display: flex;
1085 flex-wrap: wrap;
1086 margin: 0;
1087
1088 .everest-forms-tab-nav {
1089 display: inline-flex;
1090 margin: 0 8px 0 0;
1091
1092 .everest-forms-tab-nav-link {
1093 font-weight: 600;
1094 padding: 16px 8px;
1095 color: $color_gray-base;
1096 text-decoration: none;
1097 border-bottom: 2px solid transparent;
1098 }
1099
1100 &.active {
1101 .everest-forms-tab-nav-link {
1102 color: $everestforms;
1103 border-color: $everestforms;
1104 }
1105 }
1106 }
1107 }
1108 }
1109
1110 .everest-forms-setup {
1111 font-size: 14px;
1112 max-width: calc(100% - 32px);
1113 margin: 20px auto;
1114 background: $color-white;
1115
1116 @media (min-width: 960px) {
1117 max-width: 835px;
1118 }
1119
1120 @media (min-width: 1280px) {
1121 max-width: 1100px;
1122 }
1123
1124 a {
1125 &:focus {
1126 box-shadow: none;
1127 }
1128 }
1129
1130 .page-title-action {
1131 top: 0;
1132 margin-left: 16px;
1133 &:active{
1134 top:0;
1135 margin-left:16px;
1136 }
1137 }
1138
1139 .everest-forms-setup-header {
1140 display: flex;
1141 flex-wrap: wrap;
1142 align-items: center;
1143 padding: 0 16px;
1144 background-color: $color-white;
1145 border-bottom: 1px solid $color_gray-lighten;
1146
1147 @media only screen and (max-width: 768px) {
1148 padding-top: 16px;
1149 }
1150
1151 .everest-forms-logo {
1152 display: flex;
1153 flex-wrap: wrap;
1154 padding-right: 1em;
1155 border-right: 1px solid $color_gray-lighten;
1156 margin-right: 1em;
1157 }
1158
1159 h4 {
1160 margin: 0;
1161 }
1162
1163 .everest-forms-tab {
1164 margin-left: auto;
1165
1166 @media only screen and (max-width: 768px) {
1167 width: calc(100% + 32px);
1168 flex: 0 0 calc(100% + 32px);
1169 margin-top: 16px;
1170 margin-right: -16px;
1171 margin-left: -16px;
1172 border-top: 1px solid $color_gray-lighten;
1173 }
1174 }
1175 }
1176 }
1177
1178 /**
1179 * Template Setup
1180 **/
1181 .everest-forms {
1182 border-radius: 4px;
1183
1184 * {
1185 box-sizing: border-box;
1186 }
1187
1188 span {
1189 display: inline-block;
1190 }
1191
1192 .everest-forms-loader-overlay {
1193 background: transparentize($color_gray-dark, 0.25);
1194 position: fixed;
1195 left: 0;
1196 right: 0;
1197 top: 0;
1198 bottom: 0;
1199 z-index: 9;
1200
1201 .evf-loading {
1202 margin: 0 auto;
1203 position: absolute;
1204 left: 0;
1205 right: 0;
1206 top: 50%;
1207 transform: translateY(-50%);
1208 }
1209 }
1210
1211 .everest-forms-setup-form-name {
1212 padding: 15px 20px;
1213 border-bottom: 1px solid $color_gray-lighten;
1214
1215 .everest-forms-setup-name {
1216 margin-left: 40px;
1217 padding: 10px;
1218 height: 35px;
1219 width: 400px;
1220
1221 &.everest-forms-required {
1222 border-color: $red;
1223 box-shadow: 0 0 2px rgba(175, 0, 0, 0.8);
1224 }
1225 }
1226 }
1227
1228 .evf-setup-title {
1229 width: auto;
1230 font-size: 24px;
1231 line-height: 34px;
1232 font-weight: 600;
1233 color: $color_gray-dark;
1234 padding: 15px 20px 10px;
1235
1236 p.desc {
1237 font-weight: normal;
1238 }
1239 }
1240
1241 .evf-setup-templates {
1242 display: flex;
1243 flex-wrap: wrap;
1244 padding: 8px;
1245
1246 .evf-loading {
1247 margin: 80px auto;
1248 }
1249
1250 .evf-template {
1251 .everest-forms-screenshot {
1252 cursor: pointer;
1253 padding: 8px;
1254 margin: 0;
1255 min-height: auto;
1256 position: relative;
1257 border-radius: 4px;
1258 background: $color_gray-more-lighten;
1259
1260 @media only screen and (min-width: 1280px) {
1261 min-height: 280px;
1262 }
1263
1264 .everest-forms-badge {
1265 position: absolute;
1266 bottom: 16px;
1267 right: 16px;
1268 z-index: 1;
1269 }
1270
1271 .form-action {
1272 display: none;
1273 position: absolute;
1274 left: 0;
1275 right: 0;
1276 top: 50%;
1277 transform: translateY(-50%);
1278 z-index: 1;
1279
1280 .everest-forms-btn {
1281 &.everest-forms-btn-secondary {
1282 background: $color-white;
1283 }
1284
1285 &:last-child {
1286 margin-left: 8px;
1287 }
1288 }
1289 }
1290 }
1291
1292 img {
1293 display: block;
1294 width: 100%;
1295 }
1296
1297 .everest-forms-form-id-container {
1298 display: flex;
1299 flex-wrap: wrap;
1300 align-items: center;
1301 justify-content: space-between;
1302 position: relative;
1303
1304 .everest-forms-template-name {
1305 font-size: 16px;
1306 font-weight: 600;
1307 margin: 16px 0;
1308 color: $color_gray-base;
1309 text-decoration: none;
1310
1311 &:hover {
1312 color: $everestforms;
1313 }
1314 }
1315 }
1316
1317 &:hover {
1318 .everest-forms-screenshot::after {
1319 content: '';
1320 display: block;
1321 background: transparentize($color_gray-base, 0.5);
1322 position: absolute;
1323 top: 0;
1324 left: 0;
1325 bottom: 0;
1326 right: 0;
1327 }
1328
1329 .form-action {
1330 display: flex;
1331 align-items: center;
1332 justify-content: center;
1333 }
1334 }
1335
1336 &:nth-child(even) {
1337 float: right;
1338 }
1339
1340 .evf-template-overlay {
1341 position: absolute;
1342 background-color: rgba(0, 0, 0, 0.5);
1343 top: 0;
1344 left: 0;
1345 right: 0;
1346 bottom: 0;
1347 opacity: 0;
1348 visibility: hidden;
1349 transition: 0.5s background-color ease-in-out;
1350 color: $color-white;
1351 text-align: center;
1352 padding: 40% 0;
1353
1354 .evf-template-select {
1355 text-decoration: none;
1356 }
1357
1358 &.loading {
1359 .evf-button,
1360 .evf-button::before,
1361 .evf-button::after {
1362 background: $color-white;
1363 -webkit-animation: load1 1s infinite ease-in-out;
1364 animation: load1 1s infinite ease-in-out;
1365 width: 1em;
1366 height: 4em;
1367 padding: 0;
1368 border-radius: 0;
1369 }
1370 .evf-button {
1371 color: $color-white;
1372 text-indent: -9999em;
1373 margin: 0 auto;
1374 position: relative;
1375 font-size: 11px;
1376 -webkit-transform: translateZ(0);
1377 -ms-transform: translateZ(0);
1378 transform: translateZ(0);
1379 -webkit-animation-delay: -0.16s;
1380 animation-delay: -0.16s;
1381 }
1382 .evf-button::before,
1383 .evf-button::after {
1384 position: absolute;
1385 top: 0;
1386 content: '';
1387 }
1388 .evf-button::before {
1389 left: -1.5em;
1390 -webkit-animation-delay: -0.32s;
1391 animation-delay: -0.32s;
1392 }
1393 .evf-button::after {
1394 left: 1.5em;
1395 }
1396 @-webkit-keyframes load1 {
1397 0%,
1398 80%,
1399 100% {
1400 box-shadow: 0 0;
1401 height: 4em;
1402 }
1403 40% {
1404 box-shadow: 0 -2em;
1405 height: 5em;
1406 }
1407 }
1408 @keyframes load1 {
1409 0%,
1410 80%,
1411 100% {
1412 box-shadow: 0 0;
1413 height: 4em;
1414 }
1415 40% {
1416 box-shadow: 0 -2em;
1417 height: 5em;
1418 }
1419 }
1420 }
1421 }
1422
1423 &:hover .evf-template-overlay,
1424 .evf-template-overlay.loading {
1425 opacity: 1;
1426 visibility: visible;
1427 }
1428
1429 .evf-button {
1430 display: inline-block;
1431 padding: 15px 22px;
1432 background-color: $color-white;
1433 color: #000;
1434 font-size: 12px;
1435 text-transform: uppercase;
1436 border: none;
1437 border-radius: 100px;
1438 }
1439 }
1440 }
1441 }
1442
1443 /**
1444 * Form Setup
1445 */
1446 .everest-forms-builder-setup {
1447 #screen-meta-links {
1448 display: none;
1449 }
1450
1451 .jconfirm-everest-forms {
1452 .jconfirm-box {
1453 border-radius: 4px !important;
1454
1455 div.jconfirm-title-c {
1456 padding-bottom: 10px;
1457
1458 .jconfirm-icon-c {
1459 margin-bottom: 16px !important;
1460
1461 .dashicons {
1462 color: $color-white;
1463 font-size: 28px !important;
1464 height: 54px !important;
1465 width: 54px !important;
1466 border-radius: 50%;
1467 background: $red;
1468 line-height: 54px;
1469 }
1470 }
1471
1472 .jconfirm-title {
1473 font-size: 22px !important;
1474 font-weight: 600;
1475 }
1476 }
1477
1478 div.jconfirm-content {
1479 margin-bottom: 0 !important;
1480 }
1481 }
1482 }
1483
1484 .jconfirm-everest-forms-left {
1485 &.jconfirm-modern {
1486 .jconfirm-box {
1487 width: 500px !important;
1488 padding: 20px 30px 15px;
1489 border-radius: 4px !important;
1490
1491 .jconfirm-title-c {
1492 text-align: left;
1493 font-size: 20px;
1494 font-weight: 400;
1495 padding-bottom: 0;
1496 line-height: 1.8;
1497
1498 .jconfirm-icon-c {
1499 margin: 0;
1500 }
1501 }
1502
1503 .jconfirm-content {
1504 white-space: initial !important; // to avoid spacing issue on notice while installing addons
1505 text-align: left;
1506 margin-bottom: 0;
1507
1508 input[type='text']='text'] {
1509 margin: 5px 2px 2px;
1510 padding: 5px 10px;
1511
1512 &:focus {
1513 border-color: #007cba;
1514 box-shadow: 0 0 0 1px #007cba;
1515 }
1516 }
1517 }
1518
1519 .jconfirm-buttons {
1520 text-align: right;
1521
1522 .everest-forms-btn {
1523 font-weight: 400;
1524 text-transform: none;
1525 }
1526 }
1527 }
1528 }
1529 }
1530
1531 .everest-forms-recommend-addons {
1532 margin-top: 20px;
1533 padding-top: 16px;
1534 border-top: 2px solid $color_gray-more-lighten;
1535
1536 .bulk-action-notice {
1537 margin: 0 0 20px;
1538
1539 p {
1540 padding: 0;
1541 margin: 8px 0 !important;
1542 }
1543
1544 &.notice-error {
1545 .button-link {
1546 text-decoration: none;
1547 display: flex;
1548 align-items: center;
1549 margin-top: 8px;
1550
1551 .toggle-indicator {
1552 display: inline-flex;
1553 }
1554 }
1555
1556 .bulk-action-errors {
1557 margin-top: 0;
1558 }
1559 }
1560 }
1561
1562 .plugins-list-table {
1563 border-radius: 4px;
1564
1565 .plugin-status {
1566 float: right;
1567
1568 span {
1569 width: 20px;
1570 height: 20px;
1571 overflow: hidden;
1572 border-radius: 50%;
1573 position: relative;
1574 vertical-align: top;
1575 white-space: nowrap;
1576 text-indent: -9999px;
1577 display: inline-block;
1578 border: 2px solid $color_gray-lighten;
1579
1580 &.active,
1581 &.activate-now {
1582 &::after {
1583 position: absolute;
1584 left: 50%;
1585 top: 50%;
1586 opacity: 1;
1587 width: 34%;
1588 height: 50%;
1589 content: '';
1590 transform-origin: left top;
1591 border-top: 2px solid $color_gray-lighten;
1592 border-right: 2px solid $color_gray-lighten;
1593 transform: scaleX(-1) rotate(135deg)
1594 translate(-58%, -40%);
1595 }
1596 }
1597
1598 &.activate-now {
1599 border-color: $color_gray-lighten;
1600
1601 &.updating-message {
1602 border-color: $color_gray-lighten;
1603 border-left-color: $green;
1604 }
1605 }
1606
1607 &.active {
1608 border-color: $green;
1609
1610 &::after {
1611 border-top: 2px solid $green;
1612 border-right: 2px solid $green;
1613 }
1614 }
1615
1616 &.updating-message {
1617 border-left-color: $green;
1618 animation: spin 0.75s linear infinite;
1619
1620 &::after {
1621 content: none;
1622 }
1623 }
1624 }
1625 }
1626 }
1627
1628 .everest-forms-template-install-addon {
1629 margin-top: 20px;
1630 }
1631 }
1632
1633 .everest-forms {
1634 .evf-setup-templates {
1635 .evf-template {
1636 width: 100%;
1637 background: $color-white;
1638 border-radius: 4px;
1639 position: relative;
1640 margin: 12px;
1641
1642 @media (min-width: 400px) {
1643 width: calc(50% - 24px);
1644 flex: 0 0 calc(50% - 24px);
1645 }
1646
1647 @media only screen and (min-width: 768px) {
1648 width: calc(33.333% - 24px);
1649 flex: 0 0 calc(33.333% - 24px);
1650 }
1651
1652 @media (min-width: 960px) {
1653 width: calc(25% - 24px);
1654 flex: 0 0 calc(25% - 24px);
1655 }
1656 }
1657 }
1658 }
1659 }
1660 // Entries page
1661 #evf-dashboard-analytisc-body {
1662 &::after,
1663 &::before {
1664 display: none;
1665 }
1666 }
1667 p.search-box {
1668 margin-top: 15px;
1669 }
1670
1671 #evf-dashboard-analytics {
1672 .evf-container {
1673 margin-left: 0;
1674 margin-right: 0;
1675 max-width: 100%;
1676 }
1677 }
1678
1679 /**
1680 * Form Builder
1681 **/
1682 #everest-forms-panel-settings {
1683 .evf-content-section {
1684 display: none;
1685 }
1686
1687 .evf-content-section.active {
1688 display: block;
1689 }
1690 }
1691
1692 #everest-forms-panel-payments,
1693 #everest-forms-panel-integrations {
1694 .evf-panel-content-section {
1695 display: none;
1696 }
1697
1698 .evf-panel-content-section.active {
1699 display: block;
1700 }
1701 }
1702
1703 .everest-forms_page_evf-builder {
1704 .everest-forms-add-fields-group,
1705 .everest-forms-field-option-group {
1706 .handlediv {
1707 float: right;
1708
1709 &::before {
1710 content: '\f142' !important;
1711 cursor: pointer;
1712 display: inline-block;
1713 font: 400 20px/1 Dashicons;
1714 line-height: 0.5 !important;
1715 padding: 4px;
1716 position: relative;
1717 right: 0;
1718 top: 0;
1719 }
1720 }
1721
1722 &.closed {
1723 .handlediv::before {
1724 content: '\f140' !important;
1725 }
1726 }
1727 }
1728
1729 #everest-forms-builder {
1730 width: 100%;
1731 position: absolute;
1732 top: 0;
1733 bottom: 0;
1734 min-height: calc(100vh - 32px);
1735
1736 * {
1737 box-sizing: border-box;
1738 }
1739
1740 .wp-picker-holder * {
1741 box-sizing: content-box;
1742 }
1743
1744 #everest-forms-builder-form {
1745 position: fixed;
1746 }
1747
1748 h2,
1749 h3,
1750 h4,
1751 h5,
1752 h6 {
1753 color: $color_gray-dark;
1754 }
1755
1756 a {
1757 text-decoration: none;
1758
1759 &:focus {
1760 outline: none;
1761 box-shadow: 0 0 0 rgba(0, 0, 0, 0);
1762 }
1763 }
1764
1765 .add,
1766 .remove,
1767 .addPayment,
1768 .removePayment {
1769 color: $color_gray-normal;
1770 background: $color-white;
1771 height: 30px;
1772 width: 30px;
1773 display: flex;
1774 align-items: center;
1775 justify-content: center;
1776 border-radius: 4px;
1777 border: 1px solid $color_gray-lighten;
1778
1779 &:hover {
1780 color: $color-white;
1781 }
1782 }
1783
1784 .add {
1785 &:hover {
1786 background: $blue;
1787 border-color: $blue;
1788 }
1789 }
1790
1791 .remove {
1792 margin-left: 8px;
1793
1794 &:hover {
1795 background: $red;
1796 border-color: $red;
1797 }
1798 }
1799
1800 .after-label-description {
1801 float: right;
1802 }
1803
1804 input,
1805 select,
1806 option,
1807 textarea {
1808 border-color: $color_gray-lighten;
1809
1810 &::placeholder {
1811 color: $color_gray-light;
1812 }
1813
1814 &:focus {
1815 border-color: #5b9dd9;
1816 }
1817 }
1818
1819 .everest-forms-inner-options {
1820 padding-left: 20px;
1821 }
1822
1823 .input-group-col-2 {
1824 display: flex;
1825 flex-wrap: nowrap;
1826
1827 input[type='text']='text'],
1828 input[type='number']='number'],
1829 select {
1830 flex: 0 0 50%;
1831 margin-right: 2%;
1832 margin-bottom: 10px;
1833 max-width: calc(50% - 1%);
1834
1835 &:nth-child(2n) {
1836 margin-right: 0;
1837 }
1838 }
1839 }
1840
1841 .everest-forms-nav-wrapper {
1842 background-color: $everestforms;
1843 display: flex;
1844 flex-wrap: wrap;
1845 align-items: center;
1846 justify-content: space-between;
1847
1848 nav.evf-nav-tab-wrapper {
1849 margin: 0;
1850 padding-right: 24px;
1851 flex: 1;
1852 }
1853
1854 .everest-forms-btn {
1855 &:focus {
1856 box-shadow: 0 0 0 3px
1857 adjust-color($everestforms, $saturation: 39%, $lightness: +18%);
1858 }
1859 }
1860
1861 .evf-forms-nav-right {
1862 padding: 21px 30px 19px;
1863
1864 .evf-shortcode-field {
1865 display: inline-block;
1866 vertical-align: middle;
1867
1868 input {
1869 margin: 0;
1870 width: 225px;
1871 height: 36px;
1872 padding: 4px 10px;
1873 line-height: 1.25;
1874 border-radius: 3px 0 0 3px;
1875 }
1876
1877 button {
1878 padding: 0;
1879 width: 36px;
1880 height: 36px;
1881 margin-left: -4px;
1882 border-radius: 0 3px 3px 0;
1883 background-color: lighten($everestforms, 7%);
1884
1885 &.copy-shortcode {
1886 font-size: 16px;
1887 color: $color-white;
1888
1889 &::before {
1890 @include iconbefore('\e00c');
1891 line-height: 27px;
1892 margin-right: 0;
1893 padding-right: 0;
1894 border-right: none;
1895 }
1896 }
1897
1898 &:focus {
1899 box-shadow: none;
1900 }
1901 }
1902 }
1903
1904 .everest-forms-save-button {
1905 min-width: 75px;
1906 cursor: pointer;
1907 min-height: 36px;
1908 color: $color-white;
1909 background: $green;
1910 margin-left: 10px;
1911 position: relative;
1912 display: inline-block;
1913 vertical-align: middle;
1914 text-transform: uppercase;
1915
1916 &.processing {
1917 width: 75px;
1918 font-size: 0;
1919 min-height: 36px;
1920 transition: all 0.35s ease 0s;
1921
1922 &:focus {
1923 box-shadow: 0 0 0 2px
1924 adjust-color($everestforms, $saturation: 39%, $lightness: +18%);
1925 }
1926 }
1927
1928 .loading-dot {
1929 position: absolute;
1930 top: 50%;
1931 transform: translateY(-50%);
1932 left: 0;
1933 right: 0;
1934 margin: 0 auto;
1935 }
1936
1937 .spinner,
1938 .evf-loading {
1939 width: 14px;
1940 height: 14px;
1941 margin-top: 5px !important;
1942 margin-left: 5px !important;
1943 background-size: 14px 14px;
1944 }
1945
1946 &:hover {
1947 background: darken($green, 10%);
1948 }
1949 }
1950
1951 .everest-forms-preview-button {
1952 background: $color-white;
1953 margin-left: 10px;
1954 display: inline-block;
1955 vertical-align: middle;
1956
1957 &:hover {
1958 background: transparentize($color-white, 0.1);
1959 }
1960 }
1961 }
1962 }
1963
1964 .evf-tab-content {
1965 h5 {
1966 margin: 0 auto 20px auto;
1967 font-size: 24px;
1968 line-height: normal;
1969 }
1970
1971 .evf_smart_tag {
1972 input[type='text']='text'] {
1973 width: calc(100% - 34px);
1974 min-height: 27px;
1975 }
1976 }
1977
1978 .evf-toggle-smart-tag-display {
1979 right: 0;
1980 width: 30px;
1981 min-height: 30px;
1982 color: $color_gray-base;
1983 position: absolute;
1984 background: $color-white;
1985 border: 1px solid $color_gray-lighten;
1986 border-radius: 4px;
1987 box-shadow: inset 0 1px 2px
1988 transparentize($color_gray-dark, 0.9);
1989
1990 .dashicons-editor-code {
1991 &::before {
1992 left: 0;
1993 right: 0;
1994 margin: 0 auto;
1995 line-height: 28px;
1996 position: absolute;
1997 }
1998 }
1999 }
2000
2001 .evf-smart-tag-lists {
2002 right: 0;
2003 z-index: 1;
2004 max-height: 123px;
2005 margin-top: -1px;
2006 width: 230px;
2007 overflow-y: auto;
2008 position: absolute;
2009 background: $color-white;
2010 border-radius: 4px;
2011 border: 1px solid $color_gray-lighten;
2012 box-shadow: 1px 3px 20px 0 transparentize($color_gray-dark, 0.8);
2013
2014 li,
2015 .smart-tag-title {
2016 padding: 7px 10px;
2017 }
2018
2019 .smart-tag-title {
2020 font-weight: 600;
2021 background: $color_gray-light-skin;
2022 border-bottom: 1px solid $color_gray-lighten;
2023 }
2024
2025 ul {
2026 margin: 0;
2027 }
2028
2029 li {
2030 cursor: pointer;
2031 margin-bottom: 0;
2032
2033 &:hover {
2034 background: $color_gray-light-skin;
2035 }
2036 }
2037 }
2038
2039 #evf-custom-css-block, #evf-custom-js-block {
2040 position: relative;
2041 top: 0;
2042 right: 0;
2043 bottom: 0;
2044 left: 0;
2045 min-height: 200px;
2046 font-size: 12px;
2047 }
2048
2049 &.everest-forms-panel-field-textarea {
2050 .evf-smart-tag-lists {
2051 top: 40%;
2052 }
2053 }
2054
2055 .everest-forms-panel {
2056 width: 100%;
2057 display: none;
2058
2059 &.active {
2060 display: block;
2061 }
2062
2063 .everest-forms-sub-label {
2064 font-size: 12px;
2065 font-weight: 400;
2066 margin-bottom: 0;
2067 color: $color_gray-base;
2068 }
2069
2070 .everest-forms-panel-sidebar-content {
2071 display: flex;
2072
2073 .everest-forms-panel-content-wrap {
2074 width: calc(100% - 400px);
2075 }
2076 }
2077
2078 .everest-forms-one-half {
2079 float: left;
2080 width: 49%;
2081 margin-right: 2%;
2082
2083 &:nth-child(2) {
2084 margin-right: 0;
2085 }
2086 }
2087
2088 .everest-forms-field-row {
2089 margin: 0 0 10px 0;
2090 position: relative;
2091 }
2092
2093 .everest-forms-panel-sidebar {
2094 width: 400px;
2095 // height: calc(100vh - 150px);
2096 height: calc(100vh - 110px);
2097 position: relative;
2098 background-color: $color_gray-light-skin;
2099 border-right: 1px solid $color_gray-lighten;
2100
2101 .everest-forms-input-group {
2102 background-color: $color-white;
2103 border: 1px solid $input-border-color;
2104 border-radius: 4px;
2105
2106 .everest-forms-input-control {
2107 background: none;
2108 border-color: transparent !important;
2109 box-shadow: none;
2110
2111 &:focus {
2112 border-color: transparent;
2113 }
2114 }
2115
2116 &__text {
2117 background: none;
2118 border: none;
2119 }
2120
2121 &:focus-within {
2122 border: 1px solid $everestforms;
2123 box-shadow: 0 0 0 1px $everestforms;
2124 }
2125 }
2126
2127 .everest-forms-fields-not-found {
2128 text-align: center;
2129 margin-top: 2.85em;
2130
2131 .everest-forms-fields-not-found__title {
2132 font-size: 1.7em;
2133 }
2134 }
2135
2136 .everest-forms-add-fields-heading {
2137 display: block;
2138 font-size: 14px;
2139 font-weight: 600;
2140 margin-bottom: 15px;
2141 padding-bottom: 15px;
2142 color: $color_gray-dark;
2143 border-bottom: 1px solid $color_gray-lighten;
2144
2145 i {
2146 float: right;
2147 font-size: 14px;
2148 margin-left: 5px;
2149 line-height: 1.5;
2150 }
2151 }
2152
2153 .evf-registered-buttons {
2154 margin-right: -1.5%;
2155 margin-left: -1.5%;
2156 list-style: none;
2157 padding: 0;
2158 display: flex;
2159 flex-wrap: wrap;
2160 }
2161
2162 .evf-registered-item {
2163 margin-left: 1.5%;
2164 margin-right: 1.5%;
2165 padding: 20px 8px;
2166 border: 1px solid $color_gray-lighten;
2167 width: 30.3%;
2168 z-index: 999;
2169 margin-bottom: 10px;
2170 color: $color_gray-light;
2171 cursor: pointer;
2172 border-radius: 4px;
2173 font-size: 12px;
2174 transition: 0.5s color ease-in-out,
2175 0.5s border-color ease-in-out;
2176 text-align: center;
2177 background-color: $color-white;
2178
2179 .dashicons {
2180 display: block;
2181 margin: 0 auto;
2182 }
2183 &.evf-upgrade-addon {
2184 cursor: not-allowed;
2185 }
2186 &.upgrade-modal,
2187 &.evf-upgrade-addon,
2188 &.enable-stripe-model,
2189 &.enable-authorize-net-model {
2190 opacity: 0.45;
2191 }
2192
2193 &:hover {
2194 color: $blue;
2195 border-color: $blue;
2196
2197 .evf-icon {
2198 color: inherit;
2199 }
2200
2201 svg {
2202 .cls-1,
2203 .cls-2,
2204 .cls-3 {
2205 fill: $blue;
2206 }
2207 }
2208 }
2209
2210 &:focus {
2211 outline: none;
2212 }
2213
2214 svg {
2215 width: 40px;
2216 height: 40px;
2217 display: block;
2218 margin: 0 auto 10px;
2219
2220 .cls-1,
2221 .cls-2,
2222 .cls-3 {
2223 fill: #414042;
2224 transition: 0.5s fill ease-in-out;
2225 font-size: 7px;
2226 font-weight: 300;
2227 }
2228 }
2229
2230 &.ui-draggable-dragging {
2231 margin: 0;
2232 width: 105px !important;
2233 background-color: $color-white;
2234 position: relative;
2235 z-index: 99999;
2236
2237 svg {
2238 .cls-1,
2239 .cls-2,
2240 .cls-3 {
2241 fill: $blue;
2242 }
2243 }
2244 }
2245 }
2246
2247 .evf-setting--checkbox,
2248 .evf-field-option--checkbox {
2249 input,
2250 label {
2251 width: auto;
2252 padding: 0;
2253 display: inline-block;
2254 vertical-align: top;
2255 height: auto;
2256 }
2257
2258 input {
2259 margin: 3px 5px 0 0;
2260 }
2261 }
2262
2263 .everest-forms-field-options {
2264 display: none;
2265
2266 .everest-forms-border-container {
2267 .everest-forms-field-option-row {
2268 &.everest-forms-field-option-row-date_format {
2269 > .inline {
2270 margin-left: 0;
2271 margin-right: 10px;
2272
2273 &:last-child {
2274 margin-right: 0;
2275 }
2276 }
2277 }
2278
2279 &:last-child {
2280 margin-bottom: 15px;
2281 }
2282 }
2283 }
2284
2285 .everest-forms-field-option-row {
2286 position: relative;
2287 margin-bottom: 15px;
2288
2289 &:last-child {
2290 margin-bottom: 0;
2291 }
2292
2293 .inline {
2294 margin-bottom: 0;
2295 display: inline-block;
2296 vertical-align: top;
2297 margin-left: 5px;
2298 }
2299
2300 .everest-forms-current-date-format,
2301 .everest-forms-past-date-disable-format,
2302 .everest-forms-min-max-date-format,
2303 .everest-forms-slot-booking {
2304 margin-bottom: 14px;
2305 }
2306
2307 &.everest-forms-field-option-row-limit_controls,
2308 &.everest-forms-field-option-row-min_length_controls {
2309 display: flex;
2310 align-items: center;
2311
2312 input[type='number']='number'] {
2313 width: 30%;
2314 margin-right: 8px;
2315 }
2316
2317 select {
2318 min-height: 30px;
2319 }
2320
2321 &.everest-forms-hidden {
2322 display: none;
2323 }
2324 }
2325 }
2326
2327 .everest-forms-field-option {
2328 display: none;
2329
2330 // Email/Password Confirmation.
2331 &.everest-forms-confirm-disabled,
2332 &.everest-forms-field-option-email:not(.everest-forms-confirm-enabled),
2333 &.everest-forms-field-option-password:not(.everest-forms-confirm-enabled) {
2334 .everest-forms-field-option-row-sublabel_hide,
2335 .everest-forms-field-option-row-confirmation_placeholder {
2336 display: none;
2337 }
2338 }
2339 }
2340
2341 .everest-forms-field-option-phone {
2342 .format-selected-smart {
2343 display: none;
2344 }
2345
2346 .format-selected-default {
2347 .everest-forms-field-option-row {
2348 margin-bottom: 15px;
2349 }
2350 }
2351 }
2352
2353 .everest-forms-field-option-group {
2354 &.everest-forms-field-option-group-basic {
2355 .everest-forms-field-option-group-toggle {
2356 padding-top: 0;
2357 }
2358 }
2359
2360 &:last-child {
2361 .everest-forms-field-option-group-inner {
2362 border-bottom: none;
2363 }
2364 }
2365 }
2366
2367 .everest-forms-field-option-group-toggle {
2368 background-color: $color_gray-light-skin;
2369 border-bottom: 1px solid $color_gray-lighten;
2370 padding: 15px 0;
2371 font-size: 14px;
2372 font-weight: 600;
2373 display: block;
2374 color: $color_gray-dark;
2375 }
2376
2377 .everest-forms-field-option-group-inner {
2378 padding: 15px 0;
2379 border-bottom: 1px solid $color_gray-lighten;
2380 }
2381 }
2382
2383 .evf-panel-tab {
2384 display: flex;
2385 align-items: center;
2386 justify-content: space-between;
2387 padding: 15px 20px;
2388 font-size: 14px;
2389 font-weight: 600;
2390 color: $color_gray-dark;
2391 background-color: adjust-color($color_gray-more-lighten, $saturation: -1, $lightness: +2);
2392 border-bottom: 1px solid $color_gray-lighten;
2393
2394 .everest-forms-toggle-arrow {
2395 font-size: 14px;
2396 margin-left: auto;
2397 line-height: 1.4;
2398 }
2399
2400 &.active {
2401 position: relative;
2402 color: $everestforms;
2403 background-color: $color-white;
2404 }
2405 }
2406
2407 .everest-forms-active-connections,
2408 .everest-forms-active-email,.everest-forms-active-sms-notifications {
2409 display: none;
2410 padding: 0 20px;
2411 margin-top: -2px;
2412 background: $color-white;
2413 position: relative;
2414 border-bottom: 1px solid $color_gray-lighten;
2415
2416 &.active {
2417 display: flex;
2418 align-items: flex-end;
2419 flex-direction: column-reverse;
2420
2421 &.everest-forms-hidden {
2422 display: none;
2423 }
2424 }
2425
2426 .everest-forms-connections-add,
2427 .everest-forms-email-add {
2428 margin-bottom: 20px;
2429 }
2430
2431 .everest-forms-active-connections-list,
2432 .everest-forms-active-email-connections-list,
2433 .everest-forms-active-sms-notifications-connections-list {
2434 width: 100%;
2435 padding: 20px;
2436 display: flex;
2437 flex-wrap: wrap;
2438 margin: 0 0 20px;
2439 border-radius: 4px;
2440 border: 1px solid $color_gray-lighten;
2441
2442 &.empty-list {
2443 display: none;
2444 }
2445
2446 h4 {
2447 margin-top: 0;
2448 }
2449
2450 li {
2451 width: 100%;
2452 display: flex;
2453 padding: 10px;
2454 cursor: pointer;
2455 margin-bottom: -1px;
2456 align-items: center;
2457 justify-content: space-between;
2458 transition: all 0.25s ease 0s;
2459 border: 1px solid $color_gray-lighten;
2460
2461 &.active-user {
2462 background: $color-white;
2463
2464 .user-nickname {
2465 color: $everestforms;
2466 transition: all 0.25s ease 0s;
2467 }
2468 }
2469
2470 &:hover {
2471 .user-nickname {
2472 color: $everestforms;
2473 }
2474 }
2475
2476 .user-nickname {
2477 color: $color_gray-base;
2478 font-weight: 600;
2479 }
2480
2481 .toggle-remove {
2482 color: $color_gray-base;
2483 cursor: pointer;
2484 position: relative;
2485 padding-left: 13px;
2486 transition: all 0.25s ease 0s;
2487
2488 &:hover {
2489 color: $red;
2490
2491 &::before,
2492 &::after {
2493 background: $red;
2494 }
2495 }
2496
2497 &::before,
2498 &::after {
2499 top: 50%;
2500 left: 3px;
2501 width: 2px;
2502 content: '';
2503 height: 10px;
2504 position: absolute;
2505 background: $color_gray-base;
2506 display: inline-block;
2507 transition: all 0.25s ease 0s;
2508 }
2509
2510 &::before {
2511 transform: translateY(-50%)
2512 rotate(45deg);
2513 }
2514
2515 &::after {
2516 transform: translateY(-50%)
2517 rotate(-45deg);
2518 }
2519 }
2520 }
2521 }
2522 }
2523 }
2524
2525 .everest-forms-field-option-date-time {
2526 .format-selected-date .everest-forms-time,
2527 .format-selected-time .everest-forms-date {
2528 display: none;
2529 }
2530 }
2531
2532 .everest-forms-field-captcha {
2533 .format-selected-math {
2534 font-size: 16px;
2535
2536 input {
2537 width: 70px;
2538 display: inline-block;
2539 }
2540 }
2541
2542 .format-selected-math .everest-forms-question,
2543 .format-selected-question .everest-forms-equation {
2544 display: none;
2545 }
2546 }
2547
2548 .everest-forms-field-option-address {
2549 .default,
2550 .placeholder {
2551 width: 44%;
2552 float: left;
2553 margin-right: 2%;
2554
2555 input {
2556 width: 99%;
2557 }
2558
2559 label {
2560 font-weight: 400;
2561 }
2562 }
2563
2564 .hide {
2565 input {
2566 margin: 7px 0 0 0;
2567 }
2568 }
2569 }
2570 }
2571
2572 .everest-forms-panel-content-wrap {
2573 .evf-admin-row {
2574 display: flex;
2575 position: relative;
2576 margin-bottom: 15px;
2577 background-color: transparent;
2578 border: 1px solid transparent;
2579 transition: 0.5s border, 0.5s background-color;
2580
2581 &:last-child {
2582 margin-bottom: 0;
2583 }
2584
2585 .evf-toggle-row {
2586 top: 0;
2587 right: 0;
2588 opacity: 0;
2589 display: flex;
2590 cursor: pointer;
2591 position: absolute;
2592 visibility: hidden;
2593 color: $color-white;
2594 transition: 0.7s all;
2595 z-index: 9999;
2596
2597 .evf-show-grid {
2598 &:hover {
2599 span {
2600 &.dashicons {
2601 background-color: $green;
2602 }
2603 }
2604 }
2605 }
2606
2607 .evf-delete-row {
2608 span {
2609 &.dashicons {
2610 border-right: 1px solid
2611 transparentize($color-white, 0.8);
2612 }
2613 }
2614
2615 &:hover {
2616 span {
2617 &.dashicons {
2618 background-color: $red;
2619 }
2620 }
2621 }
2622 }
2623
2624 .evf-duplicate-row {
2625 span {
2626 &.dashicons {
2627 border-radius: 0 0 0 3px;
2628 border-right: 1px solid
2629 transparentize($color-white, 0.8);
2630 }
2631 }
2632
2633 &:hover {
2634 span {
2635 &.dashicons {
2636 background-color: $blue;
2637 }
2638 }
2639 }
2640 }
2641
2642 span {
2643 &.dashicons {
2644 background: $color_gray-base;
2645 font-size: 14px;
2646 height: auto;
2647 width: auto;
2648 color: $color-white;
2649 padding: 5px;
2650 }
2651 }
2652
2653 .evf-toggle-row-content {
2654 display: none;
2655 position: absolute;
2656 width: 160px;
2657 padding: 20px;
2658 text-align: center;
2659 right: -10px;
2660 border-radius: 5px;
2661 background-color: $color-white;
2662 font-weight: 600;
2663 font-size: 12px;
2664 top: 35px;
2665 transition: 0.9s background-color;
2666 border: 1px solid $color-gray-lighten;
2667 box-shadow: 1px 2px 10px 0
2668 transparentize($color_gray-dark, 0.85);
2669
2670 &::before,
2671 &::after {
2672 content: '';
2673 position: absolute;
2674 }
2675
2676 &::before {
2677 top: -7px;
2678 right: 14px;
2679 border-right: 7px solid transparent;
2680 border-bottom: 7px solid $color-white;
2681 border-left: 7px solid transparent;
2682 }
2683
2684 &::after {
2685 top: -8px;
2686 right: 12px;
2687 border-right: 9px solid transparent;
2688 border-bottom: 9px solid $color-gray-lighten;
2689 border-left: 9px solid transparent;
2690 z-index: -1;
2691 }
2692
2693 > span {
2694 color: $color_gray-base;
2695 display: block;
2696 }
2697
2698 small {
2699 color: $color_gray-light;
2700 margin-bottom: 10px;
2701 display: block;
2702 }
2703
2704 .evf-grid-selector {
2705 margin: 3px;
2706 width: 40px;
2707 height: 30px;
2708 display: inline-block;
2709 border: 1px solid $color_gray-lighten;
2710
2711 span {
2712 height: 100%;
2713 display: inline-block;
2714 background: $color-white;
2715
2716 &:nth-child(n + 1) {
2717 border-left: 1px solid
2718 $color_gray-lighten;
2719 }
2720 &:nth-child(1) {
2721 border-left: 0 none;
2722 }
2723 }
2724
2725 &.active {
2726 border-color: $blue;
2727
2728 span {
2729 border-color: $blue;
2730 }
2731 }
2732 }
2733 }
2734 }
2735
2736 &.evf-hover {
2737 background-color: lighten($blue, 48%);
2738 border: 1px dashed $blue;
2739
2740 .evf-admin-grid {
2741 border: 1px dashed $color-gray-light;
2742 }
2743
2744 .evf-toggle-row {
2745 opacity: 1;
2746 visibility: visible;
2747 }
2748 }
2749
2750 .evf-admin-grid {
2751 margin: 10px;
2752 padding: 10px;
2753 cursor: pointer;
2754 background: $color-white;
2755 position: relative;
2756 border: 1px solid transparent;
2757 transition: 0.5s border, 0.5s background-color;
2758
2759 &.evf-hover {
2760 &.evf-item-hover {
2761 position: relative;
2762
2763 .everest-forms-field,
2764 .evf-registered-item {
2765 &:nth-last-child(2) {
2766 margin-bottom: 0;
2767
2768 &.active {
2769 margin-bottom: 10px;
2770 }
2771 }
2772 }
2773
2774 &::before {
2775 display: none;
2776 }
2777 }
2778 }
2779
2780 &.evf-grid-1 {
2781 width: 100%;
2782 }
2783
2784 &.evf-grid-2 {
2785 width: 50%;
2786 }
2787
2788 &.evf-grid-3 {
2789 width: 33%;
2790 }
2791
2792 &.evf-grid-4 {
2793 width: 25%;
2794 }
2795
2796 .evf-registered-item {
2797 padding: 20px;
2798 font-size: 18px;
2799 min-height: 94px;
2800 margin-bottom: 10px;
2801
2802 &:last-child {
2803 margin-bottom: 0;
2804 }
2805
2806 &.ui-draggable {
2807 width: 100%;
2808
2809 .evf-icon {
2810 display: inline-block;
2811 }
2812 }
2813
2814 .evf-icon {
2815 font-size: 24px;
2816 vertical-align: middle;
2817 }
2818
2819 .spinner {
2820 float: none;
2821 width: 25px;
2822 height: 25px;
2823 margin: 10px 0 5px 10px;
2824 }
2825
2826 .dashicons {
2827 font-size: 22px;
2828 margin-top: 3px;
2829 }
2830 }
2831
2832 .ui-sortable-placeholder {
2833 width: 100%;
2834 visibility: visible !important;
2835 background-color: lighten($green, 42%);
2836 border: 1px dashed lighten($green, 15%);
2837 }
2838
2839 &.evf-empty-grid {
2840 display: flex;
2841 align-items: center;
2842 justify-content: center;
2843 position: relative;
2844 border: 1px dashed $color-gray-light;
2845
2846 &::before {
2847 content: '\f132';
2848 font-size: 40px;
2849 font-family: dashicons;
2850 line-height: 1.2;
2851 cursor: all-scroll;
2852 color: $color_gray-lighten;
2853 }
2854 }
2855 }
2856 }
2857
2858 .everest-forms-field-payment-single {
2859 .widefat,
2860 .item-price-hidden {
2861 display: none;
2862 }
2863 .item-price-hidden {
2864 margin: 0;
2865 color: #999;
2866 font-size: 12px;
2867 }
2868
2869 .format-selected-user {
2870 .widefat {
2871 display: block;
2872 }
2873 .item-price {
2874 display: none;
2875 }
2876 }
2877
2878 .format-selected-hidden {
2879 .item-price-hidden {
2880 display: block;
2881 }
2882 }
2883 }
2884
2885 .everest-forms-field {
2886 cursor: move;
2887 padding: 15px;
2888 position: relative;
2889 margin-bottom: 10px;
2890 border: 1px solid transparent;
2891 border-radius: 3px;
2892 transition: 0.5s box-shadow;
2893
2894 .everest-forms-image-choices {
2895 .everest-forms-image-choices-item {
2896 label {
2897 font-weight: normal;
2898 margin-bottom: 0;
2899 }
2900
2901 .everest-forms-image-choices-image {
2902 display: block;
2903 margin-bottom: 10px;
2904
2905 img {
2906 max-width: 100%;
2907 display: block;
2908 }
2909 }
2910 }
2911 }
2912
2913 // column layout for choice fields
2914 &.everest-forms-list-2-columns,
2915 &.everest-forms-list-3-columns {
2916 ul {
2917 display: flex;
2918 flex-wrap: wrap;
2919 margin-left: -15px;
2920 margin-right: -15px;
2921
2922 li {
2923 padding-left: 15px;
2924 padding-right: 15px;
2925 }
2926 }
2927 }
2928
2929 &.everest-forms-list-2-columns {
2930 li {
2931 flex: 0 0 50%;
2932 max-width: 50%;
2933
2934 &:nth-child(1n + 3) {
2935 margin-top: 10px;
2936 }
2937 }
2938 }
2939
2940 &.everest-forms-list-3-columns {
2941 li {
2942 flex: 0 0 33.333%;
2943 max-width: 33.333%;
2944
2945 &:nth-child(1n + 4) {
2946 margin-top: 10px;
2947 }
2948 }
2949 }
2950
2951 &.everest-forms-list-inline {
2952 ul {
2953 li {
2954 display: inline-block;
2955 margin-right: 15px;
2956 }
2957 }
2958 }
2959
2960 &:last-child {
2961 margin-bottom: 0;
2962 }
2963
2964 &.everest-forms-field--first,
2965 &.everest-forms-field--last {
2966 width: 48.5%;
2967 margin-right: 3%;
2968 float: left;
2969 }
2970
2971 &.everest-forms-field--last {
2972 margin-right: 0;
2973 float: right;
2974 }
2975
2976 &.active {
2977 margin: 0 0 10px;
2978 border: 1px solid $color_gray-lighten;
2979 background: $color_gray-light-skin;
2980
2981 .evf-field-action {
2982 opacity: 1;
2983 visibility: visible;
2984 }
2985
2986 &:last-child {
2987 margin-bottom: 0;
2988 }
2989 }
2990
2991 &.required label {
2992 .required {
2993 font-weight: 300;
2994 margin: 0 0 0 5px;
2995 display: inline-block;
2996 vertical-align: middle;
2997 }
2998 }
2999
3000 &.ui-sortable-placeholder {
3001 border: 1px dashed transparentize($blue, 0.75);
3002 }
3003
3004 &.label_hide {
3005 input[type='text']='text'] {
3006 margin-bottom: 0;
3007 }
3008
3009 .description {
3010 margin-top: 5px;
3011
3012 &:empty {
3013 margin-top: 0;
3014 }
3015 }
3016 }
3017
3018 input {
3019 &[type='text']='text'],
3020 &[type='email']='email'] {
3021 margin-bottom: 5px;
3022 }
3023
3024 &[type='checkbox']='checkbox'],
3025 &[type='radio']='radio'] {
3026 margin-right: 10px;
3027 }
3028 }
3029
3030 select,
3031 textarea {
3032 margin-bottom: 5px;
3033 }
3034
3035 select {
3036 option {
3037 color: inherit;
3038
3039 &.placeholder {
3040 opacity: 0.5;
3041 }
3042 }
3043
3044 &[multiple]] {
3045 padding: 6px 8px;
3046 box-shadow: none;
3047 }
3048 }
3049
3050 canvas {
3051 border: 1px solid rgba(222, 222, 222, 0.75);
3052 }
3053
3054 &.everest-forms-field-select {
3055 select:not([multiple]) {
3056 height: 35px;
3057 }
3058 }
3059
3060 .select2-container {
3061 margin-bottom: 5px;
3062 width: 100% !important;
3063
3064 span.selection {
3065 width: 100% !important;
3066 }
3067
3068 .select2-selection--multiple {
3069 border-color: $color_gray-lighten;
3070 }
3071
3072 .select2-selection__choice {
3073 margin: 4px 4px 0 0;
3074 }
3075
3076 .select2-search__field {
3077 min-height: 24px;
3078 line-height: 1.4;
3079 }
3080 }
3081
3082 .evf-field-action {
3083 position: absolute;
3084 top: 15px;
3085 right: 15px;
3086 visibility: hidden;
3087 opacity: 0;
3088 transition: 0.5s all;
3089
3090 a {
3091 padding: 5px;
3092 color: $color-white;
3093 background: $color_gray-base;
3094 border-right: 1px solid
3095 transparentize($color-white, 0.8);
3096
3097 &:first-child {
3098 border-radius: 3px 0 0 3px;
3099 }
3100
3101 &:last-child {
3102 border-radius: 0 3px 3px 0;
3103 border-right: none;
3104 }
3105
3106 &.everest-forms-field-delete:hover {
3107 background-color: $red;
3108 }
3109
3110 &:hover {
3111 background-color: $blue;
3112 }
3113 }
3114
3115 .dashicons {
3116 font-size: 15px;
3117 height: auto;
3118 width: auto;
3119 }
3120 }
3121
3122 &.label_hide {
3123 .label-title {
3124 display: none;
3125 }
3126 }
3127
3128 &.sublabel_hide {
3129 .everest-forms-sub-label {
3130 display: none;
3131 }
3132 }
3133
3134 .everest-forms-confirm-enabled {
3135 display: flex;
3136
3137 .everest-forms-confirm-primary,
3138 .everest-forms-confirm-confirmation {
3139 width: 50%;
3140 flex-wrap: wrap;
3141 }
3142
3143 .everest-forms-confirm-primary {
3144 padding-right: 15px;
3145 }
3146
3147 .everest-forms-confirm-confirmation {
3148 padding-left: 15px;
3149 }
3150 }
3151
3152 .everest-forms-confirm-disabled {
3153 .everest-forms-confirm-primary {
3154 .everest-forms-sub-label {
3155 display: none;
3156 }
3157 }
3158
3159 .everest-forms-confirm-confirmation {
3160 display: none;
3161 }
3162 }
3163
3164 &:hover {
3165 border: 1px solid $color_gray-lighten;
3166
3167 .evf-field-action {
3168 visibility: visible;
3169 opacity: 1;
3170 }
3171 }
3172
3173 &.ui-sortable-helper {
3174 padding: 20px 30px;
3175 height: auto !important;
3176 left: -20px;
3177 right: -20px;
3178 background-color: $color-white;
3179
3180 &:hover {
3181 .evf-field-action {
3182 display: none;
3183 }
3184 }
3185 }
3186
3187 label {
3188 cursor: all-scroll;
3189 }
3190 }
3191
3192 .file-uploader {
3193 width: 100%;
3194 border: 2px dashed $color_gray-lighten;
3195 background-color: $color_gray-light-skin;
3196 border-radius: 3px;
3197 cursor: pointer;
3198 text-align: center;
3199 padding-top: 30px;
3200 padding-bottom: 30px;
3201 position: relative;
3202
3203 svg {
3204 width: 30px;
3205 height: 30px;
3206 fill: #bbbcbd;
3207 margin-bottom: 20px;
3208 }
3209
3210 input {
3211 &.file-input {
3212 touch-action: manipulation;
3213 max-width: 100%;
3214 min-width: 14px;
3215 margin: 0;
3216 opacity: 0;
3217 height: 18px;
3218 }
3219 }
3220
3221 .drop {
3222 display: block;
3223 font-size: 14px;
3224 font-weight: 600;
3225 color: $color_gray-light;
3226 margin-bottom: 10px;
3227 }
3228
3229 .or {
3230 font-size: 12px;
3231 color: $color-gray-light;
3232 font-weight: 600;
3233 display: block;
3234 margin-bottom: 10px;
3235 }
3236
3237 .file-control {
3238 position: absolute;
3239 bottom: 30px;
3240 color: $blue;
3241 padding-bottom: 2px;
3242 display: block;
3243 left: 0;
3244 right: 0;
3245
3246 &::before {
3247 content: '';
3248 width: 45px;
3249 background-color: $blue;
3250 height: 1px;
3251 display: block;
3252 left: 50%;
3253 bottom: -2px;
3254 position: absolute;
3255 transform: translateX(-50%);
3256 }
3257 }
3258 }
3259
3260 .publishing-action {
3261 width: 100%;
3262 text-align: right;
3263 }
3264
3265 .submit-button {
3266 display: inline-block;
3267 font-size: 12px;
3268 font-weight: 600;
3269 color: $color-white;
3270 padding: 15px 20px;
3271 border: 0 none;
3272 background-color: $green;
3273 border-radius: 3px;
3274 }
3275 }
3276
3277 label {
3278 font-size: 13px;
3279 margin-bottom: 10px;
3280 color: $color_gray-base;
3281 display: block;
3282 font-weight: 600;
3283
3284 i {
3285 color: $color_gray-light;
3286 font-size: 16px;
3287 line-height: 1.2;
3288 }
3289
3290 .required {
3291 color: $red;
3292 display: none;
3293 }
3294
3295 input {
3296 &[type='checkbox']='checkbox'],
3297 &[type='radio']='radio'] {
3298 margin-right: 10px;
3299 }
3300 }
3301
3302 &.evf-toggle-switch {
3303 margin-bottom: 0;
3304 }
3305
3306 &.evf-toggle-label {
3307 display: inline-block;
3308 margin-bottom: 0;
3309 }
3310
3311 &.everest-forms-hidden {
3312 display: none;
3313 }
3314
3315 &.evf-privacy-policy-consent-message {
3316 display: initial;
3317 margin-bottom: 0;
3318 }
3319 }
3320
3321 .everest-forms-label-edit {
3322 margin-bottom: 4px;
3323
3324 label {
3325 margin-bottom: 4px;
3326 padding: 4px 0;
3327 flex: 1;
3328 }
3329
3330 input {
3331 font-size: 13px;
3332 font-weight: 600;
3333 }
3334
3335 .dashicons {
3336 margin-right: 7px;
3337 }
3338 }
3339
3340 input:not(.ed_button),
3341 textarea:not(.wp-editor-area) {
3342 color: $color_gray-base;
3343
3344 &::placeholder {
3345 color: $color_gray-light;
3346 }
3347 }
3348
3349 textarea,
3350 textarea:not(.wp-editor-area) {
3351 height: 120px;
3352
3353 &.short {
3354 height: 60px;
3355 }
3356 }
3357
3358 .description {
3359 color: $color_gray-normal;
3360 }
3361
3362 .everest-forms-checklist {
3363 ul {
3364 label {
3365 margin-top: 0;
3366 margin-bottom: 0;
3367 font-weight: normal;
3368 }
3369 }
3370 }
3371
3372 .everest-forms-question {
3373 margin-top: 0;
3374 line-height: 1.2;
3375 }
3376
3377 .evf-grid-lists {
3378 margin-left: -1.5%;
3379 margin-right: 1.5%;
3380 background-color: $color_gray-light-skin;
3381 display: flex;
3382
3383 .evf-grid-lists-item {
3384 padding-left: 1.5%;
3385 padding-right: 1.5%;
3386 background-color: $color-white;
3387 }
3388 }
3389
3390 .evf-content-section-title {
3391 font-size: 24px;
3392 font-weight: 600;
3393 line-height: 1.5;
3394 margin-bottom: 20px;
3395 padding-bottom: 20px;
3396 display: flex;
3397 align-items: center;
3398 color: $color_gray-dark;
3399 border-bottom: 1px solid $color_gray-lighten;
3400
3401 .evf-title {
3402 margin-right: 20px;
3403 }
3404
3405 .evf-toggle-section {
3406 margin-top: 2px;
3407 }
3408 }
3409
3410 .everest-forms-panel-field {
3411 position: relative;
3412 margin-bottom: 20px;
3413
3414 .wp-editor-container {
3415 margin-bottom: 10px;
3416 }
3417
3418 .desc {
3419 margin: 10px 0;
3420 font-style: italic;
3421 line-height: 1.2;
3422 }
3423
3424 .evf-hidden-content {
3425 margin-top: 10px;
3426 }
3427
3428 .max-entry-section {
3429 .max-entry-section-content {
3430 display: flex;
3431
3432 .everest-forms-panel-field {
3433 margin-bottom: 0;
3434 }
3435
3436 .entry-period {
3437 flex: 1;
3438 margin-left: 10px;
3439 }
3440 }
3441 }
3442
3443 &.everest-forms-panel-field-tinymce {
3444 .evf-toggle-smart-tag-display {
3445 top: 34px;
3446 right: 5px;
3447 border: 1px solid $color_gray-lighten;
3448 }
3449
3450 .evf-smart-tag-lists {
3451 top: 70px;
3452 }
3453 }
3454
3455 &.evf_conditional_logic_container {
3456 label {
3457 margin-bottom: 0;
3458 display: inline-block;
3459 }
3460 }
3461 }
3462
3463 .evf-choices-list {
3464 background: $color_gray-more-lighten;
3465 border-radius: 4px;
3466 padding: 1px 8px;
3467
3468 .sort {
3469 cursor: grab;
3470 display: flex;
3471 margin-top: 6px;
3472 padding-right: 6px;
3473 color: $color_gray-light;
3474
3475 svg {
3476 fill: currentColor;
3477 transform: rotate(90deg);
3478 }
3479
3480 &:active {
3481 cursor: grabbing;
3482 }
3483 }
3484
3485 li {
3486 background: $color-white;
3487 border: 1px solid $color_gray-lighten;
3488 display: flex;
3489 flex-wrap: wrap;
3490 padding: 8px;
3491 margin: 8px 0;
3492 z-index: 99999 !important;
3493
3494 .evf-choice-list-input {
3495 flex: 1;
3496 margin-right: 6px;
3497 }
3498
3499 input {
3500 &[type='text']='text'] {
3501 width: 100%;
3502 }
3503
3504 &[type='radio']='radio'],
3505 &[type='checkbox']='checkbox'] {
3506 margin: 7px 6px 0 0;
3507 }
3508
3509 &.value {
3510 display: none;
3511 margin-top: 8px;
3512
3513 &.evf-money-input {
3514 width: 22%;
3515 display: inline-block;
3516 margin: 0 0 0 auto;
3517 flex: 0 0 22%;
3518 }
3519 }
3520 }
3521
3522 .everest-forms-attachment-media-view {
3523 flex: 100%;
3524 display: none;
3525 margin-top: 8px;
3526
3527 .button-add-media {
3528 width: 100%;
3529 padding: 8px;
3530 outline: none;
3531 cursor: pointer;
3532 border-radius: 3px;
3533 color: $color_gray-base;
3534 border: 1px dashed $color-gray-lighten;
3535 }
3536
3537 .thumbnail-image {
3538 display: block;
3539 max-height: 200px;
3540 margin-bottom: 3px;
3541 border-radius: 4px;
3542 position: relative;
3543 overflow: hidden;
3544
3545 img {
3546 display: block;
3547 max-width: 100%;
3548 user-select: none;
3549 border-radius: 4px;
3550 }
3551 }
3552
3553 .actions {
3554 margin-top: 8px;
3555 }
3556 }
3557
3558 &.ui-sortable-placeholder {
3559 visibility: visible !important; // Overwrite CSS over JS.
3560 background: $color_gray-more-lighten;
3561 border: 1px dashed $color_gray-lighten;
3562 }
3563
3564 &.ui-sortable-helper {
3565 z-index: 99999 !important; // Overwrite CSS over JS.
3566 }
3567 }
3568
3569 .add,
3570 .remove {
3571 display: inline-flex;
3572 align-items: center;
3573 justify-content: center;
3574 width: 20px;
3575 height: 20px;
3576 margin-top: 5px;
3577 border: none;
3578
3579 .dashicons {
3580 width: 16px;
3581 height: 16px;
3582 font-size: 16px;
3583 }
3584 }
3585
3586 .add {
3587 &:hover {
3588 color: $blue;
3589 background: none;
3590 }
3591 }
3592
3593 .remove {
3594 margin-left: 0;
3595
3596 &:hover {
3597 color: $red;
3598 background: none;
3599 }
3600 }
3601
3602 &.show-images {
3603 li {
3604 .everest-forms-attachment-media-view {
3605 display: block;
3606 }
3607 }
3608 }
3609
3610 &.show-values {
3611 li {
3612 input[type='text']='text'].value {
3613 display: block;
3614 }
3615 }
3616 }
3617 }
3618
3619 .everest-forms-field-option-row-choices_images {
3620 .notice {
3621 display: inline-block;
3622 margin: 0 0 15px 0 !important;
3623
3624 &.hidden {
3625 display: none;
3626 }
3627 }
3628 }
3629
3630 .everest-forms-field-option-row-rows,
3631 .everest-forms-field-option-row-columns,
3632 .everest-forms-field-option-row-drop_down_choices,
3633 .everest-forms-field-option-row-choices,
3634 .everest-forms-field-option-row-questions {
3635 ul {
3636 li {
3637 clear: both;
3638 padding: 5px 10px;
3639 border-radius: 4px;
3640 border: 1px solid transparent;
3641 }
3642 }
3643
3644 .evf-questions-list {
3645 li {
3646 padding: 10px;
3647 background: $color-white;
3648 margin-bottom: 10px;
3649 border: 1px solid $color_gray-lighten;
3650
3651 input[type='text']='text'] {
3652 width: calc(100% - 39px);
3653 }
3654
3655 .answer-wrap {
3656 margin-top: 6px;
3657 }
3658 }
3659 }
3660
3661 .question-wrap,
3662 .answer-wrap {
3663 input {
3664 margin-right: 8px;
3665 vertical-align: middle;
3666 }
3667
3668 .add,
3669 .remove {
3670 width: 30px;
3671 height: 30px;
3672 display: inline-flex;
3673 vertical-align: middle;
3674 border-radius: 3px;
3675 border: 1px solid $color_gray-lighten;
3676 }
3677
3678 .add {
3679 &:hover {
3680 background: $blue;
3681 border-color: $blue;
3682 }
3683 }
3684
3685 .remove {
3686 &:hover {
3687 background: $red;
3688 border-color: $red;
3689 }
3690 }
3691 }
3692 }
3693
3694 .everest-forms-field-option-payment-multiple,
3695 .everest-forms-field-option-payment-checkbox {
3696 .everest-forms-field-option-row {
3697 li {
3698 input[type='text']='text'] {
3699 width: 73%;
3700 margin-right: 8px;
3701
3702 &.evf-money-input {
3703 width: 23%;
3704 display: inline-block;
3705 margin: 0 0 0 auto;
3706 flex: 0 0 23%;
3707 }
3708 }
3709 }
3710 }
3711 }
3712
3713 .evf-content-email-settings-inner{
3714 display: none;
3715 -webkit-animation: fadeIn 0.5s;
3716 animation: fadeIn 0.5s;
3717 margin: 20px 0;
3718 border-radius: 4px;
3719
3720 &.active-connection {
3721 display: block;
3722
3723 &.everest-forms-hidden {
3724 display: none;
3725 }
3726 }
3727 }
3728
3729 .evf-content-sms-notifications-settings-inner{
3730 display: none;
3731 -webkit-animation: fadeIn 0.5s;
3732 animation: fadeIn 0.5s;
3733 margin: 20px 0;
3734 border-radius: 4px;
3735
3736 &.active-connection {
3737 display: block;
3738
3739 &.everest-forms-hidden {
3740 display: none;
3741 }
3742 }
3743 }
3744
3745 }
3746
3747 .evf-registered-item {
3748 z-index: 999;
3749 cursor: pointer;
3750 border-radius: 2px;
3751 font-size: 12px;
3752 text-align: center;
3753 margin: 0;
3754 background-color: $color-white;
3755 border: 1px solid $color_gray-lighten;
3756 color: $color_gray-normal;
3757
3758 .evf-icon {
3759 color: inherit;
3760 display: block;
3761 font-size: 32px;
3762 text-align: center;
3763 margin-bottom: 5px;
3764 }
3765
3766 &.ui-draggable-dragging {
3767 width: calc(100% - 20px) !important;
3768 text-align: center !important;
3769 font-size: 12px !important;
3770 }
3771
3772 &.ui-sortable-placeholder {
3773 width: 100% !important;
3774 }
3775 }
3776
3777 .everest-forms-field.ui-draggable-dragging {
3778 margin: 0;
3779 width: 105px !important;
3780 background-color: $color-white;
3781 text-align: center;
3782 font-size: 12px !important;
3783
3784 .evf-icon {
3785 color: inherit;
3786 display: block !important;
3787 font-size: 32px !important;
3788 }
3789 }
3790
3791 .everest-forms-border-container {
3792 margin-top: 5px;
3793 margin-bottom: 20px;
3794 padding: 0 20px;
3795 border-radius: 4px;
3796 border: 1px solid $color_gray-lighten;
3797
3798 .everest-forms-border-container-title {
3799 padding: 0 10px;
3800 margin: 0 0 0 -10px;
3801 background: $color_gray-light-skin;
3802 display: inline-block;
3803 transform: translateY(-50%);
3804 }
3805
3806 label {
3807 margin-bottom: 10px;
3808 margin-top: 2px;
3809
3810 .everest-forms-help-tooltip {
3811 height: 16px;
3812 width: 16px;
3813 line-height: 1;
3814 vertical-align: middle;
3815 }
3816 }
3817
3818 select {
3819 // margin-bottom: 14px;
3820 }
3821
3822 .inline {
3823 margin-top: 0;
3824 }
3825
3826 .input-group-col-2 {
3827 margin-bottom: 15px;
3828
3829 input[type='text']='text'],
3830 input[type='number']='number'],
3831 select {
3832 margin-bottom: 0;
3833 margin-left: 0;
3834 }
3835 }
3836 }
3837
3838 .everest-forms-tab-content {
3839 position: relative;
3840 // height: calc(100vh - 200px);
3841
3842 .everest-forms-add-fields-group {
3843 margin-bottom: 5px;
3844 }
3845
3846 .everest-forms-notice {
3847 display: inline-block;
3848 }
3849 }
3850
3851 .everest-forms-panel {
3852 .panel-wrap {
3853 overflow: hidden;
3854 }
3855
3856 .wp-picker-input-wrap {
3857 label {
3858 font-weight: 400;
3859 display: inline-block;
3860 }
3861 }
3862 }
3863
3864 .everest-forms-panel-content-wrap {
3865 .everest-forms-panel-content {
3866 position: relative;
3867 padding: 15px 20px;
3868 background-color: $color-white;
3869 // height: calc(100vh - 150px);
3870 height: calc(100vh - 110px);
3871 overflow-x: hidden !important;
3872
3873 .everest-forms-border-container {
3874 .everest-forms-border-container-title {
3875 background: $color-white;
3876 }
3877 }
3878
3879 .evf-content-sms-notifications-settings {
3880 .evf-content-sms-notifications-settings-inner {
3881 padding: 20px 20px 0;
3882 border: 1px solid $color_gray-lighten;
3883
3884 .everest-forms-sms-notfications-name {
3885 background: $color_gray-light-skin;
3886 margin-left: -20px;
3887 margin-top: -20px;
3888 margin-right: -20px;
3889 padding: 20px;
3890 border-radius: 4px 4px 0 0;
3891 border-bottom: 1px solid $color_gray-lighten;
3892
3893 input[type='text']='text'] {
3894 font-weight: 600;
3895 }
3896
3897 .everest-forms-text-danger {
3898 margin: 10px 0 0;
3899 }
3900 }
3901 }
3902 }
3903
3904
3905 .evf-content-email-settings {
3906 .evf-content-email-settings-inner {
3907 padding: 20px 20px 0;
3908 border: 1px solid $color_gray-lighten;
3909
3910 .everest-forms-email-name {
3911 background: $color_gray-light-skin;
3912 margin-left: -20px;
3913 margin-top: -20px;
3914 margin-right: -20px;
3915 padding: 20px;
3916 border-radius: 4px 4px 0 0;
3917 border-bottom: 1px solid $color_gray-lighten;
3918
3919 input[type='text']='text'] {
3920 font-weight: 600;
3921 }
3922
3923 .everest-forms-text-danger {
3924 margin: 10px 0 0;
3925 }
3926 }
3927 }
3928 }
3929
3930 .evf-content-post-submissions-settings,
3931 .evf-content-user-registration-settings {
3932 .everest-forms-panel-field {
3933 max-width: 500px;
3934 }
3935 }
3936
3937 .everest-forms-title-desc {
3938 display: inline-flex;
3939 align-items: center;
3940 flex-direction: row-reverse;
3941 position: relative;
3942 margin-bottom: 10px;
3943
3944 .evf-icon {
3945 display: flex;
3946 align-items: center;
3947 justify-content: center;
3948 width: 32px;
3949 height: 32px;
3950 cursor: pointer;
3951 border-radius: 3px;
3952 color: $color_gray-normal;
3953 background: $color_gray-more-lighten;
3954
3955 &::after {
3956 content: '';
3957 border-radius: 3px;
3958 position: absolute;
3959 left: 32px;
3960 right: calc(100% - 36px);
3961 height: 30px;
3962 border-radius: 0 3px 3px 0;
3963 transition: all 0.3s ease 0s;
3964 }
3965 }
3966
3967 .everest-forms-name-input {
3968 font-size: 1.3em;
3969 font-weight: 600;
3970 height: 32px;
3971 border: none;
3972 margin: 0;
3973 box-shadow: none;
3974 pointer-events: none;
3975 background: none;
3976 z-index: 1;
3977
3978 &.everst-forms-name-editing {
3979 pointer-events: all;
3980
3981 & + .evf-icon {
3982 background: $everestforms;
3983 color: $color-white;
3984 border-radius: 4px 0 0 4px;
3985
3986 &::after {
3987 top: 0;
3988 right: 0;
3989 border: 1px solid $everestforms;
3990 }
3991 }
3992 }
3993
3994 &:focus {
3995 box-shadow: none;
3996 }
3997 }
3998 }
3999
4000 .evf-admin-field-wrapper {
4001 cursor: move;
4002 position: relative;
4003
4004 .evf-sortable-placeholder {
4005 background-color: transparentize($green, 0.95);
4006 border: 1px dashed transparentize($green, 0.75);
4007 }
4008 }
4009
4010 .evf-add-row {
4011 margin: 20px auto;
4012 text-align: center;
4013
4014 span {
4015 width: auto;
4016 height: auto;
4017 font-size: 13px;
4018 background: #51cf66;
4019 font-family: inherit;
4020
4021 &.dashicons {
4022 &::before {
4023 width: 20px;
4024 height: 20px;
4025 line-height: 1;
4026 font-size: 16px;
4027 margin-right: 10px;
4028 font-family: dashicons;
4029 vertical-align: middle;
4030 padding: 2px 12px 2px 0;
4031 border-right: 1px solid
4032 transparentize($color-white, 0.7);
4033 }
4034 }
4035
4036 &:hover {
4037 background: #33ba4a;
4038 }
4039 }
4040 }
4041 .evf-add-row-repeater {
4042 margin: 20px auto;
4043 text-align: left;
4044 pointer-events: none;
4045
4046 span {
4047 width: auto;
4048 height: auto;
4049 padding: 10px;
4050 font-size: 13px;
4051 background: #51cf66;
4052 color: $color-white;
4053 font-family: inherit;
4054
4055 &.dashicons {
4056 &::before {
4057 width: 20px;
4058 height: 20px;
4059 line-height: 1;
4060 font-size: 16px;
4061 margin: 0 10px 0 10px;
4062 font-family: dashicons;
4063 text-align: center;
4064 vertical-align: middle;
4065 padding: 10px;
4066 cursor: text;
4067 border-right: none;
4068 }
4069 }
4070
4071 &:hover {
4072 background: #33ba4a;
4073 }
4074 }
4075 }
4076 }
4077 }
4078
4079 .everest-forms-fields-tab {
4080 display: flex;
4081 flex-wrap: wrap;
4082
4083 a {
4084 width: 50%;
4085 display: block;
4086 padding: 15px 0;
4087 font-weight: 600;
4088 text-align: center;
4089 color: $color_gray-dark;
4090 background: $color_gray-more-lighten;
4091 border-bottom: 1px solid $color_gray-lighten;
4092
4093 &.active {
4094 background: $color_gray-light-skin;
4095 border-bottom: 1px solid transparent;
4096 }
4097
4098 &:first-child {
4099 border-right: 1px solid $color_gray-lighten;
4100 }
4101 }
4102 }
4103
4104 .everest-forms-panel-sidebar {
4105 .everest-forms-add-fields,
4106 .everest-forms-field-options {
4107 padding: 15px 20px;
4108 }
4109 }
4110 }
4111 }
4112
4113 /**
4114 * Settings styling.
4115 **/
4116 .everest-forms {
4117 h2.evf-nav-tab-wrapper {
4118 margin-bottom: 1em;
4119 }
4120
4121 nav.evf-nav-tab-wrapper {
4122 margin: 1.5em 0 1em;
4123 }
4124
4125 .subsubsub {
4126 margin: -8px 0 0;
4127 }
4128
4129 .evf-admin-breadcrumb {
4130 margin-left: 0.5em;
4131 a {
4132 color: #a46497;
4133 }
4134 }
4135
4136 #template div {
4137 margin: 0;
4138
4139 p .button {
4140 float: right;
4141 margin-left: 10px;
4142 margin-top: -4px;
4143 }
4144
4145 .editor textarea {
4146 margin-bottom: 8px;
4147 }
4148 }
4149
4150 textarea[disabled='disabled']='disabled'] {
4151 background: #dfdfdf !important;
4152 }
4153
4154 table.form-table {
4155 margin: 0;
4156 position: relative;
4157 table-layout: fixed;
4158
4159 .forminp-radio {
4160 ul {
4161 margin: 0;
4162
4163 li {
4164 line-height: 1.4em;
4165 }
4166
4167 &.everest-forms-recaptcha-type {
4168 display: flex;
4169
4170 li {
4171 margin-right: 15px;
4172 margin-bottom: 0;
4173
4174 label {
4175 margin-bottom: 0 !important;
4176 margin-top: 5px !important;
4177 }
4178 }
4179 }
4180 }
4181 }
4182
4183 input[type='text']='text'],
4184 input[type='number']='number'],
4185 input[type='email']='email'] {
4186 height: auto;
4187 }
4188
4189 textarea.input-text {
4190 height: 100%;
4191 min-width: 150px;
4192 display: block;
4193 }
4194
4195 // Give regular settings inputs a standard width and padding.
4196 textarea,
4197 input[type='text']='text'],
4198 input[type='email']='email'],
4199 input[type='number']='number'],
4200 input[type='password']='password'],
4201 input[type='datetime']='datetime'],
4202 input[type='datetime-local']='datetime-local'],
4203 input[type='date']='date'],
4204 input[type='time']='time'],
4205 input[type='week']='week'],
4206 input[type='url']='url'],
4207 input[type='tel']='tel'],
4208 input.regular-input {
4209 margin: 0;
4210 padding: 0 8px;
4211 width: 350px;
4212 box-sizing: border-box;
4213 vertical-align: top;
4214
4215 @media only screen and (max-width: 782px) {
4216 width: 100%;
4217 }
4218 }
4219
4220 input[type='datetime-local']='datetime-local'],
4221 input[type='date']='date'],
4222 input[type='time']='time'],
4223 input[type='week']='week'],
4224 input[type='tel']='tel'] {
4225 width: 200px;
4226 }
4227
4228 select {
4229 width: 350px;
4230 margin: 0;
4231 box-sizing: border-box;
4232 height: 32px;
4233 vertical-align: top;
4234
4235 @media only screen and (max-width: 782px) {
4236 width: 100%;
4237 }
4238 }
4239
4240 input[size]] {
4241 width: auto !important;
4242 }
4243
4244 // Ignore nested inputs.
4245 table {
4246 select,
4247 textarea,
4248 input[type='text']='text'],
4249 input[type='email']='email'],
4250 input[type='number']='number'],
4251 input.regular-input {
4252 width: auto;
4253 }
4254 }
4255
4256 textarea.wide-input {
4257 width: 100%;
4258 }
4259
4260 img.help_tip,
4261 .everest-forms-help-tip {
4262 padding: 0;
4263 margin: -4px 0 0 5px;
4264 vertical-align: middle;
4265 cursor: help;
4266 line-height: 1;
4267 }
4268
4269 span.help_tip {
4270 cursor: help;
4271 color: $blue;
4272 }
4273
4274 th {
4275 width: 270px;
4276 position: relative;
4277 padding-right: 24px;
4278 }
4279
4280 th label {
4281 position: relative;
4282 display: block;
4283
4284 img.help_tip,
4285 .everest-forms-help-tip {
4286 margin: -7px -24px 0 0;
4287 position: absolute;
4288 right: 0;
4289 top: 50%;
4290
4291 @media only screen and (max-width: 782px) {
4292 right: auto;
4293 margin-left: 5px;
4294 }
4295 }
4296 }
4297
4298 th label,
4299 th.titledesc {
4300 color: $color_gray-base;
4301 }
4302
4303 th label + .everest-forms-help-tip {
4304 position: absolute;
4305 margin: 0;
4306 right: 0;
4307 top: 20px;
4308 }
4309
4310 td.everest-forms-permissions {
4311 display: flex;
4312 flex-wrap: wrap;
4313 align-items: flex-end;
4314
4315 fieldset {
4316 padding: 0 20px;
4317
4318 label {
4319 position: relative;
4320 display: block;
4321 font-weight: 600;
4322 }
4323 }
4324 }
4325
4326 .select2-container {
4327 vertical-align: top;
4328 margin-bottom: 3px;
4329 }
4330
4331 table.widefat th {
4332 padding-right: inherit;
4333 }
4334
4335 .wp-list-table .everest-forms-help-tip {
4336 float: none;
4337 }
4338
4339 fieldset {
4340 margin-top: 4px;
4341
4342 img.help_tip,
4343 .everest-forms-help-tip {
4344 margin: -3px 0 0 5px;
4345 }
4346
4347 p.description {
4348 margin-bottom: 8px;
4349 }
4350
4351 &:first-child {
4352 margin-top: 0;
4353 }
4354 }
4355
4356 .iris-picker {
4357 z-index: 100;
4358 display: none;
4359 position: absolute;
4360 border: 1px solid #ccc;
4361 border-radius: 3px;
4362 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
4363
4364 .ui-slider {
4365 border: 0 !important;
4366 margin: 0 !important;
4367 width: auto !important;
4368 height: auto !important;
4369 background: none transparent !important;
4370
4371 .ui-slider-handle {
4372 margin-bottom: 0 !important;
4373 }
4374 }
4375 }
4376
4377 .forminp-color {
4378 font-size: 0;
4379 }
4380
4381 .iris-error {
4382 background-color: #ffafaf;
4383 }
4384
4385 .colorpickpreview {
4386 padding: 0;
4387 width: 30px;
4388 height: 30px;
4389 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
4390 font-size: 16px;
4391 border-radius: 4px;
4392 margin-right: 3px;
4393
4394 @media only screen and (max-width: 782px) {
4395 float: left;
4396 width: 40px;
4397 height: 40px;
4398 }
4399 }
4400 }
4401
4402 .everest-forms-save-button {
4403 box-shadow: none;
4404 text-shadow: none;
4405 transition: 0.25s all ease-in-out;
4406 }
4407
4408 .everest-forms-integrations-connection {
4409 a {
4410 text-decoration: none;
4411 }
4412
4413 .everest-forms-integrations {
4414 border-radius: 3px;
4415 background: $color-white;
4416 border: 1px solid #ced4da;
4417 padding: 10px 20px;
4418 display: flex;
4419 flex-wrap: wrap;
4420 align-items: center;
4421 justify-content: space-between;
4422 margin-bottom: 10px;
4423
4424 .integration-header-info {
4425 display: flex;
4426 flex: 1;
4427 align-items: center;
4428
4429 .integration-status {
4430 position: relative;
4431
4432 .toggle-switch-outer {
4433 width: 20px;
4434 height: 20px;
4435 display: block;
4436 margin-right: 20px;
4437 position: relative;
4438 border-radius: 3px;
4439 border: 1px solid #ced4da;
4440
4441 &.connected {
4442 border-color: $green;
4443
4444 &::before {
4445 background-color: $green;
4446 }
4447 }
4448
4449 &::before {
4450 left: 0;
4451 top: 50%;
4452 right: 0;
4453 content: '';
4454 width: 10px;
4455 height: 10px;
4456 display: block;
4457 margin: 0 auto;
4458 border-radius: 2px;
4459 position: absolute;
4460 background-color: #ced4da;
4461 transform: translateY(-50%);
4462 }
4463 }
4464 }
4465
4466 .integration-detail {
4467 display: flex;
4468 align-items: center;
4469
4470 .logo {
4471 width: 50px;
4472 height: 50px;
4473 flex: 0 0 50px;
4474 display: flex;
4475 overflow: hidden;
4476 margin: 0 20px 0 0;
4477 border-radius: 4px;
4478 align-items: center;
4479 border: 1px solid #ced4da;
4480
4481 img {
4482 width: 100%;
4483 display: block;
4484 }
4485 }
4486
4487 .integration-info {
4488 margin-right: 20px;
4489
4490 a {
4491 display: inline-block;
4492
4493 &:hover h3 {
4494 color: $everestforms;
4495 }
4496
4497 &:focus {
4498 box-shadow: none;
4499 }
4500 }
4501
4502 h3,
4503 p {
4504 margin-top: 0;
4505 margin-bottom: 7px;
4506 }
4507 }
4508 }
4509 }
4510
4511 .integartion-action {
4512 flex-wrap: wrap;
4513 display: flex;
4514 align-items: center;
4515
4516 .toggle-button {
4517 margin-right: 20px;
4518
4519 .slide {
4520 display: block;
4521 height: 22px;
4522 cursor: pointer;
4523 width: 44px;
4524 position: relative;
4525
4526 &.inactive,
4527 &.active {
4528 border-radius: 34px;
4529
4530 &::before {
4531 border-radius: 50%;
4532 position: absolute;
4533 content: '';
4534 height: 18px;
4535 width: 18px;
4536 bottom: 2px;
4537 background-color: $color-white;
4538 -webkit-transition: 0.4s;
4539 transition: 0.4s;
4540 }
4541 }
4542
4543 &.inactive {
4544 background-color: #ced4da;
4545
4546 &::before {
4547 left: 2px;
4548 }
4549 }
4550
4551 &.active {
4552 background-color: $everestforms;
4553
4554 &::before {
4555 right: 2px;
4556 }
4557 }
4558 }
4559 }
4560
4561 .integration-setup {
4562 width: 35px;
4563 height: 35px;
4564 display: block;
4565 font-size: 16px;
4566 color: #78818a;
4567 position: relative;
4568 border-radius: 3px;
4569 border: 1px solid #ced4da;
4570 transition: all 0.25s;
4571
4572 .evf-icon-setting-cog {
4573 position: absolute;
4574 top: 50%;
4575 transform: translateY(-50%);
4576 width: 100%;
4577 text-align: center;
4578
4579 &::before {
4580 content: '\e021';
4581 }
4582 }
4583
4584 &:hover {
4585 color: $everestforms;
4586 border-color: $everestforms;
4587 }
4588 }
4589 }
4590 }
4591 }
4592
4593 .evf-connection-form {
4594 input {
4595 width: 100%;
4596 margin-right: 15px;
4597 margin-bottom: 15px;
4598
4599 @media screen and (min-width: 1200px) {
4600 width: calc(33% - 20px);
4601 }
4602 }
4603 }
4604
4605 .everest-forms-integration-content {
4606 display: flex;
4607 background-color: $color-white;
4608 border: 1px solid #ced4da;
4609
4610 .integration-addon-detail {
4611 width: 400px;
4612 padding: 20px;
4613 border-right: 1px solid #ced4da;
4614
4615 .evf-integration-info-header {
4616 display: flex;
4617 align-items: center;
4618 }
4619
4620 .evf-integration-logo {
4621 width: 60px;
4622 height: 60px;
4623 padding: 10px;
4624 display: flex;
4625 align-items: center;
4626 flex: 0 0 60px;
4627 margin: 0 20px 0 0;
4628 border-radius: 3px;
4629 border: 1px solid #ced4da;
4630
4631 img {
4632 width: 100%;
4633 }
4634 }
4635
4636 .integration-info {
4637 h3 {
4638 margin-top: 0;
4639 margin-bottom: 5px;
4640 }
4641
4642 .toggle-switch {
4643 &.connected {
4644 display: block;
4645 padding-left: 15px;
4646 position: relative;
4647
4648 &::before {
4649 left: 0;
4650 top: 50%;
4651 content: '';
4652 width: 10px;
4653 height: 10px;
4654 display: block;
4655 position: absolute;
4656 background: $green;
4657 border-radius: 50%;
4658 transform: translateY(-50%);
4659 }
4660 }
4661 }
4662 }
4663 }
4664
4665 .integration-connection-detail {
4666 padding: 20px;
4667 width: calc(100% - 400px);
4668
4669 .evf-account-connect {
4670 margin-bottom: 20px;
4671
4672 h3 {
4673 margin-top: 0;
4674 }
4675
4676 .everest-forms-btn {
4677 .evf-loading {
4678 width: 14px;
4679 height: 14px;
4680 background-size: 14px 14px;
4681 margin: 2px 0 0 5px;
4682 }
4683 }
4684 }
4685
4686 .evf-connection-list {
4687 table.evf-connection-list-table {
4688 width: 100%;
4689 border-spacing: 0;
4690 border-collapse: collapse;
4691 border: 1px solid #ced4da;
4692
4693 tr {
4694 td {
4695 padding: 10px 20px;
4696 border-bottom: 1px solid #ced4da;
4697
4698 &:last-child {
4699 text-align: right;
4700 }
4701
4702 .disconnect {
4703 color: $red;
4704 position: relative;
4705 display: inline-block;
4706 padding-left: 15px;
4707
4708 &::before {
4709 display: block;
4710 content: '';
4711 position: absolute;
4712 height: 10px;
4713 width: 10px;
4714 background: $red;
4715 top: 50%;
4716 transform: translateY(-50%);
4717 left: 0;
4718 border-radius: 50%;
4719 }
4720 }
4721 }
4722
4723 &:last-child {
4724 td {
4725 border-bottom: none;
4726 }
4727 }
4728 }
4729 }
4730 }
4731 }
4732 }
4733 }
4734
4735 /**
4736 * Import and Export
4737 */
4738 .evf-tools-export-entries,
4739 .everest-forms-import-form,
4740 .everest-forms-export-form {
4741 background: $color-white;
4742 max-width: 700px;
4743 padding: 20px;
4744 margin-top: 20px;
4745 box-shadow: 1px 3px 10px transparentize($color_gray-base, 0.95);
4746 border-radius: 4px;
4747
4748 h3 {
4749 margin: 0;
4750 font-size: 20px;
4751 padding-bottom: 16px;
4752 border-bottom: 2px solid $color_gray-more-lighten;
4753 }
4754
4755 p {
4756 font-size: 14px;
4757 }
4758
4759 select {
4760 margin: 1em 0;
4761 }
4762
4763 .description {
4764 margin-bottom: 16px;
4765
4766 .dashicons {
4767 width: 16px;
4768 height: 16px;
4769 font-size: 16px;
4770 vertical-align: middle;
4771 margin-right: 2px;
4772 margin-bottom: 3px;
4773 }
4774 }
4775
4776 .everest-forms-file-upload {
4777 margin: 1em 0;
4778 position: relative;
4779 z-index: 1;
4780
4781 input {
4782 opacity: 0;
4783 z-index: 2;
4784 width: 400px;
4785 height: 46px;
4786 }
4787
4788 label {
4789 display: inline-block;
4790 padding: 4px;
4791 min-width: 400px;
4792 position: absolute;
4793 left: 0;
4794 border-radius: 4px;
4795 border: 1px solid $color_gray-lighten;
4796 z-index: -1;
4797 }
4798
4799 .everest-forms-btn {
4800 width: auto;
4801 height: auto;
4802 font-size: 13px;
4803 margin-right: 10px;
4804 vertical-align: middle;
4805 }
4806 }
4807
4808 .publishing-action {
4809 padding-top: 20px;
4810 text-align: right;
4811 border-top: 2px solid $color_gray-more-lighten;
4812 }
4813 }
4814
4815 /**
4816 * List Table.
4817 */
4818 table.wp-list-table {
4819 span.na {
4820 color: #999;
4821 }
4822
4823 .row-actions {
4824 color: #999;
4825 }
4826
4827 .column-date {
4828 width: 12%;
4829 }
4830
4831 .column-entries {
4832 width: 74px;
4833 text-align: center;
4834 }
4835
4836 .column-actions {
4837 width: 175px;
4838 }
4839
4840 .column-enabled {
4841 width: 25px;
4842 }
4843
4844 .column-status img {
4845 height: 12px;
4846 margin-left: 5px;
4847 margin-bottom: -2px;
4848 }
4849
4850 img.attachment-thumbnail {
4851 height: 40px;
4852 }
4853
4854 .submitdelete {
4855 &:hover {
4856 color: #a00;
4857 }
4858 }
4859
4860 .new-entries-notification td {
4861 padding: 0;
4862 text-align: center;
4863
4864 a {
4865 padding: 10px;
4866 box-shadow: none;
4867 background: lighten(#0095ff, 45%);
4868 }
4869 }
4870 }
4871
4872 /**
4873 * Entry viewer.
4874 **/
4875 .everest-forms-entry {
4876 .postbox {
4877 .inside {
4878 padding: 6px 0 0;
4879
4880 p {
4881 margin: 0;
4882 padding: 6px 10px 8px;
4883 }
4884 }
4885
4886 .submitdelete {
4887 color: #a00;
4888 padding: 1px 2px;
4889 text-decoration: none;
4890 }
4891 }
4892
4893 #poststuff {
4894 #everest-forms-entry-fields,
4895 #everest-forms-entry-details,
4896 #everest-forms-entry-actions,
4897 #everest-forms-entry-payment {
4898 h2.hndle {
4899 cursor: inherit;
4900
4901 .dashicons {
4902 width: 16px;
4903 height: 16px;
4904 font-size: 16px;
4905 margin: 1px 2px 0 4px;
4906 }
4907 }
4908
4909 .inside {
4910 margin: 0;
4911 padding: 0;
4912
4913 .everest-forms-edit-entry-field {
4914 .evf-field {
4915 input[type='text']='text'],
4916 input[type='date']='date'],
4917 input[type='date']='date'],
4918 input[type='datetime-local']='datetime-local'],
4919 input[type='email']='email'],
4920 input[type='file']='file'],
4921 input[type='image']='image'],
4922 input[type='month']='month'],
4923 input[type='number']='number'],
4924 input[type='password']='password'],
4925 input[type='range']='range'],
4926 input[type='search']='search'],
4927 input[type='tel']='tel'],
4928 input[type='time']='time'],
4929 input[type='url']='url'],
4930 input[type='week']='week'],
4931 select,
4932 .StripeElement,
4933 canvas.evf-signature-canvas {
4934 padding: 0 8px;
4935 margin-bottom: 0;
4936 }
4937
4938 textarea {
4939 width: 100%;
4940 max-width: 100%;
4941 min-width: 100%;
4942 height: 120px;
4943 }
4944
4945 ul {
4946 li {
4947 margin: 0;
4948 display: block;
4949
4950 label,
4951 input {
4952 margin: 0;
4953 }
4954
4955 input[type='radio']='radio'],
4956 input[type='checkbox']='checkbox'] {
4957 margin-top: 4px;
4958 margin-right: 8px;
4959 }
4960 }
4961 }
4962 }
4963
4964 .evf-field-radio ul,
4965 .evf-field-checkbox ul,
4966 .evf-field-payment-radio ul,
4967 .evf-field-payment-checkbox ul {
4968 margin: 0;
4969
4970 li {
4971 display: flex;
4972 margin-bottom: 5px;
4973 }
4974 }
4975
4976 label.evf-error {
4977 cursor: default;
4978 color: #900;
4979 margin: 5px 0 0 0;
4980 }
4981
4982 abbr.required {
4983 color: #fa5252;
4984 font-weight: 700;
4985 border: 0 !important;
4986 text-decoration: none;
4987 vertical-align: middle;
4988 }
4989 }
4990
4991 .everest-forms-entry-details-meta,
4992 .everest-forms-entry-actions-meta,
4993 .everest-forms-entry-payment-meta {
4994 padding: 6px 0 0;
4995
4996 p {
4997 margin: 0;
4998 padding: 6px 10px 8px;
4999 }
5000
5001 .dashicons {
5002 top: 0;
5003 left: -2px;
5004 position: relative;
5005 padding: 0 2px 0 0;
5006 color: $color_gray-light;
5007 text-decoration: none;
5008 }
5009 }
5010
5011 .everest-forms-entry-actions-meta a {
5012 box-shadow: none;
5013 text-decoration: none;
5014 }
5015
5016 #major-publishing-actions {
5017 outline: inherit;
5018
5019 a.button-secondary {
5020 margin-left: 5px;
5021 }
5022 }
5023 }
5024 }
5025
5026 #evf-entry-nav-buttons {
5027 padding: 5px 10px;
5028
5029 #evf-next-entry-button {
5030 float: right;
5031 }
5032 }
5033
5034 #everest-forms-entry-fields {
5035 .inside {
5036 table {
5037 border: none;
5038
5039 td a:focus {
5040 box-shadow: none;
5041 }
5042 }
5043
5044 span.list {
5045 display: block;
5046 }
5047
5048 img.attachment-thumbnail {
5049 height: 150px;
5050 }
5051 }
5052
5053 .everest-forms-empty-field-toggle {
5054 float: right;
5055 padding: 3px 0 0;
5056 text-decoration: none;
5057 }
5058 }
5059 }
5060 }
5061
5062 /**
5063 * DB log viewer.
5064 **/
5065 .wp-list-table.logs {
5066 .log-level {
5067 display: inline;
5068 padding: 0.2em 0.6em 0.3em;
5069 font-size: 80%;
5070 font-weight: bold;
5071 line-height: 1;
5072 color: $color-white;
5073 text-align: center;
5074 white-space: nowrap;
5075 vertical-align: baseline;
5076 border-radius: 0.2em;
5077
5078 &:empty {
5079 display: none;
5080 }
5081 }
5082
5083 /**
5084 * Add color to levels
5085 *
5086 * Descending severity:
5087 * emergency, alert -> red
5088 * critical, error -> orange
5089 * warning, notice -> yellow
5090 * info -> blue
5091 * debug -> green
5092 */
5093 .log-level--emergency,
5094 .log-level--alert {
5095 background-color: #ff4136;
5096 }
5097 .log-level--critical,
5098 .log-level--error {
5099 background-color: #ff851b;
5100 }
5101 .log-level--warning,
5102 .log-level--notice {
5103 color: #222;
5104 background-color: #ffdc00;
5105 }
5106 .log-level--info {
5107 background-color: #0074d9;
5108 }
5109 .log-level--debug {
5110 background-color: #3d9970;
5111 }
5112
5113 // Adjust log table columns only when table is not collapsed.
5114 @media screen and (min-width: 783px) {
5115 .column-timestamp {
5116 width: 18%;
5117 }
5118 .column-level {
5119 width: 14%;
5120 }
5121 .column-source {
5122 width: 15%;
5123 }
5124 }
5125 }
5126
5127 #log-viewer-select {
5128 padding: 10px 0 8px;
5129 line-height: 28px;
5130 h2 a {
5131 vertical-align: middle;
5132 }
5133 }
5134
5135 #log-viewer {
5136 background: $color-white;
5137 border: 1px solid #e5e5e5;
5138 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
5139 padding: 5px 20px;
5140
5141 pre {
5142 font-family: monospace;
5143 white-space: pre-wrap;
5144 word-wrap: break-word;
5145 }
5146 }
5147
5148 /**
5149 * Tooltips.
5150 **/
5151 .tips {
5152 cursor: help;
5153 text-decoration: none;
5154 }
5155
5156 img.tips {
5157 padding: 5px 0 0;
5158 }
5159
5160 .tooltipster-base {
5161 display: flex;
5162 position: absolute;
5163 pointer-events: none;
5164
5165 &.tooltipster-ruler {
5166 position: fixed;
5167 top: 0;
5168 right: 0;
5169 bottom: 0;
5170 left: 0;
5171 overflow: hidden;
5172 visibility: hidden;
5173 }
5174
5175 .tooltipster-box {
5176 border: none;
5177 flex: 1 1 auto;
5178 border-radius: 3px;
5179 background: #333;
5180 margin: 0 !important;
5181
5182 .tooltipster-content {
5183 color: $color-white;
5184 overflow: auto;
5185 font-size: 0.8em;
5186 max-width: 150px;
5187 max-height: 100%;
5188 text-align: center;
5189 padding: 0.618em 1em;
5190 box-sizing: border-box;
5191 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
5192
5193 a {
5194 color: #ff7d20;
5195 }
5196
5197 code {
5198 padding: 1px;
5199 background: #888;
5200 }
5201 }
5202 }
5203
5204 .tooltipster-arrow {
5205 overflow: hidden;
5206 position: absolute;
5207
5208 .tooltipster-arrow-uncropped {
5209 position: relative;
5210
5211 .tooltipster-arrow-border {
5212 top: 0;
5213 left: 0;
5214 width: 0;
5215 height: 0;
5216 position: absolute;
5217 border: 5px solid transparent;
5218 }
5219
5220 .tooltipster-arrow-background {
5221 display: none;
5222 }
5223 }
5224 }
5225
5226 &.tooltipster-top,
5227 &.tooltipster-bottom {
5228 .tooltipster-arrow {
5229 width: 10px;
5230 height: 5px;
5231 margin-left: -5px;
5232 }
5233 }
5234
5235 &.tooltipster-left,
5236 &.tooltipster-right {
5237 .tooltipster-arrow {
5238 top: 0;
5239 width: 5px;
5240 height: 10px;
5241 margin-left: 0;
5242 margin-top: -5px;
5243 }
5244 }
5245
5246 &.tooltipster-bottom {
5247 .tooltipster-arrow {
5248 top: -5px;
5249
5250 .tooltipster-arrow-uncropped {
5251 top: -5px;
5252
5253 .tooltipster-arrow-border {
5254 border-bottom-color: #333;
5255 }
5256 }
5257 }
5258 }
5259
5260 &.tooltipster-left {
5261 .tooltipster-arrow {
5262 right: -5px;
5263
5264 .tooltipster-arrow-border {
5265 border-left-color: #333;
5266 }
5267 }
5268 }
5269
5270 &.tooltipster-right {
5271 .tooltipster-arrow {
5272 left: -5px;
5273
5274 .tooltipster-arrow-uncropped {
5275 left: -5px;
5276
5277 .tooltipster-arrow-border {
5278 border-right-color: #333;
5279 }
5280 }
5281 }
5282 }
5283
5284 &.tooltipster-top {
5285 .tooltipster-arrow {
5286 bottom: -5px;
5287
5288 .tooltipster-arrow-border {
5289 border-top-color: #333;
5290 }
5291 }
5292 }
5293
5294 &.tooltipster-fade {
5295 opacity: 0;
5296 transition-property: opacity;
5297
5298 &.tooltipster-show {
5299 opacity: 1;
5300 }
5301 }
5302
5303 &.tooltipster-update-rotate {
5304 animation: rotating 600ms;
5305 }
5306 }
5307
5308 .evf_error_tip {
5309 color: $color-white;
5310 max-width: 20em;
5311 font-size: 0.8em;
5312 line-height: 1.8em;
5313 text-align: center;
5314 border-radius: 3px;
5315 position: absolute;
5316 white-space: normal;
5317 background: #d82223;
5318 margin: 1.5em 1px 0 -1em;
5319 padding: 0.618em 1em;
5320 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
5321 z-index: 9999999;
5322
5323 code {
5324 padding: 1px;
5325 background: #888;
5326 }
5327
5328 &::after {
5329 content: '';
5330 display: block;
5331 border: 8px solid #d82223;
5332 border-right-color: transparent;
5333 border-left-color: transparent;
5334 border-top-color: transparent;
5335 position: absolute;
5336 top: -3px;
5337 left: 50%;
5338 margin: -1em 0 0 -3px;
5339 }
5340 }
5341
5342 /**
5343 *Date picker.
5344 **/
5345 img.ui-datepicker-trigger {
5346 vertical-align: middle;
5347 margin-top: -1px;
5348 cursor: pointer;
5349 }
5350
5351 #ui-datepicker-div {
5352 display: none;
5353 }
5354
5355 /**
5356 * Blank State.
5357 **/
5358 .everest-forms-BlankState {
5359 text-align: center;
5360 padding: 5em 0 0;
5361
5362 .everest-forms-BlankState-icon {
5363 fill: #ddd;
5364 width: 128px;
5365 height: 128px;
5366 margin: 0 0 0.875em;
5367 }
5368
5369 .everest-forms-BlankState-message {
5370 color: #aaa;
5371 margin: 0 auto 1.5em;
5372 line-height: 1.5em;
5373 font-size: 1.2em;
5374 max-width: 500px;
5375 }
5376
5377 .everest-forms-BlankState-cta {
5378 font-size: 1.2em;
5379 padding: 0.75em 1.5em;
5380 margin: 0 0.25em;
5381 height: auto;
5382 display: inline-block !important;
5383 }
5384 }
5385
5386 .evf-pointer {
5387 .evf-pointer-buttons {
5388 .close {
5389 float: left;
5390 margin: 6px 0 0 15px;
5391 }
5392 }
5393 }
5394
5395 /**
5396 * Select2 elements.
5397 */
5398 .select2-container {
5399 .select2-selection--multiple {
5400 .select2-selection__rendered {
5401 display: block;
5402 }
5403
5404 input {
5405 &.select2-search__field {
5406 min-width: 10px;
5407 margin-top: 0 !important;
5408 margin-bottom: 4px !important;
5409 }
5410 }
5411 }
5412
5413 &.select2-container--focus {
5414 .select2-selection--multiple {
5415 border-color: #5b9dd9;
5416 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
5417 outline: 2px solid transparent;
5418 }
5419 }
5420 }
5421
5422 .select2-drop,
5423 .select2-dropdown {
5424 z-index: 999999 !important;
5425
5426 .everest-forms-btn {
5427 margin: 8px 4px;
5428 }
5429 }
5430
5431 .select2-results {
5432 line-height: 1.5em;
5433
5434 .select2-results__option,
5435 .select2-results__group {
5436 margin: 0;
5437 padding: 8px;
5438
5439 &:focus {
5440 outline: none;
5441 }
5442 }
5443
5444 .description {
5445 display: block;
5446 color: #999;
5447 padding-top: 4px;
5448 }
5449 }
5450
5451 .select2-dropdown {
5452 border-color: #007cba;
5453
5454 &::after {
5455 position: absolute;
5456 left: 0;
5457 right: 0;
5458 height: 1px;
5459 background: #fff;
5460 content: '';
5461 }
5462 }
5463
5464 .select2-dropdown--below {
5465 box-shadow: 0 0 0 1px #007cba, 0 2px 1px rgba(0, 0, 0, 0.1);
5466
5467 &::after {
5468 top: -1px;
5469 }
5470 }
5471
5472 .select2-dropdown--above {
5473 box-shadow: 0 0 0 1px #007cba, 0 -2px 1px rgba(0, 0, 0, 0.1);
5474
5475 &::after {
5476 bottom: -1px;
5477 }
5478 }
5479 .select2-container--open {
5480 .select2-dropdown--below {
5481 margin-top: -15px;
5482 }
5483 }
5484 .select2-container {
5485 @media only screen and (max-width: 782px) {
5486 font-size: 16px;
5487 }
5488
5489 &:focus {
5490 outline: none;
5491 }
5492 span.selection {
5493 display: block;
5494 }
5495 .select2-selection__rendered.ui-sortable li {
5496 cursor: move;
5497 }
5498
5499 .select2-selection {
5500 border-color: #7e8993;
5501 }
5502
5503 .select2-search__field {
5504 min-width: 150px;
5505 }
5506
5507 .select2-selection--single {
5508 height: 30px;
5509 border-color: #7e8993;
5510
5511 @media only screen and (max-width: 782px) {
5512 height: 40px;
5513 }
5514
5515 &:focus {
5516 outline: none;
5517 }
5518
5519 .select2-selection__rendered {
5520 line-height: 28px;
5521 padding-right: 24px;
5522
5523 @media only screen and (max-width: 782px) {
5524 line-height: 38px;
5525 }
5526
5527 &:hover {
5528 color: #007cba;
5529 }
5530 }
5531
5532 .select2-selection__arrow {
5533 right: 1px;
5534 height: 28px;
5535 width: 23px;
5536 background: url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E)
5537 no-repeat right 5px top 55%;
5538 background-size: 16px 16px;
5539
5540 @media only screen and (max-width: 782px) {
5541 height: 38px;
5542 }
5543
5544 b {
5545 display: none;
5546 }
5547 }
5548 }
5549
5550 &.select2-container--focus .select2-selection--single,
5551 &.select2-container--open .select2-selection--single,
5552 &.select2-container--open .select2-selection--multiple {
5553 border-color: #007cba;
5554 box-shadow: 0 0 0 1px #007cba;
5555 }
5556
5557 .select2-selection--multiple {
5558 min-height: 30px;
5559 line-height: 1.5;
5560 border-radius: 4px;
5561 border-color: #7e8993;
5562
5563 li {
5564 margin: 0;
5565 }
5566
5567 .select2-selection__choice {
5568 padding: 2px 6px;
5569
5570 .description {
5571 display: none;
5572 }
5573 }
5574 }
5575
5576 .select2-selection__clear {
5577 color: #999;
5578 margin-top: -1px;
5579 z-index: 1;
5580 }
5581
5582 .select2-search--inline .select2-search__field {
5583 min-height: 28px;
5584 font-family: inherit;
5585 font-size: inherit;
5586 font-weight: inherit;
5587 padding: 0 0 0 3px;
5588 }
5589
5590 .everest-forms table.form-table .select2-container {
5591 @media only screen and (max-width: 782px) {
5592 min-width: 100% !important;
5593 }
5594 }
5595 }
5596
5597 /**
5598 * Select2 colors for built-in admin color themes.
5599 */
5600 .admin-color {
5601 $wp_admin_colors: (
5602 blue: #096484,
5603 coffee: #c7a589,
5604 ectoplasm: #a3b745,
5605 midnight: #e14d43,
5606 ocean: #9ebaa0,
5607 sunrise: #dd823b,
5608 light: #04a4cc,
5609 );
5610
5611 @each $name, $color in $wp_admin_colors {
5612 &-#{$name} {
5613 .select2-dropdown {
5614 border-color: $color;
5615 }
5616
5617 .select2-dropdown--below {
5618 box-shadow: 0 0 0 1px $color, 0 2px 1px rgba(0, 0, 0, 0.1);
5619 }
5620
5621 .select2-dropdown--above {
5622 box-shadow: 0 0 0 1px $color, 0 -2px 1px rgba(0, 0, 0, 0.1);
5623 }
5624
5625 .select2-selection--single .select2-selection__rendered:hover {
5626 color: $color;
5627 }
5628
5629 .select2-container.select2-container--focus
5630 .select2-selection--single,
5631 .select2-container.select2-container--open
5632 .select2-selection--single,
5633 .select2-container.select2-container--open
5634 .select2-selection--multiple {
5635 border-color: $color;
5636 box-shadow: 0 0 0 1px $color;
5637 }
5638
5639 .select2-container--default
5640 .select2-results__option--highlighted[aria-selected]],
5641 .select2-container--default
5642 .select2-results__option--highlighted[data-selected]] {
5643 background-color: $color;
5644 }
5645 }
5646 }
5647 }
5648
5649 .everest-forms {
5650 table {
5651 &.form-table {
5652 .select2-container--default {
5653 &.select2-container--focus {
5654 .select2-selection--multiple {
5655 border-color: #5b9dd9;
5656 box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
5657 outline: 2px solid transparent;
5658 }
5659 }
5660 }
5661
5662 .select2-container {
5663 min-width: 350px !important;
5664 }
5665 }
5666 }
5667 }
5668
5669 /**
5670 * Small screen optimisation.
5671 **/
5672 @media only screen and (max-width: 1280px) {
5673 .everest-forms_page_evf-builder {
5674 #everest-forms-builder {
5675 .evf-tab-content {
5676 .everest-forms-panel {
5677 .everest-forms-panel-content-wrap {
5678 .everest-forms-panel-content {
5679 padding: 15px 20px;
5680 background-color: $color-white;
5681 }
5682 }
5683 }
5684 }
5685 }
5686 }
5687 }
5688
5689 /**
5690 * Optimisation for screens 960px and smaller.
5691 **/
5692 @media only screen and (max-width: 960px) {
5693 .everest-forms_page_evf-builder {
5694 #everest-forms-builder {
5695 .evf-tab-content {
5696 .everest-forms-panel {
5697 .everest-forms-panel-sidebar {
5698 width: 280px;
5699 height: calc(100vh - 122px);
5700
5701 .evf-registered-buttons {
5702 .evf-registered-item {
5703 width: 47%;
5704 }
5705 }
5706 }
5707
5708 .everest-forms-panel-sidebar-content {
5709 .everest-forms-panel-content-wrap {
5710 width: calc(100% - 280px);
5711 }
5712 }
5713 }
5714 }
5715 }
5716 }
5717
5718 .everest-forms {
5719 .everest-forms-integration-content {
5720 .integration-addon-detail {
5721 width: 280px;
5722 }
5723 }
5724 }
5725 }
5726
5727 /**
5728 * Optimisation for screens 782px and smaller.
5729 **/
5730 @media screen and (max-width: 782px) {
5731 .everest-forms_page_evf-builder {
5732 .auto-fold {
5733 #wpcontent {
5734 padding-left: 0;
5735 }
5736 }
5737
5738 .everest-forms {
5739 .everest-forms-overlay {
5740 z-index: 99999;
5741 }
5742 }
5743
5744 #everest-forms-builder {
5745 width: 100%;
5746
5747 #everest-forms-builder-form {
5748 width: 100% !important; // Adjust Form builder width
5749
5750 .evf-tab-content {
5751 .everest-forms-panel-content-wrap {
5752 .everest-forms-panel-content {
5753 height: calc(100vh - 122px);
5754
5755 &.ps {
5756 height: calc(100vh - 176px);
5757 }
5758 }
5759
5760 .evf-admin-row {
5761 .evf-admin-grid {
5762 padding: 0;
5763 margin: 0;
5764 }
5765 }
5766 }
5767
5768 .everest-forms-field-option-row-choices {
5769 ul {
5770 li {
5771 input[type='text']='text'] {
5772 width: calc(100% - 118px);
5773 }
5774
5775 a {
5776 &.add,
5777 &.remove {
5778 width: 40px;
5779 height: 40px;
5780 }
5781 }
5782 }
5783 }
5784 }
5785 }
5786 }
5787
5788 .everest-forms-nav-wrapper {
5789 nav.evf-nav-tab-wrapper {
5790 width: calc(100% - 269px);
5791 }
5792
5793 .evf-forms-nav-right {
5794 width: 269px;
5795
5796 .evf-shortcode-field {
5797 input {
5798 display: none;
5799 }
5800
5801 button {
5802 border-radius: 3px;
5803 }
5804 }
5805 }
5806 }
5807
5808 .everest-forms-tab-content {
5809 height: calc(100vh - 172px);
5810 }
5811 }
5812 }
5813
5814 .evf-nav-tab-wrapper {
5815 overflow-x: auto;
5816 }
5817
5818 .everest-forms_page_evf-settings {
5819 .everest-forms {
5820 .everest-forms-settings {
5821 table {
5822 &.form-table {
5823 th {
5824 padding: 15px 0 15px;
5825 }
5826 }
5827 }
5828 }
5829 }
5830 }
5831
5832 .everest-forms-builder-setup {
5833 .everest-forms {
5834 #everest-forms-setup-name {
5835 width: auto;
5836 }
5837
5838 .evf-setup-desc {
5839 a {
5840 width: 200px;
5841 }
5842 }
5843 }
5844 }
5845 }
5846
5847 /**
5848 * Optimisation for screens 768px.
5849 */
5850 @media screen and (min-width: 768px) {
5851 .evf-form-col-6 {
5852 flex: 0 0 50%;
5853 max-width: 50%;
5854 }
5855
5856 .evf-form-col-4 {
5857 flex: 0 0 33.333%;
5858 max-width: 33.333%;
5859 }
5860 }
5861
5862 /**
5863 * Optimisation for screens 600px and smaller.
5864 */
5865 @media screen and (max-width: 600px) {
5866 .everest-forms_page_evf-builder,
5867 .everest-forms_page_evf-settings {
5868 .everest-forms {
5869 .evf-nav-tab-wrapper {
5870 a {
5871 &.nav-tab {
5872 margin: 0;
5873 }
5874 }
5875 }
5876 }
5877 }
5878
5879 .everest-forms-builder-setup {
5880 .everest-forms {
5881 width: 100%;
5882 margin: 20px 0;
5883
5884 .evf-setup-desc a {
5885 display: block;
5886 margin-bottom: 30px;
5887 text-align: center;
5888 width: 100%;
5889 margin-left: 0;
5890 }
5891 }
5892 }
5893
5894 .everest-forms_page_evf-builder {
5895 #wpbody-content {
5896 padding-bottom: 0;
5897 }
5898
5899 #everest-forms-builder {
5900 position: initial;
5901
5902 #everest-forms-builder-form {
5903 position: relative;
5904 }
5905
5906 .evf-tab-content {
5907 .everest-forms-panel-content-wrap {
5908 padding: 20px 20px 0;
5909
5910 .evf-admin-row {
5911 flex-direction: column;
5912 margin: 0 0 20px;
5913 position: relative;
5914
5915 .evf-admin-grid {
5916 &.evf-grid-1,
5917 &.evf-grid-2,
5918 &.evf-grid-3,
5919 &.evf-grid-4 {
5920 width: auto;
5921 }
5922 }
5923 }
5924 }
5925 }
5926
5927 .everest-forms-nav-wrapper {
5928 nav.evf-nav-tab-wrapper {
5929 width: calc(100% - 207px);
5930 }
5931
5932 .evf-forms-nav-right {
5933 width: 207px;
5934 margin-top: 10px;
5935 padding: 9px 17px;
5936
5937 .evf-shortcode-field {
5938 display: none;
5939 }
5940 }
5941 }
5942
5943 .evf-tab-content {
5944 .everest-forms-panel {
5945 .everest-forms-panel-sidebar-content {
5946 flex-direction: column;
5947
5948 .everest-forms-panel-sidebar,
5949 .everest-forms-panel-content-wrap {
5950 width: 100%;
5951 }
5952
5953 .everest-forms-panel-content-wrap {
5954 padding: 0;
5955 }
5956 }
5957 }
5958
5959 .evf-choices-list {
5960 li {
5961 input[type='text']='text'] {
5962 width: 84%;
5963 }
5964 }
5965 }
5966 }
5967 }
5968 }
5969
5970 .everest-forms {
5971 .everest-forms-integration-content {
5972 flex-wrap: wrap;
5973
5974 .integration-addon-detail {
5975 width: 100%;
5976 margin: 0 20px;
5977 border-bottom: 1px solid #ced4da;
5978 border-right: none;
5979 padding-left: inherit;
5980 }
5981
5982 .integration-connection-detail {
5983 width: 100%;
5984 }
5985 }
5986
5987 .everest-forms-integrations-connection {
5988 .everest-forms-integrations {
5989 .integration-header-info {
5990 .integration-detail {
5991 flex-direction: column;
5992 align-items: flex-start;
5993 }
5994 }
5995
5996 .integration-header-info {
5997 align-items: flex-start;
5998
5999 .integration-status {
6000 margin-top: 15px;
6001 }
6002
6003 .integration-detail {
6004 .logo {
6005 margin-bottom: 15px;
6006 }
6007 }
6008 }
6009 }
6010 }
6011 }
6012 }
6013
6014 /**
6015 * Optimisation for screens 400px and smaller.
6016 */
6017 @media screen and (max-width: 400px) {
6018 #everest-forms-builder {
6019 .evf-tab-lists li {
6020 a {
6021 padding: 15px;
6022 }
6023
6024 .dashicons {
6025 font-size: 24px;
6026 }
6027 }
6028
6029 .evf-tab-content {
6030 .everest-forms-panel {
6031 .everest-forms-panel-sidebar {
6032 .evf-registered-buttons {
6033 .evf-registered-item {
6034 width: 47%;
6035 }
6036 }
6037 }
6038 }
6039 }
6040 }
6041
6042 .jconfirm.jconfirm-white .jconfirm-box,
6043 .jconfirm.jconfirm-light .jconfirm-box {
6044 width: 90% !important;
6045 }
6046 }
6047 .evf-repeater-fields {
6048 padding: 0 20px 20px;
6049 .everest-forms-field-repeater-fields {
6050 width: calc(100% + 60px) !important;
6051 margin-left: -30px !important;
6052 margin-top: -1px !important;
6053 min-height: 48px;
6054 }
6055 div.evf-admin-grid.evf-repeatable-grid {
6056 padding: 0 10px 10px !important;
6057 }
6058 }
6059
6060 #elementor-editor-wrapper .everest-icon:before,
6061 .elementor-edit-area .everest-icon:before {
6062 content: '\e902';
6063 font-family: "EverestForms";
6064 font-weight: normal;
6065 font-style: normal;
6066 font-display: block;
6067 }
6068
6069 .everest-forms-field.ui-sortable-helper .evf-field-action {
6070 display: none;
6071 }
6072
6073 .everest-forms-builder .everest-forms-field.ui-sortable-helper {
6074 padding: 15px 15px 0 15px;
6075 border: 1px solid #cdd0d8;
6076 border-radius: 3px;
6077
6078 label {
6079 display: block;
6080 font-size: 13px;
6081 font-weight: 600;
6082 margin-bottom: 10px;
6083
6084 .required {
6085 vertical-align: middle;
6086 padding-left: 6px;
6087 }
6088 }
6089 }
6090
6091 .everest-forms-builder {
6092 .evf-registered-item.ui-draggable.ui-draggable-handle.ui-draggable-dragging {
6093 font-size: 12px !important;
6094 background-color: #fff;
6095 border: 1px solid #cdd0d8;
6096 color: #6c7680;
6097
6098 .evf-icon {
6099 padding: 0 8px;
6100 border-radius: 4px;
6101 font-size: 24px;
6102 vertical-align: middle;
6103 }
6104 }
6105 }
6106
6107 .jconfirm-content-pane {
6108 height: auto !important;
6109
6110 .evf-shortcut-keyword {
6111 margin-bottom: 18px;
6112
6113 .evf-shortcut-title {
6114 flex: 3;
6115 }
6116
6117 li {
6118 display: flex;
6119 align-items: center;
6120
6121 .evf-key {
6122 display: flex;
6123 flex: 2;
6124 column-gap: 8px;
6125 color: #3498DB;
6126
6127 span {
6128 border: 1px solid #3498DB;
6129 background-color: #3498db13;
6130 padding: 4px 0;
6131 width: 40px;
6132 border-radius: 2px;
6133 }
6134 }
6135 }
6136 }
6137 }
6138
6139 .evf-btn-container {
6140 a {
6141 display: inline-block;
6142 padding: 4px 8px;
6143 border: 1px solid #3498DB;
6144 margin-bottom: 8px;
6145 border-radius: 2px;
6146 background-color: #f5fbff;
6147 line-height: 1.8em;
6148
6149 &:hover {
6150 background-color: #3498DB;
6151 color: #fff;
6152 cursor: pointer;
6153 }
6154 }
6155
6156 .evf-btn-unselect-all {
6157 margin-left: 8px;
6158 }
6159 }
6160
6161 // Customize Select2 style
6162 .select2-results__option .wrap:before {
6163 content: "\2610";
6164 width: 25px;
6165 height: 25px;
6166 padding-right: 10px;
6167 }
6168
6169 .select2-results__option[data-selected="true"]="true""] .wrap:before {
6170 content: "\2714";
6171 }
6172
6173 .select2-drop,
6174 .select2-dropdown {
6175 z-index: 999999 !important;
6176 }
6177
6178 .select2-results {
6179 line-height: 1.5em;
6180
6181 .select2-results__option,
6182 .select2-results__group {
6183 margin: 0;
6184 padding: 8px;
6185 }
6186 }
6187
6188 .select2-dropdown {
6189 border-color: gray;
6190 }
6191
6192 .select2-dropdown--below {
6193 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
6194 }
6195
6196 .select2-dropdown--above {
6197 box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1);
6198 }
6199
6200 .select2-container {
6201 .select2-selection__rendered.ui-sortable li {
6202 cursor: move;
6203 }
6204
6205 .select2-selection {
6206 border-color: gray;
6207 }
6208
6209 .select2-search__field {
6210 min-width: 20px;
6211 }
6212
6213 .select2-selection--single {
6214 height: 32px;
6215
6216 .select2-selection__rendered {
6217 display: block;
6218 line-height: 32px;
6219 padding-right: 24px;
6220 }
6221
6222 .select2-selection__arrow {
6223 right: 3px;
6224 height: 30px;
6225 }
6226 }
6227
6228 .select2-selection--multiple {
6229 min-height: 28px;
6230 border-radius: 4px;
6231 line-height: 1.5;
6232 border: 1px solid #ddd !important;
6233 padding-left: 4px;
6234
6235 li {
6236 margin: 0;
6237 }
6238
6239 .select2-selection__choice {
6240 padding: 2px 6px;
6241 }
6242
6243 .select2-selection__rendered {
6244 // display: block;
6245 display: flex;
6246 margin: 0px;
6247
6248 .select2-selection__choice {
6249 margin: 4px;
6250 line-height: 1.4;
6251 display: flex;
6252 align-items: center;
6253 justify-content: center;
6254
6255 .select2-selection__choice__remove {
6256 bottom: 0px;
6257 }
6258 }
6259 }
6260 }
6261
6262 .select2-selection__clear {
6263 color: #999;
6264 margin-top: -1px;
6265 }
6266
6267 .select2-search--inline {
6268 .select2-search__field {
6269 font-family: inherit;
6270 font-size: inherit;
6271 font-weight: inherit;
6272 padding: 3px 0;
6273 margin: 0;
6274 line-height: 1;
6275 min-height: 26px;
6276 height: 32px;
6277 }
6278 }
6279 }
6280
6281 .everest-forms-form-template-wrapper {
6282 .everest-forms-form-template {
6283 &[data-filter-template="free"]="free""] {
6284 .everest-forms-template-wrap[data-plan="premium"]="premium""] {
6285 display: none;
6286 }
6287 }
6288 &[data-filter-template="premium"]="premium""] {
6289 .everest-forms-template-wrap[data-plan="free"]="free""] {
6290 display: none;
6291 }
6292 }
6293 }
6294 }
6295