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

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