PluginProbe
WPFunnels – Funnel Builder for WooCommerce with Checkout & One Click Upsell / 3.12.13
WPFunnels – Funnel Builder for WooCommerce with Checkout & One Click Upsell v3.12.13
3.13.3 3.13.2 3.13.1 3.13.0 3.12.13 3.12.12 3.12.11 3.12.10 3.12.9 3.12.8 3.12.7 3.12.6 3.12.5 3.12.4 3.12.3 3.12.1 3.12.2 3.12.0 3.11.1 3.11.0 3.10.9 3.10.8 3.10.7 3.10.6 2.8.16 All 261 releases
wpfunnels / admin / assets / css / wpfnl-admin.css

wpfnl-admin.css in WPFunnels – Funnel Builder for WooCommerce with Checkout & One Click Upsell 3.12.13, at admin/assets/css/wpfnl-admin.css

34,657 lines 1.1 MB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @charset "UTF-8";
2 @import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&display=swap");
3 .wpfnl * {
4 margin: 0px;
5 padding: 0px;
6 box-sizing: border-box;
7 }
8 .wpfnl *:focus {
9 box-shadow: none;
10 outline: none;
11 }
12 .wpfnl *:not(i) {
13 font-family: "Roboto", sans-serif;
14 }
15 .wpfnl p {
16 -webkit-font-smoothing: antialiased;
17 -moz-osx-font-smoothing: grayscale;
18 font-family: "Roboto", sans-serif;
19 }
20 .wpfnl a,
21 .wpfnl p,
22 .wpfnl span,
23 .wpfnl section,
24 .wpfnl label,
25 .wpfnl div {
26 font-size: 14px;
27 color: #7A8B9A;
28 font-weight: 400;
29 line-height: 1.4;
30 }
31 .wpfnl a {
32 text-decoration: none;
33 color: #6E42D3;
34 }
35 .wpfnl a:hover {
36 color: #4C25A5;
37 }
38 .wpfnl h1, .wpfnl h2, .wpfnl h3, .wpfnl h4, .wpfnl h5, .wpfnl h6, .wpfnl p, .wpfnl figur, .wpfnl a {
39 margin: 0px;
40 }
41 .wpfnl h1, .wpfnl h2, .wpfnl h3, .wpfnl h4, .wpfnl h5, .wpfnl h6 {
42 font-weight: normal;
43 -webkit-font-variant-ligatures: common-ligatures;
44 font-variant-ligatures: common-ligatures;
45 }
46 .wpfnl a:hover,
47 .wpfnl a:focus,
48 .wpfnl input:focus,
49 .wpfnl button:focus,
50 .wpfnl a:active {
51 text-decoration: none;
52 outline: none;
53 outline-offset: 0px;
54 box-shadow: none;
55 }
56 .wpfnl ul {
57 list-style: none;
58 margin: 0;
59 padding: 0;
60 }
61 .wpfnl img {
62 display: block;
63 max-width: 100%;
64 }
65
66 .wp-funnels_page_edit_funnel #wpcontent,
67 .wpfunnels_page_edit_funnel #wpcontent {
68 padding-left: 0;
69 }
70
71 .wpfunnels_page_edit_funnel #wpfunnels-app,
72 .wp-funnels_page_edit_funnel #wpfunnels-app {
73 margin: 0;
74 }
75
76 #wpfunnels-app:has([data-tour=yes]) {
77 pointer-events: none;
78 }
79
80 .wpfnl {
81 background: #f6f5fa;
82 position: relative;
83 overflow-x: hidden;
84 }
85 .wpfnl::-webkit-scrollbar {
86 width: 3px;
87 }
88 .wpfnl::-webkit-scrollbar-track {
89 background: #f2f5f8;
90 }
91 .wpfnl::-webkit-scrollbar-thumb {
92 background-color: #6E42D3;
93 border-radius: 20px;
94 }
95 .wpfnl input[type=time],
96 .wpfnl input[type=date],
97 .wpfnl input[type=search],
98 .wpfnl input[type=url],
99 .wpfnl input[type=tel],
100 .wpfnl input[type=number],
101 .wpfnl input[type=password],
102 .wpfnl input[type=email],
103 .wpfnl input[type=text],
104 .wpfnl textarea,
105 .wpfnl select {
106 font-size: 14px;
107 color: #7A8B9A;
108 padding: 5px 15px;
109 height: 36px;
110 width: 100%;
111 min-width: 190px;
112 border-radius: 6px;
113 display: block;
114 border: 1px solid #E5E8F3;
115 }
116 .wpfnl input[type=time]::-webkit-input-placeholder, .wpfnl input[type=time]::-moz-placeholder, .wpfnl input[type=time]:-ms-input-placeholder,
117 .wpfnl input[type=date]::-webkit-input-placeholder,
118 .wpfnl input[type=date]::-moz-placeholder,
119 .wpfnl input[type=date]:-ms-input-placeholder,
120 .wpfnl input[type=search]::-webkit-input-placeholder,
121 .wpfnl input[type=search]::-moz-placeholder,
122 .wpfnl input[type=search]:-ms-input-placeholder,
123 .wpfnl input[type=url]::-webkit-input-placeholder,
124 .wpfnl input[type=url]::-moz-placeholder,
125 .wpfnl input[type=url]:-ms-input-placeholder,
126 .wpfnl input[type=tel]::-webkit-input-placeholder,
127 .wpfnl input[type=tel]::-moz-placeholder,
128 .wpfnl input[type=tel]:-ms-input-placeholder,
129 .wpfnl input[type=number]::-webkit-input-placeholder,
130 .wpfnl input[type=number]::-moz-placeholder,
131 .wpfnl input[type=number]:-ms-input-placeholder,
132 .wpfnl input[type=password]::-webkit-input-placeholder,
133 .wpfnl input[type=password]::-moz-placeholder,
134 .wpfnl input[type=password]:-ms-input-placeholder,
135 .wpfnl input[type=email]::-webkit-input-placeholder,
136 .wpfnl input[type=email]::-moz-placeholder,
137 .wpfnl input[type=email]:-ms-input-placeholder,
138 .wpfnl input[type=text]::-webkit-input-placeholder,
139 .wpfnl input[type=text]::-moz-placeholder,
140 .wpfnl input[type=text]:-ms-input-placeholder,
141 .wpfnl textarea::-webkit-input-placeholder,
142 .wpfnl textarea::-moz-placeholder,
143 .wpfnl textarea:-ms-input-placeholder,
144 .wpfnl select::-webkit-input-placeholder,
145 .wpfnl select::-moz-placeholder,
146 .wpfnl select:-ms-input-placeholder {
147 color: #7A8B9A;
148 }
149 .wpfnl input[type=time]:focus,
150 .wpfnl input[type=date]:focus,
151 .wpfnl input[type=search]:focus,
152 .wpfnl input[type=url]:focus,
153 .wpfnl input[type=tel]:focus,
154 .wpfnl input[type=number]:focus,
155 .wpfnl input[type=password]:focus,
156 .wpfnl input[type=email]:focus,
157 .wpfnl input[type=text]:focus,
158 .wpfnl textarea:focus,
159 .wpfnl select:focus {
160 outline: none;
161 box-shadow: none;
162 border-color: #E5E8F3;
163 color: #7A8B9A;
164 }
165 .wpfnl input[type=time]:hover,
166 .wpfnl input[type=date]:hover,
167 .wpfnl input[type=search]:hover,
168 .wpfnl input[type=url]:hover,
169 .wpfnl input[type=tel]:hover,
170 .wpfnl input[type=number]:hover,
171 .wpfnl input[type=password]:hover,
172 .wpfnl input[type=email]:hover,
173 .wpfnl input[type=text]:hover,
174 .wpfnl textarea:hover,
175 .wpfnl select:hover {
176 color: #7A8B9A;
177 }
178 .wpfnl input[type=time][readonly],
179 .wpfnl input[type=date][readonly],
180 .wpfnl input[type=search][readonly],
181 .wpfnl input[type=url][readonly],
182 .wpfnl input[type=tel][readonly],
183 .wpfnl input[type=number][readonly],
184 .wpfnl input[type=password][readonly],
185 .wpfnl input[type=email][readonly],
186 .wpfnl input[type=text][readonly],
187 .wpfnl textarea[readonly],
188 .wpfnl select[readonly] {
189 cursor: not-allowed;
190 background-color: #eee;
191 }
192 .wpfnl textarea {
193 resize: none;
194 min-height: 130px;
195 padding: 11px 15px;
196 }
197 .wpfnl select {
198 max-width: inherit;
199 }
200 .wpfnl a,
201 .wpfnl svg path,
202 .wpfnl button[type=submit],
203 .wpfnl input[type=button],
204 .wpfnl input[type=submit],
205 .wpfnl .btn-default,
206 .wpfnl .transition-3ms,
207 .wpfnl .steps-settings .product-options__tab-nav li a:after,
208 .steps-settings .product-options__tab-nav li .wpfnl a:after {
209 transition: all 0.3s ease;
210 }
211 .wpfnl .transition-5ms {
212 transition: all 0.5s ease;
213 }
214 .wpfnl input[type=submit],
215 .wpfnl button[type=submit],
216 .wpfnl .btn-default {
217 display: inline-block;
218 border: none;
219 height: 38px;
220 font-size: 14px;
221 line-height: 38px;
222 color: #fff;
223 font-weight: 500;
224 padding: 0 30px;
225 min-width: 130px;
226 cursor: pointer;
227 text-align: center;
228 letter-spacing: 0.2px;
229 border-radius: 10px;
230 text-transform: capitalize;
231 background-color: #6E42D3;
232 }
233 .wpfnl input[type=submit]:hover,
234 .wpfnl button[type=submit]:hover,
235 .wpfnl .btn-default:hover {
236 background-color: #4C25A5;
237 color: #fff;
238 }
239 .wpfnl label,
240 .wpfnl .label {
241 font-weight: 500;
242 font-size: 14px;
243 line-height: 15px;
244 color: #363B4E;
245 }
246 .wpfnl .wp-switch-editor {
247 float: left;
248 box-sizing: content-box;
249 position: relative;
250 top: 1px;
251 background: #f0f0f1;
252 color: #646970;
253 cursor: pointer;
254 font-size: 13px;
255 line-height: 1.46153846;
256 height: 20px;
257 margin: 5px 0 0 5px;
258 padding: 3px 8px 4px;
259 border: 1px solid #dcdcde;
260 }
261 .wpfnl .fw-400 {
262 font-weight: 400;
263 }
264 .wpfnl .fw-500 {
265 font-weight: 500;
266 }
267 .wpfnl .pos-relative {
268 position: relative;
269 }
270 .wpfnl .roboto {
271 font-family: "Roboto", sans-serif;
272 }
273 .wpfnl .overlay {
274 position: absolute;
275 left: 0;
276 top: 0;
277 width: 100%;
278 height: 100%;
279 }
280 .wpfnl .pro-tag {
281 background: #4CBB17;
282 box-shadow: 0px 3px 3px rgba(175, 175, 206, 0.3);
283 border-radius: 3px;
284 font-weight: 400;
285 font-size: 13px;
286 line-height: 15px;
287 color: #fff;
288 display: inline-block;
289 text-transform: capitalize;
290 padding: 2px 4px 3px;
291 }
292 .wpfnl .pro-tag a {
293 color: #fff;
294 line-height: 1;
295 font-size: 13px;
296 }
297 .wpfnl #wpfnl-pro-modal {
298 display: none;
299 }
300 .wpfnl .quick-toastify-successful-notification .quick-toastify-alert-toast {
301 z-index: 9999999999;
302 }
303 .wpfnl .no-product-notice {
304 font-size: 11px;
305 font-style: italic;
306 font-weight: 500;
307 text-transform: none;
308 display: block;
309 color: #f34252;
310 }
311 .wpfnl .wpfnl-selected-item {
312 border: 1px solid #e4e6eb;
313 border-radius: 4px;
314 font-size: 13px;
315 line-height: 1;
316 letter-spacing: -0.01em;
317 color: #667085;
318 display: inline-block;
319 padding: 3px 25px 5px 6px;
320 margin: 3px;
321 position: relative;
322 }
323 .wpfnl .wpfnl-selected-item .remove-item {
324 padding: 2px 5px 2px;
325 cursor: pointer;
326 position: absolute;
327 top: 0;
328 right: 0;
329 height: 100%;
330 border-left: 1px solid #e4e6eb;
331 display: flex;
332 align-items: center;
333 justify-content: center;
334 }
335 .wpfnl .wpfnl-selected-item .remove-item svg {
336 width: 8px;
337 height: 8px;
338 }
339 @media screen and (max-width: 782px) {
340 .wpfnl input[type=text],
341 .wpfnl input[type=password],
342 .wpfnl input[type=date],
343 .wpfnl input[type=datetime],
344 .wpfnl input[type=datetime-local],
345 .wpfnl input[type=email],
346 .wpfnl input[type=month],
347 .wpfnl input[type=number],
348 .wpfnl input[type=search],
349 .wpfnl input[type=tel],
350 .wpfnl input[type=time],
351 .wpfnl input[type=url],
352 .wpfnl input[type=week] {
353 min-height: auto;
354 }
355 }
356 .wpfnl .hints {
357 font-size: 13px;
358 font-style: italic;
359 color: #7A8B9A;
360 margin-top: 4px;
361 display: inline-block;
362 }
363 .wpfnl .top-align {
364 align-items: flex-start;
365 }
366 .wpfnl .top-align label {
367 padding-top: 10px;
368 }
369 .wpfnl .not-clickable-overlay {
370 position: fixed;
371 top: 0;
372 left: 0;
373 width: 100%;
374 height: 100%;
375 background-color: rgba(0, 0, 0, 0.3);
376 backdrop-filter: blur(4px);
377 z-index: 999;
378 display: none;
379 flex-flow: column;
380 align-items: center;
381 justify-content: center;
382 }
383 .wpfnl .not-clickable-overlay.template-importing {
384 background-color: rgba(255, 255, 255, 0);
385 backdrop-filter: blur(0);
386 }
387 .wpfnl .not-clickable-overlay .import-message {
388 color: #ffffff;
389 font-size: 24px;
390 font-weight: 500;
391 display: none;
392 }
393 .wpfnl .wpfnl-notice {
394 display: flex;
395 align-items: flex-start;
396 gap: 12px;
397 padding: 20px 24px;
398 font-size: 14px;
399 line-height: 1.5;
400 color: #363B4E;
401 border-radius: 10px;
402 border: 1px solid #F68524;
403 background: rgba(246, 133, 36, 0.1);
404 }
405 .wpfnl .wpfnl-notice svg {
406 flex-shrink: 0;
407 margin-top: 2px;
408 }
409 .wpfnl .wpfnl-notice .wpfnl-notice-content {
410 flex: 1;
411 }
412 .wpfnl .wpfnl-notice .wpfnl-notice-content strong {
413 display: block;
414 font-weight: 500;
415 color: #363B4E;
416 margin-bottom: 4px;
417 font-size: 16px;
418 }
419 .wpfnl .wpfnl-notice .wpfnl-notice-content p {
420 margin: 0;
421 line-height: 1.4;
422 color: #363B4E;
423 }
424 .wpfnl .wpfnl-canvas-helper {
425 display: flex;
426 flex-flow: row;
427 align-items: center;
428 position: fixed;
429 bottom: 32px;
430 right: 24px;
431 z-index: 9;
432 }
433 .wpfnl .wpfnl-canvas-helper .helper-btn {
434 background: #1e1e1e;
435 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.16);
436 border-radius: 100px;
437 width: 40px;
438 height: 40px;
439 display: flex;
440 align-items: center;
441 justify-content: center;
442 border: none;
443 cursor: pointer;
444 }
445 .wpfnl .wpfnl-canvas-helper .help-resource {
446 position: absolute;
447 right: 0;
448 bottom: calc(100% + 12px);
449 background: #fff;
450 border-radius: 5px;
451 padding: 8px;
452 width: 170px;
453 border: 1px solid #EDECF2;
454 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
455 display: none;
456 }
457 .wpfnl .wpfnl-canvas-helper .help-resource:before {
458 content: "";
459 position: absolute;
460 bottom: -7px;
461 right: 15px;
462 width: 9px;
463 height: 9px;
464 background: #fff;
465 transform: rotate(45deg);
466 border-right: 1px solid #e7e7e7;
467 border-bottom: 1px solid #e7e7e7;
468 }
469 .wpfnl .wpfnl-canvas-helper .help-resource a {
470 font-size: 13px;
471 display: block;
472 color: #363B4E;
473 line-height: 1.2;
474 padding: 7px 10px 6px;
475 font-weight: 500;
476 border-radius: 5px;
477 }
478 .wpfnl .wpfnl-canvas-helper .help-resource a:hover {
479 background: #f6f5fa;
480 }
481 .wpfnl .wpfnl-canvas-helper.show-helpers .help-resource {
482 display: block;
483 }
484 .wpfnl .upgrade-to-pro-hoverlay {
485 position: absolute;
486 inset: 0;
487 background: rgba(255, 255, 255, 0.6);
488 display: flex;
489 align-items: center;
490 justify-content: center;
491 border-radius: 10px;
492 z-index: 1;
493 }
494 .wpfnl .upgrade-to-pro-hoverlay .btn-default {
495 display: flex;
496 align-items: center;
497 justify-content: center;
498 gap: 10px;
499 background: #2fcf5c;
500 padding: 10px 15px;
501 line-height: 1;
502 height: auto;
503 font-size: 14px;
504 border-radius: 10px;
505 }
506 .wpfnl .upgrade-to-pro-hoverlay .btn-default circle {
507 fill: #fff;
508 }
509 .wpfnl .upgrade-to-pro-hoverlay .btn-default path {
510 fill: #2fcf5c;
511 }
512 .wpfnl .upgrade-to-pro-hoverlay .btn-default:hover {
513 background: #1a8939;
514 }
515
516 body.wpfunnels-body #wpcontent {
517 padding-left: 0;
518 }
519
520 .wpfnl-switcher {
521 position: relative;
522 }
523 .wpfnl-switcher input[type=checkbox] {
524 display: none;
525 }
526 .wpfnl-switcher label {
527 display: block;
528 position: relative;
529 cursor: pointer;
530 outline: none;
531 user-select: none;
532 width: 40px;
533 height: 22px;
534 border-radius: 50px;
535 background-color: #CDC9DB;
536 transition: all 0.3s ease;
537 }
538 .wpfnl-switcher label:after {
539 content: "";
540 width: 16px;
541 height: 16px;
542 filter: drop-shadow(0px 2px 2px rgba(193, 193, 218, 0.45));
543 background-color: #ffffff;
544 border-radius: 100%;
545 position: absolute;
546 top: 3px;
547 left: 3px;
548 transition: all 0.3s ease;
549 }
550 .wpfnl-switcher input[type=checkbox]:checked + label {
551 border-color: #6E42D3;
552 background-color: #6E42D3;
553 }
554 .wpfnl-switcher input[type=checkbox]:checked + label:after {
555 margin-left: 18px;
556 filter: none;
557 }
558
559 .wpfnl-switcher.sm label {
560 width: 28px;
561 height: 16px;
562 }
563
564 .wpfnl-switcher.sm label:after {
565 width: 10px;
566 height: 10px;
567 top: 3px;
568 left: 3px;
569 }
570
571 .wpfnl-switcher.sm input[type=checkbox]:checked + label:after {
572 margin-left: 12px;
573 }
574
575 .wpfnl-switcher.extra-sm label {
576 width: 28px;
577 height: 16px;
578 border: none;
579 background-color: #BEC8D0;
580 }
581
582 .wpfnl-switcher.extra-sm label:after {
583 width: 10px;
584 height: 10px;
585 top: 3px;
586 left: 3px;
587 }
588
589 .wpfnl-switcher.extra-sm input[type=checkbox]:checked + label:after {
590 margin-left: 12px;
591 }
592
593 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher label, .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field .wpfnl-switcher label, .step-condition-drawer .enable-disable-switcher .wpfnl-switcher label, .steps-page__header-right .funnel-stats label, .steps-page__header-center .enable-gbf label {
594 width: 26px;
595 height: 16px;
596 border: none;
597 background: #BEC8D0;
598 }
599 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher label:after, .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field .wpfnl-switcher label:after, .step-condition-drawer .enable-disable-switcher .wpfnl-switcher label:after, .steps-page__header-right .funnel-stats label:after, .steps-page__header-center .enable-gbf label:after {
600 width: 14px;
601 height: 14px;
602 top: 1px;
603 left: 1px;
604 }
605 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher input[type=checkbox]:checked + label, .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field .wpfnl-switcher input[type=checkbox]:checked + label, .step-condition-drawer .enable-disable-switcher .wpfnl-switcher input[type=checkbox]:checked + label, .steps-page__header-right .funnel-stats input[type=checkbox]:checked + label, .steps-page__header-center .enable-gbf input[type=checkbox]:checked + label {
606 background: #6E42D3;
607 }
608 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher input[type=checkbox]:checked + label:after, .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field .wpfnl-switcher input[type=checkbox]:checked + label:after, .step-condition-drawer .enable-disable-switcher .wpfnl-switcher input[type=checkbox]:checked + label:after, .steps-page__header-right .funnel-stats input[type=checkbox]:checked + label:after, .steps-page__header-center .enable-gbf input[type=checkbox]:checked + label:after {
609 margin-left: 10px;
610 }
611
612 .wpfnl-checkbox input[type=checkbox] {
613 display: none;
614 }
615 .wpfnl-checkbox.no-title label {
616 height: 14px;
617 }
618 .wpfnl-checkbox label {
619 font-size: 12px;
620 line-height: 14px;
621 font-weight: 400;
622 color: #7A8B9A;
623 position: relative;
624 padding-left: 29px;
625 display: inline-block;
626 text-transform: capitalize;
627 cursor: pointer;
628 }
629 .wpfnl-checkbox label:before {
630 content: "";
631 position: absolute;
632 left: 0;
633 top: -3px;
634 width: 18px;
635 height: 18px;
636 border-radius: 4px;
637 border: 1px solid #bdc7eb;
638 background-color: #f6f6f8;
639 transition: all 0.3s ease;
640 }
641 .wpfnl-checkbox label:after {
642 content: "";
643 position: absolute;
644 left: 5px;
645 top: 3px;
646 width: 9px;
647 height: 4px;
648 transform: rotate(-45deg);
649 border-bottom: 2px solid #fff;
650 border-left: 2px solid #fff;
651 transition: all 0.3s ease;
652 opacity: 0;
653 visibility: hidden;
654 }
655 .wpfnl-checkbox input[type=checkbox]:checked + label::before {
656 background-color: #6E42D3;
657 border-color: #6E42D3;
658 }
659 .wpfnl-checkbox input[type=checkbox]:checked + label::after {
660 opacity: 1;
661 visibility: visible;
662 }
663
664 .wpfnl-radiobtn input[type=radio] {
665 display: none;
666 }
667 .wpfnl-radiobtn.no-title label {
668 height: 16px;
669 }
670 .wpfnl-radiobtn label {
671 font-size: 12px;
672 line-height: 14px;
673 font-weight: 400;
674 color: #7A8B9A;
675 position: relative;
676 padding-left: 29px;
677 display: inline-block;
678 text-transform: capitalize;
679 cursor: pointer;
680 }
681 .wpfnl-radiobtn label::before {
682 content: "";
683 position: absolute;
684 left: 0;
685 top: -3px;
686 width: 18px;
687 height: 18px;
688 border-radius: 100%;
689 background: #F7F7FA;
690 border: 1px solid #bdc7eb;
691 transition: all 0.3s ease;
692 }
693 .wpfnl-radiobtn label::after {
694 content: "";
695 position: absolute;
696 left: 4px;
697 top: 1px;
698 width: 10px;
699 height: 10px;
700 border-radius: 100%;
701 background: #6E42D3;
702 transform: scale(0);
703 transition: all 0.3s ease;
704 }
705 .wpfnl-radiobtn input[type=radio]:checked + label::before {
706 border-color: #6E42D3;
707 }
708 .wpfnl-radiobtn input[type=radio]:checked + label::after {
709 transform: scale(1);
710 }
711
712 .wpfnl-tooltip {
713 display: inline-block;
714 position: relative;
715 padding: 0px 3px 2px;
716 height: 15px;
717 }
718 .wpfnl-tooltip p {
719 position: absolute;
720 bottom: 24px;
721 left: 50%;
722 transform: translateX(-50%);
723 background: #525252;
724 color: #fff;
725 padding: 7px 10px;
726 border-radius: 3px;
727 font-size: 13px;
728 line-height: 1.4;
729 min-width: 240px;
730 text-align: center;
731 opacity: 0;
732 visibility: hidden;
733 transition: all 0.3s ease;
734 margin: 0;
735 }
736 .wpfnl-tooltip p:before {
737 content: "";
738 position: absolute;
739 left: 50%;
740 bottom: -4px;
741 width: 10px;
742 height: 10px;
743 background: #525252;
744 margin-left: -5px;
745 transform: rotate(45deg);
746 }
747 .wpfnl-tooltip:hover p {
748 opacity: 1;
749 visibility: visible;
750 }
751
752 .wpfnl-pagination {
753 display: flex;
754 align-items: center;
755 justify-content: center;
756 }
757 .wpfnl-pagination .nav-link {
758 width: 30px;
759 height: 30px;
760 border-radius: 6px;
761 background-color: transparent;
762 font-size: 16px;
763 color: #363b4e;
764 font-weight: 400;
765 display: flex;
766 flex-flow: column;
767 align-items: center;
768 justify-content: center;
769 margin: 0 6px;
770 }
771 .wpfnl-pagination .nav-link.active, .wpfnl-pagination .nav-link:hover {
772 background-color: #6E42D3;
773 color: #fff;
774 box-shadow: 0px 10px 16px rgba(97, 103, 116, 0.15);
775 }
776 .wpfnl-pagination .nav-link.next, .wpfnl-pagination .nav-link.prev {
777 background-color: #ffffff;
778 }
779 .wpfnl-pagination .nav-link.next:hover, .wpfnl-pagination .nav-link.prev:hover {
780 background-color: #6E42D3;
781 }
782 .wpfnl-pagination .nav-link.next:hover svg path, .wpfnl-pagination .nav-link.prev:hover svg path {
783 fill: #fff;
784 }
785
786 .wpfnl-loader {
787 border: 2px solid #8265c5;
788 border-radius: 50%;
789 border-top: 2px solid #fff;
790 width: 13px;
791 height: 13px;
792 animation: spin 0.7s linear infinite;
793 display: none;
794 margin-left: 4px;
795 }
796
797 @-webkit-keyframes spin {
798 0% {
799 -webkit-transform: rotate(0deg);
800 }
801 100% {
802 -webkit-transform: rotate(360deg);
803 }
804 }
805 @keyframes spin {
806 0% {
807 transform: rotate(0deg);
808 }
809 100% {
810 transform: rotate(360deg);
811 }
812 }
813 .select2-container.select2-container--default.select2-container--open {
814 background: #ffffff;
815 border-radius: 10px;
816 width: 248px;
817 border: 1px solid #E5E8F3;
818 z-index: 99;
819 }
820 .select2-container.select2-container--default.select2-container--open .select2-search--dropdown {
821 display: block;
822 width: 100%;
823 padding: 10px;
824 box-sizing: border-box;
825 }
826 .select2-container.select2-container--default.select2-container--open .select2-search__field {
827 width: 100%;
828 background: #fff;
829 border: 1px solid #E5E8F3;
830 padding: 0 8px;
831 }
832 .select2-container.select2-container--default.select2-container--open .select2-search__field:focus {
833 border-color: #E5E8F3;
834 box-shadow: none;
835 outline: none;
836 }
837 .select2-container.select2-container--default.select2-container--open .select2-dropdown {
838 background-color: transparent;
839 border: none;
840 border-radius: unset;
841 box-sizing: border-box;
842 display: block;
843 position: relative;
844 width: 100% !important;
845 }
846 .select2-container.select2-container--default.select2-container--open .select2-results__message {
847 margin-bottom: 0;
848 }
849 .select2-container.select2-container--default.select2-container--open .select2-results__option {
850 border-top: 1px solid #E5E8F3;
851 padding: 10px 15px;
852 margin: 0;
853 cursor: pointer;
854 }
855 .select2-container.select2-container--default.select2-container--open .select2-results__option--highlighted {
856 background: #eee;
857 color: #3c434a;
858 }
859 .select2-container.select2-container--default.select2-container--open .select2-results__options {
860 margin: 0;
861 max-height: 210px;
862 overflow: auto;
863 }
864 .select2-container.select2-container--default.select2-container--open .select2-results__options::-webkit-scrollbar {
865 width: 3px;
866 }
867 .select2-container.select2-container--default.select2-container--open .select2-results__options::-webkit-scrollbar-track {
868 background: #f2f5f8;
869 }
870 .select2-container.select2-container--default.select2-container--open .select2-results__options::-webkit-scrollbar-thumb {
871 background-color: #6E42D3;
872 border-radius: 20px;
873 }
874
875 .select2-container--default .select2-selection--single .select2-selection__clear {
876 float: none !important;
877 cursor: pointer;
878 margin-right: 3px;
879 }
880
881 .wpfnl .wpfnl-alert {
882 color: #383d41;
883 font-size: 13px;
884 font-weight: 500;
885 border-radius: 10px;
886 cursor: default;
887 display: none;
888 }
889 .wpfnl .wpfnl-alert.box {
890 background-color: #e2e3e5;
891 padding: 8px 20px;
892 border: 1px solid #d6d8db;
893 }
894 .wpfnl .wpfnl-alert.wpfnl-success {
895 color: #269c41;
896 }
897 .wpfnl .wpfnl-alert.wpfnl-success.box {
898 background-color: #d4edda;
899 border-color: #c3e6cb;
900 }
901 .wpfnl .wpfnl-alert.wpfnl-error {
902 color: #d63342;
903 }
904 .wpfnl .wpfnl-alert.wpfnl-error.box {
905 background-color: #f8d7da;
906 border-color: #f5c6cb;
907 }
908 .wpfnl .wpfnl-alert.wpfnl-warn {
909 color: #856404;
910 }
911 .wpfnl .wpfnl-alert.wpfnl-warn.box {
912 background-color: #fff3cd;
913 border-color: #ffeeba;
914 }
915
916 .wpfnl-hamburger {
917 display: block;
918 width: 20px;
919 height: 14px;
920 border-top: 2px solid #6E42D3;
921 border-bottom: 2px solid #6E42D3;
922 position: relative;
923 cursor: pointer;
924 }
925 .wpfnl-hamburger:before {
926 content: "";
927 position: absolute;
928 top: 50%;
929 left: 0;
930 width: 100%;
931 height: 2px;
932 background: #6E42D3;
933 margin-top: -1px;
934 }
935
936 ul.wpfnl-dropdown {
937 display: flex;
938 flex-flow: column;
939 gap: 2px;
940 position: absolute;
941 background: #fff;
942 right: 0;
943 top: 37px;
944 width: 220px;
945 border-radius: 10px;
946 border: 1px solid #EBEDF0;
947 box-shadow: 0 6px 8px 0 rgba(191, 191, 191, 0.1);
948 z-index: 5;
949 padding: 9px;
950 opacity: 0;
951 visibility: hidden;
952 transition: all 0.3s ease;
953 }
954 ul.wpfnl-dropdown:after {
955 content: "";
956 position: absolute;
957 right: 21px;
958 top: -6px;
959 width: 10px;
960 height: 10px;
961 background: white;
962 transform: rotate(45deg);
963 z-index: 0;
964 border-top: 1px solid #E5E8F3;
965 border-left: 1px solid #E5E8F3;
966 }
967 ul.wpfnl-dropdown li a {
968 font-size: 14px;
969 line-height: 15px;
970 color: #7A8B9A;
971 font-weight: 400;
972 margin: 0;
973 padding: 7px 9px;
974 display: flex;
975 flex-flow: row;
976 align-items: center;
977 position: relative;
978 z-index: 1;
979 border-radius: 10px;
980 }
981 ul.wpfnl-dropdown li a svg {
982 margin-right: 6px;
983 width: 19px;
984 height: 19px;
985 }
986 ul.wpfnl-dropdown li a:hover {
987 background: #F6F8FA;
988 color: #7A8B9A;
989 }
990
991 .wpfnl-delete-alert-wrapper {
992 position: fixed;
993 top: 0;
994 right: 0;
995 padding: 15px;
996 width: calc(100% - 160px);
997 height: 100%;
998 background: rgba(21, 17, 29, 0.3);
999 backdrop-filter: blur(4px);
1000 z-index: 999;
1001 display: none;
1002 flex-flow: row wrap;
1003 align-items: center;
1004 justify-content: center;
1005 }
1006 .wpfnl-delete-alert-wrapper.show-alert {
1007 display: flex;
1008 }
1009 .wpfnl-delete-alert-wrapper.hide-alert {
1010 display: none;
1011 }
1012 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirmation {
1013 background: #fff;
1014 box-shadow: 0 1px 34px rgba(0, 0, 0, 0.06);
1015 border-radius: 10px;
1016 padding: 30px 20px;
1017 width: 100%;
1018 max-width: 420px;
1019 text-align: center;
1020 animation: wpfnl-bounce 0.3s;
1021 }
1022 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirmation h3 {
1023 font-size: 16px;
1024 font-weight: 500;
1025 }
1026 .wpfnl-delete-alert-wrapper .icon {
1027 width: 50px;
1028 height: 50px;
1029 border: 2px solid #e65555;
1030 display: flex;
1031 align-items: center;
1032 justify-content: center;
1033 margin: 0 auto 20px;
1034 border-radius: 100%;
1035 }
1036 .wpfnl-delete-alert-wrapper .icon svg {
1037 width: 18px;
1038 height: 18px;
1039 }
1040 .wpfnl-delete-alert-wrapper .icon svg path {
1041 stroke: #e65555;
1042 }
1043 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn {
1044 display: flex;
1045 flex-flow: row;
1046 align-items: center;
1047 justify-content: center;
1048 margin-top: 30px;
1049 }
1050 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn li {
1051 margin: 0 10px;
1052 }
1053 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default {
1054 height: 41px;
1055 line-height: 42px;
1056 padding: 0 20px;
1057 min-width: 110px;
1058 border-radius: 5px;
1059 }
1060 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.yes {
1061 background-color: #e65555;
1062 }
1063 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.yes:hover {
1064 background-color: #de6464;
1065 }
1066 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.cancel {
1067 background-color: #eee;
1068 color: #333;
1069 }
1070 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.cancel:hover {
1071 background-color: #e2e2e2;
1072 }
1073
1074 .delete-alert-new-ui .wpfnl-delete-confirmation {
1075 position: relative;
1076 max-width: 514px;
1077 background: #F6F5FA;
1078 border-radius: 14px;
1079 padding: 0;
1080 text-align: left;
1081 }
1082 .delete-alert-new-ui .icon {
1083 width: 46px;
1084 height: 46px;
1085 border: none;
1086 margin: 0;
1087 border-radius: 100%;
1088 box-shadow: 0px 1px 1px #DADADA;
1089 background: #fff;
1090 position: absolute;
1091 right: -12px;
1092 top: -12px;
1093 cursor: pointer;
1094 }
1095 .delete-alert-new-ui .icon svg path {
1096 stroke: #A7A8B3;
1097 }
1098 .delete-alert-new-ui .wpfnl-delete-confirm-body {
1099 padding: 26px 20px 26px 26px;
1100 }
1101 .delete-alert-new-ui .wpfnl-delete-confirm-body h3 {
1102 font-weight: 500;
1103 font-size: 18px;
1104 line-height: 1.2;
1105 color: #2D3149;
1106 display: flex;
1107 align-items: center;
1108 gap: 7px;
1109 }
1110 .delete-alert-new-ui .wpfnl-delete-confirm-body h3 svg {
1111 position: relative;
1112 top: -2px;
1113 }
1114 .delete-alert-new-ui .wpfnl-delete-confirm-body h3 svg path {
1115 fill: #EC5956;
1116 }
1117 .delete-alert-new-ui .wpfnl-delete-confirm-body p {
1118 color: #9398A5;
1119 margin-top: 4px;
1120 }
1121 .delete-alert-new-ui .wpfnl-delete-confirm-btn {
1122 justify-content: flex-end;
1123 margin-top: 0;
1124 border-top: 1px solid #E2E2E2;
1125 padding: 20px 28px;
1126 gap: 14px;
1127 }
1128 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default {
1129 font-size: 15px;
1130 height: 40px;
1131 line-height: 41px;
1132 padding: 0 18px;
1133 min-width: auto;
1134 border-radius: 10px;
1135 }
1136 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default.cancel {
1137 background-color: transparent;
1138 color: #2D3149;
1139 border: 1px solid #E4E6EB;
1140 }
1141 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default.yes {
1142 background-color: #6E42D3;
1143 }
1144 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default.yes:hover {
1145 background-color: #4C25A5;
1146 }
1147
1148 .folded .wpfnl-delete-alert-wrapper {
1149 width: calc(100% - 36px);
1150 }
1151
1152 @keyframes wpfnl-bounce {
1153 0% {
1154 transform: scale(0.7);
1155 }
1156 45% {
1157 transform: scale(1.05);
1158 }
1159 80% {
1160 transform: scale(0.95);
1161 }
1162 100% {
1163 transform: scale(1);
1164 }
1165 }
1166 .funnel-loader {
1167 position: relative;
1168 width: 100px;
1169 height: 100px;
1170 margin: 0 auto;
1171 transform-style: preserve-3d;
1172 transform: perspective(500px) rotateX(60deg);
1173 }
1174 .funnel-loader span {
1175 position: absolute;
1176 display: block;
1177 border: 4px solid #6E42D3;
1178 box-sizing: border-box;
1179 border-radius: 100%;
1180 box-shadow: 0 5px 0 #6E42D3, inset 0 5px 0 #6E42D3;
1181 animation: funnel-animate 2s ease-in-out infinite;
1182 }
1183 .funnel-loader span:nth-child(1) {
1184 top: 0;
1185 left: 0;
1186 bottom: 0;
1187 right: 0;
1188 animation-delay: 0.6s;
1189 }
1190 .funnel-loader span:nth-child(2) {
1191 top: 10px;
1192 left: 10px;
1193 bottom: 10px;
1194 right: 10px;
1195 animation-delay: 0.5s;
1196 }
1197 .funnel-loader span:nth-child(3) {
1198 top: 20px;
1199 left: 20px;
1200 bottom: 20px;
1201 right: 20px;
1202 animation-delay: 0.4s;
1203 }
1204 .funnel-loader span:nth-child(4) {
1205 top: 30px;
1206 left: 30px;
1207 bottom: 30px;
1208 right: 30px;
1209 animation-delay: 0.3s;
1210 }
1211 .funnel-loader span:nth-child(5) {
1212 top: 40px;
1213 left: 40px;
1214 bottom: 40px;
1215 right: 40px;
1216 animation-delay: 0.2s;
1217 }
1218
1219 @keyframes funnel-animate {
1220 0% {
1221 transform: translateZ(-50px);
1222 }
1223 50% {
1224 transform: translateZ(50px);
1225 }
1226 100% {
1227 transform: translateZ(-50px);
1228 }
1229 }
1230 @media only screen and (max-width: 960px) {
1231 .wpfnl-delete-alert-wrapper {
1232 width: calc(100% - 35px);
1233 }
1234 }
1235 @media only screen and (max-width: 782px) {
1236 .wpfnl-delete-alert-wrapper {
1237 width: 100%;
1238 }
1239 }
1240 .dot-wrapper span {
1241 color: #fff;
1242 font-size: 16px;
1243 animation-duration: 1.5s;
1244 animation-iteration-count: infinite;
1245 }
1246 .dot-wrapper span.dot-one {
1247 animation-name: flashOne;
1248 margin-left: 2px;
1249 }
1250 .dot-wrapper span.dot-two {
1251 animation-name: flashTwo;
1252 }
1253 .dot-wrapper span.dot-three {
1254 animation-name: flashThree;
1255 }
1256
1257 @keyframes flashOne {
1258 0% {
1259 opacity: 0;
1260 }
1261 25% {
1262 opacity: 1;
1263 }
1264 50% {
1265 opacity: 1;
1266 }
1267 100% {
1268 opacity: 1;
1269 }
1270 }
1271 @keyframes flashTwo {
1272 0% {
1273 opacity: 0;
1274 }
1275 25% {
1276 opacity: 0;
1277 }
1278 50% {
1279 opacity: 1;
1280 }
1281 100% {
1282 opacity: 1;
1283 }
1284 }
1285 @keyframes flashThree {
1286 0% {
1287 opacity: 0;
1288 }
1289 50% {
1290 opacity: 0;
1291 }
1292 75% {
1293 opacity: 1;
1294 }
1295 100% {
1296 opacity: 1;
1297 }
1298 }
1299 .wpfnl .ui-widget-header .ui-icon {
1300 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggc3Ryb2tlPSIjN0E4QjlBIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMS42NyIgZD0iTTEyLjY2NSA4SDMuMzMybTAgMGw0LjY2NyA0LjY2N00zLjMzMiA4bDQuNjY3LTQuNjY3Ii8+PC9zdmc+);
1301 background-position: center;
1302 }
1303 .wpfnl .ui-widget-header .ui-datepicker-next .ui-icon {
1304 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggc3Ryb2tlPSIjN0E4QjlBIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMS42NyIgZD0iTTMuMzM1IDhoOS4zMzNtMCAwbC00LjY2NyA0LjY2N00xMi42NjggOEw4LjAwMSAzLjMzMyIvPjwvc3ZnPg==);
1305 }
1306 .wpfnl .ui-datepicker {
1307 width: 290px;
1308 z-index: 4 !important;
1309 }
1310 .wpfnl .ui-datepicker.ui-widget-content {
1311 border: none;
1312 box-shadow: none;
1313 }
1314 .wpfnl .ui-datepicker .ui-datepicker-header {
1315 background: transparent;
1316 border: none;
1317 padding: 0;
1318 margin-bottom: 4px;
1319 }
1320 .wpfnl .ui-datepicker .ui-datepicker-prev,
1321 .wpfnl .ui-datepicker .ui-datepicker-next {
1322 top: 4px;
1323 width: 24px;
1324 height: 24px;
1325 background: #ffffff !important;
1326 cursor: pointer;
1327 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.09);
1328 border-radius: 6px;
1329 border: 1px solid #F1F0F5;
1330 }
1331 .wpfnl .ui-datepicker .ui-datepicker-prev-hover,
1332 .wpfnl .ui-datepicker .ui-datepicker-next-hover {
1333 top: 4px;
1334 }
1335 .wpfnl .ui-datepicker .ui-datepicker-next {
1336 right: 4px;
1337 }
1338 .wpfnl .ui-datepicker .ui-datepicker-next-hover {
1339 right: 4px;
1340 }
1341 .wpfnl .ui-datepicker .ui-datepicker-prev {
1342 left: 4px;
1343 }
1344 .wpfnl .ui-datepicker .ui-datepicker-prev-hover {
1345 left: 4px;
1346 }
1347 .wpfnl .ui-datepicker .ui-datepicker-title select {
1348 line-height: 1.1;
1349 margin: 1px 2px;
1350 border: none;
1351 box-shadow: none;
1352 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.09);
1353 }
1354 .wpfnl .ui-datepicker table {
1355 margin: 0;
1356 }
1357 .wpfnl .ui-datepicker td span,
1358 .wpfnl .ui-datepicker td a {
1359 display: block;
1360 padding: 9px 7px 7px;
1361 height: 32.5px;
1362 width: 32.5px;
1363 text-align: center;
1364 text-decoration: none;
1365 border-radius: 50%;
1366 outline: none;
1367 margin: 0;
1368 color: #2D3149;
1369 font-size: 12px;
1370 font-weight: 500 !important;
1371 }
1372 .wpfnl .ui-datepicker .ui-state-default,
1373 .wpfnl .ui-datepicker .ui-widget-content .ui-state-default,
1374 .wpfnl .ui-datepicker .ui-widget-header .ui-state-default {
1375 border: none !important;
1376 background: transparent;
1377 font-weight: normal;
1378 color: #2D3149;
1379 position: relative;
1380 z-index: 1;
1381 }
1382 .wpfnl .ui-datepicker .ui-state-default:hover,
1383 .wpfnl .ui-datepicker .ui-state-hover,
1384 .wpfnl .ui-datepicker .ui-widget-content .ui-state-hover,
1385 .wpfnl .ui-datepicker .ui-state-active,
1386 .wpfnl .ui-datepicker .ui-widget-content .ui-state-highlight {
1387 background: #6E42D3;
1388 color: #fff;
1389 }
1390 .wpfnl .ui-datepicker .ui-priority-secondary,
1391 .wpfnl .ui-datepicker .ui-widget-content .ui-priority-secondary {
1392 opacity: 1;
1393 color: #9b9b9b !important;
1394 }
1395 .wpfnl .ui-datepicker .ui-state-disabled span {
1396 cursor: not-allowed;
1397 }
1398 .wpfnl .ui-datepicker .in-range {
1399 position: relative;
1400 }
1401 .wpfnl .ui-datepicker .in-range:before {
1402 content: "";
1403 position: absolute;
1404 top: 50%;
1405 transform: translateY(-50%);
1406 left: 0;
1407 z-index: 1;
1408 background: rgba(110, 66, 211, 0.12);
1409 height: 28px;
1410 width: 100%;
1411 }
1412 .wpfnl .ui-datepicker .in-range[title=Start]:before {
1413 border-radius: 50px 0 0 50px;
1414 opacity: 0;
1415 }
1416 .wpfnl .ui-datepicker .in-range[title=End]:before {
1417 border-radius: 0 50px 50px 0;
1418 }
1419 .wpfnl .ui-datepicker .in-range[title=Start] > a, .wpfnl .ui-datepicker .in-range[title=End] > a {
1420 background: #6E42D3 !important;
1421 color: #fff !important;
1422 border-radius: 50%;
1423 }
1424 .wpfnl .ui-datepicker .in-range:last-child:before {
1425 border-radius: 0 50px 50px 0;
1426 }
1427 .wpfnl .ui-datepicker .in-range:first-child:before {
1428 border-radius: 50px 0 0 50px;
1429 }
1430 .wpfnl .ui-datepicker .in-range[title=Start] + .in-range:before {
1431 left: -9px;
1432 width: calc(100% + 9px);
1433 }
1434 .wpfnl .ui-datepicker .in-range[title=End]:first-child:before {
1435 opacity: 0;
1436 }
1437
1438 .wpfnl-custom-selectbox {
1439 position: relative;
1440 }
1441 .wpfnl-custom-selectbox .selectbox-selected-value {
1442 position: relative;
1443 width: 100%;
1444 border: 1px solid #ebedf0;
1445 border-radius: 6px;
1446 padding: 13px 33px 13px 12px;
1447 background-color: transparent;
1448 text-align: left;
1449 font-weight: 400;
1450 font-size: 14px;
1451 line-height: 1.21;
1452 color: #6a707c;
1453 cursor: pointer;
1454 }
1455 .wpfnl-custom-selectbox .selectbox-selected-value:before {
1456 content: url(data:image/svg+xml,%3Csvg%20fill%3D%22none%22%20viewBox%3D%220%200%2012%207%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20stroke%3D%22%23A7A8B3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.8%22%20d%3D%22M11%201L6%206%201%201%22%2F%3E%3C%2Fsvg%3E);
1457 width: 12px;
1458 display: block;
1459 position: absolute;
1460 right: 15px;
1461 top: 50%;
1462 margin-top: -9px;
1463 transition: all 0.3s ease;
1464 }
1465 .wpfnl-custom-selectbox .selectbox-options {
1466 width: 100%;
1467 max-width: 300px;
1468 position: absolute;
1469 background: #fff;
1470 right: 0;
1471 top: calc(100% + 8px);
1472 border: 1px solid #E5E8F3;
1473 z-index: 5;
1474 transition: all 0.3s ease;
1475 box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.06);
1476 border-radius: 6px;
1477 padding: 8px;
1478 opacity: 0;
1479 visibility: hidden;
1480 }
1481 .wpfnl-custom-selectbox.show-options .selectbox-options {
1482 opacity: 1;
1483 visibility: visible;
1484 }
1485 .wpfnl-custom-selectbox.show-options .selectbox-selected-value:before {
1486 transform: rotate(-180deg);
1487 }
1488 .wpfnl-custom-selectbox .selectbox-search {
1489 padding: 8px 8px 14px;
1490 }
1491 .wpfnl-custom-selectbox .selectbox-search .search-icon {
1492 position: absolute;
1493 top: 24px;
1494 left: 25px;
1495 }
1496 .wpfnl-custom-selectbox .selectbox-search input[type=search] {
1497 font-weight: 400;
1498 height: 34px;
1499 padding: 6px 15px 4px 36px;
1500 }
1501 .wpfnl-custom-selectbox .list-title {
1502 font-weight: 500;
1503 font-size: 12px;
1504 line-height: 15px;
1505 letter-spacing: 1px;
1506 text-transform: uppercase;
1507 color: #667085;
1508 border-top: 1px solid #ebedf0;
1509 border-bottom: 1px solid #ebedf0;
1510 border-radius: 0;
1511 background: #f9fafb;
1512 position: relative;
1513 padding: 8px 18px;
1514 left: -8px;
1515 width: calc(100% + 16px);
1516 cursor: text;
1517 margin-bottom: 10px;
1518 }
1519 .wpfnl-custom-selectbox .options-tag,
1520 .wpfnl-custom-selectbox .options-list {
1521 max-height: 200px;
1522 overflow: auto;
1523 }
1524 .wpfnl-custom-selectbox .options-tag::-webkit-scrollbar,
1525 .wpfnl-custom-selectbox .options-list::-webkit-scrollbar {
1526 width: 5px;
1527 }
1528 .wpfnl-custom-selectbox .options-tag::-webkit-scrollbar-track,
1529 .wpfnl-custom-selectbox .options-list::-webkit-scrollbar-track {
1530 background: #f2f5f8;
1531 }
1532 .wpfnl-custom-selectbox .options-tag::-webkit-scrollbar-thumb,
1533 .wpfnl-custom-selectbox .options-list::-webkit-scrollbar-thumb {
1534 background-color: #c1c1c1;
1535 border-radius: 20px;
1536 }
1537 .wpfnl-custom-selectbox .single-option {
1538 display: block;
1539 padding: 8px 10px;
1540 border-radius: 6px;
1541 transition: all 0.3s ease;
1542 }
1543 .wpfnl-custom-selectbox .single-option:hover {
1544 background: #f6f8fa;
1545 }
1546 .wpfnl-custom-selectbox .single-option label {
1547 line-height: 1.3;
1548 display: block;
1549 }
1550
1551 .wpfnl-selectbox {
1552 max-width: 270px;
1553 width: 100%;
1554 border-radius: 6px;
1555 border: 1px solid #EEF0F3;
1556 background: #FFF;
1557 position: relative;
1558 cursor: pointer;
1559 }
1560 .wpfnl-selectbox .selected-option {
1561 color: #363B4E;
1562 font-size: 14px;
1563 line-height: 1;
1564 letter-spacing: -0.14px;
1565 padding: 13px 30px 11px 14px;
1566 }
1567 .wpfnl-selectbox .selected-option:before {
1568 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==");
1569 width: 10px;
1570 position: absolute;
1571 right: 14px;
1572 top: 50%;
1573 line-height: 1;
1574 transform: translateY(-50%);
1575 }
1576 .wpfnl-selectbox .selectable-options {
1577 width: 100%;
1578 list-style-type: none;
1579 padding: 8px;
1580 font-size: 16px;
1581 position: absolute;
1582 left: 0;
1583 top: calc(100% + 8px);
1584 z-index: 1;
1585 border-radius: 6px;
1586 border: 1px solid #EBEDF0;
1587 background: #FFF;
1588 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
1589 max-height: 230px;
1590 overflow-y: auto;
1591 opacity: 0;
1592 visibility: hidden;
1593 transition: all 0.3s ease;
1594 }
1595 .wpfnl-selectbox .selectable-options::-webkit-scrollbar {
1596 width: 3px;
1597 height: 3px;
1598 }
1599 .wpfnl-selectbox .selectable-options::-webkit-scrollbar-track {
1600 background: #f2f5f8;
1601 }
1602 .wpfnl-selectbox .selectable-options::-webkit-scrollbar-thumb {
1603 background-color: #CBCBCB;
1604 border-radius: 20px;
1605 }
1606 .wpfnl-selectbox .selectable-options li {
1607 padding: 11px 12px 9px;
1608 color: #363B4E;
1609 font-size: 14px;
1610 font-weight: 400;
1611 line-height: 1;
1612 letter-spacing: -0.14px;
1613 border-radius: 6px;
1614 }
1615 .wpfnl-selectbox .selectable-options li:hover {
1616 background: #F6F5FA;
1617 }
1618 .wpfnl-selectbox .selectable-options li.selected {
1619 background: #F6F5FA;
1620 font-weight: 500;
1621 }
1622 .wpfnl-selectbox.show-options .add-step-dropdown,
1623 .wpfnl-selectbox.show-options .selectable-options {
1624 opacity: 1;
1625 visibility: visible;
1626 }
1627
1628 .wpfnl-toast-alert {
1629 position: fixed;
1630 top: 150px;
1631 right: 20px;
1632 z-index: 9999;
1633 max-width: 360px;
1634 min-width: 250px;
1635 -webkit-animation: fadeinout 3s ease-in-out forwards;
1636 animation: fadeinout 3s ease-in-out forwards;
1637 }
1638 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box {
1639 background: #ffffff;
1640 border: 1px solid #039855;
1641 box-shadow: 0px 7px 30px rgba(16, 5, 46, 0.08);
1642 border-radius: 10px;
1643 display: flex;
1644 flex-flow: row wrap;
1645 align-items: center;
1646 padding: 15px;
1647 gap: 10px;
1648 }
1649 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .alert-text {
1650 width: calc(100% - 34px);
1651 position: relative;
1652 padding-left: 25px;
1653 }
1654 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .alert-text::before {
1655 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzAzOTg1NSIgZD0iTTkgMThBOSA5IDAgMTA5IDBhOSA5IDAgMDAwIDE4eiIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTYuMTkgMTMuMzlMMi44OTggOS44NjdhMS4yMDMgMS4yMDMgMCAwMS4wNTctMS42OTYgMS4yMDMgMS4yMDMgMCAwMTEuNjk3LjA1N2wyLjUzOSAyLjcxNyA0LjAxOC0zLjc1NGMuMDM3LS4wMzQuMDc0LS4wNjUuMTEzLS4wOTRsMS44OS0xLjc2NWExLjIwMyAxLjIwMyAwIDAxMS42OTYuMDU3IDEuMjAzIDEuMjAzIDAgMDEtLjA1NyAxLjY5NmwtNS43NzMgNS4zOTMtLjAwNi0uMDA2LTEuOTk2IDEuODY2LS44ODYtLjk0OHoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==");
1656 position: absolute;
1657 left: 0;
1658 top: 0;
1659 height: 18px;
1660 width: 18px;
1661 display: block;
1662 }
1663 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .cross-icon {
1664 width: 24px;
1665 height: 24px;
1666 background: #ffffff;
1667 border: 1px solid #e4e6eb;
1668 border-radius: 6px;
1669 display: flex;
1670 justify-content: center;
1671 align-items: center;
1672 cursor: pointer;
1673 }
1674 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .cross-icon svg path {
1675 fill: #686f7f;
1676 }
1677 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .cross-icon:hover {
1678 background: #e4e6eb;
1679 }
1680
1681 @-webkit-keyframes fadeinout {
1682 0% {
1683 opacity: 0;
1684 top: 150px;
1685 }
1686 80%, 20% {
1687 opacity: 1;
1688 top: 125px;
1689 }
1690 100% {
1691 opacity: 0;
1692 top: 80px;
1693 }
1694 }
1695 @keyframes fadeinout {
1696 0% {
1697 opacity: 0;
1698 top: 150px;
1699 }
1700 80%, 20% {
1701 opacity: 1;
1702 top: 125px;
1703 }
1704 100% {
1705 opacity: 0;
1706 top: 80px;
1707 }
1708 }
1709 .wpfnl-modal .wpfnl-modal__header {
1710 display: flex;
1711 flex-flow: row wrap;
1712 align-items: center;
1713 justify-content: space-between;
1714 padding: 12px 15px;
1715 border-radius: 15px 15px 0 0;
1716 box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
1717 position: relative;
1718 }
1719 .wpfnl-modal .wpfnl-modal__header .title h2 {
1720 font-weight: 500;
1721 font-size: 16px;
1722 line-height: 1.3;
1723 color: #363B4E;
1724 }
1725 .wpfnl-modal .wpfnl-modal__header .wpfnl-modal-close {
1726 height: 28px;
1727 width: 28px;
1728 background: #F6F6F8;
1729 border: 1px solid #E5E8F3;
1730 display: flex;
1731 flex-flow: column;
1732 align-items: center;
1733 justify-content: center;
1734 border-radius: 100%;
1735 cursor: pointer;
1736 }
1737 .wpfnl-modal .wpfnl-modal__header .wpfnl-modal-close svg path {
1738 stroke: #6E42D3;
1739 }
1740 .wpfnl-modal .wpfnl-modal__body {
1741 background: #F2F5F8;
1742 padding: 23px 25px 0px;
1743 overflow: auto;
1744 height: calc(100% - 52px);
1745 }
1746 .wpfnl-modal .wpfnl-modal__body::-webkit-scrollbar {
1747 width: 5px;
1748 }
1749 .wpfnl-modal .wpfnl-modal__body::-webkit-scrollbar-track {
1750 background: #f2f5f8;
1751 }
1752 .wpfnl-modal .wpfnl-modal__body::-webkit-scrollbar-thumb {
1753 background-color: #6E42D3;
1754 border-radius: 20px;
1755 }
1756 .wpfnl-modal .wpfnl-modal__body .choose-step-type label {
1757 font-weight: 500;
1758 font-size: 13px;
1759 line-height: 15px;
1760 color: #363B4E;
1761 margin-bottom: 9px;
1762 display: inline-block;
1763 }
1764 .wpfnl-modal .wpfnl-modal__body .choose-step-type select {
1765 height: 36px;
1766 border-radius: 5px;
1767 padding: 4px 15px;
1768 max-width: 100%;
1769 }
1770 .wpfnl-modal .wpfnl-modal__body .choose-step-type select:focus {
1771 border-color: #6E42D3;
1772 }
1773 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav {
1774 margin-bottom: 30px;
1775 margin-left: 5px;
1776 border-bottom: 1px solid #E1E1EB;
1777 }
1778 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li {
1779 padding: 5px 0 10px;
1780 cursor: pointer;
1781 margin-right: 22px;
1782 text-transform: capitalize;
1783 font-weight: 500;
1784 font-size: 14px;
1785 line-height: 16px;
1786 color: #7A8B9A;
1787 position: relative;
1788 }
1789 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li:before {
1790 content: "";
1791 position: absolute;
1792 left: 0;
1793 bottom: -1px;
1794 width: 100%;
1795 height: 2px;
1796 background: #6E42D3;
1797 opacity: 0;
1798 visibility: hidden;
1799 transition: all 0.3s ease;
1800 }
1801 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li:hover, .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.active {
1802 color: #6E42D3;
1803 }
1804 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.active:before {
1805 opacity: 1;
1806 visibility: visible;
1807 }
1808 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li .pro-tag {
1809 position: absolute;
1810 top: -9px;
1811 right: -10px;
1812 font-size: 10px;
1813 padding: 0 4px;
1814 }
1815 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.disabled {
1816 font-weight: 400;
1817 color: rgba(122, 139, 154, 0.5);
1818 }
1819 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.disabled:hover {
1820 color: rgba(122, 139, 154, 0.5);
1821 }
1822 .wpfnl-modal .wpfnl-modal__footer {
1823 padding: 15px 20px;
1824 border-top: 1px solid #E5E8F3;
1825 }
1826 .wpfnl-modal .wpfnl-modal__footer .step-save-btn {
1827 display: flex;
1828 flex-flow: row;
1829 align-items: center;
1830 justify-content: flex-end;
1831 }
1832 .wpfnl-modal .wpfnl-modal__footer .step-save-btn .wpfnl-alert {
1833 margin-right: 10px;
1834 }
1835 .wpfnl-modal .wpfnl-modal__footer .step-save-btn a.btn-default {
1836 background: transparent;
1837 border: 1px solid #E5E8F3;
1838 color: #363B4E;
1839 width: 110px;
1840 padding: 0 20px;
1841 margin-right: 10px;
1842 }
1843 .wpfnl-modal .wpfnl-modal__footer .step-save-btn a.btn-default:hover {
1844 background: rgba(0, 0, 0, 0.04);
1845 }
1846 .wpfnl-modal .wpfnl-modal__footer .step-save-btn button {
1847 width: 110px;
1848 padding: 0 20px;
1849 border: 1px solid transparent;
1850 display: flex;
1851 flex-flow: row;
1852 align-items: center;
1853 justify-content: center;
1854 }
1855
1856 .wpfnl-dashboard-loader {
1857 width: 100%;
1858 padding: 24px;
1859 }
1860 .wpfnl-dashboard-loader__summary {
1861 display: grid;
1862 grid-template-columns: repeat(4, 1fr);
1863 gap: 16px;
1864 margin-bottom: 24px;
1865 }
1866 .wpfnl-dashboard-loader__summary .wpfnl-shimmer-card {
1867 height: 110px;
1868 border-radius: 12px;
1869 animation: shimmer-animation 1.6s infinite linear;
1870 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
1871 background-size: 1000px 100%;
1872 }
1873 .wpfnl-dashboard-loader__chart {
1874 height: 280px;
1875 border-radius: 12px;
1876 margin-bottom: 24px;
1877 animation: shimmer-animation 1.6s infinite linear;
1878 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
1879 background-size: 1000px 100%;
1880 }
1881 .wpfnl-dashboard-loader__table-header {
1882 height: 20px;
1883 width: 35%;
1884 border-radius: 8px;
1885 margin-bottom: 16px;
1886 animation: shimmer-animation 1.6s infinite linear;
1887 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
1888 background-size: 1000px 100%;
1889 }
1890 .wpfnl-dashboard-loader__table-row {
1891 height: 52px;
1892 border-radius: 8px;
1893 margin-bottom: 10px;
1894 animation: shimmer-animation 1.6s infinite linear;
1895 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
1896 background-size: 1000px 100%;
1897 }
1898
1899 .wpfnl-dashboard__nav {
1900 background: #fff;
1901 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
1902 position: relative;
1903 display: flex;
1904 flex-flow: row wrap;
1905 align-items: center;
1906 justify-content: space-between;
1907 gap: 10px;
1908 padding: 0 24px;
1909 }
1910 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-ul {
1911 display: flex;
1912 align-items: center;
1913 gap: 24px;
1914 }
1915 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li {
1916 display: block;
1917 position: relative;
1918 }
1919 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li:last-child {
1920 margin-bottom: 0;
1921 }
1922 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li a {
1923 display: block;
1924 text-align: center;
1925 font-weight: 400;
1926 font-size: 14px;
1927 line-height: 1;
1928 color: #707070;
1929 padding: 23px 3px;
1930 }
1931 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li a svg {
1932 display: block;
1933 margin: 0 auto 8px;
1934 }
1935 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li a:hover {
1936 color: #6E42D3;
1937 }
1938 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li.active:after {
1939 content: "";
1940 position: absolute;
1941 left: 0px;
1942 bottom: -2px;
1943 height: 2px;
1944 width: 100%;
1945 background: #6E42D3;
1946 z-index: 1;
1947 }
1948 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li.active a {
1949 color: #6E42D3;
1950 }
1951 .wpfnl-dashboard__nav .logo {
1952 display: block;
1953 }
1954 .wpfnl-dashboard__nav .logo a {
1955 display: block;
1956 text-align: center;
1957 }
1958 .wpfnl-dashboard__nav .logo a svg {
1959 display: block;
1960 margin: 0 auto;
1961 }
1962 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-right .btn-default {
1963 border-radius: 10px;
1964 background: #2D3149;
1965 box-shadow: -1px 1px 1px 0 rgba(182, 185, 191, 0.3);
1966 padding: 10px 18px;
1967 height: auto;
1968 line-height: 1;
1969 color: #F0F0F1;
1970 font-weight: 400;
1971 }
1972 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-right .btn-default:hover {
1973 background-color: #6E42D3;
1974 }
1975
1976 .dashboard-nav__content {
1977 position: relative;
1978 width: calc(100% - 280px);
1979 margin: 0 auto;
1980 }
1981 .dashboard-nav__content .import-funnel-modal {
1982 position: fixed;
1983 top: 0;
1984 left: 160px;
1985 width: calc(100% - 160px);
1986 height: 100%;
1987 background: rgba(21, 17, 29, 0.3);
1988 backdrop-filter: blur(6px);
1989 z-index: 99;
1990 opacity: 0;
1991 visibility: hidden;
1992 transition: all 0.3s ease;
1993 }
1994 .dashboard-nav__content .import-funnel-modal.show-modal {
1995 opacity: 1;
1996 visibility: visible;
1997 }
1998 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner {
1999 width: 100%;
2000 height: 100%;
2001 padding: 32px;
2002 display: flex;
2003 flex-flow: column;
2004 align-items: center;
2005 justify-content: center;
2006 }
2007 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper {
2008 background: #F6F5FA;
2009 border-radius: 15px 0px 15px 15px;
2010 width: 100%;
2011 max-width: 540px;
2012 position: relative;
2013 padding: 24px 30px 20px;
2014 }
2015 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper .import-funnel-modal-title {
2016 font-weight: 600;
2017 font-size: 18px;
2018 line-height: 1.18;
2019 color: #363B4E;
2020 margin-bottom: 13px;
2021 }
2022 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper .close-modal {
2023 border: none;
2024 width: 40px;
2025 height: 40px;
2026 position: absolute;
2027 top: -16px;
2028 right: -16px;
2029 display: flex;
2030 flex-flow: column;
2031 align-items: center;
2032 justify-content: center;
2033 cursor: pointer;
2034 border-radius: 100px;
2035 background: #ffffff;
2036 box-shadow: 0px 1px 1px 0px #DADADA;
2037 }
2038 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form {
2039 position: relative;
2040 }
2041 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form input[type=file] {
2042 position: absolute;
2043 width: 100%;
2044 height: 206px;
2045 top: 0;
2046 left: 0;
2047 opacity: 0;
2048 }
2049 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form input[type=file]::-webkit-file-upload-button {
2050 background: #F9F9FA;
2051 border: 1px solid #C9D0E9;
2052 border-radius: 6px;
2053 padding: 9px 17px;
2054 margin-right: 12px;
2055 cursor: pointer;
2056 }
2057 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .import-label {
2058 border-radius: 8px;
2059 padding: 50px 30px;
2060 background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23AFADB6FF' stroke-width='2' stroke-dasharray='3%2c 7' stroke-dashoffset='-6' stroke-linecap='round'/%3e%3c/svg%3e");
2061 display: flex;
2062 flex-flow: column;
2063 align-items: center;
2064 justify-content: center;
2065 }
2066 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .import-label h4 {
2067 color: #2D3149;
2068 font-size: 15px;
2069 line-height: 1;
2070 font-weight: 600;
2071 margin-bottom: 1px;
2072 }
2073 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .import-label h4 .primary-color {
2074 color: #6E42D3;
2075 font-weight: 600;
2076 }
2077 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-success-icon,
2078 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-icon {
2079 width: 50px;
2080 height: 50px;
2081 background: #6e42d3;
2082 display: flex;
2083 flex-flow: column;
2084 align-items: center;
2085 justify-content: center;
2086 border-radius: 100%;
2087 margin-bottom: 16px;
2088 }
2089 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-success-icon {
2090 display: none;
2091 background: #239654;
2092 }
2093 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-success-icon svg {
2094 position: relative;
2095 top: 1px;
2096 left: 1px;
2097 }
2098 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .file-added .upload-success-icon {
2099 display: flex;
2100 }
2101 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .file-added .upload-icon {
2102 display: none;
2103 }
2104 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area {
2105 display: flex;
2106 flex-flow: row;
2107 align-items: center;
2108 justify-content: flex-end;
2109 border-top: 1px solid #E4E6EB;
2110 margin-top: 30px;
2111 padding: 20px 30px 0;
2112 gap: 12px;
2113 position: relative;
2114 left: -30px;
2115 width: calc(100% + 60px);
2116 }
2117 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .btn-default {
2118 padding: 8px 21px 6px;
2119 height: 40px;
2120 line-height: 1;
2121 border-radius: 10px;
2122 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
2123 min-width: auto;
2124 border: 1px solid transparent;
2125 }
2126 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .btn-default .wpfnl-loader {
2127 position: relative;
2128 top: 2px;
2129 }
2130 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .cancel {
2131 position: relative;
2132 top: inherit;
2133 right: inherit;
2134 border-color: #E4E6EB;
2135 width: auto;
2136 background: transparent;
2137 box-shadow: none;
2138 color: #3C3F47;
2139 }
2140 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .cancel:hover {
2141 background: #f1f1f1;
2142 }
2143 .dashboard-nav__content .upgrade-to-pro {
2144 margin-top: 20px;
2145 }
2146 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper {
2147 display: flex;
2148 align-items: start;
2149 width: 100%;
2150 padding: 20px;
2151 border-radius: 10px;
2152 border: 1px solid rgba(238, 129, 52, 0.5);
2153 background: #FFFAF6;
2154 }
2155 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .warning-icon-wrapper {
2156 margin-right: 15px;
2157 }
2158 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .warning-icon {
2159 display: inline-block;
2160 vertical-align: middle;
2161 }
2162 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content {
2163 flex-grow: 1;
2164 color: #d9534f;
2165 font-size: 16px;
2166 line-height: 1.5;
2167 }
2168 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content .upgrade-to-pro-message {
2169 color: #667085;
2170 font-family: Roboto;
2171 font-size: 15px;
2172 font-style: normal;
2173 font-weight: 400;
2174 line-height: 24px;
2175 max-width: 636px;
2176 }
2177 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content .upgrade-to-pro-message h3 {
2178 color: #373B4D;
2179 font-family: Roboto;
2180 font-size: 18px;
2181 font-style: normal;
2182 font-weight: 700;
2183 line-height: normal;
2184 margin-bottom: 10px;
2185 }
2186 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action {
2187 display: flex;
2188 align-items: center;
2189 margin-left: 20px;
2190 }
2191 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro {
2192 background-color: #6f42c1;
2193 text-decoration: none;
2194 font-weight: 500;
2195 color: #FFF;
2196 text-align: center;
2197 font-family: Inter;
2198 font-size: 16px;
2199 font-style: normal;
2200 padding: 10px 20px;
2201 border-radius: 7px;
2202 }
2203 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro:hover {
2204 background-color: #563d7c;
2205 }
2206
2207 body.folded .dashboard-nav__content .import-funnel-modal {
2208 left: 36px;
2209 }
2210
2211 .wpfnl-dashboard__header {
2212 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
2213 background: #fff;
2214 width: 100%;
2215 display: flex;
2216 flex-flow: row wrap;
2217 align-items: center;
2218 justify-content: space-between;
2219 padding: 20px 20px 20px 30px;
2220 border-left: 1px solid #ebedf7;
2221 }
2222 .wpfnl-dashboard__header.overview-header {
2223 box-shadow: none;
2224 background: transparent;
2225 padding: 20px 0 0;
2226 border-left: none;
2227 }
2228 .wpfnl-dashboard__header .wpfnl-dashboard-header-left {
2229 display: flex;
2230 align-items: center;
2231 justify-content: center;
2232 }
2233 .wpfnl-dashboard__header .title h1 {
2234 font-weight: 500;
2235 font-size: 18px;
2236 line-height: 21px;
2237 color: #363B4E;
2238 text-transform: capitalize;
2239 }
2240 .wpfnl-dashboard__header .title .subtitle {
2241 font-size: 13px;
2242 display: inline-block;
2243 }
2244 .wpfnl-dashboard__header .funnel-search {
2245 margin-right: 20px;
2246 }
2247 .wpfnl-dashboard__header .funnel-search .search-group {
2248 position: relative;
2249 width: 230px;
2250 }
2251 .wpfnl-dashboard__header .funnel-search .search-group svg {
2252 position: absolute;
2253 top: 9px;
2254 left: 12px;
2255 }
2256 .wpfnl-dashboard__header .funnel-search .search-group input {
2257 padding-left: 40px;
2258 border-radius: 10px;
2259 font-size: 13px;
2260 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
2261 border: none;
2262 height: 39px;
2263 }
2264 .wpfnl-dashboard__header .funnel-search .search-group input::-webkit-input-placeholder {
2265 color: #7A8B9A;
2266 }
2267 .wpfnl-dashboard__header .funnel-search .search-group input::-moz-placeholder {
2268 color: #7A8B9A;
2269 }
2270 .wpfnl-dashboard__header .funnel-search .search-group input:-ms-input-placeholder {
2271 color: #7A8B9A;
2272 }
2273 .wpfnl-dashboard__header .funnel-search .search-group input:-moz-placeholder {
2274 color: #7A8B9A;
2275 }
2276 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper {
2277 margin-right: 20px;
2278 }
2279 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels,
2280 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels {
2281 margin-right: 16px;
2282 }
2283 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels:last-child,
2284 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels:last-child {
2285 margin-right: 0;
2286 }
2287 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels span,
2288 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels span {
2289 color: #2D3149;
2290 font-family: Inter;
2291 font-size: 14px;
2292 font-style: normal;
2293 font-weight: 500;
2294 line-height: 1;
2295 letter-spacing: -0.14px;
2296 }
2297 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels span.wpfnl-count,
2298 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels span.wpfnl-count {
2299 border-radius: 10px;
2300 background: #FFF;
2301 padding: 6px 8px;
2302 color: #7A8B9A;
2303 font-family: Inter;
2304 font-size: 10px;
2305 font-style: normal;
2306 font-weight: 500;
2307 line-height: 8px;
2308 letter-spacing: -0.1px;
2309 margin-left: 3px;
2310 display: inline-block;
2311 }
2312 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels.active span,
2313 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels.active span {
2314 color: #573BFF;
2315 }
2316 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels.active span.wpfnl-count,
2317 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels.active span.wpfnl-count {
2318 background: rgba(87, 59, 255, 0.1);
2319 }
2320 .wpfnl-dashboard__header a.import-export {
2321 background: #FFFFFF;
2322 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
2323 border-radius: 8px;
2324 font-weight: 400;
2325 font-size: 14px;
2326 line-height: 1.21;
2327 text-align: center;
2328 color: #363B4E;
2329 padding: 12px 20px 10px;
2330 display: flex;
2331 align-items: center;
2332 gap: 5px;
2333 margin-right: 14px;
2334 cursor: pointer;
2335 }
2336 .wpfnl-dashboard__header a.import-export .pro-tag-icon {
2337 width: 20px;
2338 height: 20px;
2339 }
2340 .wpfnl-dashboard__header a.import-export svg {
2341 display: block;
2342 position: relative;
2343 top: -1px;
2344 }
2345 .wpfnl-dashboard__header a.import-export path {
2346 transition: all 0.3s ease;
2347 }
2348 .wpfnl-dashboard__header a.import-export:hover {
2349 color: #6E42D3;
2350 }
2351 .wpfnl-dashboard__header a.import-export:hover path {
2352 fill: #6E42D3;
2353 }
2354 .wpfnl-dashboard__header a.import-export:hover .pro-tag-icon path {
2355 fill: #FFF;
2356 }
2357 .wpfnl-dashboard__header a.import-export.wpfnl-export-all-funnels {
2358 margin-left: auto;
2359 }
2360 .wpfnl-dashboard__header a.import-export#wpfnl-export-all-pro {
2361 margin-left: auto;
2362 }
2363 .wpfnl-dashboard__header a.pro-import-button {
2364 background: #FFFFFF;
2365 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
2366 border-radius: 8px;
2367 font-weight: 400;
2368 font-size: 14px;
2369 line-height: 1.21;
2370 text-align: center;
2371 color: #363B4E;
2372 padding: 12px 20px 10px;
2373 display: flex;
2374 align-items: center;
2375 gap: 5px;
2376 margin-right: 14px;
2377 cursor: pointer;
2378 }
2379 .wpfnl-dashboard__header a.pro-import-button .pro-tag-icon {
2380 width: 20px;
2381 height: 20px;
2382 }
2383 .wpfnl-dashboard__header a.pro-import-button svg {
2384 display: block;
2385 position: relative;
2386 top: -1px;
2387 }
2388 .wpfnl-dashboard__header a.pro-import-button path {
2389 transition: all 0.3s ease;
2390 }
2391 .wpfnl-dashboard__header a.pro-import-button:hover {
2392 color: #6E42D3;
2393 }
2394 .wpfnl-dashboard__header a.pro-import-button:hover path {
2395 fill: #6E42D3;
2396 }
2397 .wpfnl-dashboard__header a.pro-import-button:hover .pro-tag-icon path {
2398 fill: #FFF;
2399 }
2400 .wpfnl-dashboard__header a.pro-import-button.wpfnl-export-all-funnels {
2401 margin-left: auto;
2402 }
2403 .wpfnl-dashboard__header a.pro-import-button#wpfnl-export-all-pro {
2404 margin-left: auto;
2405 }
2406 .wpfnl-dashboard__header .btn-default.disabled,
2407 .wpfnl-dashboard__header .add-new-funnel-btn {
2408 font-weight: 400;
2409 height: 40px;
2410 line-height: 41px;
2411 border-radius: 10px;
2412 }
2413 .wpfnl-dashboard__header .add-new-funnel-btn svg {
2414 position: relative;
2415 top: 1px;
2416 margin-right: 3px;
2417 }
2418 .wpfnl-dashboard__header .add-new-funnel-btn svg path {
2419 stroke: #fff;
2420 }
2421 .wpfnl-dashboard__header .add-new-funnel-btn.disabled {
2422 opacity: 0.5;
2423 pointer-events: none;
2424 cursor: not-allowed;
2425 }
2426 .wpfnl-dashboard__header .add-new-funnel-btn.disabled svg {
2427 margin-right: 6px;
2428 }
2429
2430 .wpfnl-dashboard__inner-content {
2431 min-height: 425px;
2432 margin: 24px auto 30px;
2433 }
2434 .wpfnl-dashboard__inner-content.no-funnel .funnel-list__wrapper {
2435 display: flex;
2436 flex-flow: column;
2437 align-items: center;
2438 justify-content: center;
2439 background-color: transparent;
2440 border-radius: 0;
2441 }
2442 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-wrapper {
2443 background: transparent;
2444 width: 100%;
2445 }
2446 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-wrapper .no-funnel {
2447 color: #363B4E;
2448 font-size: 18px;
2449 font-style: normal;
2450 font-weight: 500;
2451 line-height: 0.88;
2452 }
2453 .wpfnl-dashboard__inner-content.no-funnel .no-trash-wrapper {
2454 text-align: center;
2455 background: #FFF;
2456 filter: drop-shadow(0px 1px 1px rgba(182, 185, 191, 0.3));
2457 width: 100%;
2458 height: 100%;
2459 display: flex;
2460 flex-direction: column;
2461 justify-content: center;
2462 align-items: center;
2463 gap: 40px;
2464 padding: 170px 0px;
2465 border-radius: 10px;
2466 }
2467 .wpfnl-dashboard__inner-content.no-funnel .no-trash-wrapper .no-funnel {
2468 font-family: "Roboto";
2469 font-style: normal;
2470 font-weight: 500;
2471 font-size: 18px;
2472 line-height: 16px;
2473 color: #363B4E;
2474 }
2475 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel {
2476 display: flex;
2477 flex-flow: row wrap;
2478 gap: 16px;
2479 }
2480 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default {
2481 font-size: 15px;
2482 padding: 0 20px;
2483 height: 44px;
2484 line-height: 44px;
2485 display: flex;
2486 align-items: center;
2487 gap: 7px;
2488 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
2489 border-radius: 10px;
2490 min-width: auto;
2491 border: 1px solid transparent;
2492 }
2493 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.import-export {
2494 background: transparent;
2495 color: #363B4E;
2496 border-color: #E4E2EB;
2497 filter: drop-shadow(0px 2px 4px rgba(223, 223, 249, 0.25));
2498 }
2499 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.import-export:hover {
2500 background: #fff;
2501 }
2502 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.pro-import-button {
2503 background: transparent;
2504 color: #363B4E;
2505 border-color: #E4E2EB;
2506 filter: drop-shadow(0px 2px 4px rgba(223, 223, 249, 0.25));
2507 }
2508 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.pro-import-button:hover {
2509 background: #fff;
2510 }
2511 .wpfnl-dashboard__inner-content.no-funnel a.wpfnl-trash-all-funnels {
2512 font-family: "Inter";
2513 font-style: normal;
2514 font-weight: 500;
2515 font-size: 14px;
2516 line-height: 17px;
2517 letter-spacing: -0.01em;
2518 color: #EC5956;
2519 display: flex;
2520 align-items: center;
2521 justify-content: center;
2522 gap: 5px;
2523 margin-top: 15px;
2524 }
2525 .wpfnl-dashboard__inner-content.no-funnel a.wpfnl-trash-all-funnels path {
2526 stroke: #EC5956;
2527 }
2528 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info {
2529 width: 100%;
2530 border-radius: 10px;
2531 background-color: #FFF;
2532 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
2533 padding: 70px 80px;
2534 display: flex;
2535 gap: 30px;
2536 align-items: center;
2537 }
2538 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-content {
2539 flex: 1;
2540 }
2541 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-title {
2542 color: #1D2327;
2543 font-size: 24px;
2544 font-weight: 500;
2545 line-height: 1.3;
2546 margin: 0 0 5px 0;
2547 }
2548 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-description {
2549 margin: 0 0 18px 0;
2550 color: #707070;
2551 font-size: 14px;
2552 font-weight: 400;
2553 line-height: 1.5;
2554 max-width: 330px;
2555 }
2556 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-features {
2557 list-style: none;
2558 margin: 0 0 28px 0;
2559 padding: 0;
2560 display: flex;
2561 flex-direction: column;
2562 gap: 12px;
2563 }
2564 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .feature-item {
2565 display: flex;
2566 align-items: center;
2567 gap: 10px;
2568 color: #1F2937;
2569 font-size: 14px;
2570 font-weight: 400;
2571 line-height: 1.5;
2572 margin: 0;
2573 padding-left: 22px;
2574 position: relative;
2575 }
2576 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .feature-item svg {
2577 position: absolute;
2578 left: 0;
2579 top: 6px;
2580 width: 14px;
2581 height: auto;
2582 }
2583 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-links {
2584 display: flex;
2585 align-items: center;
2586 flex-wrap: wrap;
2587 gap: 20px;
2588 row-gap: 10px;
2589 }
2590 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link {
2591 display: inline-flex;
2592 align-items: center;
2593 gap: 8px;
2594 color: #6E42D3;
2595 font-size: 15px;
2596 font-weight: 500;
2597 line-height: 1;
2598 text-decoration: none;
2599 transition: opacity 0.2s ease;
2600 }
2601 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link svg {
2602 display: block;
2603 flex-shrink: 0;
2604 }
2605 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link:hover {
2606 text-decoration: underline;
2607 }
2608 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link:focus {
2609 outline: 2px solid #6E42D3;
2610 outline-offset: 2px;
2611 border-radius: 4px;
2612 }
2613 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-wrapper {
2614 flex-shrink: 0;
2615 height: 100%;
2616 }
2617 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview {
2618 position: relative;
2619 width: 570px;
2620 height: 100%;
2621 border-radius: 10px;
2622 cursor: pointer;
2623 transition: transform 0.2s ease;
2624 }
2625 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:before {
2626 content: "";
2627 position: absolute;
2628 inset: -20px;
2629 border: 1px solid #F6F5FA;
2630 border-radius: 14px;
2631 }
2632 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:after {
2633 content: "";
2634 position: absolute;
2635 inset: -40px;
2636 border: 1px solid #F6F5FA;
2637 border-radius: 14px;
2638 }
2639 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:focus {
2640 outline: 3px solid #6E42D3;
2641 outline-offset: 2px;
2642 }
2643 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-poster {
2644 width: 100%;
2645 height: auto;
2646 object-fit: cover;
2647 display: block;
2648 border-radius: 14px;
2649 }
2650 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-overlay {
2651 position: absolute;
2652 top: 0;
2653 left: 0;
2654 right: 0;
2655 bottom: 0;
2656 display: flex;
2657 align-items: center;
2658 justify-content: center;
2659 background: rgba(0, 0, 0, 0.3);
2660 transition: background 0.2s ease;
2661 border-radius: 14px;
2662 z-index: 1;
2663 }
2664 .video-preview:hover .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-overlay {
2665 background: rgba(0, 0, 0, 0.4);
2666 }
2667 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button {
2668 width: 57px;
2669 height: 57px;
2670 border-radius: 50%;
2671 background: #fff;
2672 display: flex;
2673 align-items: center;
2674 justify-content: center;
2675 transition: all 0.2s ease;
2676 box-shadow: 0 0 0 10px #e7e7e7;
2677 position: relative;
2678 }
2679 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button:before {
2680 content: "";
2681 position: absolute;
2682 inset: -11px;
2683 border-radius: 50%;
2684 background: transparent;
2685 border: 1px solid #fff;
2686 }
2687 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button svg {
2688 margin-left: 4px;
2689 display: block;
2690 }
2691 .video-preview:hover .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button {
2692 background: rgb(110, 66, 211);
2693 transform: scale(1.1);
2694 }
2695 .wpfnl-dashboard__inner-content.no-funnel .video-popup-overlay {
2696 position: fixed;
2697 top: 0;
2698 left: 0;
2699 right: 0;
2700 bottom: 0;
2701 background: rgba(0, 0, 0, 0.8);
2702 display: flex;
2703 align-items: center;
2704 justify-content: center;
2705 z-index: 99999;
2706 padding: 20px;
2707 opacity: 0;
2708 visibility: hidden;
2709 transition: all 0.5s ease;
2710 }
2711 .wpfnl-dashboard__inner-content.no-funnel .video-popup-overlay.show {
2712 opacity: 1;
2713 visibility: visible;
2714 }
2715 .wpfnl-dashboard__inner-content.no-funnel .video-popup-content {
2716 position: relative;
2717 width: 100%;
2718 max-width: 760px;
2719 border-radius: 16px;
2720 background: #fff;
2721 padding: 20px;
2722 }
2723 .wpfnl-dashboard__inner-content.no-funnel .video-popup-close {
2724 position: absolute;
2725 top: -20px;
2726 right: -20px;
2727 width: 40px;
2728 height: 40px;
2729 background: rgb(255, 255, 255);
2730 border: none;
2731 border-radius: 50%;
2732 color: #fff;
2733 cursor: pointer;
2734 display: flex;
2735 align-items: center;
2736 justify-content: center;
2737 transition: all 0.2s ease;
2738 z-index: 10;
2739 box-shadow: 1px 1px 7px rgba(34, 34, 34, 0.2784313725);
2740 }
2741 .wpfnl-dashboard__inner-content.no-funnel .video-popup-close:focus {
2742 outline: 2px solid #fff;
2743 outline-offset: 2px;
2744 }
2745 .wpfnl-dashboard__inner-content.no-funnel .video-container {
2746 position: relative;
2747 padding-bottom: 56.25%;
2748 height: 0;
2749 overflow: hidden;
2750 }
2751 .wpfnl-dashboard__inner-content.no-funnel .video-container iframe {
2752 position: absolute;
2753 top: 0;
2754 left: 0;
2755 width: 100%;
2756 height: 100%;
2757 border-radius: 14px;
2758 }
2759 .wpfnl-dashboard__inner-content.no-funnel .visually-hidden {
2760 position: absolute;
2761 width: 1px;
2762 height: 1px;
2763 padding: 0;
2764 margin: -1px;
2765 overflow: hidden;
2766 clip: rect(0, 0, 0, 0);
2767 white-space: nowrap;
2768 border: 0;
2769 }
2770 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-enter-active,
2771 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-leave-active {
2772 transition: opacity 0.3s ease;
2773 }
2774 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-enter-from,
2775 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-leave-to {
2776 opacity: 0;
2777 }
2778
2779 @media only screen and (min-width: 1921px) {
2780 .wpfnl-dashboard {
2781 min-height: calc(108vh - 120px);
2782 }
2783 }
2784 @media only screen and (max-width: 1699px) {
2785 .wpfnl-dashboard {
2786 min-height: calc(113vh - 120px);
2787 }
2788 .dashboard-nav__content {
2789 width: calc(100% - 80px);
2790 }
2791 .wpfnl-dashboard .no-funnel-info {
2792 width: calc(100% - 380px);
2793 padding: 20px;
2794 gap: 20px;
2795 }
2796 .wpfnl-dashboard .no-funnel-info .video-preview {
2797 width: 370px;
2798 }
2799 .wpfnl-dashboard .no-funnel-info .video-poster {
2800 height: 311px;
2801 }
2802 }
2803 @media only screen and (max-width: 1399px) {
2804 .wpfnl-dashboard__header.overview-header {
2805 padding: 24px 0 0;
2806 }
2807 .dashboard-nav__content {
2808 width: calc(100% - 48px);
2809 }
2810 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro {
2811 font-size: 15px;
2812 min-width: 150px;
2813 }
2814 .wpfnl-dashboard .no-funnel-info .info-link {
2815 font-size: 14px;
2816 }
2817 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info {
2818 padding: 30px 50px 30px 40px;
2819 }
2820 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview {
2821 width: 420px;
2822 }
2823 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:before {
2824 inset: -12px;
2825 }
2826 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:after {
2827 inset: -24px;
2828 }
2829 }
2830 @media only screen and (max-width: 1199px) {
2831 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-ul {
2832 gap: 18px;
2833 }
2834 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro {
2835 min-width: 135px;
2836 padding: 10px 15px;
2837 font-size: 14px;
2838 }
2839 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content .upgrade-to-pro-message h3 {
2840 font-size: 16px;
2841 }
2842 .wpfnl-dashboard__header.overview-header {
2843 padding: 20px 0 0;
2844 }
2845 .wpfnl-dashboard__header .wpfnl-dashboard-header-left:not(.trash-funnels-header) {
2846 flex-direction: column;
2847 align-items: flex-start;
2848 gap: 11px;
2849 }
2850 .overview-header .wpfnl-dashboard__inner-content {
2851 margin-top: 0px;
2852 }
2853 .wpfnl-dashboard__inner-content.no-funnel .no-trash-wrapper {
2854 padding: 100px 0;
2855 }
2856 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info {
2857 padding: 20px 36px 24px 24px;
2858 }
2859 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview {
2860 width: 330px;
2861 }
2862 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:after {
2863 opacity: 0;
2864 }
2865 }
2866 @media only screen and (max-width: 960px) {
2867 .dashboard-nav__content .import-funnel-modal {
2868 left: 34px;
2869 width: calc(100% - 34px);
2870 }
2871 }
2872 @media only screen and (max-width: 782px) {
2873 .dashboard-nav__content .import-funnel-modal {
2874 left: 0;
2875 width: 100%;
2876 }
2877 }
2878 .wpfnl-sc-analytics-overview {
2879 margin-top: 20px;
2880 margin-bottom: 24px;
2881 background: #fff;
2882 border: 1px solid #E4E6EB;
2883 border-radius: 10px;
2884 overflow: hidden;
2885 transition: max-height 0.3s ease;
2886 }
2887 .wpfnl-sc-analytics-overview.collapsed .wpfnl-sc-analytics-cards {
2888 display: none;
2889 }
2890 .wpfnl-sc-analytics-overview.collapsed .wpfnl-sc-analytics-toggle .toggle-arrow {
2891 transform: rotate(180deg);
2892 }
2893 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-cards {
2894 display: grid;
2895 grid-template-columns: repeat(4, 1fr);
2896 gap: 0;
2897 padding: 24px 20px;
2898 }
2899 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card {
2900 display: flex;
2901 align-items: center;
2902 gap: 16px;
2903 padding: 0 20px;
2904 border-right: 1px solid #E4E6EB;
2905 }
2906 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card:first-child {
2907 padding-left: 0;
2908 }
2909 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card:last-child {
2910 border-right: none;
2911 }
2912 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap {
2913 width: 48px;
2914 height: 48px;
2915 display: flex;
2916 align-items: center;
2917 justify-content: center;
2918 border-radius: 50%;
2919 background: linear-gradient(135deg, #FFF3EC 0%, #FFE8D9 100%);
2920 border: 1px solid #FDDCC9;
2921 }
2922 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap--purple {
2923 background: linear-gradient(135deg, #F3EEFF 0%, #E8DDFB 100%);
2924 border-color: #D8C9F5;
2925 }
2926 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap--orange {
2927 background: linear-gradient(135deg, #FFF3EC 0%, #FFE8D9 100%);
2928 border-color: #FDDCC9;
2929 }
2930 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap--green {
2931 background: linear-gradient(135deg, #ECFDF5 0%, #D1FAE5 100%);
2932 border-color: #A7F3D0;
2933 }
2934 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__content .card-title {
2935 display: block;
2936 color: #7A8B9A;
2937 font-size: 13px;
2938 font-weight: 400;
2939 line-height: 1.3;
2940 margin-bottom: 4px;
2941 }
2942 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__content .card-value {
2943 display: block;
2944 color: #2D3149;
2945 font-size: 22px;
2946 font-weight: 600;
2947 line-height: 1.2;
2948 }
2949 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle {
2950 display: flex;
2951 justify-content: center;
2952 padding: 8px 0;
2953 border-top: 1px solid #E4E6EB;
2954 cursor: pointer;
2955 }
2956 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle__btn {
2957 display: flex;
2958 align-items: center;
2959 justify-content: center;
2960 width: 28px;
2961 height: 28px;
2962 border-radius: 50%;
2963 border: 1px solid #E4E6EB;
2964 background: #fff;
2965 cursor: pointer;
2966 transition: background 0.2s;
2967 }
2968 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle__btn:hover {
2969 background: #F5F6FA;
2970 }
2971 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle .toggle-arrow {
2972 transition: transform 0.3s ease;
2973 }
2974
2975 @media only screen and (max-width: 1199px) {
2976 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-cards {
2977 grid-template-columns: repeat(2, 1fr);
2978 gap: 20px;
2979 }
2980 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card {
2981 border-right: none;
2982 padding-left: 0;
2983 }
2984 }
2985 @media only screen and (max-width: 600px) {
2986 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-cards {
2987 grid-template-columns: 1fr;
2988 }
2989 }
2990 .wpfnl-guided-onboarding {
2991 margin-top: -24px;
2992 background-color: #EDEBF2;
2993 padding: 30px 0;
2994 }
2995 .wpfnl-guided-onboarding .wpfnl-guided-onboarding-wrapper {
2996 display: flex;
2997 flex-flow: row wrap;
2998 gap: 20px;
2999 width: calc(100% - 280px);
3000 margin: 0 auto;
3001 }
3002 .wpfnl-guided-onboarding .onboarding-title-area {
3003 width: 100%;
3004 display: flex;
3005 align-items: center;
3006 justify-content: space-between;
3007 gap: 20px;
3008 }
3009 .wpfnl-guided-onboarding .onboarding-title-area .onboarding-title {
3010 color: #1D2327;
3011 font-size: 24px;
3012 font-weight: 600;
3013 line-height: 1.2;
3014 margin: 0;
3015 }
3016 .wpfnl-guided-onboarding .onboarding-title-area .dismiss-button {
3017 border: none;
3018 padding: 0;
3019 background: transparent;
3020 display: flex;
3021 align-items: center;
3022 gap: 5px;
3023 cursor: pointer;
3024 color: #707070;
3025 font-size: 14px;
3026 font-weight: 400;
3027 line-height: 1;
3028 }
3029 .wpfnl-guided-onboarding .onboarding-title-area .dismiss-button svg {
3030 display: block;
3031 }
3032 .wpfnl-guided-onboarding .onboarding-title-area .dismiss-button:hover {
3033 color: #6E42D3;
3034 }
3035 .wpfnl-guided-onboarding .onboarding-title-area .dismiss-button:hover path {
3036 stroke: #6E42D3;
3037 }
3038 .wpfnl-guided-onboarding .onboarding-list-wrapper {
3039 width: 410px;
3040 border-radius: 10px;
3041 background-color: #FFF;
3042 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
3043 }
3044 .wpfnl-guided-onboarding .onboarding-progressbar {
3045 padding: 20px 24px;
3046 border-bottom: 1px solid #EDECF2;
3047 }
3048 .wpfnl-guided-onboarding .onboarding-progressbar .funnel-progress-title {
3049 margin: 0 0 18px 0;
3050 color: #2D3149;
3051 font-size: 18px;
3052 font-weight: 600;
3053 line-height: 1.3;
3054 }
3055 .wpfnl-guided-onboarding .onboarding-progressbar .funnel-progress-wrapper {
3056 display: flex;
3057 align-items: center;
3058 gap: 16px;
3059 }
3060 .wpfnl-guided-onboarding .onboarding-progressbar .funnel-progress-label {
3061 white-space: nowrap;
3062 color: #9398A5;
3063 font-size: 14px;
3064 font-weight: 400;
3065 line-height: 1;
3066 display: inline-block;
3067 }
3068 .wpfnl-guided-onboarding .onboarding-progressbar .funnel-progress-bar {
3069 flex: 1;
3070 height: 8px;
3071 background: #E3E1EA;
3072 border-radius: 999px;
3073 position: relative;
3074 overflow: hidden;
3075 }
3076 .wpfnl-guided-onboarding .onboarding-progressbar .funnel-progress-fill {
3077 height: 100%;
3078 background-color: #6E42D3;
3079 border-radius: 999px;
3080 transition: width 0.4s ease;
3081 }
3082 .wpfnl-guided-onboarding .onboarding-list {
3083 width: 100%;
3084 padding: 24px;
3085 display: flex;
3086 flex-flow: column;
3087 gap: 24px;
3088 }
3089 .wpfnl-guided-onboarding .onboarding-item {
3090 display: flex;
3091 align-items: center;
3092 gap: 14px;
3093 justify-content: space-between;
3094 transition: background 0.2s ease;
3095 }
3096 .wpfnl-guided-onboarding .onboarding-item .left {
3097 display: flex;
3098 align-items: center;
3099 gap: 10px;
3100 min-width: 0;
3101 }
3102 .wpfnl-guided-onboarding .onboarding-item .right {
3103 display: flex;
3104 align-items: center;
3105 gap: 10px;
3106 flex-shrink: 0;
3107 text-align: right;
3108 }
3109 .wpfnl-guided-onboarding .onboarding-item .right .status {
3110 color: #9398A5;
3111 font-size: 14px;
3112 font-weight: 400;
3113 line-height: 1;
3114 }
3115 .wpfnl-guided-onboarding .onboarding-item .right .status.completed {
3116 color: #239654;
3117 font-weight: 500;
3118 }
3119 .wpfnl-guided-onboarding .onboarding-item .right .action-link {
3120 color: #6E42D3;
3121 font-size: 14px;
3122 font-weight: 500;
3123 line-height: 1;
3124 text-decoration: none;
3125 display: inline-flex;
3126 align-items: center;
3127 gap: 8px;
3128 }
3129 .wpfnl-guided-onboarding .onboarding-item .right .action-link svg {
3130 display: block;
3131 }
3132 .wpfnl-guided-onboarding .onboarding-item .right .action-link:hover {
3133 text-decoration: underline;
3134 }
3135 .wpfnl-guided-onboarding .onboarding-item .right .action-link:focus-visible {
3136 outline: 2px solid #6E42D3;
3137 outline-offset: 3px;
3138 border-radius: 3px;
3139 }
3140 .wpfnl-guided-onboarding .onboarding-item .right .pro-badge {
3141 padding: 4px 8px;
3142 border: 1px solid #6E42D3;
3143 border-radius: 999px;
3144 color: #6E42D3;
3145 font-size: 11px;
3146 font-weight: 600;
3147 line-height: 1;
3148 letter-spacing: 0.02em;
3149 text-transform: uppercase;
3150 }
3151 .wpfnl-guided-onboarding .onboarding-item .icon {
3152 width: 24px;
3153 height: 24px;
3154 border-radius: 50%;
3155 display: flex;
3156 align-items: center;
3157 justify-content: center;
3158 border: 1px solid #DDDBE4;
3159 background: transparent;
3160 }
3161 .wpfnl-guided-onboarding .onboarding-item .icon svg {
3162 display: block;
3163 }
3164 .wpfnl-guided-onboarding .onboarding-item .title {
3165 color: #2D3149;
3166 font-size: 16px;
3167 font-weight: 400;
3168 line-height: 1.3;
3169 }
3170 .wpfnl-guided-onboarding .onboarding-item .filled {
3171 background: #ececf3;
3172 color: #7b8190;
3173 }
3174 .wpfnl-guided-onboarding .onboarding-item .outline {
3175 border-color: #E4E6EB;
3176 background: transparent;
3177 }
3178 .wpfnl-guided-onboarding .onboarding-item.completed .icon {
3179 border-color: #239654;
3180 }
3181 .wpfnl-guided-onboarding .onboarding-info {
3182 width: calc(100% - 430px);
3183 border-radius: 10px;
3184 background-color: #FFF;
3185 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
3186 padding: 24px 24px 24px 40px;
3187 display: flex;
3188 gap: 30px;
3189 align-items: center;
3190 }
3191 .wpfnl-guided-onboarding .onboarding-info .info-content {
3192 flex: 1;
3193 }
3194 .wpfnl-guided-onboarding .onboarding-info .info-title {
3195 color: #1D2327;
3196 font-size: 18px;
3197 font-weight: 600;
3198 line-height: 1.3;
3199 margin: 0 0 5px 0;
3200 }
3201 .wpfnl-guided-onboarding .onboarding-info .info-description {
3202 margin: 0 0 18px 0;
3203 color: #6E7A85;
3204 font-size: 14px;
3205 font-weight: 400;
3206 line-height: 1.5;
3207 max-width: 330px;
3208 }
3209 .wpfnl-guided-onboarding .onboarding-info .info-features {
3210 list-style: none;
3211 margin: 0 0 28px 0;
3212 padding: 0;
3213 display: flex;
3214 flex-direction: column;
3215 gap: 12px;
3216 }
3217 .wpfnl-guided-onboarding .onboarding-info .feature-item {
3218 display: flex;
3219 align-items: center;
3220 gap: 10px;
3221 color: #1F2937;
3222 font-size: 14px;
3223 font-weight: 400;
3224 line-height: 1.5;
3225 margin: 0;
3226 padding-left: 22px;
3227 position: relative;
3228 }
3229 .wpfnl-guided-onboarding .onboarding-info .feature-item svg {
3230 position: absolute;
3231 left: 0;
3232 top: 7px;
3233 width: 14px;
3234 height: auto;
3235 }
3236 .wpfnl-guided-onboarding .onboarding-info .info-links {
3237 display: flex;
3238 align-items: center;
3239 flex-wrap: wrap;
3240 gap: 20px;
3241 row-gap: 10px;
3242 }
3243 .wpfnl-guided-onboarding .onboarding-info .info-link {
3244 display: inline-flex;
3245 align-items: center;
3246 gap: 8px;
3247 color: #6E42D3;
3248 font-size: 15px;
3249 font-weight: 500;
3250 line-height: 1;
3251 text-decoration: none;
3252 transition: opacity 0.2s ease;
3253 }
3254 .wpfnl-guided-onboarding .onboarding-info .info-link svg {
3255 display: block;
3256 flex-shrink: 0;
3257 }
3258 .wpfnl-guided-onboarding .onboarding-info .info-link:hover {
3259 text-decoration: underline;
3260 }
3261 .wpfnl-guided-onboarding .onboarding-info .info-link:focus {
3262 outline: 2px solid #6E42D3;
3263 outline-offset: 2px;
3264 border-radius: 4px;
3265 }
3266 .wpfnl-guided-onboarding .onboarding-info .video-wrapper {
3267 flex-shrink: 0;
3268 height: 100%;
3269 }
3270 .wpfnl-guided-onboarding .onboarding-info .video-preview {
3271 position: relative;
3272 width: 450px;
3273 height: 100%;
3274 border-radius: 10px;
3275 overflow: hidden;
3276 cursor: pointer;
3277 transition: transform 0.2s ease;
3278 }
3279 .wpfnl-guided-onboarding .onboarding-info .video-preview:focus {
3280 outline: 3px solid #6E42D3;
3281 outline-offset: 2px;
3282 }
3283 .wpfnl-guided-onboarding .onboarding-info .video-poster {
3284 width: 100%;
3285 height: 336px;
3286 object-fit: cover;
3287 display: block;
3288 }
3289 .wpfnl-guided-onboarding .onboarding-info .play-overlay {
3290 position: absolute;
3291 top: 0;
3292 left: 0;
3293 right: 0;
3294 bottom: 0;
3295 display: flex;
3296 align-items: center;
3297 justify-content: center;
3298 background: rgba(0, 0, 0, 0.3);
3299 transition: background 0.2s ease;
3300 }
3301 .video-preview:hover .wpfnl-guided-onboarding .onboarding-info .play-overlay {
3302 background: rgba(0, 0, 0, 0.4);
3303 }
3304 .wpfnl-guided-onboarding .onboarding-info .play-button {
3305 width: 57px;
3306 height: 57px;
3307 border-radius: 50%;
3308 background: #fff;
3309 display: flex;
3310 align-items: center;
3311 justify-content: center;
3312 transition: all 0.2s ease;
3313 box-shadow: 0 0 0 10px #e7e7e7;
3314 position: relative;
3315 }
3316 .wpfnl-guided-onboarding .onboarding-info .play-button:before {
3317 content: "";
3318 position: absolute;
3319 inset: -11px;
3320 border-radius: 50%;
3321 background: transparent;
3322 border: 1px solid #fff;
3323 }
3324 .wpfnl-guided-onboarding .onboarding-info .play-button svg {
3325 margin-left: 4px;
3326 display: block;
3327 }
3328 .video-preview:hover .wpfnl-guided-onboarding .onboarding-info .play-button {
3329 background: rgb(110, 66, 211);
3330 transform: scale(1.1);
3331 }
3332 .wpfnl-guided-onboarding .video-popup-overlay {
3333 position: fixed;
3334 top: 0;
3335 left: 0;
3336 right: 0;
3337 bottom: 0;
3338 background: rgba(0, 0, 0, 0.8);
3339 display: flex;
3340 align-items: center;
3341 justify-content: center;
3342 z-index: 99999;
3343 padding: 20px;
3344 }
3345 .wpfnl-guided-onboarding .video-popup-content {
3346 position: relative;
3347 width: 100%;
3348 max-width: 760px;
3349 border-radius: 16px;
3350 background: #fff;
3351 padding: 20px;
3352 }
3353 .wpfnl-guided-onboarding .video-popup-close {
3354 position: absolute;
3355 top: -20px;
3356 right: -20px;
3357 width: 40px;
3358 height: 40px;
3359 background: rgb(255, 255, 255);
3360 border: none;
3361 border-radius: 50%;
3362 color: #fff;
3363 cursor: pointer;
3364 display: flex;
3365 align-items: center;
3366 justify-content: center;
3367 transition: all 0.2s ease;
3368 z-index: 10;
3369 box-shadow: 1px 1px 7px rgba(34, 34, 34, 0.2784313725);
3370 }
3371 .wpfnl-guided-onboarding .video-popup-close:focus {
3372 outline: 2px solid #fff;
3373 outline-offset: 2px;
3374 }
3375 .wpfnl-guided-onboarding .video-container {
3376 position: relative;
3377 padding-bottom: 56.25%;
3378 height: 0;
3379 overflow: hidden;
3380 }
3381 .wpfnl-guided-onboarding .video-container iframe {
3382 position: absolute;
3383 top: 0;
3384 left: 0;
3385 width: 100%;
3386 height: 100%;
3387 border-radius: 14px;
3388 }
3389 .wpfnl-guided-onboarding .visually-hidden {
3390 position: absolute;
3391 width: 1px;
3392 height: 1px;
3393 padding: 0;
3394 margin: -1px;
3395 overflow: hidden;
3396 clip: rect(0, 0, 0, 0);
3397 white-space: nowrap;
3398 border: 0;
3399 }
3400 .wpfnl-guided-onboarding .video-popup-fade-enter-active,
3401 .wpfnl-guided-onboarding .video-popup-fade-leave-active {
3402 transition: opacity 0.3s ease;
3403 }
3404 .wpfnl-guided-onboarding .video-popup-fade-enter-from,
3405 .wpfnl-guided-onboarding .video-popup-fade-leave-to {
3406 opacity: 0;
3407 }
3408
3409 @media only screen and (max-width: 1699px) {
3410 .wpfnl-guided-onboarding .wpfnl-guided-onboarding-wrapper {
3411 width: calc(100% - 90px);
3412 }
3413 .wpfnl-guided-onboarding .onboarding-list-wrapper {
3414 width: 360px;
3415 }
3416 .wpfnl-guided-onboarding .onboarding-progressbar {
3417 padding: 15px 20px;
3418 }
3419 .wpfnl-guided-onboarding .onboarding-progressbar .funnel-progress-title {
3420 font-size: 16px;
3421 }
3422 .wpfnl-guided-onboarding .onboarding-list {
3423 padding: 15px 20px;
3424 }
3425 .wpfnl-guided-onboarding .onboarding-item .title {
3426 font-size: 14px;
3427 }
3428 .wpfnl-guided-onboarding .onboarding-info {
3429 width: calc(100% - 380px);
3430 padding: 20px;
3431 gap: 20px;
3432 }
3433 .wpfnl-guided-onboarding .onboarding-info .video-preview {
3434 width: 370px;
3435 }
3436 .wpfnl-guided-onboarding .onboarding-info .video-poster {
3437 height: 311px;
3438 }
3439 }
3440 @media only screen and (max-width: 1399px) {
3441 .wpfnl-guided-onboarding .onboarding-list-wrapper {
3442 width: 340px;
3443 }
3444 .wpfnl-guided-onboarding .onboarding-info {
3445 width: calc(100% - 360px);
3446 }
3447 .wpfnl-guided-onboarding .wpfnl-guided-onboarding-wrapper {
3448 width: 100%;
3449 padding: 0 20px;
3450 }
3451 .wpfnl-guided-onboarding .onboarding-info .info-link {
3452 font-size: 14px;
3453 }
3454 .wpfnl-guided-onboarding .onboarding-info .video-preview {
3455 width: 270px;
3456 }
3457 .wpfnl-guided-onboarding .onboarding-info .video-poster {
3458 height: auto;
3459 }
3460 }
3461 @media only screen and (max-width: 1199px) {
3462 .wpfnl-guided-onboarding .onboarding-title-area .onboarding-title {
3463 font-size: 20px;
3464 }
3465 .wpfnl-guided-onboarding .wpfnl-guided-onboarding-wrapper {
3466 flex-flow: column;
3467 }
3468 .wpfnl-guided-onboarding .onboarding-list-wrapper {
3469 width: 100%;
3470 }
3471 .wpfnl-guided-onboarding .onboarding-info {
3472 width: 100%;
3473 }
3474 .wpfnl-guided-onboarding .onboarding-info .video-preview {
3475 width: 370px;
3476 }
3477 .wpfnl-guided-onboarding .video-popup-content {
3478 width: 90%;
3479 }
3480 }
3481 @media only screen and (max-width: 767px) {
3482 .wpfnl-guided-onboarding .wpfnl-guided-onboarding-wrapper {
3483 width: calc(100% - 40px);
3484 }
3485 .wpfnl-guided-onboarding .info-title {
3486 font-size: 18px;
3487 }
3488 .wpfnl-guided-onboarding .info-description {
3489 font-size: 13px;
3490 }
3491 .wpfnl-guided-onboarding .info-links {
3492 flex-direction: column;
3493 align-items: flex-start;
3494 gap: 12px;
3495 }
3496 .wpfnl-guided-onboarding .play-button {
3497 width: 60px;
3498 height: 60px;
3499 }
3500 .wpfnl-guided-onboarding .play-button svg {
3501 width: 18px;
3502 height: 21px;
3503 }
3504 }
3505 .empty-funnel-onboarding {
3506 display: flex;
3507 flex-direction: column;
3508 gap: 24px;
3509 margin: auto;
3510 padding: 0 10px;
3511 width: calc(100% - 280px);
3512 }
3513 .empty-funnel-onboarding .empty-funnel-onboarding-banner {
3514 display: flex;
3515 align-items: center;
3516 background-color: #fff;
3517 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
3518 border-radius: 10px;
3519 padding: 30px 30px 30px 40px;
3520 justify-content: space-between;
3521 overflow: hidden;
3522 gap: 40px;
3523 }
3524 .empty-funnel-onboarding .empty-funnel-onboarding-banner .banner-title {
3525 color: #1D2327;
3526 font-size: 24px;
3527 font-weight: 600;
3528 line-height: 1.3;
3529 margin: 0 0 7px;
3530 }
3531 .empty-funnel-onboarding .empty-funnel-onboarding-banner .banner-description {
3532 color: #6E7A85;
3533 font-size: 14px;
3534 font-weight: 400;
3535 line-height: 1.5;
3536 margin: 0;
3537 }
3538 .empty-funnel-onboarding .empty-funnel-onboarding-banner .list-title {
3539 margin-top: 30px;
3540 color: #363B4E;
3541 font-size: 18px;
3542 font-weight: 600;
3543 line-height: 1;
3544 }
3545 .empty-funnel-onboarding .empty-funnel-onboarding-banner .feature-list {
3546 margin: 0;
3547 display: flex;
3548 flex-flow: column;
3549 gap: 15px;
3550 margin-top: 17px;
3551 }
3552 .empty-funnel-onboarding .empty-funnel-onboarding-banner .feature-list li {
3553 color: #1F2937;
3554 font-size: 14px;
3555 font-weight: 400;
3556 line-height: 1;
3557 position: relative;
3558 margin: 0;
3559 padding-left: 25px;
3560 }
3561 .empty-funnel-onboarding .empty-funnel-onboarding-banner .feature-list li:before {
3562 content: "";
3563 position: absolute;
3564 left: 0;
3565 top: -1px;
3566 width: 18px;
3567 height: 18px;
3568 background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTQiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAxNCAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTExLjY2NzMgMy41TDUuMjUwNjUgOS45MTY2N0wyLjMzMzk4IDciIHN0cm9rZT0iIzQ0NEQ1RSIgc3Ryb2tlLXdpZHRoPSIxLjQiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8L3N2Zz4K);
3569 background-repeat: no-repeat;
3570 background-size: contain;
3571 background-position: center;
3572 }
3573 .empty-funnel-onboarding .empty-funnel-onboarding-banner .cta-wrapper {
3574 display: flex;
3575 align-items: center;
3576 gap: 10px;
3577 margin-top: 30px;
3578 }
3579 .empty-funnel-onboarding .empty-funnel-onboarding-banner .btn-default {
3580 display: inline-flex;
3581 align-items: center;
3582 justify-content: center;
3583 gap: 5px;
3584 padding: 12px 20px;
3585 background: #6c41d3;
3586 text-decoration: none;
3587 transition: all 0.2s ease;
3588 white-space: nowrap;
3589 border-radius: 10px;
3590 border: 1px solid transparent;
3591 box-shadow: 0 2px 4px 0 rgba(223, 223, 249, 0.25);
3592 color: #fff;
3593 font-size: 15px;
3594 font-weight: 500;
3595 line-height: 1;
3596 transition: all 0.3s ease;
3597 }
3598 .empty-funnel-onboarding .empty-funnel-onboarding-banner .btn-default:hover {
3599 background-color: #4b1eb6;
3600 }
3601 .empty-funnel-onboarding .empty-funnel-onboarding-banner .btn-default.btn-outline {
3602 background: transparent;
3603 color: #1F2937;
3604 border-color: #EDECF2;
3605 box-shadow: 0 2px 4px 0 rgba(223, 223, 249, 0.25);
3606 }
3607 .empty-funnel-onboarding .empty-funnel-onboarding-banner .btn-default.btn-outline:hover {
3608 background-color: #f5f5f5;
3609 }
3610 .empty-funnel-onboarding .onboarding-banner-left {
3611 width: 55%;
3612 }
3613 .empty-funnel-onboarding .onboarding-banner-right {
3614 width: 45%;
3615 display: flex;
3616 flex-flow: column;
3617 align-items: center;
3618 justify-content: flex-end;
3619 position: relative;
3620 }
3621 .empty-funnel-onboarding .onboarding-banner-right .circle-shape {
3622 display: block;
3623 height: 470px;
3624 width: 470px;
3625 background-color: #EFEEF4;
3626 border-radius: 100%;
3627 position: absolute;
3628 top: 50px;
3629 right: 0;
3630 z-index: 0;
3631 }
3632 .empty-funnel-onboarding .onboarding-banner-right img {
3633 display: block;
3634 height: auto;
3635 transform: translateY(30px);
3636 position: relative;
3637 z-index: 1;
3638 }
3639 .empty-funnel-onboarding .onboarding-template-wrapper {
3640 width: 100%;
3641 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
3642 background-color: #fff;
3643 border-radius: 10px;
3644 }
3645 .empty-funnel-onboarding .onboarding-template-wrapper .wpfnl {
3646 background-color: transparent;
3647 }
3648 .empty-funnel-onboarding .onboarding-template-wrapper .create-funnel-template-modal,
3649 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal {
3650 background-color: transparent;
3651 }
3652 .empty-funnel-onboarding .onboarding-template-wrapper .template-header {
3653 display: flex;
3654 align-items: center;
3655 justify-content: space-between;
3656 padding: 15px 24px;
3657 border-bottom: 1px solid #EEF0F3;
3658 }
3659 .empty-funnel-onboarding .onboarding-template-wrapper .template-header .template-title {
3660 margin: 0;
3661 color: #2D3149;
3662 font-size: 18px;
3663 font-weight: 600;
3664 line-height: 1;
3665 }
3666 .empty-funnel-onboarding .onboarding-template-wrapper .template-header .template-actions {
3667 display: flex;
3668 gap: 16px;
3669 }
3670 .empty-funnel-onboarding .onboarding-template-wrapper .template-header .template-action-btn {
3671 display: inline-flex;
3672 align-items: center;
3673 justify-content: center;
3674 padding: 12px 22px;
3675 background: #ffffff;
3676 text-decoration: none;
3677 transition: all 0.2s ease;
3678 white-space: nowrap;
3679 border-radius: 10px;
3680 border: 1px solid transparent;
3681 box-shadow: 0 2px 4px 0 rgba(223, 223, 249, 0.25);
3682 color: #2D3149;
3683 font-size: 15px;
3684 font-weight: 500;
3685 line-height: 1;
3686 }
3687 .empty-funnel-onboarding .onboarding-template-wrapper .template-header .btn-outline {
3688 border-color: #EEF0F3;
3689 }
3690 .empty-funnel-onboarding .onboarding-template-wrapper .template-header .btn-outline:hover {
3691 background: #f7f8fc;
3692 }
3693 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal {
3694 position: relative;
3695 top: inherit;
3696 left: inherit;
3697 width: 100%;
3698 background: transparent;
3699 z-index: 0;
3700 padding: 24px;
3701 overflow: auto;
3702 }
3703 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates {
3704 gap: 20px;
3705 width: max-content;
3706 min-width: 100%;
3707 min-height: auto;
3708 }
3709 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .templates-loading {
3710 width: 100%;
3711 height: 340px;
3712 background: #ffffff;
3713 display: flex;
3714 align-items: center;
3715 justify-content: center;
3716 border-radius: 10px;
3717 }
3718 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .templates-loading .wpfnl-loader {
3719 display: block;
3720 width: 40px;
3721 height: 40px;
3722 }
3723 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
3724 width: calc(25% - 15px);
3725 border-radius: 10px;
3726 border: 1px solid #F1EFF7;
3727 background: #FFF;
3728 box-shadow: 0 20px 20px 0 rgba(190, 190, 215, 0.15);
3729 }
3730 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .template-image-wrapper:before {
3731 padding-top: calc(100% - 10px);
3732 }
3733 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .templates-skeleton {
3734 display: flex;
3735 gap: 20px;
3736 width: 100%;
3737 }
3738 @keyframes onboarding-shimmer {
3739 0% {
3740 background-position: -600px 0;
3741 }
3742 100% {
3743 background-position: 600px 0;
3744 }
3745 }
3746 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .skeleton-block {
3747 background: linear-gradient(90deg, #f0eef8 25%, #e4e0f2 50%, #f0eef8 75%);
3748 background-size: 600px 100%;
3749 animation: onboarding-shimmer 1.4s ease-in-out infinite;
3750 border-radius: 6px;
3751 display: block;
3752 }
3753 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template--skeleton {
3754 pointer-events: none;
3755 }
3756 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template--skeleton .template-image-wrapper:before {
3757 padding-top: calc(100% - 10px);
3758 }
3759 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template--skeleton .funnel-template-info {
3760 display: flex;
3761 flex-direction: column;
3762 gap: 8px;
3763 padding: 12px 14px;
3764 }
3765 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template--skeleton .skeleton-title {
3766 width: 70%;
3767 height: 14px;
3768 }
3769 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template--skeleton .skeleton-steps {
3770 width: 40%;
3771 height: 11px;
3772 }
3773 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-preview-modal .funnel-templates-body {
3774 overflow: auto;
3775 }
3776
3777 @media only screen and (max-width: 1699px) {
3778 .empty-funnel-onboarding {
3779 width: calc(100% - 80px);
3780 }
3781 .wpfnl-guided-onboarding .onboarding-template-wrapper .template-header {
3782 padding: 13px 20px;
3783 }
3784 .wpfnl-guided-onboarding .onboarding-template-wrapper .template-header .template-title {
3785 font-size: 16px;
3786 }
3787 .wpfnl-guided-onboarding .onboarding-template-wrapper .template-header .template-actions {
3788 gap: 10px;
3789 }
3790 .wpfnl-guided-onboarding .onboarding-template-wrapper .template-header .template-action-btn {
3791 padding: 9px 16px;
3792 font-size: 13px;
3793 }
3794 .wpfnl-guided-onboarding .onboarding-template-wrapper .onboarding-template-library-modal {
3795 padding: 18px;
3796 }
3797 }
3798 @media screen and (max-width: 1399px) {
3799 .empty-funnel-onboarding {
3800 width: calc(100% - 48px);
3801 }
3802 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates {
3803 gap: 12px;
3804 }
3805 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
3806 width: calc(25% - 9px);
3807 }
3808 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .funnel-template-info .title {
3809 color: #363B4E;
3810 font-size: 13px;
3811 }
3812 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .templates-loading {
3813 height: 310px;
3814 }
3815 .empty-funnel-onboarding .empty-funnel-onboarding-banner .cta-wrapper {
3816 flex-wrap: wrap;
3817 }
3818 .empty-funnel-onboarding .onboarding-banner-right {
3819 width: 50%;
3820 }
3821 }
3822 @media screen and (max-width: 1299px) {
3823 .empty-funnel-onboarding .onboarding-banner-right img {
3824 max-width: 490px;
3825 }
3826 }
3827 @media screen and (max-width: 1199px) {
3828 .empty-funnel-onboarding .empty-funnel-onboarding-banner {
3829 padding: 20px 20px 20px 20px;
3830 }
3831 .empty-funnel-onboarding .empty-funnel-onboarding-banner .banner-title {
3832 font-size: 20px;
3833 }
3834 .empty-funnel-onboarding .empty-funnel-onboarding-banner .list-title {
3835 font-size: 16px;
3836 }
3837 .empty-funnel-onboarding .empty-funnel-onboarding-banner .btn-default {
3838 font-size: 14px;
3839 }
3840 .empty-funnel-onboarding .onboarding-banner-right img {
3841 max-width: 100%;
3842 transform: translateY(90px);
3843 }
3844 .empty-funnel-onboarding .onboarding-banner-right .circle-shape {
3845 height: 360px;
3846 width: 360px;
3847 }
3848 .wpfnl-guided-onboarding .onboarding-template-wrapper {
3849 width: 100%;
3850 }
3851 .wpfnl-guided-onboarding .onboarding-template-wrapper .template-header {
3852 flex-wrap: wrap;
3853 row-gap: 10px;
3854 padding: 13px 15px;
3855 }
3856 .wpfnl-guided-onboarding .onboarding-template-wrapper .template-header .template-action-btn {
3857 padding: 9px 12px;
3858 }
3859 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates {
3860 width: 100%;
3861 }
3862 .empty-funnel-onboarding .onboarding-template-wrapper .onboarding-template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
3863 width: calc(33% - 6px);
3864 }
3865 }
3866 .wpfnl-comparison-chart-wrapper {
3867 border-radius: 10px;
3868 background: #FFF;
3869 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
3870 padding: 24px;
3871 }
3872 .wpfnl-comparison-chart-wrapper .wpfnl-loader {
3873 display: flex;
3874 margin: 150px auto;
3875 padding: 40px;
3876 }
3877 .wpfnl-comparison-chart-wrapper .wpfnl-chart-title {
3878 color: #2D3149;
3879 font-size: 18px;
3880 font-style: normal;
3881 font-weight: 600;
3882 line-height: 18px;
3883 margin: 0;
3884 margin-bottom: 24px;
3885 }
3886 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container {
3887 display: flex;
3888 align-items: center;
3889 justify-content: space-between;
3890 }
3891 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab {
3892 padding: 16px 24px;
3893 position: relative;
3894 cursor: pointer;
3895 }
3896 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.disabled {
3897 pointer-events: none;
3898 cursor: not-allowed;
3899 }
3900 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.disabled .wpfnl-overlay {
3901 width: 99.5%;
3902 padding: 0;
3903 left: -1px;
3904 border-radius: 0;
3905 bottom: -1px;
3906 top: unset;
3907 border: 1px solid rgba(238, 240, 243, 0.8);
3908 border-bottom: none;
3909 border-radius: 10px 10px 0 0;
3910 }
3911 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header {
3912 display: flex;
3913 align-items: center;
3914 justify-content: flex-start;
3915 gap: 10px;
3916 margin-bottom: 10px;
3917 }
3918 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-tab-total-amount {
3919 margin: 0;
3920 color: #2D3149;
3921 font-size: 22px;
3922 font-style: normal;
3923 font-weight: 500;
3924 line-height: 1.36;
3925 letter-spacing: -0.44px;
3926 }
3927 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage {
3928 border-radius: 100px;
3929 padding: 4px 7px;
3930 display: flex;
3931 align-items: center;
3932 gap: 1px;
3933 justify-content: center;
3934 font-size: 12px;
3935 font-style: normal;
3936 font-weight: 500;
3937 line-height: 1;
3938 margin: 0;
3939 min-width: 40px;
3940 }
3941 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage.wpfnl-decrease {
3942 background: rgba(236, 89, 86, 0.1);
3943 color: #EC5956;
3944 }
3945 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage.wpfnl-increase {
3946 background: rgba(18, 183, 106, 0.1);
3947 color: #12B76A;
3948 }
3949 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-title {
3950 margin: 0;
3951 color: #667085;
3952 font-size: 14px;
3953 font-style: normal;
3954 font-weight: 400;
3955 line-height: 1;
3956 }
3957 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab::after {
3958 content: "";
3959 width: 1px;
3960 height: 60%;
3961 position: absolute;
3962 background: #E4E6EB;
3963 right: 0;
3964 top: 30%;
3965 }
3966 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.active {
3967 border-radius: 8px 8px 0px 0px;
3968 border: 1px solid rgba(238, 240, 243, 0.8);
3969 background: #FCFCFF;
3970 border-bottom: 0;
3971 }
3972 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.active::after {
3973 content: none;
3974 }
3975 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.no-after::after {
3976 content: none;
3977 }
3978 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab:last-child::after {
3979 content: none;
3980 }
3981 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body {
3982 border-radius: 0px 0px 8px 8px;
3983 border: 1px solid rgba(241, 240, 245, 0.8);
3984 background: #FCFCFF;
3985 padding: 24px;
3986 }
3987 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container {
3988 position: relative;
3989 }
3990 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps {
3991 position: absolute;
3992 top: 3px;
3993 left: 0;
3994 height: 292px;
3995 width: 100%;
3996 display: flex;
3997 flex-flow: column;
3998 justify-content: space-between;
3999 }
4000 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step {
4001 color: #9398A5;
4002 text-align: right;
4003 font-size: 12px;
4004 font-style: normal;
4005 font-weight: 400;
4006 line-height: 1.5;
4007 display: block;
4008 position: relative;
4009 }
4010 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step::before {
4011 content: "";
4012 position: absolute;
4013 left: 50px;
4014 bottom: 1px;
4015 top: inherit;
4016 width: calc(100% - 50px);
4017 height: 1px;
4018 background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23E4E7ECFF' stroke-width='4' stroke-dasharray='3%2c 11' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
4019 }
4020 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step span {
4021 width: 33px;
4022 display: block;
4023 text-align: right;
4024 position: relative;
4025 bottom: -7px;
4026 }
4027 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container {
4028 height: 320px;
4029 padding: 10px 0px 9px 60px;
4030 position: relative;
4031 z-index: 1;
4032 display: grid;
4033 grid-template-columns: repeat(12, 1fr);
4034 gap: 0;
4035 }
4036 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar {
4037 width: 100%;
4038 height: 94%;
4039 position: relative;
4040 display: flex;
4041 flex-flow: row nowrap;
4042 align-items: flex-end;
4043 gap: 6px;
4044 bottom: 0px;
4045 }
4046 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar::before {
4047 height: 100%;
4048 width: 1px;
4049 position: absolute;
4050 background: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMSAxOTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggc3Ryb2tlPSIjMkQzMTQ5IiBzdHJva2UtZGFzaGFycmF5PSI0IDQiIHN0cm9rZS13aWR0aD0iLjUiIGQ9Ik0uMjUuMjVoLjV2MTk4LjVoLS41eiIvPjwvc3ZnPg==");
4051 left: 38%;
4052 }
4053 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar:hover::before {
4054 content: "";
4055 }
4056 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar:hover .wpfnl-comparison-bar-tooltip {
4057 display: block;
4058 }
4059 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip {
4060 display: none;
4061 border-radius: 8px;
4062 background: #10052E;
4063 box-shadow: 0px 2px 15px 0px rgba(22, 28, 32, 0.08);
4064 padding: 15px 14px;
4065 width: 160px;
4066 z-index: 99;
4067 position: absolute;
4068 transform: translateX(-50%);
4069 left: 45%;
4070 }
4071 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip::before {
4072 content: "";
4073 background: #10052E;
4074 width: 10px;
4075 height: 10px;
4076 position: absolute;
4077 bottom: -5px;
4078 transform: rotate(45deg);
4079 left: 45%;
4080 }
4081 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data,
4082 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data {
4083 color: #CDCFD6;
4084 font-size: 13px;
4085 font-style: normal;
4086 font-weight: 400;
4087 line-height: 12px;
4088 margin: 0;
4089 display: flex;
4090 }
4091 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data b,
4092 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data b {
4093 color: #FFF;
4094 }
4095 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .circle,
4096 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .circle {
4097 width: 10px;
4098 height: 10px;
4099 border-radius: 50%;
4100 background: #6E42D3;
4101 display: inline-block;
4102 margin-right: 5px;
4103 }
4104 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .wpfnl-value-wrapper,
4105 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .wpfnl-value-wrapper {
4106 display: flex;
4107 flex-wrap: wrap;
4108 gap: 2px;
4109 }
4110 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data {
4111 margin-top: 8px;
4112 }
4113 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .circle {
4114 background: #EAE1FF;
4115 }
4116 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-bar-label {
4117 font-size: 12px;
4118 line-height: 1.2;
4119 color: #9398A5;
4120 position: absolute;
4121 bottom: -40px;
4122 left: 40%;
4123 transform: translateX(-50%);
4124 white-space: nowrap;
4125 transition: all 0.3s ease;
4126 }
4127 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-single-bar {
4128 flex: 1;
4129 min-width: 0;
4130 display: block;
4131 border-radius: 30px 30px 0 0;
4132 position: relative;
4133 }
4134 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-single-bar.wpfnl-compare-to-bar {
4135 background-color: #EAE1FF;
4136 }
4137 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-single-bar.wpfnl-compare-with-bar {
4138 background-color: #6E42D3;
4139 }
4140
4141 @media only screen and (max-width: 1600px) {
4142 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip {
4143 left: 40%;
4144 width: 94px;
4145 padding: 10px;
4146 }
4147 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data,
4148 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data {
4149 font-size: 10px;
4150 }
4151 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .circle,
4152 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .circle {
4153 width: 6px;
4154 height: 6px;
4155 margin-right: 3px;
4156 }
4157 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip b {
4158 display: block;
4159 margin-top: 2px;
4160 }
4161 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .wpfnl-value-wrapper {
4162 margin-top: -3px;
4163 }
4164 }
4165 @media only screen and (max-width: 1399px) {
4166 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab {
4167 padding: 10px 15px;
4168 }
4169 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-tab-total-amount {
4170 font-size: 18px;
4171 }
4172 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage {
4173 min-width: 40px;
4174 padding: 4px 5px;
4175 font-size: 9px;
4176 }
4177 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage svg {
4178 width: 12px;
4179 height: 12px;
4180 }
4181 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-title {
4182 font-size: 12px;
4183 }
4184 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar::before {
4185 left: 42%;
4186 }
4187 }
4188 @media only screen and (max-width: 960px) {
4189 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container {
4190 flex-wrap: wrap;
4191 }
4192 }
4193 .wpfnl-datepicker {
4194 position: relative;
4195 min-width: 350px;
4196 }
4197 .wpfnl-datepicker input {
4198 cursor: default;
4199 margin: 0.5em;
4200 border-radius: 4px;
4201 background: inherit;
4202 border-radius: 8px;
4203 color: #2D3149;
4204 font-family: Inter;
4205 font-size: 13px;
4206 font-style: normal;
4207 font-weight: 500;
4208 line-height: 1.15;
4209 border: 1px solid #F1F0F5;
4210 padding: 9px 12px;
4211 width: 45%;
4212 }
4213 .wpfnl-datepicker input.single-date {
4214 width: 100%;
4215 margin-left: -1px;
4216 }
4217 .wpfnl-datepicker .multi-input {
4218 display: flex;
4219 align-items: center;
4220 }
4221 .wpfnl-datepicker .multi-input span {
4222 margin: 0 0.5em;
4223 }
4224 .wpfnl-datepicker .calendar {
4225 background: white;
4226 padding: 1em;
4227 }
4228 .wpfnl-datepicker .calendar .calendar-header {
4229 display: flex;
4230 justify-content: space-between;
4231 align-items: center;
4232 margin-bottom: 1em;
4233 }
4234 .wpfnl-datepicker .calendar .calendar-header .pre-month,
4235 .wpfnl-datepicker .calendar .calendar-header .next-month {
4236 border-radius: 8px;
4237 border: 1px solid #F1F0F5;
4238 padding: 8px 15px;
4239 }
4240 .wpfnl-datepicker .calendar .calendar-header .month-name {
4241 color: #2D3149;
4242 font-family: Inter;
4243 font-size: 16px;
4244 font-style: normal;
4245 font-weight: 500;
4246 line-height: 15px;
4247 }
4248 .wpfnl-datepicker .calendar .calendar-header button {
4249 background: none;
4250 border: none;
4251 cursor: pointer;
4252 font-size: 1.2em;
4253 }
4254 .wpfnl-datepicker .calendar .calendar-grid {
4255 display: grid;
4256 grid-template-columns: repeat(7, 1fr);
4257 gap: 0.5em;
4258 }
4259 .wpfnl-datepicker .calendar .calendar-grid .calendar-day {
4260 color: #9398A5;
4261 font-family: Inter;
4262 font-size: 14px;
4263 font-style: normal;
4264 font-weight: 500;
4265 line-height: 14px;
4266 cursor: default;
4267 }
4268 .wpfnl-datepicker .calendar .calendar-grid .calendar-day:hover {
4269 background: none !important;
4270 }
4271 .wpfnl-datepicker .calendar .calendar-grid div {
4272 text-align: center;
4273 padding: 0.5em;
4274 cursor: pointer;
4275 border-radius: 4px;
4276 color: #2D3149;
4277 text-align: center;
4278 font-family: Inter;
4279 font-size: 12px;
4280 font-style: normal;
4281 font-weight: 500;
4282 line-height: 2.667;
4283 }
4284 .wpfnl-datepicker .calendar .calendar-grid div.empty {
4285 background: none;
4286 cursor: default;
4287 }
4288 .wpfnl-datepicker .calendar .calendar-grid div.selected, .wpfnl-datepicker .calendar .calendar-grid div.start-date, .wpfnl-datepicker .calendar .calendar-grid div.end-date {
4289 background: #6E42D3;
4290 color: white;
4291 }
4292 .wpfnl-datepicker .calendar .calendar-grid div.in-range {
4293 background: #e5daff;
4294 }
4295 .wpfnl-datepicker .calendar .calendar-grid div.disabled {
4296 opacity: 0.5;
4297 cursor: default;
4298 pointer-events: none;
4299 }
4300 .wpfnl-datepicker .calendar .calendar-grid div.disabled:hover {
4301 background: none !important;
4302 }
4303 .wpfnl-datepicker .calendar .calendar-grid div:hover:not(.empty) {
4304 background: #f0f0f0;
4305 }
4306
4307 .wpfnl-tpl-shimmer-block {
4308 border-radius: 8px;
4309 animation: shimmer-animation 1.6s infinite linear;
4310 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
4311 background-size: 1000px 100%;
4312 }
4313
4314 .wpfnl-tpl-shimmer-grid {
4315 display: grid;
4316 grid-template-columns: repeat(4, 1fr);
4317 gap: 20px;
4318 }
4319
4320 .wpfnl-tpl-shimmer-card {
4321 border-radius: 12px;
4322 overflow: hidden;
4323 padding: 12px;
4324 background: #f7f7fb;
4325 }
4326
4327 .wpfnl-tpl-shimmer-card-img {
4328 height: 140px;
4329 border-radius: 8px;
4330 margin-bottom: 10px;
4331 }
4332
4333 .wpfnl-tpl-shimmer-card-text {
4334 height: 16px;
4335 width: 80%;
4336 margin-bottom: 8px;
4337 }
4338
4339 .wpfnl-tpl-shimmer-card-badge {
4340 height: 22px;
4341 width: 40%;
4342 border-radius: 20px;
4343 }
4344
4345 .wpfnl-tpl-filter-shimmer {
4346 width: 100%;
4347 padding-top: 8px;
4348 }
4349
4350 .create-funnel-shimmer-overlay {
4351 background: #fff;
4352 display: flex;
4353 flex-direction: column;
4354 width: 100%;
4355 min-height: 100%;
4356 }
4357 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-header-bar {
4358 display: flex;
4359 align-items: center;
4360 justify-content: space-between;
4361 padding: 15px 24px;
4362 background: #fff;
4363 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.4);
4364 flex-shrink: 0;
4365 }
4366 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-title {
4367 height: 28px;
4368 width: 220px;
4369 }
4370 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-btn {
4371 height: 36px;
4372 width: 120px;
4373 border-radius: 8px;
4374 }
4375 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-body {
4376 display: flex;
4377 flex: 1;
4378 }
4379 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-sidebar {
4380 width: 247px;
4381 flex-shrink: 0;
4382 padding: 19px 20px;
4383 background: #fff;
4384 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
4385 }
4386 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-sidebar-title {
4387 height: 20px;
4388 width: 80%;
4389 margin-bottom: 24px;
4390 border-radius: 6px;
4391 }
4392 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-sidebar-item {
4393 height: 44px;
4394 border-radius: 8px;
4395 margin-bottom: 14px;
4396 }
4397 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-content {
4398 flex: 1;
4399 padding: 40px;
4400 overflow: hidden;
4401 }
4402 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-wrap,
4403 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-header {
4404 display: none;
4405 }
4406
4407 .shimmer-line {
4408 height: 20px;
4409 margin-top: 20px;
4410 background: #777;
4411 }
4412
4413 .shimmer-line-br {
4414 border-radius: 8px;
4415 }
4416
4417 .shimmer-line-full {
4418 width: 100%;
4419 }
4420
4421 .shimmer-line-80 {
4422 width: 80%;
4423 }
4424
4425 .shimmer-line-60 {
4426 width: 60%;
4427 }
4428
4429 .shimmer-line-40 {
4430 width: 40%;
4431 }
4432
4433 .shimmer-line-20 {
4434 width: 20%;
4435 }
4436
4437 .shimmer-line-10 {
4438 width: 10%;
4439 }
4440
4441 .shimmer-circle {
4442 background: #777;
4443 border-radius: 50%;
4444 }
4445
4446 .shimmer-circle-lg {
4447 height: 129px;
4448 width: 129px;
4449 }
4450
4451 .shimmer-circle-md {
4452 height: 65px;
4453 width: 65px;
4454 }
4455
4456 .shimmer-circle-sm {
4457 height: 33px;
4458 width: 33px;
4459 }
4460
4461 .shimmer-circle-x-sm {
4462 height: 17px;
4463 width: 17px;
4464 }
4465
4466 .shimmer-wrapper, .shimmer-wrapper-center {
4467 width: 100%;
4468 height: 100%;
4469 padding: 10px;
4470 animation: shimmer-full-view 0.5s forwards cubic-bezier(0.25, 0.46, 0.45, 0.94);
4471 }
4472
4473 .shimmer-wrapper-center {
4474 display: flex;
4475 flex-direction: column;
4476 gap: 10px;
4477 justify-content: center;
4478 align-items: center;
4479 }
4480
4481 @keyframes shimmer-full-view {
4482 0% {
4483 background-position: -1000px 0;
4484 }
4485 100% {
4486 background-position: 1000px 0;
4487 }
4488 }
4489 @keyframes shimmer-animation {
4490 0% {
4491 background-position: -1000px 0;
4492 }
4493 100% {
4494 background-position: 1000px 0;
4495 }
4496 }
4497 .shimmer-animate {
4498 animation: shimmer-animation 4s infinite linear;
4499 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
4500 background-size: 1000px 100%;
4501 }
4502
4503 body.toplevel_page_wpfunnels {
4504 background: #F6F5FA;
4505 }
4506 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard a:focus {
4507 box-shadow: none;
4508 }
4509 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .pro-tag {
4510 position: absolute;
4511 top: 10px;
4512 right: 10px;
4513 z-index: 1;
4514 padding: 3px 8px 4px;
4515 background-color: #2FCF5C;
4516 font-size: 10px;
4517 line-height: 15px;
4518 color: #fff;
4519 display: inline-block;
4520 text-transform: capitalize;
4521 border-radius: 5px;
4522 box-shadow: 0px 3px 3px rgba(175, 175, 206, 0.3);
4523 font-weight: 400;
4524 }
4525 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .pro-tag-icon {
4526 position: absolute;
4527 top: 10px;
4528 right: 10px;
4529 }
4530 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-overlay {
4531 background: rgba(246, 245, 250, 0.6);
4532 opacity: 1;
4533 display: flex;
4534 flex-flow: column;
4535 height: 100%;
4536 justify-content: center;
4537 align-items: center;
4538 left: 0;
4539 position: absolute;
4540 top: 0;
4541 transition: all 0.3s ease;
4542 width: 100%;
4543 z-index: 1;
4544 border-radius: 10px;
4545 }
4546 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-right {
4547 margin-left: auto;
4548 }
4549 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-right .btn-default {
4550 font-weight: 400;
4551 border-radius: 10px;
4552 display: block;
4553 border: none;
4554 font-size: 14px;
4555 line-height: 1;
4556 color: #fff;
4557 padding: 10px 18px;
4558 text-align: center;
4559 text-decoration: none;
4560 background-color: #2D3149;
4561 box-shadow: -1px 1px 1px 0 rgba(182, 185, 191, 0.3);
4562 }
4563 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-right .btn-default:hover {
4564 background-color: #6E42D3;
4565 }
4566 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar {
4567 background: #fff;
4568 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
4569 position: relative;
4570 display: flex;
4571 flex-flow: row wrap;
4572 align-items: center;
4573 gap: 22px;
4574 margin-bottom: 24px;
4575 padding: 0 24px;
4576 }
4577 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar .wpfnl-logo svg {
4578 display: block;
4579 }
4580 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar .wpfnl-dashboard-sidebar-menu {
4581 padding: 0;
4582 margin: 0;
4583 display: flex;
4584 align-items: center;
4585 gap: 24px;
4586 }
4587 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar .wpfnl-dashboard-sidebar-menu .wpfnl-dashboard-sidebar-menu-item {
4588 margin: 0;
4589 }
4590 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar .wpfnl-dashboard-sidebar-menu .wpfnl-dashboard-sidebar-menu-item a {
4591 text-decoration: none;
4592 padding: 25px 3px;
4593 padding-top: 20px;
4594 color: #707070;
4595 font-size: 14px;
4596 font-style: normal;
4597 font-weight: 400;
4598 line-height: 1;
4599 position: relative;
4600 display: block;
4601 }
4602 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar .wpfnl-dashboard-sidebar-menu .wpfnl-dashboard-sidebar-menu-item a:hover {
4603 color: #6E42D3;
4604 }
4605 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar .wpfnl-dashboard-sidebar-menu .wpfnl-dashboard-sidebar-menu-item.active a {
4606 color: #6E42D3;
4607 }
4608 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-sidebar .wpfnl-dashboard-sidebar-menu .wpfnl-dashboard-sidebar-menu-item.active a:after {
4609 content: "";
4610 position: absolute;
4611 left: 0px;
4612 bottom: 0;
4613 height: 2px;
4614 width: 100%;
4615 background: #6E42D3;
4616 z-index: 1;
4617 }
4618 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body {
4619 min-height: 100vh;
4620 width: calc(100% - 280px);
4621 margin: 0 auto;
4622 }
4623 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner {
4624 background-color: #6B46C1;
4625 color: white;
4626 padding: 10px 16px;
4627 display: flex;
4628 justify-content: space-between;
4629 align-items: center;
4630 margin: 16px 0px;
4631 border-radius: 10px;
4632 }
4633 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-text {
4634 flex: 1;
4635 text-align: center;
4636 }
4637 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-text .community-link {
4638 color: white;
4639 text-decoration: none;
4640 display: inline-flex;
4641 align-items: center;
4642 gap: 8px;
4643 transition: opacity 0.3s ease;
4644 }
4645 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-text .community-link:hover {
4646 opacity: 0.9;
4647 color: #ffffff;
4648 }
4649 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-text .community-link:hover .link-text {
4650 text-decoration-thickness: 2px;
4651 }
4652 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-text .community-link .link-text {
4653 font-size: 16px;
4654 font-weight: 500;
4655 line-height: 100%;
4656 letter-spacing: 0;
4657 text-decoration: underline;
4658 text-decoration-style: solid;
4659 text-decoration-thickness: 1px;
4660 transition: text-decoration-thickness 0.3s ease;
4661 }
4662 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-actions {
4663 display: flex;
4664 gap: 16px;
4665 }
4666 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-actions .ask-later-button {
4667 background: none;
4668 border: none;
4669 color: white;
4670 cursor: pointer;
4671 font-weight: 400;
4672 font-size: 14px;
4673 line-height: 100%;
4674 letter-spacing: 0;
4675 text-align: right;
4676 text-decoration: underline;
4677 text-decoration-style: solid;
4678 text-decoration-thickness: 0%;
4679 transition: opacity 0.3s ease;
4680 }
4681 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-actions .ask-later-button:hover {
4682 opacity: 0.9;
4683 color: #ffffff;
4684 text-decoration-thickness: 2px;
4685 }
4686 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .community-banner .community-banner-actions .already-joined-button {
4687 background: rgba(255, 255, 255, 0.1);
4688 border: none;
4689 border-radius: 6px;
4690 color: white;
4691 cursor: pointer;
4692 font-weight: 400;
4693 font-size: 14px;
4694 line-height: 100%;
4695 letter-spacing: 0;
4696 text-align: right;
4697 padding: 5px 8px;
4698 }
4699 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-header {
4700 background: #FFF;
4701 filter: drop-shadow(0px 1px 1px rgba(182, 185, 191, 0.3));
4702 margin-top: 0;
4703 padding: 20px;
4704 display: flex;
4705 align-items: center;
4706 justify-content: space-between;
4707 flex-wrap: wrap;
4708 border-radius: 10px;
4709 overflow: hidden;
4710 }
4711 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-header .wpfnl-dashboard-header-title {
4712 color: #363B4E;
4713 font-size: 20px;
4714 font-style: normal;
4715 font-weight: 600;
4716 line-height: 1;
4717 margin: 0;
4718 }
4719 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-header .wpfnl-dashboard-buttons-wrapper {
4720 display: flex;
4721 justify-content: center;
4722 align-items: center;
4723 gap: 12px;
4724 }
4725 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-header .wpfnl-dashboard-buttons-wrapper .wpfnl-dashboard-header-button {
4726 border-radius: 10px;
4727 border: 1px solid #E4E6EB;
4728 background: #FFF;
4729 display: flex;
4730 align-items: center;
4731 gap: 8px;
4732 justify-content: center;
4733 text-decoration: none;
4734 color: #2D3149;
4735 font-size: 14px;
4736 font-style: normal;
4737 font-weight: 500;
4738 line-height: 13px;
4739 height: 40px;
4740 padding: 0 16px;
4741 }
4742 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-header .wpfnl-dashboard-buttons-wrapper .wpfnl-dashboard-header-button:nth-child(2) svg {
4743 width: 20px;
4744 height: 20px;
4745 }
4746 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-header .wpfnl-dashboard-buttons-wrapper .wpfnl-dashboard-header-button svg {
4747 width: 16px;
4748 height: 16px;
4749 }
4750 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper {
4751 margin-top: 50px;
4752 }
4753 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header {
4754 display: flex;
4755 align-items: center;
4756 justify-content: space-between;
4757 gap: 20px;
4758 flex-wrap: wrap;
4759 }
4760 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-tabs {
4761 background: #FFF;
4762 width: auto;
4763 padding: 0;
4764 display: flex;
4765 align-items: center;
4766 border-radius: 6px;
4767 border: none;
4768 box-shadow: none;
4769 }
4770 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-tabs .wpfnl-dashboard-tab {
4771 flex: 1;
4772 color: #2D3149;
4773 font-size: 13px;
4774 font-weight: 500;
4775 line-height: 1;
4776 border: none;
4777 background: none;
4778 padding: 9px 15px;
4779 cursor: pointer;
4780 border: 1px solid #DCD9E8;
4781 box-shadow: none;
4782 transition: all 0.3s ease;
4783 }
4784 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-tabs .wpfnl-dashboard-tab:first-child {
4785 border-radius: 6px 0 0 6px;
4786 }
4787 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-tabs .wpfnl-dashboard-tab:last-child {
4788 border-radius: 0 6px 6px 0;
4789 margin-left: -1px;
4790 }
4791 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-tabs .wpfnl-dashboard-tab.active {
4792 color: #6E42D3;
4793 border-color: #6E42D3;
4794 box-shadow: none;
4795 z-index: 1;
4796 }
4797 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header {
4798 display: flex;
4799 align-items: center;
4800 gap: 12px;
4801 margin-left: auto;
4802 }
4803 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper {
4804 position: relative;
4805 }
4806 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpfnl-compare-to {
4807 position: absolute;
4808 color: #2D3149;
4809 font-size: 11px;
4810 font-style: normal;
4811 font-weight: 400;
4812 line-height: 11px;
4813 border-radius: 5px;
4814 border: 1px solid #E4E6EB;
4815 background: #FFF;
4816 padding: 7px 10px;
4817 bottom: calc(100% - 7px);
4818 left: 50%;
4819 transform: translateX(-50%);
4820 width: max-content;
4821 }
4822 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpfnl-dahsboard-filter-btn {
4823 background: #FFF;
4824 border-radius: 6px;
4825 border: 1px solid #DCD9E8;
4826 border: none;
4827 outline: none;
4828 padding: 13px 14px;
4829 cursor: pointer;
4830 color: #2D3149;
4831 font-size: 14px;
4832 font-style: normal;
4833 font-weight: 500;
4834 line-height: 1;
4835 display: flex;
4836 align-items: center;
4837 justify-content: space-between;
4838 gap: 24px;
4839 }
4840 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper {
4841 position: absolute;
4842 border-radius: 10px;
4843 border: 1px solid #EBEDF0;
4844 background: #FFF;
4845 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
4846 padding: 8px;
4847 padding-bottom: 20px;
4848 min-width: 270px;
4849 top: calc(100% + 10px);
4850 z-index: 99;
4851 }
4852 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpnfl-dashboard-filter-dropdown {
4853 margin: 0;
4854 padding: 0;
4855 list-style: none;
4856 }
4857 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpnfl-dashboard-filter-dropdown .wpfnl-dropdown-item {
4858 padding: 8px 10px;
4859 margin: 0;
4860 color: #2D3149;
4861 font-size: 14px;
4862 font-style: normal;
4863 font-weight: 400;
4864 line-height: normal;
4865 cursor: pointer;
4866 margin-bottom: 5px;
4867 }
4868 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpnfl-dashboard-filter-dropdown .wpfnl-dropdown-item:hover, body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpnfl-dashboard-filter-dropdown .wpfnl-dropdown-item.active {
4869 border-radius: 8px;
4870 background: #F6F5FA;
4871 }
4872 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-compare-to-wrapper {
4873 margin: 10px 15px 7px 7px;
4874 position: relative;
4875 }
4876 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-compare-to-wrapper button {
4877 border-radius: 8px;
4878 border: 1px solid #F1F0F5;
4879 background: #FFF;
4880 display: flex;
4881 align-items: center;
4882 gap: 27px;
4883 padding: 9px 14px;
4884 color: #2D3149;
4885 font-size: 13px;
4886 font-style: normal;
4887 font-weight: 500;
4888 line-height: 1.15;
4889 cursor: pointer;
4890 width: 100%;
4891 justify-content: space-between;
4892 }
4893 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-compare-to-wrapper .wpfnl-compare-items-wrapper {
4894 position: absolute;
4895 z-index: 99;
4896 border-radius: 10px;
4897 border: 1px solid #EBEDF0;
4898 background: #FFF;
4899 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
4900 top: calc(100% + 5px);
4901 padding: 10px;
4902 margin: 0;
4903 width: 90%;
4904 list-style: none;
4905 }
4906 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-compare-to-wrapper .wpfnl-compare-items-wrapper .wpfnl-compare-item {
4907 cursor: pointer;
4908 padding: 5px 8px;
4909 color: #2D3149;
4910 font-size: 13px;
4911 font-style: normal;
4912 font-weight: 400;
4913 }
4914 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-compare-to-wrapper .wpfnl-compare-items-wrapper .wpfnl-compare-item.active {
4915 border-radius: 8px;
4916 background: #F6F5FA;
4917 }
4918 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-apply-wrapper {
4919 display: flex;
4920 align-items: center;
4921 margin: 10px 15px 7px 7px;
4922 }
4923 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-apply-wrapper button {
4924 border-radius: 8px;
4925 background: #6E42D3;
4926 box-shadow: 0px 9px 10px 0px rgba(193, 183, 232, 0.5);
4927 border: none;
4928 outline: none;
4929 color: #FFF;
4930 font-size: 12px;
4931 font-style: normal;
4932 font-weight: 600;
4933 line-height: 1.25;
4934 padding: 9px;
4935 cursor: pointer;
4936 width: 100%;
4937 }
4938 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-dashboard-filter-wrapper .wpnfl-dashboard-filter-dropdown-wrapper .wpfnl-filter-apply-wrapper button[disabled] {
4939 opacity: 0.5;
4940 cursor: default;
4941 }
4942 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-create-funnel-btn {
4943 border-radius: 6px;
4944 background: #6E42D3;
4945 box-shadow: 0px 2px 4px 0px rgba(223, 223, 249, 0.25);
4946 padding: 11px 16px;
4947 display: flex;
4948 align-items: center;
4949 justify-content: center;
4950 gap: 8px;
4951 color: #FFF;
4952 font-size: 15px;
4953 font-style: normal;
4954 font-weight: 500;
4955 line-height: normal;
4956 text-decoration: none;
4957 cursor: pointer;
4958 }
4959 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-sync-cache-btn {
4960 display: flex;
4961 align-items: center;
4962 gap: 8px;
4963 padding: 13px 14px;
4964 border-radius: 6px;
4965 border: none;
4966 outline: none;
4967 background: #FFF;
4968 color: #2D3149;
4969 font-size: 14px;
4970 font-style: normal;
4971 font-weight: 500;
4972 line-height: 1;
4973 cursor: pointer;
4974 white-space: nowrap;
4975 transition: color 0.15s, opacity 0.15s;
4976 }
4977 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-sync-cache-btn .wpfnl-sync-icon {
4978 flex-shrink: 0;
4979 }
4980 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-sync-cache-btn:hover:not(:disabled) {
4981 color: #6E42D3;
4982 }
4983 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-sync-cache-btn.is-syncing {
4984 opacity: 0.65;
4985 cursor: not-allowed;
4986 }
4987 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wpfnl-dashboard-contents-header .wpfnl-dashboard-right-header .wpfnl-sync-cache-btn.is-syncing .wpfnl-sync-icon {
4988 animation: wpfnl-spin 0.75s linear infinite;
4989 }
4990 @keyframes wpfnl-spin {
4991 from {
4992 transform: rotate(0deg);
4993 }
4994 to {
4995 transform: rotate(360deg);
4996 }
4997 }
4998 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body {
4999 margin-top: 24px;
5000 }
5001 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container {
5002 display: grid;
5003 grid-template-columns: repeat(5, 1fr);
5004 gap: 20px;
5005 }
5006 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card {
5007 padding: 20px;
5008 position: relative;
5009 border-radius: 6px;
5010 border: 1px solid rgba(230, 227, 241, 0.9);
5011 background: #FFF;
5012 }
5013 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-loader {
5014 display: flex;
5015 align-items: center;
5016 justify-content: center;
5017 margin: 40px auto;
5018 padding: 20px;
5019 }
5020 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-card-body {
5021 margin-top: 18px;
5022 display: flex;
5023 align-items: center;
5024 gap: 8px;
5025 }
5026 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-card-label {
5027 margin: 0;
5028 color: #7A8B9A;
5029 font-size: 14px;
5030 font-weight: 400;
5031 line-height: 1.3;
5032 }
5033 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-percentage {
5034 padding: 4px 7px;
5035 display: flex;
5036 align-items: center;
5037 gap: 1px;
5038 justify-content: center;
5039 font-size: 12px;
5040 font-weight: 500;
5041 line-height: 1;
5042 margin: 0;
5043 min-width: 30px;
5044 border-radius: 4px;
5045 background: #F6F5FA;
5046 }
5047 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-percentage.wpfnl-decrease {
5048 background: rgba(236, 89, 86, 0.1);
5049 color: #DC2626;
5050 }
5051 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-percentage.wpfnl-increase {
5052 background: rgba(18, 183, 106, 0.1);
5053 color: #16A34A;
5054 }
5055 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-card-value {
5056 margin: 0;
5057 color: #1D2327;
5058 font-size: 28px;
5059 font-weight: 500;
5060 line-height: 1;
5061 }
5062 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-revenue-comparison {
5063 margin-top: 24px;
5064 }
5065
5066 .wpfnl-admin-dashboard .shimmer-line {
5067 height: 11px;
5068 margin-top: 11px;
5069 }
5070 .wpfnl-admin-dashboard .wpfnl-dashboard-performance {
5071 display: grid;
5072 grid-template-columns: 1fr 340px;
5073 gap: 16px;
5074 margin-top: 24px;
5075 }
5076 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance {
5077 background: #FFF;
5078 border-radius: 6px;
5079 border: 1px solid rgba(230, 227, 241, 0.9);
5080 padding: 24px;
5081 display: flex;
5082 flex-direction: column;
5083 gap: 20px;
5084 }
5085 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-header {
5086 display: flex;
5087 align-items: center;
5088 justify-content: space-between;
5089 }
5090 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-title {
5091 color: #2D3149;
5092 font-size: 16px;
5093 font-weight: 600;
5094 line-height: 1;
5095 margin: 0;
5096 }
5097 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-legend {
5098 display: flex;
5099 align-items: center;
5100 gap: 16px;
5101 }
5102 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-legend .wpfnl-dbdp-legend-item {
5103 display: flex;
5104 align-items: center;
5105 gap: 6px;
5106 color: #7A8B9A;
5107 font-size: 13px;
5108 font-weight: 400;
5109 }
5110 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-legend .wpfnl-dbdp-legend-item .wpfnl-dbdp-legend-dot {
5111 width: 8px;
5112 height: 8px;
5113 border-radius: 50%;
5114 flex-shrink: 0;
5115 }
5116 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary {
5117 display: flex;
5118 align-items: stretch;
5119 gap: 12px;
5120 background: #F6F5FA;
5121 border-radius: 6px;
5122 padding: 0 15px;
5123 }
5124 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card {
5125 flex: 1;
5126 display: flex;
5127 align-items: center;
5128 gap: 20px;
5129 padding: 14px 16px;
5130 border-left: 1px solid #fff;
5131 }
5132 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card:first-child {
5133 border-left: 0;
5134 }
5135 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card .wpfnl-dbdp-summary-icon {
5136 width: 30px;
5137 height: 30px;
5138 border-radius: 50px;
5139 background: #FFF;
5140 display: flex;
5141 align-items: center;
5142 justify-content: center;
5143 flex-shrink: 0;
5144 }
5145 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card .wpfnl-dbdp-summary-info {
5146 display: flex;
5147 flex-direction: column;
5148 gap: 6px;
5149 }
5150 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card .wpfnl-dbdp-summary-info .wpfnl-dbdp-summary-label {
5151 font-size: 13px;
5152 font-weight: 400;
5153 line-height: 1.3;
5154 color: #7A8B9A;
5155 }
5156 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card .wpfnl-dbdp-summary-info .wpfnl-dbdp-summary-value {
5157 color: #1D2327;
5158 font-size: 26px;
5159 font-weight: 500;
5160 line-height: 1;
5161 }
5162 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-chart {
5163 height: 220px;
5164 position: relative;
5165 }
5166 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-chart canvas {
5167 width: 100% !important;
5168 height: 100% !important;
5169 }
5170 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution {
5171 background: #FFF;
5172 border-radius: 6px;
5173 border: 1px solid rgba(230, 227, 241, 0.9);
5174 padding: 24px;
5175 display: flex;
5176 flex-direction: column;
5177 gap: 20px;
5178 }
5179 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-title {
5180 color: #2D3149;
5181 font-size: 16px;
5182 font-weight: 600;
5183 line-height: 1;
5184 margin: 0;
5185 }
5186 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-donut-wrapper {
5187 display: flex;
5188 justify-content: center;
5189 }
5190 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-donut-wrapper .wpfnl-fc-donut {
5191 position: relative;
5192 width: 180px;
5193 height: 180px;
5194 }
5195 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-donut-wrapper .wpfnl-fc-donut canvas {
5196 width: 100% !important;
5197 height: 100% !important;
5198 }
5199 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-donut-wrapper .wpfnl-fc-donut .wpfnl-fc-donut-center {
5200 position: absolute;
5201 inset: 0;
5202 display: flex;
5203 flex-direction: column;
5204 align-items: center;
5205 justify-content: center;
5206 gap: 6px;
5207 pointer-events: none;
5208 }
5209 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-donut-wrapper .wpfnl-fc-donut .wpfnl-fc-donut-center .wpfnl-fc-total-value {
5210 color: #1D2327;
5211 font-size: 22px;
5212 font-weight: 600;
5213 line-height: 1;
5214 }
5215 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-donut-wrapper .wpfnl-fc-donut .wpfnl-fc-donut-center .wpfnl-fc-total-label {
5216 color: #7A8B9A;
5217 font-size: 12px;
5218 font-weight: 400;
5219 line-height: 1;
5220 }
5221 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown {
5222 display: flex;
5223 flex-direction: column;
5224 gap: 22px;
5225 }
5226 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown .wpfnl-fc-breakdown-item {
5227 display: flex;
5228 flex-direction: column;
5229 gap: 6px;
5230 }
5231 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown .wpfnl-fc-breakdown-item .wpfnl-fc-breakdown-top {
5232 display: flex;
5233 align-items: center;
5234 justify-content: space-between;
5235 }
5236 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown .wpfnl-fc-breakdown-item .wpfnl-fc-breakdown-top .wpfnl-fc-breakdown-value {
5237 color: #1D2327;
5238 font-size: 16px;
5239 font-weight: 600;
5240 line-height: 1;
5241 }
5242 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown .wpfnl-fc-breakdown-item .wpfnl-fc-breakdown-top .wpfnl-fc-breakdown-pct {
5243 color: #2D3149;
5244 font-size: 13px;
5245 font-weight: 400;
5246 line-height: 1;
5247 }
5248 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown .wpfnl-fc-breakdown-item .wpfnl-fc-breakdown-label {
5249 color: #7A8B9A;
5250 font-size: 14px;
5251 font-weight: 400;
5252 line-height: 1;
5253 margin-top: 3px;
5254 margin-bottom: 3px;
5255 }
5256 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown .wpfnl-fc-breakdown-item .wpfnl-fc-breakdown-bar-track {
5257 width: 100%;
5258 height: 4px;
5259 background: #EEF0F3;
5260 border-radius: 100px;
5261 overflow: hidden;
5262 }
5263 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-funnel-contribution .wpfnl-fc-breakdown .wpfnl-fc-breakdown-item .wpfnl-fc-breakdown-bar-track .wpfnl-fc-breakdown-bar-fill {
5264 height: 100%;
5265 border-radius: 100px;
5266 transition: width 0.4s ease;
5267 }
5268 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels {
5269 background: #FFF;
5270 margin-top: 24px;
5271 padding: 24px;
5272 border-radius: 6px;
5273 border: 1px solid rgba(230, 227, 241, 0.9);
5274 }
5275 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-section-title {
5276 color: #2D3149;
5277 font-size: 16px;
5278 font-weight: 600;
5279 line-height: 1.2;
5280 margin: 0;
5281 margin-bottom: 24px;
5282 }
5283 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-col .table-text {
5284 position: relative;
5285 }
5286 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-col .table-text .pro-tag-icon {
5287 top: -3px;
5288 right: -28px;
5289 }
5290 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper p {
5291 margin: 0;
5292 }
5293 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-header,
5294 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-row {
5295 display: grid;
5296 grid-template-columns: 2fr repeat(6, 1fr);
5297 gap: 20px;
5298 }
5299 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-header {
5300 padding-bottom: 16px;
5301 border-bottom: 1px solid #EEF0F3;
5302 }
5303 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-header p {
5304 color: #7A8B9A;
5305 font-size: 14px;
5306 font-style: normal;
5307 font-weight: 400;
5308 line-height: 1.2;
5309 }
5310 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-row {
5311 padding: 17px 0;
5312 border-bottom: 1px solid #EEF0F3;
5313 }
5314 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-row:last-child {
5315 border-bottom: none;
5316 padding-bottom: 0;
5317 }
5318 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-row p {
5319 color: #2D3149;
5320 font-size: 14px;
5321 font-weight: 400;
5322 line-height: 1.2;
5323 word-wrap: break-word;
5324 }
5325 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-row p a {
5326 color: #2D3149;
5327 font-size: 14px;
5328 font-weight: 500;
5329 line-height: 1;
5330 text-decoration: none;
5331 }
5332 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-row .aov-tag {
5333 padding: 6px 7px;
5334 border-radius: 4px;
5335 background: #F6F5FA;
5336 color: #16A34A;
5337 text-align: center;
5338 font-size: 12px;
5339 font-weight: 500;
5340 line-height: 1;
5341 display: inline-block;
5342 }
5343 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-table-row .aov-tag.is-deacrease {
5344 color: #F04438;
5345 }
5346 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-empty-table-body {
5347 display: flex;
5348 align-items: center;
5349 justify-content: center;
5350 height: 100%;
5351 text-align: center;
5352 padding: 35px;
5353 }
5354 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-empty-table-body .wpfnl-loader {
5355 display: block;
5356 padding: 40px;
5357 margin: 60px auto;
5358 }
5359 .wpfnl-admin-dashboard .wpfnl-top-performing-funnels .wpfnl-dashboard-table-wrapper .wpfnl-empty-table-body p {
5360 color: #2D3149;
5361 font-size: 15px;
5362 font-style: normal;
5363 font-weight: 500;
5364 line-height: 0.93;
5365 margin-top: 17px;
5366 }
5367 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store {
5368 display: grid;
5369 grid-template-columns: repeat(3, 1fr);
5370 gap: 16px;
5371 margin-top: 24px;
5372 }
5373 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card {
5374 padding: 24px 24px 20px;
5375 display: flex;
5376 flex-direction: column;
5377 gap: 10px;
5378 border-radius: 6px;
5379 border: 1px solid rgba(230, 227, 241, 0.9);
5380 background: #FFF;
5381 }
5382 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-header {
5383 display: flex;
5384 align-items: center;
5385 justify-content: space-between;
5386 margin-bottom: 4px;
5387 }
5388 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-header .wpfnl-csc-label {
5389 color: #7A8B9A;
5390 font-size: 14px;
5391 font-weight: 400;
5392 line-height: 1;
5393 }
5394 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-header .wpfnl-csc-info-icon {
5395 display: flex;
5396 align-items: center;
5397 cursor: pointer;
5398 opacity: 0.7;
5399 }
5400 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-header .wpfnl-csc-info-icon:hover {
5401 opacity: 1;
5402 }
5403 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-body {
5404 display: flex;
5405 align-items: baseline;
5406 gap: 6px;
5407 flex-wrap: wrap;
5408 }
5409 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-body .wpfnl-csc-main-value {
5410 color: #1D2327;
5411 font-size: 28px;
5412 font-weight: 500;
5413 line-height: 1;
5414 }
5415 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-body .wpfnl-csc-baseline {
5416 color: #1F2937;
5417 font-size: 15px;
5418 font-weight: 400;
5419 line-height: 1;
5420 }
5421 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-body .wpfnl-csc-baseline strong {
5422 font-size: 18px;
5423 font-weight: 400;
5424 }
5425 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer {
5426 margin-top: 10px;
5427 padding-top: 14px;
5428 display: flex;
5429 flex-direction: column;
5430 gap: 11px;
5431 position: relative;
5432 }
5433 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer::before {
5434 content: "";
5435 position: absolute;
5436 left: -24px;
5437 top: 0;
5438 background-color: #E6E3F1;
5439 height: 1px;
5440 width: calc(100% + 48px);
5441 }
5442 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-footer-top {
5443 display: flex;
5444 align-items: center;
5445 justify-content: space-between;
5446 }
5447 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-footer-top .wpfnl-csc-footer-label {
5448 color: #7A8B9A;
5449 font-size: 14px;
5450 font-weight: 400;
5451 line-height: 1;
5452 }
5453 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-footer-top .wpfnl-csc-lift-value {
5454 font-size: 13px;
5455 font-weight: 600;
5456 line-height: 1;
5457 border-radius: 4px;
5458 background: #F6F5FA;
5459 padding: 6px 6px;
5460 }
5461 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-footer-top .wpfnl-csc-lift-value.is-increase {
5462 color: #16A34A;
5463 }
5464 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-footer-top .wpfnl-csc-lift-value.is-decrease {
5465 color: #DC2626;
5466 }
5467 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-progress-bar {
5468 width: 100%;
5469 height: 4px;
5470 background: #EEF0F3;
5471 border-radius: 100px;
5472 overflow: hidden;
5473 }
5474 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-progress-bar .wpfnl-csc-progress-fill {
5475 height: 100%;
5476 border-radius: 100px;
5477 background: #6E42D3;
5478 transition: width 0.4s ease;
5479 }
5480 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer .wpfnl-csc-progress-bar .wpfnl-csc-progress-fill.is-decrease {
5481 background: #DC2626;
5482 }
5483 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics {
5484 background: #FFF;
5485 border-radius: 6px;
5486 border: 1px solid rgba(230, 227, 241, 0.9);
5487 padding: 24px;
5488 margin-top: 24px;
5489 }
5490 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-fhm-title {
5491 color: #2D3149;
5492 font-size: 16px;
5493 font-weight: 600;
5494 line-height: 1;
5495 margin: 0 0 17px;
5496 }
5497 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-fhm-grid {
5498 display: grid;
5499 grid-template-columns: repeat(2, 1fr);
5500 gap: 24px 48px;
5501 border-radius: 4px;
5502 border: 1px solid #EEF0F3;
5503 padding: 24px;
5504 }
5505 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-health-metric-bar {
5506 display: flex;
5507 flex-direction: column;
5508 gap: 8px;
5509 }
5510 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-health-metric-bar .wpfnl-hmb-top {
5511 display: flex;
5512 align-items: center;
5513 justify-content: space-between;
5514 }
5515 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-health-metric-bar .wpfnl-hmb-top .wpfnl-hmb-label {
5516 color: #7A8B9A;
5517 font-size: 14px;
5518 font-weight: 400;
5519 line-height: 1;
5520 }
5521 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-health-metric-bar .wpfnl-hmb-top .wpfnl-hmb-value {
5522 color: #1D2327;
5523 font-size: 14px;
5524 font-weight: 600;
5525 line-height: 1;
5526 }
5527 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-health-metric-bar .wpfnl-hmb-track {
5528 width: 100%;
5529 height: 5px;
5530 background: #EEF0F3;
5531 border-radius: 100px;
5532 overflow: hidden;
5533 }
5534 .wpfnl-admin-dashboard .wpfnl-funnel-health-metrics .wpfnl-health-metric-bar .wpfnl-hmb-track .wpfnl-hmb-fill {
5535 height: 100%;
5536 border-radius: 100px;
5537 transition: width 0.4s ease;
5538 }
5539 .wpfnl-admin-dashboard .wpfnl-leads-analytics .wpfnl-leads-analytics-wrapper .wpfnl-dashboard-cards-container {
5540 display: grid;
5541 grid-template-columns: repeat(5, 1fr);
5542 gap: 20px;
5543 margin-top: 24px;
5544 }
5545 .wpfnl-admin-dashboard .wpfnl-leads-analytics .wpfnl-leads-analytics-wrapper .wpfnl-lead-growth-chart {
5546 background: #FFF;
5547 border-radius: 6px;
5548 border: 1px solid rgba(230, 227, 241, 0.9);
5549 padding: 24px;
5550 margin-top: 24px;
5551 display: flex;
5552 flex-direction: column;
5553 gap: 20px;
5554 }
5555 .wpfnl-admin-dashboard .wpfnl-leads-analytics .wpfnl-leads-analytics-wrapper .wpfnl-lead-growth-chart .wpfnl-lgc-header .wpfnl-lgc-title {
5556 color: #2D3149;
5557 font-size: 16px;
5558 font-weight: 600;
5559 line-height: 1;
5560 margin: 0;
5561 }
5562 .wpfnl-admin-dashboard .wpfnl-leads-analytics .wpfnl-leads-analytics-wrapper .wpfnl-lead-growth-chart .wpfnl-lgc-chart {
5563 height: 260px;
5564 position: relative;
5565 }
5566 .wpfnl-admin-dashboard .wpfnl-leads-analytics .wpfnl-leads-analytics-wrapper .wpfnl-lead-growth-chart .wpfnl-lgc-chart canvas {
5567 width: 100% !important;
5568 height: 100% !important;
5569 }
5570 .wpfnl-admin-dashboard .wpfnl-leads-analytics .wpfnl-leads-analytics-wrapper .wpfnl-leads-top-funnels .wpfnl-leads-table-row {
5571 grid-template-columns: 2fr repeat(5, 1fr);
5572 }
5573
5574 @media only screen and (max-width: 1699px) {
5575 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body {
5576 width: calc(100% - 90px);
5577 }
5578 }
5579 @media only screen and (max-width: 1399px) {
5580 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-header {
5581 padding: 20px;
5582 gap: 20px;
5583 }
5584 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard {
5585 gap: 50px;
5586 }
5587 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body {
5588 width: 100%;
5589 padding-right: 20px;
5590 padding-left: 20px;
5591 }
5592 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container {
5593 grid-template-columns: repeat(3, 1fr);
5594 gap: 16px;
5595 }
5596 body.toplevel_page_wpfunnels .wpfnl-admin-views-wrapper .wpfnl-admin-dashboard .wpfnl-dashboard-body .wpfnl-dashboard-contents-wrapper .wfpnl-dashboard-contents-body .wpfnl-dashboard-cards-container .wpfnl-single-card .wpfnl-card-value {
5597 font-size: 22px;
5598 }
5599 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-body .wpfnl-csc-main-value {
5600 font-size: 22px;
5601 }
5602 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-body .wpfnl-csc-baseline {
5603 font-size: 14px;
5604 }
5605 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-body .wpfnl-csc-baseline strong {
5606 font-size: 15px;
5607 }
5608 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary {
5609 padding: 0;
5610 }
5611 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card {
5612 gap: 12px;
5613 padding: 11px 12px;
5614 }
5615 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card .wpfnl-dbdp-summary-info .wpfnl-dbdp-summary-value {
5616 font-size: 22px;
5617 }
5618 }
5619 @media only screen and (max-width: 1199px) {
5620 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card {
5621 padding: 20px 20px 20px;
5622 }
5623 .wpfnl-admin-dashboard .wpfnl-dashboard-compare-store .wpfnl-compare-store-card .wpfnl-csc-footer::before {
5624 left: -20px;
5625 width: calc(100% + 40px);
5626 }
5627 .wpfnl-admin-dashboard .wpfnl-dashboard-performance {
5628 grid-template-columns: 1fr 280px;
5629 }
5630 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance {
5631 padding: 20px;
5632 }
5633 .wpfnl-admin-dashboard .wpfnl-dashboard-performance .wpfnl-day-by-day-performance .wpfnl-dbdp-summary .wpfnl-dbdp-summary-card .wpfnl-dbdp-summary-info .wpfnl-dbdp-summary-value {
5634 font-size: 18px;
5635 }
5636 }
5637 .wpfnl-pro-section-wrapper.is-locked .wpfnl-pro-content {
5638 opacity: 0.38;
5639 pointer-events: none;
5640 user-select: none;
5641 }
5642
5643 .wpfnl-pro-banner {
5644 display: flex;
5645 align-items: center;
5646 justify-content: space-between;
5647 gap: 12px;
5648 padding: 10px 16px;
5649 margin-bottom: 14px;
5650 background: #F3EFFF;
5651 border: 1px solid #DDD5F9;
5652 border-radius: 8px;
5653 text-decoration: none;
5654 cursor: pointer;
5655 transition: background 0.18s;
5656 }
5657 .wpfnl-pro-banner:hover {
5658 background: #EBE4FF;
5659 }
5660 .wpfnl-pro-banner .wpfnl-pro-banner-left {
5661 display: flex;
5662 align-items: center;
5663 gap: 8px;
5664 color: #5a35b8;
5665 font-size: 13px;
5666 font-weight: 500;
5667 line-height: 1;
5668 }
5669 .wpfnl-pro-banner .wpfnl-pro-banner-left svg {
5670 flex-shrink: 0;
5671 stroke: #6E42D3;
5672 }
5673 .wpfnl-pro-banner .wpfnl-pro-banner-btn {
5674 flex-shrink: 0;
5675 display: inline-block;
5676 padding: 6px 16px;
5677 background: #6E42D3;
5678 color: #fff;
5679 font-size: 12px;
5680 font-weight: 600;
5681 border-radius: 5px;
5682 white-space: nowrap;
5683 transition: background 0.18s;
5684 }
5685 .wpfnl-pro-banner:hover .wpfnl-pro-banner-btn {
5686 background: #5a35b8;
5687 }
5688
5689 .wpfnl-compare-store-card {
5690 position: relative;
5691 }
5692 .wpfnl-compare-store-card .wpfnl-csc-header-right {
5693 display: flex;
5694 align-items: center;
5695 gap: 6px;
5696 }
5697 .wpfnl-compare-store-card .wpfnl-csc-pro-badge {
5698 display: flex;
5699 align-items: center;
5700 }
5701 .wpfnl-compare-store-card .wpfnl-csc-pro-badge svg {
5702 width: 17px;
5703 height: 17px;
5704 }
5705 .wpfnl-compare-store-card .wpfnl-csc-body.is-blurred,
5706 .wpfnl-compare-store-card .wpfnl-csc-footer.is-blurred {
5707 filter: blur(5px);
5708 pointer-events: none;
5709 user-select: none;
5710 }
5711 .wpfnl-compare-store-card .wpfnl-csc-pro-overlay {
5712 position: absolute;
5713 inset: 0;
5714 display: flex;
5715 align-items: center;
5716 justify-content: center;
5717 background: rgba(255, 255, 255, 0.55);
5718 border-radius: 6px;
5719 text-decoration: none;
5720 z-index: 5;
5721 }
5722 .wpfnl-compare-store-card .wpfnl-csc-pro-overlay .wpfnl-csc-pro-overlay-text {
5723 padding: 8px 18px;
5724 background: #6E42D3;
5725 color: #fff;
5726 font-size: 13px;
5727 font-weight: 500;
5728 border-radius: 6px;
5729 white-space: nowrap;
5730 }
5731 .wpfnl-compare-store-card .wpfnl-csc-pro-overlay:hover .wpfnl-csc-pro-overlay-text {
5732 background: #5a35b8;
5733 }
5734
5735 .wpfnl-pro-banner--compact {
5736 padding: 7px 10px;
5737 margin-bottom: 10px;
5738 border-radius: 6px;
5739 }
5740 .wpfnl-pro-banner--compact .wpfnl-pro-banner-left {
5741 font-size: 12px;
5742 gap: 5px;
5743 }
5744 .wpfnl-pro-banner--compact .wpfnl-pro-banner-btn {
5745 padding: 4px 10px;
5746 font-size: 11px;
5747 }
5748
5749 .wpfnl-single-card.is-pro-locked {
5750 position: relative;
5751 }
5752 .wpfnl-single-card.is-pro-locked .wpfnl-card-header,
5753 .wpfnl-single-card.is-pro-locked .wpfnl-card-body {
5754 opacity: 0.38;
5755 pointer-events: none;
5756 user-select: none;
5757 }
5758
5759 .wpfnl-card-pro-badge {
5760 position: absolute;
5761 top: 14px;
5762 right: 14px;
5763 display: flex;
5764 align-items: center;
5765 z-index: 2;
5766 }
5767 .wpfnl-card-pro-badge svg {
5768 width: 22px;
5769 height: 22px;
5770 }
5771
5772 .wpfnl-compare-store-card.is-pro-locked .wpfnl-csc-body,
5773 .wpfnl-compare-store-card.is-pro-locked .wpfnl-csc-footer {
5774 opacity: 0.38;
5775 pointer-events: none;
5776 user-select: none;
5777 }
5778
5779 .wpfnl-csc-header-right {
5780 display: flex;
5781 align-items: center;
5782 gap: 6px;
5783 }
5784
5785 .wpfnl-csc-pro-badge {
5786 display: flex;
5787 align-items: center;
5788 text-decoration: none;
5789 }
5790 .wpfnl-csc-pro-badge svg {
5791 width: 20px;
5792 height: 20px;
5793 }
5794
5795 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter, .template-library-modal .funnel-templates-header .pro-free__filter {
5796 border-radius: 50px;
5797 box-shadow: none;
5798 border: 1px solid #E5E8F3;
5799 margin-left: 15px !important;
5800 background: #ffffff;
5801 display: inline-flex;
5802 align-items: center;
5803 }
5804 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li, .template-library-modal .funnel-templates-header .pro-free__filter li {
5805 color: #363B4E;
5806 font-size: 14px;
5807 padding: 9px 18px;
5808 font-weight: 400;
5809 text-transform: capitalize;
5810 cursor: pointer;
5811 position: relative;
5812 border-right: 1px solid #E5E8F3;
5813 z-index: 1;
5814 display: flex;
5815 flex-flow: row;
5816 align-items: center;
5817 }
5818 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li:first-child, .template-library-modal .funnel-templates-header .pro-free__filter li:first-child {
5819 border-radius: 50px 0 0 50px;
5820 }
5821 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li:last-child, .template-library-modal .funnel-templates-header .pro-free__filter li:last-child {
5822 border-radius: 0 50px 50px 0;
5823 }
5824 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li svg, .template-library-modal .funnel-templates-header .pro-free__filter li svg {
5825 position: relative;
5826 top: -1px;
5827 margin-right: 8px;
5828 }
5829 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li.active, .template-library-modal .funnel-templates-header .pro-free__filter li.active {
5830 background-color: #6E42D3;
5831 color: #ffffff;
5832 }
5833 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li.active svg path, .template-library-modal .funnel-templates-header .pro-free__filter li.active svg path {
5834 stroke: #fff;
5835 }
5836
5837 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal, .step-template-showcase-modal .create-step-name-modal, .template-library-modal .create-funnel-name-modal {
5838 position: absolute;
5839 top: 200px;
5840 left: calc(50% - 123px);
5841 background: #ffffff;
5842 width: 410px;
5843 z-index: 999;
5844 transform: translate(-50%, -50%);
5845 padding: 28px 30px 30px;
5846 border-radius: 10px;
5847 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
5848 transition: all 0.3s ease;
5849 opacity: 0;
5850 visibility: hidden;
5851 }
5852 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .show.create-step-name-modal, .step-template-showcase-modal .show.create-step-name-modal, .template-library-modal .show.create-funnel-name-modal {
5853 opacity: 1;
5854 visibility: visible;
5855 top: 250px;
5856 }
5857 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-header, .step-template-showcase-modal .create-step-name-modal .modal-header, .template-library-modal .create-funnel-name-modal .modal-header {
5858 display: flex;
5859 flex-flow: row wrap;
5860 align-items: center;
5861 justify-content: space-between;
5862 margin-bottom: 10px;
5863 }
5864 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-header .title, .step-template-showcase-modal .create-step-name-modal .modal-header .title, .template-library-modal .create-funnel-name-modal .modal-header .title {
5865 font-size: 16px;
5866 line-height: normal;
5867 font-weight: 500;
5868 }
5869 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-header .close, .step-template-showcase-modal .create-step-name-modal .modal-header .close, .template-library-modal .create-funnel-name-modal .modal-header .close {
5870 position: absolute;
5871 border: none;
5872 right: -11px;
5873 top: -13px;
5874 display: flex;
5875 width: 40px;
5876 height: 40px;
5877 padding: 8px;
5878 justify-content: center;
5879 flex-flow: column;
5880 align-items: center;
5881 border-radius: 100px;
5882 background: #FFF;
5883 box-shadow: 0px 1px 1px 0px #DADADA;
5884 cursor: pointer;
5885 }
5886 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-header .close svg, .step-template-showcase-modal .create-step-name-modal .modal-header .close svg, .template-library-modal .create-funnel-name-modal .modal-header .close svg {
5887 display: block;
5888 width: 18px;
5889 height: 18px;
5890 }
5891 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-body input[type=text], .step-template-showcase-modal .create-step-name-modal .modal-body input[type=text], .template-library-modal .create-funnel-name-modal .modal-body input[type=text] {
5892 font-size: 14px;
5893 color: #363B4E;
5894 border-radius: 6px;
5895 border-color: #E2E2E2;
5896 height: 40px;
5897 margin-bottom: 15px;
5898 }
5899 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-body input[type=text]:-webkit-autofill, .step-template-showcase-modal .create-step-name-modal .modal-body input[type=text]:-webkit-autofill, .template-library-modal .create-funnel-name-modal .modal-body input[type=text]:-webkit-autofill {
5900 -webkit-box-shadow: 0 0 0 30px #ffffff inset;
5901 box-shadow: 0 0 0 30px #ffffff inset;
5902 -webkit-text-fill-color: #363B4E !important;
5903 }
5904 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-body input[type=text]::-webkit-input-placeholder, .step-template-showcase-modal .create-step-name-modal .modal-body input[type=text]::-webkit-input-placeholder, .template-library-modal .create-funnel-name-modal .modal-body input[type=text]::-webkit-input-placeholder {
5905 color: #7A8B9A;
5906 }
5907 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-body input[type=text]::-moz-placeholder, .step-template-showcase-modal .create-step-name-modal .modal-body input[type=text]::-moz-placeholder, .template-library-modal .create-funnel-name-modal .modal-body input[type=text]::-moz-placeholder {
5908 color: #7A8B9A;
5909 }
5910 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-body input[type=text]:-ms-input-placeholder, .step-template-showcase-modal .create-step-name-modal .modal-body input[type=text]:-ms-input-placeholder, .template-library-modal .create-funnel-name-modal .modal-body input[type=text]:-ms-input-placeholder {
5911 color: #7A8B9A;
5912 }
5913 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-body input[type=text]:-moz-placeholder, .step-template-showcase-modal .create-step-name-modal .modal-body input[type=text]:-moz-placeholder, .template-library-modal .create-funnel-name-modal .modal-body input[type=text]:-moz-placeholder {
5914 color: #7A8B9A;
5915 }
5916 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-body button[type=submit], .step-template-showcase-modal .create-step-name-modal .modal-body button[type=submit], .template-library-modal .create-funnel-name-modal .modal-body button[type=submit] {
5917 border-radius: 10px;
5918 background: #6E42D3;
5919 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
5920 width: 100%;
5921 height: 40px;
5922 line-height: 1;
5923 padding: 14px 30px;
5924 }
5925
5926 .step-template-showcase-modal .wpfnl-step__single-template .template-action, .template-library-modal .wpfnl-step__single-template .template-action, .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-action {
5927 position: absolute;
5928 left: 0;
5929 top: 0;
5930 width: 100%;
5931 height: 100%;
5932 padding: 13px 15px;
5933 background: rgba(38, 33, 51, 0.6);
5934 z-index: 1;
5935 border-radius: 10px 10px 0 0;
5936 display: flex;
5937 flex-flow: column;
5938 align-items: center;
5939 justify-content: center;
5940 gap: 14px;
5941 -webkit-backdrop-filter: blur(7px);
5942 backdrop-filter: blur(7px);
5943 transition: all 0.3s ease;
5944 opacity: 0;
5945 visibility: hidden;
5946 }
5947 .step-template-showcase-modal .wpfnl-step__single-template .template-action .btn-default, .template-library-modal .wpfnl-step__single-template .template-action .btn-default, .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-action .btn-default {
5948 margin: 0;
5949 padding: 11px 19px 9px;
5950 height: auto;
5951 width: 100px;
5952 min-width: auto;
5953 font-size: 15px;
5954 line-height: 1;
5955 font-weight: 500;
5956 border-radius: 8px;
5957 border: 1px solid #F2F2F2;
5958 background-color: transparent;
5959 color: #fff;
5960 }
5961 .step-template-showcase-modal .wpfnl-step__single-template .template-action .btn-default:hover, .template-library-modal .wpfnl-step__single-template .template-action .btn-default:hover, .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-action .btn-default:hover {
5962 background-color: #fff;
5963 border-color: #fff;
5964 color: #363B4E;
5965 }
5966
5967 .template-library-modal {
5968 position: fixed;
5969 top: 32px;
5970 left: 160px;
5971 width: calc(100% - 160px);
5972 height: 100%;
5973 background: #F6F5FA;
5974 z-index: 99;
5975 }
5976 .template-library-modal .templates-title-wrapper {
5977 margin-bottom: 22px;
5978 display: flex;
5979 flex-flow: row;
5980 align-items: center;
5981 width: 100%;
5982 }
5983 .template-library-modal .templates-title-wrapper .title {
5984 line-height: 18px;
5985 text-transform: capitalize;
5986 font-size: 18px;
5987 color: #0e2244;
5988 font-weight: 500;
5989 }
5990 .template-library-modal .wpfnl-create-funnel__inner-content {
5991 height: 100%;
5992 }
5993 .template-library-modal .wpfnl-create-funnel__templates-wrapper {
5994 width: 100%;
5995 max-height: 890px;
5996 height: 100%;
5997 overflow: auto;
5998 }
5999 .template-library-modal .wpfnl-create-funnel__templates-wrapper::-webkit-scrollbar {
6000 width: 5px;
6001 }
6002 .template-library-modal .wpfnl-create-funnel__templates-wrapper::-webkit-scrollbar-track {
6003 background: #f2f5f8;
6004 }
6005 .template-library-modal .wpfnl-create-funnel__templates-wrapper::-webkit-scrollbar-thumb {
6006 background-color: #BCC0C3;
6007 border-radius: 20px;
6008 }
6009 .template-library-modal .funnel-templates-header {
6010 background: #FFFFFF;
6011 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.4);
6012 padding: 15px 24px;
6013 position: relative;
6014 }
6015 .template-library-modal .funnel-templates-header .template-library-filter-wrapper {
6016 display: flex;
6017 flex-flow: row wrap;
6018 align-items: center;
6019 justify-content: space-between;
6020 width: 100%;
6021 }
6022 .template-library-modal .funnel-templates-header .template-library-filter-wrapper.is-store-checkout .pro-free__filter {
6023 margin-left: auto !important;
6024 }
6025 .template-library-modal .funnel-templates-header .back-form-modal {
6026 height: 38px;
6027 width: 38px;
6028 border: 1px solid #EEF0F3;
6029 margin-right: 15px;
6030 border-radius: 10px;
6031 background: #FFFFFF;
6032 display: flex;
6033 flex-flow: column;
6034 align-items: center;
6035 justify-content: center;
6036 cursor: pointer;
6037 }
6038 .template-library-modal .funnel-templates-header .back-form-modal svg {
6039 position: relative;
6040 left: -1px;
6041 }
6042 .template-library-modal .funnel-templates-header .header-title {
6043 font-weight: 500;
6044 font-size: 16px;
6045 line-height: 1.3;
6046 color: #363B4E;
6047 }
6048 .template-library-modal .funnel-templates-header .sync-library-btn {
6049 display: inline-flex;
6050 align-items: center;
6051 gap: 6px;
6052 height: 38px;
6053 padding: 0 16px;
6054 border: 1px solid #EEF0F3;
6055 border-radius: 50px;
6056 background: #FFFFFF;
6057 color: #363B4E !important;
6058 font-size: 14px;
6059 font-weight: 400;
6060 cursor: pointer;
6061 margin-left: 12px;
6062 transition: border-color 0.2s, color 0.2s;
6063 }
6064 .template-library-modal .funnel-templates-header .sync-library-btn span {
6065 color: inherit;
6066 }
6067 .template-library-modal .funnel-templates-header .sync-library-btn svg {
6068 flex-shrink: 0;
6069 }
6070 .template-library-modal .funnel-templates-header .sync-library-btn:hover:not(:disabled) {
6071 border-color: #b3b8c7;
6072 color: #1a1f2e;
6073 }
6074 .template-library-modal .funnel-templates-header .sync-library-btn:disabled {
6075 opacity: 0.65;
6076 cursor: not-allowed;
6077 }
6078 .template-library-modal .funnel-templates-header .sync-library-btn .spinning {
6079 animation: sync-spin 1s linear infinite;
6080 }
6081 @keyframes sync-spin {
6082 from {
6083 transform: rotate(0deg);
6084 }
6085 to {
6086 transform: rotate(360deg);
6087 }
6088 }
6089 .template-library-modal .funnel-templates-header .wpfnl-template-header-title-wrapper {
6090 display: flex;
6091 align-items: center;
6092 }
6093 .template-library-modal .funnel-templates-header .template-type-filter {
6094 display: block;
6095 width: auto;
6096 margin-left: auto;
6097 border: 1px solid #EEF0F3;
6098 height: 38px;
6099 border-radius: 50px;
6100 color: #363B4E;
6101 letter-spacing: -0.01em;
6102 -moz-appearance: none; /* Firefox */
6103 -webkit-appearance: none; /* Safari and Chrome */
6104 appearance: none;
6105 background: transparent;
6106 background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgNyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTAuODEzIDFsLTQuNSA0LjUtNC41LTQuNSIvPjwvc3ZnPg==");
6107 background-repeat: no-repeat;
6108 background-position-x: calc(100% - 15px);
6109 background-position-y: 13px;
6110 background-size: 12px 12px;
6111 }
6112 .template-library-modal .funnel-templates-header .funnel-global-import {
6113 min-width: 152px;
6114 display: flex;
6115 justify-content: flex-end;
6116 align-items: center;
6117 }
6118 .template-library-modal .funnel-templates-header .funnel-global-import .btn-default {
6119 height: 40px;
6120 line-height: 41px;
6121 position: relative;
6122 padding: 0 20px;
6123 min-width: auto;
6124 box-shadow: 0px 10px 16px rgba(97, 103, 116, 0.15);
6125 border-radius: 8px;
6126 }
6127 .template-library-modal .funnel-templates-header .funnel-global-import .btn-default .btn-text {
6128 position: relative;
6129 z-index: 1;
6130 color: #fff;
6131 font-weight: 500;
6132 }
6133 .template-library-modal .funnel-templates-header .funnel-global-import .btn-default .pro-tag {
6134 position: absolute;
6135 top: -21px;
6136 right: 10px;
6137 }
6138 .template-library-modal .funnel-templates-header .funnel-global-import .global-import-progress {
6139 position: absolute;
6140 left: 0;
6141 bottom: 0;
6142 width: 0;
6143 height: 100%;
6144 background: #8b5ef3;
6145 border-radius: 10px;
6146 z-index: 0;
6147 transition: all 0.4s linear;
6148 }
6149 .template-library-modal .funnel-templates-header .responsive-switcher {
6150 border: 1px solid #E4E6EB;
6151 border-radius: 8px;
6152 margin-left: -10%;
6153 }
6154 .template-library-modal .funnel-templates-header .responsive-switcher button {
6155 background: transparent;
6156 border: none;
6157 padding: 10px 10px;
6158 border-right: 1px solid #E4E6EB;
6159 cursor: pointer;
6160 }
6161 .template-library-modal .funnel-templates-header .responsive-switcher button:last-child {
6162 border-right: none;
6163 }
6164 .template-library-modal .funnel-templates-header .responsive-switcher button.active svg path,
6165 .template-library-modal .funnel-templates-header .responsive-switcher button.active svg rect {
6166 stroke: #6E42D3;
6167 }
6168 .template-library-modal .funnel-templates-header .responsive-switcher button.active svg circle {
6169 fill: #6E42D3;
6170 }
6171 .template-library-modal .funnel-templates-header .responsive-switcher button.active.tablet-view svg path, .template-library-modal .funnel-templates-header .responsive-switcher button.active.mobile-view svg path {
6172 fill: #6E42D3;
6173 }
6174 .template-library-modal .funnel-templates-body {
6175 display: flex;
6176 flex-flow: row wrap;
6177 height: calc(100% - 78px);
6178 }
6179 .template-library-modal .funnel-templates-sidebar {
6180 background: #FFFFFF;
6181 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
6182 width: 247px;
6183 padding: 19px 20px;
6184 }
6185 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav {
6186 display: flex;
6187 margin-bottom: 24px;
6188 }
6189 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span {
6190 font-size: 14px;
6191 line-height: 1.3;
6192 font-weight: 600;
6193 color: #292C2F;
6194 flex: 1;
6195 text-align: center;
6196 display: block;
6197 border-bottom: 1px solid #E4E6EB;
6198 padding-bottom: 15px;
6199 cursor: pointer;
6200 position: relative;
6201 }
6202 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span:before {
6203 content: "";
6204 position: absolute;
6205 bottom: 0;
6206 left: 0;
6207 width: 100%;
6208 height: 2px;
6209 background: #6E42D3;
6210 display: none;
6211 }
6212 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span.active {
6213 color: #6E42D3;
6214 }
6215 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span.active:before {
6216 display: block;
6217 }
6218 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper {
6219 height: 720px;
6220 padding-right: 8px;
6221 overflow: auto;
6222 }
6223 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper::-webkit-scrollbar {
6224 width: 5px;
6225 }
6226 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper::-webkit-scrollbar-track {
6227 background: #f2f5f8;
6228 }
6229 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper::-webkit-scrollbar-thumb {
6230 background-color: #BCC0C3;
6231 border-radius: 20px;
6232 }
6233 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li {
6234 font-weight: 500;
6235 font-size: 14px;
6236 line-height: 1.3;
6237 letter-spacing: -0.01em;
6238 color: #363B4E;
6239 background: #FFFFFF;
6240 border: 1px solid #EEF0F3;
6241 border-radius: 8px;
6242 padding: 12px 16px;
6243 margin-bottom: 14px;
6244 cursor: pointer;
6245 display: flex;
6246 align-items: center;
6247 gap: 7px;
6248 transition: all 0.3s ease;
6249 }
6250 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li.active, .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li:hover {
6251 color: #6E42D3;
6252 border-color: #6E42D3;
6253 box-shadow: 0px 20px 16px rgba(189, 193, 200, 0.2);
6254 }
6255 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li svg {
6256 position: relative;
6257 top: -1px;
6258 display: block;
6259 min-width: 20px;
6260 }
6261 .template-library-modal .funnel-templates-sidebar .wpfnl-create-step__filter-nav {
6262 width: 100%;
6263 min-height: auto;
6264 background: transparent;
6265 box-shadow: none;
6266 padding: 0;
6267 align-self: stretch;
6268 }
6269 .template-library-modal .funnel-templates-content {
6270 width: calc(100% - 247px);
6271 height: 100%;
6272 overflow-y: auto;
6273 position: relative;
6274 padding: 40px;
6275 box-sizing: border-box;
6276 }
6277 .template-library-modal .funnel-templates-content .not-clickable-overlay {
6278 z-index: 9;
6279 }
6280 .template-library-modal .funnel-templates-content .template-cat-filter-loader {
6281 position: absolute;
6282 inset: 0;
6283 z-index: 100;
6284 background: rgba(255, 255, 255, 0.8);
6285 backdrop-filter: blur(2px);
6286 display: flex;
6287 align-items: center;
6288 justify-content: center;
6289 border-radius: 4px;
6290 opacity: 0;
6291 visibility: hidden;
6292 transition: opacity 0.15s ease, visibility 0.15s ease;
6293 pointer-events: none;
6294 }
6295 .template-library-modal .funnel-templates-content .template-cat-filter-loader .wpfnl-loader {
6296 display: block;
6297 width: 50px;
6298 height: 50px;
6299 margin: 0;
6300 position: sticky;
6301 top: 50%;
6302 border-width: 3px;
6303 border-top-width: 3px;
6304 flex-shrink: 0;
6305 }
6306 .template-library-modal .funnel-templates-content .template-cat-filter-loader.show-loader {
6307 opacity: 1;
6308 visibility: visible;
6309 pointer-events: all;
6310 }
6311 .template-library-modal .no-sidebar .funnel-templates-content {
6312 width: 100%;
6313 }
6314 .template-library-modal .wpfnl-create-funnel__templates {
6315 position: relative;
6316 min-height: 370px;
6317 display: flex;
6318 flex-flow: row wrap;
6319 gap: 40px;
6320 }
6321 .template-library-modal .wpfnl-create-funnel__templates .wpfnl-create-funnel__loader {
6322 position: absolute;
6323 top: 0;
6324 left: 0;
6325 width: 100%;
6326 height: 100%;
6327 background: #f6f6f8;
6328 display: flex;
6329 flex-flow: column;
6330 align-items: center;
6331 justify-content: flex-start;
6332 z-index: 9;
6333 }
6334 .template-library-modal .wpfnl-create-funnel__templates .wpfnl-create-funnel__loader .wpfnl-loader {
6335 display: block;
6336 width: 40px;
6337 height: 40px;
6338 margin-top: 12%;
6339 }
6340 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
6341 width: calc(25% - 30px);
6342 position: relative;
6343 }
6344 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .freemium-tag {
6345 position: absolute;
6346 top: 10px;
6347 right: 10px;
6348 z-index: 1;
6349 padding: 3px 8px 4px;
6350 background-color: #2FCF5C;
6351 font-size: 10px;
6352 border-radius: 5px;
6353 }
6354 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch {
6355 background-color: transparent;
6356 border: 2px dashed #A1A1B6;
6357 border-radius: 10px;
6358 }
6359 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice,
6360 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default {
6361 height: 48px;
6362 line-height: 49px;
6363 width: 100%;
6364 max-width: 194px;
6365 padding: 0 8px;
6366 border-radius: 12px;
6367 position: absolute;
6368 top: 50%;
6369 left: 50%;
6370 transform: translate(-50%, -50%);
6371 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
6372 }
6373 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice svg,
6374 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default svg {
6375 margin-right: 2px;
6376 }
6377 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice path,
6378 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default path {
6379 stroke: #fff;
6380 }
6381 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .pro-tag {
6382 position: absolute;
6383 top: -23px;
6384 right: 11px;
6385 }
6386 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .wpfnl-single-remote-wrapper {
6387 opacity: 0;
6388 visibility: hidden;
6389 }
6390 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice {
6391 max-width: 100%;
6392 text-align: center;
6393 padding: 15px;
6394 height: auto;
6395 line-height: normal;
6396 border-radius: 0;
6397 box-shadow: none;
6398 }
6399 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice p {
6400 color: #d24d4d;
6401 line-height: 1.6;
6402 }
6403 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.show-step-preview {
6404 width: 100%;
6405 margin: 0;
6406 background: transparent;
6407 border-radius: 0;
6408 }
6409 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .wpfnl-single-remote-wrapper {
6410 position: relative;
6411 background: #ffffff;
6412 border-radius: 10px;
6413 height: 100%;
6414 transition: all 0.3s ease;
6415 }
6416 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .wpfnl-single-remote-template {
6417 position: relative;
6418 }
6419 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-image-wrapper {
6420 background-repeat: no-repeat;
6421 background-size: 100% auto;
6422 background-position: top center;
6423 border-radius: 10px 10px 0 0;
6424 position: relative;
6425 overflow: hidden;
6426 }
6427 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-image-wrapper:before {
6428 content: "";
6429 display: block;
6430 padding-top: 100%;
6431 }
6432 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-img {
6433 width: 100%;
6434 border-radius: 10px 10px 0 0;
6435 height: 350px;
6436 object-fit: contain;
6437 }
6438 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .importar-loader {
6439 background: rgba(38, 33, 51, 0.6);
6440 -webkit-backdrop-filter: blur(7px);
6441 backdrop-filter: blur(7px);
6442 }
6443 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .funnel-template-info {
6444 text-align: center;
6445 padding: 14px;
6446 background: #ffffff;
6447 border-radius: 0 0 10px 10px;
6448 position: relative;
6449 border-top: 1px solid #E5E8F3;
6450 }
6451 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .funnel-template-info .title {
6452 color: #363B4E;
6453 padding: 0;
6454 min-height: auto;
6455 display: block;
6456 font-weight: 500;
6457 transition: all 0.3s ease;
6458 }
6459 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .funnel-template-info .steps {
6460 color: #7A8B9A;
6461 letter-spacing: -0.01em;
6462 font-size: 12px;
6463 }
6464 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template:hover .wpfnl-single-remote-wrapper {
6465 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.2);
6466 }
6467 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template:hover .template-action {
6468 opacity: 1;
6469 visibility: visible;
6470 }
6471 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper {
6472 gap: 40px;
6473 position: relative;
6474 width: 100%;
6475 display: flex;
6476 flex-flow: row wrap;
6477 align-items: flex-start;
6478 }
6479 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
6480 width: calc(20% - 32px);
6481 }
6482 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper {
6483 margin: auto;
6484 width: 100%;
6485 }
6486 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper {
6487 display: flex;
6488 align-items: center;
6489 width: 100%;
6490 justify-content: center;
6491 gap: 10px;
6492 margin-bottom: 40px;
6493 }
6494 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step {
6495 width: 80px;
6496 text-align: center;
6497 }
6498 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step span {
6499 border-radius: 6px;
6500 background: #FFF;
6501 box-shadow: 0px 53px 32px 0px rgba(0, 0, 0, 0.02), 0px 6px 13px 0px rgba(0, 0, 0, 0.04), 0px 1px 3px 0px rgba(143, 143, 143, 0.2), 0px 0px 0px 1px #EAEAEA, 0px -2.4px 0px 0px rgba(61, 61, 61, 0.04) inset;
6502 padding: 3px;
6503 cursor: pointer;
6504 display: block;
6505 border: 1px solid transparent;
6506 min-height: 80px;
6507 }
6508 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step span img {
6509 width: 70px;
6510 height: 70px;
6511 }
6512 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step p {
6513 color: #6B7589;
6514 font-size: 12px;
6515 margin-top: 10px;
6516 text-transform: capitalize;
6517 }
6518 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step.active span {
6519 border-color: #6E42D3;
6520 }
6521 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step.active p {
6522 color: #6E42D3;
6523 }
6524 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview {
6525 width: 100%;
6526 background: #FFF;
6527 margin: auto;
6528 }
6529 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview .wpfnl-preview-checkout-placeholder {
6530 min-height: 650px;
6531 display: flex;
6532 align-items: center;
6533 justify-content: center;
6534 padding: 20px 0;
6535 }
6536 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.mobile {
6537 width: 425px;
6538 }
6539 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.tablet {
6540 width: 768px;
6541 }
6542 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.mobile, .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.tablet {
6543 padding: 50px 10px 60px;
6544 box-shadow: 0 14px 28px 0 rgba(0, 0, 0, 0.0588235294);
6545 border-radius: 30px;
6546 position: relative;
6547 }
6548 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.mobile .wpfnl-template-iframe-wrapper, .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.tablet .wpfnl-template-iframe-wrapper {
6549 border: 1px solid rgba(15, 12, 9, 0.1);
6550 }
6551 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview .wpfnl-template-iframe-wrapper {
6552 position: relative;
6553 }
6554 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview .wpfnl-template-iframe-wrapper .wpfnl-loader-wrapper {
6555 position: absolute;
6556 width: 100%;
6557 height: 100%;
6558 top: 0;
6559 display: none;
6560 align-items: center;
6561 justify-content: center;
6562 background: rgba(38, 27, 103, 0.2);
6563 }
6564 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview .wpfnl-template-iframe-wrapper .wpfnl-loader-wrapper.active {
6565 display: flex;
6566 }
6567 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview .wpfnl-template-iframe-wrapper .wpfnl-loader-wrapper .wpfnl-loader {
6568 display: block;
6569 width: 50px;
6570 height: 50px;
6571 }
6572 .template-library-modal .wpfnl-create-funnel__templates .step-title-wrapper {
6573 position: absolute;
6574 top: 0;
6575 left: 0;
6576 }
6577 .template-library-modal .wpfnl-create-funnel__templates .step-title-wrapper .title {
6578 font-weight: 500;
6579 font-size: 18px;
6580 line-height: 1;
6581 color: #363B4E;
6582 }
6583 .template-library-modal .wpfnl-create-funnel-layout {
6584 width: 100%;
6585 background: #F6F5FA;
6586 border-radius: 14px;
6587 max-width: 1093px;
6588 position: fixed;
6589 top: 50% !important;
6590 left: calc(50% + 80px);
6591 transform: translate(-50%, -50%);
6592 height: 80%;
6593 max-height: 690px;
6594 }
6595 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout {
6596 height: auto;
6597 max-height: none;
6598 max-width: 520px;
6599 padding: 25px;
6600 }
6601 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-confirm-body {
6602 height: auto;
6603 }
6604 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-title {
6605 font-size: 20px;
6606 font-weight: 600;
6607 color: #2D3149;
6608 margin: 0 0 10px;
6609 line-height: 1.3;
6610 }
6611 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-subtitle {
6612 font-size: 14px;
6613 font-weight: 600;
6614 color: #2D3149;
6615 margin: 0 0 14px;
6616 }
6617 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-feature-list {
6618 list-style: none;
6619 padding: 0;
6620 margin: 0 0 18px;
6621 display: flex;
6622 flex-direction: column;
6623 gap: 10px;
6624 }
6625 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-feature-list li {
6626 display: flex;
6627 align-items: center;
6628 gap: 10px;
6629 font-size: 14px;
6630 color: #6B7280;
6631 }
6632 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-feature-list li svg {
6633 flex-shrink: 0;
6634 }
6635 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-desc {
6636 font-size: 13px;
6637 color: #6B7280;
6638 line-height: 1.6;
6639 margin: 0 0 24px;
6640 }
6641 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .button-area {
6642 margin-top: 0;
6643 }
6644 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions {
6645 display: flex;
6646 align-items: center;
6647 justify-content: flex-end;
6648 gap: 12px;
6649 }
6650 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-cancel {
6651 display: inline-flex;
6652 align-items: center;
6653 justify-content: center;
6654 height: 38px;
6655 padding: 0 24px;
6656 font-size: 14px;
6657 font-weight: 500;
6658 color: #6E42D3;
6659 background: transparent;
6660 border: 1.5px solid #6E42D3;
6661 border-radius: 10px;
6662 cursor: pointer;
6663 transition: all 0.3s ease;
6664 min-width: 100px;
6665 }
6666 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-cancel:hover {
6667 background: #f5f0ff;
6668 }
6669 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-create-store-checkout {
6670 min-width: 180px;
6671 height: 38px;
6672 line-height: 38px;
6673 padding: 0 24px;
6674 }
6675 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-create-store-checkout:disabled {
6676 opacity: 0.7;
6677 cursor: not-allowed;
6678 }
6679 .template-library-modal .wpfnl-create-funnel-layout .close {
6680 position: absolute;
6681 border: none;
6682 right: -11px;
6683 top: -13px;
6684 display: flex;
6685 width: 40px;
6686 height: 40px;
6687 padding: 8px;
6688 justify-content: center;
6689 flex-flow: column;
6690 align-items: center;
6691 border-radius: 100px;
6692 background: #FFF;
6693 box-shadow: 0px 1px 1px 0px #DADADA;
6694 cursor: pointer;
6695 }
6696 .template-library-modal .wpfnl-create-funnel-layout .wpfnl-form-group {
6697 margin-bottom: 23px;
6698 }
6699 .template-library-modal .wpfnl-create-funnel-layout .wpfnl-form-group > label {
6700 color: #2D3149;
6701 font-size: 15px;
6702 font-weight: 500;
6703 line-height: 1.3;
6704 margin-bottom: 7px;
6705 display: block;
6706 }
6707 .template-library-modal .wpfnl-create-funnel-layout .modal-body {
6708 height: 100%;
6709 }
6710 .template-library-modal .wpfnl-create-funnel-layout .modal-body input[type=text] {
6711 margin-bottom: 0;
6712 border-radius: 8px;
6713 background: #FFF;
6714 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
6715 border: none;
6716 font-weight: 300;
6717 }
6718 .template-library-modal .wpfnl-create-funnel-layout .modal-body button[type=submit] {
6719 width: auto;
6720 }
6721 .template-library-modal .wpfnl-create-funnel-layout .layout-title {
6722 color: #2D3149;
6723 font-size: 15px;
6724 font-weight: 500;
6725 line-height: 1.3;
6726 margin-bottom: 9px;
6727 }
6728 .template-library-modal .wpfnl-create-funnel-layout form {
6729 height: 100%;
6730 }
6731 .template-library-modal .wpfnl-create-funnel-layout .funnels-layout-wrapper {
6732 display: flex;
6733 flex-flow: row wrap;
6734 gap: 20px;
6735 border-bottom: 1px solid #E5E1F1;
6736 padding-bottom: 20px;
6737 margin-bottom: 20px;
6738 overflow: auto;
6739 height: 100%;
6740 max-height: calc(100% - 176px);
6741 }
6742 .template-library-modal .wpfnl-create-funnel-layout .single-layout {
6743 width: calc(33.3333333333% - 14px);
6744 position: relative;
6745 }
6746 .template-library-modal .wpfnl-create-funnel-layout .single-layout .pro-tag {
6747 position: absolute;
6748 right: 24px;
6749 top: 24px;
6750 z-index: 2;
6751 border-radius: 5px;
6752 background: #2FCF5C;
6753 box-shadow: 0px 4px 6px 0px #E0DEE5;
6754 font-size: 12px;
6755 font-weight: 700;
6756 line-height: 1;
6757 padding: 3px 6px;
6758 }
6759 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner {
6760 border-radius: 16px;
6761 border: 1px solid #EBE9F5;
6762 box-shadow: 0px 8px 8px 0px rgba(226, 223, 237, 0.3);
6763 padding: 10px;
6764 display: block;
6765 background: #fff;
6766 transition: all 0.3s ease;
6767 cursor: pointer;
6768 position: relative;
6769 overflow: hidden;
6770 }
6771 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner:before {
6772 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgNjMgNTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGNpcmNsZSBjeD0iNDIuNSIgY3k9IjkuNSIgcj0iNDIuNSIgZmlsbD0iIzZFNDJEMyIvPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF80ODRfMTMpIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNNDAuNDg5IDE3LjU5NmExLjc0NSAxLjc0NSAwIDAwLTIuNDY4IDBMMjYuOTE1IDI4LjcwMmwtNC45MzYtNC45MzZhMS43NDUgMS43NDUgMCAxMC0yLjQ2OCAyLjQ2OGw2LjE3IDYuMTdjLjM0LjM0Ljc4Ny41MTEgMS4yMzQuNTExLjQ0NyAwIC44OTMtLjE3IDEuMjM0LS41MTFsMTIuMzQtMTIuMzRhMS43NDUgMS43NDUgMCAwMDAtMi40Njh6Ii8+PC9nPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDBfNDg0XzEzIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMCAwaDIydjIySDB6IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOSAxNCkiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=");
6773 position: absolute;
6774 right: -2px;
6775 top: -2px;
6776 display: block;
6777 width: 58px;
6778 opacity: 0;
6779 visibility: hidden;
6780 transition: all 0.3s ease;
6781 }
6782 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner.is-pro {
6783 cursor: not-allowed;
6784 }
6785 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner.is-pro:after {
6786 content: "";
6787 position: absolute;
6788 left: 0;
6789 top: 0;
6790 width: 100%;
6791 height: 100%;
6792 background: rgba(255, 255, 255, 0.4588235294);
6793 border-radius: 16px;
6794 z-index: 1;
6795 }
6796 .template-library-modal .wpfnl-create-funnel-layout .single-layout.active .single-layout-inner {
6797 border-color: #6E42D3;
6798 }
6799 .template-library-modal .wpfnl-create-funnel-layout .single-layout.active .single-layout-inner::before {
6800 opacity: 1;
6801 visibility: visible;
6802 }
6803 .template-library-modal .wpfnl-create-funnel-layout .inner-box {
6804 border-radius: 16px;
6805 background: #CEE4DD;
6806 display: flex;
6807 align-items: center;
6808 justify-content: center;
6809 flex-flow: column;
6810 height: 185px;
6811 padding: 15px;
6812 }
6813 .template-library-modal .wpfnl-create-funnel-layout .inner-box svg {
6814 max-width: 100%;
6815 }
6816 .template-library-modal .wpfnl-create-funnel-layout .layout2 .inner-box {
6817 background-color: #F3E8FF;
6818 }
6819 .template-library-modal .wpfnl-create-funnel-layout .layout3 .inner-box {
6820 background-color: rgba(167, 204, 245, 0.3019607843);
6821 }
6822 .template-library-modal .wpfnl-create-funnel-layout .layout4 .inner-box {
6823 background-color: #FDF2CB;
6824 }
6825 .template-library-modal .wpfnl-create-funnel-layout .layout5 .inner-box {
6826 background-color: #E5F0FC;
6827 }
6828 .template-library-modal .wpfnl-create-funnel-layout .layout6 .inner-box {
6829 background-color: #FFEAE1;
6830 }
6831 .template-library-modal .wpfnl-create-funnel-layout input[type=radio]:checked + .single-layout-inner {
6832 border-color: #6E42D3;
6833 }
6834 .template-library-modal .wpfnl-create-funnel-layout .button-area {
6835 text-align: right;
6836 display: flex;
6837 flex-flow: row wrap;
6838 align-items: center;
6839 justify-content: flex-end;
6840 gap: 10px;
6841 }
6842 .template-library-modal .wpfnl-create-funnel-layout .button-area .wpfnl-alert.box {
6843 padding: 10px 20px;
6844 }
6845
6846 #create-funnel-loader {
6847 position: absolute;
6848 left: 50%;
6849 top: 50%;
6850 z-index: 99;
6851 opacity: 0;
6852 visibility: hidden;
6853 margin-left: -50px;
6854 margin-top: -50px;
6855 }
6856 #create-funnel-loader.show {
6857 opacity: 1;
6858 visibility: visible;
6859 }
6860
6861 .create-funnel-loader-overlay#create-funnel-loader {
6862 background: #ffffff;
6863 position: fixed;
6864 left: 160px;
6865 top: 0;
6866 width: calc(100% - 160px);
6867 height: 100%;
6868 z-index: 100;
6869 display: none;
6870 margin: 0;
6871 }
6872 .create-funnel-loader-overlay#create-funnel-loader.show {
6873 display: block;
6874 }
6875 .create-funnel-loader-overlay#create-funnel-loader.create-funnel-shimmer-overlay {
6876 display: flex;
6877 }
6878 .create-funnel-loader-overlay#create-funnel-loader .wpfnl-loader {
6879 display: block;
6880 position: absolute;
6881 top: 50%;
6882 left: 50%;
6883 transform: translate(-50%, -50%);
6884 width: 40px;
6885 height: 40px;
6886 margin: 0;
6887 }
6888
6889 body.folded .create-funnel-loader-overlay#create-funnel-loader {
6890 left: 36px;
6891 width: calc(100% - 36px);
6892 }
6893
6894 .wpfnl-missing-plugin-notice {
6895 width: 60% !important;
6896 background: #fff;
6897 border-color: transparent !important;
6898 padding: 30px;
6899 border-radius: 10px;
6900 }
6901 .wpfnl-missing-plugin-notice .wpfnl-notice-title {
6902 font-size: 20px;
6903 font-weight: 500;
6904 color: #0e2244;
6905 margin-bottom: 10px;
6906 }
6907 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body span, .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p {
6908 color: #0e2244;
6909 font-size: 16px;
6910 line-height: 1.6;
6911 }
6912 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p {
6913 margin-bottom: 10px;
6914 }
6915 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p.note {
6916 margin-bottom: 0;
6917 }
6918 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p b {
6919 font-weight: 500;
6920 }
6921 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body a {
6922 font-size: 16px;
6923 font-weight: 500;
6924 color: #6E42D3;
6925 }
6926 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body a:hover {
6927 text-decoration: none;
6928 }
6929 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .dot-wrapper span {
6930 margin-left: 0px;
6931 font-weight: 700;
6932 }
6933 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .wpfnl-plugin-installation-error {
6934 color: #d24d4d;
6935 display: block;
6936 margin-top: 10px;
6937 font-style: italic;
6938 font-size: 14px;
6939 }
6940 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .wpfnl-plugin-installation-error a {
6941 font-size: 14px;
6942 }
6943 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .wpfnl-plugin-installation-error a:hover {
6944 text-decoration: underline;
6945 }
6946
6947 .importar-loader {
6948 position: absolute;
6949 top: 0;
6950 left: 0;
6951 width: 100%;
6952 height: 100%;
6953 background: rgba(51, 51, 51, 0.7);
6954 transition: all 0.3s ease;
6955 cursor: default;
6956 z-index: 2;
6957 border-radius: 10px 10px 0 0;
6958 }
6959 .importar-loader .title-wrapper {
6960 width: 100%;
6961 height: 100%;
6962 display: flex;
6963 align-items: center;
6964 justify-content: center;
6965 }
6966 .importar-loader .title {
6967 text-transform: capitalize;
6968 font-size: 16px;
6969 color: #fff;
6970 }
6971
6972 .folded .template-library-modal {
6973 left: 36px;
6974 width: calc(100% - 36px);
6975 }
6976
6977 @media only screen and (max-width: 1699px) {
6978 .template-library-modal .wpfnl-create-funnel__templates {
6979 gap: 30px;
6980 }
6981 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
6982 width: calc(25% - 23px);
6983 }
6984 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template .template-action .btn-default,
6985 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-action .btn-default {
6986 padding: 9px 12px 7px;
6987 font-size: 14px;
6988 }
6989 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default {
6990 max-width: 174px;
6991 }
6992 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper {
6993 gap: 30px;
6994 }
6995 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
6996 width: calc(20% - 24px);
6997 }
6998 }
6999 @media only screen and (max-width: 1399px) {
7000 .template-library-modal .funnel-templates-content {
7001 padding: 30px;
7002 }
7003 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
7004 width: calc(33.3333333333% - 20px);
7005 }
7006 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
7007 width: calc(25% - 23px);
7008 }
7009 .template-library-modal .wpfnl-create-funnel-layout {
7010 max-width: 913px;
7011 }
7012 .template-library-modal .wpfnl-create-funnel-layout .inner-box {
7013 height: 175px;
7014 }
7015 }
7016 @media only screen and (max-width: 1199px) {
7017 .template-library-modal .funnel-templates-content {
7018 padding: 20px;
7019 }
7020 .template-library-modal .funnel-templates-sidebar {
7021 padding: 19px 15px;
7022 }
7023 .template-library-modal .wpfnl-create-funnel__templates {
7024 gap: 20px;
7025 }
7026 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
7027 width: calc(50% - 10px);
7028 }
7029 .funnel-templates-content .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7030 width: calc(50% - 10px);
7031 }
7032 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper {
7033 gap: 20px;
7034 }
7035 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
7036 width: calc(33.3333333333% - 14px);
7037 }
7038 .wpfnl-missing-plugin-notice {
7039 width: calc(50% - 30px) !important;
7040 padding: 20px;
7041 }
7042 .template-library-modal .wpfnl-create-funnel-layout {
7043 max-width: 780px;
7044 max-height: 585px;
7045 }
7046 .template-library-modal .wpfnl-create-funnel-layout .single-layout {
7047 width: calc(33.3333333333% - 8px);
7048 }
7049 .template-library-modal .wpfnl-create-funnel-layout .funnels-layout-wrapper {
7050 gap: 12px;
7051 max-height: calc(100% - 180px);
7052 }
7053 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner {
7054 border-radius: 10px;
7055 padding: 5px;
7056 }
7057 .template-library-modal .wpfnl-create-funnel-layout .inner-box {
7058 height: 145px;
7059 border-radius: 8px;
7060 }
7061 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.desktop {
7062 width: 992px;
7063 transform: scale(0.7);
7064 transform-origin: left top;
7065 margin-left: 10%;
7066 }
7067 }
7068 @media only screen and (max-width: 960px) {
7069 .template-library-modal {
7070 left: 36px;
7071 width: calc(100% - 36px);
7072 }
7073 .template-library-modal .wpfnl-create-funnel-layout {
7074 left: calc(50% + 20px);
7075 }
7076 }
7077 .step-template-showcase-modal .wpfnl-step__single-template, .template-library-modal .wpfnl-step__single-template {
7078 position: relative;
7079 background: #ffffff;
7080 width: calc(25% - 30px);
7081 border-radius: 10px;
7082 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
7083 transition: all 0.3s ease;
7084 }
7085 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template, .template-library-modal .create__from-scratch.wpfnl-step__single-template {
7086 border: 2px dashed #A1A1B6;
7087 box-shadow: none !important;
7088 background: transparent;
7089 }
7090 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template:hover, .template-library-modal .create__from-scratch.wpfnl-step__single-template:hover {
7091 box-shadow: none !important;
7092 }
7093 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template .btn-default, .template-library-modal .create__from-scratch.wpfnl-step__single-template .btn-default {
7094 height: 48px;
7095 line-height: 49px;
7096 width: 100%;
7097 max-width: 194px;
7098 position: absolute;
7099 top: 50%;
7100 left: 50%;
7101 transform: translate(-50%, -50%);
7102 border-radius: 12px;
7103 padding: 0 15px;
7104 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
7105 }
7106 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template .btn-default svg, .template-library-modal .create__from-scratch.wpfnl-step__single-template .btn-default svg {
7107 margin-right: 3px;
7108 }
7109 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template .btn-default svg path, .template-library-modal .create__from-scratch.wpfnl-step__single-template .btn-default svg path {
7110 stroke: #fff;
7111 }
7112 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template .step-template-info, .template-library-modal .create__from-scratch.wpfnl-step__single-template .step-template-info,
7113 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template .template-preview-image,
7114 .template-library-modal .create__from-scratch.wpfnl-step__single-template .template-preview-image {
7115 opacity: 0;
7116 visibility: hidden;
7117 }
7118 .step-template-showcase-modal .wpfnl-step__single-template .importar-loader, .template-library-modal .wpfnl-step__single-template .importar-loader {
7119 background: rgba(38, 33, 51, 0.6);
7120 -webkit-backdrop-filter: blur(7px);
7121 backdrop-filter: blur(7px);
7122 }
7123 .step-template-showcase-modal .wpfnl-step__single-template .template-preview-image, .template-library-modal .wpfnl-step__single-template .template-preview-image {
7124 position: relative;
7125 }
7126 .step-template-showcase-modal .wpfnl-step__single-template .step-image-wrapper, .template-library-modal .wpfnl-step__single-template .step-image-wrapper {
7127 border-radius: 10px 10px 0 0;
7128 background-repeat: no-repeat;
7129 background-size: 100% auto;
7130 background-position: center 0;
7131 position: relative;
7132 overflow: hidden;
7133 }
7134 .step-template-showcase-modal .wpfnl-step__single-template .step-image-wrapper:before, .template-library-modal .wpfnl-step__single-template .step-image-wrapper:before {
7135 content: "";
7136 display: block;
7137 padding-top: 100%;
7138 }
7139 .step-template-showcase-modal .wpfnl-step__single-template .template-img, .template-library-modal .wpfnl-step__single-template .template-img {
7140 width: 100%;
7141 height: 350px;
7142 object-fit: contain;
7143 border-radius: 10px 10px 0px 0px;
7144 transition: all 0.3s ease;
7145 }
7146 .step-template-showcase-modal .wpfnl-step__single-template .step-template-info, .template-library-modal .wpfnl-step__single-template .step-template-info {
7147 border-radius: 0 0 10px 10px;
7148 position: relative;
7149 border-top: 1px solid #E5E8F3;
7150 }
7151 .step-template-showcase-modal .wpfnl-step__single-template .step-template-info .title, .template-library-modal .wpfnl-step__single-template .step-template-info .title {
7152 margin-bottom: 0;
7153 font-size: 14px;
7154 line-height: 1.2;
7155 color: #363B4E;
7156 font-weight: 500;
7157 padding: 19px 15px 17px;
7158 text-align: center;
7159 text-transform: capitalize;
7160 display: flex;
7161 flex-flow: row wrap;
7162 align-items: center;
7163 justify-content: center;
7164 transition: all 0.3s ease;
7165 }
7166 .step-template-showcase-modal .wpfnl-step__single-template:hover, .template-library-modal .wpfnl-step__single-template:hover {
7167 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.2);
7168 }
7169 .step-template-showcase-modal .wpfnl-step__single-template:hover .template-action, .template-library-modal .wpfnl-step__single-template:hover .template-action {
7170 opacity: 1;
7171 visibility: visible;
7172 }
7173
7174 .step-template-showcase-modal .wpfnl-create-step_inner-content {
7175 width: 100%;
7176 height: 100%;
7177 }
7178 .step-template-showcase-modal .wpfnl-create-step__template-wrapper {
7179 position: relative;
7180 min-height: 400px;
7181 max-height: 100%;
7182 overflow: auto;
7183 display: flex;
7184 flex-flow: row wrap;
7185 align-items: flex-start;
7186 }
7187 .step-template-showcase-modal .wpfnl-create-step__template-wrapper::-webkit-scrollbar {
7188 width: 5px;
7189 }
7190 .step-template-showcase-modal .wpfnl-create-step__template-wrapper::-webkit-scrollbar-track {
7191 background: #f2f5f8;
7192 }
7193 .step-template-showcase-modal .wpfnl-create-step__template-wrapper::-webkit-scrollbar-thumb {
7194 background-color: #d9dce0;
7195 border-radius: 20px;
7196 }
7197 .step-template-showcase-modal .steps-template__filter-wrapper {
7198 display: flex;
7199 flex-flow: row wrap;
7200 align-items: center;
7201 justify-content: flex-start;
7202 width: 100%;
7203 background: #FFFFFF;
7204 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.31);
7205 padding: 15px 24px;
7206 position: relative;
7207 }
7208 .step-template-showcase-modal .steps-template__filter-wrapper .wpfnl-modal-close {
7209 background: #FFFFFF;
7210 border-radius: 10px;
7211 height: 38px;
7212 width: 38px;
7213 margin-right: 15px;
7214 display: flex;
7215 flex-flow: column;
7216 align-items: center;
7217 justify-content: center;
7218 cursor: pointer;
7219 border: 1px solid #EEF0F3;
7220 }
7221 .step-template-showcase-modal .steps-template__filter-wrapper .step-showcase-title {
7222 font-weight: 500;
7223 font-size: 16px;
7224 line-height: 1.5;
7225 color: #363B4E;
7226 text-transform: capitalize;
7227 }
7228 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter {
7229 margin-left: auto !important;
7230 }
7231 .step-template-showcase-modal .wpfnl-create-step__filter-nav {
7232 width: 228px;
7233 min-height: 835px;
7234 background: #FFFFFF;
7235 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
7236 padding: 24px;
7237 align-self: stretch;
7238 }
7239 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item {
7240 height: 44px;
7241 line-height: 44px;
7242 font-weight: 500;
7243 color: #363B4E;
7244 padding: 0 16px;
7245 margin: 0 0 15px 0;
7246 text-align: left;
7247 box-shadow: none;
7248 border: 1px solid #EEF0F3;
7249 border-radius: 8px;
7250 text-transform: capitalize;
7251 cursor: pointer;
7252 position: relative;
7253 transition: all 0.3s ease;
7254 background: #fff;
7255 display: flex;
7256 align-items: center;
7257 gap: 8px;
7258 }
7259 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item .pro-tag-icon {
7260 position: static;
7261 margin-top: 6px;
7262 margin-left: -4px;
7263 }
7264 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item svg {
7265 position: relative;
7266 top: -1px;
7267 }
7268 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item svg path {
7269 transition: all 0.3s ease;
7270 }
7271 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.disabled {
7272 cursor: not-allowed;
7273 color: #939393;
7274 background: #dcdbe3;
7275 }
7276 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active {
7277 border-color: #6E42D3;
7278 color: #6E42D3;
7279 box-shadow: 0px 20px 16px rgba(189, 193, 200, 0.2);
7280 }
7281 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active.step-checkout path, .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active.step-landing path {
7282 fill: #6E42D3;
7283 stroke: #6E42D3;
7284 }
7285 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active.step-downsell path, .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active.step-upsell path, .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active.step-custom path, .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active.step-thankyou path {
7286 fill: #6E42D3;
7287 }
7288 .step-template-showcase-modal .wpfnl-create-step__filter-nav .pro-tag {
7289 position: absolute;
7290 top: -6px;
7291 right: -2px;
7292 }
7293 .step-template-showcase-modal .create-step-name-modal {
7294 left: 50%;
7295 }
7296 .step-template-showcase-modal .wpfnl-step__templates-wrapper-before {
7297 padding: 30px 35px;
7298 width: calc(100% - 228px);
7299 box-shadow: none;
7300 }
7301 .step-template-showcase-modal .wpfnl-step__templates-wrapper-before .step-counter {
7302 font-size: 20px;
7303 line-height: 1.2;
7304 font-weight: 600;
7305 color: #363B4E;
7306 margin-bottom: 24px;
7307 text-transform: capitalize;
7308 }
7309 .step-template-showcase-modal .wpfnl-step__templates-wrapper {
7310 display: flex;
7311 flex-flow: row wrap;
7312 gap: 40px;
7313 }
7314 .step-template-showcase-modal .wpfnl-step__single-template .template-action {
7315 flex-flow: row;
7316 }
7317
7318 @media only screen and (max-width: 1699px) {
7319 .step-template-showcase-modal .wpfnl-step__templates-wrapper {
7320 gap: 30px;
7321 }
7322 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7323 width: calc(25% - 23px);
7324 }
7325 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template .template-action .step-btn {
7326 padding: 9px 12px 7px;
7327 font-size: 14px;
7328 }
7329 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template.create__from-scratch .btn-default {
7330 max-width: 174px;
7331 }
7332 }
7333 @media only screen and (max-width: 1399px) {
7334 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7335 width: calc(33.3333333333% - 20px);
7336 }
7337 .step-template-showcase-modal.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template,
7338 .step-template-showcase-modal .wpfnl-ab-steps .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7339 width: calc(25% - 23px);
7340 }
7341 }
7342 @media only screen and (max-width: 1199px) {
7343 .step-template-showcase-modal .wpfnl-create-step__filter-nav {
7344 width: 198px;
7345 padding: 20px;
7346 }
7347 .step-template-showcase-modal .wpfnl-step__templates-wrapper-before {
7348 padding: 20px 20px;
7349 width: calc(100% - 198px);
7350 }
7351 .step-template-showcase-modal .wpfnl-step__templates-wrapper {
7352 gap: 20px;
7353 }
7354 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7355 width: calc(33.3333333333% - 14px);
7356 }
7357 .step-template-showcase-modal.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template,
7358 .step-template-showcase-modal .wpfnl-ab-steps .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7359 width: calc(33.3333333333% - 14px);
7360 }
7361 }
7362 @media only screen and (max-width: 991px) {
7363 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7364 width: calc(50% - 10px);
7365 }
7366 .step-template-showcase-modal.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template,
7367 .step-template-showcase-modal .wpfnl-ab-steps .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
7368 width: calc(50% - 10px);
7369 }
7370 }
7371 .funnel-list__wrapper {
7372 height: 100%;
7373 background-color: #ffffff;
7374 border-radius: 10px;
7375 }
7376 .funnel-list__wrapper .funnel__single-list {
7377 display: flex;
7378 flex-flow: row wrap;
7379 align-items: center;
7380 justify-content: space-between;
7381 padding: 14px 24px 14px 60px;
7382 position: relative;
7383 border-bottom: 1px solid #EBEDF0;
7384 gap: 12px;
7385 }
7386 .funnel-list__wrapper .funnel__single-list:last-child {
7387 margin-bottom: 0;
7388 }
7389 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper {
7390 position: absolute;
7391 top: 0;
7392 left: 60px;
7393 width: calc(100% - 60px);
7394 display: none;
7395 align-items: center;
7396 gap: 10px;
7397 z-index: 3;
7398 background: #ffffff;
7399 padding: 8px 0 6px;
7400 height: 100%;
7401 border-radius: 0 10px 0 0;
7402 }
7403 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler {
7404 font-weight: 400;
7405 font-size: 12px;
7406 line-height: 1.2;
7407 letter-spacing: -0.01em;
7408 padding: 7px 11px;
7409 min-width: auto;
7410 height: auto;
7411 border-radius: 50px;
7412 position: relative;
7413 background-color: #6E42D3;
7414 }
7415 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler:before {
7416 content: "";
7417 position: absolute;
7418 right: 27px;
7419 top: 0;
7420 height: 100%;
7421 width: 1px;
7422 background: #9373EA;
7423 }
7424 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler > svg {
7425 margin-left: 16px;
7426 }
7427 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler.show-dropdown .wpfnl-dropdown {
7428 opacity: 1;
7429 visibility: visible;
7430 }
7431 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li a:hover {
7432 background: #F6F8FA;
7433 color: #7A8B9A;
7434 }
7435 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li rect,
7436 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li path {
7437 stroke: #7A8B9A;
7438 }
7439 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li .wpfnl-bulk-export path {
7440 stroke: transparent;
7441 }
7442 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .selected-funnel-count, .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper > p {
7443 color: #363B4E;
7444 font-weight: 500;
7445 }
7446 .funnel-list__wrapper .funnel__single-list .wpfnl-checkbox label:before {
7447 border-color: #E4E6EB;
7448 background-color: #fff;
7449 border-radius: 5px;
7450 }
7451 .funnel-list__wrapper .funnel__single-list.list-header {
7452 padding: 15px 24px 15px 60px;
7453 }
7454 .funnel-list__wrapper .funnel__single-list.list-header .list-cell {
7455 line-height: 1;
7456 transform: translateY(1px);
7457 }
7458 .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
7459 position: absolute;
7460 left: 24px;
7461 top: 50%;
7462 transform: translateY(-50%);
7463 z-index: 2;
7464 }
7465 .funnel-list__wrapper .funnel__single-list .wpfnl-name {
7466 padding-right: 15px;
7467 padding-left: 45px;
7468 position: relative;
7469 width: 240px;
7470 }
7471 .funnel-list__wrapper .funnel__single-list .wpfnl-name .builder-logo {
7472 position: absolute;
7473 left: 0;
7474 top: 50%;
7475 width: 30px;
7476 word-break: break-all;
7477 display: block;
7478 transform: translateY(-50%);
7479 }
7480 .funnel-list__wrapper .funnel__single-list .wpfnl-name .builder-logo svg {
7481 display: block;
7482 }
7483 .funnel-list__wrapper .funnel__single-list .wpfnl-name .name {
7484 font-weight: 500;
7485 font-size: 14px;
7486 line-height: 16px;
7487 color: #363B4E;
7488 }
7489 .funnel-list__wrapper .funnel__single-list .wpfnl-name .name:hover {
7490 color: #6E42D3;
7491 }
7492 .funnel-list__wrapper .funnel__single-list .wpfnl-name .steps {
7493 font-size: 12px;
7494 line-height: 16px;
7495 color: #7A8B9A;
7496 display: block;
7497 text-transform: capitalize;
7498 }
7499 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations {
7500 display: flex;
7501 flex-flow: row wrap;
7502 align-items: center;
7503 gap: 8px;
7504 width: 375px;
7505 }
7506 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag {
7507 border: 1px solid #E5E8F3;
7508 border-radius: 6px;
7509 font-size: 12px;
7510 line-height: 1.5;
7511 color: #7A8B9A;
7512 padding: 2px 8px;
7513 display: flex;
7514 flex-flow: row;
7515 align-items: center;
7516 justify-content: center;
7517 position: relative;
7518 }
7519 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag svg {
7520 margin-right: 6px;
7521 display: block;
7522 }
7523 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag .tooltip {
7524 background: #0C1015;
7525 border-radius: 6px;
7526 position: absolute;
7527 bottom: calc(100% + 10px);
7528 left: 0;
7529 padding: 7px 10px;
7530 color: #fff;
7531 width: 144px;
7532 z-index: 4;
7533 font-size: 13px;
7534 opacity: 0;
7535 visibility: hidden;
7536 transition: all 0.3s ease;
7537 }
7538 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag .tooltip:before {
7539 content: "";
7540 position: absolute;
7541 left: 13px;
7542 bottom: -4px;
7543 width: 10px;
7544 height: 10px;
7545 background: #0C1015;
7546 transform: rotate(45deg);
7547 border-radius: 2px;
7548 }
7549 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag:hover .tooltip {
7550 opacity: 1;
7551 visibility: visible;
7552 }
7553 .funnel-list__wrapper .funnel__single-list .wpfnl-creation-date {
7554 width: 135px;
7555 }
7556 .funnel-list__wrapper .funnel__single-list .wpfnl-creation-date .post-date {
7557 line-height: 1.14;
7558 display: block;
7559 }
7560 .funnel-list__wrapper .funnel__single-list .wpfnl-status {
7561 width: 75px;
7562 }
7563 .funnel-list__wrapper .funnel__single-list .wpfnl-status .post-status {
7564 font-size: 12px;
7565 line-height: 1.25;
7566 color: #2D3149;
7567 font-weight: 500;
7568 text-transform: capitalize;
7569 background: rgba(122, 139, 154, 0.15);
7570 border-radius: 100px;
7571 display: inline-block;
7572 padding: 5px 10px 4px;
7573 }
7574 .funnel-list__wrapper .funnel__single-list .wpfnl-status.published .post-status {
7575 background: rgba(35, 150, 84, 0.1);
7576 color: #239654;
7577 }
7578 .funnel-list__wrapper .funnel__single-list .list-action {
7579 display: flex;
7580 flex-flow: row;
7581 align-items: center;
7582 width: 80px;
7583 gap: 9px;
7584 }
7585 .funnel-list__wrapper .funnel__single-list .list-action > a {
7586 display: flex;
7587 flex-flow: row;
7588 align-items: center;
7589 font-weight: 500;
7590 font-size: 14px;
7591 line-height: 1.2;
7592 text-transform: capitalize;
7593 padding: 3px 4px;
7594 }
7595 .funnel-list__wrapper .funnel__single-list .list-action > a svg {
7596 display: block;
7597 }
7598 .funnel-list__wrapper .funnel__single-list .list-action > a svg path {
7599 transition: all 0.3s ease;
7600 }
7601 .funnel-list__wrapper .funnel__single-list .list-action > a.disabled {
7602 opacity: 0.5;
7603 cursor: not-allowed;
7604 text-decoration: none;
7605 }
7606 .funnel-list__wrapper .funnel__single-list .list-action > a.edit:hover path {
7607 fill: #6E42D3;
7608 }
7609 .funnel-list__wrapper .funnel__single-list .list-action > a.view:hover path {
7610 fill: #6E42D3;
7611 stroke: #6E42D3;
7612 }
7613 .funnel-list__wrapper .funnel__single-list .list-action .more-action {
7614 position: relative;
7615 padding: 3px 4px;
7616 cursor: pointer;
7617 }
7618 .funnel-list__wrapper .funnel__single-list .list-action .more-action svg {
7619 display: block;
7620 }
7621 .funnel-list__wrapper .funnel__single-list .list-action .more-action .duplicate svg {
7622 width: 18px;
7623 }
7624 .funnel-list__wrapper .funnel__single-list .list-action .more-action .duplicate .pro-tag-icon {
7625 margin-left: 7px;
7626 }
7627 .funnel-list__wrapper .funnel__single-list .list-action .more-action .duplicate .pro-tag-icon path {
7628 stroke: initial;
7629 }
7630 .funnel-list__wrapper .funnel__single-list .list-action ul.more-actions {
7631 right: -22px;
7632 }
7633 .funnel-list__wrapper .funnel__single-list .list-action ul.more-actions .wpfnl-loader {
7634 border-width: 1px;
7635 border-top-color: transparent;
7636 width: 10px;
7637 height: 10px;
7638 margin-left: 6px;
7639 }
7640 .funnel-list__wrapper .funnel__single-list .list-action .more-action.show-actions ul.more-actions {
7641 top: 27px;
7642 opacity: 1;
7643 visibility: visible;
7644 }
7645 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li a:hover {
7646 background: #F6F8FA;
7647 color: #7A8B9A;
7648 }
7649 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li rect,
7650 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li path {
7651 stroke: #7A8B9A;
7652 }
7653 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li .wpfnl-export-funnel path {
7654 stroke: transparent;
7655 }
7656 .funnel-list__wrapper .funnel__single-list.funnel-disabled {
7657 border-bottom-color: #e3e3e3;
7658 }
7659 .funnel-list__wrapper .funnel__single-list.funnel-disabled::before {
7660 content: "";
7661 position: absolute;
7662 left: 0;
7663 top: 0;
7664 width: 100%;
7665 height: 100%;
7666 cursor: not-allowed;
7667 z-index: 2;
7668 background: rgba(32, 32, 32, 0.0784313725);
7669 }
7670 .funnel-list__wrapper .funnel__single-list.funnel-disabled .list-cell {
7671 opacity: 0.5;
7672 }
7673 .funnel-list__wrapper .funnel__single-list.funnel-disabled .list-action > a.disabled {
7674 opacity: 1;
7675 }
7676 .funnel-list__wrapper .funnel__single-list .funnel-alert {
7677 border: 1px solid #e3d7ff;
7678 background: linear-gradient(to right, #eff6ff, #eef2ff);
7679 border-radius: 8px;
7680 padding: 9px 12px;
7681 width: 100%;
7682 }
7683 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-inner {
7684 display: flex;
7685 align-items: center;
7686 justify-content: space-between;
7687 gap: 16px;
7688 }
7689 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-left {
7690 display: flex;
7691 align-items: center;
7692 gap: 12px;
7693 }
7694 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-icon {
7695 background: #dbeafe;
7696 padding: 8px;
7697 border-radius: 6px;
7698 display: flex;
7699 align-items: center;
7700 justify-content: center;
7701 }
7702 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-icon svg {
7703 width: 20px;
7704 height: 20px;
7705 color: #2563eb;
7706 }
7707 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-content {
7708 display: flex;
7709 flex-direction: column;
7710 }
7711 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-title {
7712 font-size: 14px;
7713 font-weight: 600;
7714 color: #111827;
7715 margin: 0;
7716 }
7717 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-description {
7718 font-size: 12px;
7719 color: #4b5563;
7720 margin: 0;
7721 }
7722 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-activate-btn {
7723 background: #6E42D3;
7724 color: #ffffff;
7725 border: none;
7726 border-radius: 6px;
7727 padding: 7px 13px;
7728 font-size: 13px;
7729 font-weight: 500;
7730 cursor: pointer;
7731 transition: all 0.3s ease;
7732 white-space: nowrap;
7733 }
7734 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-activate-btn:hover {
7735 background: #5b36b0;
7736 }
7737 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-activate-btn:disabled {
7738 opacity: 0.5;
7739 pointer-events: none;
7740 }
7741 .funnel-list__wrapper .list-footer {
7742 display: flex;
7743 flex-flow: row wrap;
7744 align-items: center;
7745 justify-content: space-between;
7746 padding: 17px 24px;
7747 }
7748 .funnel-list__wrapper .list-footer .pagination-number p {
7749 display: flex;
7750 align-items: center;
7751 gap: 10px;
7752 white-space: nowrap;
7753 }
7754 .funnel-list__wrapper .list-footer .pagination-number p strong {
7755 color: #363B4E;
7756 }
7757 .funnel-list__wrapper .list-footer .pagination-number p select {
7758 width: 56px;
7759 min-width: auto;
7760 padding: 2px 8px;
7761 height: 32px;
7762 }
7763
7764 @media only screen and (max-width: 1399px) {
7765 .funnel-list__wrapper .funnel__single-list .wpfnl-name {
7766 width: 200px;
7767 }
7768 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations {
7769 width: 220px;
7770 }
7771 }
7772 @media only screen and (max-width: 1199px) {
7773 .wpfnl-dashboard__header a.import-export {
7774 background: transparent;
7775 box-shadow: none;
7776 padding: 0;
7777 }
7778 .wpfnl-dashboard__header .btn-default.disabled,
7779 .wpfnl-dashboard__header .add-new-funnel-btn {
7780 padding: 0 18px;
7781 }
7782 .funnel-list__wrapper .funnel__single-list {
7783 padding: 10px 15px 10px 45px;
7784 gap: 8px;
7785 }
7786 .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
7787 left: 15px;
7788 }
7789 .funnel-list__wrapper .funnel__single-list .wpfnl-name {
7790 padding-right: 10px;
7791 }
7792 .funnel-list__wrapper .funnel__single-list .wpfnl-creation-date {
7793 width: 74px;
7794 }
7795 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations {
7796 width: 136px;
7797 }
7798 .funnel-list__wrapper .funnel__single-list .list-action {
7799 width: 73px;
7800 gap: 3px;
7801 }
7802 .funnel-list__wrapper .funnel__single-list .list-action > a {
7803 margin-right: 0;
7804 width: 28px;
7805 text-indent: -999px;
7806 overflow: hidden;
7807 }
7808 .funnel-list__wrapper .funnel__single-list .list-action > a.edit {
7809 margin-right: 0;
7810 }
7811 }
7812 @media only screen and (max-width: 782px) {
7813 .wpfnl-dashboard__header {
7814 padding: 18px 20px 19px 30px;
7815 }
7816 }
7817 .remote-funnel-header {
7818 display: flex;
7819 flex-flow: row wrap;
7820 align-items: center;
7821 background: #FFFFFF;
7822 border-bottom: 1px solid #E5E8F3;
7823 position: relative;
7824 padding: 15px 15px 5px;
7825 }
7826 .remote-funnel-header .single-item {
7827 margin: 0 10px 10px 0;
7828 }
7829 .remote-funnel-header .single-item select {
7830 padding-right: 30px;
7831 }
7832 .remote-funnel-header .single-item .template-image-remove,
7833 .remote-funnel-header .single-item .template-image-upload {
7834 background: #F7F7FA;
7835 color: #363B4E;
7836 border: 1px solid #E5E8F3;
7837 }
7838 .remote-funnel-header .single-item.template-preview-image {
7839 display: flex;
7840 align-items: center;
7841 flex-flow: row wrap;
7842 max-width: 510px;
7843 }
7844 .remote-funnel-header .single-item.template-preview-image input[type=text] {
7845 width: 200px;
7846 margin-right: 10px;
7847 }
7848 .remote-funnel-header .single-item.template-preview-image .btn-default {
7849 margin-right: 10px;
7850 white-space: pre;
7851 }
7852 .remote-funnel-header .single-item.template-preview-image .btn-default:last-child {
7853 margin-right: 0;
7854 }
7855 .remote-funnel-header .btn-default {
7856 border-radius: 6px;
7857 padding: 0 20px;
7858 min-width: auto;
7859 }
7860
7861 .steps-page__header {
7862 display: flex;
7863 flex-flow: row wrap;
7864 align-items: center;
7865 background: #FFFFFF;
7866 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
7867 position: relative;
7868 justify-content: flex-start;
7869 padding: 15px 13px 15px 24px;
7870 }
7871
7872 .steps-page__header-left {
7873 display: flex;
7874 flex-flow: row wrap;
7875 align-items: center;
7876 }
7877 .steps-page__header-left .wpfnl-logo a {
7878 display: block;
7879 padding: 16px 25px;
7880 border-right: 1px solid #E5E8F3;
7881 }
7882 .steps-page__header-left .wpfnl-logo a svg {
7883 width: 26px;
7884 display: block;
7885 }
7886 .steps-page__header-left .back-link {
7887 font-weight: 400;
7888 font-size: 14px;
7889 color: #7A8B9A;
7890 text-transform: capitalize;
7891 padding: 0;
7892 text-align: center;
7893 display: flex;
7894 flex-flow: column;
7895 align-items: center;
7896 justify-content: center;
7897 box-shadow: none;
7898 height: 38px;
7899 width: 38px;
7900 border: 1px solid #EEF0F3;
7901 margin-right: 15px;
7902 border-radius: 10px;
7903 }
7904 .steps-page__header-left .back-link svg {
7905 display: block;
7906 margin: 0 auto;
7907 }
7908 .steps-page__header-left .back-link:hover {
7909 color: #6E42D3;
7910 }
7911 .steps-page__header-left .add-step-condtion-area {
7912 display: flex;
7913 flex-flow: row wrap;
7914 align-items: center;
7915 border-right: 1px solid #E5E8F3;
7916 }
7917 .steps-page__header-left .add-step-condtion-area li {
7918 position: relative;
7919 }
7920 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2 {
7921 position: absolute;
7922 left: 0;
7923 top: calc(100% + 35px);
7924 width: 305px;
7925 padding: 10px 32px 10px 15px;
7926 margin: 0;
7927 background: #6e42d3;
7928 color: #fff;
7929 border-radius: 10px;
7930 text-align: left;
7931 z-index: 1;
7932 opacity: 0;
7933 visibility: hidden;
7934 transition: all 0.5s ease 1.5s;
7935 }
7936 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2:before {
7937 content: "";
7938 position: absolute;
7939 left: 20px;
7940 top: -6px;
7941 width: 13px;
7942 height: 13px;
7943 background: #6e42d3;
7944 transform: rotate(45deg);
7945 }
7946 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2.show-tooltip {
7947 top: calc(100% + 15px);
7948 opacity: 1;
7949 visibility: visible;
7950 }
7951 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2 .close-tooltip {
7952 position: absolute;
7953 right: 13px;
7954 top: 11px;
7955 cursor: pointer;
7956 }
7957 .steps-page__header-left .add-step-condtion-area li > button {
7958 display: block;
7959 border: none;
7960 height: 60px;
7961 padding: 0 20px;
7962 background: transparent;
7963 font-size: 14px;
7964 font-weight: 500;
7965 color: #363B4E;
7966 cursor: pointer;
7967 position: relative;
7968 }
7969 .steps-page__header-left .add-step-condtion-area li > button svg {
7970 margin-right: 5px;
7971 }
7972 .steps-page__header-left .add-step-condtion-area li > button.add-new-step {
7973 background-color: #F6F5FA;
7974 color: #6E42D3;
7975 }
7976 .steps-page__header-left .add-step-condtion-area li > button.add-new-step:after {
7977 content: "";
7978 position: absolute;
7979 bottom: 0;
7980 left: 0;
7981 width: 100%;
7982 height: 3px;
7983 background: #6E42D3;
7984 border-radius: 60px 60px 0 0;
7985 }
7986 .steps-page__header-left .add-step-condtion-area li > button.add-new-step svg {
7987 margin-right: 5px;
7988 }
7989 .steps-page__header-left .add-step-condtion-area li > button.create-condition:hover {
7990 color: #6E42D3;
7991 }
7992 .steps-page__header-left .add-step-condtion-area li > button.create-condition:hover path {
7993 stroke: #6E42D3;
7994 }
7995 .steps-page__header-left .add-step-condtion-area li .steps-dropdown {
7996 position: absolute;
7997 box-shadow: 0px 10px 30px rgba(21, 21, 69, 0.0784313725);
7998 border-radius: 0px 0px 10px 10px;
7999 top: 100%;
8000 left: 0;
8001 width: 100%;
8002 z-index: 9;
8003 background: #F6F5FA;
8004 border: 1px solid #fff;
8005 padding: 10px 13px 12px;
8006 transition: all 0.3s ease;
8007 opacity: 0;
8008 visibility: hidden;
8009 }
8010 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li {
8011 background: #FFFFFF;
8012 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
8013 border-radius: 5px;
8014 font-weight: 500;
8015 font-size: 14px;
8016 line-height: 1.4;
8017 color: #8594A2;
8018 margin-bottom: 10px;
8019 text-transform: capitalize;
8020 padding: 7px 13px 6px;
8021 text-align: center;
8022 cursor: pointer;
8023 width: 100%;
8024 transition: all 0.3s ease;
8025 }
8026 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li:last-child {
8027 margin-bottom: 0;
8028 }
8029 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li:hover {
8030 background: #6E42D3;
8031 color: #fff;
8032 }
8033 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li.disabled {
8034 cursor: not-allowed;
8035 color: white;
8036 background: #B6B2CA;
8037 }
8038 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li .pro-tag {
8039 position: absolute;
8040 top: -6px;
8041 right: -2px;
8042 }
8043 .steps-page__header-left .add-step-condtion-area li.show-steps-dropdown > button.add-new-step svg {
8044 transform: rotate(180deg);
8045 }
8046 .steps-page__header-left .add-step-condtion-area li.show-steps-dropdown .steps-dropdown {
8047 opacity: 1;
8048 visibility: visible;
8049 }
8050 .steps-page__header-left .add-step-condtion-area li > .mrm-trigger-action-btn, .steps-page__header-left .add-step-condtion-area li > .global-funnel-btn {
8051 border-left: 1px solid #E5E8F3;
8052 }
8053 .steps-page__header-left .steps-page__fnl-name {
8054 display: flex;
8055 flex-flow: row wrap;
8056 align-items: center;
8057 }
8058 .steps-page__header-left .steps-page__fnl-name label {
8059 padding-right: 7px;
8060 font-size: 14px;
8061 }
8062 .steps-page__header-left .steps-page__fnl-name input {
8063 height: 28px;
8064 font-size: 12px;
8065 padding: 3px 10px;
8066 width: 230px;
8067 min-height: auto;
8068 min-width: auto;
8069 }
8070 .steps-page__header-left .steps-page__fnl-name .funnel-name {
8071 max-width: 230px;
8072 white-space: nowrap;
8073 overflow: hidden;
8074 text-overflow: ellipsis;
8075 }
8076 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn {
8077 min-width: auto;
8078 padding: 0 7px;
8079 width: 30px;
8080 height: 26px;
8081 display: flex;
8082 flex-flow: column;
8083 align-items: center;
8084 justify-content: center;
8085 background: rgba(0, 0, 0, 0.04) !important;
8086 border: 1px solid #e0e0e0;
8087 border-radius: 3px;
8088 cursor: pointer;
8089 margin-left: 10px;
8090 }
8091 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn svg {
8092 display: block;
8093 }
8094 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn.funnel-name-edit svg {
8095 fill: #6E42D3;
8096 }
8097 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn.funnel-name-submit {
8098 display: none;
8099 }
8100 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn.funnel-name-submit svg {
8101 stroke: #6E42D3;
8102 }
8103 .steps-page__header-left .steps-page__fnl-name .funnel-name-input {
8104 display: none;
8105 }
8106 .steps-page__header-left .steps-page__fnl-name .funnel-name-submit-btn {
8107 display: none;
8108 }
8109 .steps-page__header-left .copy-clipboard {
8110 display: flex;
8111 flex-flow: row wrap;
8112 align-items: center;
8113 margin-left: 20px;
8114 position: relative;
8115 }
8116 .steps-page__header-left .copy-clipboard .link-icon {
8117 width: 28px;
8118 border: 1px solid #E5E8F3;
8119 height: 28px;
8120 display: flex;
8121 flex-flow: column;
8122 align-items: center;
8123 justify-content: center;
8124 border-right: 0;
8125 border-radius: 6px 0 0 6px;
8126 }
8127 .steps-page__header-left .copy-clipboard input[readonly] {
8128 height: 28px;
8129 font-size: 12px;
8130 padding: 2px 10px;
8131 border-radius: 0;
8132 width: 160px;
8133 background: #fff;
8134 min-height: auto;
8135 min-width: auto;
8136 display: block;
8137 white-space: nowrap;
8138 overflow: hidden;
8139 text-overflow: ellipsis;
8140 }
8141 .steps-page__header-left .copy-clipboard button {
8142 border: none;
8143 background: #ececee;
8144 color: #363B4E;
8145 height: 28px;
8146 display: inline-block;
8147 padding: 0 10px;
8148 text-transform: capitalize;
8149 font-size: 12px;
8150 font-weight: 500;
8151 border-radius: 0 6px 6px 0;
8152 cursor: pointer;
8153 }
8154 .steps-page__header-left .copy-clipboard .copied-msg {
8155 color: #6E42D3;
8156 font-weight: 500;
8157 position: absolute;
8158 top: 7px;
8159 right: -46px;
8160 font-size: 13px;
8161 display: none;
8162 }
8163
8164 .steps-page__header-center {
8165 display: flex;
8166 align-items: center;
8167 flex-flow: row wrap;
8168 gap: 40px;
8169 }
8170 .steps-page__header-center .steps-page__fnl-name {
8171 display: flex;
8172 flex-flow: row wrap;
8173 align-items: center;
8174 position: relative;
8175 }
8176 .steps-page__header-center .steps-page__fnl-name label {
8177 padding-right: 7px;
8178 font-size: 14px;
8179 cursor: text;
8180 }
8181 .steps-page__header-center .steps-page__fnl-name input[type=text] {
8182 line-height: 1;
8183 font-size: 16px;
8184 font-weight: 500;
8185 color: #363B4E;
8186 background: #fff;
8187 border-radius: 10px;
8188 border: 1px solid #6E42D3;
8189 }
8190 .steps-page__header-center .steps-page__fnl-name input[type=text]:hover {
8191 color: #363B4E;
8192 }
8193 .steps-page__header-center .steps-page__fnl-name .funnel-name {
8194 max-width: 250px;
8195 white-space: nowrap;
8196 overflow: hidden;
8197 text-overflow: ellipsis;
8198 font-size: 16px;
8199 font-weight: 500;
8200 line-height: 1.1;
8201 color: #363B4E;
8202 position: relative;
8203 padding-right: 25px;
8204 }
8205 .steps-page__header-center .steps-page__fnl-name .funnel-name:after {
8206 content: "";
8207 position: absolute;
8208 right: 0;
8209 top: 0;
8210 width: 17px;
8211 height: 17px;
8212 cursor: pointer;
8213 background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNyAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik00LjE2NjY3IDEuNjY2NjdDMi43ODU5NiAxLjY2NjY3IDEuNjY2NjcgMi43ODU5NiAxLjY2NjY3IDQuMTY2NjdWMTIuNUMxLjY2NjY3IDEzLjg4MDcgMi43ODU5NiAxNSA0LjE2NjY3IDE1SDEyLjVDMTMuODgwNyAxNSAxNSAxMy44ODA3IDE1IDEyLjVWNy41QzE1IDcuMDM5NzUgMTUuMzczMSA2LjY2NjY3IDE1LjgzMzMgNi42NjY2N0MxNi4yOTM2IDYuNjY2NjcgMTYuNjY2NyA3LjAzOTc1IDE2LjY2NjcgNy41VjEyLjVDMTYuNjY2NyAxNC44MDEyIDE0LjgwMTIgMTYuNjY2NyAxMi41IDE2LjY2NjdINC4xNjY2N0MxLjg2NTQ4IDE2LjY2NjcgMCAxNC44MDEyIDAgMTIuNVY0LjE2NjY3QzAgMS44NjU0OCAxLjg2NTQ4IDAgNC4xNjY2NyAwSDkuMTY2NjdDOS42MjY5MiAwIDEwIDAuMzczMSAxMCAwLjgzMzMzM0MxMCAxLjI5MzU3IDkuNjI2OTIgMS42NjY2NyA5LjE2NjY3IDEuNjY2NjdINC4xNjY2N1oiIGZpbGw9IiM3QThCOUEiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMi42Nzk3IDAuNjg0MDY3QzEzLjExNzcgMC4yNDYwNjcgMTMuNzExNyAwIDE0LjMzMTIgMEMxNC45NTA2IDAgMTUuNTQ0NiAwLjI0NjA2NyAxNS45ODI2IDAuNjg0MDY3QzE2LjQyMDYgMS4xMjIwNyAxNi42NjY3IDEuNzE2MTIgMTYuNjY2NyAyLjMzNTU0QzE2LjY2NjcgMi45NTQ5NyAxNi40MjA2IDMuNTQ5MDMgMTUuOTgyNiAzLjk4NzAzTDE1LjMzIDQuNjM5NjRDMTUuMDA0NiA0Ljk2NTA4IDE0LjQ3NjkgNC45NjUwOCAxNC4xNTE1IDQuNjM5NjRMMTIuMDI3IDIuNTE1MkMxMS43MDE2IDIuMTg5NzYgMTEuNzAxNiAxLjY2MjEzIDEyLjAyNyAxLjMzNjY4TDEyLjY3OTcgMC42ODQwNjdaTTEwLjg0ODUgMy42OTM3MUMxMC41MjMxIDMuMzY4MjcgOS45OTU0IDMuMzY4MjcgOS42Njk5OSAzLjY5MzcxTDUuOTUyMjMgNy40MTE1QzUuODQ1NDMgNy41MTgyNSA1Ljc2OTY3IDcuNjUyMDggNS43MzMwNCA3Ljc5ODU4TDUuMDI0ODkgMTAuNjMxM0M0Ljk1Mzg5IDEwLjkxNTIgNS4wMzcwOSAxMS4yMTU2IDUuMjQ0MDggMTEuNDIyNkM1LjQ1MTA2IDExLjYyOTYgNS43NTE0NyAxMS43MTI4IDYuMDM1NDUgMTEuNjQxOEw4Ljg2ODA3IDEwLjkzMzdDOS4wMTQ1NyAxMC44OTcgOS4xNDg0IDEwLjgyMTMgOS4yNTUxNSAxMC43MTQ0TDEyLjk3MyA2Ljk5NjY3QzEzLjI5ODQgNi42NzEyNSAxMy4yOTg0IDYuMTQzNTkgMTIuOTczIDUuODE4MTZMMTAuODQ4NSAzLjY5MzcxWiIgZmlsbD0iIzdBOEI5QSIvPgo8L3N2Zz4K);
8214 }
8215 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn {
8216 min-width: auto;
8217 padding: 1px 7px 0;
8218 width: 30px;
8219 height: 28px;
8220 display: flex;
8221 flex-flow: column;
8222 align-items: center;
8223 justify-content: center;
8224 background: #F6F5FA !important;
8225 border: 1px solid #e0e0e0;
8226 border-radius: 6px;
8227 cursor: pointer;
8228 margin-left: 10px;
8229 }
8230 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn svg {
8231 display: block;
8232 }
8233 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-edit svg {
8234 fill: #6E42D3;
8235 }
8236 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-submit {
8237 display: none;
8238 }
8239 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-submit svg {
8240 stroke: #6E42D3;
8241 }
8242 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-cancel {
8243 display: none;
8244 margin-left: 5px;
8245 }
8246 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-cancel svg {
8247 position: relative;
8248 top: 2px;
8249 }
8250 .steps-page__header-center .steps-page__fnl-name .funnel-name-input {
8251 display: none;
8252 }
8253 .steps-page__header-center .steps-page__fnl-name .funnel-name-submit-btn {
8254 display: none;
8255 }
8256 .steps-page__header-center .steps-page__fnl-name .wpfnl-alert {
8257 display: block;
8258 position: absolute;
8259 font-size: 12px;
8260 white-space: nowrap;
8261 bottom: -16px;
8262 left: 0;
8263 }
8264 .steps-page__header-center #wpfnl-change-funnel-name[data-tour=yes] {
8265 position: relative;
8266 z-index: 4;
8267 }
8268 .steps-page__header-center #wpfnl-change-funnel-name[data-tour=yes] .funnel-name-edit {
8269 color: #FFF;
8270 }
8271 .steps-page__header-center .enable-gbf {
8272 display: flex;
8273 align-items: center;
8274 font-weight: 500;
8275 position: relative;
8276 }
8277 .steps-page__header-center .enable-gbf::before {
8278 content: "";
8279 position: absolute;
8280 left: -20px;
8281 top: 50%;
8282 transform: translateY(-50%);
8283 width: 1px;
8284 height: 20px;
8285 background-color: #E9E6F4;
8286 }
8287 .steps-page__header-center .enable-gbf .pro-tag-icon {
8288 position: static;
8289 margin-top: 3px;
8290 margin-right: 4px;
8291 }
8292 .steps-page__header-center .enable-gbf .title {
8293 margin-right: 10px;
8294 line-height: 1.1;
8295 }
8296
8297 .steps-page__header-right {
8298 display: flex;
8299 flex-flow: row;
8300 align-items: center;
8301 margin-left: auto;
8302 }
8303 .steps-page__header-right .funnel-stats {
8304 display: flex;
8305 border-right: 1px solid #E5E8F3;
8306 padding-right: 20px;
8307 margin-right: 5px;
8308 font-weight: 500;
8309 align-items: center;
8310 }
8311 .steps-page__header-right .funnel-stats .pro-tag-icon {
8312 position: static;
8313 margin-top: 3px;
8314 margin-right: 4px;
8315 }
8316 .steps-page__header-right .funnel-stats .title {
8317 margin-right: 10px;
8318 line-height: 1.1;
8319 }
8320 .steps-page__header-right .saving-text {
8321 color: #848994;
8322 font-size: 14px;
8323 font-weight: 400;
8324 line-height: 1;
8325 margin-right: 20px;
8326 position: relative;
8327 top: 2px;
8328 }
8329 .steps-page__header-right .draft-publish-toggle {
8330 display: flex;
8331 align-items: center;
8332 border-radius: 10px;
8333 border: 1px solid #E5E8F3;
8334 margin-right: 40px;
8335 position: relative;
8336 }
8337 .steps-page__header-right .draft-publish-toggle:after {
8338 content: "";
8339 position: absolute;
8340 right: -20px;
8341 top: 50%;
8342 transform: translateY(-50%);
8343 width: 1px;
8344 height: 24px;
8345 background: #DEE2E6;
8346 }
8347 .steps-page__header-right .draft-publish-toggle > span {
8348 color: #2D3149;
8349 font-size: 14px;
8350 font-weight: 500;
8351 line-height: 1;
8352 display: block;
8353 padding: 10px 17px;
8354 border-radius: 10px;
8355 }
8356 .steps-page__header-right .draft-publish-toggle > span.active {
8357 background-color: #6E42D3;
8358 color: #fff;
8359 }
8360 .steps-page__header-right .wpfnl-header-actions {
8361 display: flex;
8362 align-items: center;
8363 gap: 10px;
8364 }
8365 .steps-page__header-right .wpfnl-header-action {
8366 text-align: center;
8367 display: flex;
8368 flex-flow: column;
8369 align-items: center;
8370 justify-content: center;
8371 box-shadow: none;
8372 height: 38px;
8373 width: 38px;
8374 border: 1px solid #EEF0F3;
8375 border-radius: 8px;
8376 position: relative;
8377 padding: 5px;
8378 }
8379 .steps-page__header-right .wpfnl-header-action svg {
8380 display: block;
8381 }
8382 .steps-page__header-right .wpfnl-header-action .action-tooltip {
8383 position: absolute;
8384 top: calc(100% + 20px);
8385 left: 50%;
8386 transform: translateX(-50%);
8387 border-radius: 8px;
8388 background: #10052E;
8389 box-shadow: 0 2px 15px 0 rgba(22, 28, 32, 0.08);
8390 color: #E8E8E9;
8391 font-size: 13px;
8392 font-weight: 400;
8393 line-height: 1;
8394 display: block;
8395 padding: 10px 14px;
8396 opacity: 0;
8397 visibility: hidden;
8398 transition: all 0.3s ease;
8399 white-space: nowrap;
8400 z-index: 1;
8401 }
8402 .steps-page__header-right .wpfnl-header-action .action-tooltip:before {
8403 content: "";
8404 position: absolute;
8405 top: 0px;
8406 left: 50%;
8407 width: 10px;
8408 height: 10px;
8409 background: #10052E;
8410 transform: rotate(45deg) translateX(-50%);
8411 border-radius: 2px;
8412 }
8413 .steps-page__header-right .wpfnl-header-action:hover .action-tooltip {
8414 opacity: 1;
8415 visibility: visible;
8416 top: calc(100% + 10px);
8417 z-index: 2;
8418 }
8419 .steps-page__header-right .btn-default {
8420 min-width: auto;
8421 position: relative;
8422 padding: 0 21px;
8423 }
8424 .steps-page__header-right .btn-default .wpfnl-loader {
8425 display: inline-block;
8426 position: relative;
8427 top: 2px;
8428 right: 0;
8429 }
8430 .steps-page__header-right .btn-default:disabled,
8431 .steps-page__header-right .btn-default[disabled] {
8432 color: rgba(64, 64, 64, 0.4);
8433 cursor: not-allowed;
8434 background-color: rgba(183, 183, 183, 0.4);
8435 }
8436 .steps-page__header-right .dropdown-option {
8437 position: relative;
8438 text-align: center;
8439 padding: 7px 12px;
8440 display: inline-block;
8441 margin-left: 6px;
8442 cursor: pointer;
8443 }
8444 .steps-page__header-right .dropdown-option svg {
8445 display: block;
8446 }
8447 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown {
8448 right: -14px;
8449 top: 50px;
8450 }
8451 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag {
8452 margin-left: 4px;
8453 }
8454 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown li:first-child {
8455 border-radius: 10px 10px 0 0;
8456 }
8457 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown li:last-child {
8458 border-radius: 0 0 10px 10px;
8459 }
8460 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown a svg {
8461 width: 19px;
8462 height: 19px;
8463 }
8464 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag-icon {
8465 position: static;
8466 margin-left: 6px;
8467 }
8468 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag-icon svg {
8469 width: 18px;
8470 height: 18px;
8471 }
8472 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag-icon svg:hover path {
8473 stroke: inherit;
8474 fill: inherit;
8475 }
8476 .steps-page__header-right .dropdown-option.show ul.wpfnl-dropdown {
8477 top: 38px;
8478 opacity: 1;
8479 visibility: visible;
8480 }
8481 .steps-page__header-right .dropdown-option[data-tour=yes] {
8482 z-index: 4;
8483 background-color: #ffffff;
8484 }
8485 .steps-page__header-right .funnel-stats[data-tour=yes] {
8486 position: relative;
8487 z-index: 4;
8488 }
8489 .steps-page__header-right .funnel-stats[data-tour=yes] .title {
8490 color: #FFF;
8491 }
8492 .steps-page__header-right .preview-funnel[data-tour=yes] {
8493 position: relative;
8494 z-index: 4;
8495 }
8496 .steps-page__header-right .preview-funnel[data-tour=yes] svg circle, .steps-page__header-right .preview-funnel[data-tour=yes] svg path {
8497 stroke: #FFF;
8498 }
8499
8500 @media only screen and (max-width: 1199px) {
8501 .steps-page__header {
8502 padding-right: 10px;
8503 }
8504 .steps-page__header-left .back-link {
8505 width: 44px;
8506 }
8507 .steps-page__header-left .add-step-condtion-area li button {
8508 padding: 0 14px;
8509 }
8510 .steps-page__header-right .funnel-stats {
8511 border-right: none;
8512 padding-right: 0;
8513 }
8514 .steps-page__header-right .btn-default {
8515 padding: 0 20px;
8516 }
8517 .steps-page__header-center .steps-page__fnl-name label {
8518 display: none;
8519 }
8520 .steps-page__header-center .steps-page__fnl-name .wpfnl-alert {
8521 left: 0;
8522 }
8523 }
8524 @media only screen and (max-width: 991px) {
8525 .steps-page__header-center .steps-page__fnl-name input[type=text] {
8526 width: 200px;
8527 }
8528 }
8529 @media only screen and (max-width: 870px) {
8530 .steps-page__header {
8531 padding-right: 15px;
8532 }
8533 .steps-page__header-left .copy-clipboard .link-icon {
8534 display: none;
8535 }
8536 }
8537 .funnel-window .wpfnl-canvas-analytics {
8538 position: relative;
8539 display: flex;
8540 align-items: center;
8541 justify-content: center;
8542 gap: 60px;
8543 background: #FFF;
8544 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.14);
8545 padding: 18px 15px;
8546 border-top: 1px solid rgba(190, 190, 215, 0.14);
8547 transition: padding 0.2s ease;
8548 }
8549 .funnel-window .wpfnl-canvas-analytics.is-collapsed {
8550 padding: 0 5px;
8551 }
8552 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn {
8553 position: absolute;
8554 right: 20px;
8555 top: 100%;
8556 transform: translateY(-1px);
8557 width: 28px;
8558 height: 24px;
8559 display: flex;
8560 align-items: center;
8561 justify-content: center;
8562 cursor: pointer;
8563 border-radius: 0 0 5px 5px;
8564 background: #fff;
8565 box-shadow: 0 2px 5px 0 rgba(190, 190, 215, 0.31);
8566 z-index: 1;
8567 }
8568 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn:hover {
8569 background: #f0eefa;
8570 }
8571 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn__chevron {
8572 transition: transform 0.2s ease;
8573 display: block;
8574 transform-origin: center center;
8575 }
8576 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn__chevron.is-up {
8577 transform: rotate(180deg);
8578 }
8579 .funnel-window .wpfnl-canvas-analytics .analytics-items {
8580 display: flex;
8581 align-items: center;
8582 justify-content: center;
8583 gap: 60px;
8584 }
8585 .funnel-window .wpfnl-canvas-analytics .analytics-item {
8586 text-align: center;
8587 position: relative;
8588 }
8589 .funnel-window .wpfnl-canvas-analytics .analytics-item:before {
8590 content: "";
8591 position: absolute;
8592 right: -30px;
8593 top: 50%;
8594 transform: translateY(-50%);
8595 width: 1px;
8596 height: 20px;
8597 background-color: #D9D6E3;
8598 }
8599 .funnel-window .wpfnl-canvas-analytics .analytics-item:last-child:before {
8600 display: none;
8601 }
8602 .funnel-window .wpfnl-canvas-analytics .analytics-label {
8603 color: #848994;
8604 font-size: 12px;
8605 font-weight: 400;
8606 line-height: 1;
8607 }
8608 .funnel-window .wpfnl-canvas-analytics .analytics-value {
8609 color: #2D3149;
8610 font-size: 14px;
8611 font-weight: 500;
8612 line-height: 1;
8613 margin-top: 8px;
8614 }
8615
8616 .steps-page__header-mode {
8617 position: absolute;
8618 left: 50%;
8619 top: 50%;
8620 transform: translate(-50%, -50%);
8621 display: flex;
8622 align-items: center;
8623 z-index: 1;
8624 }
8625
8626 .vf-mode-switcher {
8627 display: flex;
8628 flex-flow: row nowrap;
8629 align-items: center;
8630 background: #ffffff;
8631 border: 1px solid #e0e3ed;
8632 border-radius: 8px;
8633 flex-shrink: 0;
8634 }
8635
8636 .vf-mode-btn {
8637 display: flex;
8638 align-items: center;
8639 justify-content: center;
8640 height: 30px;
8641 padding: 0 18px;
8642 border: none;
8643 border-radius: 0;
8644 background: transparent;
8645 color: #98a2b3;
8646 font-size: 13px;
8647 font-weight: 500;
8648 line-height: 1;
8649 cursor: pointer;
8650 transition: background 0.15s ease, color 0.15s ease;
8651 white-space: nowrap;
8652 position: relative;
8653 }
8654 .vf-mode-btn:first-child {
8655 border-radius: 7px 0 0 7px;
8656 }
8657 .vf-mode-btn:last-child {
8658 border-radius: 0 7px 7px 0;
8659 }
8660 .vf-mode-btn + .vf-mode-btn {
8661 border-left: 1px solid #e0e3ed;
8662 }
8663 .vf-mode-btn:hover:not(.vf-mode-btn--active) {
8664 background: #f6f5fa;
8665 color: #667085;
8666 }
8667 .vf-mode-btn--active {
8668 background: #f1ecfb;
8669 color: #6e42d3;
8670 font-weight: 600;
8671 }
8672
8673 .vf-mode-switcher--rail {
8674 flex-flow: column nowrap;
8675 border-radius: 6px;
8676 border-color: #eaecf0;
8677 }
8678 .vf-mode-switcher--rail .vf-mode-btn {
8679 width: 100%;
8680 height: 30px;
8681 padding: 0 10px;
8682 font-size: 12px;
8683 }
8684 .vf-mode-switcher--rail .vf-mode-btn:first-child {
8685 border-radius: 5px 5px 0 0;
8686 }
8687 .vf-mode-switcher--rail .vf-mode-btn:last-child {
8688 border-radius: 0 0 5px 5px;
8689 }
8690 .vf-mode-switcher--rail .vf-mode-btn + .vf-mode-btn {
8691 border-left: none;
8692 border-top: 1px solid #eaecf0;
8693 }
8694
8695 @media screen and (max-width: 1280px) {
8696 .steps-page__header-mode {
8697 position: static;
8698 transform: none;
8699 margin-left: auto;
8700 }
8701 }
8702 .funnel-window {
8703 display: flex;
8704 flex-direction: column;
8705 height: calc(100vh - 32px);
8706 overflow: hidden;
8707 }
8708 .funnel-window .wpfnl-canvas-zoom-control {
8709 display: flex;
8710 align-items: center;
8711 row-gap: 6px;
8712 z-index: 2;
8713 padding: 0;
8714 position: absolute;
8715 top: 50px;
8716 right: 16px;
8717 flex-flow: column;
8718 }
8719 .funnel-window .wpfnl-canvas-zoom-control .zoom-controls {
8720 display: flex;
8721 align-items: center;
8722 flex-direction: column;
8723 gap: 0px;
8724 background: #ffffff;
8725 padding: 0;
8726 flex-shrink: 0;
8727 border-radius: 6px;
8728 border: 1px solid #eaecf0;
8729 }
8730 .funnel-window .wpfnl-canvas-zoom-control .zoom-helper {
8731 margin-left: auto;
8732 display: none;
8733 align-items: center;
8734 flex-shrink: 0;
8735 }
8736 .funnel-window .wpfnl-canvas-zoom-control .zoom-level,
8737 .funnel-window .wpfnl-canvas-zoom-control .full-screen,
8738 .funnel-window .wpfnl-canvas-zoom-control .zoom-out,
8739 .funnel-window .wpfnl-canvas-zoom-control .zoom-in {
8740 border: none;
8741 border-bottom: 1px solid #EEF0F3;
8742 width: 34px;
8743 height: 34px;
8744 background: transparent;
8745 display: flex;
8746 flex-flow: column;
8747 align-items: center;
8748 justify-content: center;
8749 cursor: pointer;
8750 position: relative;
8751 }
8752 .funnel-window .wpfnl-canvas-zoom-control .zoom-level .action-tooltip,
8753 .funnel-window .wpfnl-canvas-zoom-control .full-screen .action-tooltip,
8754 .funnel-window .wpfnl-canvas-zoom-control .zoom-out .action-tooltip,
8755 .funnel-window .wpfnl-canvas-zoom-control .zoom-in .action-tooltip {
8756 position: absolute;
8757 top: 50%;
8758 right: calc(100% + 12px);
8759 transform: translateY(-50%);
8760 border-radius: 8px;
8761 background: #10052E;
8762 box-shadow: 0 2px 15px 0 rgba(22, 28, 32, 0.08);
8763 color: #E8E8E9;
8764 font-size: 12px;
8765 font-weight: 400;
8766 line-height: 1;
8767 padding: 8px 12px;
8768 opacity: 0;
8769 visibility: hidden;
8770 transition: opacity 0.2s ease, visibility 0.2s ease, right 0.2s ease;
8771 white-space: nowrap;
8772 z-index: 10;
8773 pointer-events: none;
8774 }
8775 .funnel-window .wpfnl-canvas-zoom-control .zoom-level .action-tooltip:after,
8776 .funnel-window .wpfnl-canvas-zoom-control .full-screen .action-tooltip:after,
8777 .funnel-window .wpfnl-canvas-zoom-control .zoom-out .action-tooltip:after,
8778 .funnel-window .wpfnl-canvas-zoom-control .zoom-in .action-tooltip:after {
8779 content: "";
8780 position: absolute;
8781 top: 50%;
8782 right: -4px;
8783 width: 8px;
8784 height: 8px;
8785 background: #10052E;
8786 transform: translateY(-50%) rotate(45deg);
8787 border-radius: 2px;
8788 }
8789 .funnel-window .wpfnl-canvas-zoom-control .zoom-level:hover .action-tooltip,
8790 .funnel-window .wpfnl-canvas-zoom-control .full-screen:hover .action-tooltip,
8791 .funnel-window .wpfnl-canvas-zoom-control .zoom-out:hover .action-tooltip,
8792 .funnel-window .wpfnl-canvas-zoom-control .zoom-in:hover .action-tooltip {
8793 opacity: 1;
8794 visibility: visible;
8795 right: calc(100% + 8px);
8796 }
8797 .funnel-window .wpfnl-canvas-zoom-control .zoom-in {
8798 border-bottom: none;
8799 }
8800 .funnel-window .wpfnl-canvas-zoom-control .zoom-level {
8801 font-weight: 500;
8802 font-size: 10px;
8803 line-height: 1.2;
8804 color: #7A8B9A;
8805 text-align: center;
8806 }
8807 .funnel-window .wpfnl-canvas-zoom-control[data-tour=yes] {
8808 z-index: 4;
8809 }
8810
8811 .wpfnl-drawflow-window.is-expand-mode {
8812 position: fixed;
8813 inset: 0;
8814 z-index: 99999;
8815 background: #f6f5fa;
8816 }
8817 .wpfnl-drawflow-window.is-expand-mode .drawflow-window-header {
8818 display: none;
8819 }
8820 .wpfnl-drawflow-window.is-expand-mode .funnel-window {
8821 height: 100vh;
8822 }
8823 .wpfnl-drawflow-window.is-expand-mode .wpfnl-drawing-wrapper {
8824 height: 100vh;
8825 }
8826 .wpfnl-drawflow-window.is-expand-mode .wpfnl-drawing-window {
8827 height: 100vh;
8828 }
8829 .wpfnl-drawflow-window.is-expand-mode .wpfnl-vertical-flow-view {
8830 height: 100vh;
8831 }
8832 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn {
8833 position: absolute;
8834 top: 12px;
8835 left: 16px;
8836 z-index: 10;
8837 display: flex;
8838 align-items: center;
8839 gap: 5px;
8840 background: #ffffff;
8841 border: 1px solid #eaecf0;
8842 border-radius: 6px;
8843 padding: 6px 12px;
8844 cursor: pointer;
8845 font-size: 12px;
8846 font-weight: 500;
8847 color: #7a8b9a;
8848 transition: background 0.15s ease, color 0.15s ease;
8849 }
8850 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn svg {
8851 width: 10px;
8852 height: 10px;
8853 flex-shrink: 0;
8854 }
8855 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn svg path {
8856 stroke: #7a8b9a;
8857 }
8858 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn:hover {
8859 background: #f6f5fa;
8860 color: #344054;
8861 }
8862 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn:hover svg path {
8863 stroke: #344054;
8864 }
8865
8866 body.wpfnl-builder-expand {
8867 overflow: hidden;
8868 }
8869 body.wpfnl-builder-expand #wpadminbar,
8870 body.wpfnl-builder-expand #adminmenuwrap,
8871 body.wpfnl-builder-expand #adminmenuback {
8872 display: none !important;
8873 }
8874
8875 .wpfnl-box {
8876 background: #FFFFFF;
8877 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
8878 border-radius: 6px;
8879 padding: 25px 30px;
8880 margin-bottom: 20px;
8881 }
8882 .wpfnl-box:last-child {
8883 margin-bottom: 0;
8884 }
8885 .wpfnl-box.transparent {
8886 background: transparent;
8887 box-shadow: none;
8888 padding: 4px 0px;
8889 }
8890
8891 .wpfnl-field-wrapper {
8892 display: flex;
8893 flex-flow: row wrap;
8894 align-items: center;
8895 justify-content: flex-start;
8896 margin-bottom: 30px;
8897 }
8898 .wpfnl-field-wrapper:last-child {
8899 margin-bottom: 0;
8900 }
8901 .wpfnl-field-wrapper > label {
8902 width: 240px;
8903 padding-right: 10px;
8904 }
8905 .wpfnl-field-wrapper > label.has-tooltip {
8906 display: flex;
8907 flex-flow: row;
8908 align-items: center;
8909 justify-content: flex-start;
8910 }
8911 .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
8912 margin-left: 10px;
8913 }
8914 .wpfnl-field-wrapper .wpfnl-fields {
8915 max-width: 410px;
8916 width: calc(100% - 240px);
8917 }
8918 .wpfnl-field-wrapper .wpfnl-fields select {
8919 margin-right: 0;
8920 }
8921
8922 .steps-settings .steps-settings__tab-nav {
8923 display: flex;
8924 flex-flow: row wrap;
8925 align-items: center;
8926 margin: 25px 0 22px;
8927 }
8928 .steps-settings .steps-settings__tab-nav li a {
8929 color: #7A8B9A;
8930 font-weight: 500;
8931 position: relative;
8932 display: flex;
8933 align-items: center;
8934 padding: 0 18px;
8935 height: 42px;
8936 line-height: 43px;
8937 border: 1px solid transparent;
8938 border-radius: 8px;
8939 cursor: pointer;
8940 transition: none;
8941 }
8942 .steps-settings .steps-settings__tab-nav li a svg {
8943 display: block;
8944 margin-right: 8px;
8945 position: relative;
8946 }
8947 .steps-settings .steps-settings__tab-nav li .pro-tag {
8948 position: absolute;
8949 top: -10px;
8950 right: 15px;
8951 }
8952 .steps-settings .steps-settings__tab-nav li.disabled .pro-tag-icon {
8953 position: static;
8954 margin-left: 6px;
8955 margin-top: -3px;
8956 }
8957 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a {
8958 color: #363B4E;
8959 border-color: #6E42D3;
8960 background-color: #ffffff;
8961 box-shadow: 0 20px 16px 0 rgba(189, 193, 200, 0.2);
8962 }
8963 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a .icon.stroke {
8964 stroke: #6E42D3;
8965 }
8966 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a .icon.order-bump-icon path {
8967 fill: #6E42D3;
8968 }
8969 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a[href="#general"] path {
8970 stroke: #6E42D3;
8971 }
8972 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-settings rect,
8973 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-settings circle,
8974 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-settings path, .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-stats rect,
8975 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-stats circle,
8976 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-stats path {
8977 stroke: #6E42D3;
8978 }
8979 .steps-settings .steps-settings__tab-nav li.declare-winner.active a path {
8980 stroke: #6E42D3;
8981 }
8982 .steps-settings .steps-settings__tab-nav li.reset {
8983 margin-left: auto;
8984 margin-right: 40px;
8985 }
8986 .steps-settings .steps-settings__tab-nav li.reset button {
8987 font-size: 14px;
8988 line-height: 1;
8989 font-weight: 500;
8990 color: #7A8B9A;
8991 border: none;
8992 background: transparent;
8993 display: flex;
8994 align-items: center;
8995 cursor: pointer;
8996 }
8997 .steps-settings .steps-settings__tab-nav li.reset button svg {
8998 display: block;
8999 margin-left: 8px;
9000 position: relative;
9001 top: -1px;
9002 }
9003 .steps-settings .steps-settings__tab-nav li.reset button.reseting svg {
9004 animation: spin 0.9s linear infinite;
9005 }
9006 .steps-settings .steps-settings__tab-nav li.nav-tag {
9007 margin-left: auto;
9008 }
9009 .steps-settings .steps-settings__tab-nav li.nav-tag span {
9010 color: #8292A0;
9011 background: #F7F7FA;
9012 border-radius: 30px;
9013 display: inline-block;
9014 padding: 6px 17px;
9015 }
9016 .steps-settings .step-settings__single-tab-content {
9017 display: none;
9018 }
9019 .steps-settings .step-settings__single-tab-content #wpfnl-choose-offer[data-tour=yes],
9020 .steps-settings .step-settings__single-tab-content #gbf-product-quantity[data-tour=yes],
9021 .steps-settings .step-settings__single-tab-content #discount-options[data-tour=yes] {
9022 position: relative;
9023 z-index: 4;
9024 border: 1px solid #FFF;
9025 }
9026 .steps-settings .step-settings__single-tab-content:first-child {
9027 display: block;
9028 }
9029 .steps-settings .step-settings__single-tab-content .checkout-edit-field-tab__content-wrapper .pro-tag {
9030 padding: 14px 35px;
9031 text-align: center;
9032 margin-top: 30px;
9033 box-shadow: none;
9034 border-radius: 10px;
9035 }
9036 .steps-settings .single__settings-box.transparent .wpfnl-field-wrapper > label {
9037 width: 250px;
9038 }
9039 .steps-settings .single__settings-box .select2-hidden-accessible {
9040 display: none;
9041 }
9042 .steps-settings .single__settings-box .select2-container--default {
9043 width: 100% !important;
9044 border: 1px solid #E5E8F3;
9045 border-radius: 4px;
9046 padding: 8px;
9047 display: block;
9048 }
9049 .steps-settings .single__settings-box .select2-selection__rendered {
9050 font-size: 13px;
9051 display: block;
9052 }
9053 .steps-settings .single__settings-box .select2-selection__rendered .select2-selection__clear {
9054 background: #f8d7da;
9055 display: inline-block;
9056 padding: 0 3px;
9057 line-height: 14px;
9058 color: #ec4050;
9059 margin-right: 2px;
9060 border-radius: 100%;
9061 cursor: pointer;
9062 }
9063 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper {
9064 align-items: flex-start;
9065 }
9066 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper label {
9067 position: relative;
9068 top: 21px;
9069 }
9070 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper .btn-default {
9071 height: 26px;
9072 line-height: 26px;
9073 font-size: 12px;
9074 padding: 0 10px;
9075 min-width: auto;
9076 margin-right: 6px;
9077 border: 1px solid transparent;
9078 }
9079 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper .btn-default.create-product {
9080 background: #f6f6f8;
9081 color: #363B4E;
9082 }
9083 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper .btn-default.create-product:hover {
9084 color: #6E42D3;
9085 }
9086 .steps-settings .single__settings-box.select-product .products-wrapper {
9087 border: 1px solid #E5E8F3;
9088 box-sizing: border-box;
9089 border-radius: 5px;
9090 padding: 10px;
9091 margin-bottom: 10px;
9092 }
9093 .steps-settings .single__settings-box.select-product .single-product {
9094 display: flex;
9095 margin-bottom: 10px;
9096 }
9097 .steps-settings .single__settings-box.select-product .single-product:last-child {
9098 margin-bottom: 0;
9099 }
9100 .steps-settings .single__settings-box.select-product .single-product .select2-container--default {
9101 width: calc(100% - 46px) !important;
9102 }
9103 .steps-settings .single__settings-box.select-product .single-product button {
9104 background: #FAFAFB;
9105 border: 1px solid #E5E8F3;
9106 box-sizing: border-box;
9107 border-radius: 4px;
9108 width: 36px;
9109 height: 36px;
9110 margin-left: 10px;
9111 display: flex;
9112 flex-flow: column;
9113 align-items: center;
9114 justify-content: center;
9115 cursor: pointer;
9116 transition: all 0.3s ease;
9117 }
9118 .steps-settings .single__settings-box.select-product .single-product button:hover {
9119 background-color: #f8d7da;
9120 border-color: #f5c6cb;
9121 }
9122 .steps-settings .single__settings-box.select-product .single-product button:hover svg path {
9123 stroke: #ec4050;
9124 }
9125 .steps-settings .wpfnl-product-options {
9126 padding: 0;
9127 }
9128 .steps-settings .product-options__tab-nav {
9129 display: flex;
9130 flex-flow: row wrap;
9131 align-items: center;
9132 justify-content: flex-start;
9133 border-bottom: 1px solid #F4F4F9;
9134 padding: 0 40px;
9135 }
9136 .steps-settings .product-options__tab-nav li {
9137 margin-right: 35px;
9138 }
9139 .steps-settings .product-options__tab-nav li:last-child {
9140 margin-right: 0;
9141 }
9142 .steps-settings .product-options__tab-nav li a {
9143 font-weight: 500;
9144 font-size: 13px;
9145 line-height: 15px;
9146 color: #7A8B9A;
9147 padding: 15px 0;
9148 display: block;
9149 position: relative;
9150 }
9151 .steps-settings .product-options__tab-nav li a:after {
9152 content: "";
9153 position: absolute;
9154 left: 0;
9155 bottom: -1px;
9156 width: 100%;
9157 height: 2px;
9158 background: transparent;
9159 }
9160 .steps-settings .product-options__tab-nav li a:hover, .steps-settings .product-options__tab-nav li.active a {
9161 color: #6E42D3;
9162 }
9163 .steps-settings .product-options__tab-nav li a:hover:after, .steps-settings .product-options__tab-nav li.active a:after {
9164 background: #6E42D3;
9165 }
9166 .steps-settings .product-options__single-tab-content {
9167 display: none;
9168 padding: 30px 40px;
9169 }
9170 .steps-settings .product-options__single-tab-content:first-child {
9171 display: block;
9172 }
9173 .steps-settings .product-options__single-tab-content .wpfnl-field-wrapper {
9174 margin-bottom: 25px;
9175 }
9176 .steps-settings .product-options__single-tab-content .wpfnl-field-wrapper:last-child {
9177 margin-bottom: 0;
9178 }
9179 .steps-settings .settings-content__footer {
9180 padding: 23px 0 20px;
9181 display: flex;
9182 flex-flow: row wrap;
9183 align-items: center;
9184 justify-content: flex-end;
9185 gap: 14px;
9186 }
9187 .steps-settings .settings-content__footer .back2-edit {
9188 background: #fff;
9189 color: #363B4E;
9190 }
9191 .steps-settings .settings-content__footer .back2-edit:hover {
9192 background: rgba(0, 0, 0, 0.04);
9193 }
9194 .steps-settings .settings-content__footer #save-order-bump[hide-btn=yes] {
9195 display: none;
9196 }
9197 .steps-settings .settings-content__footer .btn-default {
9198 display: flex;
9199 flex-flow: row;
9200 align-items: center;
9201 justify-content: center;
9202 line-height: 1;
9203 height: auto;
9204 min-width: auto;
9205 padding: 14px 20px 12px;
9206 letter-spacing: -0.01em;
9207 border-radius: 8px;
9208 filter: drop-shadow(0px 10px 16px rgba(97, 103, 116, 0.15));
9209 }
9210 .steps-settings .settings-content__footer .btn-default .wpfnl-loader {
9211 display: block;
9212 }
9213 .steps-settings .settings-content__footer .btn-default[data-tour=yes] {
9214 position: relative;
9215 z-index: 4;
9216 border: 1px solid #FFF;
9217 }
9218 .steps-settings .settings-content__footer .cancel {
9219 border: 1px solid #EEF0F3;
9220 background: transparent;
9221 color: #363B4E;
9222 }
9223 .steps-settings .settings-content__footer .cancel:hover {
9224 background: #EEF0F3;
9225 }
9226 .steps-settings .settings-content__footer .wpfnl-alert {
9227 display: block;
9228 border-radius: 8px;
9229 padding: 10px 20px;
9230 }
9231
9232 .steps-settings.downsell .steps-settings__tab-nav li a svg,
9233 .steps-settings.upsell .steps-settings__tab-nav li a svg {
9234 position: relative;
9235 top: 1px;
9236 }
9237 .steps-settings.downsell .steps-settings__tab-nav li.conditonal-redirect.active a svg path,
9238 .steps-settings.upsell .steps-settings__tab-nav li.conditonal-redirect.active a svg path {
9239 fill: #6E42D3;
9240 stroke: none;
9241 }
9242 .steps-settings.downsell .wpfnl-field-wrapper .single-product svg,
9243 .steps-settings.upsell .wpfnl-field-wrapper .single-product svg {
9244 display: none;
9245 }
9246 .steps-settings.downsell .single__settings-box,
9247 .steps-settings.upsell .single__settings-box {
9248 border: 1px solid #E5E8F3;
9249 box-shadow: none;
9250 }
9251 .steps-settings.downsell .single__settings-box .select2-container--default,
9252 .steps-settings.upsell .single__settings-box .select2-container--default {
9253 border: 1px solid #E5E8F3;
9254 border-radius: 6px;
9255 padding: 4px 8px 2px;
9256 display: block;
9257 }
9258 .steps-settings.downsell .single__settings-box .select2-container--default .select2-selection--single,
9259 .steps-settings.upsell .single__settings-box .select2-container--default .select2-selection--single {
9260 background-color: #fff;
9261 border: none;
9262 border-radius: 0;
9263 }
9264 .steps-settings.downsell .single__settings-box .select2-container--default .select2-selection--single .select2-selection__arrow,
9265 .steps-settings.upsell .single__settings-box .select2-container--default .select2-selection--single .select2-selection__arrow {
9266 height: 26px;
9267 position: absolute;
9268 top: 4px;
9269 right: 1px;
9270 width: 20px;
9271 }
9272 .steps-settings.downsell .offer-discount-area .wpfnl-box,
9273 .steps-settings.upsell .offer-discount-area .wpfnl-box {
9274 box-shadow: none;
9275 border-radius: 10px;
9276 }
9277 .steps-settings.downsell .offer-discount-area .non-input-field,
9278 .steps-settings.upsell .offer-discount-area .non-input-field {
9279 cursor: not-allowed;
9280 background-color: #F6F5FA;
9281 font-size: 14px;
9282 color: #7A8B9A;
9283 padding: 13px 15px;
9284 height: 44px;
9285 width: 100%;
9286 min-width: 190px;
9287 border-radius: 6px;
9288 display: block;
9289 border: 1px solid #EBEDF0;
9290 }
9291 .steps-settings.downsell .offer-discount-area .hints.mobile,
9292 .steps-settings.upsell .offer-discount-area .hints.mobile {
9293 display: none;
9294 }
9295 .steps-settings.downsell .settings-content__footer .wpfnl-loader,
9296 .steps-settings.upsell .settings-content__footer .wpfnl-loader {
9297 display: block;
9298 }
9299 .steps-settings.downsell .settings-content__footer .wpfnl-alert,
9300 .steps-settings.upsell .settings-content__footer .wpfnl-alert {
9301 display: block;
9302 }
9303 .steps-settings.downsell .wpfnl-fields.price-range,
9304 .steps-settings.upsell .wpfnl-fields.price-range {
9305 display: flex;
9306 flex-flow: row wrap;
9307 }
9308 .steps-settings.downsell .wpfnl-fields.price-range .price-to,
9309 .steps-settings.downsell .wpfnl-fields.price-range .price-from,
9310 .steps-settings.upsell .wpfnl-fields.price-range .price-to,
9311 .steps-settings.upsell .wpfnl-fields.price-range .price-from {
9312 width: 50%;
9313 }
9314 .steps-settings.downsell .wpfnl-fields.price-range .price-to > label,
9315 .steps-settings.downsell .wpfnl-fields.price-range .price-from > label,
9316 .steps-settings.upsell .wpfnl-fields.price-range .price-to > label,
9317 .steps-settings.upsell .wpfnl-fields.price-range .price-from > label {
9318 margin-bottom: 5px;
9319 display: block;
9320 }
9321 .steps-settings.downsell .wpfnl-fields.price-range .price-to .wpfnl-fields,
9322 .steps-settings.downsell .wpfnl-fields.price-range .price-from .wpfnl-fields,
9323 .steps-settings.upsell .wpfnl-fields.price-range .price-to .wpfnl-fields,
9324 .steps-settings.upsell .wpfnl-fields.price-range .price-from .wpfnl-fields {
9325 width: 100%;
9326 }
9327 .steps-settings.downsell .wpfnl-fields.price-range .price-to .wpfnl-fields input[type=number],
9328 .steps-settings.downsell .wpfnl-fields.price-range .price-from .wpfnl-fields input[type=number],
9329 .steps-settings.upsell .wpfnl-fields.price-range .price-to .wpfnl-fields input[type=number],
9330 .steps-settings.upsell .wpfnl-fields.price-range .price-from .wpfnl-fields input[type=number] {
9331 min-width: auto;
9332 }
9333 .steps-settings.downsell .wpfnl-fields.price-range .price-from,
9334 .steps-settings.upsell .wpfnl-fields.price-range .price-from {
9335 padding-right: 10px;
9336 }
9337 .steps-settings.downsell .wpfnl-fields.price-range .price-to,
9338 .steps-settings.upsell .wpfnl-fields.price-range .price-to {
9339 padding-left: 10px;
9340 }
9341
9342 .steps-settings.thank-you .single__settings-box {
9343 border: 1px solid #E5E8F3;
9344 box-shadow: none;
9345 border-radius: 10px;
9346 }
9347 .steps-settings.thank-you .enabled-thankyou-page-redirection {
9348 margin-top: 24px;
9349 background-color: #F6F5FA;
9350 padding: 24px;
9351 border-radius: 10px;
9352 }
9353 .steps-settings.thank-you .redirect-thankyou-page {
9354 margin-top: 24px;
9355 display: grid;
9356 grid-template-columns: repeat(2, 1fr);
9357 gap: 20px;
9358 background-color: #F6F5FA;
9359 border-radius: 10px;
9360 }
9361 .steps-settings.thank-you .redirect-thankyou-page .single-page-option {
9362 position: relative;
9363 }
9364 .steps-settings.thank-you .redirect-thankyou-page .single-page-option > input[type=radio] {
9365 display: none;
9366 }
9367 .steps-settings.thank-you .redirect-thankyou-page .single-page-option .option-label {
9368 border-radius: 10px;
9369 border: 1px solid #E4E0F0;
9370 background-color: #FFF;
9371 cursor: pointer;
9372 padding: 24px;
9373 display: block;
9374 height: 100%;
9375 }
9376 .steps-settings.thank-you .redirect-thankyou-page .single-page-option .radio-point {
9377 position: absolute;
9378 top: 16px;
9379 right: 16px;
9380 }
9381 .steps-settings.thank-you .redirect-thankyou-page .single-page-option .radio-point circle:first-child {
9382 transform: scale(0);
9383 transform-origin: center;
9384 transition: all 0.3s ease;
9385 }
9386 .steps-settings.thank-you .redirect-thankyou-page .single-page-option > input[type=radio]:checked + .option-label {
9387 border-color: #6E42D3;
9388 }
9389 .steps-settings.thank-you .redirect-thankyou-page .single-page-option > input[type=radio]:checked + .option-label .radio-point circle:first-child {
9390 transform: scale(1);
9391 }
9392 .steps-settings.thank-you .redirect-thankyou-page .single-page-option h4 {
9393 color: #363B4E;
9394 font-size: 16px;
9395 font-weight: 500;
9396 line-height: 1.37;
9397 margin-bottom: 8px;
9398 max-width: 95%;
9399 }
9400 .steps-settings.thank-you .redirect-thankyou-page .single-page-option p {
9401 color: #525562;
9402 font-size: 14px;
9403 font-weight: 400;
9404 line-height: 1.4;
9405 }
9406 .steps-settings.thank-you .settings-content__footer .wpfnl-loader {
9407 display: none;
9408 }
9409 .steps-settings.thank-you .settings-content__footer .wpfnl-alert {
9410 display: none;
9411 }
9412
9413 @media only screen and (max-width: 1400px) {
9414 .wpfnl-box {
9415 padding: 20px 20px;
9416 }
9417 }
9418 @media only screen and (max-width: 1199px) {
9419 .steps-settings .product .single__settings-box .wpfnl-field-wrapper label {
9420 width: 150px;
9421 }
9422 .steps-settings .product .single__settings-box .wpfnl-field-wrapper .wpfnl-fields {
9423 width: calc(100% - 150px);
9424 }
9425 .steps-settings .steps-settings__tab-nav li.reset {
9426 margin-right: 0;
9427 }
9428 }
9429 .step-settings__single-tab-content .product-mode-selection,
9430 .checkout-product-setting-tab__content-wrapper .product-mode-selection {
9431 border-radius: 10px;
9432 padding: 20px;
9433 margin-bottom: 20px;
9434 border: 1px solid #EEF0F3;
9435 background: #fff;
9436 }
9437 .step-settings__single-tab-content .product-mode-selection .pms-header,
9438 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-header {
9439 display: flex;
9440 flex-direction: column;
9441 gap: 2px;
9442 margin-bottom: 16px;
9443 }
9444 .step-settings__single-tab-content .product-mode-selection .pms-title,
9445 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-title {
9446 font-size: 16px;
9447 font-weight: 600;
9448 color: #111827;
9449 line-height: 1.4;
9450 }
9451 .step-settings__single-tab-content .product-mode-selection .pms-subtitle,
9452 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-subtitle {
9453 font-size: 14px;
9454 color: #6b7280;
9455 line-height: 1.4;
9456 }
9457 .step-settings__single-tab-content .product-mode-selection .pms-cards,
9458 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-cards {
9459 display: grid;
9460 grid-template-columns: 1fr 1fr;
9461 gap: 12px;
9462 }
9463 .step-settings__single-tab-content .product-mode-selection .pms-card,
9464 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card {
9465 position: relative;
9466 display: flex;
9467 flex-direction: column;
9468 gap: 10px;
9469 padding: 16px;
9470 border: 1.5px solid #e5e7eb;
9471 border-radius: 10px;
9472 cursor: pointer;
9473 background: #fff;
9474 transition: border-color 0.15s, background 0.15s;
9475 }
9476 .step-settings__single-tab-content .product-mode-selection .pms-card.pms-card--active,
9477 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card.pms-card--active {
9478 border-color: #7c6ff7;
9479 background: #f0effe;
9480 }
9481 .step-settings__single-tab-content .product-mode-selection .pms-radio-input,
9482 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-input {
9483 position: absolute;
9484 opacity: 0;
9485 pointer-events: none;
9486 width: 0;
9487 height: 0;
9488 }
9489 .step-settings__single-tab-content .product-mode-selection .pms-card-top,
9490 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-top {
9491 display: flex;
9492 align-items: center;
9493 gap: 10px;
9494 }
9495 .step-settings__single-tab-content .product-mode-selection .pms-card-icon,
9496 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-icon {
9497 display: inline-flex;
9498 align-items: center;
9499 justify-content: center;
9500 width: 32px;
9501 height: 32px;
9502 border-radius: 8px;
9503 flex-shrink: 0;
9504 }
9505 .step-settings__single-tab-content .product-mode-selection .pms-card-icon.pms-card-icon--assign,
9506 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-icon.pms-card-icon--assign {
9507 background: #ede9ff;
9508 color: #6c5ce7;
9509 }
9510 .step-settings__single-tab-content .product-mode-selection .pms-card-icon.pms-card-icon--smart,
9511 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-icon.pms-card-icon--smart {
9512 background: #d1fae5;
9513 color: #059669;
9514 }
9515 .step-settings__single-tab-content .product-mode-selection .pms-card-name,
9516 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-name {
9517 font-size: 14px;
9518 font-weight: 600;
9519 color: #111827;
9520 flex: 1;
9521 }
9522 .step-settings__single-tab-content .product-mode-selection .pms-radio-dot,
9523 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-dot {
9524 display: inline-flex;
9525 align-items: center;
9526 justify-content: center;
9527 width: 18px;
9528 height: 18px;
9529 border-radius: 50%;
9530 border: 2px solid #d1d5db;
9531 flex-shrink: 0;
9532 transition: border-color 0.15s, background 0.15s;
9533 }
9534 .step-settings__single-tab-content .product-mode-selection .pms-radio-dot.pms-radio-dot--checked,
9535 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-dot.pms-radio-dot--checked {
9536 border-color: #7c6ff7;
9537 background: #7c6ff7;
9538 }
9539 .step-settings__single-tab-content .product-mode-selection .pms-radio-inner,
9540 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-inner {
9541 display: block;
9542 width: 6px;
9543 height: 6px;
9544 border-radius: 50%;
9545 background: #fff;
9546 }
9547 .step-settings__single-tab-content .product-mode-selection .pms-card-desc,
9548 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-desc {
9549 font-size: 13px;
9550 color: #6b7280;
9551 line-height: 1.5;
9552 margin: 0;
9553 }
9554 .step-settings__single-tab-content,
9555 .checkout-product-setting-tab__content-wrapper {
9556 /* Conditional Funnel dummy/upgrade preview */
9557 }
9558 .step-settings__single-tab-content .conditional-funnel-preview,
9559 .checkout-product-setting-tab__content-wrapper .conditional-funnel-preview {
9560 position: relative;
9561 overflow: hidden;
9562 padding: 0;
9563 background: #f5f6fa;
9564 }
9565 .step-settings__single-tab-content .conditional-funnel-dummy,
9566 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy {
9567 pointer-events: none;
9568 user-select: none;
9569 padding: 20px;
9570 }
9571 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-wrapper,
9572 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-wrapper {
9573 display: flex;
9574 flex-direction: column;
9575 gap: 0;
9576 }
9577 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-row,
9578 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-row {
9579 display: grid;
9580 grid-template-columns: 1fr 1fr;
9581 gap: 16px;
9582 background: #fff;
9583 border-radius: 8px;
9584 padding: 20px 24px;
9585 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
9586 }
9587 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-left,
9588 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-right,
9589 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-left,
9590 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-right {
9591 display: flex;
9592 flex-direction: column;
9593 }
9594 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-left .wpfnl-form-group,
9595 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-right .wpfnl-form-group,
9596 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-left .wpfnl-form-group,
9597 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-right .wpfnl-form-group {
9598 display: flex;
9599 flex-direction: column;
9600 gap: 8px;
9601 }
9602 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-left label,
9603 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-right label,
9604 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-left label,
9605 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-right label {
9606 font-size: 13px;
9607 font-weight: 500;
9608 color: #363b4e;
9609 }
9610 .step-settings__single-tab-content .conditional-funnel-dummy .required-star,
9611 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .required-star {
9612 color: #e74c3c;
9613 }
9614 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-select,
9615 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-select {
9616 display: flex;
9617 align-items: center;
9618 justify-content: space-between;
9619 background: #fff;
9620 border: 1px solid #dde1e7;
9621 border-radius: 6px;
9622 padding: 10px 14px;
9623 font-size: 13px;
9624 color: #7a8b9a;
9625 }
9626 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-select-text,
9627 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-select-text {
9628 color: #7a8b9a;
9629 }
9630 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-input,
9631 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-input {
9632 width: 100%;
9633 border: 1px solid #dde1e7;
9634 border-radius: 6px;
9635 padding: 10px 14px;
9636 font-size: 13px;
9637 color: #363b4e;
9638 background: #fff;
9639 }
9640 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-tag-field,
9641 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-tag-field {
9642 display: flex;
9643 align-items: center;
9644 flex-wrap: wrap;
9645 gap: 6px;
9646 background: #fff;
9647 border: 1px solid #dde1e7;
9648 border-radius: 6px;
9649 padding: 8px 14px;
9650 min-height: 42px;
9651 }
9652 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-tag,
9653 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-tag {
9654 display: inline-flex;
9655 align-items: center;
9656 background: #f0f1f5;
9657 border-radius: 4px;
9658 padding: 2px 8px;
9659 font-size: 12px;
9660 color: #363b4e;
9661 }
9662 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-connector,
9663 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-connector {
9664 display: flex;
9665 justify-content: center;
9666 height: 32px;
9667 position: relative;
9668 }
9669 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-connector-line,
9670 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-connector-line {
9671 width: 1px;
9672 height: 100%;
9673 background: #c5cad4;
9674 }
9675 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-add-condition,
9676 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-add-condition {
9677 display: flex;
9678 flex-direction: column;
9679 align-items: center;
9680 margin-top: 0;
9681 }
9682 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-add-line,
9683 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-add-line {
9684 width: 1px;
9685 height: 20px;
9686 background: #c5cad4;
9687 }
9688 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-add-btn,
9689 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-add-btn {
9690 width: 32px;
9691 height: 32px;
9692 border-radius: 50%;
9693 background: #6a3fc8;
9694 border: none;
9695 display: flex;
9696 align-items: center;
9697 justify-content: center;
9698 cursor: default;
9699 box-shadow: 0 2px 8px rgba(106, 63, 200, 0.35);
9700 }
9701 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay,
9702 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay {
9703 position: absolute;
9704 inset: 0;
9705 z-index: 10;
9706 display: flex;
9707 align-items: center;
9708 justify-content: center;
9709 background: rgba(255, 255, 255, 0.78);
9710 border-radius: 10px;
9711 }
9712 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay .upgrade-overlay-content,
9713 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay .upgrade-overlay-content {
9714 display: flex;
9715 flex-direction: column;
9716 align-items: center;
9717 text-align: center;
9718 justify-content: center;
9719 gap: 12px;
9720 padding: 32px 24px;
9721 max-width: 420px;
9722 background: rgba(255, 255, 255, 0.9215686275);
9723 height: 100%;
9724 }
9725 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay .upgrade-lock-icon,
9726 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay .upgrade-lock-icon {
9727 display: flex;
9728 align-items: center;
9729 justify-content: center;
9730 width: 56px;
9731 height: 56px;
9732 border-radius: 50%;
9733 background: #f1f3f5;
9734 margin-bottom: 4px;
9735 }
9736 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay .upgrade-overlay-content p,
9737 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay .upgrade-overlay-content p {
9738 font-size: 13px;
9739 color: #7a8b9a;
9740 line-height: 1.6;
9741 margin: 0;
9742 }
9743 .step-settings__single-tab-content .product-accordion__wrapper,
9744 .checkout-product-setting-tab__content-wrapper .product-accordion__wrapper {
9745 position: relative;
9746 }
9747 .step-settings__single-tab-content .product-area,
9748 .checkout-product-setting-tab__content-wrapper .product-area {
9749 background: #FFFFFF;
9750 border-radius: 10px;
9751 border: 1px solid #EEF0F3;
9752 }
9753 .step-settings__single-tab-content .product-head,
9754 .checkout-product-setting-tab__content-wrapper .product-head {
9755 display: flex;
9756 align-items: center;
9757 justify-content: space-between;
9758 padding: 16px 16px 16px 30px;
9759 border-bottom: 1px solid #EEF0F3;
9760 }
9761 .step-settings__single-tab-content .product-head .title,
9762 .checkout-product-setting-tab__content-wrapper .product-head .title {
9763 font-weight: 600;
9764 font-size: 16px;
9765 line-height: 1;
9766 color: #363B4E;
9767 text-transform: capitalize;
9768 margin-right: 10px;
9769 }
9770 .step-settings__single-tab-content .product-head .product-right,
9771 .checkout-product-setting-tab__content-wrapper .product-head .product-right {
9772 display: flex;
9773 align-items: center;
9774 gap: 15px;
9775 row-gap: 8px;
9776 }
9777 .step-settings__single-tab-content .product-head .create-product-btn,
9778 .checkout-product-setting-tab__content-wrapper .product-head .create-product-btn {
9779 margin-left: auto;
9780 margin-right: 10px;
9781 }
9782 .step-settings__single-tab-content .product-head .create-product-btn .btn-default,
9783 .checkout-product-setting-tab__content-wrapper .product-head .create-product-btn .btn-default {
9784 background: none;
9785 color: #6e42d3;
9786 padding: 0px;
9787 border-bottom: 1px solid #6e42d3;
9788 border-radius: 0px;
9789 min-width: auto;
9790 line-height: 1;
9791 height: auto;
9792 }
9793 .step-settings__single-tab-content .product-head .wpfnl-tooltip,
9794 .checkout-product-setting-tab__content-wrapper .product-head .wpfnl-tooltip {
9795 margin-left: 5px;
9796 margin-right: 10px;
9797 }
9798 .step-settings__single-tab-content .product-head .add-product-btn .btn-default,
9799 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default {
9800 height: 40px;
9801 line-height: 41px;
9802 background: #F7F7FA;
9803 border: 1px solid #E5E8F3;
9804 color: #363B4E;
9805 padding: 0 16px;
9806 }
9807 .step-settings__single-tab-content .product-head .add-product-btn .btn-default:disabled, .step-settings__single-tab-content .product-head .add-product-btn .btn-default[disabled=disabled],
9808 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default:disabled,
9809 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default[disabled=disabled] {
9810 opacity: 0.7;
9811 cursor: not-allowed;
9812 }
9813 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color,
9814 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color {
9815 background: #6E42D3;
9816 border-color: #6E42D3;
9817 color: #FFFFFF;
9818 }
9819 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color svg path,
9820 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color svg path {
9821 stroke: #FFFFFF;
9822 }
9823 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .add-product-icon,
9824 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .add-product-icon {
9825 position: relative;
9826 display: inline-block;
9827 width: 18px;
9828 height: 18px;
9829 }
9830 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .icon-tabler-arrow-narrow-left,
9831 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .icon-tabler-arrow-narrow-left {
9832 transform: rotate(-90deg);
9833 position: relative;
9834 top: 5px;
9835 display: none;
9836 animation: scrollDown1 1.5s ease infinite;
9837 stroke: none;
9838 }
9839 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .product-adding .icon-tabler-arrow-narrow-left,
9840 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .product-adding .icon-tabler-arrow-narrow-left {
9841 display: block;
9842 }
9843 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .product-adding .plus-icon,
9844 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .product-adding .plus-icon {
9845 display: none;
9846 }
9847 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.product-added,
9848 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.product-added {
9849 border-color: #6E42D3;
9850 background-color: #6E42D3;
9851 color: #fff;
9852 }
9853 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.product-added .plus-icon path,
9854 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.product-added .plus-icon path {
9855 stroke: #fff;
9856 }
9857 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.product-added .icon-tabler-arrow-narrow-left,
9858 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.product-added .icon-tabler-arrow-narrow-left {
9859 stroke: #fff;
9860 }
9861 .step-settings__single-tab-content .product-head .add-product-btn button[data-tour=yes],
9862 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn button[data-tour=yes] {
9863 position: relative;
9864 z-index: 4;
9865 }
9866 .step-settings__single-tab-content .product-head .create-product-button button[data-tour=yes],
9867 .checkout-product-setting-tab__content-wrapper .product-head .create-product-button button[data-tour=yes] {
9868 position: relative;
9869 z-index: 4;
9870 }
9871 @keyframes scrollDown1 {
9872 0% {
9873 transform: rotate(-90deg) translateX(15px);
9874 opacity: 0;
9875 }
9876 50% {
9877 transform: rotate(-90deg) translateX(0px);
9878 opacity: 1;
9879 }
9880 100% {
9881 transform: rotate(-90deg) translateX(-15px);
9882 opacity: 0;
9883 }
9884 }
9885 .step-settings__single-tab-content .accordion-footer .accordion-col,
9886 .step-settings__single-tab-content .accordion-head .accordion-col,
9887 .checkout-product-setting-tab__content-wrapper .accordion-footer .accordion-col,
9888 .checkout-product-setting-tab__content-wrapper .accordion-head .accordion-col {
9889 color: #7A8B9A;
9890 font-size: 14px;
9891 font-weight: 400;
9892 line-height: 1;
9893 text-transform: capitalize;
9894 letter-spacing: 0.35px;
9895 }
9896 .step-settings__single-tab-content .accordion-head,
9897 .checkout-product-setting-tab__content-wrapper .accordion-head {
9898 background-color: #F6F5FA;
9899 padding: 15px 30px;
9900 }
9901 .step-settings__single-tab-content .accordion-footer,
9902 .step-settings__single-tab-content .product-single__accordion-head,
9903 .step-settings__single-tab-content .accordion-head,
9904 .checkout-product-setting-tab__content-wrapper .accordion-footer,
9905 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head,
9906 .checkout-product-setting-tab__content-wrapper .accordion-head {
9907 display: flex;
9908 flex-flow: row wrap;
9909 align-items: center;
9910 justify-content: space-between;
9911 }
9912 .step-settings__single-tab-content .accordion-footer .product-name,
9913 .step-settings__single-tab-content .product-single__accordion-head .product-name,
9914 .step-settings__single-tab-content .accordion-head .product-name,
9915 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-name,
9916 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name,
9917 .checkout-product-setting-tab__content-wrapper .accordion-head .product-name {
9918 width: 340px;
9919 }
9920 .step-settings__single-tab-content .accordion-footer .product-price,
9921 .step-settings__single-tab-content .product-single__accordion-head .product-price,
9922 .step-settings__single-tab-content .accordion-head .product-price,
9923 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-price,
9924 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-price,
9925 .checkout-product-setting-tab__content-wrapper .accordion-head .product-price {
9926 width: 77px;
9927 cursor: text;
9928 }
9929 .step-settings__single-tab-content .accordion-footer .product-quantity,
9930 .step-settings__single-tab-content .product-single__accordion-head .product-quantity,
9931 .step-settings__single-tab-content .accordion-head .product-quantity,
9932 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-quantity,
9933 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-quantity,
9934 .checkout-product-setting-tab__content-wrapper .accordion-head .product-quantity {
9935 width: 80px;
9936 }
9937 .step-settings__single-tab-content .accordion-footer .total-price,
9938 .step-settings__single-tab-content .product-single__accordion-head .total-price,
9939 .step-settings__single-tab-content .accordion-head .total-price,
9940 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price,
9941 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .total-price,
9942 .checkout-product-setting-tab__content-wrapper .accordion-head .total-price {
9943 width: 120px;
9944 text-align: right;
9945 }
9946 .step-settings__single-tab-content .accordion-footer .total-price span,
9947 .step-settings__single-tab-content .product-single__accordion-head .total-price span,
9948 .step-settings__single-tab-content .accordion-head .total-price span,
9949 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price span,
9950 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .total-price span,
9951 .checkout-product-setting-tab__content-wrapper .accordion-head .total-price span {
9952 color: #363B4E;
9953 font-size: 14px;
9954 line-height: 14px;
9955 }
9956 .step-settings__single-tab-content .accordion-footer .product-action,
9957 .step-settings__single-tab-content .product-single__accordion-head .product-action,
9958 .step-settings__single-tab-content .accordion-head .product-action,
9959 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-action,
9960 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action,
9961 .checkout-product-setting-tab__content-wrapper .accordion-head .product-action {
9962 width: 60px;
9963 text-align: right;
9964 }
9965 .step-settings__single-tab-content .product__single-accordion,
9966 .checkout-product-setting-tab__content-wrapper .product__single-accordion {
9967 border-top: 1px solid #EEF0F3;
9968 position: relative;
9969 }
9970 .step-settings__single-tab-content .product__single-accordion.ui-sortable-helper,
9971 .checkout-product-setting-tab__content-wrapper .product__single-accordion.ui-sortable-helper {
9972 background: #ececec;
9973 }
9974 .step-settings__single-tab-content .product-single__accordion-head,
9975 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head {
9976 padding: 14px 30px;
9977 position: relative;
9978 }
9979 .step-settings__single-tab-content .product-single__accordion-head .accordion-col,
9980 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col {
9981 font-size: 14px;
9982 line-height: 16px;
9983 color: #7A8B9A;
9984 }
9985 .step-settings__single-tab-content .product-single__accordion-head .accordion-col span,
9986 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col span {
9987 color: #7A8B9A;
9988 }
9989 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select,
9990 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input,
9991 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select,
9992 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input {
9993 font-size: 14px;
9994 line-height: 16px;
9995 color: #363B4E;
9996 }
9997 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select::placeholder,
9998 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input::placeholder,
9999 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select::placeholder,
10000 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input::placeholder {
10001 color: #363B4E;
10002 }
10003 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select:-ms-input-placeholder,
10004 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input:-ms-input-placeholder,
10005 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select:-ms-input-placeholder,
10006 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input:-ms-input-placeholder {
10007 color: #363B4E;
10008 }
10009 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select::-ms-input-placeholder,
10010 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input::-ms-input-placeholder,
10011 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select::-ms-input-placeholder,
10012 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input::-ms-input-placeholder {
10013 color: #363B4E;
10014 }
10015 .step-settings__single-tab-content .product-single__accordion-head .product-name ul,
10016 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul {
10017 display: flex;
10018 align-items: center;
10019 }
10020 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-img a,
10021 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-img a {
10022 display: block;
10023 }
10024 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-img img,
10025 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-img img {
10026 width: 36px;
10027 height: 36px;
10028 object-fit: cover;
10029 border-radius: 50%;
10030 }
10031 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title,
10032 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title {
10033 padding-left: 12px;
10034 width: calc(100% - 50px);
10035 }
10036 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title .title,
10037 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title .title {
10038 font-weight: 500;
10039 font-size: 14px;
10040 line-height: 16px;
10041 color: #363B4E;
10042 }
10043 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title .title:hover,
10044 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title .title:hover {
10045 text-decoration: underline;
10046 }
10047 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title .price,
10048 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title .price {
10049 display: block;
10050 font-size: 12px;
10051 line-height: 14px;
10052 color: #363B4E;
10053 margin-top: 4px;
10054 }
10055 .step-settings__single-tab-content .product-single__accordion-head .product-quantity input[type=number],
10056 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-quantity input[type=number] {
10057 min-width: auto;
10058 border-color: #EEF0F3;
10059 border-radius: 8px;
10060 padding: 5px 10px;
10061 height: 30px;
10062 width: 63px;
10063 }
10064 .step-settings__single-tab-content .product-single__accordion-head .product-action,
10065 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action {
10066 display: flex;
10067 }
10068 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-edit,
10069 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-delete,
10070 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-edit,
10071 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-delete {
10072 width: 30px;
10073 height: 30px;
10074 display: flex;
10075 align-items: center;
10076 justify-content: flex-end;
10077 background: transparent;
10078 border: none;
10079 cursor: pointer;
10080 }
10081 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-edit svg,
10082 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-delete svg,
10083 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-edit svg,
10084 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-delete svg {
10085 display: block;
10086 }
10087 .step-settings__single-tab-content .accordion-footer,
10088 .checkout-product-setting-tab__content-wrapper .accordion-footer {
10089 border-top: 1px solid #EEF0F3;
10090 padding: 14px 30px;
10091 justify-content: flex-end;
10092 }
10093 .step-settings__single-tab-content .accordion-footer .total-price,
10094 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price {
10095 display: flex;
10096 justify-content: flex-end;
10097 color: #363B4E;
10098 font-size: 16px;
10099 font-weight: 600;
10100 line-height: 1;
10101 }
10102 .step-settings__single-tab-content .accordion-footer .total-price span,
10103 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price span {
10104 letter-spacing: 0.857143px;
10105 font-weight: 700;
10106 margin-left: 4px;
10107 font-size: 12px;
10108 }
10109 .step-settings__single-tab-content .product__single-accordion .product-single__accordion-body,
10110 .checkout-product-setting-tab__content-wrapper .product__single-accordion .product-single__accordion-body {
10111 display: none;
10112 }
10113 .step-settings__single-tab-content .product__single-accordion.active,
10114 .checkout-product-setting-tab__content-wrapper .product__single-accordion.active {
10115 background: rgba(110, 66, 211, 0.07);
10116 border-top-color: transparent;
10117 }
10118 .step-settings__single-tab-content .product__single-accordion.active::before,
10119 .checkout-product-setting-tab__content-wrapper .product__single-accordion.active::before {
10120 background-color: #6E42D3;
10121 }
10122 .step-settings__single-tab-content .product-single__accordion-body,
10123 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body {
10124 padding: 0 25px 25px;
10125 }
10126 .step-settings__single-tab-content .product-single__accordion-body-content,
10127 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content {
10128 display: flex;
10129 flex-flow: row wrap;
10130 background: #fff;
10131 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
10132 border-radius: 10px;
10133 }
10134 .step-settings__single-tab-content .product-single__accordion-body-content .subtext-settings,
10135 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings {
10136 width: 50%;
10137 padding: 20px 60px 20px 25px;
10138 border-right: 1px solid #E5E8F3;
10139 }
10140 .step-settings__single-tab-content .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper,
10141 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper {
10142 align-items: flex-start;
10143 }
10144 .step-settings__single-tab-content .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper label,
10145 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper label {
10146 margin-top: 11px;
10147 }
10148 .step-settings__single-tab-content .product-single__accordion-body-content .highlights,
10149 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .highlights {
10150 width: 50%;
10151 padding: 20px 20px 20px 60px;
10152 }
10153 .step-settings__single-tab-content .product-single__accordion-body-content .wpfnl-field-wrapper label,
10154 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-field-wrapper label {
10155 width: 145px;
10156 }
10157 .step-settings__single-tab-content .product-single__accordion-body-content .wpfnl-fields,
10158 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-fields {
10159 max-width: 100%;
10160 width: calc(100% - 145px);
10161 }
10162 .step-settings__single-tab-content .no-product-notice,
10163 .checkout-product-setting-tab__content-wrapper .no-product-notice {
10164 text-align: center;
10165 padding: 15px 10px;
10166 }
10167 .step-settings__single-tab-content .wpfnl-discount-settings,
10168 .checkout-product-setting-tab__content-wrapper .wpfnl-discount-settings {
10169 border: 1px solid #EEF0F3;
10170 box-shadow: none;
10171 border-radius: 10px;
10172 margin-top: 30px;
10173 padding: 30px;
10174 }
10175 .step-settings__single-tab-content .wpfnl-discount-settings .non-input-field,
10176 .checkout-product-setting-tab__content-wrapper .wpfnl-discount-settings .non-input-field {
10177 cursor: not-allowed;
10178 background-color: #F6F5FA;
10179 font-size: 14px;
10180 color: #7A8B9A;
10181 padding: 13px 15px;
10182 height: 44px;
10183 width: 100%;
10184 min-width: 190px;
10185 border-radius: 6px;
10186 display: block;
10187 border: 1px solid #EBEDF0;
10188 }
10189 .step-settings__single-tab-content .wpfnl-discount-settings[data-tour=yes] #discount-options,
10190 .checkout-product-setting-tab__content-wrapper .wpfnl-discount-settings[data-tour=yes] #discount-options {
10191 z-index: 4;
10192 position: relative;
10193 }
10194 .step-settings__single-tab-content .wpfnl-single-settings-control,
10195 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control {
10196 display: flex;
10197 flex-flow: row wrap;
10198 align-items: center;
10199 justify-content: space-between;
10200 gap: 15px;
10201 border-bottom: 1px solid #EEF0F3;
10202 padding: 24px 0;
10203 }
10204 .step-settings__single-tab-content .wpfnl-single-settings-control:first-child,
10205 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control:first-child {
10206 padding-top: 0;
10207 }
10208 .step-settings__single-tab-content .wpfnl-single-settings-control:last-child,
10209 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control:last-child {
10210 border-bottom: none;
10211 padding-bottom: 0;
10212 }
10213 .step-settings__single-tab-content .wpfnl-single-settings-control.wpnfl-align-top,
10214 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.wpnfl-align-top {
10215 align-items: flex-start;
10216 }
10217 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-title,
10218 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-title {
10219 width: calc(55% - 15px);
10220 }
10221 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-title h4,
10222 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-title h4 {
10223 color: #363B4E;
10224 font-size: 16px;
10225 font-weight: 500;
10226 line-height: 1.3;
10227 }
10228 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-title p,
10229 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-title p {
10230 color: #525562;
10231 font-size: 14px;
10232 font-weight: 400;
10233 line-height: 1.4;
10234 margin-top: 3px;
10235 }
10236 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field,
10237 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field {
10238 width: 45%;
10239 max-width: 250px;
10240 display: flex;
10241 flex-flow: column;
10242 align-items: flex-end;
10243 gap: 12px;
10244 }
10245 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field > input:not([type=checkbox], [type=radio]), .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field > select,
10246 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field > input:not([type=checkbox], [type=radio]),
10247 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field > select {
10248 width: 250px;
10249 height: 44px;
10250 border-radius: 10px;
10251 border-color: #EBEDF0;
10252 margin-left: auto;
10253 color: #525562;
10254 }
10255 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .settings-control-price,
10256 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .settings-control-price {
10257 width: 250px;
10258 height: 44px;
10259 border-radius: 10px;
10260 border-color: #EBEDF0;
10261 margin-left: auto;
10262 background: #F6F5FA;
10263 padding: 10px 15px;
10264 display: flex;
10265 flex-flow: column;
10266 justify-content: center;
10267 }
10268 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .wpfnl-switcher .pro-tag-icon,
10269 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .wpfnl-switcher .pro-tag-icon {
10270 position: absolute;
10271 top: 0;
10272 left: -30px;
10273 }
10274 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox,
10275 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox {
10276 position: relative;
10277 }
10278 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox .pro-tag-icon,
10279 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox .pro-tag-icon {
10280 position: absolute;
10281 top: 0;
10282 left: -30px;
10283 }
10284 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender,
10285 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender {
10286 position: absolute;
10287 }
10288 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker,
10289 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker {
10290 border: 1px solid #eef0f3;
10291 border-radius: 10px;
10292 padding: 8px;
10293 }
10294 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title,
10295 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
10296 display: flex;
10297 }
10298 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title select,
10299 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title select {
10300 width: auto;
10301 min-width: max-content;
10302 flex: 1;
10303 height: 28px;
10304 min-height: auto;
10305 margin: 0;
10306 }
10307 .step-settings__single-tab-content .wpfnl-single-settings-control.enable-discount,
10308 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.enable-discount {
10309 border-bottom: 0;
10310 padding-bottom: 0;
10311 }
10312 .step-settings__single-tab-content .wpfnl-single-settings-control.discount .settings-control-field,
10313 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.discount .settings-control-field {
10314 flex-flow: row;
10315 width: 100%;
10316 max-width: 100%;
10317 justify-content: flex-end;
10318 }
10319 .step-settings__single-tab-content .wpfnl-single-settings-control.discount .settings-control-field label,
10320 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.discount .settings-control-field label {
10321 display: block;
10322 margin-bottom: 6px;
10323 }
10324 .step-settings__single-tab-content .wpfnl-single-settings-control.discount .settings-control-field input[type=text],
10325 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.discount .settings-control-field input[type=text] {
10326 height: 44px;
10327 }
10328 .step-settings__single-tab-content .wpfnl-single-settings-control.no-border,
10329 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.no-border {
10330 padding-bottom: 0;
10331 border-bottom: none;
10332 }
10333 .step-settings__single-tab-content .no-product,
10334 .checkout-product-setting-tab__content-wrapper .no-product {
10335 display: flex;
10336 flex-flow: column;
10337 align-items: center;
10338 justify-content: center;
10339 padding: 30px 24px;
10340 gap: 14px;
10341 }
10342 .step-settings__single-tab-content .no-product p,
10343 .checkout-product-setting-tab__content-wrapper .no-product p {
10344 color: #363B4E;
10345 font-size: 16px;
10346 font-weight: 500;
10347 line-height: 1;
10348 }
10349 .step-settings__single-tab-content .disable-payment-gateways .settings-control-field,
10350 .checkout-product-setting-tab__content-wrapper .disable-payment-gateways .settings-control-field {
10351 gap: 10px;
10352 align-items: flex-start;
10353 max-width: 140px;
10354 }
10355 .step-settings__single-tab-content .disable-payment-gateways .settings-control-field.is-not-pro,
10356 .checkout-product-setting-tab__content-wrapper .disable-payment-gateways .settings-control-field.is-not-pro {
10357 max-width: max-content;
10358 }
10359 .step-settings__single-tab-content .wpfnl-additional-replacement-options,
10360 .step-settings__single-tab-content .checkout-product-options,
10361 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options,
10362 .checkout-product-setting-tab__content-wrapper .checkout-product-options {
10363 margin-top: 30px;
10364 border-radius: 10px;
10365 padding: 26px 30px 30px;
10366 border: 1px solid #EEF0F3;
10367 box-shadow: none;
10368 }
10369 .step-settings__single-tab-content .wpfnl-additional-replacement-options .additional-options,
10370 .step-settings__single-tab-content .checkout-product-options .additional-options,
10371 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .additional-options,
10372 .checkout-product-setting-tab__content-wrapper .checkout-product-options .additional-options {
10373 width: 100%;
10374 margin-right: 12px;
10375 }
10376 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox label:before,
10377 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox label:before,
10378 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox label:before,
10379 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox label:before {
10380 border-color: #CDD2E6;
10381 }
10382 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox input[type=checkbox]:checked + label::before,
10383 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox input[type=checkbox]:checked + label::before,
10384 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox input[type=checkbox]:checked + label::before,
10385 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox input[type=checkbox]:checked + label::before {
10386 border-color: #6E42D3;
10387 }
10388 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label:before,
10389 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox.disabled label:before,
10390 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label:before,
10391 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox.disabled label:before {
10392 border-color: #E5E8F3 !important;
10393 background-color: rgba(0, 0, 0, 0.2196078431) !important;
10394 cursor: not-allowed;
10395 }
10396 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label::after,
10397 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox.disabled label::after,
10398 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label::after,
10399 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox.disabled label::after {
10400 display: none;
10401 }
10402 .step-settings__single-tab-content .wpfnl-additional-replacement-options .option-title,
10403 .step-settings__single-tab-content .checkout-product-options .option-title,
10404 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .option-title,
10405 .checkout-product-setting-tab__content-wrapper .checkout-product-options .option-title {
10406 margin-bottom: 18px;
10407 color: #7A8B9A;
10408 font-size: 14px;
10409 font-weight: 600;
10410 line-height: 1;
10411 letter-spacing: 1.68px;
10412 text-transform: uppercase;
10413 }
10414 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper,
10415 .step-settings__single-tab-content .checkout-product-options .options-wrapper,
10416 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper,
10417 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper {
10418 padding: 0 !important;
10419 }
10420 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #checkout-coupon[data-tour=yes],
10421 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #auto-coupon[data-tour=yes],
10422 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #enable-quantity-selection[data-tour=yes],
10423 .step-settings__single-tab-content .checkout-product-options .options-wrapper #checkout-coupon[data-tour=yes],
10424 .step-settings__single-tab-content .checkout-product-options .options-wrapper #auto-coupon[data-tour=yes],
10425 .step-settings__single-tab-content .checkout-product-options .options-wrapper #enable-quantity-selection[data-tour=yes],
10426 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #checkout-coupon[data-tour=yes],
10427 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #auto-coupon[data-tour=yes],
10428 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #enable-quantity-selection[data-tour=yes],
10429 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #checkout-coupon[data-tour=yes],
10430 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #auto-coupon[data-tour=yes],
10431 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #enable-quantity-selection[data-tour=yes] {
10432 position: relative;
10433 z-index: 4;
10434 }
10435 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes],
10436 .step-settings__single-tab-content .checkout-product-options .options-wrapper #disable-payments[data-tour=yes],
10437 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes],
10438 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #disable-payments[data-tour=yes] {
10439 position: relative;
10440 z-index: 4;
10441 }
10442 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes] label,
10443 .step-settings__single-tab-content .checkout-product-options .options-wrapper #disable-payments[data-tour=yes] label,
10444 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes] label,
10445 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #disable-payments[data-tour=yes] label {
10446 color: #fff;
10447 }
10448 .step-settings__single-tab-content .wpfnl-additional-replacement-options select#choose-coupon,
10449 .step-settings__single-tab-content .checkout-product-options select#choose-coupon,
10450 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options select#choose-coupon,
10451 .checkout-product-setting-tab__content-wrapper .checkout-product-options select#choose-coupon {
10452 display: none;
10453 }
10454 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box,
10455 .step-settings__single-tab-content .checkout-product-options .coupon-box,
10456 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box,
10457 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box {
10458 height: 44px;
10459 width: 250px;
10460 border-radius: 6px;
10461 position: relative;
10462 display: flex;
10463 position: relative;
10464 }
10465 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .search-icon,
10466 .step-settings__single-tab-content .checkout-product-options .coupon-box .search-icon,
10467 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .search-icon,
10468 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .search-icon {
10469 position: absolute;
10470 left: 12px;
10471 top: 13px;
10472 z-index: 100;
10473 }
10474 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .search-icon svg,
10475 .step-settings__single-tab-content .checkout-product-options .coupon-box .search-icon svg,
10476 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .search-icon svg,
10477 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .search-icon svg {
10478 display: block;
10479 }
10480 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .select2.select2-container.select2-container--default,
10481 .step-settings__single-tab-content .checkout-product-options .coupon-box .select2.select2-container.select2-container--default,
10482 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .select2.select2-container.select2-container--default,
10483 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .select2.select2-container.select2-container--default {
10484 width: 100% !important;
10485 border: none;
10486 }
10487 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .select2-container--default .select2-selection--single,
10488 .step-settings__single-tab-content .checkout-product-options .coupon-box .select2-container--default .select2-selection--single,
10489 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .select2-container--default .select2-selection--single,
10490 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .select2-container--default .select2-selection--single {
10491 background-color: transparent;
10492 border: none;
10493 height: auto;
10494 }
10495 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .select2-selection__rendered,
10496 .step-settings__single-tab-content .checkout-product-options .coupon-box .select2-selection__rendered,
10497 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .select2-selection__rendered,
10498 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .select2-selection__rendered {
10499 padding: 12px 15px 11px 35px;
10500 width: 100%;
10501 border-radius: 10px;
10502 white-space: pre;
10503 overflow: hidden;
10504 text-overflow: ellipsis;
10505 display: block;
10506 -webkit-line-clamp: 3;
10507 -webkit-box-orient: vertical;
10508 line-height: normal;
10509 border: 1px solid #e9e7e7;
10510 background: #ffffff;
10511 }
10512 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-additional-replacement-options,
10513 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-additional-replacement-options {
10514 margin-top: 0;
10515 }
10516 .step-settings__single-tab-content .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper,
10517 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper {
10518 width: 100%;
10519 }
10520 .step-settings__single-tab-content .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper .wpfnl-fields,
10521 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper .wpfnl-fields {
10522 width: 100%;
10523 max-width: 270px;
10524 }
10525 .step-settings__single-tab-content .enabled-replace-settings,
10526 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings {
10527 margin-top: 24px;
10528 display: grid;
10529 grid-template-columns: repeat(3, 1fr);
10530 background-color: #F6F5FA;
10531 gap: 20px;
10532 padding: 20px 24px;
10533 border-radius: 10px;
10534 }
10535 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option,
10536 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option {
10537 position: relative;
10538 }
10539 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option > input[type=radio],
10540 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option > input[type=radio] {
10541 display: none;
10542 }
10543 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option .option-label,
10544 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option .option-label {
10545 border-radius: 10px;
10546 border: 1px solid #E4E0F0;
10547 background-color: #FFF;
10548 cursor: pointer;
10549 padding: 24px;
10550 display: block;
10551 height: 100%;
10552 }
10553 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option .radio-point,
10554 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option .radio-point {
10555 position: absolute;
10556 top: 16px;
10557 right: 16px;
10558 }
10559 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option .radio-point circle:first-child,
10560 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option .radio-point circle:first-child {
10561 transform: scale(0);
10562 transform-origin: center;
10563 transition: all 0.3s ease;
10564 }
10565 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label,
10566 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label {
10567 border-color: #6E42D3;
10568 }
10569 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label .radio-point circle:first-child,
10570 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label .radio-point circle:first-child {
10571 transform: scale(1);
10572 }
10573 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option h4,
10574 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option h4 {
10575 color: #363B4E;
10576 font-size: 16px;
10577 font-weight: 500;
10578 line-height: 1.37;
10579 margin-bottom: 8px;
10580 max-width: 95%;
10581 }
10582 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option p,
10583 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option p {
10584 color: #525562;
10585 font-size: 14px;
10586 font-weight: 400;
10587 line-height: 1.4;
10588 }
10589
10590 .step-settings__single-tab-content.product .product-head .product-search {
10591 margin-left: 0;
10592 }
10593
10594 @media only screen and (max-width: 1499px) {
10595 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings {
10596 padding: 20px;
10597 }
10598 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .highlights {
10599 padding: 20px;
10600 }
10601 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-field-wrapper label {
10602 width: 111px;
10603 }
10604 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-fields {
10605 width: calc(100% - 111px);
10606 }
10607 }
10608 @media only screen and (max-width: 1299px) {
10609 .step-settings__single-tab-content .wpfnl-additional-replacement-options,
10610 .checkout-product-setting-tab__content-wrapper .checkout-product-options {
10611 padding: 20px;
10612 }
10613 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper,
10614 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper {
10615 padding: 15px;
10616 }
10617 }
10618 @media only screen and (max-width: 1199px) {
10619 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name,
10620 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-name,
10621 .checkout-product-setting-tab__content-wrapper .accordion-head .product-name {
10622 width: 220px;
10623 }
10624 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content {
10625 display: block;
10626 }
10627 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings {
10628 width: 100%;
10629 }
10630 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .highlights {
10631 padding: 0 20px 20px;
10632 width: 100%;
10633 }
10634 .step-settings__single-tab-content .wpfnl-additional-replacement-options,
10635 .checkout-product-setting-tab__content-wrapper .checkout-product-options {
10636 display: block;
10637 }
10638 .step-settings__single-tab-content .wpfnl-additional-replacement-options .additional-options,
10639 .checkout-product-setting-tab__content-wrapper .checkout-product-options .additional-options {
10640 width: 100%;
10641 margin-right: 0;
10642 margin-bottom: 24px;
10643 }
10644 .step-settings__single-tab-content .wpfnl-additional-replacement-options .variation-options,
10645 .checkout-product-setting-tab__content-wrapper .checkout-product-options .variation-options {
10646 width: 100%;
10647 margin-left: 0;
10648 }
10649 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper,
10650 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper {
10651 height: auto;
10652 }
10653 }
10654 @media only screen and (max-width: 991px) {
10655 .checkout-product-setting-tab__content-wrapper .product-head .product-search {
10656 width: 190px;
10657 }
10658 }
10659 .order-bump-accordion-wrapper {
10660 border: 1px solid #EEF0F3;
10661 border-radius: 10px;
10662 }
10663 .order-bump-accordion-wrapper .order-bump-header {
10664 display: flex;
10665 align-items: center;
10666 justify-content: space-between;
10667 background: #FFFFFF;
10668 border-radius: 10px 10px 0px 0px;
10669 padding: 15px 24px;
10670 border-bottom: 1px solid #EEF0F3;
10671 }
10672 .order-bump-accordion-wrapper .order-bump-header .title {
10673 font-weight: 500;
10674 font-size: 16px;
10675 line-height: 19px;
10676 color: #363B4E;
10677 text-transform: capitalize;
10678 margin-right: 10px;
10679 }
10680 .order-bump-accordion-wrapper .order-bump-header .btn-default {
10681 position: relative;
10682 }
10683 .order-bump-accordion-wrapper .order-bump-header .btn-default .pro-tag-icon {
10684 position: static;
10685 margin-left: 4px;
10686 transform: translateY(5px);
10687 display: inline-block;
10688 }
10689 .order-bump-accordion-wrapper .order-bump-header .btn-default:disabled {
10690 opacity: 0.6;
10691 cursor: not-allowed;
10692 }
10693 .order-bump-accordion-wrapper .order-bump-header .btn-default:disabled:hover {
10694 background-color: #6E42D3;
10695 }
10696 .order-bump-accordion-wrapper .order-bump-accordion-header {
10697 width: 100%;
10698 background: #FFFFFF;
10699 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
10700 border-bottom: 1px solid transparent;
10701 border-radius: 10px;
10702 padding: 0 24px;
10703 display: flex;
10704 align-items: center;
10705 justify-content: space-between;
10706 }
10707 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area {
10708 padding: 14px 0;
10709 cursor: pointer;
10710 width: calc(100% - 67px);
10711 }
10712 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .title {
10713 font-weight: 500;
10714 color: #363B4E;
10715 }
10716 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .title small {
10717 color: #7A8B9A;
10718 font-weight: 400;
10719 }
10720 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .icon {
10721 width: 9px;
10722 height: 9px;
10723 display: inline-block;
10724 border: 2px solid #363B4E;
10725 border-top: none;
10726 border-left: none;
10727 transform: rotate(45deg);
10728 transform-origin: center;
10729 position: relative;
10730 top: -1px;
10731 margin-right: 12px;
10732 transition: transform 0.3s ease;
10733 }
10734 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area {
10735 display: flex;
10736 align-items: center;
10737 }
10738 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area .wpfnl-switcher.has-loader {
10739 display: flex;
10740 align-items: center;
10741 }
10742 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area .wpfnl-switcher.has-loader .wpfnl-loader {
10743 display: inline-block;
10744 margin-left: 0;
10745 margin-right: 5px;
10746 }
10747 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area button {
10748 border: none;
10749 cursor: pointer;
10750 text-align: center;
10751 padding: 0 6px;
10752 display: inline-block;
10753 height: 30px;
10754 line-height: 30px;
10755 background-color: transparent;
10756 margin: 0 0 0 2px;
10757 }
10758 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area button.delete-checkout-field svg {
10759 width: 20px;
10760 height: 20px;
10761 }
10762 .order-bump-accordion-wrapper .order-bump-body {
10763 border-radius: 0 0 10px 10px;
10764 }
10765 .order-bump-accordion-wrapper .order-bump-body .wpfnl-order-bump-modal-header,
10766 .order-bump-accordion-wrapper .order-bump-body .wpfnl-order-bump-modal-footer {
10767 display: none;
10768 }
10769 .order-bump-accordion-wrapper .order-bump-body .order-bump-table-header {
10770 background-color: #F6F5FA;
10771 display: grid;
10772 grid-template-columns: 9fr 1fr 1fr;
10773 padding: 15px 24px;
10774 border-bottom: 1px solid #EEF0F3;
10775 }
10776 .order-bump-accordion-wrapper .order-bump-body .order-bump-table-header .oder-bump-table-header-text {
10777 color: #7A8B9A;
10778 font-family: Roboto;
10779 font-size: 14px;
10780 font-style: normal;
10781 font-weight: 400;
10782 line-height: normal;
10783 text-transform: capitalize;
10784 }
10785 .order-bump-accordion-wrapper .order-bump-body .order-bump-table-header .oder-bump-table-header-text.order-bump-actions {
10786 margin-left: auto;
10787 padding-right: 5px;
10788 }
10789 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump {
10790 margin-bottom: 0;
10791 box-shadow: none;
10792 border-bottom: 1px solid #EEF0F3;
10793 border-radius: 0;
10794 }
10795 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump:last-child {
10796 border-radius: 0 0 10px 10px;
10797 border-bottom: none;
10798 }
10799 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump .order-bump-accordion-header {
10800 padding: 0 24px;
10801 border-radius: 0;
10802 display: grid;
10803 grid-template-columns: 9fr 1fr 1fr;
10804 border: none;
10805 }
10806 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump .order-bump-accordion-header .action-area {
10807 justify-content: flex-end;
10808 }
10809 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump:last-child .order-bump-accordion-header {
10810 border-radius: 0 0 10px 10px;
10811 }
10812 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal {
10813 position: absolute;
10814 width: 100%;
10815 max-height: 300%;
10816 top: 7px;
10817 background: #fff;
10818 left: 0px;
10819 z-index: 2;
10820 padding: 24px;
10821 }
10822 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-header {
10823 display: flex;
10824 align-items: center;
10825 justify-content: space-between;
10826 margin-bottom: 20px;
10827 }
10828 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-header .drawer-title {
10829 display: flex;
10830 align-items: center;
10831 gap: 10px;
10832 }
10833 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-header .drawer-title .wpfnl-back-icon {
10834 border-radius: 10px;
10835 border: 1px solid #EBEDF0;
10836 background: #FFF;
10837 display: flex;
10838 align-items: center;
10839 justify-content: center;
10840 padding: 7px;
10841 cursor: pointer;
10842 }
10843 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-header .drawer-title p {
10844 color: #363B4E;
10845 font-family: Roboto;
10846 font-size: 18px;
10847 font-style: normal;
10848 font-weight: 600;
10849 line-height: normal;
10850 }
10851 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-header .wpfnl-drawer-close {
10852 border-radius: 10px;
10853 border: 1px solid #EBEDF0;
10854 cursor: pointer;
10855 padding: 12px;
10856 display: flex;
10857 align-items: center;
10858 justify-content: center;
10859 }
10860 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-footer {
10861 display: flex;
10862 align-items: center;
10863 justify-content: flex-end;
10864 margin-top: 30px;
10865 }
10866 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-footer .wpfnl-button-wrapper {
10867 display: flex;
10868 align-items: center;
10869 gap: 14px;
10870 }
10871 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-footer .wpfnl-button-wrapper button.outline {
10872 color: #000;
10873 background: none;
10874 border: 1px solid #E4E6EB;
10875 padding: 11px 20px;
10876 min-width: auto;
10877 line-height: normal;
10878 }
10879 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .wpfnl-order-bump-modal-footer .wpfnl-button-wrapper button:disabled {
10880 opacity: 0.5;
10881 cursor: not-allowed;
10882 }
10883 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content {
10884 padding: 0;
10885 border-radius: 10px;
10886 border: 1px solid #EEF0F3;
10887 }
10888 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-settings-area {
10889 width: 60%;
10890 margin-right: 0;
10891 background: #fff;
10892 border-bottom-left-radius: 8px;
10893 border-right: 1px solid #EEF0F3;
10894 align-self: stretch;
10895 }
10896 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-settings-area .order-bump-settings.enable-order-bump {
10897 padding: 14px 20px;
10898 border-right: 1px solid #EBEDF0;
10899 }
10900 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-settings-area .order-bump-settings.enable-order-bump .wpfnl-field-wrapper {
10901 gap: 10px;
10902 }
10903 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-template-preview-area .wpfnl-order-bump__template-style1 {
10904 border: none;
10905 }
10906 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-template-preview-area div[class^=wpfnl-order] {
10907 max-width: calc(100% - 40px);
10908 margin: 0 auto;
10909 }
10910 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal[data-tour=yes] {
10911 z-index: inherit;
10912 }
10913 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #ob-template-select[data-tour=yes] {
10914 z-index: 4;
10915 position: relative;
10916 }
10917 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #wpfnl-save-ob[data-tour=yes] {
10918 z-index: 4;
10919 position: relative;
10920 opacity: 1;
10921 border: 1px solid #fff;
10922 }
10923 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #ob-position-select[data-tour=yes] {
10924 z-index: 4;
10925 position: relative;
10926 }
10927 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .discount-settings #wpfnl-product-replace .wpfnl-fields .wpfnl-checkbox label[data-tour=yes] {
10928 z-index: 4;
10929 position: relative;
10930 }
10931 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #product-title[data-tour=yes] {
10932 z-index: 4;
10933 position: relative;
10934 }
10935 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal[data-tour=no] {
10936 z-index: 1;
10937 }
10938 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #ob-template-select[data-tour=no] {
10939 z-index: 1;
10940 position: relative;
10941 }
10942 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #wpfnl-save-ob[data-tour=no] {
10943 z-index: 1;
10944 position: relative;
10945 }
10946 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #ob-position-select[data-tour=no] {
10947 z-index: 1;
10948 position: relative;
10949 }
10950 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .discount-settings #wpfnl-product-replace .wpfnl-fields .wpfnl-checkbox label[data-tour=no] {
10951 z-index: 1;
10952 position: relative;
10953 }
10954 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #product-title[data-tour=yes] {
10955 z-index: 4;
10956 position: relative;
10957 }
10958 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .upload-product-image .wpfnl-fields {
10959 width: calc(100% - 180px);
10960 }
10961 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump .order-bump-settings .wpfnl-field-wrapper .vc-color-wrap {
10962 border-radius: 50%;
10963 }
10964 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.no-more-one {
10965 border-radius: 0 0 10px 10px;
10966 }
10967 .order-bump-accordion-wrapper .order-bump-body .reset-arrow-color,
10968 .order-bump-accordion-wrapper .order-bump-body .reset-obbg {
10969 margin-left: 1px;
10970 padding: 4px 5px;
10971 position: relative;
10972 top: -1px;
10973 border: none;
10974 border-radius: 3px;
10975 background: transparent;
10976 color: #fff;
10977 font-size: 12px;
10978 line-height: 1;
10979 cursor: pointer;
10980 }
10981 .order-bump-accordion-wrapper .order-bump-body .reset-arrow-color svg,
10982 .order-bump-accordion-wrapper .order-bump-body .reset-obbg svg {
10983 width: 16px;
10984 height: 16px;
10985 display: block;
10986 }
10987 .order-bump-accordion-wrapper .order-bump-body .reset-arrow-color {
10988 top: 3px;
10989 }
10990
10991 .wpfnl-back-icon {
10992 border-radius: 10px;
10993 border: 1px solid #EBEDF0;
10994 background: #FFF;
10995 display: flex;
10996 align-items: center;
10997 justify-content: center;
10998 padding: 7px !important;
10999 cursor: pointer;
11000 margin-right: 10px;
11001 }
11002
11003 .wpfnl-checkbox label:before {
11004 border: 1px solid #EBEDF0;
11005 background-color: none;
11006 }
11007
11008 .checkout-order-bump-setting-tab__content-wrapper {
11009 background: #FFFFFF;
11010 border: 1px solid transparent;
11011 box-shadow: 0px 5px 20px rgba(148, 135, 180, 0.15);
11012 border-radius: 10px;
11013 margin-bottom: 15px;
11014 }
11015 .checkout-order-bump-setting-tab__content-wrapper:last-child {
11016 margin-bottom: 0;
11017 }
11018 .checkout-order-bump-setting-tab__content-wrapper .order-bump-accordion-content {
11019 display: none;
11020 flex-flow: row wrap;
11021 align-items: flex-start;
11022 padding: 24px;
11023 }
11024 .checkout-order-bump-setting-tab__content-wrapper .order-bump-accordion-content.show-content {
11025 display: flex;
11026 }
11027 .checkout-order-bump-setting-tab__content-wrapper.no-order-bump {
11028 text-align: center;
11029 padding: 12px 24px;
11030 }
11031 .checkout-order-bump-setting-tab__content-wrapper.no-more-one {
11032 padding: 18px 24px;
11033 color: #272727;
11034 display: flex;
11035 flex-flow: row wrap;
11036 align-items: center;
11037 justify-content: space-between;
11038 }
11039 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .hints {
11040 color: #272727;
11041 margin: 0;
11042 width: calc(100% - 168px);
11043 font-style: normal;
11044 padding-right: 14px;
11045 }
11046 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .hints .highlight-color {
11047 color: #ee5f5a;
11048 }
11049 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .hints .pro-tag {
11050 color: #ffffff;
11051 }
11052 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .pro-link {
11053 font-weight: 500;
11054 text-decoration: underline;
11055 color: #6e42d3;
11056 width: 168px;
11057 }
11058 .checkout-order-bump-setting-tab__content-wrapper.expanded-orderbump .order-bump-accordion-header {
11059 box-shadow: none;
11060 border-bottom-color: #6E42D3;
11061 border-bottom-right-radius: 0;
11062 border-bottom-left-radius: 0;
11063 }
11064 .checkout-order-bump-setting-tab__content-wrapper.expanded-orderbump .order-bump-accordion-header .title-area .icon {
11065 top: 1px;
11066 transform: rotate(-135deg);
11067 }
11068 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings {
11069 border-top: 1px solid #E5E8F3;
11070 }
11071 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper {
11072 margin-bottom: 25px;
11073 }
11074 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper:last-child {
11075 margin-bottom: 0;
11076 }
11077 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper label {
11078 font-size: 14px;
11079 line-height: 16px;
11080 }
11081 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper select {
11082 padding: 5px 9px;
11083 }
11084 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .hints.mobile {
11085 display: none;
11086 }
11087 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label {
11088 width: 250px;
11089 position: relative;
11090 padding-right: 30px;
11091 }
11092 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label .color-picker {
11093 position: absolute;
11094 right: 10px;
11095 top: -4px;
11096 line-height: 1;
11097 }
11098 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .vc-color-wrap {
11099 width: 25px;
11100 }
11101 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.top-align .color-picker {
11102 top: 6px;
11103 }
11104 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.orderbump-bg .vc-color-wrap {
11105 position: relative;
11106 top: -5px;
11107 }
11108 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
11109 top: -2px;
11110 }
11111 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields {
11112 width: 50%;
11113 }
11114 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields select {
11115 border: 1px solid #EBEDF0;
11116 padding-top: 3px;
11117 }
11118 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields .icp__input {
11119 border-radius: 0 !important;
11120 border: 1px solid #e5e5e5;
11121 background: #000000;
11122 }
11123 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-box {
11124 padding: 30px 0;
11125 margin: 0;
11126 box-shadow: none;
11127 background: transparent;
11128 border-radius: 0;
11129 }
11130 .checkout-order-bump-setting-tab__content-wrapper .hints {
11131 word-break: break-word;
11132 }
11133 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .enable-order-bump {
11134 border-top: none;
11135 padding-bottom: 30px;
11136 }
11137 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .enable-order-bump .wpfnl-fields input {
11138 width: 97%;
11139 }
11140 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area > .title {
11141 position: relative;
11142 font-weight: 500;
11143 font-size: 16px;
11144 line-height: 19px;
11145 color: #363B4E;
11146 background-color: #F7F7FA;
11147 padding: 18px 30px 18px 30px;
11148 border-radius: 10px 10px 0 0;
11149 border-bottom: 1px solid #EEF0F3;
11150 }
11151 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon,
11152 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product {
11153 border: 1px solid #E9E9EF;
11154 border-radius: 6px;
11155 height: 36px;
11156 position: relative;
11157 display: flex;
11158 }
11159 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .wpfnl-ob-replace-product-search,
11160 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .wpfnl-ob-product-search,
11161 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .wpfnl-ob-replace-product-search,
11162 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .wpfnl-ob-product-search {
11163 display: none;
11164 }
11165 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon svg,
11166 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product svg {
11167 position: absolute;
11168 left: 10px;
11169 top: 10px;
11170 }
11171 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-container--default .select2-selection--single .select2-selection__arrow,
11172 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-container--default .select2-selection--single .select2-selection__arrow {
11173 display: none;
11174 }
11175 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2.select2-container.select2-container--default,
11176 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2.select2-container.select2-container--default {
11177 width: 100% !important;
11178 }
11179 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-container--default .select2-selection--single,
11180 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-container--default .select2-selection--single {
11181 background-color: transparent;
11182 border: none;
11183 height: auto;
11184 }
11185 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-selection__rendered,
11186 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-selection__rendered {
11187 padding: 8px 12px 7px;
11188 width: 100%;
11189 border-radius: 6px;
11190 white-space: pre;
11191 overflow: hidden;
11192 text-overflow: ellipsis;
11193 display: block;
11194 -webkit-line-clamp: 3;
11195 -webkit-box-orient: vertical;
11196 line-height: normal;
11197 }
11198 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-selection__rendered .select2-selection__placeholder,
11199 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-selection__rendered .select2-selection__placeholder {
11200 color: #7A8B9A;
11201 }
11202 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon.product-selected .select2-selection__rendered,
11203 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product.product-selected .select2-selection__rendered {
11204 display: flex;
11205 align-items: center;
11206 flex-flow: row-reverse;
11207 justify-content: space-between;
11208 }
11209 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-container.select2-container--default.select2-container--open,
11210 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-container.select2-container--default.select2-container--open {
11211 border: none;
11212 }
11213 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-selection__clear,
11214 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-selection__clear {
11215 cursor: pointer;
11216 padding: 0 2px;
11217 }
11218 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product[data-tour=yes] {
11219 z-index: 4;
11220 position: relative;
11221 }
11222 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product {
11223 height: auto;
11224 }
11225 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__rendered {
11226 display: flex;
11227 flex-flow: row wrap;
11228 gap: 6px;
11229 padding: 5px 7px 5px;
11230 }
11231 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__rendered .select2-selection__clear {
11232 display: none;
11233 }
11234 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__choice {
11235 border: 1px solid #EBEDF0;
11236 display: inline;
11237 padding: 7px 4px 7px 10px;
11238 border-radius: 6px;
11239 color: #363B4E;
11240 font-size: 13px;
11241 display: inline-flex;
11242 gap: 5px;
11243 flex-flow: row-reverse;
11244 }
11245 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__choice .select2-selection__choice__remove {
11246 padding: 0px 6px;
11247 line-height: 1;
11248 display: flex;
11249 align-items: center;
11250 cursor: pointer;
11251 }
11252 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product input.select2-search__field {
11253 width: auto !important;
11254 padding: 0 8px;
11255 height: auto;
11256 min-width: 80px;
11257 border: none;
11258 }
11259 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn {
11260 background-color: #F6F5FA;
11261 border-radius: 10px;
11262 padding: 20px;
11263 margin-top: 16px;
11264 display: grid;
11265 grid-template-columns: repeat(2, 1fr);
11266 gap: 20px;
11267 }
11268 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option {
11269 position: relative;
11270 }
11271 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option > input[type=radio] {
11272 display: none;
11273 }
11274 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option .option-label {
11275 border-radius: 10px;
11276 border: 1px solid #E4E0F0;
11277 background-color: #FFF;
11278 cursor: pointer;
11279 padding: 12px 16px;
11280 display: block;
11281 height: 100%;
11282 }
11283 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option .radio-point {
11284 position: absolute;
11285 top: 11px;
11286 right: 16px;
11287 }
11288 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option .radio-point circle:first-child {
11289 transform: scale(0);
11290 transform-origin: center;
11291 transition: all 0.3s ease;
11292 }
11293 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option > input[type=radio]:checked + .option-label {
11294 border-color: #6E42D3;
11295 }
11296 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option > input[type=radio]:checked + .option-label .radio-point circle:first-child {
11297 transform: scale(1);
11298 }
11299 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option h4 {
11300 color: #363B4E;
11301 font-size: 14px;
11302 font-weight: 500;
11303 line-height: 1.37;
11304 margin-bottom: 0;
11305 max-width: 95%;
11306 }
11307 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option p {
11308 color: #525562;
11309 font-size: 14px;
11310 font-weight: 400;
11311 line-height: 1.4;
11312 }
11313 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .icon-wrapper {
11314 display: inline-flex;
11315 flex-flow: column;
11316 justify-content: center;
11317 align-items: center;
11318 gap: 8px;
11319 }
11320 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label {
11321 box-sizing: border-box;
11322 border-radius: 10px;
11323 height: 160px;
11324 display: flex;
11325 flex-flow: column;
11326 align-items: center;
11327 justify-content: center;
11328 margin: 0;
11329 padding: 0;
11330 text-align: center;
11331 background-repeat: no-repeat;
11332 background-position: center;
11333 background-size: cover;
11334 cursor: pointer;
11335 border: 1px dashed #CCC3E1;
11336 background-color: transparent;
11337 background-image: none;
11338 }
11339 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label .title {
11340 display: block;
11341 line-height: 16px;
11342 transition: all 0.3s ease;
11343 color: #363B4E;
11344 font-size: 14px;
11345 font-style: normal;
11346 font-weight: 500;
11347 line-height: 14px;
11348 letter-spacing: -0.14px;
11349 }
11350 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label .title .wpfnl-link-text {
11351 color: #6E42D3;
11352 }
11353 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label .hints {
11354 font-style: normal;
11355 margin: 0;
11356 color: #7A8B9A;
11357 width: 100%;
11358 display: block;
11359 }
11360 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded {
11361 border-color: transparent;
11362 }
11363 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded .icon-wrapper {
11364 background: rgba(0, 0, 0, 0.4);
11365 width: 100%;
11366 height: 100%;
11367 border-radius: 10px;
11368 display: flex;
11369 flex-flow: column;
11370 align-items: center;
11371 justify-content: center;
11372 flex-wrap: wrap;
11373 opacity: 0;
11374 visibility: hidden;
11375 transition: all 0.3s ease;
11376 }
11377 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded:hover .icon-wrapper {
11378 opacity: 1;
11379 visibility: visible;
11380 }
11381 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded:hover .title {
11382 color: #ffffff;
11383 }
11384 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded:hover path {
11385 fill: #ffffff;
11386 }
11387 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded .hints {
11388 color: #fff;
11389 }
11390 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .wpfnl-ob-coupon-search {
11391 display: none;
11392 }
11393 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .non-input-field {
11394 cursor: not-allowed;
11395 background-color: #F6F5FA;
11396 font-size: 14px;
11397 color: #7A8B9A;
11398 padding: 13px 15px;
11399 height: 44px;
11400 width: 100%;
11401 min-width: 190px;
11402 border-radius: 6px;
11403 display: block;
11404 border: 1px solid #EBEDF0;
11405 }
11406 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell {
11407 width: 100%;
11408 justify-content: space-between;
11409 }
11410 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell .wpfnl-tooltip {
11411 position: relative;
11412 top: 3px;
11413 }
11414 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell .wpfnl-fields {
11415 width: auto;
11416 }
11417 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell .pro-tag-icon {
11418 transform: translateY(7px);
11419 display: inline-block;
11420 }
11421 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area {
11422 width: 40%;
11423 position: sticky;
11424 top: 0px;
11425 padding-bottom: 24px;
11426 }
11427 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area .preview-header {
11428 padding: 14px 20px;
11429 }
11430 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area .preview-header h4 {
11431 text-transform: capitalize;
11432 font-family: Roboto;
11433 font-size: 14px;
11434 font-style: normal;
11435 font-weight: 400;
11436 line-height: normal;
11437 }
11438 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area .preview-header h4 span {
11439 color: #363B4E;
11440 font-weight: 600;
11441 }
11442 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs {
11443 display: flex;
11444 gap: 30px;
11445 border-bottom: 1px solid #EEF0F3;
11446 background-color: #F9FAFB;
11447 border-radius: 8px 8px 0 0;
11448 width: 100%;
11449 padding: 0 30px;
11450 }
11451 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button {
11452 display: flex;
11453 align-items: center;
11454 gap: 8px;
11455 padding: 14px 0;
11456 background: transparent;
11457 border: none;
11458 cursor: pointer;
11459 font-size: 14px;
11460 font-weight: 500;
11461 color: #6B7280;
11462 transition: all 0.2s ease;
11463 white-space: nowrap;
11464 position: relative;
11465 }
11466 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button::before {
11467 content: "";
11468 position: absolute;
11469 bottom: -1px;
11470 left: 0;
11471 width: 100%;
11472 height: 2px;
11473 background-color: transparent;
11474 transition: background-color 0.2s ease;
11475 }
11476 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button svg {
11477 width: 18px;
11478 height: 18px;
11479 color: #9CA3AF;
11480 transition: color 0.2s ease;
11481 }
11482 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button:first-child {
11483 border-radius: 8px 0 0 0;
11484 }
11485 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button:hover {
11486 color: #374151;
11487 }
11488 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button:hover svg {
11489 color: #6E42D2;
11490 }
11491 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button.active {
11492 color: #6E42D2;
11493 }
11494 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button.active::before {
11495 background-color: #6E42D2;
11496 }
11497 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button.active svg {
11498 color: #6E42D2;
11499 }
11500 @keyframes fadeIn {
11501 from {
11502 opacity: 0;
11503 transform: translateY(10px);
11504 }
11505 to {
11506 opacity: 1;
11507 transform: translateY(0);
11508 }
11509 }
11510 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category {
11511 padding: 26px 30px;
11512 animation: fadeIn 0.3s ease-in;
11513 }
11514 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category:last-child {
11515 border-bottom: none;
11516 }
11517 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .category-title {
11518 color: #363B4E;
11519 font-size: 16px;
11520 font-weight: 500;
11521 line-height: 1;
11522 display: flex;
11523 align-items: center;
11524 gap: 8px;
11525 margin-bottom: 26px;
11526 }
11527 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper {
11528 display: flex;
11529 flex-flow: row wrap;
11530 justify-content: space-between;
11531 gap: 16px;
11532 row-gap: 24px;
11533 }
11534 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .single-ob-settings {
11535 width: calc(50% - 8px);
11536 }
11537 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .single-ob-settings.full-width {
11538 width: 100%;
11539 }
11540 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .mce-tinymce div.mce-toolbar-grp {
11541 padding-left: 35px;
11542 }
11543 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .quicktags-toolbar {
11544 padding: 5px 2px 5px 45px;
11545 }
11546 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .ob-settings-input {
11547 position: relative;
11548 margin-top: 20px;
11549 }
11550 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .color-picker {
11551 position: absolute;
11552 top: 46px;
11553 left: 13px;
11554 z-index: 9;
11555 }
11556 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .vc-color-wrap {
11557 margin: 0;
11558 width: 20px;
11559 height: 20px;
11560 border-radius: 50%;
11561 }
11562 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-replace .wpfnl-tooltip {
11563 position: relative;
11564 top: 3px;
11565 }
11566 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-replace .wpfnl-tooltip p {
11567 color: #ffffff;
11568 }
11569 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-title {
11570 color: #363B4E;
11571 font-size: 14px;
11572 font-weight: 500;
11573 line-height: 1;
11574 margin-bottom: 8px;
11575 display: flex;
11576 align-items: center;
11577 gap: 3px;
11578 }
11579 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-title .wpfnl-tooltip {
11580 padding-bottom: 0;
11581 }
11582 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-title .wpfnl-tooltip svg {
11583 display: block;
11584 }
11585 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input select,
11586 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=password],
11587 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=url],
11588 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=number],
11589 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=text] {
11590 border-radius: 8px;
11591 height: 40px;
11592 }
11593 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-color-picker-wrapper {
11594 display: flex;
11595 align-items: center;
11596 }
11597 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-color-picker-wrapper .vc-color-wrap.transparent {
11598 height: 40px;
11599 width: 40px;
11600 border-radius: 6px;
11601 }
11602 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-color-picker-wrapper input[type=text] {
11603 max-width: max-content;
11604 min-width: auto;
11605 border-radius: 6px;
11606 background: #F6F5FA;
11607 width: 120px;
11608 }
11609 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color {
11610 border: 1px solid #E5E8F3;
11611 border-radius: 8px;
11612 display: flex;
11613 align-items: center;
11614 }
11615 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color input[type=text] {
11616 width: calc(100% - 40px);
11617 border: none;
11618 height: 38px !important;
11619 }
11620 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color .color-picker {
11621 width: 40px;
11622 height: 38px;
11623 display: flex;
11624 align-items: center;
11625 justify-content: center;
11626 border-left: 1px solid #E5E8F3;
11627 }
11628 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color .color-picker .vc-color-wrap {
11629 width: 20px;
11630 height: 20px;
11631 border-radius: 50%;
11632 margin: 0;
11633 }
11634 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details {
11635 border-bottom: 1px solid #EEF0F3;
11636 }
11637 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode {
11638 display: flex;
11639 gap: 15px;
11640 }
11641 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .ob-settings-title {
11642 margin-bottom: 0;
11643 }
11644 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option {
11645 display: flex;
11646 align-items: center;
11647 gap: 5px;
11648 cursor: pointer;
11649 position: relative;
11650 }
11651 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option input[type=radio] {
11652 cursor: pointer;
11653 margin: 0;
11654 }
11655 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option input[type=radio]:checked {
11656 border-color: #6E42D3;
11657 }
11658 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option input[type=radio]:checked::before {
11659 background-color: #6E42D3;
11660 }
11661 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option span {
11662 font-size: 14px;
11663 color: #363B4E;
11664 font-weight: 400;
11665 }
11666 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option .recommended-badge {
11667 background: #ded3f8;
11668 color: #6e42d3;
11669 font-size: 12px;
11670 font-weight: 400;
11671 padding: 2px 8px;
11672 border-radius: 4px;
11673 margin-left: 4px;
11674 letter-spacing: 0.5px;
11675 }
11676 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .auto-match-settings {
11677 width: 100%;
11678 display: flex;
11679 flex-flow: row wrap;
11680 justify-content: space-between;
11681 gap: 16px;
11682 row-gap: 20px;
11683 }
11684 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options {
11685 display: flex;
11686 align-items: flex-start;
11687 gap: 30px;
11688 }
11689 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-group {
11690 display: flex;
11691 flex-direction: column;
11692 gap: 7px;
11693 }
11694 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option {
11695 display: flex;
11696 align-items: center;
11697 gap: 8px;
11698 cursor: pointer;
11699 }
11700 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option input[type=checkbox] {
11701 width: 18px;
11702 height: 18px;
11703 cursor: pointer;
11704 margin: 0;
11705 }
11706 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option input[type=checkbox]:checked::before {
11707 margin: -0.12rem 0 0 -0.2rem;
11708 }
11709 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option span {
11710 font-size: 14px;
11711 color: #363B4E;
11712 user-select: none;
11713 }
11714 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .wpfnl-ob-fallback-product-search.select2-hidden-accessible {
11715 border: 0 !important;
11716 clip: rect(0 0 0 0) !important;
11717 -webkit-clip-path: inset(50%) !important;
11718 clip-path: inset(50%) !important;
11719 height: 1px !important;
11720 overflow: hidden !important;
11721 padding: 0 !important;
11722 position: absolute !important;
11723 width: 1px !important;
11724 white-space: nowrap !important;
11725 }
11726 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior input[type=radio] {
11727 cursor: pointer;
11728 margin: 0;
11729 }
11730 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior input[type=radio]:checked {
11731 border-color: #6E42D3;
11732 }
11733 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior input[type=radio]:checked::before {
11734 background-color: #6E42D3;
11735 }
11736 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options {
11737 display: flex;
11738 flex-direction: column;
11739 gap: 16px;
11740 }
11741 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option {
11742 display: flex;
11743 align-items: flex-start;
11744 gap: 10px;
11745 padding: 10px 12px;
11746 border: 1px solid #E5E8F3;
11747 border-radius: 8px;
11748 cursor: pointer;
11749 transition: all 0.2s ease;
11750 background: #FFFFFF;
11751 }
11752 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option:hover {
11753 border-color: #6E42D3;
11754 background: #F9F7FD;
11755 }
11756 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option .radio-content {
11757 display: flex;
11758 flex-direction: column;
11759 gap: 4px;
11760 flex: 1;
11761 }
11762 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option .radio-content .radio-title {
11763 font-size: 14px;
11764 color: #363B4E;
11765 font-weight: 500;
11766 }
11767 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option .radio-content .radio-subtitle {
11768 font-size: 13px;
11769 color: #7A8B9A;
11770 font-weight: 400;
11771 }
11772 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .default-product-select {
11773 margin-top: 6px;
11774 }
11775 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .default-product-select > label {
11776 font-weight: 400;
11777 font-size: 13px;
11778 margin-bottom: 4px;
11779 display: block;
11780 }
11781 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default {
11782 background: #ffffff;
11783 border-radius: 10px;
11784 border: 1px solid #E5E8F3;
11785 z-index: 99;
11786 display: block;
11787 }
11788 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default .select2-selection--single {
11789 height: 34px;
11790 border-radius: 8px;
11791 border: none;
11792 box-sizing: border-box;
11793 cursor: pointer;
11794 display: block;
11795 }
11796 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default .select2-selection__rendered {
11797 padding-top: 7px;
11798 line-height: 1;
11799 display: block;
11800 padding-left: 8px;
11801 padding-right: 20px;
11802 overflow: hidden;
11803 text-overflow: ellipsis;
11804 white-space: nowrap;
11805 }
11806 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default .select2-selection__arrow {
11807 top: 3px;
11808 right: 3px;
11809 }
11810 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.color-customization .ob-settings-wrapper .single-ob-settings {
11811 width: calc(33.3333333333% - 11px);
11812 }
11813 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.conditional-rules .ob-settings-wrapper .enable-conditional .wpfnl-tooltip {
11814 position: relative;
11815 top: 3px;
11816 }
11817 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.conditional-rules .ob-settings-wrapper .enable-conditional .wpfnl-tooltip p {
11818 color: #ffffff;
11819 }
11820 .checkout-order-bump-setting-tab__content-wrapper {
11821 /* Upgrade overlay - full screen backdrop */
11822 }
11823 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-overlay {
11824 position: fixed;
11825 inset: 0;
11826 z-index: 9999;
11827 background: rgba(0, 0, 0, 0.45);
11828 display: flex;
11829 align-items: center;
11830 justify-content: center;
11831 padding: 20px;
11832 }
11833 .checkout-order-bump-setting-tab__content-wrapper {
11834 /* Upgrade modal card */
11835 }
11836 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal {
11837 position: relative;
11838 background: #fff;
11839 border-radius: 16px;
11840 padding: 36px 32px 32px;
11841 max-width: 420px;
11842 width: 100%;
11843 text-align: center;
11844 box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
11845 }
11846 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-close {
11847 position: absolute;
11848 top: 14px;
11849 right: 16px;
11850 background: none;
11851 border: none;
11852 font-size: 18px;
11853 color: #667085;
11854 cursor: pointer;
11855 line-height: 1;
11856 padding: 4px;
11857 }
11858 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-close:hover {
11859 color: #344054;
11860 }
11861 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-icon {
11862 margin-bottom: 16px;
11863 }
11864 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-title {
11865 font-size: 20px;
11866 font-weight: 700;
11867 color: #101828;
11868 margin: 0 0 12px;
11869 }
11870 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-desc {
11871 font-size: 14px;
11872 color: #667085;
11873 margin: 0 0 24px;
11874 line-height: 1.6;
11875 }
11876 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-btn {
11877 display: inline-block;
11878 background: linear-gradient(135deg, #7A3CF6 0%, #5B21E6 100%);
11879 color: #fff !important;
11880 padding: 12px 28px;
11881 border-radius: 8px;
11882 font-size: 14px;
11883 font-weight: 600;
11884 text-decoration: none;
11885 transition: opacity 0.2s ease;
11886 }
11887 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-btn:hover {
11888 opacity: 0.9;
11889 text-decoration: none;
11890 color: #fff !important;
11891 }
11892 .checkout-order-bump-setting-tab__content-wrapper {
11893 /* Locked auto-match label styling */
11894 }
11895 .checkout-order-bump-setting-tab__content-wrapper .ob-automatch-locked {
11896 opacity: 0.6;
11897 }
11898 .checkout-order-bump-setting-tab__content-wrapper {
11899 /*-----Rule Groups Styles-----*/
11900 }
11901 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container {
11902 width: 100%;
11903 }
11904 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .rule-group {
11905 background: #fff;
11906 border: 1px solid #E5E7EB;
11907 border-radius: 8px;
11908 }
11909 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .rule-group-header {
11910 display: flex;
11911 justify-content: space-between;
11912 align-items: center;
11913 padding: 6px 12px 5px;
11914 border-bottom: 1px solid #E5E7EB;
11915 }
11916 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .rule-group-body {
11917 padding: 20px;
11918 }
11919 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .btn-create-rule-group {
11920 margin-top: 20px;
11921 }
11922 .checkout-order-bump-setting-tab__content-wrapper .rule-group-title {
11923 font-size: 14px;
11924 font-weight: 600;
11925 color: #374151;
11926 margin: 0;
11927 }
11928 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-rule-group {
11929 background: transparent;
11930 border: none;
11931 color: #EF4444;
11932 cursor: pointer;
11933 padding: 4px;
11934 display: flex;
11935 align-items: center;
11936 justify-content: center;
11937 transition: opacity 0.2s;
11938 }
11939 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-rule-group:hover {
11940 opacity: 0.7;
11941 }
11942 .checkout-order-bump-setting-tab__content-wrapper .rule-condition {
11943 margin-bottom: 12px;
11944 }
11945 .checkout-order-bump-setting-tab__content-wrapper .condition-row {
11946 display: flex;
11947 gap: 12px;
11948 align-items: flex-end;
11949 background: #F9FAFB;
11950 padding: 16px;
11951 border-radius: 6px;
11952 border: 1px solid #E5E7EB;
11953 }
11954 .checkout-order-bump-setting-tab__content-wrapper .condition-row input[type=text],
11955 .checkout-order-bump-setting-tab__content-wrapper .condition-row input[type=number],
11956 .checkout-order-bump-setting-tab__content-wrapper .condition-row select {
11957 padding: 3px 12px !important;
11958 min-width: auto;
11959 }
11960 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view {
11961 font-size: 14px;
11962 background: #fff;
11963 border: 1px solid #D1D5DB;
11964 border-radius: 4px;
11965 }
11966 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view .arco-select-view-inner {
11967 padding: 0;
11968 }
11969 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view .arco-select-view-inner .arco-select-view-input {
11970 height: auto;
11971 min-height: auto;
11972 width: 100% !important;
11973 padding: 0;
11974 height: 32px;
11975 }
11976 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view .arco-select-view-inner .arco-select-view-tag {
11977 font-size: 11px;
11978 line-height: 1.2;
11979 padding: 4px;
11980 }
11981 .checkout-order-bump-setting-tab__content-wrapper .condition-field,
11982 .checkout-order-bump-setting-tab__content-wrapper .condition-operator,
11983 .checkout-order-bump-setting-tab__content-wrapper .condition-value {
11984 display: flex;
11985 flex-direction: column;
11986 gap: 6px;
11987 }
11988 .checkout-order-bump-setting-tab__content-wrapper .condition-field {
11989 flex: 0 0 240px;
11990 }
11991 .checkout-order-bump-setting-tab__content-wrapper .condition-operator {
11992 flex: 0 0 180px;
11993 }
11994 .checkout-order-bump-setting-tab__content-wrapper .condition-value {
11995 flex: 0 0 130px;
11996 }
11997 .checkout-order-bump-setting-tab__content-wrapper .condition-field label,
11998 .checkout-order-bump-setting-tab__content-wrapper .condition-value label {
11999 font-size: 12px;
12000 font-weight: 500;
12001 color: #6B7280;
12002 }
12003 .checkout-order-bump-setting-tab__content-wrapper .condition-field select,
12004 .checkout-order-bump-setting-tab__content-wrapper .condition-operator select,
12005 .checkout-order-bump-setting-tab__content-wrapper .condition-value input,
12006 .checkout-order-bump-setting-tab__content-wrapper .condition-value select {
12007 width: 100%;
12008 padding: 8px 12px;
12009 border: 1px solid #D1D5DB;
12010 border-radius: 4px;
12011 font-size: 14px;
12012 color: #374151;
12013 background: #fff;
12014 }
12015 .checkout-order-bump-setting-tab__content-wrapper .condition-field select:focus,
12016 .checkout-order-bump-setting-tab__content-wrapper .condition-operator select:focus,
12017 .checkout-order-bump-setting-tab__content-wrapper .condition-value input:focus,
12018 .checkout-order-bump-setting-tab__content-wrapper .condition-value select:focus {
12019 outline: none;
12020 border-color: #6E42D2;
12021 box-shadow: 0 0 0 3px rgba(110, 66, 210, 0.1);
12022 }
12023 .checkout-order-bump-setting-tab__content-wrapper .condition-actions {
12024 display: flex;
12025 gap: 8px;
12026 align-items: center;
12027 position: relative;
12028 top: -6px;
12029 }
12030 .checkout-order-bump-setting-tab__content-wrapper .btn-drag-handle,
12031 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-condition {
12032 background: transparent;
12033 border: none;
12034 color: #6B7280;
12035 cursor: pointer;
12036 padding: 4px;
12037 display: flex;
12038 align-items: center;
12039 justify-content: center;
12040 transition: color 0.2s;
12041 }
12042 .checkout-order-bump-setting-tab__content-wrapper .btn-drag-handle:hover {
12043 color: #374151;
12044 }
12045 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-condition {
12046 color: #EF4444;
12047 }
12048 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-condition:hover {
12049 opacity: 0.7;
12050 }
12051 .checkout-order-bump-setting-tab__content-wrapper .logic-separator {
12052 display: flex;
12053 align-items: center;
12054 justify-content: center;
12055 margin: 12px 0;
12056 position: relative;
12057 }
12058 .checkout-order-bump-setting-tab__content-wrapper .logic-separator.and-label:before {
12059 content: "";
12060 position: absolute;
12061 left: 50%;
12062 transform: translateX(-50%);
12063 top: -13px;
12064 height: calc(100% + 26px);
12065 width: 2px;
12066 background: #e5e7eb;
12067 z-index: 0;
12068 }
12069 .checkout-order-bump-setting-tab__content-wrapper .logic-label {
12070 background: #F3F4F6;
12071 color: #6B7280;
12072 font-size: 12px;
12073 font-weight: 600;
12074 padding: 4px 12px;
12075 border-radius: 12px;
12076 border: 1px solid #E5E7EB;
12077 position: relative;
12078 z-index: 1;
12079 }
12080 .checkout-order-bump-setting-tab__content-wrapper .or-separator {
12081 margin: 24px 0;
12082 }
12083 .checkout-order-bump-setting-tab__content-wrapper .or-separator::before,
12084 .checkout-order-bump-setting-tab__content-wrapper .or-separator::after {
12085 content: "";
12086 position: absolute;
12087 top: 50%;
12088 width: 45%;
12089 height: 1px;
12090 background: #E5E7EB;
12091 }
12092 .checkout-order-bump-setting-tab__content-wrapper .or-separator::before {
12093 left: 0;
12094 }
12095 .checkout-order-bump-setting-tab__content-wrapper .or-separator::after {
12096 right: 0;
12097 }
12098 .checkout-order-bump-setting-tab__content-wrapper .or-label {
12099 background: #FEF3C7;
12100 color: #D97706;
12101 border-color: #FCD34D;
12102 }
12103 .checkout-order-bump-setting-tab__content-wrapper .btn-add-condition {
12104 background: transparent;
12105 border: 1px dashed #D1D5DB;
12106 color: #6E42D2;
12107 font-size: 14px;
12108 font-weight: 500;
12109 padding: 10px 16px;
12110 border-radius: 6px;
12111 cursor: pointer;
12112 width: 100%;
12113 margin-top: 12px;
12114 transition: all 0.2s;
12115 }
12116 .checkout-order-bump-setting-tab__content-wrapper .btn-add-condition:hover {
12117 background: rgba(110, 66, 210, 0.05);
12118 border-color: #6E42D2;
12119 }
12120 .checkout-order-bump-setting-tab__content-wrapper .btn-create-rule-group {
12121 background: transparent;
12122 border: 2px dashed #D1D5DB;
12123 color: #2563EB;
12124 font-size: 14px;
12125 font-weight: 600;
12126 padding: 12px 20px;
12127 border-radius: 8px;
12128 cursor: pointer;
12129 width: 100%;
12130 transition: all 0.2s;
12131 }
12132 .checkout-order-bump-setting-tab__content-wrapper .btn-create-rule-group:hover {
12133 background: rgba(37, 99, 235, 0.05);
12134 border-color: #2563EB;
12135 }
12136 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner {
12137 display: flex;
12138 align-items: center;
12139 justify-content: space-between;
12140 background: #faf9fb;
12141 border: 1px solid #d3c2fa;
12142 border-radius: 10px;
12143 padding: 24px;
12144 box-sizing: border-box;
12145 }
12146 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-content {
12147 display: flex;
12148 flex-direction: column;
12149 gap: 6px;
12150 }
12151 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-title {
12152 font-size: 16px;
12153 font-weight: 600;
12154 color: #23272F;
12155 }
12156 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-desc {
12157 font-size: 14px;
12158 color: #4B5563;
12159 line-height: 1.5;
12160 max-width: 520px;
12161 }
12162 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-cta {
12163 background: #6E42D3;
12164 color: #fff;
12165 font-weight: 600;
12166 font-size: 13px;
12167 border: none;
12168 border-radius: 6px;
12169 padding: 12px 18px;
12170 text-decoration: none;
12171 transition: background 0.2s;
12172 box-shadow: 0 1px 2px rgba(244, 99, 27, 0.08);
12173 cursor: pointer;
12174 white-space: nowrap;
12175 margin-left: 32px;
12176 display: inline-flex;
12177 align-items: center;
12178 justify-content: center;
12179 }
12180 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-cta:hover {
12181 background: #6434d4;
12182 color: #fff;
12183 text-decoration: none;
12184 }
12185 @media (max-width: 700px) {
12186 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner {
12187 flex-direction: column;
12188 align-items: flex-start;
12189 padding: 18px 12px;
12190 }
12191 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-cta {
12192 margin-left: 0;
12193 margin-top: 16px;
12194 width: 100%;
12195 justify-content: center;
12196 }
12197 }
12198
12199 .arco-trigger-popup {
12200 width: 230px !important;
12201 }
12202
12203 .arco-select-dropdown .arco-select-option {
12204 padding: 8px 6px !important;
12205 margin: 0;
12206 }
12207 .arco-select-dropdown .arco-select-option-checkbox .arco-checkbox-label {
12208 line-height: 1.3;
12209 }
12210
12211 @media only screen and (max-width: 1599px) {
12212 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields {
12213 width: 50%;
12214 }
12215 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-fields-with-color,
12216 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-product-description,
12217 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .upload-product-image .wpfnl-fields {
12218 width: calc(100% - 250px);
12219 }
12220 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.color-customization .ob-settings-wrapper .single-ob-settings {
12221 width: calc(50% - 8px);
12222 }
12223 }
12224 @media only screen and (max-width: 1350px) and (min-width: 1200px) {
12225 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-settings-area {
12226 width: 55%;
12227 }
12228 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area {
12229 width: 45%;
12230 }
12231 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper::not('.no-title-checkbox') {
12232 margin-bottom: 18px;
12233 display: block;
12234 }
12235 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox > label {
12236 width: auto;
12237 margin-bottom: 0;
12238 padding-right: 10px;
12239 padding-top: 4px;
12240 display: inline-block;
12241 }
12242 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .wpfnl-fields {
12243 width: 50%;
12244 max-width: 410px;
12245 }
12246 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .hints.desktop {
12247 display: none;
12248 }
12249 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .hints.mobile {
12250 display: block;
12251 }
12252 }
12253 @media only screen and (max-width: 1199px) {
12254 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area {
12255 width: 100%;
12256 margin-right: 0;
12257 margin-bottom: 30px;
12258 }
12259 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area {
12260 width: 100%;
12261 }
12262 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-settings-area {
12263 width: 100%;
12264 border-radius: 10px 10px 0 0;
12265 margin-bottom: 0;
12266 border-bottom: 1px solid #EEF0F3;
12267 }
12268 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-settings-area .order-bump-settings.enable-order-bump {
12269 border-radius: 0px;
12270 }
12271 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal .order-bump-accordion-content.show-content .order-bump-template-preview-area .preview-header {
12272 border-radius: 0px;
12273 }
12274 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs {
12275 gap: 20px;
12276 padding: 0 21px;
12277 }
12278 }
12279 .edit-field-tabNcontent {
12280 border: 1px solid #E5E8F3;
12281 border-radius: 10px;
12282 }
12283
12284 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav {
12285 display: flex;
12286 flex-flow: row wrap;
12287 align-items: center;
12288 justify-content: flex-start;
12289 padding: 23px 20px 23px 0;
12290 border-bottom: 1px solid #E5E8F3;
12291 }
12292 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li {
12293 padding: 0 15px;
12294 }
12295 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li:last-child {
12296 margin-right: 0;
12297 }
12298 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li a {
12299 font-size: 14px;
12300 color: #7A8B9A;
12301 height: 44px;
12302 line-height: 44px;
12303 display: block;
12304 position: relative;
12305 }
12306 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li a:hover {
12307 color: #363B4E;
12308 }
12309 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li a:before {
12310 content: "";
12311 position: absolute;
12312 top: -24px;
12313 left: 0;
12314 width: 100%;
12315 height: 3px;
12316 background: #6E42D3;
12317 border-radius: 0 0 50px 50px;
12318 visibility: hidden;
12319 opacity: 0;
12320 }
12321 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.active a {
12322 color: #6E42D3;
12323 }
12324 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.active a:before {
12325 visibility: visible;
12326 opacity: 1;
12327 }
12328 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn {
12329 margin-left: 20px;
12330 padding: 0;
12331 }
12332 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn .btn-default {
12333 line-height: 39px;
12334 }
12335 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn svg {
12336 margin-right: 5px;
12337 }
12338 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn {
12339 margin-left: auto;
12340 padding: 0;
12341 }
12342 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .btn-default {
12343 line-height: 39px;
12344 background: #F7F7FA;
12345 color: #363B4E;
12346 border: 1px solid #E5E8F3;
12347 }
12348 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .btn-default.error {
12349 color: #d63342;
12350 background-color: #f8d7da;
12351 border-color: #f5c6cb;
12352 }
12353 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .btn-default.success {
12354 color: #269c41;
12355 background-color: #d4edda;
12356 border-color: #c3e6cb;
12357 }
12358 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .wpfnl-loader {
12359 display: inline-block;
12360 }
12361 .checkout-edit-field-tab__content-wrapper .settings-content__footer .btn-default:disabled {
12362 cursor: not-allowed;
12363 opacity: 0.7;
12364 display: flex;
12365 align-items: center;
12366 gap: 10px;
12367 }
12368 .checkout-edit-field-tab__content-wrapper .wpfnl-additional-replacement-options {
12369 position: relative;
12370 }
12371
12372 .edit-field-settings__single-tab-content {
12373 display: none;
12374 position: relative;
12375 }
12376 .edit-field-settings__single-tab-content .checkout-edit-field {
12377 background: #FFFFFF;
12378 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
12379 border-radius: 0px 10px 10px 10px;
12380 }
12381 .edit-field-settings__single-tab-content:first-child {
12382 display: block;
12383 }
12384 .edit-field-settings__single-tab-content .single-tab-header {
12385 display: flex;
12386 flex-flow: row;
12387 align-items: center;
12388 padding: 25px;
12389 justify-content: space-between;
12390 }
12391 .edit-field-settings__single-tab-content .single-tab-header .tab-title {
12392 font-weight: 500;
12393 font-size: 16px;
12394 line-height: 19px;
12395 color: #363B4E;
12396 text-transform: capitalize;
12397 }
12398 .edit-field-settings__single-tab-content .single-tab-header .restore-btn {
12399 margin-left: auto;
12400 margin-right: 10px;
12401 }
12402 .edit-field-settings__single-tab-content .single-tab-header .restore-btn .wpfnl-alert {
12403 margin-right: 6px;
12404 }
12405 .edit-field-settings__single-tab-content .single-tab-header .restore-btn .wpfnl-loader {
12406 position: relative;
12407 top: 2px;
12408 }
12409 .edit-field-settings__single-tab-content .single-tab-header .btn-default {
12410 height: 40px;
12411 line-height: 41px;
12412 min-width: 100px;
12413 }
12414 .edit-field-settings__single-tab-content .checkout-field-header {
12415 position: sticky;
12416 top: 0;
12417 z-index: 2;
12418 display: flex;
12419 flex-flow: row wrap;
12420 align-items: center;
12421 justify-content: space-between;
12422 padding: 20px 20px 20px 77px;
12423 border-bottom: 1px solid #E5E8F3;
12424 background: #F7F7FA;
12425 }
12426 .edit-field-settings__single-tab-content .checkout-field-header .field-item {
12427 font-size: 12px;
12428 line-height: 14px;
12429 letter-spacing: 0.857143px;
12430 text-transform: uppercase;
12431 color: #7A8B9A;
12432 }
12433 .edit-field-settings__single-tab-content .checkout-field-header.bottom {
12434 border-bottom: 0;
12435 border-radius: 0 0 10px 10px;
12436 }
12437 .edit-field-settings__single-tab-content .checkout-field-header .field-hamburger,
12438 .edit-field-settings__single-tab-content .checkout__single-field .field-hamburger {
12439 width: 25px;
12440 position: absolute;
12441 left: 20px;
12442 top: 50%;
12443 transform: translateY(-50%);
12444 }
12445 .edit-field-settings__single-tab-content .checkout-field-header .field-name,
12446 .edit-field-settings__single-tab-content .checkout__single-field .field-name {
12447 width: 160px;
12448 padding-right: 10px;
12449 }
12450 .edit-field-settings__single-tab-content .checkout-field-header .field-type,
12451 .edit-field-settings__single-tab-content .checkout__single-field .field-type {
12452 width: 75px;
12453 padding-right: 10px;
12454 }
12455 .edit-field-settings__single-tab-content .checkout-field-header .field-label,
12456 .edit-field-settings__single-tab-content .checkout__single-field .field-label {
12457 width: 150px;
12458 padding-right: 10px;
12459 }
12460 .edit-field-settings__single-tab-content .checkout-field-header .field-placeholder,
12461 .edit-field-settings__single-tab-content .checkout__single-field .field-placeholder {
12462 width: 250px;
12463 padding-right: 10px;
12464 }
12465 .edit-field-settings__single-tab-content .checkout-field-header .field-validation,
12466 .edit-field-settings__single-tab-content .checkout__single-field .field-validation {
12467 width: 94px;
12468 padding-right: 10px;
12469 }
12470 .edit-field-settings__single-tab-content .checkout-field-header .field-required,
12471 .edit-field-settings__single-tab-content .checkout__single-field .field-required {
12472 width: 74px;
12473 padding-right: 10px;
12474 }
12475 .edit-field-settings__single-tab-content .checkout-field-header .field-status,
12476 .edit-field-settings__single-tab-content .checkout__single-field .field-status {
12477 width: 65px;
12478 padding-right: 10px;
12479 }
12480 .edit-field-settings__single-tab-content .checkout-field-header .field-action,
12481 .edit-field-settings__single-tab-content .checkout__single-field .field-action {
12482 width: 57px;
12483 }
12484 .edit-field-settings__single-tab-content .checkout__single-field {
12485 position: relative;
12486 padding: 25px 20px 25px 65px;
12487 display: flex;
12488 flex-flow: row wrap;
12489 align-items: center;
12490 justify-content: space-between;
12491 border-bottom: 1px solid #E5E8F3;
12492 cursor: all-scroll;
12493 min-height: 81px;
12494 }
12495 .edit-field-settings__single-tab-content .checkout__single-field:last-child {
12496 border-bottom: 0;
12497 }
12498 .edit-field-settings__single-tab-content .checkout__single-field.ui-sortable-helper {
12499 background-color: #F7F7FA;
12500 }
12501 .edit-field-settings__single-tab-content .checkout__single-field .field-item {
12502 font-weight: 400;
12503 font-size: 14px;
12504 line-height: 16px;
12505 color: #363B4E;
12506 word-break: break-all;
12507 }
12508 .edit-field-settings__single-tab-content .checkout__single-field .hamburger-bar {
12509 display: block;
12510 width: 18px;
12511 height: 14px;
12512 border-top: 2px solid #CDD2E6;
12513 border-bottom: 2px solid #CDD2E6;
12514 position: relative;
12515 cursor: all-scroll;
12516 }
12517 .edit-field-settings__single-tab-content .checkout__single-field .hamburger-bar:before {
12518 content: "";
12519 position: absolute;
12520 left: 0;
12521 top: 50%;
12522 width: 100%;
12523 height: 2px;
12524 margin-top: -1px;
12525 background: #CDD2E6;
12526 }
12527 .edit-field-settings__single-tab-content .checkout__single-field .field-required,
12528 .edit-field-settings__single-tab-content .checkout__single-field .field-status {
12529 display: flex;
12530 align-items: center;
12531 }
12532 .edit-field-settings__single-tab-content .checkout__single-field .field-action {
12533 display: flex;
12534 }
12535 .edit-field-settings__single-tab-content .checkout__single-field .field-action button {
12536 border: none;
12537 cursor: pointer;
12538 text-align: center;
12539 padding: 0 6px;
12540 display: inline-block;
12541 height: 30px;
12542 line-height: 30px;
12543 background-color: transparent;
12544 margin: 0;
12545 }
12546 .edit-field-settings__single-tab-content .checkout__single-field .field-action button svg {
12547 width: 20px;
12548 height: 20px;
12549 display: block;
12550 }
12551
12552 .checkout-edit-field__settings-option {
12553 background: #FFFFFF;
12554 border-radius: 10px;
12555 margin-top: 30px;
12556 border: 1px solid #E5E8F3;
12557 }
12558 .checkout-edit-field__settings-option .settings-title {
12559 font-weight: 700;
12560 font-size: 14px;
12561 line-height: 16px;
12562 padding: 20px 25px;
12563 color: #363B4E;
12564 border-bottom: 1px solid #E5E8F3;
12565 background: #F7F7FA;
12566 border-radius: 10px 10px 0 0;
12567 }
12568 .checkout-edit-field__settings-option .options-wrapper {
12569 padding: 30px 25px;
12570 display: flex;
12571 flex-flow: row wrap;
12572 align-items: flex-start;
12573 position: relative;
12574 }
12575 .checkout-edit-field__settings-option .options-wrapper::before {
12576 content: "";
12577 position: absolute;
12578 left: 50%;
12579 top: 50%;
12580 height: calc(100% - 60px);
12581 width: 1px;
12582 background: #E5E8F3;
12583 transform: translateY(-50%);
12584 }
12585 .checkout-edit-field__settings-option .options-wrapper .single-option {
12586 margin-bottom: 20px;
12587 width: 50%;
12588 }
12589 .checkout-edit-field__settings-option .options-wrapper .single-option:last-child {
12590 margin-bottom: 0;
12591 }
12592 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(odd) {
12593 padding-right: 50px;
12594 }
12595 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(even) {
12596 padding-left: 60px;
12597 }
12598 .checkout-edit-field__settings-option .options-wrapper .single-option .wpfnl-checkbox label {
12599 font-size: 14px;
12600 line-height: 16px;
12601 color: #363B4E;
12602 padding-left: 33px;
12603 }
12604
12605 .dradndrop-icon .st0 {
12606 fill: none;
12607 stroke: #7A8B9A;
12608 stroke-width: 5;
12609 stroke-miterlimit: 10;
12610 }
12611 .dradndrop-icon .st1 {
12612 fill: none;
12613 stroke: #7A8B9A;
12614 stroke-width: 5;
12615 stroke-linecap: round;
12616 stroke-linejoin: round;
12617 stroke-dasharray: 18.3682, 8.1636;
12618 }
12619 .dradndrop-icon .st2 {
12620 fill: #7A8B9A;
12621 }
12622 .dradndrop-icon .st3 {
12623 fill: none;
12624 stroke: #7A8B9A;
12625 stroke-width: 5;
12626 stroke-linecap: round;
12627 stroke-linejoin: round;
12628 stroke-miterlimit: 10;
12629 stroke-dasharray: 18, 8;
12630 }
12631
12632 .checkout-edit-field-tab__content-wrapper {
12633 padding-bottom: 30px;
12634 }
12635 .checkout-edit-field-tab__content-wrapper .edit-field-drawer form {
12636 height: 100%;
12637 }
12638 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body {
12639 padding: 20px 20px 24px;
12640 max-height: calc(100% - 80px);
12641 overflow: auto;
12642 }
12643 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body::-webkit-scrollbar {
12644 width: 5px;
12645 }
12646 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body::-webkit-scrollbar-track {
12647 background: #f2f5f8;
12648 }
12649 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body::-webkit-scrollbar-thumb {
12650 background-color: #6E42D3;
12651 border-radius: 20px;
12652 }
12653 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper {
12654 display: block;
12655 margin-bottom: 22px;
12656 }
12657 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper:last-child {
12658 margin-bottom: 0;
12659 }
12660 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .options-label {
12661 display: flex;
12662 align-items: center;
12663 justify-content: space-between;
12664 margin-bottom: 10px;
12665 }
12666 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .options-label > label {
12667 font-weight: 500;
12668 font-size: 14px;
12669 line-height: 16px;
12670 color: #000000;
12671 display: inline-block;
12672 }
12673 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .options-label .btn-default {
12674 min-width: auto;
12675 border-radius: 4px;
12676 padding: 0;
12677 width: 40px;
12678 background: #f0e9ff;
12679 border: 1px solid #d5c6f9;
12680 }
12681 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields {
12682 display: flex;
12683 align-items: center;
12684 justify-content: space-between;
12685 margin-bottom: 10px;
12686 }
12687 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields input[type=text] {
12688 width: calc(50% - 30px);
12689 min-width: auto;
12690 }
12691 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields.fullwidth input[type=text] {
12692 width: calc(50% - 4px);
12693 }
12694 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields .btn-default {
12695 min-width: auto;
12696 border-radius: 4px;
12697 padding: 0;
12698 width: 40px;
12699 background: #f0e9ff;
12700 border: 1px solid #d5c6f9;
12701 }
12702 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields .btn-default.remove {
12703 background: #f8d7da;
12704 border-color: #f5c2c7;
12705 }
12706 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper .wpfnl-fields {
12707 max-width: inherit;
12708 width: 100%;
12709 }
12710 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper > label {
12711 font-weight: 500;
12712 font-size: 14px;
12713 line-height: 16px;
12714 color: #000000;
12715 display: block;
12716 padding: 0;
12717 margin: 0 0 10px 0;
12718 width: 100%;
12719 }
12720 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper input[type=text],
12721 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper select {
12722 border-radius: 4px;
12723 height: 40px;
12724 }
12725 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper .wpfnl-checkbox label {
12726 font-size: 14px;
12727 line-height: 16px;
12728 color: #000000;
12729 padding-left: 33px;
12730 }
12731 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer {
12732 padding: 24px;
12733 text-align: center;
12734 }
12735 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .btn-default {
12736 height: 40px;
12737 line-height: 41px;
12738 width: 100%;
12739 }
12740 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .btn-default .wpfnl-loader {
12741 position: relative;
12742 top: 2px;
12743 display: inline-block;
12744 }
12745 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .btn-default:disabled {
12746 cursor: not-allowed;
12747 opacity: 0.7;
12748 display: flex;
12749 align-items: center;
12750 gap: 10px;
12751 justify-content: center;
12752 }
12753 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .wpfnl-alert {
12754 text-align: center;
12755 margin-top: 10px;
12756 display: block;
12757 }
12758
12759 @media only screen and (max-width: 1499px) {
12760 .edit-field-settings__single-tab-content .single-tab-header {
12761 padding: 25px 20px;
12762 }
12763 .edit-field-settings__single-tab-content .checkout-field-header {
12764 padding: 25px 20px 25px 57px;
12765 }
12766 .edit-field-settings__single-tab-content .checkout__single-field {
12767 padding: 25px 20px 25px 57px;
12768 }
12769 .edit-field-settings__single-tab-content .checkout-field-header .field-hamburger,
12770 .edit-field-settings__single-tab-content .checkout__single-field .field-hamburger {
12771 left: 20px;
12772 }
12773 .edit-field-settings__single-tab-content .checkout-field-header .field-placeholder,
12774 .edit-field-settings__single-tab-content .checkout__single-field .field-placeholder {
12775 width: 160px;
12776 }
12777 .edit-field-settings__single-tab-content .checkout-field-header .field-name,
12778 .edit-field-settings__single-tab-content .checkout__single-field .field-name {
12779 width: 140px;
12780 }
12781 .edit-field-settings__single-tab-content .checkout-field-header .field-label,
12782 .edit-field-settings__single-tab-content .checkout__single-field .field-label {
12783 width: 100px;
12784 }
12785 }
12786 @media only screen and (max-width: 1299px) {
12787 .edit-field-settings__single-tab-content .checkout-edit-field {
12788 background: transparent;
12789 box-shadow: none;
12790 border-radius: 0;
12791 }
12792 .edit-field-settings__single-tab-content .single-tab-header {
12793 box-shadow: 0px 2px 4px rgba(238, 238, 245, 0.47);
12794 background-color: #ffffff;
12795 padding: 15px 20px;
12796 border-radius: 0px 10px 10px 10px;
12797 }
12798 .edit-field-settings__single-tab-content .checkout-field-header {
12799 display: none;
12800 }
12801 .edit-field-settings__single-tab-content .checkout__single-field {
12802 display: block;
12803 padding: 15px 20px 15px 57px;
12804 background-color: #ffffff;
12805 margin-top: 20px;
12806 border-radius: 10px;
12807 border-bottom: none;
12808 }
12809 .edit-field-settings__single-tab-content .checkout__single-field .field-item:not(.field-hamburger) {
12810 padding-right: 0;
12811 width: 100%;
12812 display: flex;
12813 flex-flow: row wrap;
12814 align-items: center;
12815 padding: 8px 0;
12816 border-bottom: 1px solid #f0f1f3;
12817 }
12818 .edit-field-settings__single-tab-content .checkout__single-field .field-item:not(.field-hamburger):last-child {
12819 margin-bottom: 0;
12820 border-bottom: none;
12821 padding-bottom: 0;
12822 }
12823 .edit-field-settings__single-tab-content .checkout__single-field .field-item:not(.field-hamburger):before {
12824 content: attr(data-label);
12825 vertical-align: middle;
12826 width: 95px;
12827 font-weight: 500;
12828 }
12829 .checkout-edit-field__settings-option .options-wrapper::before {
12830 height: calc(100% - 50px);
12831 }
12832 .checkout-edit-field__settings-option .settings-title {
12833 padding: 20px 20px;
12834 }
12835 .checkout-edit-field__settings-option .options-wrapper {
12836 padding: 25px 20px;
12837 }
12838 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(odd) {
12839 padding-right: 20px;
12840 }
12841 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(even) {
12842 padding-left: 20px;
12843 }
12844 }
12845 @media only screen and (max-width: 1199px) {
12846 .checkout-edit-field__settings-option .options-wrapper {
12847 padding: 25px 20px;
12848 }
12849 .checkout-edit-field__settings-option .options-wrapper::before {
12850 display: none;
12851 }
12852 .checkout-edit-field__settings-option .options-wrapper .single-option {
12853 width: 100%;
12854 }
12855 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(odd) {
12856 padding-right: 0;
12857 }
12858 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(even) {
12859 padding-left: 0;
12860 }
12861 }
12862 .funnel-settings__header {
12863 padding: 28px 20px 27px 30px;
12864 }
12865 .funnel-settings__header .helper-link {
12866 display: flex;
12867 flex-flow: row;
12868 align-items: center;
12869 }
12870 .funnel-settings__header .helper-link li {
12871 margin-left: 35px;
12872 }
12873 .funnel-settings__header .helper-link li:first-child {
12874 margin-left: 0;
12875 }
12876 .funnel-settings__header .helper-link li a {
12877 font-weight: 500;
12878 font-size: 13px;
12879 color: #363B4E;
12880 }
12881 .funnel-settings__header .helper-link li a:hover {
12882 color: #6E42D3;
12883 }
12884
12885 .wpfnl-funnel-settings__inner-content {
12886 width: 100%;
12887 padding: 50px 0;
12888 }
12889 .wpfnl-funnel-settings__inner-content .settings-heading {
12890 color: #363B4E;
12891 font-family: Roboto;
12892 font-size: 24px;
12893 font-style: normal;
12894 font-weight: 600;
12895 margin-bottom: 20px;
12896 }
12897
12898 .wpfn-settings__nav {
12899 padding: 16px;
12900 background: #FAF9FE;
12901 border-radius: 10px 0 0 10px;
12902 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
12903 }
12904 .wpfn-settings__nav ul {
12905 display: flex;
12906 flex-direction: column;
12907 gap: 10px;
12908 }
12909 .wpfn-settings__nav .nav-li {
12910 min-width: 279px;
12911 display: flex;
12912 align-items: center;
12913 padding: 0 15px;
12914 height: 44px;
12915 line-height: 44px;
12916 border: 1px solid transparent;
12917 border-radius: 10px;
12918 cursor: pointer;
12919 position: relative;
12920 text-transform: capitalize;
12921 }
12922 .wpfn-settings__nav .nav-li svg {
12923 margin-right: 6px;
12924 }
12925 .wpfn-settings__nav .nav-li .pro-tag-icon {
12926 margin-top: 4px;
12927 margin-left: 6px;
12928 }
12929 .wpfn-settings__nav .nav-li.active {
12930 border-color: #6E42D3;
12931 box-shadow: 0px 5px 20px rgba(148, 135, 180, 0.15);
12932 background-color: #ffffff;
12933 }
12934 .wpfn-settings__nav .nav-li.active span:not(.pro-tag) {
12935 color: #6e42d3;
12936 }
12937 .wpfn-settings__nav .nav-li.active svg rect,
12938 .wpfn-settings__nav .nav-li.active svg circle,
12939 .wpfn-settings__nav .nav-li.active svg path {
12940 stroke: #6E42D3;
12941 }
12942 .wpfn-settings__nav .nav-li.active[data-id=optin-settings] svg rect,
12943 .wpfn-settings__nav .nav-li.active[data-id=optin-settings] svg circle,
12944 .wpfn-settings__nav .nav-li.active[data-id=optin-settings] svg path {
12945 fill: #6E42D3;
12946 }
12947 .wpfn-settings__nav .nav-li.active[data-id=permalink-settings] svg path {
12948 stroke: none;
12949 fill: #6E42D3;
12950 }
12951 .wpfn-settings__nav .nav-li.active[data-id=user-role-manager] svg path, .wpfn-settings__nav .nav-li.active[data-id=advance-settings] svg path, .wpfn-settings__nav .nav-li.active[data-id=log-settings] svg path {
12952 stroke: none;
12953 fill: #6E42D3;
12954 }
12955 .wpfn-settings__nav .create-btn {
12956 margin-left: auto;
12957 }
12958 .wpfn-settings__nav .create-btn a {
12959 height: 44px;
12960 line-height: 45px;
12961 }
12962
12963 .wpfnl-funnel-settings__wrapper {
12964 display: flex;
12965 }
12966 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings {
12967 background: #fff;
12968 border-radius: 0 10px 10px 0;
12969 width: 100%;
12970 padding: 30px 40px;
12971 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
12972 }
12973 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .settings-tab-container {
12974 margin: 16px 0 24px 0;
12975 }
12976 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .settings-tab-container .wpfnl-general-settings-tab-nav {
12977 display: flex;
12978 border-bottom: 1px solid #EDECF2;
12979 list-style: none;
12980 gap: 24px;
12981 font-weight: 500;
12982 }
12983 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .settings-tab-container .wpfnl-general-settings-tab-nav .inner-tab {
12984 color: #7A8B9A;
12985 font-family: Roboto;
12986 font-size: 14px;
12987 font-style: normal;
12988 font-weight: 400;
12989 line-height: 1.07;
12990 cursor: pointer;
12991 position: relative;
12992 margin-bottom: 13px;
12993 }
12994 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .settings-tab-container .wpfnl-general-settings-tab-nav .inner-tab.active {
12995 color: #6E42D3;
12996 font-weight: 500;
12997 }
12998 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .settings-tab-container .wpfnl-general-settings-tab-nav .inner-tab.active::after {
12999 content: "";
13000 position: absolute;
13001 left: 0;
13002 bottom: -15px;
13003 width: 100%;
13004 height: 2px;
13005 background-color: #6E42D3;
13006 }
13007 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-tab-content {
13008 display: none;
13009 }
13010 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-tab-content.active {
13011 display: block;
13012 }
13013 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings hr {
13014 border: none;
13015 border-bottom: 1px solid #EDECF2;
13016 }
13017 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .settings-title {
13018 color: #363B4E;
13019 font-family: Roboto;
13020 font-size: 20px;
13021 font-style: normal;
13022 font-weight: 500;
13023 line-height: 1.2;
13024 }
13025 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general hr {
13026 margin-bottom: 24px;
13027 border: none;
13028 border-bottom: 1px solid #EDECF2;
13029 }
13030 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-hidden {
13031 display: none;
13032 }
13033 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-box {
13034 padding-top: 16px;
13035 }
13036 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper {
13037 margin-bottom: 24px;
13038 }
13039 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-fields {
13040 max-width: inherit;
13041 }
13042 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper label {
13043 color: #2D3149;
13044 font-size: 15px;
13045 font-style: normal;
13046 font-weight: 400;
13047 line-height: 1;
13048 }
13049 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper {
13050 display: flex;
13051 align-items: center;
13052 gap: 16px;
13053 flex-wrap: wrap;
13054 }
13055 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item {
13056 border-radius: 10px;
13057 width: 130px;
13058 border: 1px solid #EDECF2;
13059 background: #FFF;
13060 padding: 18px 30px;
13061 display: flex;
13062 flex-direction: column;
13063 align-items: center;
13064 gap: 8px;
13065 cursor: pointer;
13066 position: relative;
13067 z-index: 2;
13068 overflow: hidden;
13069 }
13070 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item img {
13071 width: 30px;
13072 height: 30px;
13073 }
13074 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item .wpfnl-title {
13075 color: #2D3149;
13076 font-family: Roboto;
13077 font-size: 13px;
13078 font-style: normal;
13079 font-weight: 400;
13080 text-align: center;
13081 width: max-content;
13082 line-height: 1;
13083 }
13084 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item::before {
13085 content: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIiBmaWxsPSJub25lIj4KICA8Y2lyY2xlIGN4PSIxMCIgY3k9IjEwIiByPSIxMCIgZmlsbD0iIzZFNDJEMyIvPgogIDxwYXRoIGQ9Ik0xNC43OTA5IDcuMTkzNjlDMTQuNTEyNCA2LjkzNTM2IDE0LjA2MDIgNi45MzU1MiAxMy43ODE0IDcuMTkzNjlMOS4yMzgwOCAxMS40MDMyTDcuMjE4NzcgOS41MzIzMkM2LjkzOTk0IDkuMjczOTkgNi40ODc5NiA5LjI3Mzk5IDYuMjA5MTIgOS41MzIzMkM1LjkzMDI5IDkuNzkwNjUgNS45MzAyOSAxMC4yMDk0IDYuMjA5MTIgMTAuNDY3N0w4LjczMzE1IDEyLjgwNjJDOC44NzI0OCAxMi45MzUzIDkuMDU1MTggMTMgOS4yMzc4OSAxM0M5LjQyMDYgMTMgOS42MDM0NyAxMi45MzU1IDkuNzQyOCAxMi44MDYyTDE0Ljc5MDkgOC4xMjkwOUMxNS4wNjk3IDcuODcwOTQgMTUuMDY5NyA3LjQ1MjAxIDE0Ljc5MDkgNy4xOTM2OVoiIGZpbGw9IndoaXRlIiBzdHJva2U9IndoaXRlIiBzdHJva2Utd2lkdGg9IjAuMiIvPgo8L3N2Zz4=");
13086 position: absolute;
13087 right: 10px;
13088 top: 5px;
13089 display: block;
13090 width: 20px;
13091 height: 20px;
13092 opacity: 0;
13093 visibility: hidden;
13094 transition: all 0.3s ease;
13095 }
13096 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item::after {
13097 content: "";
13098 position: absolute;
13099 right: 10px;
13100 top: 5px;
13101 display: block;
13102 width: 18px;
13103 height: 18px;
13104 opacity: 1;
13105 visibility: visible;
13106 transition: all 0.3s ease;
13107 border: 1px solid #EDECF2;
13108 border-radius: 50%;
13109 }
13110 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item.checked {
13111 border: 1px solid #6E42D3;
13112 }
13113 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item.checked::before {
13114 opacity: 1;
13115 visibility: visible;
13116 }
13117 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item.checked::after {
13118 opacity: 0;
13119 visibility: hidden;
13120 }
13121 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-items-wrapper .wpfnl-single-item:hover {
13122 border: 1px solid #6E42D3;
13123 }
13124 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general button {
13125 background: #fff;
13126 color: #6E42D3;
13127 font-family: Inter;
13128 font-size: 14px;
13129 font-style: normal;
13130 font-weight: 600;
13131 line-height: 1;
13132 border-radius: 10px;
13133 border: 1px solid #6E42D3;
13134 }
13135 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general button .icon-sync svg {
13136 stroke: #6E42D3 !important;
13137 }
13138 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general button .icon {
13139 stroke: #6E42D3 !important;
13140 }
13141 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings:not(.general) {
13142 display: none;
13143 }
13144 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings > a > .pro-tag {
13145 padding: 14px 35px;
13146 text-align: center;
13147 margin: 30px;
13148 box-shadow: none;
13149 border-radius: 10px;
13150 }
13151 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .settings-title {
13152 color: #363B4E;
13153 font-family: Roboto;
13154 font-size: 20px;
13155 font-style: normal;
13156 font-weight: 500;
13157 line-height: 1.2;
13158 }
13159 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box {
13160 padding: 0;
13161 background: unset;
13162 box-shadow: none;
13163 border-radius: unset;
13164 }
13165 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.skip-cart-setting .wpfnl-skip-cart .wpfnl-field-wrapper .has-tooltip {
13166 max-width: 280px;
13167 width: 100%;
13168 }
13169 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.skip-cart-setting .wpfnl-field-wrapper {
13170 gap: 6px;
13171 margin-bottom: 24px;
13172 }
13173 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.skip-cart-setting .wpfnl-field-wrapper.skip-cart-input-wrapper .skip-cart-label {
13174 width: auto;
13175 }
13176 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.order-management .wpfnl-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.payment-management .wpfnl-field-wrapper {
13177 gap: 6px;
13178 margin-bottom: 24px;
13179 }
13180 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.analytics-settings .wpfnl-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.opt-in-email .wpfnl-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.recapcha-settings .wpfnl-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.facebook-pixel .wpfnl-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.gtm .wpfnl-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.google-place-api-settings .wpfnl-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.enable-log-wrapper .wpfnl-field-wrapper {
13181 gap: 6px;
13182 margin-bottom: 24px;
13183 max-width: 350px;
13184 width: 100%;
13185 }
13186 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.analytics-settings .wpfnl-field-wrapper label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.opt-in-email .wpfnl-field-wrapper label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.recapcha-settings .wpfnl-field-wrapper label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.facebook-pixel .wpfnl-field-wrapper label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.gtm .wpfnl-field-wrapper label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.google-place-api-settings .wpfnl-field-wrapper label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.enable-log-wrapper .wpfnl-field-wrapper label {
13187 display: flex;
13188 align-items: center;
13189 justify-content: start;
13190 gap: 4px;
13191 }
13192 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.analytics-settings .pixel-field-wrapper,
13193 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.analytics-settings .gtm-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.opt-in-email .pixel-field-wrapper,
13194 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.opt-in-email .gtm-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.recapcha-settings .pixel-field-wrapper,
13195 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.recapcha-settings .gtm-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.facebook-pixel .pixel-field-wrapper,
13196 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.facebook-pixel .gtm-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.gtm .pixel-field-wrapper,
13197 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.gtm .gtm-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.google-place-api-settings .pixel-field-wrapper,
13198 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.google-place-api-settings .gtm-field-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.enable-log-wrapper .pixel-field-wrapper,
13199 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.enable-log-wrapper .gtm-field-wrapper {
13200 display: flex;
13201 align-items: start;
13202 justify-content: space-between;
13203 }
13204 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.analytics-settings .pixel-field-wrapper .guide-btn,
13205 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.analytics-settings .gtm-field-wrapper .guide-btn, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.opt-in-email .pixel-field-wrapper .guide-btn,
13206 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.opt-in-email .gtm-field-wrapper .guide-btn, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.recapcha-settings .pixel-field-wrapper .guide-btn,
13207 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.recapcha-settings .gtm-field-wrapper .guide-btn, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.facebook-pixel .pixel-field-wrapper .guide-btn,
13208 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.facebook-pixel .gtm-field-wrapper .guide-btn, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.gtm .pixel-field-wrapper .guide-btn,
13209 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.gtm .gtm-field-wrapper .guide-btn, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.google-place-api-settings .pixel-field-wrapper .guide-btn,
13210 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.google-place-api-settings .gtm-field-wrapper .guide-btn, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.enable-log-wrapper .pixel-field-wrapper .guide-btn,
13211 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.enable-log-wrapper .gtm-field-wrapper .guide-btn {
13212 display: flex;
13213 align-items: center;
13214 justify-content: center;
13215 background: transparent;
13216 gap: 6px;
13217 padding: 9px 14px;
13218 border-radius: 8px;
13219 border: 1px solid #EDECF2;
13220 outline: none;
13221 color: #363B4E;
13222 font-family: Roboto;
13223 font-size: 14px;
13224 font-style: normal;
13225 font-weight: 500;
13226 line-height: normal;
13227 }
13228 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box.recapcha-settings {
13229 padding: 0;
13230 background: unset;
13231 box-shadow: none;
13232 border-radius: none;
13233 }
13234 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box .recapcha-wrapper {
13235 gap: 6px;
13236 max-width: 350px;
13237 margin-bottom: 20px;
13238 }
13239 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box .recapcha-wrapper:last-child {
13240 margin-bottom: 0;
13241 }
13242 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box .recapcha-wrapper .connect-recaptcha,
13243 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-box .recapcha-wrapper .recaptcha-label {
13244 width: unset;
13245 }
13246 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper > label {
13247 width: 300px;
13248 }
13249 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .disable-analytics-label,
13250 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .facebook-pixel-label,
13251 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .gtm-label,
13252 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .log-status-label {
13253 width: unset;
13254 }
13255 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields {
13256 width: 100%;
13257 max-width: 100%;
13258 }
13259 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields.remove-transients {
13260 max-width: 100px;
13261 width: 100%;
13262 }
13263 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields.remove-transients .transient-btn-wrapper {
13264 width: unset;
13265 display: flex;
13266 align-items: center;
13267 flex-direction: row-reverse;
13268 gap: 10px;
13269 }
13270 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields.enable-facebook-pixel, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields.enable-log-status, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields.enable-gtm, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields.disable-theme-style, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields.clear-funnel-data {
13271 width: unset;
13272 }
13273 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .sync-btn-wrapper {
13274 background-image: url("../../assets//images/sync-template-img.png");
13275 background-repeat: no-repeat;
13276 background-position: center;
13277 background-size: cover;
13278 border-radius: 10px;
13279 height: 186px;
13280 width: 276px;
13281 display: flex;
13282 align-items: center;
13283 justify-content: center;
13284 }
13285 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields select {
13286 min-width: auto;
13287 padding: 0 15px;
13288 line-height: 1.1;
13289 }
13290 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template {
13291 padding: 0 20px;
13292 display: flex;
13293 flex-flow: row;
13294 align-items: center;
13295 }
13296 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template.clear-transients-btn {
13297 border-radius: 6px;
13298 background: rgba(255, 81, 85, 0.1);
13299 padding: 9px 10px;
13300 border: none;
13301 outline: none;
13302 cursor: pointer;
13303 transition: all 0.3s;
13304 }
13305 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template.clear-transients-btn:hover {
13306 background: rgba(255, 81, 85, 0.3);
13307 }
13308 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template .sync-btn-text {
13309 color: #6E42D3;
13310 }
13311 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template .sync-btn-text.success {
13312 color: #239654;
13313 font-size: 12px;
13314 font-weight: 400;
13315 }
13316 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template span {
13317 position: relative;
13318 top: -1px;
13319 margin-right: 5px;
13320 }
13321 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template svg {
13322 display: block;
13323 }
13324 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template .sync-icon {
13325 animation: sync_spin 1.5s linear infinite;
13326 }
13327 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template .check-icon {
13328 top: 0px;
13329 display: none;
13330 }
13331 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields {
13332 max-width: 100%;
13333 }
13334 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields .wpfnl-checkbox {
13335 display: inline-block;
13336 }
13337 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields.pixel-events-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields.gtm-events-wrapper, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields.disable-tracking-wrapper {
13338 display: flex;
13339 flex-direction: column;
13340 gap: 22px;
13341 margin-top: 20px;
13342 }
13343 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields.pixel-events-wrapper .wpfnl-checkbox label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields.gtm-events-wrapper .wpfnl-checkbox label, .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields.disable-tracking-wrapper .wpfnl-checkbox label {
13344 color: #363B4E;
13345 font-family: Roboto;
13346 font-size: 14px;
13347 font-style: normal;
13348 font-weight: 400;
13349 line-height: 1.07;
13350 }
13351 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.sync-template {
13352 margin-bottom: 0;
13353 }
13354 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.sync-template .wpfnl-fields {
13355 display: flex;
13356 align-items: center;
13357 }
13358 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.sync-template .wpfnl-fields .wpfnl-alert {
13359 margin-left: 8px;
13360 }
13361 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .settings-title {
13362 box-shadow: none;
13363 color: #2D3149;
13364 font-size: 18px;
13365 font-style: normal;
13366 font-weight: 500;
13367 line-height: 1.33;
13368 }
13369 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields {
13370 width: 100%;
13371 }
13372 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-fields {
13373 max-width: 100%;
13374 margin-bottom: 12px;
13375 width: 100%;
13376 }
13377 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-fields .wpfnl-radiobtn > label {
13378 border-radius: 10px;
13379 border: 1px solid #EDECF2;
13380 background: #FFF;
13381 padding: 16px 20px;
13382 padding-left: 60px;
13383 width: 100%;
13384 }
13385 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-fields .wpfnl-radiobtn > label:hover {
13386 border: 1px solid #6E42D3;
13387 box-shadow: 0px 20px 30px 0px rgba(199, 191, 217, 0.3);
13388 }
13389 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-fields:last-child {
13390 margin-bottom: 0;
13391 }
13392 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-fields label span {
13393 display: block;
13394 word-break: break-word;
13395 }
13396 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-fields label span.label-title {
13397 color: #2D3149;
13398 font-size: 14px;
13399 font-style: normal;
13400 font-weight: 500;
13401 line-height: 1;
13402 margin-bottom: 7px;
13403 }
13404 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-fields label span.label-subheading {
13405 color: #7A8B9A;
13406 font-size: 13px;
13407 font-style: normal;
13408 font-weight: 400;
13409 line-height: 1;
13410 }
13411 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-radiobtn input[type=radio]:checked + label {
13412 border: 1px solid #6E42D3;
13413 box-shadow: 0px 20px 30px 0px rgba(199, 191, 217, 0.3);
13414 }
13415 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-radiobtn input[type=radio]:checked + label::before {
13416 border-color: #6E42D3;
13417 background-color: #6E42D3;
13418 }
13419 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-radiobtn label::before {
13420 left: 20px;
13421 top: 33%;
13422 }
13423 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-radiobtn label::after {
13424 content: "";
13425 position: absolute;
13426 left: 24.5px;
13427 top: 43%;
13428 width: 9px;
13429 height: 4px;
13430 transform: rotate(-45deg);
13431 border-bottom: 2px solid #fff;
13432 border-left: 2px solid #fff;
13433 transition: all 0.3s ease;
13434 opacity: 0;
13435 visibility: hidden;
13436 border-radius: 0;
13437 }
13438 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-all-fields .wpfnl-radiobtn input[type=radio]:checked + label::after {
13439 visibility: visible;
13440 opacity: 1;
13441 }
13442 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-box {
13443 padding-top: 0;
13444 }
13445 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink hr {
13446 margin-bottom: 24px;
13447 }
13448 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper {
13449 align-items: flex-start;
13450 margin-bottom: 24px;
13451 }
13452 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper:last-child {
13453 margin-bottom: 0;
13454 }
13455 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper > label {
13456 color: #2D3149;
13457 font-size: 15px;
13458 font-style: normal;
13459 font-weight: 400;
13460 line-height: 1;
13461 }
13462 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.wpfnl-align-top {
13463 align-items: flex-start;
13464 }
13465 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.wpfnl-align-top .wpfnl-fields {
13466 max-width: inherit;
13467 }
13468 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.wpfnl-align-top .wpfnl-fields .wpfnl-radiobtn label {
13469 font-size: 13px;
13470 text-transform: none;
13471 line-height: 1.3;
13472 word-break: break-all;
13473 }
13474 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.wpfnl-align-top .wpfnl-fields .wpfnl-radiobtn label:before {
13475 top: 0;
13476 }
13477 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.wpfnl-align-top .wpfnl-fields .wpfnl-radiobtn label:after {
13478 top: 5px;
13479 }
13480 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.parmalink-base .wpfnl-parmalink-inputs-wrapper {
13481 width: calc(100% - 300px);
13482 }
13483 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.parmalink-base .wpfnl-parmalink-inputs-wrapper .wpfnl-fields {
13484 max-width: 350px;
13485 margin-bottom: 16px;
13486 width: 100%;
13487 }
13488 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.parmalink-base .wpfnl-parmalink-inputs-wrapper .wpfnl-fields label {
13489 margin-bottom: 6px;
13490 display: inline-block;
13491 }
13492 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.parmalink-base .wpfnl-parmalink-inputs-wrapper .wpfnl-fields label:last-child {
13493 margin-bottom: 0;
13494 }
13495 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.permalink .wpfnl-field-wrapper.parmalink-base .wpfnl-parmalink-inputs-wrapper .wpfnl-fields:last-child {
13496 margin-bottom: 0;
13497 }
13498 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.optin .email-settings .settings-title,
13499 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.optin .wpfnl-recaptcha-setting .settings-title {
13500 box-shadow: none;
13501 color: #2D3149;
13502 font-size: 18px;
13503 font-style: normal;
13504 font-weight: 500;
13505 line-height: 1.33;
13506 }
13507 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.optin .wpfnl-recaptcha-setting .wpfnl-checkbox.no-title label:before {
13508 border-color: #bdc7eb;
13509 }
13510 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.lms-settings .settings-title {
13511 margin-bottom: 16px;
13512 }
13513 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.lms-settings .wpfnl-field-wrapper {
13514 gap: 6px;
13515 }
13516 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.offer {
13517 position: relative;
13518 }
13519 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.offer .wpfnl-box {
13520 position: relative;
13521 }
13522 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.offer .upgrade-to-pro-hoverlay {
13523 top: 105px;
13524 left: 0;
13525 border-radius: 0;
13526 }
13527 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.offer .wpfnl-field-wrapper > label {
13528 width: 480px;
13529 }
13530 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.offer .wpfnl-field-wrapper .wpfnl-fields {
13531 width: auto;
13532 max-width: initial;
13533 }
13534 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.offer .settings-title {
13535 position: relative;
13536 }
13537 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .pro-tag-icon {
13538 display: inline-block;
13539 transform: translate(5px, 5px);
13540 }
13541 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .google-place-api-settings {
13542 margin-bottom: 20px;
13543 }
13544 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .google-place-api-settings .wpfnl-fields {
13545 position: relative;
13546 }
13547 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .google-place-api-settings .wpfnl-fields input {
13548 padding: 1rem 3.2rem 1rem 1.2rem;
13549 }
13550 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .google-place-api-settings .wpfnl-fields .password-icon {
13551 display: flex;
13552 align-items: center;
13553 position: absolute;
13554 right: 0;
13555 width: 1.2rem;
13556 color: #f9f9f9;
13557 transition: color 0.2s;
13558 cursor: pointer;
13559 }
13560 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .google-place-api-settings .wpfnl-fields .eye-regular svg {
13561 width: 20px;
13562 float: right;
13563 margin-left: -25px;
13564 margin-top: -27px;
13565 position: relative;
13566 z-index: 2;
13567 }
13568 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .google-place-api-settings .wpfnl-fields .eye-slash-regular svg {
13569 width: 20px;
13570 float: right;
13571 margin-left: -25px;
13572 margin-top: -25px;
13573 position: relative;
13574 z-index: 2;
13575 }
13576 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.event-tracking .google-place-api-settings .wpfnl-fields .hide-eye-icon {
13577 display: none;
13578 }
13579 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm,
13580 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm,
13581 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .email-settings,
13582 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel,
13583 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-recaptcha-setting,
13584 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .google-place-api-settings {
13585 margin-bottom: 30px;
13586 background-color: #fff;
13587 border-radius: 10px;
13588 }
13589 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .settings-title,
13590 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .settings-title,
13591 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .email-settings .settings-title,
13592 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .settings-title,
13593 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-recaptcha-setting .settings-title,
13594 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .google-place-api-settings .settings-title {
13595 display: flex;
13596 flex-flow: row wrap;
13597 align-items: center;
13598 }
13599 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .settings-title > svg,
13600 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .settings-title > svg,
13601 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .email-settings .settings-title > svg,
13602 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .settings-title > svg,
13603 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-recaptcha-setting .settings-title > svg,
13604 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .google-place-api-settings .settings-title > svg {
13605 margin-right: 10px;
13606 }
13607 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .settings-title a,
13608 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .settings-title a,
13609 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .email-settings .settings-title a,
13610 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .settings-title a,
13611 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-recaptcha-setting .settings-title a,
13612 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .google-place-api-settings .settings-title a {
13613 line-height: 1;
13614 position: relative;
13615 top: 3px;
13616 margin-left: auto;
13617 }
13618 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .settings-title a svg,
13619 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .settings-title a svg,
13620 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .email-settings .settings-title a svg,
13621 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .settings-title a svg,
13622 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-recaptcha-setting .settings-title a svg,
13623 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .google-place-api-settings .settings-title a svg {
13624 width: 20px;
13625 height: 20px;
13626 }
13627 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .settings-title a svg path,
13628 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .settings-title a svg path,
13629 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .email-settings .settings-title a svg path,
13630 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .settings-title a svg path,
13631 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-recaptcha-setting .settings-title a svg path,
13632 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .google-place-api-settings .settings-title a svg path {
13633 stroke: #6E42D3;
13634 }
13635 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .wpfnl-checkbox.no-title label:before,
13636 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .wpfnl-checkbox.no-title label:before,
13637 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .email-settings .wpfnl-checkbox.no-title label:before,
13638 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .wpfnl-checkbox.no-title label:before,
13639 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-recaptcha-setting .wpfnl-checkbox.no-title label:before,
13640 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .google-place-api-settings .wpfnl-checkbox.no-title label:before {
13641 border-color: #6E42D3;
13642 }
13643 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .wpfnl-align-top {
13644 align-items: flex-start;
13645 }
13646 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .hints {
13647 display: block;
13648 }
13649 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .wpfnl-error {
13650 color: #EE5F5A;
13651 color: #F69220;
13652 font-family: Roboto;
13653 font-size: 13px;
13654 font-style: normal;
13655 font-weight: 400;
13656 line-height: 15px;
13657 display: flex;
13658 align-items: center;
13659 gap: 6px;
13660 }
13661 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .settings-title {
13662 position: relative;
13663 }
13664 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .basic-tools-field {
13665 display: flex;
13666 flex-direction: column;
13667 align-items: start;
13668 gap: 14px;
13669 }
13670 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .basic-tools-field .wpfnl-field-wrapper {
13671 margin: 0;
13672 max-width: 436px;
13673 width: 100%;
13674 justify-content: space-between;
13675 border-radius: 10px;
13676 border: 1px solid #EDECF2;
13677 background: #FFF;
13678 padding: 16px;
13679 }
13680 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .basic-tools-field .wpfnl-field-wrapper:first-child {
13681 padding: 8px 8px 8px 16px;
13682 }
13683 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .basic-tools-field .wpfnl-field-wrapper label {
13684 display: flex;
13685 align-items: center;
13686 gap: 6px;
13687 }
13688 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .rollback-field {
13689 display: flex;
13690 flex-direction: column;
13691 align-items: start;
13692 gap: 14px;
13693 }
13694 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .rollback-field .wpfnl-field-wrapper {
13695 margin: 0;
13696 max-width: 561px;
13697 width: 100%;
13698 justify-content: space-between;
13699 border-radius: 10px;
13700 border: 1px solid #EDECF2;
13701 background: #FFF;
13702 padding: 16px;
13703 }
13704 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .rollback-field .wpfnl-field-wrapper .wpfnl-fields {
13705 max-width: auto;
13706 width: auto;
13707 display: flex;
13708 align-items: center;
13709 gap: 10px;
13710 color: #363B4E;
13711 font-family: Inter;
13712 font-size: 13px;
13713 font-style: normal;
13714 font-weight: 400;
13715 line-height: normal;
13716 }
13717 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .rollback-field .wpfnl-field-wrapper .wpfnl-fields .rollback-options {
13718 width: 181px;
13719 height: 34px;
13720 color: #363B4E;
13721 font-family: Inter;
13722 font-size: 13px;
13723 font-style: normal;
13724 font-weight: 400;
13725 line-height: normal;
13726 }
13727 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .rollback-field .wpfnl-field-wrapper .wpfnl-fields .wpfnl-rollback-button {
13728 border-radius: 10px;
13729 background: #6E42D3;
13730 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
13731 color: #fff;
13732 height: 34px;
13733 width: 100px;
13734 display: flex;
13735 align-items: center;
13736 justify-content: center;
13737 }
13738 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .rollback-field .wpfnl-field-wrapper.transient-cash-wrapper {
13739 padding: 8px 8px 8px 16px;
13740 }
13741 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.advance-settings .rollback-field .wpfnl-field-wrapper label {
13742 width: auto;
13743 display: flex;
13744 align-items: center;
13745 gap: 6px;
13746 }
13747 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.log-settings .log-view-select {
13748 width: 330px;
13749 }
13750 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.log-settings .log-view-btn > a {
13751 margin-left: 10px;
13752 }
13753 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.log-settings .wpfnl-loader {
13754 position: relative;
13755 top: 2px;
13756 }
13757 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.log-settings .log-field .settings-title {
13758 padding-bottom: 13px;
13759 margin-bottom: 22px;
13760 border-bottom: 1px solid #EDECF2;
13761 }
13762 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box {
13763 position: relative;
13764 }
13765 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box .wpfnl-role-list-wrapper {
13766 display: flex;
13767 flex-direction: column;
13768 align-items: start;
13769 gap: 12px;
13770 }
13771 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box .wpfnl-role-list-wrapper .wpfnl-role-row {
13772 display: flex;
13773 align-items: center;
13774 justify-content: space-between;
13775 max-width: 316px;
13776 width: 100%;
13777 border-radius: 10px;
13778 border: 1px solid #EDECF2;
13779 background: #FFF;
13780 padding: 16px;
13781 transition: all 0.3s;
13782 }
13783 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box .wpfnl-role-list-wrapper .wpfnl-role-row:has(.switcher-wrapper input[type=checkbox]:checked) {
13784 border: 1px solid #6E42D3;
13785 box-shadow: 0px 20px 30px 0px rgba(199, 191, 217, 0.3);
13786 }
13787 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box .wpfnl-role-list-wrapper .wpfnl-role-row:hover {
13788 border: 1px solid #6E42D3;
13789 box-shadow: 0px 20px 30px 0px rgba(199, 191, 217, 0.3);
13790 }
13791 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box .wpfnl-role-list-wrapper .wpfnl-role-row .text-wrapper .role-header {
13792 display: flex;
13793 align-items: center;
13794 gap: 5px;
13795 }
13796 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box .wpfnl-role-list-wrapper .wpfnl-role-row .text-wrapper .role-header .role-title {
13797 color: #363B4E;
13798 font-family: Roboto;
13799 font-size: 14px;
13800 font-style: normal;
13801 font-weight: 500;
13802 line-height: normal;
13803 }
13804 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-user-role-container .wpfnl-box .wpfnl-role-list-wrapper .wpfnl-role-row .text-wrapper .role-description {
13805 color: #7A8B9A;
13806 font-family: Roboto;
13807 font-size: 13px;
13808 font-style: normal;
13809 font-weight: 400;
13810 line-height: 1;
13811 margin-top: 5px;
13812 }
13813 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table {
13814 width: 100%;
13815 text-align: left;
13816 border-collapse: collapse;
13817 }
13818 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr th {
13819 font-size: 16px;
13820 color: #363B4E;
13821 font-weight: 600;
13822 padding: 14px 20px;
13823 }
13824 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr th:first-child {
13825 width: 210px;
13826 }
13827 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr td > span,
13828 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr td {
13829 font-size: 14px;
13830 color: #363B4E;
13831 font-weight: 600;
13832 }
13833 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr td {
13834 border-top: 1px solid #EEF0F3;
13835 padding: 14px 20px;
13836 }
13837 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr td:first-child {
13838 width: 210px;
13839 }
13840 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr td .wpfnl-checkbox {
13841 border: 1px solid #EEF0F3;
13842 padding: 8px;
13843 display: inline-block;
13844 border-radius: 8px;
13845 }
13846 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-role-table tr td .wpfnl-checkbox label {
13847 font-size: 13px;
13848 line-height: 1;
13849 color: #363B4E;
13850 cursor: pointer;
13851 }
13852 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-analytics-settings-container {
13853 position: relative;
13854 }
13855 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.user-role-manager .wpfnl-analytics-settings-container .upgrade-to-pro-hoverlay {
13856 border-radius: 0;
13857 }
13858 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .wpfnl-field-wrapper {
13859 max-width: 100% !important;
13860 }
13861 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .wpfnl-field-wrapper > label {
13862 display: flex;
13863 align-items: center;
13864 gap: 4px;
13865 }
13866 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications input[type=radio]:checked {
13867 border-color: #6e42d3;
13868 }
13869 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications input[type=radio]:checked::before {
13870 background-color: #6e42d3;
13871 }
13872 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .wpfnl-fields {
13873 max-width: 410px;
13874 width: calc(100% - 300px);
13875 }
13876 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .report-frequency .wpfnl-radio-wrapper {
13877 display: flex;
13878 align-items: center;
13879 gap: 20px;
13880 }
13881 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications input[type=time] {
13882 min-width: auto;
13883 width: auto;
13884 }
13885 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications input[type=time]::-webkit-calendar-picker-indicator {
13886 opacity: 0.6;
13887 cursor: pointer;
13888 }
13889 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper {
13890 background: #f7f7f7;
13891 padding: 20px;
13892 border-radius: 12px;
13893 border: 1px solid #ececec;
13894 }
13895 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper .wpfnl-field-wrapper {
13896 display: flex;
13897 flex-flow: column;
13898 align-items: flex-start;
13899 gap: 15px;
13900 }
13901 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper .test-notification-content {
13902 display: flex;
13903 align-items: center;
13904 gap: 14px;
13905 }
13906 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper .test-notification-icon svg {
13907 width: 37px;
13908 height: auto;
13909 display: block;
13910 }
13911 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper .test-notification-text h4 {
13912 color: #424758;
13913 font-weight: 500;
13914 }
13915 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper .test-notification-action {
13916 display: flex;
13917 align-items: center;
13918 gap: 14px;
13919 }
13920 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper .test-notification-action input[type=email] {
13921 width: 310px;
13922 }
13923 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.notifications .test-notification-wrapper .test-notification-action button {
13924 display: flex;
13925 flex-flow: row;
13926 align-items: center;
13927 justify-content: center;
13928 line-height: 39px;
13929 }
13930
13931 @-webkit-keyframes sync_spin {
13932 0% {
13933 -webkit-transform: rotate(360deg);
13934 }
13935 100% {
13936 -webkit-transform: rotate(0deg);
13937 }
13938 }
13939 @keyframes sync_spin {
13940 0% {
13941 transform: rotate(360deg);
13942 }
13943 100% {
13944 transform: rotate(0deg);
13945 }
13946 }
13947 .wpfnl-funnel-settings__footer {
13948 padding: 30px 0;
13949 padding-top: 0px;
13950 display: flex;
13951 flex-flow: row wrap;
13952 align-items: center;
13953 justify-content: flex-end;
13954 position: relative;
13955 }
13956 .wpfnl-funnel-settings__footer .update {
13957 display: flex;
13958 flex-flow: row;
13959 align-items: center;
13960 justify-content: center;
13961 line-height: 39px;
13962 }
13963 .wpfnl-funnel-settings__footer .wpfnl-alert {
13964 margin-right: 10px;
13965 }
13966 .wpfnl-funnel-settings__footer #wpfnl-update-global-settings {
13967 margin-top: 30px;
13968 }
13969
13970 @media only screen and (max-width: 1550px) {
13971 .wpfnl-funnel-settings__inner-content {
13972 width: 100%;
13973 }
13974 .wpfnl-funnel-settings__inner-content {
13975 width: 100%;
13976 }
13977 }
13978 @media only screen and (max-width: 1399px) {
13979 .wpfnl-funnel-settings__inner-content {
13980 width: 100%;
13981 }
13982 .wpfnl-funnel-settings__inner-content .settings-heading {
13983 font-size: 22px;
13984 }
13985 .wpfn-settings__nav .nav-li {
13986 min-width: 240px;
13987 }
13988 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings {
13989 padding: 25px 35px;
13990 }
13991 }
13992 @media only screen and (max-width: 1199px) {
13993 .wpfn-settings__nav .nav-li {
13994 padding: 0 10px;
13995 }
13996 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.log-settings .log-view-btn > a {
13997 min-width: 100px;
13998 }
13999 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper > label {
14000 width: 200px;
14001 }
14002 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings.general .wpfnl-field-wrapper .wpfnl-fields {
14003 width: 100%;
14004 max-width: 100%;
14005 }
14006 .wpfnl-funnel-settings__wrapper {
14007 flex-direction: column;
14008 }
14009 .wpfn-settings__nav ul {
14010 flex-direction: row;
14011 flex-wrap: wrap;
14012 }
14013 .wpfn-settings__nav .nav-li {
14014 min-width: auto;
14015 }
14016 .wpfn-settings__nav {
14017 border-radius: 10px 10px 0 0;
14018 margin-bottom: 10px;
14019 }
14020 .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings {
14021 border-radius: 0 0 10px 10px;
14022 }
14023 }
14024 @media only screen and (max-width: 991px) {
14025 .wpfn-settings__nav .create-btn a {
14026 padding: 0 15px;
14027 }
14028 }
14029 .wpfunnels-addons {
14030 background: #f6f5fa;
14031 }
14032 .wpfunnels-addons .addons-content {
14033 background: #F6F5FA;
14034 padding: 40px 30px;
14035 }
14036 .wpfunnels-addons .section-title {
14037 margin: 0 0 20px;
14038 color: #363B4E;
14039 font-size: 24px;
14040 font-weight: 600;
14041 line-height: 1.3;
14042 }
14043 .wpfunnels-addons .wpfunnels-addons-grid {
14044 display: grid;
14045 grid-template-columns: repeat(3, 1fr);
14046 gap: 24px;
14047 }
14048 .wpfunnels-addons .wpfunnels-addons-card {
14049 background: #ffffff;
14050 border-radius: 10px;
14051 padding: 20px;
14052 position: relative;
14053 transition: all 0.3s ease;
14054 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
14055 }
14056 .wpfunnels-addons .wpfunnels-addons-card:hover {
14057 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
14058 transform: translateY(-2px);
14059 }
14060 .wpfunnels-addons .wpfunnels-addons-card .badge {
14061 position: absolute;
14062 top: 12px;
14063 right: 12px;
14064 padding: 4px 9px;
14065 border-radius: 4px;
14066 font-size: 11px;
14067 font-weight: 500;
14068 line-height: 1;
14069 background-color: #ececec;
14070 }
14071 .wpfunnels-addons .wpfunnels-addons-card .badge.hot {
14072 background-color: #7742E6;
14073 color: #ffffff;
14074 }
14075 .wpfunnels-addons .wpfunnels-addons-card .addons-icon {
14076 margin-bottom: 16px;
14077 width: 46px;
14078 height: 46px;
14079 border-radius: 50%;
14080 border: 1px solid #ECF1F6;
14081 display: flex;
14082 align-items: center;
14083 justify-content: center;
14084 }
14085 .wpfunnels-addons .wpfunnels-addons-card .addons-icon svg {
14086 display: block;
14087 }
14088 .wpfunnels-addons .wpfunnels-addons-card .addons-title {
14089 margin: 0 0 7px;
14090 color: #2D3149;
14091 font-size: 16px;
14092 font-weight: 500;
14093 line-height: 1.3;
14094 }
14095 .wpfunnels-addons .wpfunnels-addons-card .addons-description {
14096 margin: 0 0 20px;
14097 color: #6E7A85;
14098 font-size: 14px;
14099 font-weight: 400;
14100 line-height: 1.5;
14101 }
14102 .wpfunnels-addons .wpfunnels-addons-card .addons-description .guide-link {
14103 color: #6E42D3;
14104 font-weight: 500;
14105 text-decoration: none;
14106 display: inline-flex;
14107 align-items: center;
14108 gap: 4px;
14109 transition: all 0.2s ease;
14110 }
14111 .wpfunnels-addons .wpfunnels-addons-card .addons-description .guide-link svg {
14112 display: inline-block;
14113 vertical-align: middle;
14114 }
14115 .wpfunnels-addons .wpfunnels-addons-card .addons-description .guide-link:hover {
14116 text-decoration: underline;
14117 }
14118 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button {
14119 padding: 6px 14px;
14120 font-size: 14px;
14121 font-weight: 500;
14122 line-height: 1.4;
14123 cursor: pointer;
14124 transition: all 0.3s ease;
14125 border-radius: 8px;
14126 border: 1px solid #6E42D3;
14127 display: inline-flex;
14128 align-items: center;
14129 justify-content: center;
14130 gap: 8px;
14131 text-decoration: none;
14132 background: #ffffff;
14133 color: #6E42D3;
14134 }
14135 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button:hover {
14136 background: #6E42D3;
14137 color: #ffffff;
14138 }
14139 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.activate-button {
14140 background: #ffffff;
14141 color: #6E42D3;
14142 border: 1px solid #6E42D3;
14143 }
14144 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.activate-button:hover {
14145 background: #6E42D3;
14146 color: #ffffff;
14147 }
14148 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.active-status {
14149 color: #10B981;
14150 border: 1px solid #10B981;
14151 cursor: default;
14152 }
14153 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.active-status:hover {
14154 background: transparent;
14155 color: #10B981;
14156 }
14157 @media (max-width: 1280px) {
14158 .wpfunnels-addons .wpfunnels-addons-grid {
14159 grid-template-columns: repeat(2, 1fr);
14160 }
14161 }
14162 @media (max-width: 768px) {
14163 .wpfunnels-addons .wpfunnels-addons-grid {
14164 grid-template-columns: 1fr;
14165 }
14166 }
14167
14168 @media (max-width: 1399px) {
14169 .wpfunnels-addons .addons-content {
14170 padding: 20px 0px;
14171 }
14172 .wpfunnels-addons .wpfunnels-addons-grid {
14173 gap: 20px;
14174 }
14175 }
14176 .wpfunnels-setup {
14177 background: #F6F5FA;
14178 margin: 0;
14179 padding: 0;
14180 }
14181 .wpfunnels-setup * {
14182 padding: 0;
14183 margin: 0;
14184 box-sizing: border-box;
14185 }
14186 .wpfunnels-setup #wpfunnels_setup_wizard {
14187 height: 100vh;
14188 width: 100%;
14189 margin: 0 auto;
14190 }
14191 .wpfunnels-setup .wpfnl-mm-setup-wizard {
14192 display: flex;
14193 align-items: stretch;
14194 position: relative;
14195 height: 100vh;
14196 width: 100%;
14197 }
14198 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar {
14199 width: 260px;
14200 background: #FFF;
14201 height: 100vh;
14202 position: sticky;
14203 top: 0;
14204 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
14205 display: flex;
14206 flex-direction: column;
14207 flex-shrink: 0;
14208 padding: 30px;
14209 }
14210 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-branding {
14211 border-bottom: 1px solid #EAE9EE;
14212 padding: 0 0 30px 0;
14213 display: flex;
14214 align-items: center;
14215 gap: 12px;
14216 }
14217 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-branding .wpfnl-mm-setup-wizard-logo {
14218 width: 36px;
14219 height: 27px;
14220 flex-shrink: 0;
14221 object-fit: contain;
14222 }
14223 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-branding .wpfnl-mm-setup-wizard-brand-name {
14224 font-size: 22px;
14225 color: #111827;
14226 line-height: 16px;
14227 font-weight: 700;
14228 letter-spacing: 0px;
14229 font-family: "Inter", sans-serif;
14230 margin: 0;
14231 }
14232 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps {
14233 padding: 30px 0;
14234 flex: 1;
14235 display: flex;
14236 flex-direction: column;
14237 gap: 0;
14238 }
14239 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step {
14240 display: flex;
14241 align-items: center;
14242 gap: 8px;
14243 padding: 9px 11px;
14244 cursor: pointer;
14245 transition: all 0.3s ease;
14246 border-radius: 100px;
14247 margin-bottom: 12px;
14248 border: 1px solid transparent;
14249 }
14250 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step:last-child {
14251 margin-bottom: 0;
14252 }
14253 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step.active {
14254 background: #F6F5FA;
14255 border: 1px solid #6E42D3;
14256 padding: 8px 10px;
14257 }
14258 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step.active .wpfnl-mm-setup-wizard-step-number {
14259 background: #6E42D3;
14260 color: #FFF;
14261 font-weight: 700;
14262 }
14263 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step.active .wpfnl-mm-setup-wizard-step-label {
14264 color: #6E42D3;
14265 font-weight: 500;
14266 }
14267 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step.completed .wpfnl-mm-setup-wizard-step-number {
14268 background: transparent;
14269 color: rgba(122, 140, 154, 0.7);
14270 }
14271 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step.completed .wpfnl-mm-setup-wizard-step-number svg {
14272 width: 20px;
14273 height: 20px;
14274 }
14275 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step.completed .wpfnl-mm-setup-wizard-step-label {
14276 color: rgba(122, 140, 154, 0.7);
14277 }
14278 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step .wpfnl-mm-setup-wizard-step-number {
14279 width: 24px;
14280 height: 24px;
14281 border-radius: 16px;
14282 background: #EDE5FF;
14283 color: #6E42D3;
14284 display: flex;
14285 align-items: center;
14286 justify-content: center;
14287 font-size: 12px;
14288 font-weight: 600;
14289 font-family: "DM Sans", sans-serif;
14290 line-height: 12px;
14291 flex-shrink: 0;
14292 }
14293 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step .wpfnl-mm-setup-wizard-step-label {
14294 font-size: 16px;
14295 color: #6D707D;
14296 font-family: "DM Sans", sans-serif;
14297 font-weight: 400;
14298 letter-spacing: -0.16px;
14299 line-height: normal;
14300 white-space: nowrap;
14301 }
14302 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-exit {
14303 margin-top: auto;
14304 padding: 0;
14305 text-align: left;
14306 }
14307 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-exit .wpfnl-mm-setup-wizard-exit-link {
14308 font-size: 15px;
14309 color: #7A8C9A;
14310 text-decoration: none;
14311 font-family: "DM Sans", sans-serif;
14312 font-weight: 400;
14313 line-height: 18px;
14314 transition: color 0.3s ease;
14315 }
14316 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-exit .wpfnl-mm-setup-wizard-exit-link:hover {
14317 color: #6E42D3;
14318 }
14319 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn {
14320 position: fixed;
14321 bottom: 40px;
14322 right: 54px;
14323 z-index: 100;
14324 }
14325 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn .wpfnl-mm-help-btn-circle {
14326 width: 34px;
14327 height: 34px;
14328 border-radius: 100px;
14329 background: #201F22;
14330 border: none;
14331 cursor: pointer;
14332 display: flex;
14333 align-items: center;
14334 justify-content: center;
14335 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.16);
14336 transition: all 0.3s ease;
14337 }
14338 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn .wpfnl-mm-help-btn-circle svg {
14339 width: 16px;
14340 height: 16px;
14341 }
14342 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn .wpfnl-mm-help-btn-circle:hover {
14343 background: #363B4E;
14344 transform: scale(1.05);
14345 }
14346 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content {
14347 flex: 1;
14348 display: flex;
14349 align-items: flex-start;
14350 justify-content: center;
14351 padding: 80px 20px 24px;
14352 position: relative;
14353 overflow-y: auto;
14354 background: #EFEEF1;
14355 }
14356 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content * {
14357 font-family: "DM Sans", sans-serif;
14358 }
14359 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons {
14360 display: flex;
14361 justify-content: space-between;
14362 align-items: center;
14363 width: 100%;
14364 }
14365 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn {
14366 padding: 10px 24px;
14367 border-radius: 10px;
14368 font-size: 16px;
14369 font-weight: 500;
14370 line-height: 24px;
14371 cursor: pointer;
14372 transition: all 0.3s ease;
14373 border: none;
14374 display: inline-flex;
14375 align-items: center;
14376 justify-content: center;
14377 gap: 8px;
14378 height: 44px;
14379 }
14380 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-secondary {
14381 background: #FFF;
14382 color: #363B4E;
14383 border: 1px solid #ECEBF0;
14384 min-width: 87px;
14385 }
14386 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-secondary:hover {
14387 border-color: #6E42D3;
14388 color: #6E42D3;
14389 }
14390 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary {
14391 background: #6E42D3;
14392 color: #FFF;
14393 letter-spacing: 0.2px;
14394 }
14395 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary svg {
14396 width: 17px;
14397 height: 12px;
14398 }
14399 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary:hover {
14400 background: #5c36b3;
14401 }
14402 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary:disabled {
14403 background: #ccc;
14404 cursor: not-allowed;
14405 }
14406 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn-group {
14407 display: flex;
14408 gap: 12px;
14409 }
14410 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent {
14411 display: flex;
14412 justify-content: center;
14413 margin-top: 30px;
14414 }
14415 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox {
14416 display: flex;
14417 align-items: center;
14418 gap: 8px;
14419 cursor: pointer;
14420 user-select: none;
14421 }
14422 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox input[type=checkbox] {
14423 position: absolute;
14424 opacity: 0;
14425 cursor: pointer;
14426 height: 0;
14427 width: 0;
14428 }
14429 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox input[type=checkbox]:checked ~ .wpfnl-mm-checkbox-checkmark {
14430 background: #6E42D3;
14431 border-color: #6E42D3;
14432 }
14433 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox input[type=checkbox]:checked ~ .wpfnl-mm-checkbox-checkmark:after {
14434 display: block;
14435 }
14436 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox .wpfnl-mm-checkbox-checkmark {
14437 width: 16px;
14438 height: 16px;
14439 border: 1px solid #ab91e6;
14440 border-radius: 4px;
14441 background: #FFF;
14442 flex-shrink: 0;
14443 position: relative;
14444 transition: all 0.3s ease;
14445 }
14446 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox .wpfnl-mm-checkbox-checkmark:after {
14447 content: "";
14448 position: absolute;
14449 display: none;
14450 border: solid white;
14451 border-width: 0 2px 2px 0;
14452 transform: rotate(45deg);
14453 left: 5px;
14454 top: 2px;
14455 width: 3px;
14456 height: 7px;
14457 }
14458 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox .wpfnl-mm-checkbox-label {
14459 font-size: 14px;
14460 font-weight: 500;
14461 color: #7A8C9A;
14462 line-height: 20px;
14463 }
14464 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal {
14465 width: 100%;
14466 max-width: 908px;
14467 display: flex;
14468 flex-direction: column;
14469 gap: 0;
14470 position: relative;
14471 }
14472 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-header {
14473 text-align: center;
14474 margin-bottom: 30px;
14475 }
14476 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-header .wpfnl-mm-choose-goal-title {
14477 font-size: 24px;
14478 font-weight: 600;
14479 font-family: "DM Sans", sans-serif;
14480 color: #363B4E;
14481 line-height: 30px;
14482 letter-spacing: -0.6px;
14483 margin: 0 0 10px 0;
14484 max-width: 592px;
14485 margin-left: auto;
14486 margin-right: auto;
14487 }
14488 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-header .wpfnl-mm-choose-goal-subtitle {
14489 font-size: 15px;
14490 font-weight: 400;
14491 font-family: "DM Sans", sans-serif;
14492 color: #6E7A85;
14493 line-height: 19px;
14494 margin: 0;
14495 }
14496 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container {
14497 border-radius: 20px;
14498 padding: 60px 30px;
14499 display: flex;
14500 flex-direction: column;
14501 align-items: center;
14502 gap: 35px;
14503 margin-bottom: 25px;
14504 background: #FFF;
14505 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
14506 }
14507 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards {
14508 display: grid;
14509 gap: 20px;
14510 grid-template-columns: repeat(3, 1fr);
14511 width: 100%;
14512 }
14513 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card {
14514 background: #FFF;
14515 border: 1px solid #F6F5FA;
14516 border-radius: 16px;
14517 padding: 20px 10px 24px;
14518 cursor: pointer;
14519 transition: all 0.3s ease;
14520 position: relative;
14521 text-align: center;
14522 display: flex;
14523 flex-direction: column;
14524 align-items: center;
14525 justify-content: space-between;
14526 gap: 0;
14527 }
14528 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card:hover {
14529 border-color: #EDE5FF;
14530 box-shadow: 0px 4px 12px rgba(110, 66, 211, 0.1);
14531 }
14532 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card.active {
14533 border-color: #6E42D3;
14534 box-shadow: 0 20px 30px rgba(199, 191, 217, 0.3019607843);
14535 }
14536 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card .wpfnl-mm-goal-card-checkmark {
14537 position: absolute;
14538 top: 12px;
14539 right: 12px;
14540 width: 24px;
14541 height: 24px;
14542 background: #6E42D3;
14543 border-radius: 100px;
14544 display: flex;
14545 align-items: center;
14546 justify-content: center;
14547 }
14548 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card .wpfnl-mm-goal-card-checkmark svg {
14549 width: 16px;
14550 height: 16px;
14551 }
14552 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card .wpfnl-mm-goal-card-icon svg {
14553 display: block;
14554 }
14555 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card .wpfnl-mm-goal-card-content .wpfnl-mm-goal-card-title {
14556 font-size: 16px;
14557 font-weight: 700;
14558 font-family: "DM Sans", sans-serif;
14559 color: #363B4E;
14560 line-height: 13px;
14561 margin: 0 0 10px 0;
14562 }
14563 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container .wpfnl-mm-choose-goal-cards .wpfnl-mm-goal-card .wpfnl-mm-goal-card-content .wpfnl-mm-goal-card-description {
14564 font-size: 15px;
14565 font-weight: 400;
14566 color: #6E7A85;
14567 line-height: 1.5;
14568 margin: 0;
14569 }
14570 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container {
14571 display: flex;
14572 align-items: center;
14573 justify-content: space-between;
14574 }
14575 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn {
14576 display: inline-flex;
14577 align-items: center;
14578 gap: 8px;
14579 padding: 12px 24px;
14580 border-radius: 8px;
14581 font-weight: 500;
14582 font-size: 14px;
14583 transition: all 0.3s ease;
14584 border: none;
14585 cursor: pointer;
14586 }
14587 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-primary {
14588 background: #6E42D3;
14589 color: white;
14590 }
14591 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-primary:hover:not(:disabled) {
14592 background: #5B35B8;
14593 }
14594 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn:disabled {
14595 opacity: 0.5;
14596 cursor: not-allowed;
14597 }
14598 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-secondary {
14599 background: white;
14600 color: #363B4E;
14601 border-radius: 10px;
14602 border: 1px solid #ECEBF0;
14603 }
14604 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-secondary:hover:not(:disabled) {
14605 border-color: #D1D5DB;
14606 background: #F9FAFB;
14607 }
14608 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-spinner {
14609 animation: spin 0.8s linear infinite;
14610 }
14611 @keyframes spin {
14612 0% {
14613 transform: rotate(0deg);
14614 }
14615 100% {
14616 transform: rotate(360deg);
14617 }
14618 }
14619 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup {
14620 width: 100%;
14621 max-width: 940px;
14622 display: flex;
14623 flex-direction: column;
14624 gap: 24px;
14625 position: relative;
14626 }
14627 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-header {
14628 text-align: center;
14629 margin-bottom: 20px;
14630 }
14631 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-header .wpfnl-mm-setup-title {
14632 font-size: 24px;
14633 font-weight: 700;
14634 color: #363B4E;
14635 line-height: 35px;
14636 margin: 0 0 8px 0;
14637 }
14638 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-header .wpfnl-mm-setup-subtitle {
14639 font-size: 15px;
14640 font-weight: 400;
14641 color: #6E7A85;
14642 line-height: 15px;
14643 margin: 0;
14644 }
14645 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section {
14646 background: #FFF;
14647 border-radius: 20px;
14648 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
14649 }
14650 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-woo-notice {
14651 background: #EBF5FF;
14652 border: 1px solid #B3D9FF;
14653 border-radius: 12px;
14654 padding: 16px 20px;
14655 display: flex;
14656 align-items: flex-start;
14657 gap: 12px;
14658 width: 100%;
14659 margin-top: 16px;
14660 }
14661 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-woo-notice .wpfnl-mm-woo-notice-icon {
14662 flex-shrink: 0;
14663 display: flex;
14664 align-items: center;
14665 justify-content: center;
14666 width: 20px;
14667 height: 20px;
14668 margin-top: 2px;
14669 }
14670 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-woo-notice .wpfnl-mm-woo-notice-icon svg {
14671 width: 20px;
14672 height: 20px;
14673 }
14674 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-woo-notice .wpfnl-mm-woo-notice-content {
14675 flex: 1;
14676 display: flex;
14677 flex-direction: column;
14678 gap: 4px;
14679 }
14680 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-woo-notice .wpfnl-mm-woo-notice-content .wpfnl-mm-woo-notice-title {
14681 font-size: 14px;
14682 font-weight: 600;
14683 font-family: "DM Sans", sans-serif;
14684 color: #0073E6;
14685 line-height: 18px;
14686 margin: 0;
14687 }
14688 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-woo-notice .wpfnl-mm-woo-notice-content .wpfnl-mm-woo-notice-text {
14689 font-size: 13px;
14690 font-weight: 400;
14691 font-family: "DM Sans", sans-serif;
14692 color: #1E4D7A;
14693 line-height: 18px;
14694 margin: 0;
14695 }
14696 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content {
14697 display: flex;
14698 flex-direction: column;
14699 align-items: center;
14700 gap: 24px;
14701 padding: 45px 109px;
14702 }
14703 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-woo-detection {
14704 gap: 24px;
14705 }
14706 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-setup-plugins-card {
14707 border-radius: 12px;
14708 border: 1.5px solid #F1EFF7;
14709 background: #FFF;
14710 display: flex;
14711 flex-direction: column;
14712 align-items: center;
14713 justify-content: center;
14714 gap: 12px;
14715 position: relative;
14716 width: 110px;
14717 height: 100px;
14718 }
14719 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-setup-plugins-card.selected {
14720 box-shadow: 0 20px 30px 0 rgba(199, 191, 217, 0.3);
14721 border-color: #239654;
14722 }
14723 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-setup-plugins-card .wpfnl-setup-plugin-selected {
14724 position: absolute;
14725 background: #239654;
14726 display: flex;
14727 align-items: center;
14728 justify-content: center;
14729 width: 18px;
14730 height: 18px;
14731 border-radius: 50%;
14732 top: 5px;
14733 right: 5px;
14734 }
14735 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-setup-plugins-card .wpfnl-setup-plugin-name {
14736 color: #6E7A85;
14737 font-size: 14px;
14738 font-weight: 400;
14739 line-height: 1;
14740 }
14741 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card {
14742 cursor: pointer;
14743 width: auto;
14744 min-width: 110px;
14745 padding: 10px 12px;
14746 }
14747 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card.selected {
14748 border-color: #6E42D3;
14749 }
14750 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card.disabled {
14751 opacity: 0.5;
14752 cursor: not-allowed;
14753 pointer-events: auto;
14754 }
14755 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card.disabled:hover {
14756 border-color: #F1EFF7;
14757 box-shadow: none;
14758 }
14759 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card.disabled.selected {
14760 border-color: #F1EFF7;
14761 box-shadow: none;
14762 }
14763 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card .wpfnl-setup-plugin-selected {
14764 background: #6E42D3;
14765 }
14766 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card .wpfnl-setup-pro-badge {
14767 position: absolute;
14768 top: 5px;
14769 right: 5px;
14770 background: #f68524;
14771 color: #fff;
14772 font-size: 9px;
14773 font-weight: 600;
14774 line-height: 1;
14775 padding: 3px 6px;
14776 border-radius: 4px;
14777 white-space: nowrap;
14778 }
14779 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-page-builders .wpfnl-setup-plugins-card img {
14780 width: 30px;
14781 height: 30px;
14782 }
14783 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins {
14784 padding: 45px 30px;
14785 }
14786 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card {
14787 cursor: pointer;
14788 width: 100%;
14789 min-width: unset;
14790 padding: 16px 20px;
14791 flex-direction: column;
14792 align-items: center;
14793 justify-content: center;
14794 gap: 16px;
14795 text-align: center;
14796 background: transparent;
14797 border: 1px solid #F1EFF7;
14798 border-radius: 14px;
14799 transition: all 0.3s ease;
14800 height: 100%;
14801 width: auto;
14802 }
14803 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card:hover {
14804 border-color: #E8E4F3;
14805 background: #FEFEFE;
14806 }
14807 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card.selected {
14808 border-color: #6E42D3;
14809 box-shadow: 0 20px 30px rgba(199, 191, 217, 0.3);
14810 }
14811 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card .wpfnl-setup-plugin-selected {
14812 background: #6E42D3;
14813 top: 12px;
14814 right: 12px;
14815 width: 24px;
14816 height: 24px;
14817 box-shadow: 0px 2px 6px rgba(110, 66, 211, 0.3);
14818 }
14819 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card .wpfnl-setup-plugin-selected svg {
14820 width: 16px;
14821 height: 16px;
14822 }
14823 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card img {
14824 width: 48px;
14825 height: 48px;
14826 flex-shrink: 0;
14827 object-fit: contain;
14828 }
14829 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card .wpfnl-setup-plugin-info {
14830 display: flex;
14831 flex-direction: column;
14832 gap: 4px;
14833 flex: 1;
14834 min-width: 0;
14835 }
14836 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card .wpfnl-setup-plugin-name {
14837 font-size: 15px;
14838 font-weight: 600;
14839 color: #363B4E;
14840 line-height: 1.4;
14841 }
14842 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card .wpfnl-setup-plugin-description {
14843 font-size: 14px;
14844 font-weight: 400;
14845 color: #6E7A85;
14846 line-height: 1.5;
14847 max-width: 240px;
14848 }
14849 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-setup-section-title {
14850 font-size: 16px;
14851 font-weight: 500;
14852 color: #363B4E;
14853 line-height: 18px;
14854 margin: 0;
14855 text-align: center;
14856 }
14857 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-woo-status {
14858 display: flex;
14859 gap: 10px;
14860 align-items: center;
14861 width: 100%;
14862 justify-content: center;
14863 }
14864 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-woo-status {
14865 display: grid;
14866 grid-template-columns: repeat(3, 1fr);
14867 gap: 10px;
14868 width: 100%;
14869 }
14870 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card:only-child {
14871 grid-column: 1/-1;
14872 max-width: 50%;
14873 margin: 0 auto;
14874 }
14875 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card {
14876 width: 110px;
14877 height: 100px;
14878 border: 1.5px solid #F1EFF7;
14879 border-radius: 12px;
14880 background: #FFF;
14881 display: flex;
14882 flex-direction: column;
14883 align-items: center;
14884 justify-content: center;
14885 gap: 10px;
14886 position: relative;
14887 cursor: pointer;
14888 transition: all 0.3s ease;
14889 }
14890 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card.active {
14891 border-color: #239654;
14892 box-shadow: 0px 20px 30px rgba(199, 191, 217, 0.3);
14893 }
14894 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card.active .wpfnl-mm-status-card-checkmark {
14895 display: flex;
14896 }
14897 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card .wpfnl-mm-status-card-checkmark {
14898 position: absolute;
14899 top: 10px;
14900 right: 10px;
14901 width: 18px;
14902 height: 18px;
14903 background: #239654;
14904 border-radius: 100px;
14905 display: none;
14906 align-items: center;
14907 justify-content: center;
14908 }
14909 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card .wpfnl-mm-status-card-checkmark svg {
14910 width: 16px;
14911 height: 16px;
14912 }
14913 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card .wpfnl-mm-status-card-icon {
14914 width: 28px;
14915 height: 24px;
14916 }
14917 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card .wpfnl-mm-status-card-icon svg {
14918 width: 100%;
14919 height: 100%;
14920 }
14921 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content.wpfnl-mm-essential-plugins .wpfnl-mm-status-card .wpfnl-mm-status-card-label {
14922 font-size: 14px;
14923 font-weight: 400;
14924 font-family: "DM Sans", sans-serif;
14925 color: #6E7A85;
14926 line-height: 13px;
14927 }
14928 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid {
14929 display: grid;
14930 grid-template-columns: repeat(6, 110px);
14931 gap: 10px;
14932 justify-content: center;
14933 }
14934 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card {
14935 width: 110px;
14936 height: 100px;
14937 border: 1px solid #F1EFF7;
14938 border-radius: 10px;
14939 background: #FFF;
14940 display: flex;
14941 flex-direction: column;
14942 align-items: center;
14943 justify-content: center;
14944 gap: 10px;
14945 position: relative;
14946 cursor: pointer;
14947 transition: all 0.3s ease;
14948 }
14949 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card:hover {
14950 border-color: #EDE5FF;
14951 }
14952 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card.active {
14953 border: 1.5px solid #6E42D3;
14954 border-radius: 14px;
14955 box-shadow: 0px 20px 30px rgba(199, 191, 217, 0.3);
14956 }
14957 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card.active .wpfnl-mm-builder-card-checkmark {
14958 display: flex;
14959 }
14960 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card .wpfnl-mm-builder-card-checkmark {
14961 position: absolute;
14962 top: 10px;
14963 right: 10px;
14964 width: 18px;
14965 height: 18px;
14966 background: #6E42D3;
14967 border-radius: 100px;
14968 display: none;
14969 align-items: center;
14970 justify-content: center;
14971 }
14972 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card .wpfnl-mm-builder-card-checkmark svg {
14973 width: 16px;
14974 height: 16px;
14975 }
14976 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card .wpfnl-mm-builder-card-icon {
14977 width: 30px;
14978 height: 30px;
14979 }
14980 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-builders-grid .wpfnl-mm-builder-card .wpfnl-mm-builder-card-label {
14981 font-size: 14px;
14982 font-weight: 400;
14983 font-family: "DM Sans", sans-serif;
14984 color: #6E7A85;
14985 line-height: 13px;
14986 }
14987 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-grid {
14988 display: flex;
14989 gap: 10px;
14990 justify-content: center;
14991 flex-wrap: wrap;
14992 }
14993 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-grid .wpfnl-mm-plugin-card {
14994 min-width: 86px;
14995 height: 44px;
14996 border: 1px solid #F1EFF7;
14997 border-radius: 12px;
14998 background: #FFF;
14999 display: flex;
15000 align-items: center;
15001 justify-content: center;
15002 padding: 0 20px;
15003 position: relative;
15004 }
15005 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-grid .wpfnl-mm-plugin-card .wpfnl-mm-plugin-badge {
15006 position: absolute;
15007 top: -8px;
15008 right: -8px;
15009 background: #239654;
15010 color: #FFF;
15011 font-size: 10px;
15012 font-weight: 700;
15013 font-family: "DM Sans", sans-serif;
15014 padding: 5px;
15015 border-radius: 5px;
15016 line-height: 24px;
15017 }
15018 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-grid .wpfnl-mm-plugin-card .wpfnl-mm-plugin-icon {
15019 display: flex;
15020 align-items: center;
15021 justify-content: center;
15022 }
15023 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-grid .wpfnl-mm-plugin-card .wpfnl-mm-plugin-icon img, .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-grid .wpfnl-mm-plugin-card .wpfnl-mm-plugin-icon svg {
15024 max-width: 100%;
15025 height: auto;
15026 }
15027 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-note {
15028 display: flex;
15029 align-items: flex-start;
15030 gap: 7px;
15031 padding-top: 22px;
15032 border-top: 1px solid #EAE9EE;
15033 margin-top: 0;
15034 width: 100%;
15035 justify-content: center;
15036 }
15037 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-note svg {
15038 width: 16px;
15039 height: 16px;
15040 flex-shrink: 0;
15041 margin-top: 2px;
15042 }
15043 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content .wpfnl-mm-plugins-note p {
15044 font-size: 14px;
15045 font-weight: 400;
15046 font-family: "DM Sans", sans-serif;
15047 color: #7A8C9A;
15048 line-height: 15px;
15049 margin: 0;
15050 max-width: 588px;
15051 }
15052 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info {
15053 display: flex;
15054 align-items: center;
15055 justify-content: center;
15056 gap: 6px;
15057 border-top: 1px solid #F1EFF7;
15058 padding: 20px 20px;
15059 }
15060 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info svg {
15061 flex-shrink: 0;
15062 }
15063 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info p {
15064 margin: 0;
15065 color: #E4781B;
15066 font-size: 14px;
15067 font-weight: 400;
15068 line-height: 1.3;
15069 }
15070 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info strong {
15071 font-weight: 600;
15072 }
15073 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns {
15074 display: grid;
15075 grid-template-columns: 2fr 1fr;
15076 gap: 16px;
15077 align-items: start;
15078 }
15079 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns .wpfnl-mm-setup-section-content {
15080 padding: 28px 20px;
15081 }
15082 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns .wpfnl-mm-page-builders .wpfnl-mm-woo-status {
15083 display: grid;
15084 grid-template-columns: repeat(3, 1fr);
15085 gap: 10px;
15086 width: 100%;
15087 justify-content: unset;
15088 }
15089 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns .wpfnl-mm-page-builders .wpfnl-setup-plugins-card {
15090 width: 100%;
15091 min-width: unset;
15092 }
15093 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns .wpfnl-mm-essential-plugins .wpfnl-mm-woo-status {
15094 grid-template-columns: 1fr;
15095 }
15096 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns .wpfnl-mm-essential-plugins .wpfnl-setup-plugins-card:only-child {
15097 max-width: 100%;
15098 grid-column: auto;
15099 margin: 0;
15100 }
15101 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel {
15102 width: 100%;
15103 max-width: 1049px;
15104 display: flex;
15105 flex-direction: column;
15106 gap: 15px;
15107 position: relative;
15108 }
15109 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-header {
15110 text-align: center;
15111 margin-bottom: 15px;
15112 }
15113 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-header .wpfnl-mm-build-funnel-title {
15114 font-size: 24px;
15115 font-weight: 700;
15116 font-family: "DM Sans", sans-serif;
15117 color: #363B4E;
15118 line-height: 35px;
15119 letter-spacing: -1px;
15120 margin: 0 0 8px 0;
15121 }
15122 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-header .wpfnl-mm-build-funnel-subtitle {
15123 font-size: 15px;
15124 font-weight: 400;
15125 font-family: "DM Sans", sans-serif;
15126 color: #6E7A85;
15127 line-height: 15px;
15128 margin: 0;
15129 }
15130 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-container {
15131 display: flex;
15132 gap: 3px;
15133 }
15134 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-form {
15135 width: 461px;
15136 background: #FFF;
15137 border-radius: 16px;
15138 padding: 40px;
15139 display: flex;
15140 flex-direction: column;
15141 min-height: 482px;
15142 gap: 30px;
15143 }
15144 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-fields {
15145 display: flex;
15146 flex-direction: column;
15147 gap: 40px;
15148 flex: 1;
15149 }
15150 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-field {
15151 display: flex;
15152 flex-direction: column;
15153 gap: 9px;
15154 }
15155 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-label {
15156 font-size: 15px;
15157 font-weight: 500;
15158 font-family: "DM Sans", sans-serif;
15159 color: #363B4E;
15160 letter-spacing: -0.44px;
15161 line-height: 16px;
15162 }
15163 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-label .required {
15164 color: red;
15165 }
15166 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-label .optional {
15167 font-weight: 400;
15168 color: #7A8C9A;
15169 }
15170 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown {
15171 position: relative;
15172 }
15173 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-trigger {
15174 height: 46px;
15175 background: #FFF;
15176 border: 1px solid #F1EFF7;
15177 border-radius: 8px;
15178 padding: 0 16px;
15179 display: flex;
15180 align-items: center;
15181 justify-content: space-between;
15182 cursor: pointer;
15183 transition: all 0.3s ease;
15184 }
15185 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-trigger .placeholder {
15186 font-size: 14px;
15187 font-family: "DM Sans", sans-serif;
15188 color: #7A8C9A;
15189 }
15190 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-trigger .selected-value {
15191 font-size: 14px;
15192 font-family: "DM Sans", sans-serif;
15193 color: #363B4E;
15194 }
15195 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-trigger .dropdown-icon {
15196 transition: transform 0.3s ease;
15197 }
15198 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown.open .wpfnl-mm-build-funnel-dropdown-trigger {
15199 border-color: #6E42D3;
15200 }
15201 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown.open .wpfnl-mm-build-funnel-dropdown-trigger .dropdown-icon {
15202 transform: rotate(180deg);
15203 }
15204 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-menu {
15205 position: absolute;
15206 top: 100%;
15207 left: 0;
15208 right: 0;
15209 background: #FFF;
15210 border: 1px solid #F1EFF7;
15211 border-radius: 8px;
15212 margin-top: 4px;
15213 z-index: 100;
15214 box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
15215 max-height: 270px;
15216 }
15217 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-item {
15218 padding: 12px 16px;
15219 font-size: 14px;
15220 font-family: "DM Sans", sans-serif;
15221 color: #363B4E;
15222 cursor: pointer;
15223 display: flex;
15224 align-items: center;
15225 justify-content: space-between;
15226 transition: background 0.2s ease;
15227 }
15228 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-item:hover {
15229 background: #F6F5FA;
15230 }
15231 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown .wpfnl-mm-build-funnel-dropdown-item.selected {
15232 background: #F6F5FA;
15233 color: #6E42D3;
15234 }
15235 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-hint {
15236 font-size: 12px;
15237 font-family: "Inter", sans-serif;
15238 color: #7A8C9A;
15239 line-height: 16px;
15240 margin: 0;
15241 }
15242 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-revenue {
15243 margin-top: auto;
15244 padding: 16px 20px;
15245 background: #F6F5FA;
15246 border: 1px dashed #6E42D3;
15247 border-radius: 8px;
15248 display: none;
15249 }
15250 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-revenue .wpfnl-mm-build-funnel-revenue-label {
15251 font-size: 14px;
15252 font-family: "DM Sans", sans-serif;
15253 color: #7A8C9A;
15254 margin: 0 0 4px 0;
15255 font-weight: 500;
15256 }
15257 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-revenue .wpfnl-mm-build-funnel-revenue-value {
15258 font-size: 16px;
15259 font-family: "DM Sans", sans-serif;
15260 font-weight: 500;
15261 color: #363B4E;
15262 margin: 0;
15263 }
15264 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-revenue .wpfnl-mm-build-funnel-revenue-value .total {
15265 color: #6E42D3;
15266 font-weight: 700;
15267 }
15268 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview {
15269 flex: 1;
15270 background: #FFF;
15271 border-radius: 16px;
15272 min-height: 484px;
15273 display: flex;
15274 flex-direction: column;
15275 }
15276 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tabs {
15277 display: flex;
15278 align-items: center;
15279 justify-content: center;
15280 padding: 20px 20px 0;
15281 gap: 0;
15282 }
15283 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab {
15284 display: flex;
15285 flex-direction: column;
15286 align-items: center;
15287 gap: 8px;
15288 cursor: pointer;
15289 }
15290 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab .wpfnl-mm-build-funnel-tab-icon {
15291 width: 48px;
15292 height: 48px;
15293 border-radius: 50%;
15294 border: 1px solid #F1EFF7;
15295 display: flex;
15296 align-items: center;
15297 justify-content: center;
15298 color: #6E7A85;
15299 transition: all 0.3s ease;
15300 }
15301 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab .wpfnl-mm-build-funnel-tab-label {
15302 font-size: 12px;
15303 font-family: "Inter", sans-serif;
15304 font-weight: 500;
15305 color: #6E7A85;
15306 text-align: center;
15307 }
15308 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab.active .wpfnl-mm-build-funnel-tab-icon {
15309 border: 1.5px solid #6E42D3;
15310 color: #6E42D3;
15311 box-shadow: 0px 20px 30px rgba(199, 191, 217, 0.3);
15312 }
15313 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab.active .wpfnl-mm-build-funnel-tab-label {
15314 color: #363B4E;
15315 }
15316 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab-line {
15317 width: 22px;
15318 height: 1px;
15319 background: #E5E5E5;
15320 margin: 0 8px;
15321 margin-bottom: 24px;
15322 }
15323 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-content {
15324 flex: 1;
15325 padding: 20px;
15326 }
15327 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-image {
15328 width: 100%;
15329 height: 100%;
15330 min-height: auto;
15331 background: #F6F5FA;
15332 border-radius: 16px;
15333 overflow: hidden;
15334 display: flex;
15335 align-items: flex-start;
15336 justify-content: center;
15337 padding: 16px;
15338 }
15339 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-image img {
15340 width: 100%;
15341 height: 350px;
15342 object-fit: cover;
15343 object-position: top center;
15344 border-radius: 10px;
15345 }
15346 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder,
15347 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty {
15348 display: flex;
15349 flex-direction: column;
15350 align-items: center;
15351 justify-content: center;
15352 height: 100%;
15353 min-height: 400px;
15354 color: #7A8C9A;
15355 text-align: center;
15356 padding: 40px;
15357 }
15358 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder svg,
15359 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty svg {
15360 margin-bottom: 16px;
15361 opacity: 0.5;
15362 }
15363 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder p,
15364 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty p {
15365 font-size: 14px;
15366 font-family: "DM Sans", sans-serif;
15367 margin: 0;
15368 }
15369 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder h4,
15370 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty h4 {
15371 font-size: 18px;
15372 font-family: "DM Sans", sans-serif;
15373 font-weight: 600;
15374 color: #363B4E;
15375 margin: 0 0 8px 0;
15376 }
15377 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-buttons {
15378 display: flex;
15379 justify-content: space-between;
15380 align-items: center;
15381 width: 100%;
15382 }
15383 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-buttons .wpfnl-mm-btn-skip {
15384 background: transparent;
15385 color: #7A8C9A;
15386 font-weight: 500;
15387 font-size: 15px;
15388 padding: 10px;
15389 border: none;
15390 cursor: pointer;
15391 }
15392 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-buttons .wpfnl-mm-btn-skip:hover {
15393 color: #6E42D3;
15394 }
15395 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template {
15396 width: 100%;
15397 max-width: 940px;
15398 display: flex;
15399 flex-direction: column;
15400 gap: 0;
15401 position: relative;
15402 }
15403 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-setup-header {
15404 text-align: center;
15405 margin-bottom: 24px;
15406 }
15407 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-setup-header .wpfnl-mm-setup-title {
15408 font-size: 24px;
15409 font-weight: 700;
15410 font-family: "DM Sans", sans-serif;
15411 color: #363B4E;
15412 line-height: 35px;
15413 letter-spacing: -1px;
15414 margin: 0 0 8px 0;
15415 height: 30px;
15416 }
15417 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-setup-header .wpfnl-mm-setup-subtitle {
15418 font-size: 15px;
15419 font-weight: 400;
15420 font-family: "DM Sans", sans-serif;
15421 color: #6E7A85;
15422 line-height: 15px;
15423 margin: 0;
15424 height: 19px;
15425 }
15426 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-templates-grid {
15427 display: flex;
15428 flex-wrap: wrap;
15429 gap: 30px;
15430 justify-content: center;
15431 align-items: center;
15432 background: #FFF;
15433 border-radius: 16px;
15434 padding: 40px 45px;
15435 margin-bottom: 15px;
15436 }
15437 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card {
15438 width: 259px;
15439 height: 305px;
15440 background: #FFF;
15441 border: 1px solid #F1EFF7;
15442 border-radius: 10px;
15443 cursor: pointer;
15444 transition: all 0.3s ease;
15445 position: relative;
15446 overflow: hidden;
15447 box-shadow: 0px 20px 20px 0px rgba(190, 190, 215, 0.15);
15448 }
15449 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card:hover {
15450 border-color: #C4B5F4;
15451 }
15452 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card:hover .wpfnl-mm-template-card-overlay {
15453 opacity: 1;
15454 visibility: visible;
15455 }
15456 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-preview {
15457 width: 100%;
15458 height: 237px;
15459 position: relative;
15460 overflow: hidden;
15461 background: #F6F5FA;
15462 border-radius: 10px 10px 0 0;
15463 }
15464 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-preview img {
15465 width: 100%;
15466 height: 100%;
15467 object-fit: cover;
15468 object-position: top center;
15469 }
15470 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay {
15471 position: absolute;
15472 top: 0;
15473 left: 0;
15474 width: 100%;
15475 height: 237px;
15476 background: rgba(38, 33, 51, 0.44);
15477 display: flex;
15478 align-items: center;
15479 justify-content: center;
15480 gap: 10px;
15481 opacity: 0;
15482 visibility: hidden;
15483 transition: all 0.3s ease;
15484 border-radius: 10px 10px 0 0;
15485 }
15486 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay .wpfnl-mm-btn-import,
15487 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay .wpfnl-mm-btn-preview {
15488 height: 30px;
15489 border-radius: 8px;
15490 font-size: 14px;
15491 font-weight: 500;
15492 cursor: pointer;
15493 transition: all 0.3s ease;
15494 border: none;
15495 display: inline-flex;
15496 align-items: center;
15497 justify-content: center;
15498 padding: 0 12px;
15499 }
15500 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay .wpfnl-mm-btn-import {
15501 background: #FFF;
15502 color: #363B4E;
15503 }
15504 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay .wpfnl-mm-btn-import:hover {
15505 background: #F6F5FA;
15506 }
15507 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay .wpfnl-mm-btn-preview {
15508 background: transparent;
15509 color: #FFF;
15510 border: 1px solid #F2F2F2;
15511 }
15512 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay .wpfnl-mm-btn-preview:hover {
15513 background: rgba(255, 255, 255, 0.1);
15514 }
15515 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-checkmark {
15516 position: absolute;
15517 top: 12px;
15518 right: 12px;
15519 width: 24px;
15520 height: 24px;
15521 background: #FFF;
15522 border-radius: 50%;
15523 display: flex;
15524 align-items: center;
15525 justify-content: center;
15526 z-index: 2;
15527 box-shadow: 0 2px 10px 1px rgba(143, 130, 196, 0.431372549);
15528 }
15529 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-suggested {
15530 position: absolute;
15531 top: 10px;
15532 left: 10px;
15533 z-index: 2;
15534 display: inline-flex;
15535 align-items: center;
15536 gap: 4px;
15537 padding: 3px 8px 3px 6px;
15538 border-radius: 100px;
15539 background: #6E42D3;
15540 color: #FFF;
15541 font-size: 10px;
15542 font-weight: 600;
15543 font-family: "DM Sans", sans-serif;
15544 line-height: 1.4;
15545 letter-spacing: 0.1px;
15546 box-shadow: 0 2px 6px rgba(110, 66, 211, 0.35);
15547 }
15548 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-suggested svg {
15549 flex-shrink: 0;
15550 }
15551 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card.wpfnl-mm-template-card--suggested:not(.active) {
15552 border-color: #C4B5F4;
15553 }
15554 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-divider {
15555 width: 100%;
15556 height: 1px;
15557 background: #F1EFF7;
15558 }
15559 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-body {
15560 padding: 16px 20px;
15561 display: flex;
15562 flex-direction: column;
15563 align-items: center;
15564 justify-content: center;
15565 text-align: center;
15566 gap: 4px;
15567 }
15568 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-title {
15569 font-size: 14px;
15570 font-weight: 500;
15571 font-family: "Roboto", sans-serif;
15572 color: #363B4E;
15573 line-height: normal;
15574 margin: 0;
15575 }
15576 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-steps {
15577 font-size: 12px;
15578 font-weight: 400;
15579 font-family: "Inter", sans-serif;
15580 color: #7A8B9A;
15581 line-height: 12px;
15582 letter-spacing: -0.12px;
15583 }
15584 @keyframes wpfnl-skeleton-shimmer {
15585 0% {
15586 background-position: -600px 0;
15587 }
15588 100% {
15589 background-position: 600px 0;
15590 }
15591 }
15592 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-skeleton-block {
15593 background: linear-gradient(90deg, #f0eef8 25%, #e4e0f2 50%, #f0eef8 75%);
15594 background-size: 600px 100%;
15595 animation: wpfnl-skeleton-shimmer 1.4s ease-in-out infinite;
15596 border-radius: 6px;
15597 }
15598 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-templates-skeleton {
15599 pointer-events: none;
15600 }
15601 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card--skeleton {
15602 cursor: default;
15603 }
15604 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card--skeleton .wpfnl-mm-template-card-preview {
15605 border-radius: 10px 10px 0 0;
15606 }
15607 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card--skeleton .wpfnl-mm-skeleton-title {
15608 width: 120px;
15609 height: 14px;
15610 }
15611 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card--skeleton .wpfnl-mm-skeleton-steps {
15612 width: 60px;
15613 height: 10px;
15614 margin-top: 2px;
15615 }
15616 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete {
15617 width: 100%;
15618 max-width: 785px;
15619 display: flex;
15620 flex-direction: column;
15621 gap: 28px;
15622 align-items: center;
15623 position: relative;
15624 }
15625 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-header {
15626 text-align: center;
15627 max-width: 631px;
15628 }
15629 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-header .wpfnl-mm-complete-title {
15630 font-size: 24px;
15631 font-weight: 700;
15632 font-family: "DM Sans", sans-serif;
15633 color: #363B4E;
15634 line-height: 35px;
15635 letter-spacing: -1px;
15636 margin: 0 0 8px 0;
15637 }
15638 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-header .wpfnl-mm-complete-subtitle {
15639 font-size: 15px;
15640 font-weight: 400;
15641 font-family: "DM Sans", sans-serif;
15642 color: #6E7A85;
15643 line-height: 22px;
15644 margin: 0;
15645 max-width: 534px;
15646 margin-left: auto;
15647 margin-right: auto;
15648 }
15649 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper {
15650 width: 100%;
15651 padding: 10px;
15652 background: #FFF;
15653 border-radius: 16px;
15654 box-shadow: 0px 2px 3px rgba(147, 130, 171, 0.05), 0px 4px 5px rgba(85, 85, 85, 0.04), 0px 4px 5px rgba(85, 85, 85, 0.03), 0px 16px 16px rgba(85, 85, 85, 0.02);
15655 }
15656 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video {
15657 width: 100%;
15658 height: 382px;
15659 border-radius: 16px;
15660 background: #F6F5FA;
15661 position: relative;
15662 overflow: hidden;
15663 display: flex;
15664 flex-direction: column;
15665 }
15666 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-bg {
15667 position: absolute;
15668 top: 0;
15669 left: 0;
15670 width: 100%;
15671 height: 100%;
15672 }
15673 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-bg .wpfnl-mm-complete-video-image {
15674 width: 100%;
15675 height: 100%;
15676 object-fit: cover;
15677 object-position: center top;
15678 }
15679 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-bg .wpfnl-mm-complete-video-overlay {
15680 position: absolute;
15681 top: 0;
15682 left: 0;
15683 width: 100%;
15684 height: 100%;
15685 background: linear-gradient(180deg, rgba(60, 37, 111, 0) 37.658%, rgba(75, 52, 129, 0.3) 74.038%);
15686 border-radius: 16px;
15687 cursor: pointer;
15688 }
15689 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-iframe {
15690 width: 100%;
15691 height: 100%;
15692 }
15693 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-player {
15694 position: absolute;
15695 bottom: 18px;
15696 left: 20px;
15697 right: 20px;
15698 display: flex;
15699 align-items: center;
15700 gap: 12px;
15701 }
15702 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-player .wpfnl-mm-complete-play-btn {
15703 width: 16px;
15704 height: 16px;
15705 background: transparent;
15706 border: none;
15707 cursor: pointer;
15708 padding: 0;
15709 display: flex;
15710 align-items: center;
15711 justify-content: center;
15712 flex-shrink: 0;
15713 }
15714 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-player .wpfnl-mm-complete-play-btn svg {
15715 width: 16px;
15716 height: 16px;
15717 }
15718 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-player .wpfnl-mm-complete-progress-bar {
15719 flex: 1;
15720 height: 9px;
15721 background: linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
15722 border-radius: 100px;
15723 overflow: hidden;
15724 }
15725 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video .wpfnl-mm-complete-video-player .wpfnl-mm-complete-progress-bar .wpfnl-mm-complete-progress-fill {
15726 width: 0%;
15727 height: 100%;
15728 background: #6E42D3;
15729 border-radius: 100px;
15730 }
15731 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions {
15732 display: flex;
15733 flex-direction: column;
15734 align-items: center;
15735 gap: 6px;
15736 width: 100%;
15737 }
15738 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-complete-buttons {
15739 display: flex;
15740 gap: 12px;
15741 align-items: center;
15742 justify-content: center;
15743 }
15744 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-btn {
15745 padding: 10px 20px;
15746 border-radius: 10px;
15747 font-size: 16px;
15748 line-height: 24px;
15749 cursor: pointer;
15750 transition: all 0.3s ease;
15751 border: none;
15752 display: inline-flex;
15753 align-items: center;
15754 justify-content: center;
15755 gap: 8px;
15756 height: 44px;
15757 }
15758 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-btn.wpfnl-mm-btn-secondary {
15759 background: #FFF;
15760 color: #363B4E;
15761 border: 1px solid #ECEBF0;
15762 font-weight: 700;
15763 }
15764 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-btn.wpfnl-mm-btn-secondary:hover {
15765 border-color: #6E42D3;
15766 color: #6E42D3;
15767 }
15768 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-btn.wpfnl-mm-btn-primary {
15769 background: #6E42D3;
15770 color: #FFF;
15771 font-weight: 600;
15772 letter-spacing: 0.2px;
15773 }
15774 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-btn.wpfnl-mm-btn-primary svg {
15775 width: 17px;
15776 height: 12px;
15777 }
15778 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-btn.wpfnl-mm-btn-primary:hover {
15779 background: #5c36b3;
15780 }
15781 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-complete-info {
15782 padding: 10px;
15783 text-align: center;
15784 }
15785 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-complete-info p {
15786 font-size: 14px;
15787 font-weight: 400;
15788 color: #7A8C9A;
15789 line-height: 22px;
15790 margin: 0;
15791 }
15792 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome {
15793 width: 100%;
15794 }
15795 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-wizard-welcome-content {
15796 width: 100%;
15797 max-width: 918px;
15798 margin: 0 auto;
15799 padding: 40px 30px 0;
15800 border-radius: 20px;
15801 background: #FFF;
15802 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
15803 overflow: hidden;
15804 }
15805 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-wizard-welcome-title {
15806 color: #363B4E;
15807 text-align: center;
15808 font-size: 34px;
15809 font-weight: 600;
15810 line-height: 1.3;
15811 letter-spacing: -0.6px;
15812 text-align: center;
15813 }
15814 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-wizard-welcome-subtitle {
15815 color: #6E7A85;
15816 font-size: 15px;
15817 font-weight: 400;
15818 line-height: 1.4;
15819 text-align: center;
15820 margin-top: 4px;
15821 }
15822 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-mm-choose-goal-buttons {
15823 justify-content: center;
15824 margin-top: 24px;
15825 }
15826 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .welcome-image {
15827 margin: 0;
15828 display: block;
15829 transform: translateX(30px);
15830 }
15831 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .welcome-image img {
15832 display: block;
15833 margin-left: auto;
15834 margin-top: 67px;
15835 }
15836 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container {
15837 padding: 40px 30px 30px;
15838 border-radius: 20px;
15839 background: #FFF;
15840 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
15841 }
15842 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search {
15843 display: flex;
15844 align-items: center;
15845 justify-content: space-between;
15846 gap: 16px;
15847 margin-bottom: 24px;
15848 }
15849 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper {
15850 flex: 1;
15851 position: relative;
15852 display: flex;
15853 align-items: center;
15854 gap: 0px;
15855 padding: 10px 14px;
15856 border: 1px solid #EEF0F3;
15857 border-radius: 8px;
15858 background: #FFF;
15859 transition: all 0.3s ease;
15860 }
15861 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper:focus-within {
15862 border-color: #6E42D3;
15863 }
15864 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper svg {
15865 flex-shrink: 0;
15866 }
15867 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper .wpfnl-product-sync-search-input {
15868 flex: 1;
15869 border: none !important;
15870 outline: none;
15871 font-size: 14px;
15872 color: #7A8B9A;
15873 background: transparent;
15874 box-shadow: none !important;
15875 }
15876 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper .wpfnl-product-sync-search-input::placeholder {
15877 color: #9CA3AF;
15878 }
15879 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn {
15880 display: inline-flex;
15881 align-items: center;
15882 gap: 5px;
15883 padding: 12px 20px;
15884 border: none;
15885 border-radius: 10px;
15886 color: #6E42D3;
15887 font-size: 14px;
15888 font-weight: 500;
15889 cursor: pointer;
15890 transition: all 0.3s ease;
15891 white-space: nowrap;
15892 background: rgba(110, 66, 211, 0.12);
15893 }
15894 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn path {
15895 transition: all 0.3s ease;
15896 stroke: #5B35B8;
15897 }
15898 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn:hover {
15899 background: #5B35B8;
15900 border-color: #5B35B8;
15901 color: #fff;
15902 }
15903 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn:hover path {
15904 stroke: #fff;
15905 }
15906 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn svg {
15907 display: block;
15908 }
15909 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-label {
15910 margin-bottom: 16px;
15911 color: #7A8B9A;
15912 font-size: 14px;
15913 font-weight: 400;
15914 line-height: 1;
15915 }
15916 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-cards {
15917 display: flex;
15918 flex-direction: column;
15919 gap: 12px;
15920 }
15921 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card {
15922 display: flex;
15923 align-items: center;
15924 gap: 14px;
15925 padding: 20px;
15926 border: 1px solid #F1EFF7;
15927 border-radius: 12px;
15928 background: #FFF;
15929 cursor: pointer;
15930 transition: all 0.3s ease;
15931 position: relative;
15932 }
15933 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-radio {
15934 position: absolute;
15935 opacity: 0;
15936 width: 0;
15937 height: 0;
15938 pointer-events: none;
15939 }
15940 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card:hover {
15941 border-color: #D1D5DB;
15942 }
15943 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card.active {
15944 border-color: #6E42D3;
15945 }
15946 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-image {
15947 width: 67px;
15948 height: 67px;
15949 border-radius: 8px;
15950 display: flex;
15951 align-items: center;
15952 justify-content: center;
15953 border: 1px solid #F1EFF7;
15954 }
15955 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-image img {
15956 display: block;
15957 height: 100%;
15958 width: 100%;
15959 object-fit: cover;
15960 border-radius: 8px;
15961 }
15962 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-image svg {
15963 width: 32px;
15964 height: 32px;
15965 }
15966 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-content {
15967 display: flex;
15968 flex-direction: column;
15969 width: calc(100% - 82px);
15970 padding-right: 30px;
15971 }
15972 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-title {
15973 margin: 0;
15974 color: #363B4E;
15975 font-size: 14px;
15976 font-weight: 700;
15977 line-height: 1.3;
15978 }
15979 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-description {
15980 margin: 0;
15981 color: #6E7A85;
15982 font-size: 15px;
15983 font-weight: 400;
15984 line-height: 1.4;
15985 }
15986 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-price {
15987 margin: 3px 0 0 0;
15988 color: #363B4E;
15989 font-size: 15px;
15990 font-weight: 700;
15991 line-height: 1;
15992 }
15993 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-checkbox {
15994 position: absolute;
15995 right: 20px;
15996 top: 50%;
15997 transform: translateY(-50%);
15998 }
15999 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-checkbox .wpfnl-product-sync-checkbox-circle {
16000 width: 24px;
16001 height: 24px;
16002 border-radius: 50%;
16003 border: 1px solid #D1D5DB;
16004 background: #FFF;
16005 display: flex;
16006 align-items: center;
16007 justify-content: center;
16008 transition: all 0.3s ease;
16009 }
16010 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-checkbox .wpfnl-product-sync-checkbox-circle svg {
16011 width: 14px;
16012 height: 14px;
16013 display: none;
16014 }
16015 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-radio:checked ~ .wpfnl-product-sync-card-checkbox .wpfnl-product-sync-checkbox-circle {
16016 background: #6E42D3;
16017 border-color: #6E42D3;
16018 }
16019 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-radio:checked ~ .wpfnl-product-sync-card-checkbox .wpfnl-product-sync-checkbox-circle svg {
16020 display: block;
16021 }
16022 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-skeleton {
16023 display: flex;
16024 flex-direction: column;
16025 gap: 12px;
16026 }
16027 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-skeleton-card {
16028 display: flex;
16029 align-items: center;
16030 gap: 14px;
16031 padding: 20px;
16032 border: 1px solid #F1EFF7;
16033 border-radius: 12px;
16034 background: #FFF;
16035 }
16036 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-pulse {
16037 background: linear-gradient(90deg, #F3F4F6 25%, #E5E7EB 50%, #F3F4F6 75%);
16038 background-size: 200% 100%;
16039 animation: wpfnl-skeleton-shimmer 1.5s ease-in-out infinite;
16040 border-radius: 6px;
16041 }
16042 @keyframes wpfnl-skeleton-shimmer {
16043 0% {
16044 background-position: 200% 0;
16045 }
16046 100% {
16047 background-position: -200% 0;
16048 }
16049 }
16050 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-image {
16051 width: 67px;
16052 height: 67px;
16053 border-radius: 8px;
16054 flex-shrink: 0;
16055 }
16056 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-content {
16057 flex: 1;
16058 display: flex;
16059 flex-direction: column;
16060 gap: 8px;
16061 padding-right: 30px;
16062 }
16063 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-title {
16064 height: 14px;
16065 width: 50%;
16066 }
16067 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-description {
16068 height: 12px;
16069 width: 70%;
16070 }
16071 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-price {
16072 height: 14px;
16073 width: 30%;
16074 }
16075 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-checkbox {
16076 width: 24px;
16077 height: 24px;
16078 border-radius: 50%;
16079 flex-shrink: 0;
16080 }
16081 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error {
16082 display: flex;
16083 flex-direction: column;
16084 align-items: center;
16085 justify-content: center;
16086 padding: 40px 20px;
16087 text-align: center;
16088 border: 1px solid #FEE2E2;
16089 border-radius: 12px;
16090 background: #FEF2F2;
16091 }
16092 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-error-icon {
16093 margin-bottom: 12px;
16094 }
16095 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-error-icon svg {
16096 display: block;
16097 }
16098 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-error-text {
16099 margin: 0 0 16px;
16100 color: #991B1B;
16101 font-size: 14px;
16102 font-weight: 500;
16103 line-height: 1.5;
16104 }
16105 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-retry-btn {
16106 display: inline-flex;
16107 align-items: center;
16108 gap: 6px;
16109 padding: 8px 18px;
16110 border: 1px solid #DC2626;
16111 border-radius: 8px;
16112 background: #FFF;
16113 color: #DC2626;
16114 font-size: 13px;
16115 font-weight: 500;
16116 cursor: pointer;
16117 transition: all 0.2s ease;
16118 }
16119 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-retry-btn:hover {
16120 background: #DC2626;
16121 color: #FFF;
16122 }
16123 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error.wpfnl-product-sync-template-error {
16124 flex-direction: row;
16125 padding: 14px 20px;
16126 margin-top: 12px;
16127 gap: 10px;
16128 }
16129 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error.wpfnl-product-sync-template-error .wpfnl-product-sync-error-icon {
16130 margin-bottom: 0;
16131 }
16132 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error.wpfnl-product-sync-template-error .wpfnl-product-sync-error-text {
16133 margin: 0;
16134 }
16135 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty {
16136 display: flex;
16137 flex-direction: column;
16138 align-items: center;
16139 justify-content: center;
16140 padding: 48px 20px;
16141 text-align: center;
16142 border: 1px dashed #D1D5DB;
16143 border-radius: 12px;
16144 background: #FAFAFA;
16145 }
16146 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-empty-icon {
16147 width: 64px;
16148 height: 64px;
16149 border-radius: 50%;
16150 background: #F3F4F6;
16151 display: flex;
16152 align-items: center;
16153 justify-content: center;
16154 margin-bottom: 16px;
16155 }
16156 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-empty-title {
16157 margin: 0 0 6px;
16158 color: #363B4E;
16159 font-size: 15px;
16160 font-weight: 600;
16161 line-height: 1.3;
16162 }
16163 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-empty-subtitle {
16164 margin: 0 0 20px;
16165 color: #6E7A85;
16166 font-size: 13px;
16167 font-weight: 400;
16168 line-height: 1.5;
16169 max-width: 300px;
16170 }
16171 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-create-btn {
16172 display: inline-flex;
16173 align-items: center;
16174 gap: 6px;
16175 padding: 10px 22px;
16176 border: none;
16177 border-radius: 10px;
16178 background: #6E42D3;
16179 color: #FFF;
16180 font-size: 14px;
16181 font-weight: 500;
16182 cursor: pointer;
16183 transition: all 0.2s ease;
16184 }
16185 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-create-btn:hover {
16186 background: #5B35B8;
16187 }
16188 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container {
16189 border-radius: 20px;
16190 background: #FFF;
16191 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
16192 display: flex;
16193 align-items: center;
16194 justify-content: center;
16195 height: 508px;
16196 position: relative;
16197 }
16198 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .wpfnl-generate-funnel-canvas {
16199 width: 100%;
16200 height: auto;
16201 max-width: 580px;
16202 border-radius: 20px;
16203 }
16204 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .wpfnl-generate-funnel-canvas img {
16205 width: 100%;
16206 height: 100%;
16207 border-radius: 20px;
16208 }
16209 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-funnel-overlay {
16210 position: absolute;
16211 top: 0;
16212 left: 0;
16213 right: 0;
16214 bottom: 0;
16215 border-radius: 20px;
16216 background: rgba(75, 52, 129, 0.4);
16217 backdrop-filter: blur(0);
16218 border: 1px solid #fff;
16219 padding: 20px;
16220 display: flex;
16221 flex-flow: column;
16222 align-items: center;
16223 justify-content: flex-end;
16224 }
16225 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-funnel-overlay .generated-notice {
16226 border-radius: 12px;
16227 background: #FFF;
16228 box-shadow: 0 4px 4px 0 rgba(151, 145, 166, 0.3);
16229 display: inline-flex;
16230 align-items: center;
16231 justify-content: center;
16232 gap: 6px;
16233 color: #6E7A85;
16234 font-size: 16px;
16235 font-weight: 400;
16236 line-height: 1;
16237 padding: 13px 20px;
16238 }
16239 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container.generating .generate-funnel-overlay {
16240 justify-content: center;
16241 backdrop-filter: blur(5px);
16242 }
16243 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container {
16244 /* HTML: <div class="loader"></div> */
16245 }
16246 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader {
16247 width: 50px;
16248 aspect-ratio: 1;
16249 display: grid;
16250 border-radius: 50%;
16251 background: linear-gradient(0deg, rgba(244, 230, 230, 0.5) 30%, rgba(255, 255, 255, 0) 0 70%, rgb(255, 255, 255) 0) 50%/8% 100%, linear-gradient(90deg, rgba(255, 255, 255, 0.25) 30%, rgba(255, 255, 255, 0) 0 70%, rgba(255, 255, 255, 0.75) 0) 50%/100% 8%;
16252 background-repeat: no-repeat;
16253 animation: l23 1s infinite steps(12);
16254 }
16255 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader::before,
16256 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader::after {
16257 content: "";
16258 grid-area: 1/1;
16259 border-radius: 50%;
16260 background: inherit;
16261 opacity: 0.915;
16262 transform: rotate(30deg);
16263 }
16264 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader::after {
16265 opacity: 0.83;
16266 transform: rotate(60deg);
16267 }
16268 @keyframes l23 {
16269 100% {
16270 transform: rotate(1turn);
16271 }
16272 }
16273 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay {
16274 position: fixed;
16275 top: 0;
16276 left: 0;
16277 width: 100%;
16278 height: 100%;
16279 background-color: rgba(0, 0, 0, 0.3);
16280 justify-content: center;
16281 align-items: center;
16282 display: flex;
16283 z-index: 999999;
16284 }
16285 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay .wpfnl-modal-wrapper {
16286 width: 80%;
16287 background: #FFF;
16288 padding: 25px;
16289 height: 80%;
16290 border-radius: 10px;
16291 position: relative;
16292 }
16293 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay .wpfnl-modal-close-btn {
16294 position: absolute;
16295 right: -14px;
16296 top: -14px;
16297 background: #ffffff;
16298 box-shadow: 0px 1px 1px #dadada;
16299 border-radius: 100px;
16300 width: 34px;
16301 height: 34px;
16302 display: flex;
16303 align-items: center;
16304 justify-content: center;
16305 cursor: pointer;
16306 z-index: 2;
16307 }
16308 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay #wpfnl-create-product {
16309 width: 100%;
16310 height: 100%;
16311 }
16312 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay #wpfnl-create-product iframe {
16313 height: 100%;
16314 }
16315 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay .wpfnl-loader {
16316 border: 2px solid #8265c5;
16317 border-radius: 50%;
16318 border-top: 2px solid #fff;
16319 width: 50px;
16320 height: 50px;
16321 animation: spin 0.7s linear infinite;
16322 display: block;
16323 margin-left: 4px;
16324 position: absolute;
16325 left: 50%;
16326 top: 50%;
16327 transform: translate(-50%, -50%);
16328 z-index: 2;
16329 background: #fff;
16330 }
16331 @-webkit-keyframes spin {
16332 0% {
16333 -webkit-transform: rotate(0deg);
16334 }
16335 100% {
16336 -webkit-transform: rotate(360deg);
16337 }
16338 }
16339 @keyframes spin {
16340 0% {
16341 transform: rotate(0deg);
16342 }
16343 100% {
16344 transform: rotate(360deg);
16345 }
16346 }
16347 .wpfunnels-setup {
16348 /* ==========================================================================
16349 Setup wizard shell — top bar + centered body + progress footer.
16350
16351 Replaces the former left-sidebar chrome. Uses the existing WPFunnels
16352 brand tokens (#6E42D3 / DM Sans) so the wizard stays consistent with the
16353 rest of the admin.
16354 ========================================================================== */
16355 }
16356 .wpfunnels-setup .wpfnl-wz {
16357 font-family: "DM Sans", sans-serif;
16358 background: #F6F5FA;
16359 display: flex;
16360 flex-direction: column;
16361 height: 100%;
16362 min-height: 100vh;
16363 color: #363B4E;
16364 -webkit-font-smoothing: antialiased;
16365 }
16366 .wpfunnels-setup .wpfnl-wz *, .wpfunnels-setup .wpfnl-wz *::before, .wpfunnels-setup .wpfnl-wz *::after {
16367 box-sizing: border-box;
16368 }
16369 .wpfunnels-setup .wpfnl-wz {
16370 /* ---------- Top bar ---------- */
16371 }
16372 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-top {
16373 flex-shrink: 0;
16374 height: 60px;
16375 background: #FFFFFF;
16376 border-bottom: 1px solid #ECEBF0;
16377 padding: 0 28px;
16378 display: flex;
16379 align-items: center;
16380 justify-content: space-between;
16381 gap: 16px;
16382 }
16383 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-logo {
16384 display: flex;
16385 align-items: center;
16386 gap: 9px;
16387 flex: 1 0 0;
16388 }
16389 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-logo-mark {
16390 width: 26px;
16391 height: 26px;
16392 display: block;
16393 }
16394 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-logo-text {
16395 font-size: 15px;
16396 font-weight: 700;
16397 letter-spacing: -0.2px;
16398 color: #363B4E;
16399 }
16400 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-step-label {
16401 margin: 0;
16402 font-size: 12px;
16403 font-weight: 700;
16404 letter-spacing: 0.08em;
16405 text-transform: uppercase;
16406 white-space: nowrap;
16407 }
16408 .wpfunnels-setup .wpfnl-wz {
16409 /* Balances the logo column so the step counter stays centered — see the
16410 template comment. The visible chip lives on the button inside it. */
16411 }
16412 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit-slot {
16413 flex: 1 0 0;
16414 display: flex;
16415 justify-content: flex-end;
16416 }
16417 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit {
16418 display: inline-flex;
16419 align-items: center;
16420 gap: 8px;
16421 background: none;
16422 border: 0;
16423 padding: 8px 4px;
16424 cursor: pointer;
16425 font-family: inherit;
16426 font-weight: 700;
16427 white-space: nowrap;
16428 color: #363B4E;
16429 }
16430 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit svg {
16431 flex-shrink: 0;
16432 }
16433 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit:focus-visible {
16434 outline: 2px solid #6E42D3;
16435 outline-offset: 2px;
16436 border-radius: 4px;
16437 }
16438 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit-text {
16439 font-size: 12px;
16440 }
16441 .wpfunnels-setup .wpfnl-wz {
16442 /* ---------- Body ---------- */
16443 }
16444 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-body {
16445 flex: 1 1 auto;
16446 overflow-y: auto;
16447 display: flex;
16448 align-items: flex-start;
16449 justify-content: center;
16450 padding: 40px 24px 24px;
16451 }
16452 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-center {
16453 width: 100%;
16454 max-width: 960px;
16455 margin: auto;
16456 text-align: center;
16457 display: flex;
16458 flex-direction: column;
16459 align-items: center;
16460 }
16461 .wpfunnels-setup .wpfnl-wz {
16462 /* ---------- Welcome step ----------
16463 This step has no wizard footer — its own "Get started" button is the
16464 primary action — so it stretches to fill the body. The hero group takes
16465 the free space via auto margins, which centers it and leaves the consent
16466 opt-in resting on the bottom edge rather than floating under the CTA. */
16467 }
16468 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome {
16469 align-self: stretch;
16470 margin: 0;
16471 /* .wpfnl-wz-center caps at 960px; the one-line subtitle alone runs ~930px,
16472 which leaves almost no margin. The higher specificity here (two chained
16473 classes) reliably wins over that single-class rule regardless of source
16474 order, giving both lines real breathing room. */
16475 max-width: 1040px;
16476 }
16477 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome-main {
16478 margin: auto 0;
16479 display: flex;
16480 flex-direction: column;
16481 align-items: center;
16482 width: 100%;
16483 }
16484 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-consent {
16485 margin-top: 0;
16486 padding-top: 24px;
16487 /* Long enough that both new copy strings need the full center column
16488 width (960px) to have a shot at fitting on one line; narrower windows
16489 still wrap gracefully since neither has white-space: nowrap. */
16490 max-width: none;
16491 }
16492 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-sub {
16493 /* The new copy runs ~930px wide at 15px — needs the full center column
16494 (960px) to have a shot at one line, same reasoning as the consent text
16495 above it. */
16496 max-width: none;
16497 }
16498 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-h1 {
16499 font-size: 34px;
16500 }
16501 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-h1 {
16502 font-size: 26px;
16503 font-weight: 700;
16504 line-height: 1.3;
16505 letter-spacing: -0.4px;
16506 color: #363B4E;
16507 margin: 0 0 10px;
16508 padding: 0;
16509 }
16510 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-sub {
16511 font-size: 15px;
16512 line-height: 1.7;
16513 color: #7A8B9A;
16514 margin: 0 0 24px;
16515 max-width: 560px;
16516 }
16517 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-error {
16518 background: #FEF2F2;
16519 border: 1px solid #FECACA;
16520 color: #B91C1C;
16521 font-size: 14px;
16522 border-radius: 8px;
16523 padding: 10px 16px;
16524 margin: 0 0 20px;
16525 }
16526 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-empty {
16527 font-size: 14px;
16528 color: #6E7A85;
16529 max-width: 420px;
16530 line-height: 1.7;
16531 }
16532 .wpfunnels-setup .wpfnl-wz {
16533 /* ---------- Hero artwork ----------
16534 welcome-image.png is 1450x832 RGBA line art that carries its own soft
16535 purple wash out to the edges of the canvas. It is illustration, not a
16536 screenshot, so it gets no frame — a border/radius/shadow would box the
16537 artwork's own transparent bounds and read as a pasted-in thumbnail.
16538 It sits directly on the page and blends into it. */
16539 }
16540 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-art {
16541 width: 100%;
16542 max-width: 900px;
16543 margin: 4px 0 20px;
16544 border: 0;
16545 background: none;
16546 box-shadow: none;
16547 /* Capped by viewport height, not just width — this is the tallest single
16548 element on the welcome step, and the step has no footer to borrow space
16549 from, so on a short viewport it must be the thing that shrinks. 54vh
16550 only binds below ~950px of viewport height; taller screens fall back to
16551 the artwork's true size (900x516) via max-width instead. width: auto +
16552 both max- constraints keeps the aspect ratio intact either way. */
16553 }
16554 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-art img {
16555 display: block;
16556 width: auto;
16557 height: auto;
16558 max-width: 100%;
16559 max-height: 54vh;
16560 margin: 0 auto;
16561 }
16562 .wpfunnels-setup .wpfnl-wz {
16563 /* ---------- Buttons ---------- */
16564 }
16565 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn {
16566 display: inline-flex;
16567 align-items: center;
16568 justify-content: center;
16569 gap: 8px;
16570 font-family: "DM Sans", sans-serif;
16571 font-size: 14px;
16572 font-weight: 600;
16573 line-height: 1;
16574 padding: 12px 24px;
16575 border-radius: 8px;
16576 border: 1px solid transparent;
16577 cursor: pointer;
16578 transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
16579 min-width: 132px;
16580 text-decoration: none;
16581 }
16582 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn:focus-visible {
16583 outline: 2px solid #6E42D3;
16584 outline-offset: 2px;
16585 }
16586 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn:disabled {
16587 opacity: 0.5;
16588 cursor: not-allowed;
16589 }
16590 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn.is-hidden {
16591 visibility: hidden;
16592 pointer-events: none;
16593 }
16594 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--lg {
16595 padding: 14px 34px;
16596 font-size: 15px;
16597 border-radius: 9999px;
16598 }
16599 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--primary {
16600 background: #6E42D3;
16601 color: #fff;
16602 }
16603 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--primary:hover:not(:disabled) {
16604 background: #5B35B8;
16605 }
16606 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--ghost {
16607 background: transparent;
16608 border-color: #ECEBF0;
16609 color: #6E7A85;
16610 }
16611 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--ghost:hover:not(:disabled) {
16612 border-color: #6E42D3;
16613 color: #6E42D3;
16614 }
16615 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--danger {
16616 background: #EF4444;
16617 color: #fff;
16618 }
16619 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--danger:hover:not(:disabled) {
16620 background: #DC2626;
16621 }
16622 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--placeholder {
16623 visibility: hidden;
16624 pointer-events: none;
16625 }
16626 .wpfunnels-setup .wpfnl-wz {
16627 /* ---------- Spinner ---------- */
16628 }
16629 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-spinner {
16630 display: inline-block;
16631 width: 14px;
16632 height: 14px;
16633 border: 2px solid rgba(255, 255, 255, 0.4);
16634 border-top-color: #fff;
16635 border-radius: 50%;
16636 animation: wpfnl-wz-spin 0.7s linear infinite;
16637 }
16638 .wpfunnels-setup .wpfnl-wz {
16639 /* ---------- Footer ---------- */
16640 }
16641 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-footer {
16642 flex-shrink: 0;
16643 background: #FFFFFF;
16644 border-top: 1px solid #ECEBF0;
16645 padding: 16px 28px;
16646 display: flex;
16647 align-items: center;
16648 justify-content: space-between;
16649 gap: 16px;
16650 }
16651 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-footer-actions {
16652 display: flex;
16653 align-items: center;
16654 gap: 4px;
16655 }
16656 .wpfunnels-setup .wpfnl-wz {
16657 /* Quiet text action beside the primary button — deliberately low
16658 emphasis so it reads as an escape hatch, not an alternative path. */
16659 }
16660 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip {
16661 background: none;
16662 border: 0;
16663 padding: 12px 16px;
16664 cursor: pointer;
16665 font-family: inherit;
16666 font-size: 14px;
16667 font-weight: 600;
16668 color: #6E7A85;
16669 transition: color 0.2s ease;
16670 }
16671 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip:hover:not(:disabled) {
16672 color: #363B4E;
16673 }
16674 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip:focus-visible {
16675 outline: 2px solid #6E42D3;
16676 outline-offset: 2px;
16677 border-radius: 6px;
16678 }
16679 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip:disabled {
16680 opacity: 0.5;
16681 cursor: not-allowed;
16682 }
16683 .wpfunnels-setup .wpfnl-wz {
16684 /* ---------- Template grid ---------- */
16685 }
16686 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-grid {
16687 display: grid;
16688 grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
16689 gap: 20px;
16690 width: 100%;
16691 text-align: left;
16692 }
16693 .wpfunnels-setup .wpfnl-wz {
16694 /* Held inert while the funnel builds — the grid stays on screen for
16695 context, but the selection must not change mid-flight. */
16696 }
16697 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-grid.is-busy {
16698 pointer-events: none;
16699 opacity: 0.6;
16700 transition: opacity 0.2s ease;
16701 }
16702 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card {
16703 background: #FFFFFF;
16704 border: 1.5px solid #ECEBF0;
16705 border-radius: 12px;
16706 padding: 12px;
16707 cursor: pointer;
16708 transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
16709 }
16710 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card:hover {
16711 border-color: #C4B5F4;
16712 transform: translateY(-2px);
16713 }
16714 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-active {
16715 border-color: #6E42D3;
16716 box-shadow: 0 4px 16px rgba(110, 66, 211, 0.12);
16717 }
16718 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card:focus-visible {
16719 outline: 2px solid #6E42D3;
16720 outline-offset: 2px;
16721 }
16722 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-skeleton {
16723 cursor: default;
16724 pointer-events: none;
16725 }
16726 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-thumb {
16727 position: relative;
16728 border-radius: 8px;
16729 overflow: hidden;
16730 background: #F6F5FA;
16731 aspect-ratio: 4/3;
16732 margin-bottom: 12px;
16733 }
16734 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-thumb img {
16735 width: 100%;
16736 height: 100%;
16737 object-fit: cover;
16738 object-position: top;
16739 display: block;
16740 }
16741 .wpfunnels-setup .wpfnl-wz {
16742 /* Sits inside the thumb, which is `overflow: hidden`, so the pill clips
16743 to the rounded corner rather than overhanging the card. */
16744 }
16745 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-badge {
16746 position: absolute;
16747 top: 0;
16748 left: 0;
16749 z-index: 1;
16750 display: inline-flex;
16751 align-items: center;
16752 gap: 5px;
16753 padding: 6px 12px;
16754 border-radius: 8px 0 8px 0;
16755 background: #6E42D3;
16756 color: #fff;
16757 font-size: 12px;
16758 font-weight: 700;
16759 line-height: 1;
16760 white-space: nowrap;
16761 }
16762 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-badge svg {
16763 flex-shrink: 0;
16764 }
16765 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-suggested {
16766 border-color: #C4B5F4;
16767 }
16768 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-preview {
16769 position: absolute;
16770 bottom: 10px;
16771 left: 50%;
16772 transform: translateX(-50%) translateY(6px);
16773 opacity: 0;
16774 background: rgba(54, 59, 78, 0.92);
16775 color: #fff;
16776 border: 0;
16777 border-radius: 9999px;
16778 padding: 7px 18px;
16779 font-family: inherit;
16780 font-size: 12.5px;
16781 font-weight: 600;
16782 cursor: pointer;
16783 transition: opacity 0.2s ease, transform 0.2s ease;
16784 }
16785 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card:hover .wpfnl-wz-template-preview,
16786 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-preview:focus-visible {
16787 opacity: 1;
16788 transform: translateX(-50%) translateY(0);
16789 }
16790 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-title {
16791 font-size: 14.5px;
16792 font-weight: 600;
16793 color: #363B4E;
16794 margin: 0 0 4px;
16795 }
16796 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-meta {
16797 font-size: 12.5px;
16798 color: #6E7A85;
16799 margin: 0;
16800 }
16801 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skeleton-line {
16802 height: 12px;
16803 border-radius: 4px;
16804 background: linear-gradient(90deg, #EFEEF3 25%, #F7F6FA 50%, #EFEEF3 75%);
16805 background-size: 200% 100%;
16806 animation: wpfnl-wz-shimmer 1.4s ease infinite;
16807 margin-bottom: 8px;
16808 }
16809 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skeleton-line.is-short {
16810 width: 45%;
16811 }
16812 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-skeleton .wpfnl-wz-template-thumb {
16813 background: linear-gradient(90deg, #EFEEF3 25%, #F7F6FA 50%, #EFEEF3 75%);
16814 background-size: 200% 100%;
16815 animation: wpfnl-wz-shimmer 1.4s ease infinite;
16816 }
16817 .wpfunnels-setup .wpfnl-wz {
16818 /* ---------- Template preview modal ----------
16819 PreviewTemplate.vue's own component — its styling never changed, only
16820 moved here. Previously scoped under `.wpfnl-mm-setup-wizard-content`,
16821 a wrapper the sidebar-based wizard used that no longer exists in the
16822 DOM, so none of it was reaching the modal. */
16823 }
16824 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay {
16825 position: fixed;
16826 top: 0;
16827 left: 0;
16828 right: 0;
16829 bottom: 0;
16830 background: rgba(0, 0, 0, 0.6);
16831 display: flex;
16832 align-items: center;
16833 justify-content: center;
16834 z-index: 99999;
16835 padding: 40px;
16836 backdrop-filter: blur(4px);
16837 }
16838 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal {
16839 background: #FFF;
16840 border-radius: 16px;
16841 width: 100%;
16842 max-width: 1399px;
16843 height: 90vh;
16844 display: flex;
16845 flex-direction: column;
16846 box-shadow: 0px 20px 60px rgba(0, 0, 0, 0.3);
16847 overflow: hidden;
16848 }
16849 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header {
16850 padding: 24px 32px;
16851 border-bottom: 1px solid #EAE9EE;
16852 display: flex;
16853 align-items: center;
16854 justify-content: space-between;
16855 flex-shrink: 0;
16856 }
16857 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-title {
16858 font-size: 20px;
16859 font-weight: 700;
16860 font-family: "DM Sans", sans-serif;
16861 color: #363B4E;
16862 margin: 0;
16863 line-height: 24px;
16864 }
16865 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-device-switcher {
16866 display: flex;
16867 gap: 4px;
16868 background: #F6F5FA;
16869 border-radius: 8px;
16870 padding: 4px;
16871 }
16872 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-device-switcher .wpfnl-mm-device-btn {
16873 width: 36px;
16874 height: 36px;
16875 border: none;
16876 background: transparent;
16877 border-radius: 6px;
16878 cursor: pointer;
16879 display: flex;
16880 align-items: center;
16881 justify-content: center;
16882 transition: all 0.2s ease;
16883 color: #7A8C9A;
16884 }
16885 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-device-switcher .wpfnl-mm-device-btn svg {
16886 width: 16px;
16887 height: 16px;
16888 }
16889 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-device-switcher .wpfnl-mm-device-btn:hover {
16890 background: rgba(110, 66, 211, 0.1);
16891 color: #6E42D3;
16892 }
16893 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-device-switcher .wpfnl-mm-device-btn.active {
16894 background: #FFF;
16895 color: #6E42D3;
16896 box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.08);
16897 }
16898 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-actions {
16899 display: flex;
16900 align-items: center;
16901 gap: 16px;
16902 }
16903 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-actions .wpfnl-mm-btn-import-modal {
16904 padding: 12px 24px;
16905 border-radius: 8px;
16906 font-size: 14px;
16907 font-weight: 600;
16908 background: #6E42D3;
16909 color: #FFF;
16910 border: none;
16911 cursor: pointer;
16912 display: inline-flex;
16913 align-items: center;
16914 gap: 8px;
16915 transition: all 0.2s ease;
16916 }
16917 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-actions .wpfnl-mm-btn-import-modal svg {
16918 width: 16px;
16919 height: 12px;
16920 }
16921 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-actions .wpfnl-mm-btn-import-modal:hover {
16922 background: #5c36b3;
16923 transform: translateY(-1px);
16924 box-shadow: 0px 4px 12px rgba(110, 66, 211, 0.3);
16925 }
16926 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-actions .wpfnl-mm-preview-close-btn {
16927 width: 32px;
16928 height: 32px;
16929 background: transparent;
16930 border-radius: 6px;
16931 cursor: pointer;
16932 display: flex;
16933 align-items: center;
16934 justify-content: center;
16935 transition: all 0.2s ease;
16936 color: #7A8C9A;
16937 border: 1px solid #7A8B9A;
16938 }
16939 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-actions .wpfnl-mm-preview-close-btn:hover {
16940 background: #F6F5FA;
16941 color: #363B4E;
16942 }
16943 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body {
16944 flex: 1;
16945 display: flex;
16946 overflow: hidden;
16947 flex-direction: column;
16948 }
16949 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps {
16950 width: 180px;
16951 border-right: 1px solid #EAE9EE;
16952 padding: 20px;
16953 display: flex;
16954 gap: 12px;
16955 overflow-y: auto;
16956 flex-shrink: 0;
16957 width: 100%;
16958 align-items: center;
16959 justify-content: center;
16960 }
16961 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps .wpfnl-mm-preview-step-card {
16962 cursor: pointer;
16963 }
16964 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps .wpfnl-mm-preview-step-card.active .wpfnl-mm-preview-step-thumbnail {
16965 border-color: #6E42D3;
16966 }
16967 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps .wpfnl-mm-preview-step-card .wpfnl-mm-preview-step-thumbnail {
16968 aspect-ratio: 16/10;
16969 background: #F6F5FA;
16970 border-radius: 8px;
16971 border: 2px solid transparent;
16972 overflow: hidden;
16973 transition: all 0.2s ease;
16974 width: 78px;
16975 height: 78px;
16976 padding: 3px;
16977 }
16978 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps .wpfnl-mm-preview-step-card .wpfnl-mm-preview-step-thumbnail img {
16979 width: 100%;
16980 height: 100%;
16981 object-fit: cover;
16982 }
16983 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps .wpfnl-mm-preview-step-card .wpfnl-mm-preview-step-thumbnail:hover {
16984 border-color: #E5E7EB;
16985 }
16986 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps .wpfnl-mm-preview-step-card .wpfnl-mm-preview-step-type {
16987 padding: 8px;
16988 font-size: 12px;
16989 font-weight: 500;
16990 font-family: "DM Sans", sans-serif;
16991 color: #363B4E;
16992 text-align: center;
16993 margin: 0;
16994 background: #FFF;
16995 text-transform: capitalize;
16996 }
16997 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content {
16998 flex: 1;
16999 display: flex;
17000 align-items: center;
17001 justify-content: center;
17002 padding: 30px;
17003 background: #F6F5FA;
17004 overflow: auto;
17005 }
17006 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content .wpfnl-mm-preview-device-frame {
17007 width: 100%;
17008 height: 100%;
17009 background: #FFF;
17010 border-radius: 12px;
17011 overflow: hidden;
17012 box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
17013 transition: all 0.3s ease;
17014 }
17015 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content .wpfnl-mm-preview-device-frame.image-preview .wpfnl-mm-preview-iframe-wrapper {
17016 overflow-x: hidden;
17017 }
17018 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content .wpfnl-mm-preview-device-frame .wpfnl-mm-preview-iframe-wrapper {
17019 width: 100%;
17020 height: 100%;
17021 position: relative;
17022 overflow: auto;
17023 }
17024 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content .wpfnl-mm-preview-device-frame .wpfnl-mm-preview-iframe-wrapper .wpfnl-mm-preview-checkout-placeholder {
17025 min-height: 650px;
17026 display: flex;
17027 align-items: center;
17028 justify-content: center;
17029 }
17030 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content .wpfnl-mm-preview-device-frame .wpfnl-mm-preview-iframe-wrapper iframe {
17031 width: 100%;
17032 height: 100%;
17033 border: none;
17034 }
17035 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content .wpfnl-mm-preview-device-frame .wpfnl-mm-preview-iframe-wrapper .wpfnl-mm-preview-loader {
17036 position: absolute;
17037 top: 0;
17038 left: 0;
17039 right: 0;
17040 bottom: 0;
17041 display: flex;
17042 align-items: center;
17043 justify-content: center;
17044 background: rgba(255, 255, 255, 0.9);
17045 z-index: 10;
17046 }
17047 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content .wpfnl-mm-preview-device-frame .wpfnl-mm-preview-iframe-wrapper .wpfnl-mm-preview-loader .wpfnl-mm-loader {
17048 border: 3px solid #E5E7EB;
17049 border-top-color: #6E42D3;
17050 border-radius: 50%;
17051 width: 40px;
17052 height: 40px;
17053 animation: spin 1s linear infinite;
17054 }
17055 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content.tablet .wpfnl-mm-preview-device-frame {
17056 max-width: 768px;
17057 margin: 0 auto;
17058 }
17059 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content.mobile .wpfnl-mm-preview-device-frame {
17060 max-width: 375px;
17061 margin: 0 auto;
17062 }
17063 .wpfunnels-setup .wpfnl-wz {
17064 /* ---------- Consent ---------- */
17065 }
17066 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent {
17067 display: inline-flex;
17068 align-items: flex-start;
17069 gap: 10px;
17070 margin-top: 20px;
17071 max-width: 440px;
17072 text-align: left;
17073 cursor: pointer;
17074 }
17075 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input {
17076 position: absolute;
17077 opacity: 0;
17078 width: 0;
17079 height: 0;
17080 }
17081 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-box {
17082 flex-shrink: 0;
17083 width: 17px;
17084 height: 17px;
17085 margin-top: 1px;
17086 border: 1.5px solid #C9CDD6;
17087 border-radius: 4px;
17088 background: #FFFFFF;
17089 position: relative;
17090 transition: background 0.2s ease, border-color 0.2s ease;
17091 }
17092 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-box::after {
17093 content: "";
17094 position: absolute;
17095 left: 5px;
17096 top: 1.5px;
17097 width: 4px;
17098 height: 8px;
17099 border: solid #fff;
17100 border-width: 0 2px 2px 0;
17101 transform: rotate(45deg) scale(0);
17102 transition: transform 0.15s ease;
17103 }
17104 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input:checked + .wpfnl-wz-consent-box {
17105 background: #6E42D3;
17106 border-color: #6E42D3;
17107 }
17108 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input:checked + .wpfnl-wz-consent-box::after {
17109 transform: rotate(45deg) scale(1);
17110 }
17111 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input:focus-visible + .wpfnl-wz-consent-box {
17112 outline: 2px solid #6E42D3;
17113 outline-offset: 2px;
17114 }
17115 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-text {
17116 font-size: 13px;
17117 line-height: 1.6;
17118 color: #6E7A85;
17119 }
17120 .wpfunnels-setup .wpfnl-wz {
17121 /* Sits inside the <label>, so the click is stopped in the template to keep
17122 opening the policy from toggling the consent box. */
17123 }
17124 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-link {
17125 color: #6E42D3;
17126 font-weight: 600;
17127 text-decoration: underline;
17128 text-underline-offset: 2px;
17129 white-space: nowrap;
17130 }
17131 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-link:hover, .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-link:focus-visible {
17132 color: #5B35B8;
17133 }
17134 .wpfunnels-setup .wpfnl-wz {
17135 /* ---------- Completion screen ----------
17136 Ported from Mail Mint's SuccessStep onto WPFunnels' tokens. Covers the
17137 whole shell rather than sitting in the step body: this screen is
17138 terminal, so the top bar's step counter and exit affordance would only
17139 invite the user back into a flow that has already finished. */
17140 }
17141 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success {
17142 position: fixed;
17143 inset: 0;
17144 z-index: 9999;
17145 background: #FFFFFF;
17146 display: flex;
17147 flex-direction: column;
17148 align-items: center;
17149 justify-content: center;
17150 overflow-y: auto;
17151 overflow-x: hidden;
17152 scrollbar-width: none;
17153 -ms-overflow-style: none;
17154 }
17155 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success::-webkit-scrollbar {
17156 display: none;
17157 }
17158 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__confetti {
17159 position: fixed;
17160 inset: 0;
17161 pointer-events: none;
17162 z-index: 0;
17163 }
17164 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__body {
17165 position: relative;
17166 z-index: 1;
17167 display: flex;
17168 flex-direction: column;
17169 align-items: center;
17170 text-align: center;
17171 padding: 40px 40px 40px;
17172 width: 100%;
17173 max-width: 980px;
17174 box-sizing: border-box;
17175 }
17176 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__emoji {
17177 font-size: 54px;
17178 line-height: 1;
17179 margin-bottom: 18px;
17180 user-select: none;
17181 }
17182 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__heading {
17183 font-size: 42px;
17184 font-weight: 700;
17185 color: #363B4E;
17186 letter-spacing: -1px;
17187 margin: 0 0 14px;
17188 line-height: 1.15;
17189 }
17190 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__sub {
17191 font-size: 15px;
17192 color: #6E7A85;
17193 margin: 0 0 34px;
17194 line-height: 1.65;
17195 max-width: 560px;
17196 }
17197 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__actions {
17198 display: flex;
17199 gap: 14px;
17200 flex-wrap: wrap;
17201 justify-content: center;
17202 margin: 0 0 48px;
17203 }
17204 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources {
17205 background: #F4F5F7;
17206 border-radius: 18px;
17207 padding: 22px 24px 20px;
17208 width: 100%;
17209 box-sizing: border-box;
17210 }
17211 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-title {
17212 font-size: 14px;
17213 font-weight: 600;
17214 color: #6E7A85;
17215 margin: 0 0 16px;
17216 }
17217 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-grid {
17218 display: grid;
17219 grid-template-columns: repeat(4, 1fr);
17220 gap: 12px;
17221 margin-bottom: 18px;
17222 }
17223 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-card {
17224 display: flex;
17225 flex-direction: row;
17226 align-items: center;
17227 gap: 12px;
17228 background: #FFFFFF;
17229 border: 1px solid #ECEBF0;
17230 border-radius: 12px;
17231 padding: 16px 18px;
17232 text-decoration: none !important;
17233 color: #363B4E !important;
17234 transition: border-color 0.2s ease, box-shadow 0.2s ease;
17235 }
17236 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-card:hover {
17237 border-color: rgba(110, 66, 211, 0.35);
17238 box-shadow: 0 2px 10px rgba(110, 66, 211, 0.08);
17239 text-decoration: none !important;
17240 color: #363B4E !important;
17241 }
17242 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-card:focus-visible {
17243 outline: none;
17244 box-shadow: 0 0 0 3px rgba(110, 66, 211, 0.25);
17245 }
17246 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-icon {
17247 flex-shrink: 0;
17248 display: flex;
17249 align-items: center;
17250 }
17251 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-label {
17252 font-size: 13px;
17253 font-weight: 600;
17254 color: #363B4E;
17255 text-align: left;
17256 line-height: 1.35;
17257 }
17258 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-footer {
17259 text-align: center;
17260 }
17261 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-footer p {
17262 font-size: 12px;
17263 color: #6E7A85;
17264 margin: 0 0 4px;
17265 }
17266 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-footer p:last-child {
17267 margin-bottom: 0;
17268 }
17269 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__pro-link {
17270 color: #6E42D3 !important;
17271 font-weight: 600;
17272 text-decoration: underline !important;
17273 text-underline-offset: 2px;
17274 }
17275 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__pro-link:hover {
17276 color: #5B35B8 !important;
17277 }
17278 @media (max-width: 782px) {
17279 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__body {
17280 padding: 32px 20px 40px;
17281 }
17282 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__heading {
17283 font-size: 32px;
17284 letter-spacing: -0.6px;
17285 }
17286 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-grid {
17287 grid-template-columns: repeat(2, 1fr);
17288 }
17289 }
17290 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--pill {
17291 border-radius: 9999px;
17292 }
17293 .wpfunnels-setup .wpfnl-wz {
17294 /* ---------- Exit modal ---------- */
17295 }
17296 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-overlay {
17297 position: fixed;
17298 inset: 0;
17299 background: rgba(0, 0, 0, 0.5);
17300 display: flex;
17301 align-items: center;
17302 justify-content: center;
17303 z-index: 10000;
17304 animation: wpfnl-wz-fade 0.2s ease;
17305 }
17306 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal {
17307 background: #FFFFFF;
17308 border-radius: 16px;
17309 padding: 32px;
17310 max-width: 440px;
17311 width: 90%;
17312 box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
17313 animation: wpfnl-wz-rise 0.3s ease;
17314 }
17315 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-head {
17316 display: flex;
17317 flex-direction: column;
17318 align-items: center;
17319 text-align: center;
17320 margin-bottom: 24px;
17321 }
17322 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-head svg {
17323 margin-bottom: 16px;
17324 }
17325 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-title {
17326 font-size: 20px;
17327 font-weight: 700;
17328 color: #363B4E;
17329 margin: 0 0 12px;
17330 letter-spacing: -0.3px;
17331 }
17332 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-text {
17333 font-size: 14px;
17334 line-height: 1.6;
17335 color: #6E7A85;
17336 margin: 0;
17337 }
17338 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-actions {
17339 display: flex;
17340 gap: 12px;
17341 justify-content: center;
17342 }
17343 .wpfunnels-setup .wpfnl-wz {
17344 /* ---------- Required-installation step ----------
17345 Re-parented from the old sidebar DOM chain; the card markup inside
17346 Setup.vue is unchanged, so these rules carry over as-is. */
17347 }
17348 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install {
17349 width: 100%;
17350 max-width: 940px;
17351 display: flex;
17352 flex-direction: column;
17353 gap: 0;
17354 position: relative;
17355 }
17356 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-mm-setup-header {
17357 text-align: center;
17358 margin-bottom: 24px;
17359 }
17360 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-mm-setup-header .wpfnl-mm-setup-title {
17361 font-size: 24px;
17362 font-weight: 700;
17363 color: #363B4E;
17364 line-height: 1.3;
17365 letter-spacing: -0.5px;
17366 margin: 0 0 8px 0;
17367 }
17368 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-mm-setup-header .wpfnl-mm-setup-subtitle {
17369 font-size: 15px;
17370 font-weight: 400;
17371 color: #6E7A85;
17372 line-height: 1.5;
17373 margin: 0;
17374 }
17375 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-card {
17376 background: #FFF;
17377 border-radius: 20px;
17378 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
17379 margin-bottom: 24px;
17380 overflow: hidden;
17381 }
17382 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-divider {
17383 width: 100%;
17384 height: 1px;
17385 background: #F1EFF7;
17386 }
17387 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section {
17388 padding: 32px 40px 28px;
17389 }
17390 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-label {
17391 font-size: 14px;
17392 font-weight: 500;
17393 color: #7A8C9A;
17394 margin: 0 0 16px 0;
17395 text-align: center;
17396 }
17397 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options {
17398 display: flex;
17399 gap: 10px;
17400 justify-content: center;
17401 flex-wrap: wrap;
17402 }
17403 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn {
17404 display: flex;
17405 flex-direction: column;
17406 align-items: center;
17407 gap: 8px;
17408 padding: 16px 14px 12px;
17409 border-radius: 10px;
17410 border: 1px solid #ECEBF0;
17411 background: #FFF;
17412 cursor: pointer;
17413 transition: border-color 0.15s ease;
17414 min-width: 90px;
17415 position: relative;
17416 font-family: "DM Sans", sans-serif;
17417 }
17418 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn img {
17419 width: 32px;
17420 height: 32px;
17421 object-fit: contain;
17422 }
17423 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn span:not(.wpfnl-ri-not-installed) {
17424 font-size: 13px;
17425 font-weight: 400;
17426 color: #7A8C9A;
17427 line-height: 1;
17428 }
17429 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn:hover:not(:disabled) {
17430 border-color: #C4B5F4;
17431 }
17432 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn.active {
17433 border-color: #6E42D3;
17434 background: #FAFAFE;
17435 }
17436 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn.active span:not(.wpfnl-ri-not-installed) {
17437 color: #6E42D3;
17438 font-weight: 500;
17439 }
17440 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn.disabled {
17441 opacity: 0.4;
17442 cursor: not-allowed;
17443 }
17444 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn .wpfnl-ri-not-installed {
17445 position: absolute;
17446 top: 4px;
17447 right: 4px;
17448 background: #f68524;
17449 color: #fff;
17450 font-size: 8px;
17451 font-weight: 600;
17452 padding: 2px 5px;
17453 border-radius: 4px;
17454 white-space: nowrap;
17455 line-height: 1.4;
17456 }
17457 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section {
17458 padding: 28px 40px 32px;
17459 }
17460 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards {
17461 display: flex;
17462 flex-direction: column;
17463 gap: 8px;
17464 text-align: left;
17465 }
17466 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card {
17467 display: flex;
17468 align-items: center;
17469 gap: 14px;
17470 padding: 12px 16px;
17471 border-radius: 10px;
17472 border: 1px solid #ECEBF0;
17473 background: #FFF;
17474 }
17475 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--active {
17476 border-color: #D1FAE5;
17477 background: #F0FDF4;
17478 }
17479 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--installed {
17480 border-color: #FDE68A;
17481 background: #FFFBEB;
17482 }
17483 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--optional {
17484 cursor: pointer;
17485 user-select: none;
17486 transition: border-color 0.15s ease;
17487 }
17488 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--optional:hover {
17489 border-color: #C4B5F4;
17490 }
17491 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--optional:focus-visible {
17492 outline: 2px solid #6E42D3;
17493 outline-offset: 2px;
17494 }
17495 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--unchecked {
17496 border-color: #ECEBF0;
17497 background: #FAFAFA;
17498 opacity: 0.5;
17499 }
17500 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--unchecked:hover {
17501 border-color: #ECEBF0;
17502 opacity: 0.65;
17503 }
17504 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--unchecked .wpfnl-ri-plugin-card-icon img {
17505 filter: grayscale(1) opacity(0.4);
17506 }
17507 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--unchecked .wpfnl-ri-plugin-card-status {
17508 display: none;
17509 }
17510 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-icon {
17511 width: 38px;
17512 height: 38px;
17513 flex-shrink: 0;
17514 border-radius: 8px;
17515 background: #F6F5FA;
17516 display: flex;
17517 align-items: center;
17518 justify-content: center;
17519 overflow: hidden;
17520 }
17521 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-icon img {
17522 width: 26px;
17523 height: 26px;
17524 object-fit: contain;
17525 }
17526 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-body {
17527 flex: 1;
17528 min-width: 0;
17529 }
17530 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-body .wpfnl-ri-plugin-card-header {
17531 display: flex;
17532 align-items: center;
17533 gap: 7px;
17534 margin-bottom: 3px;
17535 }
17536 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-body .wpfnl-ri-plugin-card-name {
17537 font-size: 14px;
17538 font-weight: 600;
17539 color: #363B4E;
17540 line-height: 1.3;
17541 }
17542 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-body .wpfnl-ri-plugin-card-required {
17543 font-size: 10px;
17544 font-weight: 600;
17545 color: #6E42D3;
17546 background: #EDE5FF;
17547 padding: 2px 7px;
17548 border-radius: 100px;
17549 line-height: 1.5;
17550 white-space: nowrap;
17551 }
17552 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-body .wpfnl-ri-plugin-card-optional {
17553 font-size: 10px;
17554 font-weight: 600;
17555 color: #6B7280;
17556 background: #F3F4F6;
17557 padding: 2px 7px;
17558 border-radius: 100px;
17559 line-height: 1.5;
17560 white-space: nowrap;
17561 }
17562 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-body .wpfnl-ri-plugin-card-desc {
17563 font-size: 12px;
17564 font-weight: 400;
17565 color: #7A8C9A;
17566 line-height: 1.5;
17567 margin: 0;
17568 }
17569 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-status {
17570 flex-shrink: 0;
17571 }
17572 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-status .wpfnl-ri-status {
17573 display: inline-flex;
17574 align-items: center;
17575 gap: 4px;
17576 font-size: 11px;
17577 font-weight: 600;
17578 padding: 4px 10px;
17579 border-radius: 100px;
17580 white-space: nowrap;
17581 }
17582 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-status .wpfnl-ri-status--active {
17583 background: #D1FAE5;
17584 color: #059669;
17585 }
17586 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-status .wpfnl-ri-status--installed {
17587 background: #FEF3C7;
17588 color: #D97706;
17589 }
17590 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-status .wpfnl-ri-status--missing {
17591 background: #F3F4F6;
17592 color: #6B7280;
17593 }
17594 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-toggle {
17595 flex-shrink: 0;
17596 padding-left: 8px;
17597 }
17598 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-footer {
17599 display: none;
17600 }
17601 .wpfunnels-setup .wpfnl-wz {
17602 /* ---------- Responsive ---------- */
17603 }
17604 @media (max-width: 782px) {
17605 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-top {
17606 padding: 0 16px;
17607 }
17608 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-step-label {
17609 display: none;
17610 }
17611 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit-text {
17612 display: none;
17613 }
17614 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-body {
17615 padding: 24px 16px;
17616 }
17617 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-h1 {
17618 font-size: 22px;
17619 }
17620 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-h1 {
17621 font-size: 26px;
17622 }
17623 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-art {
17624 margin-bottom: 16px;
17625 }
17626 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-footer {
17627 padding: 12px 16px;
17628 }
17629 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn {
17630 min-width: 0;
17631 padding: 11px 18px;
17632 }
17633 }
17634 @keyframes wpfnl-wz-spin {
17635 to {
17636 transform: rotate(360deg);
17637 }
17638 }
17639 @keyframes wpfnl-wz-fade {
17640 from {
17641 opacity: 0;
17642 }
17643 to {
17644 opacity: 1;
17645 }
17646 }
17647 @keyframes wpfnl-wz-rise {
17648 from {
17649 transform: translateY(20px);
17650 opacity: 0;
17651 }
17652 to {
17653 transform: translateY(0);
17654 opacity: 1;
17655 }
17656 }
17657 @keyframes wpfnl-wz-shimmer {
17658 from {
17659 background-position: 200% 0;
17660 }
17661 to {
17662 background-position: -200% 0;
17663 }
17664 }
17665
17666 #wpfunnels-app {
17667 margin: 0 0 0 -20px;
17668 min-height: calc(100vh - 32px);
17669 }
17670
17671 .wp-funnels_page_edit_funnel #wpbody-content,
17672 .wpfunnels_page_edit_funnel #wpbody-content {
17673 padding-bottom: 0;
17674 }
17675
17676 .wp-funnels_page_edit_funnel #wpfooter,
17677 .wpfunnels_page_edit_funnel #wpfooter {
17678 display: none;
17679 }
17680
17681 .wpfnl-admin-notices-wrapper {
17682 background: #fff;
17683 padding: 15px 14px;
17684 border-bottom: 1px solid #E5E8F3;
17685 }
17686 .wpfnl-admin-notices-wrapper .single-notice {
17687 background: #eee;
17688 padding: 12px 14px;
17689 margin-bottom: 10px;
17690 border-left: 3px solid #ddd;
17691 }
17692 .wpfnl-admin-notices-wrapper .single-notice:last-child {
17693 margin-bottom: 0;
17694 }
17695 .wpfnl-admin-notices-wrapper .single-notice.notice-warning {
17696 color: #473D3D;
17697 background-color: #FFF9EB;
17698 border-left-color: #FFB802;
17699 }
17700 .wpfnl-admin-notices-wrapper .single-notice.notice-error {
17701 color: #473D3D;
17702 background-color: #FFF3F3;
17703 border-left-color: #DB0D0D;
17704 }
17705
17706 .wpfnl-drawflow-window.wpfnl-tour-active {
17707 pointer-events: none;
17708 }
17709 .wpfnl-drawflow-window svg path {
17710 transition: none;
17711 }
17712 .wpfnl-drawflow-window .not-clickable-overlay.downflow {
17713 background: rgba(255, 255, 255, 0);
17714 display: block;
17715 backdrop-filter: blur(0);
17716 }
17717 .wpfnl-drawflow-window .wpfn-drawflow-alert-wrapper {
17718 position: absolute;
17719 right: 50%;
17720 transform: translateX(50%);
17721 top: 80px;
17722 z-index: -1;
17723 }
17724 .wpfnl-drawflow-window .wpfnl-drawing-wrapper {
17725 position: relative;
17726 flex: 1;
17727 min-height: 0;
17728 display: flex;
17729 flex-direction: column;
17730 transition: all 0.3s ease;
17731 }
17732 .wpfnl-drawflow-window .wpfnl-drawing-wrapper[data-tour=yes] {
17733 position: relative;
17734 background-color: #E5E5E5;
17735 z-index: 4;
17736 top: 100px;
17737 }
17738 .wpfnl-drawflow-window .wpfnl-drawing-wrapper[data-tour=yes] .wpfnl-drawing-window {
17739 height: 100vh;
17740 }
17741 .wpfnl-drawflow-window .save-name-loader {
17742 position: absolute;
17743 left: 0;
17744 top: 0;
17745 width: 100%;
17746 height: 100%;
17747 z-index: 9;
17748 display: flex;
17749 flex-flow: column;
17750 align-items: center;
17751 justify-content: center;
17752 background: rgb(246, 245, 250);
17753 }
17754 .wpfnl-drawflow-window .save-name-loader .wpfnl-loader {
17755 display: block;
17756 width: 50px;
17757 height: 50px;
17758 }
17759 .wpfnl-drawflow-window .wpfn-drawflow-alert {
17760 display: flex;
17761 align-items: center;
17762 flex-flow: row;
17763 justify-content: flex-start;
17764 background-color: #fff;
17765 width: 270px;
17766 height: 40px;
17767 padding: 10px 15px;
17768 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
17769 border-radius: 0px 6px 6px 0px;
17770 border-left: 2px solid #00D057;
17771 transform: translateY(-30px);
17772 transition: all 0.5s ease;
17773 opacity: 0;
17774 visibility: hidden;
17775 }
17776 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-icon {
17777 margin-right: 14px;
17778 }
17779 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-icon svg {
17780 display: block;
17781 }
17782 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-icon .error-icon {
17783 display: none;
17784 }
17785 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-text {
17786 font-weight: 500;
17787 font-size: 14px;
17788 line-height: 16px;
17789 color: #363B4E;
17790 }
17791 .wpfnl-drawflow-window .wpfn-drawflow-alert .close-alert {
17792 display: block;
17793 padding: 3px 0 3px 10px;
17794 margin-left: auto;
17795 cursor: pointer;
17796 }
17797 .wpfnl-drawflow-window .wpfn-drawflow-alert.drawflow-error {
17798 border-left-color: #EE5F5A;
17799 }
17800 .wpfnl-drawflow-window .wpfn-drawflow-alert.drawflow-error .error-icon {
17801 display: block;
17802 }
17803 .wpfnl-drawflow-window .wpfn-drawflow-alert.drawflow-error .success-icon {
17804 display: none;
17805 }
17806 .wpfnl-drawflow-window .wpfn-drawflow-alert-wrapper.show {
17807 z-index: 9;
17808 }
17809 .wpfnl-drawflow-window .wpfn-drawflow-alert-wrapper.show .wpfn-drawflow-alert {
17810 transform: translateY(0);
17811 opacity: 1;
17812 visibility: visible;
17813 }
17814 .wpfnl-drawflow-window .step-importer-wrapper {
17815 position: absolute;
17816 top: 0;
17817 left: 0;
17818 width: 100%;
17819 height: 100%;
17820 max-height: 100%;
17821 z-index: 4;
17822 background: rgb(246, 245, 250);
17823 }
17824 .wpfnl-drawflow-window .step-importer-wrapper.wpfnl-ab-steps-modal {
17825 z-index: 101;
17826 }
17827 .wpfnl-drawflow-window .step-importer-wrapper.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper-before,
17828 .wpfnl-drawflow-window .step-importer-wrapper .wpfnl-ab-steps .wpfnl-step__templates-wrapper-before {
17829 width: 100%;
17830 }
17831 .wpfnl-drawflow-window .wpfnl-drawing-window-loader {
17832 background: rgb(246, 245, 250);
17833 position: absolute;
17834 top: 0;
17835 right: 0;
17836 width: 100%;
17837 height: 100%;
17838 z-index: 99;
17839 opacity: 1;
17840 visibility: visible;
17841 display: flex;
17842 align-items: center;
17843 justify-content: center;
17844 gap: 24px;
17845 padding: 40px;
17846 }
17847 .wpfnl-drawflow-window .wpfnl-drawing-window-loader .wpfnl-canvas-shimmer-node {
17848 flex-shrink: 0;
17849 width: 160px;
17850 height: 80px;
17851 border-radius: 12px;
17852 animation: shimmer-animation 1.6s infinite linear;
17853 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
17854 background-size: 1000px 100%;
17855 }
17856 .wpfnl-drawflow-window .wpfnl-drawing-window-loader .wpfnl-canvas-shimmer-node + .wpfnl-canvas-shimmer-node {
17857 position: relative;
17858 }
17859 .wpfnl-drawflow-window .wpfnl-drawing-window-loader .wpfnl-canvas-shimmer-node + .wpfnl-canvas-shimmer-node::before {
17860 content: "";
17861 position: absolute;
17862 left: -24px;
17863 top: 50%;
17864 transform: translateY(-50%);
17865 width: 24px;
17866 height: 2px;
17867 background: #d0d0d0;
17868 }
17869 .wpfnl-drawflow-window .wpfnl-drawing-window-loader.drawing-window-loaded {
17870 opacity: 0;
17871 visibility: hidden;
17872 }
17873
17874 .ab-testing-drawer .add-step-wrapper, .wpfnl-drawing-window .addstep .add-step-wrapper {
17875 position: relative;
17876 border: 1px dashed #7A8B9A;
17877 border-radius: 14px;
17878 width: 180px;
17879 height: 251px;
17880 display: flex;
17881 flex-flow: column;
17882 align-items: center;
17883 justify-content: center;
17884 padding: 20px;
17885 background: #f6f5fa;
17886 }
17887 .ab-testing-drawer .add-step-wrapper svg, .wpfnl-drawing-window .addstep .add-step-wrapper svg {
17888 position: relative;
17889 }
17890 .ab-testing-drawer .add-step-wrapper .icon, .wpfnl-drawing-window .addstep .add-step-wrapper .icon {
17891 background: #6E42D3;
17892 box-shadow: 0px 8px 16px rgba(193, 183, 232, 0.5);
17893 border-radius: 100px;
17894 width: 70px;
17895 height: 70px;
17896 display: flex;
17897 align-items: center;
17898 justify-content: center;
17899 cursor: pointer;
17900 }
17901 .ab-testing-drawer .add-step-wrapper .icon svg, .wpfnl-drawing-window .addstep .add-step-wrapper .icon svg {
17902 width: 19px;
17903 height: 19px;
17904 }
17905 .ab-testing-drawer .add-step-wrapper .icon svg path, .wpfnl-drawing-window .addstep .add-step-wrapper .icon svg path {
17906 stroke: #fff;
17907 }
17908 .ab-testing-drawer .add-step-wrapper h6, .wpfnl-drawing-window .addstep .add-step-wrapper h6 {
17909 font-weight: 500;
17910 font-size: 16px;
17911 line-height: 1;
17912 color: #363B4E;
17913 margin-top: 23px;
17914 }
17915 .ab-testing-drawer .add-step-wrapper p, .wpfnl-drawing-window .addstep .add-step-wrapper p {
17916 font-size: 12px;
17917 line-height: 17px;
17918 text-align: center;
17919 color: #363B4E;
17920 width: 104px;
17921 margin-top: 8px;
17922 }
17923 .ab-testing-drawer .add-step-wrapper .add-steps-options, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options {
17924 position: absolute;
17925 left: calc(100% + 15px);
17926 top: 50%;
17927 background: #FFFFFF;
17928 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
17929 border-radius: 10px;
17930 width: 100px;
17931 z-index: 2;
17932 transform: translateY(-50%);
17933 display: flex;
17934 flex-flow: column;
17935 display: none;
17936 }
17937 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option {
17938 font-size: 14px;
17939 line-height: 1;
17940 letter-spacing: -0.01em;
17941 color: #7A8B9A;
17942 flex: 1;
17943 border: none;
17944 background: transparent;
17945 display: flex;
17946 flex-flow: column;
17947 align-items: center;
17948 justify-content: center;
17949 cursor: pointer;
17950 transition: all 0.3s ease;
17951 padding: 19px 15px;
17952 }
17953 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option circle, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option circle,
17954 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option path,
17955 .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option path {
17956 transition: all 0.3s ease;
17957 }
17958 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option:hover, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option:hover {
17959 background: rgba(110, 66, 211, 0.16);
17960 color: #6E42D3;
17961 font-weight: 500;
17962 }
17963 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option:first-child, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option:first-child {
17964 border-radius: 10px 10px 0 0;
17965 border-bottom: 1px solid #EEF0F3;
17966 }
17967 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option:last-child, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option:last-child {
17968 border-radius: 0 0 10px 10px;
17969 }
17970 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option.option-step svg, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option.option-step svg {
17971 margin-bottom: 8px;
17972 }
17973 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option.option-step:hover path, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option.option-step:hover path {
17974 fill: #6E42D3;
17975 stroke: #6E42D3;
17976 }
17977 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option.option-condition svg, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option.option-condition svg {
17978 margin-bottom: 3px;
17979 }
17980 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option.option-condition:hover circle, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option.option-condition:hover circle,
17981 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option.option-condition:hover path,
17982 .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option.option-condition:hover path {
17983 stroke: #6E42D3;
17984 }
17985 .ab-testing-drawer .add-step-wrapper .add-steps-options.not-show-condition .single-option, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options.not-show-condition .single-option {
17986 border-radius: 10px !important;
17987 }
17988 .ab-testing-drawer .show-options.add-step-wrapper .add-steps-options, .wpfnl-drawing-window .addstep .show-options.add-step-wrapper .add-steps-options {
17989 display: flex;
17990 }
17991
17992 .add-step-wrapper[data-tour=yes] {
17993 background: #fff;
17994 z-index: 4;
17995 position: relative;
17996 }
17997
17998 .ab-testing-drawer .single-ab-step .step-body .step-stats, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats {
17999 display: flex;
18000 flex-flow: row wrap;
18001 align-items: center;
18002 border-radius: 8px;
18003 border: 1px solid #EEF0F3;
18004 margin-top: 10px;
18005 }
18006 .ab-testing-drawer .single-ab-step .step-body .step-stats .single-stat, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .single-stat {
18007 flex: 1;
18008 text-align: center;
18009 padding: 11px 8px;
18010 }
18011 .ab-testing-drawer .single-ab-step .step-body .step-stats .single-stat:first-child, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .single-stat:first-child {
18012 border-right: 1px solid #EEF0F3;
18013 }
18014 .ab-testing-drawer .single-ab-step .step-body .step-stats .number, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .number {
18015 color: #363B4E;
18016 font-size: 13px;
18017 font-weight: 500;
18018 line-height: 1;
18019 text-transform: capitalize;
18020 display: block;
18021 }
18022 .ab-testing-drawer .single-ab-step .step-body .step-stats .number-skeleton, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .number-skeleton {
18023 display: block;
18024 width: 28px;
18025 height: 13px;
18026 margin: 0 auto;
18027 border-radius: 3px;
18028 background: linear-gradient(90deg, #EEF0F3 25%, #F7F8FA 50%, #EEF0F3 75%);
18029 background-size: 200% 100%;
18030 animation: wpfnl-stat-shimmer 1.2s ease-in-out infinite;
18031 }
18032 .ab-testing-drawer .single-ab-step .step-body .step-stats .title, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .title {
18033 color: #7A8B9A;
18034 font-size: 11px;
18035 font-weight: 400;
18036 line-height: 1;
18037 text-transform: capitalize;
18038 display: block;
18039 margin-top: 5px;
18040 }
18041
18042 @keyframes wpfnl-stat-shimmer {
18043 0% {
18044 background-position: 200% 0;
18045 }
18046 100% {
18047 background-position: -200% 0;
18048 }
18049 }
18050 .wpfnl-drawing-window {
18051 flex: 1;
18052 min-height: 0;
18053 position: relative;
18054 overflow: auto !important;
18055 overflow-x: hidden !important;
18056 }
18057 .wpfnl-drawing-window::-webkit-scrollbar {
18058 width: 4px;
18059 height: 4px;
18060 }
18061 .wpfnl-drawing-window::-webkit-scrollbar-track {
18062 background: #f2f5f8;
18063 }
18064 .wpfnl-drawing-window::-webkit-scrollbar-thumb {
18065 background-color: #CBCBCB;
18066 border-radius: 20px;
18067 }
18068 .wpfnl-drawing-window .drawflow .drawflow-delete {
18069 background: #f6f5fa;
18070 }
18071 .wpfnl-drawing-window .drawflow .drawflow-add-step {
18072 position: absolute;
18073 display: flex;
18074 justify-content: center;
18075 align-items: center;
18076 width: 34px;
18077 height: 34px;
18078 color: white !important;
18079 z-index: 4;
18080 font-weight: bold;
18081 text-align: center;
18082 border-radius: 50%;
18083 font-family: monospace;
18084 cursor: pointer;
18085 background: #7A8B9A;
18086 border: 6px solid #F6F5FA;
18087 margin: -6px;
18088 }
18089 .wpfnl-drawing-window .drawflow .drawflow-add-step:hover {
18090 background: #6E42D3;
18091 }
18092 .wpfnl-drawing-window .drawflow .drawflow > .drawflow-add-step {
18093 margin-left: -15px;
18094 margin-top: 15px;
18095 }
18096 .wpfnl-drawing-window .drawflow .parent-node .drawflow-add-step {
18097 right: -15px;
18098 top: -15px;
18099 }
18100 .wpfnl-drawing-window .drawflow .drawflow-paste-step {
18101 position: absolute;
18102 display: flex;
18103 justify-content: center;
18104 align-items: center;
18105 z-index: 4;
18106 font-weight: 500;
18107 text-align: center;
18108 font-family: Roboto;
18109 cursor: pointer;
18110 border-radius: 100px;
18111 border: 6px solid #F6F5FA;
18112 background: #FFF;
18113 width: auto;
18114 height: auto;
18115 padding: 6px 10px;
18116 color: #363B4E !important;
18117 font-size: 10px;
18118 min-width: 80px;
18119 }
18120 .wpfnl-drawing-window .drawflow .drawflow > .drawflow-paste-step {
18121 margin-left: -15px;
18122 margin-top: 15px;
18123 }
18124 .wpfnl-drawing-window .drawflow .parent-node .drawflow-paste-step {
18125 right: -15px;
18126 top: -15px;
18127 }
18128 .wpfnl-drawing-window .drawflow .connection .main-path {
18129 stroke-dasharray: 0;
18130 stroke: #7a8b9a;
18131 stroke-width: 1.8px;
18132 }
18133 .wpfnl-drawing-window .drawflow .connection .main-path:hover, .wpfnl-drawing-window .drawflow .connection .main-path.selected {
18134 stroke: #7a8b9a;
18135 }
18136 .wpfnl-drawing-window .drawflow .drawflow-node {
18137 border: none;
18138 background-color: transparent !important;
18139 border-radius: 10px;
18140 padding: 0;
18141 width: 180px;
18142 }
18143 .wpfnl-drawing-window .drawflow .drawflow-node .drawflow_content_node {
18144 text-align: center;
18145 cursor: default;
18146 }
18147 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper {
18148 position: relative;
18149 }
18150 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .not-clickable-overlay {
18151 position: fixed;
18152 background: rgba(0, 0, 0, 0.2901960784);
18153 display: block;
18154 }
18155 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal {
18156 position: fixed;
18157 top: calc(50% - 90px);
18158 opacity: 1;
18159 visibility: visible;
18160 }
18161 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header {
18162 background: #FFFFFF;
18163 border-bottom: 1px dashed #7A8B9A;
18164 border-radius: 5px 5px 0px 0px;
18165 left: -45px;
18166 position: relative;
18167 top: -45px;
18168 display: flex;
18169 align-items: center;
18170 width: calc(100% + 90px);
18171 padding: 6px 15px;
18172 }
18173 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button {
18174 display: flex;
18175 align-items: center;
18176 background: transparent;
18177 border: none;
18178 cursor: pointer;
18179 font-weight: 500;
18180 font-size: 14px;
18181 line-height: 1;
18182 text-align: center;
18183 color: #787F96;
18184 margin-left: 13px;
18185 }
18186 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button svg {
18187 margin-left: 5px;
18188 position: relative;
18189 top: -1px;
18190 }
18191 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button.edit svg {
18192 width: 17px;
18193 }
18194 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button.start {
18195 margin-left: auto;
18196 }
18197 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-overlay {
18198 position: fixed;
18199 top: 0;
18200 left: 0;
18201 width: 100%;
18202 height: 100%;
18203 background-color: transparent;
18204 }
18205 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper {
18206 box-sizing: border-box;
18207 margin-bottom: 40px;
18208 }
18209 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper:last-child {
18210 margin-bottom: 0;
18211 }
18212 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper button.active {
18213 position: relative;
18214 }
18215 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper button.active .wpfnl-dropdown {
18216 visibility: visible;
18217 opacity: 1;
18218 }
18219 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown {
18220 top: 20px;
18221 left: 0;
18222 border-radius: 6px;
18223 border: 1px solid #EBEDF0;
18224 background: #FFF;
18225 box-shadow: 0px 2px 20px 0px rgba(210, 209, 218, 0.3);
18226 padding: 10px;
18227 }
18228 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown .wpfnl-dropdown-item {
18229 border-radius: 4px;
18230 background: #F6F8FA;
18231 padding: 8px;
18232 width: auto;
18233 height: auto;
18234 flex-direction: row;
18235 align-items: center;
18236 justify-content: flex-start;
18237 display: flex;
18238 gap: 8px;
18239 cursor: pointer;
18240 }
18241 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown .wpfnl-dropdown-item svg {
18242 margin: 0;
18243 }
18244 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown .wpfnl-dropdown-item span {
18245 color: #2D3149;
18246 font-weight: 500;
18247 }
18248 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown::after {
18249 content: none;
18250 }
18251 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .has-mailmint-step .single-node-wrapper:not(.single-node-thankyou):nth-last-of-type(2) {
18252 margin-bottom: 0;
18253 }
18254 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node {
18255 position: relative;
18256 background: #FFFFFF;
18257 box-sizing: border-box;
18258 border-radius: 10px;
18259 border: 1px solid #EDECF2;
18260 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
18261 }
18262 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper svg {
18263 display: block;
18264 position: relative;
18265 }
18266 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .placeholder-img svg {
18267 width: 100%;
18268 }
18269 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button {
18270 background: #fff;
18271 display: flex;
18272 flex-flow: row;
18273 align-items: center;
18274 justify-content: center;
18275 z-index: 2;
18276 transition: all 0.3s ease;
18277 width: 100%;
18278 margin-top: 12px;
18279 margin-bottom: 3px;
18280 gap: 10px;
18281 }
18282 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li {
18283 width: 24px;
18284 height: 22px;
18285 display: flex;
18286 flex-flow: column;
18287 align-items: center;
18288 justify-content: center;
18289 position: relative;
18290 }
18291 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li > button {
18292 border: none;
18293 background: transparent;
18294 }
18295 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li > a, .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li > button {
18296 display: block;
18297 text-align: center;
18298 line-height: 22px;
18299 width: 100%;
18300 cursor: pointer;
18301 }
18302 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li svg {
18303 margin: 0 auto;
18304 }
18305 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag {
18306 position: absolute;
18307 top: -23px;
18308 left: 50%;
18309 padding: 0;
18310 transform: translateX(-50%);
18311 }
18312 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag::before {
18313 content: "";
18314 position: absolute;
18315 left: calc(50% - 1px);
18316 bottom: -6px;
18317 width: 10px;
18318 height: 10px;
18319 background: #6E42D3;
18320 border-radius: 2px;
18321 transform: rotate(45deg) translateX(-50%);
18322 z-index: 0;
18323 }
18324 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag.has-opacity {
18325 background: #9F8ACD;
18326 }
18327 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag.has-opacity::before {
18328 background: #9F8ACD;
18329 }
18330 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag a {
18331 font-size: 12px;
18332 line-height: 1;
18333 font-weight: 700;
18334 letter-spacing: -0.3px;
18335 padding: 3px 5px 3px;
18336 display: block;
18337 position: relative;
18338 white-space: nowrap;
18339 }
18340 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown {
18341 background: #FFFFFF;
18342 box-shadow: 0px 8px 30px rgba(21, 21, 69, 0.1019607843);
18343 border-radius: 10px;
18344 position: absolute;
18345 left: calc(100% + 8px);
18346 top: 0;
18347 z-index: 3;
18348 width: 184px;
18349 text-align: left;
18350 border: 1px solid #E5E8F3;
18351 display: none;
18352 }
18353 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown button {
18354 font-weight: 500;
18355 font-size: 14px;
18356 line-height: 1;
18357 color: #787F96;
18358 border: none;
18359 background: transparent;
18360 padding: 10px 15px;
18361 border-bottom: 1px solid #F1F3FA;
18362 text-align: left;
18363 width: 100%;
18364 cursor: pointer;
18365 transition: color 0.3s ease;
18366 }
18367 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown button:last-child {
18368 border-bottom: 0;
18369 }
18370 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown button:hover {
18371 color: #6E42D3;
18372 }
18373 .wpfnl-drawing-window .drawflow .drawflow-node .node-header {
18374 background: #ffffff;
18375 box-sizing: border-box;
18376 border-radius: 10px 10px 0px 0px;
18377 padding: 10px 3px 9px;
18378 }
18379 .wpfnl-drawing-window .drawflow .drawflow-node .node-header .node-title {
18380 color: #363B4E;
18381 font-weight: 500;
18382 font-size: 13px;
18383 line-height: 14px;
18384 padding: 0;
18385 margin: 0;
18386 text-transform: capitalize;
18387 display: flex;
18388 align-items: center;
18389 justify-content: center;
18390 gap: 6px;
18391 }
18392 .wpfnl-drawing-window .drawflow .drawflow-node .node-header .node-title span {
18393 font-size: 11px;
18394 color: #797e94;
18395 max-width: 88px;
18396 white-space: nowrap;
18397 overflow: hidden;
18398 text-overflow: ellipsis;
18399 display: inline-block;
18400 vertical-align: middle;
18401 }
18402 .wpfnl-drawing-window .drawflow .drawflow-node .node-body {
18403 padding: 10px;
18404 }
18405 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .placeholder-img.thankyou {
18406 padding: 14px 0px;
18407 }
18408 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .no-product-notice {
18409 transform: translateY(-7px);
18410 width: 100%;
18411 }
18412 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .preview-img {
18413 border-radius: 8px;
18414 border: 1px solid #EEF0F3;
18415 position: relative;
18416 overflow: hidden;
18417 height: 121px;
18418 background: #f6f5fa;
18419 }
18420 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .preview-img > div {
18421 height: 100%;
18422 background-repeat: no-repeat;
18423 background-size: cover;
18424 background-position: center -5px;
18425 }
18426 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .preview-img img {
18427 border-radius: 8px;
18428 height: 100%;
18429 object-fit: cover;
18430 }
18431 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta {
18432 background: linear-gradient(180deg, rgba(217, 217, 217, 0) 44.08%, rgba(0, 0, 0, 0.53) 100%);
18433 border-radius: 8px;
18434 position: absolute;
18435 bottom: -6px;
18436 left: 0;
18437 width: 100%;
18438 height: 100%;
18439 display: flex;
18440 flex-flow: column;
18441 align-items: center;
18442 justify-content: flex-end;
18443 padding-bottom: 15px;
18444 }
18445 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span {
18446 font-weight: 500;
18447 font-size: 12px;
18448 line-height: 10px;
18449 text-transform: capitalize;
18450 color: #FFFFFF;
18451 display: block;
18452 }
18453 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span.clickable-tag {
18454 cursor: pointer;
18455 text-decoration: underline;
18456 text-underline-offset: 2px;
18457 transition: opacity 0.15s ease;
18458 }
18459 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span.clickable-tag:hover {
18460 opacity: 0.8;
18461 }
18462 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span.has-orderbump {
18463 font-weight: 600;
18464 }
18465 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span {
18466 border: 1px solid #EEF0F3;
18467 border-radius: 8px;
18468 display: block;
18469 font-weight: 500;
18470 font-size: 12px;
18471 line-height: 1;
18472 text-align: center;
18473 text-transform: capitalize;
18474 color: #363B4E;
18475 padding: 8px 5px;
18476 margin-top: 10px;
18477 }
18478 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.no-product {
18479 color: #ee5f5a;
18480 }
18481 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.has-product {
18482 color: #45b959;
18483 font-weight: 600;
18484 border-color: #45b959;
18485 }
18486 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag {
18487 cursor: pointer;
18488 transition: opacity 0.15s ease, border-color 0.15s ease;
18489 }
18490 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag:hover {
18491 opacity: 0.75;
18492 }
18493 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag.no-product:hover {
18494 border-color: #ee5f5a;
18495 }
18496 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag.has-product:hover {
18497 border-color: #45b959;
18498 }
18499 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag {
18500 position: absolute;
18501 top: 98px;
18502 left: calc(100% + 54px);
18503 width: 50px;
18504 height: 50px;
18505 border: 1px solid #EDECF2;
18506 box-shadow: 0px 6px 10px 0px rgba(190, 190, 215, 0.08);
18507 background: #ffffff;
18508 display: flex;
18509 align-items: center;
18510 justify-content: center;
18511 border-radius: 100%;
18512 }
18513 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag .flag-line {
18514 position: absolute;
18515 right: calc(100% + 11px);
18516 top: 18px;
18517 width: 42px;
18518 height: 2px;
18519 background: #7A8B9A;
18520 }
18521 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag:before {
18522 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzdBOEI5QSIgZD0iTTEuNzUgMTUuNTg1YTEuMDgzIDEuMDgzIDAgMDEtLjc3LTEuODUybDUuNzQyLTUuNzMxTC45ODEgMi4yN0ExLjA4OCAxLjA4OCAwIDAxMi41MTkuNzMzbDYuNSA2LjVhMS4wODMgMS4wODMgMCAwMTAgMS41MjdsLTYuNSA2LjVhMS4wODMgMS4wODMgMCAwMS0uNzcuMzI1eiIvPjwvc3ZnPg==");
18523 position: absolute;
18524 right: calc(100% + 9px);
18525 top: 17px;
18526 width: 10px;
18527 height: 16px;
18528 }
18529 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag:after {
18530 content: "";
18531 position: absolute;
18532 left: -61px;
18533 top: 20px;
18534 width: 12px;
18535 height: 12px;
18536 border: 2px solid #7A8B9A;
18537 border-radius: 100%;
18538 box-sizing: border-box;
18539 background: #fff;
18540 }
18541 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag path {
18542 stroke: #6E42D3;
18543 }
18544 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag > span {
18545 font-size: 14px;
18546 line-height: 1.2;
18547 font-weight: 600;
18548 color: #363B4E;
18549 margin-top: 6px;
18550 display: block;
18551 }
18552 .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input,
18553 .wpfnl-drawing-window .drawflow .drawflow-node .output {
18554 border-radius: 50%;
18555 border: 2px solid #7A8B9A;
18556 background: #fff;
18557 width: 12px;
18558 height: 12px;
18559 position: absolute;
18560 right: 7px;
18561 top: 120px;
18562 pointer-events: none !important;
18563 }
18564 .wpfnl-drawing-window .drawflow .drawflow-node .output {
18565 opacity: 1 !important;
18566 right: -5px;
18567 pointer-events: none !important;
18568 }
18569 .wpfnl-drawing-window .drawflow .drawflow-node .output.output_2 {
18570 top: 120px;
18571 }
18572 .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input {
18573 background: #f6f5fa;
18574 opacity: 1 !important;
18575 border: none;
18576 left: -13px;
18577 }
18578 .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input.input-connected:before {
18579 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzdBOEI5QSIgZD0iTTEuNzUgMTUuNTg1YTEuMDgzIDEuMDgzIDAgMDEtLjc3LTEuODUybDUuNzQyLTUuNzMxTC45ODEgMi4yN0ExLjA4OCAxLjA4OCAwIDAxMi41MTkuNzMzbDYuNSA2LjVhMS4wODMgMS4wODMgMCAwMTAgMS41MjdsLTYuNSA2LjVhMS4wODMgMS4wODMgMCAwMS0uNzcuMzI1eiIvPjwvc3ZnPg==");
18580 width: 10px;
18581 height: 16px;
18582 border-radius: 0px;
18583 position: absolute;
18584 left: -9px;
18585 top: -2px;
18586 }
18587 .wpfnl-drawing-window .drawflow .drawflow-node.selected {
18588 z-index: 4;
18589 }
18590 .wpfnl-drawing-window .drawflow .drawflow-node.landing .node-header {
18591 background: #E8F1FF;
18592 }
18593 .wpfnl-drawing-window .drawflow .drawflow-node.landing .node-header .node-title svg {
18594 width: 15px;
18595 height: 15px;
18596 }
18597 .wpfnl-drawing-window .drawflow .drawflow-node.checkout .node-header {
18598 background: #FDF0E8;
18599 padding: 9px 3px 8px;
18600 }
18601 .wpfnl-drawing-window .drawflow .drawflow-node.checkout .node-header .node-title svg {
18602 width: 15px;
18603 height: 17px;
18604 top: -1px;
18605 }
18606 .wpfnl-drawing-window .drawflow .drawflow-node.upsell .node-header {
18607 background: #E9F9E8;
18608 }
18609 .wpfnl-drawing-window .drawflow .drawflow-node.upsell .node-header .node-title svg {
18610 width: 15px;
18611 height: 15px;
18612 }
18613 .wpfnl-drawing-window .drawflow .drawflow-node.downsell .node-header {
18614 background: #FCF0F1;
18615 }
18616 .wpfnl-drawing-window .drawflow .drawflow-node.downsell .node-header .node-title svg {
18617 width: 15px;
18618 height: 15px;
18619 }
18620 .wpfnl-drawing-window .drawflow .drawflow-node.thankyou .node-header {
18621 background: #E6FAF5;
18622 }
18623 .wpfnl-drawing-window .drawflow .drawflow-node.thankyou .node-header .node-title svg {
18624 width: 15px;
18625 height: 15px;
18626 }
18627 .wpfnl-drawing-window .drawflow .drawflow-node.custom .node-header {
18628 background: #E0F2F4;
18629 }
18630 .wpfnl-drawing-window .drawflow .drawflow-node.custom .node-header .node-title svg {
18631 width: 15px;
18632 height: 15px;
18633 }
18634 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .output:before {
18635 display: none;
18636 }
18637 .wpfnl-drawing-window .drawflow .drawflow-node.conditional.selected .actions {
18638 top: -35px;
18639 }
18640 .wpfnl-drawing-window .drawflow .drawflow-step-delete {
18641 position: absolute;
18642 right: -8px;
18643 top: -8px;
18644 width: 22px;
18645 height: 22px;
18646 border-radius: 30px;
18647 background: #ffffff;
18648 color: #ffffff;
18649 border: 2px solid #EE5F5A;
18650 line-height: 1.3;
18651 cursor: pointer;
18652 z-index: 1;
18653 opacity: 0;
18654 visibility: hidden;
18655 transition: all 0.3s ease;
18656 }
18657 .wpfnl-drawing-window .drawflow .drawflow-step-delete:before {
18658 content: "";
18659 position: absolute;
18660 left: 0;
18661 top: 0;
18662 width: 100%;
18663 height: 100%;
18664 background-image: url("../images/cross.svg");
18665 background-repeat: no-repeat;
18666 background-size: 80% 80%;
18667 background-position: center center;
18668 border-radius: 50%;
18669 }
18670 .wpfnl-drawing-window .drawflow .ab-testing-indicator {
18671 position: absolute;
18672 top: -28px;
18673 left: 50%;
18674 transform: translateX(-50%);
18675 color: #FFF;
18676 font-size: 10px;
18677 font-weight: 600;
18678 line-height: 1;
18679 background-color: #EC813F;
18680 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
18681 z-index: 2;
18682 padding: 5px 10px;
18683 white-space: nowrap;
18684 border-radius: 50px;
18685 }
18686 .wpfnl-drawing-window .drawflow .node-condition-wrapper .drawflow-step-delete {
18687 left: -3px;
18688 right: inherit;
18689 top: -7px;
18690 }
18691 .wpfnl-drawing-window .drawflow .node-condition-wrapper:hover .drawflow-step-delete,
18692 .wpfnl-drawing-window .drawflow .node-wrapper:hover .drawflow-step-delete {
18693 opacity: 1;
18694 visibility: visible;
18695 }
18696 .wpfnl-drawing-window .drawflow .drawflow-delete:before {
18697 content: "";
18698 position: absolute;
18699 left: 0;
18700 top: 0;
18701 width: 100%;
18702 height: 100%;
18703 background-image: url("../images/cross.svg");
18704 background-repeat: no-repeat;
18705 background-size: 80% 80%;
18706 background-position: center center;
18707 border-radius: 50%;
18708 }
18709 .wpfnl-drawing-window .drawflow .drawflow-node:not(.conditional) .outputs .output,
18710 .wpfnl-drawing-window .drawflow .drawflow-node:not(.conditional) .inputs .input {
18711 opacity: 0;
18712 }
18713 .wpfnl-drawing-window .drawflow .drawflow-node.selected:not(.conditional) .outputs .output,
18714 .wpfnl-drawing-window .drawflow .drawflow-node.selected:not(.conditional) .inputs .input {
18715 opacity: 1;
18716 }
18717 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .outputs .output,
18718 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .inputs .input {
18719 width: 9px;
18720 height: 9px;
18721 border-radius: 50%;
18722 border: 2px solid #7A8B9A;
18723 background: #fff;
18724 background-image: none;
18725 }
18726 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .outputs .output {
18727 right: 5px;
18728 }
18729 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .inputs .input {
18730 left: -5px;
18731 }
18732 .wpfnl-drawing-window .drawflow .drawflow-delete {
18733 width: 22px;
18734 height: 22px;
18735 background: #ffffff;
18736 color: #ffffff;
18737 border: 2px solid #EE5F5A;
18738 line-height: 1.3;
18739 display: none;
18740 opacity: 0;
18741 visibility: hidden;
18742 }
18743 .wpfnl-drawing-window .drawflow .drawflow-node.conditional {
18744 background: #ffffff !important;
18745 border-radius: 100%;
18746 width: 56px;
18747 height: 56px;
18748 border: 1px solid #E5E8F3;
18749 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
18750 }
18751 .wpfnl-drawing-window .drawflow .drawflow-node.conditional svg {
18752 position: relative;
18753 top: 3px;
18754 }
18755 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .drawflow-delete {
18756 left: -2px;
18757 top: -6px;
18758 }
18759 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .actions {
18760 position: absolute;
18761 top: -19px;
18762 background: #fff;
18763 left: 50%;
18764 transform: translateX(-50%);
18765 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
18766 border-radius: 5px;
18767 transition: all 0.3s ease;
18768 opacity: 0;
18769 visibility: hidden;
18770 }
18771 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .actions:before {
18772 content: "";
18773 position: absolute;
18774 bottom: -5px;
18775 left: 50%;
18776 width: 8px;
18777 height: 8px;
18778 background: white;
18779 margin-left: -4px;
18780 transform: rotate(45deg);
18781 }
18782 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .actions li {
18783 padding: 2px 6px;
18784 cursor: pointer;
18785 }
18786 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-label {
18787 position: absolute;
18788 bottom: -10px;
18789 left: 50%;
18790 background: #fff;
18791 font-size: 13px;
18792 text-transform: capitalize;
18793 padding: 2px 6px;
18794 border-radius: 4px;
18795 transform: translateX(-50%);
18796 opacity: 0;
18797 visibility: hidden;
18798 transition: all 0.3s ease;
18799 }
18800 .wpfnl-drawing-window .drawflow .drawflow-node.conditional.selected .actions {
18801 top: -39px;
18802 opacity: 1;
18803 visibility: visible;
18804 }
18805 .wpfnl-drawing-window .drawflow .drawflow-node.conditional.selected .condition-label {
18806 bottom: -30px;
18807 opacity: 1;
18808 visibility: visible;
18809 }
18810 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-else,
18811 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-if {
18812 position: absolute;
18813 background: #fff;
18814 border-radius: 50%;
18815 cursor: pointer;
18816 font-size: 11px;
18817 text-transform: uppercase;
18818 font-weight: 600;
18819 width: 20px;
18820 height: 20px;
18821 border: 2px solid #00D057;
18822 color: #00D057;
18823 padding: 1px 0;
18824 }
18825 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-if {
18826 top: -8px;
18827 right: -17px;
18828 }
18829 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-else {
18830 bottom: -7px;
18831 right: -17px;
18832 color: #EE5F5A;
18833 border-color: #EE5F5A;
18834 }
18835 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper.ab-testing-started {
18836 border-color: #6E42D3;
18837 }
18838 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper.ab-testing-started .ab-testing-header {
18839 border-bottom-color: #6E42D3;
18840 }
18841 .wpfnl-drawing-window .drawflow > .drawflow-delete {
18842 margin-top: -9px;
18843 margin-left: -11px;
18844 }
18845
18846 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing {
18847 cursor: not-allowed;
18848 }
18849 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing:before {
18850 content: url(../images/disabled.svg);
18851 position: absolute;
18852 top: 0;
18853 z-index: 1;
18854 left: 0;
18855 color: #e33e3e;
18856 background: rgba(249, 249, 249, 0.6509803922);
18857 width: 100%;
18858 height: 100%;
18859 border-radius: 10px;
18860 display: flex;
18861 flex-flow: column;
18862 align-items: center;
18863 justify-content: center;
18864 font-size: 15px;
18865 font-weight: 500;
18866 }
18867 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing .add-new-action {
18868 display: none;
18869 }
18870 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing .mintmrm-automation-step-wrapper {
18871 display: none;
18872 }
18873
18874 .wpfnl-vertical-flow-view {
18875 width: 100%;
18876 flex: 1;
18877 min-height: 0;
18878 overflow: hidden;
18879 display: flex;
18880 justify-content: center;
18881 align-items: flex-start;
18882 padding: 40px 40px 60px;
18883 background: #f6f5fa;
18884 cursor: grab;
18885 }
18886 .wpfnl-vertical-flow-view.vf--panning {
18887 cursor: grabbing;
18888 user-select: none;
18889 }
18890 .wpfnl-vertical-flow-view .vf-flow-container {
18891 display: flex;
18892 flex-direction: column;
18893 align-items: center;
18894 flex-shrink: 0;
18895 }
18896 .wpfnl-vertical-flow-view .vf-step-card {
18897 width: 300px;
18898 flex-shrink: 0;
18899 background: #fff;
18900 border-radius: 12px;
18901 border-top: 3px solid #ec813f;
18902 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
18903 overflow: visible;
18904 position: relative;
18905 cursor: pointer;
18906 transition: box-shadow 0.18s ease, border-color 0.18s ease;
18907 }
18908 .wpfnl-vertical-flow-view .vf-step-card:hover {
18909 box-shadow: 0 3px 12px rgba(0, 0, 0, 0.08);
18910 }
18911 .wpfnl-vertical-flow-view .vf-step-card:hover .vf-step-card__hover-actions {
18912 opacity: 1;
18913 visibility: visible;
18914 transform: translateX(0);
18915 }
18916 .wpfnl-vertical-flow-view .vf-step-card--gbf-disabled {
18917 cursor: not-allowed;
18918 }
18919 .wpfnl-vertical-flow-view .vf-step-card--gbf-disabled::before {
18920 content: url(../images/disabled.svg);
18921 position: absolute;
18922 top: 0;
18923 left: 0;
18924 z-index: 5;
18925 width: 100%;
18926 height: 100%;
18927 border-radius: 12px;
18928 background: rgba(249, 249, 249, 0.65);
18929 display: flex;
18930 align-items: center;
18931 justify-content: center;
18932 }
18933 .wpfnl-vertical-flow-view .vf-step-card--landing {
18934 border-top-color: #2b74ff;
18935 }
18936 .wpfnl-vertical-flow-view .vf-step-card--landing .vf-step-card__icon-wrap {
18937 background: #E8F1FF;
18938 color: #0284c7;
18939 }
18940 .wpfnl-vertical-flow-view .vf-step-card--checkout {
18941 border-top-color: #ec813f;
18942 }
18943 .wpfnl-vertical-flow-view .vf-step-card--checkout .vf-step-card__icon-wrap {
18944 background: #FDF0E8;
18945 color: #d97706;
18946 }
18947 .wpfnl-vertical-flow-view .vf-step-card--upsell {
18948 border-top-color: #3bc219;
18949 }
18950 .wpfnl-vertical-flow-view .vf-step-card--upsell .vf-step-card__icon-wrap {
18951 background: #E9F9E8;
18952 color: #059669;
18953 }
18954 .wpfnl-vertical-flow-view .vf-step-card--downsell {
18955 border-top-color: #d94f80;
18956 }
18957 .wpfnl-vertical-flow-view .vf-step-card--downsell .vf-step-card__icon-wrap {
18958 background: #FCF0F1;
18959 color: #dc2626;
18960 }
18961 .wpfnl-vertical-flow-view .vf-step-card--thankyou {
18962 border-top-color: #44d6ad;
18963 }
18964 .wpfnl-vertical-flow-view .vf-step-card--thankyou .vf-step-card__icon-wrap {
18965 background: #E6FAF5;
18966 color: #7c3aed;
18967 }
18968 .wpfnl-vertical-flow-view .vf-step-card--custom .vf-step-card__icon-wrap {
18969 background: #E0F2F4;
18970 color: #64748b;
18971 }
18972 .wpfnl-vertical-flow-view .vf-step-card__header {
18973 display: flex;
18974 align-items: flex-start;
18975 gap: 12px;
18976 padding: 16px;
18977 }
18978 .wpfnl-vertical-flow-view .vf-step-card__icon-wrap {
18979 width: 44px;
18980 height: 44px;
18981 border-radius: 10px;
18982 display: flex;
18983 align-items: center;
18984 justify-content: center;
18985 flex-shrink: 0;
18986 background: #f1f5f9;
18987 }
18988 .wpfnl-vertical-flow-view .vf-step-card__icon-wrap svg,
18989 .wpfnl-vertical-flow-view .vf-step-card__icon-wrap img {
18990 width: 22px;
18991 height: 22px;
18992 }
18993 .wpfnl-vertical-flow-view .vf-step-card__info {
18994 flex: 1;
18995 min-width: 0;
18996 display: flex;
18997 flex-direction: column;
18998 gap: 3px;
18999 padding-top: 2px;
19000 }
19001 .wpfnl-vertical-flow-view .vf-step-card__title {
19002 font-size: 14px;
19003 font-weight: 500;
19004 color: #1d2939;
19005 line-height: 1.2;
19006 text-transform: capitalize;
19007 }
19008 .wpfnl-vertical-flow-view .vf-step-card__subtitle {
19009 font-size: 13px;
19010 }
19011 .wpfnl-vertical-flow-view .vf-step-card__subtitle {
19012 font-size: 11px !important;
19013 font-weight: 400 !important;
19014 color: #98a2b3 !important;
19015 white-space: nowrap;
19016 overflow: hidden;
19017 text-overflow: ellipsis;
19018 line-height: 1.3;
19019 }
19020 .wpfnl-vertical-flow-view .vf-step-card__cond-status {
19021 font-size: 12px;
19022 line-height: 1.3;
19023 display: flex;
19024 align-items: center;
19025 gap: 5px;
19026 }
19027 .wpfnl-vertical-flow-view .vf-step-card__cond-status--active {
19028 color: #16a34a;
19029 }
19030 .wpfnl-vertical-flow-view .vf-step-card__cond-status--active::before {
19031 content: "";
19032 display: inline-block;
19033 width: 7px;
19034 height: 7px;
19035 border-radius: 50%;
19036 background: #16a34a;
19037 flex-shrink: 0;
19038 }
19039 .wpfnl-vertical-flow-view .vf-step-card__cond-status--warn {
19040 color: #dc2626 !important;
19041 }
19042 .wpfnl-vertical-flow-view .vf-step-card__hover-actions {
19043 position: absolute;
19044 left: calc(100% + 10px);
19045 top: 0;
19046 transform: translateX(8px);
19047 }
19048 .wpfnl-vertical-flow-view .vf-step-card__hover-actions--flip {
19049 left: auto;
19050 right: calc(100% + 10px);
19051 transform: translateX(-8px);
19052 }
19053 .wpfnl-vertical-flow-view .vf-step-card__hover-actions {
19054 display: flex;
19055 flex-direction: column;
19056 padding: 5px;
19057 background: #fff;
19058 border: 1px solid #eaecf0;
19059 border-radius: 10px;
19060 box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
19061 opacity: 0;
19062 visibility: hidden;
19063 z-index: 100;
19064 min-width: 150px;
19065 transition: opacity 0.18s ease, visibility 0.18s ease, transform 0.18s ease;
19066 white-space: nowrap;
19067 }
19068 .wpfnl-vertical-flow-view .vf-hover-btn {
19069 display: flex;
19070 align-items: center;
19071 gap: 8px;
19072 width: 100%;
19073 padding: 7px 14px;
19074 background: transparent;
19075 border: none;
19076 border-radius: 7px;
19077 cursor: pointer;
19078 color: #344054;
19079 text-decoration: none;
19080 font-size: 13px;
19081 font-weight: 500;
19082 text-align: left;
19083 transition: background 0.12s ease, color 0.12s ease;
19084 }
19085 .wpfnl-vertical-flow-view .vf-hover-btn svg {
19086 flex-shrink: 0;
19087 width: 14px;
19088 height: 14px;
19089 }
19090 .wpfnl-vertical-flow-view .vf-hover-btn span {
19091 font-size: 13px !important;
19092 font-weight: 500 !important;
19093 color: inherit !important;
19094 line-height: 1;
19095 white-space: nowrap;
19096 }
19097 .wpfnl-vertical-flow-view .vf-hover-btn:hover {
19098 background: #f4f5f7;
19099 color: #6e42d3;
19100 text-decoration: none;
19101 }
19102 .wpfnl-vertical-flow-view .vf-hover-btn--danger {
19103 color: #f04438;
19104 }
19105 .wpfnl-vertical-flow-view .vf-hover-btn--danger:hover {
19106 background: #fff1f0;
19107 color: #f04438;
19108 }
19109 .wpfnl-vertical-flow-view .vf-step-card__status {
19110 display: flex;
19111 flex-wrap: wrap;
19112 gap: 4px;
19113 padding: 0 16px 10px;
19114 }
19115 .wpfnl-vertical-flow-view .vf-status-pill {
19116 display: inline-flex;
19117 align-items: center;
19118 gap: 4px;
19119 font-size: 10px;
19120 font-weight: 600;
19121 line-height: 1;
19122 padding: 4px 8px;
19123 border-radius: 50px;
19124 white-space: nowrap;
19125 }
19126 .wpfnl-vertical-flow-view .vf-status-pill svg {
19127 width: 10px;
19128 height: 10px;
19129 flex-shrink: 0;
19130 }
19131 .wpfnl-vertical-flow-view .vf-status-pill--automation {
19132 color: #24C21A;
19133 background: rgba(36, 194, 26, 0.1);
19134 }
19135 .wpfnl-vertical-flow-view .vf-status-pill--automation svg path {
19136 stroke: #24C21A;
19137 }
19138 .wpfnl-vertical-flow-view .vf-status-pill--ab {
19139 color: #EC813F;
19140 background: rgba(236, 129, 63, 0.12);
19141 }
19142 .wpfnl-vertical-flow-view .vf-step-card__badges {
19143 display: flex;
19144 flex-wrap: wrap;
19145 gap: 4px;
19146 padding: 0 16px 12px;
19147 }
19148 .wpfnl-vertical-flow-view .vf-step-card__badges:empty {
19149 display: none;
19150 }
19151 .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag {
19152 display: inline-block;
19153 font-size: 10px;
19154 font-weight: 400;
19155 padding: 5px 8px 4px;
19156 border-radius: 20px;
19157 cursor: pointer;
19158 line-height: 1;
19159 background-color: #eef0f1;
19160 border: 1px solid #e6e6e6;
19161 transition: opacity 0.15s ease;
19162 letter-spacing: 0.2px;
19163 }
19164 .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag:hover {
19165 opacity: 0.75;
19166 }
19167 .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag--active, .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag--has-product {
19168 background: #f0fdf4;
19169 color: #58151c;
19170 border-color: #bbf7d0;
19171 }
19172 .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag--inactive, .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag--no-product {
19173 background: #fff8f8;
19174 color: #f38282;
19175 border-color: #fecaca;
19176 }
19177 .wpfnl-vertical-flow-view .vf-dropdown {
19178 position: absolute;
19179 right: 0;
19180 background: #fff;
19181 border: 1px solid #eaecf0;
19182 border-radius: 10px;
19183 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
19184 padding: 4px;
19185 min-width: 140px;
19186 z-index: 200;
19187 list-style: none;
19188 margin: 0;
19189 }
19190 .wpfnl-vertical-flow-view .vf-dropdown__item {
19191 display: flex;
19192 align-items: center;
19193 gap: 8px;
19194 padding: 8px 10px;
19195 font-size: 12px !important;
19196 color: #344054;
19197 border-radius: 6px;
19198 cursor: pointer;
19199 transition: background 0.12s ease;
19200 }
19201 .wpfnl-vertical-flow-view .vf-dropdown__item:hover {
19202 background: #f9fafb;
19203 }
19204 .wpfnl-vertical-flow-view .vf-dropdown__item a {
19205 display: flex;
19206 align-items: center;
19207 gap: 8px;
19208 width: 100%;
19209 text-decoration: none;
19210 color: inherit;
19211 font-size: 12px;
19212 }
19213 .wpfnl-vertical-flow-view .vf-dropdown__item svg {
19214 width: 14px;
19215 height: 14px;
19216 flex-shrink: 0;
19217 }
19218 .wpfnl-vertical-flow-view .vf-dropdown__item span {
19219 font-size: 12px !important;
19220 font-weight: 400 !important;
19221 color: inherit !important;
19222 }
19223 .wpfnl-vertical-flow-view .vf-dropdown__item--danger {
19224 color: #f04438;
19225 }
19226 .wpfnl-vertical-flow-view .vf-dropdown__item--danger:hover {
19227 background: #fff1f0;
19228 }
19229 .wpfnl-vertical-flow-view .vf-step-card__stats {
19230 display: flex;
19231 align-items: center;
19232 justify-content: space-between;
19233 padding: 8px 16px;
19234 border-top: 1px solid #f2f4f7;
19235 background: #f9f9fc;
19236 border-radius: 0 0 12px 12px;
19237 }
19238 .wpfnl-vertical-flow-view .vf-stat {
19239 display: flex;
19240 align-items: baseline;
19241 gap: 5px;
19242 }
19243 .wpfnl-vertical-flow-view .vf-stat__value {
19244 font-size: 13px;
19245 font-weight: 600;
19246 color: #344054;
19247 line-height: 1;
19248 }
19249 .wpfnl-vertical-flow-view .vf-stat__label {
19250 font-size: 12px;
19251 font-weight: 400;
19252 color: #98a2b3;
19253 line-height: 1;
19254 }
19255 .wpfnl-vertical-flow-view .number-skeleton {
19256 display: block;
19257 width: 28px;
19258 height: 13px;
19259 border-radius: 3px;
19260 background: linear-gradient(90deg, #EEF0F3 25%, #F7F8FA 50%, #EEF0F3 75%);
19261 background-size: 200% 100%;
19262 animation: wpfnl-stat-shimmer 1.2s ease-in-out infinite;
19263 }
19264 .wpfnl-vertical-flow-view .vf-add-step-btn {
19265 display: flex;
19266 align-items: center;
19267 justify-content: center;
19268 gap: 6px;
19269 width: 300px;
19270 flex-shrink: 0;
19271 padding: 12px 20px;
19272 background: #fff;
19273 border: 1.5px dashed #d0d5dd;
19274 border-radius: 12px;
19275 font-size: 13px;
19276 font-weight: 500;
19277 color: #667085;
19278 cursor: pointer;
19279 transition: all 0.18s ease;
19280 }
19281 .wpfnl-vertical-flow-view .vf-add-step-btn svg {
19282 color: #667085;
19283 transition: color 0.18s ease;
19284 }
19285 .wpfnl-vertical-flow-view .vf-add-step-btn:hover {
19286 border-color: #6e42d3;
19287 color: #6e42d3;
19288 background: #faf5ff;
19289 }
19290 .wpfnl-vertical-flow-view .vf-add-step-btn:hover svg {
19291 color: #6e42d3;
19292 }
19293 .wpfnl-vertical-flow-view .vf-connector {
19294 display: flex;
19295 flex-direction: column;
19296 align-items: center;
19297 position: relative;
19298 }
19299 .wpfnl-vertical-flow-view .vf-connector--merge .vf-connector__merge-icon {
19300 display: flex;
19301 align-items: center;
19302 justify-content: center;
19303 margin-bottom: 2px;
19304 opacity: 0.6;
19305 }
19306 .wpfnl-vertical-flow-view .vf-connector__line {
19307 width: 1px;
19308 height: 44px;
19309 background: #8896a7;
19310 position: relative;
19311 }
19312 .wpfnl-vertical-flow-view .vf-connector__line::after {
19313 content: "";
19314 position: absolute;
19315 bottom: 0;
19316 left: 50%;
19317 width: 6px;
19318 height: 6px;
19319 border-right: 1px solid #8896a7;
19320 border-bottom: 1px solid #8896a7;
19321 transform: translate(-50%, 1px) rotate(45deg);
19322 }
19323 .wpfnl-vertical-flow-view .vf-connector__line--half {
19324 height: 22px;
19325 }
19326 .wpfnl-vertical-flow-view .vf-connector__line--half::after {
19327 content: none;
19328 }
19329 .wpfnl-vertical-flow-view .vf-connector__dot {
19330 width: 8px;
19331 height: 8px;
19332 border-radius: 50%;
19333 background: #fff;
19334 border: 1px solid #8896a7;
19335 flex-shrink: 0;
19336 }
19337 .wpfnl-vertical-flow-view .vf-insert-connector {
19338 position: relative;
19339 display: flex;
19340 flex-direction: column;
19341 align-items: center;
19342 }
19343 .wpfnl-vertical-flow-view .vf-insert-connector .vf-connector__line {
19344 height: 88px;
19345 }
19346 .wpfnl-vertical-flow-view .vf-insert-connector:hover .vf-insert-btn {
19347 background: #6e42d3;
19348 transform: translateY(-50%) scale(1.08);
19349 }
19350 .wpfnl-vertical-flow-view .vf-insert-btn {
19351 position: absolute;
19352 top: 50%;
19353 transform: translateY(-50%);
19354 width: 28px;
19355 height: 28px;
19356 border-radius: 50%;
19357 border: none;
19358 background: #7A8B9A;
19359 color: #fff;
19360 display: flex;
19361 align-items: center;
19362 justify-content: center;
19363 cursor: pointer;
19364 z-index: 2;
19365 transition: background 0.15s ease, transform 0.15s ease;
19366 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
19367 flex-shrink: 0;
19368 }
19369 .wpfnl-vertical-flow-view .vf-insert-btn svg {
19370 pointer-events: none;
19371 width: 12px;
19372 height: 12px;
19373 }
19374 .wpfnl-vertical-flow-view .vf-insert-btn--paste {
19375 width: auto;
19376 height: 28px;
19377 border-radius: 14px;
19378 padding: 0 12px;
19379 font-size: 11px;
19380 font-weight: 600;
19381 white-space: nowrap;
19382 background: #6e42d3;
19383 opacity: 1 !important;
19384 transform: translateY(-50%) !important;
19385 }
19386 .wpfnl-vertical-flow-view .vf-insert-btn--paste:hover {
19387 background: #5b35b5;
19388 }
19389 .wpfnl-vertical-flow-view .vf-insert-connector--paste-mode:hover .vf-insert-btn--paste {
19390 background: #5b35b5;
19391 transform: translateY(-50%) scale(1.04) !important;
19392 }
19393 .wpfnl-vertical-flow-view .vf-paste-here-btn {
19394 display: flex;
19395 align-items: center;
19396 justify-content: center;
19397 gap: 6px;
19398 width: 300px;
19399 flex-shrink: 0;
19400 padding: 12px 20px;
19401 background: #faf5ff;
19402 border: 1.5px solid #6e42d3;
19403 border-radius: 12px;
19404 font-size: 13px;
19405 font-weight: 600;
19406 color: #6e42d3;
19407 cursor: pointer;
19408 transition: all 0.18s ease;
19409 }
19410 .wpfnl-vertical-flow-view .vf-paste-here-btn svg {
19411 color: #6e42d3;
19412 }
19413 .wpfnl-vertical-flow-view .vf-paste-here-btn:hover {
19414 background: #ede9fe;
19415 border-color: #5b35b5;
19416 color: #5b35b5;
19417 }
19418 .wpfnl-vertical-flow-view .vf-paste-here-btn:hover svg {
19419 color: #5b35b5;
19420 }
19421 .wpfnl-vertical-flow-view .vf-branch-group {
19422 display: flex;
19423 flex-direction: column;
19424 align-items: stretch;
19425 flex-shrink: 0;
19426 }
19427 .wpfnl-vertical-flow-view .vf-branch-connector {
19428 display: flex;
19429 flex-direction: column;
19430 align-items: center;
19431 }
19432 .wpfnl-vertical-flow-view .vf-branch-connector__stem {
19433 width: 1px;
19434 height: 28px;
19435 background: #8896a7;
19436 flex-shrink: 0;
19437 }
19438 .wpfnl-vertical-flow-view .vf-branch-connector__bar {
19439 display: none;
19440 }
19441 .wpfnl-vertical-flow-view .vf-branch-connector--nested .vf-branch-connector__stem {
19442 height: 18px;
19443 }
19444 .wpfnl-vertical-flow-view .vf-fork-label {
19445 font-size: 11px;
19446 font-weight: 400;
19447 padding: 5px 12px 4px;
19448 border-radius: 20px;
19449 white-space: nowrap;
19450 line-height: 1;
19451 margin-bottom: 12px;
19452 flex-shrink: 0;
19453 }
19454 .wpfnl-vertical-flow-view .vf-fork-label--yes {
19455 background: #fff;
19456 color: #16a34a;
19457 border: 1px solid #86efac;
19458 }
19459 .wpfnl-vertical-flow-view .vf-fork-label--no {
19460 background: #fff;
19461 color: #dc2626;
19462 border: 1px solid #fca5a5;
19463 }
19464 .wpfnl-vertical-flow-view .vf-branches-container {
19465 display: flex;
19466 flex-shrink: 0;
19467 min-height: 80px;
19468 gap: 70px;
19469 }
19470 .wpfnl-vertical-flow-view .vf-branch-column {
19471 position: relative;
19472 min-width: 300px;
19473 flex: 1 0 auto;
19474 display: flex;
19475 flex-direction: column;
19476 align-items: center;
19477 padding: 0 10px 12px;
19478 }
19479 .wpfnl-vertical-flow-view .vf-branch-column--no::before {
19480 content: "";
19481 position: absolute;
19482 top: 0;
19483 left: calc(50% - 0.5px);
19484 right: -35px;
19485 height: 1px;
19486 background: #8896a7;
19487 }
19488 .wpfnl-vertical-flow-view .vf-branch-column--no::after {
19489 content: none;
19490 }
19491 .wpfnl-vertical-flow-view .vf-branch-column--yes::before {
19492 content: "";
19493 position: absolute;
19494 top: 0;
19495 left: -35px;
19496 right: calc(50% - 0.5px);
19497 height: 1px;
19498 background: #8896a7;
19499 }
19500 .wpfnl-vertical-flow-view .vf-branch-column--yes::after {
19501 content: none;
19502 }
19503 .wpfnl-vertical-flow-view .vf-branch-column--no > .vf-fork-label {
19504 position: absolute;
19505 top: -1px;
19506 left: 75%;
19507 transform: translate(-50%, -50%);
19508 z-index: 2;
19509 margin-bottom: 0;
19510 }
19511 .wpfnl-vertical-flow-view .vf-branch-column--yes > .vf-fork-label {
19512 position: absolute;
19513 top: -1px;
19514 left: 25%;
19515 transform: translate(-50%, -50%);
19516 z-index: 2;
19517 margin-bottom: 0;
19518 }
19519 .wpfnl-vertical-flow-view .vf-conditional {
19520 display: flex;
19521 flex-direction: column;
19522 align-items: center;
19523 flex-shrink: 0;
19524 }
19525 .wpfnl-vertical-flow-view .vf-conditional__header {
19526 width: 300px;
19527 display: flex;
19528 align-items: center;
19529 gap: 10px;
19530 padding: 12px 16px;
19531 background: linear-gradient(108deg, #f3eeff 0%, #fff 60%);
19532 border: 1.5px solid #e9d9fc;
19533 border-radius: 12px;
19534 box-shadow: 0 1px 4px rgba(110, 66, 211, 0.08);
19535 cursor: pointer;
19536 }
19537 .wpfnl-vertical-flow-view .vf-conditional__header:hover {
19538 background: linear-gradient(108deg, #ebe1ff 0%, #faf5ff 60%);
19539 }
19540 .wpfnl-vertical-flow-view .vf-conditional__icon {
19541 width: 32px;
19542 height: 32px;
19543 border-radius: 8px;
19544 background: #ede2fc;
19545 display: flex;
19546 align-items: center;
19547 justify-content: center;
19548 flex-shrink: 0;
19549 }
19550 .wpfnl-vertical-flow-view .vf-conditional__title {
19551 font-size: 13px;
19552 font-weight: 600;
19553 color: #6e42d3;
19554 }
19555 .wpfnl-vertical-flow-view .vf-conditional__hint {
19556 font-size: 11px;
19557 color: #98a2b3;
19558 margin-left: auto;
19559 }
19560 .wpfnl-vertical-flow-view .vf-branch__add-btn {
19561 display: flex;
19562 align-items: center;
19563 justify-content: center;
19564 gap: 5px;
19565 width: 300px;
19566 flex-shrink: 0;
19567 padding: 10px 12px;
19568 background: #fff;
19569 border: 1.5px dashed #d0d5dd;
19570 border-radius: 10px;
19571 font-size: 12px;
19572 font-weight: 500;
19573 color: #98a2b3;
19574 cursor: pointer;
19575 transition: all 0.18s ease;
19576 }
19577 .wpfnl-vertical-flow-view .vf-branch__add-btn svg {
19578 flex-shrink: 0;
19579 }
19580 .wpfnl-vertical-flow-view .vf-branch__add-btn:hover {
19581 border-color: #6e42d3;
19582 color: #6e42d3;
19583 background: #faf5ff;
19584 }
19585 .wpfnl-vertical-flow-view .vf-branch__add-btn--paste {
19586 background: #faf5ff;
19587 border-color: #6e42d3;
19588 border-style: solid;
19589 color: #6e42d3;
19590 font-weight: 600;
19591 }
19592 .wpfnl-vertical-flow-view .vf-branch__add-btn--paste:hover {
19593 background: #ede9fe;
19594 border-color: #5b35b5;
19595 color: #5b35b5;
19596 }
19597 .wpfnl-vertical-flow-view .vf-funnel-end {
19598 display: flex;
19599 align-items: center;
19600 gap: 6px;
19601 padding: 6px 16px;
19602 background: #f1f1f1;
19603 border: 1px solid #e5e6e7;
19604 border-radius: 20px;
19605 font-size: 12px;
19606 font-weight: 500;
19607 color: #7A8B9A;
19608 white-space: nowrap;
19609 pointer-events: none;
19610 user-select: none;
19611 flex-shrink: 0;
19612 }
19613 .wpfnl-vertical-flow-view .vf-funnel-end svg {
19614 flex-shrink: 0;
19615 width: 13px;
19616 height: 13px;
19617 }
19618
19619 .wpfnl-step-settings-drawer {
19620 position: fixed;
19621 top: 32px;
19622 right: -190px;
19623 background-color: #fff;
19624 z-index: 99;
19625 width: 1300px;
19626 height: calc(100vh - 32px);
19627 box-shadow: -1px 3px 13px rgba(150, 141, 169, 0.1);
19628 opacity: 0;
19629 visibility: hidden;
19630 }
19631 .wpfnl-step-settings-drawer .drawer-bg-overlay {
19632 position: fixed;
19633 right: 0;
19634 top: 0;
19635 background: rgba(21, 17, 29, 0.3019607843);
19636 backdrop-filter: blur(4px);
19637 width: 100%;
19638 height: 100%;
19639 z-index: -1;
19640 }
19641 .wpfnl-step-settings-drawer .show-overlay .drawer-bg-overlay {
19642 z-index: 2;
19643 }
19644 .wpfnl-step-settings-drawer.show-drawer {
19645 z-index: 99;
19646 right: 0;
19647 opacity: 1;
19648 visibility: visible;
19649 }
19650 .wpfnl-step-settings-drawer .drawer-full-loader {
19651 position: absolute;
19652 top: 0;
19653 left: 0;
19654 width: 100%;
19655 height: 100%;
19656 background: #fff;
19657 border-radius: 10px 0 0 10px;
19658 z-index: 2;
19659 display: flex;
19660 flex-direction: column;
19661 }
19662 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-header {
19663 display: flex;
19664 align-items: center;
19665 justify-content: space-between;
19666 padding: 20px 30px;
19667 flex-shrink: 0;
19668 border-bottom: 1px solid #EEF0F3;
19669 }
19670 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-title {
19671 height: 24px;
19672 width: 180px;
19673 border-radius: 6px;
19674 }
19675 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-close {
19676 height: 38px;
19677 width: 38px;
19678 border-radius: 10px;
19679 }
19680 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-body {
19681 padding: 20px 30px;
19682 flex: 1;
19683 overflow: hidden;
19684 }
19685 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-section {
19686 border: 1px solid #EEF0F3;
19687 border-radius: 10px;
19688 padding: 16px 20px;
19689 margin-bottom: 16px;
19690 }
19691 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-section-title {
19692 height: 18px;
19693 width: 40%;
19694 border-radius: 6px;
19695 margin-bottom: 16px;
19696 }
19697 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-fields {
19698 display: flex;
19699 gap: 16px;
19700 }
19701 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-field {
19702 height: 36px;
19703 flex: 1;
19704 border-radius: 6px;
19705 }
19706 .wpfnl-step-settings-drawer .drawer-switcher-loader {
19707 position: absolute;
19708 top: 0;
19709 left: 0;
19710 width: 100%;
19711 height: 100%;
19712 background: transparent;
19713 border-radius: 10px 0 0 10px;
19714 z-index: 2;
19715 display: none;
19716 }
19717 .wpfnl-step-settings-drawer .drawer-wrapper {
19718 height: 100%;
19719 width: 100%;
19720 background: #fff;
19721 }
19722 .wpfnl-step-settings-drawer .drawer-header {
19723 display: flex;
19724 flex-flow: row wrap;
19725 align-items: center;
19726 justify-content: space-between;
19727 padding: 20px 30px 4px;
19728 position: relative;
19729 }
19730 .wpfnl-step-settings-drawer .drawer-header .drawer-title {
19731 display: flex;
19732 align-items: center;
19733 }
19734 .wpfnl-step-settings-drawer .drawer-header .drawer-title > p {
19735 font-weight: 600;
19736 font-size: 18px;
19737 line-height: 1.27;
19738 color: #363B4E;
19739 text-transform: capitalize;
19740 margin: 0;
19741 display: inline-block;
19742 }
19743 .wpfnl-step-settings-drawer .drawer-header .drawer-title span {
19744 padding-left: 4px;
19745 }
19746 .wpfnl-step-settings-drawer .drawer-header .wpfnl-drawer-close {
19747 padding: 3px 7px;
19748 height: 38px;
19749 width: 38px;
19750 cursor: pointer;
19751 position: relative;
19752 top: 0;
19753 border-radius: 10px;
19754 border: 1px solid #EBEDF0;
19755 display: flex;
19756 align-items: center;
19757 justify-content: center;
19758 }
19759 .wpfnl-step-settings-drawer .drawer-body {
19760 padding: 0 30px;
19761 height: calc(100% - 70px);
19762 overflow: auto;
19763 position: relative;
19764 }
19765 .wpfnl-step-settings-drawer .drawer-body::-webkit-scrollbar {
19766 width: 5px;
19767 height: 5px;
19768 }
19769 .wpfnl-step-settings-drawer .drawer-body::-webkit-scrollbar-track {
19770 background: #f2f5f8;
19771 }
19772 .wpfnl-step-settings-drawer .drawer-body::-webkit-scrollbar-thumb {
19773 background-color: #CBCBCB;
19774 border-radius: 20px;
19775 }
19776 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion {
19777 border: 1px solid #EEF0F3;
19778 border-radius: 10px;
19779 margin-top: 20px;
19780 }
19781 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header {
19782 display: flex;
19783 align-items: center;
19784 justify-content: space-between;
19785 gap: 10px;
19786 padding: 12px 20px;
19787 cursor: pointer;
19788 }
19789 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header h2 {
19790 font-size: 16px;
19791 font-weight: 600;
19792 color: #363B4E;
19793 }
19794 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header .accordion-icon {
19795 position: relative;
19796 top: 5px;
19797 }
19798 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header .accordion-open {
19799 transform: rotate(180deg);
19800 top: -5px;
19801 }
19802 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content {
19803 padding: 20px;
19804 border-top: 1px solid rgb(238, 240, 243);
19805 }
19806 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .steps-url-slug.inline-url-slug {
19807 border: none;
19808 }
19809 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .steps-url-slug-wrapper {
19810 justify-content: space-between;
19811 width: 100%;
19812 border: none;
19813 padding-bottom: 18px;
19814 }
19815 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .custom-script-wrapper .field-group.step-name label {
19816 margin-bottom: 6px;
19817 display: inline-block;
19818 }
19819 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .custom-script-wrapper .field-group.step-name label .wpfnl-tooltip {
19820 top: 2px;
19821 }
19822 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .field-group.url-slug-save-btn {
19823 display: flex;
19824 justify-content: flex-end;
19825 margin-top: 20px;
19826 }
19827 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .field-group.url-slug-save-btn button {
19828 height: 40px;
19829 line-height: 39px;
19830 padding: 0 20px;
19831 }
19832 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body {
19833 padding: 30px 0;
19834 }
19835 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body input[type=file] {
19836 display: none;
19837 }
19838 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body label {
19839 width: 350px;
19840 height: 380px;
19841 border: 2px dashed #ddd;
19842 border-radius: 10px;
19843 display: flex;
19844 flex-flow: column;
19845 align-items: center;
19846 justify-content: center;
19847 text-align: center;
19848 }
19849 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body label svg {
19850 display: block;
19851 margin: 0 auto;
19852 }
19853 .wpfnl-step-settings-drawer .step-featured-image .featured-image-footer {
19854 border-top: 1px solid #E2E5ED;
19855 padding: 20px 0 20px;
19856 margin-top: 10px;
19857 display: flex;
19858 flex-flow: row wrap;
19859 align-items: center;
19860 position: relative;
19861 }
19862 .wpfnl-step-settings-drawer.edit-field-drawer {
19863 right: -100px;
19864 width: 300px;
19865 }
19866 .wpfnl-step-settings-drawer.edit-field-drawer.show-edit-field-drawer {
19867 right: 0;
19868 opacity: 1;
19869 visibility: visible;
19870 z-index: 99;
19871 }
19872 .wpfnl-step-settings-drawer.edit-field-drawer .drawer-header {
19873 padding: 26px 16px 20px 20px;
19874 }
19875 .wpfnl-step-settings-drawer.create-condition-drawer .drawer-header {
19876 padding: 20px 30px 20px;
19877 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
19878 }
19879 .wpfnl-step-settings-drawer .wpfnl-modal-overlay {
19880 position: fixed;
19881 top: 0;
19882 left: 0;
19883 width: 100%;
19884 height: 100%;
19885 background-color: rgba(0, 0, 0, 0.3);
19886 justify-content: center;
19887 align-items: center;
19888 display: flex;
19889 z-index: 999999;
19890 }
19891 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper {
19892 width: 80%;
19893 background: #FFF;
19894 padding: 25px;
19895 height: 80%;
19896 border-radius: 10px;
19897 position: relative;
19898 }
19899 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper .wpfnl-modal-close .wpfnl-modal-close-btn {
19900 position: absolute;
19901 right: -14px;
19902 top: -14px;
19903 background: #ffffff;
19904 box-shadow: 0px 1px 1px #dadada;
19905 border-radius: 100px;
19906 width: 34px;
19907 height: 34px;
19908 display: flex;
19909 align-items: center;
19910 justify-content: center;
19911 cursor: pointer;
19912 z-index: 2;
19913 }
19914 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper #wpfnl-create-product {
19915 width: 100%;
19916 height: 100%;
19917 }
19918 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper #wpfnl-create-product iframe {
19919 height: 100%;
19920 }
19921 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper .wpfnl-loader {
19922 border: 2px solid #8265c5;
19923 border-radius: 50%;
19924 border-top: 2px solid #fff;
19925 width: 50px;
19926 height: 50px;
19927 animation: spin 0.7s linear infinite;
19928 display: block;
19929 margin-left: 4px;
19930 position: absolute;
19931 left: 50%;
19932 top: 50%;
19933 transform: translate(-50%, -50%);
19934 z-index: 2;
19935 background: #fff;
19936 }
19937 @-webkit-keyframes spin {
19938 0% {
19939 -webkit-transform: rotate(0deg);
19940 }
19941 100% {
19942 -webkit-transform: rotate(360deg);
19943 }
19944 }
19945 @keyframes spin {
19946 0% {
19947 transform: rotate(0deg);
19948 }
19949 100% {
19950 transform: rotate(360deg);
19951 }
19952 }
19953
19954 @media only screen and (max-width: 1599px) {
19955 .wpfnl-step-settings-drawer {
19956 width: 1183px;
19957 }
19958 }
19959 @media only screen and (max-width: 1400px) {
19960 .wpfnl-step-settings-drawer {
19961 width: 1085px;
19962 }
19963 }
19964 @media only screen and (max-width: 1199px) {
19965 .wpfnl-step-settings-drawer {
19966 width: 803px;
19967 }
19968 }
19969 @media only screen and (max-width: 991px) {
19970 .wpfnl-step-settings-drawer {
19971 width: 740px;
19972 }
19973 .create-condition-drawer .single-condition .single-condition-filed input[type=text],
19974 .create-condition-drawer .single-condition .single-condition-filed input[type=number],
19975 .create-condition-drawer .single-condition .single-condition-filed input[type=email],
19976 .create-condition-drawer .single-condition .single-condition-filed select {
19977 width: 170px;
19978 min-width: auto;
19979 }
19980 }
19981 .wpfnl-step-settings-drawer .steps-url-slug {
19982 padding-top: 10px;
19983 }
19984 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper {
19985 background: #FFFFFF;
19986 border-bottom: 1px solid #EEF0F3;
19987 padding-bottom: 30px;
19988 }
19989 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group {
19990 margin-bottom: 17px;
19991 }
19992 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group:last-child {
19993 margin-bottom: 0;
19994 }
19995 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group > label {
19996 margin-bottom: 6px;
19997 display: block;
19998 }
19999 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group input[type=text] {
20000 border-color: #EEF0F3;
20001 color: #7A8B9A;
20002 box-shadow: none;
20003 }
20004 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input {
20005 display: flex;
20006 align-items: center;
20007 border: 1px solid #EEF0F3;
20008 border-radius: 6px;
20009 }
20010 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url {
20011 width: 40px;
20012 height: 34px;
20013 display: flex;
20014 align-items: center;
20015 justify-content: center;
20016 cursor: pointer;
20017 border: none;
20018 border-left: 1px solid #EEF0F3;
20019 box-shadow: none;
20020 outline: none;
20021 position: relative;
20022 background: transparent;
20023 }
20024 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url .copyed {
20025 background-color: #464646;
20026 position: absolute;
20027 right: 0;
20028 top: -18px;
20029 font-size: 11px;
20030 font-style: normal;
20031 color: #fff;
20032 line-height: 1;
20033 padding: 4px;
20034 border-radius: 3px;
20035 transition: all 0.3s ease;
20036 opacity: 0;
20037 visibility: hidden;
20038 }
20039 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url .copyed:before {
20040 content: "";
20041 position: absolute;
20042 left: 50%;
20043 bottom: -4px;
20044 width: 6px;
20045 height: 6px;
20046 background: #464646;
20047 transform: rotate(45deg) translateX(-50%);
20048 }
20049 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url.copy-confirmed .copyed {
20050 top: -25px;
20051 opacity: 1;
20052 visibility: visible;
20053 }
20054 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug input[type=text] {
20055 border: 0;
20056 height: 34px;
20057 }
20058 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug input[type=text]:disabled {
20059 cursor: not-allowed;
20060 }
20061 .wpfnl-step-settings-drawer .url-slug-save-btn {
20062 display: flex;
20063 justify-content: flex-end;
20064 gap: 14px;
20065 margin-top: 30px;
20066 }
20067 .wpfnl-step-settings-drawer .url-slug-save-btn .btn-default {
20068 height: 40px;
20069 line-height: 39px;
20070 padding: 0 20px;
20071 }
20072 .wpfnl-step-settings-drawer .url-slug-save-btn .btn-default.cancel {
20073 border: 1px solid #E4E6EB;
20074 background: transparent;
20075 min-width: auto;
20076 color: #3C3F47;
20077 }
20078 .wpfnl-step-settings-drawer .url-slug-save-btn .btn-default .wpfnl-loader {
20079 display: inline-block;
20080 position: relative;
20081 top: 3px;
20082 }
20083 .wpfnl-step-settings-drawer .inline-url-slug {
20084 display: flex;
20085 flex-flow: row wrap;
20086 align-items: flex-start;
20087 gap: 20px;
20088 padding-bottom: 24px;
20089 }
20090 .wpfnl-step-settings-drawer .inline-url-slug .steps-url-slug-wrapper {
20091 background: transparent;
20092 border: none;
20093 border-radius: 0;
20094 padding: 0;
20095 display: flex;
20096 gap: 20px;
20097 width: calc(100% - 150px);
20098 }
20099 .wpfnl-step-settings-drawer .inline-url-slug .steps-url-slug-wrapper .field-group {
20100 margin-bottom: 0;
20101 flex: 1;
20102 }
20103 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn {
20104 display: block;
20105 margin-top: 0;
20106 position: relative;
20107 top: 20px;
20108 }
20109 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn .btn-default {
20110 padding: 0 15px;
20111 width: 130px;
20112 height: 36px;
20113 line-height: 35px;
20114 }
20115 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn .btn-default.cancel {
20116 display: none;
20117 }
20118 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn .btn-default .wpfnl-loader {
20119 display: inline-block;
20120 position: relative;
20121 top: 3px;
20122 }
20123 .wpfnl-step-settings-drawer .general-settings-content {
20124 padding: 0;
20125 }
20126 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-box {
20127 background: #FFFFFF;
20128 border-radius: 10px;
20129 border: 1px solid #EEF0F3;
20130 padding: 24px;
20131 box-shadow: none;
20132 margin-bottom: 6px;
20133 }
20134 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper {
20135 margin-bottom: 20px;
20136 }
20137 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper:last-child {
20138 margin-bottom: 0;
20139 }
20140 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper > label {
20141 display: block;
20142 margin-bottom: 0;
20143 font-size: 16px;
20144 font-weight: 500;
20145 color: #363B4E;
20146 line-height: 1.4;
20147 }
20148 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper.custom-script-field {
20149 align-items: flex-start;
20150 }
20151 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields {
20152 position: relative;
20153 max-width: 100%;
20154 }
20155 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea,
20156 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields input[type=text] {
20157 width: 100%;
20158 height: 44px;
20159 padding: 8px 16px;
20160 font-size: 15px;
20161 color: #23282D;
20162 background: #FFFFFF;
20163 transition: all 0.3s ease;
20164 border-radius: 10px;
20165 border: 1px solid #EBEDF0;
20166 outline: none;
20167 }
20168 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea:focus,
20169 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields input[type=text]:focus {
20170 border-color: #6E42D3;
20171 }
20172 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea::placeholder,
20173 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields input[type=text]::placeholder {
20174 color: #7A8B9A;
20175 }
20176 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea {
20177 line-height: 1.5;
20178 resize: vertical;
20179 min-height: 100px;
20180 height: auto;
20181 }
20182 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper {
20183 display: flex;
20184 align-items: center;
20185 border: 1px solid #EBEDF0;
20186 border-radius: 10px;
20187 transition: all 0.3s ease;
20188 }
20189 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper:focus-within {
20190 border-color: #6E42D3;
20191 box-shadow: none;
20192 }
20193 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper input[type=text] {
20194 flex: 1;
20195 border: none;
20196 box-shadow: none !important;
20197 }
20198 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper input[type=text]:focus {
20199 box-shadow: none !important;
20200 }
20201 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url {
20202 width: 44px;
20203 height: 44px;
20204 display: flex;
20205 align-items: center;
20206 justify-content: center;
20207 cursor: pointer;
20208 border: none;
20209 border-left: 1px solid #EBEDF0;
20210 background: #FFFFFF;
20211 outline: none;
20212 position: relative;
20213 flex-shrink: 0;
20214 border-radius: 0 10px 10px 0;
20215 }
20216 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url .copyed {
20217 background-color: #464646;
20218 position: absolute;
20219 right: 0;
20220 top: -32px;
20221 font-size: 11px;
20222 font-weight: 500;
20223 color: #fff;
20224 line-height: 1;
20225 padding: 6px 8px;
20226 border-radius: 4px;
20227 transition: all 0.3s ease;
20228 opacity: 0;
20229 visibility: hidden;
20230 white-space: nowrap;
20231 }
20232 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url .copyed:before {
20233 content: "";
20234 position: absolute;
20235 left: 50%;
20236 bottom: -4px;
20237 width: 6px;
20238 height: 6px;
20239 background: #464646;
20240 transform: rotate(45deg) translateX(-50%);
20241 }
20242 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url.copy-confirmed .copyed {
20243 opacity: 1;
20244 visibility: visible;
20245 }
20246 .wpfnl-step-settings-drawer .general-settings-content .field-description {
20247 margin: 8px 0 0;
20248 font-size: 12px;
20249 color: #7A8B9A;
20250 line-height: 1.5;
20251 }
20252 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer {
20253 padding-top: 20px;
20254 display: flex;
20255 justify-content: flex-end;
20256 }
20257 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update {
20258 min-width: 120px;
20259 height: 40px;
20260 padding: 0 24px;
20261 background: #6E42D3;
20262 color: #fff;
20263 border: none;
20264 border-radius: 6px;
20265 font-size: 14px;
20266 font-weight: 500;
20267 cursor: pointer;
20268 transition: background-color 0.2s ease;
20269 display: inline-flex;
20270 align-items: center;
20271 justify-content: center;
20272 gap: 8px;
20273 }
20274 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update:hover {
20275 background: rgb(89.208583691, 44.6042918455, 191.5957081545);
20276 }
20277 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update:active {
20278 background: rgb(81.5038626609, 40.7519313305, 175.0480686695);
20279 }
20280 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update .wpfnl-loader {
20281 display: inline-block;
20282 width: 14px;
20283 height: 14px;
20284 }
20285
20286 .step-condition-drawer {
20287 width: 700px;
20288 }
20289 .step-condition-drawer.show-drawer {
20290 z-index: 2;
20291 }
20292 .step-condition-drawer .drawer-header {
20293 padding: 16px 30px 16px;
20294 border-bottom: 1px solid #EEF0F3;
20295 }
20296 .step-condition-drawer .drawer-body {
20297 padding: 24px 30px;
20298 }
20299 .step-condition-drawer .enable-disable-switcher {
20300 display: flex;
20301 align-items: center;
20302 gap: 10px;
20303 margin-bottom: 24px;
20304 }
20305 .step-condition-drawer .enable-disable-switcher .switcher-label {
20306 color: #363B4E;
20307 font-size: 14px;
20308 font-weight: 600;
20309 line-height: 1;
20310 }
20311 .step-condition-drawer .enable-disable-switcher .wpfnl-switcher label {
20312 width: 28px;
20313 }
20314 .step-condition-drawer .enable-disable-switcher .wpfnl-switcher input[type=checkbox]:checked + label:after {
20315 margin-left: 12px;
20316 }
20317 .step-condition-drawer .enable-disable-switcher .wpfnl-loader {
20318 display: block;
20319 margin: 0;
20320 }
20321 .step-condition-drawer .no-condition-stat {
20322 border-radius: 10px;
20323 border: 1px solid #EEF0F3;
20324 height: 360px;
20325 padding: 20px;
20326 display: flex;
20327 flex-flow: column;
20328 align-items: center;
20329 justify-content: center;
20330 gap: 9px;
20331 }
20332 .step-condition-drawer .wpfnl-field-wrapper {
20333 gap: 28px;
20334 }
20335 .step-condition-drawer .wpfnl-field-wrapper > label {
20336 width: 122px;
20337 padding-right: 0;
20338 }
20339 .step-condition-drawer .true-condition-wapper {
20340 border-radius: 10px;
20341 border: 1px solid #EEF0F3;
20342 background: #F6F5FA;
20343 padding: 20px;
20344 position: relative;
20345 }
20346 .step-condition-drawer .true-condition-wapper .true-lable {
20347 color: #00D44E;
20348 font-size: 15px;
20349 font-weight: 600;
20350 line-height: 1;
20351 margin-bottom: 12px;
20352 display: block;
20353 }
20354 .step-condition-drawer .true-condition-wapper .and-condition-group {
20355 border-radius: 10px;
20356 background: #FFF;
20357 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
20358 padding: 20px;
20359 margin-bottom: 36px;
20360 position: relative;
20361 }
20362 .step-condition-drawer .true-condition-wapper .and-condition-group:before {
20363 content: "OR";
20364 position: absolute;
20365 top: -23px;
20366 left: 0;
20367 color: #7A8B9A;
20368 font-size: 14px;
20369 font-weight: 400;
20370 line-height: 1;
20371 }
20372 .step-condition-drawer .true-condition-wapper .and-condition-group:nth-child(2)::before {
20373 display: none;
20374 }
20375 .step-condition-drawer .true-condition-wapper .and-condition-group:last-child {
20376 margin-bottom: 16px;
20377 }
20378 .step-condition-drawer .true-condition-wapper .condition-single-row {
20379 display: flex;
20380 flex-flow: row wrap;
20381 align-items: center;
20382 gap: 10px;
20383 position: relative;
20384 padding: 10px 0;
20385 }
20386 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child {
20387 padding-top: 0;
20388 }
20389 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child .condition-connection {
20390 display: none;
20391 }
20392 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child {
20393 padding-top: 0;
20394 }
20395 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child .condition-connection {
20396 display: none;
20397 }
20398 .step-condition-drawer .true-condition-wapper .condition-single-row .single-condition {
20399 width: calc(33.3333333333% - 33px);
20400 }
20401 .step-condition-drawer .true-condition-wapper .condition-single-row .input-field {
20402 color: #363B4E;
20403 padding: 11px 14px 10px;
20404 max-width: 240px;
20405 min-width: auto;
20406 height: auto;
20407 width: 100%;
20408 border-radius: 6px;
20409 border: 1px solid #EEF0F3;
20410 background: #FFF;
20411 line-height: 1;
20412 }
20413 .step-condition-drawer .true-condition-wapper .condition-single-row .delete-condition {
20414 border: 1px solid #EEF0F3;
20415 width: 40px;
20416 height: 40px;
20417 display: flex;
20418 align-items: center;
20419 justify-content: center;
20420 border-radius: 7px;
20421 cursor: pointer;
20422 background: transparent;
20423 }
20424 .step-condition-drawer .true-condition-wapper .condition-single-row .condition-connection {
20425 width: 30px;
20426 height: calc(100% + 1px);
20427 border: 1px solid #EEF0F3;
20428 border-left: none;
20429 display: block;
20430 position: absolute;
20431 bottom: 50%;
20432 right: 0;
20433 }
20434 .step-condition-drawer .true-condition-wapper .condition-single-row .condition-connection:before {
20435 content: "&";
20436 border: 1px solid #EEF0F3;
20437 width: 22px;
20438 height: 22px;
20439 position: absolute;
20440 top: 50%;
20441 right: -11px;
20442 transform: translateY(-50%);
20443 background: #fff;
20444 border-radius: 100%;
20445 display: flex;
20446 flex-flow: column;
20447 align-items: center;
20448 justify-content: center;
20449 font-weight: 500;
20450 color: #6E42D3;
20451 }
20452 .step-condition-drawer .true-condition-wapper .condition-single-row.only-one .single-condition {
20453 width: calc(33.3333333333% - 7px);
20454 }
20455 .step-condition-drawer .true-condition-wapper .condition-single-row.only-one .delete-condition {
20456 display: none;
20457 }
20458 .step-condition-drawer .true-condition-wapper .add-and-condition {
20459 border: none;
20460 display: flex;
20461 align-items: center;
20462 color: #6E42D3;
20463 font-size: 14px;
20464 font-weight: 600;
20465 line-height: 1;
20466 gap: 3px;
20467 background: transparent;
20468 cursor: pointer;
20469 margin-top: 10px;
20470 }
20471 .step-condition-drawer .true-condition-wapper .or-condition-box {
20472 border-radius: 10px;
20473 border: 1px dashed #C1C6CD;
20474 padding: 15px 16px;
20475 }
20476 .step-condition-drawer .true-condition-wapper .or-condition-box button {
20477 border-radius: 100px;
20478 border: 1px solid #6E42D3;
20479 background: #FFF;
20480 box-shadow: 0px 20px 16px 0px rgba(189, 193, 200, 0.2);
20481 padding: 8px 16px 6px;
20482 display: flex;
20483 align-items: center;
20484 gap: 3px;
20485 margin: 0 auto;
20486 color: #6E42D3;
20487 font-size: 14px;
20488 font-weight: 600;
20489 line-height: 1;
20490 cursor: pointer;
20491 }
20492 .step-condition-drawer .true-condition-wapper .or-condition-box button svg {
20493 position: relative;
20494 top: -1px;
20495 }
20496 .step-condition-drawer .true-condition-wapper .next-step-box {
20497 padding-top: 20px;
20498 margin-top: 20px;
20499 position: relative;
20500 }
20501 .step-condition-drawer .true-condition-wapper .next-step-box:before {
20502 content: "";
20503 position: absolute;
20504 top: 0;
20505 left: -20px;
20506 width: calc(100% + 40px);
20507 height: 1px;
20508 background: #E8E6F1;
20509 }
20510 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox {
20511 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
20512 border: none;
20513 }
20514 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox .selected-option {
20515 padding: 14px 30px 12px 14px;
20516 }
20517 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button {
20518 border: none;
20519 background: transparent;
20520 color: #6E42D3;
20521 font-size: 14px;
20522 font-weight: 400;
20523 line-height: 1;
20524 letter-spacing: -0.14px;
20525 box-shadow: none;
20526 outline: none;
20527 cursor: pointer;
20528 }
20529 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button svg {
20530 margin-left: 1px;
20531 }
20532 .step-condition-drawer .add-step-dropdown {
20533 width: 100%;
20534 padding: 8px;
20535 position: absolute;
20536 left: 0;
20537 top: calc(100% + 8px);
20538 z-index: 1;
20539 border-radius: 6px;
20540 border: 1px solid #EBEDF0;
20541 background: #FFF;
20542 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
20543 height: 128px;
20544 opacity: 0;
20545 visibility: hidden;
20546 transition: all 0.3s ease;
20547 display: flex;
20548 flex-flow: column;
20549 align-items: center;
20550 justify-content: center;
20551 gap: 8px;
20552 }
20553 .step-condition-drawer .add-step-dropdown p {
20554 letter-spacing: -0.14px;
20555 }
20556 .step-condition-drawer .add-step-dropdown .btn-default {
20557 padding: 11px 22px 10px;
20558 height: auto;
20559 line-height: 1;
20560 min-width: auto;
20561 border-radius: 8px;
20562 font-size: 12px;
20563 }
20564 .step-condition-drawer .wpfnl-selectbox.show-options .add-step-dropdown {
20565 opacity: 1;
20566 visibility: visible;
20567 }
20568 .step-condition-drawer .false-condition-wapper {
20569 border-radius: 10px;
20570 border: 1px solid #EEF0F3;
20571 background: #F6F5FA;
20572 margin-top: 20px;
20573 position: relative;
20574 }
20575 .step-condition-drawer .false-condition-wapper .false-lable {
20576 color: #FF5155;
20577 font-size: 15px;
20578 font-weight: 600;
20579 line-height: 1;
20580 padding: 14px 20px;
20581 }
20582 .step-condition-drawer .false-condition-wapper .next-step-box {
20583 padding: 20px;
20584 position: relative;
20585 border-top: 1px solid #E8E6F1;
20586 }
20587 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox {
20588 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
20589 border: none;
20590 }
20591 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .selected-option {
20592 padding: 14px 30px 12px 14px;
20593 }
20594 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button {
20595 border: none;
20596 background: transparent;
20597 color: #6E42D3;
20598 font-size: 14px;
20599 font-weight: 400;
20600 line-height: 1;
20601 letter-spacing: -0.14px;
20602 box-shadow: none;
20603 outline: none;
20604 cursor: pointer;
20605 }
20606 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button svg {
20607 margin-left: 1px;
20608 }
20609 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .selectable-options {
20610 bottom: calc(100% + 8px);
20611 top: inherit;
20612 box-shadow: 0px 10px 22px 0px rgba(73, 59, 104, 0.1);
20613 }
20614 .step-condition-drawer .save-btn-area {
20615 margin-top: 30px;
20616 display: flex;
20617 flex-flow: row wrap;
20618 align-items: center;
20619 justify-content: flex-end;
20620 gap: 14px;
20621 }
20622 .step-condition-drawer .save-btn-area .wpfnl-alert {
20623 display: block;
20624 }
20625 .step-condition-drawer .save-btn-area .btn-default {
20626 min-width: auto;
20627 line-height: 1;
20628 padding: 10px 19px 9px;
20629 height: 40px;
20630 border: 1px solid #6E42D3;
20631 }
20632 .step-condition-drawer .save-btn-area .btn-default.cancel {
20633 background-color: transparent;
20634 border-color: #E4E6EB;
20635 color: #3C3F47;
20636 letter-spacing: -0.14px;
20637 font-weight: 600;
20638 }
20639 .step-condition-drawer .save-btn-area .btn-default .wpfnl-loader {
20640 display: inline-block;
20641 position: relative;
20642 top: 2px;
20643 }
20644 .step-condition-drawer .condition-disabled .false-condition-wapper,
20645 .step-condition-drawer .condition-disabled .true-condition-wapper {
20646 opacity: 0.3;
20647 }
20648 .step-condition-drawer .condition-disabled .false-condition-wapper:before,
20649 .step-condition-drawer .condition-disabled .true-condition-wapper:before {
20650 content: "";
20651 position: absolute;
20652 left: 0;
20653 top: 0;
20654 width: 100%;
20655 height: 100%;
20656 z-index: 2;
20657 border-radius: 10px;
20658 cursor: not-allowed;
20659 }
20660
20661 .reconfigure-condition-modal .close-alert {
20662 width: 38px;
20663 height: 38px;
20664 box-shadow: 0px 2px 2px #DADADA;
20665 }
20666 .reconfigure-condition-modal .close-alert svg {
20667 width: 13px;
20668 height: 13px;
20669 }
20670 .reconfigure-condition-modal .close-alert svg path {
20671 stroke-width: 2px;
20672 }
20673 .reconfigure-condition-modal .wpfnl-delete-confirm-body {
20674 padding: 28px 26px 30px;
20675 }
20676 .reconfigure-condition-modal .wpfnl-delete-confirm-body h3 svg path {
20677 fill: none;
20678 }
20679 .reconfigure-condition-modal .wpfnl-delete-confirm-body p {
20680 color: #9398A5;
20681 margin-top: 7px;
20682 max-width: 350px;
20683 }
20684 .reconfigure-condition-modal .wpfnl-delete-confirm-btn {
20685 padding: 20px 24px;
20686 }
20687 .reconfigure-condition-modal .wpfnl-delete-confirm-btn .btn-default {
20688 padding: 0 16px;
20689 }
20690 .reconfigure-condition-modal .wpfnl-delete-confirm-btn .btn-default.cancel:hover {
20691 background-color: transparent;
20692 }
20693 .reconfigure-condition-modal .wpfnl-delete-confirm-btn .btn-default.yes {
20694 box-shadow: 0px 10px 16px 0px rgba(189, 193, 200, 0.5);
20695 }
20696
20697 .create-condition-drawer .condition-form-loader {
20698 position: absolute;
20699 left: 0;
20700 top: 2px;
20701 background: white;
20702 width: 100%;
20703 height: calc(100% - 2px);
20704 z-index: 2;
20705 text-align: center;
20706 padding-top: 110px;
20707 font-size: 18px;
20708 color: #363B4E;
20709 font-weight: 500;
20710 }
20711 .create-condition-drawer .condition-form-loader.drawer-loaded {
20712 display: none;
20713 }
20714
20715 .condition-form-wrapper {
20716 padding: 30px 0;
20717 }
20718 .condition-form-wrapper .single-condition {
20719 display: flex;
20720 flex-flow: row wrap;
20721 align-items: center;
20722 justify-content: flex-start;
20723 padding-top: 55px;
20724 width: 100%;
20725 max-width: 726px;
20726 position: relative;
20727 }
20728 .condition-form-wrapper .single-condition:before {
20729 content: "";
20730 position: absolute;
20731 right: 16px;
20732 bottom: 17px;
20733 width: 2px;
20734 height: 100%;
20735 background: #E5E8F3;
20736 z-index: 0;
20737 }
20738 .condition-form-wrapper .single-condition:first-child:before {
20739 display: none;
20740 }
20741 .condition-form-wrapper .single-condition .condition-number {
20742 align-self: flex-end;
20743 margin-bottom: 6px;
20744 color: #363B4E;
20745 font-weight: 500;
20746 font-size: 16px;
20747 }
20748 .condition-form-wrapper .single-condition .single-condition-filed {
20749 margin-left: 20px;
20750 }
20751 .condition-form-wrapper .single-condition .single-condition-filed label {
20752 font-size: 14px;
20753 line-height: 16px;
20754 color: #363B4E;
20755 text-transform: capitalize;
20756 margin-bottom: 10px;
20757 display: block;
20758 }
20759 .condition-form-wrapper .single-condition .single-condition-filed input[type=text],
20760 .condition-form-wrapper .single-condition .single-condition-filed input[type=number],
20761 .condition-form-wrapper .single-condition .single-condition-filed input[type=email],
20762 .condition-form-wrapper .single-condition .single-condition-filed select {
20763 height: 40px;
20764 width: 190px;
20765 min-width: auto;
20766 transition: all 0.3s ease;
20767 }
20768 .condition-form-wrapper .single-condition .single-condition-filed input[type=text] option[disabled],
20769 .condition-form-wrapper .single-condition .single-condition-filed input[type=number] option[disabled],
20770 .condition-form-wrapper .single-condition .single-condition-filed input[type=email] option[disabled],
20771 .condition-form-wrapper .single-condition .single-condition-filed select option[disabled] {
20772 color: rgba(122, 139, 154, 0.631372549);
20773 }
20774 .condition-form-wrapper .single-condition .single-condition-filed input[type=text]:focus,
20775 .condition-form-wrapper .single-condition .single-condition-filed input[type=number]:focus,
20776 .condition-form-wrapper .single-condition .single-condition-filed input[type=email]:focus,
20777 .condition-form-wrapper .single-condition .single-condition-filed select:focus {
20778 border-color: #6E42D3;
20779 }
20780 .condition-form-wrapper .single-condition .single-condition-filed select {
20781 padding-right: 27px;
20782 }
20783 .condition-form-wrapper .single-condition .condition-repeater {
20784 align-self: flex-end;
20785 margin-bottom: 0px;
20786 margin-left: 20px;
20787 position: relative;
20788 width: 70px;
20789 }
20790 .condition-form-wrapper .single-condition .condition-repeater span {
20791 position: relative;
20792 background: #fff;
20793 cursor: pointer;
20794 cursor: pointer;
20795 width: 24px;
20796 height: 24px;
20797 display: inline-block;
20798 }
20799 .condition-form-wrapper .single-condition .condition-repeater span svg {
20800 display: block;
20801 position: relative;
20802 z-index: 1;
20803 }
20804 .condition-form-wrapper .single-condition .condition-repeater .add-condition:before {
20805 content: "";
20806 position: absolute;
20807 left: 22px;
20808 top: 11px;
20809 background: #E5E8F3;
20810 width: 38px;
20811 height: 2px;
20812 z-index: 0;
20813 }
20814 .condition-form-wrapper .single-condition .condition-repeater .add-condition .wpfnl-dropdown {
20815 right: -15px;
20816 top: 50px;
20817 width: 100px;
20818 }
20819 .condition-form-wrapper .single-condition .condition-repeater .add-condition .wpfnl-dropdown li a {
20820 text-transform: uppercase;
20821 }
20822 .condition-form-wrapper .single-condition .condition-repeater .add-condition .wpfnl-dropdown.show-condition {
20823 top: 37px;
20824 opacity: 1;
20825 visibility: visible;
20826 }
20827 .condition-form-wrapper .single-condition .condition-repeater .delete-condition {
20828 position: absolute;
20829 bottom: 4px;
20830 right: -2px;
20831 opacity: 0;
20832 visibility: hidden;
20833 }
20834 .condition-form-wrapper .single-condition .condition-repeater:hover .delete-condition {
20835 opacity: 1;
20836 visibility: visible;
20837 }
20838 .condition-form-wrapper .single-condition .condition-symbol {
20839 position: absolute;
20840 top: calc(50% - 14px);
20841 right: 7px;
20842 transform: translateY(-50%);
20843 }
20844 .condition-form-wrapper .single-condition .condition-symbol span {
20845 width: 22px;
20846 height: 22px;
20847 border: 2px solid #E5E8F3;
20848 color: #6E42D3;
20849 border-radius: 100%;
20850 font-size: 12px;
20851 font-weight: 500;
20852 background: #fff;
20853 display: block;
20854 padding: 1px 2px;
20855 text-align: center;
20856 }
20857 .condition-form-wrapper .single-condition:first-child {
20858 padding-top: 0;
20859 }
20860 .condition-form-wrapper .single-condition:first-child .condition-repeater .delete-condition {
20861 display: none;
20862 }
20863 .condition-form-wrapper .single-condition:first-child .condition-symbol {
20864 display: none;
20865 }
20866 .condition-form-wrapper .only-one-condition .condition-repeater .add-condition::before {
20867 display: none;
20868 }
20869 .condition-form-wrapper .condition-form__footer {
20870 border-top: 1px solid #E2E5ED;
20871 padding: 30px;
20872 margin-top: 30px;
20873 display: flex;
20874 flex-flow: row wrap;
20875 align-items: center;
20876 justify-content: flex-end;
20877 position: relative;
20878 }
20879 .condition-form-wrapper .condition-form__footer .wpfnl-alert {
20880 display: block;
20881 margin-right: 20px;
20882 }
20883 .condition-form-wrapper .condition-form__footer .btn-default .wpfnl-loader {
20884 position: relative;
20885 top: 3px;
20886 display: inline-block;
20887 }
20888
20889 @media only screen and (max-width: 991px) {
20890 .condition-form-wrapper .single-condition {
20891 max-width: 666px;
20892 }
20893 .condition-form-wrapper .single-condition .single-condition-filed input[type=text],
20894 .condition-form-wrapper .single-condition .single-condition-filed input[type=number],
20895 .condition-form-wrapper .single-condition .single-condition-filed input[type=email],
20896 .condition-form-wrapper .single-condition .single-condition-filed select {
20897 width: 170px;
20898 }
20899 }
20900 .wpfnl-drawflow-window .wpfnl-analytics {
20901 position: fixed;
20902 top: 30px;
20903 right: 0px;
20904 background: #F6F5FA;
20905 height: calc(100% - 30px);
20906 width: calc(100% - 160px);
20907 z-index: 4;
20908 padding: 40px 25px;
20909 overflow: auto;
20910 }
20911 .wpfnl-drawflow-window .wpfnl-analytics::-webkit-scrollbar {
20912 width: 5px;
20913 height: 5px;
20914 }
20915 .wpfnl-drawflow-window .wpfnl-analytics::-webkit-scrollbar-track {
20916 background: #f2f5f8;
20917 }
20918 .wpfnl-drawflow-window .wpfnl-analytics::-webkit-scrollbar-thumb {
20919 background-color: #CBCBCB;
20920 border-radius: 20px;
20921 }
20922 .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
20923 position: fixed;
20924 top: 32px;
20925 left: 160px;
20926 width: 100%;
20927 height: 100%;
20928 background: #f6f5fa;
20929 border-radius: 0;
20930 z-index: 9;
20931 display: flex;
20932 flex-flow: column;
20933 align-items: center;
20934 justify-content: center;
20935 }
20936 .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader .wpfnl-loader {
20937 display: block;
20938 width: 40px;
20939 height: 40px;
20940 }
20941 .wpfnl-drawflow-window .wpfnl-analytics .overlay-click {
20942 position: fixed;
20943 left: 0;
20944 top: 0;
20945 background: rgba(255, 255, 255, 0);
20946 width: 100%;
20947 height: 100%;
20948 z-index: 2;
20949 display: none;
20950 }
20951 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper {
20952 width: 100%;
20953 max-width: 1320px;
20954 margin: 0 auto;
20955 position: relative;
20956 }
20957 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper.pro-active {
20958 padding: 20px;
20959 }
20960 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper:hover .hoverlay {
20961 visibility: visible;
20962 opacity: 1;
20963 }
20964 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay {
20965 visibility: hidden;
20966 opacity: 0;
20967 background: rgba(246, 248, 250, 0.6);
20968 display: flex;
20969 flex-flow: column;
20970 justify-content: center;
20971 align-items: center;
20972 transition: all 0.3s ease;
20973 width: calc(100% - 10px);
20974 height: calc(100% - 70px);
20975 left: 5px;
20976 bottom: 0;
20977 position: absolute;
20978 z-index: 9;
20979 padding: 0 15px;
20980 border-radius: 10px;
20981 border: 1px solid #DDDDDD;
20982 }
20983 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn {
20984 position: fixed;
20985 top: 50%;
20986 left: 50%;
20987 transform: translate(-50%, -50%);
20988 z-index: 9999;
20989 background: none;
20990 border: none;
20991 outline: none;
20992 }
20993 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a {
20994 display: flex;
20995 align-items: center;
20996 justify-content: center;
20997 gap: 10px;
20998 background: #2FCF5C;
20999 padding: 15px 20px;
21000 line-height: 17px;
21001 height: auto;
21002 }
21003 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a svg circle {
21004 fill: #FFF;
21005 }
21006 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a svg path {
21007 fill: #2FCF5C;
21008 }
21009 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a:hover {
21010 background: #1a8939;
21011 }
21012 .wpfnl-drawflow-window .wpfnl-analytics .analytics-body {
21013 display: flex;
21014 flex-flow: column;
21015 gap: 24px;
21016 }
21017 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header {
21018 display: flex;
21019 align-items: center;
21020 justify-content: space-between;
21021 margin-bottom: 24px;
21022 }
21023 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-left {
21024 display: flex;
21025 align-items: center;
21026 gap: 10px;
21027 width: 200px;
21028 }
21029 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-left h3 {
21030 font-weight: 600;
21031 font-size: 24px;
21032 color: #363B4E;
21033 }
21034 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .backto-steps {
21035 background: #FFFFFF;
21036 border-radius: 10px;
21037 height: 38px;
21038 width: 38px;
21039 display: flex;
21040 flex-flow: column;
21041 align-items: center;
21042 justify-content: center;
21043 cursor: pointer;
21044 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
21045 }
21046 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right {
21047 display: flex;
21048 flex-flow: row wrap;
21049 align-items: center;
21050 justify-content: flex-end;
21051 gap: 14px;
21052 width: calc(80% - 200px);
21053 position: relative;
21054 z-index: 3;
21055 }
21056 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .reset-analytics a {
21057 display: flex;
21058 justify-content: center;
21059 align-items: center;
21060 padding: 8px 15px;
21061 min-width: 100px;
21062 border-radius: 100px;
21063 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
21064 background: #fff;
21065 background-size: 11px 11px;
21066 border: none;
21067 }
21068 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .reset-analytics a .reset-icon svg {
21069 width: 18px;
21070 margin-top: 3px;
21071 }
21072 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .reset-analytics a .reset-text {
21073 font-weight: 600;
21074 color: #000;
21075 font-size: 14px;
21076 line-height: 1;
21077 padding-left: 8px;
21078 }
21079 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .download-analytics a {
21080 display: flex;
21081 justify-content: center;
21082 align-items: center;
21083 padding: 11px 15px;
21084 min-width: 58px;
21085 border-radius: 100px;
21086 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
21087 background: #fff;
21088 background-size: 11px 11px;
21089 border: none;
21090 }
21091 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .download-analytics a .download-icon svg {
21092 width: 18px;
21093 margin-top: 3px;
21094 }
21095 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right select {
21096 border-radius: 100px;
21097 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
21098 border: none;
21099 height: auto;
21100 padding: 14px 40px 12px 20px;
21101 min-width: auto;
21102 color: #2D3149;
21103 font-size: 14px;
21104 font-weight: 600;
21105 line-height: 1;
21106 width: auto;
21107 appearance: none;
21108 background: #fff url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjgiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==) no-repeat right 15px top 54%;
21109 background-size: 11px 11px;
21110 }
21111 .wpfnl-drawflow-window .wpfnl-analytics .analytics-box {
21112 border-radius: 10px;
21113 background: #FFF;
21114 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
21115 padding: 19px 20px 19px;
21116 position: relative;
21117 }
21118 .wpfnl-drawflow-window .wpfnl-analytics .analytics-box .analytics-title {
21119 color: #2D3149;
21120 font-size: 18px;
21121 font-weight: 600;
21122 line-height: 1;
21123 }
21124 .wpfnl-drawflow-window .wpfnl-analytics .loader-wrapper {
21125 position: absolute;
21126 top: 0;
21127 left: 0;
21128 width: 100%;
21129 height: 100%;
21130 border-radius: 10px;
21131 background: #FFF;
21132 z-index: 2;
21133 display: flex;
21134 flex-flow: column;
21135 align-items: center;
21136 justify-content: center;
21137 }
21138 .wpfnl-drawflow-window .wpfnl-analytics .loader-wrapper .wpfnl-loader {
21139 display: block;
21140 width: 20px;
21141 height: 20px;
21142 }
21143 .wpfnl-drawflow-window .wpfnl-analytics .no-data-notice {
21144 width: 100%;
21145 height: 338px;
21146 display: flex;
21147 flex-flow: column;
21148 align-items: center;
21149 justify-content: center;
21150 }
21151 .wpfnl-drawflow-window .wpfnl-analytics .no-data-notice p {
21152 color: #2d3149;
21153 font-weight: 500;
21154 font-size: 16px;
21155 }
21156
21157 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator {
21158 display: flex;
21159 align-items: center;
21160 justify-content: center;
21161 gap: 24px;
21162 }
21163 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator {
21164 font-weight: 400;
21165 font-size: 14px;
21166 line-height: 1.3;
21167 color: #9398a5;
21168 position: relative;
21169 display: flex;
21170 align-items: center;
21171 }
21172 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator:last-child {
21173 margin-right: 0;
21174 }
21175 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator:before {
21176 content: "";
21177 width: 10px;
21178 height: 10px;
21179 background: #6E42D3;
21180 display: inline-block;
21181 border-radius: 50px;
21182 margin-right: 8px;
21183 position: relative;
21184 top: -1px;
21185 }
21186 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator2:before {
21187 background-color: #F7900A;
21188 }
21189
21190 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .progress-badge {
21191 background: #D1FADF;
21192 color: #12B76A;
21193 padding: 7px 10px 7px 25px;
21194 font-size: 10px;
21195 line-height: 1;
21196 font-weight: 500;
21197 border-radius: 50px;
21198 display: flex;
21199 align-items: center;
21200 gap: 7px;
21201 position: relative;
21202 }
21203 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge svg, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .progress-badge svg {
21204 position: absolute;
21205 left: 6px;
21206 top: 4px;
21207 }
21208 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .downgrade.progress-badge, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .downgrade.progress-badge {
21209 background: #FEE4E2;
21210 color: #F04438;
21211 }
21212 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .downgrade.progress-badge svg, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .downgrade.progress-badge svg {
21213 left: 9px;
21214 top: 8px;
21215 }
21216
21217 .folded .wpfnl-drawflow-window .wpfnl-analytics {
21218 width: calc(100% - 36px);
21219 }
21220 .folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
21221 left: 36px;
21222 }
21223
21224 .wpfnl-analytics .analytics-card {
21225 display: flex;
21226 flex-flow: row wrap;
21227 gap: 20px;
21228 }
21229 .wpfnl-analytics .analytics-card .analytics-single-card {
21230 width: calc(16.6666666667% - 17px);
21231 }
21232 .wpfnl-analytics .analytics-card .analytics-single-card .icon-area {
21233 display: flex;
21234 align-items: flex-start;
21235 justify-content: space-between;
21236 gap: 10px;
21237 }
21238 .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .icon {
21239 width: 42px;
21240 height: 42px;
21241 border: 1px solid #E4E6EB;
21242 display: flex;
21243 flex-flow: column;
21244 align-items: center;
21245 justify-content: center;
21246 border-radius: 100%;
21247 padding: 5px;
21248 }
21249 .wpfnl-analytics .analytics-card .analytics-single-card .card-title {
21250 color: #9398A5;
21251 font-size: 14px;
21252 line-height: 1.2;
21253 margin-top: 18px;
21254 }
21255 .wpfnl-analytics .analytics-card .analytics-single-card .card-value {
21256 color: #2D3149;
21257 font-size: 22px;
21258 font-weight: 500;
21259 line-height: 1;
21260 margin-top: 8px;
21261 }
21262
21263 @media only screen and (max-width: 1399px) {
21264 .wpfnl-analytics .analytics-card .analytics-single-card {
21265 width: calc(33.3333333333% - 14px);
21266 }
21267 }
21268 @media only screen and (max-width: 1199px) {
21269 .wpfnl-analytics .analytics-card .analytics-single-card .card-value {
21270 font-size: 20px;
21271 }
21272 }
21273 .wpfnl-analytics .analytics-revenue .no-data-notice {
21274 background: #fcfcff;
21275 border-radius: 10px;
21276 border: 1px solid #F1F0F5;
21277 }
21278 .wpfnl-analytics .analytics-revenue .revenue-box-header {
21279 display: flex;
21280 flex-flow: row wrap;
21281 align-items: center;
21282 justify-content: space-between;
21283 margin-bottom: 27px;
21284 }
21285 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator2:before {
21286 background-color: #EAE1FF;
21287 }
21288 .wpfnl-analytics .analytics-revenue .revenue-tab-nav {
21289 display: flex;
21290 flex-flow: row wrap;
21291 align-items: center;
21292 gap: 12px;
21293 margin-bottom: -1px;
21294 position: relative;
21295 z-index: 1;
21296 margin-bottom: 12px;
21297 }
21298 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav {
21299 width: calc(20% - 10px);
21300 position: relative;
21301 border: 1px solid rgba(238, 240, 243, 0.8);
21302 border-radius: 8px;
21303 padding: 19px 24px;
21304 cursor: pointer;
21305 }
21306 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav.active {
21307 border-color: rgba(238, 240, 243, 0.8);
21308 background: #FCFCFF;
21309 }
21310 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav.active:before {
21311 display: none;
21312 }
21313 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav:last-child:before {
21314 display: none;
21315 }
21316 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .revenue-value {
21317 font-size: 22px;
21318 font-weight: 500;
21319 color: #2D3149;
21320 line-height: 1;
21321 letter-spacing: -0.6px;
21322 display: flex;
21323 flex-flow: row wrap;
21324 align-items: flex-start;
21325 gap: 10px;
21326 }
21327 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .step-type {
21328 color: #667085;
21329 font-size: 14px;
21330 font-weight: 500;
21331 line-height: 1;
21332 text-transform: capitalize;
21333 margin-top: 7px;
21334 }
21335 .wpfnl-analytics .analytics-revenue .single-tab-content {
21336 border-radius: 8px;
21337 border: 1px solid rgba(238, 240, 243, 0.8);
21338 background: #FCFCFF;
21339 padding: 24px 24px 31px;
21340 }
21341 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label {
21342 position: absolute;
21343 top: 3px;
21344 left: 0;
21345 height: 100%;
21346 width: 100%;
21347 display: flex;
21348 flex-flow: column;
21349 justify-content: space-between;
21350 }
21351 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label {
21352 font-size: 12px;
21353 line-height: 1.2;
21354 color: #9398A5;
21355 display: block;
21356 position: relative;
21357 }
21358 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label:before {
21359 content: "";
21360 position: absolute;
21361 left: 50px;
21362 top: 7px;
21363 width: calc(100% - 50px);
21364 height: 1px;
21365 background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23E4E7ECFF' stroke-width='4' stroke-dasharray='3%2c 11' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
21366 }
21367 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label span {
21368 width: 33px;
21369 display: block;
21370 text-align: right;
21371 }
21372 .wpfnl-analytics .analytics-revenue .single-tab-content .barchart-inner-wrapper {
21373 height: 292px;
21374 display: flex;
21375 flex-flow: row wrap;
21376 align-items: flex-end;
21377 justify-content: space-between;
21378 padding: 10px 15px 9px 60px;
21379 gap: 30px;
21380 position: relative;
21381 z-index: 1;
21382 }
21383 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar {
21384 width: 34px;
21385 height: 100%;
21386 position: relative;
21387 display: flex;
21388 flex-flow: row wrap;
21389 align-items: flex-end;
21390 gap: 6px;
21391 }
21392 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip {
21393 padding: 14px 15px;
21394 width: 164px;
21395 position: absolute;
21396 bottom: calc(100% + 8px);
21397 left: 50%;
21398 transform: translateX(-50%);
21399 z-index: 9;
21400 opacity: 0;
21401 visibility: hidden;
21402 transition: all 0.3s ease;
21403 border-radius: 8px;
21404 background: #10052E;
21405 box-shadow: 0px 2px 15px 0px rgba(22, 28, 32, 0.08);
21406 }
21407 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip:before {
21408 content: "";
21409 position: absolute;
21410 left: 50%;
21411 bottom: -5px;
21412 width: 10px;
21413 height: 10px;
21414 background: #10052e;
21415 transform: rotate(45deg);
21416 margin-left: -6px;
21417 }
21418 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip .item {
21419 color: #CDCFD6;
21420 font-size: 13px;
21421 line-height: 1;
21422 margin-bottom: 6px;
21423 }
21424 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip .item:last-child {
21425 margin-bottom: 0;
21426 }
21427 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip .item b {
21428 color: #fff;
21429 font-weight: 500;
21430 }
21431 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item {
21432 width: 14px;
21433 display: block;
21434 background-color: #EAE1FF;
21435 border-radius: 30px 30px 0 0;
21436 position: relative;
21437 }
21438 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item.indicator1 .bar-tooltip {
21439 left: calc(50% + 11px);
21440 }
21441 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item.indicator2 {
21442 background-color: #6E42D3;
21443 }
21444 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item.indicator2 .bar-tooltip {
21445 left: calc(50% - 9px);
21446 }
21447 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-title {
21448 font-size: 12px;
21449 line-height: 1.2;
21450 color: #9398A5;
21451 position: absolute;
21452 bottom: -20px;
21453 left: 50%;
21454 transform: translateX(-50%);
21455 white-space: nowrap;
21456 transition: all 0.3s ease;
21457 }
21458 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar:hover .bar-item.same-height .bar-tooltip,
21459 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar:hover .bar-item.its-highest .bar-tooltip {
21460 opacity: 1;
21461 visibility: visible;
21462 }
21463 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .barchart-inner-wrapper {
21464 gap: 10px;
21465 }
21466 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .single-bar {
21467 width: 23px;
21468 gap: 6px;
21469 }
21470 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .single-bar .bar-item {
21471 width: 7px;
21472 }
21473 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .single-bar .bar-title {
21474 transform: translate(-50%, 8px) rotate(-45deg);
21475 }
21476
21477 @media only screen and (max-width: 1199px) {
21478 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav {
21479 width: calc(25% - 9px);
21480 padding: 16px;
21481 }
21482 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .revenue-value {
21483 font-size: 22px;
21484 }
21485 .wpfnl-analytics .analytics-revenue .single-tab-content .barchart-inner-wrapper {
21486 gap: 24px;
21487 }
21488 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar {
21489 width: 20px;
21490 gap: 4px;
21491 }
21492 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item {
21493 width: 8px;
21494 }
21495 }
21496 @media only screen and (max-width: 991px) {
21497 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav {
21498 padding: 13px 13px;
21499 }
21500 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .revenue-value {
21501 font-size: 18px;
21502 }
21503 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .step-type {
21504 font-size: 12px;
21505 }
21506 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge {
21507 padding: 5px 8px 4px 21px;
21508 }
21509 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge svg {
21510 left: 4px;
21511 top: 1px;
21512 }
21513 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .downgrade.progress-badge svg {
21514 left: 9px;
21515 top: 5px;
21516 }
21517 }
21518 .wpfnl-analytics .analytics-conversion .conversion-box-header {
21519 display: flex;
21520 flex-flow: row wrap;
21521 align-items: center;
21522 justify-content: space-between;
21523 margin-bottom: 15px;
21524 }
21525 .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator {
21526 display: flex;
21527 gap: 8px;
21528 }
21529 .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator button {
21530 border-radius: 8px;
21531 border: 1px solid #F1F0F5;
21532 background: #FFF;
21533 width: 30px;
21534 height: 30px;
21535 display: flex;
21536 align-items: center;
21537 justify-content: center;
21538 flex-flow: column;
21539 cursor: pointer;
21540 }
21541 .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator button:disabled {
21542 opacity: 0.5;
21543 cursor: not-allowed;
21544 }
21545 .wpfnl-analytics .analytics-conversion .conversion-table {
21546 border-radius: 10px;
21547 border: 1px solid #F1F0F5;
21548 background: #FCFCFF;
21549 padding: 40px;
21550 }
21551 .wpfnl-analytics .analytics-conversion .conversion-table-wrapper {
21552 max-width: 1080px;
21553 width: 100%;
21554 margin: 0 auto;
21555 overflow: hidden;
21556 }
21557 .wpfnl-analytics .analytics-conversion .conversion-table-inner {
21558 display: flex;
21559 gap: 30px;
21560 transition: transform 0.5s;
21561 }
21562 .wpfnl-analytics .analytics-conversion .conversion-table-inner.data-center {
21563 justify-content: center;
21564 }
21565 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
21566 border-radius: 10px;
21567 border: 1px solid #F1F0F5;
21568 background: #FFF;
21569 box-shadow: 0px 20px 20px 0px rgba(190, 190, 215, 0.08);
21570 width: calc(20% - 24px);
21571 flex-shrink: 0;
21572 }
21573 .wpfnl-analytics .analytics-conversion .conversion-table-inner .tbl-head {
21574 display: flex;
21575 flex-flow: row wrap;
21576 align-items: center;
21577 justify-content: center;
21578 gap: 7px;
21579 background: #E8F1FF;
21580 border-radius: 10px 10px 0 0;
21581 padding: 8px 10px 6px;
21582 }
21583 .wpfnl-analytics .analytics-conversion .conversion-table-inner .tbl-head .tbl-title {
21584 color: #363B4E;
21585 font-size: 13px;
21586 font-weight: 500;
21587 line-height: 1.1;
21588 width: calc(100% - 60px);
21589 white-space: nowrap;
21590 overflow: hidden;
21591 text-overflow: ellipsis;
21592 display: inline-block;
21593 }
21594 .wpfnl-analytics .analytics-conversion .conversion-table-inner .tbl-head svg {
21595 width: 14px;
21596 display: block;
21597 }
21598 .wpfnl-analytics .analytics-conversion .conversion-table-inner .step-preview-img {
21599 padding: 16px;
21600 }
21601 .wpfnl-analytics .analytics-conversion .conversion-table-inner .step-preview-img svg {
21602 max-width: 100%;
21603 width: 100%;
21604 }
21605 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data {
21606 text-align: center;
21607 }
21608 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper) {
21609 border-bottom: 1px solid #F1F0F5;
21610 color: #7A8B9A;
21611 font-size: 14px;
21612 line-height: 14px;
21613 text-transform: capitalize;
21614 padding: 14px 10px;
21615 }
21616 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper) b {
21617 color: #2D3149;
21618 font-weight: 500;
21619 }
21620 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper):last-child {
21621 border-bottom: 0;
21622 }
21623 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper).conversion-rates b {
21624 color: #12B76A;
21625 }
21626 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper).bounce-rate b {
21627 color: #F04438;
21628 }
21629 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-checkout .tbl-head {
21630 background: #FDF0E8;
21631 }
21632 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-checkout .tbl-head svg {
21633 position: relative;
21634 top: -1px;
21635 }
21636 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-upsell .tbl-head {
21637 background: #E9F9E8;
21638 }
21639 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-downsell .tbl-head {
21640 background: #FCF0F1;
21641 }
21642 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-thankyou .tbl-head {
21643 background: #E6FAF5;
21644 }
21645 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-custom .tbl-head {
21646 background: #E0F2F4;
21647 }
21648
21649 @media only screen and (max-width: 1299px) {
21650 .wpfnl-analytics .analytics-conversion .conversion-table {
21651 padding: 20px;
21652 }
21653 .wpfnl-analytics .analytics-conversion .conversion-table-inner {
21654 gap: 20px;
21655 }
21656 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
21657 width: calc(20% - 16px);
21658 }
21659 }
21660 @media only screen and (max-width: 1199px) {
21661 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
21662 width: calc(25% - 15px);
21663 }
21664 }
21665 @media only screen and (max-width: 991px) {
21666 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
21667 width: calc(33.3333333333% - 14px);
21668 }
21669 }
21670 .wpfnl-analytics .custom-date-range {
21671 display: none;
21672 }
21673 .wpfnl-analytics .filter-selectbox {
21674 background: #fff;
21675 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
21676 padding: 14px 62px 12px 18px;
21677 border-radius: 50px;
21678 position: relative;
21679 cursor: pointer;
21680 display: inline-flex;
21681 flex-flow: row wrap;
21682 align-items: center;
21683 justify-content: flex-start;
21684 }
21685 .wpfnl-analytics .filter-selectbox > ul {
21686 display: flex;
21687 flex-flow: row wrap;
21688 align-items: center;
21689 }
21690 .wpfnl-analytics .filter-selectbox > ul li {
21691 position: relative;
21692 color: #9398A5;
21693 line-height: 1;
21694 font-size: 14px;
21695 font-weight: 500;
21696 }
21697 .wpfnl-analytics .filter-selectbox > ul li:first-child {
21698 margin-right: 24px;
21699 }
21700 .wpfnl-analytics .filter-selectbox > ul li:first-child:before {
21701 content: "";
21702 width: 9px;
21703 height: 1px;
21704 background: #66666d;
21705 position: absolute;
21706 right: -16px;
21707 top: 7px;
21708 }
21709 .wpfnl-analytics .filter-selectbox .calendar-icon {
21710 position: absolute;
21711 right: 0;
21712 top: 0;
21713 height: 100%;
21714 width: 45px;
21715 padding: 10px 15px 10px 14px;
21716 border-left: 1px solid #E4E6EB;
21717 display: flex;
21718 flex-flow: column;
21719 align-items: center;
21720 justify-content: center;
21721 }
21722 .wpfnl-analytics .filter-selectbox .calendar-icon svg {
21723 transition: all 0.3s ease;
21724 }
21725 .wpfnl-analytics .filter-wrapper {
21726 border-bottom: 1px solid #E5E8F3;
21727 padding: 2px 18px;
21728 display: flex;
21729 align-items: center;
21730 justify-content: space-between;
21731 color: #7A8B9A;
21732 width: 100%;
21733 }
21734 .wpfnl-analytics .filter-wrapper input {
21735 background: transparent;
21736 border: none;
21737 font-size: 14px;
21738 color: #9398A5;
21739 font-weight: 400;
21740 width: 87px;
21741 min-width: auto;
21742 cursor: pointer;
21743 padding: 0;
21744 height: 40px;
21745 z-index: 1;
21746 position: relative;
21747 }
21748 .wpfnl-analytics .filter-wrapper input[readonly] {
21749 background: transparent;
21750 cursor: pointer;
21751 }
21752 .wpfnl-analytics .filter-wrapper input:focus {
21753 box-shadow: none;
21754 }
21755 .wpfnl-analytics .filter-wrapper input#to {
21756 margin-right: 5px;
21757 }
21758 .wpfnl-analytics .filter-wrapper .to-date,
21759 .wpfnl-analytics .filter-wrapper .from-date {
21760 position: relative;
21761 display: flex;
21762 align-items: center;
21763 gap: 8px;
21764 }
21765 .wpfnl-analytics .filter-wrapper .divider {
21766 width: 9px;
21767 height: 1px;
21768 background: #7A8B9A;
21769 margin: 0 5px;
21770 }
21771 .wpfnl-analytics .filter-wrapper .icon {
21772 position: relative;
21773 top: 0px;
21774 }
21775 .wpfnl-analytics .filter-wrapper .icon svg {
21776 display: block;
21777 }
21778 .wpfnl-analytics .filter-wrapper .filter-icon {
21779 margin-left: auto;
21780 border-left: 1px solid #9064f6;
21781 height: 40px;
21782 width: 40px;
21783 padding-left: 13px;
21784 display: flex;
21785 flex-flow: column;
21786 align-items: center;
21787 justify-content: center;
21788 }
21789 .wpfnl-analytics .calendar-dorpdown {
21790 position: absolute;
21791 top: calc(100% + 10px);
21792 right: 0;
21793 background: #fff;
21794 width: 291px;
21795 z-index: 10;
21796 border: 1px solid #F1F0F5;
21797 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
21798 border-radius: 10px;
21799 cursor: default;
21800 opacity: 0;
21801 visibility: hidden;
21802 transition: all 0.3s ease;
21803 }
21804 .wpfnl-analytics .calendar-dorpdown .date-range-input {
21805 display: flex;
21806 flex-flow: row wrap;
21807 align-items: center;
21808 gap: 10px;
21809 border-bottom: 1px solid #F1F0F5;
21810 padding: 5px 20px;
21811 position: relative;
21812 }
21813 .wpfnl-analytics .calendar-dorpdown .date-range-input:before {
21814 content: "";
21815 position: absolute;
21816 left: calc(50% - 6px);
21817 top: 50%;
21818 transform: translateY(-50%);
21819 height: 16px;
21820 width: 1px;
21821 background: #F1F0F5;
21822 }
21823 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text] {
21824 min-width: auto;
21825 width: calc(50% - 5px);
21826 background: transparent;
21827 border: none;
21828 border-radius: 0;
21829 height: 30px;
21830 padding: 0;
21831 cursor: text;
21832 color: #2D3149;
21833 }
21834 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text]::placeholder {
21835 color: #9398A5;
21836 }
21837 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text]:-ms-input-placeholder {
21838 color: #9398A5;
21839 }
21840 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text]::-ms-input-placeholder {
21841 color: #9398A5;
21842 }
21843 .wpfnl-analytics .calendar-dorpdown .date-range-input #date-from {
21844 padding-right: 12px;
21845 }
21846 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker {
21847 padding: 15px 20px 10px;
21848 }
21849 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker {
21850 width: 100%;
21851 }
21852 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-prev,
21853 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-next {
21854 display: none;
21855 }
21856 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-title {
21857 margin: 0;
21858 display: flex;
21859 align-items: center;
21860 gap: 10px;
21861 }
21862 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-title select {
21863 color: #2D3149;
21864 font-size: 13px;
21865 margin: 0;
21866 width: calc(50% - 4px);
21867 border-radius: 8px;
21868 border: 1px solid #F1F0F5;
21869 box-shadow: none;
21870 padding: 10px 40px 8px 12px;
21871 background-position: right 10px top 54%;
21872 }
21873 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender {
21874 padding: 4px 15px 23px;
21875 }
21876 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender #ui-datepicker-div {
21877 position: relative !important;
21878 top: 10px !important;
21879 left: 0 !important;
21880 width: 100%;
21881 display: block !important;
21882 }
21883 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender .ui-datepicker .ui-datepicker-title {
21884 display: flex;
21885 width: 90%;
21886 margin: 0 2.5em;
21887 }
21888 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender .ui-datepicker select.ui-datepicker-month,
21889 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender .ui-datepicker select.ui-datepicker-year {
21890 width: 116px;
21891 min-width: auto;
21892 height: 36px;
21893 border-radius: 3px;
21894 }
21895 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender {
21896 padding: 4px 15px 23px;
21897 }
21898 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender #ui-datepicker-div {
21899 position: relative !important;
21900 top: 10px !important;
21901 left: 0 !important;
21902 width: 100%;
21903 display: block !important;
21904 }
21905 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
21906 display: flex;
21907 width: 90%;
21908 margin: 0 2.5em;
21909 }
21910 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender .ui-datepicker select.ui-datepicker-month,
21911 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender .ui-datepicker select.ui-datepicker-year {
21912 width: 116px;
21913 min-width: auto;
21914 height: 36px;
21915 border-radius: 3px;
21916 }
21917 .wpfnl-analytics .calendar-dorpdown .btn-default {
21918 padding: 0 18px;
21919 height: 32px;
21920 line-height: 32px;
21921 width: auto;
21922 min-width: auto;
21923 margin-left: auto;
21924 display: block;
21925 border-radius: 10px 0 10px 0;
21926 box-shadow: 0px 10px 16px rgba(189, 193, 200, 0.5);
21927 }
21928 .wpfnl-analytics .show-calendar .calendar-dorpdown {
21929 opacity: 1;
21930 visibility: visible;
21931 }
21932
21933 @media only screen and (max-width: 1399px) {
21934 .wpfnl-drawflow-window .wpfnl-analytics .analytics-box {
21935 padding: 17px 17px 16px;
21936 }
21937 }
21938 @media only screen and (max-width: 782px) {
21939 .folded .wpfnl-drawflow-window .wpfnl-analytics {
21940 width: 100%;
21941 }
21942 .folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
21943 left: 0;
21944 }
21945 }
21946 .wpfnl-license-page {
21947 background: transparent;
21948 }
21949
21950 .wpfnl-license-wrapper {
21951 display: flex;
21952 flex-flow: row wrap;
21953 padding: 24px;
21954 gap: 30px;
21955 }
21956 .wpfnl-license-wrapper .wpfnl-license-filed {
21957 background: #FFFFFF;
21958 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
21959 border-radius: 10px;
21960 width: calc(100% - 390px);
21961 padding: 15px 20px 20px;
21962 }
21963 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .product-title,
21964 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
21965 width: 390px;
21966 position: relative;
21967 }
21968 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .input-field,
21969 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field {
21970 width: calc(100% - 460px);
21971 max-width: 420px;
21972 padding: 0 40px;
21973 }
21974 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .btn-area,
21975 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area {
21976 width: 170px;
21977 }
21978 .wpfnl-license-wrapper .wpfnl-license-filed .field-header {
21979 display: flex;
21980 flex-flow: row wrap;
21981 align-items: center;
21982 justify-content: space-between;
21983 margin-bottom: 30px;
21984 position: relative;
21985 padding-bottom: 15px;
21986 }
21987 .wpfnl-license-wrapper .wpfnl-license-filed .field-header:before {
21988 content: "";
21989 position: absolute;
21990 left: -20px;
21991 bottom: 0;
21992 width: calc(100% + 40px);
21993 height: 1px;
21994 background: #E5E8F3;
21995 }
21996 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .single-field {
21997 text-transform: uppercase;
21998 }
21999 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area {
22000 display: flex;
22001 flex-flow: row wrap;
22002 justify-content: space-between;
22003 align-items: center;
22004 width: 100%;
22005 }
22006 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
22007 display: flex;
22008 align-items: center;
22009 }
22010 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title .icon-info {
22011 width: calc(100% - 50px);
22012 padding-left: 15px;
22013 }
22014 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title h3 {
22015 font-weight: 500;
22016 font-size: 20px;
22017 line-height: 23px;
22018 color: #363B4E;
22019 }
22020 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .license-status {
22021 font-size: 14px;
22022 line-height: 16px;
22023 color: #7A8B9A;
22024 margin-top: 5px;
22025 display: block;
22026 }
22027 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .addon-icon {
22028 width: 50px;
22029 height: 50px;
22030 border-radius: 100%;
22031 display: flex;
22032 align-items: center;
22033 justify-content: center;
22034 }
22035 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field input {
22036 height: 46px;
22037 padding: 6px 15px 5px;
22038 }
22039 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area {
22040 position: relative;
22041 }
22042 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area .btn-default {
22043 padding: 0 22px;
22044 height: 46px;
22045 min-width: 162px;
22046 border-radius: 10px;
22047 }
22048 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area .lnc-notice {
22049 color: green;
22050 font-size: 15px;
22051 text-transform: capitalize;
22052 margin-left: 8px;
22053 position: absolute;
22054 bottom: -24px;
22055 left: -4px;
22056 }
22057 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license {
22058 padding: 15px;
22059 background: #F7F7FA;
22060 margin-top: 30px;
22061 border-radius: 0 8px 8px 0;
22062 border-left: 2px solid #6E42D3;
22063 }
22064 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .single-addons {
22065 margin-bottom: 15px;
22066 }
22067 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .single-addons:last-child {
22068 margin-bottom: 0;
22069 }
22070 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area {
22071 padding: 12px 15px;
22072 background-color: #fff;
22073 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
22074 border-radius: 6px;
22075 }
22076 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .product-title {
22077 width: 362px;
22078 }
22079 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .addon-icon {
22080 background: #F7F7FA;
22081 }
22082 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area h3 {
22083 font-weight: 500;
22084 font-size: 14px;
22085 line-height: 1.1;
22086 color: #363B4E;
22087 }
22088 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .input-field input {
22089 height: 38px;
22090 }
22091 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .btn-area {
22092 width: 145px;
22093 }
22094 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .btn-area .btn-default {
22095 padding: 0 18px;
22096 font-size: 13px;
22097 height: 38px;
22098 min-width: auto;
22099 margin-left: auto;
22100 display: block;
22101 border-radius: 6px;
22102 width: 100%;
22103 }
22104 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .not-get-addons .input-field-area .product-title {
22105 width: calc(100% - 200px);
22106 }
22107 .wpfnl-license-wrapper .promo-text-area {
22108 width: 360px;
22109 background: #FFF;
22110 border-radius: 10px;
22111 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
22112 }
22113 .wpfnl-license-wrapper .promo-text-area .single-area {
22114 position: relative;
22115 padding: 25px 25px 25px 90px;
22116 background: #FFFFFF;
22117 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
22118 border-radius: 10px;
22119 margin-bottom: 30px;
22120 }
22121 .wpfnl-license-wrapper .promo-text-area .single-area:last-child {
22122 margin-bottom: 0;
22123 }
22124 .wpfnl-license-wrapper .promo-text-area .single-area .icon {
22125 background-color: #F7F7FA;
22126 width: 50px;
22127 height: 50px;
22128 display: flex;
22129 flex-flow: column;
22130 align-items: center;
22131 justify-content: center;
22132 border-radius: 100%;
22133 position: absolute;
22134 top: 30px;
22135 left: 26px;
22136 }
22137 .wpfnl-license-wrapper .promo-text-area .single-area h4 {
22138 font-size: 18px;
22139 margin-bottom: 8px;
22140 color: #363B4E;
22141 font-weight: 500;
22142 }
22143 .wpfnl-license-wrapper .promo-text-area .single-area P {
22144 font-size: 14px;
22145 }
22146 .wpfnl-license-wrapper .promo-text-area .manage-license-area {
22147 padding: 20px;
22148 display: flex;
22149 flex-flow: column;
22150 align-items: center;
22151 justify-content: center;
22152 overflow: hidden;
22153 height: 100%;
22154 }
22155 .wpfnl-license-wrapper .promo-text-area .manage-license-area .logo {
22156 margin-bottom: 12px;
22157 }
22158 .wpfnl-license-wrapper .promo-text-area .manage-license-area p {
22159 text-align: center;
22160 margin-bottom: 20px;
22161 }
22162 .wpfnl-license-wrapper .promo-text-area .manage-license-area .btn-default {
22163 height: 40px;
22164 line-height: 40px;
22165 position: relative;
22166 z-index: 1;
22167 }
22168
22169 .cl-doc-row {
22170 display: flex;
22171 flex-flow: row wrap;
22172 padding: 24px;
22173 gap: 30px;
22174 }
22175 .cl-doc-row .single-col {
22176 background: #fff;
22177 padding: 30px;
22178 width: calc(25% - 23px);
22179 border-radius: 8px;
22180 display: flex;
22181 flex-flow: column;
22182 align-items: flex-start;
22183 position: relative;
22184 }
22185 .cl-doc-row .single-col:last-child {
22186 margin-right: 0;
22187 }
22188 .cl-doc-row .single-col .icon {
22189 background-color: #f0f1f3;
22190 width: 40px;
22191 height: 40px;
22192 display: flex;
22193 flex-flow: column;
22194 align-items: center;
22195 justify-content: center;
22196 border-radius: 100%;
22197 position: absolute;
22198 top: 24px;
22199 left: 30px;
22200 }
22201 .cl-doc-row .single-col h4 {
22202 font-size: 20px;
22203 margin-bottom: 22px;
22204 font-weight: 500;
22205 padding-left: 53px;
22206 color: #3c434a;
22207 }
22208 .cl-doc-row .single-col p {
22209 font-size: 14px;
22210 margin-bottom: 20px;
22211 }
22212 .cl-doc-row .single-col .btn-default {
22213 margin-top: auto;
22214 }
22215 .cl-doc-row .single-col.manage-license .icon svg {
22216 width: 27px;
22217 }
22218
22219 @media only screen and (max-width: 1620px) {
22220 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .product-title,
22221 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
22222 width: 280px;
22223 }
22224 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .input-field,
22225 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field {
22226 padding: 0 20px;
22227 }
22228 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .product-title {
22229 width: 260px;
22230 }
22231 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .btn-area {
22232 width: 150px;
22233 }
22234 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .input-field {
22235 width: calc(100% - 410px);
22236 }
22237 }
22238 @media only screen and (max-width: 1399px) {
22239 .wpfnl-license-wrapper .wpfnl-license-filed {
22240 width: 100%;
22241 margin-right: 0;
22242 }
22243 .wpfnl-license-wrapper .promo-text-area {
22244 width: 100%;
22245 display: flex;
22246 flex-flow: row wrap;
22247 justify-content: center;
22248 }
22249 .wpfnl-license-wrapper .promo-text-area .single-area {
22250 width: calc(33.3333333333% - 20px);
22251 margin-left: 30px;
22252 margin-bottom: 0;
22253 }
22254 .wpfnl-license-wrapper .promo-text-area .single-area:first-child {
22255 margin-left: 0;
22256 }
22257 }
22258 @media only screen and (max-width: 1199px) {
22259 .wpfnl-license-wrapper {
22260 gap: 20px;
22261 }
22262 .wpfnl-license-wrapper .promo-text-area .manage-license-area:before {
22263 left: -47px;
22264 }
22265 .wpfnl-license-wrapper .promo-text-area .manage-license-area {
22266 padding: 20px;
22267 display: flex;
22268 flex-flow: column;
22269 justify-content: center;
22270 }
22271 .wpfnl-license-wrapper .promo-text-area .single-area {
22272 width: calc(33.3333333333% - 14px);
22273 margin-left: 20px;
22274 padding: 20px;
22275 }
22276 .wpfnl-license-wrapper .promo-text-area .single-area .icon {
22277 position: relative;
22278 top: inherit;
22279 left: inherit;
22280 margin-bottom: 12px;
22281 }
22282 .cl-doc-row {
22283 margin-top: 20px;
22284 gap: 20px;
22285 }
22286 .cl-doc-row .single-col {
22287 padding: 20px;
22288 width: calc(50% - 10px);
22289 }
22290 .cl-doc-row .single-col .icon {
22291 top: 18px;
22292 left: 20px;
22293 }
22294 }
22295 @media only screen and (max-width: 991px) {
22296 .wpfnl-license-wrapper .wpfnl-license-filed .field-header {
22297 display: none;
22298 }
22299 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
22300 width: 100%;
22301 margin-bottom: 10px;
22302 }
22303 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field {
22304 width: calc(100% - 180px);
22305 max-width: initial;
22306 padding: 0;
22307 }
22308 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .product-title {
22309 width: 100%;
22310 }
22311 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .input-field {
22312 width: calc(100% - 160px);
22313 }
22314 .cl-doc-row .single-col:nth-child(2) {
22315 margin-right: 0;
22316 }
22317 }
22318 .gbf-product-area .product-head {
22319 padding: 17px 25px;
22320 }
22321 .gbf-product-area .wpfnl-box {
22322 box-shadow: none;
22323 border-radius: 10px;
22324 }
22325 .gbf-product-area .condition-wrapper {
22326 background: #f7f8f9;
22327 border-radius: 10px;
22328 padding: 25px 25px 33px;
22329 }
22330 .gbf-product-area .single-condition-wrapper {
22331 padding: 0 0 27px;
22332 position: relative;
22333 }
22334 .gbf-product-area .single-condition-wrapper:after {
22335 content: "";
22336 position: absolute;
22337 left: 50%;
22338 height: 27px;
22339 width: 2px;
22340 background: #A0ADB9;
22341 margin-left: -1px;
22342 }
22343 .gbf-product-area .single-condition-wrapper:after {
22344 bottom: 0;
22345 }
22346 .gbf-product-area .single-condition-wrapper .add-condition {
22347 border: none;
22348 background: transparent;
22349 display: block;
22350 height: 30px;
22351 width: 30px;
22352 position: absolute;
22353 left: 50%;
22354 bottom: -13px;
22355 transform: translate(-50%);
22356 z-index: 1;
22357 border-radius: 50%;
22358 cursor: pointer;
22359 }
22360 .gbf-product-area .single-condition-wrapper .add-condition svg {
22361 width: 30px;
22362 height: 30px;
22363 }
22364 .gbf-product-area .single-condition-wrapper .add-condition svg circle {
22365 fill: #6e42d3;
22366 stroke: #6e42d3;
22367 }
22368 .gbf-product-area .single-condition-wrapper .add-condition svg path {
22369 stroke: #fff;
22370 }
22371 .gbf-product-area .single-condition-wrapper .add-condition[data-tour=yes] {
22372 position: relative;
22373 z-index: 4;
22374 }
22375 .gbf-product-area .single-condition-wrapper .add-condition[data-tour=yes] circle {
22376 fill: #6e42d3;
22377 stroke: #6e42d3;
22378 }
22379 .gbf-product-area .single-condition-wrapper .add-condition[data-tour=yes] path {
22380 stroke: #fff;
22381 }
22382 .gbf-product-area .single-condition-wrapper:not(:last-child) .add-condition {
22383 display: none;
22384 }
22385 .gbf-product-area .wpfnl-gbf-type-product-search,
22386 .gbf-product-area .wpfnl-product-search-gbf,
22387 .gbf-product-area .wpfnl-category-search {
22388 display: none;
22389 }
22390 .gbf-product-area .select2-container.select2-container--default.select2-container--open {
22391 background: transparent;
22392 border: none;
22393 }
22394 .gbf-product-area .select2-container--default .select2-selection--single {
22395 background-color: transparent;
22396 border: none;
22397 border-radius: 0;
22398 height: auto;
22399 }
22400 .gbf-product-area .select2-container--default .select2-selection--single .select2-selection__arrow {
22401 top: 50%;
22402 transform: translateY(-50%);
22403 display: none;
22404 }
22405 .gbf-product-area .select2-container {
22406 display: block;
22407 width: 100% !important;
22408 }
22409 .gbf-product-area .select2-container .select2-selection__rendered {
22410 border: 1px solid #E5E8F3;
22411 padding: 7px 15px;
22412 width: 100%;
22413 border-radius: 6px;
22414 overflow: hidden;
22415 text-overflow: ellipsis;
22416 display: block;
22417 color: #7A8B9A;
22418 line-height: 1;
22419 }
22420 .gbf-product-area .single-condition {
22421 background: #FFFFFF;
22422 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
22423 border-radius: 10px;
22424 display: flex;
22425 flex-flow: row wrap;
22426 position: relative;
22427 }
22428 .gbf-product-area .single-condition .selectbox-wrapper select {
22429 height: 40px;
22430 background-color: transparent;
22431 min-width: auto;
22432 width: 100%;
22433 }
22434 .gbf-product-area .single-condition .selectbox-wrapper .wpfnl-tag-search {
22435 position: absolute;
22436 opacity: 0;
22437 visibility: hidden;
22438 }
22439 .gbf-product-area .single-condition #gbf-select-box[data-tour=yes] select {
22440 position: relative;
22441 z-index: 4;
22442 border: 1px solid #FFF;
22443 background: #ffffff;
22444 }
22445 .gbf-product-area .single-condition label {
22446 cursor: default;
22447 padding-right: 10px;
22448 }
22449 .gbf-product-area .single-condition .hints {
22450 color: #EE5F5A;
22451 display: none;
22452 }
22453 .gbf-product-area .single-condition .selectbox-wrapper {
22454 position: relative;
22455 width: calc(100% - 112px);
22456 }
22457 .gbf-product-area .single-condition .required-star {
22458 color: #EE5F5A;
22459 }
22460 .gbf-product-area .single-condition .wpfnl-form-group {
22461 width: 100%;
22462 display: flex;
22463 flex-flow: row wrap;
22464 align-items: center;
22465 }
22466 .gbf-product-area .single-condition .condition-if {
22467 padding: 20px;
22468 width: 50%;
22469 position: relative;
22470 }
22471 .gbf-product-area .single-condition .condition-then {
22472 display: flex;
22473 flex-flow: row wrap;
22474 padding: 20px 13px;
22475 width: 50%;
22476 background: #F9F9FD;
22477 border-radius: 0px 10px 10px 0px;
22478 position: relative;
22479 }
22480 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date,
22481 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date {
22482 flex: 1;
22483 position: relative;
22484 display: flex;
22485 align-items: center;
22486 }
22487 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date label,
22488 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date label {
22489 width: 80px;
22490 }
22491 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date input[type=text],
22492 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date input[type=text] {
22493 height: 40px;
22494 min-width: auto;
22495 cursor: pointer;
22496 }
22497 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date {
22498 padding-left: 25px;
22499 }
22500 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date label {
22501 width: 48px;
22502 }
22503 .gbf-product-area .single-condition .div-to-append-calender .ui-datepicker .ui-datepicker-title {
22504 display: flex;
22505 width: 90%;
22506 margin: 0 2.5em;
22507 }
22508 .gbf-product-area .single-condition .div-to-append-calender .ui-datepicker select.ui-datepicker-year,
22509 .gbf-product-area .single-condition .div-to-append-calender .ui-datepicker select.ui-datepicker-month {
22510 width: calc(50% - 25px);
22511 min-width: auto;
22512 height: 36px;
22513 min-height: auto;
22514 border-radius: 3px;
22515 }
22516 .gbf-product-area .single-condition .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
22517 display: flex;
22518 width: 90%;
22519 margin: 0 2.5em;
22520 }
22521 .gbf-product-area .single-condition .div-to-append-range-calender .ui-datepicker select.ui-datepicker-year,
22522 .gbf-product-area .single-condition .div-to-append-range-calender .ui-datepicker select.ui-datepicker-month {
22523 width: calc(50% - 25px);
22524 min-width: auto;
22525 height: 36px;
22526 min-height: auto;
22527 border-radius: 3px;
22528 }
22529 .gbf-product-area .single-condition .close-condition {
22530 border: 1px solid #EE5F5A;
22531 padding: 0;
22532 height: 26px;
22533 width: 26px;
22534 display: flex;
22535 flex-flow: column;
22536 align-items: center;
22537 justify-content: center;
22538 border-radius: 100%;
22539 position: absolute;
22540 right: -8px;
22541 top: -11px;
22542 cursor: pointer;
22543 background: #fff;
22544 opacity: 0;
22545 visibility: hidden;
22546 transition: all 0.3s ease;
22547 z-index: 3;
22548 }
22549 .gbf-product-area .single-condition .close-condition svg {
22550 width: 17px;
22551 }
22552 .gbf-product-area .single-condition .close-condition svg path {
22553 stroke: #EE5F5A;
22554 }
22555 .gbf-product-area .single-condition:hover .close-condition {
22556 opacity: 1;
22557 visibility: visible;
22558 }
22559 .gbf-product-area .single-condition .wpfnl-form-group.field-required select {
22560 border-color: #EE5F5A;
22561 }
22562 .gbf-product-area .single-condition .wpfnl-form-group.field-required .hints {
22563 display: block;
22564 }
22565 .gbf-product-area input[type=time],
22566 .gbf-product-area input[type=date],
22567 .gbf-product-area input[type=search],
22568 .gbf-product-area input[type=url],
22569 .gbf-product-area input[type=tel],
22570 .gbf-product-area input[type=number],
22571 .gbf-product-area input[type=password],
22572 .gbf-product-area input[type=email],
22573 .gbf-product-area input[type=text],
22574 .gbf-product-area textarea,
22575 .gbf-product-area select {
22576 height: 44px;
22577 border-radius: 10px;
22578 }
22579 .gbf-product-area .offer-selection-mode .pms-card-top .recommended-badge {
22580 background: #FEF3C7;
22581 color: #D97706;
22582 border: 1px solid #FDE68A;
22583 font-size: 11px;
22584 font-weight: 500;
22585 padding: 2px 8px;
22586 border-radius: 20px;
22587 letter-spacing: 0.3px;
22588 white-space: nowrap;
22589 margin-left: 2px;
22590 }
22591 .gbf-product-area select#wpfnl-choose-offer {
22592 height: 44px;
22593 padding-right: 30px;
22594 }
22595 .gbf-product-area .manual-product-buttons {
22596 display: flex;
22597 justify-content: flex-end;
22598 gap: 12px;
22599 margin-bottom: 16px;
22600 }
22601 .gbf-product-area .manual-product-buttons button {
22602 height: 40px;
22603 font-size: 14px;
22604 font-weight: 500;
22605 border-radius: 6px;
22606 display: flex;
22607 align-items: center;
22608 gap: 8px;
22609 padding: 0 16px;
22610 cursor: pointer;
22611 transition: all 0.2s ease;
22612 }
22613 .gbf-product-area .manual-product-buttons button.add-existing-product {
22614 background: #6E42D3;
22615 border: 1px solid #6E42D3;
22616 color: #FFFFFF;
22617 }
22618 .gbf-product-area .manual-product-buttons button.add-existing-product:hover {
22619 background: #5c35b8;
22620 border-color: #5c35b8;
22621 }
22622 .gbf-product-area .manual-product-buttons button.add-existing-product .add-product-icon {
22623 display: inline-flex;
22624 align-items: center;
22625 justify-content: center;
22626 }
22627 .gbf-product-area .manual-product-buttons button.add-existing-product .add-product-icon svg path {
22628 stroke: #FFFFFF;
22629 }
22630 .gbf-product-area .manual-product-buttons button.create-product-button {
22631 background: #F7F7FA;
22632 border: 1px solid #E5E8F3;
22633 color: #363B4E;
22634 }
22635 .gbf-product-area .manual-product-buttons button.create-product-button:hover {
22636 background: #ECECF5;
22637 border-color: #D5D8E8;
22638 }
22639 .gbf-product-area .manual-product-buttons button.create-product-button .create-product-icon {
22640 display: inline-flex;
22641 align-items: center;
22642 justify-content: center;
22643 }
22644 .gbf-product-area .manual-product-buttons button.create-product-button .create-product-icon svg path {
22645 stroke: #363B4E;
22646 }
22647 .gbf-product-area .wpfnl-field-wrapper.product-list-box {
22648 display: block;
22649 width: 100%;
22650 border: 1px solid #EEF0F3;
22651 margin: 0;
22652 border-radius: 8px;
22653 }
22654 .gbf-product-area .wpfnl-field-wrapper.product-list-box .accordion-head {
22655 border-radius: 8px 8px 0 0;
22656 }
22657 .gbf-product-area .filter-options-section {
22658 align-items: flex-start;
22659 }
22660 .gbf-product-area .filter-options-section .checkbox-group {
22661 display: flex;
22662 flex-direction: column;
22663 gap: 12px;
22664 }
22665 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option {
22666 display: flex;
22667 align-items: center;
22668 gap: 8px;
22669 cursor: pointer;
22670 }
22671 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option input[type=checkbox] {
22672 width: 18px;
22673 height: 18px;
22674 cursor: pointer;
22675 margin: 0;
22676 }
22677 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option input[type=checkbox]:checked::before {
22678 margin: -0.12rem 0 0 -0.2rem;
22679 }
22680 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option span {
22681 font-size: 14px;
22682 color: #363B4E;
22683 user-select: none;
22684 }
22685 .gbf-product-area .fallback-behavior-section {
22686 align-items: flex-start;
22687 }
22688 .gbf-product-area .fallback-behavior-section input[type=radio] {
22689 cursor: pointer;
22690 margin: 0;
22691 }
22692 .gbf-product-area .fallback-behavior-section input[type=radio]:checked {
22693 border-color: #6E42D3;
22694 }
22695 .gbf-product-area .fallback-behavior-section input[type=radio]:checked::before {
22696 background-color: #6E42D3;
22697 }
22698 .gbf-product-area .fallback-behavior-section .fallback-options {
22699 display: flex;
22700 flex-direction: column;
22701 gap: 16px;
22702 }
22703 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option {
22704 display: flex;
22705 align-items: flex-start;
22706 gap: 12px;
22707 padding: 10px 12px;
22708 border: 1px solid #E5E8F3;
22709 border-radius: 8px;
22710 cursor: pointer;
22711 transition: all 0.2s ease;
22712 background: #FFFFFF;
22713 }
22714 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option:hover {
22715 border-color: #6E42D3;
22716 background: #F9F7FD;
22717 }
22718 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option .radio-content {
22719 display: flex;
22720 flex-direction: column;
22721 gap: 4px;
22722 flex: 1;
22723 }
22724 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option .radio-content .radio-title {
22725 font-size: 14px;
22726 color: #363B4E;
22727 font-weight: 500;
22728 }
22729 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option .radio-content .radio-subtitle {
22730 font-size: 13px;
22731 color: #7A8B9A;
22732 font-weight: 400;
22733 }
22734 .gbf-product-area .fallback-behavior-section .default-product-select {
22735 margin-top: 6px;
22736 }
22737 .gbf-product-area .fallback-behavior-section .default-product-select > label {
22738 font-weight: 400;
22739 font-size: 13px;
22740 margin-bottom: 4px;
22741 display: block;
22742 }
22743 .gbf-product-area .gbf-upgrade-overlay {
22744 position: relative;
22745 }
22746 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy {
22747 display: flex;
22748 flex-direction: column;
22749 gap: 16px;
22750 pointer-events: none;
22751 user-select: none;
22752 }
22753 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled select,
22754 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled input[type=number] {
22755 background: #f3f4f6;
22756 cursor: not-allowed;
22757 }
22758 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options {
22759 display: flex;
22760 flex-direction: column;
22761 gap: 16px;
22762 }
22763 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option {
22764 display: flex;
22765 align-items: flex-start;
22766 gap: 12px;
22767 padding: 10px 12px;
22768 border: 1px solid #E5E8F3;
22769 border-radius: 8px;
22770 background: #FFFFFF;
22771 }
22772 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option input[type=radio] {
22773 margin: 0;
22774 flex-shrink: 0;
22775 }
22776 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content {
22777 display: flex;
22778 flex-direction: column;
22779 gap: 4px;
22780 flex: 1;
22781 }
22782 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-title {
22783 font-size: 14px;
22784 color: #363B4E;
22785 font-weight: 500;
22786 }
22787 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-subtitle {
22788 font-size: 13px;
22789 color: #7A8B9A;
22790 font-weight: 400;
22791 }
22792 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-cta {
22793 position: absolute;
22794 right: 0;
22795 top: 0;
22796 width: calc(100% - 230px);
22797 height: 100%;
22798 display: flex;
22799 align-items: center;
22800 background: rgba(255, 255, 255, 0.6);
22801 backdrop-filter: blur(1px);
22802 border-radius: 10px;
22803 padding: 24px;
22804 }
22805 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-cta-inner {
22806 display: flex;
22807 flex-direction: column;
22808 align-items: center;
22809 gap: 10px;
22810 text-align: center;
22811 max-width: 380px;
22812 margin-left: 92px;
22813 }
22814 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-btn {
22815 display: inline-flex;
22816 align-items: center;
22817 gap: 6px;
22818 margin-top: 4px;
22819 padding: 0 20px;
22820 height: 40px;
22821 font-size: 14px;
22822 font-weight: 500;
22823 border-radius: 6px;
22824 text-decoration: none;
22825 cursor: pointer;
22826 transition: all 0.2s ease;
22827 }
22828
22829 .steps-settings.downsell .gbf-offer-product .offer-discount-area,
22830 .steps-settings.upsell .gbf-offer-product .offer-discount-area {
22831 border: none;
22832 }
22833
22834 @media only screen and (max-width: 1199px) {
22835 .gbf-product-area .single-condition .wpfnl-form-group {
22836 width: 100%;
22837 }
22838 .gbf-product-area .single-condition label {
22839 padding-right: 0;
22840 margin-bottom: 5px;
22841 display: block;
22842 }
22843 .gbf-product-area .single-condition .selectbox-wrapper {
22844 width: 100%;
22845 }
22846 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date,
22847 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date {
22848 display: block;
22849 }
22850 }
22851 .gbf-dynamic-funnel-notice {
22852 display: flex;
22853 align-items: flex-start;
22854 gap: 10px;
22855 padding: 12px 14px;
22856 background: #f0f4ff;
22857 border: 1px solid #c7d7fd;
22858 border-radius: 6px;
22859 margin-top: 12px;
22860 }
22861 .gbf-dynamic-funnel-notice svg {
22862 flex-shrink: 0;
22863 margin-top: 2px;
22864 }
22865 .gbf-dynamic-funnel-notice p {
22866 margin: 0;
22867 font-size: 13px;
22868 color: #4b5563;
22869 line-height: 1.5;
22870 }
22871
22872 .gbf-upgrade-overlay {
22873 position: relative;
22874 margin-top: 8px;
22875 border-radius: 10px;
22876 overflow: hidden;
22877 }
22878 .gbf-upgrade-overlay__dummy {
22879 display: flex;
22880 flex-direction: column;
22881 gap: 16px;
22882 filter: blur(3px);
22883 pointer-events: none;
22884 user-select: none;
22885 }
22886 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled {
22887 opacity: 0.6;
22888 }
22889 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled select,
22890 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled input[type=number] {
22891 background: #f3f4f6;
22892 cursor: not-allowed;
22893 }
22894 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options {
22895 display: flex;
22896 flex-direction: column;
22897 gap: 16px;
22898 }
22899 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option {
22900 display: flex;
22901 align-items: flex-start;
22902 gap: 12px;
22903 padding: 10px 12px;
22904 border: 1px solid #E5E8F3;
22905 border-radius: 8px;
22906 background: #FFFFFF;
22907 }
22908 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option input[type=radio] {
22909 margin: 0;
22910 flex-shrink: 0;
22911 }
22912 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content {
22913 display: flex;
22914 flex-direction: column;
22915 gap: 4px;
22916 flex: 1;
22917 }
22918 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-title {
22919 font-size: 14px;
22920 color: #363B4E;
22921 font-weight: 500;
22922 }
22923 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-subtitle {
22924 font-size: 13px;
22925 color: #7A8B9A;
22926 font-weight: 400;
22927 }
22928 .gbf-upgrade-overlay__cta {
22929 position: absolute;
22930 inset: 0;
22931 display: flex;
22932 align-items: center;
22933 justify-content: center;
22934 background: rgba(255, 255, 255, 0.7);
22935 backdrop-filter: blur(2px);
22936 border-radius: 10px;
22937 padding: 24px;
22938 }
22939 .gbf-upgrade-overlay__cta-inner {
22940 display: flex;
22941 flex-direction: column;
22942 align-items: center;
22943 gap: 10px;
22944 text-align: center;
22945 max-width: 380px;
22946 }
22947 .gbf-upgrade-overlay__icon {
22948 display: flex;
22949 align-items: center;
22950 justify-content: center;
22951 }
22952 .gbf-upgrade-overlay__title {
22953 font-size: 16px;
22954 font-weight: 600;
22955 color: #363B4E;
22956 margin: 0;
22957 }
22958 .gbf-upgrade-overlay__desc {
22959 font-size: 13px;
22960 color: #7A8B9A;
22961 line-height: 1.6;
22962 margin: 0;
22963 }
22964 .gbf-upgrade-overlay__btn {
22965 display: inline-flex;
22966 align-items: center;
22967 gap: 6px;
22968 margin-top: 4px;
22969 padding: 0 20px;
22970 height: 40px;
22971 font-size: 14px;
22972 font-weight: 500;
22973 border-radius: 6px;
22974 text-decoration: none;
22975 cursor: pointer;
22976 transition: all 0.2s ease;
22977 }
22978
22979 .gbf-dummy-preview .gbf-not-available-notice {
22980 display: flex;
22981 align-items: flex-start;
22982 gap: 8px;
22983 padding: 10px 14px;
22984 background: #f8f9fb;
22985 border: 1px solid #e5e7eb;
22986 border-radius: 6px;
22987 margin-bottom: 16px;
22988 }
22989 .gbf-dummy-preview .gbf-not-available-notice svg {
22990 flex-shrink: 0;
22991 margin-top: 2px;
22992 }
22993 .gbf-dummy-preview .gbf-not-available-notice p {
22994 margin: 0;
22995 font-size: 13px;
22996 color: #6b7280;
22997 line-height: 1.5;
22998 }
22999 .gbf-dummy-preview .gbf-dummy-disabled {
23000 opacity: 0.45;
23001 pointer-events: none;
23002 user-select: none;
23003 }
23004 .gbf-dummy-preview .gbf-dummy-disabled select,
23005 .gbf-dummy-preview .gbf-dummy-disabled input[type=number] {
23006 background: #f3f4f6;
23007 cursor: not-allowed;
23008 }
23009 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options {
23010 display: flex;
23011 flex-direction: column;
23012 gap: 16px;
23013 }
23014 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option {
23015 display: flex;
23016 align-items: flex-start;
23017 gap: 12px;
23018 padding: 10px 12px;
23019 border: 1px solid #E5E8F3;
23020 border-radius: 8px;
23021 background: #FFFFFF;
23022 }
23023 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option input[type=radio] {
23024 margin: 0;
23025 flex-shrink: 0;
23026 }
23027 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option .radio-content {
23028 display: flex;
23029 flex-direction: column;
23030 gap: 4px;
23031 flex: 1;
23032 }
23033 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-title {
23034 font-size: 14px;
23035 color: #363B4E;
23036 font-weight: 500;
23037 }
23038 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-subtitle {
23039 font-size: 13px;
23040 color: #7A8B9A;
23041 font-weight: 400;
23042 }
23043
23044 .wpfnl-webhook-drawer {
23045 width: calc(100% - 36px);
23046 right: 0;
23047 transition: none;
23048 }
23049 .wpfnl-webhook-drawer .drawer-wrapper {
23050 background: #F6F5FA;
23051 }
23052 .wpfnl-webhook-drawer .drawer-header {
23053 background: #FFFFFF;
23054 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.31) !important;
23055 padding: 15px 24px !important;
23056 justify-content: flex-start;
23057 gap: 14px;
23058 }
23059 .wpfnl-webhook-drawer .drawer-header .wpfnl-drawer-close {
23060 background: #FFFFFF;
23061 border-radius: 10px;
23062 height: 38px;
23063 width: 38px;
23064 display: flex;
23065 flex-flow: column;
23066 align-items: center;
23067 justify-content: center;
23068 cursor: pointer;
23069 border: 1px solid #EEF0F3;
23070 }
23071 .wpfnl-webhook-drawer .drawer-header .drawer-title {
23072 font-weight: 500;
23073 font-size: 16px;
23074 line-height: 1;
23075 }
23076 .wpfnl-webhook-drawer .drawer-header .webhook-search {
23077 margin-left: auto;
23078 }
23079 .wpfnl-webhook-drawer .drawer-header .webhook-search form {
23080 position: relative;
23081 }
23082 .wpfnl-webhook-drawer .drawer-header .webhook-search svg {
23083 position: absolute;
23084 top: 12px;
23085 left: 14px;
23086 }
23087 .wpfnl-webhook-drawer .drawer-header .webhook-search input[type=text] {
23088 padding-left: 34px;
23089 min-width: auto;
23090 width: 194px;
23091 background: #FFFFFF;
23092 border-color: #EEF0F3;
23093 border-radius: 10px;
23094 height: 40px;
23095 }
23096 .wpfnl-webhook-drawer .drawer-header .btn-default {
23097 height: 40px;
23098 line-height: 41px;
23099 display: flex;
23100 align-items: center;
23101 padding: 0 20px;
23102 gap: 7px;
23103 border-radius: 10px;
23104 }
23105 .wpfnl-webhook-drawer .drawer-body {
23106 padding-top: 40px;
23107 }
23108 .wpfnl-webhook-drawer .drawer-body .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
23109 margin-left: 3px;
23110 position: relative;
23111 top: -1px;
23112 }
23113 .wpfnl-webhook-drawer .webhook-content {
23114 background: #FFFFFF;
23115 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
23116 border-radius: 10px;
23117 position: relative;
23118 }
23119 .wpfnl-webhook-drawer .drawer-footer {
23120 border-top: 1px solid #EEF0F3;
23121 padding: 20px 0 20px;
23122 margin-top: 30px;
23123 display: flex;
23124 flex-flow: row wrap;
23125 align-items: center;
23126 justify-content: flex-end;
23127 gap: 14px;
23128 position: relative;
23129 }
23130 .wpfnl-webhook-drawer .drawer-footer .btn-default {
23131 display: flex;
23132 flex-flow: row;
23133 align-items: center;
23134 justify-content: center;
23135 line-height: 41px;
23136 height: 40px;
23137 padding: 2px 20px 0;
23138 min-width: auto;
23139 }
23140 .wpfnl-webhook-drawer .drawer-footer .btn-default .wpfnl-loader {
23141 display: inline-block;
23142 }
23143 .wpfnl-webhook-drawer .drawer-footer .btn-default[disabled] {
23144 opacity: 0.6;
23145 display: flex;
23146 align-items: center;
23147 gap: 10px;
23148 cursor: not-allowed;
23149 }
23150 .wpfnl-webhook-drawer .drawer-footer .cancel-btn {
23151 background: transparent;
23152 box-shadow: 0 0 0 1px #E4E6EB;
23153 color: #3C3F47;
23154 }
23155 .wpfnl-webhook-drawer .drawer-footer .wpfnl-alert {
23156 display: inline-block;
23157 padding: 10px 20px;
23158 }
23159 .wpfnl-webhook-drawer .no-webhook-data {
23160 height: 550px;
23161 display: flex;
23162 flex-flow: column;
23163 align-items: center;
23164 justify-content: center;
23165 gap: 40px;
23166 font-weight: 500;
23167 font-size: 18px;
23168 line-height: 1;
23169 color: #363B4E;
23170 }
23171 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list,
23172 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header {
23173 display: flex;
23174 flex-flow: row wrap;
23175 align-items: center;
23176 justify-content: space-between;
23177 gap: 15px;
23178 }
23179 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .name-field,
23180 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .name-field {
23181 width: calc((80% - 135px) / 2);
23182 max-width: 300px;
23183 color: #363B4E;
23184 font-weight: 500;
23185 }
23186 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .request-url-field,
23187 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .request-url-field {
23188 width: calc((80% - 135px) / 2);
23189 }
23190 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field,
23191 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .status-field {
23192 width: 92px;
23193 margin-left: auto;
23194 }
23195 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field,
23196 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .action-field {
23197 width: 74px;
23198 text-align: center;
23199 }
23200 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header {
23201 padding: 13px 24px;
23202 border-bottom: 1px solid #E5E8F3;
23203 }
23204 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .name-field {
23205 color: #7A8B9A;
23206 font-weight: 400;
23207 }
23208 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list {
23209 padding: 15px 24px;
23210 border-bottom: 1px solid #E5E8F3;
23211 }
23212 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list:last-child {
23213 border-bottom: 0;
23214 }
23215 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list.no-data {
23216 text-align: center;
23217 display: block;
23218 }
23219 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .request-url-field {
23220 word-break: break-all;
23221 }
23222 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field .wpfnl-loader {
23223 display: block;
23224 position: absolute;
23225 top: 1px;
23226 left: 30px;
23227 }
23228 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field button {
23229 border: none;
23230 cursor: pointer;
23231 text-align: center;
23232 padding: 0 6px;
23233 display: inline-block;
23234 height: 30px;
23235 line-height: 30px;
23236 background-color: transparent;
23237 margin-left: 2px;
23238 }
23239 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field button svg {
23240 position: relative;
23241 top: 4px;
23242 }
23243
23244 .webhook-settings-drawer {
23245 width: 860px;
23246 }
23247 .webhook-settings-drawer .drawer-wrapper {
23248 background: #fff;
23249 }
23250 .webhook-settings-drawer .drawer-wrapper .drawer-body {
23251 padding-top: 0;
23252 }
23253 .webhook-settings-drawer .drawer-wrapper .drawer-header {
23254 justify-content: space-between;
23255 box-shadow: none !important;
23256 padding: 16px 30px 15px 30px !important;
23257 }
23258 .webhook-settings-drawer .webhook-settings-content {
23259 background: #FFFFFF;
23260 border-radius: 0;
23261 border-top: 1px solid #EEF0F3;
23262 }
23263 .webhook-settings-drawer .wpfnl-field-wrapper {
23264 margin-bottom: 20px;
23265 }
23266 .webhook-settings-drawer .wpfnl-field-wrapper:last-child {
23267 margin-bottom: 0;
23268 }
23269 .webhook-settings-drawer .wpfnl-field-wrapper > label {
23270 width: 170px;
23271 }
23272 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-fields .link-icon {
23273 position: absolute;
23274 top: 0;
23275 width: 38px;
23276 height: 38px;
23277 display: flex;
23278 align-items: center;
23279 justify-content: center;
23280 border-right: 1px solid #EEF0F3;
23281 }
23282 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-fields .hints {
23283 color: #e65555;
23284 display: none;
23285 }
23286 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date],
23287 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search],
23288 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url],
23289 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel],
23290 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number],
23291 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password],
23292 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email],
23293 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text],
23294 .webhook-settings-drawer .wpfnl-field-wrapper select {
23295 height: 38px;
23296 border-color: #EEF0F3;
23297 color: #363B4E;
23298 letter-spacing: -0.01em;
23299 font-weight: 400;
23300 }
23301 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]:-webkit-autofill,
23302 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]:-webkit-autofill,
23303 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]:-webkit-autofill,
23304 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]:-webkit-autofill,
23305 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]:-webkit-autofill,
23306 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]:-webkit-autofill,
23307 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]:-webkit-autofill,
23308 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]:-webkit-autofill,
23309 .webhook-settings-drawer .wpfnl-field-wrapper select:-webkit-autofill {
23310 -webkit-box-shadow: 0 0 0 30px #ffffff inset;
23311 box-shadow: 0 0 0 30px #ffffff inset;
23312 -webkit-text-fill-color: #363B4E !important;
23313 }
23314 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]::-webkit-input-placeholder,
23315 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]::-webkit-input-placeholder,
23316 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]::-webkit-input-placeholder,
23317 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]::-webkit-input-placeholder,
23318 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]::-webkit-input-placeholder,
23319 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]::-webkit-input-placeholder,
23320 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]::-webkit-input-placeholder,
23321 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]::-webkit-input-placeholder,
23322 .webhook-settings-drawer .wpfnl-field-wrapper select::-webkit-input-placeholder {
23323 color: #A7A8B3;
23324 }
23325 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]::-moz-placeholder,
23326 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]::-moz-placeholder,
23327 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]::-moz-placeholder,
23328 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]::-moz-placeholder,
23329 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]::-moz-placeholder,
23330 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]::-moz-placeholder,
23331 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]::-moz-placeholder,
23332 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]::-moz-placeholder,
23333 .webhook-settings-drawer .wpfnl-field-wrapper select::-moz-placeholder {
23334 color: #A7A8B3;
23335 }
23336 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]:-ms-input-placeholder,
23337 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]:-ms-input-placeholder,
23338 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]:-ms-input-placeholder,
23339 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]:-ms-input-placeholder,
23340 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]:-ms-input-placeholder,
23341 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]:-ms-input-placeholder,
23342 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]:-ms-input-placeholder,
23343 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]:-ms-input-placeholder,
23344 .webhook-settings-drawer .wpfnl-field-wrapper select:-ms-input-placeholder {
23345 color: #A7A8B3;
23346 }
23347 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]:-moz-placeholder,
23348 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]:-moz-placeholder,
23349 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]:-moz-placeholder,
23350 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]:-moz-placeholder,
23351 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]:-moz-placeholder,
23352 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]:-moz-placeholder,
23353 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]:-moz-placeholder,
23354 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]:-moz-placeholder,
23355 .webhook-settings-drawer .wpfnl-field-wrapper select:-moz-placeholder {
23356 color: #A7A8B3;
23357 }
23358 .webhook-settings-drawer .wpfnl-field-wrapper select {
23359 color: #A7A8B3;
23360 max-width: 240px;
23361 width: 100%;
23362 padding-right: 36px;
23363 -moz-appearance: none;
23364 -webkit-appearance: none;
23365 appearance: none;
23366 background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgNyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTAuODEzIDFsLTQuNSA0LjUtNC41LTQuNSIvPjwvc3ZnPg==");
23367 background-repeat: no-repeat;
23368 background-position-x: calc(100% - 13px);
23369 background-position-y: 13px;
23370 background-size: 12px 12px;
23371 }
23372 .webhook-settings-drawer .wpfnl-field-wrapper select.value-selected {
23373 color: #363B4E;
23374 }
23375 .webhook-settings-drawer .wpfnl-field-wrapper select option {
23376 color: #A7A8B3;
23377 }
23378 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-tooltip p {
23379 min-width: 160px;
23380 }
23381 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-custom-single-select {
23382 width: 240px;
23383 }
23384 .webhook-settings-drawer .feed-name .wpfnl-tooltip p {
23385 left: calc(100% + 8px);
23386 transform: translate(0, 50%);
23387 bottom: 50%;
23388 }
23389 .webhook-settings-drawer .feed-name .wpfnl-tooltip p:before {
23390 left: -4px;
23391 bottom: 50%;
23392 margin: 0 0px -6px 0px;
23393 }
23394 .webhook-settings-drawer .request-url input[type=text] {
23395 padding-left: 50px;
23396 }
23397 .webhook-settings-drawer .primary-settings {
23398 padding: 30px 0;
23399 }
23400 .webhook-settings-drawer .additional-settings {
23401 padding-top: 30px;
23402 }
23403 .webhook-settings-drawer .request-header-settings,
23404 .webhook-settings-drawer .primary-settings {
23405 border-bottom: 1px solid #EEF0F3;
23406 }
23407 .webhook-settings-drawer .primary-settings .request-formate .wpfnl-fields,
23408 .webhook-settings-drawer .primary-settings .request-method .wpfnl-fields {
23409 max-width: 100%;
23410 }
23411 .webhook-settings-drawer .request-header {
23412 align-items: flex-start;
23413 }
23414 .webhook-settings-drawer .request-header > label {
23415 position: relative;
23416 top: 34px;
23417 }
23418 .webhook-settings-drawer .request-body-loop-wrapper .loop-header,
23419 .webhook-settings-drawer .request-body-loop-wrapper .single-loop {
23420 display: flex;
23421 flex-flow: row wrap;
23422 align-items: flex-start;
23423 margin-bottom: 14px;
23424 gap: 10px;
23425 }
23426 .webhook-settings-drawer .request-body-loop-wrapper .loop-header:last-child,
23427 .webhook-settings-drawer .request-body-loop-wrapper .single-loop:last-child {
23428 margin-bottom: 0;
23429 }
23430 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .value,
23431 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .name,
23432 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .value,
23433 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .name {
23434 width: calc(50% - 29px);
23435 }
23436 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .value .crm-data-loader,
23437 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .value .crm-data-loader {
23438 width: calc(100% - 13px);
23439 left: 2px;
23440 }
23441 .webhook-settings-drawer .request-body-loop-wrapper .loop-header input,
23442 .webhook-settings-drawer .request-body-loop-wrapper .loop-header select,
23443 .webhook-settings-drawer .request-body-loop-wrapper .single-loop input,
23444 .webhook-settings-drawer .request-body-loop-wrapper .single-loop select {
23445 min-width: auto;
23446 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
23447 border-radius: 6px;
23448 border: none;
23449 max-width: 100%;
23450 }
23451 .webhook-settings-drawer .request-body-loop-wrapper .loop-header {
23452 margin-bottom: 8px;
23453 }
23454 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .value,
23455 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .name {
23456 font-size: 14px;
23457 line-height: 1.2;
23458 font-weight: 500;
23459 color: #363B4E;
23460 }
23461 .webhook-settings-drawer .request-body-loop-wrapper .single-loop {
23462 background: #F6F5FA;
23463 border-radius: 10px;
23464 padding: 16px;
23465 }
23466 .webhook-settings-drawer .request-body-loop-wrapper .single-loop.only-one .value,
23467 .webhook-settings-drawer .request-body-loop-wrapper .single-loop.only-one .name {
23468 width: calc(50% - 5px);
23469 }
23470 .webhook-settings-drawer .request-body-loop-wrapper .single-loop.only-one .actions {
23471 display: none;
23472 }
23473 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .wpfnl-custom-single-select .custom-select-wrapper {
23474 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
23475 border: none;
23476 }
23477 .webhook-settings-drawer .request-body-loop-wrapper .actions button {
23478 border: none;
23479 line-height: 1;
23480 padding: 3px;
23481 cursor: pointer;
23482 background: #FFFFFF;
23483 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
23484 border-radius: 6px;
23485 width: 38px;
23486 height: 38px;
23487 display: flex;
23488 flex-flow: column;
23489 align-items: center;
23490 justify-content: center;
23491 }
23492 .webhook-settings-drawer .request-body-loop-wrapper .actions button svg {
23493 display: block;
23494 }
23495 .webhook-settings-drawer .request-body-loop-wrapper .add-option-area {
23496 border: 1px dashed #C1C6CD;
23497 border-radius: 10px;
23498 padding: 20px;
23499 display: flex;
23500 flex-flow: column;
23501 align-items: center;
23502 justify-content: center;
23503 }
23504 .webhook-settings-drawer .request-body-loop-wrapper .add-option-area .add-option {
23505 display: flex;
23506 align-items: center;
23507 justify-content: center;
23508 gap: 8px;
23509 padding: 2px 25px 0 25px;
23510 line-height: 1;
23511 }
23512 .webhook-settings-drawer .request-body-loop-wrapper .add-option-area .add-option svg {
23513 width: 12px;
23514 height: 12px;
23515 }
23516 .webhook-settings-drawer .request-body-loop-wrapper.data-loaded .single-loop .value .crm-data-loader {
23517 display: none;
23518 }
23519 .webhook-settings-drawer .additional-settings .webhook-event .wpfnl-fields {
23520 max-width: 100%;
23521 }
23522 .webhook-settings-drawer .additional-settings .request-body {
23523 align-items: flex-start;
23524 }
23525 .webhook-settings-drawer .additional-settings .request-body > label {
23526 position: relative;
23527 top: 2px;
23528 width: 180px;
23529 }
23530 .webhook-settings-drawer .additional-settings .request-body > .wpfnl-fields {
23531 max-width: 100%;
23532 width: calc(100% - 180px);
23533 }
23534 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn {
23535 margin-bottom: 10px;
23536 display: block;
23537 }
23538 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label {
23539 font-size: 13px;
23540 color: #363B4E;
23541 }
23542 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label::before {
23543 background: #F6F5FA;
23544 border-color: #EEF0F3;
23545 width: 20px;
23546 height: 20px;
23547 }
23548 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label::after {
23549 left: 6px;
23550 top: 3px;
23551 width: 8px;
23552 height: 8px;
23553 }
23554 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn input[type=radio]:checked + label::before {
23555 background: #6E42D3;
23556 }
23557 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn input[type=radio]:checked + label::after {
23558 background: #ffffff;
23559 }
23560 .webhook-settings-drawer .additional-settings .request-body .request-body-loop-wrapper {
23561 margin-top: 20px;
23562 border: 1px solid #EEF0F3;
23563 border-radius: 10px;
23564 padding: 16px 20px 20px;
23565 }
23566
23567 @media only screen and (max-width: 1699px) {
23568 .wpfnl-webhook-drawer .webhook-content {
23569 max-width: 1280px;
23570 width: 100%;
23571 margin: 0 auto;
23572 }
23573 }
23574 @media only screen and (max-width: 991px) {
23575 .webhook-settings-drawer {
23576 width: 700px;
23577 }
23578 }
23579 @media only screen and (max-width: 782px) {
23580 .wpfnl-webhook-drawer {
23581 width: 100%;
23582 }
23583 }
23584 .wpfnl-settings-drawer .drawer-body {
23585 background: #f6f5fa;
23586 }
23587 .wpfnl-settings-drawer .fnl-settings-content {
23588 margin-top: 30px;
23589 }
23590 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-field-wrapper > label {
23591 width: 310px;
23592 }
23593 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-field-wrapper .wpfnl-fields {
23594 max-width: 350px;
23595 width: calc(100% - 350px);
23596 }
23597 .wpfnl-settings-drawer .fnl-settings-content .settings-title {
23598 padding: 16px 24px;
23599 display: flex;
23600 flex-flow: row wrap;
23601 align-items: center;
23602 font-weight: 500;
23603 color: #363B4E;
23604 text-transform: capitalize;
23605 box-shadow: 0px 2px 4px rgba(220, 220, 237, 0.4);
23606 background: #ffffff;
23607 border-radius: 10px 10px 0 0;
23608 position: relative;
23609 }
23610 .wpfnl-settings-drawer .fnl-settings-content .settings-title > svg {
23611 margin-right: 10px;
23612 }
23613 .wpfnl-settings-drawer .fnl-settings-content .settings-title a {
23614 line-height: 1;
23615 position: relative;
23616 top: 3px;
23617 margin-left: auto;
23618 }
23619 .wpfnl-settings-drawer .fnl-settings-content .settings-title a svg {
23620 width: 20px;
23621 height: 20px;
23622 }
23623 .wpfnl-settings-drawer .fnl-settings-content .settings-title a svg path {
23624 stroke: #6E42D3;
23625 }
23626 .wpfnl-settings-drawer .fnl-settings-content .hints {
23627 width: 100%;
23628 display: block;
23629 color: #f68a40;
23630 }
23631 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-box {
23632 background: #ffffff;
23633 border-radius: 10px;
23634 padding: 30px;
23635 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
23636 }
23637 .wpfnl-settings-drawer .fnl-settings-content .pro-tag-icon {
23638 transform: translateY(6px);
23639 margin-left: 0px;
23640 position: static;
23641 display: inline-block;
23642 }
23643 .wpfnl-settings-drawer .fnl-settings-content .settings-title + .wpfnl-box {
23644 border-radius: 0 0 10px 10px;
23645 }
23646 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-checkbox.disabled > label {
23647 cursor: not-allowed;
23648 opacity: 0.5;
23649 }
23650 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-checkbox.disabled > label:before {
23651 background-color: #d7d7d7;
23652 }
23653 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm {
23654 display: flex;
23655 flex-flow: row wrap;
23656 }
23657 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper {
23658 display: block;
23659 width: 50%;
23660 padding-right: 30px;
23661 }
23662 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper > label {
23663 width: auto;
23664 margin-bottom: 8px;
23665 display: block;
23666 padding: 0;
23667 }
23668 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper .wpfnl-fields {
23669 max-width: 100%;
23670 width: 100%;
23671 }
23672 .wpfnl-settings-drawer .settings-content__footer {
23673 border-top: 1px solid #E2E5ED;
23674 padding: 20px 0 20px;
23675 margin-top: 30px;
23676 display: flex;
23677 flex-flow: row wrap;
23678 align-items: center;
23679 justify-content: flex-end;
23680 position: relative;
23681 }
23682 .wpfnl-settings-drawer .settings-content__footer .update {
23683 display: flex;
23684 flex-flow: row;
23685 align-items: center;
23686 justify-content: center;
23687 line-height: 39px;
23688 }
23689 .wpfnl-settings-drawer .settings-content__footer .wpfnl-alert {
23690 display: inline-block;
23691 margin-right: 10px;
23692 }
23693 .wpfnl-settings-drawer .settings-content__footer .wpfnl-loader {
23694 display: inline-block;
23695 }
23696
23697 .wpfnl-automations {
23698 position: relative;
23699 }
23700 .wpfnl-automations::before {
23701 content: "";
23702 position: absolute;
23703 top: 0;
23704 left: 0;
23705 pointer-events: none;
23706 background: linear-gradient(188deg, #E8E2FF 6.05%, #FFF 95.27%);
23707 height: 650px;
23708 width: 100%;
23709 }
23710 .wpfnl-automations .wpfnl-automation-hero {
23711 display: flex;
23712 flex-flow: row wrap;
23713 align-items: flex-start;
23714 gap: 40px;
23715 justify-content: space-between;
23716 max-width: 950px;
23717 margin: 0 auto;
23718 width: 100%;
23719 padding-top: 84px;
23720 margin-bottom: 60px;
23721 }
23722 .wpfnl-automations .wpfnl-automation-hero .wpfnl-automation-hero-left {
23723 width: 50%;
23724 max-width: 500px;
23725 }
23726 .wpfnl-automations .wpfnl-automation-hero .wpfnl-automation-hero-right {
23727 width: 240px;
23728 }
23729 .wpfnl-automations .wpfnl-automation-hero .hero-title {
23730 color: #1D2327;
23731 font-size: 40px;
23732 font-weight: 700;
23733 line-height: 1.15;
23734 margin-bottom: 10px;
23735 }
23736 .wpfnl-automations .wpfnl-automation-hero .hero-description {
23737 color: #1F2937;
23738 font-size: 16px;
23739 font-weight: 400;
23740 line-height: 1.5;
23741 margin-bottom: 20px;
23742 }
23743 .wpfnl-automations .wpfnl-automation-hero .cta-buttons {
23744 display: flex;
23745 gap: 8px;
23746 }
23747 .wpfnl-automations .wpfnl-automation-hero .btn-default {
23748 height: auto;
23749 line-height: 1;
23750 padding: 17px 22px;
23751 border: 1px solid transparent;
23752 display: inline-flex;
23753 gap: 6px;
23754 }
23755 .wpfnl-automations .wpfnl-automation-hero .btn-default .btn-text {
23756 font-size: 14px;
23757 display: block;
23758 color: #fff;
23759 font-weight: 500;
23760 line-height: 1;
23761 }
23762 .wpfnl-automations .wpfnl-automation-hero .btn-default.outline {
23763 background: #eee;
23764 border-color: #d8d8d8;
23765 color: #1e2327;
23766 }
23767 .wpfnl-automations .wpfnl-automation-hero .btn-default.outline .btn-text {
23768 color: #1e2327;
23769 }
23770 .wpfnl-automations .wpfnl-automation-hero .loader svg {
23771 display: block;
23772 }
23773 .wpfnl-automations .wpfnl-automation-hero .rating {
23774 color: #1F2937;
23775 font-size: 13px;
23776 font-weight: 400;
23777 line-height: 1;
23778 border-radius: 40px;
23779 border: 1px solid #D3CAF3;
23780 padding: 7px 10px;
23781 display: inline-flex;
23782 align-items: center;
23783 gap: 5px;
23784 }
23785 .wpfnl-automations .wpfnl-automation-hero .feature-list {
23786 display: flex;
23787 flex-flow: column;
23788 gap: 20px;
23789 margin-top: 23px;
23790 }
23791 .wpfnl-automations .wpfnl-automation-hero .feature-list li {
23792 color: #1F2937;
23793 font-size: 15px;
23794 font-weight: 400;
23795 line-height: 1.1;
23796 position: relative;
23797 padding-left: 26px;
23798 }
23799 .wpfnl-automations .wpfnl-automation-hero .feature-list li::before {
23800 content: "";
23801 position: absolute;
23802 top: 0;
23803 left: 0;
23804 width: 18px;
23805 height: 18px;
23806 background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1IDQuNUw2Ljc1IDEyLjc1TDMgOSIgc3Ryb2tlPSIjNkU0MkQzIiBzdHJva2Utd2lkdGg9IjEuOCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
23807 }
23808
23809 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-left {
23810 margin-bottom: 0 !important;
23811 }
23812 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-left .wpfnl-dashboard-title {
23813 color: #363B4E;
23814 font-size: 20px;
23815 font-style: normal;
23816 font-weight: 600;
23817 line-height: 1.1;
23818 }
23819 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-right {
23820 display: flex;
23821 align-items: center;
23822 gap: 15px;
23823 }
23824 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-right .funnel-search,
23825 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-right .import-export {
23826 margin: 0;
23827 }
23828 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .hero-section .hero-video-container {
23829 position: relative;
23830 padding: 0 15px 553px 15px;
23831 height: 0;
23832 overflow: hidden;
23833 border-radius: 24px;
23834 max-width: 950px;
23835 width: 100%;
23836 margin: 0 auto;
23837 border: 6px solid #FFFFFF;
23838 }
23839 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .hero-section .hero-video-container iframe {
23840 position: absolute;
23841 top: 0;
23842 left: 0;
23843 width: 100%;
23844 height: 553px;
23845 }
23846 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section {
23847 margin-bottom: 80px;
23848 margin-top: 80px;
23849 }
23850 @media (max-width: 1199px) {
23851 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section {
23852 margin-bottom: 60px;
23853 margin-top: 60px;
23854 }
23855 }
23856 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container {
23857 max-width: 1440px;
23858 margin: 0 auto;
23859 padding: 0 15px;
23860 }
23861 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .section-title {
23862 color: #1D2327;
23863 text-align: center;
23864 font-size: 30px;
23865 font-weight: 700;
23866 line-height: 1.2;
23867 margin-bottom: 40px;
23868 }
23869 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid {
23870 display: grid;
23871 grid-template-columns: repeat(2, 1fr);
23872 gap: 20px;
23873 max-width: 846px;
23874 width: 100%;
23875 margin: 0 auto;
23876 }
23877 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card {
23878 background: #ffffff;
23879 border-radius: 20px;
23880 padding: 40px;
23881 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
23882 transition: transform 0.3s ease, box-shadow 0.3s ease;
23883 }
23884 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card:hover {
23885 transform: translateY(-0.5px);
23886 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
23887 }
23888 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card .feature-title {
23889 color: #363B4E;
23890 font-size: 18px;
23891 font-style: normal;
23892 font-weight: 600;
23893 line-height: 1.1;
23894 margin: 22px 0 10px;
23895 }
23896 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card .feature-description {
23897 color: #7A8B9A;
23898 font-size: 15px;
23899 font-style: normal;
23900 font-weight: 400;
23901 line-height: 1.6;
23902 }
23903 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-footer {
23904 color: #363B4E;
23905 text-align: center;
23906 font-size: 20px;
23907 font-style: normal;
23908 font-weight: 700;
23909 line-height: 1.2;
23910 margin-top: 30px;
23911 }
23912 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section {
23913 margin: 0 15px;
23914 }
23915 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container {
23916 display: flex;
23917 align-items: center;
23918 justify-content: space-between;
23919 gap: 40px;
23920 max-width: 950px;
23921 width: 100%;
23922 margin: 0 auto 64px;
23923 border-radius: 30px;
23924 background: linear-gradient(180deg, #08020C 0%, #2C0C47 56.01%, #4D157C 100%);
23925 padding: 56px 60px;
23926 position: relative;
23927 overflow: hidden;
23928 }
23929 @media (max-width: 1399px) {
23930 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container {
23931 margin-bottom: 50px;
23932 }
23933 }
23934 @media (max-width: 1199px) {
23935 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container {
23936 padding: 36px 40px;
23937 border-radius: 20px;
23938 }
23939 }
23940 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container::before {
23941 content: "";
23942 position: absolute;
23943 top: 0;
23944 left: 0;
23945 right: 0;
23946 bottom: 0;
23947 background: url("../images/automation-cta-bg.webp") no-repeat center center;
23948 background-size: cover;
23949 opacity: 0.3;
23950 pointer-events: none;
23951 z-index: -1;
23952 }
23953 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text {
23954 width: calc(100% - 260px);
23955 max-width: 470px;
23956 }
23957 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text .cta-title {
23958 font-weight: 600;
23959 font-size: 30px;
23960 line-height: 1.33;
23961 color: #ffffff;
23962 margin-bottom: 16px;
23963 }
23964 @media (max-width: 1199px) {
23965 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text .cta-title {
23966 font-size: 26px;
23967 }
23968 }
23969 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text .cta-subtitle {
23970 font-weight: 400;
23971 font-size: 15px;
23972 line-height: 1.6;
23973 color: rgba(255, 255, 255, 0.9);
23974 }
23975 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper {
23976 width: 218px;
23977 display: flex;
23978 align-items: center;
23979 justify-content: end;
23980 }
23981 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn {
23982 padding: 12px 24px;
23983 border-radius: 10px;
23984 font-weight: 500;
23985 font-size: 16px;
23986 cursor: pointer;
23987 border: none;
23988 transition: all 0.3s ease;
23989 font-style: normal;
23990 line-height: normal;
23991 display: inline-block;
23992 }
23993 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn:hover {
23994 transform: translateY(-2px);
23995 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
23996 }
23997 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn-primary {
23998 background: #ffffff;
23999 color: #6E41D3;
24000 box-shadow: 0 2px 4px rgba(223, 223, 249, 0.25);
24001 }
24002 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn-primary:hover {
24003 color: rgb(94.9871244635, 47.4935622318, 204.0064377682);
24004 }
24005 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-name {
24006 width: 240px;
24007 }
24008 @media (max-width: 1199px) {
24009 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-name {
24010 width: 180px;
24011 }
24012 }
24013 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-customers {
24014 display: flex;
24015 flex-flow: row wrap;
24016 align-items: center;
24017 gap: 8px;
24018 width: 375px;
24019 }
24020 @media (max-width: 1199px) {
24021 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-customers {
24022 width: 270px;
24023 }
24024 }
24025 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-status {
24026 width: 75px;
24027 position: relative;
24028 }
24029 @media (max-width: 1199px) {
24030 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-status {
24031 width: 60px;
24032 }
24033 }
24034 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .list-action {
24035 display: flex;
24036 flex-flow: row;
24037 align-items: center;
24038 width: 80px;
24039 gap: 9px;
24040 }
24041 @media (max-width: 1199px) {
24042 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .list-action {
24043 width: 80px;
24044 }
24045 }
24046 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list.list-header .list-cell {
24047 color: #7A8B9A;
24048 font-family: Roboto;
24049 font-size: 14px;
24050 font-style: normal;
24051 font-weight: 400;
24052 line-height: normal;
24053 }
24054 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list.list-header .list-cell.wpfnl-name {
24055 padding: 0;
24056 }
24057 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list.list-body .list-cell.wpfnl-customers {
24058 display: flex;
24059 align-items: center;
24060 gap: 5px;
24061 }
24062 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list.list-body .list-cell.wpfnl-customers .customers-count {
24063 display: flex;
24064 align-items: center;
24065 gap: 6px;
24066 padding: 8px 12px;
24067 border: 1px solid #EEF0F3;
24068 border-radius: 100px;
24069 }
24070 @media (max-width: 1199px) {
24071 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list.list-body .list-cell.wpfnl-customers .customers-count {
24072 padding: 6px 10px;
24073 }
24074 }
24075 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list.list-body .list-cell.wpfnl-customers .customers-count span {
24076 color: #7A8B9A;
24077 font-size: 13px;
24078 font-style: normal;
24079 font-weight: 400;
24080 line-height: 1.08;
24081 }
24082 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer {
24083 display: flex;
24084 flex-flow: row wrap;
24085 align-items: center;
24086 justify-content: space-between;
24087 padding: 17px 24px;
24088 }
24089 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer .pagination-number p {
24090 display: flex;
24091 align-items: center;
24092 gap: 10px;
24093 white-space: nowrap;
24094 }
24095 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer .pagination-number p select {
24096 width: 56px;
24097 min-width: auto;
24098 padding: 2px 8px;
24099 height: 32px;
24100 }
24101 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer .pagination .wpfnl-pagination {
24102 display: flex;
24103 align-items: center;
24104 justify-content: center;
24105 }
24106 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
24107 padding: 95px 85px;
24108 background: #FFFFFF;
24109 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
24110 border-radius: 10px;
24111 display: flex;
24112 gap: 20px;
24113 }
24114 @media (max-width: 1550px) {
24115 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
24116 padding: 40px;
24117 }
24118 }
24119 @media (max-width: 1399px) {
24120 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
24121 flex-direction: column;
24122 }
24123 }
24124 @media (max-width: 1199px) {
24125 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
24126 padding: 30px;
24127 }
24128 }
24129 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper {
24130 border: 1px solid #EEF0F3;
24131 border-radius: 10px;
24132 flex: 1;
24133 }
24134 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-card-wrapper {
24135 border-radius: 10px 10px 0 0;
24136 background: #F6F5FA;
24137 display: grid;
24138 grid-template-columns: repeat(2, 1fr);
24139 gap: 10px;
24140 padding: 20px;
24141 border-bottom: 1px solid #EEF0F3;
24142 }
24143 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-card-wrapper.feature-card-img {
24144 display: flex;
24145 align-items: center;
24146 justify-content: center;
24147 padding: 26px;
24148 }
24149 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-card-wrapper.feature-card-img img {
24150 max-width: 433px;
24151 width: 100%;
24152 }
24153 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-card-wrapper .single-card {
24154 background: #ffffff;
24155 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
24156 border-radius: 10px;
24157 padding: 20px;
24158 }
24159 @media (max-width: 1550px) {
24160 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-card-wrapper .single-card {
24161 padding: 17px;
24162 }
24163 }
24164 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-card-wrapper .single-card .card-title {
24165 color: #2D3149;
24166 font-size: 14px;
24167 font-style: normal;
24168 font-weight: 600;
24169 line-height: 1.14;
24170 letter-spacing: -0.14px;
24171 margin: 10px 0;
24172 }
24173 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-text-wrapper {
24174 padding: 30px;
24175 }
24176 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-text-wrapper .feature-heading {
24177 color: #2D3149;
24178 font-size: 18px;
24179 text-align: center;
24180 font-style: normal;
24181 font-weight: 700;
24182 line-height: 1.2;
24183 margin-bottom: 14px;
24184 }
24185 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper .feature-text-wrapper .feature-des {
24186 color: #7A8B9A;
24187 text-align: center;
24188 font-size: 14px;
24189 font-style: normal;
24190 font-weight: 400;
24191 line-height: 1.5;
24192 max-width: 372px;
24193 width: 100%;
24194 margin: 0 auto;
24195 }
24196
24197 @media screen and (max-width: 1399px) {
24198 .wpfnl-automations .wpfnl-automation-hero {
24199 padding-top: 54px;
24200 }
24201 .wpfnl-automations .wpfnl-automation-hero .hero-title {
24202 font-size: 34px;
24203 }
24204 }
24205 @media screen and (max-width: 1199px) {
24206 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .hero-section .hero-video-container {
24207 padding: 0 15px 493px 15px;
24208 }
24209 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .section-title {
24210 font-size: 24px;
24211 margin-bottom: 25px;
24212 }
24213 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card {
24214 padding: 26px;
24215 border-radius: 14px;
24216 }
24217 }
24218 .wpfnl-integrations {
24219 width: 100%;
24220 margin-top: 20px;
24221 padding-bottom: 40px;
24222 }
24223 .wpfnl-integrations .dashboard-nav__content {
24224 max-width: 1200px;
24225 }
24226 .wpfnl-integrations .integration-section-title {
24227 color: #1D2327;
24228 font-size: 20px;
24229 font-weight: 600;
24230 line-height: 1.2;
24231 margin-bottom: 30px;
24232 display: flex;
24233 align-items: center;
24234 gap: 10px;
24235 }
24236 .wpfnl-integrations .integrations-content {
24237 margin-top: 30px;
24238 }
24239 .wpfnl-integrations .integrations-banner {
24240 background-color: #171427;
24241 background-image: url("../images/integration-banner-bg.webp");
24242 background-size: cover;
24243 background-position: center;
24244 background-repeat: no-repeat;
24245 border-radius: 20px;
24246 padding: 30px;
24247 display: flex;
24248 flex-direction: column;
24249 align-items: center;
24250 justify-content: center;
24251 text-align: center;
24252 height: 303px;
24253 overflow: hidden;
24254 position: relative;
24255 }
24256 .wpfnl-integrations .integrations-banner .circle-blur {
24257 position: absolute;
24258 top: 50%;
24259 left: 50%;
24260 width: 570px;
24261 height: 550px;
24262 background: #6E42D3;
24263 filter: blur(250px);
24264 border-radius: 50%;
24265 transform: translate(-50%, -50%);
24266 display: block;
24267 z-index: 0;
24268 }
24269 .wpfnl-integrations .integrations-banner .banner-title {
24270 color: #FFF;
24271 font-size: 30px;
24272 font-weight: 600;
24273 line-height: 1.2;
24274 position: relative;
24275 z-index: 1;
24276 }
24277 .wpfnl-integrations .integrations-banner .banner-description {
24278 color: #FFF;
24279 font-size: 14px;
24280 font-weight: 400;
24281 line-height: 1.5;
24282 max-width: 618px;
24283 margin: 9px auto 0;
24284 position: relative;
24285 z-index: 1;
24286 }
24287 .wpfnl-integrations .integrations-banner .banner-cta-btn {
24288 color: #442D81;
24289 font-size: 17px;
24290 font-weight: 500;
24291 line-height: 1;
24292 border-radius: 10px;
24293 background: #FFF;
24294 padding: 12px 25px;
24295 margin-top: 24px;
24296 display: flex;
24297 align-items: center;
24298 justify-content: center;
24299 gap: 6px;
24300 position: relative;
24301 z-index: 1;
24302 }
24303 .wpfnl-integrations .integrations-banner .banner-cta-btn:focus, .wpfnl-integrations .integrations-banner .banner-cta-btn:hover {
24304 background-color: #6E42D3;
24305 color: #FFF;
24306 }
24307 .wpfnl-integrations .integrations-list {
24308 margin-top: 33px;
24309 }
24310 .wpfnl-integrations .integrations-header {
24311 display: flex;
24312 align-items: center;
24313 justify-content: space-between;
24314 margin-bottom: 24px;
24315 }
24316 .wpfnl-integrations .integrations-title {
24317 color: #1D2327;
24318 font-size: 24px;
24319 font-weight: 600;
24320 line-height: 1.2;
24321 margin: 0;
24322 }
24323 .wpfnl-integrations .integrations-search {
24324 position: relative;
24325 display: flex;
24326 align-items: center;
24327 }
24328 .wpfnl-integrations .integrations-search svg {
24329 position: absolute;
24330 left: 14px;
24331 pointer-events: none;
24332 top: 14px;
24333 }
24334 .wpfnl-integrations input[type=text].integrations-search-input {
24335 width: 260px;
24336 padding: 7px 16px 7px 36px;
24337 height: 40px;
24338 font-size: 14px;
24339 color: #1D2327;
24340 background: #FFF;
24341 transition: all 0.3s ease;
24342 border-radius: 10px;
24343 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
24344 border: none;
24345 }
24346 .wpfnl-integrations input[type=text].integrations-search-input::placeholder {
24347 color: #707070;
24348 }
24349 .wpfnl-integrations input[type=text].integrations-search-input:focus {
24350 outline: 1px solid #b9a3ee;
24351 }
24352 .wpfnl-integrations .integrations-grid {
24353 display: grid;
24354 grid-template-columns: repeat(4, 1fr);
24355 gap: 20px;
24356 }
24357 .wpfnl-integrations .integrations-no-results {
24358 text-align: center;
24359 padding: 60px 20px;
24360 }
24361 .wpfnl-integrations .integrations-no-results p {
24362 font-size: 18px;
24363 color: #1F2937;
24364 line-height: 1.2;
24365 }
24366 .wpfnl-integrations .integration-card {
24367 background: #FFF;
24368 border-radius: 10px;
24369 padding: 24px;
24370 transition: all 0.3s ease;
24371 position: relative;
24372 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
24373 }
24374 .wpfnl-integrations .integration-card-icon {
24375 display: block;
24376 margin-bottom: 20px;
24377 }
24378 .wpfnl-integrations .integration-card-lock {
24379 position: absolute;
24380 top: 16px;
24381 right: 16px;
24382 }
24383 .wpfnl-integrations .integration-card-lock svg {
24384 display: block;
24385 }
24386 .wpfnl-integrations .integration-card-title {
24387 color: #1F2937;
24388 font-size: 16px;
24389 font-weight: 600;
24390 line-height: 1.2;
24391 margin: 0 0 8px 0;
24392 display: flex;
24393 align-items: center;
24394 gap: 8px;
24395 }
24396 .wpfnl-integrations .integration-card-badge {
24397 background: #6E42D3;
24398 color: #FFF;
24399 font-size: 11px;
24400 font-weight: 500;
24401 padding: 3px 8px;
24402 border-radius: 4px;
24403 line-height: 1;
24404 }
24405 .wpfnl-integrations .integration-card-description {
24406 color: #707070;
24407 font-size: 14px;
24408 font-weight: 400;
24409 line-height: 1.5;
24410 margin: 0;
24411 }
24412
24413 @media screen and (max-width: 1199px) {
24414 .wpfnl-integrations .integrations-banner {
24415 height: 263px;
24416 }
24417 .wpfnl-integrations .integrations-banner .banner-title {
24418 font-size: 26px;
24419 }
24420 .wpfnl-integrations .integrations-title {
24421 font-size: 20px;
24422 }
24423 .wpfnl-integrations .integrations-grid {
24424 grid-template-columns: repeat(3, 1fr);
24425 }
24426 }
24427 .wpfnl-templates-page .dashboard-nav__content {
24428 width: 100%;
24429 padding: 24px;
24430 }
24431 .wpfnl-templates-page #templates-library {
24432 min-height: 580px;
24433 width: 100%;
24434 }
24435 .wpfnl-templates-page .create-funnel-loader-overlay#create-funnel-loader {
24436 position: static;
24437 opacity: 1;
24438 visibility: visible;
24439 display: flex;
24440 width: 100%;
24441 min-height: calc(100vh - 120px);
24442 height: auto;
24443 margin: 0;
24444 }
24445 .wpfnl-templates-page .template-library-modal {
24446 position: relative !important;
24447 top: 0 !important;
24448 left: 0 !important;
24449 width: 100% !important;
24450 height: auto !important;
24451 background: transparent !important;
24452 z-index: 1 !important;
24453 }
24454 .wpfnl-templates-page .template-library-modal .funnel-templates-sidebar .category-filter-wrapper {
24455 height: max-content;
24456 overflow: inherit;
24457 }
24458 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates-wrapper {
24459 max-height: max-content;
24460 overflow: inherit;
24461 width: calc(100% - 280px);
24462 margin: 0 auto;
24463 }
24464 .wpfnl-templates-page .template-library-modal .back-form-modal.wpfnl-modal-close {
24465 display: none !important;
24466 }
24467 .wpfnl-templates-page .template-library-modal #wpfnl-create-funnel__inner-content {
24468 display: block !important;
24469 }
24470 .wpfnl-templates-page .template-library-modal .funnel-templates-content {
24471 padding-right: 0;
24472 }
24473 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates {
24474 gap: 24px;
24475 row-gap: 40px;
24476 }
24477 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
24478 width: calc(25% - 18px);
24479 }
24480
24481 @media only screen and (max-width: 1699px) {
24482 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates-wrapper {
24483 width: calc(100% - 80px);
24484 }
24485 }
24486 @media only screen and (max-width: 1399px) {
24487 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates-wrapper {
24488 width: calc(100% - 48px);
24489 }
24490 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates {
24491 row-gap: 30px;
24492 }
24493 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
24494 width: calc(33.3333333333% - 16px);
24495 }
24496 }
24497 @media only screen and (max-width: 1199px) {
24498 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
24499 width: calc(50% - 12px);
24500 }
24501 }
24502 .ab-testing-drawer {
24503 box-shadow: none;
24504 width: calc(100% - 160px);
24505 transition: none;
24506 }
24507 .ab-testing-drawer .drawer-wrapper {
24508 background: #F6F5FA;
24509 }
24510 .ab-testing-drawer .ab-testing-drawer-loader {
24511 position: absolute;
24512 left: 0;
24513 top: 0;
24514 width: 100%;
24515 height: 100%;
24516 display: flex;
24517 flex-flow: column;
24518 align-items: center;
24519 justify-content: center;
24520 background: #f6f5fa;
24521 z-index: 2;
24522 }
24523 .ab-testing-drawer .ab-testing-drawer-loader .wpfnl-loader {
24524 display: block;
24525 width: 50px;
24526 height: 50px;
24527 }
24528
24529 .folded .ab-testing-drawer {
24530 width: calc(100% - 36px);
24531 }
24532
24533 @media only screen and (max-width: 782px) {
24534 .folded .ab-testing-drawer {
24535 width: 100%;
24536 top: 46px;
24537 }
24538 }
24539 .ab-testing-drawer .drawer-header {
24540 background: #ffffff;
24541 position: relative;
24542 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
24543 padding: 15px 24px;
24544 gap: 10px;
24545 }
24546 .ab-testing-drawer .header-left {
24547 display: flex;
24548 align-items: center;
24549 gap: 10px;
24550 }
24551 .ab-testing-drawer .header-left.is-pro {
24552 position: relative;
24553 z-index: 2;
24554 }
24555 .ab-testing-drawer .header-left > h4 {
24556 display: flex;
24557 flex-flow: row wrap;
24558 align-items: center;
24559 }
24560 .ab-testing-drawer .header-left .step-type,
24561 .ab-testing-drawer .header-left .step-title {
24562 color: #363B4E;
24563 font-size: 15px;
24564 font-weight: 500;
24565 line-height: 1;
24566 }
24567 .ab-testing-drawer .header-left .step-title {
24568 max-width: 235px;
24569 white-space: nowrap;
24570 overflow: hidden;
24571 text-overflow: ellipsis;
24572 }
24573 .ab-testing-drawer .header-left .step-type {
24574 text-transform: capitalize;
24575 }
24576 .ab-testing-drawer .header-left .ab-testing-status {
24577 border-radius: 100px;
24578 border: 1px solid #EFEFEF;
24579 background: #F4F4F4;
24580 display: inline-block;
24581 color: #2D3149;
24582 font-size: 10px;
24583 font-weight: 500;
24584 line-height: 1;
24585 padding: 5px 11px;
24586 margin-left: 8px;
24587 text-transform: capitalize;
24588 }
24589 .ab-testing-drawer .header-left .ab-testing-status.running {
24590 background: rgba(36, 194, 26, 0.1);
24591 color: #25C11B;
24592 border-color: rgba(36, 194, 26, 0.1);
24593 }
24594 .ab-testing-drawer .header-center .header-title {
24595 font-size: 18px;
24596 font-weight: 500;
24597 line-height: 1;
24598 color: #363B4E;
24599 }
24600 .ab-testing-drawer .header-right {
24601 display: flex;
24602 align-items: center;
24603 gap: 14px;
24604 }
24605 .ab-testing-drawer .header-right .wpfnl-alert {
24606 display: block;
24607 }
24608 .ab-testing-drawer .header-right .copy-ab-url {
24609 width: auto;
24610 height: 40px;
24611 display: flex;
24612 align-items: center;
24613 justify-content: center;
24614 cursor: pointer;
24615 border-radius: 8px;
24616 border: 1px solid #EEF0F3;
24617 box-shadow: none;
24618 outline: none;
24619 position: relative;
24620 background: transparent;
24621 padding: 11px 20px 9px;
24622 gap: 9px;
24623 }
24624 .ab-testing-drawer .header-right .copy-ab-url .copy-text {
24625 font-size: 14px;
24626 font-weight: 500;
24627 line-height: 1;
24628 color: #363B4E;
24629 }
24630 .ab-testing-drawer .header-right .copy-ab-url .copyed {
24631 background-color: #464646;
24632 position: absolute;
24633 right: -4px;
24634 bottom: -18px;
24635 font-size: 11px;
24636 font-style: normal;
24637 color: #fff;
24638 line-height: 1;
24639 padding: 4px;
24640 border-radius: 3px;
24641 transition: all 0.3s ease;
24642 opacity: 0;
24643 visibility: hidden;
24644 }
24645 .ab-testing-drawer .header-right .copy-ab-url .copyed:before {
24646 content: "";
24647 position: absolute;
24648 left: 50%;
24649 top: -1px;
24650 width: 6px;
24651 height: 6px;
24652 background: #464646;
24653 transform: rotate(45deg) translateX(-50%);
24654 }
24655 .ab-testing-drawer .header-right .copy-ab-url.copy-confirmed .copyed {
24656 bottom: -25px;
24657 opacity: 1;
24658 visibility: visible;
24659 }
24660 .ab-testing-drawer .header-right .traffic-distribution[data-tour=yes],
24661 .ab-testing-drawer .header-right .start[data-tour=yes],
24662 .ab-testing-drawer .header-right .stats[data-tour=yes] {
24663 z-index: 4;
24664 position: relative;
24665 }
24666 .ab-testing-drawer .header-right .more-options[data-tour=yes] {
24667 z-index: 4;
24668 position: relative;
24669 background: #fff;
24670 }
24671 .ab-testing-drawer .header-right .btn-default {
24672 height: auto;
24673 line-height: 1;
24674 padding: 11px 20px 9px;
24675 min-width: auto;
24676 display: flex;
24677 align-items: center;
24678 gap: 9px;
24679 letter-spacing: -0.14px;
24680 color: #363B4E;
24681 border-radius: 8px;
24682 border: 1px solid #EEF0F3;
24683 background: #FFF;
24684 }
24685 .ab-testing-drawer .header-right .btn-default:hover {
24686 background-color: #f7f7f7;
24687 }
24688 .ab-testing-drawer .header-right .btn-default.stats svg {
24689 display: block;
24690 position: relative;
24691 top: -1px;
24692 }
24693 .ab-testing-drawer .header-right .btn-default.start {
24694 background: #6E42D3;
24695 border-color: #6E42D3;
24696 color: #fff;
24697 width: 40px;
24698 height: auto;
24699 padding: 10px;
24700 border-radius: 10px;
24701 }
24702 .ab-testing-drawer .header-right .btn-default.start svg {
24703 position: relative;
24704 top: 0px;
24705 }
24706 .ab-testing-drawer .header-right .btn-default.start:hover {
24707 background-color: #4C25A5;
24708 }
24709 .ab-testing-drawer .header-right .btn-default.its-disabled {
24710 color: rgba(54, 59, 78, 0.4);
24711 background: #ffffff;
24712 cursor: not-allowed;
24713 }
24714 .ab-testing-drawer .header-right .btn-default.its-disabled.stats path {
24715 fill: rgba(167, 168, 179, 0.4);
24716 }
24717 .ab-testing-drawer .header-right .btn-default.its-disabled.start {
24718 background: rgba(110, 66, 211, 0.5);
24719 border-color: transparent;
24720 color: rgba(255, 255, 255, 0.7);
24721 }
24722 .ab-testing-drawer .header-right .btn-default.its-disabled.start path {
24723 fill: rgba(255, 255, 255, 0.7);
24724 }
24725 .ab-testing-drawer .header-right .btn-default .wpfnl-loader {
24726 display: inline-block;
24727 margin-left: 0;
24728 }
24729 .ab-testing-drawer .header-right .action-buttons {
24730 display: flex;
24731 align-items: stretch;
24732 border-radius: 8px;
24733 overflow: hidden;
24734 }
24735 .ab-testing-drawer .header-right .action-buttons button {
24736 width: 40px;
24737 height: auto;
24738 display: flex;
24739 align-items: center;
24740 justify-content: center;
24741 background-color: #FF5155;
24742 padding: 10px;
24743 border: 1px solid #FF5155;
24744 border-right: 1px solid #ffffff;
24745 cursor: pointer;
24746 transition: background-color 0.3s ease, box-shadow 0.3s ease;
24747 }
24748 .ab-testing-drawer .header-right .action-buttons button:last-child {
24749 border-right: none;
24750 }
24751 .ab-testing-drawer .header-right .action-buttons button:hover {
24752 background-color: #FF5C5C;
24753 }
24754 .ab-testing-drawer .header-right .action-buttons button:active {
24755 transform: scale(0.95);
24756 }
24757 .ab-testing-drawer .header-right .action-buttons button .icon {
24758 width: 20px;
24759 height: 20px;
24760 fill: #FF4D4D;
24761 transition: fill 0.3s ease;
24762 }
24763 .ab-testing-drawer .header-right .action-buttons button .icon:hover {
24764 fill: #FFFFFF;
24765 }
24766 .ab-testing-drawer .header-right .more-options {
24767 line-height: 1;
24768 background: transparent;
24769 border: none;
24770 padding: 6px 9px;
24771 cursor: pointer;
24772 position: relative;
24773 }
24774 .ab-testing-drawer .header-right .more-options .options-dropdown {
24775 position: absolute;
24776 right: -10px;
24777 top: 50px;
24778 background: #FFFFFF;
24779 width: 148px;
24780 padding: 8px 9px;
24781 border-radius: 6px;
24782 border: 1px solid #EBEDF0;
24783 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
24784 opacity: 0;
24785 visibility: hidden;
24786 transition: all 0.3s ease;
24787 }
24788 .ab-testing-drawer .header-right .more-options .options-dropdown li {
24789 font-weight: 500;
24790 font-size: 14px;
24791 line-height: 1.14;
24792 color: #363B4E;
24793 display: flex;
24794 align-items: center;
24795 gap: 8px;
24796 padding: 8px;
24797 border-radius: 4px;
24798 cursor: pointer;
24799 transition: all 0.3s ease;
24800 }
24801 .ab-testing-drawer .header-right .more-options .options-dropdown li:hover {
24802 background: #F6F8FA;
24803 }
24804 .ab-testing-drawer .header-right .more-options.show-options .options-dropdown {
24805 top: 44px;
24806 opacity: 1;
24807 visibility: visible;
24808 z-index: 1;
24809 }
24810
24811 @media only screen and (max-width: 1199px) {
24812 .ab-testing-drawer .header-left .step-title {
24813 max-width: 195px;
24814 }
24815 .ab-testing-drawer .header-right {
24816 gap: 10px;
24817 }
24818 .ab-testing-drawer .header-right .btn-default {
24819 padding: 11px 15px 9px;
24820 }
24821 }
24822 @media only screen and (max-width: 991px) {
24823 .ab-testing-drawer .drawer-header {
24824 padding: 15px 15px;
24825 gap: 5px;
24826 }
24827 .ab-testing-drawer .header-center .header-title {
24828 font-size: 16px;
24829 }
24830 .ab-testing-drawer .header-left .step-type,
24831 .ab-testing-drawer .header-left .step-title {
24832 font-size: 14px;
24833 }
24834 .ab-testing-drawer .header-left .step-title {
24835 max-width: 160px;
24836 }
24837 .ab-testing-drawer .header-right .btn-default {
24838 padding: 9px 10px 7px;
24839 }
24840 }
24841 .ab-testing-drawer .single-ab-step {
24842 width: 180px;
24843 position: relative;
24844 background: #FFFFFF;
24845 box-sizing: border-box;
24846 border-radius: 10px;
24847 border: 1px solid #EDECF2;
24848 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
24849 position: relative;
24850 }
24851 .ab-testing-drawer .single-ab-step .ab-variation-delete {
24852 position: absolute;
24853 right: -8px;
24854 top: -8px;
24855 width: 22px;
24856 height: 22px;
24857 border-radius: 30px;
24858 background: #f6f5fa;
24859 color: #ffffff;
24860 border: 2px solid #EE5F5A;
24861 line-height: 1.3;
24862 cursor: pointer;
24863 z-index: 1;
24864 opacity: 0;
24865 visibility: hidden;
24866 transition: all 0.3s ease;
24867 }
24868 .ab-testing-drawer .single-ab-step .ab-variation-delete:before {
24869 content: "";
24870 position: absolute;
24871 left: 0;
24872 top: 0;
24873 width: 100%;
24874 height: 100%;
24875 background-image: url(../images/cross.svg);
24876 background-repeat: no-repeat;
24877 background-size: 80% 80%;
24878 background-position: center center;
24879 border-radius: 50%;
24880 }
24881 .ab-testing-drawer .single-ab-step:hover .ab-variation-delete {
24882 opacity: 1;
24883 visibility: visible;
24884 }
24885 .ab-testing-drawer .single-ab-step .variation-type {
24886 background: #0094A6;
24887 position: absolute;
24888 top: -20px;
24889 left: 15px;
24890 color: #FFF;
24891 font-size: 10px;
24892 font-weight: 600;
24893 line-height: 1;
24894 padding: 5px 11px;
24895 border-radius: 8px 8px 0 0;
24896 text-transform: capitalize;
24897 }
24898 .ab-testing-drawer .single-ab-step .variation-type.variant {
24899 background: #EE8134;
24900 }
24901 .ab-testing-drawer .single-ab-step .variation-type .variant-no {
24902 font-size: 10px;
24903 font-weight: 600;
24904 line-height: 1;
24905 color: #FFF;
24906 }
24907 .ab-testing-drawer .single-ab-step .step-header {
24908 background: #E8F1FF;
24909 box-sizing: border-box;
24910 border-radius: 10px 10px 0px 0px;
24911 padding: 10px 3px 9px;
24912 }
24913 .ab-testing-drawer .single-ab-step .step-header .step-title {
24914 color: #363B4E;
24915 font-weight: 500;
24916 font-size: 13px;
24917 line-height: 14px;
24918 padding: 0;
24919 margin: 0;
24920 text-transform: capitalize;
24921 display: flex;
24922 align-items: center;
24923 justify-content: center;
24924 gap: 6px;
24925 }
24926 .ab-testing-drawer .single-ab-step .step-header .step-title svg {
24927 width: 15px;
24928 height: 15px;
24929 }
24930 .ab-testing-drawer .single-ab-step .step-body {
24931 padding: 10px;
24932 }
24933 .ab-testing-drawer .single-ab-step .step-body .preview-img {
24934 border-radius: 8px;
24935 border: 1px solid #EEF0F3;
24936 position: relative;
24937 overflow: hidden;
24938 height: 121px;
24939 background: #f6f5fa;
24940 }
24941 .ab-testing-drawer .single-ab-step .step-body .preview-img > div {
24942 height: 100%;
24943 background-repeat: no-repeat;
24944 background-size: cover;
24945 background-position: center -5px;
24946 }
24947 .ab-testing-drawer .single-ab-step .step-body .winner-badge {
24948 position: absolute;
24949 left: 0;
24950 top: 0;
24951 background: transparent;
24952 width: 50px;
24953 height: 50px;
24954 padding: 6px;
24955 }
24956 .ab-testing-drawer .single-ab-step .step-body .winner-badge::before {
24957 content: "";
24958 position: absolute;
24959 left: 0;
24960 top: 0;
24961 border-top: 50px solid #24C21A;
24962 border-right: 50px solid transparent;
24963 border-top-left-radius: 8px;
24964 z-index: 0;
24965 }
24966 .ab-testing-drawer .single-ab-step .step-body .winner-badge svg {
24967 position: relative;
24968 z-index: 1;
24969 }
24970 .ab-testing-drawer .single-ab-step .step-body .step-cta > span {
24971 border: 1px solid #EEF0F3;
24972 border-radius: 8px;
24973 display: block;
24974 font-weight: 500;
24975 font-size: 12px;
24976 line-height: 1;
24977 text-align: center;
24978 text-transform: capitalize;
24979 color: #363B4E;
24980 padding: 8px 5px;
24981 margin-top: 10px;
24982 }
24983 .ab-testing-drawer .single-ab-step .step-control-button {
24984 background: #fff;
24985 display: flex;
24986 flex-flow: row;
24987 align-items: center;
24988 justify-content: center;
24989 z-index: 2;
24990 transition: all 0.3s ease;
24991 width: 100%;
24992 margin-top: 12px;
24993 gap: 10px;
24994 }
24995 .ab-testing-drawer .single-ab-step .step-control-button > li {
24996 width: 24px;
24997 height: 22px;
24998 display: flex;
24999 flex-flow: column;
25000 align-items: center;
25001 justify-content: center;
25002 position: relative;
25003 }
25004 .ab-testing-drawer .single-ab-step .step-control-button > li > a, .ab-testing-drawer .single-ab-step .step-control-button > li > button {
25005 display: flex;
25006 text-align: center;
25007 align-items: center;
25008 line-height: 22px;
25009 width: 100%;
25010 cursor: pointer;
25011 justify-content: center;
25012 }
25013 .ab-testing-drawer .single-ab-step .step-control-button > li > button {
25014 border: none;
25015 background: transparent;
25016 }
25017 .ab-testing-drawer .single-ab-step .step-control-button > li > button svg {
25018 display: block;
25019 position: relative;
25020 margin: 0 auto;
25021 }
25022 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown {
25023 position: absolute;
25024 left: 0;
25025 top: 30px;
25026 background: #FFFFFF;
25027 border-radius: 6px;
25028 border: 1px solid #EBEDF0;
25029 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
25030 width: 190px;
25031 padding: 10px;
25032 opacity: 0;
25033 visibility: hidden;
25034 transition: all 0.3s ease;
25035 z-index: 2;
25036 }
25037 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown li {
25038 font-size: 14px;
25039 line-height: 1.14;
25040 color: #2D3149;
25041 display: flex;
25042 align-items: center;
25043 gap: 8px;
25044 padding: 8px;
25045 border-radius: 4px;
25046 transition: all 0.3s ease;
25047 cursor: pointer;
25048 }
25049 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown li svg {
25050 position: relative;
25051 top: -1px;
25052 }
25053 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown li:hover {
25054 background: #F6F8FA;
25055 }
25056 .ab-testing-drawer .single-ab-step .step-control-button li.show-dorpdown .options-dropdown {
25057 top: 25px;
25058 opacity: 1;
25059 visibility: visible;
25060 }
25061 .ab-testing-drawer .single-ab-step.landing .step-header {
25062 background: #E8F1FF;
25063 }
25064 .ab-testing-drawer .single-ab-step.landing .step-header .step-title svg {
25065 width: 15px;
25066 height: 15px;
25067 }
25068 .ab-testing-drawer .single-ab-step.checkout .step-header {
25069 background: #FDF0E8;
25070 padding: 9px 3px 8px;
25071 }
25072 .ab-testing-drawer .single-ab-step.checkout .step-header .step-title svg {
25073 width: 15px;
25074 height: 17px;
25075 top: -1px;
25076 }
25077 .ab-testing-drawer .single-ab-step.upsell .step-header {
25078 background: #E9F9E8;
25079 }
25080 .ab-testing-drawer .single-ab-step.upsell .step-header .step-title svg {
25081 width: 15px;
25082 height: 15px;
25083 }
25084 .ab-testing-drawer .single-ab-step.downsell .step-header {
25085 background: #FCF0F1;
25086 }
25087 .ab-testing-drawer .single-ab-step.downsell .step-header .step-title svg {
25088 width: 15px;
25089 height: 15px;
25090 }
25091 .ab-testing-drawer .single-ab-step.thankyou .step-header {
25092 background: #E6FAF5;
25093 }
25094 .ab-testing-drawer .single-ab-step.thankyou .step-header .step-title svg {
25095 width: 15px;
25096 height: 15px;
25097 }
25098 .ab-testing-drawer .single-ab-step.custom .step-header {
25099 background: #E0F2F4;
25100 }
25101 .ab-testing-drawer .single-ab-step.custom .step-header .step-title svg {
25102 width: 15px;
25103 height: 15px;
25104 }
25105
25106 .ab-testing-drawer .ab-testing-steps-wrapper {
25107 padding: 127px 50px 50px;
25108 display: flex;
25109 flex-flow: row wrap;
25110 align-items: center;
25111 gap: 40px;
25112 }
25113 .ab-testing-drawer .add-step-wrapper .add-steps-options {
25114 left: calc(100% + 15px);
25115 }
25116 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option svg {
25117 margin-bottom: 9px;
25118 }
25119 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option g, .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option path {
25120 transition: all 0.3s ease;
25121 }
25122 .ab-testing-drawer .add-step-wrapper .add-steps-options .option-templates:hover g {
25123 stroke: #6E42D3;
25124 }
25125 .ab-testing-drawer .add-step-wrapper .add-steps-options .option-duplicate:hover path {
25126 stroke: #6E42D3;
25127 fill: #6E42D3;
25128 }
25129
25130 .ab-testing-drawer .traffic-distribution-modal {
25131 position: absolute;
25132 top: 0;
25133 right: 0;
25134 height: 100%;
25135 width: 680px;
25136 z-index: 2;
25137 opacity: 0;
25138 visibility: hidden;
25139 }
25140 .ab-testing-drawer .traffic-distribution-modal.show-modal {
25141 opacity: 1;
25142 visibility: visible;
25143 }
25144 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner {
25145 background: #FFF;
25146 box-shadow: -2px 3px 6px rgba(186, 176, 210, 0.1);
25147 padding: 18px 30px;
25148 width: 100%;
25149 height: 100%;
25150 position: relative;
25151 z-index: 1;
25152 overflow-y: auto;
25153 }
25154 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner::-webkit-scrollbar {
25155 width: 3px;
25156 }
25157 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner::-webkit-scrollbar-track {
25158 background: #f2f5f8;
25159 }
25160 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner::-webkit-scrollbar-thumb {
25161 background-color: #CBCBCB;
25162 border-radius: 20px;
25163 }
25164 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header {
25165 display: flex;
25166 align-items: center;
25167 justify-content: space-between;
25168 border-bottom: 1px solid #EEF0F3;
25169 padding-bottom: 18px;
25170 }
25171 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title h4 {
25172 color: #363B4E;
25173 font-size: 18px;
25174 font-weight: 600;
25175 line-height: 1;
25176 }
25177 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title .wpfnl-tooltip svg {
25178 width: 13px;
25179 height: 13px;
25180 }
25181 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title .wpfnl-tooltip p {
25182 bottom: inherit;
25183 top: calc(100% + 10px);
25184 background: #2D3149;
25185 min-width: 131px;
25186 border-radius: 6px;
25187 font-size: 12px;
25188 line-height: 1.3;
25189 }
25190 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title .wpfnl-tooltip p:before {
25191 background: #2D3149;
25192 bottom: inherit;
25193 top: -4px;
25194 }
25195 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-actions {
25196 display: flex;
25197 gap: 12px;
25198 }
25199 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-actions .action-btn {
25200 border-radius: 10px;
25201 border: 1px solid #EBEDF0;
25202 width: 38px;
25203 height: 38px;
25204 display: flex;
25205 align-items: center;
25206 justify-content: center;
25207 cursor: pointer;
25208 }
25209 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body {
25210 padding: 30px 0;
25211 }
25212 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender #ui-datepicker-div {
25213 border: 1px solid #F1F0F5;
25214 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
25215 border-radius: 8px;
25216 padding: 10px;
25217 }
25218 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
25219 display: flex;
25220 width: 74%;
25221 margin: 0 2.5em;
25222 }
25223 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker-prev,
25224 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker-next {
25225 height: 34px;
25226 }
25227 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker select.ui-datepicker-month,
25228 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker select.ui-datepicker-year {
25229 width: 116px;
25230 min-width: auto;
25231 height: 36px;
25232 border-radius: 3px;
25233 }
25234 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list {
25235 display: flex;
25236 flex-flow: row wrap;
25237 align-items: center;
25238 gap: 30px;
25239 margin-bottom: 20px;
25240 }
25241 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list:last-child {
25242 margin-bottom: 0;
25243 }
25244 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title {
25245 color: #363B4E;
25246 font-size: 15px;
25247 font-weight: 500;
25248 line-height: 1;
25249 width: calc(100% - 190px);
25250 }
25251 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .step-type {
25252 color: #363B4E;
25253 font-size: 15px;
25254 font-weight: 500;
25255 line-height: 1;
25256 text-transform: capitalize;
25257 }
25258 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .variation-type {
25259 background: rgba(0, 148, 166, 0.1);
25260 display: inline-block;
25261 color: #0094A6;
25262 font-size: 12px;
25263 font-weight: 500;
25264 line-height: 1;
25265 padding: 6px 11px;
25266 text-transform: capitalize;
25267 border-radius: 40px;
25268 margin-left: 8px;
25269 }
25270 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .variation-type.variant {
25271 background: rgba(238, 129, 52, 0.1);
25272 color: #EE8134;
25273 }
25274 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic {
25275 display: flex;
25276 align-items: center;
25277 gap: 10px;
25278 position: relative;
25279 }
25280 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .unlock-notice {
25281 border-radius: 6px;
25282 background: #2D3149;
25283 position: absolute;
25284 color: #fff;
25285 font-size: 12px;
25286 font-weight: 500;
25287 line-height: 1.33;
25288 padding: 9px 10px 6px;
25289 bottom: calc(100% + 11px);
25290 left: 23px;
25291 width: 140px;
25292 text-align: center;
25293 opacity: 0;
25294 visibility: hidden;
25295 transition: all 0.3s ease;
25296 }
25297 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .unlock-notice:before {
25298 content: "";
25299 position: absolute;
25300 left: 50%;
25301 transform: translateX(-50%) rotate(45deg);
25302 bottom: -4px;
25303 width: 11px;
25304 height: 11px;
25305 background: #2D3149;
25306 border-radius: 2px;
25307 }
25308 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .lock-unlock {
25309 border-radius: 6px;
25310 border: 1px solid #EEF0F3;
25311 background: transparent;
25312 width: 38px;
25313 height: 38px;
25314 display: flex;
25315 align-items: center;
25316 justify-content: center;
25317 cursor: pointer;
25318 }
25319 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic input[type=number] {
25320 border: 1px solid #EEF0F3;
25321 height: 38px;
25322 border-radius: 6px;
25323 min-width: auto;
25324 width: 88px;
25325 color: #363B4E;
25326 padding: 5px 12px;
25327 }
25328 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .unit {
25329 color: #363B4E;
25330 font-size: 14px;
25331 font-weight: 500;
25332 }
25333 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .variation-traffic:disabled:hover + .unlock-notice {
25334 opacity: 1;
25335 visibility: visible;
25336 }
25337 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer {
25338 border-top: 1px solid #EEF0F3;
25339 padding-top: 20px;
25340 display: flex;
25341 align-items: center;
25342 justify-content: flex-end;
25343 gap: 14px;
25344 }
25345 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .wpfnl-alert {
25346 display: block;
25347 }
25348 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default {
25349 min-width: auto;
25350 border-radius: 10px;
25351 height: auto;
25352 line-height: 1;
25353 padding: 13px 19px 11px;
25354 border: 1px solid transparent;
25355 }
25356 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default.cancel {
25357 background: transparent;
25358 color: #3C3F47;
25359 border-color: #E4E6EB;
25360 }
25361 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default.cancel:hover {
25362 background: #f5f5f5;
25363 }
25364 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default .wpfnl-loader {
25365 display: inline-block;
25366 position: relative;
25367 top: 1px;
25368 }
25369 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default[disabled] {
25370 cursor: not-allowed;
25371 opacity: 0.6;
25372 display: flex;
25373 gap: 10px;
25374 align-items: center;
25375 padding: 8px 19px 8px;
25376 }
25377 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default[disabled] svg {
25378 display: block;
25379 }
25380
25381 .ab-testing-drawer .ab-testing-winner-modal {
25382 position: absolute;
25383 top: 0;
25384 right: 0;
25385 height: 100%;
25386 width: 594px;
25387 z-index: 2;
25388 opacity: 0;
25389 visibility: hidden;
25390 }
25391 .ab-testing-drawer .ab-testing-winner-modal.show-modal {
25392 opacity: 1;
25393 visibility: visible;
25394 }
25395 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner {
25396 background: #fff;
25397 box-shadow: -2px 3px 6px rgba(186, 176, 210, 0.1);
25398 padding: 18px 30px;
25399 width: 100%;
25400 height: 100%;
25401 position: relative;
25402 z-index: 1;
25403 overflow-y: auto;
25404 }
25405 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner::-webkit-scrollbar {
25406 width: 3px;
25407 }
25408 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner::-webkit-scrollbar-track {
25409 background: #f2f5f8;
25410 }
25411 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner::-webkit-scrollbar-thumb {
25412 background-color: #CBCBCB;
25413 border-radius: 20px;
25414 }
25415 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-header {
25416 display: flex;
25417 align-items: center;
25418 justify-content: space-between;
25419 padding-bottom: 18px;
25420 }
25421 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-header .header-title h4 {
25422 color: #363B4E;
25423 font-size: 18px;
25424 font-weight: 600;
25425 line-height: 1;
25426 }
25427 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-header .header-actions .modal-close {
25428 border-radius: 10px;
25429 border: 1px solid #EBEDF0;
25430 width: 38px;
25431 height: 38px;
25432 display: flex;
25433 align-items: center;
25434 justify-content: center;
25435 cursor: pointer;
25436 }
25437 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body {
25438 padding-bottom: 30px;
25439 }
25440 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info {
25441 border: 1px solid #EEF0F3;
25442 border-radius: 10px;
25443 margin-bottom: 16px;
25444 }
25445 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .img-area {
25446 background: #D7D1E7;
25447 height: 303px;
25448 text-align: center;
25449 border-radius: 10px 10px 0 0;
25450 overflow: hidden;
25451 }
25452 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .img-area svg {
25453 position: relative;
25454 top: 14px;
25455 }
25456 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .content-area {
25457 padding: 30px 24px;
25458 }
25459 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .content-area .winner-title {
25460 color: #363B4E;
25461 font-size: 16px;
25462 font-weight: 600;
25463 text-align: center;
25464 margin-bottom: 20px;
25465 }
25466 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .winner-check-list li {
25467 color: #363B4E;
25468 font-size: 13px;
25469 line-height: 1.3;
25470 position: relative;
25471 margin-bottom: 10px;
25472 padding-left: 23px;
25473 }
25474 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .winner-check-list li:last-child {
25475 margin-bottom: 0;
25476 }
25477 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .winner-check-list li:before {
25478 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTkgMTQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzAwQjQyQyIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS43MzQgMTMuNTY0YS4yNTkuMjU5IDAgMDEtLjIzNi0uMTYzYy0uMDE4LS4wMzctMS41OC00LjA2Ny0zLjk5NC01LjU5Mi0uNDczLS4yOS0uODM2LS42LS42OS0xLjI5LjE0NS0uNjcxLjU5OS0xLjA1MiAxLjQxNi0xLjIzNCAxLjQ1Mi0uMzA5IDMuMDEzIDEuOTQzIDMuNTk0IDIuODY5IDIuMDM0LTIuOTYgNi4xLTcuNjA3IDEyLjAyLTguMTUyLjI4NS0uMDM0LjM5LjM5LjEyNi41MDgtLjA5LjAzNy04LjU1IDMuOTA0LTExLjk4MiAxMi45MDlhLjI5LjI5IDAgMDEtLjI1NC4xNDV6IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");
25479 position: absolute;
25480 left: 0;
25481 top: 2px;
25482 width: 17px;
25483 height: 13px;
25484 }
25485 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label {
25486 color: #344054;
25487 font-size: 13px;
25488 line-height: 1;
25489 text-transform: none;
25490 }
25491 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label:after {
25492 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgMTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTUuNTM4IDEwLjYzNWEuMjMyLjIzMiAwIDAxLS4xNy0uMDc0TC44IDUuNjE4YS4yMy4yMyAwIDAxLjE2OS0uMzg3aDIuMmEuMjMuMjMgMCAwMS4xNzMuMDhMNC44NyA3LjA2NmMuMTY1LS4zNTMuNDg1LS45NCAxLjA0NS0xLjY1Ni44My0xLjA1OCAyLjM3LTIuNjE0IDUuMDA4LTQuMDE5YS4yMy4yMyAwIDAxLjI1LjM4NmMtLjAxLjAwOC0xLjAyNy44MDktMi4xOTcgMi4yNzUtMS4wNzcgMS4zNS0yLjUwOSAzLjU1Ny0zLjIxMyA2LjQwN2EuMjMuMjMgMCAwMS0uMjI0LjE3NXoiLz48L3N2Zz4=");
25493 left: 3px;
25494 top: 0px;
25495 width: 14px;
25496 height: 14px;
25497 transform: rotate(0);
25498 border-bottom: none;
25499 border-left: none;
25500 }
25501 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer {
25502 border-top: 1px solid #EEF0F3;
25503 padding-top: 20px;
25504 display: flex;
25505 align-items: center;
25506 justify-content: flex-end;
25507 gap: 14px;
25508 }
25509 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default {
25510 min-width: auto;
25511 border-radius: 10px;
25512 height: auto;
25513 line-height: 1;
25514 padding: 12px 19px 10px;
25515 border: 1px solid transparent;
25516 }
25517 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default.cancel {
25518 background: transparent;
25519 color: #3C3F47;
25520 border-color: #E4E6EB;
25521 }
25522 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default.cancel:hover {
25523 background: #f5f5f5;
25524 }
25525 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default .wpfnl-loader {
25526 display: inline-block;
25527 position: relative;
25528 top: 2px;
25529 }
25530 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default[disabled] {
25531 cursor: not-allowed;
25532 opacity: 0.6;
25533 display: flex;
25534 gap: 10px;
25535 align-items: center;
25536 padding: 8px 19px 8px;
25537 }
25538 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default[disabled] svg {
25539 display: block;
25540 }
25541
25542 .ab-testing-stats {
25543 padding-top: 40px;
25544 }
25545 .ab-testing-stats .stats-wrapper {
25546 width: 100%;
25547 max-width: 1160px;
25548 margin: 0 auto;
25549 background: #fff;
25550 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
25551 border-radius: 10px;
25552 }
25553 .ab-testing-stats .stats-wrapper.ab-testing-stats-header {
25554 background: none;
25555 box-shadow: none;
25556 border-radius: 0;
25557 }
25558 .ab-testing-stats .stats-wrapper.ab-testing-stats-header .stats-back-button {
25559 background: none;
25560 border: none;
25561 outline: none;
25562 display: flex;
25563 align-items: center;
25564 justify-content: center;
25565 gap: 8px;
25566 margin-bottom: 18px;
25567 cursor: pointer;
25568 }
25569 .ab-testing-stats .stats-wrapper.ab-testing-stats-header .stats-back-button .stats-back-button-icon {
25570 background: #fff;
25571 display: inline-flex;
25572 align-items: center;
25573 padding: 5px;
25574 border-radius: 8px;
25575 }
25576 .ab-testing-stats .stats-wrapper.ab-testing-stats-header .stats-back-button .stats-back-button-text {
25577 color: #2D3149;
25578 }
25579 .ab-testing-stats .stats-wrapper table {
25580 width: 100%;
25581 border: none;
25582 border-collapse: collapse;
25583 }
25584 .ab-testing-stats .stats-wrapper table .name {
25585 width: 320px;
25586 }
25587 .ab-testing-stats .stats-wrapper table .status {
25588 width: 120px;
25589 }
25590 .ab-testing-stats .stats-wrapper table .visits {
25591 width: 100px;
25592 }
25593 .ab-testing-stats .stats-wrapper table .revenue {
25594 width: 100px;
25595 }
25596 .ab-testing-stats .stats-wrapper table .conversion-rate {
25597 width: 140px;
25598 }
25599 .ab-testing-stats .stats-wrapper table .declare-winner {
25600 width: 128px;
25601 }
25602 .ab-testing-stats .stats-wrapper thead th {
25603 padding: 16px 24px;
25604 border-bottom: 1px solid #EEF0F3;
25605 }
25606 .ab-testing-stats .stats-wrapper thead th .col-inner-wrap {
25607 color: #7A8B9A;
25608 font-size: 14px;
25609 line-height: 1;
25610 text-align: left;
25611 }
25612 .ab-testing-stats .stats-wrapper tbody td {
25613 padding: 18px 24px;
25614 border-bottom: 1px solid #EEF0F3;
25615 }
25616 .ab-testing-stats .stats-wrapper tbody tr:last-child td {
25617 border-bottom: none;
25618 }
25619 .ab-testing-stats .stats-wrapper tbody .name .col-inner-wrap {
25620 font-size: 14px;
25621 line-height: 1;
25622 color: #363B4E;
25623 font-weight: 500;
25624 white-space: nowrap;
25625 overflow: hidden;
25626 text-overflow: ellipsis;
25627 width: 270px;
25628 }
25629 .ab-testing-stats .stats-wrapper tbody .variation-type {
25630 background: rgba(0, 148, 166, 0.1);
25631 display: inline-block;
25632 color: #0094A6;
25633 font-size: 12px;
25634 font-weight: 500;
25635 line-height: 1;
25636 padding: 6px 11px;
25637 text-transform: capitalize;
25638 border-radius: 40px;
25639 }
25640 .ab-testing-stats .stats-wrapper tbody .variation-type.variant {
25641 background: rgba(238, 129, 52, 0.1);
25642 color: #EE8134;
25643 }
25644 .ab-testing-stats .stats-wrapper tbody .declare-winner .col-inner-wrap {
25645 display: flex;
25646 align-items: center;
25647 }
25648 .ab-testing-stats .stats-wrapper tbody .declare-winner .col-inner-wrap .wpfnl-loader {
25649 display: inline-block;
25650 position: relative;
25651 top: -1px;
25652 }
25653 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher label {
25654 width: 34px;
25655 height: 20px;
25656 }
25657 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher label:after {
25658 width: 16px;
25659 height: 16px;
25660 top: 2px;
25661 left: 2px;
25662 }
25663 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher input[type=checkbox]:checked + label:after {
25664 margin-left: 14px;
25665 }
25666
25667 @media only screen and (max-width: 1399px) {
25668 .ab-testing-stats .stats-wrapper thead th {
25669 padding: 16px 17px;
25670 }
25671 .ab-testing-stats .stats-wrapper tbody td {
25672 padding: 18px 17px;
25673 }
25674 }
25675 @media only screen and (max-width: 1199px) {
25676 .ab-testing-stats .stats-wrapper table .declare-winner {
25677 width: 160px;
25678 padding: 16px 14px;
25679 }
25680 .ab-testing-stats .stats-wrapper tbody td {
25681 padding: 14px 14px;
25682 }
25683 }
25684 @media only screen and (max-width: 991px) {
25685 .ab-testing-stats .stats-wrapper table .name {
25686 width: 230px;
25687 }
25688 .ab-testing-stats .stats-wrapper tbody .name .col-inner-wrap {
25689 width: 203px;
25690 }
25691 }
25692 .ab-testing-archive-list .stats-wrapper table .conversion-rate {
25693 width: 122px;
25694 }
25695 .ab-testing-archive-list .stats-wrapper table .action {
25696 width: 160px;
25697 }
25698 .ab-testing-archive-list .stats-wrapper table .action .col-inner-wrap {
25699 display: flex;
25700 align-items: center;
25701 gap: 5px;
25702 width: 108px;
25703 margin-left: auto;
25704 }
25705 .ab-testing-archive-list .stats-wrapper table .action .retrive {
25706 color: #363B4E;
25707 font-size: 13px;
25708 font-weight: 500;
25709 line-height: 1;
25710 letter-spacing: -0.13px;
25711 padding: 7px 10px;
25712 border-radius: 6px;
25713 border: 1px solid #EEF0F3;
25714 background: #F6F5FA;
25715 cursor: pointer;
25716 }
25717 .ab-testing-archive-list .stats-wrapper table .action .delete {
25718 padding: 8px 10px;
25719 background: transparent;
25720 border: none;
25721 cursor: pointer;
25722 }
25723 .ab-testing-archive-list .stats-wrapper table .action .delete svg {
25724 display: block;
25725 }
25726 .ab-testing-archive-list .stats-wrapper table .no-archived-variant {
25727 text-align: center;
25728 }
25729
25730 .ab-testing-drawer .ab-testing-confirmation-modal {
25731 position: fixed;
25732 top: 0;
25733 left: 160px;
25734 width: calc(100% - 160px);
25735 height: 100%;
25736 z-index: 2;
25737 background: rgba(21, 17, 29, 0.3);
25738 backdrop-filter: blur(4px);
25739 display: flex;
25740 flex-flow: column;
25741 align-items: center;
25742 justify-content: center;
25743 }
25744 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-overlay {
25745 position: absolute;
25746 left: 0;
25747 top: 0;
25748 width: 100%;
25749 height: 100%;
25750 background: transparent;
25751 }
25752 .ab-testing-drawer .ab-testing-confirmation-modal .close-confirmation-modal {
25753 width: 35px;
25754 height: 35px;
25755 border-radius: 100px;
25756 background: #FFF;
25757 box-shadow: 0px 1px 1px 0px #DADADA;
25758 border: none;
25759 position: absolute;
25760 right: -13px;
25761 top: -13px;
25762 cursor: pointer;
25763 padding-top: 2px;
25764 }
25765 .ab-testing-drawer .ab-testing-confirmation-modal .close-confirmation-modal path {
25766 stroke-width: 2px;
25767 }
25768 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-wrapper {
25769 width: 450px;
25770 background: #F6F5FA;
25771 border-radius: 10px;
25772 position: relative;
25773 }
25774 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body {
25775 padding: 35px;
25776 text-align: center;
25777 }
25778 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon {
25779 width: 50px;
25780 height: 50px;
25781 display: flex;
25782 align-items: center;
25783 justify-content: center;
25784 background: #EE5F5A;
25785 margin: 0 auto 14px;
25786 border-radius: 100%;
25787 }
25788 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.delete-icon svg {
25789 width: 16px;
25790 height: 16px;
25791 }
25792 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.delete-icon svg path {
25793 stroke: #fff;
25794 }
25795 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.warning-icon {
25796 background: transparent;
25797 }
25798 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.archive-icon svg {
25799 position: relative;
25800 top: 1px;
25801 left: 1px;
25802 }
25803 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .title {
25804 color: #2D3149;
25805 font-size: 16px;
25806 font-weight: 600;
25807 line-height: 1;
25808 margin-bottom: 8px;
25809 }
25810 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .subtitle {
25811 color: #7A8B9A;
25812 font-size: 14px;
25813 font-weight: 400;
25814 line-height: 1.2;
25815 }
25816 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container {
25817 display: flex;
25818 justify-content: center;
25819 margin-top: 15px;
25820 width: 100%;
25821 flex-direction: column;
25822 align-items: flex-start;
25823 }
25824 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .variant-select {
25825 margin-bottom: 10px;
25826 }
25827 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .archive-checkbox label {
25828 color: #2D3149;
25829 padding-left: 26px;
25830 }
25831 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .archive-checkbox label::before {
25832 border: 1px solid #C5C6C8;
25833 height: 16px;
25834 width: 16px;
25835 }
25836 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .archive-checkbox label::after {
25837 left: 4px;
25838 top: 2px;
25839 width: 8px;
25840 height: 4px;
25841 }
25842 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer {
25843 padding: 20px;
25844 border-top: 1px solid #E2E2E2;
25845 display: flex;
25846 flex-flow: row wrap;
25847 align-items: center;
25848 justify-content: flex-end;
25849 gap: 12px;
25850 }
25851 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .btn-default {
25852 min-width: auto;
25853 height: auto;
25854 line-height: 1;
25855 font-size: 15px;
25856 font-weight: 600;
25857 padding: 12px 19px;
25858 border: 1px solid transparent;
25859 }
25860 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .btn-default.confirm {
25861 box-shadow: 0px 10px 16px 0px rgba(189, 193, 200, 0.5);
25862 }
25863 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .btn-default.cancel {
25864 color: #2D3149;
25865 background: transparent;
25866 border: 1px solid #E4E6EB;
25867 letter-spacing: -0.15px;
25868 }
25869 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .wpfnl-checkbox {
25870 margin-right: auto;
25871 }
25872 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .variant-alert {
25873 margin-right: auto;
25874 color: #D8000C;
25875 }
25876 .ab-testing-drawer .ab-testing-confirmation-modal.archive-modal .confirmation-modal-body .icon {
25877 background: #239654;
25878 }
25879 .ab-testing-drawer .ab-testing-confirmation-modal.archive-modal .confirmation-modal-body .icon.warning-icon {
25880 background: transparent;
25881 }
25882
25883 .folded .ab-testing-drawer .ab-testing-confirmation-modal {
25884 left: 36px;
25885 width: calc(100% - 36px);
25886 }
25887
25888 .wpfnl-automation-window .automation-list-wrapper {
25889 padding: 0 30px 0;
25890 }
25891 .wpfnl-automation-window .automation-list-wrapper > .bulk-check {
25892 display: flex;
25893 align-items: center;
25894 padding-left: 31px;
25895 height: 50px;
25896 }
25897 .wpfnl-automation-window .automation-list-wrapper > .bulk-check .wpfnl-checkbox label:before {
25898 border-color: #c2c2c2;
25899 background-color: #ffffff;
25900 }
25901 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area {
25902 padding-left: 30px;
25903 height: 33px;
25904 }
25905 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area button {
25906 background: #EE8134;
25907 border-radius: 6px;
25908 border: none;
25909 color: #fff;
25910 height: 30px;
25911 padding: 0 10px;
25912 display: flex;
25913 align-items: center;
25914 justify-content: center;
25915 font-weight: 500;
25916 cursor: pointer;
25917 }
25918 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area button svg {
25919 height: 18px;
25920 width: 18px;
25921 margin-right: 4px;
25922 }
25923 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area button svg path {
25924 stroke: #fff;
25925 }
25926 .wpfnl-automation-window .automation-list-header {
25927 display: flex;
25928 flex-flow: row wrap;
25929 align-items: center;
25930 justify-content: space-between;
25931 }
25932 .wpfnl-automation-window .automation-list-header .field-item {
25933 font-weight: 500;
25934 font-size: 14px;
25935 line-height: 1.14;
25936 letter-spacing: 1px;
25937 text-transform: uppercase;
25938 color: #7A8B9A;
25939 }
25940 .wpfnl-automation-window .automation-list-header,
25941 .wpfnl-automation-window .automation-single-list {
25942 padding: 15px 30px;
25943 }
25944 .wpfnl-automation-window .automation-list-header .wpfnl-checkbox label:before,
25945 .wpfnl-automation-window .automation-single-list .wpfnl-checkbox label:before {
25946 border-color: #CDD2E6;
25947 background-color: #ffffff;
25948 }
25949 .wpfnl-automation-window .automation-list-header .field-item,
25950 .wpfnl-automation-window .automation-single-list .field-item {
25951 padding: 0 10px;
25952 }
25953 .wpfnl-automation-window .automation-list-header .field-item:first-child,
25954 .wpfnl-automation-window .automation-single-list .field-item:first-child {
25955 padding-left: 0;
25956 }
25957 .wpfnl-automation-window .automation-list-header .field-item:last-child,
25958 .wpfnl-automation-window .automation-single-list .field-item:last-child {
25959 padding-right: 0;
25960 }
25961 .wpfnl-automation-window .automation-list-header .bulk-check,
25962 .wpfnl-automation-window .automation-single-list .bulk-check {
25963 margin-right: 20px;
25964 }
25965 .wpfnl-automation-window .automation-list-header .title,
25966 .wpfnl-automation-window .automation-single-list .title {
25967 width: 250px;
25968 display: flex;
25969 flex-flow: row wrap;
25970 align-items: center;
25971 justify-content: flex-start;
25972 }
25973 .wpfnl-automation-window .automation-list-header .trigger,
25974 .wpfnl-automation-window .automation-single-list .trigger {
25975 width: calc(80% - 280px);
25976 text-align: center;
25977 }
25978 .wpfnl-automation-window .automation-list-header .trigger-action,
25979 .wpfnl-automation-window .automation-single-list .trigger-action {
25980 width: 100px;
25981 }
25982 .wpfnl-automation-window .automation-list-header .crm,
25983 .wpfnl-automation-window .automation-single-list .crm {
25984 width: 45px;
25985 }
25986 .wpfnl-automation-window .automation-list-header .status,
25987 .wpfnl-automation-window .automation-single-list .status {
25988 width: 66px;
25989 }
25990 .wpfnl-automation-window .automation-list-header .actions,
25991 .wpfnl-automation-window .automation-single-list .actions {
25992 width: 75px;
25993 }
25994 .wpfnl-automation-window .automation-single-list {
25995 background: #FFFFFF;
25996 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
25997 border-radius: 8px;
25998 display: flex;
25999 flex-flow: row wrap;
26000 align-items: flex-start;
26001 justify-content: space-between;
26002 margin-bottom: 20px;
26003 }
26004 .wpfnl-automation-window .automation-single-list.no-data-list {
26005 justify-content: center;
26006 }
26007 .wpfnl-automation-window .automation-single-list.no-data-list .field-item {
26008 color: #363B4E;
26009 font-weight: 500;
26010 }
26011 .wpfnl-automation-window .automation-single-list.no-data-list .field-item .btn-default {
26012 height: 54px;
26013 padding: 0 40px;
26014 margin: 10px 0;
26015 font-size: 16px;
26016 }
26017 .wpfnl-automation-window .automation-single-list.no-data-list.not-enabled {
26018 margin-left: 20px;
26019 margin-right: 20px;
26020 }
26021 .wpfnl-automation-window .automation-single-list .title {
26022 font-size: 15px;
26023 line-height: 1.2;
26024 font-weight: 500;
26025 color: #363B4E;
26026 position: relative;
26027 top: 6px;
26028 }
26029 .wpfnl-automation-window .automation-single-list .crm .icon {
26030 box-sizing: border-box;
26031 border-radius: 6px;
26032 width: 30px;
26033 height: 30px;
26034 display: flex;
26035 flex-flow: column;
26036 align-items: center;
26037 justify-content: center;
26038 }
26039 .wpfnl-automation-window .automation-single-list .trigger-lists {
26040 display: flex;
26041 flex-flow: row wrap;
26042 align-items: center;
26043 justify-content: center;
26044 margin-left: -2px;
26045 margin-top: -2px;
26046 width: 100%;
26047 }
26048 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list-flex,
26049 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-more-list,
26050 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list {
26051 padding: 2px;
26052 }
26053 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list-flex > span,
26054 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-more-list > span,
26055 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list > span {
26056 font-size: 12px;
26057 line-height: 1.15;
26058 color: #7A8B9A;
26059 border: 1px solid #E5E8F3;
26060 border-radius: 6px;
26061 padding: 6px 6px 4px;
26062 display: block;
26063 }
26064 .wpfnl-automation-window .automation-single-list .more-list-trigger > span {
26065 font-size: 12px;
26066 line-height: 1.15;
26067 color: #7A8B9A;
26068 border: 1px solid #E5E8F3;
26069 border-radius: 6px;
26070 padding: 6px 6px 4px;
26071 display: inline-block;
26072 }
26073 .wpfnl-automation-window .automation-single-list .trigger-action {
26074 display: flex;
26075 align-items: center;
26076 }
26077 .wpfnl-automation-window .automation-single-list .trigger-action > span {
26078 display: block;
26079 line-height: 1;
26080 }
26081 .wpfnl-automation-window .automation-single-list .trigger-action > span svg {
26082 display: block;
26083 }
26084 .wpfnl-automation-window .automation-single-list .trigger-action .action-separator {
26085 margin: 0 18px;
26086 }
26087 .wpfnl-automation-window .automation-single-list .status {
26088 position: relative;
26089 top: 6px;
26090 }
26091 .wpfnl-automation-window .automation-single-list .actions {
26092 display: flex;
26093 }
26094 .wpfnl-automation-window .automation-single-list .actions button {
26095 width: 33px;
26096 padding: 0;
26097 border: none;
26098 height: 30px;
26099 padding-top: 2px;
26100 cursor: pointer;
26101 background: transparent;
26102 margin: 0 auto;
26103 display: flex;
26104 align-items: center;
26105 justify-content: center;
26106 }
26107 .wpfnl-automation-window .automation-single-list .actions button svg {
26108 height: 20px;
26109 display: block;
26110 }
26111
26112 @media only screen and (max-width: 1440px) {
26113 .wpfnl-automation-window .automation-list-header .trigger,
26114 .wpfnl-automation-window .automation-single-list .trigger {
26115 width: calc(80% - 340px);
26116 }
26117 }
26118 @media only screen and (max-width: 1199px) {
26119 .wpfnl-automation-window .automation-list-header,
26120 .wpfnl-automation-window .automation-single-list {
26121 padding: 14px 16px;
26122 }
26123 .wpfnl-automation-window .automation-list-header .title,
26124 .wpfnl-automation-window .automation-single-list .title {
26125 width: 220px;
26126 }
26127 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area {
26128 padding-left: 16px;
26129 }
26130 }
26131 @media only screen and (max-width: 991px) {
26132 .wpfnl-automation-window .automation-list-header .title,
26133 .wpfnl-automation-window .automation-single-list .title {
26134 width: 220px;
26135 }
26136 .wpfnl-automation-window .automation-list-header .trigger,
26137 .wpfnl-automation-window .automation-single-list .trigger {
26138 width: calc(80% - 369px);
26139 }
26140 }
26141 .crm-data-loader {
26142 position: absolute;
26143 z-index: 999;
26144 top: 1px;
26145 left: 1px;
26146 background: #fff;
26147 width: calc(100% - 3px);
26148 height: calc(100% - 3px);
26149 display: flex;
26150 flex-flow: row;
26151 align-items: center;
26152 border-radius: 10px;
26153 padding-left: 10px;
26154 }
26155 .crm-data-loader > span {
26156 display: inline-block;
26157 width: 8px;
26158 height: 8px;
26159 border-radius: 20px;
26160 background: #a184e5;
26161 margin: 3px;
26162 transition: all 0.3s;
26163 }
26164 .crm-data-loader > span:nth-child(1) {
26165 -webkit-animation: crm-data-loader 1.5s infinite;
26166 -moz-animation: crm-data-loader 1.5s infinite;
26167 -o-animation: crm-data-loader 1.5s infinite;
26168 animation: crm-data-loader 1.5s infinite;
26169 }
26170 .crm-data-loader > span:nth-child(2) {
26171 -webkit-animation: crm-data-loader 1.5s infinite;
26172 -moz-animation: crm-data-loader 1.5s infinite;
26173 -o-animation: crm-data-loader 1.5s infinite;
26174 animation: crm-data-loader 1.5s infinite;
26175 animation-delay: 0.4s;
26176 }
26177 .crm-data-loader > span:nth-child(3) {
26178 -webkit-animation: crm-data-loader 1.5s infinite;
26179 -moz-animation: crm-data-loader 1.5s infinite;
26180 -o-animation: crm-data-loader 1.5s infinite;
26181 animation: crm-data-loader 1.5s infinite;
26182 animation-delay: 0.6s;
26183 }
26184 @-webkit-keyframes crm-data-loader {
26185 0%, 100% {
26186 opacity: 0;
26187 }
26188 50% {
26189 opacity: 1;
26190 }
26191 }
26192 @-moz-keyframes crm-data-loader {
26193 0%, 100% {
26194 opacity: 0;
26195 }
26196 50% {
26197 opacity: 1;
26198 }
26199 }
26200 @-o-keyframes crm-data-loader {
26201 0%, 100% {
26202 opacity: 0;
26203 }
26204 50% {
26205 opacity: 1;
26206 }
26207 }
26208 @keyframes crm-data-loader {
26209 0%, 100% {
26210 opacity: 0;
26211 }
26212 50% {
26213 opacity: 1;
26214 }
26215 }
26216
26217 .wpfnl-automation-window .automation-darwer {
26218 position: fixed;
26219 top: 32px;
26220 right: -190px;
26221 background-color: #fff;
26222 z-index: 99;
26223 width: 1133px;
26224 height: calc(100vh - 32px);
26225 box-shadow: -8px 3px 6px rgba(186, 176, 210, 0.15);
26226 transition: all 0.3s ease-in-out;
26227 opacity: 0;
26228 visibility: hidden;
26229 }
26230 .wpfnl-automation-window .automation-darwer .drawer-bg-overlay {
26231 position: fixed;
26232 right: 0;
26233 top: 0;
26234 background: rgba(0, 0, 0, 0.3019607843);
26235 width: 100%;
26236 height: 100%;
26237 z-index: -1;
26238 }
26239 .wpfnl-automation-window .automation-darwer.show-drawer {
26240 right: 0;
26241 opacity: 1;
26242 visibility: visible;
26243 }
26244 .wpfnl-automation-window .automation-darwer .drawer-wrapper {
26245 height: 100%;
26246 width: 100%;
26247 background: #fff;
26248 position: relative;
26249 }
26250 .wpfnl-automation-window .automation-darwer .drawer-loader {
26251 position: absolute;
26252 top: 0;
26253 left: 0;
26254 width: 100%;
26255 height: 100%;
26256 background: #fff;
26257 border-radius: 10px 0 0 10px;
26258 z-index: 2;
26259 }
26260 .wpfnl-automation-window .automation-darwer .drawer-loader .wpfnl-loader {
26261 display: block;
26262 position: absolute;
26263 top: 50%;
26264 left: 50%;
26265 width: 50px;
26266 height: 50px;
26267 margin-left: -48px;
26268 margin-top: -46px;
26269 transition: all 0.3s linear;
26270 }
26271 .wpfnl-automation-window .automation-darwer .drawer-header {
26272 display: flex;
26273 flex-flow: row wrap;
26274 align-items: center;
26275 justify-content: space-between;
26276 gap: 10px;
26277 padding: 20px 16px 20px 30px;
26278 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
26279 position: relative;
26280 z-index: 1;
26281 }
26282 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper {
26283 display: flex;
26284 flex-flow: row wrap;
26285 align-items: center;
26286 }
26287 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper label {
26288 padding-right: 7px;
26289 cursor: text;
26290 }
26291 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper input {
26292 height: 40px;
26293 font-size: 14px;
26294 line-height: 1.14;
26295 color: #7A8B9A;
26296 padding: 3px 10px;
26297 width: 180px;
26298 min-height: auto;
26299 min-width: auto;
26300 }
26301 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper .automation-name-preview {
26302 max-width: 200px;
26303 white-space: nowrap;
26304 overflow: hidden;
26305 text-overflow: ellipsis;
26306 }
26307 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button {
26308 min-width: auto;
26309 padding: 1px 7px 0;
26310 width: 40px;
26311 height: 40px;
26312 display: flex;
26313 flex-flow: column;
26314 align-items: center;
26315 justify-content: center;
26316 background: #F6F5FA !important;
26317 border: 1px solid #e0e0e0;
26318 border-radius: 6px;
26319 cursor: pointer;
26320 margin-left: 10px;
26321 }
26322 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button svg {
26323 display: block;
26324 width: 22px;
26325 height: 22px;
26326 }
26327 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-edit svg {
26328 fill: #6E42D3;
26329 }
26330 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-submit {
26331 display: none;
26332 }
26333 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-submit svg {
26334 stroke: #6E42D3;
26335 position: relative;
26336 top: -3px;
26337 }
26338 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-cancel {
26339 display: none;
26340 margin-left: 5px;
26341 }
26342 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper .automation-name-input {
26343 display: none;
26344 }
26345 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper .wpfnl-alert {
26346 display: block;
26347 position: absolute;
26348 bottom: 2px;
26349 font-size: 12px;
26350 font-weight: 400;
26351 }
26352 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm {
26353 display: flex;
26354 flex-flow: row;
26355 align-items: center;
26356 margin-left: 30px;
26357 }
26358 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm .connect-crm-title {
26359 padding-right: 7px;
26360 font-weight: 500;
26361 color: #363B4E;
26362 white-space: nowrap;
26363 line-height: 1;
26364 position: relative;
26365 top: 2px;
26366 }
26367 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm select {
26368 height: 40px;
26369 padding-right: 30px;
26370 background-color: #f6f4fb;
26371 border-color: #6E42D3;
26372 color: #716395;
26373 }
26374 .wpfnl-automation-window .automation-darwer .drawer-header .zapier-doc-link a {
26375 font-weight: 500;
26376 color: #6E42D3;
26377 text-decoration: underline;
26378 }
26379 .wpfnl-automation-window .automation-darwer .drawer-header .zapier-doc-link a:hover {
26380 text-decoration: none;
26381 }
26382 .wpfnl-automation-window .automation-darwer .drawer-header .wpfnl-drawer-close {
26383 display: block;
26384 padding: 3px 7px;
26385 height: 24px;
26386 cursor: pointer;
26387 position: relative;
26388 top: -2px;
26389 margin-left: auto;
26390 }
26391 .wpfnl-automation-window .automation-darwer .drawer-body {
26392 padding: 30px;
26393 height: calc(100% - 80px);
26394 overflow: auto;
26395 position: relative;
26396 }
26397 .wpfnl-automation-window .automation-darwer .drawer-body::-webkit-scrollbar {
26398 width: 5px;
26399 }
26400 .wpfnl-automation-window .automation-darwer .drawer-body::-webkit-scrollbar-track {
26401 background: #f2f5f8;
26402 }
26403 .wpfnl-automation-window .automation-darwer .drawer-body::-webkit-scrollbar-thumb {
26404 background-color: #6E42D3;
26405 border-radius: 20px;
26406 }
26407 .wpfnl-automation-window .automation-darwer .trigger-wrapper {
26408 background: #FAF9FF;
26409 border: 1px solid #F0F0F0;
26410 border-radius: 10px;
26411 padding: 86px 40px 52px;
26412 position: relative;
26413 }
26414 .wpfnl-automation-window .automation-darwer .trigger-wrapper .zapier-save-btn {
26415 position: absolute;
26416 top: 30px;
26417 right: 0;
26418 z-index: 1;
26419 display: flex;
26420 align-items: center;
26421 justify-content: flex-end;
26422 gap: 13px;
26423 width: 100%;
26424 padding: 0 40px;
26425 }
26426 .wpfnl-automation-window .automation-darwer .trigger-wrapper .zapier-save-btn .wpfnl-alert {
26427 display: block;
26428 }
26429 .wpfnl-automation-window .automation-darwer .trigger-wrapper .zapier-save-btn .wpfnl-loader {
26430 display: inline-block;
26431 position: relative;
26432 top: 2px;
26433 }
26434 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper {
26435 padding: 0 0 27px;
26436 position: relative;
26437 }
26438 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:after {
26439 content: "";
26440 position: absolute;
26441 left: 50%;
26442 height: 27px;
26443 width: 2px;
26444 background: #7A8B9A;
26445 margin-left: -1px;
26446 }
26447 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:after {
26448 bottom: 0;
26449 }
26450 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper .add-trigger {
26451 border: none;
26452 background: transparent;
26453 display: block;
26454 height: 24px;
26455 width: 24px;
26456 position: absolute;
26457 left: 50%;
26458 bottom: -13px;
26459 transform: translate(-50%);
26460 z-index: 1;
26461 border-radius: 50%;
26462 cursor: pointer;
26463 }
26464 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:not(:last-child) .add-trigger {
26465 display: none;
26466 }
26467 .wpfnl-automation-window .automation-darwer .single-trigger {
26468 background: #FFFFFF;
26469 box-shadow: 0px 2px 3px rgba(190, 190, 215, 0.4);
26470 border-radius: 10px;
26471 display: flex;
26472 flex-flow: row wrap;
26473 position: relative;
26474 }
26475 .wpfnl-automation-window .automation-darwer .single-trigger select {
26476 height: 40px;
26477 background-color: transparent;
26478 min-width: auto;
26479 width: 100%;
26480 }
26481 .wpfnl-automation-window .automation-darwer .single-trigger label {
26482 margin-bottom: 10px;
26483 display: block;
26484 cursor: default;
26485 }
26486 .wpfnl-automation-window .automation-darwer .single-trigger .hints {
26487 color: #EE5F5A;
26488 display: none;
26489 }
26490 .wpfnl-automation-window .automation-darwer .single-trigger .selectbox-wrapper {
26491 position: relative;
26492 }
26493 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-tag {
26494 background: #6E42D3;
26495 border-radius: 50px;
26496 font-size: 12px;
26497 color: #fff;
26498 padding: 3px 11px 2px;
26499 position: absolute;
26500 left: 50%;
26501 top: -45px;
26502 transform: translate(-50%);
26503 display: none;
26504 }
26505 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-tag:before {
26506 content: "";
26507 position: absolute;
26508 left: 50%;
26509 top: calc(100% + 1px);
26510 height: 20px;
26511 width: 1px;
26512 border-right: 2px dashed #7A8B9A;
26513 margin-left: -1px;
26514 }
26515 .wpfnl-automation-window .automation-darwer .single-trigger .required-star {
26516 color: #EE5F5A;
26517 }
26518 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-when {
26519 padding: 20px;
26520 width: 50%;
26521 position: relative;
26522 }
26523 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-when .wpfnl-form-group {
26524 width: 100%;
26525 padding: 0;
26526 }
26527 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-then {
26528 display: flex;
26529 flex-flow: row wrap;
26530 padding: 20px 13px;
26531 width: 50%;
26532 background: #F6F6F9;
26533 border-radius: 0px 10px 10px 0px;
26534 position: relative;
26535 }
26536 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-then .trigger-tag {
26537 background-color: #EE8134;
26538 }
26539 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group {
26540 width: 50%;
26541 padding: 0 7px;
26542 }
26543 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group.wpfnl-col-1 {
26544 width: 100%;
26545 }
26546 .wpfnl-automation-window .automation-darwer .single-trigger .close-trigger {
26547 border: 1px solid #EE5F5A;
26548 padding: 0;
26549 height: 26px;
26550 width: 26px;
26551 display: flex;
26552 flex-flow: column;
26553 align-items: center;
26554 justify-content: center;
26555 border-radius: 100%;
26556 position: absolute;
26557 right: -8px;
26558 top: -11px;
26559 cursor: pointer;
26560 background: #fff;
26561 opacity: 0;
26562 visibility: hidden;
26563 transition: all 0.3s ease;
26564 z-index: 3;
26565 }
26566 .wpfnl-automation-window .automation-darwer .single-trigger .close-trigger svg {
26567 width: 17px;
26568 }
26569 .wpfnl-automation-window .automation-darwer .single-trigger .close-trigger svg path {
26570 stroke: #EE5F5A;
26571 }
26572 .wpfnl-automation-window .automation-darwer .single-trigger:hover .close-trigger {
26573 opacity: 1;
26574 visibility: visible;
26575 }
26576 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group.field-required select {
26577 border-color: #EE5F5A;
26578 }
26579 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group.field-required .hints {
26580 display: block;
26581 }
26582 .wpfnl-automation-window .automation-darwer .data-loaded .single-trigger .crm-data-loader {
26583 display: none;
26584 }
26585 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:first-child .single-trigger .trigger-tag {
26586 display: block;
26587 }
26588 .wpfnl-automation-window .automation-darwer .save-btn-area {
26589 margin-top: 30px;
26590 display: flex;
26591 justify-content: flex-end;
26592 align-items: center;
26593 }
26594 .wpfnl-automation-window .automation-darwer .save-btn-area .wpfnl-alert {
26595 display: inline-block;
26596 padding: 10px 20px;
26597 margin-right: 13px;
26598 }
26599 .wpfnl-automation-window .automation-darwer .save-btn-area .btn-default {
26600 min-width: 90px;
26601 }
26602 .wpfnl-automation-window .automation-darwer .save-btn-area .wpfnl-loader {
26603 display: inline-block;
26604 position: relative;
26605 top: 3px;
26606 }
26607 .wpfnl-automation-window .automation-darwer .no-data-message {
26608 text-align: center;
26609 color: #363B4E;
26610 font-weight: 500;
26611 }
26612 .wpfnl-automation-window .automation-darwer .ant-select-show-search:where(.css-dev-only-do-not-override-1p3hq3p).ant-select:not(.ant-select-customize-input) .ant-select-selector {
26613 font-size: 14px;
26614 color: #7A8B9A;
26615 padding: 5px 15px;
26616 height: 40px;
26617 background-color: transparent;
26618 min-width: auto;
26619 width: 100%;
26620 border-radius: 6px;
26621 border: 1px solid #E5E8F3;
26622 }
26623 .wpfnl-automation-window .automation-darwer .ant-select-focused:where(.css-dev-only-do-not-override-1p3hq3p).ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer) .ant-select-selector {
26624 border-color: #E5E8F3;
26625 box-shadow: none;
26626 }
26627 .wpfnl-automation-window .automation-darwer .wpfnl-automation-window .automation-darwer .single-trigger .selectbox-wrapper:where(.css-dev-only-do-not-override-1p3hq3p).ant-select.ant-select-single {
26628 width: 100% !important;
26629 }
26630 .wpfnl-automation-window .automation-darwer :where(.css-dev-only-do-not-override-1p3hq3p).ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder {
26631 color: #7A8B9A;
26632 }
26633 .wpfnl-automation-window .automation-darwer :where(.css-dev-only-do-not-override-1p3hq3p).ant-select-single:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input {
26634 height: 38px !important;
26635 }
26636
26637 @media only screen and (max-width: 1400px) {
26638 .wpfnl-automation-window .automation-darwer {
26639 width: 983px;
26640 }
26641 }
26642 @media only screen and (max-width: 1199px) {
26643 .wpfnl-automation-window .automation-darwer {
26644 width: 803px;
26645 }
26646 .wpfnl-automation-window .automation-darwer .trigger-wrapper {
26647 padding: 40px 20px 40px;
26648 }
26649 }
26650 @media only screen and (max-width: 991px) {
26651 .wpfnl-automation-window .automation-darwer {
26652 width: 740px;
26653 }
26654 .wpfnl-automation-window .automation-darwer .drawer-header {
26655 padding: 20px 16px 20px 20px;
26656 }
26657 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm select {
26658 width: 143px;
26659 min-width: auto;
26660 }
26661 .wpfnl-automation-window .automation-darwer .drawer-body {
26662 padding: 20px;
26663 }
26664 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-when {
26665 padding: 15px;
26666 }
26667 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-then {
26668 padding: 15px 8px;
26669 }
26670 }
26671 .wpfnl-automation-window {
26672 background: #f6f5fa;
26673 position: absolute;
26674 top: 0;
26675 left: 0;
26676 width: 100%;
26677 height: 100%;
26678 z-index: 99;
26679 }
26680 .wpfnl-automation-window .automation-content {
26681 position: relative;
26682 }
26683 .wpfnl-automation-window .automation-window-loader {
26684 background: #f6f5fa;
26685 position: absolute;
26686 top: 0;
26687 right: 0;
26688 width: 100%;
26689 height: calc(100vh - 32px);
26690 z-index: 99;
26691 transition: all 0.9s linear;
26692 }
26693 .wpfnl-automation-window .automation-window-loader .wpfnl-loader {
26694 display: block;
26695 position: absolute;
26696 top: 50%;
26697 left: 50%;
26698 width: 50px;
26699 height: 50px;
26700 margin-left: -48px;
26701 margin-top: -46px;
26702 transition: all 0.3s linear;
26703 }
26704 .wpfnl-automation-window .automation-content-header {
26705 display: flex;
26706 flex-flow: row wrap;
26707 align-items: center;
26708 justify-content: space-between;
26709 background: #FFFFFF;
26710 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
26711 padding-right: 8px;
26712 margin-bottom: 20px;
26713 }
26714 .wpfnl-automation-window .automation-content-header .header-left {
26715 display: flex;
26716 flex-flow: row wrap;
26717 align-items: center;
26718 }
26719 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-logo a {
26720 display: block;
26721 padding: 16px 25px;
26722 border-right: 1px solid #E5E8F3;
26723 }
26724 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-logo a svg {
26725 width: 26px;
26726 display: block;
26727 }
26728 .wpfnl-automation-window .automation-content-header .header-left .backto-funnel-edit {
26729 background: #FFFFFF;
26730 cursor: pointer;
26731 border: none;
26732 padding: 0;
26733 text-align: center;
26734 width: 57px;
26735 height: 60px;
26736 margin-right: 20px;
26737 display: flex;
26738 flex-flow: column;
26739 align-items: center;
26740 justify-content: center;
26741 border-right: 1px solid #E5E8F3;
26742 }
26743 .wpfnl-automation-window .automation-content-header .header-left h2 {
26744 font-size: 18px;
26745 line-height: 1.16;
26746 font-weight: 500;
26747 color: #363B4E;
26748 margin-right: 13px;
26749 }
26750 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-switcher {
26751 display: flex;
26752 align-items: center;
26753 }
26754 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-switcher .wpfnl-loader {
26755 display: inline-block;
26756 margin-left: 8px;
26757 }
26758 .wpfnl-automation-window .wpfnl-switcher label {
26759 width: 32px;
26760 height: 18px;
26761 }
26762 .wpfnl-automation-window .wpfnl-switcher label:after {
26763 width: 12px;
26764 height: 12px;
26765 top: 2px;
26766 left: 3px;
26767 }
26768 .wpfnl-automation-window .wpfnl-switcher input[type=checkbox]:checked + label:after {
26769 margin-left: 13px;
26770 }
26771 .wpfnl-automation-window .btn-default {
26772 height: 40px;
26773 line-height: 41px;
26774 padding: 0 20px;
26775 }
26776
26777 .wpfnl .mailmint-automation {
26778 box-shadow: none;
26779 width: calc(100% - 160px);
26780 transition: none;
26781 }
26782 .wpfnl .mailmint-automation .automation-drawer-loader {
26783 position: absolute;
26784 top: 0;
26785 left: 0;
26786 width: 100%;
26787 height: 100%;
26788 background: #F6F5FA;
26789 z-index: 3;
26790 display: flex;
26791 flex-flow: column;
26792 align-items: center;
26793 justify-content: center;
26794 }
26795 .wpfnl .mailmint-automation .automation-drawer-loader .wpfnl-loader {
26796 display: block;
26797 width: 40px;
26798 height: 40px;
26799 }
26800 .wpfnl .mailmint-automation .drawer-wrapper {
26801 background: #F6F5FA;
26802 }
26803 .wpfnl .mailmint-automation .drawer-body {
26804 padding: 24px;
26805 overflow: hidden;
26806 }
26807 .wpfnl .mailmint-automation .drawer-body-inner-wrapper {
26808 display: flex;
26809 flex-flow: row wrap;
26810 gap: 24px;
26811 height: 100%;
26812 }
26813 .wpfnl .mailmint-automation .automation-steps-wrapper {
26814 text-align: center;
26815 width: 100%;
26816 height: calc(100% + 20px);
26817 overflow: auto;
26818 padding-top: 10px;
26819 padding-bottom: 30px;
26820 }
26821 .wpfnl .mailmint-automation .automation-steps-wrapper::-webkit-scrollbar {
26822 width: 5px;
26823 height: 5px;
26824 }
26825 .wpfnl .mailmint-automation .automation-steps-wrapper::-webkit-scrollbar-track {
26826 background: #f2f5f8;
26827 }
26828 .wpfnl .mailmint-automation .automation-steps-wrapper::-webkit-scrollbar-thumb {
26829 background-color: #CBCBCB;
26830 border-radius: 20px;
26831 }
26832 .wpfnl .mailmint-automation .has-sidebar .automation-steps-wrapper {
26833 width: calc(100% - 474px);
26834 }
26835 .wpfnl .mailmint-automation .steps-settings-sidebar {
26836 width: 450px;
26837 height: 100%;
26838 background: #FFF;
26839 box-shadow: -2px 3px 6px rgba(186, 176, 210, 0.1);
26840 border-radius: 10px;
26841 padding: 24px 30px;
26842 overflow: auto;
26843 }
26844 .wpfnl .mailmint-automation .steps-settings-sidebar::-webkit-scrollbar {
26845 width: 5px;
26846 }
26847 .wpfnl .mailmint-automation .steps-settings-sidebar::-webkit-scrollbar-track {
26848 background: #f2f5f8;
26849 }
26850 .wpfnl .mailmint-automation .steps-settings-sidebar::-webkit-scrollbar-thumb {
26851 background-color: #CBCBCB;
26852 border-radius: 20px;
26853 }
26854 .wpfnl .mailmint-automation .condition .steps-settings-sidebar {
26855 width: 710px;
26856 }
26857 .wpfnl .mailmint-automation .condition .automation-steps-wrapper {
26858 width: calc(100% - 734px);
26859 }
26860 .wpfnl .mailmint-automation .automation-start-point {
26861 position: relative;
26862 border-radius: 8px;
26863 background: #FFF;
26864 width: 245px;
26865 margin: 0 auto;
26866 padding: 18px 15px 16px;
26867 text-align: center;
26868 color: #2D3149;
26869 font-size: 16px;
26870 font-weight: 600;
26871 line-height: 1.2;
26872 display: flex;
26873 align-items: center;
26874 justify-content: center;
26875 gap: 9px;
26876 cursor: pointer;
26877 background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='8' ry='8' stroke='%236E42D3FF' stroke-width='2' stroke-dasharray='3%2c 7' stroke-dashoffset='11' stroke-linecap='round'/%3e%3c/svg%3e");
26878 }
26879 .wpfnl .mailmint-automation .automation-start-point .tigger-lists {
26880 position: absolute;
26881 left: 0;
26882 top: calc(100% + 26px);
26883 background: #FFFFFF;
26884 width: 100%;
26885 padding: 8px 10px;
26886 border-radius: 6px;
26887 border: 1px solid #EBEDF0;
26888 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
26889 z-index: 3;
26890 opacity: 0;
26891 visibility: hidden;
26892 transition: all 0.3s ease;
26893 }
26894 .wpfnl .mailmint-automation .automation-start-point .tigger-lists li {
26895 font-size: 14px;
26896 line-height: 1.14;
26897 color: #2D3149;
26898 font-weight: 400;
26899 display: flex;
26900 align-items: center;
26901 gap: 8px;
26902 padding: 8px;
26903 border-radius: 4px;
26904 cursor: pointer;
26905 transition: all 0.3s ease;
26906 }
26907 .wpfnl .mailmint-automation .automation-start-point .tigger-lists li:hover {
26908 background: #F6F8FA;
26909 }
26910 .wpfnl .mailmint-automation .automation-start-point .tigger-lists li.active {
26911 background: #F6F8FA;
26912 font-weight: 500;
26913 }
26914 .wpfnl .mailmint-automation .automation-start-point.show-dropdown .tigger-lists {
26915 top: calc(100% + 12px);
26916 opacity: 1;
26917 visibility: visible;
26918 }
26919 .wpfnl .mailmint-automation .selected-trigger {
26920 max-width: 210px;
26921 margin: 0 auto;
26922 display: flex;
26923 flex-flow: column;
26924 align-items: center;
26925 justify-content: center;
26926 position: relative;
26927 }
26928 .wpfnl .mailmint-automation .selected-trigger .close-trigger {
26929 background: transparent;
26930 color: #ffffff;
26931 border: none;
26932 position: absolute;
26933 right: -5px;
26934 top: -8px;
26935 cursor: pointer;
26936 opacity: 0;
26937 visibility: hidden;
26938 transition: all 0.3s ease;
26939 }
26940 .wpfnl .mailmint-automation .selected-trigger .close-trigger svg {
26941 display: block;
26942 }
26943 .wpfnl .mailmint-automation .selected-trigger .trigger-title {
26944 border-radius: 100px;
26945 background: #7A8B9A;
26946 display: inline-block;
26947 color: #FFF;
26948 font-size: 13px;
26949 font-weight: 500;
26950 line-height: 1.2;
26951 padding: 13px 24px 11px;
26952 position: relative;
26953 }
26954 .wpfnl .mailmint-automation .selected-trigger .trigger-title:hover .close-trigger {
26955 opacity: 1;
26956 visibility: visible;
26957 }
26958 .wpfnl .mailmint-automation .selected-trigger .add-action {
26959 height: 62px;
26960 position: relative;
26961 background: #7A8B9A;
26962 width: 2px;
26963 margin: 0 auto;
26964 }
26965 .wpfnl .mailmint-automation .selected-trigger .add-action:before {
26966 content: "";
26967 position: absolute;
26968 left: -5px;
26969 top: -7px;
26970 width: 6px;
26971 height: 6px;
26972 background: #7A8B9A;
26973 border-radius: 50px;
26974 border: 3px solid #fff;
26975 box-shadow: 0 0 0 2px #7A8B9A;
26976 }
26977 .wpfnl .mailmint-automation .selected-trigger .add-action > button {
26978 background: #7A8B9A;
26979 box-shadow: 0px 0px 0 6px #f6f5fa;
26980 width: 24px;
26981 height: 24px;
26982 border: none;
26983 display: flex;
26984 align-items: center;
26985 justify-content: center;
26986 border-radius: 100%;
26987 cursor: pointer;
26988 z-index: 1;
26989 position: absolute;
26990 bottom: 0;
26991 left: 0;
26992 margin-left: -11px;
26993 }
26994 .wpfnl .mailmint-automation .selected-trigger .add-action > button path {
26995 stroke: #fff;
26996 }
26997 .wpfnl .add-new-action {
26998 position: absolute;
26999 left: 50%;
27000 bottom: -8px;
27001 transform: translateX(-50%);
27002 z-index: 2;
27003 }
27004 .wpfnl .add-new-action .add-new-action-btn {
27005 background: #7A8B9A;
27006 box-shadow: 0px 0px 0 6px #f6f5fa;
27007 width: 24px;
27008 height: 24px;
27009 border: none;
27010 position: relative;
27011 display: flex;
27012 align-items: center;
27013 justify-content: center;
27014 border-radius: 100%;
27015 cursor: pointer;
27016 z-index: 1;
27017 }
27018 .wpfnl .add-new-action .add-new-action-btn path {
27019 stroke: #fff;
27020 }
27021 .wpfnl .first-add-new-action {
27022 height: 49px;
27023 bottom: inherit;
27024 top: 100%;
27025 display: flex;
27026 flex-flow: column;
27027 align-items: center;
27028 justify-content: flex-end;
27029 }
27030 .wpfnl .first-add-new-action:before {
27031 content: "";
27032 position: absolute;
27033 left: 50%;
27034 top: 0;
27035 margin-left: -1px;
27036 width: 2px;
27037 height: 100%;
27038 background: #7A8B9A;
27039 }
27040 .wpfnl .first-add-new-action:after {
27041 content: "";
27042 position: absolute;
27043 left: 50%;
27044 top: -8px;
27045 transform: translateX(-50%);
27046 width: 8px;
27047 height: 8px;
27048 background: #FFFFFF;
27049 border: 2px solid #7A8B9A;
27050 border-radius: 50px;
27051 }
27052 .wpfnl .first-add-new-action.automation-added:before {
27053 display: none;
27054 }
27055 .wpfnl .mintmrm-automation-step-wrapper {
27056 position: absolute;
27057 left: 50%;
27058 transform: translateX(-50%);
27059 top: 100%;
27060 width: 100%;
27061 }
27062 .wpfnl .mintmrm-automation-step-wrapper .no-automation {
27063 font-size: 10px;
27064 font-weight: 500;
27065 line-height: 1;
27066 color: #363B4E;
27067 text-align: center;
27068 text-transform: capitalize;
27069 white-space: nowrap;
27070 background: #FFFFFF;
27071 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
27072 padding: 6px 12px;
27073 border-radius: 50px;
27074 margin-top: 58px;
27075 display: inline-block;
27076 width: auto;
27077 }
27078 .wpfnl .mintmrm-automation-step-wrapper.automation-running .no-automation {
27079 box-shadow: 0px 1px 2px 0px rgba(190, 190, 215, 0.14);
27080 color: #24C21A;
27081 }
27082
27083 .folded .wpfnl .mailmint-automation {
27084 width: calc(100% - 36px);
27085 }
27086
27087 @media only screen and (max-width: 782px) {
27088 .folded .wpfnl .mailmint-automation {
27089 width: 100%;
27090 top: 46px;
27091 }
27092 }
27093 .mailmint-automation .drawer-header {
27094 background: #ffffff;
27095 position: relative;
27096 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
27097 padding: 16px 12px 16px 24px;
27098 gap: 10px;
27099 z-index: 1;
27100 }
27101 .mailmint-automation .header-left {
27102 display: flex;
27103 align-items: center;
27104 gap: 14px;
27105 }
27106 .mailmint-automation .header-left .automation-title {
27107 color: #363B4E;
27108 font-size: 16px;
27109 font-weight: 500;
27110 line-height: 1;
27111 }
27112 .mailmint-automation .header-right {
27113 display: flex;
27114 align-items: center;
27115 gap: 14px;
27116 }
27117 .mailmint-automation .header-right .wpfnl-alert {
27118 display: block;
27119 }
27120 .mailmint-automation .header-right .btn-default {
27121 height: auto;
27122 line-height: 1;
27123 padding: 12px 16px 10px;
27124 min-width: auto;
27125 display: flex;
27126 align-items: center;
27127 gap: 9px;
27128 border-radius: 10px;
27129 }
27130 .mailmint-automation .header-right .btn-default.is-disabled {
27131 color: rgba(64, 64, 64, 0.4);
27132 cursor: not-allowed;
27133 background-color: rgba(183, 183, 183, 0.4);
27134 }
27135 .mailmint-automation .header-right .btn-default .wpfnl-loader {
27136 display: inline-block;
27137 margin-left: 0;
27138 }
27139 .mailmint-automation .header-right .more-options {
27140 line-height: 1;
27141 background: transparent;
27142 border: none;
27143 padding: 6px 9px;
27144 cursor: pointer;
27145 position: relative;
27146 }
27147 .mailmint-automation .header-right .more-options .options-dropdown {
27148 position: absolute;
27149 right: -10px;
27150 top: 50px;
27151 background: #FFFFFF;
27152 width: 148px;
27153 padding: 8px 9px;
27154 border-radius: 6px;
27155 border: 1px solid #EBEDF0;
27156 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
27157 opacity: 0;
27158 visibility: hidden;
27159 transition: all 0.3s ease;
27160 }
27161 .mailmint-automation .header-right .more-options .options-dropdown li {
27162 font-weight: 500;
27163 font-size: 14px;
27164 line-height: 1.14;
27165 color: #363B4E;
27166 display: flex;
27167 align-items: center;
27168 gap: 8px;
27169 padding: 8px;
27170 border-radius: 4px;
27171 cursor: pointer;
27172 transition: all 0.3s ease;
27173 }
27174 .mailmint-automation .header-right .more-options .options-dropdown li:hover {
27175 background: #F6F8FA;
27176 }
27177 .mailmint-automation .header-right .more-options .options-dropdown .wpfnl-loader {
27178 display: inline-block;
27179 }
27180 .mailmint-automation .header-right .more-options.show-dropdown .options-dropdown {
27181 top: 44px;
27182 opacity: 1;
27183 visibility: visible;
27184 }
27185
27186 .mailmint-automation .automation-single-step .automation-step-name {
27187 height: 100%;
27188 min-width: 150px;
27189 max-width: 245px;
27190 position: relative;
27191 background: #FFFFFF !important;
27192 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3019607843);
27193 border: 1px solid transparent;
27194 display: inline-block;
27195 padding: 35px 24px 15px;
27196 border-radius: 8px;
27197 cursor: pointer;
27198 transition: all 0.3s ease;
27199 }
27200 .mailmint-automation .automation-single-step .selected.automation-step-name {
27201 border-color: #6E42D3;
27202 box-shadow: 0px 20px 20px 0px rgba(189, 193, 200, 0.2);
27203 }
27204 .mailmint-automation .automation-single-step .automation-step-name .action-icon {
27205 background: #FFFFFF;
27206 border: 6px solid #F6F8FA;
27207 border-radius: 100%;
27208 width: 58px;
27209 height: 58px;
27210 display: flex;
27211 align-items: center;
27212 justify-content: center;
27213 position: absolute;
27214 left: 50%;
27215 top: -28px;
27216 transform: translateX(-50%);
27217 }
27218 .mailmint-automation .automation-single-step .automation-step-name .action-title {
27219 display: block;
27220 font-weight: 500;
27221 text-align: center;
27222 font-size: 14px;
27223 line-height: 1.2;
27224 color: #363B4E;
27225 margin-top: 5px;
27226 }
27227 .mailmint-automation .automation-single-step {
27228 position: relative;
27229 padding: 55px 0 0;
27230 max-width: 570px;
27231 margin: 0 auto;
27232 }
27233 .mailmint-automation .automation-single-step:before {
27234 content: "";
27235 position: absolute;
27236 left: 50%;
27237 top: 0;
27238 margin-left: -1px;
27239 width: 2px;
27240 height: 100%;
27241 background: #7A8B9A;
27242 }
27243 .mailmint-automation .automation-single-step .action-subtitle span,
27244 .mailmint-automation .automation-single-step .action-subtitle {
27245 color: #A4A8B5;
27246 display: block;
27247 margin-top: 4px;
27248 font-size: 12px;
27249 }
27250 .mailmint-automation .automation-single-step .action-subtitle span .not-set,
27251 .mailmint-automation .automation-single-step .action-subtitle .not-set {
27252 color: #FF5155;
27253 }
27254 .mailmint-automation .automation-single-step .action-subtitle span .tag-list,
27255 .mailmint-automation .automation-single-step .action-subtitle .tag-list {
27256 display: flex;
27257 flex-flow: row wrap;
27258 align-items: center;
27259 justify-content: center;
27260 }
27261 .mailmint-automation .automation-single-step .action-subtitle span .tag-list span,
27262 .mailmint-automation .automation-single-step .action-subtitle .tag-list span {
27263 margin: 0;
27264 }
27265 .mailmint-automation .automation-single-step .automation-step-name.not-setup-yet .action-subtitle {
27266 color: #FF5155;
27267 }
27268 .mailmint-automation .automation-single-step.stopAutomation .automation-step-name:before {
27269 content: "";
27270 position: absolute;
27271 top: 100%;
27272 left: 0;
27273 width: 100%;
27274 height: 30px;
27275 background: #f6f5fa;
27276 z-index: 1;
27277 }
27278 .mailmint-automation .automation-single-step .add-action {
27279 height: 54px;
27280 position: relative;
27281 width: 2px;
27282 margin: 0 auto;
27283 }
27284 .mailmint-automation .automation-single-step .add-action > button {
27285 background: #7A8B9A;
27286 box-shadow: 0px 0px 0 6px #f6f5fa;
27287 width: 24px;
27288 height: 24px;
27289 border: none;
27290 display: flex;
27291 align-items: center;
27292 justify-content: center;
27293 border-radius: 100%;
27294 cursor: pointer;
27295 z-index: 1;
27296 position: absolute;
27297 bottom: 0;
27298 left: 0;
27299 margin-left: -11px;
27300 }
27301 .mailmint-automation .automation-single-step .add-action > button path {
27302 stroke: #fff;
27303 }
27304 .mailmint-automation .automation-single-step .delete-action {
27305 border: none;
27306 background: transparent;
27307 line-height: 1;
27308 position: absolute;
27309 top: -12px;
27310 right: -10px;
27311 cursor: pointer;
27312 opacity: 0;
27313 visibility: hidden;
27314 transition: all 0.3s ease;
27315 }
27316 .mailmint-automation .automation-single-step .delete-action svg {
27317 display: block;
27318 }
27319 .mailmint-automation .automation-single-step .automation-step-name:hover .delete-action {
27320 opacity: 1;
27321 visibility: visible;
27322 }
27323 .mailmint-automation .automation-single-step.sendMail .action-icon svg path {
27324 stroke: #7DC09B;
27325 fill: #7DC09B;
27326 }
27327 .mailmint-automation .automation-single-step.addTag .action-icon svg circle,
27328 .mailmint-automation .automation-single-step.addTag .action-icon svg path {
27329 stroke: #5FA2DB;
27330 }
27331 .mailmint-automation .automation-single-step.addList .action-icon svg path {
27332 stroke: #AB8BC5;
27333 }
27334 .mailmint-automation .automation-single-step.removeTag .action-icon svg circle,
27335 .mailmint-automation .automation-single-step.removeTag .action-icon svg path {
27336 stroke: #E8A758;
27337 }
27338 .mailmint-automation .automation-single-step.circle .action-icon svg path, .mailmint-automation .automation-single-step.removeList .action-icon svg path {
27339 stroke: #E8A758;
27340 }
27341 .mailmint-automation .automation-single-step.delay .action-icon svg path {
27342 fill: #E3B152;
27343 stroke: #E3B152;
27344 }
27345 .mailmint-automation .automation-single-step.sequence .action-icon svg path {
27346 fill: #5FA2DC;
27347 }
27348 .mailmint-automation .automation-single-step.condition > .automation-step-name > .action-icon svg path {
27349 stroke: #84c246;
27350 fill: #84c246;
27351 }
27352 .mailmint-automation .automation-single-step.createUser .action-icon svg path {
27353 fill: #6d79a2;
27354 stroke: #6d79a2;
27355 }
27356 .mailmint-automation .automation-single-step.stopAutomation .action-icon svg path {
27357 fill: #e7887f;
27358 stroke: #e7887f;
27359 }
27360 .mailmint-automation .automation-single-step.webHookOutgoing .action-icon svg path {
27361 fill: #7064dc;
27362 }
27363 .mailmint-automation .automation-exit {
27364 color: #363B4E;
27365 font-size: 14px;
27366 font-weight: 600;
27367 line-height: 1.3;
27368 display: flex;
27369 flex-flow: column;
27370 align-items: center;
27371 justify-content: center;
27372 gap: 11px;
27373 width: 50px;
27374 margin: 0 auto;
27375 }
27376 .mailmint-automation .automation-exit:before {
27377 content: "";
27378 height: 25px;
27379 width: 2px;
27380 background: #7a8b9a;
27381 }
27382 .mailmint-automation .logical-decision-box {
27383 align-items: flex-start;
27384 border: 2px solid #a7a8b3;
27385 border-radius: 20px;
27386 display: flex;
27387 flex-flow: row wrap;
27388 gap: 30px;
27389 justify-content: space-between;
27390 margin: 30px auto 0;
27391 max-width: 416px;
27392 padding: 15px 0;
27393 position: relative;
27394 z-index: 2;
27395 top: 50%;
27396 width: 100%;
27397 background: #f6f5fa;
27398 }
27399 .mailmint-automation .logical-decision-box .automation-single-step {
27400 padding-top: 28px;
27401 }
27402 .mailmint-automation .logical-decision-box .automation-single-step:before {
27403 display: none;
27404 }
27405 .mailmint-automation .logical-decision-box .logical-text {
27406 background-color: #239654;
27407 box-shadow: 0px 0 0 8px #f6f8fa;
27408 border-radius: 50px;
27409 color: #fff;
27410 font-size: 11px;
27411 font-weight: 700;
27412 right: 25%;
27413 transform: translate(50%, 0px);
27414 line-height: 1.09;
27415 padding: 4px 6px;
27416 position: absolute;
27417 top: -12px;
27418 width: 31px;
27419 }
27420 .mailmint-automation .logical-decision-box .logical-text.logical-no-text {
27421 background: #ec5956;
27422 left: 25%;
27423 transform: translate(-50%, 0);
27424 }
27425 .mailmint-automation .logical-decision-box .single-decision {
27426 width: calc(50% - 15px);
27427 }
27428 .mailmint-automation .logical-decision-box .single-decision.decision-no {
27429 transform: translateX(calc(-50% - 1px));
27430 }
27431 .mailmint-automation .logical-decision-box .single-decision.decision-yes {
27432 transform: translateX(calc(50% + 1px));
27433 }
27434 .mailmint-automation .logical-decision-box .add-action {
27435 height: 85px;
27436 }
27437 .mailmint-automation .logical-decision-box .add-action > button {
27438 bottom: 50%;
27439 transform: translateY(50%);
27440 }
27441 .mailmint-automation .logical-decision-box .stopAutomation .automation-step-name:before {
27442 display: none;
27443 }
27444 .mailmint-automation .logical-decision-box .no-separator {
27445 height: 50px;
27446 background: #f6f5fa;
27447 width: 100%;
27448 }
27449
27450 .mailmint-automation .mailmint-actions {
27451 position: absolute;
27452 left: 50%;
27453 transform: translateX(-50%);
27454 top: calc(100% + 5px);
27455 width: 626px;
27456 z-index: 99;
27457 background: #FFF;
27458 border: 1px solid #EDECF2;
27459 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
27460 border-radius: 10px;
27461 padding: 30px;
27462 transition: all 0.3s ease;
27463 display: none;
27464 }
27465 .mailmint-automation .mailmint-actions .action-search {
27466 position: relative;
27467 }
27468 .mailmint-automation .mailmint-actions .action-search .search-input {
27469 width: 100%;
27470 padding: 8px 32px 8px 12px;
27471 background: #F0F0F0;
27472 min-height: 40px;
27473 color: #2d3149;
27474 border-radius: 0;
27475 }
27476 .mailmint-automation .mailmint-actions .action-search .search-input:focus {
27477 border: 1px solid #6E42D2;
27478 }
27479 .mailmint-automation .mailmint-actions .action-search .clear-search-btn {
27480 display: flex;
27481 align-items: center;
27482 justify-content: center;
27483 background: #ddd;
27484 padding: 2px 3px;
27485 position: absolute;
27486 top: 50%;
27487 right: 6px;
27488 transform: translateY(-50%);
27489 background: #ddd;
27490 border: none;
27491 font-size: 18px;
27492 color: #666;
27493 cursor: pointer;
27494 line-height: 1;
27495 }
27496 .mailmint-automation .mailmint-actions .action-search .clear-search-btn.hover {
27497 color: #000;
27498 }
27499 .mailmint-automation .mailmint-actions .action-tabs {
27500 display: flex;
27501 gap: 10px;
27502 margin: 14px 0 28px 0;
27503 }
27504 .mailmint-automation .mailmint-actions .action-tabs .tab-button {
27505 border: 1px solid #dee1e8;
27506 border-radius: 8px;
27507 cursor: pointer;
27508 font-size: 14px;
27509 color: #2d3149;
27510 line-height: 1;
27511 margin-bottom: 0;
27512 background: none;
27513 padding: 9px 12px;
27514 }
27515 .mailmint-automation .mailmint-actions .action-tabs .tab-button.active {
27516 background: #6E42D2;
27517 color: #fff;
27518 }
27519 .mailmint-automation .mailmint-actions .mailmint-actions-wrapper {
27520 display: flex;
27521 flex-flow: row wrap;
27522 gap: 14px;
27523 }
27524 .mailmint-automation .mailmint-actions .mailmint-actions-wrapper .actions-title {
27525 color: #9398A5;
27526 font-size: 14px;
27527 font-weight: 500;
27528 line-height: 1;
27529 text-align: left;
27530 border-bottom: 1px solid #DEE1E8;
27531 padding-bottom: 10px;
27532 margin-bottom: 6px;
27533 width: 100%;
27534 }
27535 .mailmint-automation .mailmint-actions .mailmint-single-action {
27536 background: #FFFFFF;
27537 border: 1px solid #E4E6EB;
27538 border-radius: 10px;
27539 display: flex;
27540 flex-flow: column;
27541 align-items: center;
27542 justify-content: center;
27543 text-align: center;
27544 width: calc(25% - 11px);
27545 padding: 10px;
27546 cursor: pointer;
27547 min-height: 88px;
27548 transition: all 0.3s ease;
27549 }
27550 .mailmint-automation .mailmint-actions .mailmint-single-action .icon {
27551 margin-bottom: 10px;
27552 }
27553 .mailmint-automation .mailmint-actions .mailmint-single-action .icon circle,
27554 .mailmint-automation .mailmint-actions .mailmint-single-action .icon path {
27555 transition: all 0.3s ease;
27556 }
27557 .mailmint-automation .mailmint-actions .mailmint-single-action .icon svg {
27558 display: block;
27559 }
27560 .mailmint-automation .mailmint-actions .mailmint-single-action .title {
27561 font-weight: 500;
27562 font-size: 14px;
27563 line-height: 1.28;
27564 text-align: center;
27565 letter-spacing: -0.01em;
27566 color: #2D3149;
27567 }
27568 .mailmint-automation .mailmint-actions .mailmint-single-action:hover {
27569 border-color: #6E42D3;
27570 box-shadow: 0px 20px 16px rgba(189, 193, 200, 0.2);
27571 }
27572 .mailmint-automation .mailmint-actions .mailmint-single-action:hover .title {
27573 color: #6E42D3;
27574 }
27575 .mailmint-automation .mailmint-actions .mailmint-single-action.stop-automation:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.create-contact:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.logical:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.delay:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.remove-list:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.add-list:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.send-mail:hover .icon path {
27576 fill: #6E42D3;
27577 stroke: #6E42D3;
27578 }
27579 .mailmint-automation .mailmint-actions .mailmint-single-action.webhook-outgoing:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.email-sequence:hover .icon path {
27580 fill: #6E42D3;
27581 }
27582 .mailmint-automation .mailmint-actions .mailmint-single-action.remove-tag:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.add-tag:hover .icon path {
27583 fill: #6E42D3;
27584 stroke: #6E42D3;
27585 }
27586 .mailmint-automation .mailmint-actions .mailmint-single-action.remove-tag:hover .icon circle, .mailmint-automation .mailmint-actions .mailmint-single-action.add-tag:hover .icon circle {
27587 stroke: #6E42D3;
27588 }
27589 .mailmint-automation .show-actions .mailmint-actions {
27590 display: block;
27591 }
27592
27593 .mailmint-automation .steps-settings-sidebar .sidebar-header {
27594 display: flex;
27595 flex-flow: row wrap;
27596 justify-content: space-between;
27597 gap: 10px;
27598 padding: 0;
27599 border-bottom: 1px solid #EEF0F3;
27600 padding-bottom: 13px;
27601 }
27602 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title {
27603 display: flex;
27604 align-items: center;
27605 flex-flow: row wrap;
27606 width: calc(100% - 48px);
27607 }
27608 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title h4 {
27609 color: #363B4E;
27610 font-size: 18px;
27611 font-weight: 500;
27612 display: flex;
27613 align-items: center;
27614 gap: 8px;
27615 }
27616 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title h4 svg {
27617 width: 23px;
27618 height: 23px;
27619 }
27620 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title h4 path {
27621 fill: #363B4E;
27622 }
27623 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title .short-desc {
27624 width: 100%;
27625 margin-top: 5px;
27626 color: #7A8B9A;
27627 font-size: 14px;
27628 line-height: 1.28;
27629 text-transform: none;
27630 }
27631 .mailmint-automation .steps-settings-sidebar .sidebar-header .close-sidebar {
27632 padding: 3px 7px;
27633 height: 38px;
27634 width: 38px;
27635 cursor: pointer;
27636 position: relative;
27637 border-radius: 10px;
27638 border: 1px solid #EBEDF0;
27639 display: flex;
27640 align-items: center;
27641 justify-content: center;
27642 background: transparent;
27643 }
27644 .mailmint-automation .steps-settings-sidebar .sidebar-header .close-sidebar path {
27645 stroke-width: 2px;
27646 }
27647 .mailmint-automation .steps-settings-sidebar .sidebar-body {
27648 padding-top: 20px;
27649 }
27650 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group {
27651 margin-bottom: 21px;
27652 position: relative;
27653 }
27654 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown {
27655 position: absolute;
27656 background: #fff;
27657 right: 0;
27658 top: calc(100% + 8px);
27659 width: 300px;
27660 border: 1px solid #e2e5ed;
27661 z-index: 9999;
27662 transition: all 0.3s ease;
27663 box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.06);
27664 border-radius: 6px;
27665 padding: 8px;
27666 display: none;
27667 }
27668 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown::-webkit-scrollbar {
27669 width: 5px;
27670 }
27671 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown::-webkit-scrollbar-track {
27672 background: #f2f5f8;
27673 }
27674 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown::-webkit-scrollbar-thumb {
27675 background-color: #c1c1c1;
27676 border-radius: 20px;
27677 }
27678 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.show {
27679 display: block;
27680 }
27681 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.timezone {
27682 width: 320px;
27683 }
27684 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.country {
27685 width: 320px;
27686 }
27687 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.dropdown-left {
27688 right: inherit;
27689 left: 0;
27690 }
27691 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.width-120px {
27692 width: 120px;
27693 }
27694 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li {
27695 font-weight: 400;
27696 font-size: 14px;
27697 line-height: 17px;
27698 color: #2d3149;
27699 text-align: left;
27700 padding: 8px 10px;
27701 border-radius: 6px;
27702 cursor: pointer;
27703 transition: all 0.3s ease;
27704 display: flex;
27705 align-items: center;
27706 margin-bottom: 0;
27707 }
27708 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li svg {
27709 margin-right: 7px;
27710 }
27711 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:not(.searchbar):not(.list-title):not(.button-area):hover, .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:not(.searchbar):not(.list-title).active {
27712 background: #f6f8fa;
27713 }
27714 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:first-child a {
27715 border-radius: 5px 5px 0 0;
27716 }
27717 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:last-child {
27718 border-bottom: 0;
27719 }
27720 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:last-child a {
27721 border-radius: 0 0 5px 5px;
27722 }
27723 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.delete {
27724 color: #ec5956;
27725 }
27726 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.searchbar {
27727 background: transparent;
27728 padding: 8px 8px 14px;
27729 display: list-item;
27730 }
27731 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.searchbar svg {
27732 position: absolute;
27733 top: 9px;
27734 left: 16px;
27735 }
27736 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.searchbar input[type=search] {
27737 font-weight: 400;
27738 height: 34px;
27739 padding: 4px 15px 4px 40px;
27740 }
27741 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.single-column {
27742 display: block;
27743 }
27744 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.list-title {
27745 font-weight: 600;
27746 font-size: 12px;
27747 line-height: 15px;
27748 letter-spacing: 0.05em;
27749 text-transform: uppercase;
27750 color: #667085;
27751 border-top: 1px solid #ebedf0;
27752 border-bottom: 1px solid #ebedf0;
27753 border-radius: 0;
27754 background: #f9fafb;
27755 position: relative;
27756 padding: 8px 18px;
27757 left: -8px;
27758 width: calc(100% + 16px);
27759 cursor: text;
27760 margin-bottom: 10px;
27761 }
27762 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.list-title.not-found {
27763 color: #ec5956;
27764 }
27765 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.button-area {
27766 border-top: 1px solid #ebedf0;
27767 border-radius: 0;
27768 position: relative;
27769 left: -12px;
27770 width: calc(100% + 16px);
27771 padding: 20px 20px 8px;
27772 display: flex;
27773 align-items: center;
27774 background: transparent;
27775 margin-top: 10px;
27776 margin-left: 4px;
27777 }
27778 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.button-area button {
27779 cursor: pointer;
27780 }
27781 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.button-area .cancel-btn {
27782 margin-left: auto;
27783 margin-right: 12px;
27784 }
27785 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown {
27786 position: relative;
27787 }
27788 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown::before {
27789 content: url("data:image/svg+xml,%3Csvg%20fill%3D%22none%22%20viewBox%3D%220%200%206%2010%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20stroke%3D%22%23A7A8B3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M1%201l4%204-4%204%22%2F%3E%3C%2Fsvg%3E");
27790 position: absolute;
27791 width: 6px;
27792 top: 50%;
27793 right: 10px;
27794 transform: translateY(-50%);
27795 }
27796 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown ul.mintmrm-dropdown {
27797 left: calc(100% + 8px);
27798 top: -10px;
27799 }
27800 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown.show::before {
27801 top: 25%;
27802 transform: rotate(90deg);
27803 transition: all 0.3s ease;
27804 }
27805 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.group-item {
27806 transition: all 0.3s ease;
27807 padding-left: 20px;
27808 }
27809 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .no-found {
27810 background-color: #f9fafb;
27811 padding: 5px 0 5px 20px;
27812 border-radius: 0;
27813 background: #f9fafb;
27814 position: relative;
27815 left: -12px;
27816 width: calc(100% + 24px);
27817 cursor: text;
27818 margin-top: 10px;
27819 display: none;
27820 }
27821 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .no-found span {
27822 font-weight: 600;
27823 font-size: 12px;
27824 line-height: 15px;
27825 letter-spacing: 0.05em;
27826 text-transform: uppercase;
27827 color: #ec5956;
27828 }
27829 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action {
27830 display: flex;
27831 align-items: center;
27832 padding: 15px 17px 10px;
27833 color: #573bff;
27834 font-weight: 600;
27835 font-size: 14px;
27836 line-height: 17px;
27837 border-top: 1px solid #e2e5ed;
27838 position: relative;
27839 text-decoration: underline;
27840 left: -12px;
27841 width: calc(100% + 24px);
27842 }
27843 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action svg {
27844 margin-right: 5px;
27845 }
27846 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action svg path {
27847 stroke: #573bff;
27848 }
27849 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action:hover {
27850 color: #4c25a5;
27851 }
27852 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action:hover svg path {
27853 stroke: #4c25a5;
27854 }
27855 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section {
27856 max-height: 200px;
27857 overflow: auto;
27858 }
27859 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section::-webkit-scrollbar {
27860 width: 5px;
27861 }
27862 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section::-webkit-scrollbar-track {
27863 background: #f2f5f8;
27864 }
27865 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section::-webkit-scrollbar-thumb {
27866 background-color: #c1c1c1;
27867 border-radius: 20px;
27868 }
27869 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .merge-tag-icon {
27870 position: absolute;
27871 bottom: 0;
27872 right: 8px;
27873 cursor: pointer;
27874 }
27875 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown {
27876 width: 225px;
27877 top: calc(100% + 5px);
27878 }
27879 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown::before {
27880 display: none;
27881 }
27882 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown .title {
27883 margin-bottom: 6px;
27884 border-bottom: 1px solid #f0f1f4;
27885 font-weight: 600;
27886 font-size: 14px;
27887 line-height: 16px;
27888 color: #2d3149;
27889 padding: 5px 12px 12px;
27890 margin-left: -8px;
27891 width: calc(100% + 16px);
27892 }
27893 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown li {
27894 font-weight: 400;
27895 }
27896 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown {
27897 position: relative;
27898 }
27899 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown::before {
27900 content: url("data:image/svg+xml,%3Csvg%20fill%3D%22none%22%20viewBox%3D%220%200%206%2010%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20stroke%3D%22%23A7A8B3%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%20d%3D%22M1%201l4%204-4%204%22%2F%3E%3C%2Fsvg%3E");
27901 position: absolute;
27902 width: 6px;
27903 top: 50%;
27904 right: 10px;
27905 transform: translateY(-50%);
27906 }
27907 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown ul.mintmrm-dropdown {
27908 left: calc(100% + 8px);
27909 top: -10px;
27910 }
27911 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown.show::before {
27912 top: 25%;
27913 transform: rotate(90deg);
27914 transition: all 0.3s ease;
27915 }
27916 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.group-item {
27917 transition: all 0.3s ease;
27918 padding-left: 20px;
27919 }
27920 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon {
27921 cursor: pointer;
27922 position: absolute;
27923 bottom: 0;
27924 right: 10px;
27925 }
27926 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon .openai-icon-wrapper .personalized-tooltip {
27927 position: absolute;
27928 top: -45px;
27929 right: 0;
27930 background: #333;
27931 font-size: 12px;
27932 color: #fff;
27933 width: 80px;
27934 text-align: center;
27935 padding: 6px;
27936 border-radius: 7px;
27937 opacity: 0;
27938 visibility: hidden;
27939 transition: all 0.3s ease;
27940 }
27941 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon .openai-icon-wrapper .personalized-tooltip:before {
27942 content: "";
27943 position: absolute;
27944 right: 5px;
27945 bottom: -4px;
27946 background: #333333;
27947 width: 12px;
27948 height: 12px;
27949 transform: rotate(45deg);
27950 }
27951 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon:hover .personalized-tooltip {
27952 opacity: 1;
27953 visibility: visible;
27954 }
27955 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay {
27956 position: fixed;
27957 top: 0;
27958 left: 0;
27959 right: 0;
27960 bottom: 0;
27961 background-color: rgba(0, 0, 0, 0.5);
27962 display: flex;
27963 justify-content: center;
27964 align-items: center;
27965 z-index: 9999;
27966 }
27967 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner {
27968 position: relative;
27969 max-width: 650px;
27970 width: 100%;
27971 }
27972 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .close-icon {
27973 position: absolute;
27974 cursor: pointer;
27975 height: 46px;
27976 right: -17px;
27977 top: -17px;
27978 width: 46px;
27979 z-index: 6;
27980 align-items: center;
27981 background: #fff;
27982 border-radius: 100px;
27983 box-shadow: 0 1px 1px #dadada;
27984 cursor: pointer;
27985 display: flex;
27986 justify-content: center;
27987 position: absolute;
27988 }
27989 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .close-icon svg {
27990 height: 12px;
27991 width: 12px;
27992 cursor: pointer;
27993 }
27994 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content {
27995 background-color: white;
27996 padding: 40px;
27997 border-radius: 8px;
27998 text-align: center;
27999 max-width: 100%;
28000 width: 100%;
28001 }
28002 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title {
28003 align-items: center;
28004 display: flex;
28005 flex-flow: column;
28006 margin-bottom: 24px;
28007 width: 100%;
28008 }
28009 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title svg {
28010 height: 56px;
28011 width: 56px;
28012 }
28013 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title svg path {
28014 fill: #11a37f;
28015 }
28016 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title .title {
28017 color: #2d3149;
28018 font-size: 20px;
28019 font-weight: 500;
28020 line-height: 1.2;
28021 padding: 17px 0 0;
28022 }
28023 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .openai-input-wrapper {
28024 text-align: center;
28025 width: 100%;
28026 }
28027 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .openai-input-wrapper .openai-connect-btn {
28028 background-color: #573bff;
28029 border: 1px solid transparent;
28030 border-radius: 6px;
28031 color: #fff;
28032 cursor: pointer;
28033 display: inline-block;
28034 font-size: 16px;
28035 font-style: normal;
28036 font-weight: 500;
28037 letter-spacing: -0.01em;
28038 line-height: 17px;
28039 padding: 11px 18px;
28040 text-align: center;
28041 text-transform: capitalize;
28042 opacity: 1;
28043 transition: all 0.3s ease;
28044 text-decoration: none;
28045 }
28046 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group:last-child {
28047 margin-bottom: 0;
28048 }
28049 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group > label {
28050 font-size: 15px;
28051 color: #363B4E;
28052 font-weight: 500;
28053 letter-spacing: -0.01em;
28054 display: flex;
28055 align-items: center;
28056 gap: 4px;
28057 margin-bottom: 8px;
28058 }
28059 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select,
28060 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number],
28061 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text],
28062 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email] {
28063 border: 1px solid #EEF0F3;
28064 padding: 7px 15px;
28065 height: auto;
28066 }
28067 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea,
28068 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select,
28069 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number],
28070 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text],
28071 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email] {
28072 color: #363B4E;
28073 }
28074 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea:-webkit-autofill,
28075 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select:-webkit-autofill,
28076 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]:-webkit-autofill,
28077 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]:-webkit-autofill,
28078 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]:-webkit-autofill {
28079 -webkit-box-shadow: 0 0 0 30px #ffffff inset;
28080 box-shadow: 0 0 0 30px #ffffff inset;
28081 -webkit-text-fill-color: #363B4E !important;
28082 }
28083 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea::-webkit-input-placeholder,
28084 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select::-webkit-input-placeholder,
28085 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]::-webkit-input-placeholder,
28086 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]::-webkit-input-placeholder,
28087 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]::-webkit-input-placeholder {
28088 color: #A7A8B3;
28089 }
28090 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea::-moz-placeholder,
28091 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select::-moz-placeholder,
28092 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]::-moz-placeholder,
28093 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]::-moz-placeholder,
28094 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]::-moz-placeholder {
28095 color: #A7A8B3;
28096 }
28097 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea:-ms-input-placeholder,
28098 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select:-ms-input-placeholder,
28099 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]:-ms-input-placeholder,
28100 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]:-ms-input-placeholder,
28101 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]:-ms-input-placeholder {
28102 color: #A7A8B3;
28103 }
28104 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea:-moz-placeholder,
28105 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select:-moz-placeholder,
28106 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]:-moz-placeholder,
28107 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]:-moz-placeholder,
28108 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]:-moz-placeholder {
28109 color: #A7A8B3;
28110 }
28111 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select {
28112 color: #A7A8B3;
28113 padding-right: 38px;
28114 -webkit-appearance: none;
28115 appearance: none;
28116 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiNBN0E4QjMiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==);
28117 background-repeat: no-repeat;
28118 background-position-x: calc(100% - 15px);
28119 background-position-y: 16px;
28120 background-size: 12px 12px;
28121 }
28122 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select.value-selected {
28123 color: #363B4E;
28124 }
28125 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select option {
28126 color: #A7A8B3;
28127 }
28128 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input {
28129 display: flex;
28130 flex-flow: row wrap;
28131 gap: 15px;
28132 }
28133 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input .single-input {
28134 width: calc(50% - 8px);
28135 }
28136 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input select,
28137 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input input[type=number] {
28138 min-width: auto;
28139 }
28140 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .has-tooltip {
28141 position: relative;
28142 }
28143 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .has-tooltip .mintmrm-tooltip {
28144 position: unset;
28145 margin-left: 4px;
28146 transform: translateY(2px);
28147 }
28148 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .has-tooltip .mintmrm-tooltip p {
28149 left: 0;
28150 }
28151 .mailmint-automation .steps-settings-sidebar .steps-settings .inline-with-link {
28152 display: flex;
28153 align-items: center;
28154 justify-content: space-between;
28155 }
28156 .mailmint-automation .steps-settings-sidebar .steps-settings .inline-with-link a {
28157 font-weight: 500;
28158 font-size: 14px;
28159 line-height: 1;
28160 letter-spacing: -0.01em;
28161 color: #6E42D3;
28162 text-decoration: underline;
28163 }
28164 .mailmint-automation .steps-settings-sidebar .steps-settings .inline-with-link a:hover {
28165 text-decoration: none;
28166 }
28167 .mailmint-automation .steps-settings-sidebar .add-template-section {
28168 border: 1px solid #E4E6EB;
28169 border-radius: 6px;
28170 padding: 24px 24px 22px;
28171 }
28172 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template {
28173 display: flex;
28174 flex-flow: column;
28175 align-items: center;
28176 justify-content: center;
28177 width: 160px;
28178 margin: 0 auto;
28179 cursor: pointer;
28180 }
28181 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper {
28182 align-items: center;
28183 background-color: #f6f6f7;
28184 border-radius: 100px;
28185 display: flex;
28186 height: 190px;
28187 justify-content: center;
28188 position: relative;
28189 width: 190px;
28190 }
28191 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg {
28192 background-color: #f4f5fa;
28193 border: 1px solid #e4e6eb;
28194 border-radius: 6px;
28195 padding: 4px 7px;
28196 position: relative;
28197 }
28198 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .hoverlay {
28199 position: absolute;
28200 width: 154px;
28201 height: 168px;
28202 border-radius: 6px;
28203 background: rgba(38, 27, 103, 0.6);
28204 transform: translate(-50%, -50%);
28205 top: 50%;
28206 left: 50%;
28207 display: flex;
28208 align-items: center;
28209 justify-content: center;
28210 opacity: 0;
28211 z-index: 999;
28212 }
28213 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .hoverlay:hover {
28214 opacity: 1;
28215 transition: all 0.3s ease;
28216 }
28217 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .hoverlay button {
28218 background: #fff;
28219 border-radius: 8px;
28220 border: none;
28221 box-shadow: 0 10px 16px rgba(97, 103, 116, 0.15);
28222 color: #2d3149;
28223 font-size: 12px;
28224 font-weight: 600;
28225 letter-spacing: -0.01em;
28226 line-height: 1;
28227 padding: 8px 11px;
28228 width: 105px;
28229 cursor: pointer;
28230 }
28231 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .image-wrapper {
28232 background-position: 50%;
28233 background-repeat: no-repeat;
28234 background-size: 100% auto;
28235 height: 158px;
28236 overflow: hidden;
28237 position: relative;
28238 width: 139px;
28239 }
28240 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode {
28241 font-weight: 600;
28242 font-size: 15px;
28243 line-height: 1.3;
28244 letter-spacing: -0.01em;
28245 text-decoration-line: underline;
28246 color: #6E42D3;
28247 display: block;
28248 margin-top: 12px;
28249 }
28250 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode svg {
28251 position: relative;
28252 top: 3px;
28253 margin-left: 8px;
28254 }
28255 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode svg path {
28256 stroke: #6E42D3;
28257 }
28258 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode.edit-mood svg {
28259 margin-right: 8px;
28260 margin-left: 0;
28261 }
28262 .mailmint-automation .steps-settings-sidebar .wpfnl-mint-automation-add-item {
28263 background: none;
28264 color: #6E42D3;
28265 font-size: 14px;
28266 line-height: 1;
28267 font-weight: 600;
28268 letter-spacing: -0.01em;
28269 text-decoration-line: underline;
28270 text-transform: capitalize;
28271 border: none;
28272 cursor: pointer;
28273 display: flex;
28274 align-items: center;
28275 gap: 6px;
28276 padding-left: 7px;
28277 margin-bottom: 2px;
28278 }
28279 .mailmint-automation .steps-settings-sidebar .wpfnl-mint-automation-add-item .wpfnl-loader {
28280 display: block;
28281 }
28282 .mailmint-automation .steps-settings-sidebar .wpfnl-mint-automation-add-item svg path {
28283 stroke: #6E42D3;
28284 }
28285 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater {
28286 border: 1px solid #e4e6eb;
28287 border-radius: 6px;
28288 margin-bottom: 16px;
28289 padding: 10px 15px 15px;
28290 width: 100%;
28291 }
28292 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater > hr {
28293 left: -15px;
28294 margin: 15px 0;
28295 position: relative;
28296 width: calc(100% + 30px);
28297 display: block;
28298 border-top: 1px solid #e4e6eb;
28299 border-bottom: 0;
28300 }
28301 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater .btn-default {
28302 min-width: auto;
28303 padding: 0 20px;
28304 }
28305 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .repeater-wrapper {
28306 align-items: flex-start;
28307 display: flex;
28308 gap: 5px;
28309 margin-bottom: 10px;
28310 }
28311 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .single-repeater-item {
28312 width: calc(50% - 23px);
28313 }
28314 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .single-repeater-item > label {
28315 margin-bottom: 6px;
28316 display: block;
28317 font-size: 13px;
28318 }
28319 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .single-repeater-item input[type=text] {
28320 min-width: auto;
28321 color: #A7A8B3;
28322 font-size: 13px;
28323 }
28324 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .trash-btn {
28325 align-items: center;
28326 background: transparent;
28327 border: 1px solid #e4e6eb;
28328 border-radius: 5px;
28329 display: flex;
28330 height: 36px;
28331 justify-content: center;
28332 position: relative;
28333 top: 22px;
28334 width: 36px;
28335 cursor: pointer;
28336 }
28337 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper {
28338 position: relative;
28339 background: #f6f8fa;
28340 border-radius: 10px;
28341 padding: 20px 24px;
28342 }
28343 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper:first-child::before {
28344 display: none;
28345 }
28346 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper::before {
28347 content: "Or";
28348 position: absolute;
28349 z-index: 1;
28350 font-weight: 600;
28351 font-size: 16px;
28352 line-height: 1;
28353 letter-spacing: -0.01em;
28354 color: #2D3149;
28355 top: -25px;
28356 left: 0;
28357 }
28358 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules {
28359 display: flex;
28360 flex-flow: row wrap;
28361 gap: 12px;
28362 padding-bottom: 20px;
28363 position: relative;
28364 }
28365 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions {
28366 position: relative;
28367 }
28368 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions::before {
28369 content: "";
28370 width: 30px;
28371 height: 1px;
28372 background: #E2E6F2;
28373 position: absolute;
28374 right: -30px;
28375 top: 50%;
28376 transform: translateY(-50%);
28377 }
28378 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions > button {
28379 width: 38px;
28380 height: 38px;
28381 background: #ffffff;
28382 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
28383 border-radius: 6px;
28384 display: flex;
28385 flex-flow: column;
28386 align-items: center;
28387 justify-content: center;
28388 border: none;
28389 cursor: pointer;
28390 }
28391 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition svg {
28392 display: block;
28393 }
28394 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition path {
28395 fill: #A7A8B3;
28396 }
28397 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is {
28398 width: 114px;
28399 }
28400 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is .wpfnl-selectbox .selectable-options {
28401 width: calc(100% + 124px);
28402 }
28403 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is .selected-option {
28404 overflow: hidden;
28405 white-space: nowrap;
28406 text-overflow: ellipsis;
28407 }
28408 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-1 {
28409 width: 170px;
28410 }
28411 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-2 {
28412 width: 205px;
28413 }
28414 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-2 .wpfnl-custom-selectbox select {
28415 padding: 5px 15px;
28416 }
28417 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-1,
28418 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is,
28419 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-2 {
28420 position: relative;
28421 }
28422 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:before {
28423 content: "";
28424 position: absolute;
28425 right: 8px;
28426 bottom: calc(50% + 10px);
28427 width: 1px;
28428 height: 100%;
28429 background: #E2E6F2;
28430 z-index: 0;
28431 }
28432 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:first-child::before {
28433 display: none;
28434 }
28435 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol {
28436 position: absolute;
28437 top: -50%;
28438 right: -4px;
28439 transform: translateY(50%);
28440 }
28441 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol > span {
28442 width: 22px;
28443 height: 22px;
28444 border: 1px solid #E2E6F2;
28445 color: #573BFF;
28446 border-radius: 100%;
28447 font-size: 12px;
28448 font-weight: 500;
28449 display: block;
28450 padding: 2px 2px;
28451 text-align: center;
28452 background-color: #F6F8FA;
28453 }
28454 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:first-child .condition-symbol {
28455 display: none;
28456 }
28457 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .selectable-options {
28458 overflow: visible;
28459 display: none;
28460 }
28461 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .selectable-options li {
28462 position: relative;
28463 line-height: 1.3;
28464 padding: 9px 12px 7px;
28465 }
28466 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .selected-option:before {
28467 transition: all 0.3s ease;
28468 }
28469 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox.show-options > .selectable-options {
28470 display: block;
28471 }
28472 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox.show-options .selected-option:before {
28473 transform: translateY(-50%) rotate(-180deg);
28474 }
28475 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .submenu {
28476 position: absolute;
28477 left: 100%;
28478 top: 0;
28479 width: 160px;
28480 border-radius: 6px;
28481 border: 1px solid #EBEDF0;
28482 background: #FFF;
28483 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
28484 padding: 8px;
28485 display: none;
28486 }
28487 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox li.show-options .submenu {
28488 display: block;
28489 }
28490 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .angle-right {
28491 position: absolute;
28492 right: 9px;
28493 top: 12px;
28494 line-height: 1;
28495 width: 11px;
28496 height: 11px;
28497 background: url("data:image/svg+xml;charset=utf-8,%3Csvg fill=%27none%27 viewBox=%270 0 12 7%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath stroke=%27%23A7A8B3%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%271.8%27 d=%27M11 1 6 6 1 1%27/%3E%3C/svg%3E");
28498 background-repeat: no-repeat;
28499 background-position: center;
28500 background-size: contain;
28501 transform: rotate(-90deg);
28502 }
28503 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules input.input-value {
28504 line-height: 1;
28505 padding: 10px 15px;
28506 min-width: auto;
28507 }
28508 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .selectbox-selected-value {
28509 width: 100%;
28510 padding: 8px 33px 7px 12px;
28511 background-color: #fff;
28512 display: flex;
28513 gap: 2px;
28514 align-items: center;
28515 min-height: 38px;
28516 }
28517 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .selectbox-selected-value:before {
28518 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==");
28519 width: 10px;
28520 }
28521 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .selectbox-search input[type=search] {
28522 min-width: 100%;
28523 }
28524 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .wpfnl-selected-item {
28525 white-space: nowrap;
28526 overflow: hidden;
28527 width: 101px;
28528 text-overflow: ellipsis;
28529 margin: 0;
28530 }
28531 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .more-items {
28532 width: 25px;
28533 line-height: 1;
28534 display: block;
28535 }
28536 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition {
28537 display: flex;
28538 align-items: center;
28539 gap: 5px;
28540 font-weight: 500;
28541 font-size: 15px;
28542 line-height: 1.12;
28543 color: #6E42D3;
28544 background: transparent;
28545 border: none;
28546 cursor: pointer;
28547 }
28548 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition svg {
28549 width: 12px;
28550 height: 12px;
28551 }
28552 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition path {
28553 stroke: #6E42D3;
28554 }
28555 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__input {
28556 font-size: 14px;
28557 padding: 11px 30px 9px 32px;
28558 border: 1px solid #EEF0F3;
28559 color: #363B4E;
28560 line-height: 1;
28561 border-radius: 6px;
28562 }
28563 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__arrow_top {
28564 display: none;
28565 }
28566 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu {
28567 border-radius: 10px;
28568 border: 1px solid #F1F0F5;
28569 background: #FFF;
28570 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
28571 width: 277px;
28572 }
28573 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row {
28574 width: calc(100% - 50px) !important;
28575 margin-left: auto;
28576 }
28577 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_buttons {
28578 gap: 7px;
28579 }
28580 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_button {
28581 padding: 3px 8px;
28582 height: auto;
28583 margin: 0;
28584 }
28585 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_select {
28586 background-color: #6E42D3;
28587 color: #fff;
28588 }
28589 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_cancel {
28590 border: 1px solid var(--dp-border-color);
28591 }
28592 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu_inner {
28593 padding: 10px;
28594 }
28595 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__month_year_row {
28596 border-radius: 8px;
28597 gap: 6px;
28598 margin-bottom: 6px;
28599 }
28600 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__calendar_header_item {
28601 color: #9398A5;
28602 }
28603 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__calendar_header_separator {
28604 background: #F1F0F5;
28605 margin-bottom: 15px;
28606 }
28607 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp--arrow-btn-nav {
28608 border-radius: 8px;
28609 border: 1px solid #F1F0F5;
28610 height: 35px;
28611 }
28612 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp--arrow-btn-nav svg {
28613 width: 17px;
28614 height: 17px;
28615 }
28616 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__inner_nav {
28617 border-radius: 8px;
28618 background: transparent;
28619 }
28620 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__month_year_wrap {
28621 gap: 6px;
28622 }
28623 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__month_year_wrap .dp__btn {
28624 background: #fff;
28625 border-radius: 8px;
28626 border: 1px solid #F1F0F5;
28627 }
28628 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_inner {
28629 color: #2D3149;
28630 font-weight: 500;
28631 border-radius: 50%;
28632 }
28633 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_offset {
28634 color: #a6a7a9;
28635 }
28636 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_disabled,
28637 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_offset.dp__cell_disabled {
28638 color: #D0D5DD;
28639 }
28640 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__active_date {
28641 background: #6E42D3;
28642 border-radius: 50%;
28643 color: #fff;
28644 border: none;
28645 }
28646 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__today {
28647 border: none;
28648 }
28649 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__instance_calendar button[aria-label="Open time picker"] {
28650 position: absolute;
28651 left: 5px;
28652 bottom: -40px;
28653 width: auto;
28654 background: transparent;
28655 z-index: 1;
28656 }
28657 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__overlay button[aria-label="Close time Picker"] {
28658 position: absolute;
28659 left: 5px;
28660 bottom: -40px;
28661 width: auto;
28662 background: white;
28663 z-index: 1;
28664 }
28665 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__overlay_cell_active {
28666 color: #fff;
28667 }
28668 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__selection_preview {
28669 display: none;
28670 }
28671 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__time_display {
28672 font-weight: 500;
28673 padding: 10px 5px;
28674 }
28675 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__inc_dec_button_inline {
28676 width: 15px;
28677 height: 15px;
28678 position: relative;
28679 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==);
28680 background-repeat: no-repeat;
28681 background-size: 15px 15px;
28682 background-position: center;
28683 left: -1px;
28684 }
28685 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__inc_dec_button_inline .dp__tp_inline_btn_bar {
28686 display: none;
28687 }
28688 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__tp_inline_btn_top {
28689 transform: rotate(-180deg);
28690 }
28691 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__pm_am_button {
28692 font-size: 13px;
28693 padding: 5px;
28694 background: #f1f1f1;
28695 border: 1px solid var(--dp-border-color);
28696 color: #333;
28697 width: 32px;
28698 }
28699
28700 @media only screen and (max-width: 1399px) {
28701 .wpfnl .mailmint-automation .condition .automation-steps-wrapper {
28702 width: calc(100% - 484px);
28703 }
28704 .wpfnl .mailmint-automation .condition .steps-settings-sidebar {
28705 width: 460px;
28706 }
28707 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper {
28708 background: transparent;
28709 border-radius: 0;
28710 padding: 0;
28711 }
28712 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules {
28713 flex-flow: column;
28714 background: #f6f8fa;
28715 margin-top: 40px;
28716 padding: 15px;
28717 border-radius: 10px;
28718 }
28719 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:first-child {
28720 margin-top: 0;
28721 }
28722 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules {
28723 width: 100%;
28724 }
28725 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox {
28726 max-width: 100%;
28727 }
28728 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions {
28729 position: absolute;
28730 right: -12px;
28731 top: -13px;
28732 }
28733 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions > button {
28734 width: 30px;
28735 height: 30px;
28736 box-shadow: 0px 1px 6px rgba(182, 185, 191, 0.33);
28737 border-radius: 100%;
28738 }
28739 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions::before {
28740 display: none;
28741 }
28742 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition svg {
28743 display: block;
28744 width: 15px;
28745 height: 15px;
28746 }
28747 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition path {
28748 fill: #ec5956;
28749 }
28750 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:before {
28751 display: none;
28752 }
28753 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol {
28754 position: absolute;
28755 top: 0;
28756 right: 50%;
28757 transform: translate(11px, -31px);
28758 }
28759 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol:before {
28760 content: "";
28761 position: absolute;
28762 left: 10px;
28763 top: -10px;
28764 height: calc(100% + 20px);
28765 width: 1px;
28766 background: #E2E6F2;
28767 z-index: -1;
28768 }
28769 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition {
28770 margin-top: 14px;
28771 }
28772 }
28773 @media only screen and (max-width: 1199px) {
28774 .wpfnl .mailmint-automation .condition .steps-settings-sidebar,
28775 .wpfnl .mailmint-automation .steps-settings-sidebar {
28776 width: 380px;
28777 padding: 14px 15px;
28778 }
28779 .wpfnl .mailmint-automation .has-sidebar .automation-steps-wrapper {
28780 width: calc(100% - 404px);
28781 }
28782 .mailmint-automation .logical-decision-box {
28783 max-width: 345px;
28784 }
28785 }
28786 .arco-popover-content,
28787 .arco-popconfirm-content {
28788 border-radius: 8px;
28789 border: none;
28790 width: 293px;
28791 padding: 20px;
28792 }
28793 .arco-popover-content .arco-tree-node-title,
28794 .arco-popconfirm-content .arco-tree-node-title {
28795 width: 100%;
28796 }
28797 .arco-popover-content .color-input-picker-wrapper,
28798 .arco-popconfirm-content .color-input-picker-wrapper {
28799 display: flex;
28800 align-items: start;
28801 justify-content: space-between;
28802 padding-bottom: 20px;
28803 margin-bottom: 20px;
28804 border-bottom: 1px solid #EBEDF0;
28805 }
28806 .arco-popover-content .color-title,
28807 .arco-popconfirm-content .color-title {
28808 color: #2D3149;
28809 font-size: 13px;
28810 font-weight: 500;
28811 line-height: 1.2;
28812 letter-spacing: -0.13px;
28813 margin-bottom: 8px;
28814 }
28815 .arco-popover-content .title-field-wrapper .color-field-wrapper,
28816 .arco-popconfirm-content .title-field-wrapper .color-field-wrapper {
28817 display: flex;
28818 gap: 7px;
28819 }
28820 .arco-popover-content .title-field-wrapper .color-field-wrapper input[type=text],
28821 .arco-popconfirm-content .title-field-wrapper .color-field-wrapper input[type=text] {
28822 width: 96px;
28823 padding: 6px 12px;
28824 border-radius: 4px;
28825 border: 1px solid #EBEDF0;
28826 line-height: 1.3;
28827 }
28828 .arco-popover-content .title-field-wrapper .color-field-wrapper .color-bg,
28829 .arco-popconfirm-content .title-field-wrapper .color-field-wrapper .color-bg {
28830 border-radius: 4px;
28831 border: 1px solid #EBEDF0;
28832 }
28833 .arco-popover-content .title-field-wrapper .picker-btn,
28834 .arco-popconfirm-content .title-field-wrapper .picker-btn {
28835 position: relative;
28836 width: 34px;
28837 height: 32px;
28838 border-radius: 4px;
28839 border: 1px solid #EBEDF0;
28840 }
28841 .arco-popover-content .title-field-wrapper .picker-btn:before,
28842 .arco-popconfirm-content .title-field-wrapper .picker-btn:before {
28843 position: absolute;
28844 top: 50%;
28845 left: 50%;
28846 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzJEMzE0OSIgZD0iTTE0LjMgMS43NWMtMS0xLTIuNi0xLTMuNTUgMEw4LjkgMy42Yy0uNTUtLjI1LTEuMjUtLjItMS43LjMtLjYuNi0uNiAxLjU1IDAgMi4xNWwtNC4zIDQuM2MtLjMuMy0uNDUuNy0uNDUgMS4xNWwtMSAxYy0uNi42LS42IDEuNTUgMCAyLjE1LjM1LjIuNy4zNSAxLjEuMzUuNCAwIC43NS0uMTUgMS4wNS0uNDVsMS0xYy40LjA1Ljg1LS4xNSAxLjE1LS40NWw0LjMtNC4zYy4zLjMuNy40NSAxLjA1LjQ1LjQgMCAuNzUtLjE1IDEuMDUtLjQ1LjQ1LS40NS41NS0xLjE1LjMtMS43bDEuODUtMS44NWMxLS45NSAxLTIuNTUgMC0zLjV6bS00Ljk1IDYuNEw3LjUgMTBINC42bDMuMy0zLjMgMS40NSAxLjQ1eiIvPjwvc3ZnPg==");
28847 height: 16px;
28848 width: 16px;
28849 transform: translate(-50%, -50%);
28850 }
28851
28852 .openai-button-wrapper {
28853 width: 100%;
28854 padding: 14px 14px 0;
28855 display: none;
28856 }
28857 .openai-button-wrapper .arco-space-item .arco-btn-size-default {
28858 height: auto;
28859 padding: 11px 14px;
28860 border-radius: 8px;
28861 font-size: 15px;
28862 font-weight: 600;
28863 background-color: #11A37F;
28864 display: flex;
28865 align-items: center;
28866 gap: 6px;
28867 line-height: 1;
28868 }
28869 .openai-button-wrapper .arco-space-item .arco-btn-size-default:hover {
28870 background-color: #11A37F;
28871 }
28872 .openai-button-wrapper .arco-space-item .arco-btn::before {
28873 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjcxIDcuMzY2YTQuNDg4IDQuNDg4IDAgMDAtLjM4Ny0zLjY4MyA0LjUzNSA0LjUzNSAwIDAwLTQuODgyLTIuMTc1IDQuNTQ4IDQuNTQ4IDAgMDAtNy43MDcgMS42MjhBNC40ODkgNC40ODkgMCAwMC43MzYgNS4zMTFhNC41MzUgNC41MzUgMCAwMC41NTcgNS4zMjMgNC40ODUgNC40ODUgMCAwMC4zODMgMy42ODMgNC41MzggNC41MzggMCAwMDQuODg2IDIuMTc1QTQuNDg4IDQuNDg4IDAgMDA5Ljk0NCAxOGE0LjU0MSA0LjU0MSAwIDAwNC4zMjktMy4xNTQgNC40OTEgNC40OTEgMCAwMDIuOTk4LTIuMTc1IDQuNTQyIDQuNTQyIDAgMDAtLjU2LTUuMzA1em0tNi43NjYgOS40NTZhMy4zNTcgMy4zNTcgMCAwMS0yLjE1OC0uNzhsLjEwNy0uMDYxIDMuNTg0LTIuMDY5YS41OTYuNTk2IDAgMDAuMjk0LS41MVY4LjM0OGwxLjUxNS44NzZhLjA1My4wNTMgMCAwMS4wMjkuMDR2NC4xODZhMy4zNzggMy4zNzggMCAwMS0zLjM3MSAzLjM3em0tNy4yNDYtMy4wOTRhMy4zNTMgMy4zNTMgMCAwMS0uNC0yLjI2bC4xMDYuMDYzIDMuNTg3IDIuMDdhLjU3OC41NzggMCAwMC41ODUgMGw0LjM4My0yLjUyN3YxLjc0OWEuMDYuMDYgMCAwMS0uMDI1LjA0NmwtMy42MyAyLjA5NGEzLjM3NCAzLjM3NCAwIDAxLTQuNjA2LTEuMjM1em0tLjk0NC03LjgwNmEzLjM2NCAzLjM2NCAwIDAxMS43NzUtMS40OFY4LjdhLjU3NS41NzUgMCAwMC4yOS41MDdsNC4zNjEgMi41MTYtMS41MTUuODc3YS4wNTcuMDU3IDAgMDEtLjA1MyAwbC0zLjYyMy0yLjA5YTMuMzc4IDMuMzc4IDAgMDEtMS4yMzUtNC42MDZ2LjAxOHptMTIuNDQ4IDIuODkyTDkuODI3IDYuMjczbDEuNTExLS44NzNhLjA1Ny4wNTcgMCAwMS4wNTQgMGwzLjYyMiAyLjA5M2EzLjM3IDMuMzcgMCAwMS0uNTA3IDYuMDc5VjkuMzE0YS41OTIuNTkyIDAgMDAtLjMwNS0uNXptMS41MDgtMi4yNjhsLS4xMDctLjA2NC0zLjU4LTIuMDg2YS41ODIuNTgyIDAgMDAtLjU4OSAwTDcuMDU2IDYuOTIyVjUuMTczYS4wNS4wNSAwIDAxLjAyLS4wNDZsMy42MjQtMi4wOWEzLjM3NCAzLjM3NCAwIDAxNS4wMSAzLjQ5NXYuMDE0ek02LjIyOSA5LjY0N2wtMS41MTUtLjg3M2EuMDYuMDYgMCAwMS0uMDI5LS4wNDJWNC41NTZhMy4zNzQgMy4zNzQgMCAwMTUuNTMyLTIuNTlsLS4xMDcuMDYtMy41ODMgMi4wNjhhLjU5Ni41OTYgMCAwMC0uMjk1LjUxMUw2LjIzIDkuNjQ3em0uODIzLTEuNzc0bDEuOTUxLTEuMTI1IDEuOTU2IDEuMTI1djIuMjVMOS4wMSAxMS4yNDhsLTEuOTU2LTEuMTI1LS4wMDMtMi4yNXoiLz48L3N2Zz4=");
28874 width: 16px;
28875 height: 16px;
28876 display: block;
28877 }
28878
28879 .wpfnl-mrm-email-template__wrapper {
28880 position: fixed;
28881 top: 32px;
28882 right: 0;
28883 background: rgba(0, 0, 0, 0.3215686275);
28884 z-index: 999;
28885 width: calc(100% - 160px);
28886 height: 100%;
28887 display: flex;
28888 flex-flow: column;
28889 align-items: center;
28890 justify-content: center;
28891 }
28892 .wpfnl-mrm-email-template__wrapper .modal-loader {
28893 position: absolute;
28894 left: 0;
28895 top: 0;
28896 width: 100%;
28897 height: 100%;
28898 background: #f6f8fa;
28899 border-radius: 10px;
28900 z-index: 11;
28901 display: flex;
28902 flex-flow: column;
28903 align-items: center;
28904 justify-content: center;
28905 }
28906 .wpfnl-mrm-email-template__wrapper .modal-loader .wpfnl-loader {
28907 display: block;
28908 width: 40px;
28909 height: 40px;
28910 }
28911
28912 .folded .wpfnl-mrm-email-template__wrapper {
28913 width: calc(100% - 36px);
28914 }
28915
28916 .wpfnl-mrm-email-builder__modal {
28917 width: 100%;
28918 height: 100%;
28919 background: #fff;
28920 }
28921
28922 .wpfnl-mrm-email-template__modal {
28923 padding: 40px;
28924 width: 100%;
28925 height: 100%;
28926 max-height: 905px;
28927 }
28928 .wpfnl-mrm-email-template__modal .wpfnl-mrm-email-template__inner {
28929 position: relative;
28930 height: 100%;
28931 width: 100%;
28932 max-width: 1365px;
28933 margin: 0 auto;
28934 }
28935 .wpfnl-mrm-email-template__modal .template-modal-overflow {
28936 background: #f6f8fa;
28937 border-radius: 10px;
28938 position: relative;
28939 padding: 40px 80px;
28940 height: 100%;
28941 width: 100%;
28942 margin: 0 auto;
28943 overflow: auto;
28944 }
28945 .wpfnl-mrm-email-template__modal .template-modal-header {
28946 display: flex;
28947 flex-flow: row wrap;
28948 justify-content: space-between;
28949 align-items: center;
28950 }
28951 .wpfnl-mrm-email-template__modal .template-modal-header .modal-title {
28952 font-weight: 600;
28953 font-size: 20px;
28954 line-height: 1.2;
28955 color: #2d3149;
28956 }
28957 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter {
28958 display: flex;
28959 align-items: center;
28960 gap: 28px;
28961 }
28962 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item {
28963 font-weight: 400;
28964 font-size: 15px;
28965 color: #9398a5;
28966 cursor: pointer;
28967 padding: 4px 0;
28968 transition: all 0.3s ease;
28969 position: relative;
28970 background: transparent;
28971 border: none;
28972 line-height: 1;
28973 }
28974 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item:before {
28975 content: "";
28976 position: absolute;
28977 bottom: 0;
28978 left: 0;
28979 width: 100%;
28980 height: 2px;
28981 background: #6E42D3;
28982 visibility: hidden;
28983 opacity: 0;
28984 transition: all 0.3s ease;
28985 }
28986 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item.active {
28987 color: #6E42D3;
28988 }
28989 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item.active:before {
28990 opacity: 1;
28991 visibility: visible;
28992 }
28993 .wpfnl-mrm-email-template__modal .cross-icon {
28994 position: absolute;
28995 right: -20px;
28996 top: -20px;
28997 background: #ffffff;
28998 box-shadow: 0px 1px 1px #dadada;
28999 border-radius: 100px;
29000 width: 46px;
29001 height: 46px;
29002 display: flex;
29003 align-items: center;
29004 justify-content: center;
29005 cursor: pointer;
29006 z-index: 12;
29007 }
29008 .wpfnl-mrm-email-template__modal .mintmrm-template-wrapper {
29009 position: relative;
29010 display: flex;
29011 flex-flow: row wrap;
29012 margin-left: -40px;
29013 }
29014 .wpfnl-mrm-email-template__modal .mintmrm-single-template {
29015 width: calc(25% - 40px);
29016 margin-left: 40px;
29017 margin-top: 40px;
29018 position: relative;
29019 }
29020 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .mintmrm-single-remote-template {
29021 border-radius: 10px;
29022 cursor: default;
29023 }
29024 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .mintmrm-single-remote-template .template-image-wrapper {
29025 background-color: #fff;
29026 border-radius: 10px;
29027 background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='10' ry='10' stroke='%23A1A1B6FF' stroke-width='4' stroke-dasharray='6%2c 12' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
29028 }
29029 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .template-info .title {
29030 opacity: 0;
29031 visibility: hidden;
29032 }
29033 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .btn-default {
29034 position: absolute;
29035 top: 50%;
29036 left: 50%;
29037 transform: translate(-50%, -50%);
29038 width: 175px;
29039 box-shadow: 0px 10px 16px rgba(189, 193, 200, 0.5019607843);
29040 font-size: 15px;
29041 padding: 12px 15px;
29042 border: none;
29043 z-index: 9;
29044 height: auto;
29045 line-height: 1;
29046 }
29047 .wpfnl-mrm-email-template__modal .mintmrm-single-template.coming-soon {
29048 width: calc(75% - 40px);
29049 }
29050 .wpfnl-mrm-email-template__modal .mintmrm-single-template.coming-soon .coming-soon-inner {
29051 width: 100%;
29052 height: calc(100% - 35px);
29053 min-height: 120px;
29054 background: #fff;
29055 text-align: center;
29056 border-radius: 10px;
29057 display: flex;
29058 flex-flow: column;
29059 align-items: center;
29060 justify-content: center;
29061 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
29062 }
29063 .wpfnl-mrm-email-template__modal .mintmrm-single-template.coming-soon h2 {
29064 width: 100%;
29065 text-align: center;
29066 z-index: 2;
29067 font-size: 16px;
29068 font-weight: 600;
29069 color: #2d3149;
29070 cursor: text;
29071 }
29072 .wpfnl-mrm-email-template__modal .mintmrm-single-template .mintmrm-single-remote-wrapper {
29073 position: relative;
29074 }
29075 .wpfnl-mrm-email-template__modal .mintmrm-single-template .mintmail-delete-email-template {
29076 border: none;
29077 padding: 5px;
29078 margin-top: 10px;
29079 background: transparent;
29080 color: #d63638;
29081 text-decoration: underline;
29082 }
29083 .wpfnl-mrm-email-template__modal .mintmrm-single-template .mintmrm-single-remote-template {
29084 position: relative;
29085 }
29086 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-image-wrapper {
29087 background-repeat: no-repeat;
29088 background-size: 100% auto;
29089 background-position: center center;
29090 border-radius: 10px;
29091 position: relative;
29092 overflow: hidden;
29093 }
29094 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-image-wrapper:before {
29095 content: "";
29096 display: block;
29097 padding-top: calc(100% + 20px);
29098 }
29099 .wpfnl-mrm-email-template__modal .mintmrm-single-template .hoverlay {
29100 background: rgba(255, 255, 255, 0.85);
29101 border-radius: 6px;
29102 position: absolute;
29103 top: 0;
29104 left: 0;
29105 width: 100%;
29106 height: 100%;
29107 z-index: 9;
29108 padding: 0 15px;
29109 display: flex;
29110 flex-flow: column;
29111 align-items: center;
29112 justify-content: center;
29113 opacity: 0;
29114 visibility: hidden;
29115 transition: all 0.3s ease;
29116 }
29117 .wpfnl-mrm-email-template__modal .mintmrm-single-template .hoverlay .mintmrm-btn {
29118 padding: 11px 18px;
29119 }
29120 .wpfnl-mrm-email-template__modal .mintmrm-single-template.importing .hoverlay, .wpfnl-mrm-email-template__modal .mintmrm-single-template:hover .hoverlay {
29121 opacity: 1;
29122 visibility: visible;
29123 }
29124 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-img {
29125 width: 100%;
29126 height: 350px;
29127 border-radius: 10px 10px 0 0;
29128 object-fit: contain;
29129 }
29130 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-info {
29131 margin-top: 16px;
29132 }
29133 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-info .title {
29134 margin-bottom: 0;
29135 text-align: center;
29136 display: block;
29137 color: #2d3149;
29138 font-weight: 600;
29139 font-size: 18px;
29140 line-height: 1;
29141 letter-spacing: -0.01em;
29142 transition: all 0.3s ease;
29143 }
29144
29145 .mintmrm-delete-alert-wrapper {
29146 position: fixed;
29147 top: 0;
29148 right: 0;
29149 padding: 15px;
29150 width: calc(100% - 160px);
29151 height: 100%;
29152 background: rgba(16, 5, 46, 0.3);
29153 z-index: 999;
29154 display: none;
29155 flex-flow: row wrap;
29156 align-items: center;
29157 justify-content: center;
29158 }
29159 .mintmrm-delete-alert-wrapper.show-modal {
29160 display: flex;
29161 }
29162
29163 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation {
29164 background: #ffffff;
29165 border-radius: 10px;
29166 width: 100%;
29167 max-width: 514px;
29168 animation: mintmrm-bounce 0.3s;
29169 }
29170
29171 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header {
29172 border-radius: 10px 10px 0 0;
29173 justify-content: space-between;
29174 padding: 24px;
29175 position: relative;
29176 }
29177
29178 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header h3 {
29179 font-weight: 600;
29180 font-size: 18px;
29181 line-height: 1.11;
29182 }
29183
29184 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .delete-title {
29185 display: flex;
29186 align-items: center;
29187 gap: 8px;
29188 }
29189
29190 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .delete-title svg path {
29191 fill: #ec5956;
29192 }
29193
29194 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header p {
29195 margin-top: 14px;
29196 font-weight: 400;
29197 font-size: 14px;
29198 line-height: 1.21;
29199 color: #9398a5;
29200 }
29201
29202 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .cross-icon {
29203 height: 40px;
29204 width: 40px;
29205 background: #ffffff;
29206 box-shadow: 0px 1px 1px #dadada;
29207 border-radius: 100px;
29208 display: flex;
29209 justify-content: center;
29210 align-items: center;
29211 position: absolute;
29212 cursor: pointer;
29213 top: -12px;
29214 right: -12px;
29215 }
29216
29217 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .cross-icon svg path {
29218 fill: #686f7f;
29219 }
29220
29221 .mintmrm-delete-alert-wrapper .icon {
29222 width: 50px;
29223 height: 50px;
29224 border: 2px solid #e65555;
29225 display: flex;
29226 align-items: center;
29227 justify-content: center;
29228 }
29229
29230 .mintmrm-delete-alert-wrapper .icon svg {
29231 width: 18px;
29232 height: 18px;
29233 }
29234
29235 .mintmrm-delete-alert-wrapper .icon svg path {
29236 stroke: #e65555;
29237 }
29238
29239 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn {
29240 display: flex;
29241 flex-flow: row;
29242 align-items: center;
29243 justify-content: flex-end;
29244 padding: 20px;
29245 border-top: 1px solid #E9EAEE;
29246 }
29247
29248 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li {
29249 margin: 0 6px;
29250 }
29251
29252 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li:last-child {
29253 margin-right: 0;
29254 }
29255
29256 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li .cancel {
29257 background-color: transparent;
29258 border: 1px solid #e4e6eb;
29259 color: #2d3149;
29260 }
29261
29262 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li .cancel:hover {
29263 background-color: rgba(0, 0, 0, 0.031372549);
29264 }
29265
29266 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation {
29267 max-width: 530px;
29268 }
29269
29270 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header {
29271 background-color: transparent;
29272 border-bottom-color: #ebedf0;
29273 position: relative;
29274 padding: 25px 30px 25px 30px;
29275 }
29276
29277 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .cross-icon {
29278 height: 46px;
29279 width: 46px;
29280 box-shadow: 0px 1px 1px #dadada;
29281 border-radius: 100px;
29282 border: none;
29283 position: absolute;
29284 right: -14px;
29285 top: -15px;
29286 }
29287
29288 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-body {
29289 display: block;
29290 padding: 5px 30px 30px;
29291 }
29292
29293 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-body .form-group label {
29294 margin-bottom: 7px;
29295 color: #2d3149;
29296 font-weight: 600;
29297 }
29298
29299 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-body .form-group input[type=email] {
29300 font-size: 14px;
29301 min-height: 48px;
29302 color: #6a707c;
29303 border-color: #E9EAEE;
29304 width: 100%;
29305 }
29306
29307 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn li {
29308 margin: 0;
29309 }
29310
29311 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .mintmrm-btn {
29312 display: inline-block;
29313 border: none;
29314 height: 38px;
29315 font-size: 14px;
29316 line-height: 38px;
29317 color: #fff;
29318 font-weight: 500;
29319 padding: 0 30px;
29320 min-width: 130px;
29321 cursor: pointer;
29322 text-align: center;
29323 letter-spacing: 0.2px;
29324 border-radius: 10px;
29325 text-transform: capitalize;
29326 background-color: #6E42D3;
29327 border: 1px solid transparent;
29328 }
29329
29330 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .mintmrm-btn.outline {
29331 border-color: #6E42D3;
29332 color: #6E42D3;
29333 background-color: transparent;
29334 }
29335
29336 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .cancel {
29337 margin-right: 14px;
29338 }
29339
29340 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .alert-message p {
29341 color: #09af09;
29342 margin-right: 10px;
29343 font-size: 14px;
29344 font-weight: 500;
29345 }
29346
29347 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .alert-message.mintmrm-error p {
29348 color: #eb1010;
29349 }
29350
29351 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .mintmrm-loader {
29352 display: inline-block;
29353 position: relative;
29354 top: 2px;
29355 }
29356
29357 .mintmrm-loader {
29358 border: 2px solid #8265c5;
29359 border-radius: 50%;
29360 border-top: 2px solid #fff;
29361 width: 13px;
29362 height: 13px;
29363 animation: spin 0.7s linear infinite;
29364 display: inline-block;
29365 margin-left: 4px;
29366 }
29367
29368 .mintmrm-loader.show {
29369 display: block;
29370 }
29371
29372 @-webkit-keyframes spin {
29373 0% {
29374 -webkit-transform: rotate(0deg);
29375 }
29376 100% {
29377 -webkit-transform: rotate(360deg);
29378 }
29379 }
29380 @keyframes spin {
29381 0% {
29382 transform: rotate(0deg);
29383 }
29384 100% {
29385 transform: rotate(360deg);
29386 }
29387 }
29388 .folded .mintmrm-delete-alert-wrapper {
29389 width: calc(100% - 36px);
29390 }
29391
29392 .wpfnl-mrm-email-template__wrapper {
29393 width: calc(100% - 36px);
29394 }
29395 .wpfnl-mrm-email-template__wrapper .template-modal-inner {
29396 align-items: center;
29397 display: flex;
29398 max-width: 1215px;
29399 width: 100%;
29400 }
29401 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper {
29402 background: #f6f8fa;
29403 border-radius: 10px;
29404 padding: 24px 48px 40px 40px;
29405 position: relative;
29406 width: 100%;
29407 }
29408 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .cross-icon {
29409 align-items: center;
29410 background: #fff;
29411 border-radius: 100px;
29412 box-shadow: 0 1px 1px #dadada;
29413 cursor: pointer;
29414 display: flex;
29415 height: 34px;
29416 justify-content: center;
29417 position: absolute;
29418 right: -15px;
29419 top: -15px;
29420 width: 34px;
29421 z-index: 2;
29422 }
29423 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper h2 {
29424 color: #2d3149;
29425 font-size: 20px;
29426 font-weight: 600;
29427 line-height: 1.2;
29428 margin-bottom: 25px;
29429 }
29430 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper {
29431 align-items: start;
29432 display: flex;
29433 gap: 24px;
29434 }
29435 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section {
29436 background: #fff;
29437 border-radius: 10px;
29438 box-shadow: 0 1px 1px hsla(220, 7%, 73%, 0.3);
29439 width: 65%;
29440 }
29441 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header {
29442 align-items: center;
29443 border-bottom: 1px solid #ebedf0;
29444 display: flex;
29445 justify-content: space-between;
29446 padding: 17px 20px 17px 24px;
29447 }
29448 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section {
29449 border-radius: 6px;
29450 display: flex;
29451 }
29452 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section .desktop-icon {
29453 border-radius: 6px 0 0 6px;
29454 cursor: pointer;
29455 }
29456 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section .desktop-icon.active svg g {
29457 stroke: #573BFF;
29458 }
29459 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section .desktop-icon.active svg path {
29460 stroke: #573BFF;
29461 }
29462 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section .mobile-icon {
29463 border-radius: 0 6px 6px 0;
29464 cursor: pointer;
29465 }
29466 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section .mobile-icon.active svg g {
29467 stroke: #573BFF;
29468 }
29469 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section .mobile-icon.active svg path {
29470 stroke: #573BFF;
29471 }
29472 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section button {
29473 align-items: center;
29474 background-color: #fff;
29475 border-right: 1px solid #ebedf0;
29476 border: 1px solid #ebedf0;
29477 display: flex;
29478 height: 34px;
29479 justify-content: center;
29480 width: 44px;
29481 }
29482 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .edit-template-section .edit-template-btn {
29483 align-items: center;
29484 background-color: transparent;
29485 border: 1px solid #ebedf0;
29486 border-radius: 6px;
29487 color: #2d3149;
29488 display: flex;
29489 font-size: 14px;
29490 font-weight: 500;
29491 gap: 7px;
29492 line-height: 1.07;
29493 padding: 8px 16px;
29494 cursor: pointer;
29495 }
29496 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .template-modal-overflow {
29497 display: flex;
29498 height: 500px;
29499 justify-content: center;
29500 padding: 19px 24px 24px;
29501 background: #fff;
29502 border-radius: 10px;
29503 overflow: auto;
29504 width: 100%;
29505 margin: 0 auto;
29506 max-width: 1365px;
29507 position: relative;
29508 }
29509 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .template-modal-overflow .mobile-view {
29510 max-width: 400px;
29511 width: 100%;
29512 }
29513 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section {
29514 background: #fff;
29515 border-radius: 10px;
29516 box-shadow: 0 1px 1px hsla(220, 7%, 73%, 0.3);
29517 padding: 24px;
29518 width: 35%;
29519 }
29520 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .form-group {
29521 margin-bottom: 20px;
29522 position: relative;
29523 }
29524 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .form-group .at-the-rate-icon {
29525 bottom: 10px;
29526 left: 15px;
29527 position: absolute;
29528 }
29529 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .form-group input[type=email] {
29530 padding: 14px 15px 14px 43px;
29531 border: 1px solid #ebedf0;
29532 border-radius: 6px;
29533 color: #2d3149;
29534 display: block;
29535 font-weight: 400;
29536 line-height: 1.3;
29537 width: 100%;
29538 box-shadow: 0 0 0 transparent;
29539 background-color: #fff;
29540 }
29541 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn {
29542 display: flex;
29543 gap: 12px;
29544 justify-content: end;
29545 position: relative;
29546 }
29547 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn .alert-message {
29548 left: 0;
29549 max-width: 240px;
29550 position: absolute;
29551 top: 0;
29552 width: 100%;
29553 }
29554 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn .alert-message.wpfnl-error {
29555 color: #f44336;
29556 }
29557 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn .alert-message.wpfnl-success {
29558 color: #4caf50;
29559 }
29560
29561 .wpfnl-order-bump__template .template-preview-wrapper .description p {
29562 margin-bottom: 10px;
29563 }
29564 .wpfnl-order-bump__template .template-preview-wrapper .description p:last-child {
29565 margin-bottom: 0;
29566 }
29567 .wpfnl-order-bump__template .template-preview-wrapper .description ul {
29568 list-style: disc;
29569 }
29570 .wpfnl-order-bump__template .template-preview-wrapper .description ol,
29571 .wpfnl-order-bump__template .template-preview-wrapper .description ul {
29572 padding-left: 20px;
29573 margin-bottom: 10px;
29574 }
29575 .wpfnl-order-bump__template .template-preview-wrapper .description ol:last-child,
29576 .wpfnl-order-bump__template .template-preview-wrapper .description ul:last-child {
29577 margin-bottom: 0;
29578 }
29579
29580 .wpfnl-order-bump__template-style1 {
29581 background-color: #ffffff;
29582 border-radius: 12px;
29583 position: relative;
29584 border: 1px solid #E5E8F3;
29585 }
29586 .wpfnl-order-bump__template-style1 .preview-tag {
29587 background: #6E42D3;
29588 border-radius: 0px 3px 3px 0px;
29589 font-weight: 500;
29590 font-size: 12px;
29591 line-height: 14px;
29592 color: #FFFFFF;
29593 text-transform: capitalize;
29594 display: inline-block;
29595 padding: 5px 9px;
29596 position: absolute;
29597 top: -11px;
29598 left: -8px;
29599 }
29600 .wpfnl-order-bump__template-style1 .preview-tag:before {
29601 content: "";
29602 position: absolute;
29603 left: 0px;
29604 bottom: -10px;
29605 width: 0;
29606 height: 0;
29607 border-top: 10px solid #28027F;
29608 border-left: 8px solid transparent;
29609 }
29610 .wpfnl-order-bump__template-style1 .template-preview-wrapper {
29611 padding: 20px;
29612 display: flex;
29613 flex-flow: row wrap;
29614 align-items: flex-start;
29615 }
29616 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-img {
29617 width: 150px;
29618 height: 150px;
29619 background-color: #F2F2F8;
29620 border-radius: 10px;
29621 position: relative;
29622 background-repeat: no-repeat;
29623 background-position: center center;
29624 background-size: cover;
29625 object-fit: cover;
29626 }
29627 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-content {
29628 width: calc(100% - 160px);
29629 padding-left: 20px;
29630 }
29631 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-content .product-options .option-selector {
29632 color: #F34D01;
29633 font-weight: 500;
29634 font-size: 14px;
29635 line-height: 18px;
29636 margin-top: 10px;
29637 }
29638 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-title {
29639 font-weight: 500;
29640 font-size: 14px;
29641 line-height: 16px;
29642 color: #363B4E;
29643 margin-bottom: 9px;
29644 }
29645 .wpfnl-order-bump__template-style1 .template-preview-wrapper .subtitle {
29646 font-weight: 500;
29647 font-size: 14px;
29648 line-height: 16px;
29649 color: #6E42D3;
29650 margin-bottom: 14px;
29651 }
29652 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description li,
29653 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description strong,
29654 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description span,
29655 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description p,
29656 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description {
29657 font-size: 13px;
29658 line-height: 20px;
29659 color: #7A8B9A;
29660 }
29661 .wpfnl-order-bump__template-style1 .template-preview-wrapper .product-price {
29662 display: inline-block;
29663 font-weight: 500;
29664 font-size: 13px;
29665 line-height: 15px;
29666 color: #EE8134;
29667 margin-left: auto;
29668 margin-top: 10px;
29669 }
29670 .wpfnl-order-bump__template-style1 .template-preview-wrapper .product-price span {
29671 font-size: 13px;
29672 color: #EE8134;
29673 font-weight: 500;
29674 }
29675 .wpfnl-order-bump__template-style1 .template-preview-wrapper .product-price ins {
29676 text-decoration: none;
29677 }
29678 .wpfnl-order-bump__template-style1 .offer-checkbox {
29679 background-color: #6E42D3;
29680 padding: 11px 20px;
29681 border-radius: 0 0 10px 10px;
29682 box-shadow: 0 -1px 2px 0 rgba(190, 190, 215, 0.29);
29683 }
29684 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label {
29685 font-weight: 500;
29686 font-size: 15px;
29687 line-height: 18px;
29688 color: #d9d9d9;
29689 padding-left: 26px;
29690 margin: 0;
29691 border: none;
29692 }
29693 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label:before {
29694 top: 1px;
29695 width: 15px;
29696 height: 15px;
29697 }
29698 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label:after {
29699 left: 4px;
29700 top: 6px;
29701 width: 7px;
29702 height: 3px;
29703 border-bottom-color: #6E42D3;
29704 border-left-color: #6E42D3;
29705 }
29706 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
29707 background-color: #fff;
29708 border-color: #ffffff;
29709 }
29710
29711 .wpfnl-order-bump__template-style2 {
29712 border-radius: 10px;
29713 position: relative;
29714 margin: 0 0 20px;
29715 background-color: #ffffff;
29716 }
29717 .wpfnl-order-bump__template-style2 .preview-tag {
29718 background: #6E42D3;
29719 border-radius: 0px 3px 3px 0px;
29720 font-weight: 500;
29721 font-size: 12px;
29722 line-height: 14px;
29723 color: #FFFFFF;
29724 text-transform: capitalize;
29725 display: inline-block;
29726 padding: 5px 9px;
29727 position: absolute;
29728 top: -11px;
29729 left: -8px;
29730 }
29731 .wpfnl-order-bump__template-style2 .preview-tag:before {
29732 content: "";
29733 position: absolute;
29734 left: 0px;
29735 bottom: -10px;
29736 width: 0;
29737 height: 0;
29738 border-top: 10px solid #28027F;
29739 border-left: 8px solid transparent;
29740 }
29741 .wpfnl-order-bump__template-style2 .template-preview-wrapper {
29742 padding: 20px 15px;
29743 display: flex;
29744 flex-flow: row wrap;
29745 align-items: flex-start;
29746 border: 1px dashed #6E42D3;
29747 border-radius: 0 0 10px 10px;
29748 border-top: none;
29749 }
29750 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-img {
29751 width: 150px;
29752 height: 150px;
29753 background-color: #F2F2F8;
29754 border-radius: 10px;
29755 position: relative;
29756 background-repeat: no-repeat;
29757 background-position: center center;
29758 background-size: cover;
29759 object-fit: cover;
29760 }
29761 .wpfnl-order-bump__template-style2 .template-preview-wrapper .for-mobile {
29762 display: none;
29763 border-radius: 10px;
29764 }
29765 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-content {
29766 width: calc(100% - 150px);
29767 padding-left: 20px;
29768 }
29769 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-content .product-options .option-selector {
29770 color: #F34D01;
29771 font-weight: 500;
29772 font-size: 14px;
29773 line-height: 18px;
29774 margin-top: 10px;
29775 }
29776 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-title {
29777 font-weight: 500;
29778 font-size: 14px;
29779 line-height: 16px;
29780 color: #363B4E;
29781 margin-bottom: 9px;
29782 }
29783 .wpfnl-order-bump__template-style2 .template-preview-wrapper .subtitle {
29784 font-weight: 500;
29785 font-size: 14px;
29786 line-height: 16px;
29787 color: #6E42D3;
29788 margin-bottom: 14px;
29789 }
29790 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description li,
29791 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description strong,
29792 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description span,
29793 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description p,
29794 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description {
29795 font-size: 13px;
29796 line-height: 20px;
29797 color: #7A8B9A;
29798 margin: 0;
29799 }
29800 @keyframes moveArrow {
29801 0%, 100% {
29802 transform: translateX(-8px);
29803 opacity: 1;
29804 }
29805 50%, 90% {
29806 transform: translateX(15px);
29807 opacity: 0;
29808 }
29809 99% {
29810 transform: translateX(-8px);
29811 opacity: 0;
29812 }
29813 }
29814 .wpfnl-order-bump__template-style2 .offer-checkbox {
29815 background-color: #6E42D3;
29816 padding: 8px 15px;
29817 border-radius: 10px 10px 0 0;
29818 display: flex;
29819 flex-flow: row wrap;
29820 align-items: flex-start;
29821 border: 1px dashed #6e42d3;
29822 }
29823 .wpfnl-order-bump__template-style2 .offer-checkbox .nav-arrow {
29824 display: inherit;
29825 line-height: normal;
29826 position: relative;
29827 top: 1px;
29828 margin-right: 10px;
29829 animation: moveArrow 1s linear infinite;
29830 }
29831 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox {
29832 line-height: normal;
29833 display: inherit;
29834 width: calc(100% - 130px);
29835 }
29836 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label {
29837 font-weight: 500;
29838 color: #d9d9d9;
29839 padding: 0 0 0 20px;
29840 font-size: 12px;
29841 line-height: 14px;
29842 margin: 0;
29843 border: none;
29844 }
29845 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label:before {
29846 top: 0;
29847 border: none;
29848 width: 14px;
29849 height: 14px;
29850 }
29851 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label:after {
29852 left: 2px;
29853 top: 4px;
29854 width: 7px;
29855 height: 3px;
29856 border-bottom-color: #6E42D3;
29857 border-left-color: #6E42D3;
29858 }
29859 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
29860 background-color: #fff;
29861 border-color: #ffffff;
29862 }
29863 .wpfnl-order-bump__template-style2 .offer-checkbox .product-price {
29864 display: inline-block;
29865 font-weight: 500;
29866 font-size: 12px;
29867 line-height: 14px;
29868 color: #EE8134;
29869 margin-left: auto;
29870 }
29871 .wpfnl-order-bump__template-style2 .offer-checkbox .product-price span {
29872 font-size: 12px;
29873 color: #EE8134;
29874 font-weight: 500;
29875 line-height: normal;
29876 }
29877 .wpfnl-order-bump__template-style2 .offer-checkbox .product-price ins {
29878 text-decoration: none;
29879 }
29880
29881 .wpfnl-order-bump__template-style3 {
29882 border-radius: 10px;
29883 position: relative;
29884 margin: 20px 0;
29885 }
29886 .wpfnl-order-bump__template-style3 .template-preview-wrapper {
29887 padding: 20px 15px;
29888 border: 1px solid #6E42D3;
29889 border-radius: 10px;
29890 }
29891 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-img {
29892 width: 150px;
29893 height: 150px;
29894 background-color: #F2F2F8;
29895 border-radius: 10px;
29896 position: relative;
29897 background-repeat: no-repeat;
29898 background-position: center center;
29899 background-size: cover;
29900 object-fit: cover;
29901 }
29902 .wpfnl-order-bump__template-style3 .template-preview-wrapper .for-mobile {
29903 display: none;
29904 border-radius: 10px;
29905 }
29906 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-content {
29907 width: 100%;
29908 margin-top: 12px;
29909 }
29910 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-content .product-options .option-selector {
29911 color: #F34D01;
29912 font-weight: 500;
29913 font-size: 14px;
29914 line-height: 18px;
29915 margin-top: 10px;
29916 }
29917 .wpfnl-order-bump__template-style3 .template-preview-wrapper .product-price {
29918 font-weight: 500;
29919 font-size: 18px;
29920 line-height: 1.2;
29921 margin-bottom: 15px;
29922 display: block;
29923 color: #EE8134;
29924 }
29925 .wpfnl-order-bump__template-style3 .template-preview-wrapper .product-price del {
29926 color: #7A8B9A;
29927 }
29928 .wpfnl-order-bump__template-style3 .template-preview-wrapper .product-price ins {
29929 text-decoration: none;
29930 }
29931 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-title {
29932 font-weight: 500;
29933 margin: 0 0 9px 0;
29934 font-size: 16px;
29935 line-height: 1.3;
29936 color: #363B4E;
29937 }
29938 .wpfnl-order-bump__template-style3 .template-preview-wrapper .subtitle {
29939 font-weight: 500;
29940 font-size: 14px;
29941 line-height: 16px;
29942 color: #6E42D3;
29943 margin-bottom: 14px;
29944 }
29945 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description li,
29946 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description strong,
29947 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description span,
29948 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description p,
29949 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description {
29950 font-size: 13px;
29951 line-height: 20px;
29952 color: #7A8B9A;
29953 margin: 0;
29954 }
29955 .wpfnl-order-bump__template-style3 .offer-checkbox {
29956 display: flex;
29957 flex-flow: row wrap;
29958 align-items: flex-start;
29959 }
29960 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox {
29961 line-height: normal;
29962 display: inherit;
29963 width: calc(100% - 60px);
29964 }
29965 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox .option-selector {
29966 color: #F34D01;
29967 font-weight: 500;
29968 font-size: 14px;
29969 line-height: 18px;
29970 }
29971 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label {
29972 font-weight: 600;
29973 color: #363B4E;
29974 padding-left: 28px;
29975 font-size: 14px;
29976 line-height: 14px;
29977 margin: 0;
29978 }
29979 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label:before {
29980 top: -1px;
29981 border: none;
29982 width: 18px;
29983 height: 18px;
29984 background-color: #c0c0c3;
29985 }
29986 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label:after {
29987 left: 4px;
29988 top: 4px;
29989 width: 10px;
29990 height: 6px;
29991 border-bottom-color: #ffffff;
29992 border-left-color: #ffffff;
29993 }
29994 .wpfnl-order-bump__template-style3 .offer-checkbox .product-price {
29995 display: inline-block;
29996 font-weight: 500;
29997 font-size: 13px;
29998 line-height: 15px;
29999 color: #EE8134;
30000 margin-left: auto;
30001 }
30002 .wpfnl-order-bump__template-style3 .offer-checkbox .product-price del {
30003 margin-right: 2px;
30004 }
30005
30006 .wpfnl-order-bump__template-style4 {
30007 background-color: #f7f7f7;
30008 border-radius: 10px;
30009 position: relative;
30010 margin: 20px 0;
30011 }
30012 .wpfnl-order-bump__template-style4 .template-preview-wrapper {
30013 padding: 20px;
30014 display: flex;
30015 flex-flow: row wrap;
30016 align-items: center;
30017 }
30018 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-img {
30019 width: 70px;
30020 height: 70px;
30021 background-color: #F2F2F8;
30022 border-radius: 5px;
30023 position: relative;
30024 background-repeat: no-repeat;
30025 background-position: center center;
30026 background-size: cover;
30027 object-fit: cover;
30028 }
30029 .wpfnl-order-bump__template-style4 .template-preview-wrapper .for-mobile {
30030 display: none;
30031 border-radius: 5px;
30032 }
30033 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-content {
30034 width: calc(100% - 340px);
30035 padding-left: 14px;
30036 }
30037 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-title {
30038 font-weight: 500;
30039 font-size: 16px;
30040 line-height: 1.2;
30041 color: #363B4E;
30042 margin: 0 0 7px 0;
30043 max-width: 206px;
30044 }
30045 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating {
30046 color: #363B4E;
30047 font-weight: 600;
30048 display: flex;
30049 align-items: center;
30050 line-height: 1;
30051 font-size: 15px;
30052 }
30053 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating .star-rating {
30054 float: none;
30055 width: 86px;
30056 height: 15px;
30057 }
30058 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating .star-rating::before {
30059 content: "s s s s s";
30060 font-size: 13px;
30061 line-height: 1.2;
30062 color: #EE8134;
30063 }
30064 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating .star-rating span::before {
30065 content: "S S S S S";
30066 font-size: 13px;
30067 line-height: 1.2;
30068 color: #EE8134;
30069 }
30070 .wpfnl-order-bump__template-style4 .template-preview-wrapper .subtitle {
30071 font-weight: 500;
30072 font-size: 14px;
30073 line-height: 16px;
30074 color: #6E42D3;
30075 margin-bottom: 14px;
30076 }
30077 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description li,
30078 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description strong,
30079 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description span,
30080 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description p,
30081 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description {
30082 font-size: 13px;
30083 line-height: 20px;
30084 color: #7A8B9A;
30085 margin: 0;
30086 }
30087 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-price {
30088 line-height: 1;
30089 padding-left: 20px;
30090 width: 110px;
30091 }
30092 .wpfnl-order-bump__template-style4 .template-preview-wrapper .product-price {
30093 display: inline-block;
30094 font-weight: 500;
30095 font-size: 13px;
30096 line-height: 15px;
30097 color: #EE8134;
30098 margin-left: auto;
30099 }
30100 .wpfnl-order-bump__template-style4 .template-preview-wrapper .product-price span {
30101 font-size: 13px;
30102 line-height: 15px;
30103 color: #EE8134;
30104 font-weight: 500;
30105 }
30106 .wpfnl-order-bump__template-style4 .template-preview-wrapper .product-price ins {
30107 text-decoration: none;
30108 background: transparent;
30109 }
30110 .wpfnl-order-bump__template-style4 .offer-checkbox {
30111 margin-left: auto;
30112 max-width: 160px;
30113 }
30114 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox .option-selector {
30115 color: #6E42D3;
30116 font-size: 14px;
30117 font-weight: 500;
30118 text-align: center;
30119 line-height: 1.2;
30120 }
30121 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox label:before,
30122 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox label:after {
30123 display: none;
30124 }
30125 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox label {
30126 border: 1px solid #6E42D3;
30127 color: #6E42D3;
30128 padding: 10px 15px;
30129 border-radius: 5px;
30130 font-size: 16px;
30131 font-weight: 500;
30132 text-align: center;
30133 line-height: 1.2;
30134 }
30135 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label {
30136 color: #fff;
30137 background-color: #6E42D3;
30138 }
30139
30140 @media only screen and (max-width: 575px) {
30141 .wpfnl-order-bump__template-style4 .template-preview-wrapper {
30142 padding: 15px;
30143 display: block;
30144 }
30145 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-img {
30146 width: auto;
30147 height: auto;
30148 background-image: none !important;
30149 }
30150 .wpfnl-order-bump__template-style4 .template-preview-wrapper .for-mobile {
30151 display: block;
30152 margin-bottom: 16px;
30153 }
30154 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-content {
30155 width: 100%;
30156 padding-left: 0;
30157 }
30158 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-title {
30159 max-width: 100%;
30160 }
30161 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-price {
30162 padding-left: 0;
30163 margin: 12px 0;
30164 width: 100%;
30165 }
30166 .wpfnl-order-bump__template-style4 .offer-checkbox {
30167 margin-left: 0;
30168 max-width: inherit;
30169 }
30170 }
30171 .wpfnl-order-bump__template-style5 {
30172 background-color: transparent;
30173 border: 2px dashed #6E42D3;
30174 border-radius: 10px;
30175 position: relative;
30176 margin: 20px 0;
30177 padding: 20px;
30178 }
30179 .wpfnl-order-bump__template-style5 .template-preview-wrapper {
30180 display: flex;
30181 flex-flow: row-reverse;
30182 }
30183 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-img {
30184 width: 100px;
30185 height: 100px;
30186 background-color: #F2F2F8;
30187 border-radius: 5px;
30188 position: relative;
30189 background-repeat: no-repeat;
30190 background-position: center center;
30191 background-size: cover;
30192 object-fit: cover;
30193 }
30194 .wpfnl-order-bump__template-style5 .template-preview-wrapper .for-mobile {
30195 display: none;
30196 border-radius: 5px;
30197 }
30198 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content {
30199 width: calc(100% - 100px);
30200 padding-right: 14px;
30201 }
30202 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content .product-options .option-selector {
30203 color: #F34D01;
30204 font-weight: 500;
30205 font-size: 14px;
30206 line-height: 18px;
30207 margin-top: 10px;
30208 }
30209 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-title {
30210 font-weight: 500;
30211 font-size: 18px;
30212 line-height: 1.2;
30213 color: #363B4E;
30214 margin: 0 0 7px 0;
30215 }
30216 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating {
30217 color: #363B4E;
30218 font-weight: 600;
30219 display: flex;
30220 align-items: center;
30221 line-height: 1;
30222 font-size: 15px;
30223 }
30224 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating .star-rating {
30225 float: none;
30226 width: 86px;
30227 height: 15px;
30228 }
30229 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating .star-rating::before {
30230 content: "s s s s s";
30231 font-size: 13px;
30232 line-height: 1.2;
30233 color: #EE8134;
30234 }
30235 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating .star-rating span::before {
30236 content: "S S S S S";
30237 font-size: 13px;
30238 line-height: 1.2;
30239 color: #EE8134;
30240 }
30241 .wpfnl-order-bump__template-style5 .template-preview-wrapper .subtitle {
30242 font-weight: 500;
30243 font-size: 14px;
30244 line-height: 16px;
30245 color: #6E42D3;
30246 margin-bottom: 5px;
30247 }
30248 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description li,
30249 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description strong,
30250 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description span,
30251 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description p,
30252 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description {
30253 font-size: 13px;
30254 line-height: 20px;
30255 color: #7A8B9A;
30256 margin: 0;
30257 }
30258 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-price {
30259 line-height: 1;
30260 margin-bottom: 10px;
30261 width: 100%;
30262 }
30263 .wpfnl-order-bump__template-style5 .template-preview-wrapper .product-price {
30264 display: inline-block;
30265 font-weight: 500;
30266 font-size: 16px;
30267 line-height: 15px;
30268 color: #EE8134;
30269 margin-left: auto;
30270 }
30271 .wpfnl-order-bump__template-style5 .template-preview-wrapper .product-price span {
30272 font-size: 16px;
30273 line-height: 15px;
30274 color: #EE8134;
30275 font-weight: 500;
30276 }
30277 .wpfnl-order-bump__template-style5 .template-preview-wrapper .product-price ins {
30278 text-decoration: none;
30279 background: transparent;
30280 }
30281 .wpfnl-order-bump__template-style5 .offer-checkbox {
30282 line-height: 1.2;
30283 padding: 0 0 16px 0;
30284 border-bottom: 1px solid #ddd;
30285 margin-bottom: 15px;
30286 }
30287 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox {
30288 display: block;
30289 }
30290 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox .option-selector {
30291 color: #6E42D3;
30292 font-weight: 500;
30293 font-size: 14px;
30294 line-height: 1.2;
30295 text-transform: uppercase;
30296 }
30297 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label {
30298 display: block;
30299 color: #6E42D3;
30300 font-size: 14px;
30301 font-weight: 500;
30302 line-height: 1.2;
30303 text-transform: uppercase;
30304 padding-left: 0;
30305 padding-right: 50px;
30306 }
30307 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:before {
30308 left: inherit;
30309 right: 0;
30310 top: -3px;
30311 width: 43px;
30312 height: 20px;
30313 border-radius: 30px;
30314 border-color: #6E42D3;
30315 }
30316 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:after {
30317 left: inherit;
30318 right: 26px;
30319 top: 1px;
30320 width: 14px;
30321 height: 14px;
30322 border-radius: 30px;
30323 transform: none;
30324 border-bottom: none;
30325 border-left: none;
30326 background-color: #6E42D3;
30327 opacity: 1;
30328 visibility: visible;
30329 }
30330 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::after {
30331 background-color: #fff;
30332 right: 4px;
30333 }
30334
30335 @media only screen and (max-width: 575px) {
30336 .wpfnl-order-bump__template-style5 .template-preview-wrapper {
30337 display: block;
30338 }
30339 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-img {
30340 width: auto;
30341 height: auto;
30342 background-image: none !important;
30343 }
30344 .wpfnl-order-bump__template-style5 .template-preview-wrapper .for-mobile {
30345 display: block;
30346 margin-bottom: 16px;
30347 }
30348 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content {
30349 width: 100%;
30350 padding-left: 0;
30351 }
30352 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-title {
30353 max-width: 100%;
30354 }
30355 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-price {
30356 padding-left: 0;
30357 margin: 12px 0;
30358 width: 100%;
30359 }
30360 .wpfnl-order-bump__template-style5 .offer-checkbox {
30361 margin-left: 0;
30362 max-width: inherit;
30363 }
30364 }
30365 .wpfnl-order-bump__template-style6 {
30366 background-color: #f7f7f7;
30367 border-radius: 10px;
30368 position: relative;
30369 margin: 20px 0;
30370 }
30371 .wpfnl-order-bump__template-style6 .template-preview-wrapper {
30372 padding: 20px;
30373 display: flex;
30374 flex-flow: row wrap;
30375 align-items: flex-start;
30376 justify-content: space-between;
30377 }
30378 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-img {
30379 width: 150px;
30380 height: 150px;
30381 background-color: #F2F2F8;
30382 border-radius: 10px;
30383 position: relative;
30384 background-repeat: no-repeat;
30385 background-position: center center;
30386 background-size: cover;
30387 object-fit: cover;
30388 }
30389 .wpfnl-order-bump__template-style6 .template-preview-wrapper .for-mobile {
30390 display: none;
30391 border-radius: 10px;
30392 }
30393 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content {
30394 width: calc(100% - 142px);
30395 padding-right: 20px;
30396 }
30397 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content .product-options .option-selector {
30398 color: #F34D01;
30399 font-weight: 500;
30400 font-size: 14px;
30401 line-height: 18px;
30402 margin-bottom: 5px;
30403 }
30404 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-title {
30405 font-weight: 500;
30406 font-size: 14px;
30407 line-height: 16px;
30408 color: #363B4E;
30409 margin: 0 0 9px 0;
30410 }
30411 .wpfnl-order-bump__template-style6 .template-preview-wrapper .subtitle {
30412 font-weight: 500;
30413 font-size: 14px;
30414 line-height: 16px;
30415 color: #6E42D3;
30416 margin-bottom: 14px;
30417 }
30418 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description li,
30419 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description strong,
30420 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description span,
30421 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description p,
30422 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description {
30423 font-size: 13px;
30424 line-height: 20px;
30425 color: #7A8B9A;
30426 margin: 0;
30427 }
30428 .wpfnl-order-bump__template-style6 .template-preview-wrapper .product-price {
30429 display: inline-block;
30430 font-weight: 500;
30431 font-size: 15px;
30432 line-height: 15px;
30433 color: #EE8134;
30434 margin-left: auto;
30435 width: 142px;
30436 text-align: right;
30437 }
30438 .wpfnl-order-bump__template-style6 .template-preview-wrapper .product-price span {
30439 font-size: 15px;
30440 line-height: 15px;
30441 color: #EE8134;
30442 font-weight: 500;
30443 }
30444 .wpfnl-order-bump__template-style6 .template-preview-wrapper .product-price ins {
30445 text-decoration: none;
30446 background: transparent;
30447 }
30448 .wpfnl-order-bump__template-style6 .offer-checkbox {
30449 margin-bottom: 15px;
30450 }
30451 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox {
30452 display: block;
30453 line-height: 1;
30454 }
30455 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox .option-selector {
30456 color: #F34D01;
30457 font-weight: 500;
30458 font-size: 15px;
30459 line-height: 18px;
30460 }
30461 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label {
30462 font-weight: 500;
30463 font-size: 15px;
30464 line-height: 18px;
30465 color: #363B4E;
30466 padding: 0 0 0 26px;
30467 margin: 0;
30468 border: 0;
30469 }
30470 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label:before {
30471 top: 1px;
30472 background: #fff;
30473 }
30474 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label:after {
30475 left: 4px;
30476 top: 6px;
30477 width: 10px;
30478 height: 6px;
30479 border-bottom-color: #ffffff;
30480 border-left-color: #ffffff;
30481 }
30482 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
30483 background-color: #6E42D3;
30484 border-color: #6E42D3;
30485 }
30486
30487 @media only screen and (max-width: 575px) {
30488 .wpfnl-order-bump__template-style6 .template-preview-wrapper {
30489 padding: 15px;
30490 display: block;
30491 }
30492 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content {
30493 width: 100%;
30494 padding-right: 0;
30495 }
30496 .wpfnl-order-bump__template-style6 .offer-checkbox {
30497 margin-bottom: 10px;
30498 }
30499 }
30500 .wpfnl-order-bump__template-style7 {
30501 position: relative;
30502 margin-bottom: 20px;
30503 }
30504 .wpfnl-order-bump__template-style7 .template-preview-wrapper {
30505 background: #5a26d1;
30506 border-radius: 10px;
30507 padding: 15px 15px;
30508 }
30509 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content-wrapper {
30510 width: calc(100% - 50px);
30511 padding-right: 15px;
30512 }
30513 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content {
30514 display: flex;
30515 flex-flow: row wrap;
30516 align-items: flex-start;
30517 justify-content: space-between;
30518 }
30519 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .product-options .option-selector {
30520 color: #F34D01;
30521 font-weight: 500;
30522 font-size: 14px;
30523 line-height: 18px;
30524 margin-top: 10px;
30525 }
30526 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .template-title {
30527 color: #fff;
30528 font-size: 18px;
30529 font-weight: 600;
30530 margin-bottom: 5px;
30531 }
30532 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description li,
30533 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description strong,
30534 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description span,
30535 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description p,
30536 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description {
30537 font-size: 16px;
30538 color: #fff;
30539 line-height: 1.5;
30540 font-weight: 400;
30541 }
30542 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox .option-selector {
30543 color: #F34D01;
30544 font-weight: 500;
30545 font-size: 14px;
30546 line-height: 18px;
30547 margin-top: 5px;
30548 }
30549 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label {
30550 padding: 0;
30551 width: 50px;
30552 height: 50px;
30553 background: #fff;
30554 border-radius: 10px;
30555 display: flex;
30556 align-items: center;
30557 justify-content: center;
30558 }
30559 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label:after, .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label:before {
30560 display: none;
30561 }
30562 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label svg {
30563 transition: all 0.3s ease;
30564 }
30565 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label svg path {
30566 stroke: #ffffff;
30567 }
30568 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox input[type=checkbox]:checked + label svg {
30569 transform: rotate(45deg);
30570 }
30571
30572 .wpfnl-order-bump__template-style8 {
30573 position: relative;
30574 margin-bottom: 20px;
30575 }
30576 .wpfnl-order-bump__template-style8 .template-preview-wrapper {
30577 padding: 15px 15px;
30578 border: 2px dashed #6E42D3;
30579 }
30580 .wpfnl-order-bump__template-style8 .template-preview-wrapper .product-options .option-selector {
30581 color: #F34D01;
30582 font-weight: 500;
30583 font-size: 14px;
30584 line-height: 18px;
30585 margin-bottom: 10px;
30586 }
30587 .wpfnl-order-bump__template-style8 .template-preview-wrapper .template-title {
30588 font-weight: 500;
30589 font-size: 14px;
30590 line-height: 16px;
30591 color: #363B4E;
30592 margin: 0 0 9px 0;
30593 }
30594 .wpfnl-order-bump__template-style8 .template-preview-wrapper .subtitle {
30595 font-weight: 500;
30596 font-size: 14px;
30597 line-height: 16px;
30598 color: #6E42D3;
30599 margin-bottom: 14px;
30600 text-transform: uppercase;
30601 text-decoration: underline;
30602 }
30603 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description li,
30604 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description strong,
30605 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description span,
30606 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description p,
30607 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description {
30608 font-size: 13px;
30609 line-height: 20px;
30610 color: #7A8B9A;
30611 margin: 0;
30612 }
30613 .wpfnl-order-bump__template-style8 .offer-checkbox {
30614 background-color: #6E42D3;
30615 padding: 8px 15px;
30616 display: flex;
30617 flex-flow: row wrap;
30618 align-items: flex-start;
30619 border: none;
30620 margin-bottom: 15px;
30621 }
30622 .wpfnl-order-bump__template-style8 .offer-checkbox .nav-arrow {
30623 display: inherit;
30624 line-height: normal;
30625 position: relative;
30626 top: 2px;
30627 margin-right: 10px;
30628 }
30629 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox {
30630 line-height: normal;
30631 display: inherit;
30632 width: calc(100% - 130px);
30633 }
30634 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox .option-selector {
30635 color: #F34D01;
30636 font-weight: 500;
30637 font-size: 14px;
30638 line-height: 18px;
30639 }
30640 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label {
30641 font-weight: 500;
30642 color: #d9d9d9;
30643 padding: 0 0 0 20px;
30644 font-size: 12px;
30645 line-height: 14px;
30646 margin: 0;
30647 }
30648 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label:before {
30649 top: 2px;
30650 border: none;
30651 width: 12px;
30652 height: 12px;
30653 }
30654 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label:after {
30655 left: 2px;
30656 top: 5px;
30657 width: 8px;
30658 height: 5px;
30659 border-bottom-color: #6E42D3;
30660 border-left-color: #6E42D3;
30661 }
30662 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
30663 background-color: #fff;
30664 border-color: #ffffff;
30665 }
30666 .wpfnl-order-bump__template-style8 .offer-checkbox .product-price {
30667 display: inline-block;
30668 font-weight: 500;
30669 font-size: 12px;
30670 line-height: 14px;
30671 color: #EE8134;
30672 margin-left: auto;
30673 }
30674 .wpfnl-order-bump__template-style8 .offer-checkbox .product-price span {
30675 font-size: 12px;
30676 line-height: 14px;
30677 color: #EE8134;
30678 font-weight: 500;
30679 line-height: normal;
30680 }
30681 .wpfnl-order-bump__template-style8 .offer-checkbox .product-price ins {
30682 text-decoration: none;
30683 background: transparent;
30684 }
30685
30686 .wpfnl-order-bump__template-style9 {
30687 background-color: #ffffff;
30688 border: 1px solid #E5E8F3;
30689 border-radius: 12px;
30690 position: relative;
30691 margin: 20px 0;
30692 }
30693 .wpfnl-order-bump__template-style9 > .subtitle {
30694 font-weight: 500;
30695 font-size: 14px;
30696 line-height: 16px;
30697 color: #333;
30698 margin-bottom: 0;
30699 background: #ffd921;
30700 text-align: center;
30701 padding: 10px 15px;
30702 border-radius: 10px 10px 0 0;
30703 }
30704 .wpfnl-order-bump__template-style9 .template-preview-wrapper {
30705 padding: 20px;
30706 display: flex;
30707 flex-flow: row wrap;
30708 align-items: center;
30709 }
30710 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-img {
30711 width: 150px;
30712 height: 150px;
30713 background-color: #F2F2F8;
30714 border-radius: 10px;
30715 position: relative;
30716 background-repeat: no-repeat;
30717 background-position: center center;
30718 background-size: cover;
30719 object-fit: cover;
30720 }
30721 .wpfnl-order-bump__template-style9 .template-preview-wrapper .for-mobile {
30722 display: none;
30723 border-radius: 10px;
30724 }
30725 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-content {
30726 width: calc(100% - 160px);
30727 padding-left: 20px;
30728 }
30729 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-title {
30730 font-weight: 500;
30731 font-size: 14px;
30732 line-height: 16px;
30733 color: #363B4E;
30734 margin: 0 0 9px 0;
30735 }
30736 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-price {
30737 display: inline-block;
30738 font-weight: 500;
30739 font-size: 13px;
30740 line-height: 15px;
30741 color: #EE8134;
30742 margin-left: auto;
30743 margin-top: 10px;
30744 }
30745 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-price span {
30746 font-size: 13px;
30747 line-height: 15px;
30748 color: #EE8134;
30749 font-weight: 500;
30750 }
30751 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-price ins {
30752 text-decoration: none;
30753 background: transparent;
30754 }
30755 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-options {
30756 margin: 10px 0 0 0;
30757 }
30758 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-options .option-selector {
30759 color: #F34D01;
30760 cursor: pointer;
30761 font-size: 14px;
30762 }
30763 .wpfnl-order-bump__template-style9 .description-wrapper {
30764 background: #f7f7f7;
30765 padding: 12px 20px;
30766 margin: 0;
30767 }
30768 .wpfnl-order-bump__template-style9 .description-wrapper .description li,
30769 .wpfnl-order-bump__template-style9 .description-wrapper .description strong,
30770 .wpfnl-order-bump__template-style9 .description-wrapper .description span,
30771 .wpfnl-order-bump__template-style9 .description-wrapper .description p,
30772 .wpfnl-order-bump__template-style9 .description-wrapper .description {
30773 font-size: 13px;
30774 line-height: 20px;
30775 color: #7A8B9A;
30776 margin: 0;
30777 }
30778 .wpfnl-order-bump__template-style9 .offer-checkbox {
30779 background-color: #6E42D3;
30780 padding: 12px 20px 12px;
30781 border-radius: 0 0 10px 10px;
30782 box-shadow: 0 -1px 2px 0 rgba(190, 190, 215, 0.29);
30783 text-align: center;
30784 }
30785 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox {
30786 display: block;
30787 line-height: 1;
30788 }
30789 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox .option-selector {
30790 color: #F34D01;
30791 font-weight: 500;
30792 font-size: 14px;
30793 line-height: 18px;
30794 }
30795 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label {
30796 font-weight: 500;
30797 font-size: 15px;
30798 line-height: 18px;
30799 color: #d9d9d9;
30800 padding: 0 0 0 26px;
30801 margin: 0;
30802 border: 0;
30803 }
30804 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label:before {
30805 top: 1px;
30806 border: none;
30807 }
30808 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label:after {
30809 left: 3px;
30810 top: 5px;
30811 width: 10px;
30812 height: 6px;
30813 border-bottom-color: #6E42D3;
30814 border-left-color: #6E42D3;
30815 }
30816 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
30817 background-color: #fff;
30818 border-color: #ffffff;
30819 }
30820
30821 @media only screen and (max-width: 460px) {
30822 .wpfnl-order-bump__template-style9 .template-preview-wrapper {
30823 padding: 15px;
30824 display: block;
30825 }
30826 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-img {
30827 width: auto;
30828 height: auto;
30829 background-image: none !important;
30830 }
30831 .wpfnl-order-bump__template-style9 .template-preview-wrapper .for-mobile {
30832 display: block;
30833 border-radius: 10px;
30834 margin-bottom: 16px;
30835 }
30836 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-content {
30837 width: 100%;
30838 padding-left: 0;
30839 }
30840 .wpfnl-order-bump__template-style9 .offer-checkbox {
30841 padding: 9px 15px 13px;
30842 }
30843 }
30844 .wpfnl-order-bump__template-style10 {
30845 border-radius: 10px;
30846 position: relative;
30847 margin: 20px 0;
30848 background-color: #f7f7f7;
30849 border: 1px solid #E5E8F3;
30850 }
30851 .wpfnl-order-bump__template-style10 .template-preview-wrapper {
30852 padding: 20px 15px;
30853 }
30854 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-content .option-selector {
30855 color: #F34D01;
30856 font-weight: 500;
30857 font-size: 14px;
30858 line-height: 18px;
30859 margin-bottom: 10px;
30860 }
30861 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title-area {
30862 display: flex;
30863 align-items: flex-start;
30864 justify-content: space-between;
30865 margin: 0 0 15px 0;
30866 }
30867 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title {
30868 font-weight: 700;
30869 font-size: 14px;
30870 line-height: 16px;
30871 color: #363B4E;
30872 margin: 0;
30873 width: calc(100% - 60px);
30874 padding-right: 15px;
30875 }
30876 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .nav-arrow {
30877 line-height: 1;
30878 position: relative;
30879 top: -1px;
30880 margin-right: 7px;
30881 }
30882 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .product-price {
30883 display: inline-block;
30884 color: #EE8134;
30885 margin-left: auto;
30886 }
30887 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .product-price span {
30888 color: #EE8134;
30889 font-weight: 700;
30890 }
30891 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .product-price ins {
30892 text-decoration: none;
30893 background: transparent;
30894 }
30895 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description li,
30896 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description strong,
30897 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description span,
30898 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description p,
30899 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description {
30900 font-size: 13px;
30901 line-height: 20px;
30902 color: #7A8B9A;
30903 margin: 0;
30904 }
30905 .wpfnl-order-bump__template-style10 .offer-checkbox {
30906 display: block;
30907 width: 60px;
30908 text-align: right;
30909 }
30910 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox {
30911 line-height: 1;
30912 display: block;
30913 }
30914 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox label {
30915 font-weight: 700;
30916 color: #6E42D3;
30917 font-size: 16px;
30918 line-height: 14px;
30919 margin: 0;
30920 padding: 0;
30921 }
30922 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox label:after,
30923 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox label:before {
30924 display: none;
30925 }
30926
30927 .wpfnl-order-bump__template-style11 {
30928 border-radius: 5px;
30929 position: relative;
30930 margin: 20px 0;
30931 background-color: #fff;
30932 border: 1px solid #6E42D3;
30933 }
30934 .wpfnl-order-bump__template-style11 .oderbump-loader {
30935 border-radius: 5px;
30936 }
30937 .wpfnl-order-bump__template-style11 .template-preview-wrapper {
30938 padding: 20px 15px;
30939 }
30940 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-content .option-selector {
30941 color: #F34D01;
30942 font-weight: 500;
30943 font-size: 14px;
30944 line-height: 18px;
30945 margin-bottom: 10px;
30946 }
30947 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area {
30948 display: flex;
30949 align-items: flex-start;
30950 justify-content: space-between;
30951 margin: 0 0 15px 0;
30952 }
30953 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price {
30954 display: inline-block;
30955 color: #EE8134;
30956 margin-left: auto;
30957 width: 120px;
30958 text-align: right;
30959 }
30960 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price span {
30961 color: #EE8134;
30962 font-weight: 700;
30963 }
30964 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price ins {
30965 text-decoration: none;
30966 background: transparent;
30967 }
30968 .wpfnl-order-bump__template-style11 .template-preview-wrapper .description {
30969 font-size: 13px;
30970 line-height: 20px;
30971 color: #7A8B9A;
30972 margin: 0;
30973 }
30974 .wpfnl-order-bump__template-style11 .offer-checkbox {
30975 background-color: transparent;
30976 padding: 0;
30977 border-radius: 0;
30978 box-shadow: none;
30979 width: calc(100% - 120px);
30980 }
30981 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox {
30982 display: block;
30983 line-height: 1;
30984 }
30985 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label {
30986 font-weight: 600;
30987 font-size: 15px;
30988 line-height: 18px;
30989 color: #363B4E;
30990 padding: 0 0 0 26px;
30991 margin: 0;
30992 border: 0;
30993 }
30994 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label:before {
30995 top: 1px;
30996 border-color: #6E42D3;
30997 }
30998 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label:after {
30999 left: 4px;
31000 top: 6px;
31001 width: 10px;
31002 height: 6px;
31003 border-bottom-color: #6E42D3;
31004 border-left-color: #6E42D3;
31005 }
31006 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
31007 background-color: #fff;
31008 }
31009
31010 @media only screen and (max-width: 460px) {
31011 .wpfnl-order-bump__template-style11 .template-preview-wrapper {
31012 padding: 15px;
31013 display: block;
31014 }
31015 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-img {
31016 width: auto;
31017 height: auto;
31018 background-image: none !important;
31019 }
31020 .wpfnl-order-bump__template-style11 .template-preview-wrapper .for-mobile {
31021 display: block;
31022 border-radius: 10px;
31023 margin-bottom: 16px;
31024 }
31025 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-content {
31026 width: 100%;
31027 padding-left: 0;
31028 }
31029 .wpfnl-order-bump__template-style11 .offer-checkbox {
31030 padding: 9px 15px 13px;
31031 }
31032 }
31033 .wpfnl-order-bump__template-style12 {
31034 background-color: #ffffff;
31035 border-radius: 12px;
31036 padding: 20px;
31037 position: relative;
31038 border: 1px solid #E5E8F3;
31039 }
31040 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-img {
31041 width: 150px;
31042 height: 150px;
31043 background-color: #F2F2F8;
31044 border-radius: 10px;
31045 position: relative;
31046 background-repeat: no-repeat;
31047 background-position: center center;
31048 background-size: cover;
31049 object-fit: cover;
31050 margin: 0 16px 6px 0;
31051 float: left;
31052 }
31053 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-content .option-selector {
31054 color: #F34D01;
31055 font-weight: 500;
31056 font-size: 14px;
31057 line-height: 18px;
31058 margin-bottom: 10px;
31059 }
31060 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-content::after {
31061 content: "";
31062 display: block;
31063 clear: both;
31064 }
31065 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-title {
31066 font-weight: 500;
31067 font-size: 14px;
31068 line-height: 16px;
31069 color: #363B4E;
31070 margin-bottom: 0;
31071 margin-left: 5px;
31072 }
31073 .wpfnl-order-bump__template-style12 .template-preview-wrapper .subtitle {
31074 font-weight: 500;
31075 font-size: 14px;
31076 line-height: 16px;
31077 color: #6E42D3;
31078 margin: 0;
31079 display: flex;
31080 flex-flow: row wrap;
31081 }
31082 .wpfnl-order-bump__template-style12 .template-preview-wrapper .description {
31083 font-size: 13px;
31084 line-height: 20px;
31085 color: #7A8B9A;
31086 width: 100%;
31087 margin: 8px 0;
31088 }
31089 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-options {
31090 margin: 8px 0;
31091 }
31092 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-options .option-selector {
31093 color: #F34D01;
31094 cursor: pointer;
31095 font-size: 14px;
31096 }
31097 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-price {
31098 display: inline-block;
31099 font-weight: 500;
31100 font-size: 13px;
31101 line-height: 15px;
31102 color: #EE8134;
31103 }
31104 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-price span {
31105 font-size: 13px;
31106 color: #EE8134;
31107 font-weight: 500;
31108 }
31109 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-price ins {
31110 text-decoration: none;
31111 }
31112 .wpfnl-order-bump__template-style12 .offer-checkbox {
31113 background-color: #6E42D3;
31114 padding: 11px 20px;
31115 margin-top: 10px;
31116 border-radius: 5px;
31117 }
31118 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox .option-selector {
31119 color: #6E42D3;
31120 font-weight: 500;
31121 font-size: 14px;
31122 line-height: 18px;
31123 }
31124 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label {
31125 font-weight: 500;
31126 font-size: 15px;
31127 line-height: 18px;
31128 color: #d9d9d9;
31129 padding-left: 26px;
31130 margin: 0;
31131 border: none;
31132 }
31133 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label:before {
31134 top: 1px;
31135 width: 15px;
31136 height: 15px;
31137 }
31138 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label:after {
31139 left: 4px;
31140 top: 6px;
31141 width: 7px;
31142 height: 3px;
31143 border-bottom-color: #6E42D3;
31144 border-left-color: #6E42D3;
31145 }
31146 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
31147 background-color: #fff;
31148 border-color: #ffffff;
31149 }
31150
31151 .wpfnl-order-bump__template-style13 {
31152 background-color: #ffffff;
31153 border-radius: 12px;
31154 position: relative;
31155 border: 2px dashed #E5E8F3;
31156 padding: 20px;
31157 }
31158 .wpfnl-order-bump__template-style13 .subtitle {
31159 font-weight: 500;
31160 font-size: 18px;
31161 line-height: 1.3;
31162 color: #6E42D3;
31163 margin-bottom: 20px;
31164 text-align: center;
31165 }
31166 .wpfnl-order-bump__template-style13 .template-preview-wrapper {
31167 display: flex;
31168 flex-flow: row wrap;
31169 align-items: flex-start;
31170 }
31171 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-content .option-selector {
31172 color: #F34D01;
31173 font-weight: 500;
31174 font-size: 14px;
31175 line-height: 18px;
31176 margin-bottom: 10px;
31177 }
31178 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-img {
31179 width: 150px;
31180 height: 150px;
31181 background-color: #F2F2F8;
31182 border-radius: 10px;
31183 position: relative;
31184 background-repeat: no-repeat;
31185 background-position: center center;
31186 background-size: cover;
31187 object-fit: cover;
31188 }
31189 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-content {
31190 width: calc(100% - 160px);
31191 padding-left: 20px;
31192 }
31193 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-title {
31194 font-weight: 500;
31195 font-size: 14px;
31196 line-height: 16px;
31197 color: #363B4E;
31198 margin-bottom: 9px;
31199 }
31200 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description li,
31201 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description span,
31202 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description p,
31203 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description {
31204 font-size: 13px;
31205 line-height: 20px;
31206 color: #7A8B9A;
31207 }
31208 .wpfnl-order-bump__template-style13 .template-preview-wrapper .product-options {
31209 margin: 10px 0 0 0;
31210 }
31211 .wpfnl-order-bump__template-style13 .template-preview-wrapper .product-options .option-selector {
31212 color: #F34D01;
31213 cursor: pointer;
31214 font-size: 14px;
31215 }
31216 .wpfnl-order-bump__template-style13 .product-price {
31217 display: inline-block;
31218 font-weight: 500;
31219 font-size: 15px;
31220 line-height: 1.2;
31221 color: #EE8134;
31222 margin-left: 5px;
31223 }
31224 .wpfnl-order-bump__template-style13 .product-price span {
31225 font-size: 15px;
31226 color: #EE8134;
31227 font-weight: 500;
31228 }
31229 .wpfnl-order-bump__template-style13 .product-price ins {
31230 text-decoration: none;
31231 }
31232 .wpfnl-order-bump__template-style13 .offer-checkbox {
31233 background-color: #6E42D3;
31234 padding: 11px 20px;
31235 margin-bottom: 20px;
31236 border-radius: 10px;
31237 }
31238 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox .option-selector {
31239 color: #6E42D3;
31240 font-weight: 500;
31241 font-size: 15px;
31242 line-height: 18px;
31243 display: flex;
31244 align-items: center;
31245 justify-content: space-between;
31246 }
31247 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label {
31248 font-weight: 500;
31249 font-size: 15px;
31250 line-height: 18px;
31251 color: #d9d9d9;
31252 padding-left: 26px;
31253 margin: 0;
31254 border: none;
31255 }
31256 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label:before {
31257 top: 1px;
31258 width: 15px;
31259 height: 15px;
31260 }
31261 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label:after {
31262 left: 4px;
31263 top: 6px;
31264 width: 7px;
31265 height: 3px;
31266 border-bottom-color: #6E42D3;
31267 border-left-color: #6E42D3;
31268 }
31269 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
31270 background-color: #fff;
31271 border-color: #ffffff;
31272 }
31273
31274 .wpfnl-order-bump__template-style14 {
31275 border-radius: 10px;
31276 position: relative;
31277 margin: 0 0 20px;
31278 background-color: #ffffff;
31279 border: 1px solid #6E42D3;
31280 }
31281 .wpfnl-order-bump__template-style14 .template-preview-wrapper {
31282 padding: 20px 15px;
31283 display: flex;
31284 flex-flow: row wrap;
31285 align-items: flex-start;
31286 border-radius: 0 0 10px 10px;
31287 border-top: none;
31288 }
31289 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-content .option-selector {
31290 color: #F34D01;
31291 font-weight: 500;
31292 font-size: 14px;
31293 line-height: 18px;
31294 margin: 5px 0;
31295 }
31296 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-img {
31297 width: 150px;
31298 height: 150px;
31299 background-color: #F2F2F8;
31300 border-radius: 10px;
31301 position: relative;
31302 background-repeat: no-repeat;
31303 background-position: center center;
31304 background-size: cover;
31305 object-fit: cover;
31306 }
31307 .wpfnl-order-bump__template-style14 .template-preview-wrapper .for-mobile {
31308 display: none;
31309 border-radius: 10px;
31310 }
31311 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-content {
31312 width: calc(100% - 150px);
31313 padding-left: 20px;
31314 }
31315 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-title {
31316 font-weight: 500;
31317 font-size: 14px;
31318 line-height: 16px;
31319 color: #363B4E;
31320 margin-bottom: 9px;
31321 }
31322 .wpfnl-order-bump__template-style14 .template-preview-wrapper .subtitle {
31323 font-weight: 500;
31324 font-size: 14px;
31325 line-height: 16px;
31326 color: #6E42D3;
31327 }
31328 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description li,
31329 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description span,
31330 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description p,
31331 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description {
31332 font-size: 13px;
31333 line-height: 20px;
31334 color: #7A8B9A;
31335 margin: 0;
31336 }
31337 .wpfnl-order-bump__template-style14 .template-preview-wrapper .product-price {
31338 font-weight: 500;
31339 font-size: 12px;
31340 line-height: 14px;
31341 color: #EE8134;
31342 margin-left: auto;
31343 text-align: right;
31344 margin-top: 15px;
31345 display: block;
31346 }
31347 .wpfnl-order-bump__template-style14 .template-preview-wrapper .product-price span {
31348 font-size: 12px;
31349 color: #EE8134;
31350 font-weight: 500;
31351 line-height: normal;
31352 }
31353 .wpfnl-order-bump__template-style14 .template-preview-wrapper .product-price ins {
31354 text-decoration: none;
31355 }
31356 .wpfnl-order-bump__template-style14 .offer-checkbox {
31357 padding: 12px 15px 9px;
31358 border-radius: 7px 7px 0 0;
31359 display: flex;
31360 flex-flow: row wrap;
31361 align-items: flex-start;
31362 border-bottom: 1px solid #6e42d3;
31363 }
31364 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox {
31365 line-height: normal;
31366 display: inherit;
31367 width: calc(100% - 130px);
31368 }
31369 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox .option-selector {
31370 color: #6E42D3;
31371 font-weight: 500;
31372 font-size: 15px;
31373 line-height: 1.2x;
31374 }
31375 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label {
31376 font-weight: 500;
31377 color: #363B4E;
31378 padding: 0 0 0 26px;
31379 font-size: 12px;
31380 line-height: 14px;
31381 margin: 0;
31382 border: none;
31383 }
31384 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label:before {
31385 border: none;
31386 width: 18px;
31387 height: 18px;
31388 background-color: #cacacb;
31389 }
31390 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label:after {
31391 left: 4px;
31392 top: 2px;
31393 }
31394
31395 .wpfnl-modal-wrapper .product-search {
31396 border: 1px solid #6E42D3;
31397 background: #f6f4fb;
31398 border-radius: 10px;
31399 height: 40px;
31400 width: 250px;
31401 position: relative;
31402 margin-left: 10px;
31403 display: flex;
31404 }
31405 .wpfnl-modal-wrapper .product-search .wpfnl-product-search {
31406 display: none;
31407 }
31408 .wpfnl-modal-wrapper .product-search .search-icon {
31409 position: absolute;
31410 left: 10px;
31411 top: 10px;
31412 }
31413 .wpfnl-modal-wrapper .product-search .search-icon path,
31414 .wpfnl-modal-wrapper .product-search .search-icon circle {
31415 stroke: #716395;
31416 }
31417 .wpfnl-modal-wrapper .product-search .select2.select2-container.select2-container--default {
31418 width: 100% !important;
31419 }
31420 .wpfnl-modal-wrapper .product-search .single-product {
31421 display: flex;
31422 position: relative;
31423 }
31424 .wpfnl-modal-wrapper .product-search .single-product svg {
31425 position: absolute;
31426 left: 10px;
31427 top: 10px;
31428 }
31429 .wpfnl-modal-wrapper .product-search .select2-selection__rendered {
31430 padding: 10px 10px 10px 35px;
31431 width: 100%;
31432 border-radius: 10px;
31433 white-space: pre;
31434 overflow: hidden;
31435 text-overflow: ellipsis;
31436 display: block;
31437 -webkit-line-clamp: 3;
31438 -webkit-box-orient: vertical;
31439 line-height: normal;
31440 color: #716395;
31441 }
31442 .wpfnl-modal-wrapper .product-search .select2-selection__placeholder {
31443 color: #716395;
31444 }
31445 .wpfnl-modal-wrapper .product-search .select2-container--default .select2-selection--single {
31446 background-color: transparent;
31447 border: none;
31448 height: auto;
31449 }
31450 .wpfnl-modal-wrapper .product-search .select2-selection__clear {
31451 padding: 0 3px;
31452 cursor: pointer;
31453 }
31454 .wpfnl-modal-wrapper .product-search .select2-container.select2-container--default.select2-container--open {
31455 background: transparent;
31456 border-radius: 0;
31457 border: none;
31458 z-index: 2;
31459 }
31460 .wpfnl-modal-wrapper .product-search .select2-container--default .select2-selection--single .select2-selection__arrow {
31461 display: none;
31462 }
31463
31464 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper {
31465 max-width: 540px;
31466 max-height: 250px;
31467 padding: 0;
31468 }
31469 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-close .wpfnl-modal-close-btn {
31470 top: -10px;
31471 right: -10px;
31472 }
31473 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents {
31474 display: flex;
31475 flex-direction: column;
31476 justify-content: space-between;
31477 height: 100%;
31478 }
31479 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper {
31480 padding: 24px 30px;
31481 }
31482 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .title {
31483 color: #363B4E;
31484 font-size: 18px;
31485 font-style: normal;
31486 font-weight: 500;
31487 line-height: normal;
31488 margin-bottom: 30px;
31489 }
31490 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper p {
31491 color: #2D3149;
31492 font-size: 15px;
31493 font-style: normal;
31494 font-weight: 500;
31495 line-height: normal;
31496 margin-bottom: 6px;
31497 }
31498 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search {
31499 margin: 0;
31500 width: 100%;
31501 border-radius: 8px;
31502 border: 1px solid #DFE1E6;
31503 background: transparent;
31504 }
31505 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search .search-icon circle,
31506 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search .search-icon path {
31507 stroke: #A7A8B3;
31508 }
31509 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search .select2-container--default .select2-selection--single .select2-selection__placeholder {
31510 color: #7A8B9A;
31511 font-size: 14px;
31512 font-style: normal;
31513 font-weight: 300;
31514 line-height: normal;
31515 letter-spacing: -0.14px;
31516 margin-right: auto;
31517 padding-top: 3px;
31518 }
31519 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search .select2-container .select2-selection--single .select2-selection__rendered {
31520 padding: 0;
31521 padding-top: 8px;
31522 padding-left: 35px;
31523 display: flex;
31524 flex-direction: row-reverse;
31525 justify-content: space-between;
31526 padding-right: 10px;
31527 align-items: center;
31528 }
31529 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search .select2-container .select2-selection--single .select2-selection__rendered .select2-selection__clear {
31530 margin-top: 3px;
31531 }
31532 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper {
31533 border-top: 1px solid #DFE1E6;
31534 display: flex;
31535 justify-content: flex-end;
31536 gap: 12px;
31537 padding: 20px 30px;
31538 }
31539 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button {
31540 min-width: auto;
31541 display: flex;
31542 justify-content: center;
31543 align-items: center;
31544 }
31545 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button.outline {
31546 background: transparent;
31547 color: #3C3F47;
31548 border-radius: 10px;
31549 border: 1px solid #DFE1E6;
31550 min-width: auto;
31551 }
31552 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button.outline:hover {
31553 background: #6E42D3;
31554 color: #FFF;
31555 border-color: transparent;
31556 }
31557 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button:disabled {
31558 opacity: 0.5;
31559 pointer-events: none;
31560 cursor: not-allowed;
31561 }
31562 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button .wpfnl-loader {
31563 position: static;
31564 width: 15px;
31565 height: 15px;
31566 background: transparent;
31567 }
31568
31569 .wpfnl .v-tour .v-step {
31570 border-radius: 10px;
31571 background: #6E42D3;
31572 box-shadow: 0px 2px 15px 0px rgba(22, 28, 32, 0.08);
31573 padding: 0;
31574 z-index: 999999999999 !important;
31575 }
31576 .wpfnl .v-tour .v-step .v-step__header {
31577 background: #6E42D3;
31578 border-radius: 10px 10px 0 0;
31579 padding: 16px 18px 0px;
31580 margin: 0;
31581 }
31582 .wpfnl .v-tour .v-step .v-step__header div {
31583 color: #FFF;
31584 font-size: 14px;
31585 font-style: normal;
31586 font-weight: 500;
31587 line-height: normal;
31588 text-align: left;
31589 }
31590 .wpfnl .v-tour .v-step .v-step__content {
31591 padding: 8px 18px 16px;
31592 border-bottom: 1px solid #8860E3;
31593 margin: 0;
31594 }
31595 .wpfnl .v-tour .v-step .v-step__content div {
31596 color: rgba(255, 255, 255, 0.9);
31597 font-size: 13px;
31598 font-style: normal;
31599 font-weight: 400;
31600 line-height: 1.53;
31601 text-align: left;
31602 }
31603 .wpfnl .v-tour .v-step .v-step__buttons {
31604 padding: 13px 16px;
31605 display: flex;
31606 align-items: center;
31607 justify-content: flex-end;
31608 gap: 8px;
31609 }
31610 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button {
31611 font-size: 13px;
31612 font-style: normal;
31613 font-weight: 500;
31614 line-height: 1.07;
31615 letter-spacing: 0.2px;
31616 border-radius: 8px;
31617 height: auto;
31618 width: auto;
31619 margin: 0;
31620 padding: 9px 14px;
31621 }
31622 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-skip {
31623 color: #FFF;
31624 border: 1px solid #FFF;
31625 background: transparent;
31626 }
31627 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-skip:hover {
31628 color: #6E42D3;
31629 background: #FFF;
31630 border-color: #6E42D3;
31631 }
31632 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-next {
31633 color: #6E42D3;
31634 background: #FFF;
31635 padding: 10px 14px;
31636 }
31637 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-next:hover {
31638 color: #FFF;
31639 background: #6E42D3;
31640 }
31641 .wpfnl .v-tour .v-step .v-step__arrow::before {
31642 background: #6E42D3;
31643 }
31644 .wpfnl .wpfnl-guided-tour.has-overlay::before {
31645 content: "";
31646 position: fixed;
31647 left: 0;
31648 top: 0;
31649 width: 100%;
31650 height: 100%;
31651 background: rgba(29, 29, 29, 0.4901960784);
31652 z-index: 3;
31653 pointer-events: none;
31654 -webkit-mask-image: var(--mask);
31655 mask-image: var(--mask);
31656 }
31657
31658 .wpfnl-copy-notice {
31659 display: flex;
31660 align-items: center;
31661 justify-content: space-between;
31662 border-radius: 10px;
31663 background: #2B0C45;
31664 box-shadow: 0px 10px 20px 0px rgba(176, 174, 186, 0.6);
31665 max-width: 670px;
31666 margin: auto;
31667 padding: 16px 20px;
31668 position: absolute;
31669 width: 100%;
31670 border: none;
31671 bottom: 21px;
31672 left: 50%;
31673 transform: translateX(-50%);
31674 }
31675 .wpfnl-copy-notice .wpfnl-notice-body-text {
31676 display: flex;
31677 gap: 10px;
31678 }
31679 .wpfnl-copy-notice .wpfnl-notice-body-text .wpfnl-notice-icon svg path {
31680 fill: #FFF;
31681 }
31682 .wpfnl-copy-notice .wpfnl-notice-body-text .wpfnl-notice-text {
31683 color: #FFF;
31684 }
31685 .wpfnl-copy-notice .wpfnl-button-wrapper button {
31686 background: transparent;
31687 border: none;
31688 outline: none;
31689 cursor: pointer;
31690 }
31691 .wpfnl-copy-notice .wpfnl-button-wrapper button.wpfnl-notice-undo {
31692 color: #EC813F;
31693 margin-right: 26px;
31694 }
31695
31696 .wpfnl .wpfnl-btn.view-analytics-stat {
31697 background-color: transparent;
31698 border: 1px solid #EBEDF0;
31699 padding: 8px 10px;
31700 cursor: pointer;
31701 text-align: center;
31702 border-radius: 10px;
31703 text-transform: capitalize;
31704 }
31705 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher {
31706 display: flex;
31707 align-items: center;
31708 gap: 9px;
31709 color: #2D3149;
31710 font-weight: 500;
31711 }
31712 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher label {
31713 width: 30px;
31714 height: 18px;
31715 }
31716 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher label::after {
31717 width: 12px;
31718 height: 12px;
31719 top: 2px;
31720 }
31721 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher input[type=checkbox]:checked + label::after {
31722 left: -14px;
31723 }
31724 .wpfnl .automation-step-name .step-stats {
31725 position: relative;
31726 display: flex;
31727 flex-flow: row wrap;
31728 align-items: center;
31729 justify-content: center;
31730 gap: 10px;
31731 padding-top: 16px;
31732 margin-top: 15px;
31733 }
31734 .wpfnl .automation-step-name .step-stats::before {
31735 content: "";
31736 position: absolute;
31737 top: 0;
31738 left: -24px;
31739 width: calc(100% + 48px);
31740 height: 1px;
31741 background: #F2F2F2;
31742 }
31743 .wpfnl .automation-step-name .step-stats .single-stats {
31744 border: 1px solid #F2F2F2;
31745 border-radius: 6px;
31746 font-size: 14px;
31747 line-height: 1;
31748 color: #2D3149;
31749 min-width: 62px;
31750 text-align: center;
31751 padding: 6px 4px;
31752 display: flex;
31753 align-items: center;
31754 justify-content: center;
31755 gap: 4px;
31756 }
31757 .wpfnl .automation-step-name .step-stats .single-stats.converion-rate {
31758 color: #12B76A;
31759 }
31760 .wpfnl .view-analytics-btn {
31761 background-color: transparent;
31762 border: 1px solid #EBEDF0;
31763 padding: 9px 10px;
31764 cursor: pointer;
31765 text-align: center;
31766 border-radius: 10px;
31767 text-transform: capitalize;
31768 display: flex;
31769 align-items: center;
31770 gap: 10px;
31771 font-weight: 500;
31772 }
31773 .wpfnl .view-analytics-btn:hover {
31774 background: #6E42D3;
31775 color: #FFF;
31776 }
31777 .wpfnl .view-analytics-btn:hover svg path {
31778 fill: #FFF;
31779 }
31780 .wpfnl .wpfnl-automation-reports-wrapper {
31781 position: fixed;
31782 width: 100vw;
31783 height: 100vh;
31784 background: #f0f0f1;
31785 top: 32px;
31786 z-index: 999;
31787 padding: 40px 60px;
31788 display: flex;
31789 flex-direction: column;
31790 align-items: center;
31791 }
31792 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header {
31793 width: 90%;
31794 max-width: 1180px;
31795 display: flex;
31796 align-items: center;
31797 justify-content: space-between;
31798 }
31799 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-left .back-to-flow {
31800 font-weight: 500;
31801 font-size: 14px;
31802 line-height: 14px;
31803 color: #A4A8B5;
31804 text-transform: capitalize;
31805 margin-bottom: 7px;
31806 border: none;
31807 background: none;
31808 display: flex;
31809 align-items: center;
31810 gap: 5px;
31811 cursor: pointer;
31812 }
31813 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-left .back-to-flow h1 {
31814 font-weight: 600;
31815 font-size: 22px;
31816 line-height: 1;
31817 color: #2d3149;
31818 }
31819 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right {
31820 display: flex;
31821 }
31822 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox {
31823 position: relative;
31824 }
31825 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .drop-down-button {
31826 position: relative;
31827 border: 1px solid #dee1e8;
31828 border-radius: 6px;
31829 padding: 10px 31px 10px 12px;
31830 background-color: transparent;
31831 text-align: left;
31832 font-weight: 600;
31833 font-size: 14px;
31834 line-height: 1;
31835 color: #2d3149;
31836 width: 105px;
31837 text-transform: capitalize;
31838 cursor: pointer;
31839 }
31840 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .drop-down-button::before {
31841 content: " ";
31842 display: block;
31843 position: absolute;
31844 border-style: solid;
31845 border-color: #a4a8b5;
31846 border-width: 0px 2px 2px 0px;
31847 transform: rotate(45deg) translateY(-50%);
31848 transform-origin: center;
31849 transition: all 0.3s ease;
31850 height: 6px;
31851 right: 17px;
31852 top: calc(50% - 3px);
31853 width: 6px;
31854 cursor: pointer;
31855 }
31856 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .drop-down-button.show::before {
31857 transform: rotate(225deg) translateY(-50%);
31858 }
31859 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown {
31860 top: 40px;
31861 width: 130px;
31862 }
31863 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li {
31864 padding: 10px 15px;
31865 cursor: pointer;
31866 color: #1d2327;
31867 }
31868 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li:first-child {
31869 border-radius: 10px 10px 0 0;
31870 }
31871 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li:last-child {
31872 border-radius: 0 0 10px 10px;
31873 }
31874 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li:hover {
31875 background-color: #f6f8fa;
31876 }
31877 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown.show {
31878 visibility: visible;
31879 opacity: 1;
31880 }
31881 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown::after {
31882 content: none;
31883 }
31884 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-refresh-btn {
31885 background: transparent;
31886 border: 1px solid #dee1e8;
31887 margin-right: 12px;
31888 margin-left: 0;
31889 border-radius: 6px;
31890 height: 36px;
31891 width: 36px;
31892 padding: 1px 0 0 1px;
31893 display: flex;
31894 align-items: center;
31895 justify-content: center;
31896 cursor: pointer;
31897 }
31898 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-refresh-btn.rotate svg {
31899 animation: spin 0.7s linear infinite;
31900 }
31901 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body {
31902 width: 90%;
31903 max-width: 1180px;
31904 }
31905 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report {
31906 background: #ffffff;
31907 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3019607843);
31908 border-radius: 10px;
31909 padding: 24px 24px 32px;
31910 position: relative;
31911 margin-top: 30px;
31912 }
31913 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body {
31914 display: grid;
31915 grid-template-columns: repeat(3, 1fr);
31916 gap: 15px;
31917 margin-bottom: 20px;
31918 }
31919 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .box-header {
31920 margin-bottom: 15px;
31921 grid-column: span 3;
31922 }
31923 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .box-header .header-title {
31924 font-weight: 600;
31925 font-size: 18px;
31926 line-height: 1;
31927 color: #2d3149;
31928 text-transform: capitalize;
31929 }
31930 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report {
31931 border: 1px solid #E9EAEE;
31932 border-radius: 10px;
31933 padding: 20px;
31934 display: flex;
31935 flex-flow: row wrap;
31936 align-items: center;
31937 justify-content: space-between;
31938 }
31939 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .report {
31940 width: calc(100% - 44px);
31941 }
31942 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .report .report-title {
31943 font-weight: 400;
31944 font-size: 14px;
31945 line-height: 1.3;
31946 color: #9398A5;
31947 text-transform: capitalize;
31948 }
31949 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .report h6 {
31950 font-weight: 600;
31951 font-size: 20px;
31952 line-height: 1;
31953 color: #2D3149;
31954 margin-top: 5px;
31955 }
31956 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .icon {
31957 width: 44px;
31958 height: 44px;
31959 background: #FFFFFF;
31960 border: 1px solid #E4E6EB;
31961 display: flex;
31962 align-items: center;
31963 justify-content: center;
31964 border-radius: 100%;
31965 }
31966 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics {
31967 background: #ffffff;
31968 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3019607843);
31969 border-radius: 10px;
31970 padding: 24px 24px 32px;
31971 position: relative;
31972 margin-top: 20px;
31973 }
31974 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header {
31975 display: flex;
31976 flex-flow: row wrap;
31977 align-items: center;
31978 justify-content: space-between;
31979 margin-bottom: 30px;
31980 }
31981 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .header-title {
31982 font-weight: 500;
31983 font-size: 18px;
31984 line-height: 1;
31985 color: #2d3149;
31986 text-transform: capitalize;
31987 }
31988 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator {
31989 display: flex;
31990 align-items: center;
31991 justify-content: center;
31992 }
31993 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span {
31994 font-weight: 400;
31995 font-size: 14px;
31996 line-height: 1.3;
31997 color: #9398a5;
31998 position: relative;
31999 display: flex;
32000 align-items: center;
32001 }
32002 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span::before {
32003 content: "";
32004 width: 10px;
32005 height: 10px;
32006 background: #02c4fb;
32007 display: inline-block;
32008 border-radius: 50px;
32009 margin-right: 10px;
32010 }
32011 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span.opened {
32012 margin-right: 30px;
32013 }
32014 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span.opened::before {
32015 background: #573BFF;
32016 }
32017 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .performance-wrapper {
32018 position: relative;
32019 }
32020 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label {
32021 position: absolute;
32022 top: 3px;
32023 left: 0;
32024 height: 100%;
32025 width: 100%;
32026 display: flex;
32027 flex-flow: column;
32028 justify-content: space-between;
32029 }
32030 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label .single-label {
32031 font-size: 12px;
32032 line-height: 1.2;
32033 color: #9398A5;
32034 display: block;
32035 position: relative;
32036 }
32037 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label .single-label:before {
32038 content: "";
32039 position: absolute;
32040 left: 50px;
32041 top: 7px;
32042 width: calc(100% - 50px);
32043 height: 1px;
32044 background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23E4E7ECFF' stroke-width='4' stroke-dasharray='3%2c 11' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
32045 }
32046 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label .single-label span {
32047 width: 33px;
32048 display: block;
32049 text-align: right;
32050 }
32051 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper {
32052 height: 266px;
32053 display: flex;
32054 flex-flow: row wrap;
32055 align-items: flex-end;
32056 justify-content: space-between;
32057 padding: 10px 15px 3px 60px;
32058 gap: 15px;
32059 position: relative;
32060 z-index: 1;
32061 }
32062 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly {
32063 gap: 0px;
32064 padding: 10px 15px 3px 45px;
32065 }
32066 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly .single-bar {
32067 width: 8px;
32068 }
32069 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly .single-performance:before {
32070 left: -4px;
32071 width: calc(100% + 4px);
32072 }
32073 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly .bar-title {
32074 font-size: 10px;
32075 transform: rotate(-55deg) translate(-10px, -10px);
32076 transform-origin: left;
32077 bottom: -32px;
32078 }
32079 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance {
32080 height: 100%;
32081 display: flex;
32082 flex-flow: column;
32083 justify-content: flex-end;
32084 position: relative;
32085 }
32086 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:before {
32087 content: "";
32088 position: absolute;
32089 bottom: 0;
32090 left: -7px;
32091 width: calc(100% + 10px);
32092 height: 100%;
32093 z-index: 0;
32094 background: #F6F8FA;
32095 border-right: 2px dashed #E4E7EC;
32096 border-left: 2px dashed #E4E7EC;
32097 opacity: 0;
32098 visibility: hidden;
32099 }
32100 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover:before {
32101 opacity: 1;
32102 visibility: visible;
32103 }
32104 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar {
32105 width: 30px;
32106 height: 100%;
32107 display: flex;
32108 gap: 3px;
32109 }
32110 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item {
32111 width: 50%;
32112 display: block;
32113 margin-top: auto;
32114 }
32115 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item.open {
32116 background-color: #573BFF;
32117 border-radius: 6px 6px 0 0;
32118 }
32119 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item.clicked {
32120 background-color: #02C4FB;
32121 border-radius: 6px 6px 0 0;
32122 }
32123 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item.send {
32124 background-color: #12B76A;
32125 }
32126 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-title {
32127 font-size: 12px;
32128 line-height: 1.2;
32129 color: #9398A5;
32130 position: absolute;
32131 bottom: -20px;
32132 left: 50%;
32133 transform: translateX(-50%);
32134 white-space: nowrap;
32135 transition: all 0.3s ease;
32136 }
32137 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip {
32138 background: #FFFFFF;
32139 border: 1px solid #F0F1F4;
32140 box-shadow: 0px 2px 15px rgba(22, 28, 32, 0.0784313725);
32141 border-radius: 4px;
32142 padding: 15px;
32143 width: 180px;
32144 position: absolute;
32145 bottom: calc(100% + 16px);
32146 left: 50%;
32147 transform: translateX(-50%);
32148 z-index: 9;
32149 opacity: 0;
32150 visibility: hidden;
32151 transition: all 0.3s ease;
32152 }
32153 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip:before {
32154 content: "";
32155 position: absolute;
32156 left: 50%;
32157 bottom: -6px;
32158 width: 12px;
32159 height: 12px;
32160 background: white;
32161 transform: rotate(45deg);
32162 margin-left: -6px;
32163 }
32164 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item {
32165 font-size: 12px;
32166 line-height: 1;
32167 color: #9398A5;
32168 margin-bottom: 10px;
32169 position: relative;
32170 display: flex;
32171 align-items: center;
32172 justify-content: space-between;
32173 padding-left: 17px;
32174 }
32175 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item:last-child {
32176 margin-bottom: 0;
32177 }
32178 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item:before {
32179 content: "";
32180 position: absolute;
32181 left: 0;
32182 top: 4px;
32183 width: 8px;
32184 height: 8px;
32185 background: #12B76A;
32186 border-radius: 100%;
32187 }
32188 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item small {
32189 margin-left: 7px;
32190 display: inline-block;
32191 }
32192 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.open:before {
32193 background: #573BFF;
32194 }
32195 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.open small {
32196 color: #12B76A;
32197 }
32198 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.click:before {
32199 background: #02C4FB;
32200 }
32201 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.click small {
32202 color: #F7900A;
32203 }
32204 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.email small {
32205 color: #02C4FB;
32206 }
32207 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item-value {
32208 color: #2D3149;
32209 }
32210 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover .single-bar {
32211 z-index: 1;
32212 }
32213 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover .single-bar .bar-tooltip {
32214 opacity: 1;
32215 visibility: visible;
32216 }
32217 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover .single-bar .bar-title {
32218 opacity: 1;
32219 visibility: visible;
32220 }
32221 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:last-child .bar-tooltip {
32222 left: inherit;
32223 right: -34px;
32224 transform: translateX(0);
32225 }
32226 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:last-child .bar-tooltip:before {
32227 left: inherit;
32228 right: 42px;
32229 }
32230
32231 @keyframes spin {
32232 0% {
32233 transform: rotate(0deg);
32234 }
32235 100% {
32236 transform: rotate(360deg);
32237 }
32238 }
32239 .shimmer-line {
32240 height: 20px;
32241 margin-top: 20px;
32242 background: #777;
32243 }
32244
32245 .shimmer-line-br {
32246 border-radius: 8px;
32247 }
32248
32249 .shimmer-line-full {
32250 width: 100%;
32251 }
32252
32253 .shimmer-line-80 {
32254 width: 80%;
32255 }
32256
32257 .shimmer-line-60 {
32258 width: 60%;
32259 }
32260
32261 .shimmer-line-40 {
32262 width: 40%;
32263 }
32264
32265 .shimmer-line-20 {
32266 width: 20%;
32267 }
32268
32269 .shimmer-line-10 {
32270 width: 10%;
32271 }
32272
32273 .shimmer-circle {
32274 background: #777;
32275 border-radius: 50%;
32276 }
32277
32278 .shimmer-circle-lg {
32279 height: 129px;
32280 width: 129px;
32281 }
32282
32283 .shimmer-circle-md {
32284 height: 65px;
32285 width: 65px;
32286 }
32287
32288 .shimmer-circle-sm {
32289 height: 33px;
32290 width: 33px;
32291 }
32292
32293 .shimmer-circle-x-sm {
32294 height: 17px;
32295 width: 17px;
32296 }
32297
32298 .shimmer-wrapper, .shimmer-wrapper-center {
32299 width: 100%;
32300 height: 100%;
32301 padding: 10px;
32302 animation: shimmer-full-view 0.5s forwards cubic-bezier(0.25, 0.46, 0.45, 0.94);
32303 }
32304
32305 .shimmer-wrapper-center {
32306 display: flex;
32307 flex-direction: column;
32308 gap: 10px;
32309 justify-content: center;
32310 align-items: center;
32311 }
32312
32313 @keyframes shimmer-full-view {
32314 0% {
32315 background-position: -1000px 0;
32316 }
32317 100% {
32318 background-position: 1000px 0;
32319 }
32320 }
32321 @keyframes shimmer-animation {
32322 0% {
32323 background-position: -1000px 0;
32324 }
32325 100% {
32326 background-position: 1000px 0;
32327 }
32328 }
32329 .shimmer-animate {
32330 animation: shimmer-animation 4s infinite linear;
32331 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
32332 background-size: 1000px 100%;
32333 }
32334
32335 .wpfunnels_page_wpf_feature_comparison .updated, .wpfunnels_page_wpf_feature_comparison .notice {
32336 display: none !important;
32337 }
32338
32339 .wpfunnels_page_wpf_feature_comparison #wpcontent {
32340 background: #F6F5FA;
32341 padding-left: 0;
32342 }
32343 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper {
32344 padding: 0 50px;
32345 background: #F6F5FA;
32346 }
32347 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .free-vs-pro-menu {
32348 background: #FFFFFF;
32349 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
32350 border-radius: 0 0 10px 10px;
32351 padding: 28px 20px;
32352 margin-bottom: 20px;
32353 }
32354 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .free-vs-pro-menu .title {
32355 text-align: center;
32356 font-weight: 600;
32357 font-size: 24px;
32358 color: #2D3149;
32359 margin: 0;
32360 }
32361 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .free-vs-pro-menu .free-pro-description {
32362 text-align: center;
32363 color: #7A8B9A;
32364 font-size: 14px;
32365 margin: 5px 0 0 0;
32366 }
32367 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table {
32368 width: 100%;
32369 border-collapse: collapse;
32370 text-align: center;
32371 }
32372 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead {
32373 background: transparent;
32374 position: sticky;
32375 top: 32px;
32376 z-index: 2;
32377 }
32378 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead::after {
32379 content: "";
32380 display: block;
32381 height: 5px;
32382 }
32383 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th {
32384 border: none;
32385 padding: 16px 8px;
32386 font-weight: 600;
32387 background: #FFFFFF;
32388 }
32389 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th:first-child, .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th:last-child {
32390 padding: 16px 16px 16px 8px;
32391 }
32392 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.regular:last-child {
32393 border-radius: 0 20px 0 0;
32394 }
32395 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.feature-column {
32396 border-radius: 20px 0 0 0;
32397 position: relative;
32398 }
32399 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.feature-column .feature-header {
32400 color: #363B4E;
32401 font-weight: 600;
32402 font-size: 20px;
32403 line-height: 1.2;
32404 text-align: start;
32405 margin: 10px 0 0 12px;
32406 position: absolute;
32407 bottom: 20px;
32408 }
32409 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody {
32410 background: #FFFFFF;
32411 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
32412 border-radius: 16px;
32413 border-radius: 0 0 16px 16px;
32414 }
32415 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .group-row td {
32416 background: #FFFFFF;
32417 text-align: left;
32418 padding: 26px 12px 12px;
32419 border: none;
32420 color: #363B4E;
32421 font-weight: 600;
32422 font-size: 16px;
32423 line-height: 1.5;
32424 }
32425 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row td {
32426 padding: 12px;
32427 border: 1px solid #EEE4F2;
32428 background: #FFFFFF;
32429 }
32430 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row td:first-child, .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row td:last-child {
32431 border-left: none;
32432 border-right: none;
32433 }
32434 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row:last-child td {
32435 border-bottom: none;
32436 }
32437 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row:last-child td:first-child {
32438 border-radius: 0 0 0 16px;
32439 }
32440 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row:last-child td:last-child {
32441 border-radius: 0 0 16px 0;
32442 }
32443 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row.no-border-top td {
32444 border-top: none !important;
32445 }
32446 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content {
32447 text-align: left;
32448 color: #7A8B9A;
32449 font-weight: 500;
32450 font-size: 14px;
32451 line-height: 1.7;
32452 display: flex;
32453 align-items: center;
32454 }
32455 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content .tooltip-wrapper {
32456 display: inline-flex;
32457 align-items: center;
32458 margin-left: 6px;
32459 position: relative;
32460 cursor: pointer;
32461 }
32462 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content .tooltip-wrapper .tooltip-text {
32463 visibility: hidden;
32464 opacity: 0;
32465 width: max-content;
32466 max-width: 217px;
32467 background: #10052E;
32468 box-shadow: 0 2px 15px 0 rgba(22, 28, 32, 0.08);
32469 color: rgba(255, 255, 255, 0.8);
32470 text-align: left;
32471 font-weight: 500;
32472 font-size: 13px;
32473 line-height: 1.38;
32474 padding: 11px 14px;
32475 border-radius: 8px;
32476 position: absolute;
32477 z-index: 10;
32478 bottom: 125%;
32479 left: 50%;
32480 transform: translateX(-50%);
32481 transition: opacity 0.2s ease;
32482 white-space: normal;
32483 }
32484 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content .tooltip-wrapper .tooltip-text::after {
32485 content: "";
32486 position: absolute;
32487 top: 100%;
32488 left: 50%;
32489 margin-left: -5px;
32490 border: 5px solid;
32491 border-color: #333 transparent transparent transparent;
32492 }
32493 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content .tooltip-wrapper:hover .tooltip-text {
32494 visibility: visible;
32495 opacity: 1;
32496 }
32497 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-cell {
32498 color: #2D3149;
32499 font-weight: 400;
32500 font-size: 14px;
32501 line-height: 1.8;
32502 }
32503 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .pro-features-link-row td {
32504 border: none;
32505 padding: 15px 0;
32506 text-align: center;
32507 background: #FFFFFF;
32508 border-radius: 0 0 16px 16px;
32509 }
32510 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .pro-features-link-row a {
32511 color: #6E42D3;
32512 text-decoration: none;
32513 font-weight: 500;
32514 font-size: 16px;
32515 line-height: 1.5;
32516 display: inline-flex;
32517 align-items: center;
32518 gap: 10px;
32519 }
32520 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .pro-features-link-row a:hover {
32521 color: #5934a5;
32522 }
32523 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card {
32524 position: relative;
32525 background: #F6F5FA;
32526 height: 194px;
32527 display: flex;
32528 flex-direction: column;
32529 align-items: center;
32530 justify-content: end;
32531 border-radius: 16px;
32532 }
32533 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card.popular-card {
32534 background: #6E42D3;
32535 padding: 2px;
32536 }
32537 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content {
32538 background: #F6F5FA;
32539 width: 100%;
32540 height: 100%;
32541 border-radius: 16px;
32542 display: flex;
32543 flex-direction: column;
32544 align-items: center;
32545 justify-content: end;
32546 padding: 16px 16px 14px;
32547 }
32548 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .plan-name {
32549 color: #2D3149;
32550 font-weight: 600;
32551 font-size: 20px;
32552 line-height: 1.2;
32553 opacity: 0.8;
32554 }
32555 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
32556 color: #2D3149;
32557 font-weight: 500;
32558 font-size: 34px;
32559 line-height: 1.2;
32560 margin: 6px 0 14px;
32561 }
32562 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price .time {
32563 color: #2D3149;
32564 font-weight: 450;
32565 font-size: 14px;
32566 line-height: 2.3;
32567 }
32568 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .upgrade-btn {
32569 max-width: 166px;
32570 width: 100%;
32571 background: #6E42D3;
32572 color: #FFFFFF;
32573 border: none;
32574 padding: 10px 15px;
32575 border-radius: 10px;
32576 cursor: pointer;
32577 text-decoration: none;
32578 font-weight: 600;
32579 font-size: 14px;
32580 transition: all 0.2s;
32581 }
32582 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .upgrade-btn:hover {
32583 background: #5934a5;
32584 }
32585 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .upgrade-btn.current-plan-btn {
32586 background: #9D95C0;
32587 pointer-events: none;
32588 display: flex;
32589 align-items: center;
32590 justify-content: center;
32591 gap: 5px;
32592 }
32593 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .badge {
32594 margin: 5px 0;
32595 color: #FFFFFF;
32596 opacity: 0.8;
32597 font-weight: 600;
32598 font-size: 12px;
32599 }
32600 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .current {
32601 color: #6E42D3;
32602 font-weight: 600;
32603 }
32604 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper {
32605 display: flex;
32606 align-items: center;
32607 justify-content: center;
32608 gap: 5px;
32609 margin-top: 20px;
32610 }
32611 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper .list-item {
32612 border-radius: 100px;
32613 background: #FFFFFF;
32614 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
32615 padding: 7px 15px;
32616 display: flex;
32617 align-items: center;
32618 justify-content: center;
32619 gap: 7px;
32620 }
32621 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer {
32622 margin-top: 30px;
32623 padding: 0 50px;
32624 background: #ffffff;
32625 }
32626 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper {
32627 background-color: #ffffff;
32628 }
32629 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges {
32630 display: flex;
32631 align-items: center;
32632 justify-content: center;
32633 max-width: 621px;
32634 width: 100%;
32635 margin: 0 auto;
32636 padding: 30px 0 25px;
32637 margin-top: 45px;
32638 }
32639 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .payment-image {
32640 max-width: 70px;
32641 width: 100%;
32642 margin: 0 25px;
32643 position: relative;
32644 }
32645 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .payment-image img {
32646 width: 100%;
32647 }
32648 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .satisfaction-image::before, .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .satisfaction-image::after {
32649 content: "";
32650 position: absolute;
32651 top: 0;
32652 height: 70px;
32653 width: 1.47px;
32654 background: linear-gradient(180deg, transparent 0%, #D1D1D1 49.48%, transparent 100%);
32655 }
32656 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .satisfaction-image::before {
32657 left: -25px;
32658 }
32659 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .satisfaction-image::after {
32660 right: -25px;
32661 }
32662 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .review-image {
32663 max-width: 102px;
32664 width: 100%;
32665 margin: 0 25px;
32666 }
32667 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .review-image img {
32668 width: 100%;
32669 }
32670 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .badges-description {
32671 max-width: 555px;
32672 width: 100%;
32673 margin: 0 auto;
32674 text-align: center;
32675 color: #2D3149;
32676 font-size: 14px;
32677 font-weight: 400;
32678 line-height: 1.7;
32679 padding-bottom: 26px;
32680 }
32681
32682 @media only screen and (max-width: 1550px) {
32683 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.regular, .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.popular {
32684 width: 218px;
32685 }
32686 }
32687 @media only screen and (max-width: 1399px) {
32688 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.regular, .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.popular {
32689 width: 190px;
32690 }
32691 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .plan-name {
32692 font-size: 18px;
32693 }
32694 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
32695 font-size: 26px;
32696 }
32697 }
32698 @media only screen and (max-width: 1199px) {
32699 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper {
32700 padding: 0 20px;
32701 }
32702 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.regular, .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.popular {
32703 width: 145px;
32704 }
32705 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th {
32706 padding: 16px 5px;
32707 }
32708 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th:first-child, .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th:last-child {
32709 padding: 16px 10px 16px 5px;
32710 }
32711 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card {
32712 height: 162px;
32713 }
32714 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content {
32715 padding: 10px;
32716 }
32717 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
32718 font-size: 24px !important;
32719 }
32720 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .current-plan-btn svg {
32721 display: none;
32722 }
32723 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .plan-name {
32724 font-size: 16px;
32725 }
32726 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
32727 font-size: 24px;
32728 margin: 6px 0 10px;
32729 }
32730 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .upgrade-btn {
32731 font-size: 13px !important;
32732 padding: 10px 8px !important;
32733 }
32734 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content {
32735 align-items: start;
32736 justify-content: space-between;
32737 }
32738 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content .tooltip-wrapper {
32739 display: inline-block;
32740 margin-top: 2px;
32741 }
32742 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper {
32743 flex-wrap: wrap;
32744 }
32745 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper .list-item {
32746 padding: 5px 10px;
32747 gap: 5px;
32748 }
32749 }
32750 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal {
32751 position: relative;
32752 z-index: 9999999999;
32753 }
32754 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm-automation-editor .mintmrm-automation-sidebar .mintmrm-template-modal {
32755 right: -70px;
32756 top: 30px;
32757 }
32758 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm-automation-editor .mintmrm-automation-sidebar .mintmrm-template-modal .template-modal-inner {
32759 max-height: calc(100vh - 90px);
32760 }
32761 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm-automation-editor .email-builder-editor {
32762 top: 32px;
32763 }
32764 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm .mintmrm-automaiton__block-popover .trigger-tab-nav li[data-trigger-type=logical] {
32765 display: none;
32766 }
32767
32768 .wpfnl-comparison-chart-wrapper {
32769 border-radius: 10px;
32770 background: #FFF;
32771 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
32772 padding: 24px;
32773 }
32774 .wpfnl-comparison-chart-wrapper .wpfnl-loader {
32775 display: flex;
32776 margin: 150px auto;
32777 padding: 40px;
32778 }
32779 .wpfnl-comparison-chart-wrapper .wpfnl-chart-title {
32780 color: #2D3149;
32781 font-size: 18px;
32782 font-style: normal;
32783 font-weight: 600;
32784 line-height: 18px;
32785 margin: 0;
32786 margin-bottom: 24px;
32787 }
32788 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container {
32789 display: flex;
32790 align-items: center;
32791 justify-content: space-between;
32792 }
32793 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab {
32794 padding: 16px 24px;
32795 position: relative;
32796 cursor: pointer;
32797 }
32798 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.disabled {
32799 pointer-events: none;
32800 cursor: not-allowed;
32801 }
32802 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.disabled .wpfnl-overlay {
32803 width: 99.5%;
32804 padding: 0;
32805 left: -1px;
32806 border-radius: 0;
32807 bottom: -1px;
32808 top: unset;
32809 border: 1px solid rgba(238, 240, 243, 0.8);
32810 border-bottom: none;
32811 border-radius: 10px 10px 0 0;
32812 }
32813 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header {
32814 display: flex;
32815 align-items: center;
32816 justify-content: flex-start;
32817 gap: 10px;
32818 margin-bottom: 10px;
32819 }
32820 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-tab-total-amount {
32821 margin: 0;
32822 color: #2D3149;
32823 font-size: 22px;
32824 font-style: normal;
32825 font-weight: 500;
32826 line-height: 1.36;
32827 letter-spacing: -0.44px;
32828 }
32829 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage {
32830 border-radius: 100px;
32831 padding: 4px 7px;
32832 display: flex;
32833 align-items: center;
32834 gap: 1px;
32835 justify-content: center;
32836 font-size: 12px;
32837 font-style: normal;
32838 font-weight: 500;
32839 line-height: 1;
32840 margin: 0;
32841 min-width: 40px;
32842 }
32843 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage.wpfnl-decrease {
32844 background: rgba(236, 89, 86, 0.1);
32845 color: #EC5956;
32846 }
32847 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage.wpfnl-increase {
32848 background: rgba(18, 183, 106, 0.1);
32849 color: #12B76A;
32850 }
32851 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-title {
32852 margin: 0;
32853 color: #667085;
32854 font-size: 14px;
32855 font-style: normal;
32856 font-weight: 400;
32857 line-height: 1;
32858 }
32859 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab::after {
32860 content: "";
32861 width: 1px;
32862 height: 60%;
32863 position: absolute;
32864 background: #E4E6EB;
32865 right: 0;
32866 top: 30%;
32867 }
32868 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.active {
32869 border-radius: 8px 8px 0px 0px;
32870 border: 1px solid rgba(238, 240, 243, 0.8);
32871 background: #FCFCFF;
32872 border-bottom: 0;
32873 }
32874 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.active::after {
32875 content: none;
32876 }
32877 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.no-after::after {
32878 content: none;
32879 }
32880 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab:last-child::after {
32881 content: none;
32882 }
32883 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body {
32884 border-radius: 0px 0px 8px 8px;
32885 border: 1px solid rgba(241, 240, 245, 0.8);
32886 background: #FCFCFF;
32887 padding: 24px;
32888 }
32889 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container {
32890 position: relative;
32891 }
32892 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps {
32893 position: absolute;
32894 top: 3px;
32895 left: 0;
32896 height: 292px;
32897 width: 100%;
32898 display: flex;
32899 flex-flow: column;
32900 justify-content: space-between;
32901 }
32902 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step {
32903 color: #9398A5;
32904 text-align: right;
32905 font-size: 12px;
32906 font-style: normal;
32907 font-weight: 400;
32908 line-height: 1.5;
32909 display: block;
32910 position: relative;
32911 }
32912 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step::before {
32913 content: "";
32914 position: absolute;
32915 left: 50px;
32916 bottom: 1px;
32917 top: inherit;
32918 width: calc(100% - 50px);
32919 height: 1px;
32920 background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23E4E7ECFF' stroke-width='4' stroke-dasharray='3%2c 11' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
32921 }
32922 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step span {
32923 width: 33px;
32924 display: block;
32925 text-align: right;
32926 position: relative;
32927 bottom: -7px;
32928 }
32929 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container {
32930 height: 320px;
32931 padding: 10px 0px 9px 60px;
32932 position: relative;
32933 z-index: 1;
32934 display: grid;
32935 grid-template-columns: repeat(12, 1fr);
32936 gap: 0;
32937 }
32938 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar {
32939 width: 100%;
32940 height: 94%;
32941 position: relative;
32942 display: flex;
32943 flex-flow: row nowrap;
32944 align-items: flex-end;
32945 gap: 6px;
32946 bottom: 0px;
32947 }
32948 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar::before {
32949 height: 100%;
32950 width: 1px;
32951 position: absolute;
32952 background: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMSAxOTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggc3Ryb2tlPSIjMkQzMTQ5IiBzdHJva2UtZGFzaGFycmF5PSI0IDQiIHN0cm9rZS13aWR0aD0iLjUiIGQ9Ik0uMjUuMjVoLjV2MTk4LjVoLS41eiIvPjwvc3ZnPg==");
32953 left: 38%;
32954 }
32955 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar:hover::before {
32956 content: "";
32957 }
32958 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar:hover .wpfnl-comparison-bar-tooltip {
32959 display: block;
32960 }
32961 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip {
32962 display: none;
32963 border-radius: 8px;
32964 background: #10052E;
32965 box-shadow: 0px 2px 15px 0px rgba(22, 28, 32, 0.08);
32966 padding: 15px 14px;
32967 width: 160px;
32968 z-index: 99;
32969 position: absolute;
32970 transform: translateX(-50%);
32971 left: 45%;
32972 }
32973 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip::before {
32974 content: "";
32975 background: #10052E;
32976 width: 10px;
32977 height: 10px;
32978 position: absolute;
32979 bottom: -5px;
32980 transform: rotate(45deg);
32981 left: 45%;
32982 }
32983 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data,
32984 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data {
32985 color: #CDCFD6;
32986 font-size: 13px;
32987 font-style: normal;
32988 font-weight: 400;
32989 line-height: 12px;
32990 margin: 0;
32991 display: flex;
32992 }
32993 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data b,
32994 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data b {
32995 color: #FFF;
32996 }
32997 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .circle,
32998 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .circle {
32999 width: 10px;
33000 height: 10px;
33001 border-radius: 50%;
33002 background: #6E42D3;
33003 display: inline-block;
33004 margin-right: 5px;
33005 }
33006 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .wpfnl-value-wrapper,
33007 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .wpfnl-value-wrapper {
33008 display: flex;
33009 flex-wrap: wrap;
33010 gap: 2px;
33011 }
33012 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data {
33013 margin-top: 8px;
33014 }
33015 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .circle {
33016 background: #EAE1FF;
33017 }
33018 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-bar-label {
33019 font-size: 12px;
33020 line-height: 1.2;
33021 color: #9398A5;
33022 position: absolute;
33023 bottom: -40px;
33024 left: 40%;
33025 transform: translateX(-50%);
33026 white-space: nowrap;
33027 transition: all 0.3s ease;
33028 }
33029 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-single-bar {
33030 flex: 1;
33031 min-width: 0;
33032 display: block;
33033 border-radius: 30px 30px 0 0;
33034 position: relative;
33035 }
33036 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-single-bar.wpfnl-compare-to-bar {
33037 background-color: #EAE1FF;
33038 }
33039 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-single-bar.wpfnl-compare-with-bar {
33040 background-color: #6E42D3;
33041 }
33042
33043 @media only screen and (max-width: 1600px) {
33044 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip {
33045 left: 40%;
33046 width: 94px;
33047 padding: 10px;
33048 }
33049 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data,
33050 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data {
33051 font-size: 10px;
33052 }
33053 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .circle,
33054 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-previous-data .circle {
33055 width: 6px;
33056 height: 6px;
33057 margin-right: 3px;
33058 }
33059 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip b {
33060 display: block;
33061 margin-top: 2px;
33062 }
33063 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip .wpfnl-current-data .wpfnl-value-wrapper {
33064 margin-top: -3px;
33065 }
33066 }
33067 @media only screen and (max-width: 1399px) {
33068 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab {
33069 padding: 10px 15px;
33070 }
33071 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-tab-total-amount {
33072 font-size: 18px;
33073 }
33074 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage {
33075 min-width: 40px;
33076 padding: 4px 5px;
33077 font-size: 9px;
33078 }
33079 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage svg {
33080 width: 12px;
33081 height: 12px;
33082 }
33083 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-title {
33084 font-size: 12px;
33085 }
33086 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar::before {
33087 left: 42%;
33088 }
33089 }
33090 @media only screen and (max-width: 960px) {
33091 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container {
33092 flex-wrap: wrap;
33093 }
33094 }
33095 .wpfnl-datepicker {
33096 position: relative;
33097 min-width: 350px;
33098 }
33099 .wpfnl-datepicker input {
33100 cursor: default;
33101 margin: 0.5em;
33102 border-radius: 4px;
33103 background: inherit;
33104 border-radius: 8px;
33105 color: #2D3149;
33106 font-family: Inter;
33107 font-size: 13px;
33108 font-style: normal;
33109 font-weight: 500;
33110 line-height: 1.15;
33111 border: 1px solid #F1F0F5;
33112 padding: 9px 12px;
33113 width: 45%;
33114 }
33115 .wpfnl-datepicker input.single-date {
33116 width: 100%;
33117 margin-left: -1px;
33118 }
33119 .wpfnl-datepicker .multi-input {
33120 display: flex;
33121 align-items: center;
33122 }
33123 .wpfnl-datepicker .multi-input span {
33124 margin: 0 0.5em;
33125 }
33126 .wpfnl-datepicker .calendar {
33127 background: white;
33128 padding: 1em;
33129 }
33130 .wpfnl-datepicker .calendar .calendar-header {
33131 display: flex;
33132 justify-content: space-between;
33133 align-items: center;
33134 margin-bottom: 1em;
33135 }
33136 .wpfnl-datepicker .calendar .calendar-header .pre-month,
33137 .wpfnl-datepicker .calendar .calendar-header .next-month {
33138 border-radius: 8px;
33139 border: 1px solid #F1F0F5;
33140 padding: 8px 15px;
33141 }
33142 .wpfnl-datepicker .calendar .calendar-header .month-name {
33143 color: #2D3149;
33144 font-family: Inter;
33145 font-size: 16px;
33146 font-style: normal;
33147 font-weight: 500;
33148 line-height: 15px;
33149 }
33150 .wpfnl-datepicker .calendar .calendar-header button {
33151 background: none;
33152 border: none;
33153 cursor: pointer;
33154 font-size: 1.2em;
33155 }
33156 .wpfnl-datepicker .calendar .calendar-grid {
33157 display: grid;
33158 grid-template-columns: repeat(7, 1fr);
33159 gap: 0.5em;
33160 }
33161 .wpfnl-datepicker .calendar .calendar-grid .calendar-day {
33162 color: #9398A5;
33163 font-family: Inter;
33164 font-size: 14px;
33165 font-style: normal;
33166 font-weight: 500;
33167 line-height: 14px;
33168 cursor: default;
33169 }
33170 .wpfnl-datepicker .calendar .calendar-grid .calendar-day:hover {
33171 background: none !important;
33172 }
33173 .wpfnl-datepicker .calendar .calendar-grid div {
33174 text-align: center;
33175 padding: 0.5em;
33176 cursor: pointer;
33177 border-radius: 4px;
33178 color: #2D3149;
33179 text-align: center;
33180 font-family: Inter;
33181 font-size: 12px;
33182 font-style: normal;
33183 font-weight: 500;
33184 line-height: 2.667;
33185 }
33186 .wpfnl-datepicker .calendar .calendar-grid div.empty {
33187 background: none;
33188 cursor: default;
33189 }
33190 .wpfnl-datepicker .calendar .calendar-grid div.selected, .wpfnl-datepicker .calendar .calendar-grid div.start-date, .wpfnl-datepicker .calendar .calendar-grid div.end-date {
33191 background: #6E42D3;
33192 color: white;
33193 }
33194 .wpfnl-datepicker .calendar .calendar-grid div.in-range {
33195 background: #e5daff;
33196 }
33197 .wpfnl-datepicker .calendar .calendar-grid div.disabled {
33198 opacity: 0.5;
33199 cursor: default;
33200 pointer-events: none;
33201 }
33202 .wpfnl-datepicker .calendar .calendar-grid div.disabled:hover {
33203 background: none !important;
33204 }
33205 .wpfnl-datepicker .calendar .calendar-grid div:hover:not(.empty) {
33206 background: #f0f0f0;
33207 }
33208
33209 .wpfnl-pro-modal-overlay {
33210 position: fixed;
33211 top: 0;
33212 left: 0;
33213 width: 100%;
33214 height: 100%;
33215 background: rgba(16, 5, 46, 0.3);
33216 backdrop-filter: blur(7px);
33217 justify-content: center;
33218 align-items: center;
33219 display: flex;
33220 z-index: 999999;
33221 }
33222 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper {
33223 background: #fff;
33224 border-radius: 20px;
33225 padding: 40px;
33226 position: relative;
33227 width: 100%;
33228 max-width: 463px;
33229 position: relative;
33230 box-shadow: 0px 14px 14px #A7A4AF;
33231 animation: wpfnl-bounce 0.3s;
33232 -webkit-animation: wpfnl-bounce 0.3s;
33233 -moz-animation: wpfnl-bounce 0.3s;
33234 -ms-animation: wpfnl-bounce 0.3s;
33235 -o-animation: wpfnl-bounce 0.3s;
33236 }
33237 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-close .wpfnl-pro-modal-close-btn {
33238 position: absolute;
33239 right: -14px;
33240 top: -14px;
33241 background: #ffffff;
33242 box-shadow: 0px 1px 1px #dadada;
33243 border-radius: 100px;
33244 width: 34px;
33245 height: 34px;
33246 display: flex;
33247 align-items: center;
33248 justify-content: center;
33249 cursor: pointer;
33250 z-index: 2;
33251 }
33252 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content {
33253 display: flex;
33254 flex-direction: column;
33255 }
33256 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header-icon svg {
33257 display: block;
33258 margin-bottom: -18px;
33259 }
33260 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header {
33261 width: 100%;
33262 display: flex;
33263 flex-flow: column;
33264 align-items: center;
33265 position: relative;
33266 height: 100%;
33267 overflow: hidden;
33268 }
33269 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header .wpfnl-pro-heading {
33270 color: #1D2327;
33271 text-align: center;
33272 font-family: "Inter";
33273 font-size: 22px;
33274 font-weight: 600;
33275 line-height: 1.3;
33276 max-width: 330px;
33277 }
33278 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header .wpfnl-pro-sub-heading {
33279 color: #9398A5;
33280 text-align: center;
33281 font-family: Inter;
33282 font-size: 14px;
33283 font-style: normal;
33284 font-weight: 400;
33285 line-height: 1.42;
33286 margin-top: 6px;
33287 width: 80%;
33288 }
33289 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body {
33290 margin-top: 26px;
33291 border-top: 1px solid rgba(173, 173, 203, 0.2);
33292 padding-top: 24px;
33293 }
33294 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .feature-title {
33295 color: #4B4B4B;
33296 font-family: "Inter";
33297 font-size: 16px;
33298 font-weight: 600;
33299 line-height: 1;
33300 margin-bottom: 16px;
33301 }
33302 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .wpfnl-pro-features {
33303 display: flex;
33304 flex-flow: column;
33305 gap: 13px;
33306 }
33307 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .wpfnl-pro-features li {
33308 display: flex;
33309 align-items: center;
33310 gap: 8px;
33311 color: #707070;
33312 font-family: "Inter";
33313 font-size: 16px;
33314 font-weight: 400;
33315 line-height: 1.3;
33316 letter-spacing: -0.16px;
33317 }
33318 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .wpfnl-pro-features li span {
33319 color: #707070;
33320 font-size: 16px;
33321 font-weight: 400;
33322 line-height: 1.3;
33323 letter-spacing: -0.14px;
33324 }
33325 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer {
33326 margin-top: 24px;
33327 }
33328 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .btn-default {
33329 display: block;
33330 line-height: 1;
33331 padding: 18px 30px;
33332 height: auto;
33333 border-radius: 12px;
33334 box-shadow: 0 9px 14px 0 rgba(193, 183, 232, 0.4);
33335 }
33336 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages {
33337 display: flex;
33338 align-items: center;
33339 justify-content: center;
33340 gap: 10px;
33341 padding: 0px 0px 10px 0px;
33342 position: relative;
33343 }
33344 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-type {
33345 text-align: left;
33346 width: 42%;
33347 white-space: nowrap;
33348 overflow: hidden;
33349 text-overflow: ellipsis;
33350 padding: 10px;
33351 }
33352 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-type strong {
33353 color: #2D3149;
33354 font-size: 20px;
33355 font-weight: 500;
33356 }
33357 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-type span {
33358 color: #9398A5;
33359 font-size: 12px;
33360 font-weight: 400;
33361 }
33362 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-price {
33363 flex-grow: 1;
33364 padding: 10px;
33365 }
33366 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-price strong {
33367 color: #2D3149;
33368 font-size: 20px;
33369 font-weight: 500;
33370 }
33371 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-price span {
33372 color: #9398A5;
33373 font-size: 12px;
33374 font-weight: 400;
33375 }
33376 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-type, .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-price, .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-btn {
33377 background: transparent;
33378 border: 1px solid #E8E6EE;
33379 border-radius: 10px;
33380 }
33381 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-btn {
33382 width: 10%;
33383 padding: 16px 0px;
33384 }
33385 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages-btn svg {
33386 transition: all 0.3s ease;
33387 }
33388 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .btn-rotate svg {
33389 transform: rotate(180deg);
33390 }
33391 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .wpfnl-pro-modal-select-container {
33392 position: absolute;
33393 display: none;
33394 width: 56%;
33395 top: 92%;
33396 right: 0;
33397 background: #FFFFFF;
33398 border-radius: 10px;
33399 z-index: 1;
33400 border: 1px solid #F6F5FA;
33401 box-shadow: 0px 10px 20px rgba(226, 220, 237, 0.4);
33402 }
33403 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .wpfnl-pro-modal-select-container .wpfnl-pro-modal-select-dropdown li {
33404 padding: 10px;
33405 cursor: pointer;
33406 }
33407 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .wpfnl-pro-modal-select-container .wpfnl-pro-modal-select-dropdown li strong {
33408 color: #2D3149;
33409 font-size: 14px;
33410 font-weight: 500;
33411 }
33412 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .wpfnl-pro-modal-select-container .wpfnl-pro-modal-select-dropdown li span {
33413 color: #9398A5;
33414 font-size: 12px;
33415 font-weight: 400;
33416 }
33417 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .wpfnl-pro-modal-select-container .wpfnl-pro-modal-select-dropdown li:hover {
33418 background: #F6F5FA;
33419 }
33420 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .wpfnl-pro-modal-select-container .wpfnl-pro-modal-select-dropdown li:not(:last-child) {
33421 border-bottom: 1px solid #E8E6EE;
33422 }
33423 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-pro-modal-footer_packages .wpfnl-pro-modal-select-container.show-dropdown {
33424 display: block;
33425 }
33426 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-footer-btn-wrapper {
33427 display: flex;
33428 align-items: center;
33429 justify-content: center;
33430 gap: 16px;
33431 flex-wrap: wrap;
33432 }
33433 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-footer-btn-wrapper .cancel {
33434 color: #2D3149;
33435 font-size: 15px;
33436 font-style: normal;
33437 font-weight: 500;
33438 line-height: normal;
33439 letter-spacing: -0.15px;
33440 background: none;
33441 padding: 0;
33442 height: auto;
33443 min-width: unset;
33444 }
33445 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-footer-btn-wrapper .confirmed {
33446 border-radius: 10px;
33447 background: #6E42D3;
33448 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.4);
33449 display: flex;
33450 align-items: center;
33451 gap: 8px;
33452 cursor: pointer;
33453 min-height: 40px;
33454 width: 100%;
33455 margin: 0 auto;
33456 justify-content: center;
33457 }
33458 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer_container .wpfnl-footer-btn-wrapper .confirmed span {
33459 color: #FFF;
33460 font-size: 16px;
33461 font-style: normal;
33462 font-weight: 400;
33463 line-height: normal;
33464 text-align: center;
33465 }
33466 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text {
33467 display: flex;
33468 align-items: center;
33469 justify-content: center;
33470 margin-top: 10px;
33471 gap: 6px;
33472 font-size: 13px;
33473 }
33474 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text strong {
33475 color: #2D3149;
33476 font-size: 14px;
33477 font-weight: 500;
33478 }
33479 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text span {
33480 color: #9398A5;
33481 font-size: 12px;
33482 font-weight: 400;
33483 }
33484 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text svg {
33485 margin-top: -2px;
33486 }
33487 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text svg path {
33488 fill: #4CBB17;
33489 }
33490
33491 /* Standard syntax */
33492 @keyframes wpfnl-bounce {
33493 0% {
33494 transform: scale(0.7);
33495 }
33496 45% {
33497 transform: scale(1.05);
33498 }
33499 80% {
33500 transform: scale(0.95);
33501 }
33502 100% {
33503 transform: scale(1);
33504 }
33505 }
33506 /* Webkit (Safari, older versions of Chrome, etc.) */
33507 @-webkit-keyframes wpfnl-bounce {
33508 0% {
33509 -webkit-transform: scale(0.7);
33510 }
33511 45% {
33512 -webkit-transform: scale(1.05);
33513 }
33514 80% {
33515 -webkit-transform: scale(0.95);
33516 }
33517 100% {
33518 -webkit-transform: scale(1);
33519 }
33520 }
33521 /* Mozilla (Firefox) */
33522 @-moz-keyframes wpfnl-bounce {
33523 0% {
33524 -moz-transform: scale(0.7);
33525 }
33526 45% {
33527 -moz-transform: scale(1.05);
33528 }
33529 80% {
33530 -moz-transform: scale(0.95);
33531 }
33532 100% {
33533 -moz-transform: scale(1);
33534 }
33535 }
33536 /* Microsoft (Internet Explorer) */
33537 @-ms-keyframes wpfnl-bounce {
33538 0% {
33539 -ms-transform: scale(0.7);
33540 }
33541 45% {
33542 -ms-transform: scale(1.05);
33543 }
33544 80% {
33545 -ms-transform: scale(0.95);
33546 }
33547 100% {
33548 -ms-transform: scale(1);
33549 }
33550 }
33551 /* Opera */
33552 @-o-keyframes wpfnl-bounce {
33553 0% {
33554 -o-transform: scale(0.7);
33555 }
33556 45% {
33557 -o-transform: scale(1.05);
33558 }
33559 80% {
33560 -o-transform: scale(0.95);
33561 }
33562 100% {
33563 -o-transform: scale(1);
33564 }
33565 }
33566 #wpfnl-toaster-wrapper {
33567 display: none;
33568 }
33569 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast {
33570 position: fixed;
33571 top: 50px;
33572 right: 30px;
33573 z-index: 9999;
33574 -webkit-animation: quick-toastify-fadeinout 3s linear forwards;
33575 animation: quick-toastify-fadeinout 3s ease-in-out forwards;
33576 }
33577 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container {
33578 background: #ffffff;
33579 border: 1px solid #039855;
33580 box-shadow: 0px 7px 30px rgba(16, 5, 46, 0.08);
33581 border-radius: 10px;
33582 display: flex;
33583 flex-flow: row wrap;
33584 align-items: center;
33585 padding: 15px;
33586 }
33587 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-successfull-icon,
33588 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
33589 height: 26px;
33590 width: 26px;
33591 }
33592 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container p {
33593 padding: 0 60px 0 13px;
33594 }
33595 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
33596 background: #ffffff;
33597 border: 1px solid #e4e6eb;
33598 border-radius: 6px;
33599 display: flex;
33600 justify-content: center;
33601 align-items: center;
33602 cursor: pointer;
33603 }
33604 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon svg path {
33605 fill: #686f7f;
33606 }
33607 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon:hover {
33608 background: #e4e6eb;
33609 }
33610 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-successful-notification.quick-toastify-hide {
33611 display: none;
33612 }
33613 #wpfnl-toaster-wrapper {
33614 /* -------Warn notification alert toast------------ */
33615 }
33616 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast {
33617 position: fixed;
33618 top: 120px;
33619 right: 30px;
33620 z-index: 9999;
33621 -webkit-animation: quick-toastify-fadeinout 3s linear forwards;
33622 animation: quick-toastify-fadeinout 3s ease-in-out forwards;
33623 }
33624 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container {
33625 background: #ffffff;
33626 border: 1px solid #ec0707;
33627 box-shadow: 0px 7px 30px rgba(16, 5, 46, 0.08);
33628 border-radius: 10px;
33629 display: flex;
33630 flex-flow: row wrap;
33631 align-items: center;
33632 padding: 15px;
33633 }
33634 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-successfull-icon,
33635 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
33636 height: 26px;
33637 width: 26px;
33638 }
33639 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container p {
33640 padding: 0 60px 0 13px;
33641 }
33642 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
33643 background: #ffffff;
33644 border: 1px solid #e4e6eb;
33645 border-radius: 6px;
33646 display: flex;
33647 justify-content: center;
33648 align-items: center;
33649 cursor: pointer;
33650 }
33651 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon svg path {
33652 fill: #686f7f;
33653 }
33654 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon:hover {
33655 background: #e4e6eb;
33656 }
33657 @-webkit-keyframes quick-toastify-fadeinout {
33658 0% {
33659 opacity: 0;
33660 top: 80px;
33661 }
33662 20%, 80% {
33663 opacity: 1;
33664 top: 50px;
33665 }
33666 100% {
33667 opacity: 0;
33668 top: 20px;
33669 }
33670 }
33671 @keyframes quick-toastify-fadeinout {
33672 0% {
33673 opacity: 0;
33674 top: 80px;
33675 }
33676 20%, 80% {
33677 opacity: 1;
33678 top: 50px;
33679 }
33680 100% {
33681 opacity: 0;
33682 top: 20px;
33683 }
33684 }
33685
33686 body.rtl .wpfnl-checkbox label {
33687 padding-right: 29px;
33688 padding-left: 0;
33689 }
33690 body.rtl .wpfnl-checkbox label:before {
33691 left: inherit;
33692 right: 0;
33693 }
33694 body.rtl .wpfnl-checkbox label:after {
33695 left: inherit;
33696 right: 5px;
33697 }
33698 body.rtl .wpfnl-radiobtn label {
33699 padding-right: 29px;
33700 padding-left: 0;
33701 }
33702 body.rtl .wpfnl-radiobtn label::before {
33703 content: "";
33704 position: absolute;
33705 left: inherit;
33706 right: 0;
33707 }
33708 body.rtl .wpfnl-radiobtn label::after {
33709 right: 5px;
33710 left: inherit;
33711 }
33712 body.rtl .wpfnl-delete-alert-wrapper {
33713 right: inherit;
33714 left: 0;
33715 }
33716 body.rtl .delete-alert-new-ui .icon {
33717 right: inherit;
33718 left: -12px;
33719 }
33720 body.rtl .delete-alert-new-ui .wpfnl-delete-confirm-body p {
33721 text-align: right;
33722 }
33723 body.rtl .wpfnl-loader {
33724 margin-left: 0;
33725 margin-right: 4px;
33726 }
33727 body.rtl ul.wpfnl-dropdown {
33728 left: 0;
33729 right: inherit;
33730 }
33731 body.rtl ul.wpfnl-dropdown:after {
33732 left: 21px;
33733 right: inherit;
33734 }
33735 body.rtl ul.wpfnl-dropdown li a svg {
33736 margin-left: 6px;
33737 margin-right: 0;
33738 }
33739 body.rtl .wpfnl-field-wrapper > label {
33740 padding-left: 10px;
33741 padding-right: 0;
33742 }
33743 body.rtl .wpfnl-custom-selectbox .selectbox-selected-value {
33744 text-align: right;
33745 }
33746 body.rtl .wpfnl-custom-selectbox .selectbox-selected-value:before {
33747 left: 15px;
33748 right: inherit;
33749 }
33750 body.rtl .wpfnl-custom-selectbox .selectbox-selected-value {
33751 padding: 13px 12px 13px 33px;
33752 }
33753 body.rtl .wpfnl-custom-selectbox .list-title {
33754 right: -8px;
33755 left: inherit;
33756 }
33757
33758 body.rtl .template-library-modal {
33759 left: inherit;
33760 right: 160px;
33761 }
33762 body.rtl .template-library-modal .funnel-templates-header .back-form-modal {
33763 margin-right: 0;
33764 margin-left: 15px;
33765 }
33766 body.rtl .template-library-modal .funnel-templates-header .back-form-modal svg {
33767 left: 1px;
33768 transform: rotate(180deg);
33769 }
33770 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .wpfnl-modal-close {
33771 margin-right: 0;
33772 margin-left: 15px;
33773 }
33774 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .wpfnl-modal-close svg {
33775 transform: rotate(180deg);
33776 }
33777 body.rtl .template-library-modal .funnel-templates-header .template-type-filter {
33778 margin-left: 0;
33779 margin-right: auto;
33780 background-position-x: 13px;
33781 }
33782 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter,
33783 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter {
33784 margin-left: 0 !important;
33785 margin-right: auto;
33786 }
33787 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li:first-child,
33788 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter li:first-child {
33789 border-radius: 0 50px 50px 0;
33790 }
33791 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li:last-child,
33792 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter li:last-child {
33793 border-radius: 50px 0 0 50px;
33794 }
33795 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li svg,
33796 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter li svg {
33797 margin-right: 0;
33798 margin-left: 8px;
33799 }
33800 body.rtl .template-library-modal .funnel-templates-sidebar .category-filter-wrapper {
33801 padding-right: 0;
33802 padding-left: 8px;
33803 }
33804 body.rtl .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice svg,
33805 body.rtl .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default svg {
33806 margin-right: 0;
33807 margin-left: 2px;
33808 }
33809 body.rtl .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-header .close,
33810 body.rtl .step-template-showcase-modal .create-step-name-modal .modal-header .close,
33811 body.rtl .template-library-modal .wpfnl-create-funnel__templates-wrapper .create-funnel-name-modal .modal-header .close {
33812 right: inherit;
33813 left: -11px;
33814 }
33815
33816 body.rtl.folded .template-library-modal {
33817 right: 36px;
33818 width: calc(100% - 36px);
33819 }
33820
33821 body.rtl.wp-funnels_page_edit_funnel #wpcontent {
33822 padding-right: 0;
33823 }
33824 body.rtl .steps-page__header {
33825 padding-right: 24px;
33826 padding-left: 12px;
33827 }
33828 body.rtl .steps-page__header-left .wpfnl-logo a {
33829 border-left: 1px solid #E5E8F3;
33830 border-right: 0;
33831 }
33832 body.rtl .steps-page__header-left .back-link {
33833 margin-right: 0;
33834 margin-left: 15px;
33835 }
33836 body.rtl .steps-page__header-left .back-link svg {
33837 transform: rotate(180deg);
33838 }
33839 body.rtl .steps-page__header-left .add-step-condtion-area li > button svg {
33840 margin-right: 0;
33841 margin-left: 5px;
33842 }
33843 body.rtl .steps-page__header-left .add-step-condtion-area li > button.add-new-step svg {
33844 margin-right: 0;
33845 margin-left: 5px;
33846 }
33847 body.rtl .steps-page__header-center .steps-page__fnl-name .fnl-name-btn {
33848 margin-left: 0;
33849 margin-right: 10px;
33850 }
33851 body.rtl .steps-page__header-right {
33852 margin-left: 0;
33853 margin-right: auto;
33854 }
33855 body.rtl .steps-page__header-right .enable-gbf {
33856 margin-right: 0;
33857 margin-left: 15px;
33858 }
33859 body.rtl .steps-page__header-right .enable-gbf,
33860 body.rtl .steps-page__header-right .funnel-stats {
33861 border-right: none;
33862 padding-right: 0;
33863 margin-right: 0;
33864 border-left: 1px solid #E5E8F3;
33865 margin-left: 5px;
33866 padding-left: 20px;
33867 }
33868 body.rtl .steps-page__header-right .enable-gbf .title,
33869 body.rtl .steps-page__header-right .funnel-stats .title {
33870 margin-right: 0;
33871 margin-left: 10px;
33872 }
33873 body.rtl .steps-page__header-right .dropdown-option {
33874 margin-left: 0;
33875 margin-right: 6px;
33876 }
33877 body.rtl .steps-page__header-right .dropdown-option ul.wpfnl-dropdown {
33878 right: inherit;
33879 left: -4px;
33880 }
33881 body.rtl .steps-page__header-right ul.wpfnl-dropdown:after {
33882 left: 11px;
33883 right: inherit;
33884 }
33885 body.rtl .steps-page__header-right .dropdown-option ul.wpfnl-dropdown a svg {
33886 margin-right: 0;
33887 margin-left: 6px;
33888 }
33889 body.rtl .funnel-window .wpfnl-canvas-zoom-control {
33890 left: inherit;
33891 right: 20px;
33892 }
33893 body.rtl .funnel-window .wpfnl-canvas-helper {
33894 right: inherit;
33895 left: 20px;
33896 }
33897 body.rtl .funnel-window .wpfnl-canvas-helper .help-resource {
33898 right: inherit;
33899 left: 0;
33900 }
33901 body.rtl .funnel-window .wpfnl-canvas-helper .help-resource:before {
33902 bottom: -7px;
33903 right: inherit;
33904 }
33905 body.rtl .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input {
33906 left: -20px;
33907 right: inherit;
33908 }
33909 body.rtl .reconfigure-condition-modal .wpfnl-delete-confirm-body {
33910 text-align: right;
33911 }
33912
33913 body.rtl .wpfnl-step-settings-drawer {
33914 right: inherit;
33915 left: -190px;
33916 }
33917 body.rtl .wpfnl-step-settings-drawer.show-drawer {
33918 right: inherit;
33919 left: 0;
33920 }
33921 body.rtl .wpfnl-step-settings-drawer .drawer-header .drawer-title {
33922 display: flex;
33923 align-items: center;
33924 gap: 3px;
33925 flex-flow: row wrap;
33926 }
33927 body.rtl .steps-settings .steps-settings__tab-nav li a svg {
33928 margin-right: 0;
33929 margin-left: 8px;
33930 }
33931 body.rtl .step-settings__single-tab-content.product .product-head .product-search {
33932 margin-left: 0;
33933 margin-right: 0;
33934 }
33935 body.rtl .step-settings__single-tab-content .product-head .wpfnl-tooltip,
33936 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .wpfnl-tooltip {
33937 margin-left: 10px;
33938 margin-right: auto;
33939 }
33940 body.rtl .step-settings__single-tab-content .product-head .add-product-btn,
33941 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn {
33942 margin-left: 0;
33943 margin-right: 15px;
33944 }
33945 body.rtl .step-settings__single-tab-content .product-head .title,
33946 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .title {
33947 margin-right: 0;
33948 margin-left: 10px;
33949 }
33950 body.rtl .step-settings__single-tab-content .accordion-footer,
33951 body.rtl .step-settings__single-tab-content .accordion-head,
33952 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-footer,
33953 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-head {
33954 padding: 20px 60px 20px 25px;
33955 }
33956 body.rtl .step-settings__single-tab-content .product-single__accordion-head,
33957 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head {
33958 padding: 25px 60px 25px 25px;
33959 }
33960 body.rtl .step-settings__single-tab-content .accordion-footer .total-price,
33961 body.rtl .step-settings__single-tab-content .product-single__accordion-head .total-price,
33962 body.rtl .step-settings__single-tab-content .accordion-head .total-price,
33963 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price,
33964 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .total-price,
33965 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-head .total-price {
33966 text-align: left;
33967 }
33968 body.rtl .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title,
33969 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title {
33970 padding-left: 0;
33971 padding-right: 19px;
33972 }
33973 body.rtl .step-settings__single-tab-content .product-single__accordion-head .product-action .product-edit,
33974 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-edit {
33975 margin-left: 0;
33976 margin-right: 6px;
33977 }
33978 body.rtl .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .icon {
33979 margin-right: 0;
33980 margin-left: 12px;
33981 }
33982 body.rtl .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .title {
33983 display: inline-flex;
33984 gap: 3px;
33985 }
33986 body.rtl .order-bump-accordion-wrapper .order-bump-accordion-header .action-area button {
33987 margin: 0 6px 0 0;
33988 }
33989 body.rtl .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area {
33990 margin-right: 0;
33991 margin-left: 25px;
33992 }
33993 body.rtl .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label .color-picker {
33994 right: inherit;
33995 left: 10px;
33996 }
33997 body.rtl .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-content {
33998 padding-left: 0;
33999 padding-right: 20px;
34000 }
34001 body.rtl .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label {
34002 padding-left: 0;
34003 padding-right: 26px;
34004 }
34005 body.rtl .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label:after {
34006 left: inherit;
34007 right: 4px;
34008 }
34009 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label {
34010 padding: 0 20px 0 0;
34011 }
34012 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .nav-arrow svg {
34013 transform: rotate(180deg);
34014 }
34015 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .nav-arrow {
34016 margin-right: 0;
34017 margin-left: 10px;
34018 animation: moveArrowRtl 1s linear infinite;
34019 }
34020 body.rtl .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-content {
34021 padding-left: 0;
34022 padding-right: 20px;
34023 }
34024 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label:after {
34025 left: inherit;
34026 right: 3px;
34027 }
34028 body.rtl .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label {
34029 padding-left: 0;
34030 padding-right: 28px;
34031 }
34032 body.rtl .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label:after {
34033 left: inherit;
34034 right: 4px;
34035 width: 9px;
34036 height: 5px;
34037 }
34038 body.rtl .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-content {
34039 padding-left: 0;
34040 padding-right: 14px;
34041 }
34042 body.rtl .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-price {
34043 padding-left: 10px;
34044 padding-right: 10px;
34045 }
34046 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label {
34047 padding-left: 50px;
34048 padding-right: 0;
34049 }
34050 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:before {
34051 left: 0;
34052 right: inherit;
34053 }
34054 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:after {
34055 left: 4px;
34056 right: inherit;
34057 }
34058 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::after {
34059 right: inherit;
34060 left: 26px;
34061 }
34062 body.rtl .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content {
34063 padding-right: 0;
34064 padding-left: 14px;
34065 }
34066 body.rtl .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content {
34067 padding-right: 0;
34068 padding-left: 20px;
34069 }
34070 body.rtl .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label {
34071 padding: 0 26px 0 0;
34072 }
34073 body.rtl .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label:after {
34074 left: inherit;
34075 right: 4px;
34076 width: 9px;
34077 height: 5px;
34078 }
34079 body.rtl .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content-wrapper {
34080 padding-right: 0;
34081 padding-left: 15px;
34082 }
34083 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .nav-arrow {
34084 margin-right: 0;
34085 margin-left: 10px;
34086 }
34087 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label {
34088 padding: 0 20px 0 0;
34089 }
34090 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label:after {
34091 left: inherit;
34092 right: 2px;
34093 top: 5px;
34094 width: 6px;
34095 height: 3px;
34096 }
34097 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .nav-arrow svg {
34098 transform: rotate(180deg);
34099 }
34100 body.rtl .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-content {
34101 padding-right: 20px;
34102 padding-left: 0;
34103 }
34104 body.rtl .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label {
34105 padding: 0 26px 0 0;
34106 }
34107 body.rtl .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label:after {
34108 right: 3px;
34109 left: inherit;
34110 }
34111 body.rtl .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title {
34112 padding-left: 15px;
34113 padding-right: 0;
34114 }
34115 body.rtl .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .nav-arrow {
34116 top: 2px;
34117 margin-left: 7px;
34118 margin-right: 0;
34119 }
34120 body.rtl .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .nav-arrow svg {
34121 transform: rotate(-180deg);
34122 }
34123 body.rtl .wpfnl-order-bump__template-style10 .offer-checkbox {
34124 text-align: left;
34125 }
34126 body.rtl .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price {
34127 text-align: left;
34128 }
34129 body.rtl .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label {
34130 padding: 0 26px 0 0;
34131 }
34132 body.rtl .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label:after {
34133 right: 4px;
34134 left: inherit;
34135 }
34136 body.rtl .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-img {
34137 margin: 0 0 6px 16px;
34138 float: right;
34139 }
34140 body.rtl .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-content {
34141 clear: left;
34142 }
34143 body.rtl .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label {
34144 padding-right: 26px;
34145 padding-left: 0;
34146 }
34147 body.rtl .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label:after {
34148 right: 4px;
34149 left: inherit;
34150 }
34151 body.rtl .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label {
34152 padding-right: 26px;
34153 padding-left: 0;
34154 }
34155 body.rtl .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label:after {
34156 right: 4px;
34157 left: inherit;
34158 }
34159 body.rtl .wpfnl-order-bump__template-style13 .product-price {
34160 margin-right: 5px;
34161 margin-left: 0;
34162 }
34163 body.rtl .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-content {
34164 padding-right: 20px;
34165 padding-left: 0;
34166 }
34167 body.rtl .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label {
34168 padding: 0 26px 0 0;
34169 }
34170 body.rtl .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label:after {
34171 right: 3px;
34172 left: inherit;
34173 }
34174 body.rtl .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-content {
34175 padding-right: 20px;
34176 padding-left: 0;
34177 }
34178 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn {
34179 margin-right: auto;
34180 margin-left: 0;
34181 }
34182 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn {
34183 margin-right: 20px;
34184 margin-left: 0;
34185 }
34186 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav {
34187 padding: 23px 0 23px 20px;
34188 }
34189 body.rtl .edit-field-settings__single-tab-content .checkout-field-header {
34190 padding: 20px 65px 20px 20px;
34191 }
34192 body.rtl .edit-field-settings__single-tab-content .checkout__single-field {
34193 padding: 25px 65px 25px 20px;
34194 }
34195 body.rtl .edit-field-settings__single-tab-content .checkout-field-header .field-hamburger,
34196 body.rtl .edit-field-settings__single-tab-content .checkout__single-field .field-hamburger {
34197 right: 20px;
34198 left: inherit;
34199 }
34200 body.rtl .wpfnl-step-settings-drawer.edit-field-drawer.show-edit-field-drawer {
34201 right: inherit;
34202 left: 0;
34203 }
34204 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper .wpfnl-checkbox label {
34205 padding-right: 33px;
34206 padding-left: 0;
34207 }
34208 body.rtl .step-settings__single-tab-content .product-head .product-search,
34209 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .product-search {
34210 margin-left: 0;
34211 margin-right: auto;
34212 }
34213 body.rtl .step-settings__single-tab-content .product-head .product-search .select2-selection__rendered,
34214 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .product-search .select2-selection__rendered {
34215 padding: 10px 35px 10px 10px;
34216 }
34217 body.rtl .step-settings__single-tab-content .product-head .product-search .search-icon,
34218 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .product-search .search-icon {
34219 left: inherit;
34220 right: 10px;
34221 }
34222 body.rtl .steps-settings .settings-content__footer .btn-default .wpfnl-loader {
34223 margin-left: 0;
34224 margin-right: 6px;
34225 }
34226 @keyframes moveArrowRtl {
34227 0%, 100% {
34228 transform: translateX(8px);
34229 opacity: 1;
34230 }
34231 50%, 90% {
34232 transform: translateX(-15px);
34233 opacity: 0;
34234 }
34235 99% {
34236 transform: translateX(8px);
34237 opacity: 0;
34238 }
34239 }
34240
34241 @media only screen and (max-width: 1199px) {
34242 body.rtl .step-settings__single-tab-content .product-single__accordion-head,
34243 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head {
34244 padding: 20px 50px 20px 20px;
34245 }
34246 }
34247 body.rtl .wpfnl-selectbox .selected-option {
34248 padding: 13px 14px 11px 30px;
34249 }
34250 body.rtl .wpfnl-selectbox .selected-option:before {
34251 left: 14px;
34252 right: inherit;
34253 }
34254 body.rtl .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .selected-option {
34255 padding: 14px 14px 12px 30px;
34256 }
34257 body.rtl .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button svg {
34258 transform: rotate(-180deg);
34259 }
34260
34261 body.rtl .ab-testing-drawer .header-left .ab-testing-status {
34262 margin-left: 0;
34263 margin-right: 8px;
34264 }
34265 body.rtl .wpfnl-step-settings-drawer .drawer-header .wpfnl-drawer-close svg {
34266 transform: rotate(180deg);
34267 }
34268 body.rtl .ab-testing-drawer .header-right .more-options .options-dropdown {
34269 left: -10px;
34270 right: inherit;
34271 }
34272 body.rtl .ab-testing-drawer .traffic-distribution-modal {
34273 right: inherit;
34274 left: 0;
34275 }
34276 body.rtl .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .variation-type {
34277 margin-left: 0;
34278 margin-right: 8px;
34279 }
34280 body.rtl .ab-testing-drawer .header-right .btn-default .wpfnl-loader {
34281 margin: 0;
34282 }
34283 body.rtl .ab-testing-stats .stats-wrapper thead th .col-inner-wrap {
34284 text-align: right;
34285 }
34286 body.rtl .ab-testing-drawer .ab-testing-winner-modal {
34287 right: inherit;
34288 left: 0;
34289 }
34290 body.rtl .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label {
34291 padding-right: 29px;
34292 padding-left: 0;
34293 }
34294 body.rtl .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label:after {
34295 right: 3px;
34296 left: inherit;
34297 }
34298 body.rtl .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown {
34299 left: inherit;
34300 right: 0;
34301 }
34302 body.rtl .ab-testing-drawer .single-ab-step .variation-type {
34303 right: 15px;
34304 left: inherit;
34305 }
34306 body.rtl .ab-testing-drawer .single-ab-step .ab-variation-delete {
34307 right: inherit;
34308 left: -8px;
34309 }
34310 body.rtl .ab-testing-drawer .add-step-wrapper .add-steps-options,
34311 body.rtl .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options {
34312 right: calc(100% + 15px);
34313 left: inherit;
34314 }
34315 body.rtl .ab-testing-drawer .add-step-wrapper .add-steps-options {
34316 right: calc(100% + 15px);
34317 left: inherit;
34318 }
34319 body.rtl .ab-testing-drawer .ab-testing-confirmation-modal {
34320 right: 160px;
34321 left: inherit;
34322 }
34323 body.rtl .folded .ab-testing-drawer .ab-testing-confirmation-modal {
34324 right: 36px;
34325 left: inherit;
34326 }
34327 body.rtl .ab-testing-drawer .ab-testing-confirmation-modal .close-confirmation-modal {
34328 left: -13px;
34329 right: inherit;
34330 }
34331
34332 body.rtl .wpfnl-webhook-drawer .drawer-header .webhook-search {
34333 margin-right: auto;
34334 margin-left: 0;
34335 }
34336 body.rtl .wpfnl-webhook-drawer .drawer-header .webhook-search input[type=text] {
34337 padding-right: 34px;
34338 margin-left: 15px;
34339 }
34340 body.rtl .wpfnl-webhook-drawer .drawer-header .webhook-search svg {
34341 right: 14px;
34342 left: inherit;
34343 }
34344 body.rtl .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-fields .link-icon {
34345 border-left: 1px solid #EEF0F3;
34346 border-right: 0;
34347 }
34348 body.rtl .webhook-settings-drawer .request-url input[type=text] {
34349 padding-right: 50px;
34350 padding-left: 15px;
34351 }
34352 body.rtl .webhook-settings-drawer .wpfnl-field-wrapper select {
34353 padding-left: 36px;
34354 padding-right: 15px;
34355 background-position-x: 15px;
34356 }
34357 body.rtl .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label::after {
34358 right: 6px;
34359 left: inherit;
34360 }
34361 body.rtl .wpfnl-webhook-drawer .drawer-body .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
34362 margin-right: 3px;
34363 margin-left: 0;
34364 }
34365 body.rtl .webhook-settings-drawer .feed-name .wpfnl-tooltip p {
34366 right: calc(100% + 8px);
34367 left: inherit;
34368 }
34369 body.rtl .webhook-settings-drawer .feed-name .wpfnl-tooltip p:before {
34370 right: -4px;
34371 left: inherit;
34372 }
34373 body.rtl .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field button {
34374 margin-right: 2px;
34375 margin-left: 0;
34376 }
34377 body.rtl .delete-alert-new-ui .wpfnl-delete-confirm-body {
34378 padding: 26px 26px 26px 20px;
34379 }
34380
34381 body.rtl .wpfnl-drawflow-window .wpfnl-analytics {
34382 right: inherit;
34383 left: 0px;
34384 }
34385 body.rtl .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .backto-steps svg {
34386 transform: rotate(180deg);
34387 }
34388 body.rtl .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right select {
34389 padding: 14px 20px 12px 40px;
34390 background-position-x: 15px;
34391 }
34392 body.rtl .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
34393 right: 160px;
34394 left: inherit;
34395 }
34396 body.rtl.folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
34397 right: 36px;
34398 left: inherit;
34399 }
34400 body.rtl .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator:before {
34401 margin-left: 8px;
34402 margin-right: 0;
34403 }
34404 body.rtl .wpfnl-analytics .analytics-revenue .single-tab-content .barchart-inner-wrapper {
34405 padding: 10px 60px 9px 15px;
34406 }
34407 body.rtl .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label:before {
34408 right: 50px;
34409 left: inherit;
34410 }
34411 body.rtl .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator {
34412 direction: ltr;
34413 }
34414
34415 @media only screen and (max-width: 782px) {
34416 body.rtl.folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
34417 right: 0;
34418 left: inherit;
34419 }
34420 }
34421 body.rtl .wpfnl-dashboard__header .funnel-search {
34422 margin-left: 20px;
34423 margin-right: 0;
34424 }
34425 body.rtl .wpfnl-dashboard__header .funnel-search .search-group input {
34426 padding-right: 40px;
34427 padding-left: 0;
34428 }
34429 body.rtl .wpfnl-dashboard__header .funnel-search .search-group svg {
34430 right: 12px;
34431 left: inherit;
34432 }
34433 body.rtl .wpfnl-dashboard__header a.import-export {
34434 margin-left: 14px;
34435 margin-right: 0;
34436 }
34437 body.rtl .wpfnl-dashboard__header a.import-export.wpfnl-export-all-funnels {
34438 margin-left: 14px;
34439 margin-right: auto;
34440 }
34441 body.rtl .wpfnl-dashboard__header .add-new-funnel-btn svg {
34442 margin-left: 3px;
34443 margin-right: 0;
34444 }
34445 body.rtl .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
34446 right: 24px;
34447 left: inherit;
34448 }
34449 body.rtl .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper {
34450 right: 60px;
34451 left: inherit;
34452 }
34453 body.rtl .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler > svg {
34454 margin-right: 16px;
34455 margin-left: 0;
34456 }
34457 body.rtl .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler:before {
34458 left: 27px;
34459 right: inherit;
34460 }
34461 body.rtl .funnel-list__wrapper .funnel__single-list.list-header {
34462 padding: 15px 60px 15px 24px;
34463 }
34464 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-name {
34465 padding-right: 45px;
34466 padding-left: 15px;
34467 }
34468 body.rtl .funnel-list__wrapper .funnel__single-list {
34469 padding: 14px 60px 14px 24px;
34470 }
34471 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-name .builder-logo {
34472 right: 0;
34473 left: inherit;
34474 }
34475 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag svg {
34476 margin-left: 6px;
34477 margin-right: 0;
34478 }
34479 body.rtl .funnel-list__wrapper .funnel__single-list .list-action ul.more-actions {
34480 left: -22px;
34481 right: inherit;
34482 }
34483 body.rtl .wpfnl-pagination .nav-link.prev svg,
34484 body.rtl .wpfnl-pagination .nav-link.next svg {
34485 transform: rotate(180deg);
34486 }
34487
34488 @media only screen and (max-width: 1199px) {
34489 body.rtl .funnel-list__wrapper .funnel__single-list.list-header {
34490 padding: 15px 45px 15px 15px;
34491 }
34492 body.rtl .funnel-list__wrapper .funnel__single-list {
34493 padding: 10px 45px 10px 15px;
34494 }
34495 body.rtl .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
34496 right: 15px;
34497 }
34498 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-name {
34499 padding-left: 10px;
34500 }
34501 }
34502 body.rtl .funnel-settings__header {
34503 padding: 28px 30px 27px 20px;
34504 }
34505 body.rtl .funnel-settings__header .helper-link li {
34506 margin-right: 35px;
34507 margin-left: 0;
34508 }
34509 body.rtl .funnel-settings__header .helper-link li:first-child {
34510 margin-right: 0;
34511 }
34512 body.rtl .wpfn-settings__nav .nav-li svg {
34513 margin-left: 6px;
34514 margin-right: 0;
34515 }
34516 body.rtl .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
34517 margin-right: 10px;
34518 margin-left: 0;
34519 }
34520 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper .wpfnl-fields .clear-template span {
34521 margin-left: 5px;
34522 margin-right: 0;
34523 }
34524 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .settings-title > svg,
34525 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .settings-title > svg,
34526 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .settings-title > svg {
34527 margin-left: 10px;
34528 margin-right: 0;
34529 }
34530 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .utm .settings-title a,
34531 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .gtm .settings-title a,
34532 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .facebook-pixel .settings-title a {
34533 margin-right: auto;
34534 margin-left: 0;
34535 }
34536 body.rtl .wpfnl-funnel-settings__wrapper .wpfnl-funnel__single-settings .wpfnl-field-wrapper.analytics-stats .wpfnl-fields .wpfnl-checkbox {
34537 margin: 5px 0 5px 25px;
34538 }
34539
34540 body.rtl .mailmint-automation .header-right .more-options .options-dropdown {
34541 left: -10px;
34542 right: inherit;
34543 }
34544 body.rtl .mailmint-automation .automation-single-step .delete-action {
34545 left: -10px;
34546 right: inherit;
34547 }
34548 body.rtl .wpfnl-custom-selectbox .selectbox-search input[type=search] {
34549 padding: 6px 36px 4px 15px;
34550 }
34551 body.rtl .wpfnl-custom-selectbox .selectbox-search .search-icon {
34552 right: 25px;
34553 left: inherit;
34554 }
34555 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .submenu {
34556 right: 100%;
34557 left: inherit;
34558 }
34559 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .angle-right {
34560 left: 9px;
34561 right: inherit;
34562 transform: rotate(90deg);
34563 }
34564 body.rtl .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__input {
34565 padding: 11px 32px 9px 20px;
34566 }
34567 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:before {
34568 left: 8px;
34569 right: inherit;
34570 }
34571 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol {
34572 left: -4px;
34573 right: inherit;
34574 }
34575 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions::before {
34576 left: -30px;
34577 right: inherit;
34578 }
34579 body.rtl .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select {
34580 padding-left: 38px;
34581 padding-right: 15px;
34582 background-position-x: 15px;
34583 }
34584 body.rtl .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater > hr {
34585 right: -15px;
34586 left: inherit;
34587 }
34588 body.rtl .mailmint-automation .steps-settings-sidebar .add-template-section .add-template > span svg {
34589 margin-left: 0;
34590 margin-right: 8px;
34591 transform: rotate(180deg);
34592 }
34593 body.rtl .wpfnl-mrm-email-template__wrapper {
34594 left: 0;
34595 right: inherit;
34596 }
34597 body.rtl .wpfnl-mrm-email-template__modal .cross-icon {
34598 left: -20px;
34599 right: inherit;
34600 }
34601 body.rtl .mailmint-automation .logical-decision-box .single-decision.decision-yes {
34602 transform: translateX(calc(-50% + 1px));
34603 }
34604 body.rtl .mailmint-automation .logical-decision-box .single-decision.decision-no {
34605 transform: translateX(calc(50% - 1px));
34606 }
34607 body.rtl .mailmint-automation .logical-decision-box .logical-text {
34608 left: 25%;
34609 right: inherit;
34610 }
34611 body.rtl .mailmint-automation .logical-decision-box .logical-text.logical-no-text {
34612 right: 25%;
34613 left: inherit;
34614 }
34615
34616 body.rtl .wpfnl-settings-drawer .fnl-settings-content .settings-title > svg {
34617 margin-left: 10px;
34618 margin-right: 0;
34619 }
34620 body.rtl .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper {
34621 padding-left: 30px;
34622 margin-right: 0;
34623 }
34624 body.rtl .wpfnl-settings-drawer .fnl-settings-content .settings-title a {
34625 margin-right: auto;
34626 margin-left: 0;
34627 }
34628
34629 body.rtl .wpfnl-automation-window .automation-darwer {
34630 left: -190px;
34631 right: inherit;
34632 }
34633 body.rtl .wpfnl-automation-window .automation-darwer.show-drawer {
34634 left: 0;
34635 right: inherit;
34636 }
34637 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper label {
34638 padding-left: 7px;
34639 padding-right: 0;
34640 }
34641 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button {
34642 margin-right: 10px;
34643 margin-left: 0;
34644 }
34645 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm {
34646 margin-right: 30px;
34647 margin-left: 0;
34648 }
34649 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .wpfnl-drawer-close {
34650 margin-right: auto;
34651 margin-left: 0;
34652 }
34653 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm .connect-crm-title {
34654 padding-left: 7px;
34655 padding-right: 0;
34656 }
34657