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

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

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