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

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