PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.5.1
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.5.1
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.1, at css/frm_admin.css

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