PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.8.1
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.8.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
← All changes | css/custom_theme.css.php +347 -279 6.266.8.1 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,36 @@
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 .<?php echo esc_html( FrmHoneypot::generate_class_name() ); ?> {
73 + overflow: hidden;
74 + width: 0;
75 + height: 0;
76 + position: absolute;
77 +}
78 +
69 79 .with_frm_style fieldset{
70 80 min-width:0;
71 81 display: block; /* Override 2021 theme */
72 82 }
@@ -79,20 +89,24 @@
79 89 }
80 90
81 91 .with_frm_style .frm_form_fields > fieldset{
82 92 <?php if ( isset( $defaults['fieldset'] ) && ( $defaults['fieldset'] || '0' === $defaults['fieldset'] ) ) { ?>
83 - border-width: var(--fieldset)<?php echo esc_html( $important ); ?>;
93 + border-width:<?php echo esc_html( $defaults['fieldset'] . $important ); ?>;
94 + border-width:var(--fieldset)<?php echo esc_html( $important ); ?>;
84 95 <?php } ?>
85 96 border-style:solid;
86 97 <?php if ( ! empty( $defaults['fieldset_color'] ) ) { ?>
87 - border-color: var(--fieldset-color)<?php echo esc_html( $important ); ?>;
98 + border-color:<?php echo esc_html( $defaults['fieldset_color'] . $important ); ?>;
99 + border-color:var(--fieldset-color)<?php echo esc_html( $important ); ?>;
88 100 <?php } ?>
89 101 margin:0;
90 102 <?php if ( ! empty( $defaults['fieldset_padding'] ) ) { ?>
91 - padding: var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
103 + padding:<?php echo esc_html( $defaults['fieldset_padding'] . $important ); ?>;
104 + padding:var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
92 105 <?php } ?>
93 106 <?php if ( ! empty( $defaults['fieldset_bg_color'] ) ) { ?>
94 - background-color: var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
107 + background-color:<?php echo esc_html( $defaults['fieldset_bg_color'] ); ?>;
108 + background-color:var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
95 109 <?php } ?>
96 110 <?php if ( ! empty( $defaults['font'] ) ) { ?>
97 111 font-family:var(--font);
98 112 <?php } ?>
@@ -116,21 +130,26 @@
116 130
117 131 .with_frm_style legend + h3,
118 132 .with_frm_style h3.frm_form_title{
119 133 <?php if ( ! empty( $defaults['title_size'] ) ) { ?>
120 - font-size: var(--title-size)<?php echo esc_html( $important ); ?>;
134 + font-size:<?php echo esc_html( $defaults['title_size'] . $important ); ?>;
135 + font-size:var(--title-size)<?php echo esc_html( $important ); ?>;
121 136 <?php } ?>
122 137 <?php if ( ! empty( $defaults['title_color'] ) ) { ?>
123 - color: var(--title-color)<?php echo esc_html( $important ); ?>;
138 + color:<?php echo esc_html( $defaults['title_color'] . $important ); ?>;
139 + color:var(--title-color)<?php echo esc_html( $important ); ?>;
124 140 <?php } ?>
125 141 <?php if ( ! empty( $defaults['font'] ) ) { ?>
126 - font-family: var(--font);
142 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
143 + font-family:var(--font);
127 144 <?php } ?>
128 145 <?php if ( ! empty( $defaults['title_margin_top'] ) ) { ?>
129 - margin-top: var(--title-margin-top)<?php echo esc_html( $important ); ?>;
146 + margin-top:<?php echo esc_html( $defaults['title_margin_top'] . $important ); ?>;
147 + margin-top:var(--title-margin-top)<?php echo esc_html( $important ); ?>;
130 148 <?php } ?>
131 149 <?php if ( ! empty( $defaults['title_margin_bottom'] ) ) { ?>
132 - margin-bottom: var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
150 + margin-bottom:<?php echo esc_html( $defaults['title_margin_bottom'] . $important ); ?>;
151 + margin-bottom:var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
133 152 <?php } ?>
134 153 }
135 154
136 155 .with_frm_style .frm_form_field.frm_html_container,
@@ -135,42 +154,46 @@
135 154
136 155 .with_frm_style .frm_form_field.frm_html_container,
137 156 .with_frm_style .frm_form_field .frm_show_it{
138 157 <?php if ( ! empty( $defaults['font'] ) ) { ?>
139 - font-family: var(--font);
158 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
159 + font-family:var(--font);
140 160 <?php } ?>
141 161 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
142 - color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
162 + color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
163 + color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
143 164 <?php } ?>
144 165 }
145 166
146 167 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
147 168 .with_frm_style .frm_form_field.frm_html_container{
148 - font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
169 + font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
170 + font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
149 171 }
150 172 <?php } ?>
151 173
152 174 .with_frm_style .frm_form_field .frm_show_it{
153 175 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
154 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
176 + font-size:<?php echo esc_html( $defaults['field_font_size'] . $important ); ?>;
177 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
155 178 <?php } ?>
156 179 <?php if ( ! empty( $defaults['field_weight'] ) ) { ?>
157 - font-weight: var(--field-weight)<?php echo esc_html( $important ); ?>;
180 + font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
181 + font-weight:var(--field-weight)<?php echo esc_html( $important ); ?>;
158 182 <?php } ?>
159 183 }
160 184
161 -.with_frm_style .frm_required {
185 +.with_frm_style .frm_required{
162 186 <?php if ( ! empty( $defaults['required_color'] ) ) { ?>
163 - color: var(--required-color)<?php echo esc_html( $important ); ?>;
187 + color:<?php echo esc_html( $defaults['required_color'] . $important ); ?>;
188 + color:var(--required-color)<?php echo esc_html( $important ); ?>;
164 189 <?php } ?>
165 190 <?php if ( ! empty( $defaults['required_weight'] ) ) { ?>
166 - font-weight: var(--required-weight)<?php echo esc_html( $important ); ?>;
191 + font-weight:<?php echo esc_html( $defaults['required_weight'] . $important ); ?>;
192 + font-weight:var(--required-weight)<?php echo esc_html( $important ); ?>;
167 193 <?php } ?>
168 194 }
169 195
170 -<?php if ( $use_chosen_js ) { ?>
171 -.with_frm_style .chosen-container,
172 -<?php } ?>
173 196 .with_frm_style input[type=text],
174 197 .with_frm_style input[type=password],
175 198 .with_frm_style input[type=email],
176 199 .with_frm_style input[type=number],
@@ -178,12 +201,14 @@
178 201 .with_frm_style input[type=tel],
179 202 .with_frm_style input[type=search],
180 203 .with_frm_style select,
181 204 .with_frm_style textarea,
182 -.with_frm_style .frm-card-element.StripeElement {
205 +.with_frm_style .frm-card-element.StripeElement,
206 +.with_frm_style .chosen-container{
183 207 font-family:var(--font)<?php echo esc_html( $important ); ?>;
184 208 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
185 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
209 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
210 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
186 211 <?php } ?>
187 212 margin-bottom:0<?php echo esc_html( $important ); ?>;
188 213 }
189 214
@@ -206,33 +231,42 @@
206 231 .with_frm_style .frm_scroll_box .frm_opt_container,
207 232 .frm_form_fields_active_style,
208 233 .frm_form_fields_error_style,
209 234 .with_frm_style .frm-card-element.StripeElement,
210 -<?php if ( $use_chosen_js ) { ?>
211 235 .with_frm_style .chosen-container-multi .chosen-choices,
212 236 .with_frm_style .chosen-container-single .chosen-single,
213 -<?php } ?>
214 237 .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);
238 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
239 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
240 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
241 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
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 } ?>
268 +<?php if ( ! empty( $important ) ) { ?>
235 269 .with_frm_style input[type=text],
236 270 .with_frm_style input[type=password],
237 271 .with_frm_style input[type=email],
238 272 .with_frm_style input[type=number],
@@ -244,25 +278,30 @@
244 278 .frm_form_fields_style,
245 279 .with_frm_style .frm_scroll_box .frm_opt_container,
246 280 .frm_form_fields_active_style,
247 281 .frm_form_fields_error_style,
248 -.with_frm_style .frm-card-element.StripeElement {
282 +.with_frm_style .frm-card-element.StripeElement,
283 +.with_frm_style .chosen-container-multi .chosen-choices,
284 +.with_frm_style .chosen-container-single .chosen-single{
249 285 background-image:none !important;
250 286 }
251 -<?php endif; ?>
287 +<?php } ?>
252 288
253 289 .with_frm_style select option {
254 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
290 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
291 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
255 292 }
256 293
257 294 .with_frm_style select option.frm-select-placeholder {
258 - color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
295 + color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
296 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
259 297 }
260 298
261 299 .with_frm_style input[type=radio],
262 300 .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 ); ?>;
301 + border-color:<?php echo esc_html( $defaults['border_color'] . $important ); ?>;
302 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
303 + box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
265 304 float: none;
266 305 }
267 306
268 307 .with_frm_style input[type=radio]:after,
@@ -269,18 +308,8 @@
269 308 .with_frm_style input[type=checkbox]:after {
270 309 display: none; /* 2021 conflict */
271 310 }
272 311
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 312 .with_frm_style input[type=text],
284 313 .with_frm_style input[type=password],
285 314 .with_frm_style input[type=email],
286 315 .with_frm_style input[type=number],
@@ -289,9 +318,10 @@
289 318 .with_frm_style input[type=file],
290 319 .with_frm_style input[type=search],
291 320 .with_frm_style select,
292 321 .with_frm_style .frm-card-element.StripeElement{
293 - min-height: var(--field-height)<?php echo esc_html( $important ); ?>;
322 + min-height:<?php echo esc_html( $defaults['field_height'] ); ?>;
323 + min-height:var(--field-height)<?php echo esc_html( $important ); ?>;
294 324 line-height:1.3<?php echo esc_html( $important ); ?>;
295 325 }
296 326
297 327 .with_frm_style select[multiple=multiple]{
@@ -306,15 +336,17 @@
306 336 box-shadow:none;
307 337 }
308 338
309 339 .with_frm_style input[type=file]{
310 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
311 - padding: 0px;
340 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
341 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
342 + padding:0px;
312 343 <?php if ( ! empty( $defaults['font'] ) ) { ?>
313 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
344 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
314 345 <?php } ?>
315 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
316 - display: initial;
346 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
347 + font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
348 + display:initial;
317 349 }
318 350
319 351 .with_frm_style input[type=file].frm_transparent{
320 352 color:transparent<?php echo esc_html( $important ); ?>;
@@ -320,9 +352,10 @@
320 352 color:transparent<?php echo esc_html( $important ); ?>;
321 353 }
322 354
323 355 .with_frm_style .wp-editor-wrap{
324 - width: var(--field-width)<?php echo esc_html( $important ); ?>;
356 + width:<?php echo esc_html( $defaults['field_width'] . $important ); ?>;
357 + width:var(--field-width)<?php echo esc_html( $important ); ?>;
325 358 max-width:100%;
326 359 }
327 360
328 361 .with_frm_style .wp-editor-container textarea{
@@ -330,13 +363,15 @@
330 363 box-shadow:none !important;
331 364 }
332 365
333 366 .with_frm_style .mceIframeContainer{
334 - background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
367 + background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
368 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
335 369 }
336 370
337 371 .with_frm_style select{
338 - width: var(--auto-width)<?php echo esc_html( $important ); ?>;
372 + width:<?php echo esc_html( $defaults['auto_width'] ); ?>;
373 + width:var(--auto-width)<?php echo esc_html( $important ); ?>;
339 374 max-width:100%;
340 375 background-position-y: calc(50% + 3px);
341 376 }
342 377
@@ -344,12 +379,15 @@
344 379 .with_frm_style select[disabled],
345 380 .with_frm_style textarea[disabled],
346 381 .with_frm_style input[readonly],
347 382 .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 ); ?>;
383 +.with_frm_style textarea[readonly]{
384 + background-color:<?php echo esc_html( $defaults['bg_color_disabled'] ); ?>;
385 + background-color:var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
386 + color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
387 + color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
388 + border-color:<?php echo esc_html( $defaults['border_color_disabled'] ); ?>;
389 + border-color:var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
352 390 }
353 391
354 392 .frm_preview_page:before{
355 393 content:normal !important;
@@ -361,24 +399,30 @@
361 399
362 400 .with_frm_style .frm_primary_label{
363 401 max-width:100%;
364 402 <?php if ( ! empty( $defaults['font'] ) ) { ?>
365 - font-family: var(--font);
403 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
404 + font-family:var(--font);
366 405 <?php } ?>
367 406 <?php if ( ! empty( $defaults['font_size'] ) ) { ?>
368 - font-size: var(--font-size)<?php echo esc_html( $important ); ?>;
407 + font-size:<?php echo esc_html( $defaults['font_size'] . $important ); ?>;
408 + font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
369 409 <?php } ?>
370 410 <?php if ( ! empty( $defaults['label_color'] ) ) { ?>
371 - color: var(--label-color)<?php echo esc_html( $important ); ?>;
411 + color:<?php echo esc_html( $defaults['label_color'] . $important ); ?>;
412 + color:var(--label-color)<?php echo esc_html( $important ); ?>;
372 413 <?php } ?>
373 414 <?php if ( ! empty( $defaults['weight'] ) ) { ?>
374 - font-weight: var(--weight)<?php echo esc_html( $important ); ?>;
415 + font-weight:<?php echo esc_html( $defaults['weight'] . $important ); ?>;
416 + font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
375 417 <?php } ?>
376 418 <?php if ( ! empty( $defaults['align'] ) ) { ?>
377 - text-align: var(--align)<?php echo esc_html( $important ); ?>;
419 + text-align:<?php echo esc_html( $defaults['align'] . $important ); ?>;
420 + text-align:var(--align)<?php echo esc_html( $important ); ?>;
378 421 <?php } ?>
379 422 <?php if ( ! empty( $defaults['label_padding'] ) ) { ?>
380 - padding: var(--label-padding)<?php echo esc_html( $important ); ?>;
423 + padding:<?php echo esc_html( $defaults['label_padding'] . $important ); ?>;
424 + padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
381 425 <?php } ?>
382 426 margin:0;
383 427 width:auto;
384 428 display:block;
@@ -431,9 +475,9 @@
431 475
432 476 /* Floating labels */
433 477 .with_frm_style .frm_inside_container {
434 478 position: relative;
435 - padding-top: 18px;
479 + padding-top: 16px;
436 480 padding-top: calc(0.5 * var(--field-height));
437 481 }
438 482
439 483 .with_frm_style .frm_inside_container > input,
@@ -441,13 +485,21 @@
441 485 .with_frm_style .frm_inside_container > textarea {
442 486 display: block;
443 487 }
444 488
445 -.with_frm_style input::placeholder,
446 -.with_frm_style textarea::placeholder {
447 - font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
489 +/* These do not work if they are combined */
490 +.with_frm_style .frm_inside_container > input::-moz-placeholder,
491 +.with_frm_style .frm_inside_container > textarea::-moz-placeholder {
492 + opacity: 0 !important;
493 + transition: opacity 0.3s ease-in;
448 494 }
449 495
496 +.with_frm_style .frm_inside_container > input:-ms-input-placeholder,
497 +.with_frm_style .frm_inside_container > textarea:-ms-input-placeholder {
498 + opacity: 0;
499 + transition: opacity 0.3s ease-in;
500 +}
501 +
450 502 .with_frm_style .frm_inside_container > input::placeholder,
451 503 .with_frm_style .frm_inside_container > textarea::placeholder {
452 504 opacity: 0;
453 505 transition: opacity 0.3s ease-in;
@@ -456,9 +508,9 @@
456 508 .with_frm_style .frm_inside_container > label {
457 509 transition: all 0.3s ease-in;
458 510
459 511 position: absolute;
460 - top: 19px;
512 + top: 17px;
461 513 top: calc(1px + .5 * var(--field-height));
462 514 left: 3px;
463 515 width: 100%;
464 516
@@ -466,9 +518,9 @@
466 518 text-overflow: ellipsis;
467 519 overflow: hidden;
468 520 white-space: nowrap;
469 521
470 - padding: 8px 12px;
522 + padding: 6px 10px;
471 523 padding: var(--field-pad);
472 524
473 525 font-size: 14px;
474 526 font-size: var(--field-font-size);
@@ -474,8 +526,9 @@
474 526 font-size: var(--field-font-size);
475 527 font-weight: normal;
476 528 font-weight: var(--field-weight);
477 529
530 + -ms-pointer-events: none;
478 531 pointer-events: none;
479 532 }
480 533
481 534 .with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
@@ -489,8 +542,21 @@
489 542 font-size: 12px;
490 543 font-size: calc(0.85 * var(--field-font-size));
491 544 }
492 545
546 +/* These do not work if they are combined */
547 +.with_frm_style .frm_inside_container.frm_label_float_top > input::-moz-placeholder,
548 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea::-moz-placeholder {
549 + opacity: 1 !important;
550 + transition: opacity 0.3s ease-in;
551 +}
552 +
553 +.with_frm_style .frm_inside_container.frm_label_float_top > input:-ms-input-placeholder,
554 +.with_frm_style .frm_inside_container.frm_label_float_top > textarea:-ms-input-placeholder {
555 + opacity: 1;
556 + transition: opacity 0.3s ease-in;
557 +}
558 +
493 559 .with_frm_style .frm_inside_container.frm_label_float_top > input::placeholder,
494 560 .with_frm_style .frm_inside_container.frm_label_float_top > textarea::placeholder {
495 561 opacity: 1;
496 562 transition: opacity 0.3s ease-in;
@@ -542,43 +608,54 @@
542 608 white-space:nowrap;
543 609 }
544 610
545 611 .with_frm_style .frm_button{
546 - text-decoration:none !important;
612 + text-decoration:none !important;;
547 613 border:1px solid #eee;
548 614 display:inline-block;
549 615 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
550 - padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
616 + padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
617 + padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
551 618 <?php } else { ?>
552 619 padding:5px;
553 620 <?php } ?>
554 621 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
622 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
623 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
555 624 border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
556 625 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
557 626 <?php } ?>
558 627 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
559 - font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
628 + font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
629 + font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
560 630 <?php } ?>
561 631 <?php if ( ! empty( $defaults['font'] ) ) { ?>
562 - font-family: var(--font)<?php echo esc_html( $important ); ?>;
632 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
633 + font-family:var(--font)<?php echo esc_html( $important ); ?>;
563 634 <?php } ?>
564 635 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
565 - font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
636 + font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
637 + font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
566 638 <?php } ?>
567 639 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
568 - color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
640 + color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
641 + color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
569 642 <?php } ?>
570 643 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
571 - background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
644 + background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
645 + background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
572 646 <?php } ?>
573 647 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
574 - border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
648 + border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
649 + border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
575 650 <?php } ?>
576 651 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
577 - border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
652 + border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
653 + border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
578 654 <?php } ?>
579 655 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
580 - height: var(--submit-height)<?php echo esc_html( $important ); ?>;
656 + height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
657 + height:var(--submit-height)<?php echo esc_html( $important ); ?>;
581 658 <?php } ?>
582 659 }
583 660
584 661 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -660,8 +737,9 @@
660 737
661 738 .with_frm_style .frm_loading_prev .frm_prev_page,
662 739 .with_frm_style .frm_loading_form .frm_button_submit {
663 740 position: relative;
741 + opacity: .8;
664 742 color: transparent !important;
665 743 text-shadow: none !important;
666 744 }
667 745
@@ -687,9 +765,9 @@
687 765 border-top-color: transparent;
688 766 border-left-color: transparent;
689 767 border-radius: 50%;
690 768 box-sizing: border-box;
691 - <?php $loader_size = 12; ?>
769 + <?php $loader_size = 20; ?>
692 770 top: 50%;
693 771 left: 50%;
694 772 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 773 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -694,9 +772,12 @@
694 772 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
695 773 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
696 774 width: <?php echo absint( $loader_size ); ?>px;
697 775 height: <?php echo absint( $loader_size ); ?>px;
698 - animation: spin 2s linear infinite;
776 + -webkit-animation: spin 2s linear infinite;
777 + -moz-animation: spin 2s linear infinite;
778 + -o-animation: spin 2s linear infinite;
779 + animation: spin 2s linear infinite;
699 780 }
700 781
701 782 .with_frm_style .frm_submit.frm_flex {
702 783 align-items: center;
@@ -708,9 +789,9 @@
708 789 }
709 790
710 791 <?php
711 792 foreach ( $styles as $style ) {
712 - include __DIR__ . '/_single_theme.css.php';
793 + include( dirname( __FILE__ ) . '/_single_theme.css.php' );
713 794 unset( $style );
714 795 }
715 796
716 797 // Set it again since it may have been overridden.
@@ -732,12 +813,15 @@
732 813
733 814 .with_frm_style a.frm_save_draft,
734 815 .with_frm_style a.frm_start_over{
735 816 <?php if ( ! empty( $defaults['font'] ) ) { ?>
736 - font-family: var(--font);
817 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
818 + font-family:var(--font);
737 819 <?php } ?>
738 - font-size: var(--submit-font-size);
739 - font-weight: var(--submit-weight);
820 + font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
821 + font-size:var(--submit-font-size);
822 + font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
823 + font-weight:var(--submit-weight);
740 824 }
741 825
742 826 .horizontal_radio .frm_radio{
743 827 margin:0 5px 0 0;
@@ -744,9 +828,9 @@
744 828 }
745 829
746 830 .horizontal_radio .frm_checkbox{
747 831 margin:0;
748 - margin-right:12px;
832 + margin-right:5px;
749 833 }
750 834
751 835 .vertical_radio .frm_checkbox,
752 836 .vertical_radio .frm_radio,
@@ -761,13 +845,15 @@
761 845 padding-left: 0;
762 846 }
763 847
764 848 .with_frm_style .frm_radio{
765 - display: var(--radio-align)<?php echo esc_html( $important ); ?>;
849 + display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
850 + display:var(--radio-align)<?php echo esc_html( $important ); ?>;
766 851 }
767 852
768 853 .with_frm_style .frm_checkbox{
769 - display: var(--check-align)<?php echo esc_html( $important ); ?>;
854 + display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
855 + display:var(--check-align)<?php echo esc_html( $important ); ?>;
770 856 }
771 857
772 858 .with_frm_style .vertical_radio .frm_checkbox,
773 859 .with_frm_style .vertical_radio .frm_radio,
@@ -772,9 +858,8 @@
772 858 .with_frm_style .vertical_radio .frm_checkbox,
773 859 .with_frm_style .vertical_radio .frm_radio,
774 860 .vertical_radio .frm_catlevel_1{
775 861 display:block<?php echo esc_html( $important ); ?>;
776 - margin-bottom: 10px;
777 862 }
778 863
779 864 .with_frm_style .horizontal_radio .frm_checkbox,
780 865 .with_frm_style .horizontal_radio .frm_radio,
@@ -782,45 +867,40 @@
782 867 display:inline-block<?php echo esc_html( $important ); ?>;
783 868 }
784 869
785 870 .with_frm_style .frm_checkbox label,
786 -.with_frm_style .frm_radio label {
787 - display: inline-block;
788 - vertical-align: middle;
871 +.with_frm_style .frm_radio label{
872 + display: inline;
789 873 white-space:normal;
790 874 }
791 875
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 876 .with_frm_style .vertical_radio .frm_checkbox label,
803 877 .with_frm_style .vertical_radio .frm_radio label{
804 878 display: block;
805 - width: 100%;
879 + padding-left: 20px;
880 + text-indent: -20px;
806 881 }
807 882
808 883 .with_frm_style .frm_radio label,
809 -.with_frm_style .frm_checkbox label {
884 +.with_frm_style .frm_checkbox label{
810 885 <?php if ( ! empty( $defaults['font'] ) ) { ?>
811 - font-family: var(--font);
886 + font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
887 + font-family:var(--font);
812 888 <?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 ); ?>;
889 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
890 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
891 + color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
892 + color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
893 + font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
894 + font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
816 895 line-height: 1.3;
817 896 }
818 897
819 898 .with_frm_style .frm_radio input[type=radio],
820 899 .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 ); ?>;
900 + font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
901 + font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
902 + position:static<?php echo esc_html( $important ); ?>;
823 903 }
824 904
825 905 .frm_file_container .frm_file_link,
826 906 .with_frm_style .frm_radio label .frm_file_container,
@@ -830,9 +910,9 @@
830 910 vertical-align:middle;
831 911 }
832 912
833 913 .with_frm_style .frm_radio input[type=radio]
834 -<?php if ( $pro_is_installed ) : ?>
914 +<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
835 915 , .with_frm_style .frm_scale input[type=radio]
836 916 <?php endif; ?>
837 917 {
838 918 border-radius:50%;
@@ -837,96 +917,62 @@
837 917 {
838 918 border-radius:50%;
839 919 }
840 920
841 -.with_frm_style .frm_checkbox input[type=checkbox] {
842 - border-radius: calc(var(--border-radius) / 2) !important;
921 +.with_frm_style .frm_checkbox input[type=checkbox]{
922 + border-radius:0;
843 923 }
844 924
845 925 .with_frm_style .frm_radio input[type=radio],
846 -<?php if ( $pro_is_installed ) : ?>
926 +<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
847 927 .with_frm_style .frm_scale input[type=radio],
848 928 <?php endif; ?>
849 929 .with_frm_style .frm_checkbox input[type=checkbox]{
930 + -webkit-appearance: none;
850 931 appearance: none;
851 932 background-color: var(--bg-color);
852 933 flex: none;
853 934 display:inline-block !important;
854 - width: 16px !important;
855 - min-width: 16px !important;
856 - height: 16px !important;
935 + margin: 0 5px 0 0;
857 936 color: var(--border-color);
937 + width: 18px;
938 + min-width: 18px;
939 + height: 18px;
858 940 border: 1px solid currentColor;
859 941 border-color: var(--border-color);
860 942 vertical-align: middle;
861 943 position: initial; /* override Bootstrap */
862 944 padding: 0;
863 - margin: 0;
864 945 }
865 946
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,
947 +.with_frm_style .frm_radio input[type=radio]:before,
948 +<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
949 +.with_frm_style .frm_scale input[type=radio]:before,
869 950 <?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;
951 +.with_frm_style .frm_checkbox input[type=checkbox]:before {
952 + content: '';
953 + width: 12px;
954 + height: 12px;
955 + border-radius: 50%;
956 + transform: scale(0);
957 + transition: 120ms transform ease-in-out;
958 + box-shadow: inset 10px 10px var(--text-color);
959 + display: block;
960 + margin: 2px 0 0 2px;
872 961 }
873 962
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;
963 +.with_frm_style .frm_checkbox input[type=checkbox]:before{
964 + clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
965 + border-radius: 0;
876 966 }
877 967
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 968 .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 969 .with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
895 - position: static !important; /* Override Style Preview */
896 - content: '';
897 - display: block;
970 + transform: scale(1);
898 971 }
899 972
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 973 .with_frm_style :invalid,
974 +.with_frm_style :-moz-submit-invalid,
929 975 .with_frm_style :-moz-ui-invalid{
930 976 box-shadow:none;
931 977 }
932 978
@@ -942,29 +988,33 @@
942 988
943 989 .with_frm_style .frm_error_style,
944 990 .with_frm_style .frm_message,
945 991 .frm_success_style{
992 + -moz-border-radius:4px;
993 + -webkit-border-radius:4px;
946 994 border-radius:4px;
947 995 padding:15px;
948 996 }
949 997
950 -.with_frm_style .frm_message p {
951 - color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
952 - margin-bottom: 0;
998 +.with_frm_style .frm_message p{
999 + margin-bottom:5px;
1000 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
1001 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
953 1002 }
954 1003
955 -.with_frm_style .frm_message > p:first-of-type {
956 - margin-top: 0;
957 -}
958 -
959 1004 .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 ); ?>;
1005 +.frm_success_style{
1006 + margin:5px 0 15px;
1007 + border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
1008 + border-color:var(--success-border-color);
1009 + background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
1010 + background-color:var(--success-bg-color);
1011 + color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
1012 + color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
1013 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1014 + border-radius:var(--border-radius);
1015 + font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
1016 + font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
967 1017 }
968 1018
969 1019 .with_frm_style .frm_plain_success .frm_message {
970 1020 background-color: transparent;
@@ -1000,9 +1050,10 @@
1000 1050 padding:5px;
1001 1051 border-width:1px;
1002 1052 border-style:solid;
1003 1053 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1004 - border-color: var(--border-color);
1054 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1055 + border-color:var(--border-color);
1005 1056 <?php } ?>
1006 1057 border-top:none;
1007 1058 border-left:none;
1008 1059 border-right:none;
@@ -1017,9 +1068,10 @@
1017 1068 }
1018 1069
1019 1070 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1020 1071 .with_frm_style .frm-alt-table{
1021 - border-color: var(--border-color);
1072 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1073 + border-color:var(--border-color);
1022 1074 }
1023 1075 <?php } ?>
1024 1076
1025 1077 .frm-alt-table th {
@@ -1043,11 +1095,11 @@
1043 1095 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1044 1096 }
1045 1097
1046 1098 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 ); ?>;
1099 + border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
1100 + border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1101 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1050 1102 }
1051 1103
1052 1104 table.form_results.with_frm_style tr td{
1053 1105 text-align:left;
@@ -1052,14 +1104,15 @@
1052 1104 table.form_results.with_frm_style tr td{
1053 1105 text-align:left;
1054 1106 padding:7px 9px;
1055 1107 <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1056 - color: var(--text-color)<?php echo esc_html( $important ); ?>;
1108 + color:<?php echo esc_html( $defaults['text_color'] ); ?>;
1109 + color:var(--text-color)<?php echo esc_html( $important ); ?>;
1057 1110 <?php } ?>
1058 1111 <?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 ); ?>;
1112 + border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
1113 + border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1114 + border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1062 1115 <?php } ?>
1063 1116 }
1064 1117
1065 1118 table.form_results.with_frm_style tr.frm_even,
@@ -1069,10 +1122,11 @@
1069 1122 }
1070 1123
1071 1124 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1072 1125 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 ); ?>;
1126 +.frm-grid .frm_odd{
1127 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1128 + background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1075 1129 }
1076 1130 <?php } ?>
1077 1131
1078 1132 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1154,25 +1208,26 @@
1154 1208 animation:2s linear 0s normal none infinite progress-bar-stripes;
1155 1209 }
1156 1210
1157 1211 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1158 -#frm_loading .progress-striped .progress-bar {
1212 +#frm_loading .progress-striped .progress-bar{
1159 1213 <?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));
1214 + 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 1215 <?php } ?>
1162 1216 background-size:40px 40px;
1163 1217 }
1164 1218 <?php } ?>
1165 1219
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%;
1220 +#frm_loading .progress-bar{
1221 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1222 + background-color:var(--bg-color);
1223 + box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1224 + float:left;
1225 + height:100%;
1226 + line-height:20px;
1227 + text-align:center;
1228 + transition:width 0.6s ease 0s;
1229 + width:100%;
1175 1230 }
1176 1231
1177 1232 .frm_image_from_url{
1178 1233 height:50px;
@@ -1189,9 +1244,9 @@
1189 1244 background-repeat: no-repeat;
1190 1245 color: transparent !important;
1191 1246 }
1192 1247
1193 -<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1248 +<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1194 1249
1195 1250 .frm_conf_field.frm_left_container .frm_primary_label{
1196 1251 display:none;
1197 1252 }
@@ -1198,8 +1253,10 @@
1198 1253
1199 1254 .wp-editor-wrap *,
1200 1255 .wp-editor-wrap *:after,
1201 1256 .wp-editor-wrap *:before{
1257 + -webkit-box-sizing:content-box;
1258 + -moz-box-sizing:content-box;
1202 1259 box-sizing:content-box;
1203 1260 }
1204 1261
1205 1262 .with_frm_style .frm_grid,
@@ -1210,9 +1267,10 @@
1210 1267 padding:5px;
1211 1268 border-width:1px;
1212 1269 border-style:solid;
1213 1270 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1214 - border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1271 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1272 + border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1215 1273 <?php } ?>
1216 1274 border-left:none;
1217 1275 border-right:none;
1218 1276 }
@@ -1247,16 +1305,18 @@
1247 1305 }
1248 1306
1249 1307 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1250 1308 .frm_grid_first,
1251 -.frm_grid_odd {
1252 - background-color: var(--bg-color);
1309 +.frm_grid_odd{
1310 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1311 + background-color:var(--bg-color);
1253 1312 }
1254 1313 <?php } ?>
1255 1314
1256 1315 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1257 -.frm_grid {
1258 - background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1316 +.frm_grid{
1317 + background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1318 + background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1259 1319 }
1260 1320 <?php } ?>
1261 1321
1262 1322 .with_frm_style .frm_grid.frm_blank_field,
@@ -1261,10 +1321,12 @@
1261 1321
1262 1322 .with_frm_style .frm_grid.frm_blank_field,
1263 1323 .with_frm_style .frm_grid_first.frm_blank_field,
1264 1324 .with_frm_style .frm_grid_odd.frm_blank_field{
1325 + background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1265 1326 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1266 - border-color: var(--error-border);
1327 + border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1328 + border-color:var(--error-bg);
1267 1329 }
1268 1330
1269 1331 .frm_grid .frm_primary_label,
1270 1332 .frm_grid_first .frm_primary_label,
@@ -1286,10 +1348,9 @@
1286 1348 .frm_grid_odd .frm_radio label,
1287 1349 .frm_grid_first .frm_checkbox label,
1288 1350 .frm_grid .frm_checkbox label,
1289 1351 .frm_grid_odd .frm_checkbox label{
1290 - color:transparent;
1291 - text-indent: -9999px;
1352 + visibility:hidden;
1292 1353 white-space:nowrap;
1293 1354 text-align:left;
1294 1355 }
1295 1356
@@ -1415,18 +1476,8 @@
1415 1476 .frm_form_field.frm_left_container .frm_opt_container{
1416 1477 padding-top:4px;
1417 1478 }
1418 1479
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 1480 .with_frm_style .frm_inline_container.frm_grid_first .frm_primary_label,
1430 1481 .with_frm_style .frm_inline_container.frm_grid .frm_primary_label,
1431 1482 .with_frm_style .frm_inline_container.frm_grid_odd .frm_primary_label,
1432 1483 .with_frm_style .frm_inline_container.frm_grid_first .frm_opt_container,
@@ -1461,9 +1512,11 @@
1461 1512 grid-column-end: span 1;
1462 1513 }
1463 1514
1464 1515 .frm_form_field .frm_checkbox,
1465 -.frm_form_field .frm_radio {
1516 +.frm_form_field .frm_checkbox + .frm_checkbox,
1517 +.frm_form_field .frm_radio,
1518 +.frm_form_field .frm_radio + .frm_radio{
1466 1519 margin-top: 0;
1467 1520 margin-bottom: 0;
1468 1521 }
1469 1522
@@ -1472,24 +1525,36 @@
1472 1525 overflow:auto;
1473 1526 }
1474 1527
1475 1528 .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);
1529 +.frm_form_field.frm_html_scroll_box{
1530 + height:100px;
1531 + overflow:auto;
1532 + background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1533 + background-color:var(--bg-color);
1534 + border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1535 + border-color:var(--border-color);
1536 + border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1537 + border-width:var(--field-border-width);
1538 + border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1539 + border-style:var(--field-border-style);
1540 + -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1541 + -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1542 + border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1543 + border-radius:var(--border-radius);
1544 + width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1545 + width:var(--field-width);
1546 + max-width:100%;
1547 + font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1548 + font-size:var(--field-font-size);
1549 + padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1550 + padding:var(--field-pad);
1551 + -webkit-box-sizing:border-box;
1552 + -moz-box-sizing:border-box;
1553 + box-sizing:border-box;
1554 + outline:none<?php echo esc_html( $important ); ?>;
1555 + font-weight:normal;
1556 + box-shadow:var(--box-shadow);
1492 1557 }
1493 1558
1494 1559 .frm_form_field.frm_total_big input,
1495 1560 .frm_form_field.frm_total_big textarea,
@@ -1498,8 +1563,10 @@
1498 1563 opacity:1;
1499 1564 background-color:transparent !important;
1500 1565 border:none !important;
1501 1566 font-weight:bold;
1567 + -moz-box-shadow:none;
1568 + -webkit-box-shadow:none;
1502 1569 width:auto !important;
1503 1570 height:auto !important;
1504 1571 box-shadow:none !important;
1505 1572 display:inline;
@@ -1519,8 +1586,10 @@
1519 1586 .frm_form_field.frm_total input:focus,
1520 1587 .frm_form_field.frm_total textarea:focus{
1521 1588 background-color:transparent;
1522 1589 border:none;
1590 + -moz-box-shadow:none;
1591 + -webkit-box-shadow:none;
1523 1592 box-shadow:none;
1524 1593 }
1525 1594
1526 1595 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1545,8 +1614,13 @@
1545 1614 .frm_clearfix{
1546 1615 display:block;
1547 1616 }
1548 1617
1618 +.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1619 + color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1620 + color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1621 +}
1622 +
1549 1623 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1550 1624 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1551 1625 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1626 margin-bottom: 0 !important;
@@ -1551,15 +1625,15 @@
1551 1625 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1552 1626 margin-bottom: 0 !important;
1553 1627 }
1554 1628
1629 +<?php
1630 +FrmStylesHelper::maybe_include_font_icon_css();
1555 1631
1556 -<?php
1557 1632 /**
1558 1633 * Call action so other plugins can add additional CSS.
1559 1634 *
1560 1635 * @param array $args {
1561 - *
1562 1636 * @type array $defaults
1563 1637 * }
1564 1638 */
1565 1639 do_action( 'frm_include_front_css', compact( 'defaults' ) );
@@ -1609,8 +1683,9 @@
1609 1683 max-width:302px;
1610 1684 border-right:1px solid #d3d3d3;
1611 1685 border-radius:4px;
1612 1686 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1687 + -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1613 1688 }
1614 1689
1615 1690 .with_frm_style .g-recaptcha iframe,
1616 1691 .with_frm_style .frm-g-recaptcha iframe{
@@ -1615,15 +1690,8 @@
1615 1690 .with_frm_style .g-recaptcha iframe,
1616 1691 .with_frm_style .frm-g-recaptcha iframe{
1617 1692 width:100%;
1618 1693 }
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 1694 }
1627 1695 <?php
1628 1696
1629 1697 echo strip_tags( FrmStylesController::get_custom_css() ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped