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