PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.5
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.5
6.35 6.34 6.33.1 6.33 6.32.1 6.32 6.31 6.25 6.25.1 6.26 6.26.1 6.27 6.28 6.29 6.3 6.3.1 6.3.2 6.30 6.4 6.4.1 6.4.2 6.5 6.5.1 6.5.2 6.5.3 All 141 releases
formidable / css / frm_admin.css

frm_admin.css in Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More 6.5, at css/frm_admin.css

9,279 lines 176.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @import url(font_icons.css);
2
3 :root,
4 .frm-white-body,
5 .frm_wrap {
6 --grey-900: #101828;
7 --grey-800: #1D2939;
8 --grey-700: #344054;
9 --grey-500: #667085; /* Roughly 65% opacity */
10 --grey-400: #98A2B3;
11 --grey-300: #D0D5DD;
12 --grey-200: #EAECF0;
13 --grey-100: #F2F4F7;
14 --grey-50: #F9FAFB;
15 --grey-25: #FCFCFD;
16 --darkest-grey: var(--grey-900); /* Deprecated */
17 --dark-grey: var(--grey-700); /* Deprecated */
18 --medium-grey: rgba(40, 47, 54, .65);
19 --grey: var(--grey-500); /* Deprecated */
20 --grey-border: var(--grey-300); /* Deprecated */
21 --lightest-grey: rgb(250, 250, 250);
22 --sidebar-color: var(--grey-50);
23 --sidebar-hover: var(--grey-200);
24 --primary-700: #2B66A9;
25 --primary-500: #4199FD;
26 --primary-25: #F5FAFF;
27 --primary-color: var(--primary-500); /* Deprecated */
28 --primary-hover: var(--primary-700); /* Deprecated */
29 --light-blue: var(--primary-25); /* Deprecated */
30 --blue-border: rgb(188, 224, 253);
31 --error-500: #F04438;
32 --error-700: #B42318;
33 --green: rgb(63, 172, 37);
34 --orange: #F15A24;
35 --pink: rgb(226, 42, 110);
36 --purple: rgb(141, 53, 245);
37 --border-radius: 35px;
38 --small-radius: 8px;
39 --small-sidebar: 275px;
40 --medium-sidebar: 350px;
41 --big-sidebar: 390px;
42 --biggest-sidebar: 450px;
43 --text-xs: 12px;
44 --text-sm: 14px;
45 --text-md: 16px;
46 --text-lg: 18px;
47 --text-xl: 20px;
48 --h-xs: 24px;
49 --h-sm: 30px;
50 --h-md: 36px;
51 --leading: 1.5;
52 --gap-2xs: 4px;
53 --gap-xs: 8px;
54 --gap-sm: 16px;
55 --gap-md: 24px;
56 --gap-lg: 32px;
57 --gap-xl: 40px;
58 --gap-2xl: 48px;
59 --box-shadow-sm: 0px 0.470745px 1.41223px rgba(16, 24, 40, 0.1), 0px 0.470745px 0.941489px rgba(16, 24, 40, 0.06);
60 --box-shadow-md: 0px 1.88298px 3.76596px -0.941489px rgba(16, 24, 40, 0.1), 0px 0.941489px 1.88298px -0.941489px rgba(16, 24, 40, 0.06);
61 --box-shadow-lg: 0px 6px 8px -2px rgba(16, 24, 40, 0.08), 0px 1.88298px 4px -1px rgba(16, 24, 40, 0.03), 0px 0.470745px 1.41223px rgba(16, 24, 40, 0.1), 0px 0.470745px 0.941489px rgba(16, 24, 40, 0.06);
62 --box-shadow-xl: 0px 9.41489px 11.2979px -1.88298px rgba(16, 24, 40, 0.08), 0px 3.76596px 3.76596px -1.88298px rgba(16, 24, 40, 0.03);
63 }
64
65 @font-face {
66 font-family: 'Inter';
67 src: url('../fonts/Inter-VariableFont_slnt,wght.ttf?v=1') format('truetype');
68 }
69
70 .with_frm_style,
71 .frm-white-body .wpbody-content,
72 .frm_wrap {
73 font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
74 }
75
76 /* Safari 11+ */
77 @media not all and (min-resolution:.001dpcm) {
78 @supports (-webkit-appearance:none) and (stroke-color:transparent) {
79 .with_frm_style,
80 .frm-white-body .wpbody-content,
81 .frm_wrap {
82 -webkit-font-smoothing: antialiased;
83 }
84 }
85 }
86
87 .frm-white-body,
88 .frm-white-body p,
89 .frm_wrap,
90 .frm_wrap p,
91 .frm-modal,
92 .frm-white-body .postbox .inside {
93 font-size: var(--text-sm);
94 color: var(--grey-500);
95 line-height: var(--leading);
96 }
97
98 body:not(.frm-admin-page-styles):not(.frm-admin-page-style) .with_frm_style .frm_form_fields > fieldset {
99 --fieldset-padding: 15px 0;
100 }
101
102 a, .widget .widget-top, .stuffbox h3, .frm-collapsed {
103 cursor: pointer;
104 text-decoration: none;
105 }
106
107 .post-type-frm_display .wrap > #posts-filter,
108 .wrap.frm-with-margin,
109 #frm_top_bar + .wrap,
110 .frm_wrap > .wrap {
111 margin: var(--gap-sm) var(--gap-md) var(--gap-md);
112 }
113
114 .frm-full-screen #wpbody-content > .wrap {
115 margin: 0;
116 }
117
118 .post-type-frm_display .wrap {
119 margin: 0;
120 }
121
122 .toplevel_page_formidable #post-body-content {
123 overflow-x: visible;
124 }
125
126 .frm-full-screen {
127 height: 100%;
128 overflow: hidden;
129 }
130
131 .frm-full-screen.frm-admin-page-reports,
132 .frm-full-screen.frm-admin-page-entries,
133 .frm-full-screen.post-type-frm_display {
134 overflow: auto;
135 }
136
137 .frm-full-screen #wpadminbar,
138 .frm-full-screen #adminmenumain,
139 .frm-full-screen .wp-header-end {
140 display: none;
141 }
142
143 body.frm-white-body:not(.frm-full-screen) .mce-fullscreen {
144 top: 32px;
145 left: 160px;
146 }
147
148 .frm-full-screen #wpbody-content,
149 .frm-full-screen #wpbody,
150 .frm-full-screen #wpcontent {
151 padding: 0;
152 overflow: hidden;
153 margin: 0 !important;
154 }
155
156 .frm-white-body #wpbody-content {
157 position: relative; /* For screen meta links */
158 padding-bottom: 0;
159 }
160
161 .post-new-php.post-type-frm_display #screen-meta-links,
162 .post-php.post-type-frm_display #screen-meta-links {
163 display: none;
164 }
165
166 .frm-white-body #screen-meta-links {
167 position: fixed;
168 bottom: 0;
169 right: 20px;
170 }
171
172 .frm-full-screen #screen-meta-links .screen-meta-toggle {
173 right: 55px;
174 }
175
176 .frm-white-body #screen-meta-links .show-settings {
177 border-radius: var(--small-radius) var(--small-radius) 0 0;
178 border: 1px solid var(--grey-300);
179 border-bottom: none;
180 }
181
182 .frm-white-body.frm-lite #screen-meta-links .screen-meta-toggle {
183 right: 125px; /* Don't cover the lite upgrade button */
184 }
185
186 .frm-white-body #screen-meta {
187 margin: 0;
188 }
189
190 .frm-white-body #screen-meta-links .show-settings:after {
191 color: var(--grey);
192 }
193
194 .frm-white-body .columns-2 {
195 border-bottom: 1px solid var(--grey-300);
196 }
197
198 .frm-full-screen .columns-2 {
199 border: none;
200 }
201
202 body.formidable_page_formidable-pro-upgrade,
203 body.post-type-frm_display.edit-php,
204 body.frm-white-body {
205 background: #fff;
206 }
207
208 body.frm-white-body ul#adminmenu a.wp-has-current-submenu:after,
209 body.frm-white-body ul#adminmenu > li.current > a.current:after {
210 border-right-color: #fff;
211 }
212
213 .frm-white-body #wpcontent {
214 padding-left: 0;
215 padding-right: 0;
216 }
217
218 .frm-white-body .wrap #post-body {
219 padding: 0 20px;
220 }
221
222 .post-type-frm_display .tablenav,
223 .frm_wrap .tablenav {
224 margin-bottom: 10px;
225 }
226
227 .frm-white-body .tablenav .actions select,
228 .wp-admin .frm_wrap .tablenav select {
229 margin-right: var(--gap-xs);
230 }
231
232 .tablenav .actions .button {
233 margin-top: 1px;
234 }
235
236 .frm-white-body table.widefat {
237 background: var(--lightest-grey);
238 border-width: 0;
239 box-shadow: none;
240 margin: 20px 0;
241 }
242
243 .frm-white-body table.widefat tfoot,
244 .frm-white-body table.widefat thead {
245 background: #fff;
246 }
247
248 .frm-white-body table.widefat th {
249 font-size: var(--text-md);
250 }
251
252 .frm-white-body table.widefat th a {
253 color: var(--grey-700);
254 }
255
256 .frm-white-body table.widefat strong a {
257 color: var(--primary-700);
258 }
259
260 .frm-scroll-box {
261 clear: both;
262 overflow: auto;
263 max-height: 405px;
264 border: 1px solid var(--grey-300);
265 border-radius: var(--small-radius);
266 }
267
268 .frm_form_field.frm_scroll_box .frm_opt_container {
269 height: 100px;
270 overflow: auto;
271 border: 1px solid var(--grey-300);
272 }
273
274 .frm-short-list {
275 overflow: auto;
276 max-height: 190px;
277 }
278
279 .frm-white-body table.frm-border td {
280 font-size: var(--text-sm);
281 }
282
283 .frm-white-body .striped > tbody > :nth-child(odd) {
284 background-color: #fff;
285 }
286
287 .frm_wrap td.column-title strong {
288 display: inline;
289 }
290
291 td.column-title .frm_actions_dropdown {
292 float: right;
293 }
294
295 #frm_top_bar {
296 display: flex;
297 gap: var(--gap-sm);
298 width: 100%;
299 height: 72px;
300 margin: 0;
301 box-sizing: border-box;
302 text-align: center;
303 padding: 0 var(--gap-md);
304 }
305
306 #frm_top_bar > .frm-full-close:last-child,
307 #frm_top_bar > #frm-publishing:last-child {
308 margin-left: auto;
309 }
310
311 #frm_top_bar {
312 border-bottom: 1px solid var(--grey-300);
313 padding: 0 var(--gap-md);
314 overflow: visible;
315 }
316
317 .frm-white-body h1,
318 .frm-white-body h2,
319 .frm-white-body h3,
320 .frm-white-body h4 {
321 color: var(--grey-900);
322 font-weight: 400;
323 line-height: var(--leading) !important;
324 }
325
326 .frm-white-body .wrap h1,
327 .frm-white-body h1 {
328 font-size: var(--text-xl);
329 }
330
331 .frm-white-body .wrap h2,
332 .frm-white-body h2 {
333 font-size: var(--text-lg);
334 }
335
336 .frm-white-body .wrap h3,
337 .frm-white-body h3 {
338 font-size: var(--text-md);
339 }
340
341 .frm-white-body .wrap h4,
342 .frm-white-body h4 {
343 font-size: var(--text-sm);
344 font-weight: 500;
345 }
346
347 /* Override CSS in Views plugin. */
348 .frm-views-editor-body .frm_page_container #frm_top_bar h1 {
349 padding: 0 !important;
350 color: var(--grey-900);
351 font-size: var(--text-xl) !important;
352 }
353
354 .post-type-frm_display .frm_top_left {
355 padding-bottom: 0 !important;
356 }
357
358 .frm-new-table-view-option.frm-selected-table-view-option {
359 border-radius: var(--small-radius);
360 background: var(--primary-25);
361 }
362
363 .frm-views-editor-body #frm_adv_info .tabs-panel { /* Views sidebar */
364 padding-left: 4px;
365 padding-right: 4px;
366 }
367
368 #frm_edit_box_content_modal .frm_modal_footer {
369 padding-top: var(--gap-sm);
370 border-top: 1px solid var(--grey-300);
371 }
372
373 #frm_edit_box_content_modal .frm_modal_footer > div {
374 display: flex;
375 justify-content: space-between;
376 }
377
378 #frm_edit_box_content_modal #frm_modal_box_select_area,
379 #frm_edit_box_content_modal #frm_box_content_wysiwyg_wrapper,
380 #frm_edit_box_content_modal .frm_modal_content {
381 max-height: calc(100vh - 176px) !important;
382 }
383
384 #frm_edit_box_content_modal #frm_modal_box_select_area {
385 height: calc(100vh - 176px) !important;
386 }
387
388 #frm_edit_box_content_modal #wp-content-editor-tools {
389 padding-top: 0;
390 }
391
392 #frm_edit_box_content_modal.frm-modal .postbox .frm-modal-title + div:last-child {
393 right: var(--gap-md);
394 }
395
396 .frm_code_list.frm-full-hover .frm-dropdown-view a {
397 flex-direction: row-reverse; /* Switch in the HTML */
398 }
399
400 #frm_view_editor_left.frm-right-panel .accordion-section-title:before {
401 content: '' !important;
402 margin: 0;
403 }
404 /** End Temporary View CSS */
405
406 .frm-upgrade-bar {
407 background: rgba(188, 224, 253, 0.23);
408 border-bottom: 1px solid var(--sidebar-hover);
409 padding: 3px 0 3px 40px;
410 font-size: 95%;
411 }
412
413 .frm-upgrade-bar span {
414 opacity: .9;
415 }
416
417 a h1 .frmsvg {
418 color: var(--grey-400);
419 vertical-align: middle;
420 min-width: var(--text-sm);
421 }
422
423 a .frmsvg {
424 color: currentColor;
425 }
426
427 .frm_wrap .view-switch a.current:before,
428 .frm-white-body a,
429 .frm_wrap a,
430 .frm_wrap a i {
431 color: var(--primary-color);
432 }
433
434 .frm_wrap a:active,
435 .frm_wrap a:hover {
436 color: var(--primary-700);
437 box-shadow: none;
438 }
439
440 .post-type-frm_display a:focus,
441 .frm_wrap a:focus {
442 box-shadow: none;
443 }
444
445 .frm_top_left {
446 text-align: left;
447 float: left;
448 white-space: nowrap;
449 max-width: 250px;
450 overflow: hidden;
451 text-overflow: ellipsis;
452 align-self: center;
453 }
454
455 .post-type-frm_display .frm_top_left,
456 .frm_top_left.frm_top_wide {
457 max-width: 100%;
458 }
459
460 .post-type-frm_display .frm_nav_bar .frm-header-logo,
461 .frm_nav_bar .frm-header-logo {
462 margin: 18px 0 10px;
463 }
464
465 #frm_top_bar .frm_form_nav {
466 flex: 1;
467 }
468
469 ul.frm_form_nav {
470 margin: 0 auto;
471 padding-top: 18px;
472 display: block;
473 min-width: 240px;
474 }
475
476 .nav-tab-wrapper.frm_form_nav {
477 padding: 0 25px;
478 }
479
480 ul.frm_form_nav > li {
481 margin: 0 min(3.5%, 32px) 0 0;
482 display: inline-block;
483 }
484
485 .post-type-frm_display #advanced-sortables h2.hndle,
486 .post-type-frm_display #side-sortables h2.hndle,
487 .post-type-frm_display #normal-sortables h2.hndle,
488 .post-type-frm_display .frm_form_nav .nav-tab-active,
489 .frm_form_nav > li > a {
490 font-size: 1.3em;
491 text-decoration: none;
492 display: block;
493 padding: 6px 2px 4px;
494 font-weight: 500;
495 color: var(--grey-700);
496 border-bottom: 2px solid transparent;
497 }
498
499 .post-type-frm_display.js .postbox .handlediv .toggle-indicator:before {
500 margin-top: 10px;
501 }
502
503 .frm-nav-tabs a:focus,
504 .frm-nav-tabs a:active,
505 .frm_form_nav a:active,
506 .frm_form_nav a:focus {
507 outline: none;
508 -webkit-box-shadow: none;
509 box-shadow: none;
510 }
511
512 .frm_form_nav > li > a {
513 font-size: var(--text-md);
514 font-weight: 400;
515 color: var(--grey-500);
516 }
517
518 .frm_form_nav > li > a:hover {
519 border-color: var(--primary-700);
520 }
521
522 .frm_form_nav .frm-dropdown-menu a:hover {
523 background-color: #eaf2fa;
524 }
525
526 .post-type-frm_display .frm_form_nav .nav-tab-active,
527 .post-type-frm_display .frm_form_nav .nav-tab-active:hover,
528 .frm_form_nav > li a.current_page {
529 color: var(--primary-500);
530 border-color: var(--primary-500);
531 background: transparent;
532 opacity: 1;
533 font-weight: 600;
534 }
535
536 .frm-full-close {
537 display: none;
538 padding-left: var(--gap-md);
539 border: 0 solid var(--grey-300);
540 border-left-width: 1px; /* Make RTL a bit less maintenance */
541 height: 100%;
542 box-sizing: border-box;
543 }
544
545 .frm-full-screen .frm-full-close {
546 display: flex;
547 align-items: center;
548 }
549
550 .frm-full-close a {
551 display: block;
552 }
553
554 .frm-full-close .frmsvg {
555 font-size: 20px;
556 width: 20px;
557 height: 20px;
558 color: var(--grey-500);
559 }
560
561 #frm_top_bar h1 {
562 font-weight: 400;
563 padding: 0;
564 margin: 0;
565 color: var(--grey-900);
566 display: inline-flex;
567 gap: var(--gap-sm);
568 align-items: center;
569 text-align: left;
570 width: 200px;
571 }
572
573 #frm_top_bar h1 span {
574 max-width: 175px;
575 text-overflow: ellipsis;
576 overflow: hidden;
577 white-space: nowrap;
578 display: inline-block;
579 vertical-align: bottom;
580 }
581
582 #frm_top_bar ul.frm_form_nav,
583 #frm_top_bar .frm-header-logo,
584 #frm_top_bar #frm_bs_dropdown {
585 align-self: center;
586 margin-top: 0;
587 margin-bottom: 0;
588 padding-top: 0;
589 }
590
591 #frm_top_bar .frm-header-logo {
592 display: flex; /* Get rid of extra padding below logo */
593 }
594
595 #frm_top_bar h2 {
596 float: left;
597 margin: 0 0 0 var(--gap-sm);
598 padding: 2px 0 2px var(--gap-sm);
599 font-weight: normal;
600 border-left: 2px solid var(--grey);
601 }
602
603 .frm_wrap > #frm_top_bar #frm-publishing {
604 margin-top: 0;
605 }
606
607 #frm-publishing {
608 min-width: 225px;
609 align-self: center;
610 align-items: center;
611 display: flex;
612 flex-direction: row-reverse;
613 gap: 0 var(--gap-sm);
614 flex-wrap: wrap;
615 }
616
617 .frm_wrap .postbox {
618 border-color: var(--grey-300);
619 border-radius: 6px;
620 box-shadow: none;
621 }
622
623 .frm_wrap .postbox h3.hndle {
624 cursor: default;
625 padding: 10px 20px;
626 margin: 0;
627 line-height: 1.4em;
628 border-color: var(--grey-300);
629 }
630
631 .frm-pre-hndle {
632 font-size: 15px;
633 padding: 5px;
634 margin: 9px 15px;
635 }
636
637 .frm-empty-row {
638 display: none;
639 }
640
641 .frm-child-row {
642 box-shadow: 5px 0px 0px 0px inset var(--sidebar-hover);
643 }
644
645 .frm_animate_bg {
646 transition: background 200ms linear, color 200ms linear;
647 }
648
649 .wrap > .subsubsub {
650 clear: both;
651 margin: 0;
652 }
653
654 .frm_wrap .subsubsub a {
655 line-height: var(--leading);
656 font-size: var(--text-sm);
657 }
658
659 .frm-admin-page-styles .frm_page_container,
660 .frm_wrap .frm_page_container { /* Use .frm_wrap to avoid messing up Views editor layout */
661 height: calc( 100vh - 32px );
662 display: flex;
663 flex-direction: column;
664 overflow: hidden;
665 padding-top: 0;
666 position: fixed;
667 top: 32px;
668 bottom: 0;
669 left: 0;
670 right: 0;
671 }
672
673 .frm-admin-page-translate .frm_wrap .frm_page_container, .frm-admin-page-update_translations .frm_wrap .frm_page_container {
674 position: static;
675 }
676
677 .auto-fold.frm-admin-page-styles .frm_page_container,
678 .auto-fold .frm_wrap .frm_page_container {
679 left: 160px;
680 }
681
682 .folded.frm-admin-page-styles .frm_page_container,
683 .folded .frm_wrap .frm_page_container {
684 left: 38px;
685 }
686
687 .frm-full-screen.frm-admin-page-styles .frm_page_container,
688 .frm-full-screen .frm_wrap .frm_page_container {
689 height: 100vh;
690 top: 0;
691 left: 0;
692 }
693
694 .frm-full-screen.frm-admin-page-entries .frm_page_container,
695 .frm-new-entry .frm_page_container,
696 .frm-admin-page-reports .frm_page_container,
697 .frm_list_entry_page .frm_page_container {
698 height: auto;
699 display: block;
700 }
701
702 .frm-new-entry .columns-2 {
703 border: none;
704 }
705
706 .frm-white-body #frm_top_bar,
707 .frm-white-body .columns-2 {
708 flex: 0 0 auto;
709 }
710
711 .columns-2 .frm-right-panel + div {
712 padding-bottom: var(--gap-md);
713 border-left: 1px solid var(--sidebar-hover);
714 }
715
716 .columns-2 .frm-right-panel + div,
717 .frm_wrap #post-body-content {
718 padding-bottom: 0;
719 padding-top: var(--gap-sm);
720 margin-bottom: 0;
721 background: #fff;
722 width: auto;
723 float: none;
724 flex: 2;
725 }
726
727 .frm-white-body .columns-2 {
728 flex: 1;
729 display: flex;
730 overflow: hidden;
731 }
732
733 .frm-white-body .columns-2 > div {
734 overflow-y: auto;
735 box-sizing: border-box;
736 }
737
738 .frm_wrap .columns-2 .frm-right-panel,
739 .frm-right-panel {
740 flex: 0 0 var(--biggest-sidebar);
741 float: none;
742 width: var(--biggest-sidebar);
743 min-width: var(--biggest-sidebar);
744 background-color: var(--sidebar-color);
745 margin: 0;
746 box-shadow: none;
747 border: none;
748 padding-bottom: 25px;
749 }
750
751 .frm-right-panel .frm_field_list,
752 .frm_wrap .frm-right-panel #frm_adv_info,
753 .frm_wrap #postbox-container-1 #frm_adv_info {
754 box-shadow: none;
755 border: none;
756 margin-bottom: 26px;
757 }
758
759 .frm-default-switcher {
760 float: right;
761 position: absolute;
762 top: 15px;
763 right: 7px;
764 z-index: 1;
765 }
766
767 .frm-default-switcher a {
768 padding: 0 2px;
769 }
770
771 .frm-default-switcher a .frmsvg {
772 vertical-align: initial;
773 }
774
775 .frm-default-switcher a,
776 .frm-default-switcher a .frmsvg,
777 .frm-default-switcher a i {
778 color: var(--grey);
779 }
780
781 .frm-default-switcher a.current,
782 .frm-default-switcher a.current .frmsvg,
783 .frm-default-switcher a.current i {
784 color: var( --primary-500);
785 }
786
787 #new_fields,
788 .frm-has-modal,
789 p.frm_has_shortcodes {
790 position: relative;
791 }
792
793 .frm-inline-modal.postbox {
794 background: #fff;
795 }
796
797 .frm_has_shortcodes .frmsvg,
798 .frm_has_shortcodes i:not([class*=mce-]) {
799 position: absolute;
800 color: var(--primary-500);
801 border-radius: 50%;
802 border: 1px solid transparent;
803 z-index: 100;
804 text-align: center;
805 }
806
807 .frm_has_shortcodes input,
808 .frm_has_shortcodes textarea {
809 padding-left: 18px;
810 box-sizing: border-box;
811 }
812
813 #form_settings_page #frm_adv_info {
814 display: none;
815 top: 0;
816 width: 310px;
817 max-height: 315px;
818 min-height: 200px;
819 overflow-y: scroll;
820 z-index: 100;
821 }
822
823 #form_global_settings .columns-2 .frm-right-panel,
824 #form_settings_page .columns-2 .frm-right-panel {
825 flex: 0 0 var(--small-sidebar);
826 width: var(--small-sidebar);
827 min-width: var(--small-sidebar);
828 }
829
830 #form_global_settings .frm_grid_container {
831 gap: 0 var(--gap-md);
832 }
833
834 .frm-inner-content {
835 padding: var(--gap-md);
836 }
837
838 .post-type-frm_display #poststuff {
839 padding: 0 0 10px 40px;
840 }
841
842 #postbox-container-2 .postbox .inside {
843 padding: 15px 25px;
844 }
845
846 #postbox-container-2 #frm_advanced .inside h3 {
847 margin: 15px -25px;
848 font-weight: 600;
849 }
850
851 #form_settings_page .frm-inner-content {
852 padding-top: 0;
853 padding-bottom: 150px;
854 position: relative;
855 }
856
857 .frm_wrap #submitdiv {
858 margin-bottom: 0;
859 border-width: 0 0 1px;
860 width: 100%;
861 min-width: unset;
862 }
863
864 .frm_wrap #frm_adv_info .handlediv,
865 .frm_wrap #frm_adv_info .hndle {
866 display: none;
867 }
868
869 .frm_wrap .menu-settings {
870 /* for add-on reverse compatibility */
871 border: none;
872 margin-top: 0;
873 }
874
875 .nodrag a {
876 cursor: pointer;
877 }
878
879 .frm_wrap #frm_adv_info .inside {
880 margin: 0;
881 }
882
883 #frm_adv_info > .inside {
884 padding: 0;
885 }
886
887 .frm-right-panel .frm-inline-modal.postbox .inside {
888 margin: 0;
889 padding-top: 0;
890 }
891
892 .frm-right-panel .frm-inline-modal .inside p:not(.howto),
893 .frm-right-panel .frm-inline-modal .inside a {
894 font-size: 15px;
895 }
896
897 .frm-inline-modal .inside a.frm_icon_font {
898 font-size: 18px;
899 }
900
901 .frm-right-panel .frm_field_list #frm-insert-fields {
902 max-height: none;
903 font-size: var(--text-sm);
904 padding: 0;
905 }
906
907 .frm-nav-tabs {
908 margin: 10px 0 20px;
909 padding: 0 var(--gap-sm);
910 display: block;
911 border-bottom: 1px solid var(--grey-300);
912 }
913
914 #frm-nav-tabs {
915 position: -webkit-sticky;
916 position: sticky;
917 top: 0;
918 background-color: var(--sidebar-color);
919 z-index: 98; /* must be < 99 */
920 margin-top: 0;
921 padding-top: 5px;
922 }
923
924 .frm_form_settings #frm_adv_info #frm-nav-tabs {
925 background-color: #fff;
926 margin: 0 -4px;
927 }
928
929 .frm_form_settings span.frm-with-right-icon {
930 display: block;
931 }
932
933 .frm-inline-modal .frm-nav-tabs,
934 #frm_adv_info .frm-nav-tabs {
935 margin: 5px 0 0;
936 }
937
938 #frm_adv_info .frm-nav-tabs.frm-compact-nav {
939 padding-right: 0;
940 padding-left: 20px;
941 }
942
943 .frm-nav-tabs li {
944 display: inline-block;
945 margin: 0;
946 }
947
948 .frm-nav-tabs a {
949 color: var(--grey-700);
950 padding: 10px 1px;
951 margin: 0 9px;
952 border-bottom: 2px solid transparent;
953 }
954
955 .frm_form_settings #frm_adv_info .frm-nav-tabs a {
956 padding: 5px 1px;
957 color: var(--grey-500);
958 }
959
960 .frm-nav-tabs.frm-compact-nav a {
961 margin: 0 5px;
962 }
963
964 .frm-nav-tabs a {
965 display: block;
966 opacity: .9;
967 }
968
969 #frm_adv_info .frm-nav-tabs a {
970 color: var(--grey-700);
971 }
972
973 .frm-nav-tabs a:hover,
974 .frm-nav-tabs .frm-tabs a {
975 color: var(--primary-500) !important;
976 border-color: var(--primary-500);
977 }
978
979 .frm_form_settings #frm_adv_info .frm-nav-tabs .frm-tabs a {
980 font-weight: 500;
981 }
982
983 #frm-bulk-modal .howto,
984 #frm-bulk-modal h3 {
985 font-size: var(--text-sm);
986 font-weight: 400;
987 margin: 5px 0 10px;
988 color: var(--grey);
989 }
990
991 #frm-bulk-modal h3 {
992 margin-left: 20px;
993 }
994
995 .frm-right-panel a.frm_add_logic_link,
996 .frm-right-panel h3 {
997 color: var(--grey-700);
998 font-size: var(--text-lg);
999 font-weight: 400;
1000 border-top: 2px solid var(--sidebar-hover);
1001 margin: 0;
1002 }
1003
1004 .frm-single-settings > h3:first-of-type {
1005 border-bottom: 2px solid var(--sidebar-hover);
1006 border-top: none;
1007 padding-top: 0 !important;
1008 }
1009
1010 .frm-flex-justify,
1011 .frm-right-panel .frm-single-settings h3 {
1012 display: flex;
1013 justify-content: space-between;
1014 align-items: center;
1015 }
1016
1017 .frm-right-panel h3 i {
1018 color: var(--grey-700);
1019 float: right;
1020 width: 16px;
1021 cursor: pointer;
1022 }
1023
1024 /* right sidebar */
1025 #post-body-content + .frm-right-panel {
1026 flex: 0 0 var(--medium-sidebar);
1027 width: var(--medium-sidebar);
1028 min-width: var(--medium-sidebar);
1029 border-left: 1px solid var(--sidebar-hover);
1030 }
1031
1032 .frm-new-entry #post-body-content + .frm-right-panel,
1033 .frm-new-entry .frm-right-panel {
1034 background: none;
1035 border: none;
1036 }
1037
1038 #post-body-content + .frm-right-panel h3 {
1039 padding: 20px 20px 0;
1040 font-size: 17px;
1041 }
1042
1043 #post-body-content + .frm-right-panel .frm_with_icons:first-of-type h3 {
1044 border: none;
1045 }
1046
1047 #frm-insert-fields h3 {
1048 color: var(--grey);
1049 font-size: 15px;
1050 font-weight: normal;
1051 border-top: none;
1052 border-bottom: 1px solid var(--sidebar-hover);
1053 margin: 0;
1054 padding: 10px 10px 10px 25px;
1055 }
1056
1057 .frm_wrap #frm_adv_info ul.category-tabs {
1058 margin: 0;
1059 padding: 10px 0 9px;
1060 font-size: 15px;
1061 background: transparent;
1062 }
1063
1064 .frm_wrap #frm_adv_info ul.category-tabs li {
1065 padding: 10px;
1066 background-color: transparent !important;
1067 }
1068
1069 .frm_wrap #frm_adv_info ul.category-tabs li:first-child {
1070 border: none;
1071 }
1072
1073 .frm_wrap #frm_adv_info .categorydiv div.tabs-panel {
1074 border: none;
1075 background: transparent;
1076 }
1077
1078 .frm_wrap #frm-categorydiv {
1079 border-right: none;
1080 }
1081
1082 #frm_adv_info #frm-conditionals {
1083 padding-top: var(--gap-sm);
1084 }
1085
1086 #postbox-container-1 #taxonomy-linkcategory #frm-html-tags {
1087 display: none;
1088 max-height: none;
1089 }
1090
1091 #postbox-container-1 .frm_field_list #frm-insert-fields .frmbutton.dropdown {
1092 position: relative;
1093 }
1094
1095 /* Admin footer */
1096 .frm-white-body #footer-upgrade {
1097 display: none;
1098 }
1099
1100 .frm-admin-footer-links,
1101 .frm-admin-footer-links-nav,
1102 .frm-admin-footer-links-socials {
1103 display: flex;
1104 justify-content: center;
1105 }
1106
1107 .frm-admin-footer-links {
1108 gap: var(--gap-2xs);
1109 flex-direction: column;
1110 text-align: center;
1111 padding: var(--gap-xl) 0 var(--gap-lg) 160px;
1112 font-size: var(--text-xs);
1113 color: var(--grey-400);
1114 }
1115
1116 body.rtl .frm-admin-footer-links {
1117 padding-left: unset;
1118 padding-right: 160px;
1119 }
1120
1121
1122 .frm-admin-footer-links-nav {
1123 gap: var(--gap-2xs);
1124 margin-bottom: var(--gap-xs);
1125 }
1126
1127 .frm-admin-footer-links-socials {
1128 gap: var(--gap-xs);
1129 }
1130
1131 .frm-admin-footer-links-socials a {
1132 color: var(--grey-400);
1133 }
1134 /* End Admin footer */
1135
1136 .frm_list_entry_page h2 {
1137 float: left;
1138 }
1139
1140 .frm_list_entry_page h2 + .error {
1141 clear: both;
1142 }
1143
1144 .frm_sidebar select {
1145 width: 100%;
1146 margin-left: 0;
1147 margin-right: 0;
1148 }
1149
1150 .frm_sidebar #search-submit {
1151 float: right;
1152 }
1153
1154 .frm_single_entry_page #submitdiv {
1155 margin: 0;
1156 }
1157
1158 .frm_single_entry_page .hndle a {
1159 font-size: 13px;
1160 }
1161
1162 /* Build New Form page */
1163
1164 .frm-right-panel #publishing-action {
1165 float: none;
1166 }
1167
1168 .frm-right-panel #major-publishing-actions {
1169 border-top: none;
1170 height: 32px;
1171 background: transparent;
1172 }
1173
1174 #major-publishing-actions .frm_submit_form {
1175 float: right;
1176 margin-left: 5px;
1177 }
1178
1179 /* Buttons */
1180
1181 .frm_orange_button,
1182 .frm_reverse_button {
1183 font-size: 12px;
1184 border: 1px solid var(--orange);
1185 color: var(--orange);
1186 font-weight: 600;
1187 padding: 1px 4px;
1188 border-radius: 4px;
1189 background: transparent;
1190 }
1191
1192 .frm_reverse_button:hover,
1193 .frm_reverse_button:active,
1194 .frm_reverse_button:focus {
1195 color: #fff;
1196 background: var(--orange);
1197 border: 1px solid var(--orange);
1198 }
1199
1200 .frm_reverse_button {
1201 font-size: 1em;
1202 transition: all .2s ease;
1203 }
1204
1205 .frm-button-primary,
1206 .wp-core-ui .button-primary.frm-button-primary,
1207 .wp-core-ui .button.frm-button-primary,
1208 .frm-button-secondary,
1209 .wp-core-ui .button-secondary.frm-button-secondary,
1210 .wp-core-ui .button.frm-button-secondary,
1211 .frm-white-body .frm-search .button,
1212 .frm-white-body .search-box .button, /* Views */
1213 .frm-white-body .tablenav .button,
1214 .frm_orange_button,
1215 .toplevel_page_formidable #frm_upgrade_modal .button-primary,
1216 .wp-core-ui.frm-white-body .button-primary,
1217 .wp-core-ui.frm-white-body .button-secondary,
1218 .frm-white-body .button-primary,
1219 .frm-white-body .button-secondary,
1220 #frm-form-button button,
1221 .frm-preview-buttons button,
1222 .frm-button-red,
1223 .frm-button-tertiary {
1224 text-shadow: none;
1225 box-shadow: none;
1226 border-radius: 30px;
1227 border: 1px solid var(--primary-500);
1228 font-size: var(--text-sm);
1229 transition: all .2s ease;
1230 padding: 7px 16px;
1231 height: auto;
1232 min-height: 28px;
1233 outline: none;
1234 line-height: var(--leading);
1235 box-sizing: border-box;
1236 font-weight: 500;
1237 margin-bottom: 0;
1238 display: inline-block;
1239 }
1240
1241 .frm-button-tertiary {
1242 border-color: transparent;
1243 color: var(--primary-500);
1244 }
1245
1246 .frm-button-red,
1247 .frm-button-red:focus {
1248 color: #fff !important;
1249 --primary-500: var(--error-500);
1250 --primary-700: var(--error-700);
1251 }
1252
1253 .frm-white-body h2 .button,
1254 .post-type-frm_display h2 .frm-button-primary,
1255 .frm-white-body .tablenav .button,
1256 .frm-button-primary.frm-button-sm,
1257 .frm-button-secondary.frm-button-sm,
1258 .frm-button-tertiary.frm-button-sm,
1259 .frm-button-red.frm-button-sm {
1260 padding: 4px 12px !important;
1261 font-size: var(--text-xs) !important;
1262 }
1263
1264 .frm_no_style_button {
1265 background: transparent;
1266 }
1267
1268 .frm-with-icon {
1269 display: flex;
1270 gap: var(--gap-xs);
1271 align-items: center;
1272 }
1273
1274 .frm-with-icon svg {
1275 opacity: .65; /* Get close to grey-500 without overriding hover colors */
1276 }
1277
1278 .frm-with-icon.button svg {
1279 height: var(--text-sm);
1280 width: var(--text-sm);
1281 }
1282
1283 .frm-with-icon.frm-button-sm svg {
1284 height: var(--text-xs);
1285 width: var(--text-xs);
1286 }
1287
1288 .frm-white-body .button.add_media {
1289 /* Media buttons above RTE */
1290 padding-left: 12px !important;
1291 padding-right: 12px !important;
1292 font-size: var(--text-xs);
1293 border-radius: var(--border-radius);
1294 }
1295
1296 .wp-core-ui.frm-white-body #post-query-submit.button,
1297 .wp-core-ui.frm-white-body .button.tablenav-pages-navspan,
1298 .wp-core-ui.frm-white-body .button.first-page,
1299 .wp-core-ui.frm-white-body .button.prev-page,
1300 .wp-core-ui.frm-white-body .button.next-page,
1301 .wp-core-ui.frm-white-body .button.last-page,
1302 .wp-core-ui.frm-white-body .button.action {
1303 background-color: transparent;
1304 border-color: var(--grey-300);
1305 color: var(--grey-700);
1306 border-radius: var(--border-radius);
1307 }
1308
1309 .post-type-frm_display.wp-core-ui .button-primary,
1310 .frm-button-primary,
1311 .wp-core-ui .button-primary.frm-button-primary,
1312 .frm_single_entry_page .button-primary {
1313 background-color: var(--primary-500) !important;
1314 color: #fff !important;
1315 }
1316
1317 .frm-button-primary.frm_large{
1318 font-size: var(--text-md) !important;
1319 height: auto !important;
1320 padding: 9px 18px !important;
1321 }
1322
1323 .frm-button-primary i:before {
1324 color: #fff;
1325 }
1326
1327 .wp-core-ui .button-primary.frm-button-primary:hover,
1328 .frm-button-primary:hover {
1329 background: var(--primary-700) !important;
1330 border-color: var(--primary-700) !important;
1331 }
1332
1333 .wp-core-ui .button-primary.frm-button-primary:active {
1334 vertical-align: inherit;
1335 }
1336
1337 .frm-white-body #search-submit,
1338 #frm-form-button .frm_button_submit,
1339 .frm-white-body .frm-preview-buttons button,
1340 .frm-white-body .button:not(.frm-button-primary),
1341 .wp-core-ui.frm-white-body .button-secondary,
1342 .wp-core-ui .button-secondary.frm-button-secondary,
1343 .wp-core-ui .button.frm-button-secondary,
1344 .frm-white-body .frm-button-secondary,
1345 .frm-button-secondary {
1346 color: var(--grey-800);
1347 border-color: var(--grey-300);
1348 background-color: #fff;
1349 }
1350
1351 #wp-content-media-buttons button,
1352 #wp-content-media-buttons a.button {
1353 border-color: var(--grey-300);
1354 }
1355
1356 .frm_orange_button {
1357 border-color: #da791d !important;
1358 background: var(--orange);
1359 color: #fff;
1360 }
1361
1362 .frm-white-body .button:not(.frm-button-primary):focus,
1363 .frm-white-body .button:not(.frm-button-primary):active,
1364 .frm-white-body .frm-button-secondary:hover,
1365 .wp-core-ui.frm-white-body .frm-button-secondary:hover,
1366 .wp-core-ui.frm-white-body .button-secondary:hover,
1367 .wp-core-ui.frm-white-body .button-secondary:focus,
1368 .wp-core-ui.frm-white-body .tablenav .button:hover,
1369 .frm_wrap .preview > .button:hover {
1370 border-color: var(--grey-300) !important;
1371 color: var(--grey-800);
1372 background: var(--grey-50) !important;
1373 box-shadow: none !important;
1374 outline: none !important;
1375 }
1376
1377 .frm-button-primary .frmsvg {
1378 color: #fff;
1379 }
1380
1381 .frm_wrap .preview i {
1382 font-size: inherit;
1383 }
1384
1385 .frm-white-body .frm-button-primary:focus,
1386 .frm-white-body .frm-button-primary:active,
1387 #frm-addons-page .button-primary:focus,
1388 #form_global_settings .button-primary:focus,
1389 #frm_upgrade_modal .button:focus {
1390 border-color: var(--primary-700) !important;
1391 background-color: var(--primary-700) !important;
1392 box-shadow: none !important;
1393 outline: none !important;
1394 }
1395
1396 .frm_wrap .preview > .button:focus,
1397 .frm_orange_button:hover,
1398 .frm_orange_button:focus,
1399 .toplevel_page_formidable #frm_upgrade_modal .button-primary:hover,
1400 .toplevel_page_formidable #frm_upgrade_modal .button-primary:focus,
1401 .toplevel_page_formidable .frm_wrap button.button-primary:hover,
1402 .toplevel_page_formidable .frm_wrap button.button-primary:focus {
1403 outline: none;
1404 }
1405
1406 .frm_orange_button:hover,
1407 .frm_orange_button:focus {
1408 border-color: var(--orange) !important;
1409 background: transparent;
1410 color: var(--orange);
1411 opacity: 1;
1412 }
1413
1414 .major-publishing-actions.frm_create_form_header {
1415 padding: 8px 0;
1416 }
1417
1418 .major-publishing-actions.frm_create_form_header .frm_create_form_header_inner {
1419 font-size: 15px;
1420 background: transparent;
1421 }
1422
1423 .frm-menu-boxes .frm_blank_form_text {
1424 padding-bottom: 26px;
1425 }
1426
1427 input.frm_insert_in_template {
1428 font-size: 10px;
1429 width: 98%;
1430 font-weight: normal
1431 }
1432
1433 /* Review request */
1434 .frm-review-notice.notice {
1435 border: 1px solid #ddd;
1436 text-align: center;
1437 position: fixed !important;
1438 z-index: 999;
1439 bottom: 0;
1440 right: 0;
1441 width: 400px;
1442 }
1443
1444 .frm-review-notice.notice form,
1445 .frm-review-notice.notice p {
1446 font-size: var(--text-sm);
1447 max-width: 600px;
1448 margin-left: auto;
1449 margin-right: auto;
1450 }
1451
1452 .frm-review-notice a {
1453 margin: 0 var(--gap-xs) !important;
1454 }
1455
1456 .frm-review-notice .frm-button-primary,
1457 .frm-review-notice .frm-button-secondary {
1458 min-width: 100px;
1459 }
1460
1461 .frm-review-notice p > span {
1462 font-size: 13px;
1463 opacity: 0.75;
1464 }
1465
1466 #frmapi-feedback {
1467 margin-top: var(--gap-lg);
1468 }
1469
1470 .frm-review-notice .frm_error,
1471 .frm-review-notice label {
1472 color: #444;
1473 text-align: left;
1474 }
1475
1476 .frm-review-notice label {
1477 font-size: var(--text-sm);
1478 }
1479
1480 .frm-floating-success-message {
1481 border-radius: 4px;
1482 right: 10px !important;
1483 bottom: 10px !important;
1484 }
1485
1486 /* Generic Classes */
1487 .frm_no_margin, /* deprecated */
1488 .frm-m-0 {
1489 margin: 0 !important;
1490 }
1491
1492 .frm-m-12 {
1493 margin: var(--gap-2xl);
1494
1495 }
1496
1497 .frm_no_top_margin, /* deprecated */
1498 .frm-mt-0 {
1499 margin-top: 0 !important;
1500 }
1501
1502 .frm_no_bottom_margin, /* deprecated */
1503 .frm-mb-0 {
1504 margin-bottom: 0 !important;
1505 }
1506
1507 .frm-mb-sm {
1508 margin-bottom: var(--gap-sm) !important;
1509 }
1510
1511 .frm-mb-md {
1512 margin-bottom: var(--gap-md) !important;
1513 }
1514
1515 .frm-mb-lg {
1516 margin-bottom: var(--gap-lg) !important;
1517 }
1518
1519 .frm-mx-sm {
1520 margin-left: var(--gap-sm) !important;
1521 margin-right: var(--gap-sm) !important;
1522 }
1523
1524 .frm-p-1 {
1525 padding: 4px;
1526 }
1527
1528 .frm-p-4 {
1529 padding: var(--gap-sm);
1530 }
1531
1532 .frm-p-6 {
1533 padding: var(--gap-md);
1534 }
1535
1536 .frm-text-md {
1537 font-size: var(--text-md);
1538 }
1539
1540 .frm-text-lg {
1541 font-size: var(--text-lg);
1542 }
1543
1544 .frm-text-xl {
1545 font-size: var(--text-xl);
1546 }
1547
1548 .frm-w-auto {
1549 width: auto !important;
1550 }
1551
1552 .frm-w-full {
1553 width: 100% !important;
1554 }
1555
1556 .frm-flex-box {
1557 display: flex;
1558 gap: var(--gap-sm);
1559 }
1560
1561 .frm-gap-xs {
1562 gap: var(--gap-xs);
1563 }
1564
1565 .frm-gap-sm {
1566 gap: var(--gap-sm);
1567 }
1568
1569 .frm-gap-md {
1570 gap: var(--gap-md);
1571 }
1572
1573 .frm-justify-between {
1574 justify-content: space-between;
1575 }
1576
1577 .frm-transition-ease {
1578 transition: all .2s ease;
1579 }
1580
1581 .frm_invisible {
1582 visibility: hidden;
1583 transition: all .2s ease;
1584 }
1585
1586 .frm_no_float {
1587 float: none;
1588 }
1589
1590 .frm_block, /* deprecated */
1591 .frm-block {
1592 display: block;
1593 }
1594
1595 .frm_inline {
1596 display: inline;
1597 }
1598
1599 .frm_inline_block {
1600 display: inline-block !important;
1601 }
1602
1603 .frm_hidden {
1604 display: none;
1605 }
1606
1607 .frm-text-right {
1608 text-align: right;
1609 }
1610
1611 .frm-border-b {
1612 border-bottom: 1px solid var(--grey-300);
1613 }
1614
1615 .frm-no-border {
1616 border: none !important;
1617 }
1618
1619 .frm-opacity-100 {
1620 opacity: 1;
1621 }
1622
1623 .frm-on-bottom {
1624 z-index: -1;
1625 }
1626 /* End Generic Classes, Start Forced Generic Classes */
1627
1628 .frm-fields p > label.frm_hidden,
1629 .frm-lookup-modal .dismiss,
1630 .frm-right-panel .inside a.frm_hidden,
1631 #form_global_settings .frm_hidden,
1632 ul.frm_form_nav > li.frm_hidden,
1633 a.frm_hidden,
1634 .button.frm_hidden,
1635 .wp-core-ui .button.frm_hidden {
1636 display: none;
1637 }
1638
1639 .postbox .inside > p.frm_no_bottom_margin:last-child {
1640 margin-bottom: 0 !important;
1641 }
1642
1643 .frm_no_section_fields.frm_block {
1644 display: block;
1645 }
1646
1647 .actions.frm_visible_overflow {
1648 overflow: visible !important;
1649 }
1650
1651 .frm_full_opacity, /* deprecated */
1652 .frm_submit .frm_full_opacity,
1653 .frm_submit .frm-opacity-100 {
1654 opacity: 1;
1655 }
1656
1657 .frm-dropdown-menu.frm-on-top {
1658 z-index: 99999;
1659 }
1660
1661 /* End Forced Generic Classes */
1662
1663 .frm_forms.with_frm_style {
1664 max-width: 100%;
1665 }
1666
1667 .post-type-frm_display .wrap > .subsubsub,
1668 .post-type-frm_display .wrap > .icl_subsubsub,
1669 .frm_form_settings > p {
1670 margin: 6px var(--gap-md);
1671 padding: 0;
1672 }
1673
1674 .frm-entry-container {
1675 margin: 0 40px 40px;
1676 padding: 0;
1677 }
1678
1679 #form_reports_page .frm-inner-content {
1680 width: calc(100% - 40px);
1681 max-width: 900px;
1682 margin: 20px auto;
1683 padding: 20px;
1684 }
1685
1686 .frm_inner_field_container > .frm_form_fields {
1687 clear: both;
1688 }
1689
1690 .post-type-frm_display h2,
1691 .frm_wrap h2 {
1692 margin-top: 0 !important;
1693 font-size: var(--text-lg);
1694 line-height: var(--leading);
1695 }
1696
1697 .post-type-frm_display .wrap > h2:first-child,
1698 .frm_wrap .wrap > h2:first-child {
1699 padding-top: 0;
1700 margin-top: 0 !important;
1701 font-size: var(--text-lg);
1702 }
1703
1704 #frm_form_editor_container {
1705 position: relative;
1706 margin-top: 28px;
1707 }
1708
1709 .form-field p {
1710 /* for conflicts */
1711 background: none;
1712 border: none;
1713 }
1714
1715 .form-field label.frm_primary_label {
1716 display: block;
1717 float: none;
1718 width: auto;
1719 }
1720
1721 #frm_view_editor_left label, /* Views */
1722 #frm_view_editor_left .frm_primary_label, /* Views */
1723 .frm-dialog .frm-sub-label,
1724 .frm-dialog label,
1725 .dropdown .frm_primary_label,
1726 .accordion-container label,
1727 .frm-fields td > label,
1728 .frm-fields td > div > label,
1729 .frm_form_field > label:first-child,
1730 .frm-fields p > label,
1731 .frm_on_submit_type > label,
1732 .post-type-frm_display .frm_form_field > label,
1733 #new_fields .frm_primary_label,
1734 #form_global_settings .frm_primary_label,
1735 #frm_form_editor_container .frm_primary_label {
1736 color: var(--grey-700);
1737 margin: 0 0 3px;
1738 padding: 0;
1739 width: auto;
1740 font-size: var(--text-sm);
1741 display: block;
1742 line-height: var(--leading);
1743 }
1744
1745 .frm-fields td input + label {
1746 display: inline;
1747 }
1748
1749 #frm_form_editor_container .edit_field_type_end_divider .frm_primary_label,
1750 #frm_form_editor_container .edit_field_type_break .frm_primary_label {
1751 display: none;
1752 }
1753
1754 form .frm_primary_label input {
1755 font-size: 12px;
1756 }
1757
1758 .with_frm_style form .form-field {
1759 margin-bottom: 20px;
1760 }
1761
1762 #frm_builder_page .with_frm_style form .frm_combo_inputs_container > .form-field {
1763 margin-bottom: 0;
1764 }
1765
1766 .frm_description,
1767 .with_frm_style form div.description,
1768 .frm_error,
1769 .with_frm_style form div.description textarea {
1770 padding: 0;
1771 font-size: 11px;
1772 }
1773
1774 .with_frm_style .description {
1775 color: inherit;
1776 }
1777
1778 #frm_form_editor_container .divider_section_only .frm_primary_label {
1779 display: flex;
1780 align-items: center;
1781 gap: var(--gap-xs);
1782 font-size: 20px;
1783 }
1784
1785 #frm_form_editor_container .divider_section_only .frm_primary_label .frm-sub-label {
1786 padding: 0;
1787 }
1788
1789 form .form-field.frm_field_loading {
1790 margin-bottom: 0;
1791 min-height: 0;
1792 padding: 0;
1793 text-align: center;
1794 }
1795
1796 .frm_sorting > .frm_field_loading .frm_visible_spinner.frm-wait {
1797 margin-bottom: 10px;
1798 }
1799
1800 .frm_sorting > .frm_field_loading ~ .frm_field_loading .frm_visible_spinner.frm-wait {
1801 margin-bottom: 0;
1802 display: none;
1803 }
1804
1805 .frm_description,
1806 .with_frm_style form div.description,
1807 .frm_error {
1808 margin: 0;
1809 }
1810
1811 .frm_error {
1812 color: #B94A48;
1813 }
1814
1815 form .frm_blank_field input,
1816 form .frm_blank_field textarea,
1817 form .frm_blank_field select,
1818 form .frm_blank_field .frm-g-recaptcha iframe,
1819 form .frm_blank_field .g-recaptcha iframe {
1820 border-color: #B94A48;
1821 }
1822
1823 form .frm_blank_field label {
1824 color: #B94A48;
1825 }
1826
1827 .frm_required {
1828 color: #B94A48;
1829 }
1830
1831 .with_frm_style .wp-editor-container textarea,
1832 .postbox .wp-editor-container textarea,
1833 .frm_remove_border {
1834 border: none;
1835 }
1836
1837 .with_frm_style .mceIframeContainer,
1838 .postbox .mceIframeContainer {
1839 background-color: #fff;
1840 }
1841
1842 .frm_pro_license_msg {
1843 clear: left;
1844 margin-top: 10px;
1845 }
1846
1847 .frm-license-input {
1848 position: relative;
1849 }
1850
1851 .frm-license-input span {
1852 position: absolute;
1853 right: 0;
1854 top: 5px;
1855 padding: 0 10px;
1856 font-size: 15px;
1857 }
1858
1859 .frm-license-input .frmsvg {
1860 width: 20px;
1861 height: 20px;
1862 margin-left: 5px;
1863 vertical-align: text-top;
1864 }
1865
1866 .frm-license-input .frmsvg,
1867 .frm-license-input span,
1868 .frm-license-input i {
1869 color: rgb(0, 131, 26);
1870 }
1871
1872 .upgrade_to_pro {
1873 padding: 10px 25px 25px;
1874 max-width: 700px;
1875 margin: 20px auto !important;
1876 }
1877
1878 .upgrade_to_pro .error {
1879 display: none;
1880 }
1881
1882 .toplevel_page_formidable #wpbody-content > .error {
1883 margin: 1px;
1884 padding: 5px 12px;
1885 }
1886
1887 .frm_error_style,
1888 .frm_warning_style,
1889 .frm_note_style,
1890 .frm_message,
1891 #post-body-content .frm_updated_message,
1892 div.frm_updated_message {
1893 border-radius: var(--small-radius);
1894 background-color: #D5F2DC;
1895 color: #1E561F;
1896 padding: var(--gap-sm) var(--gap-md);
1897 font-size: var(--text-sm);
1898 margin: var(--gap-sm) 0;
1899 text-align: left;
1900 }
1901
1902 #frm_top_bar + .wrap > .frm_updated_message, #frm_top_bar + .wrap > .frm_warning_style {
1903 display: inline-block;
1904 width: 100%;
1905 box-sizing: border-box;
1906 }
1907
1908 #post-body-content > .frm_updated_message {
1909 margin: 5px 65px;
1910 }
1911
1912 #form_global_settings #post-body-content > .frm_updated_message,
1913 #form_global_settings #post-body-content > .frm_warning_style {
1914 margin: 5px 25px;
1915 }
1916
1917 .frm_error_style {
1918 color: #973937;
1919 background-color: #EBCCCC;
1920 clear: both;
1921 }
1922
1923 .frm_error_style a {
1924 text-decoration: underline;
1925 font-weight: 600;
1926 }
1927
1928 .frm_error_style svg {
1929 opacity: .7;
1930 }
1931
1932 .frm_warning_style {
1933 color: #7A4D05;
1934 background-color: #FFF2D2;
1935 }
1936
1937 .frm_warning_heading{
1938 font-weight: bold;
1939 margin-bottom:4px;
1940 }
1941
1942 /* Warning message dismiss */
1943 .frm_warning_style {
1944 position: relative;
1945 padding-right: calc(var(--gap-md) + 15px);
1946 }
1947
1948 body.rtl .frm_warning_style {
1949 padding-right: var(--gap-md);
1950 padding-left: calc(var(--gap-md) + 15px);
1951 }
1952
1953 .frm-warning-dismiss {
1954 position: absolute;
1955 top: 10px;
1956 right: 10px;
1957 display: flex;
1958 cursor: pointer;
1959 transition: opacity 0.2s ease-out;
1960 }
1961
1962 body.rtl .frm-warning-dismiss {
1963 left: 10px;
1964 right: auto;
1965 }
1966
1967 .frm-warning-dismiss:hover {
1968 opacity: 0.8;
1969 }
1970
1971 .frm-warning-dismiss.frmsvg,
1972 .frm-warning-dismiss.frmsvg svg {
1973 width: 15px;
1974 height: 15px;
1975 }
1976
1977 .frm_note_style {
1978 background: rgba(188, 224, 253, 0.23);
1979 color: var(--grey-700);
1980 }
1981
1982 .frm-banner-alert {
1983 text-align: left;
1984 margin: 0;
1985 border-radius: 0;
1986 padding: 10px 0 10px 40px;
1987 }
1988
1989 .frm-banner-alert a {
1990 color: var(--primary-500);
1991 font-weight: 400;
1992 text-decoration: none;
1993 }
1994
1995 .frm_updated_message ul,
1996 .frm_updated_message li,
1997 .frm_warning_style ul,
1998 .frm_warning_style li,
1999 .frm_error_style ul,
2000 .frm_error_style li {
2001 margin: 0;
2002 }
2003
2004 .frm-inline-message {
2005 border: 1px solid var(--primary-700);
2006 border-radius: var(--small-radius);
2007 color: var(--primary-700);
2008 background: #fff;
2009 text-align: center;
2010 padding: 20px;
2011 font-size: var(--text-sm);
2012 line-height: var(--leading);
2013 }
2014
2015 .frm-inline-message a {
2016 text-decoration: underline;
2017 font-weight: 600;
2018 color: var(--primary-700);
2019 }
2020
2021 .frm_pro_heading span {
2022 margin-top: 10px;
2023 }
2024
2025 .frm_pro_heading .alignright {
2026 text-align: right;
2027 }
2028
2029 .frm-yes {
2030 color: var(--green);
2031 font-size: var(--text-xl);
2032 }
2033
2034 .frm-nope {
2035 color: var(--grey-400);
2036 font-size: var(--text-xl);
2037 }
2038
2039 .upgrade_to_pro a {
2040 color: var(--orange);
2041 }
2042
2043 .upgrade_to_pro table .frmsvg {
2044 height: var(--text-xl);
2045 width: var(--text-xl);
2046 }
2047
2048 .upgrade_to_pro table.widefat {
2049 background-color: #fff;
2050 border-collapse: collapse;
2051 }
2052
2053 .frm-white-body .upgrade_to_pro table th,
2054 .upgrade_to_pro table td {
2055 padding: 10px 15px;
2056 border: 1px solid var(--grey-300);
2057 line-height: var(--leading);
2058 font-size: var(--text-sm);
2059 }
2060
2061 .upgrade_to_pro table th.frmcenter {
2062 text-align: center;
2063 }
2064
2065 .widefat th.frm_table_break {
2066 background-color: var(--sidebar-color);
2067 }
2068
2069 h2.frm-h2 + .howto {
2070 color: var(--medium-grey);
2071 max-width: 850px;
2072 margin: 5px 0 20px;
2073 }
2074
2075 .frm-admin-page-addons #frm-using-lite {
2076 display: none;
2077 }
2078
2079 .frm-admin-page-addons .frm-search {
2080 margin-top: 0;
2081 }
2082
2083 .frm-addons {
2084 margin-top: var(--gap-lg);
2085 display: grid;
2086 grid-template-columns: 1fr 1fr 1fr;
2087 grid-gap: var(--gap-md);
2088 }
2089
2090 .frm-addons,
2091 .frm-addons h2,
2092 .frm-addons h3 {
2093 color: var(--grey-700);
2094 }
2095
2096 .frm-addons h2 {
2097 font-size: 17px;
2098 }
2099
2100 .frm-addons h3 {
2101 margin-top: 0;
2102 }
2103
2104 .frm-card {
2105 width: 100%;
2106 border-radius: 10px;
2107 border: 1px solid var(--grey-300);
2108 opacity: 1;
2109 transition: opacity 1s;
2110 }
2111
2112 .frm-fade {
2113 opacity: 0;
2114 transition: all 1s;
2115 }
2116
2117 /* Add-on tiles */
2118 .frm-addons .frm-card.frm-addon-not-installed {
2119 position: relative;
2120 }
2121
2122 .frm-addons .plugin-card-top {
2123 min-height: 155px;
2124 padding-top: var(--gap-lg);
2125 overflow: hidden;
2126 }
2127
2128 .frm-addons .plugin-card-top h2 {
2129 margin-top: 0;
2130 font-weight: 400;
2131 }
2132
2133 .frm-template-row p,
2134 .frm-addons .plugin-card-top p {
2135 opacity: 0.8;
2136 }
2137
2138 .frm-addons .plugin-card-bottom {
2139 padding: 5px 20px 20px;
2140 text-align: center;
2141 background: transparent;
2142 border-top: none;
2143 }
2144
2145 .frm-addons .plugin-card-bottom,
2146 .frm-addons .plugin-card-bottom .button {
2147 font-size: 15px;
2148 }
2149
2150 .frm-addons .button {
2151 float: right;
2152 }
2153
2154 .frm-addons .addon-status {
2155 float: left;
2156 padding-top: 4px;
2157 }
2158
2159 .frm-addon-active .button {
2160 visibility: hidden;
2161 }
2162
2163 .frm-save-and-reload-options {
2164 margin-top: 10px;
2165 font-size: 13px;
2166 }
2167
2168 .frm-save-and-reload,
2169 .frm-save-and-reload + .frm-button-secondary {
2170 visibility: visible !important;
2171 }
2172
2173 .addon-status-label {
2174 opacity: .7;
2175 }
2176
2177 .frm-addon-active .addon-status-label {
2178 color: var(--green);
2179 opacity: 1;
2180 }
2181
2182 .frm-addon-error {
2183 position: absolute;
2184 top: 55px;
2185 left: 10px;
2186 right: 10px;
2187 font-weight: bold;
2188 text-align: center;
2189 }
2190
2191 /* Form Templates */
2192
2193 .frm-featured-form .frm-inner-circle {
2194 margin: 0 auto 5px;
2195 }
2196
2197 .frm-new-template.plugin-card-bottom {
2198 overflow: visible;
2199 }
2200
2201 #frm-new-template p:first-child {
2202 margin-top: 0;
2203 }
2204
2205 .frm-admin-page-formidableedit #wpbody-content > *:not(.frm-review-notice):not(.frm_previous_install):not(.frm-banner-alert),
2206 #wpbody-content > .updated,
2207 #wpbody-content > #update-nag,
2208 #wpbody-content > .update-nag,
2209 #wpbody-content > .notice:not(.frm-review-notice),
2210 #wpbody-content > .error:not(.frm_previous_install),
2211 .frm-white-body .updated,
2212 .frm-white-body .notice:not(.frm-review-notice),
2213 .frm-white-body .error:not(.frm_previous_install)
2214 {
2215 display: none;
2216 }
2217
2218 .frm-admin-page-formidableedit #frm_builder_page {
2219 display: block !important;
2220 }
2221
2222 .frm-white-body .updated,
2223 .frm-white-body .notice,
2224 .frm-white-body .error {
2225 margin: 0;
2226 padding: 10px 20px;
2227 }
2228
2229 .frm-modal .postbox,
2230 #frm_new_form_modal .postbox {
2231 max-height: 600px;
2232 overflow: hidden;
2233 margin-bottom: 0;
2234 }
2235
2236 .frm-modal .postbox .frm_modal_top,
2237 .frm-dialog .frm_common_modal .postbox > div:first-child {
2238 padding: var(--gap-md) var(--gap-md) 0;
2239 position: relative;
2240 }
2241
2242 .frm-modal .postbox .frm-modal-title,
2243 .frm-dialog .frm_common_modal .postbox > div:first-child > div:first-child {
2244 display: inline-block;
2245 font-size: var(--text-xl);
2246 color: var(--grey-900);
2247 }
2248
2249 .frm-inline-modal > a.dismiss,
2250 .frm-modal .postbox > a.dismiss,
2251 .frm-modal .postbox .frm-modal-title + div:last-child,
2252 .frm-dialog .frm_common_modal .postbox > div:first-child > div:last-child {
2253 position: absolute;
2254 right: 30px;
2255 top: 25px;
2256 z-index: 2;
2257 }
2258
2259 body.rtl .frm-inline-modal > a.dismiss,
2260 body.rtl .frm-modal .postbox > a.dismiss,
2261 body.rtl .frm-modal .postbox .frm-modal-title + div:last-child,
2262 body.rtl .frm-dialog .frm_common_modal .postbox > div:first-child > div:last-child {
2263 right: unset;
2264 left: 30px;
2265 }
2266
2267 .frm-info-modal .postbox > a.dismiss,
2268 .frm-inline-modal > a.dismiss {
2269 right: 13px;
2270 top: 13px;
2271 }
2272
2273 .frm-modal .postbox .frm-modal-title + div:last-child a,
2274 .frm-modal a.dismiss .frmsvg,
2275 .frm_common_modal .frm_modal_top a .frmsvg {
2276 color: var(--grey-900);
2277 }
2278
2279 .frm-modal .frm_modal_content > div.inside,
2280 .frm_common_modal .frm_modal_content > div.inside {
2281 padding: var(--gap-md);
2282 margin: 0;
2283 font-size: var(--text-sm);
2284 color: var(--grey-700);
2285 }
2286
2287 .frm_common_modal .postbox {
2288 display: flex;
2289 flex-direction: column;
2290 }
2291
2292 .frm-modal .postbox > div.inside .cta-inside {
2293 overflow-y: auto;
2294 height: auto;
2295 padding: 0 var(--gap-sm);
2296 }
2297
2298 .frm_modal_footer {
2299 padding: 0 var(--gap-md) var(--gap-sm);
2300 text-align: right;
2301 }
2302
2303 body.frm-body-with-open-modal {
2304 overflow-y: hidden;
2305 }
2306
2307 #frm_new_form_modal .postbox > div.inside {
2308 max-height: 490px;
2309 overflow-y: auto;
2310 overflow-x: hidden;
2311 margin: 0;
2312 padding: 10px 0 0;
2313 }
2314
2315 #frm_new_form_modal .postbox > div.inside .cta-inside {
2316 overflow-y: auto;
2317 height: auto;
2318 padding: 0 var(--gap-md);
2319 }
2320
2321 #frm_new_form_modal .accordion-container {
2322 width: 100%;
2323 }
2324
2325 .frm-templates-list {
2326 margin-top: 0;
2327 }
2328
2329 .frm-templates-list.frm_grid_container li {
2330 margin-bottom: 0;
2331 }
2332
2333 .frm-templates-list li {
2334 vertical-align: top;
2335 position: relative;
2336 box-sizing: border-box;
2337 border-radius: 6px;
2338 border: 1px solid transparent;
2339 text-align: left;
2340 }
2341
2342 .frm-templates-list li:not(.frm_hidden) {
2343 display: inline-block;
2344 }
2345
2346 .frm-templates-list.frm-categories-list li {
2347 width: 100%;
2348 }
2349
2350 .frm-templates-list li.frm-selectable {
2351 cursor: pointer;
2352 }
2353
2354 .frm-templates-list li.frm-selectable:hover {
2355 background: var(--light-blue);
2356 border-color: rgba(65, 153, 253, 0.5);
2357 }
2358
2359 .frm-templates-list li.frm-selectable:hover h3,
2360 .frm-templates-list li.frm-selectable:hover p {
2361 max-width: calc( 100% - 65px );
2362 }
2363
2364 .frm-templates-list .frm-featured-form {
2365 display: flex;
2366 width: 100%;
2367 }
2368
2369 .frm-templates-list li .frm-featured-form {
2370 padding: 7px 5px;
2371 }
2372
2373 .frm-templates-list li li > div {
2374 padding-left: 0;
2375 }
2376
2377 .frm-templates-list li > div > div {
2378 vertical-align: middle;
2379 }
2380
2381 .frm-templates-list .frm-inner-circle,
2382 .frm-category-icon, /* Deprecated */
2383 .frm-icon-wrapper {
2384 background: var(--primary-500);
2385 border-radius: var(--small-radius);
2386 color: #fff;
2387 width: 40px;
2388 height: 40px;
2389 font-size: 18px;
2390 box-sizing: border-box;
2391 align-self: center;
2392 justify-content: center;
2393 align-items: center;
2394 display: inline-flex;
2395 }
2396
2397 .frm-templates-list .frm-inner-circle .frmsvg {
2398 vertical-align: top;
2399 }
2400
2401 .frm-templates-list li .frm-category-icon {
2402 overflow: hidden;
2403 align-self: flex-start;
2404 }
2405
2406 .frm-templates-list .frm-template-details {
2407 /* the content container to the right of the icon in Create new form modal */
2408 display: inline-block;
2409 width: calc( 100% - 40px );
2410 padding-left: var(--gap-sm);
2411 box-sizing: border-box;
2412 transform: translateY(-2px);
2413 }
2414
2415 .frm-templates-list li h3,
2416 .frm-templates-list li p {
2417 text-align: left;
2418 margin: 0;
2419 white-space: nowrap;
2420 text-overflow: ellipsis;
2421 overflow: hidden;
2422 }
2423
2424 .frm-templates-list li h3,
2425 .frm-templates-list .frm-install-template h3 {
2426 font-size: var(--text-sm) !important;
2427 }
2428
2429 .frm-templates-list .frm-install-template div {
2430 text-align: left;
2431 }
2432
2433 #frm_new_form_modal .frm-search {
2434 width: 100%;
2435 margin: var(--gap-sm) 0 var(--gap-md);
2436 }
2437
2438 #frm_leave_email,
2439 #frm_code_from_email
2440 {
2441 width: 480px;
2442 }
2443
2444 #frm_new_form_modal #template-search-input {
2445 width: 100%;
2446 }
2447
2448 #frm-email-block .frm-with-left-icon .frmsvg {
2449 padding: 0;
2450 top: 0;
2451 left: 13px;
2452 }
2453
2454 #frm_new_form_modal .accordion-container {
2455 display: inline-block;
2456 padding: 0;
2457 border-top: 1px solid var(--grey-300);
2458 box-sizing: border-box;
2459 margin: 0 5px;
2460 width: calc( 100% - 10px );
2461 }
2462
2463 #frm_new_form_modal .accordion-section-title {
2464 padding: 0;
2465 }
2466
2467 #frm_new_form_modal .accordion-section-title:hover,
2468 .control-section:hover .accordion-section-title,
2469 #frm_new_form_modal .accordion-section.open .accordion-section-title
2470 {
2471 background: #fff !important;
2472 border-bottom-color: transparent;
2473 }
2474
2475 #frm_new_form_modal .accordion-section.open:hover {
2476 border-bottom-color: transparent;
2477 }
2478
2479 #frm_new_form_modal .accordion-section {
2480 padding: 8px 0 4px;
2481 }
2482
2483 #frm_new_form_modal .accordion-section + .accordion-section {
2484 border-top: 1px solid var(--grey-300);
2485 border-radius: 0;
2486 }
2487
2488 .frm-templates-list.frm-categories-list li > div > div:last-child,
2489 #frm_new_form_modal .accordion-section .frm-featured-form
2490 {
2491 padding-left: 0;
2492 }
2493
2494 #frm_new_form_modal .frm-templates-list.frm-categories-list .accordion-section-title {
2495 padding-left: var(--gap-sm);
2496 }
2497
2498 #frm_new_form_modal .frm-templates-list.frm-categories-list li.frm-selectable {
2499 padding: 0 10px;
2500 overflow: hidden;
2501 }
2502
2503 #frm_new_form_modal .accordion-section-content {
2504 padding: var(--gap-sm);
2505 }
2506
2507 .frm-hover-icons {
2508 position: absolute;
2509 right: 0;
2510 top: calc( ( 58px - 2px - 22px ) / 2 ); /* Template item height - borders - icon height */
2511 max-width: 91px;
2512 height: 100%;
2513 box-sizing: border-box;
2514 padding: 0 10px 0 5px !important;
2515 border-radius: var(--small-radius);
2516 text-align: right;
2517 display: flex;
2518 gap: 5px;
2519 }
2520
2521 .frm-ready-made-solution .frm-hover-icons {
2522 visibility: hidden;
2523 }
2524
2525 .frm-ready-made-solution:hover .frm-hover-icons {
2526 visibility: visible;
2527 }
2528
2529 .frm-hover-icons a {
2530 width: 22px;
2531 height: 22px;
2532 font-size: var(--text-md);
2533 display: inline-flex;
2534 align-items: center;
2535 justify-content: center;
2536 border-radius: 50%;
2537 box-sizing: border-box;
2538 line-height: var(--leading);
2539 text-align: center;
2540 }
2541
2542 .frm-hover-icons > .frm-preview-form,
2543 .frm-hover-icons > .frm-delete-form {
2544 border: 1px solid var(--primary-500);
2545 }
2546
2547 .frm-hover-icons > .frm-create-form,
2548 .frm-ready-made-solution .frm-hover-icons a {
2549 background-color: var(--primary-500);
2550 }
2551
2552 .frm-hover-icons > a .frmsvg {
2553 width: 14px;
2554 height: 14px;
2555 vertical-align: baseline;
2556 }
2557
2558 .frm-hover-icons > .frm-preview-form .frmsvg,
2559 .frm-hover-icons > .frm-delete-form .frmsvg {
2560 color: var(--primary-500);
2561 }
2562
2563 .frm-hover-icons > .frm-unlock-form {
2564 background-color: var(--primary-500);
2565 }
2566
2567 .frm-hover-icons > .frm-unlock-form .frmsvg {
2568 background-color: var(--primary-500);
2569 }
2570
2571 .frm-ready-made-solution .frmsvg {
2572 width: 14px;
2573 height: 14px;
2574 }
2575
2576 .frm-hover-icons .frm-create-form svg,
2577 .frm-ready-made-solution .frm-hover-icons svg {
2578 color: #fff;
2579 }
2580
2581 .frm-hover-icons .frm-create-form:hover,
2582 .frm-ready-made-solution .frm-hover-icons a:hover,
2583 .frm-hover-icons > .frm-unlock-form:hover,
2584 .frm-hover-icons > .frm-unlock-form:hover .frmsvg
2585 {
2586 background-color: var(--primary-700) !important;
2587 }
2588
2589 .frm-hover-icons .frm-preview-form:hover,
2590 .frm-hover-icons .frm-delete-form:hover
2591 {
2592 border: 1px solid var(--primary-700) !important;
2593 }
2594
2595 .frm-hover-icons .frm-preview-form:hover .frmsvg,
2596 .frm-hover-icons .frm-delete-form:hover .frmsvg {
2597 color: var(--primary-700) !important;
2598 }
2599
2600 .frm-application-card h4 .frmsvg,
2601 .frm-locked-template h3 .frmsvg {
2602 height: var(--text-sm);
2603 width: var(--text-sm);
2604 vertical-align: text-top;
2605 color: var(--grey-500);
2606 }
2607
2608 #frm_new_form_modal .frm-use-this-template {
2609 margin-left: 10px;
2610 }
2611
2612 #frm_new_form_modal #frm-preview-block {
2613 padding: var(--gap-md) var(--gap-lg);
2614 overflow-x: hidden;
2615 }
2616
2617 #frm_new_form_modal #frm-details-block {
2618 padding: var(--gap-md) var(--gap-lg);
2619 }
2620
2621 .frm-modal-back {
2622 cursor: pointer;
2623 margin-right: 4px;
2624 }
2625
2626 .frm-modal-cancel {
2627 float: left;
2628 }
2629
2630 .frm-plan-required-tag {
2631 margin-left: 5px;
2632 transform: translateY(-1px);
2633 background: #FDE6DE;
2634 color: #F15A24;
2635 }
2636
2637 .frm-ready-made-solution .frm-meta-tag {
2638 width: fit-content;
2639 background: #FDE6DE;
2640 color: #F15A24;
2641 }
2642
2643 .frm-meta-tag {
2644 font-size: 10px;
2645 padding: 4px 6px;
2646 border-radius: 4px;
2647 text-transform: uppercase;
2648 font-weight: normal;
2649 display: inline-block;
2650 line-height: 12px;
2651 }
2652
2653 #frm_new_form_modal.frm-expired #frm-create-block,
2654 #frm_new_form_modal.frm-expiring #frm-create-block {
2655 max-height: 450px;
2656 }
2657
2658 #frm-create-footer {
2659 padding: 15px 20px;
2660 }
2661
2662 #frm_code_from_email_options {
2663 margin-top: 20px;
2664 }
2665
2666 #frm_code_from_email_options * {
2667 color: var(--primary-500);
2668 }
2669
2670 #frm-email-block p,
2671 #frm-code-block p,
2672 #frm-renew-block p
2673 {
2674 padding: 0 40px;
2675 max-width: 400px;
2676 margin: 0 auto 20px;
2677 }
2678
2679 li .frm-hover-icons .frm-preview-form,
2680 .frm-hover-icons .frm-unlock-form,
2681 .frm-locked-template .frm-hover-icons .frm-create-form,
2682 #frm_new_form_modal .frm-modal-back ~ span,
2683 #frm_new_form_modal .postbox > div:first-child ~ div,
2684 .frm-modal-back,
2685 #frm_new_form_modal:not([frm-page="create"]) a.dismiss,
2686 #frm_code_from_email_error span,
2687 #frm_leave_email_error span,
2688 #frm_new_form_modal .frm-delete-form,
2689 #frm-details-block #frm-new-template button,
2690 #frm-create-title span[frm-type="template"],
2691 #frm-create-title[frm-type="template"] span[frm-type="form"]
2692 {
2693 display: none;
2694 }
2695
2696 #frm_new_form_modal:not([frm-page="create"]) .frm-modal-back,
2697 #frm_new_form_modal[frm-page="create"] #frm-create-title,
2698 #frm-create-title[frm-type="template"] span[frm-type="template"],
2699 #frm_new_form_modal[frm-page="preview"] #frm-preview-title,
2700 #frm_new_form_modal[frm-page="details"] #frm-create-title,
2701 #frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-title,
2702 #frm_new_form_modal[frm-page="email"] #frm-email-title,
2703 #frm_new_form_modal[frm-page="code"] #frm-email-title,
2704 #frm_new_form_modal[frm-page="renew"] #frm-renew-title,
2705 #frm_code_from_email_error[frm-error="wrong-code"] span[frm-error="wrong-code"],
2706 #frm_code_from_email_error[frm-error="empty"] span[frm-error="empty"],
2707 #frm_code_from_email_error[frm-error="custom"] span[frm-error="custom"],
2708 #frm_leave_email_error[frm-error="invalid"] span[frm-error="invalid"],
2709 #frm_leave_email_error[frm-error="empty"] span[frm-error="empty"]
2710 {
2711 display: inline-block;
2712 }
2713
2714 .frm-locked-template .frm-hover-icons .frm-unlock-form,
2715 li[data-preview] .frm-hover-icons .frm-preview-form,
2716 #frm_new_form_modal .frm-selectable[data-custom="1"] .frm-hover-icons .frm-delete-form {
2717 display: inline-flex;
2718 }
2719
2720 #frm_new_form_modal[frm-page="create"] #frm-create-block,
2721 #frm_new_form_modal[frm-page="preview"] #frm-preview-block,
2722 #frm_new_form_modal[frm-page="details"] #frm-details-block,
2723 #frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-block,
2724 #frm_new_form_modal[frm-page="email"] #frm-email-block,
2725 #frm_new_form_modal[frm-page="code"] #frm-code-block,
2726 #frm_new_form_modal[frm-page="renew"] #frm-renew-block,
2727 #frm_new_form_modal[frm-page="create"] #frm-create-footer,
2728 #frm_new_form_modal[frm-page="preview"] #frm-preview-footer,
2729 #frm_new_form_modal[frm-page="details"] #frm-details-footer,
2730 #frm_new_form_modal[frm-page="upgrade"] #frm-upgrade-footer,
2731 #frm_new_form_modal[frm-page="email"] #frm-email-footer,
2732 #frm_new_form_modal[frm-page="code"] #frm-code-footer,
2733 #frm_new_form_modal[frm-page="renew"] #frm-renew-footer
2734 {
2735 display: block;
2736 }
2737
2738 .frm-modal-back svg {
2739 color: #7F7F7F;
2740 }
2741
2742 #frm-upgrade-body-list-wrapper > div {
2743 display: inline-block;
2744 width: calc( 100% / 3 );
2745 vertical-align: top;
2746 text-align: left;
2747 margin-bottom: 10px;
2748 }
2749
2750 #frm-upgrade-body-list-wrapper ul {
2751 padding-left: 40px;
2752 }
2753
2754 #frm-upgrade-body-list-wrapper ul li:before {
2755 content: "\2022";
2756 color: var(--primary-500);
2757 display: inline-block;
2758 width: 1em;
2759 margin-left: -1em;
2760 }
2761
2762 /* Embed Form Modal */
2763
2764 .frm-embed-modal-content {
2765 padding: var(--gap-md);
2766 }
2767
2768 .frm-embed-modal-content.frm-loading-page-options {
2769 display: flex;
2770 justify-content: center;
2771 }
2772
2773 #frm_embed_modal .frm_embed_example {
2774 background: var(--sidebar-color);
2775 border: 1px solid var(--sidebar-hover);
2776 border-radius: var(--small-radius);
2777 color: var(--grey-900);
2778 font-size: var(--text-sm);
2779 padding-right: var(--gap-lg);
2780 width: 100%;
2781 height: auto !important;
2782 resize: none;
2783 }
2784
2785 #frm_embed_modal textarea.frm_embed_example {
2786 padding-bottom: 0;
2787 }
2788
2789 .frm-embed-modal-content > div a {
2790 position: absolute;
2791 right: 0;
2792 top: 0;
2793 }
2794
2795 .frm-embed-modal-content > div {
2796 position: relative;
2797 margin-bottom: var(--gap-sm);
2798 }
2799
2800 .frm-embed-modal-content > div:last-child {
2801 margin-bottom: 0;
2802 }
2803
2804 .frm-embed-modal-content svg[id^="frm_copy_embed_"] {
2805 position: absolute;
2806 bottom: calc( ( 38px - 18px ) / 2 ); /* Input height - SVG height */
2807 right: 10px;
2808 cursor: pointer;
2809 opacity: 0.5;
2810 }
2811
2812 .frm-border-info-box,
2813 .frm-embed-modal-option {
2814 border-radius: var(--small-radius);
2815 border: 1px solid var(--grey-300);
2816 padding: var(--gap-sm);
2817 cursor: pointer;
2818 display: flex;
2819 gap: var(--gap-sm);
2820 font-size: var(--text-sm);
2821 }
2822
2823 .frm-embed-modal-option + .frm-embed-modal-option {
2824 margin-top: var(--gap-sm);
2825 }
2826
2827 .frm-collapsed .frmsvg,
2828 .caret.rotate-270,
2829 .frm-embed-modal-option .caret {
2830 align-self: center;
2831 margin-left: auto;
2832 transform: rotate(-90deg);
2833 }
2834
2835 #frm_embed_modal .frm_modal_footer {
2836 display: none;
2837 }
2838
2839 #frm_embed_modal.frm-on-page-2 .frm_modal_footer {
2840 display: block;
2841 }
2842
2843 .frm-embed-modal-content ul {
2844 max-height: 300px;
2845 overflow-y: scroll;
2846 }
2847
2848 .frm-embed-modal-wrapper.frm-dialog {
2849 overflow: visible;
2850 }
2851
2852 /* Bulk Options */
2853 #frm-bulk-modal .frm_grid_container {
2854 grid-template-columns: repeat(12, 8.33%);
2855 grid-gap: 0;
2856 }
2857
2858 #frm-bulk-modal .frm8 {
2859 border-right: 1px solid var(--grey-300);
2860 padding: 10px 20px 10px var(--gap-lg);
2861 }
2862
2863 #frm-bulk-modal .frm4 {
2864 padding: 10px 0;
2865 }
2866
2867 .frm-inline-modal .howto {
2868 margin: 5px 0 10px;
2869 color: var(--grey);
2870 }
2871
2872 .frm-inline-modal .frm_code_list + .howto {
2873 margin-bottom: 0;
2874 }
2875
2876 #frm_bulk_options {
2877 height: 240px;
2878 width: 100%;
2879 border: none;
2880 box-shadow: none;
2881 padding: 0;
2882 }
2883
2884 .frm-bulk-edit-link {
2885 text-align: right;
2886 font-size: var(--text-sm);
2887 padding: 0 5px 10px;
2888 }
2889
2890 .frm-small-add {
2891 font-size: var(--text-sm) !important;
2892 }
2893
2894 .frm-small-add span {
2895 color: var(--primary-500);
2896 font-size: 12px;
2897 height: 12px;
2898 width: 12px;
2899 }
2900
2901 .frm_no_captcha_text {
2902 font-weight: bold;
2903 color: #AA0000;
2904 }
2905
2906 .frm_image_from_url {
2907 height: 50px;
2908 }
2909
2910 .frm-right-panel .inside a.frm_pro_tip,
2911 a.frm_pro_tip {
2912 font-size: var(--text-sm);
2913 display: inline-block;
2914 color: var(--grey-700);
2915 background: #FFE7DE;
2916 border-radius: var(--small-radius);
2917 padding: 5px 15px;
2918 margin: 0 auto;
2919 display: flex;
2920 align-items: center;
2921 }
2922
2923 a.frm_pro_tip:hover {
2924 color: var(--grey-700);
2925 border-color: var(--primary-500);
2926 }
2927
2928 a.frm_pro_tip:hover .frmsvg {
2929 fill: var(--primary-500);
2930 }
2931
2932 .frm_field_list .frm_pro_tip {
2933 margin: 10px 15px;
2934 position: relative;
2935 width: calc(100% - 30px);
2936 box-sizing: border-box;
2937 }
2938
2939 a.frm_pro_tip .frmsvg,
2940 a.frm_pro_tip i {
2941 color: var(--orange);
2942 margin-right: 5px;
2943 }
2944
2945 a.frm_pro_tip .frmsvg {
2946 margin-right: 10px;
2947 }
2948
2949 .frm-light-tip a.frm_pro_tip {
2950 background: rgba(188, 224, 253, 0.23);
2951 }
2952
2953 .frm-light-tip a.frm_pro_tip .frmsvg,
2954 .frm-light-tip a.frm_pro_tip i,
2955 .frm-light-tip .frm-tip-cta {
2956 color: var(--primary-500);
2957 }
2958
2959 .frm-tip-info {
2960 flex: 1;
2961 text-align: left;
2962 }
2963
2964 .frm-tip-cta {
2965 color: var(--orange);
2966 }
2967
2968 .nav-tab-wrapper .frm_pro_tip {
2969 float: right;
2970 }
2971
2972 .frm_pro_tip:hover .frm-tip-cta {
2973 color: var(--primary-500);
2974 }
2975
2976 /*Switch form dropdown*/
2977 h1 .fa-caret-down {
2978 font-size: 18px;
2979 }
2980
2981 .caret {
2982 display: inline-block;
2983 width: 19px;
2984 height: 9px;
2985 margin-right: -8px;
2986 vertical-align: middle;
2987 }
2988
2989 .caret,
2990 .wp-admin .frm_wrap select,
2991 .frm_wrap .frm_form_builder select,
2992 .frm_wrap .ui-autocomplete-input {
2993 background: transparent 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%23667085%22%2F%3E%3C%2Fsvg%3E') no-repeat right 5px top 55%;
2994 background-size: var(--text-md) var(--text-md);
2995 padding-right: var(--gap-lg) !important;
2996 }
2997
2998 .caret {
2999 padding-right: var(--gap-xs) !important;
3000 }
3001
3002 .frm-btn-group .caret {
3003 float: right;
3004 margin-top: calc( var(--text-md) / 2 );
3005 }
3006
3007 .dropdown {
3008 position: relative;
3009 }
3010
3011 .dropdown-toggle:focus {
3012 outline: 0;
3013 }
3014
3015 .frm_wrap .ui-autocomplete,
3016 #frm_adv_info.frm-dropdown-menu,
3017 .frm-dropdown-menu {
3018 /* Copied from .dropdown-menu rules from Bootstrap */
3019 position: absolute;
3020 top: 100%;
3021 left: 0;
3022 z-index: 1000;
3023 display: none;
3024 float: left;
3025 padding-left: 4px;
3026 padding-right: 4px;
3027 margin: var(--gap-xs) 0 0;
3028 text-align: left;
3029 list-style: none;
3030 background: none;
3031 background-color: #fff;
3032 background-clip: padding-box;
3033 border: 1px solid var(--grey-100);
3034 border-radius: 0.25rem;
3035 box-shadow: var(--box-shadow-lg);
3036
3037 /* Custom rules */
3038 max-height: 200px;
3039 overflow-y: auto;
3040 overflow-x: hidden;
3041 font-size: var(--text-md);
3042 width: auto;
3043 min-width: 160px;
3044 }
3045
3046 .frm6 .frm-dropdown-menu {
3047 min-width: 100px;
3048 max-width: 99%;
3049 }
3050
3051 #frm_bs_dropdown .frm-dropdown-menu {
3052 max-width: 400px;
3053 }
3054
3055 .field_type_list .frm-dropdown-menu {
3056 min-width: 150px !important;
3057 }
3058
3059 #frm_field_group_controls .frm-dropdown-menu,
3060 .frm-field-action-icons .frm-dropdown-menu {
3061 min-width: 180px !important;
3062 }
3063
3064 .frm-field-action-icons .frm-dropdown-toggle svg {
3065 color: #9EA9B8;
3066 }
3067
3068 .multiselect-container.frm-dropdown-menu,
3069 #search-submit .frm-dropdown-menu {
3070 min-width: 200px !important;
3071 }
3072
3073 .preview .frm-dropdown-menu {
3074 min-width: 230px !important;
3075 }
3076
3077 .frm-dropdown-menu.dropdown-menu-right {
3078 right: 0;
3079 left: auto;
3080 }
3081
3082 .frm-dropdown-menu .divider {
3083 height: 1px;
3084 margin: 9px 0;
3085 overflow: hidden;
3086 background-color: #e5e5e5;
3087 }
3088
3089 .frm-dropdown-menu > .dropdown-item {
3090 margin: 0;
3091 }
3092
3093 .frm-select-list-item,
3094 .frm_wrap .ui-autocomplete li > div,
3095 .multiselect-container button.multiselect-option,
3096 .frm-dropdown-menu > .dropdown-item > a,
3097 .frm-dropdown-menu .frm_dropdown_li {
3098 clear: both;
3099 font-weight: normal;
3100 white-space: nowrap;
3101 text-decoration: none;
3102 border-radius: var(--small-radius);
3103 }
3104
3105 .frm-dropdown-menu > .active > a,
3106 .frm-dropdown-menu > .active > a:hover,
3107 .frm-dropdown-menu > .active > a:focus {
3108 text-decoration: none;
3109 outline: 0;
3110 }
3111
3112 .frm-select-list-item.disabled,
3113 .frm-dropdown-menu > .disabled > a, .frm-dropdown-menu > .disabled > a:hover, .frm-dropdown-menu > .disabled > a:focus {
3114 color: #999999;
3115 }
3116
3117 .frm-select-list-item.disabled:hover,
3118 .frm-dropdown-menu > .disabled > a:hover,
3119 .frm-dropdown-menu > .disabled > a:focus {
3120 text-decoration: none;
3121 background-color: transparent;
3122 background-image: none;
3123 cursor: not-allowed;
3124 }
3125
3126 .open > .frm-dropdown-menu {
3127 display: block;
3128 }
3129
3130 .open > a {
3131 outline: 0;
3132 }
3133
3134 .dropdown-header {
3135 display: block;
3136 padding: 3px 10px;
3137 font-size: var(--text-xs);
3138 color: var(--grey-400);
3139 }
3140
3141 .dropdown-backdrop {
3142 position: fixed;
3143 left: 0;
3144 right: 0;
3145 bottom: 0;
3146 top: 0;
3147 z-index: 990;
3148 }
3149
3150 .dropdown-menu-right > .frm-dropdown-menu,
3151 .pull-right > .frm-dropdown-menu {
3152 right: 0;
3153 left: auto;
3154 }
3155
3156 .navbar-fixed-bottom .dropdown .caret {
3157 border-top: 0 dotted;
3158 border-bottom: 4px solid #000000;
3159 content: "";
3160 }
3161
3162 .navbar-fixed-bottom .dropdown .frm-dropdown-menu {
3163 top: auto;
3164 bottom: 100%;
3165 margin-bottom: 1px;
3166 }
3167
3168 .btn {
3169 border: 1px solid #ddd;
3170 background: #fff;
3171 height: 28px;
3172 line-height: var(--leading);
3173 }
3174
3175 a.frm_option_icon:before {
3176 color: var(--primary-500);
3177 font-size: 22px;
3178 width: 22px;
3179 height: 22px;
3180 }
3181
3182 a.frm_option_icon:focus::before,
3183 a.frm_option_icon:hover::before {
3184 color: var(--primary-700);
3185 }
3186
3187 .frm_top_left .frm-dropdown-toggle {
3188 color: #999;
3189 }
3190
3191 .frm-card ol {
3192 margin-left: 15px;
3193 }
3194
3195 .frm-dropdown-toggle {
3196 text-decoration: none;
3197 }
3198
3199 .frm-card .frm-dropdown-toggle {
3200 border: 1px solid var(--grey-300);
3201 border-radius: var(--small-radius);
3202 font-size: 13px;
3203 color: var(--grey-700);
3204 padding: 7px 20px;
3205 }
3206
3207 .frm_actions_dropdown .frm-dropdown-menu {
3208 font-size: var(--text-sm);
3209 color: #5F6C72;
3210 }
3211
3212 .frm-dropdown-menu .frm_icon_font {
3213 vertical-align: middle;
3214 color: #5F6C72;
3215 margin-right: 3px;
3216 }
3217
3218 /* BS Multiselect */
3219 .multiselect-container.frm-dropdown-menu {
3220 top: auto;
3221 left: auto;
3222 font-size: var(--text-sm);
3223 padding: 4px;
3224 margin-bottom: 3px;
3225 }
3226
3227 .frm-right-panel .accordion-section-content {
3228 background: transparent;
3229 padding: 0;
3230 overflow: initial;
3231 }
3232
3233 .frm-right-panel .accordion-section-content > .inside {
3234 padding: 0 0 var(--gap-xs);
3235 }
3236
3237 .frm-right-panel .accordion-section-content .inside a {
3238 font-size: inherit;
3239 }
3240
3241 #post-body-content + .frm-right-panel h3.accordion-section-title {
3242 padding: 7px 10px 8px 14px;
3243 font-size: var(--text-md);
3244 color: var(--grey-700);
3245 }
3246
3247 .frm-right-panel .control-section.open h3 {
3248 border-bottom: none;
3249 }
3250
3251 .js .frm-right-panel .control-section.open .accordion-section-title,
3252 .js .frm-right-panel .control-section .accordion-section-title:focus,
3253 .js .frm-right-panel .control-section .accordion-section-title:hover {
3254 background: transparent;
3255 color: var(--grey-900);
3256 }
3257
3258 .js .frm-right-panel .control-section .accordion-section-title:hover:before {
3259 color: var(--grey-700);
3260 }
3261
3262 .frm-with-line,
3263 .accordion-section-content h4 {
3264 font-size: var(--text-md);
3265 font-weight: 400;
3266 margin: 20px -20px 10px;
3267 padding: 0 20px;
3268 color: var(--grey-700);
3269 position: relative;
3270 border: none !important;
3271 }
3272
3273 .frm-with-line span,
3274 .accordion-section-content h4 span {
3275 background: #fff;
3276 padding: 0 10px;
3277 position: relative;
3278 display: inline-block;
3279 z-index: 2;
3280 }
3281
3282 .accordion-section-content h4 span {
3283 background: var(--sidebar-color);
3284 }
3285
3286 .frm-right-panel .frm-with-line span {
3287 background: var(--sidebar-color) !important;
3288 margin-left: -4px;
3289 }
3290
3291 .frm-right-panel .frm-inline-modal .frm-with-line span {
3292 background: #fff !important;
3293 }
3294
3295 .frm-with-line:before,
3296 .accordion-section-content h4:before {
3297 content: '';
3298 display: block;
3299 position: absolute;
3300 border-bottom: 1px solid var(--grey-300);
3301 left: 0;
3302 width: 100%;
3303 top: 50%;
3304 }
3305
3306 .frm-right-panel .accordion-section {
3307 border: none;
3308 position: relative;
3309 }
3310
3311 .frm-right-panel .accordion-section-title:before,
3312 .frm-right-panel .accordion-section-title:after,
3313 #frm_new_form_modal .accordion-section-title:after
3314 {
3315 content: "\e913" !important;
3316 font-family: "s11-fp" !important;
3317 font-size: 18px;
3318 font-variant: normal;
3319 text-rendering: auto;
3320 vertical-align: text-top;
3321 }
3322
3323 #frm_new_form_modal .accordion-section.open .accordion-section-title:after {
3324 transform: rotate(90deg);
3325 }
3326
3327 .frm-right-panel .accordion-section-title:after {
3328 top: calc(50% - 10px) !important;
3329 }
3330
3331 .frm-right-panel .open .accordion-section-title:after {
3332 content: "\e62a" !important;
3333 }
3334
3335 .frm-right-panel .accordion-section-title:before {
3336 content: "\f1de" !important;
3337 color: var(--grey);
3338 font-size: 17px !important;
3339 margin: 0 10px 0 0;
3340 }
3341
3342 .form-title-style .accordion-section-title:before,
3343 .section-fields-style .accordion-section-title:before {
3344 content: "\f1dc" !important;
3345 }
3346
3347 .form-description-style .accordion-section-title:before {
3348 content: "\e90f" !important;
3349 }
3350
3351 .field-colors-style .accordion-section-title:before {
3352 content: "\e96d" !important;
3353 }
3354
3355 .field-sizes-style .accordion-section-title:before {
3356 content: "\e920" !important;
3357 }
3358
3359 .field-labels-style .accordion-section-title:before {
3360 content: "\e953" !important;
3361 }
3362
3363 .field-description-style .accordion-section-title:before{
3364 content: "\e611" !important;
3365 }
3366
3367 .check-box-radio-fields-style .accordion-section-title:before{
3368 content: "\f14a" !important;
3369 }
3370
3371 .buttons-style .accordion-section-title:before{
3372 content: "\e911" !important;
3373 }
3374
3375 .repeater-fields-style .accordion-section-title:before{
3376 content: "\e974" !important;
3377 }
3378
3379 .toggle-fields-style .accordion-section-title:before{
3380 content: "\f205" !important;
3381 }
3382
3383 .slider-fields-style .accordion-section-title:before{
3384 content: "\f386" !important;
3385 }
3386
3387 .form-messages-style .accordion-section-title:before{
3388 content: "\e915" !important;
3389 }
3390
3391 .date-fields-style .accordion-section-title:before{
3392 content: "\f073" !important;
3393 }
3394
3395 .progress-bars-style .accordion-section-title:before{
3396 content: "\e939" !important;
3397 }
3398
3399 #frm_view_editor_left.frm-right-panel .accordion-section-title,
3400 .frm-right-panel h3.accordion-section-title {
3401 padding: 15px 20px;
3402 background: var(--sidebar-color);
3403 line-height: var(--leading);
3404 color: var(--grey-700);
3405 font-size: var(--text-lg);
3406 font-weight: 400;
3407 }
3408
3409 .control-section .accordion-section-title:after, /** Form template list */
3410 .customize-pane-child .accordion-section-title:after {
3411 top: 15px;
3412 }
3413
3414 .accordion-container .frm-dropdown-menu {
3415 min-width: 40px;
3416 }
3417
3418 .frm-btn-group .multiselect.dropdown-toggle {
3419 box-sizing: border-box;
3420 min-height: unset;
3421 }
3422
3423 .accordion-container .frm-dropdown-menu:before,
3424 .accordion-container .multiselect.dropdown-toggle:before {
3425 font-family: "s11-fp" !important;
3426 }
3427
3428 .multiselect-container {
3429 position: absolute;
3430 list-style-type: none;
3431 margin: 0;
3432 padding: 0;
3433 width: 100%;
3434 max-width: 250px;
3435 }
3436
3437 .multiselect-container button.multiselect-option {
3438 width: 100%;
3439 text-align: left;
3440 border: none;
3441 margin-bottom: 4px;
3442 }
3443
3444 .multiselect-container button.multiselect-option label {
3445 margin-left: 5px;
3446 }
3447
3448 .accordion-container .multiselect-container label {
3449 padding: 3px 19px 3px 7px;
3450 }
3451
3452 .frm-btn-group.btn-group > .btn-group:nth-child(2) > .multiselect.btn {
3453 border-top-left-radius: 4px;
3454 border-bottom-left-radius: 4px
3455 }
3456
3457 .frm-btn-group.btn-group, .frm-btn-group.btn-group-vertical {
3458 display: block;
3459 }
3460
3461 .multiselect-option label {
3462 max-width: calc(100% - 22px);
3463 text-overflow: ellipsis;
3464 overflow: hidden;
3465 white-space: nowrap;
3466 }
3467
3468 .frm_scale {
3469 text-align: center;
3470 float: left;
3471 margin-right: 10px;
3472 }
3473
3474 .frm_scale input {
3475 display: block;
3476 margin: 5px
3477 }
3478
3479 .frm_multi_fields_container {
3480 float: left;
3481 }
3482
3483 .frm_multi_fields_container,
3484 .frm_form_builder .frm_form_fields input[type=tel]
3485 .frm_form_builder .frm_form_fields input[type=range],
3486 .frm_form_builder .frm_form_fields input[type=text] {
3487 width: 100%;
3488 height: auto;
3489 }
3490
3491 .frm_form_builder .frm_time_wrap .frm_time_sep {
3492 vertical-align: sub;
3493 vertical-align: -webkit-baseline-middle;
3494 }
3495
3496 .frm_form_builder input[type=range]::-webkit-slider-runnable-track {
3497 background-color: var(--blue-border);
3498 }
3499
3500 .frm_form_builder input[type=range]::-moz-range-track {
3501 background-color: var(--blue-border);
3502 }
3503
3504 .frm_form_builder input[type=range]::-ms-fill-lower {
3505 background-color: var(--blue-border);
3506 }
3507
3508 .frm_form_builder input[type=range]::-ms-fill-upper {
3509 background-color: var(--blue-border);
3510 }
3511
3512 .frm-embed-field-placeholder {
3513 text-align: center;
3514 height: 145px;
3515 display: flex;
3516 align-items: center;
3517 justify-content: center;
3518 }
3519
3520 .frm-fake-field {
3521 display: block;
3522 height: 25px;
3523 background-color: var(--light-blue);
3524 border: 1px solid var(--grey-300);
3525 margin: 10px 0;
3526 border-radius: var(--small-radius);
3527 }
3528
3529 .frm-embed-message {
3530 position: absolute;
3531 background: #fff;
3532 border: 1px solid var(--grey-300);
3533 color: var(--grey-700);
3534 padding: var(--gap-md);
3535 font-size: var(--text-lg);
3536 max-width: 200px;
3537 min-width: 50%;
3538 margin: 0 var(--gap-md);
3539 overflow: hidden;
3540 text-overflow: ellipsis;
3541 }
3542
3543 .frm-summary-message {
3544 top: 50%;
3545 left: 50%;
3546 padding: 15px 0;
3547 font-size: var(--text-md);
3548 transform: translate(-50%, -50%);
3549 }
3550
3551 .frm-summary-learn-more {
3552 font-size: inherit !important;
3553 }
3554
3555 .frm-single-settings .frm-embed-message {
3556 width: 100%;
3557 position: static;
3558 border-radius: var(--small-radius);
3559 }
3560
3561 #new_fields input[type=text],
3562 #new_fields input[type=number],
3563 .frm_field_box .frm_form_fields > textarea,
3564 .frm_form_fields .frm_form_field > textarea,
3565 .frm_form_fields .frm_form_field > input[type=email],
3566 .frm_form_fields .frm_form_field > input[type=url],
3567 .frm_form_fields .frm_form_field > input[type=number],
3568 .frm_form_fields .frm_form_field > input[type=tel],
3569 .frm_form_fields .frm_form_field > input[type=text],
3570 .frm_form_fields .frm_form_field > input[type=range] {
3571 width: 100%;
3572 }
3573
3574 .frm_form_fields textarea.wp-editor-area {
3575 width: 100%;
3576 border: none;
3577 }
3578
3579 .frm_form_fields input[type="file"], .frm_form_fields input[type="file"]:disabled {
3580 background: transparent;
3581 border: none;
3582 box-shadow: none;
3583 width: auto;
3584 }
3585
3586 .frm_form_fields select {
3587 width: auto;
3588 max-width: 100%;
3589 }
3590
3591 input[type="radio"],
3592 input[type="checkbox"] {
3593 width: 16px;
3594 padding: 0;
3595 }
3596
3597 .frm_wrap .frm-number-range + .frm_last input,
3598 .frm_wrap .frm-number-range input {
3599 text-align: center;
3600 font-weight: 600;
3601 }
3602
3603 .frm_wrap .frm-number-range input[type=number],
3604 .frm_wrap .frm-number-range input[type=text] {
3605 color: var(--primary-700);
3606 }
3607
3608 .frm-range-min {
3609 position: relative;
3610 }
3611
3612 .frm-range-min:after {
3613 content: '';
3614 height: 3px;
3615 width: 10px;
3616 border-radius: 30%;
3617 background: var(--primary-700);
3618 position: absolute;
3619 top: 17px;
3620 right: -28%;
3621 }
3622
3623 .frm_grid_container > p,
3624 .frm_grid_container > p.frm_form_field,
3625 .frm_grid_container > div.frm_form_field,
3626 #new_fields .frm_grid_container > p {
3627 margin-top: 8px;
3628 margin-bottom: 8px;
3629 margin-right: 0;
3630 }
3631
3632 #new_fields div.frm_grid_container > .frm_primary_label {
3633 margin-top: 8px;
3634 }
3635
3636 #new_fields .frm_primary_label + p,
3637 #new_fields .frm_primary_label + .frm6 + .frm6,
3638 #new_fields .frm_primary_label + .frm6 + .frm-inline-modal + .frm6 {
3639 margin-top: 0;
3640 }
3641
3642 .frm_catlevel_2, .frm_catlevel_3, .frm_catlevel_4, .frm_catlevel_5 {
3643 margin-left: 18px;
3644 }
3645
3646 .frm_wrap .frm-fields .auto_width,
3647 .frm_form_fields input.auto_width, .frm_form_fields select.auto_width, .frm_form_fields textarea.auto_width {
3648 width: auto !important;
3649 }
3650
3651 .frm_form_fields select.auto_width {
3652 min-width: 60px;
3653 }
3654
3655 .frm_form_fields input:focus, .frm_form_fields select:focus,
3656 .frm_form_fields textarea:focus, .frm_focus_field input {
3657 background-color: #fff;
3658 border-color: #ddd;
3659 }
3660
3661 .frm_form_builder .frm_radio,
3662 .frm_form_builder .frm_checkbox {
3663 display: block;
3664 margin-bottom: 2px;
3665 }
3666
3667 .frm_form_builder .frm_radio label,
3668 .frm_form_builder .frm_checkbox label {
3669 font-size: var(--text-sm);
3670 }
3671
3672 /* Start copied front-end CSS */
3673 .horizontal_radio .frm_radio,
3674 .horizontal_radio .frm_checkbox {
3675 margin-right: 5px;
3676 display: inline-block;
3677 }
3678
3679 .frm_form_field.frm_two_col .frm_opt_container,
3680 .frm_form_field.frm_three_col .frm_opt_container,
3681 .frm_form_field.frm_four_col .frm_opt_container{
3682 display: grid;
3683 grid-template-columns: repeat(2, 1fr);
3684 grid-auto-rows: max-content;
3685 grid-gap: 0 2.5%;
3686 }
3687
3688 .frm_form_field.frm_three_col .frm_opt_container{
3689 grid-template-columns: repeat(3, 1fr);
3690 }
3691
3692 .frm_form_field.frm_four_col .frm_opt_container{
3693 grid-template-columns: repeat(4, 1fr);
3694 }
3695
3696 .frm_form_field.frm_two_col .frm_radio,
3697 .frm_form_field.frm_two_col .frm_checkbox,
3698 .frm_form_field.frm_three_col .frm_radio,
3699 .frm_form_field.frm_three_col .frm_checkbox,
3700 .frm_form_field.frm_four_col .frm_radio,
3701 .frm_form_field.frm_four_col .frm_checkbox{
3702 grid-column-end: span 1;
3703 }
3704 /* End copied */
3705
3706 .frm_wrap .with_frm_style .frm_checkbox input[type=checkbox],
3707 .frm_wrap .with_frm_style .frm_radio input[type=radio],
3708 .frm_wrap input[type=checkbox],
3709 .frm-white-body input[type=checkbox],
3710 .field-group input[type=checkbox],
3711 .frm_scale input[type=radio],
3712 .frm_radio input[type=radio],
3713 .frm_checkbox input[type=checkbox] {
3714 border: 1px solid var(--grey-300);
3715 box-shadow: none;
3716 -webkit-appearance: none;
3717 }
3718
3719
3720 .frm_wrap .with_frm_style .frm_checkbox input[type=checkbox],
3721 .frm_wrap input[type=checkbox],
3722 .frm-white-body input[type=checkbox],
3723 .field-group input[type=checkbox],
3724 .frm_checkbox input[type=checkbox] {
3725 border-radius: 4px;
3726 }
3727
3728 .frm-white-body input[type="checkbox"]:checked,
3729 .frm_wrap input[type="checkbox"]:checked {
3730 background-color: var(--primary-500);
3731 border-color: var(--primary-500) !important;
3732 }
3733
3734 .frm-white-body input[type="checkbox"]:checked:focus,
3735 .frm_wrap input[type="checkbox"]:checked:focus {
3736 border-color: var(--primary-500);
3737 }
3738
3739 .frm-white-body input[type="checkbox"]:checked::before,
3740 .frm_wrap input[type="checkbox"]:checked::before {
3741 content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2010%2010%27%3E%3Cpath%20d%3D%27M9.2%202c.2.3.2.7%200%201l-5%205c-.3.2-.6.2-.9%200L.8 5.3a.6.6%200%200%201%20.9-.8l2%202%204.6-4.5c.3-.3.6-.3.9%200Z%27%20fill%3D%27%23fff%27%2F%3E%3C%2Fsvg%3E");
3742 height: 12px;
3743 width: 12px;
3744 margin: 1px;
3745 }
3746
3747 .frm_radio input[type="radio"],
3748 .frm_checkbox input[type="checkbox"] {
3749 margin-right: 5px;
3750 }
3751
3752 .frm_single_entry_page .with_frm_style .frm_radio input[type=radio] {
3753 margin: 5px 0;
3754 width: 18px;
3755 position: relative; /* override Bootstrap */
3756 }
3757
3758 .frm_single_entry_page .with_frm_style .frm_radio input[type=radio]:before {
3759 position: relative !important;
3760 left: calc(50% - 6px);
3761 top: calc(50% - 6px);
3762 margin: 0 !important;
3763 }
3764
3765 .frm_inner_field_container {
3766 margin-bottom: 10px;
3767 }
3768
3769 .frm_conf_inline .frm_inner_field_container,
3770 .frm_conf_inline .frm_inner_conf_container {
3771 width: 49%;
3772 float: left;
3773 }
3774
3775 .frm_conf_inline .frm_inner_field_container {
3776 margin-right: 2%;
3777 clear: both;
3778 }
3779
3780 .frm_inner_field_container > label {
3781 text-overflow: ellipsis;
3782 overflow: hidden;
3783 white-space: nowrap;
3784 }
3785
3786 .frm_field_box:not(.edit_field_type_divider):hover > .frm_inner_field_container > label,
3787 .frm_field_box .divider_section_only:hover > .frm_inner_field_container > label,
3788 li.ui-state-default.selected > .frm_inner_field_container > label {
3789 max-width: calc(100% - 100px);
3790 }
3791
3792 .frm-drag-fade {
3793 background-color: var(--lightest-grey) !important;
3794 border-radius: 4px;
3795 }
3796
3797 .frm-drag-fade * {
3798 opacity: 0;
3799 }
3800
3801 .frm-dragging .divider_section_only,
3802 .frm-dragging .frm_field_box {
3803 pointer-events: none;
3804 }
3805
3806 .frm_form_settings #op-popup, /* 1Password */
3807 .frm_form_settings com-1password-op-button,
3808 .frm_conf_below .frm_conf_field_container .frm_primary_label,
3809 .frm_conf_inline .frm_inner_field_container .frm-show-click a,
3810 .frm_conf_below .frm_conf_field_container .frm-show-click a {
3811 display: none !important;
3812 }
3813
3814 .frm_conf_inline .frm_inner_field_container .frm-field-action-icons {
3815 position: absolute;
3816 right: 5px;
3817 }
3818
3819 .frm_conf_below .frm_conf_field_container {
3820 margin-top: 10px;
3821 }
3822
3823 .frm_calc_dec {
3824 width: 50px;
3825 }
3826
3827 .frm_ext_sc {
3828 display: none;
3829 }
3830
3831 .frm_long_input {
3832 width: 100% !important;
3833 box-sizing: border-box;
3834 }
3835
3836 .frmcenter {
3837 text-align: center;
3838 }
3839
3840 img.frm_help {
3841 margin-left: 2px;
3842 vertical-align: middle;
3843 padding-bottom: 2px;
3844 }
3845
3846 /* Loading */
3847 .frm_spinner.frm-wait,
3848 .frm_spinner.spinner {
3849 float: left;
3850 visibility: hidden;
3851 margin: 0 10px;
3852 }
3853
3854 .frm_visible_spinner.frm-wait,
3855 .frm_visible_spinner.spinner {
3856 visibility: visible;
3857 float: none;
3858 }
3859
3860 .frm_form_action_settings .frm_spinner.frm-wait,
3861 .frm_form_action_settings .frm_spinner.spinner {
3862 visibility: visible;
3863 float: none;
3864 vertical-align: bottom;
3865 }
3866
3867 .frm_form_action_settings .frm_loading {
3868 font-size: 15px;
3869 text-align: center;
3870 }
3871
3872 .frm_ajax_settings_tab .frm-wait,
3873 .frm_ajax_settings_tab .spinner {
3874 visibility: visible;
3875 float: none;
3876 margin-top: 20px;
3877 }
3878
3879 .wp-core-ui .frm_loading_button.button-primary.frm-button-primary,
3880 .frm_loading_button,
3881 .frm_loading_form.frm_button_submit {
3882 position: relative !important;
3883 opacity: .8;
3884 color: transparent !important;
3885 text-shadow: none !important;
3886 }
3887
3888 .frm_loading_button:hover,
3889 .frm_loading_button:active,
3890 .frm_loading_button:focus,
3891 .frm_loading_form.frm_button_submit:hover,
3892 .frm_loading_form.frm_button_submit:active,
3893 .frm_loading_form.frm_button_submit:focus {
3894 cursor: not-allowed;
3895 color: transparent !important;
3896 outline: none !important;
3897 box-shadow: none;
3898 }
3899
3900 .frm-wait {
3901 margin: 20px;
3902 width: 20px;
3903 height: 20px;
3904 position: relative;
3905 display: inline-block;
3906 }
3907
3908 #frm-show-fields .frm-wait:only-child {
3909 position: absolute;
3910 left: 50px;
3911 top: 30px;
3912 }
3913
3914 .frm-wait:before,
3915 .frm_loading_button:before,
3916 .frm_loading_form.frm_button_submit:before {
3917 content: '';
3918 display: inline-block;
3919
3920 position: absolute;
3921 background: transparent;
3922 border: 1px solid #fff;
3923 border-top-color: transparent;
3924 border-left-color: transparent;
3925 border-radius: 50%;
3926
3927 box-sizing: border-box;
3928 top: 50%;
3929 left: 50%;
3930 margin-top: -10px;
3931 margin-left: -10px;
3932 width: 20px;
3933 height: 20px;
3934
3935 -webkit-animation: spin 2s linear infinite;
3936 -moz-animation: spin 2s linear infinite;
3937 -o-animation: spin 2s linear infinite;
3938 animation: spin 2s linear infinite;
3939 }
3940
3941 .frm-wait:before {
3942 border-bottom-color: var(--primary-700);
3943 border-right-color: var(--primary-700);
3944 }
3945
3946 .frm_loading_button.frm-button-secondary:before {
3947 border-bottom-color: var(--primary-500);
3948 border-right-color: var(--primary-500);
3949 }
3950
3951 input[type=submit]:focus {
3952 outline: none !important;
3953 }
3954
3955 /* Effects */
3956
3957 @keyframes spin {
3958 0% {
3959 transform: rotate(0deg);
3960 }
3961 100% {
3962 transform: rotate(360deg);
3963 }
3964 }
3965
3966 label input[type="checkbox"], label input[type="radio"] {
3967 vertical-align: inherit;
3968 }
3969
3970 #editorcontainer #dyncontent {
3971 margin: 0;
3972 width: 100%;
3973 padding: 6px;
3974 line-height: var(--leading);
3975 border: 0 none;
3976 outline: none;
3977 -moz-box-sizing: border-box;
3978 -webkit-box-sizing: border-box;
3979 box-sizing: border-box;
3980 }
3981
3982 /*ICONS*/
3983 .frm_postbox_icon {
3984 margin: -6px 0 0 -10px;
3985 }
3986
3987 .frm_form_builder a:hover {
3988 text-decoration: underline;
3989 }
3990
3991 .frm_form_builder .widget-title h4 {
3992 padding: 10px 15px;
3993 }
3994
3995 .frm_form_builder .widget-top a.widget-action:after {
3996 margin: 7px 12px 0;
3997 }
3998
3999 .frmbutton.frm_tgateway {
4000 display: none !important;
4001 }
4002
4003 .frm_html_legend pre {
4004 display: inline;
4005 }
4006
4007 #ed_fullscreen {
4008 display: none !important;
4009 }
4010
4011 .frm_posttax_opt_list {
4012 overflow: auto;
4013 max-height: 200px;
4014 background-color: #fff;
4015 }
4016
4017 .frm_posttax_opt_list p.howto {
4018 font-size: 12px;
4019 }
4020
4021 .frm_border_bottom {
4022 border-bottom: 1px solid var(--grey-300);
4023 margin-bottom: 10px;
4024 padding-bottom: 10px;
4025 }
4026
4027 .frm_posttax_opt_list .frm_border_bottom span.howto {
4028 padding-right: 10px;
4029 }
4030
4031 .frm_posttax_opt_list .frm_border_bottom input {
4032 margin-right: 1px;
4033 }
4034
4035 .frm_add_remove div.frm_form_field {
4036 padding-bottom: 5px;
4037 }
4038
4039 .frm_field_opts_list {
4040 max-height: 190px;
4041 overflow: auto;
4042 }
4043
4044 .frm_white_bg {
4045 background-color: #fff;
4046 }
4047
4048 .frm_border_light {
4049 border: solid 1px #ddd;
4050 }
4051
4052 #new_fields .form-table input[type=text],
4053 #new_fields .form-table select,
4054 .form-table .form-field input,
4055 .form-table .form-field .quicktags-toolbar input,
4056 .form-field input, .form-field .quicktags-toolbar input {
4057 width: auto;
4058 }
4059
4060 .frm_aff_link {
4061 float: right;
4062 }
4063
4064 .frm_select_box {
4065 text-align: center;
4066 font-weight: bold;
4067 width: 100%;
4068 background-color: transparent !important;
4069 }
4070
4071 .wp-list-table input.frm_select_box {
4072 text-align: left;
4073 font-weight: normal;
4074 font-size: inherit !important;
4075 border: none;
4076 padding: 0 !important;
4077 background-color: transparent !important;
4078 }
4079
4080 .wp-list-table input.frm_select_box:focus {
4081 outline: none;
4082 box-shadow: none;
4083 }
4084
4085 .wp-list-table .frm_no_items.frm_select_box {
4086 text-align: center;
4087 font-weight: bold;
4088 width: 500px;
4089 max-width: 100%;
4090 font-size: inherit;
4091 }
4092
4093 /* Start entry statuses */
4094 .frm-entry-status {
4095 padding: var(--gap-2xs) var(--gap-xs);
4096 align-items: center;
4097 border-radius: var(--small-radius);
4098 text-transform: uppercase;
4099 }
4100
4101 .frm-entry-status-0 {
4102 color: #1E561F;
4103 background: #D5F2DC;
4104 }
4105
4106 .frm-entry-status-1 {
4107 color: #7A4D05;
4108 background: #FFF2D2;
4109 }
4110 /* End entry statuses */
4111
4112 #frm-options-panel {
4113 padding: 0 var(--gap-sm);
4114 color: var(--grey-900);
4115 }
4116
4117 .frm-right-panel a.frm_add_logic_link,
4118 #frm-options-panel h3 {
4119 padding: 15px 0;
4120 margin-top: -2px;
4121 }
4122
4123 .frm-right-panel a.frm_add_logic_link:focus {
4124 outline: auto;
4125 }
4126
4127 #frm_style_sidebar h3,
4128 #frm_view_editor_left.frm-right-panel .accordion-section-title {
4129 padding: 15px 0;
4130 }
4131
4132 .frm_field_key {
4133 background-color: #F7F7F7;
4134 }
4135
4136 #frm_form_editor_container #edit-slug-box {
4137 padding: 0;
4138 }
4139
4140 .frm-alt-table {
4141 width:100%;
4142 border-collapse:collapse;
4143 margin-top:0.5em;
4144 font-size:15px;
4145 }
4146
4147 .frm-alt-table th {
4148 width:200px;
4149 }
4150
4151 .frm-alt-table tr {
4152 background-color:transparent;
4153 }
4154
4155 .frm-alt-table th,
4156 .frm-alt-table td {
4157 background-color:transparent;
4158 vertical-align:top;
4159 text-align:left;
4160 padding:20px;
4161 }
4162
4163 .frm-alt-table tr:nth-child(even) {
4164 background-color: var(--sidebar-color);
4165 }
4166
4167 .frm-alt-table h3 {
4168 margin-bottom: 0;
4169 }
4170
4171 .form-field .frm_cb_button {
4172 height: 22px;
4173 line-height: 20px;
4174 margin-bottom: 10px;
4175 margin-right: 5px;
4176 }
4177
4178 .edit_field_type_select .frm_option_val_label {
4179 margin-left: 12px;
4180 }
4181
4182 .frm_rte {
4183 background: url(../images/rte.png) no-repeat;
4184 }
4185
4186 .frm_rte .howto {
4187 margin: 10px 0 46px;
4188 }
4189
4190 .subform_section {
4191 margin: 25px;
4192
4193 }
4194
4195 .subform_section,
4196 .subform_section label,
4197 .subform_section input {
4198 opacity: 80;
4199 }
4200
4201 .subform_section .frm_sortable_field_opts {
4202 display: none;
4203 }
4204
4205 #frm_form_editor_container .subform_section .frm_primary_label {
4206 display: block;
4207 }
4208
4209 .subform_section.subform_break {
4210 border-top: 1px dashed #ccc;
4211 }
4212
4213 .button-secondary.frm_html_field {
4214 background-color: #ededed;
4215 padding: 10px 20px;
4216 line-height: inherit;
4217 width: auto;
4218 height: auto !important;
4219 -moz-border-radius: 0;
4220 -webkit-border-radius: 0;
4221 border-radius: 0;
4222 -webkit-box-sizing: content-box;
4223 -moz-box-sizing: content-box;
4224 box-sizing: content-box;
4225 }
4226
4227 .frm_html_field_placeholder {
4228 margin-bottom: 10px;
4229 text-align: center;
4230 }
4231
4232 .recaptcha_placeholder {
4233 border: 1px solid #d3d3d3;
4234 width: 300px;
4235 }
4236
4237 .frm_sorting .frm_rte textarea {
4238 width: 653px;
4239 background: #fff;
4240 margin: 1px 0 0;
4241 border: 1px solid #dfdfdf;
4242 border-top: none;
4243 -moz-border-radius: 0;
4244 -webkit-border-radius: 0;
4245 border-radius: 0;
4246 float: none !important;
4247 }
4248
4249 .frm_full_rte textarea {
4250 width: 98%;
4251 padding: 0;
4252 }
4253
4254 .frm_field_box {
4255 padding: 5px;
4256 min-height: 20px;
4257 margin: 10px 0;
4258 }
4259
4260 .frm_indent_opt, td.frm_indent_opt {
4261 padding-left: 25px;
4262 }
4263
4264 .frm_charts object {
4265 background: transparent;
4266 }
4267
4268 .frm_charts h2 {
4269 height: 34px;
4270 }
4271
4272 .frm_single_option.ui-sortable-placeholder,
4273 li.sortable-placeholder {
4274 border: none;
4275 margin: 0;
4276 visibility: visible !important;
4277 box-shadow: 2px -10px 0 2px var(--primary-500);
4278 }
4279
4280 #frm_form_editor_container > ul > .frm_single_option.ui-sortable-placeholder,
4281 #frm_form_editor_container > ul > li.sortable-placeholder {
4282 width: calc(100% - 5px) !important;
4283 height: 0 !important;
4284 }
4285
4286 #frm_form_editor_container > ul > li > ul {
4287 position: relative;
4288 }
4289
4290 #frm_form_editor_container > ul > li > ul > li.sortable-placeholder,
4291 #frm_form_editor_container ul.start_divider > li > ul > li.sortable-placeholder {
4292 position: absolute;
4293 top: 20px;
4294 bottom: 0;
4295 }
4296
4297 .edit_field_type_divider + li.sortable-placeholder {
4298 box-shadow: 2px 5px 0 2px var(--primary-500);
4299 }
4300
4301 .start_divider li.sortable-placeholder {
4302 box-shadow: 2px -5px 0 2px var(--primary-500);
4303 }
4304
4305 .frm-is-collapsed + .sortable-placeholder {
4306 box-shadow: 2px 15px 0 2px var(--primary-500);
4307 }
4308
4309 .frm_single_option.ui-sortable-placeholder {
4310 box-shadow: 0 0 1px 1px var(--primary-500);
4311 }
4312
4313 .frm_sorting > li.edit_field_type_end_divider:first-child,
4314 .frm-show-click,
4315 li.ui-state-default.edit_field_type_divider .frm-show-click {
4316 display: none;
4317 }
4318
4319 .frm_form_field.ui-sortable-helper .frm-field-action-icons,
4320 .frm_form_field.ui-sortable-helper .frm_form_fields,
4321 .frm_form_field.ui-sortable-helper .frm_description,
4322 .frm_form_field.ui-sortable-helper .description {
4323 display: none;
4324 }
4325
4326 .frm_form_field.ui-sortable-helper .frm_primary_label,
4327 .frm_form_field.ui-sortable-helper .frm_inner_field_container {
4328 margin: 0 !important;
4329 }
4330
4331 .frm-single-settings .frm-show-click {
4332 display: block !important;
4333 }
4334
4335 .frm-show-hover,
4336 .frm_single_visible_hover,
4337 li.ui-state-default.edit_field_type_divider .frm-show-hover {
4338 opacity: 0;
4339 transition: opacity .15s ease-in-out;
4340 }
4341
4342 #frm-show-fields .frm-field-settings-open .frm-show-hover {
4343 opacity: 1;
4344 }
4345
4346 .frm_sortable_field_opts {
4347 margin-top: 5px;
4348 }
4349
4350 .frm_single_option {
4351 clear: both;
4352 margin: 0;
4353 padding-bottom: 5px;
4354 }
4355
4356 .frm_product_price_wrapper,
4357 .frm_image_preview_wrapper,
4358 #new_fields .frm_single_option select,
4359 #new_fields .frm_single_option input[type=text] {
4360 width: calc(100% - 73px);
4361 }
4362
4363 .frm-right-panel .frm_single_option a.frm_remove_tag,
4364 .frm_single_option a {
4365 padding-left: 7px;
4366 }
4367
4368 .frm_single_option:hover .frm_single_visible_hover {
4369 opacity: 100;
4370 }
4371
4372 .frm_single_option .frm-drag {
4373 font-size: 23px;
4374 width: 22px;
4375 height: 19px;
4376 margin-left: -6px;
4377 color: var(--grey);
4378 }
4379
4380 .frm_single_option .frm-drag:before {
4381 vertical-align: middle;
4382 }
4383
4384 .frm-drag,
4385 .frm_single_option.ui-sortable-helper {
4386 cursor: move;
4387 }
4388
4389 .frm_single_option .frm_option_key {
4390 margin-left: 19px !important;
4391 }
4392
4393 .frm_option_key input[type=text] {
4394 margin-top: 15px !important;
4395 }
4396
4397 li.ui-state-default.selected .frm-show-click,
4398 li.ui-state-default.selected.edit_field_type_divider .frm-show-click {
4399 display: inline;
4400 vertical-align: top;
4401 }
4402
4403 .frm_field_box:not(.edit_field_type_divider):hover > .frm_inner_field_container > .frm-show-hover,
4404 .frm_field_box .divider_section_only:hover > .frm_inner_field_container > .frm-show-hover,
4405 li.ui-state-default.selected > .frm_inner_field_container > .frm-show-hover,
4406 li.ui-state-default.selected.edit_field_type_divider .divider_section_only .frm-show-hover {
4407 opacity: 100;
4408 }
4409
4410 li.frm_field_box > ul.frm_grid_container {
4411 position: relative;
4412 }
4413
4414 .frm_sorting span.ui-icon {
4415 width: 16px;
4416 }
4417
4418 /* Image options for Radio and Checkbox */
4419
4420 .frm_image_options .frm_image_option_container {
4421 --field-border-width: 1px;
4422 --border-color: var(--grey-300);
4423 --border-color-active: var(--primary-500);
4424 --border-radius: var(--small-radius);
4425 }
4426
4427 .frm_image_option_container svg {
4428 height: 50px;
4429 margin: 10px auto 0;
4430 }
4431
4432 #form_show_entry_page .frm_file_link,
4433 #form_show_entry_page .frm_image_option_container {
4434 display: inline-flex;
4435 flex-wrap: nowrap;
4436 flex-direction: column;
4437 text-align: center;
4438 align-items: center;
4439 width: 150px;
4440 margin-right: 10px;
4441 margin-bottom: 10px;
4442 }
4443
4444 #form_show_entry_page .frm_image_option_container img {
4445 width: 150px;
4446 height: 150px;
4447 object-fit: cover;
4448 }
4449
4450 #form_show_entry_page .frm_file_link img {
4451 max-width: 150px;
4452 height: auto;
4453 }
4454
4455 #form_show_entry_page .frm_file_link ~ br {
4456 display: none;
4457 }
4458
4459 #form_show_entry_page .frm_upload_label {
4460 padding: 10px;
4461 }
4462
4463 .frm_image_option_container .frm_image_placeholder_icon svg{
4464 height: 150px;
4465 }
4466
4467 .frm_list_entry_page .frm_file_link,
4468 .frm_list_entry_page .frm_image_option_container.frm_label_with_image {
4469 display: block;
4470 text-align: center;
4471 }
4472
4473 .frm_list_entry_page .frm_image_option_container img {
4474 width: 75px;
4475 height: 75px;
4476 object-fit: cover;
4477 }
4478
4479 .frm_list_entry_page img {
4480 max-width: 100%;
4481 height: auto;
4482 }
4483
4484 .frm_image_option_container .frm_empty_url {
4485 background-color: var(--sidebar-color);
4486 }
4487
4488 .frm_list_entry_page .frm_image_option_container .frm_text_label_for_image {
4489 display: block;
4490 padding: 5px 0 10px;
4491 }
4492
4493 .frm_list_entry_page .frm_upload_label,
4494 .frm-summary-page-wrapper .frm_text_label_for_image {
4495 display: block;
4496 }
4497
4498 #frm-welcome .frm_image_options .frm_image_option_container,
4499 #form_global_settings .frm_image_options .frm_image_option_container{
4500 background: var(--sidebar-color);
4501 }
4502
4503 #frm-welcome .frm_image_option_container svg,
4504 #form_global_settings .frm_image_option_container svg {
4505 max-width: calc( 100% - 20px );
4506 }
4507
4508 /* Show an icon on top */
4509 .frm_image_option_container {
4510 position: relative;
4511 }
4512
4513 .frm_text_label_for_image > svg {
4514 width: 30px;
4515 position: absolute;
4516 top: 5px;
4517 right: calc( 50% - 15px );
4518 }
4519 /* End show an icon on top */
4520
4521 .frm_single_option .frm_option_key {
4522 margin-top: 17px;
4523 }
4524
4525 .frm_image_data {
4526 margin-left: var(--gap-xs);
4527 display: flex;
4528 flex-direction: column;
4529 font-size: var(--text-sm);
4530 justify-content: space-around;
4531 }
4532
4533 .frm_image_styling_frame {
4534 display: flex;
4535 align-items: stretch;
4536 margin-left: 1.5rem;
4537 }
4538
4539 .frm_image_styling_frame img{
4540 height: 54px;
4541 width: 54px;
4542 min-width: auto;
4543 min-height: auto;
4544 border-radius: 3px;
4545 object-fit: cover;
4546 object-position: center;
4547 }
4548
4549 .frm_image_styling_frame .frm_email_attachment_icon img {
4550 height: auto;
4551 width: auto;
4552 max-width: 54px;
4553 }
4554
4555 .frm_image_preview_title{
4556 color: var(--grey-500);
4557 overflow: hidden;
4558 white-space: nowrap;
4559 text-overflow: ellipsis;
4560 }
4561
4562 .frm_wrap .frm_choose_image_box {
4563 cursor: pointer;
4564 color: var(--grey-700);
4565 background-color: #F2F2F2;
4566 margin-left: 24px;
4567 text-align: center;
4568 width: 100%;
4569 }
4570
4571 .frm_wrap .frm_choose_image_box:hover {
4572 background: #fff;
4573 }
4574
4575 a.frm_remove_image_option,
4576 .frm_remove_image_option {
4577 color: var(--grey-400);
4578 cursor: pointer;
4579 }
4580
4581 a.frm_remove_image_option:hover .frmsvg,
4582 a.frm_remove_image_option:hover,
4583 .frm_remove_image_option:hover {
4584 color: rgba(40, 47, 54, 0.8);
4585 }
4586
4587 /* Form settings */
4588
4589 .frm-form-setting-tabs {
4590 margin-top: var(--gap-sm) !important;
4591 }
4592
4593 .frm-right-panel > .postbox {
4594 background-color: transparent;
4595 border: none;
4596 box-shadow: none;
4597 margin: 0;
4598 }
4599
4600 .frm-right-panel .postbox.frm_with_icons .inside,
4601 .frm-right-panel .postbox .inside,
4602 .frm-right-panel .inside {
4603 font-size: var(--text-md);
4604 padding: 15px 20px 20px;
4605 color: var(--grey-700);
4606 }
4607
4608 .frm-right-panel .misc-pub-section {
4609 padding: var(--gap-xs) 0;
4610 position: relative;
4611 }
4612
4613 .frm-right-panel .inside a,
4614 .frm-form-setting-tabs a {
4615 font-size: var(--text-md);
4616 color: var(--grey-700);
4617 padding: var(--gap-sm);
4618 display: block;
4619 }
4620
4621 .frm-form-setting-tabs a {
4622 color: var(--grey-900);
4623 padding: var(--gap-sm) var(--gap-md);
4624 }
4625
4626 .frm-right-panel .inside a {
4627 padding: 0;
4628 color: var(--primary-500);
4629 display: inline-block;
4630 }
4631
4632 .frm-right-panel .inside a:hover {
4633 color: var(--primary-700);
4634 }
4635
4636 .frm-form-setting-tabs a:hover {
4637 background: var(--sidebar-hover);
4638 color: var(--grey-900);
4639 }
4640
4641 .frm-right-panel .inside i,
4642 .frm-right-panel .inside .frmsvg,
4643 .frm-form-setting-tabs a i,
4644 .frm-form-setting-tabs a .frmsvg {
4645 margin: 0 5px;
4646 display: inline-block;
4647 width: 20px;
4648 height: 20px;
4649 color: var(--grey-500);
4650 }
4651
4652 .frm-form-setting-tabs a .frmsvg {
4653 margin: 0;
4654 }
4655
4656 .frm-right-panel .inside a:hover i,
4657 .frm-right-panel .inside a:hover .frmsvg,
4658 .frm-form-setting-tabs a:hover .frmsvg,
4659 .frm-form-setting-tabs a:hover span {
4660 color: var(--grey-700);
4661 }
4662
4663 .frm_settings_form .tabs-panel {
4664 padding: 0 25px;
4665 }
4666
4667 #form_settings_page .tabs-panel,
4668 .frm_settings_form .tabs-panel {
4669 max-height: initial !important;
4670 min-height: 50px !important;
4671 }
4672
4673 #frm_adv_info .tabs-panel {
4674 min-height: 0 !important;
4675 overflow-x: hidden;
4676 padding: 0;
4677 border: none;
4678 background: transparent;
4679 }
4680
4681 select.frm_cancelnew, input.frm_enternew {
4682 width: 175px;
4683 }
4684
4685 .frm_posttax_opt_list,
4686 .frm_submit_logic_rows {
4687 border: 1px solid var(--grey-300);
4688 padding: var(--gap-md);
4689 border-radius: var(--small-radius);
4690 margin: 5px 0 5px var(--gap-md);
4691 }
4692
4693 .frm_submit_logic_rows .frm_grid_container > p.frm_form_field {
4694 margin: 0;
4695 }
4696
4697 /* Color picker CSS */
4698 .frm-right-panel .wp-picker-open + .wp-picker-input-wrap {
4699 position: absolute;
4700 margin-left: calc( ( 100% - 35px ) * -1 );
4701 margin-top: 1px;
4702 width: calc( 100% - 36px );
4703 }
4704
4705 .frm-right-panel .wp-picker-container input[type="text"].wp-color-picker {
4706 border: none;
4707 padding: 5px 8px;
4708 font-family: inherit;
4709 color: var(--grey-700);
4710 font-size: var(--text-md);
4711 width: 100%;
4712 line-height: var(--leading);
4713 }
4714
4715 .frm-right-panel .wp-picker-input-wrap .wp-picker-clear {
4716 display: none !important;
4717 }
4718
4719 .frm-right-panel .wp-picker-holder {
4720 position: absolute;
4721 z-index: 999;
4722 }
4723
4724 .frm-right-panel .wp-picker-input-wrap label {
4725 margin-bottom: 0;
4726 }
4727
4728 .frm-right-panel .wp-picker-container .wp-color-result.button {
4729 width: 100%;
4730 overflow: hidden;
4731 margin: 0 !important;
4732 height: var(--h-md) !important;
4733 padding: 0 0 0 var(--gap-lg) !important;
4734 border-radius: var(--small-radius);
4735 border-color: var(--grey-300);
4736 }
4737
4738 .frm-right-panel .wp-color-result-text {
4739 line-height: var(--leading) !important;
4740 font-size: var(--text-md);
4741 background: #fff !important;
4742 color: var(--grey-900);
4743 padding: 5px 8px;
4744 border-color: var(--grey-300);
4745 text-align: left;
4746 }
4747
4748 .frm-right-panel .color-alpha {
4749 width: var(--gap-lg) !important;
4750 }
4751
4752 .frm_grid_container .wp-picker-container {
4753 width: 100%;
4754 position: relative;
4755 }
4756
4757 .wp-picker-container button.wp-color-result {
4758 border: 1px solid var(--grey-300) !important;
4759 }
4760
4761 .wp-picker-container .wp-picker-input-wrap input.hex.wp-color-picker {
4762 max-width: 100%;
4763 position: relative;
4764 }
4765
4766 .frm_end .wp-picker-holder {
4767 margin-left: -145px;
4768 }
4769
4770 .frm_end.frm6 .wp-picker-holder {
4771 margin-left: -86px;
4772 }
4773 /* End of color picker CSS */
4774
4775 /*
4776 These are the styles for the "Enable Formidable styling" toggle in the visual styler.
4777 To use this element, you can call the FrmHtmlHelper::toggle function.
4778 */
4779 .frm_toggle_opt {
4780 padding: 0;
4781 white-space: normal;
4782 display: inline;
4783 vertical-align: middle;
4784 font-weight: normal;
4785 }
4786
4787 .frm_on_label,
4788 .frm_off_label {
4789 color: #444444;
4790 }
4791
4792 .frm_toggle {
4793 position: relative;
4794 display: inline-block;
4795 width: 40px;
4796 height: var(--h-xs);
4797 vertical-align: middle;
4798 }
4799
4800 .frm_toggle_block {
4801 display: inline-flex;
4802 gap: var(--gap-sm);
4803 align-items: center;
4804 }
4805
4806 .frm_toggle input, /* Reverse compatibility */
4807 .frm_toggle_block input {
4808 display:none !important;
4809 }
4810
4811 .frm_toggle_slider {
4812 position: absolute;
4813 cursor: pointer;
4814 top: 0;
4815 left: 0;
4816 right: 0;
4817 bottom: 0;
4818 background-color: var(--grey-border);
4819 transition: .4s;
4820 border-radius: 30px;
4821 }
4822
4823 .frm_toggle_slider:before {
4824 border-radius: 50%;
4825 position: absolute;
4826 content: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 height=%2711px%27 width=%2711px%27 viewBox=%270 0 20 20%27><path d=%27M16.8 4.5l-1.3-1.3L10 8.6 4.5 3.2 3.2 4.5 8.6 10l-5.4 5.5 1.3 1.3 5.5-5.4 5.5 5.4 1.3-1.3-5.4-5.5 5.4-5.5z%27 fill=%27%2398A2B3%27/%3E</svg>");
4827 height: 22px;
4828 width: 22px;
4829 padding: 0 5.5px;
4830 left: 1px;
4831 bottom: 1px;
4832 background-color: white;
4833 transition: .4s;
4834 box-sizing: border-box;
4835 box-shadow: var(--box-shadow-md);
4836 font-size: 21px;
4837 line-height: 18px;
4838 }
4839
4840 input:checked + .frm_toggle .frm_toggle_slider {
4841 background-color: var(--primary-500);
4842 }
4843
4844 input:focus + .frm_toggle .frm_toggle_slider {
4845 box-shadow: var(--box-shadow-md);
4846 }
4847
4848 input:checked + .frm_toggle .frm_toggle_slider:before {
4849 padding: 0 6px;
4850 transform: translateX(16px);
4851 content: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 height=%2711px%27 width=%2711px%27 viewBox=%270 0 10 10%27><path d=%27M9.2 2c.2.3.2.7 0 1l-5 5c-.3.2-.6.2-.9 0L.8 5.3a.6.6 0 0 1 .9-.8l2 2 4.6-4.5c.3-.3.6-.3.9 0Z%27 fill=%27%234199FD%27/%3E</svg>");
4852 }
4853
4854 input[disabled] + .frm_toggle_slider {
4855 pointer-events: none;
4856 cursor: text;
4857 opacity: .5;
4858 }
4859
4860 .frm_toggle_opt ~ .frm_toggle .frm_toggle_slider:before {
4861 content: '' !important; /* Don't show x/check if off label included or on builder page */
4862 }
4863
4864 .rtl .frm_toggle_opt {
4865 padding: 0 8px;
4866 }
4867
4868 .rtl .frm_toggle_slider:before {
4869 left: 17px;
4870 }
4871
4872 .rtl input:checked + .frm_toggle .frm_toggle_slider:before {
4873 transform: none!important;
4874 left: 1px;
4875 }
4876
4877 /* Deprecated admin toggle */
4878 .frm_toggle_off,
4879 .frm_toggle_on {
4880 display: none;
4881 color: #fff;
4882 z-index: 999;
4883 position: absolute;
4884 font-size: 10px;
4885 line-height: 20px;
4886 left: 6px;
4887 }
4888
4889 .frm_toggle_off {
4890 display: inline;
4891 left: auto;
4892 right: 5px;
4893 color: var(--dark-grey);
4894 }
4895
4896 .frm_toggle_long {
4897 width: 80% !important;
4898 height: 28px;
4899 display: inline-block !important;
4900 }
4901
4902 .frm_toggle_long .frm_toggle_slider {
4903 background: var(--primary-700);
4904 box-shadow: 0 0 0 2px var(--primary-700);
4905 }
4906
4907 .frm_toggle_long .frm_toggle_off,
4908 .frm_toggle_long .frm_toggle_on {
4909 width: 50%;
4910 text-align: center;
4911 font-size: 13px;
4912 line-height: 28px;
4913 }
4914
4915 .frm_toggle_long .frm_toggle_on {
4916 left: 0;
4917 }
4918
4919 .frm_toggle_long .frm_toggle_off {
4920 right: 0;
4921 }
4922
4923 .frm_toggle_long .frm_toggle_slider:before {
4924 width: 50%;
4925 left: 0;
4926 top: 0;
4927 border-radius: var(--border-radius) 0 0 var(--border-radius);
4928 height: 100%;
4929 background-color: #fff;
4930 color: var(--primary-color);
4931 content: '' !important;
4932 }
4933
4934 .frm_toggle_long input:checked + .frm_toggle_slider:before {
4935 transform: translateX(101%);
4936 border-radius: 0 var(--border-radius) var(--border-radius) 0;
4937 }
4938
4939 input:checked + .frm_toggle_slider + .frm_toggle_on {
4940 display: inline;
4941 }
4942
4943 input:checked + .frm_toggle_slider + .frm_toggle_on + .frm_toggle_off {
4944 display: none;
4945 }
4946
4947 .frm_toggle_long .frm_toggle_on,
4948 .frm_toggle_long input:checked + .frm_toggle_slider + .frm_toggle_on + .frm_toggle_off {
4949 display: inline;
4950 color: var(--primary-500);
4951 font-weight: normal;
4952 }
4953
4954 .frm_toggle_long .frm_toggle_off,
4955 .frm_toggle_long input:checked + .frm_toggle_slider + .frm_toggle_on {
4956 color: #fff;
4957 font-weight: bold;
4958 }
4959
4960 /* End toggle styling */
4961
4962 /* Global Settings */
4963
4964 .tabs-panel {
4965 height: auto !important;
4966 min-height: 260px;
4967 }
4968
4969 .tabs-panel.panel_secondary {
4970 min-height: 20px;
4971 margin-top: 10px;
4972 margin-left: 150px;
4973 }
4974
4975 label.frm-example-icon {
4976 margin-right: 20px !important;
4977 display: inline-block !important;
4978 }
4979
4980 #frm_stripe_icon {
4981 border-radius: 5px;
4982 }
4983
4984 #captcha_settings .frm_primary_label {
4985 margin-top: var(--gap-sm);
4986 }
4987
4988 .frm-long-icon-buttons {
4989 display: flex;
4990 gap: var(--gap-md);
4991 }
4992
4993 .frm-long-icon-buttons > label {
4994 border: 1px solid var(--grey-300);
4995 color: var(--grey-700);
4996 border-radius: var(--small-radius);
4997 display: flex;
4998 padding: var(--gap-sm);
4999 gap: var(--gap-sm);
5000 justify-content: center;
5001 align-items: center;
5002 width: calc( 33% - var(--gap-sm) );
5003 box-sizing: border-box;
5004 }
5005
5006 .frm-long-icon-buttons > label:hover {
5007 color: var(--primary-500);
5008 }
5009
5010 .frm-long-icon-buttons input[type=radio] {
5011 display: none;
5012 }
5013
5014 .frm-long-icon-buttons input[type=radio]:checked + label {
5015 border-color: var(--primary-500);
5016 box-shadow: 0 0 0 1px var(--primary-color);
5017 }
5018
5019 .frm-long-icon-buttons label > svg {
5020 height: 21px;
5021 }
5022
5023 .frm-example-icon .frmsvg,
5024 .frm-example-icon i {
5025 height: 20px;
5026 width: 20px;
5027 font-size: 20px;
5028 color: var(--grey-700);
5029 }
5030
5031 .frm_license_msg {
5032 margin-top: 0;
5033 }
5034
5035 .frm_authorized_box .frm-show-unauthorized,
5036 .frm_unauthorized_box .frm-show-authorized {
5037 display: none;
5038 }
5039
5040 .edd_frm_status_icon.frm_icon_font {
5041 color: #D54E21;
5042 margin: 0 5px;
5043 }
5044
5045 .edd_frm_status_icon.frm_icon_font.frm_inactive_icon {
5046 color: green;
5047 }
5048
5049 /* Hide the install steps for solutions */
5050 #form_global_settings .tabs-panel .num svg {
5051 display: none;
5052 }
5053
5054 /* Empty List */
5055
5056 .frm_no_items {
5057 margin: 0 auto 50px;
5058 text-align: center;
5059 color: var(--grey-700);
5060 max-width: 500px;
5061 }
5062
5063 .frm-subscribe {
5064 margin: var(--gap-lg) 0;
5065 }
5066
5067 /* Inbox */
5068
5069 #frm_inbox_page .frm_page_container {
5070 height: auto;
5071 }
5072
5073 .frm_inbox_card {
5074 display: grid;
5075 grid-template-columns: 72px 1fr;
5076 grid-gap: var(--gap-xs);
5077 border-bottom: 1px solid var(--grey-300);
5078 padding: var(--gap-md);
5079 }
5080
5081 .frm_inbox_card_icon {
5082 grid-row: span 3 / span 3;
5083 padding-top: var(--gap-xs);
5084 text-align: center
5085 }
5086
5087 .frm_inbox_card_icon svg {
5088 height: 48px;
5089 width: 48px;
5090 color: var(--blue-border);
5091 }
5092
5093 .frm_inbox_card header {
5094 display: grid;
5095 grid-template-columns: 1fr 150px;
5096 align-items: center;
5097 }
5098
5099 .frm_inbox_card h3 {
5100 border: none;
5101 text-transform: none;
5102 margin: 0;
5103 padding: 0;
5104 }
5105
5106 .frm_inbox_date {
5107 text-align: right;
5108 }
5109
5110 .frm_inbox_count,
5111 .frm_inbox_unread {
5112 background: var(--orange);
5113 color: #fff;
5114 border-radius: 50%;
5115 display: inline-block;
5116 margin-right: 8px;
5117 font-size: 11px;
5118 text-align: center;
5119 }
5120
5121 .frm_inbox_unread {
5122 width: 8px;
5123 height: 8px;
5124 }
5125
5126 .frm_inbox_count {
5127 min-width: 18px;
5128 height: 18px;
5129 margin-left: 2px;
5130 vertical-align: text-bottom;
5131 }
5132
5133 /* Import/Export */
5134 .csv_opts #frm_csv_col_sep {
5135 width: 45px;
5136 }
5137
5138 #frm_advanced td.frm_left_label {
5139 width: 20%;
5140 padding-right: 2px;
5141 }
5142
5143 #frm_where_options select {
5144 max-width: 200px;
5145 }
5146
5147 #frm_where_options select.frm_insert_where_options {
5148 width: 30%;
5149 }
5150
5151 #frm_where_options select.frm_where_is_options {
5152 width: 20%;
5153 }
5154
5155 #frm_where_options span.frm_where_val {
5156 width: 32%;
5157 display: inline-block;
5158 position: relative;
5159 }
5160
5161 #frm_where_options span.frm_where_val .frm_tooltip_icon {
5162 left: -4px;
5163 position: absolute;
5164 }
5165
5166 #frm_where_options span.frm_where_val.frm_hidden {
5167 display: none;
5168 }
5169
5170 #frm_where_options span.frm_where_val input, #frm_where_options span.frm_where_val select {
5171 width: 90%;
5172 margin-left: 10px;
5173 }
5174
5175 #frm_where_options {
5176 min-height: 31px;
5177 }
5178
5179 .tabs-panel.active .tabs-panel, .frm_settings_form .tabs-panel .tabs-panel {
5180 border: none;
5181 padding: 0;
5182 }
5183
5184 .frm-feature-banner {
5185 background: var(--grey-700);
5186 color: #fff;
5187 border-radius: var(--small-radius);
5188 padding: 20px;
5189 margin: 10px 0;
5190 }
5191
5192 .frm-feature-banner p {
5193 font-size: var(--text-sm);
5194 }
5195
5196 .frm-feature-banner .dismiss {
5197 margin-top: -10px;
5198 margin-right: -10px;
5199 }
5200
5201 .frm-feature-banner .dismiss svg {
5202 color: #fff;
5203 }
5204
5205 .frm-feature-banner .frm-big-icon {
5206 padding-right: 20px;
5207 float: left;
5208 min-height: 60px;
5209 }
5210
5211 .frm-big-icon svg {
5212 height: 60px;
5213 width: 60px;
5214 }
5215
5216 .frm-feature-banner p {
5217 margin-top: 0;
5218 }
5219
5220 /*for add-on reverse compatibility */
5221
5222 .frm_98_width {
5223 width: 100% !important;
5224 }
5225
5226 /*Form Settings Tab*/
5227
5228 h2.frm-h2,
5229 .frm_form_settings h2 {
5230 border-bottom: 1px solid var(--grey-300);
5231 color: var(--grey-900);
5232 font-weight: 400 !important;
5233 padding: 9px 0 5px;
5234 margin: 0;
5235 }
5236
5237 .frm_settings_form h3,
5238 .frm_form_settings h3,
5239 .frm_form_settings span.frm_add_logic_link {
5240 font-size: var(--text-md);
5241 border-top: 1px solid var(--grey-300);
5242 padding-top: var(--gap-sm);
5243 margin: var(--gap-sm) 0;
5244 font-weight: normal;
5245 text-transform: uppercase;
5246 color: var(--medium-grey);
5247 display: block;
5248 }
5249
5250 .frm_form_settings .howto {
5251 color: var(--grey-500);
5252 font-size: var(--text-sm);
5253 margin-top: 8px;
5254 }
5255
5256 .frm_form_settings .advanced_settings .form-table {
5257 margin-top: 0;
5258 }
5259
5260 .frm_form_settings td.frm_175_width {
5261 width: 175px;
5262 }
5263
5264 .frm_form_settings #success_url {
5265 width: 95%;
5266 }
5267
5268 .frm_wrap .ui-autocomplete {
5269 padding: 3px 0;
5270 max-height: 310px;
5271 }
5272
5273 .frm_wrap .ui-widget {
5274 font-family: inherit;
5275 }
5276
5277 .frm_wrap .ui-autocomplete li {
5278 padding: 2px 4px;
5279 background: none;
5280 color: var(--grey-700);
5281 border: none;
5282 font-weight: normal;
5283 }
5284
5285 .frm_wrap .ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
5286 border: none;
5287 font-weight: inherit;
5288 }
5289
5290 .frm_select_with_label {
5291 margin: 7px 0 0;
5292 }
5293
5294 /* Customization Panel */
5295 #frm-insert-fields-box, #frm-conditionals {
5296 max-height: none;
5297 }
5298
5299 #frm-conditionals, #frm-adv-info-tab {
5300 display: none;
5301 max-height: 355px;
5302 }
5303
5304 #frm-insert-fields-box ul.subsubsub,
5305 #frm-conditionals ul.subsubsub {
5306 float: right;
5307 margin: 0;
5308 }
5309
5310 #frm-insert-fields-box ul.alignleft,
5311 #frm-conditionals ul.alignleft {
5312 margin: 5px 0 0;
5313 }
5314
5315 #frm_adv_info ul.frm_code_list.frm-full-hover {
5316 clear: both;
5317 max-height: 215px;
5318 overflow: auto;
5319 }
5320
5321 #frm-insert-fields-box ul.frm_code_list li.clear.frm_block {
5322 height: 10px;
5323 }
5324
5325 #frm_adv_info .frm_noallow {
5326 display: none;
5327 }
5328
5329 #frm_adv_info #frm-conditionals .frm_noallow {
5330 display: block;
5331 }
5332
5333 /* Customize HTML Tab */
5334 #frm_html_tab.frm_hidden {
5335 display: none;
5336 }
5337
5338 #frm_html_tab.active {
5339 display: inline;
5340 }
5341
5342 /*Form Actions Tab*/
5343 .frm_email_reply_container select,
5344 .frm_email_reply_container input,
5345 .form-table td.frm_150_width {
5346 width: 170px;
5347 }
5348
5349 #frm_notification_settings .frm_no_top_padding {
5350 padding-top: 0;
5351 }
5352
5353 .frm_email_settings.frm_email_settings.widgets-holder-wrap {
5354 overflow: auto;
5355 box-shadow: none;
5356 }
5357
5358 #frm_notification_settings .widget-top .widget-action,
5359 #frm_form_editor_container .widget-top .widget-action {
5360 border: 0;
5361 margin: 0;
5362 padding: 8px;
5363 background: 0 0;
5364 cursor: pointer;
5365 outline: 0;
5366 }
5367
5368 #frm_email_addon_menu {
5369 border: 1px solid var(--grey-300);
5370 padding: var(--gap-sm);
5371 border-radius: 4px;
5372 margin: var(--gap-md) 0 var(--gap-sm);
5373 }
5374
5375 #frm_email_addon_menu .frm-search {
5376 float: right;
5377 margin: 0;
5378 }
5379
5380 #frm_email_addon_menu h3.frm-no-border {
5381 clear: none;
5382 padding-top: 7px;
5383 }
5384
5385 .frm_email_settings .widget .widget-top {
5386 background-color: var(--sidebar-color);
5387 }
5388
5389 .frm_email_settings .widget .widget-top,
5390 .frm_email_settings .widget .widget-top h3 {
5391 cursor: pointer !important;
5392 }
5393
5394 .frm_email_settings .widget {
5395 margin-bottom: var(--gap-sm);
5396 }
5397
5398 .frm_form_action_settings .widget-top {
5399 box-shadow: none;
5400 border-color: var(--grey-300);
5401 border-radius: var(--small-radius);
5402 background: var(--lightest-grey);
5403 color: var(--grey-700);
5404 }
5405
5406 .frm_form_action_settings:hover .widget-top {
5407 border-color: var(--grey);
5408 }
5409
5410 .frm_form_action_settings.open .widget-top {
5411 border-bottom-left-radius: 0;
5412 border-bottom-right-radius: 0;
5413 border-bottom: none;
5414 }
5415
5416 .frm_form_action_settings.open:hover .widget-top {
5417 border-color: var(--grey-300);
5418 }
5419
5420 .frm_form_action_settings > .widget-inside {
5421 display: none;
5422 }
5423
5424 .frm_form_action_settings.open > .widget-inside {
5425 display: block;
5426 }
5427
5428 .frm_form_action_settings .widget-inside {
5429 min-height: 25px;
5430 padding: 15px;
5431 border-color: var(--grey-300);
5432 border-bottom-left-radius: 4px;
5433 border-bottom-right-radius: 4px;
5434 }
5435
5436 .frm_form_action_settings .widget-title h4,
5437 .frm_form_action_settings .widget-title h3 {
5438 display: inline-block;
5439 border-bottom: none;
5440 padding: 10px 10px 5px;
5441 font-size: var(--text-md);
5442 font-weight: 500;
5443 }
5444
5445 #frm_email_addon_menu h3 {
5446 margin: 0 0 var(--gap-sm);
5447 clear: both;
5448 }
5449
5450 .frm_single_api_settings p > label {
5451 display: inline;
5452 }
5453
5454 .frm_form_action_icon {
5455 margin-right: 5px;
5456 }
5457
5458 .frm_actions_list {
5459 margin: 0;
5460 display: inline;
5461 }
5462
5463 .frm_actions_list li {
5464 float: left;
5465 width: 15.6%;
5466 margin: 10px .5% 15px;
5467 height: 100px;
5468 text-align: center;
5469 }
5470
5471 .frm-limited-actions .frm-group-heading,
5472 .frm-limited-actions #frm-hide-groups,
5473 .frm-all-actions #frm-show-groups,
5474 .frm-limited-actions .frm-not-installed:not(.frm-search-result):not(.frm-default-show) {
5475 display: none;
5476 }
5477
5478 label.frm_action_events {
5479 padding-left: 15px;
5480 }
5481
5482 #frm-hide-groups,
5483 #frm-show-groups {
5484 font-size: var(--text-md);
5485 float: right;
5486 }
5487
5488 .frm_actions_list a:active, .frm_actions_list a:focus {
5489 outline: none;
5490 }
5491
5492 .frm_actions_list a {
5493 font-size: var(--text-sm);
5494 color: var(--grey-700);
5495 word-break: break-word;
5496 }
5497
5498 .frm_actions_list span.frm-outer-circle {
5499 /* 50px total with 30px content */
5500 background-color: var(--grey-100);
5501 padding: 10px;
5502 text-align: center;
5503 border-radius: 50%;
5504 display: block;
5505 width: 30px;
5506 height: 30px;
5507 margin: 0 auto 15px;
5508 line-height: 1;
5509 }
5510
5511 .frm_email_settings .widget-title h4 {
5512 color: var(--grey-700);
5513 }
5514
5515 .frm_disabled_action .widget-title h4 {
5516 color: var(--grey);
5517 }
5518
5519 .frm_actions_list a .frmsvg,
5520 .frm_actions_list a i {
5521 height: 18px;
5522 width: 18px;
5523 font-size: 18px;
5524 padding: 2px;
5525 color: var(--lightest-grey);
5526 }
5527
5528 span.frm-inner-circle,
5529 .frm_email_settings .widget-title .frm_form_action_icon {
5530 background-color: var(--grey-400);
5531 border-radius: 50%;
5532 display: inline-block;
5533 text-align: center;
5534 line-height: 1;
5535 }
5536
5537 span.frm-inner-circle {
5538 background-color: var(--primary-700);
5539 height: 22px;
5540 width: 22px;
5541 padding: 4px;
5542 color: #fff;
5543 }
5544
5545 .frm-inner-circle svg {
5546 fill: currentColor;
5547 }
5548
5549 .frm_email_settings .widget-title .frm_form_action_icon {
5550 height: 15px;
5551 width: 15px;
5552 padding: 5px;
5553 color: #fff;
5554 vertical-align: middle;
5555 }
5556
5557 .frm_actions_list .frmsvg,
5558 .frm_actions_list i:before,
5559 .frm_email_settings .widget-title .frm_form_action_icon i,
5560 .frm_email_settings .widget-title .frm_form_action_icon .frmsvg {
5561 height: 15px;
5562 width: 15px;
5563 vertical-align: text-top;
5564 }
5565
5566 .frm_actions_list i:before {
5567 vertical-align: middle;
5568 }
5569
5570 .frm_email_settings .widget-title:hover .frm_form_action_icon {
5571 background-color: var(--grey);
5572 }
5573
5574 span.frm-inner-circle.frm-inverse {
5575 background-color: transparent;
5576 color: var(--primary-700);
5577 padding: 0;
5578 height: 30px;
5579 width: 100%;
5580 }
5581
5582 .frm_actions_list span.frm-inverse i,
5583 .frm_actions_list span.frm-inverse .frmsvg {
5584 color: var(--primary-700);
5585 height: 30px;
5586 width: 30px;
5587 font-size: 30px;
5588 padding: 0;
5589 }
5590
5591 .frm_actions_list i.frm-inverse:before {
5592 height: 30px;
5593 width: 100%;
5594 font-size: 30px;
5595 }
5596
5597 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse {
5598 background: #fff;
5599 padding: 0;
5600 height: 24px;
5601 width: 24px;
5602 }
5603
5604 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse .frmsvg,
5605 .frm_email_settings .widget-title .frm_form_action_icon.frm-inverse i:before {
5606 color: var(--grey-400);
5607 height: 24px;
5608 width: 24px;
5609 font-size: 24px;
5610 }
5611
5612 .frm_email_settings .widget-title:hover .frm_form_action_icon.frm-inverse .frmsvg,
5613 .frm_email_settings .widget-title:hover .frm_form_action_icon.frm-inverse i:before {
5614 color: var(--grey-500);
5615 }
5616
5617 .frm_email_icons {
5618 padding: 10px 0 5px 6px;
5619 font-size: 20px;
5620 }
5621
5622 .frm_email_icons a {
5623 margin-left: 8px;
5624 color: var(--grey);
5625 opacity: 0;
5626 transition: all .2s ease;
5627 }
5628
5629 .frm_email_icons a .frmsvg {
5630 color: var(--grey);
5631 }
5632
5633 .frm_email_icons a:hover,
5634 .widget-top:hover .frm_email_icons a {
5635 opacity: 1;
5636 }
5637
5638 .frm_actions_list a.frm_inactive_action {
5639 color: var(--grey);
5640 }
5641
5642 .frm_inactive_action .frm-inner-circle,
5643 .frm_actions_list .frm_inactive_action i {
5644 opacity: .4;
5645 }
5646
5647 table td, .form-table tr td {
5648 vertical-align: top;
5649 }
5650
5651 #new_fields .form-table tr td {
5652 display: block;
5653 padding: 7px 0 0;
5654 }
5655
5656 #new_fields .form-table tr td:first-child {
5657 margin: 0;
5658 }
5659
5660 #new_fields .form-table tr td:last-child {
5661 margin-bottom: 9px;
5662 }
5663
5664 .form-table #list-table th {
5665 text-align: center;
5666 }
5667
5668 #form_settings_page th,
5669 #form_settings_page td,
5670 .frm_settings_form td,
5671 #frm_notification_settings .frm_form_action_settings td p {
5672 padding: 7px 0;
5673 }
5674
5675 #permissions_settings_settings .frm_grid_container {
5676 align-items: center;
5677 }
5678
5679 #frm_notification_settings .form-table > tbody > tr > th {
5680 width: 150px;
5681 font-weight: normal;
5682 padding-right: 10px;
5683 }
5684
5685 #frm_notification_settings .frm_single_email_settings .form-table > tbody > tr > th {
5686 width: 80px;
5687 }
5688
5689 #frm_notification_settings table tr td:first-child {
5690 padding-left: 0;
5691 }
5692
5693 #frm_notification_settings table tr td:last-child {
5694 padding-right: 0;
5695 }
5696
5697
5698 #frm_notification_settings .frm_left_label {
5699 /* For add-ons that haven't been updated for 4.0 */
5700 float: none;
5701 width: auto !important;
5702 }
5703
5704 .frm-fields .frm_autoresponder_rows select {
5705 width: auto;
5706 }
5707
5708 #frm_notification_settings .frm_with_left_label,
5709 #frm_notification_settings .frm_left_label + textarea,
5710 #frm_notification_settings .frm_left_label + select,
5711 #frm_notification_settings .frm_left_label + input[type=text] {
5712 width: 100%;
5713 }
5714
5715 #frm_notification_settings .frm_email_buttons {
5716 padding: var(--gap-2xs);
5717 background: var(--light-blue);
5718 color: var(--primary-700);
5719 border-radius: var(--small-radius);
5720 border-color: var(--blue-border);
5721 line-height: 1;
5722 height: auto;
5723 min-height: 12px;
5724 font-size: var(--text-xs);
5725 box-shadow: none;
5726 }
5727
5728 .frm_reply_to_container,
5729 .frm_bcc_cc_container {
5730 float: right;
5731 margin: -4px 0 0;
5732 z-index: 1;
5733 position: relative;
5734 }
5735
5736 .frm_email_row .frm_cancel1_icon:before {
5737 vertical-align: bottom;
5738 }
5739
5740 .frm_logic_field_opts {
5741 max-width: 35%;
5742 }
5743
5744 .frm-inline-select,
5745 p.frm-inline-select,
5746 #frm_submit_logic_row,
5747 .frm_logic_rows .frm-collapse-me {
5748 line-height: var(--h-md) !important;
5749 }
5750
5751 .frm_logic_row {
5752 padding: var(--gap-xs) 0 0;
5753 align-items: center;
5754 }
5755
5756 .frm-single-settings .frm_logic_row > select {
5757 max-width: 32.5% !important;
5758 }
5759
5760 .frm-single-settings .frm_logic_row select:nth-child(2) {
5761 max-width: 20% !important;
5762 }
5763
5764 .frm-single-settings .frm_logic_row span input,
5765 .frm-single-settings .frm_logic_row span select {
5766 max-width: 36% !important;
5767 }
5768
5769 .frm-single-settings .frm_logic_row input {
5770 max-width: 118px !important;
5771 }
5772
5773 .frm-single-settings ul.frm_sortable_field_opts {
5774 margin-bottom: 5px;
5775 }
5776
5777 .advanced_settings .frm_logic_row {
5778 margin: 14px 0;
5779 }
5780
5781 .advanced_settings .frm_logic_row select,
5782 .advanced_settings .frm_logic_row input {
5783 max-width: 30% !important;
5784 }
5785
5786 .frm_form_action_settings .frm_logic_row p {
5787 margin-top: 0;
5788 margin-bottom: 0;
5789 padding: 0;
5790 }
5791
5792 #poststuff .widgets-holder-wrap .frm_form_action_settings .widget-inside {
5793 padding-bottom: 0;
5794 }
5795
5796 #poststuff .frm_form_settings .widgets-holder-wrap .widget-inside {
5797 padding-left: 15px;
5798 padding-right: 15px;
5799 }
5800
5801 #form_global_settings h3 {
5802 font-size: var(--text-sm);
5803 margin-top: 25px;
5804 }
5805
5806 #form_global_settings .tabs-panel + h3 {
5807 margin-top: 0;
5808 border: none;
5809 }
5810
5811 #poststuff .frm_form_settings .widget-inside h3,
5812 #poststuff .frm_form_settings .advanced_settings h3,
5813 #poststuff .frm_settings_form h3,
5814 #frm_advanced .inside h3 {
5815 border-top: 1px solid #eee;
5816 border-bottom: none;
5817 margin: 15px -15px 0;
5818 padding: 8px 15px;
5819 font-size: var(--text-sm);
5820 }
5821
5822 #poststuff .frm_form_settings h3.frm_first_h3,
5823 #poststuff h3.frm_first_h3 {
5824 border: none;
5825 margin-top: 0;
5826 }
5827
5828 h3.frm_add_logic_link {
5829 margin-bottom: 0 !important;
5830 }
5831
5832 a.frm_add_logic_link.frm_hidden {
5833 display: none;
5834 }
5835
5836 .frm_add_logic_link .frmsvg,
5837 .frm_add_logic_link i {
5838 margin-right: 5px;
5839 }
5840
5841 .frm_right_addon {
5842 position: relative;
5843 }
5844
5845 .frm_right_addon .frm_remove_field {
5846 position: absolute;
5847 padding: 5px 10px;
5848 right: 10px;
5849 bottom: 0;
5850 }
5851
5852 .frm_right_addon input {
5853 padding-right: var(--gap-lg);
5854 }
5855
5856 .frm_icon_font {
5857 color: #A0A0A0;
5858 color: var(--grey);
5859 }
5860
5861 .frm-fields label .frm_icon_font {
5862 font-size: inherit;
5863 }
5864
5865 .misc-pub-revisions.frm_icon_font,
5866 .misc-pub-revisions.frm_icon_font:hover {
5867 color: inherit;
5868 }
5869
5870 .postbox.frm_with_icons .inside {
5871 padding: 0;
5872 margin: 0;
5873 }
5874
5875 .frm_add_tag:before {
5876 content: '\e602';
5877 }
5878
5879 .frm_remove_tag:before {
5880 content: '\e600';
5881 }
5882
5883 .frm_logic_row .frm_remove_tag {
5884 padding-left: 7px;
5885 }
5886
5887 .frm_logic_row .frm1 > .frm_remove_tag {
5888 padding: 0;
5889 }
5890
5891 .frm_tooltip_icon:before {
5892 font-size: 13px;
5893 vertical-align: top;
5894 }
5895
5896 .form-field input[type=text].frm_other_input {
5897 width: 30%;
5898 margin-left: 10px;
5899 }
5900
5901 .frm-add-other {
5902 text-align: right;
5903 }
5904
5905 .frm_add_opt .frm_add_tag,
5906 .frm-add-other .frm_add_tag {
5907 vertical-align: 20%;
5908 }
5909
5910 .frm_action_icon {
5911 margin: 5px 0 0 5px;
5912 }
5913
5914 span.frm_action_icon {
5915 margin: 0 4px 0 0;
5916 }
5917
5918 .frm_action_icon:active {
5919 outline: none;
5920 }
5921
5922 a.frm_action_icon:hover {
5923 text-decoration: none;
5924 }
5925
5926 .frm_action_icon.frm_error_icon:before {
5927 content: '\e608';
5928 }
5929
5930 .frm_inactive_icon.frm_action_icon.frm_error_icon:before {
5931 content: '\e606';
5932 }
5933
5934 .frm-field-action-icons {
5935 text-align: right;
5936 position: absolute;
5937 top: 2px;
5938 right: 2px;
5939 max-width: 100%;
5940 }
5941
5942 .frm-field-action-icons .frm-field-id {
5943 display: inline-block;
5944 overflow: hidden;
5945 text-overflow: ellipsis;
5946 white-space: nowrap;
5947 width: 80px;
5948 max-width: calc( 100% - 50px );
5949 position: relative;
5950 top: 2px;
5951 }
5952
5953 .frm-field-action-icons > a {
5954 font-size: var(--text-md);
5955 width: 17px;
5956 }
5957
5958 .frm-field-action-icons a:hover {
5959 text-decoration: none;
5960 }
5961
5962 .frm-field-action-icons .dropdown {
5963 display: inline-block;
5964 }
5965
5966 .frm-field-action-icons > a .frmsvg {
5967 color: var(--grey-500) !important;
5968 font-size: 17px;
5969 width: 17px;
5970 height: 17px;
5971 }
5972
5973 .frm-field-action-icons > a .frmsvg,
5974 .frm-field-action-icons > div > a .frmsvg {
5975 vertical-align: baseline;
5976 }
5977
5978 .edit_field_type_end_divider .frm-field-action-icons {
5979 display: none !important;
5980 }
5981
5982 .frm-move {
5983 cursor: grab;
5984 }
5985
5986 span.howto {
5987 display: inline;
5988 }
5989
5990 .frm_import_message {
5991 margin: 15px 0;
5992 line-height: 2.5em;
5993 }
5994
5995 .frm_sorting .form-field .widget input[type="text"],
5996 .frm_sorting .form-field .widget input[type="number"],
5997 .frm_sorting .form-field .widget select,
5998 #wpcontent .frm_sorting .form-field .widget select,
5999 .frm_sorting .form-field .widget textarea {
6000 width: auto;
6001 }
6002
6003 .tagchecklist span.no_taglist {
6004 display: inline;
6005 float: none;
6006 line-height: 15px;
6007 margin-right: 0;
6008 font-size: inherit;
6009 }
6010
6011 .tagchecklist .frm_exclude_cat_list span {
6012 display: inline;
6013 }
6014
6015 .tagchecklist span a:before {
6016 line-height: 23px;
6017 text-align: start;
6018 }
6019
6020 /* Entries Page */
6021 .frm_no_entries_form {
6022 padding: 60px 0;
6023 }
6024
6025 .frm_no_entries_form .frm_no_entries_header {
6026 font-size: 20px;
6027 margin-bottom: 10px;
6028 }
6029
6030 .frm_no_entries_form .frm_no_entries_text {
6031 line-height: var(--leading);
6032 }
6033
6034 #form_entries_page #the-list .no-items {
6035 height: 240px; /* Equals to the max height of search dropdown */
6036 }
6037
6038 /* Reports Page */
6039 #form_reports_page img.frm_no_reports {
6040 max-width: 100%;
6041 }
6042
6043 .frm_wrap .google-visualization-table .gradient,
6044 .frm_wrap .google-visualization-table-tr-head,
6045 .frm_wrap .google-visualization-table-tr-odd,
6046 .frm_wrap .google-visualization-table-tr-odd.google-visualization-table-tr-over {
6047 background: var(--lightest-grey);
6048 }
6049
6050 .frm_wrap .google-visualization-table-tr-over {
6051 background: #fff;
6052 }
6053
6054 .frm_wrap .google-visualization-table-table th,
6055 .frm_wrap .google-visualization-table-table td {
6056 border-right-width: 0;
6057 padding: 10px !important;
6058 }
6059
6060 .frm_wrap .google-visualization-table-tr-head,
6061 .frm_wrap .google-visualization-table-tr-head th {
6062 white-space: pre-wrap;
6063 font-size: var(--text-md);
6064 font-weight: 400 !important;
6065 text-align: left;
6066 }
6067
6068 .frm_wrap .google-visualization-table-td-number {
6069 text-align: inherit;
6070 }
6071
6072 #form_reports_page .postbox{
6073 text-align: center;
6074 float: none;
6075 display: inline-block;
6076 margin-right: 2%;
6077 width: 20%;
6078 min-width: 175px;
6079 }
6080
6081 /* Views Page */
6082 #form_views_page img.frm_no_views {
6083 max-width: 100%;
6084 }
6085
6086 /* Field options popup */
6087 .frm_field_opts_popup {
6088 min-width: 300px;
6089 background-color: #fff;
6090 }
6091
6092 .frm_field_opts_popup #wpadminbar {
6093 display: none;
6094 }
6095
6096 .frm_prepop {
6097 width: 100%;
6098 list-style: none;
6099 overflow: auto;
6100 margin: 0;
6101 max-height: 295px;
6102 }
6103
6104 .frm_prepop li {
6105 margin: 0;
6106 }
6107
6108 .frm_prepop li a {
6109 display: block;
6110 text-decoration: none;
6111 cursor: pointer;
6112 padding: 5px 20px;
6113 }
6114
6115 .frm_prepop li a:hover {
6116 background: var(--sidebar-color);
6117 }
6118
6119 /* */
6120 #frm_form_editor_container #frm_form_key_box {
6121 width: 13em;
6122 max-width: 30%
6123 }
6124
6125 #frm_form_editor_container #frm_form_desc {
6126 width: 70%;
6127 }
6128
6129 #frm_form_editor_container .ui-widget-content {
6130 display: none;
6131 padding: 15px;
6132 }
6133
6134 #frm_form_editor_container .ui-widget-content label {
6135 float: left;
6136 width: 170px;
6137 text-align: right;
6138 padding-right: 5px;
6139 clear: both;
6140 }
6141
6142 #frm_form_editor_container .ui-widget-content label.nofloat {
6143 clear: none;
6144 float: none;
6145 margin-left: 10px;
6146 }
6147
6148 #frm_form_editor_container .ui-state-default {
6149 color: #333 !important;
6150 }
6151
6152 .frm_green {
6153 color: var(--green) !important;
6154 }
6155
6156 #frm_form_editor_container .ui-state-default a.frm_orange, .frm-right-panel a.frm_orange, #postbox-container-1 a.frm_orange {
6157 color: #D54E21;
6158 }
6159
6160 #styling_settings input[type=checkbox], #styling_settings input[type=radio] {
6161 border: solid 1px #bbb;
6162 }
6163
6164 #styling_settings .widget .widget-top, #frm_form_editor_container .widget .widget-top {
6165 cursor: pointer;
6166 }
6167
6168 .frm_sorting .widget, .frm_settings_page .widget {
6169 background: #fff;
6170 }
6171
6172 .frm_sorting .widget-title h4 {
6173 font-weight: normal;
6174 }
6175
6176 .frm_sorting .widget, #postbox-container-1 .widget, .frm-right-panel .widget, .frm_settings_page .widget {
6177 margin-bottom: 0;
6178 }
6179
6180 .frm_settings_page .widget-inside {
6181 padding: 0 5px 5px;
6182 }
6183
6184 .frm_sorting .widget,
6185 .widget-inside,
6186 .frm_sorting .form-field .widget {
6187 display: none;
6188 }
6189
6190 #frm-show-fields {
6191 min-height: 350px;
6192 padding: 0 0 35px;
6193 margin: 0;
6194 position: relative;
6195 }
6196
6197 .frm-has-fields #frm-show-fields {
6198 min-height: 50px;
6199 }
6200
6201 #frm_builder_page li[data-ftype="gateway"] {
6202 /* Gateway fields are included for add-on compatibility but we do not want it to be visible. */
6203 display: none;
6204 }
6205
6206 #frm_builder_page .frm-lite-credit-card-element,
6207 body.frm-admin-page-styles .frm-lite-credit-card-element {
6208 position: relative;
6209 }
6210
6211 #frm_builder_page .frm-lite-credit-card-element > div,
6212 body.frm-admin-page-styles .frm-lite-credit-card-element > div {
6213 position: absolute;
6214 top: calc( 50% - 1px);
6215 transform: translateY(-50%);
6216 right: 10px;
6217 color: #d0d4dd;
6218 }
6219
6220 #frm_builder_page #frm_field_group_controls {
6221 position: absolute;
6222 padding: 5px;
6223 border-radius: 4px 4px 0 0;
6224 text-align: right;
6225 box-sizing: border-box;
6226 right: 0;
6227 top: -28px;
6228 height: 28px;
6229 z-index: 3; /* section dividers use z-index: 2; position above that to avoid it taking over hover control. */
6230 }
6231
6232 .frm-field-group-hover-target,
6233 .frm-has-open-field-group-popup,
6234 #frm_builder_page #frm_field_group_controls,
6235 .frm-selected-field-group {
6236 background: rgba(65, 153, 253, 0.04);
6237 }
6238
6239 .frm-selected-field-group {
6240 position: relative;
6241 }
6242
6243 #frm_builder_page #frm_field_group_controls > span:first-child {
6244 margin-right: 5px;
6245 }
6246
6247 #frm_builder_page #frm_field_group_controls svg {
6248 pointer-events: none;
6249 }
6250
6251 #frm_field_group_controls {
6252 visibility: hidden;
6253 }
6254
6255 .frm-field-group-hover-target #frm_field_group_controls {
6256 visibility: visible;
6257 }
6258
6259 #frm_field_group_controls .dropdown-item a span {
6260 color: var(--grey-700);
6261 }
6262
6263 #frm_field_group_controls .dropdown-item a:hover {
6264 text-decoration: none;
6265 }
6266
6267 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider {
6268 display: none !important;
6269 }
6270
6271 .frm-right-panel .ui-state-default,
6272 #postbox-container-1 .ui-state-default,
6273 .frm_sorting > li.ui-state-default,
6274 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider:hover {
6275 border: 1px solid transparent;
6276 font-weight: normal !important;
6277 background-color: transparent;
6278 background-image: none;
6279 padding: 5px;
6280 margin: 0;
6281 box-shadow: none;
6282 display: block;
6283 text-align: inherit !important;
6284 overflow: visible;
6285 position: relative;
6286 }
6287
6288 #frm-show-fields li.frm_cancel_sort {
6289 /* If a section gets dropped into a section, hide it */
6290 display: none;
6291 }
6292
6293 .divider_drop {
6294 text-align: center;
6295 }
6296
6297 .divider_drop .howto .frm_icon_font {
6298 font-style: normal;
6299 }
6300
6301 .show_repeat_sec {
6302 display: none;
6303 }
6304
6305 .repeat_section .show_repeat_sec {
6306 display: inline-block;
6307 margin: 5px 0 0;
6308 }
6309
6310 .repeat_section tr.show_repeat_sec {
6311 display: table-row;
6312 }
6313
6314 .repeat_format .frm_repeat_label,
6315 .repeat_formattext .frmsvg,
6316 .repeat_formattext i {
6317 display: none;
6318 }
6319
6320 .frm_button {
6321 text-decoration: none;
6322 border: 1px solid #eee;
6323 padding: 5px;
6324 color: #444;
6325 vertical-align: middle;
6326 box-shadow: none !important;
6327 }
6328
6329 a.frm_button:hover {
6330 text-decoration: none !important;
6331 }
6332
6333 .frm_button,
6334 .frm_button .frm_icon_font:before {
6335 font-size: 13px;
6336 vertical-align: middle;
6337 }
6338
6339 .frm_button .frmsvg {
6340 width: 13px;
6341 height: 13px;
6342 }
6343
6344 .frm-right-panel .ui-state-default,
6345 #postbox-container-1 .ui-state-default {
6346 padding: 0;
6347 margin: 0;
6348 }
6349
6350 ul.start_divider {
6351 padding: 8px 13px 0 8px;
6352 min-height: 115px;
6353 transition: all 0.4s linear;
6354 }
6355
6356 .frm-section-collapsed .frm_no_section_fields,
6357 .frm-section-collapsed ul.start_divider {
6358 height: 0;
6359 min-height: 0 !important;
6360 }
6361
6362 .frm-section-collapsed ul.start_divider {
6363 overflow: hidden;
6364 }
6365
6366 .frm-section-collapsed .frm_no_section_fields {
6367 overflow: hidden;
6368 padding: 0;
6369 opacity: 0;
6370 }
6371
6372 .frm-section-collapsed .divider_section_only .frm-collapsed-label {
6373 display: inline;
6374 }
6375
6376 .frm-page-collapsed .frm_clone_icon,
6377 .frm-page-collapsed .frm_delete_field,
6378 .frm-page-collapsed .frm_clone_field,
6379 .frm-section-collapsed .frm_clone_icon {
6380 opacity: .5;
6381 cursor: not-allowed;
6382 }
6383
6384 /* Hide the Duplicate summary option because we are missing the logic that also adds a new page */
6385 .edit_field_type_summary .frm_more_options_li:nth-child(2) {
6386 display: none !important;
6387 }
6388
6389 .frm_no_section_fields:not(.frm_block) + ul.start_divider {
6390 padding: 0;
6391 min-height: 132px;
6392 }
6393
6394 .frm_sorting li.ui-state-default .divider_section_only {
6395 padding: 6px;
6396 margin-top: -10px;
6397 border: 2px solid transparent;
6398 border-radius: var(--small-radius);
6399 z-index: 2;
6400 position: relative;
6401 }
6402
6403 .divider_section_only > .frm_inner_field_container {
6404 padding: 5px 0;
6405 margin: 0;
6406 }
6407
6408 .frm-collapsed-label,
6409 .divider_section_only > .frm_inner_field_container .frm_form_fields {
6410 display: none;
6411 }
6412
6413 .frm-section-collapsed .divider_section_only:after,
6414 .divider_section_only:before {
6415 content: '';
6416 display: block;
6417 padding: 2px 0;
6418 line-height: 1px;
6419 border-top: 2px solid var(--grey-300);
6420 top: -2px;
6421 position: absolute;
6422 width: 100%;
6423 transition: .5s border-color ease-in-out;
6424 }
6425
6426 .frm-section-collapsed .divider_section_only:after {
6427 top: auto;
6428 bottom: -6px;
6429 }
6430
6431 .frm-section-collapsed .divider_section_only:hover:after,
6432 li.selected.frm-section-collapsed .divider_section_only:before,
6433 li.selected.frm-section-collapsed .divider_section_only:after,
6434 .divider_section_only:hover:before,
6435 li.selected .divider_section_only:before {
6436 border-color: transparent;
6437 }
6438
6439 .frm_sorting li.ui-state-default.edit_field_type_divider {
6440 overflow: visible;
6441 position: relative;
6442 padding: 0 0 0 20px;
6443 margin: 25px 0 0 -5px;
6444 border-left: 1px solid var(--primary-700);
6445 transition: border 0.7s ease-out;
6446 }
6447
6448 .frm-section-collapsed {
6449 border-left-color: transparent !important;
6450 }
6451
6452 .frm_sorting li.edit_field_type_end_divider,
6453 .frm_sorting .no_repeat_section li.ui-state-default.edit_field_type_end_divider:hover {
6454 margin: 0 0 var(--gap-sm);
6455 }
6456
6457 .frm-first-page .frm_prev_page {
6458 display: none;
6459 }
6460
6461 #frm_builder_page .frm_remove_form_row.frm_button,
6462 #frm_builder_page .frm_add_form_row.frm_button {
6463 border-radius: var(--small-radius);
6464 border: 1px solid var(--blue-border);
6465 }
6466
6467 #frm_builder_page .frm_remove_form_row .frmsvg,
6468 #frm_builder_page .frm_remove_form_row i:before,
6469 #frm_builder_page .frm_add_form_row .frmsvg,
6470 #frm_builder_page .frm_add_form_row i:before {
6471 color: var(--primary-700);
6472 }
6473
6474 .frm-preview-buttons .frm_button_submit {
6475 margin: 0 5px;
6476 }
6477
6478 .frm-page-break {
6479 border-top: 1px dashed var(--primary-700);
6480 margin-top: var(--gap-lg);
6481 position: relative;
6482 }
6483
6484 .edit_field_type_divider:before,
6485 .edit_field_type_divider:after,
6486 .frm-page-break:before,
6487 .frm-page-break:after {
6488 content: '';
6489 position: absolute;
6490 top: -4px;
6491 width: 4px;
6492 height: 4px;
6493 background-color: #fff;
6494 border-radius: 50%;
6495 border: 1px solid var(--primary-700);
6496 text-rendering: auto;
6497 -webkit-font-smoothing: antialiased;
6498 }
6499
6500 .frm-page-break:after {
6501 right: 0;
6502 }
6503
6504 #frm-fake-page {
6505 padding: 0 5px;
6506 }
6507
6508 #frm-fake-page .frm-page-break,
6509 #frm-fake-page .frm-page-break:before,
6510 #frm-fake-page .frm-page-break:after {
6511 border-color: var(--grey);
6512 }
6513
6514 .edit_field_type_divider:before {
6515 width: 20px;
6516 height: 20px;
6517 left: -11px;
6518 top: 0;
6519 background: var(--primary-700);
6520 text-align: center;
6521 color: #fff;
6522 font-size: 13px;
6523 }
6524
6525 .edit_field_type_divider:before{
6526 font-family: 's11-fp';
6527 content: '\f1dc';
6528 }
6529
6530 .repeat_section.edit_field_type_divider:before {
6531 font-family: 's11-fp';
6532 content: '\f363';
6533 }
6534
6535 .edit_field_type_divider:after {
6536 left: -4px;
6537 bottom: 0;
6538 top: auto;
6539 transition: all 0.4s ease-out;
6540 }
6541
6542
6543 .frm_sorting li.edit_field_type_divider:hover,
6544 .frm_sorting li.edit_field_type_divider.selected {
6545 border-left-color: var(--primary-500);
6546 }
6547
6548 .edit_field_type_divider.selected:before,
6549 .edit_field_type_divider:hover:before {
6550 border-color: var(--primary-500);
6551 background: var(--primary-500);
6552 }
6553
6554 .edit_field_type_divider.selected:after,
6555 .edit_field_type_divider:hover:after {
6556 border-color: var(--primary-500);
6557 }
6558
6559 .frm-section-collapsed:after {
6560 border-color: transparent !important;
6561 color: transparent;
6562 }
6563
6564 .frm-page-break .frm-collapse-page.button {
6565 margin-left: 46%;
6566 margin-top: calc( -28px / 2 );
6567 }
6568
6569 #frm-fake-page.frm-page-collapsed {
6570 margin-bottom: 0;
6571 }
6572
6573 .frm-page-collapsed {
6574 position: relative;
6575 overflow: visible !important;
6576 margin-bottom: var(--gap-lg);
6577 }
6578
6579 .frm-page-collapsed:after {
6580 content: '';
6581 display: block;
6582 border: 1px dashed var(--grey-300);
6583 border-left: none;
6584 border-right: none;
6585 height: 6px;
6586 position: absolute;
6587 width: calc( 100% - 10px );
6588 bottom: -15px;
6589 }
6590
6591 .frm-collapse-page .frmsvg,
6592 .frm-collapse-page .frm_arrowdown6_icon {
6593 width: var(--text-sm);
6594 height: var(--text-sm);
6595 font-size: var(--text-sm);
6596 text-align: center;
6597 margin-left: 2px;
6598 color: currentColor;
6599 }
6600
6601 #frm-fake-page .frm_arrowdown6_icon {
6602 color: currentColor;
6603 }
6604
6605 .frm-collapsed i:before,
6606 .frm-page-collapsed .frm_arrowdown6_icon:before {
6607 content: '\e913';
6608 }
6609
6610 .frm-collapse-section svg {
6611 fill: var(--primary-color);
6612 transition: transform 0.2s ease-out, fill 0.2s ease-out;
6613 }
6614
6615 .frm-collapse-section:hover svg {
6616 fill: var(--primary-700);
6617 }
6618
6619 .frm-section-collapsed .frm-collapse-section svg {
6620 transform: rotate(-90deg);
6621 }
6622
6623 .open .widget-top .frm_arrow_right_icon:before {
6624 content: '\e62a';
6625 }
6626
6627 .frm-collapsed + .frm-collapse-me {
6628 overflow: hidden !important;
6629 }
6630
6631 .frm-collapse-me {
6632 padding-bottom: 10px;
6633 }
6634
6635 .frm-collapsed + div {
6636 height: 0;
6637 padding: 0;
6638 border-bottom: 2px solid var(--sidebar-hover);
6639 }
6640
6641 .frm_sorting .divider_section_only > .frm_ipe_field_label {
6642 font-size: 116%;
6643 }
6644
6645 #frm_form_editor_container .edit_field_type_break .frm_primary_label.frm_ipe_field_label.button {
6646 width: 150px;
6647 text-align: center;
6648 margin-bottom: 3px;
6649 display: block;
6650 }
6651
6652 tr.frm_options_heading td {
6653 padding-bottom: 0;
6654 }
6655
6656 .frm_sorting .widget-inside .form-table td p,
6657 .frm_sorting .widget-inside .form-wrap label {
6658 padding: 10px 0;
6659 }
6660
6661 .frm_no_fields,
6662 .frm_no_section_fields {
6663 text-align: center;
6664 position: absolute;
6665 color: var(--medium-grey);
6666 font-size: var(--text-md);
6667 box-sizing: border-box;
6668 border: 1px dashed var(--grey-300);
6669 }
6670
6671 .ui-droppable-active ~ .frm_no_fields {
6672 border-style: solid;
6673 }
6674
6675 .frm_no_section_fields {
6676 display: none;
6677 margin: 0;
6678 padding: 20px 0 0;
6679 width: calc( 100% - 20px );
6680 height: 121px;
6681 transition: all 0.4s linear;
6682 }
6683
6684 .frm_no_fields {
6685 min-height: 300px;
6686 margin: 20px 5%;
6687 width: 90%;
6688 top: 0;
6689 }
6690
6691 .frm-has-fields .frm_no_fields {
6692 display: none;
6693 }
6694
6695 #frm-form-button {
6696 display: none;
6697 margin: 0 7px 25px;
6698 }
6699
6700 .frm-has-fields #frm-form-button {
6701 display: block;
6702 }
6703
6704 .frm-large-plus.frmsvg {
6705 color: var(--primary-700);
6706 height: 45px;
6707 width: 45px;
6708 }
6709
6710 .frm_drag_inst {
6711 line-height: normal;
6712 font-size: 35px;
6713 font-weight: 300;
6714 margin: 80px 0 25px;
6715 }
6716
6717 .frm_no_section_fields p,
6718 .frm_no_fields p {
6719 color: var(--grey);
6720 font-size: 15px;
6721 }
6722
6723 .frm_product_price_wrapper {
6724 display: inline-block;
6725 vertical-align: middle;
6726 }
6727
6728 .frm_prod_type_single .frm_product_price_wrapper {
6729 width: 100%;
6730 }
6731
6732 #new_fields .frm_product_price_wrapper input:first-child {
6733 width: 60%;
6734 float: left;
6735 }
6736
6737 #new_fields .frm_product_price_wrapper input:nth-child(2) {
6738 width: 37%;
6739 float: right;
6740 }
6741
6742 .frm_priority_field_choices,
6743 li.frm_single_option {
6744 padding-bottom: 16px;
6745 border-bottom: 1px solid var(--sidebar-hover);
6746 }
6747
6748 .frm_priority_field_choices,
6749 li.frm_single_option:not(:last-child) {
6750 margin-bottom: 16px;
6751 }
6752
6753 .frm_prod_type_single input[type=radio],
6754 .frm_prod_type_single .frm_drag_icon,
6755 .frm_prod_type_single .frm_sortable_field_opts li:nth-child( n + 3 ),
6756 .frm_prod_type_single .frm_sortable_field_opts .frm_remove_tag,
6757 .frm_prod_type_single .frm_form_field:not(.frm_product_type):not(.frm_sep_val_product),
6758 .frm_prod_type_single .frm-bulk-edit-link,
6759 .frm_prod_type_user_def.frm_grid_container,
6760 .frm_prod_options_heading.frm_prod_user_def {
6761 display: none;
6762 }
6763
6764 #frm-preview-block {
6765 height: 400px;
6766 overflow: scroll;
6767 margin: 0;
6768 }
6769
6770 .plugin-card-bottom .frm-trash {
6771 color: #a00;
6772 }
6773
6774 .frm-fields p > .frm_inline_label,
6775 .frm_inline_label {
6776 padding-left: 3px;
6777 margin-right: 12px;
6778 display: inline-block;
6779 }
6780
6781 .frm_left_label {
6782 clear: both;
6783 float: left;
6784 width: 32% !important;
6785 margin-right: 2% !important;
6786 line-height: 2em;
6787 }
6788
6789 table td.frm_left_label {
6790 float: none;
6791 line-height: inherit;
6792 padding: 5px 0 5px 2%;
6793 }
6794
6795 .frm_left_label.frm_alignright {
6796 padding-right: 10px;
6797 text-align: right;
6798 }
6799
6800 .frm-fields .frm_left_label + textarea,
6801 .frm-fields .frm_left_label + select,
6802 .frm-fields .frm_left_label + input[type=text],
6803 .frm_with_left_label {
6804 width: 66%;
6805 }
6806
6807 td.frm_left_label + td {
6808 width: 66%;
6809 padding-top: 0;
6810 }
6811
6812 #html_settings label {
6813 display: block;
6814 }
6815
6816 #html_settings .frm_field_html_box {
6817 width: 100%;
6818 }
6819
6820 ul.frm-category-tabs {
6821 margin-top: 2px;
6822 }
6823
6824 .frm-category-tabs > li a,
6825 .frm-category-tabs > li a:active {
6826 outline: none;
6827 box-shadow: none;
6828 display: flex;
6829 gap: var(--gap-xs);
6830 align-items: center;
6831 }
6832
6833 .frm-category-tabs > li.active .frmsvg,
6834 .frm-category-tabs > li.active i,
6835 .frm-category-tabs > li.active span,
6836 .frm-category-tabs > li.active a {
6837 color: var(--primary-500);
6838 }
6839
6840 .frm_wrap .manage-menus {
6841 margin-top: 0;
6842 border: none;
6843 border-bottom: 1px solid var(--grey-300);
6844 background: var(--lightest-grey);
6845 }
6846
6847 .general_settings .postbox .manage-menus {
6848 border-top: none;
6849 border-left: none;
6850 border-right: none;
6851 }
6852
6853 .postbox .frm-help-tabs.inside,
6854 #poststuff .frm-help-tabs.inside {
6855 padding-left: 0;
6856 padding-right: 0;
6857 padding-bottom: 12px;
6858 margin-top: 0;
6859 margin-bottom: 0;
6860 }
6861
6862 .postbox .frm-help-tabs.inside {
6863 padding-bottom: inherit;
6864 }
6865
6866 .frm-help-tabs form > .submit {
6867 margin-left: 154px;
6868 padding-left: 0.9em;
6869 }
6870
6871 #poststuff h3.frm_no_bg {
6872 background: none;
6873 cursor: default;
6874 }
6875
6876 .frm-postbox-no-h3 {
6877 padding-top: 10px;
6878 }
6879
6880 .frm-right-panel .ui-state-default, #postbox-container-1 .ui-state-default {
6881 color: var(--grey-900);
6882 }
6883
6884 .no_repeat_section .frm_sorting > li.ui-state-default.edit_field_type_end_divider:hover {
6885 box-shadow: none;
6886 }
6887
6888 .frm-selected-field-group li.ui-state-default,
6889 .start_divider.frm_sorting li.ui-state-default.frm_not_divider.selected,
6890 .start_divider.frm_sorting li.ui-state-default.frm_not_divider:hover,
6891 .frm_sorting li.ui-state-default.frm_not_divider:hover,
6892 .frm_sorting li.ui-state-default.ui-sortable-helper,
6893 .frm_sorting li.ui-state-default.edit_field_type_divider .divider_section_only:hover,
6894 .frm_sorting .repeat_section li.ui-state-default.edit_field_type_end_divider:hover,
6895 .frm_sorting li.ui-state-default.selected.edit_field_type_divider .divider_section_only,
6896 .frm_update_msg,
6897 .frm_sorting li.ui-state-default.frm_not_divider.selected,
6898 .frm_sorting li.ui-state-default.selected.edit_field_type_divider .divider_section_only {
6899 border-color: var(--primary-500);
6900 transition: .5s border-color ease-in-out;
6901 }
6902
6903 .frm_sorting li.ui-state-default.frm_not_divider.selected {
6904 box-shadow: 0 0 1px 0 var(--primary-500);
6905 }
6906
6907 .frm_sorting li.ui-state-default {
6908 transition: .7s box-shadow ease-in-out, .7s height linear;
6909 }
6910
6911 .frm_sorting li.ui-state-default.frm-newly-added {
6912 box-shadow: inset 0 0 2px 1px var(--blue-border);
6913 }
6914
6915 .frm_sorting li.ui-state-default.selected.edit_field_type_divider .divider_section_only .frm-show-hover {
6916 visibility: visible !important;
6917 display: inline !important;
6918 }
6919
6920 .edit_field_type_end_divider > label {
6921 display: none !important;
6922 }
6923
6924 .frm_email_actions.feature-filter {
6925 font-weight: bold;
6926 border: 1px solid #DFDFDF;
6927 background-color: #EEEEEE;
6928 padding: 3px 5px 2px;
6929 font-size: var(--text-md);
6930 line-height: 20px;
6931 }
6932
6933 .frm_update_msg {
6934 border-style: solid;
6935 margin: 10px 0;
6936 color: #21759B;
6937 padding: 8px 15px;
6938 border-radius: 4px;
6939 }
6940
6941 .frm_update_msg.wrap {
6942 margin: 10px 20px 0 2px;
6943 }
6944
6945 #frm-insert-fields-box .frm_update_msg {
6946 margin-right: 0.9em;
6947 }
6948
6949 .frm_update_msg a {
6950 font-weight: bold;
6951 }
6952
6953 .widefat td {
6954 width: auto;
6955 }
6956
6957 .widefat .column-id {
6958 width: 3.7em;
6959 }
6960
6961 .widefat .column-show_count {
6962 width: 5em;
6963 }
6964
6965 .widefat .column-shortcode {
6966 width: 9em;
6967 }
6968
6969 .toplevel_page_formidable .column-shortcode div {
6970 display: flex;
6971 gap: var(--gap-xs);
6972 }
6973
6974 .widefat .column-entries, .widefat .column-link {
6975 width: 10%;
6976 text-align: center;
6977 }
6978
6979 .widefat .column-form_key, .widefat .column-created_at {
6980 width: 10%;
6981 }
6982
6983 .frm-white-body .search-box,
6984 .frm_wrap .frm-search {
6985 float: right;
6986 margin: 0;
6987 clear: right;
6988 }
6989
6990 .frm-white-body .search-box,
6991 .frm-search {
6992 min-width: 32%;
6993 position: relative;
6994 display: flex;
6995 gap: var(--gap-sm);
6996 align-items: center;
6997 }
6998
6999 .frm-inline-modal .frm-search,
7000 #frm_adv_info .frm-search {
7001 float: none;
7002 width: 100%;
7003 clear: both;
7004 margin: var(--gap-xs) 0;
7005 }
7006
7007 .frm-button-group a {
7008 margin: 0 7px !important;
7009 }
7010
7011 .frm_has_textarea .frm-with-right-icon {
7012 display: block;
7013 }
7014
7015 .frm-with-left-icon,
7016 .frm-with-right-icon {
7017 position: relative;
7018 }
7019
7020 i.frm-show-box,
7021 i.frm-show-inline-modal,
7022 .frm-with-left-icon i,
7023 .frm-with-right-icon i:not([class*=mce-]),
7024 .frmsvg.frm-show-box,
7025 .frmsvg.frm-show-inline-modal,
7026 .frm-with-left-icon .frmsvg,
7027 .frm-with-right-icon .frmsvg,
7028 .frm-search > .frmsvg,
7029 .frm-search span:not(.multiselect-selected-text):not(.multiselect-native-select) {
7030 position: absolute;
7031 padding: 0 14px;
7032 pointer-events: none;
7033 left: 0;
7034 color: var(--grey-400);
7035 font-size: var(--text-xs);
7036 }
7037
7038 .frm-with-right-icon .frmsvg,
7039 .frm-with-right-icon i:not([class*=mce-]) {
7040 right: 0;
7041 top: -3px;
7042 left: auto;
7043 padding: 0 10px 0 5px;
7044 }
7045
7046 .frm_form_settings .frm-with-right-icon .frmsvg {
7047 top: 0;
7048 }
7049
7050 .frm_form_settings .wp-editor-container .frm-with-right-icon .frmsvg {
7051 top: auto;
7052 bottom: 0;
7053 }
7054
7055 .frm_form_settings .frm_has_textarea .frm-with-right-icon .frmsvg {
7056 top: auto;
7057 bottom: 6px;
7058 }
7059
7060 .frmsvg.frm-show-box,
7061 .frmsvg.frm-show-inline-modal,
7062 i.frm-show-box,
7063 i.frm-show-inline-modal {
7064 color: var(--primary-500);
7065 pointer-events: initial;
7066 cursor: pointer;
7067 z-index: 1;
7068 opacity: 1;
7069 top: auto;
7070 margin: calc( ( 36px - 18px ) / 2 ); /* input height - svg / 2 */
7071 margin-bottom: 0;
7072 padding: 0;
7073 }
7074
7075 .frm-open .frmsvg.frm-show-inline-modal,
7076 .frm-open i.frm-show-inline-modal {
7077 opacity: .5;
7078 }
7079
7080 .frm-lookup-box-label + .frm-inline-modal,
7081 .frm-open + .frm-inline-modal {
7082 top: -10px;
7083 margin-bottom: 0;
7084 }
7085
7086 .frm_grid_container > .frm-open + .frm-inline-modal {
7087 top: -4px;
7088 }
7089
7090 .frm-with-left-icon input {
7091 padding-left: 37px !important;
7092 }
7093
7094 .frm_wrap .frm-with-right-icon textarea,
7095 .frm_wrap .frm-with-right-icon input,
7096 .frm_wrap .frm-with-right-icon input[type=text] {
7097 padding-right: var(--gap-md);
7098 }
7099
7100 #frm-show-fields .frm-with-left-icon .frmsvg,
7101 #frm-show-fields .frm-with-left-icon i {
7102 padding-top: 10px;
7103 }
7104
7105 .frm-search input[name="s"],
7106 .frm-search .dropdown-toggle,
7107 .frm-search input.frm-search-input {
7108 border-radius: var(--small-radius);
7109 padding-left: 33px !important;
7110 border-color: var(--grey-300);
7111 }
7112
7113 .frm_wrap .frm-search .frm-search-input,
7114 .frm-modal .frm-search .frm-search-input,
7115 .frm-white-body .search-box input[name="s"], /* Views search */
7116 .frm_wrap .frm-search input[name="s"] {
7117 padding-top: 3px;
7118 padding-bottom: 3px;
7119 flex: 1;
7120 font-size: var(--text-sm);
7121 }
7122
7123 .frm-search .dropdown-toggle {
7124 width: 100%;
7125 float: none;
7126 max-width: 200px;
7127 background: transparent;
7128 padding: 7px;
7129 min-height: 32px;
7130 text-align: inherit;
7131 overflow: hidden;
7132 text-overflow: ellipsis;
7133 }
7134
7135 span.multiselect-selected-text {
7136 white-space: nowrap;
7137 display: inline-block;
7138 max-width: 90%;
7139 text-overflow: ellipsis;
7140 overflow: hidden;
7141 }
7142
7143 .frm-search #search-submit a {
7144 color: var(--grey-800);
7145 }
7146
7147 .frm-search #search-submit .caret {
7148 opacity:.7;
7149 }
7150
7151 .frm-not-set input {
7152 color: var(--primary-500) !important;
7153 font-size: 13px;
7154 }
7155
7156 .frm-not-set .frmsvg,
7157 .frm-not-set i {
7158 color: var(--primary-700);
7159 opacity: 1;
7160 }
7161
7162 .post-type-frm_display select[name="m"] + #post-query-submit,
7163 select[name="m"] {
7164 display: none;
7165 }
7166
7167 .frm_shortcode_select optgroup option {
7168 margin-left: 1em;
7169 }
7170
7171 .frm_shortcode_select optgroup {
7172 padding-top: 5px;
7173 }
7174
7175 .frm_shortcode_select .frm_subopt {
7176 margin-left: 2em;
7177 }
7178
7179 .misc-pub-section a.edit-frm_shortcode, .misc-pub-section a.edit-form-status {
7180 float: none;
7181 font-size: 13px;
7182 }
7183
7184 .frm-grid {
7185 border-collapse: collapse;
7186 border: none;
7187 margin-right: 10px;
7188 }
7189
7190 .frm-grid td, .frm-grid th {
7191 padding: 5px;
7192 border: 1px solid black;
7193 }
7194
7195 .pro_feature {
7196 text-decoration: line-through;
7197 }
7198
7199 /* View page */
7200
7201 .post-type-frm_display #poststuff #post-body.columns-2 {
7202 margin-right: var(--big-sidebar);
7203 }
7204
7205 .post-type-frm_display #post-body.columns-2 #postbox-container-1 {
7206 margin-right: calc( var(--big-sidebar) * -1 );
7207 width: calc( var(--big-sidebar) - 40px );
7208 }
7209
7210 .post-type-frm_display #poststuff #post-body.columns-2 #side-sortables {
7211 width: 100%;
7212 }
7213
7214 #frm_dyncontent .hndle,
7215 #frm_dyncontent .handlediv {
7216 display: none !important;
7217 }
7218
7219 .post-type-frm_display .meta-box-sortables .frm_form_nav > li > a,
7220 .post-type-frm_display .frm_form_nav .nav-tab-active {
7221 padding: 0 2px 5px;
7222 line-height: 1.4;
7223 }
7224
7225 .post-type-frm_display #advanced-sortables h2.hndle,
7226 .post-type-frm_display #side-sortables h2.hndle,
7227 .post-type-frm_display #normal-sortables h2.hndle {
7228 border-bottom: 1px solid var(--grey-300);
7229 margin: 10px 0 0 !important;
7230 padding: 0 25px 8px;
7231 }
7232
7233 .post-type-frm_display #side-sortables h2.hndle {
7234 margin-top: 0 !important;
7235 padding-top: 10px;
7236 }
7237
7238 .post-type-frm_display #post-body-content {
7239 margin-top: var(--gap-lg);
7240 }
7241
7242 .post-type-frm_display.edit-php #wpbody-content > .wrap {
7243 margin: 0;
7244 }
7245
7246 .post-type-frm_display .postbox .hndle,
7247 .post-type-frm_display .postbox {
7248 border-color: var(--grey-300);
7249 }
7250
7251 .post-type-frm_display #postbox-container-1 .postbox,
7252 .post-type-frm_display #postbox-container-2 .postbox {
7253 border-radius: var(--small-radius);
7254 border-color: var(--grey-300);
7255 box-shadow: none;
7256 }
7257
7258 .post-type-frm_display #side-sortables .postbox {
7259 border-radius: 0;
7260 border-top-width: 0;
7261 margin-bottom: 0;
7262 }
7263
7264 .post-type-frm_display #side-sortables .misc-pub-section {
7265 padding: 15px 20px 10px;
7266 }
7267
7268 .post-type-frm_display .misc-pub-section .frmsvg,
7269 .post-type-frm_display #post-body .misc-pub-post-status:before,
7270 .post-type-frm_display #post-body #visibility:before,
7271 .post-type-frm_display .curtime #timestamp:before,
7272 .post-type-frm_display #post-body .misc-pub-revisions:before,
7273 .post-type-frm_display span.wp-media-buttons-icon:before {
7274 color: var( --grey);
7275 }
7276
7277 .post-type-frm_display #frm_top_bar + #poststuff #submitdiv #publishing-action, /* Hide only if top bar is present */
7278 .post-type-frm_display #frm_top_bar + #poststuff #submitdiv #minor-publishing-actions,
7279 .post-type-frm_display #frm_top_bar + #poststuff #edit-slug-box,
7280 .post-type-frm_display .wrap h1.wp-heading-inline,
7281 .post-type-frm_display .wrap > .page-title-action {
7282 display: none;
7283 }
7284
7285 .post-type-frm_display #poststuff h2.nav-tab-wrapper {
7286 padding-left: 10px;
7287 margin-bottom: 0;
7288 padding-bottom: 0;
7289 }
7290
7291 .post-type-frm_display .nav-menus-php .wrap {
7292 margin: 10px 0 0;
7293 }
7294
7295 .post-type-frm_display .nav-menus-php .wrap p {
7296 padding-left: 12px;
7297 padding-right: 12px;
7298 }
7299
7300 .post-type-frm_display .nav-tab {
7301 display: inline-block;
7302 background-color: #f4f4f4;
7303 }
7304
7305 .post-type-frm_display .nav-tab.frm_hidden {
7306 display: none;
7307 }
7308
7309 .post-type-frm_display .nav-tab:hover {
7310 background-color: #e4e4e4;
7311 }
7312
7313 .frm_order_row,
7314 .frm_where_row {
7315 margin-bottom: 7px;
7316 line-height: 30px;
7317 }
7318
7319 .frm-single-settings .frm_prod_field_opt_cont {
7320 margin-top: initial;
7321 margin-bottom: 20px;
7322 }
7323
7324 /*hide elements if js is avail*/
7325 select.texture {
7326 display: none;
7327 }
7328
7329 .post-type-frm_display #wp-content-editor-tools,
7330 #wp-content-editor-tools {
7331 background-color: transparent;
7332 }
7333
7334 .post-type-frm_display #major-publishing-actions {
7335 border-color: var(--grey-300);
7336 background: var(--sidebar-color);
7337 }
7338
7339 .post-type-frm_display #frm_adv_info {
7340 width: calc( var(--big-sidebar) - 40px );
7341 height: calc( 100vh - 32px );
7342 overflow: hidden;
7343 }
7344
7345 .post-type-frm_display #frm_adv_info:not(.frm_fixed) {
7346 top: 0 !important;
7347 }
7348
7349 .post-type-frm_display #frm_adv_info.frm_fixed {
7350 position: fixed;
7351 z-index: 9999;
7352 top: 32px;
7353 }
7354
7355 .post-type-frm_display #frm_adv_info ul.frm_code_list.frm-full-hover {
7356 max-height: calc( 100vh - 180px );
7357 }
7358
7359 .frm_col_one {
7360 margin-right: 4%;
7361 clear: both;
7362 }
7363
7364 ul .frm_col_one {
7365 float: left;
7366 }
7367
7368 ul .frm_col_two {
7369 float: right;
7370 }
7371
7372 .frm_two_col li {
7373 float: left;
7374 width: 48%;
7375 margin-right: 4%;
7376 }
7377
7378 .frm_two_col li:nth-child(2n+2) {
7379 margin-right: 0;
7380 }
7381
7382 .frm-info-modal a,
7383 .frm-info-modal ul,
7384 .frm-info-modal p,
7385 .frm-info-modal,
7386 .settings-lite-cta a,
7387 .settings-lite-cta ul,
7388 .settings-lite-cta p,
7389 .settings-lite-cta {
7390 color: #666;
7391 font-size: var(--text-md);
7392 box-shadow: none !important;
7393 }
7394
7395 .frm-info-modal h3,
7396 .settings-lite-cta h3 {
7397 font-size: 17px !important;
7398 }
7399
7400 .frm-green-icons .frmsvg {
7401 color: var(--green);
7402 }
7403
7404 .frm-info-modal .postbox .inside,
7405 .settings-lite-cta .postbox .inside {
7406 padding: 20px 40px;
7407 margin: 0;
7408 }
7409
7410 .cta-inside a {
7411 color: var(--orange)
7412 }
7413
7414 .info-modal-inside a.frm-standard-link {
7415 color: var(--primary-500);
7416 }
7417
7418 .info-modal-inside a.frm-standard-link:hover {
7419 color: var(--primary-700);
7420 }
7421
7422 .frm_no_p_margin > p {
7423 margin: 0;
7424 }
7425
7426 .frm_code_list a.button {
7427 display: block;
7428 text-align: center;
7429 font-size: 11px;
7430 overflow: hidden;
7431 }
7432
7433 #frm-navbarDrop + .frm_code_list.frm-full-hover {
7434 margin: var(--gap-xs) 0 0;
7435 min-width: 300px;
7436 max-height: calc( ( 40px * 5 ) + 56px );
7437 }
7438
7439 .frm_code_list.frm-full-hover li {
7440 margin: 0;
7441 }
7442
7443 .frm-select-list-item,
7444 .frm_wrap .ui-autocomplete li > div,
7445 .multiselect-container button.multiselect-option,
7446 .frm-dropdown-menu > .dropdown-item > a,
7447 .frm-dropdown-menu > .dropdown-item > a:visited,
7448 .frm-dropdown-menu > .dropdown-item > a:link, /* Override jQuery UI */
7449 .frm-dropdown-menu .frm_dropdown_li,
7450 .frm_code_list.frm-full-hover a {
7451 display: flex;
7452 color: var(--grey-700);
7453 padding: 5px 10px;
7454 font-size: var(--text-md);
7455 gap: var(--gap-xs);
7456 align-items: center;
7457 }
7458
7459 .frm_code_list.frm-full-hover a span {
7460 max-width: 83px;
7461 text-align: right;
7462 margin-left: auto;
7463 }
7464
7465 .frm_code_list.frm-full-hover a,
7466 .frm_code_list.frm-full-hover a span {
7467 white-space: nowrap;
7468 overflow: hidden;
7469 text-overflow: ellipsis;
7470 }
7471
7472 .frm_code_list.frm-full-hover.frmcenter a {
7473 display: block;
7474 }
7475
7476 #frm-layout-classes frm-full-hover a span {
7477 max-width: 45%;
7478 }
7479
7480 .frm-select-list-item.active,
7481 .frm-select-list-item:hover,
7482 .frm_wrap .ui-autocomplete li div.ui-state-active,
7483 .frm_wrap .ui-autocomplete li.ui-state-focus,
7484 .multiselect-container button.multiselect-option.active,
7485 .multiselect-container button.multiselect-option:hover,
7486 .frm-dropdown-menu > .dropdown-item > a:hover,
7487 .frm_code_list.frm-full-hover a:hover span,
7488 .frm_code_list.frm-full-hover a:hover {
7489 background: var(--primary-25);
7490 color: var(--primary-500);
7491 border-radius: var(--small-radius);
7492 }
7493
7494 .frm-select-list-item .frmsvg,
7495 .frm-dropdown-menu > .dropdown-item > a .frmsvg {
7496 opacity: .8;
7497 }
7498
7499 .frm-select-list-item:hover .frmsvg,
7500 .frm-dropdown-menu > .dropdown-item > a:hover .frmsvg {
7501 opacity: 1;
7502 }
7503
7504 .frm-dropdown-menu.frm_code_list > li > a {
7505 padding: 3px 15px;
7506 width: 300px;
7507 }
7508
7509 #frm_edit_box_content_modal .frm-with-search, /* Temp. Add .frm-dropdown-menu in Views */
7510 .frm-dropdown-menu .frm-with-search {
7511 padding: var(--gap-xs) 10px 0;
7512 }
7513
7514 .frm-dropdown-menu .subsubsub {
7515 padding: 0 10px;
7516 }
7517
7518 .frm_grid_container {
7519 overflow: visible;
7520 }
7521
7522 .frm_code_list.frm_grid_container {
7523 grid-gap: 5px;
7524 }
7525
7526 .frm_code_list.frm_grid_container li {
7527 width: auto;
7528 margin: 0;
7529 }
7530
7531 .frm_code_list.frm_grid_container a {
7532 padding: 5px 0;
7533 text-align: center;
7534 background-color: var(--light-blue);
7535 border: 1px solid var(--primary-500);
7536 color: var(--primary-500);
7537 display: block;
7538 border-radius: var(--small-radius);
7539 }
7540
7541 .frm_code_list.frm_grid_container a:hover {
7542 background-color: var(--primary-700);
7543 color: #fff;
7544 }
7545
7546 .frm_field_list #frm-insert-fields .button a {
7547 display: block;
7548 max-width: 95%;
7549 overflow: hidden;
7550 }
7551
7552 .field_type_list.frm_grid_container {
7553 gap: var(--gap-xs) var(--gap-sm);
7554 margin: var(--gap-xs);
7555 }
7556
7557 .field_type_list li {
7558 margin: 0;
7559 padding: 0;
7560 }
7561
7562 #frm-insert-fields .frm-search {
7563 float: none;
7564 margin: 15px 20px;
7565 width: auto;
7566 }
7567
7568 #frm-insert-fields li,
7569 #frm-insert-fields li a {
7570 text-decoration: none;
7571 font-weight: normal;
7572 font-size: var(--text-md) !important;
7573 color: var(--grey-900);
7574 }
7575
7576 #frm-insert-fields li.frm_show_upgrade {
7577 cursor: pointer;
7578 opacity: .5;
7579 }
7580
7581 #frm-insert-fields li a span {
7582 vertical-align: middle;
7583 }
7584
7585 .frmbutton.ui-draggable-dragging a,
7586 #frm-insert-fields li a:not(.disabled):hover {
7587 background: var(--grey-100);
7588 }
7589
7590 #frm-insert-fields li a.disabled:hover {
7591 cursor: not-allowed;
7592 }
7593
7594 #frm-insert-fields li.ui-draggable-disabled {
7595 opacity: 0.5;
7596 }
7597
7598 .frm_code_list {
7599 clear: both;
7600 }
7601
7602 .frm_code_list.frm-full-hover a.frm_hidden,
7603 .frm_code_list .frmkeys {
7604 display: none;
7605 }
7606
7607 .frmsvg {
7608 fill: currentColor;
7609 width: 18px;
7610 height: 18px;
7611 vertical-align: middle;
7612 }
7613
7614 input[disabled],
7615 .frmsvg svg {
7616 pointer-events: none;
7617 }
7618
7619 .frmsvg.frm_svg20 {
7620 width: 20px;
7621 height: 20px;
7622 }
7623
7624 .frmsvg.frm_svg15 {
7625 width: 15px;
7626 height: 15px;
7627 }
7628
7629 .frmsvg.frm_svg14 {
7630 width: 14px;
7631 height: 14px;
7632 }
7633
7634 .frmsvg.frm_svg13 {
7635 width: 13px;
7636 height: 13px;
7637 }
7638
7639 .frmbutton.ui-sortable-helper .frmsvg,
7640 .field_type_list li.frmbutton .frmsvg,
7641 .frmbutton.ui-sortable-helper i,
7642 .field_type_list li.frmbutton i,
7643 .frm_code_list a .frmsvg,
7644 .frm_code_list a i {
7645 color: var(--grey-500);
7646 display: inline-block;
7647 vertical-align: middle;
7648 width: var(--text-md);
7649 font-size: var(--text-md);
7650 }
7651
7652 /* Standardize icon size for field buttons in the builder */
7653 .field_type_list li.frmbutton .frmsvg {
7654 width: var(--text-xl);
7655 font-size: var(--text-xl);
7656 }
7657
7658 .frm_code_list i:before {
7659 font-size: inherit;
7660 }
7661
7662 #frm-insert-fields li a:not(.disabled):hover .frmsvg,
7663 #frm-insert-fields li a:not(.disabled):hover i {
7664 color: var(--grey-600);
7665 }
7666
7667 /* Icon while dragging */
7668 .frmbutton.ui-draggable-dragging {
7669 pointer-events: none;
7670 }
7671
7672 #frm-insert-fields li.frm_show_upgrade,
7673 #frm-insert-fields li a,
7674 .frmbutton.ui-draggable-dragging a {
7675 text-decoration: none;
7676 display: inline-flex !important;
7677 gap: var(--gap-xs);
7678 align-items: center;
7679 border-radius: var(--border-radius) !important;
7680 padding: var(--gap-xs) var(--gap-sm) !important;
7681 color: var(--grey-900) !important;
7682 }
7683
7684 /* Adjust field button size to full width in builder */
7685 #frm-insert-fields li a {
7686 display: flex !important;
7687 }
7688
7689 /* Prevents advanced fields from always appearing in search results */
7690 #frm-insert-fields li.frm_show_upgrade.frm_hidden {
7691 display: none !important;
7692 }
7693
7694 .frmbutton.ui-draggable-dragging a {
7695 border: 1px solid var(--grey-300);
7696 box-shadow: var(--box-shadow-md);
7697 }
7698
7699 .frmbutton.ui-draggable-dragging span {
7700 font-size: 15px;
7701 }
7702
7703 #frm-show-fields .frmbutton.ui-sortable-helper i,
7704 .frmbutton.ui-draggable-dragging i,
7705 .frmbutton.ui-draggable-dragging .frmsvg {
7706 color: #fff !important;
7707 }
7708
7709 .frmbutton.ui-draggable-dragging i,
7710 .frmbutton.ui-draggable-dragging .frmsvg {
7711 color: var(--grey-700) !important;
7712 }
7713
7714 .frm_sorting li.ui-state-default.ui-sortable-helper,
7715 .frmbutton.ui-sortable-helper {
7716 transition: opacity .2s;
7717 opacity: 1;
7718 }
7719
7720 .frm-field-group-count {
7721 background-color: var(--sidebar-hover);
7722 padding: 5px;
7723 color: #fff !important;
7724 border-radius: 10px;
7725 }
7726
7727 /* End dragging */
7728
7729 .field_type_list .frm_icon_font:before {
7730 font-size: 20px;
7731 }
7732
7733 li.frm_noallow.button,
7734 .frm_noallow {
7735 opacity: .5;
7736 filter: alpha(opacity=50);
7737 }
7738
7739 .frm_actions_list a.frm_show_upgrade.frm_inactive_action:before,
7740 li.frm_noallow.button.frm_show_upgrade {
7741 cursor: pointer;
7742 }
7743
7744 .field_type_list li.frm_noallow.button.frm_show_upgrade:hover {
7745 border-color: inherit;
7746 }
7747
7748 .frm_noallow a {
7749 color: inherit;
7750 }
7751
7752 #frm_upgrade_modal_image {
7753 max-width: 200px;
7754 }
7755
7756 .frm-tab-message {
7757 max-width: 600px;
7758 margin: 20px auto;
7759 color: rgba(63, 75, 91, 0.8);
7760 }
7761
7762 .frm-settings-screenshot-toolbar {
7763 min-height: 39px;
7764 display: flex;
7765 }
7766
7767 .frm-settings-screenshot-toolbar .frm-minmax-icon {
7768 height: 8px;
7769 width: 8px;
7770 border-radius: 50%;
7771 align-self: center;
7772 margin-left: 10px;
7773 }
7774
7775 .frm-settings-screenshot-toolbar .frm-minmax-icon:first-of-type {
7776 margin-left: 20px;
7777 }
7778
7779 .frm-settings-screenshot-toolbar img {
7780 object-fit: contain;
7781 align-self: flex-end;
7782 margin-left: 25px;
7783 }
7784
7785 .frm-settings-screenshot-toolbar + div {
7786 background: #fff;
7787 padding-top: 25px;
7788 border-radius: 0 0 16px 16px;
7789 }
7790
7791 .frm-settings-screenshot-toolbar + div img {
7792 max-width: calc( 100% - 40px );
7793 }
7794
7795 .frm-settings-screenshot-wrapper {
7796 max-width: 700px;
7797 margin: 50px auto 0;
7798 box-shadow: 0px 4px 4px rgba(189, 196, 205, 0.25), 0px 12px 56px rgba(42, 57, 75, 0.25);
7799 border-radius: 16px;
7800 background: #EBECF1;
7801 }
7802
7803 .frm-dialog {
7804 z-index: 100;
7805 padding: 0 !important;
7806 border-radius: 16px;
7807 border: none;
7808 background-color: #fff;
7809 max-width: 100% !important;
7810 }
7811
7812 .frm-dialog .postbox {
7813 background: transparent;
7814 box-shadow: none;
7815 border: none;
7816 line-height: var(--leading);
7817 }
7818
7819 .frm-dialog input[type=text],
7820 .frm-dialog textarea {
7821 font-size: var(--text-md);
7822 }
7823
7824 .frm-dialog textarea {
7825 height: 75px;
7826 }
7827
7828 .frm-dialog button.frm-button-primary {
7829 margin-right: 10px;
7830 }
7831
7832 .frm-dialog .frm-sub-label,
7833 .frm-sub-label {
7834 color: var(--grey);
7835 text-transform: none;
7836 padding-left: 8px;
7837 }
7838
7839 h2 .frm-sub-label {
7840 font-size: var(--text-md);
7841 }
7842
7843 .frm-views-editor-body .ui-widget-overlay,
7844 .frm-white-body .ui-widget-overlay,
7845 .toplevel_page_formidable .ui-widget-overlay,
7846 body[class*=formidable-payments] .ui-widget-overlay {
7847 position: fixed;
7848 width: 100%;
7849 height: 100%;
7850 top: 0;
7851 left: 0;
7852 right: 0;
7853 bottom: 0;
7854 background: var(--grey-500);
7855 opacity: .5;
7856 z-index: 2;
7857 }
7858
7859 #frm_upgrade_modal {
7860 text-align: center;
7861 }
7862
7863 #frm_upgrade_modal .frm_lock_icon {
7864 display: block;
7865 margin: 0 auto;
7866 height: 35px;
7867 width: 35px;
7868 color: #c4c4c4;
7869 padding-bottom: 20px;
7870 }
7871
7872 .frm-upgrade-message img {
7873 max-width: 100%;
7874 }
7875
7876 a.frm-link-secondary {
7877 color: #c4c4c4;
7878 font-size: var(--text-sm);
7879 text-decoration: underline;
7880 }
7881
7882 .field_type_list li.button.frm_noallow,
7883 .field_type_list li.button.frm_noallow:hover,
7884 .button.frm_noallow,
7885 .button.frm_noallow:hover {
7886 color: inherit;
7887 border-color: #ccc;
7888 background: inherit;
7889 }
7890
7891 iframe#dyncontent_ifr {
7892 min-height: 150px;
7893 }
7894
7895 /*!
7896 * Bootstrap v4.6.1
7897 */
7898
7899 .tooltip {
7900 /* Copied from Bootstrap */
7901 position: absolute;
7902 display: block;
7903 margin: 0;
7904 font-style: normal;
7905 font-weight: 400;
7906 line-height: 1.5;
7907 text-align: left;
7908 text-align: start;
7909 text-decoration: none;
7910 text-shadow: none;
7911 text-transform: none;
7912 letter-spacing: normal;
7913 word-break: normal;
7914 word-spacing: normal;
7915 white-space: normal;
7916 line-break: auto;
7917 font-size: 0.875rem;
7918 word-wrap: break-word;
7919 opacity: 0;
7920
7921 /* Custom rules */
7922 z-index: 9999999;
7923 pointer-events: none;
7924 }
7925
7926 .tooltip.show {
7927 opacity: 0.9;
7928 }
7929
7930 .tooltip .arrow {
7931 position: absolute;
7932 display: block;
7933 width: 0.8rem;
7934 height: 0.4rem;
7935 margin-left: 0 !important;
7936 }
7937
7938 .tooltip .arrow::before {
7939 position: absolute;
7940 content: "";
7941 border-color: transparent;
7942 border-style: solid;
7943 }
7944
7945 .bs-tooltip-top, .bs-tooltip-auto[x-placement^="top"] {
7946 padding: 0.4rem 0;
7947 }
7948
7949 .bs-tooltip-top .arrow, .bs-tooltip-auto[x-placement^="top"] .arrow {
7950 bottom: 0;
7951 }
7952
7953 .bs-tooltip-top .arrow::before, .bs-tooltip-auto[x-placement^="top"] .arrow::before {
7954 top: 0;
7955 border-width: 0.4rem 0.4rem 0;
7956 border-top-color: #000;
7957 }
7958
7959 .bs-tooltip-right, .bs-tooltip-auto[x-placement^="right"] {
7960 padding: 0 0.4rem;
7961 }
7962
7963 .bs-tooltip-right .arrow, .bs-tooltip-auto[x-placement^="right"] .arrow {
7964 left: 0;
7965 width: 0.4rem;
7966 height: 0.8rem;
7967 }
7968
7969 .bs-tooltip-right .arrow::before, .bs-tooltip-auto[x-placement^="right"] .arrow::before {
7970 right: 0;
7971 border-width: 0.4rem 0.4rem 0.4rem 0;
7972 border-right-color: #000;
7973 }
7974
7975 .bs-tooltip-bottom, .bs-tooltip-auto[x-placement^="bottom"] {
7976 padding: 0.4rem 0;
7977 }
7978
7979 .bs-tooltip-bottom .arrow, .bs-tooltip-auto[x-placement^="bottom"] .arrow {
7980 top: 0;
7981 }
7982
7983 .bs-tooltip-bottom .arrow::before, .bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
7984 bottom: 0;
7985 border-width: 0 0.4rem 0.4rem;
7986 border-bottom-color: #000;
7987 }
7988
7989 .bs-tooltip-left, .bs-tooltip-auto[x-placement^="left"] {
7990 padding: 0 0.4rem;
7991 }
7992
7993 .bs-tooltip-left .arrow, .bs-tooltip-auto[x-placement^="left"] .arrow {
7994 right: 0;
7995 width: 0.4rem;
7996 height: 0.8rem;
7997 }
7998
7999 .bs-tooltip-left .arrow::before, .bs-tooltip-auto[x-placement^="left"] .arrow::before {
8000 left: 0;
8001 border-width: 0.4rem 0 0.4rem 0.4rem;
8002 border-left-color: #000;
8003 }
8004
8005 .tooltip-inner {
8006 max-width: 200px;
8007 padding: 0.25rem 0.5rem;
8008 color: #fff;
8009 text-align: center;
8010 background-color: #000;
8011 border-radius: 0.25rem;
8012 }
8013
8014 .frm-dropdown-menu.show {
8015 display: block;
8016 }
8017
8018 /* End Bootstrap */
8019
8020 .preview.dropdown .dropdown-menu {
8021 min-width: 205px;
8022 }
8023
8024 .frm_clear {
8025 clear: both;
8026 }
8027
8028 .frm_clearfix:after {
8029 content: ".";
8030 display: block;
8031 clear: both;
8032 visibility: hidden;
8033 line-height: 0;
8034 height: 0;
8035 }
8036
8037 .frm_clearfix {
8038 display: block;
8039 }
8040
8041 .frm_admin_progress {
8042 overflow: hidden;
8043 height: 20px;
8044 margin-bottom: 20px;
8045 background-color: #f5f5f5;
8046 border-radius: 4px;
8047 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
8048 }
8049
8050 .frm_admin_progress_bar {
8051 float: left;
8052 width: 0;
8053 height: 100%;
8054 font-size: 12px;
8055 line-height: 20px;
8056 color: #ffffff;
8057 text-align: center;
8058 box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
8059 transition: width 0.6s ease;
8060 background-color: #04A4CC;
8061 }
8062
8063 .tooltip.frm_tooltip {
8064 position: fixed;
8065 top: auto !important;
8066 bottom: 0 !important;
8067 left: 0 !important;
8068 max-width: none;
8069 width: 100% !important;
8070 z-index: 99999;
8071 }
8072
8073 .tooltip.frm_tooltip.bottom {
8074 padding: 0;
8075 }
8076
8077 .frm_tooltip .tooltip-inner {
8078 max-width: none;
8079 min-height: 40px !important;
8080 text-align: left;
8081 box-shadow: 5px 5px 25px rgba(0, 0, 0, 0.5);
8082 padding: 10px 40px;
8083 border-top-color: #ccc;
8084 background: var(--sidebar-color);
8085 color: var(--grey-700);
8086 border-radius: 0;
8087 opacity: 1;
8088 font-size: var(--text-sm);
8089 }
8090
8091 #frm_custom_css_box {
8092 width: 100%;
8093 }
8094
8095 /*form inputs/selects */
8096 .frm_form_field.frm_scroll_box .frm_opt_container,
8097 .frm-white-body .wrap input[type="text"], /* Cover Views pages */
8098 .frm-white-body .wrap input[type="search"],
8099 .frm-white-body .wrap input[type="number"],
8100 .frm-white-body .wrap select,
8101 .frm-white-body .wrap textarea,
8102 button.frm_choose_image_box,
8103 #titlediv input[type="text"],
8104 .frm-fields button.btn,
8105 .frm_wrap textarea,
8106 .frm_wrap input[type="tel"],
8107 .frm_wrap input[type="text"],
8108 .frm_wrap input[type=search],
8109 .frm_wrap input[type="number"],
8110 .frm_wrap input[type="date"],
8111 .frm_wrap select,
8112 .wp-admin .frm_wrap select,
8113 .field-group textarea,
8114 .field-group input[type="text"],
8115 .field-group select {
8116 outline: 0;
8117 box-shadow: none;
8118 border-radius: var(--small-radius);
8119 padding: 5px 14px;
8120 border-color: var(--grey-300);
8121 color: var(--grey-800);
8122 font-size: var(--text-md);
8123 margin: 0;
8124 background-color: #fff;
8125 line-height: var(--leading);
8126 }
8127
8128 .frm_wrap ::-webkit-datetime-edit {
8129 line-height: var(--leading);
8130 }
8131
8132 .frm-white-body textarea:focus,
8133 .frm-white-body input:focus,
8134 .frm-white-body select:focus,
8135 .frm_wrap input:focus,
8136 .frm_wrap select:focus,
8137 .wp-core-ui .frm_wrap select:focus,
8138 .frm-btn-group .multiselect.dropdown-toggle:focus,
8139 .frm_wrap textarea:focus {
8140 border-color: var(--primary-500) !important;
8141 box-shadow: none !important;
8142 }
8143
8144 #postbox-container-2 textarea,
8145 .frm_wrap textarea,
8146 .field-group textarea {
8147 line-height: 2;
8148 }
8149
8150 .frm_wrap input[type="number"] {
8151 height: auto;
8152 }
8153
8154 .frm_wrap select {
8155 padding: 2px;
8156 }
8157
8158 .wp-admin .frm_wrap select {
8159 max-width: 100%;
8160 }
8161
8162 .frm_form_field.frm_scroll_box .frm_opt_container {
8163 padding: 10px 12px;
8164 }
8165
8166 .frm_wrap input[disabled],
8167 .frm_wrap select[disabled],
8168 .frm_wrap textarea[disabled],
8169 .frm_wrap input[readonly],
8170 .frm_wrap select[readonly],
8171 .frm_wrap textarea[readonly],
8172 .frm_wrap input::placeholder {
8173 color: var(--grey-500);
8174 }
8175
8176 #postcustomstuff table td > div {
8177 /* To override some inline css in add-on */
8178 padding-top: 0 !important;
8179 }
8180
8181 .wp-admin .frm_wrap .form-table select {
8182 vertical-align: top;
8183 }
8184
8185 .frm_wrap .frm_form_builder select {
8186 line-height: var(--leading);
8187 height: var(--text-md);
8188 width: 100%;
8189 }
8190
8191 #postbox-container-2 select,
8192 .wp-admin .frm_wrap select,
8193 .frm_wrap .frm_form_builder select {
8194 height: auto;
8195 background-position: right 11px top 55%;
8196 }
8197
8198 .frm-white-body .tablenav select,
8199 .frm-white-body .tablenav input[type="text"],
8200 .wp-admin .frm_wrap .tablenav select,
8201 .frm_wrap .tablenav input[type="date"],
8202 .frm_wrap .tablenav input[type="text"] {
8203 padding-top: 0;
8204 padding-bottom: 0;
8205 line-height: 1;
8206 }
8207
8208 .frm_wrap .tablenav ::-webkit-datetime-edit {
8209 line-height: 1;
8210 }
8211
8212 .frm-fields button.btn,
8213 .frm-fields textarea,
8214 .frm-fields input[type="text"],
8215 .frm-fields select,
8216 .field-group textarea,
8217 .field-group input[type="text"],
8218 .field-group select,
8219 .accordion-container input.hex {
8220 width: 100%;
8221 outline: 0;
8222 }
8223
8224 .frm-fields button.btn {
8225 height: var(--h-md);
8226 text-align: inherit;
8227 }
8228
8229 .global-font .field-group input[type="text"] {
8230 width: auto;
8231 }
8232
8233 /* Image Options */
8234
8235 .frm_images_dropdown .frm_image_option {
8236 margin: 0 !important;
8237 }
8238
8239 .frm_images_dropdown .frm_radio input[type=radio] {
8240 opacity: 0;
8241 position: absolute;
8242 z-index: -1;
8243 }
8244
8245 .frm_images_dropdown__image .frmsvg {
8246 width: 100%;
8247 max-width: 102px;
8248 fill: none;
8249 margin: 0;
8250 }
8251
8252 .frm_images_dropdown .frm_noallow .frm_image_option_container {
8253 opacity: .5;
8254 }
8255
8256 .frm_images_dropdown .frm_image_option_container {
8257 border-radius: var(--small-radius);
8258 border: 2px solid transparent;
8259 align-items: center;
8260 }
8261
8262 .frm_images_dropdown .frm_image_option_container:hover {
8263 background: #fff !important;
8264 }
8265
8266 .frm_images_dropdown input[type="radio"]:checked + .frm_image_option_container {
8267 background: #fff !important;
8268 border-color: var(--primary-500);
8269 }
8270
8271 .frm_images_dropdown .frm_text_label_for_image {
8272 padding: 0;
8273 text-align: left;
8274 }
8275
8276 /* End Image Options */
8277
8278 /* Welcome page */
8279
8280 .wp-core-ui .frm_grey.frm-button-primary.disabled,
8281 .wp-core-ui .frm_grey.frm-button-primary,
8282 #frm-welcome .frm_grey {
8283 opacity: 0.5;
8284 background: #F6F6F6 !important;
8285 border-color: #ddd !important;
8286 color: #9FA5AA !important;
8287 }
8288
8289 /* Chrome Scrollbars for Windows */
8290 .windows::-webkit-scrollbar,
8291 .windows ::-webkit-scrollbar {
8292 width: 7px;
8293 background: transparent;
8294 }
8295
8296 .windows::-webkit-scrollbar-thumb,
8297 .windows ::-webkit-scrollbar-thumb {
8298 background: var(--grey-300);
8299 -webkit-border-radius: var(--border-radius);
8300 -webkit-box-shadow: none;
8301 }
8302
8303 .windows::-webkit-scrollbar-corner,
8304 .windows ::-webkit-scrollbar-corner {
8305 background: transparent;
8306 }
8307
8308 /* RTL */
8309 .rtl h3 {
8310 font-weight: inherit !important;
8311 }
8312
8313 .rtl.js .accordion-section-title:after {
8314 left: 10px;
8315 right: auto;
8316 }
8317
8318 .rtl #frm_top_bar #frm_bs_dropdown {
8319 padding-left: 15px;
8320 }
8321
8322 .rtl .frm-full-close,
8323 .rtl .frm_wrap .columns-2 .frm-right-panel,
8324 .rtl .frm-right-panel {
8325 border-right-width: 1px;
8326 border-left-width: 0;
8327 }
8328
8329 .rtl .frm-full-close {
8330 padding-left: 0;
8331 padding-right: var(--gap-md);
8332 }
8333
8334 .rtl .frm-text-right {
8335 text-align: left;
8336 }
8337
8338 .rtl .frm_wrap #frm_adv_info ul.category-tabs li:first-child {
8339 border-left-width: 1px;
8340 }
8341
8342 .rtl .frm-dropdown-menu {
8343 text-align: right;
8344 }
8345
8346 .rtl .frm_actions_dropdown .frm_icon_font {
8347 float: right;
8348 margin-right: 0;
8349 margin-left: 3px;
8350 }
8351
8352 .rtl #frm-insert-fields-box,
8353 .rtl #frm-conditionals {
8354 padding-right: .9em;
8355 }
8356
8357 .rtl #html_settings .frm_field_html_box {
8358 margin-right: 0;
8359 }
8360
8361 .rtl .frm_list_entry_page h2 {
8362 float: right;
8363 }
8364
8365 .rtl .frm_scale {
8366 float: right;
8367 margin-left: 10px;
8368 margin-right: 0;
8369 }
8370
8371 .rtl .frm-page-break .frm-collapse-page.button {
8372 margin-left: 0;
8373 margin-right: 46%;
8374 }
8375
8376 .rtl .frm-field-action-icons {
8377 right: unset;
8378 left: 2px;
8379 }
8380
8381 .rtl .frm_has_shortcodes > i {
8382 right: auto;
8383 left: 5px;
8384 }
8385
8386 .rtl .frm_reply_to_container,
8387 .rtl .frm_bcc_cc_container {
8388 float: left;
8389 }
8390
8391 .rtl .frm-default-switcher {
8392 float: left;
8393 position: relative;
8394 }
8395
8396 .rtl .frm-with-right-icon .frmsvg {
8397 right: auto;
8398 left: 0;
8399 }
8400
8401 .rtl .frm-inline-modal > a.dismiss {
8402 left: 13px;
8403 right: auto;
8404 }
8405
8406 .rtl.wp-admin .frm_wrap select {
8407 padding-left: var(--gap-lg) !important;
8408 padding-right: 5px !important;
8409 background-position: left 11px top 55%;
8410 }
8411
8412 /* ---------------------------------------------------------------
8413 Clearfix
8414 --------------------------------------------------------------- */
8415 span.clear {
8416 display: block;
8417 }
8418
8419 .clearfix:after {
8420 content: ".";
8421 display: block;
8422 height: 0;
8423 clear: both;
8424 visibility: hidden;
8425 }
8426
8427 .clearfix {
8428 display: inline-block;
8429 }
8430
8431 /*Override styling from other plugins*/
8432 .frm_form_fields .clear {
8433 height: auto;
8434 }
8435
8436 /* Hides from IE-mac \*/
8437 * html .clearfix {
8438 height: 1%;
8439 }
8440
8441 .clearfix {
8442 display: block;
8443 }
8444
8445 /* End hide from IE-mac */
8446
8447 /*-----------------------------------------------------------------
8448 Responsive Design
8449 ---------------------------------------------------------------- */
8450
8451 @media only screen and (max-width: 1200px) {
8452 .frm-addons {
8453 grid-template-columns: 1fr 1fr;
8454 }
8455 }
8456
8457 @media only screen and (max-width: 1050px) {
8458 .frm-white-body,
8459 .frm_wrap {
8460 --biggest-sidebar: 390px;
8461 }
8462
8463 #form_settings_page .columns-2 {
8464 margin: 0;
8465 }
8466
8467 .frm_actions_list {
8468 margin-left: 0;
8469 }
8470 }
8471
8472 @media only screen and (max-width: 960px) {
8473 .frm-white-body,
8474 .frm_wrap {
8475 --gap-sm: 8px;
8476 --gap-md: 16px;
8477 --gap-2xl: 24px;
8478 }
8479
8480 .auto-fold #adminmenuwrap {
8481 width: 36px;
8482 }
8483
8484 .frm_wrap #postbox-container-1 #frm_adv_info {
8485 min-width: 220px;
8486 }
8487
8488 p.howto {
8489 display: inline-block;
8490 }
8491
8492 /* Fix: Issue where the admin page content had extra white space to the left on small screens */
8493 .auto-fold.frm-admin-page-styles:not(.frm-full-screen) .frm_page_container,
8494 .auto-fold:not(.frm-full-screen) .frm_wrap .frm_page_container {
8495 left: 36px;
8496 }
8497
8498 .frm-admin-footer-links {
8499 padding-left: 36px;
8500 }
8501
8502 body.rtl .frm-admin-footer-links {
8503 padding-right: 36px;
8504 }
8505 }
8506
8507 @media only screen and (max-width: 850px) {
8508 #frm_bs_dropdown {
8509 /* There isn't enough room for the title on a screen this size so just hide it. */
8510 display: none;
8511 }
8512
8513 .frm-white-body,
8514 .frm_wrap {
8515 --biggest-sidebar: 350px;
8516 --big-sidebar: 350px;
8517 }
8518
8519 #frm_bs_dropdown .frm_bstooltip {
8520 /* There isn't enough room for the title on a screen this size so just hide it. */
8521 display: none !important;
8522 }
8523
8524 .frm_col_one {
8525 clear: none;
8526 }
8527
8528 .frm-fields p > .frm_inline_label,
8529 .frm_inline_label {
8530 display: block;
8531 margin: 5px 0;
8532 }
8533
8534 #frm_top_bar h1 {
8535 width: auto;
8536 max-width: 200px;
8537 }
8538
8539 #frm-publishing {
8540 width: auto;
8541 }
8542
8543 #frm_form_editor_container,
8544 .frm-entry-container {
8545 margin: 0 20px;
8546 }
8547
8548 .frmbutton.ui-sortable-helper .frmsvg,
8549 .field_type_list li.frmbutton .frmsvg,
8550 .frmbutton.ui-sortable-helper i,
8551 .field_type_list li.frmbutton i {
8552 margin: .15em 0 .15em .1em;
8553 width: 25px;
8554 }
8555
8556 .rtl .frmbutton.ui-sortable-helper .frmsvg,
8557 .rtl .field_type_list li.frmbutton .frmsvg,
8558 .rtl .frmbutton.ui-sortable-helper i,
8559 .rtl .field_type_list li.frmbutton i {
8560 margin: .15em .1em .15em 0;
8561 }
8562
8563 .frm_wrap .frm-search {
8564 float: none !important;
8565 width: auto;
8566 clear: both;
8567 }
8568
8569 .post-type-frm_display #frm_adv_info {
8570 top: auto !important;
8571 position: static;
8572 width: auto;
8573 }
8574
8575 .frm_wrap .frm-right-panel #frm_adv_info,
8576 .frm_wrap #postbox-container-1 #frm_adv_info {
8577 min-width: 275px;
8578 }
8579
8580 .frm_wrap #frm_adv_info ul.category-tabs li,
8581 .frm_wrap #frm_adv_info ul.category-tabs li.tabs {
8582 border: none;
8583 }
8584
8585 .frm_wrap #frm_adv_info ul.category-tabs li:first-child {
8586 margin-left: 12px;
8587 }
8588
8589 .frm_wrap #frm_adv_info ul.category-tabs li.tabs {
8590 border-bottom: 2px solid #5b9dd9;
8591 padding-bottom: 8px;
8592 }
8593
8594 .post-type-frm_display #poststuff {
8595 padding: 10px 25px;
8596 }
8597
8598 .post-type-frm_display #side-sortables .postbox {
8599 margin-bottom: 20px;
8600 border-radius: var(--small-radius);
8601 border-top-width: 1px;
8602 }
8603 }
8604
8605 @media only screen and (max-width: 782px) {
8606 .frm-white-body,
8607 .frm_wrap {
8608 --small-sidebar: 20%;
8609 --medium-sidebar: 35%
8610 }
8611
8612 #form_settings_page .advanced_settings .form-table td, .form-table th {
8613 display: table-cell;
8614 width: auto !important;
8615 }
8616
8617 .frm-white-body #publishing-action,
8618 .frm_wrap #publishing-action {
8619 line-height: normal;
8620 }
8621
8622 .frm-white-body #screen-meta-links {
8623 display: none;
8624 }
8625
8626 .frm_wrap .misc-pub-section {
8627 padding: 6px 0;
8628 }
8629
8630 .frm_wrap .misc-pub-section > a {
8631 float: none;
8632 white-space: nowrap;
8633 }
8634
8635 .frm-form-setting-tabs a {
8636 position: relative;
8637 padding: 10px 5px 10px 40px;
8638 }
8639
8640 .frm-form-setting-tabs a .frmsvg,
8641 .frm-form-setting-tabs a i {
8642 position: absolute;
8643 left: 13px;
8644 top: calc(50% - 10px);
8645 margin: 0;
8646 }
8647
8648 #frm-insert-fields .button,
8649 #frm-insert-fields .button a,
8650 .frmbutton.ui-sortable-helper a {
8651 line-height: 26px;
8652 max-height: 28px;
8653 }
8654
8655 a.frm_add_logic_link {
8656 margin-left: 0;
8657 margin-right: 0;
8658 width: 100%;
8659 box-sizing: border-box;
8660 }
8661
8662 a.frm_add_logic_link .frmsvg,
8663 a.frm_add_logic_link i {
8664 display: none;
8665 }
8666
8667 #new_fields .frm_single_option select,
8668 #new_fields .frm_single_option input[type=text] {
8669 width: calc(100% - 83px);
8670 }
8671
8672 .frm_single_entry_page .frm_form_fields input[type=text],
8673 .frm_single_entry_page .frm_form_fields select,
8674 .frm_single_entry_page .frm_form_fields textarea {
8675 width: 100%;
8676 }
8677
8678 .with_frm_style .frm_radio input[type=radio],
8679 .with_frm_style .frm_checkbox input[type=checkbox] {
8680 width: 25px !important;
8681 }
8682
8683 .frm_single_entry_page .with_frm_style .frm_radio input[type=radio],
8684 .frm_single_entry_page .with_frm_style .frm_checkbox input[type=checkbox] {
8685 width: 18px !important;
8686 }
8687
8688 .wp-list-table.toplevel_page_formidable .column-entries,
8689 .wp-list-table.toplevel_page_formidable .column-form_key,
8690 .wp-list-table.toplevel_page_formidable .column-shortcode,
8691 .wp-list-table.toplevel_page_formidable .column-created_at {
8692 display: none !important;
8693 }
8694
8695 .wp-list-table.toplevel_page_formidable td.column-entries,
8696 .wp-list-table.toplevel_page_formidable td.column-form_key,
8697 .wp-list-table.toplevel_page_formidable td.column-shortcode,
8698 .wp-list-table.toplevel_page_formidable td.column-created_at {
8699 padding: 3px 8px 3px 35%;
8700 text-align: left;
8701 }
8702
8703 #form_entries_page .wp-list-table th.frm_hidden,
8704 #form_entries_page .wp-list-table td.frm_hidden {
8705 display: none !important;
8706 }
8707
8708 .frm-white-body.auto-fold #wpcontent {
8709 padding-left: 0;
8710 }
8711
8712 .frm_right_addon .frm_remove_field {
8713 bottom: 11px;
8714 }
8715
8716 .frm-addons {
8717 grid-template-columns: 1fr;
8718 }
8719
8720 .frm-admin-page-styles .frm_page_container,
8721 .frm_wrap .frm_page_container {
8722 left: 0 !important;
8723 top: 46px !important;
8724 height: calc( 100vh - 46px ) !important;
8725 }
8726
8727 .frm_single_entry_page.frm_wrap .columns-2 {
8728 display: block;
8729 border-bottom: none;
8730 }
8731
8732 .frm_single_entry_page .wrap.frm-with-margin {
8733 margin: 10px 20px;
8734 }
8735
8736 .frm_single_entry_page #post-body-content + .frm-right-panel {
8737 width: auto;
8738 margin: 0 20px;
8739 border: 1px solid var(--sidebar-hover);
8740 border-radius: 6px;
8741 }
8742
8743 #wp-content-media-buttons a.frm_insert_form {
8744 padding: 0 var(--gap-sm);
8745 }
8746
8747 .frm-admin-footer-links {
8748 padding-left: 0;
8749 }
8750
8751 body.rtl .frm-admin-footer-links {
8752 padding-right: 0;
8753 }
8754 }
8755
8756 @media only screen and (max-width: 700px) {
8757 .frm-white-body,
8758 .frm_wrap {
8759 --biggest-sidebar: 50%;
8760 --big-sidebar: 50%;
8761 }
8762 }
8763
8764 @media only screen and (max-width: 600px) {
8765 .frm-white-body,
8766 .frm_wrap {
8767 --small-sidebar: 45px;
8768 }
8769
8770 .frm-form-setting-tabs a {
8771 visibility: collapse;
8772 font-size: 0;
8773 padding: 0 var(--gap-sm);
8774 }
8775
8776 .frm-form-setting-tabs a .frmsvg,
8777 .frm-form-setting-tabs a i {
8778 visibility: visible;
8779 position: initial;
8780 font-size: 18px;
8781 }
8782
8783 #frm_builder_page #frm-insert-fields {
8784 padding: 0;
8785 }
8786
8787 .frm_wrap #frm_adv_info ul.category-tabs li {
8788 display: inline-block;
8789 padding: 0;
8790 margin: 2px 0;
8791 border-bottom: 2px solid transparent;
8792 }
8793
8794 .frm_wrap #frm_adv_info ul.category-tabs li.tabs,
8795 .frm_wrap #frm_adv_info ul.category-tabs li:first-child {
8796 margin-left: 0;
8797 padding: 0;
8798 }
8799
8800 .field_type_list li {
8801 text-align: center;
8802 }
8803
8804 #frm-insert-fields li a {
8805 padding: 5px;
8806 }
8807
8808 .frmbutton.ui-sortable-helper .frmsvg,
8809 .field_type_list li.frmbutton .frmsvg,
8810 .frmbutton.ui-sortable-helper i,
8811 .field_type_list li.frmbutton i {
8812 display: block;
8813 margin: 0 auto 3px;
8814 text-align: center;
8815 }
8816
8817 #frm_form_editor_container .frm_primary_label {
8818 clear: both;
8819 }
8820
8821 #frm_builder_page .frm_code_list a.button {
8822 padding: 2px;
8823 }
8824
8825 #frm_builder_page .frm_actions_dropdown > .frm-dropdown-menu {
8826 right: 0;
8827 left: auto;
8828 }
8829
8830 .frm-right-panel h3.accordion-section-title {
8831 padding-right: 10px;
8832 padding-left: 10px;
8833 font-size: 20px;
8834 white-space: nowrap;
8835 overflow: hidden;
8836 }
8837
8838 .frm-right-panel .accordion-section-title:before {
8839 margin-left: 0;
8840 margin-right: 3px;
8841 }
8842
8843 .rtl #frm_builder_page .frm_actions_dropdown > .frm-dropdown-menu {
8844 right: auto;
8845 left: 0;
8846 }
8847
8848 .frm_on_submit_type svg {
8849 display: none;
8850 }
8851 }
8852
8853 @media only screen and (max-width: 475px) {
8854 #frm_bs_dropdown {
8855 float: none;
8856 }
8857
8858 #frm-nav-tabs {
8859 padding: 0;
8860 white-space: nowrap;
8861 }
8862
8863 #frm-nav-tabs a {
8864 margin-right: 0;
8865 }
8866 }
8867
8868 /* Firefox */
8869 @-moz-document url-prefix() {
8870 .frm-white-body .tablenav select,
8871 .frm-white-body .tablenav input[type="text"],
8872 .wp-admin .frm_wrap .tablenav select,
8873 .frm_wrap .tablenav input[type="text"] {
8874 padding-top: 5px;
8875 }
8876 }
8877
8878 /* PRINT */
8879 @media print {
8880 a, .misc-pub-section a {
8881 color: #000 !important;
8882 }
8883
8884 .add-new-h2, #frm_top_bar, .dashicons,
8885 #adminmenuwrap, #adminmenuback, #wphead, #button_bar, #submitdiv, .button-secondary,
8886 #screen-metas, #screen-meta-links, #footer, #wpfooter, .inner-sidebar, .frm_form_nav,
8887 .frm_flash_graph, .frm_no_print, object, .error {
8888 visibility: hidden;
8889 display: none !important;
8890 }
8891
8892 .widget, .postbox, .stuffbox, .postbox h3 {
8893 border-width: 0 !important;
8894 border-color: #fff;
8895 }
8896
8897 .postbox {
8898 background: #fff !important;
8899 border: none;
8900 position: static;
8901 }
8902
8903 .postbox h3, .postbox h4 {
8904 background: #fff !important;
8905 }
8906
8907 #wpbody-content {
8908 float: none;
8909 }
8910
8911 #wpcontent, #post-body-content,
8912 .has-right-sidebar #post-body,
8913 #poststuff .columns-2 {
8914 margin: 0 !important;
8915 }
8916
8917 .frm_wrap #poststuff .columns-2 {
8918 display: block;
8919 }
8920
8921 #post-body-content + .frm-right-panel,
8922 .frm_wrap .columns-2 .frm-right-panel,
8923 .frm-right-panel {
8924 border: none;
8925 width: auto;
8926 display: block;
8927 padding: 20px;
8928 }
8929
8930 .frm_wrap .columns-2,
8931 .frm_wrap .frm_page_container {
8932 height: auto;
8933 display: block;
8934 }
8935
8936 .misc-pub-section > span {
8937 padding: 0;
8938 }
8939
8940 .frm-right-panel .postbox .inside {
8941 padding-left: 12px;
8942 padding-right: 12px;
8943 }
8944
8945 .curtime #timestamp:before {
8946 display: none;
8947 content: none !important;
8948 }
8949
8950 .frm_charts .alignleft {
8951 float: none;
8952 }
8953
8954 .pg_odd, .pg_even {
8955 page-break-inside: avoid;
8956 max-width: 600px;
8957 }
8958
8959 .form-table td, .form-table th {
8960 padding: 0;
8961 }
8962
8963 .frm_file_container a {
8964 display: block;
8965 width: 100%;
8966 }
8967 }
8968
8969 .frm-admin-page-styles #frm-publishing #save_menu_header,
8970 .frm-admin-page-styles2 #frm-publishing #save_menu_header {
8971 display: inline-block;
8972 }
8973
8974 /* Change the order of subfields of the Name field in the backend */
8975 .edit_form_item .frm_combo_inputs_container[data-name-layout="last_first"] .frm_form_subfield-first {
8976 order: 2;
8977 }
8978
8979 .frm-video-wrapper iframe {
8980 width: 100%;
8981 max-width: 843px;
8982 border-radius: var(--border-radius);
8983 }
8984
8985 #frm_field_group_popup {
8986 position: absolute;
8987 top: 0;
8988 right: 0;
8989 width: 366px;
8990 max-height: 231px;
8991 border-radius: 8px;
8992 background: #fff;
8993 box-shadow: 0px 20px 48px rgba(40, 47, 54, 0.15);
8994 z-index: 3;
8995 box-sizing: border-box;
8996 padding: 24px 0;
8997 text-align: left;
8998 }
8999
9000 .rtl #frm_field_group_popup {
9001 text-align: right;
9002 }
9003
9004 .frm-merge-fields-into-row #frm_field_group_popup {
9005 top: unset;
9006 bottom: 50px;
9007 height: 196px;
9008 }
9009
9010 #frm_field_group_popup > hr {
9011 margin: 12px 0;
9012 }
9013
9014 #frm_field_group_popup .frm-cancel-custom-field-group-layout,
9015 #frm_field_group_popup .frm-save-custom-field-group-layout {
9016 padding: 4px 18px;
9017 }
9018
9019 #frm_field_group_popup .frm-cancel-custom-field-group-layout:hover {
9020 border-color: var(--primary-500) !important;
9021 color: var(--primary-500);
9022 background-color: transparent !important;
9023 }
9024
9025 .frm-merge-fields-into-row #frm_field_group_popup .frm-break-field-group {
9026 display: none;
9027 }
9028
9029 .frm-merge-fields-into-row > a {
9030 color: rgba(40, 47, 54, 0.85);
9031 position: relative;
9032 top: 2px;
9033 }
9034
9035 .frm-row-layout-title {
9036 font-weight: 600;
9037 font-size: 11px;
9038 line-height: 15px;
9039 text-transform: uppercase;
9040 color: rgba(40, 47, 54, 0.45);
9041 margin-bottom: 27px;
9042 }
9043
9044 .frm-row-layout-option {
9045 background: #F6F7FB;
9046 box-sizing: border-box;
9047 border-radius: 2px;
9048 padding: 15px 10px;
9049 }
9050
9051 #frm_field_group_popup .frm-row-layout-option .frm_grid_container {
9052 grid-gap: 0 5%;
9053 grid-template-columns: repeat(12, auto);
9054 }
9055
9056 #frm_field_group_popup .frm-row-layout-option {
9057 cursor: pointer;
9058 border: 2px solid transparent;
9059 }
9060
9061 #frm_field_group_popup .frm-row-layout-option.frm-active-row-layout,
9062 #frm_field_group_popup .frm-row-layout-option:hover {
9063 border-color: var(--primary-500);
9064 }
9065
9066 .frm-custom-field-group-layout,
9067 .frm-break-field-group {
9068 padding: 4px 24px;
9069 cursor: pointer;
9070 font-size: var(--text-sm);
9071 line-height: 19px;
9072 color: rgba(72, 78, 84, 1);
9073 }
9074
9075 .frm-custom-field-group-layout:hover,
9076 .frm-break-field-group:hover {
9077 background-color: #f5f5f5f5;
9078 }
9079
9080 .frm-custom-field-group-layout svg,
9081 .frm-break-field-group svg {
9082 margin-right: 5px;
9083 }
9084
9085 #frm_field_multiselect_popup {
9086 background: white;
9087 height: 48px;
9088 position: fixed;
9089 border-radius: 4px;
9090 box-shadow: 0px 8px 24px rgba(40, 47, 54, 0.15);
9091 color: rgba(40, 47, 54, 0.85);
9092 font-size: 13px;
9093 right: 30px;
9094 bottom: 10px;
9095 }
9096
9097 #frm_field_multiselect_popup > div {
9098 display: inline-block;
9099 line-height: 48px;
9100 vertical-align: top;
9101 }
9102
9103 #frm_field_multiselect_popup.frm-unmergable > .frm-merge-fields-into-row,
9104 #frm_field_multiselect_popup.frm-unmergable > .frm-multiselect-popup-separator {
9105 display: none;
9106 }
9107
9108 #frm_field_multiselect_popup > div:not(.frm-multiselect-popup-separator) {
9109 padding: 0 20px;
9110 cursor: pointer;
9111 }
9112
9113 #frm_field_multiselect_popup > div:not(.frm-multiselect-popup-separator):hover {
9114 background: #f5f5f5f5;
9115 }
9116
9117 .frm-builder-popup-heading {
9118 font-weight: 600;
9119 font-size: 11px;
9120 line-height: 15px;
9121 text-transform: uppercase;
9122 color: rgba(40, 47, 54, 0.45);
9123 margin-bottom: 7px;
9124 }
9125
9126 .frm-builder-popup-subheading {
9127 font-size: 12px;
9128 line-height: 16px;
9129 color: rgba(40, 47, 54, 0.45);
9130 }
9131
9132 #frm_field_group_popup input[type="text"] {
9133 height: 30px;
9134 border-radius: 3px;
9135 font-size: 14px;
9136 padding: 8px;
9137 color: rgba(84, 95, 110, 1);
9138 border-color: rgba(40, 47, 54, 0.2);
9139 }
9140
9141 .frm-multiselect-popup-separator {
9142 height: 36px;
9143 width: 1px;
9144 position: relative;
9145 top: 6px;
9146 background: #C4C4C4;
9147 }
9148
9149 .frm-sortable-helper,
9150 .frm-multiselect-key-is-down li.form-field:not(.edit_field_type_divider) {
9151 pointer-events: none;
9152 }
9153
9154 .frm-sortable-helper {
9155 /* Make sure the item being dragged appears above other form builder fields */
9156 z-index: 99;
9157 }
9158
9159 #frm_banner {
9160 width: 100%;
9161 color: #fff;
9162 background: var(--primary-500);
9163 height: 40px;
9164 line-height: 40px;
9165 text-align: center;
9166 position: relative;
9167 }
9168
9169 .frm-banner-emoji {
9170 font-size: 19px;
9171 }
9172
9173 .frm-banner-emoji,
9174 .frm-banner-title {
9175 margin-right: 5px;
9176 vertical-align: top;
9177 }
9178
9179 .frm-banner-cta a {
9180 text-decoration: underline !important;
9181 }
9182
9183 .frm-banner-dismiss {
9184 cursor: pointer;
9185 position: absolute;
9186 right: 10px;
9187 top: 50%;
9188 transform: translateY( -50% );
9189 }
9190
9191 .frm-banner-dismiss .frmsvg {
9192 vertical-align: top;
9193 }
9194
9195 .frm-ready-made-solution:not(.frm-search-result) {
9196 display: none !important;
9197 }
9198
9199 #frm_new_form_modal .frm-ready-made-solution {
9200 padding: var(--gap-xs) !important;
9201 margin: var(--gap-xs) 0 var(--gap-sm);
9202 display: flex;
9203 gap: var(--gap-sm);
9204 position: relative;
9205 overflow: visible !important;
9206 }
9207
9208 #frm_new_form_modal .frm-ready-made-solution:after {
9209 width: 100%;
9210 height: 1px;
9211 background: var(--grey-300);
9212 content: '';
9213 position: absolute;
9214 bottom: -10px;
9215 left: 0;
9216 }
9217
9218 #frm_new_form_modal .frm-ready-made-solution.frm-search-result:last-of-type::after {
9219 content: none;
9220 }
9221
9222 #frm_new_form_modal .frm-solution-details {
9223 flex: 1;
9224 display: flex;
9225 gap: var(--gap-2xs);
9226 flex-direction: column;
9227 }
9228
9229 #frm_new_form_modal .frm-ready-made-solution > div:first-child {
9230 width: 30%;
9231 text-align: center;
9232 }
9233
9234 .frm-ready-made-solution h3 ~ a {
9235 color: var(--primary-500);
9236 }
9237
9238 .frm-ready-made-solution img {
9239 max-width: 100%;
9240 display: block;
9241 box-shadow: var(--box-shadow-lg);
9242 }
9243
9244 /* On Submit action */
9245 .frm_single_on_submit_settings .frm_form_field {
9246 margin: 8px 0;
9247 }
9248
9249 .frm_on_submit_type_setting {
9250 padding: 8px 0;
9251 }
9252
9253 .frm_on_submit_type label {
9254 display: flex;
9255 border: 1px solid var(--grey-border);
9256 border-radius: var(--small-radius);
9257 gap: 16px;
9258 padding: 16px;
9259 align-items: center;
9260 justify-content: center;
9261 }
9262
9263 .frm_on_submit_type input {
9264 opacity: 0 !important;
9265 position: absolute;
9266 z-index: -1;
9267 }
9268
9269 .frm_on_submit_type input[type="radio"]:checked + label {
9270 border-color: var(--primary-color);
9271 box-shadow: 0 0 0 1px var(--primary-color);
9272 }
9273
9274 #form_settings_page .frm_on_submit_type label:hover,
9275 .frm_on_submit_type input[type="radio"]:checked + label svg {
9276 color: var(--primary-color);
9277 }
9278 /* End On Submit action */
9279