PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.2.3
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.2.3
6.35 6.34 6.33.1 6.33 6.32.1 6.32 6.31 6.25 6.25.1 6.26 6.26.1 6.27 6.28 6.29 6.3 6.3.1 6.3.2 6.30 6.4 6.4.1 6.4.2 6.5 6.5.1 6.5.2 6.5.3 All 141 releases
← All changes | css/custom_theme.css.php +338 -324 6.266.2.3 View file →
@@ -16,14 +16,12 @@
16 16 if ( ! isset( $frm_style ) ) {
17 17 $frm_style = new FrmStyle();
18 18 }
19 19
20 -$styles = $frm_style->get_all();
21 -$default_style = $frm_style->get_default_style( $styles );
22 -$defaults = FrmStylesHelper::get_settings_for_output( $default_style );
23 -$important = empty( $defaults['important_style'] ) ? '' : ' !important';
24 -$pro_is_installed = FrmAppHelper::pro_is_installed();
25 -$use_chosen_js = FrmStylesHelper::use_chosen_js();
20 +$styles = $frm_style->get_all();
21 +$default_style = $frm_style->get_default_style( $styles );
22 +$defaults = FrmStylesHelper::get_settings_for_output( $default_style );
23 +$important = empty( $defaults['important_style'] ) ? '' : ' !important';
26 24
27 25 ?>
28 26 .with_frm_style{
29 27 <?php FrmStylesHelper::output_vars( $defaults ); ?>
@@ -38,12 +36,12 @@
38 36
39 37 .with_frm_style,
40 38 .with_frm_style form,
41 39 .with_frm_style .frm-show-form div.frm_description p{
42 - text-align: var(--form-align)<?php echo esc_html( $important ); ?>;
40 + text-align:<?php echo esc_html( $defaults['form_align'] . $important ); ?>;
41 + text-align:var(--form-align)<?php echo esc_html( $important ); ?>;
43 42 }
44 43
45 -/* Keep this. This is used for Honeypot */
46 44 input:-webkit-autofill {
47 45 -webkit-box-shadow: 0 0 0 30px white inset;
48 46 }
49 47
@@ -49,24 +47,34 @@
49 47
50 48 /* Form description */
51 49 .with_frm_style .frm-show-form div.frm_description p{
52 50 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
53 - font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
51 + font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
52 + font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
54 53 <?php } ?>
55 54 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
56 - color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
55 + color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
56 + color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
57 57 <?php } ?>
58 58 <?php if ( ! empty( $defaults['form_desc_margin_top'] ) ) { ?>
59 - margin-top: var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
59 + margin-top:<?php echo esc_html( $defaults['form_desc_margin_top'] . $important ); ?>;
60 + margin-top:var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
60 61 <?php } ?>
61 62 <?php if ( ! empty( $defaults['form_desc_margin_bottom'] ) ) { ?>
62 - margin-bottom: var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
63 + margin-bottom:<?php echo esc_html( $defaults['form_desc_margin_bottom'] . $important ); ?>;
64 + margin-bottom:var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
63 65 <?php } ?>
64 66 <?php if ( isset( $defaults['form_desc_padding'] ) ) { ?>
65 - padding: var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
67 + padding:<?php echo esc_html( $defaults['form_desc_padding'] . $important ); ?>;
68 + padding:var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
66 69 <?php } ?>
67 70 }
68 71
72 +form input.frm_verify{
73 + position:absolute;
74 + left:-3000px;
75 +}
76 +
69 77 .with_frm_style fieldset{
70 78 min-width:0;
71 79 display: block; /* Override 2021 theme */
72 80 }
@@ -78,21 +86,25 @@
78 86 background-color:transparent;
79 87 }
80 88
81 89 .with_frm_style .frm_form_fields > fieldset{
82 -<?php if ( isset( $defaults['fieldset'] ) && ( $defaults['fieldset'] || '0' === $defaults['fieldset'] ) ) { ?>
83 - border-width: var(--fieldset)<?php echo esc_html( $important ); ?>;
90 +<?php if ( ! empty( $defaults['fieldset'] ) ) { ?>
91 + border-width:<?php echo esc_html( $defaults['fieldset'] . $important ); ?>;
92 + border-width:var(--fieldset)<?php echo esc_html( $important ); ?>;
84 93 <?php } ?>
85 94 border-style:solid;
86 95 <?php if ( ! empty( $defaults['fieldset_color'] ) ) { ?>
87 - border-color: var(--fieldset-color)<?php echo esc_html( $important ); ?>;
96 + border-color:<?php echo esc_html( $defaults['fieldset_color'] . $important ); ?>;
97 + border-color:var(--fieldset-color)<?php echo esc_html( $important ); ?>;
88 98 <?php } ?>
89 99 margin:0;
90 100 <?php if ( ! empty( $defaults['fieldset_padding'] ) ) { ?>
91 - padding: var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
101 + padding:<?php echo esc_html( $defaults['fieldset_padding'] . $important ); ?>;
102 + padding:var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
92 103 <?php } ?>
93 104 <?php if ( ! empty( $defaults['fieldset_bg_color'] ) ) { ?>
94 - background-color: var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
105 + background-color:<?php echo esc_html( $defaults['fieldset_bg_color'] ); ?>;
106 + background-color:var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
95 107 <?php } ?>
96 108 <?php if ( ! empty( $defaults['font'] ) ) { ?>
97 109 font-family:var(--font);
98 110 <?php } ?>
@@ -116,21 +128,26 @@
116 128
117 129 .with_frm_style legend + h3,
118 130 .with_frm_style h3.frm_form_title{
119 131 <?php if ( ! empty( $defaults['title_size'] ) ) { ?>
120 - font-size: var(--title-size)<?php echo esc_html( $important ); ?>;
132 + font-size:<?php echo esc_html( $defaults['title_size'] . $important ); ?>;
133 + font-size:var(--title-size)<?php echo esc_html( $important ); ?>;
121 134 <?php } ?>
122 135 <?php if ( ! empty( $defaults['title_color'] ) ) { ?>
123 - color: var(--title-color)<?php echo esc_html( $important ); ?>;
136 + color:<?php echo esc_html( $defaults['title_color'] . $important ); ?>;
137 + color:var(--title-color)<?php echo esc_html( $important ); ?>;
124 138 <?php } ?>
125 139 <?php if ( ! empty( $defaults['font'] ) ) { ?>
126 - font-family: var(--font);
140 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
141 + font-family:var(--font);
127 142 <?php } ?>
128 143 <?php if ( ! empty( $defaults['title_margin_top'] ) ) { ?>
129 - margin-top: var(--title-margin-top)<?php echo esc_html( $important ); ?>;
144 + margin-top:<?php echo esc_html( $defaults['title_margin_top'] . $important ); ?>;
145 + margin-top:var(--title-margin-top)<?php echo esc_html( $important ); ?>;
130 146 <?php } ?>
131 147 <?php if ( ! empty( $defaults['title_margin_bottom'] ) ) { ?>
132 - margin-bottom: var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
148 + margin-bottom:<?php echo esc_html( $defaults['title_margin_bottom'] . $important ); ?>;
149 + margin-bottom:var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
133 150 <?php } ?>
134 151 }
135 152
136 153 .with_frm_style .frm_form_field.frm_html_container,
@@ -135,42 +152,46 @@
135 152
136 153 .with_frm_style .frm_form_field.frm_html_container,
137 154 .with_frm_style .frm_form_field .frm_show_it{
138 155 <?php if ( ! empty( $defaults['font'] ) ) { ?>
139 - font-family: var(--font);
156 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
157 + font-family:var(--font);
140 158 <?php } ?>
141 159 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
142 - color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
160 + color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
161 + color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
143 162 <?php } ?>
144 163 }
145 164
146 165 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
147 166 .with_frm_style .frm_form_field.frm_html_container{
148 - font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
167 + font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
168 + font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
149 169 }
150 170 <?php } ?>
151 171
152 172 .with_frm_style .frm_form_field .frm_show_it{
153 173 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
154 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
174 + font-size:<?php echo esc_html( $defaults['field_font_size'] . $important ); ?>;
175 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
155 176 <?php } ?>
156 177 <?php if ( ! empty( $defaults['field_weight'] ) ) { ?>
157 - font-weight: var(--field-weight)<?php echo esc_html( $important ); ?>;
178 + font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
179 + font-weight:var(--field-weight)<?php echo esc_html( $important ); ?>;
158 180 <?php } ?>
159 181 }
160 182
161 -.with_frm_style .frm_required {
183 +.with_frm_style .frm_required{
162 184 <?php if ( ! empty( $defaults['required_color'] ) ) { ?>
163 - color: var(--required-color)<?php echo esc_html( $important ); ?>;
185 + color:<?php echo esc_html( $defaults['required_color'] . $important ); ?>;
186 + color:var(--required-color)<?php echo esc_html( $important ); ?>;
164 187 <?php } ?>
165 188 <?php if ( ! empty( $defaults['required_weight'] ) ) { ?>
166 - font-weight: var(--required-weight)<?php echo esc_html( $important ); ?>;
189 + font-weight:<?php echo esc_html( $defaults['required_weight'] . $important ); ?>;
190 + font-weight:var(--required-weight)<?php echo esc_html( $important ); ?>;
167 191 <?php } ?>
168 192 }
169 193
170 -<?php if ( $use_chosen_js ) { ?>
171 -.with_frm_style .chosen-container,
172 -<?php } ?>
173 194 .with_frm_style input[type=text],
174 195 .with_frm_style input[type=password],
175 196 .with_frm_style input[type=email],
176 197 .with_frm_style input[type=number],
@@ -178,12 +199,14 @@
178 199 .with_frm_style input[type=tel],
179 200 .with_frm_style input[type=search],
180 201 .with_frm_style select,
181 202 .with_frm_style textarea,
182 -.with_frm_style .frm-card-element.StripeElement {
203 +.with_frm_style .frm-card-element.StripeElement,
204 +.with_frm_style .chosen-container{
183 205 font-family:var(--font)<?php echo esc_html( $important ); ?>;
184 206 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
185 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
207 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
208 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
186 209 <?php } ?>
187 210 margin-bottom:0<?php echo esc_html( $important ); ?>;
188 211 }
189 212
@@ -206,63 +229,48 @@
206 229 .with_frm_style .frm_scroll_box .frm_opt_container,
207 230 .frm_form_fields_active_style,
208 231 .frm_form_fields_error_style,
209 232 .with_frm_style .frm-card-element.StripeElement,
210 -<?php if ( $use_chosen_js ) { ?>
211 233 .with_frm_style .chosen-container-multi .chosen-choices,
212 -.with_frm_style .chosen-container-single .chosen-single,
234 +.with_frm_style .chosen-container-single .chosen-single{
235 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
236 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
237 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
238 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
239 +<?php if ( ! empty( $important ) ) { ?>
240 + background-image:none !important;
213 241 <?php } ?>
214 -.with_frm_style .frm_slimselect.ss-main {
215 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
216 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
217 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
218 - border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
219 - border-style: var(--field-border-style)<?php echo esc_html( $important ); ?>;
220 - border-radius: var(--border-radius)<?php echo esc_html( $important ); ?>;
221 - width: var(--field-width)<?php echo esc_html( $important ); ?>;
222 - max-width: 100%;
223 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
224 - padding: var(--field-pad)<?php echo esc_html( $important ); ?>;
225 - box-sizing: border-box;
226 - outline: none<?php echo esc_html( $important ); ?>;
227 - font-weight: var(--field-weight);
242 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
243 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
244 + border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
245 + border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
246 + border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
247 + border-style:var(--field-border-style)<?php echo esc_html( $important ); ?>;
248 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
249 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
250 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
251 + border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
252 + width:<?php echo esc_html( $defaults['field_width'] ); ?>;
253 + width:var(--field-width)<?php echo esc_html( $important ); ?>;
254 + max-width:100%;
255 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
256 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
257 + padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
258 + padding:var(--field-pad)<?php echo esc_html( $important ); ?>;
259 + -webkit-box-sizing:border-box;
260 + -moz-box-sizing:border-box;
261 + box-sizing:border-box;
262 + outline:none<?php echo esc_html( $important ); ?>;
263 + font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
264 + font-weight:var(--field-weight);
265 + box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
228 266 }
229 267
230 -<?php if ( ! empty( $important ) ) : ?>
231 - <?php if ( $use_chosen_js ) { ?>
232 - .with_frm_style .chosen-container-multi .chosen-choices,
233 - .with_frm_style .chosen-container-single .chosen-single,
234 - <?php } ?>
235 -.with_frm_style input[type=text],
236 -.with_frm_style input[type=password],
237 -.with_frm_style input[type=email],
238 -.with_frm_style input[type=number],
239 -.with_frm_style input[type=url],
240 -.with_frm_style input[type=tel],
241 -.with_frm_style input[type=phone],
242 -.with_frm_style input[type=search],
243 -.with_frm_style textarea,
244 -.frm_form_fields_style,
245 -.with_frm_style .frm_scroll_box .frm_opt_container,
246 -.frm_form_fields_active_style,
247 -.frm_form_fields_error_style,
248 -.with_frm_style .frm-card-element.StripeElement {
249 - background-image:none !important;
250 -}
251 -<?php endif; ?>
252 -
253 -.with_frm_style select option {
254 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
255 -}
256 -
257 -.with_frm_style select option.frm-select-placeholder {
258 - color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
259 -}
260 -
261 268 .with_frm_style input[type=radio],
262 269 .with_frm_style input[type=checkbox]{
263 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
264 - box-shadow: var(--box-shadow)<?php echo esc_html( $important ); ?>;
270 + border-color:<?php echo esc_html( $defaults['border_color'] . $important ); ?>;
271 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
272 + box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
265 273 float: none;
266 274 }
267 275
268 276 .with_frm_style input[type=radio]:after,
@@ -269,18 +277,8 @@
269 277 .with_frm_style input[type=checkbox]:after {
270 278 display: none; /* 2021 conflict */
271 279 }
272 280
273 -.with_frm_style input[type=radio]:not(:checked):focus,
274 -.with_frm_style input[type=checkbox]:not(:checked):focus {
275 - border-color: var(--border-color) !important;
276 -}
277 -
278 -.with_frm_style input[type=radio]:focus,
279 -.with_frm_style input[type=checkbox]:focus {
280 - box-shadow:0px 0px 0px 3px rgba(<?php echo esc_html( FrmStylesHelper::hex2rgb( $defaults['border_color_active'] ) ); ?>, 0.4) !important;
281 -}
282 -
283 281 .with_frm_style input[type=text],
284 282 .with_frm_style input[type=password],
285 283 .with_frm_style input[type=email],
286 284 .with_frm_style input[type=number],
@@ -289,9 +287,10 @@
289 287 .with_frm_style input[type=file],
290 288 .with_frm_style input[type=search],
291 289 .with_frm_style select,
292 290 .with_frm_style .frm-card-element.StripeElement{
293 - min-height: var(--field-height)<?php echo esc_html( $important ); ?>;
291 + height:<?php echo esc_html( $defaults['field_height'] ); ?>;
292 + height:var(--field-height)<?php echo esc_html( $important ); ?>;
294 293 line-height:1.3<?php echo esc_html( $important ); ?>;
295 294 }
296 295
297 296 .with_frm_style select[multiple=multiple]{
@@ -306,15 +305,17 @@
306 305 box-shadow:none;
307 306 }
308 307
309 308 .with_frm_style input[type=file]{
310 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
311 - padding: 0px;
309 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
310 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
311 + padding:0px;
312 312 <?php if ( ! empty( $defaults['font'] ) ) { ?>
313 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
313 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
314 314 <?php } ?>
315 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
316 - display: initial;
315 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
316 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
317 + display:initial;
317 318 }
318 319
319 320 .with_frm_style input[type=file].frm_transparent{
320 321 color:transparent<?php echo esc_html( $important ); ?>;
@@ -320,9 +321,10 @@
320 321 color:transparent<?php echo esc_html( $important ); ?>;
321 322 }
322 323
323 324 .with_frm_style .wp-editor-wrap{
324 - width: var(--field-width)<?php echo esc_html( $important ); ?>;
325 + width:<?php echo esc_html( $defaults['field_width'] . $important ); ?>;
326 + width:var(--field-width)<?php echo esc_html( $important ); ?>;
325 327 max-width:100%;
326 328 }
327 329
328 330 .with_frm_style .wp-editor-container textarea{
@@ -330,15 +332,17 @@
330 332 box-shadow:none !important;
331 333 }
332 334
333 335 .with_frm_style .mceIframeContainer{
334 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
336 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
337 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
335 338 }
336 339
337 340 .with_frm_style select{
338 - width: var(--auto-width)<?php echo esc_html( $important ); ?>;
341 + width:<?php echo esc_html( $defaults['auto_width'] ); ?>;
342 + width:var(--auto-width)<?php echo esc_html( $important ); ?>;
339 343 max-width:100%;
340 - background-position-y: calc(50% + 3px);
344 + background-position-y: center;
341 345 }
342 346
343 347 .with_frm_style input[disabled],
344 348 .with_frm_style select[disabled],
@@ -344,12 +348,15 @@
344 348 .with_frm_style select[disabled],
345 349 .with_frm_style textarea[disabled],
346 350 .with_frm_style input[readonly],
347 351 .with_frm_style select[readonly],
348 -.with_frm_style textarea[readonly] {
349 - background-color: var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
350 - color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
351 - border-color: var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
352 +.with_frm_style textarea[readonly]{
353 + background-color:<?php echo esc_html( $defaults['bg_color_disabled'] ); ?>;
354 + background-color:var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
355 + color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
356 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
357 + border-color:<?php echo esc_html( $defaults['border_color_disabled'] ); ?>;
358 + border-color:var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
352 359 }
353 360
354 361 .frm_preview_page:before{
355 362 content:normal !important;
@@ -361,24 +368,30 @@
361 368
362 369 .with_frm_style .frm_primary_label{
363 370 max-width:100%;
364 371 <?php if ( ! empty( $defaults['font'] ) ) { ?>
365 - font-family: var(--font);
372 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
373 + font-family:var(--font);
366 374 <?php } ?>
367 375 <?php if ( ! empty( $defaults['font_size'] ) ) { ?>
368 - font-size: var(--font-size)<?php echo esc_html( $important ); ?>;
376 + font-size:<?php echo esc_html( $defaults['font_size'] . $important ); ?>;
377 + font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
369 378 <?php } ?>
370 379 <?php if ( ! empty( $defaults['label_color'] ) ) { ?>
371 - color: var(--label-color)<?php echo esc_html( $important ); ?>;
380 + color:<?php echo esc_html( $defaults['label_color'] . $important ); ?>;
381 + color:var(--label-color)<?php echo esc_html( $important ); ?>;
372 382 <?php } ?>
373 383 <?php if ( ! empty( $defaults['weight'] ) ) { ?>
374 - font-weight: var(--weight)<?php echo esc_html( $important ); ?>;
384 + font-weight:<?php echo esc_html( $defaults['weight'] . $important ); ?>;
385 + font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
375 386 <?php } ?>
376 387 <?php if ( ! empty( $defaults['align'] ) ) { ?>
377 - text-align: var(--align)<?php echo esc_html( $important ); ?>;
388 + text-align:<?php echo esc_html( $defaults['align'] . $important ); ?>;
389 + text-align:var(--align)<?php echo esc_html( $important ); ?>;
378 390 <?php } ?>
379 391 <?php if ( ! empty( $defaults['label_padding'] ) ) { ?>
380 - padding: var(--label-padding)<?php echo esc_html( $important ); ?>;
392 + padding:<?php echo esc_html( $defaults['label_padding'] . $important ); ?>;
393 + padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
381 394 <?php } ?>
382 395 margin:0;
383 396 width:auto;
384 397 display:block;
@@ -431,9 +444,9 @@
431 444
432 445 /* Floating labels */
433 446 .with_frm_style .frm_inside_container {
434 447 position: relative;
435 - padding-top: 18px;
448 + padding-top: 16px;
436 449 padding-top: calc(0.5 * var(--field-height));
437 450 }
438 451
439 452 .with_frm_style .frm_inside_container > input,
@@ -441,13 +454,21 @@
441 454 .with_frm_style .frm_inside_container > textarea {
442 455 display: block;
443 456 }
444 457
445 -.with_frm_style input::placeholder,
446 -.with_frm_style textarea::placeholder {
447 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
458 +/* These do not work if they are combined */
459 +.with_frm_style .frm_inside_container > input::-moz-placeholder,
460 +.with_frm_style .frm_inside_container > textarea::-moz-placeholder {
461 + opacity: 0 !important;
462 + transition: opacity 0.3s ease-in;
448 463 }
449 464
465 +.with_frm_style .frm_inside_container > input:-ms-input-placeholder,
466 +.with_frm_style .frm_inside_container > textarea:-ms-input-placeholder {
467 + opacity: 0;
468 + transition: opacity 0.3s ease-in;
469 +}
470 +
450 471 .with_frm_style .frm_inside_container > input::placeholder,
451 472 .with_frm_style .frm_inside_container > textarea::placeholder {
452 473 opacity: 0;
453 474 transition: opacity 0.3s ease-in;
@@ -456,9 +477,9 @@
456 477 .with_frm_style .frm_inside_container > label {
457 478 transition: all 0.3s ease-in;
458 479
459 480 position: absolute;
460 - top: 19px;
481 + top: 17px;
461 482 top: calc(1px + .5 * var(--field-height));
462 483 left: 3px;
463 484 width: 100%;
464 485
@@ -466,9 +487,9 @@
466 487 text-overflow: ellipsis;
467 488 overflow: hidden;
468 489 white-space: nowrap;
469 490
470 - padding: 8px 12px;
491 + padding: 6px 10px;
471 492 padding: var(--field-pad);
472 493
473 494 font-size: 14px;
474 495 font-size: var(--field-font-size);
@@ -474,8 +495,9 @@
474 495 font-size: var(--field-font-size);
475 496 font-weight: normal;
476 497 font-weight: var(--field-weight);
477 498
499 + -ms-pointer-events: none;
478 500 pointer-events: none;
479 501 }
480 502
481 503 .with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
@@ -489,8 +511,21 @@
489 511 font-size: 12px;
490 512 font-size: calc(0.85 * var(--field-font-size));
491 513 }
492 514
515 +/* These do not work if they are combined */
516 +.with_frm_style .frm_inside_container.frm_label_float_top > input::-moz-placeholder,
517 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea::-moz-placeholder {
518 + opacity: 1 !important;
519 + transition: opacity 0.3s ease-in;
520 +}
521 +
522 +.with_frm_style .frm_inside_container.frm_label_float_top > input:-ms-input-placeholder,
523 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea:-ms-input-placeholder {
524 + opacity: 1;
525 + transition: opacity 0.3s ease-in;
526 +}
527 +
493 528 .with_frm_style .frm_inside_container.frm_label_float_top > input::placeholder,
494 529 .with_frm_style .frm_inside_container.frm_label_float_top > textarea::placeholder {
495 530 opacity: 1;
496 531 transition: opacity 0.3s ease-in;
@@ -542,43 +577,54 @@
542 577 white-space:nowrap;
543 578 }
544 579
545 580 .with_frm_style .frm_button{
546 - text-decoration:none !important;
581 + text-decoration:none !important;;
547 582 border:1px solid #eee;
548 583 display:inline-block;
549 584 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
550 - padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
585 + padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
586 + padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
551 587 <?php } else { ?>
552 588 padding:5px;
553 589 <?php } ?>
554 590 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
591 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
592 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
555 593 border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
556 594 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
557 595 <?php } ?>
558 596 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
559 - font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
597 + font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
598 + font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
560 599 <?php } ?>
561 600 <?php if ( ! empty( $defaults['font'] ) ) { ?>
562 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
601 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
602 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
563 603 <?php } ?>
564 604 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
565 - font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
605 + font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
606 + font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
566 607 <?php } ?>
567 608 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
568 - color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
609 + color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
610 + color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
569 611 <?php } ?>
570 612 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
571 - background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
613 + background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
614 + background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
572 615 <?php } ?>
573 616 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
574 - border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
617 + border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
618 + border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
575 619 <?php } ?>
576 620 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
577 - border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
621 + border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
622 + border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
578 623 <?php } ?>
579 624 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
580 - height: var(--submit-height)<?php echo esc_html( $important ); ?>;
625 + height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
626 + height:var(--submit-height)<?php echo esc_html( $important ); ?>;
581 627 <?php } ?>
582 628 }
583 629
584 630 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -611,12 +657,8 @@
611 657 .with_frm_style.frm_center_submit .frm_submit{
612 658 text-align:center;
613 659 }
614 660
615 -.with_frm_style.frm_center_submit .frm_flex.frm_submit {
616 - justify-content: center;
617 -}
618 -
619 661 .with_frm_style .frm_inline_success .frm_submit{
620 662 display: flex;
621 663 flex-direction: row;
622 664 align-items: center;
@@ -660,8 +702,9 @@
660 702
661 703 .with_frm_style .frm_loading_prev .frm_prev_page,
662 704 .with_frm_style .frm_loading_form .frm_button_submit {
663 705 position: relative;
706 + opacity: .8;
664 707 color: transparent !important;
665 708 text-shadow: none !important;
666 709 }
667 710
@@ -687,9 +730,9 @@
687 730 border-top-color: transparent;
688 731 border-left-color: transparent;
689 732 border-radius: 50%;
690 733 box-sizing: border-box;
691 - <?php $loader_size = 12; ?>
734 + <?php $loader_size = 20; ?>
692 735 top: 50%;
693 736 left: 50%;
694 737 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 738 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -694,23 +737,17 @@
694 737 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 738 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
696 739 width: <?php echo absint( $loader_size ); ?>px;
697 740 height: <?php echo absint( $loader_size ); ?>px;
698 - animation: spin 2s linear infinite;
741 + -webkit-animation: spin 2s linear infinite;
742 + -moz-animation: spin 2s linear infinite;
743 + -o-animation: spin 2s linear infinite;
744 + animation: spin 2s linear infinite;
699 745 }
700 746
701 -.with_frm_style .frm_submit.frm_flex {
702 - align-items: center;
703 - gap: 2%;
704 -}
705 -
706 -.with_frm_style .frm_submit.frm_flex button.frm_button_submit ~ .frm_prev_page {
707 - order: -1;
708 -}
709 -
710 747 <?php
711 748 foreach ( $styles as $style ) {
712 - include __DIR__ . '/_single_theme.css.php';
749 + include( dirname( __FILE__ ) . '/_single_theme.css.php' );
713 750 unset( $style );
714 751 }
715 752
716 753 // Set it again since it may have been overridden.
@@ -732,12 +769,15 @@
732 769
733 770 .with_frm_style a.frm_save_draft,
734 771 .with_frm_style a.frm_start_over{
735 772 <?php if ( ! empty( $defaults['font'] ) ) { ?>
736 - font-family: var(--font);
773 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
774 + font-family:var(--font);
737 775 <?php } ?>
738 - font-size: var(--submit-font-size);
739 - font-weight: var(--submit-weight);
776 + font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
777 + font-size:var(--submit-font-size);
778 + font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
779 + font-weight:var(--submit-weight);
740 780 }
741 781
742 782 .horizontal_radio .frm_radio{
743 783 margin:0 5px 0 0;
@@ -744,9 +784,9 @@
744 784 }
745 785
746 786 .horizontal_radio .frm_checkbox{
747 787 margin:0;
748 - margin-right:12px;
788 + margin-right:5px;
749 789 }
750 790
751 791 .vertical_radio .frm_checkbox,
752 792 .vertical_radio .frm_radio,
@@ -761,13 +801,15 @@
761 801 padding-left: 0;
762 802 }
763 803
764 804 .with_frm_style .frm_radio{
765 - display: var(--radio-align)<?php echo esc_html( $important ); ?>;
805 + display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
806 + display:var(--radio-align)<?php echo esc_html( $important ); ?>;
766 807 }
767 808
768 809 .with_frm_style .frm_checkbox{
769 - display: var(--check-align)<?php echo esc_html( $important ); ?>;
810 + display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
811 + display:var(--check-align)<?php echo esc_html( $important ); ?>;
770 812 }
771 813
772 814 .with_frm_style .vertical_radio .frm_checkbox,
773 815 .with_frm_style .vertical_radio .frm_radio,
@@ -772,9 +814,8 @@
772 814 .with_frm_style .vertical_radio .frm_checkbox,
773 815 .with_frm_style .vertical_radio .frm_radio,
774 816 .vertical_radio .frm_catlevel_1{
775 817 display:block<?php echo esc_html( $important ); ?>;
776 - margin-bottom: 10px;
777 818 }
778 819
779 820 .with_frm_style .horizontal_radio .frm_checkbox,
780 821 .with_frm_style .horizontal_radio .frm_radio,
@@ -782,45 +823,40 @@
782 823 display:inline-block<?php echo esc_html( $important ); ?>;
783 824 }
784 825
785 826 .with_frm_style .frm_checkbox label,
786 -.with_frm_style .frm_radio label {
787 - display: inline-block;
788 - vertical-align: middle;
827 +.with_frm_style .frm_radio label{
828 + display: inline;
789 829 white-space:normal;
790 830 }
791 831
792 -.with_frm_style .frm_checkbox label input[type=checkbox],
793 -.with_frm_style .frm_radio label input[type=radio] {
794 - margin-right: 4px;
795 -}
796 -
797 -.with_frm_style .frm_checkbox label:not(.frm-label-disabled),
798 -.with_frm_style .frm_radio label:not(.frm-label-disabled) {
799 - cursor: pointer;
800 -}
801 -
802 832 .with_frm_style .vertical_radio .frm_checkbox label,
803 833 .with_frm_style .vertical_radio .frm_radio label{
804 834 display: block;
805 - width: 100%;
835 + padding-left: 20px;
836 + text-indent: -20px;
806 837 }
807 838
808 839 .with_frm_style .frm_radio label,
809 -.with_frm_style .frm_checkbox label {
840 +.with_frm_style .frm_checkbox label{
810 841 <?php if ( ! empty( $defaults['font'] ) ) { ?>
811 - font-family: var(--font);
842 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
843 + font-family:var(--font);
812 844 <?php } ?>
813 - font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
814 - color: var(--check-label-color)<?php echo esc_html( $important ); ?>;
815 - font-weight: var(--check-weight)<?php echo esc_html( $important ); ?>;
845 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
846 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
847 + color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
848 + color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
849 + font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
850 + font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
816 851 line-height: 1.3;
817 852 }
818 853
819 854 .with_frm_style .frm_radio input[type=radio],
820 855 .with_frm_style .frm_checkbox input[type=checkbox] {
821 - font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
822 - position: static<?php echo esc_html( $important ); ?>;
856 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
857 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
858 + position:static<?php echo esc_html( $important ); ?>;
823 859 }
824 860
825 861 .frm_file_container .frm_file_link,
826 862 .with_frm_style .frm_radio label .frm_file_container,
@@ -829,104 +865,60 @@
829 865 margin:5px;
830 866 vertical-align:middle;
831 867 }
832 868
833 -.with_frm_style .frm_radio input[type=radio]
834 -<?php if ( $pro_is_installed ) : ?>
835 -, .with_frm_style .frm_scale input[type=radio]
836 -<?php endif; ?>
837 -{
869 +.with_frm_style .frm_radio input[type=radio]{
838 870 border-radius:50%;
839 871 }
840 872
841 -.with_frm_style .frm_checkbox input[type=checkbox] {
842 - border-radius: calc(var(--border-radius) / 2) !important;
873 +.with_frm_style .frm_checkbox input[type=checkbox]{
874 + border-radius:0;
843 875 }
844 876
845 877 .with_frm_style .frm_radio input[type=radio],
846 -<?php if ( $pro_is_installed ) : ?>
847 -.with_frm_style .frm_scale input[type=radio],
848 -<?php endif; ?>
849 878 .with_frm_style .frm_checkbox input[type=checkbox]{
879 + -webkit-appearance: none;
850 880 appearance: none;
851 881 background-color: var(--bg-color);
852 882 flex: none;
853 883 display:inline-block !important;
854 - width: 16px !important;
855 - min-width: 16px !important;
856 - height: 16px !important;
884 + margin: 0 5px 0 0;
857 885 color: var(--border-color);
886 + width: 18px;
887 + min-width: 18px;
888 + height: 18px;
858 889 border: 1px solid currentColor;
859 890 border-color: var(--border-color);
860 891 vertical-align: middle;
861 892 position: initial; /* override Bootstrap */
862 893 padding: 0;
863 - margin: 0;
864 894 }
865 895
866 -.frm_forms.with_frm_style .frm_fields_container .frm_radio input[type=radio]:not([disabled]):checked,
867 -<?php if ( $pro_is_installed ) : ?>
868 -.frm_forms.with_frm_style .frm_fields_container .frm_scale input[type=radio]:not([disabled]):checked,
869 -<?php endif; ?>
870 -.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
871 - border-color: var(--border-color-active) !important;
896 +.with_frm_style .frm_radio input[type=radio]:before,
897 +.with_frm_style .frm_checkbox input[type=checkbox]:before {
898 + content: '';
899 + width: 12px;
900 + height: 12px;
901 + border-radius: 50%;
902 + transform: scale(0);
903 + transition: 120ms transform ease-in-out;
904 + box-shadow: inset 10px 10px var(--text-color);
905 + display: block;
906 + margin: 2px 0 0 2px;
872 907 }
873 908
874 -.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
875 - background-color: var(--border-color-active) !important;
909 +.with_frm_style .frm_checkbox input[type=checkbox]:before{
910 + clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
911 + border-radius: 0;
876 912 }
877 913
878 -.with_frm_style .frm_radio input[type=radio][disabled]:checked,
879 -<?php if ( $pro_is_installed ) : ?>
880 -.with_frm_style .frm_scale input[type=radio][disabled]:checked,
881 -<?php endif; ?>
882 -.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
883 - border-color: var(--border-color) !important; /* Override Style Preview */
884 -}
885 -
886 -.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
887 - background-color: var(--border-color) !important;
888 -}
889 -
890 914 .with_frm_style .frm_radio input[type=radio]:checked:before,
891 -<?php if ( $pro_is_installed ) { ?>
892 -.with_frm_style .frm_scale input[type=radio]:checked:before,
893 -<?php } ?>
894 915 .with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
895 - position: static !important; /* Override Style Preview */
896 - content: '';
897 - display: block;
916 + transform: scale(1);
898 917 }
899 918
900 -.frm_forms.with_frm_style .frm_checkbox input[type=checkbox]:before {
901 - width: 100% !important;
902 - height: 100% !important;
903 - background-image: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6667 1.5L4.25001 7.91667L1.33334 5' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") !important;
904 - background-size: 9px !important;
905 - background-repeat: no-repeat !important;
906 - background-position: center !important;
907 - margin: 0;
908 -}
909 -
910 -<?php if ( $pro_is_installed ) { ?>
911 -.with_frm_style .frm_scale input[type=radio]:before,
912 -<?php } ?>
913 -.with_frm_style .frm_radio input[type=radio]:before {
914 - width: 8px;
915 - height: 8px;
916 - border-radius: 50%;
917 - background-color: var(--border-color-active);
918 - margin: 3px;
919 -}
920 -
921 -<?php if ( $pro_is_installed ) { ?>
922 -.with_frm_style .frm_scale input[type=radio][disabled]:before,
923 -<?php } ?>
924 -.with_frm_style .frm_radio input[type=radio][disabled]:before {
925 - background-color: var(--border-color);
926 -}
927 -
928 919 .with_frm_style :invalid,
920 +.with_frm_style :-moz-submit-invalid,
929 921 .with_frm_style :-moz-ui-invalid{
930 922 box-shadow:none;
931 923 }
932 924
@@ -942,29 +934,33 @@
942 934
943 935 .with_frm_style .frm_error_style,
944 936 .with_frm_style .frm_message,
945 937 .frm_success_style{
938 + -moz-border-radius:4px;
939 + -webkit-border-radius:4px;
946 940 border-radius:4px;
947 941 padding:15px;
948 942 }
949 943
950 -.with_frm_style .frm_message p {
951 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
952 - margin-bottom: 0;
944 +.with_frm_style .frm_message p{
945 + margin-bottom:5px;
946 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
947 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
953 948 }
954 949
955 -.with_frm_style .frm_message > p:first-of-type {
956 - margin-top: 0;
957 -}
958 -
959 950 .with_frm_style .frm_message,
960 -.frm_success_style {
961 - margin: 5px 0 15px;
962 - border: 1px solid var(--success-border-color);
963 - background-color: var(--success-bg-color);
964 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
965 - border-radius: var(--border-radius);
966 - font-size: var(--success-font-size)<?php echo esc_html( $important ); ?>;
951 +.frm_success_style{
952 + margin:5px 0 15px;
953 + border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
954 + border-color:var(--success-border-color);
955 + background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
956 + background-color:var(--success-bg-color);
957 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
958 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
959 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
960 + border-radius:var(--border-radius);
961 + font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
962 + font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
967 963 }
968 964
969 965 .with_frm_style .frm_plain_success .frm_message {
970 966 background-color: transparent;
@@ -1000,9 +996,10 @@
1000 996 padding:5px;
1001 997 border-width:1px;
1002 998 border-style:solid;
1003 999 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1004 - border-color: var(--border-color);
1000 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1001 + border-color:var(--border-color);
1005 1002 <?php } ?>
1006 1003 border-top:none;
1007 1004 border-left:none;
1008 1005 border-right:none;
@@ -1017,9 +1014,10 @@
1017 1014 }
1018 1015
1019 1016 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1020 1017 .with_frm_style .frm-alt-table{
1021 - border-color: var(--border-color);
1018 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1019 + border-color:var(--border-color);
1022 1020 }
1023 1021 <?php } ?>
1024 1022
1025 1023 .frm-alt-table th {
@@ -1043,11 +1041,11 @@
1043 1041 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1044 1042 }
1045 1043
1046 1044 table.form_results.with_frm_style{
1047 - border-style: solid;
1048 - border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1049 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1045 + border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
1046 + border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1047 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1050 1048 }
1051 1049
1052 1050 table.form_results.with_frm_style tr td{
1053 1051 text-align:left;
@@ -1052,14 +1050,15 @@
1052 1050 table.form_results.with_frm_style tr td{
1053 1051 text-align:left;
1054 1052 padding:7px 9px;
1055 1053 <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1056 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
1054 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
1055 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
1057 1056 <?php } ?>
1058 1057 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1059 - border-top-style: solid;
1060 - border-top-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1061 - border-top-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1058 + border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
1059 + border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1060 + border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1062 1061 <?php } ?>
1063 1062 }
1064 1063
1065 1064 table.form_results.with_frm_style tr.frm_even,
@@ -1069,10 +1068,11 @@
1069 1068 }
1070 1069
1071 1070 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1072 1071 table.form_results.with_frm_style tr.frm_odd,
1073 -.frm-grid .frm_odd {
1074 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
1072 +.frm-grid .frm_odd{
1073 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1074 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1075 1075 }
1076 1076 <?php } ?>
1077 1077
1078 1078 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1154,25 +1154,26 @@
1154 1154 animation:2s linear 0s normal none infinite progress-bar-stripes;
1155 1155 }
1156 1156
1157 1157 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1158 -#frm_loading .progress-striped .progress-bar {
1158 +#frm_loading .progress-striped .progress-bar{
1159 1159 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1160 - background-image: linear-gradient(45deg, var(--border-color) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, var(--border-color) 50%, var(--border-color) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
1160 + background-image:linear-gradient(45deg, <?php echo esc_html( $defaults['border_color'] ); ?> 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, <?php echo esc_html( $defaults['border_color'] ); ?> 50%, <?php echo esc_html( $defaults['border_color'] ); ?> 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
1161 1161 <?php } ?>
1162 1162 background-size:40px 40px;
1163 1163 }
1164 1164 <?php } ?>
1165 1165
1166 -#frm_loading .progress-bar {
1167 - background-color: var(--bg-color);
1168 - box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1169 - float: left;
1170 - height: 100%;
1171 - line-height: 20px;
1172 - text-align: center;
1173 - transition: width 0.6s ease 0s;
1174 - width: 100%;
1166 +#frm_loading .progress-bar{
1167 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1168 + background-color:var(--bg-color);
1169 + box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1170 + float:left;
1171 + height:100%;
1172 + line-height:20px;
1173 + text-align:center;
1174 + transition:width 0.6s ease 0s;
1175 + width:100%;
1175 1176 }
1176 1177
1177 1178 .frm_image_from_url{
1178 1179 height:50px;
@@ -1189,9 +1190,9 @@
1189 1190 background-repeat: no-repeat;
1190 1191 color: transparent !important;
1191 1192 }
1192 1193
1193 -<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1194 +<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1194 1195
1195 1196 .frm_conf_field.frm_left_container .frm_primary_label{
1196 1197 display:none;
1197 1198 }
@@ -1198,8 +1199,10 @@
1198 1199
1199 1200 .wp-editor-wrap *,
1200 1201 .wp-editor-wrap *:after,
1201 1202 .wp-editor-wrap *:before{
1203 + -webkit-box-sizing:content-box;
1204 + -moz-box-sizing:content-box;
1202 1205 box-sizing:content-box;
1203 1206 }
1204 1207
1205 1208 .with_frm_style .frm_grid,
@@ -1210,9 +1213,10 @@
1210 1213 padding:5px;
1211 1214 border-width:1px;
1212 1215 border-style:solid;
1213 1216 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1214 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1217 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1218 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1215 1219 <?php } ?>
1216 1220 border-left:none;
1217 1221 border-right:none;
1218 1222 }
@@ -1247,16 +1251,18 @@
1247 1251 }
1248 1252
1249 1253 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1250 1254 .frm_grid_first,
1251 -.frm_grid_odd {
1252 - background-color: var(--bg-color);
1255 +.frm_grid_odd{
1256 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1257 + background-color:var(--bg-color);
1253 1258 }
1254 1259 <?php } ?>
1255 1260
1256 1261 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1257 -.frm_grid {
1258 - background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1262 +.frm_grid{
1263 + background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1264 + background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1259 1265 }
1260 1266 <?php } ?>
1261 1267
1262 1268 .with_frm_style .frm_grid.frm_blank_field,
@@ -1261,10 +1267,12 @@
1261 1267
1262 1268 .with_frm_style .frm_grid.frm_blank_field,
1263 1269 .with_frm_style .frm_grid_first.frm_blank_field,
1264 1270 .with_frm_style .frm_grid_odd.frm_blank_field{
1271 + background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1265 1272 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1266 - border-color: var(--error-border);
1273 + border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1274 + border-color:var(--error-bg);
1267 1275 }
1268 1276
1269 1277 .frm_grid .frm_primary_label,
1270 1278 .frm_grid_first .frm_primary_label,
@@ -1286,10 +1294,9 @@
1286 1294 .frm_grid_odd .frm_radio label,
1287 1295 .frm_grid_first .frm_checkbox label,
1288 1296 .frm_grid .frm_checkbox label,
1289 1297 .frm_grid_odd .frm_checkbox label{
1290 - color:transparent;
1291 - text-indent: -9999px;
1298 + visibility:hidden;
1292 1299 white-space:nowrap;
1293 1300 text-align:left;
1294 1301 }
1295 1302
@@ -1415,18 +1422,8 @@
1415 1422 .frm_form_field.frm_left_container .frm_opt_container{
1416 1423 padding-top:4px;
1417 1424 }
1418 1425
1419 -.with_frm_style .frm_left_container > select.auto_width,
1420 -.with_frm_style .frm_right_container > select.auto_width {
1421 - width: max-content<?php echo esc_html( $important ); ?>;
1422 -}
1423 -
1424 -.with_frm_style .frm_right_container > .frm_primary_label,
1425 -.with_frm_style .frm_right_container > select.auto_width {
1426 - margin-left: auto<?php echo esc_html( $important ); ?>;
1427 -}
1428 -
1429 1426 .with_frm_style .frm_inline_container.frm_grid_first .frm_primary_label,
1430 1427 .with_frm_style .frm_inline_container.frm_grid .frm_primary_label,
1431 1428 .with_frm_style .frm_inline_container.frm_grid_odd .frm_primary_label,
1432 1429 .with_frm_style .frm_inline_container.frm_grid_first .frm_opt_container,
@@ -1461,9 +1458,11 @@
1461 1458 grid-column-end: span 1;
1462 1459 }
1463 1460
1464 1461 .frm_form_field .frm_checkbox,
1465 -.frm_form_field .frm_radio {
1462 +.frm_form_field .frm_checkbox + .frm_checkbox,
1463 +.frm_form_field .frm_radio,
1464 +.frm_form_field .frm_radio + .frm_radio{
1466 1465 margin-top: 0;
1467 1466 margin-bottom: 0;
1468 1467 }
1469 1468
@@ -1472,24 +1471,36 @@
1472 1471 overflow:auto;
1473 1472 }
1474 1473
1475 1474 .frm_html_container.frm_scroll_box,
1476 -.frm_form_field.frm_html_scroll_box {
1477 - height: 100px;
1478 - overflow: auto;
1479 - background-color: var(--bg-color);
1480 - border-color: var(--border-color);
1481 - border-width: var(--field-border-width);
1482 - border-style: var(--field-border-style);
1483 - border-radius: var(--border-radius);
1484 - width: var(--field-width);
1485 - max-width: 100%;
1486 - font-size: var(--field-font-size);
1487 - padding: var(--field-pad);
1488 - box-sizing: border-box;
1489 - outline: none<?php echo esc_html( $important ); ?>;
1490 - font-weight: normal;
1491 - box-shadow: var(--box-shadow);
1475 +.frm_form_field.frm_html_scroll_box{
1476 + height:100px;
1477 + overflow:auto;
1478 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1479 + background-color:var(--bg-color);
1480 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1481 + border-color:var(--border-color);
1482 + border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1483 + border-width:var(--field-border-width);
1484 + border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1485 + border-style:var(--field-border-style);
1486 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1487 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1488 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1489 + border-radius:var(--border-radius);
1490 + width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1491 + width:var(--field-width);
1492 + max-width:100%;
1493 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1494 + font-size:var(--field-font-size);
1495 + padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1496 + padding:var(--field-pad);
1497 + -webkit-box-sizing:border-box;
1498 + -moz-box-sizing:border-box;
1499 + box-sizing:border-box;
1500 + outline:none<?php echo esc_html( $important ); ?>;
1501 + font-weight:normal;
1502 + box-shadow:var(--box-shadow);
1492 1503 }
1493 1504
1494 1505 .frm_form_field.frm_total_big input,
1495 1506 .frm_form_field.frm_total_big textarea,
@@ -1498,8 +1509,10 @@
1498 1509 opacity:1;
1499 1510 background-color:transparent !important;
1500 1511 border:none !important;
1501 1512 font-weight:bold;
1513 + -moz-box-shadow:none;
1514 + -webkit-box-shadow:none;
1502 1515 width:auto !important;
1503 1516 height:auto !important;
1504 1517 box-shadow:none !important;
1505 1518 display:inline;
@@ -1519,8 +1532,10 @@
1519 1532 .frm_form_field.frm_total input:focus,
1520 1533 .frm_form_field.frm_total textarea:focus{
1521 1534 background-color:transparent;
1522 1535 border:none;
1536 + -moz-box-shadow:none;
1537 + -webkit-box-shadow:none;
1523 1538 box-shadow:none;
1524 1539 }
1525 1540
1526 1541 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1545,8 +1560,13 @@
1545 1560 .frm_clearfix{
1546 1561 display:block;
1547 1562 }
1548 1563
1564 +.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1565 + color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1566 + color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1567 +}
1568 +
1549 1569 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1550 1570 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1551 1571 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1572 margin-bottom: 0 !important;
@@ -1551,15 +1571,15 @@
1551 1571 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1572 margin-bottom: 0 !important;
1553 1573 }
1554 1574
1575 +<?php
1576 +FrmStylesHelper::maybe_include_font_icon_css();
1555 1577
1556 -<?php
1557 1578 /**
1558 1579 * Call action so other plugins can add additional CSS.
1559 1580 *
1560 1581 * @param array $args {
1561 - *
1562 1582 * @type array $defaults
1563 1583 * }
1564 1584 */
1565 1585 do_action( 'frm_include_front_css', compact( 'defaults' ) );
@@ -1609,8 +1629,9 @@
1609 1629 max-width:302px;
1610 1630 border-right:1px solid #d3d3d3;
1611 1631 border-radius:4px;
1612 1632 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1633 + -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1613 1634 }
1614 1635
1615 1636 .with_frm_style .g-recaptcha iframe,
1616 1637 .with_frm_style .frm-g-recaptcha iframe{
@@ -1615,15 +1636,8 @@
1615 1636 .with_frm_style .g-recaptcha iframe,
1616 1637 .with_frm_style .frm-g-recaptcha iframe{
1617 1638 width:100%;
1618 1639 }
1619 -}
1620 -
1621 -.frm-card-element .sq-card-wrapper .sq-card-message {
1622 - margin-bottom: 0;
1623 -}
1624 -.frm-card-errors:empty {
1625 - margin: 0;
1626 1640 }
1627 1641 <?php
1628 1642
1629 1643 echo strip_tags( FrmStylesController::get_custom_css() ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped