PluginProbe
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More / 6.22.1
Formidable Forms – WordPress Form Builder for Contact Forms, Calculators, Quizzes & More v6.22.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 +306 -321 6.5.26.22.1 View file →
@@ -16,12 +16,14 @@
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';
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();
24 26
25 27 ?>
26 28 .with_frm_style{
27 29 <?php FrmStylesHelper::output_vars( $defaults ); ?>
@@ -36,12 +38,12 @@
36 38
37 39 .with_frm_style,
38 40 .with_frm_style form,
39 41 .with_frm_style .frm-show-form div.frm_description p{
40 - text-align:<?php echo esc_html( $defaults['form_align'] . $important ); ?>;
41 - text-align:var(--form-align)<?php echo esc_html( $important ); ?>;
42 + text-align: var(--form-align)<?php echo esc_html( $important ); ?>;
42 43 }
43 44
45 +/* Keep this. This is used for Honeypot */
44 46 input:-webkit-autofill {
45 47 -webkit-box-shadow: 0 0 0 30px white inset;
46 48 }
47 49
@@ -47,36 +49,24 @@
47 49
48 50 /* Form description */
49 51 .with_frm_style .frm-show-form div.frm_description p{
50 52 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
51 - font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
52 - font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
53 + font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
53 54 <?php } ?>
54 55 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
55 - color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
56 - color:var(--form-desc-color)<?php echo esc_html( $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:<?php echo esc_html( $defaults['form_desc_margin_top'] . $important ); ?>;
60 - margin-top:var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
59 + margin-top: var(--form-desc-margin-top)<?php echo esc_html( $important ); ?>;
61 60 <?php } ?>
62 61 <?php if ( ! empty( $defaults['form_desc_margin_bottom'] ) ) { ?>
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 ); ?>;
62 + margin-bottom: var(--form-desc-margin-bottom)<?php echo esc_html( $important ); ?>;
65 63 <?php } ?>
66 64 <?php if ( isset( $defaults['form_desc_padding'] ) ) { ?>
67 - padding:<?php echo esc_html( $defaults['form_desc_padding'] . $important ); ?>;
68 - padding:var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
65 + padding: var(--form-desc-padding)<?php echo esc_html( $important ); ?>;
69 66 <?php } ?>
70 67 }
71 68
72 -form .<?php echo esc_html( FrmHoneypot::generate_class_name() ); ?> {
73 - overflow: hidden;
74 - width: 0;
75 - height: 0;
76 - position: absolute;
77 -}
78 -
79 69 .with_frm_style fieldset{
80 70 min-width:0;
81 71 display: block; /* Override 2021 theme */
82 72 }
@@ -89,24 +79,20 @@
89 79 }
90 80
91 81 .with_frm_style .frm_form_fields > fieldset{
92 82 <?php if ( isset( $defaults['fieldset'] ) && ( $defaults['fieldset'] || '0' === $defaults['fieldset'] ) ) { ?>
93 - border-width:<?php echo esc_html( $defaults['fieldset'] . $important ); ?>;
94 - border-width:var(--fieldset)<?php echo esc_html( $important ); ?>;
83 + border-width: var(--fieldset)<?php echo esc_html( $important ); ?>;
95 84 <?php } ?>
96 85 border-style:solid;
97 86 <?php if ( ! empty( $defaults['fieldset_color'] ) ) { ?>
98 - border-color:<?php echo esc_html( $defaults['fieldset_color'] . $important ); ?>;
99 - border-color:var(--fieldset-color)<?php echo esc_html( $important ); ?>;
87 + border-color: var(--fieldset-color)<?php echo esc_html( $important ); ?>;
100 88 <?php } ?>
101 89 margin:0;
102 90 <?php if ( ! empty( $defaults['fieldset_padding'] ) ) { ?>
103 - padding:<?php echo esc_html( $defaults['fieldset_padding'] . $important ); ?>;
104 - padding:var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
91 + padding: var(--fieldset-padding)<?php echo esc_html( $important ); ?>;
105 92 <?php } ?>
106 93 <?php if ( ! empty( $defaults['fieldset_bg_color'] ) ) { ?>
107 - background-color:<?php echo esc_html( $defaults['fieldset_bg_color'] ); ?>;
108 - background-color:var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
94 + background-color: var(--fieldset-bg-color)<?php echo esc_html( $important ); ?>;
109 95 <?php } ?>
110 96 <?php if ( ! empty( $defaults['font'] ) ) { ?>
111 97 font-family:var(--font);
112 98 <?php } ?>
@@ -130,26 +116,21 @@
130 116
131 117 .with_frm_style legend + h3,
132 118 .with_frm_style h3.frm_form_title{
133 119 <?php if ( ! empty( $defaults['title_size'] ) ) { ?>
134 - font-size:<?php echo esc_html( $defaults['title_size'] . $important ); ?>;
135 - font-size:var(--title-size)<?php echo esc_html( $important ); ?>;
120 + font-size: var(--title-size)<?php echo esc_html( $important ); ?>;
136 121 <?php } ?>
137 122 <?php if ( ! empty( $defaults['title_color'] ) ) { ?>
138 - color:<?php echo esc_html( $defaults['title_color'] . $important ); ?>;
139 - color:var(--title-color)<?php echo esc_html( $important ); ?>;
123 + color: var(--title-color)<?php echo esc_html( $important ); ?>;
140 124 <?php } ?>
141 125 <?php if ( ! empty( $defaults['font'] ) ) { ?>
142 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
143 - font-family:var(--font);
126 + font-family: var(--font);
144 127 <?php } ?>
145 128 <?php if ( ! empty( $defaults['title_margin_top'] ) ) { ?>
146 - margin-top:<?php echo esc_html( $defaults['title_margin_top'] . $important ); ?>;
147 - margin-top:var(--title-margin-top)<?php echo esc_html( $important ); ?>;
129 + margin-top: var(--title-margin-top)<?php echo esc_html( $important ); ?>;
148 130 <?php } ?>
149 131 <?php if ( ! empty( $defaults['title_margin_bottom'] ) ) { ?>
150 - margin-bottom:<?php echo esc_html( $defaults['title_margin_bottom'] . $important ); ?>;
151 - margin-bottom:var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
132 + margin-bottom: var(--title-margin-bottom)<?php echo esc_html( $important ); ?>;
152 133 <?php } ?>
153 134 }
154 135
155 136 .with_frm_style .frm_form_field.frm_html_container,
@@ -154,46 +135,42 @@
154 135
155 136 .with_frm_style .frm_form_field.frm_html_container,
156 137 .with_frm_style .frm_form_field .frm_show_it{
157 138 <?php if ( ! empty( $defaults['font'] ) ) { ?>
158 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
159 - font-family:var(--font);
139 + font-family: var(--font);
160 140 <?php } ?>
161 141 <?php if ( ! empty( $defaults['form_desc_color'] ) ) { ?>
162 - color:<?php echo esc_html( $defaults['form_desc_color'] . $important ); ?>;
163 - color:var(--form-desc-color)<?php echo esc_html( $important ); ?>;
142 + color: var(--form-desc-color)<?php echo esc_html( $important ); ?>;
164 143 <?php } ?>
165 144 }
166 145
167 146 <?php if ( ! empty( $defaults['form_desc_size'] ) ) { ?>
168 147 .with_frm_style .frm_form_field.frm_html_container{
169 - font-size:<?php echo esc_html( $defaults['form_desc_size'] . $important ); ?>;
170 - font-size:var(--form-desc-size)<?php echo esc_html( $important ); ?>;
148 + font-size: var(--form-desc-size)<?php echo esc_html( $important ); ?>;
171 149 }
172 150 <?php } ?>
173 151
174 152 .with_frm_style .frm_form_field .frm_show_it{
175 153 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
176 - font-size:<?php echo esc_html( $defaults['field_font_size'] . $important ); ?>;
177 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
154 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
178 155 <?php } ?>
179 156 <?php if ( ! empty( $defaults['field_weight'] ) ) { ?>
180 - font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
181 - font-weight:var(--field-weight)<?php echo esc_html( $important ); ?>;
157 + font-weight: var(--field-weight)<?php echo esc_html( $important ); ?>;
182 158 <?php } ?>
183 159 }
184 160
185 -.with_frm_style .frm_required{
161 +.with_frm_style .frm_required {
186 162 <?php if ( ! empty( $defaults['required_color'] ) ) { ?>
187 - color:<?php echo esc_html( $defaults['required_color'] . $important ); ?>;
188 - color:var(--required-color)<?php echo esc_html( $important ); ?>;
163 + color: var(--required-color)<?php echo esc_html( $important ); ?>;
189 164 <?php } ?>
190 165 <?php if ( ! empty( $defaults['required_weight'] ) ) { ?>
191 - font-weight:<?php echo esc_html( $defaults['required_weight'] . $important ); ?>;
192 - font-weight:var(--required-weight)<?php echo esc_html( $important ); ?>;
166 + font-weight: var(--required-weight)<?php echo esc_html( $important ); ?>;
193 167 <?php } ?>
194 168 }
195 169
170 +<?php if ( $use_chosen_js ) { ?>
171 +.with_frm_style .chosen-container,
172 +<?php } ?>
196 173 .with_frm_style input[type=text],
197 174 .with_frm_style input[type=password],
198 175 .with_frm_style input[type=email],
199 176 .with_frm_style input[type=number],
@@ -201,14 +178,12 @@
201 178 .with_frm_style input[type=tel],
202 179 .with_frm_style input[type=search],
203 180 .with_frm_style select,
204 181 .with_frm_style textarea,
205 -.with_frm_style .frm-card-element.StripeElement,
206 -.with_frm_style .chosen-container{
182 +.with_frm_style .frm-card-element.StripeElement {
207 183 font-family:var(--font)<?php echo esc_html( $important ); ?>;
208 184 <?php if ( ! empty( $defaults['field_font_size'] ) ) { ?>
209 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
210 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
185 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
211 186 <?php } ?>
212 187 margin-bottom:0<?php echo esc_html( $important ); ?>;
213 188 }
214 189
@@ -231,58 +206,63 @@
231 206 .with_frm_style .frm_scroll_box .frm_opt_container,
232 207 .frm_form_fields_active_style,
233 208 .frm_form_fields_error_style,
234 209 .with_frm_style .frm-card-element.StripeElement,
210 +<?php if ( $use_chosen_js ) { ?>
235 211 .with_frm_style .chosen-container-multi .chosen-choices,
236 -.with_frm_style .chosen-container-single .chosen-single{
237 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
238 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
239 - background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
240 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
241 -<?php if ( ! empty( $important ) ) { ?>
212 +.with_frm_style .chosen-container-single .chosen-single,
213 +<?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);
228 +}
229 +
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 {
242 249 background-image:none !important;
243 -<?php } ?>
244 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
245 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
246 - border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
247 - border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
248 - border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
249 - border-style:var(--field-border-style)<?php echo esc_html( $important ); ?>;
250 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
251 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
252 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
253 - border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
254 - width:<?php echo esc_html( $defaults['field_width'] ); ?>;
255 - width:var(--field-width)<?php echo esc_html( $important ); ?>;
256 - max-width:100%;
257 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
258 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
259 - padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
260 - padding:var(--field-pad)<?php echo esc_html( $important ); ?>;
261 - -webkit-box-sizing:border-box;
262 - -moz-box-sizing:border-box;
263 - box-sizing:border-box;
264 - outline:none<?php echo esc_html( $important ); ?>;
265 - font-weight:<?php echo esc_html( $defaults['field_weight'] ); ?>;
266 - font-weight:var(--field-weight);
267 - box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
268 250 }
251 +<?php endif; ?>
269 252
270 253 .with_frm_style select option {
271 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
272 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
254 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
273 255 }
274 256
275 257 .with_frm_style select option.frm-select-placeholder {
276 - color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
277 - color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
258 + color: var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
278 259 }
279 260
280 261 .with_frm_style input[type=radio],
281 262 .with_frm_style input[type=checkbox]{
282 - border-color:<?php echo esc_html( $defaults['border_color'] . $important ); ?>;
283 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
284 - box-shadow:var(--box-shadow)<?php echo esc_html( $important ); ?>;
263 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
264 + box-shadow: var(--box-shadow)<?php echo esc_html( $important ); ?>;
285 265 float: none;
286 266 }
287 267
288 268 .with_frm_style input[type=radio]:after,
@@ -289,8 +269,18 @@
289 269 .with_frm_style input[type=checkbox]:after {
290 270 display: none; /* 2021 conflict */
291 271 }
292 272
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 +
293 283 .with_frm_style input[type=text],
294 284 .with_frm_style input[type=password],
295 285 .with_frm_style input[type=email],
296 286 .with_frm_style input[type=number],
@@ -299,10 +289,9 @@
299 289 .with_frm_style input[type=file],
300 290 .with_frm_style input[type=search],
301 291 .with_frm_style select,
302 292 .with_frm_style .frm-card-element.StripeElement{
303 - min-height:<?php echo esc_html( $defaults['field_height'] ); ?>;
304 - min-height:var(--field-height)<?php echo esc_html( $important ); ?>;
293 + min-height: var(--field-height)<?php echo esc_html( $important ); ?>;
305 294 line-height:1.3<?php echo esc_html( $important ); ?>;
306 295 }
307 296
308 297 .with_frm_style select[multiple=multiple]{
@@ -317,17 +306,15 @@
317 306 box-shadow:none;
318 307 }
319 308
320 309 .with_frm_style input[type=file]{
321 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
322 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
323 - padding:0px;
310 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
311 + padding: 0px;
324 312 <?php if ( ! empty( $defaults['font'] ) ) { ?>
325 - font-family:var(--font)<?php echo esc_html( $important ); ?>;
313 + font-family: var(--font)<?php echo esc_html( $important ); ?>;
326 314 <?php } ?>
327 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
328 - font-size:var(--field-font-size)<?php echo esc_html( $important ); ?>;
329 - display:initial;
315 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
316 + display: initial;
330 317 }
331 318
332 319 .with_frm_style input[type=file].frm_transparent{
333 320 color:transparent<?php echo esc_html( $important ); ?>;
@@ -333,10 +320,9 @@
333 320 color:transparent<?php echo esc_html( $important ); ?>;
334 321 }
335 322
336 323 .with_frm_style .wp-editor-wrap{
337 - width:<?php echo esc_html( $defaults['field_width'] . $important ); ?>;
338 - width:var(--field-width)<?php echo esc_html( $important ); ?>;
324 + width: var(--field-width)<?php echo esc_html( $important ); ?>;
339 325 max-width:100%;
340 326 }
341 327
342 328 .with_frm_style .wp-editor-container textarea{
@@ -344,17 +330,15 @@
344 330 box-shadow:none !important;
345 331 }
346 332
347 333 .with_frm_style .mceIframeContainer{
348 - background-color:<?php echo esc_html( $defaults['bg_color'] . $important ); ?>;
349 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
334 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
350 335 }
351 336
352 337 .with_frm_style select{
353 - width:<?php echo esc_html( $defaults['auto_width'] ); ?>;
354 - width:var(--auto-width)<?php echo esc_html( $important ); ?>;
338 + width: var(--auto-width)<?php echo esc_html( $important ); ?>;
355 339 max-width:100%;
356 - background-position-y: center;
340 + background-position-y: calc(50% + 3px);
357 341 }
358 342
359 343 .with_frm_style input[disabled],
360 344 .with_frm_style select[disabled],
@@ -360,15 +344,12 @@
360 344 .with_frm_style select[disabled],
361 345 .with_frm_style textarea[disabled],
362 346 .with_frm_style input[readonly],
363 347 .with_frm_style select[readonly],
364 -.with_frm_style textarea[readonly]{
365 - background-color:<?php echo esc_html( $defaults['bg_color_disabled'] ); ?>;
366 - background-color:var(--bg-color-disabled)<?php echo esc_html( $important ); ?>;
367 - color:<?php echo esc_html( $defaults['text_color_disabled'] ); ?>;
368 - color:var(--text-color-disabled)<?php echo esc_html( $important ); ?>;
369 - border-color:<?php echo esc_html( $defaults['border_color_disabled'] ); ?>;
370 - border-color:var(--border-color-disabled)<?php echo esc_html( $important ); ?>;
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 ); ?>;
371 352 }
372 353
373 354 .frm_preview_page:before{
374 355 content:normal !important;
@@ -380,30 +361,24 @@
380 361
381 362 .with_frm_style .frm_primary_label{
382 363 max-width:100%;
383 364 <?php if ( ! empty( $defaults['font'] ) ) { ?>
384 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
385 - font-family:var(--font);
365 + font-family: var(--font);
386 366 <?php } ?>
387 367 <?php if ( ! empty( $defaults['font_size'] ) ) { ?>
388 - font-size:<?php echo esc_html( $defaults['font_size'] . $important ); ?>;
389 - font-size:var(--font-size)<?php echo esc_html( $important ); ?>;
368 + font-size: var(--font-size)<?php echo esc_html( $important ); ?>;
390 369 <?php } ?>
391 370 <?php if ( ! empty( $defaults['label_color'] ) ) { ?>
392 - color:<?php echo esc_html( $defaults['label_color'] . $important ); ?>;
393 - color:var(--label-color)<?php echo esc_html( $important ); ?>;
371 + color: var(--label-color)<?php echo esc_html( $important ); ?>;
394 372 <?php } ?>
395 373 <?php if ( ! empty( $defaults['weight'] ) ) { ?>
396 - font-weight:<?php echo esc_html( $defaults['weight'] . $important ); ?>;
397 - font-weight:var(--weight)<?php echo esc_html( $important ); ?>;
374 + font-weight: var(--weight)<?php echo esc_html( $important ); ?>;
398 375 <?php } ?>
399 376 <?php if ( ! empty( $defaults['align'] ) ) { ?>
400 - text-align:<?php echo esc_html( $defaults['align'] . $important ); ?>;
401 - text-align:var(--align)<?php echo esc_html( $important ); ?>;
377 + text-align: var(--align)<?php echo esc_html( $important ); ?>;
402 378 <?php } ?>
403 379 <?php if ( ! empty( $defaults['label_padding'] ) ) { ?>
404 - padding:<?php echo esc_html( $defaults['label_padding'] . $important ); ?>;
405 - padding:var(--label-padding)<?php echo esc_html( $important ); ?>;
380 + padding: var(--label-padding)<?php echo esc_html( $important ); ?>;
406 381 <?php } ?>
407 382 margin:0;
408 383 width:auto;
409 384 display:block;
@@ -456,9 +431,9 @@
456 431
457 432 /* Floating labels */
458 433 .with_frm_style .frm_inside_container {
459 434 position: relative;
460 - padding-top: 16px;
435 + padding-top: 18px;
461 436 padding-top: calc(0.5 * var(--field-height));
462 437 }
463 438
464 439 .with_frm_style .frm_inside_container > input,
@@ -467,8 +442,13 @@
467 442 display: block;
468 443 }
469 444
470 445 /* These do not work if they are combined */
446 +.with_frm_style input::placeholder,
447 +.with_frm_style textarea::placeholder {
448 + font-size: var(--field-font-size)<?php echo esc_html( $important ); ?>;
449 +}
450 +
471 451 .with_frm_style .frm_inside_container > input::-moz-placeholder,
472 452 .with_frm_style .frm_inside_container > textarea::-moz-placeholder {
473 453 opacity: 0 !important;
474 454 transition: opacity 0.3s ease-in;
@@ -489,9 +469,9 @@
489 469 .with_frm_style .frm_inside_container > label {
490 470 transition: all 0.3s ease-in;
491 471
492 472 position: absolute;
493 - top: 17px;
473 + top: 19px;
494 474 top: calc(1px + .5 * var(--field-height));
495 475 left: 3px;
496 476 width: 100%;
497 477
@@ -499,9 +479,9 @@
499 479 text-overflow: ellipsis;
500 480 overflow: hidden;
501 481 white-space: nowrap;
502 482
503 - padding: 6px 10px;
483 + padding: 8px 12px;
504 484 padding: var(--field-pad);
505 485
506 486 font-size: 14px;
507 487 font-size: var(--field-font-size);
@@ -507,9 +487,8 @@
507 487 font-size: var(--field-font-size);
508 488 font-weight: normal;
509 489 font-weight: var(--field-weight);
510 490
511 - -ms-pointer-events: none;
512 491 pointer-events: none;
513 492 }
514 493
515 494 .with_frm_style.frm_style_lines-no-boxes .frm_inside_container > label {
@@ -593,50 +572,39 @@
593 572 text-decoration:none !important;;
594 573 border:1px solid #eee;
595 574 display:inline-block;
596 575 <?php if ( ! empty( $defaults['submit_padding'] ) ) { ?>
597 - padding:<?php echo esc_html( $defaults['submit_padding'] . $important ); ?>;
598 - padding:var(--submit-padding)<?php echo esc_html( $important ); ?>;
576 + padding: var(--submit-padding)<?php echo esc_html( $important ); ?>;
599 577 <?php } else { ?>
600 578 padding:5px;
601 579 <?php } ?>
602 580 <?php if ( ! empty( $defaults['border_radius'] ) ) { ?>
603 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
604 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
605 581 border-radius:<?php echo esc_html( $defaults['border_radius'] . $important ); ?>;
606 582 border-radius:var(--border-radius)<?php echo esc_html( $important ); ?>;
607 583 <?php } ?>
608 584 <?php if ( ! empty( $defaults['submit_font_size'] ) ) { ?>
609 - font-size:<?php echo esc_html( $defaults['submit_font_size'] . $important ); ?>;
610 - font-size:var(--submit-font-size)<?php echo esc_html( $important ); ?>;
585 + font-size: var(--submit-font-size)<?php echo esc_html( $important ); ?>;
611 586 <?php } ?>
612 587 <?php if ( ! empty( $defaults['font'] ) ) { ?>
613 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] . $important ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
614 - font-family:var(--font)<?php echo esc_html( $important ); ?>;
588 + font-family: var(--font)<?php echo esc_html( $important ); ?>;
615 589 <?php } ?>
616 590 <?php if ( ! empty( $defaults['submit_weight'] ) ) { ?>
617 - font-weight:<?php echo esc_html( $defaults['submit_weight'] . $important ); ?>;
618 - font-weight:var(--submit-weight)<?php echo esc_html( $important ); ?>;
591 + font-weight: var(--submit-weight)<?php echo esc_html( $important ); ?>;
619 592 <?php } ?>
620 593 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
621 - color:<?php echo esc_html( $defaults['submit_text_color'] . $important ); ?>;
622 - color:var(--submit-text-color)<?php echo esc_html( $important ); ?>;
594 + color: var(--submit-text-color)<?php echo esc_html( $important ); ?>;
623 595 <?php } ?>
624 596 <?php if ( ! empty( $defaults['submit_bg_color'] ) ) { ?>
625 - background:<?php echo esc_html( $defaults['submit_bg_color'] . $important ); ?>;
626 - background:var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
597 + background: var(--submit-bg-color)<?php echo esc_html( $important ); ?>;
627 598 <?php } ?>
628 599 <?php if ( ! empty( $defaults['submit_border_width'] ) ) { ?>
629 - border-width:<?php echo esc_html( $defaults['submit_border_width'] ); ?>;
630 - border-width:var(--submit-border-width)<?php echo esc_html( $important ); ?>;
600 + border-width: var(--submit-border-width)<?php echo esc_html( $important ); ?>;
631 601 <?php } ?>
632 602 <?php if ( ! empty( $defaults['submit_border_color'] ) ) { ?>
633 - border-color:<?php echo esc_html( $defaults['submit_border_color'] . $important ); ?>;
634 - border-color:var(--submit-border-color)<?php echo esc_html( $important ); ?>;
603 + border-color: var(--submit-border-color)<?php echo esc_html( $important ); ?>;
635 604 <?php } ?>
636 605 <?php if ( ! empty( $defaults['submit_height'] ) ) { ?>
637 - height:<?php echo esc_html( $defaults['submit_height'] . $important ); ?>;
638 - height:var(--submit-height)<?php echo esc_html( $important ); ?>;
606 + height: var(--submit-height)<?php echo esc_html( $important ); ?>;
639 607 <?php } ?>
640 608 }
641 609
642 610 <?php if ( ! empty( $defaults['submit_text_color'] ) ) { ?>
@@ -669,8 +637,12 @@
669 637 .with_frm_style.frm_center_submit .frm_submit{
670 638 text-align:center;
671 639 }
672 640
641 +.with_frm_style.frm_center_submit .frm_flex.frm_submit {
642 + justify-content: center;
643 +}
644 +
673 645 .with_frm_style .frm_inline_success .frm_submit{
674 646 display: flex;
675 647 flex-direction: row;
676 648 align-items: center;
@@ -714,9 +686,8 @@
714 686
715 687 .with_frm_style .frm_loading_prev .frm_prev_page,
716 688 .with_frm_style .frm_loading_form .frm_button_submit {
717 689 position: relative;
718 - opacity: .8;
719 690 color: transparent !important;
720 691 text-shadow: none !important;
721 692 }
722 693
@@ -742,9 +713,9 @@
742 713 border-top-color: transparent;
743 714 border-left-color: transparent;
744 715 border-radius: 50%;
745 716 box-sizing: border-box;
746 - <?php $loader_size = 20; ?>
717 + <?php $loader_size = 12; ?>
747 718 top: 50%;
748 719 left: 50%;
749 720 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
750 721 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
@@ -749,17 +720,23 @@
749 720 margin-top: -<?php echo absint( $loader_size / 2 ); ?>px;
750 721 margin-left: -<?php echo absint( $loader_size / 2 ); ?>px;
751 722 width: <?php echo absint( $loader_size ); ?>px;
752 723 height: <?php echo absint( $loader_size ); ?>px;
753 - -webkit-animation: spin 2s linear infinite;
754 - -moz-animation: spin 2s linear infinite;
755 - -o-animation: spin 2s linear infinite;
756 - animation: spin 2s linear infinite;
724 + animation: spin 2s linear infinite;
757 725 }
758 726
727 +.with_frm_style .frm_submit.frm_flex {
728 + align-items: center;
729 + gap: 2%;
730 +}
731 +
732 +.with_frm_style .frm_submit.frm_flex button.frm_button_submit ~ .frm_prev_page {
733 + order: -1;
734 +}
735 +
759 736 <?php
760 737 foreach ( $styles as $style ) {
761 - include( dirname( __FILE__ ) . '/_single_theme.css.php' );
738 + include __DIR__ . '/_single_theme.css.php';
762 739 unset( $style );
763 740 }
764 741
765 742 // Set it again since it may have been overridden.
@@ -781,15 +758,12 @@
781 758
782 759 .with_frm_style a.frm_save_draft,
783 760 .with_frm_style a.frm_start_over{
784 761 <?php if ( ! empty( $defaults['font'] ) ) { ?>
785 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
786 - font-family:var(--font);
762 + font-family: var(--font);
787 763 <?php } ?>
788 - font-size:<?php echo esc_html( $defaults['submit_font_size'] ); ?>;
789 - font-size:var(--submit-font-size);
790 - font-weight:<?php echo esc_html( $defaults['submit_weight'] ); ?>;
791 - font-weight:var(--submit-weight);
764 + font-size: var(--submit-font-size);
765 + font-weight: var(--submit-weight);
792 766 }
793 767
794 768 .horizontal_radio .frm_radio{
795 769 margin:0 5px 0 0;
@@ -796,9 +770,9 @@
796 770 }
797 771
798 772 .horizontal_radio .frm_checkbox{
799 773 margin:0;
800 - margin-right:5px;
774 + margin-right:12px;
801 775 }
802 776
803 777 .vertical_radio .frm_checkbox,
804 778 .vertical_radio .frm_radio,
@@ -813,15 +787,13 @@
813 787 padding-left: 0;
814 788 }
815 789
816 790 .with_frm_style .frm_radio{
817 - display:<?php echo esc_html( $defaults['radio_align'] . $important ); ?>;
818 - display:var(--radio-align)<?php echo esc_html( $important ); ?>;
791 + display: var(--radio-align)<?php echo esc_html( $important ); ?>;
819 792 }
820 793
821 794 .with_frm_style .frm_checkbox{
822 - display:<?php echo esc_html( $defaults['check_align'] . $important ); ?>;
823 - display:var(--check-align)<?php echo esc_html( $important ); ?>;
795 + display: var(--check-align)<?php echo esc_html( $important ); ?>;
824 796 }
825 797
826 798 .with_frm_style .vertical_radio .frm_checkbox,
827 799 .with_frm_style .vertical_radio .frm_radio,
@@ -826,8 +798,9 @@
826 798 .with_frm_style .vertical_radio .frm_checkbox,
827 799 .with_frm_style .vertical_radio .frm_radio,
828 800 .vertical_radio .frm_catlevel_1{
829 801 display:block<?php echo esc_html( $important ); ?>;
802 + margin-bottom: 10px;
830 803 }
831 804
832 805 .with_frm_style .horizontal_radio .frm_checkbox,
833 806 .with_frm_style .horizontal_radio .frm_radio,
@@ -835,40 +808,45 @@
835 808 display:inline-block<?php echo esc_html( $important ); ?>;
836 809 }
837 810
838 811 .with_frm_style .frm_checkbox label,
839 -.with_frm_style .frm_radio label{
840 - display: inline;
812 +.with_frm_style .frm_radio label {
813 + display: inline-block;
814 + vertical-align: middle;
841 815 white-space:normal;
842 816 }
843 817
818 +.with_frm_style .frm_checkbox label input[type=checkbox],
819 +.with_frm_style .frm_radio label input[type=radio] {
820 + margin-right: 4px;
821 +}
822 +
823 +.with_frm_style .frm_checkbox label:not(.frm-label-disabled),
824 +.with_frm_style .frm_radio label:not(.frm-label-disabled) {
825 + cursor: pointer;
826 +}
827 +
844 828 .with_frm_style .vertical_radio .frm_checkbox label,
845 829 .with_frm_style .vertical_radio .frm_radio label{
846 830 display: block;
847 - padding-left: 20px;
848 - text-indent: -20px;
831 + width: 100%;
849 832 }
850 833
851 834 .with_frm_style .frm_radio label,
852 -.with_frm_style .frm_checkbox label{
835 +.with_frm_style .frm_checkbox label {
853 836 <?php if ( ! empty( $defaults['font'] ) ) { ?>
854 - font-family:<?php echo FrmAppHelper::kses( $defaults['font'] ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>;
855 - font-family:var(--font);
837 + font-family: var(--font);
856 838 <?php } ?>
857 - font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
858 - font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
859 - color:<?php echo esc_html( $defaults['check_label_color'] . $important ); ?>;
860 - color:var(--check-label-color)<?php echo esc_html( $important ); ?>;
861 - font-weight:<?php echo esc_html( $defaults['check_weight'] . $important ); ?>;
862 - font-weight:var(--check-weight)<?php echo esc_html( $important ); ?>;
839 + font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
840 + color: var(--check-label-color)<?php echo esc_html( $important ); ?>;
841 + font-weight: var(--check-weight)<?php echo esc_html( $important ); ?>;
863 842 line-height: 1.3;
864 843 }
865 844
866 845 .with_frm_style .frm_radio input[type=radio],
867 846 .with_frm_style .frm_checkbox input[type=checkbox] {
868 - font-size:<?php echo esc_html( $defaults['check_font_size'] . $important ); ?>;
869 - font-size:var(--check-font-size)<?php echo esc_html( $important ); ?>;
870 - position:static<?php echo esc_html( $important ); ?>;
847 + font-size: var(--check-font-size)<?php echo esc_html( $important ); ?>;
848 + position: static<?php echo esc_html( $important ); ?>;
871 849 }
872 850
873 851 .frm_file_container .frm_file_link,
874 852 .with_frm_style .frm_radio label .frm_file_container,
@@ -878,9 +856,9 @@
878 856 vertical-align:middle;
879 857 }
880 858
881 859 .with_frm_style .frm_radio input[type=radio]
882 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
860 +<?php if ( $pro_is_installed ) : ?>
883 861 , .with_frm_style .frm_scale input[type=radio]
884 862 <?php endif; ?>
885 863 {
886 864 border-radius:50%;
@@ -885,62 +863,96 @@
885 863 {
886 864 border-radius:50%;
887 865 }
888 866
889 -.with_frm_style .frm_checkbox input[type=checkbox]{
890 - border-radius:0;
867 +.with_frm_style .frm_checkbox input[type=checkbox] {
868 + border-radius: calc(var(--border-radius) / 2) !important;
891 869 }
892 870
893 871 .with_frm_style .frm_radio input[type=radio],
894 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
872 +<?php if ( $pro_is_installed ) : ?>
895 873 .with_frm_style .frm_scale input[type=radio],
896 874 <?php endif; ?>
897 875 .with_frm_style .frm_checkbox input[type=checkbox]{
898 - -webkit-appearance: none;
899 876 appearance: none;
900 877 background-color: var(--bg-color);
901 878 flex: none;
902 879 display:inline-block !important;
903 - margin: 0 5px 0 0;
880 + width: 16px !important;
881 + min-width: 16px !important;
882 + height: 16px !important;
904 883 color: var(--border-color);
905 - width: 18px;
906 - min-width: 18px;
907 - height: 18px;
908 884 border: 1px solid currentColor;
909 885 border-color: var(--border-color);
910 886 vertical-align: middle;
911 887 position: initial; /* override Bootstrap */
912 888 padding: 0;
889 + margin: 0;
913 890 }
914 891
915 -.with_frm_style .frm_radio input[type=radio]:before,
916 -<?php if ( FrmAppHelper::pro_is_installed() ) : ?>
917 -.with_frm_style .frm_scale input[type=radio]:before,
892 +.frm_forms.with_frm_style .frm_fields_container .frm_radio input[type=radio]:not([disabled]):checked,
893 +<?php if ( $pro_is_installed ) : ?>
894 +.frm_forms.with_frm_style .frm_fields_container .frm_scale input[type=radio]:not([disabled]):checked,
918 895 <?php endif; ?>
919 -.with_frm_style .frm_checkbox input[type=checkbox]:before {
896 +.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
897 + border-color: var(--border-color-active) !important;
898 +}
899 +
900 +.frm_forms.with_frm_style .frm_fields_container .frm_checkbox input[type=checkbox]:not([disabled]):checked {
901 + background-color: var(--border-color-active) !important;
902 +}
903 +
904 +.with_frm_style .frm_radio input[type=radio][disabled]:checked,
905 +<?php if ( $pro_is_installed ) : ?>
906 +.with_frm_style .frm_scale input[type=radio][disabled]:checked,
907 +<?php endif; ?>
908 +.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
909 + border-color: var(--border-color) !important; /* Override Style Preview */
910 +}
911 +
912 +.with_frm_style .frm_checkbox input[type=checkbox][disabled]:checked {
913 + background-color: var(--border-color) !important;
914 +}
915 +
916 +.with_frm_style .frm_radio input[type=radio]:checked:before,
917 +<?php if ( $pro_is_installed ) { ?>
918 +.with_frm_style .frm_scale input[type=radio]:checked:before,
919 +<?php } ?>
920 +.with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
921 + position: static !important; /* Override Style Preview */
920 922 content: '';
921 - width: 12px;
922 - height: 12px;
923 - border-radius: 50%;
924 - transform: scale(0);
925 - transition: 120ms transform ease-in-out;
926 - box-shadow: inset 10px 10px var(--text-color);
927 923 display: block;
928 - margin: 2px 0 0 2px;
929 924 }
930 925
931 -.with_frm_style .frm_checkbox input[type=checkbox]:before{
932 - clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
933 - border-radius: 0;
926 +.frm_forms.with_frm_style .frm_checkbox input[type=checkbox]:before {
927 + width: 100% !important;
928 + height: 100% !important;
929 + 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;
930 + background-size: 9px !important;
931 + background-repeat: no-repeat !important;
932 + background-position: center !important;
933 + margin: 0;
934 934 }
935 935
936 -.with_frm_style .frm_radio input[type=radio]:checked:before,
937 -.with_frm_style .frm_checkbox input[type=checkbox]:checked:before {
938 - transform: scale(1);
936 +<?php if ( $pro_is_installed ) { ?>
937 +.with_frm_style .frm_scale input[type=radio]:before,
938 +<?php } ?>
939 +.with_frm_style .frm_radio input[type=radio]:before {
940 + width: 8px;
941 + height: 8px;
942 + border-radius: 50%;
943 + background-color: var(--border-color-active);
944 + margin: 3px;
939 945 }
940 946
947 +<?php if ( $pro_is_installed ) { ?>
948 +.with_frm_style .frm_scale input[type=radio][disabled]:before,
949 +<?php } ?>
950 +.with_frm_style .frm_radio input[type=radio][disabled]:before {
951 + background-color: var(--border-color);
952 +}
953 +
941 954 .with_frm_style :invalid,
942 -.with_frm_style :-moz-submit-invalid,
943 955 .with_frm_style :-moz-ui-invalid{
944 956 box-shadow:none;
945 957 }
946 958
@@ -956,33 +968,25 @@
956 968
957 969 .with_frm_style .frm_error_style,
958 970 .with_frm_style .frm_message,
959 971 .frm_success_style{
960 - -moz-border-radius:4px;
961 - -webkit-border-radius:4px;
962 972 border-radius:4px;
963 973 padding:15px;
964 974 }
965 975
966 -.with_frm_style .frm_message p{
967 - margin-bottom:5px;
968 - color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
969 - color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
976 +.with_frm_style .frm_message p {
977 + margin-bottom: 5px;
978 + color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
970 979 }
971 980
972 981 .with_frm_style .frm_message,
973 -.frm_success_style{
974 - margin:5px 0 15px;
975 - border:1px solid <?php echo esc_html( $defaults['success_border_color'] ); ?>;
976 - border-color:var(--success-border-color);
977 - background-color:<?php echo esc_html( $defaults['success_bg_color'] ); ?>;
978 - background-color:var(--success-bg-color);
979 - color:<?php echo esc_html( $defaults['success_text_color'] ); ?>;
980 - color:var(--success-text-color)<?php echo esc_html( $important ); ?>;
981 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
982 - border-radius:var(--border-radius);
983 - font-size:<?php echo esc_html( $defaults['success_font_size'] ); ?>;
984 - font-size:var(--success-font-size)<?php echo esc_html( $important ); ?>;
982 +.frm_success_style {
983 + margin: 5px 0 15px;
984 + border: 1px solid var(--success-border-color);
985 + background-color: var(--success-bg-color);
986 + color: var(--success-text-color)<?php echo esc_html( $important ); ?>;
987 + border-radius: var(--border-radius);
988 + font-size: var(--success-font-size)<?php echo esc_html( $important ); ?>;
985 989 }
986 990
987 991 .with_frm_style .frm_plain_success .frm_message {
988 992 background-color: transparent;
@@ -1018,10 +1022,9 @@
1018 1022 padding:5px;
1019 1023 border-width:1px;
1020 1024 border-style:solid;
1021 1025 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1022 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1023 - border-color:var(--border-color);
1026 + border-color: var(--border-color);
1024 1027 <?php } ?>
1025 1028 border-top:none;
1026 1029 border-left:none;
1027 1030 border-right:none;
@@ -1036,10 +1039,9 @@
1036 1039 }
1037 1040
1038 1041 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1039 1042 .with_frm_style .frm-alt-table{
1040 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1041 - border-color:var(--border-color);
1043 + border-color: var(--border-color);
1042 1044 }
1043 1045 <?php } ?>
1044 1046
1045 1047 .frm-alt-table th {
@@ -1063,11 +1065,11 @@
1063 1065 background-color:<?php echo esc_html( FrmStylesHelper::adjust_brightness( $defaults['border_color'], 45 ) ); ?>;
1064 1066 }
1065 1067
1066 1068 table.form_results.with_frm_style{
1067 - border:<?php echo esc_html( $defaults['field_border_width'] ); ?> solid <?php echo esc_html( $defaults['border_color'] . $important ); ?>;
1068 - border-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1069 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1069 + border-style: solid;
1070 + border-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1071 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1070 1072 }
1071 1073
1072 1074 table.form_results.with_frm_style tr td{
1073 1075 text-align:left;
@@ -1072,15 +1074,14 @@
1072 1074 table.form_results.with_frm_style tr td{
1073 1075 text-align:left;
1074 1076 padding:7px 9px;
1075 1077 <?php if ( ! empty( $defaults['text_color'] ) ) { ?>
1076 - color:<?php echo esc_html( $defaults['text_color'] ); ?>;
1077 - color:var(--text-color)<?php echo esc_html( $important ); ?>;
1078 + color: var(--text-color)<?php echo esc_html( $important ); ?>;
1078 1079 <?php } ?>
1079 1080 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1080 - border-top:1px solid <?php echo esc_html( $defaults['border_color'] ); ?>;
1081 - border-top-width:var(--field-border-width)<?php echo esc_html( $important ); ?>;
1082 - border-top-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1081 + border-top-style: solid;
1082 + border-top-width: var(--field-border-width)<?php echo esc_html( $important ); ?>;
1083 + border-top-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1083 1084 <?php } ?>
1084 1085 }
1085 1086
1086 1087 table.form_results.with_frm_style tr.frm_even,
@@ -1090,11 +1091,10 @@
1090 1091 }
1091 1092
1092 1093 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1093 1094 table.form_results.with_frm_style tr.frm_odd,
1094 -.frm-grid .frm_odd{
1095 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1096 - background-color:var(--bg-color)<?php echo esc_html( $important ); ?>;
1095 +.frm-grid .frm_odd {
1096 + background-color: var(--bg-color)<?php echo esc_html( $important ); ?>;
1097 1097 }
1098 1098 <?php } ?>
1099 1099
1100 1100 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
@@ -1176,26 +1176,25 @@
1176 1176 animation:2s linear 0s normal none infinite progress-bar-stripes;
1177 1177 }
1178 1178
1179 1179 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1180 -#frm_loading .progress-striped .progress-bar{
1180 +#frm_loading .progress-striped .progress-bar {
1181 1181 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1182 - 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));
1182 + 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));
1183 1183 <?php } ?>
1184 1184 background-size:40px 40px;
1185 1185 }
1186 1186 <?php } ?>
1187 1187
1188 -#frm_loading .progress-bar{
1189 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1190 - background-color:var(--bg-color);
1191 - box-shadow:0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1192 - float:left;
1193 - height:100%;
1194 - line-height:20px;
1195 - text-align:center;
1196 - transition:width 0.6s ease 0s;
1197 - width:100%;
1188 +#frm_loading .progress-bar {
1189 + background-color: var(--bg-color);
1190 + box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.15) inset;
1191 + float: left;
1192 + height: 100%;
1193 + line-height: 20px;
1194 + text-align: center;
1195 + transition: width 0.6s ease 0s;
1196 + width: 100%;
1198 1197 }
1199 1198
1200 1199 .frm_image_from_url{
1201 1200 height:50px;
@@ -1212,9 +1211,9 @@
1212 1211 background-repeat: no-repeat;
1213 1212 color: transparent !important;
1214 1213 }
1215 1214
1216 -<?php readfile( dirname( __FILE__ ) . '/frm_grids.css' ); ?>
1215 +<?php readfile( __DIR__ . '/frm_grids.css' ); ?>
1217 1216
1218 1217 .frm_conf_field.frm_left_container .frm_primary_label{
1219 1218 display:none;
1220 1219 }
@@ -1221,10 +1220,8 @@
1221 1220
1222 1221 .wp-editor-wrap *,
1223 1222 .wp-editor-wrap *:after,
1224 1223 .wp-editor-wrap *:before{
1225 - -webkit-box-sizing:content-box;
1226 - -moz-box-sizing:content-box;
1227 1224 box-sizing:content-box;
1228 1225 }
1229 1226
1230 1227 .with_frm_style .frm_grid,
@@ -1235,10 +1232,9 @@
1235 1232 padding:5px;
1236 1233 border-width:1px;
1237 1234 border-style:solid;
1238 1235 <?php if ( ! empty( $defaults['border_color'] ) ) { ?>
1239 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1240 - border-color:var(--border-color)<?php echo esc_html( $important ); ?>;
1236 + border-color: var(--border-color)<?php echo esc_html( $important ); ?>;
1241 1237 <?php } ?>
1242 1238 border-left:none;
1243 1239 border-right:none;
1244 1240 }
@@ -1273,18 +1269,16 @@
1273 1269 }
1274 1270
1275 1271 <?php if ( ! empty( $defaults['bg_color'] ) ) { ?>
1276 1272 .frm_grid_first,
1277 -.frm_grid_odd{
1278 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1279 - background-color:var(--bg-color);
1273 +.frm_grid_odd {
1274 + background-color: var(--bg-color);
1280 1275 }
1281 1276 <?php } ?>
1282 1277
1283 1278 <?php if ( ! empty( $defaults['bg_color_active'] ) ) { ?>
1284 -.frm_grid{
1285 - background-color:<?php echo esc_html( $defaults['bg_color_active'] . $important ); ?>;
1286 - background-color:var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1279 +.frm_grid {
1280 + background-color: var(--bg-color-active)<?php echo esc_html( $important ); ?>;
1287 1281 }
1288 1282 <?php } ?>
1289 1283
1290 1284 .with_frm_style .frm_grid.frm_blank_field,
@@ -1289,12 +1283,10 @@
1289 1283
1290 1284 .with_frm_style .frm_grid.frm_blank_field,
1291 1285 .with_frm_style .frm_grid_first.frm_blank_field,
1292 1286 .with_frm_style .frm_grid_odd.frm_blank_field{
1293 - background-color:<?php echo esc_html( $defaults['error_bg'] . $important ); ?>;
1294 1287 background-color:var(--error-bg)<?php echo esc_html( $important ); ?>;
1295 - border-color:<?php echo esc_html( $defaults['error_border'] ); ?>;
1296 - border-color:var(--error-bg);
1288 + border-color: var(--error-border);
1297 1289 }
1298 1290
1299 1291 .frm_grid .frm_primary_label,
1300 1292 .frm_grid_first .frm_primary_label,
@@ -1316,9 +1308,10 @@
1316 1308 .frm_grid_odd .frm_radio label,
1317 1309 .frm_grid_first .frm_checkbox label,
1318 1310 .frm_grid .frm_checkbox label,
1319 1311 .frm_grid_odd .frm_checkbox label{
1320 - visibility:hidden;
1312 + color:transparent;
1313 + text-indent: -9999px;
1321 1314 white-space:nowrap;
1322 1315 text-align:left;
1323 1316 }
1324 1317
@@ -1444,8 +1437,18 @@
1444 1437 .frm_form_field.frm_left_container .frm_opt_container{
1445 1438 padding-top:4px;
1446 1439 }
1447 1440
1441 +.with_frm_style .frm_left_container > select.auto_width,
1442 +.with_frm_style .frm_right_container > select.auto_width {
1443 + width: max-content<?php echo esc_html( $important ); ?>;
1444 +}
1445 +
1446 +.with_frm_style .frm_right_container > .frm_primary_label,
1447 +.with_frm_style .frm_right_container > select.auto_width {
1448 + margin-left: auto<?php echo esc_html( $important ); ?>;
1449 +}
1450 +
1448 1451 .with_frm_style .frm_inline_container.frm_grid_first .frm_primary_label,
1449 1452 .with_frm_style .frm_inline_container.frm_grid .frm_primary_label,
1450 1453 .with_frm_style .frm_inline_container.frm_grid_odd .frm_primary_label,
1451 1454 .with_frm_style .frm_inline_container.frm_grid_first .frm_opt_container,
@@ -1480,11 +1483,9 @@
1480 1483 grid-column-end: span 1;
1481 1484 }
1482 1485
1483 1486 .frm_form_field .frm_checkbox,
1484 -.frm_form_field .frm_checkbox + .frm_checkbox,
1485 -.frm_form_field .frm_radio,
1486 -.frm_form_field .frm_radio + .frm_radio{
1487 +.frm_form_field .frm_radio {
1487 1488 margin-top: 0;
1488 1489 margin-bottom: 0;
1489 1490 }
1490 1491
@@ -1493,36 +1494,24 @@
1493 1494 overflow:auto;
1494 1495 }
1495 1496
1496 1497 .frm_html_container.frm_scroll_box,
1497 -.frm_form_field.frm_html_scroll_box{
1498 - height:100px;
1499 - overflow:auto;
1500 - background-color:<?php echo esc_html( $defaults['bg_color'] ); ?>;
1501 - background-color:var(--bg-color);
1502 - border-color:<?php echo esc_html( $defaults['border_color'] ); ?>;
1503 - border-color:var(--border-color);
1504 - border-width:<?php echo esc_html( $defaults['field_border_width'] ); ?>;
1505 - border-width:var(--field-border-width);
1506 - border-style:<?php echo esc_html( $defaults['field_border_style'] ); ?>;
1507 - border-style:var(--field-border-style);
1508 - -moz-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1509 - -webkit-border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1510 - border-radius:<?php echo esc_html( $defaults['border_radius'] ); ?>;
1511 - border-radius:var(--border-radius);
1512 - width:<?php echo esc_html( $defaults['field_width'] ); ?>;
1513 - width:var(--field-width);
1514 - max-width:100%;
1515 - font-size:<?php echo esc_html( $defaults['field_font_size'] ); ?>;
1516 - font-size:var(--field-font-size);
1517 - padding:<?php echo esc_html( $defaults['field_pad'] ); ?>;
1518 - padding:var(--field-pad);
1519 - -webkit-box-sizing:border-box;
1520 - -moz-box-sizing:border-box;
1521 - box-sizing:border-box;
1522 - outline:none<?php echo esc_html( $important ); ?>;
1523 - font-weight:normal;
1524 - box-shadow:var(--box-shadow);
1498 +.frm_form_field.frm_html_scroll_box {
1499 + height: 100px;
1500 + overflow: auto;
1501 + background-color: var(--bg-color);
1502 + border-color: var(--border-color);
1503 + border-width: var(--field-border-width);
1504 + border-style: var(--field-border-style);
1505 + border-radius: var(--border-radius);
1506 + width: var(--field-width);
1507 + max-width: 100%;
1508 + font-size: var(--field-font-size);
1509 + padding: var(--field-pad);
1510 + box-sizing: border-box;
1511 + outline: none<?php echo esc_html( $important ); ?>;
1512 + font-weight: normal;
1513 + box-shadow: var(--box-shadow);
1525 1514 }
1526 1515
1527 1516 .frm_form_field.frm_total_big input,
1528 1517 .frm_form_field.frm_total_big textarea,
@@ -1531,10 +1520,8 @@
1531 1520 opacity:1;
1532 1521 background-color:transparent !important;
1533 1522 border:none !important;
1534 1523 font-weight:bold;
1535 - -moz-box-shadow:none;
1536 - -webkit-box-shadow:none;
1537 1524 width:auto !important;
1538 1525 height:auto !important;
1539 1526 box-shadow:none !important;
1540 1527 display:inline;
@@ -1554,10 +1541,8 @@
1554 1541 .frm_form_field.frm_total input:focus,
1555 1542 .frm_form_field.frm_total textarea:focus{
1556 1543 background-color:transparent;
1557 1544 border:none;
1558 - -moz-box-shadow:none;
1559 - -webkit-box-shadow:none;
1560 1545 box-shadow:none;
1561 1546 }
1562 1547
1563 1548 .frm_form_field.frm_label_justify .frm_primary_label{
@@ -1582,13 +1567,8 @@
1582 1567 .frm_clearfix{
1583 1568 display:block;
1584 1569 }
1585 1570
1586 -.with_frm_style .frm_repeat_sec .frm_form_field.frm_repeat_buttons .frm_icon_font::before {
1587 - color:<?php echo esc_html( $defaults['repeat_icon_color'] . $important ); ?>;
1588 - color:var(--repeat-icon-color)<?php echo esc_html( $important ); ?>;
1589 -}
1590 -
1591 1571 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-first,
1592 1572 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-middle,
1593 1573 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1594 1574 margin-bottom: 0 !important;
@@ -1593,11 +1573,10 @@
1593 1573 .with_frm_style .frm_combo_inputs_container > .frm_form_subfield-last {
1594 1574 margin-bottom: 0 !important;
1595 1575 }
1596 1576
1577 +
1597 1578 <?php
1598 -FrmStylesHelper::maybe_include_font_icon_css();
1599 -
1600 1579 /**
1601 1580 * Call action so other plugins can add additional CSS.
1602 1581 *
1603 1582 * @param array $args {
@@ -1651,9 +1630,8 @@
1651 1630 max-width:302px;
1652 1631 border-right:1px solid #d3d3d3;
1653 1632 border-radius:4px;
1654 1633 box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1655 - -moz-box-shadow:2px 0px 4px -1px rgba(0,0,0,.08);
1656 1634 }
1657 1635
1658 1636 .with_frm_style .g-recaptcha iframe,
1659 1637 .with_frm_style .frm-g-recaptcha iframe{
@@ -1658,8 +1636,15 @@
1658 1636 .with_frm_style .g-recaptcha iframe,
1659 1637 .with_frm_style .frm-g-recaptcha iframe{
1660 1638 width:100%;
1661 1639 }
1640 +}
1641 +
1642 +.frm-card-element .sq-card-wrapper .sq-card-message {
1643 + margin-bottom: 0;
1644 +}
1645 +.frm-card-errors:empty {
1646 + margin: 0;
1662 1647 }
1663 1648 <?php
1664 1649
1665 1650 echo strip_tags( FrmStylesController::get_custom_css() ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped