PluginProbe
WPFunnels – Funnel Builder for WooCommerce with Checkout & One Click Upsell / 3.13.3
WPFunnels – Funnel Builder for WooCommerce with Checkout & One Click Upsell v3.13.3
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.13.3, at admin/assets/css/wpfnl-admin.css

31,526 lines 952.9 KB
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 .upgrade-to-pro-hoverlay {
425 position: absolute;
426 inset: 0;
427 background: rgba(255, 255, 255, 0.6);
428 display: flex;
429 align-items: center;
430 justify-content: center;
431 border-radius: 10px;
432 z-index: 1;
433 }
434 .wpfnl .upgrade-to-pro-hoverlay .btn-default {
435 display: flex;
436 align-items: center;
437 justify-content: center;
438 gap: 10px;
439 background: #2fcf5c;
440 padding: 10px 15px;
441 line-height: 1;
442 height: auto;
443 font-size: 14px;
444 border-radius: 10px;
445 }
446 .wpfnl .upgrade-to-pro-hoverlay .btn-default circle {
447 fill: #fff;
448 }
449 .wpfnl .upgrade-to-pro-hoverlay .btn-default path {
450 fill: #2fcf5c;
451 }
452 .wpfnl .upgrade-to-pro-hoverlay .btn-default:hover {
453 background: #1a8939;
454 }
455 .wpfnl .wpfnl-field-description {
456 display: block;
457 max-width: 460px;
458 margin-top: 5px;
459 padding-right: 20px;
460 color: #7A8B9A;
461 font-size: 13px;
462 font-weight: 400;
463 line-height: 1.45;
464 }
465 .wpfnl .wpfnl-pro-note {
466 width: 100%;
467 margin: 10px 0 0;
468 padding: 8px 12px;
469 display: flex;
470 align-items: center;
471 justify-content: space-between;
472 gap: 10px;
473 border: 1px solid #d3c5f2;
474 border-radius: 6px;
475 background: #f2eefc;
476 color: #48494e;
477 font-size: 13px;
478 font-weight: 400;
479 line-height: 1.4;
480 }
481 .wpfnl .wpfnl-pro-note .wpfnl-pro-note__link {
482 display: inline-flex;
483 align-items: center;
484 gap: 5px;
485 flex-shrink: 0;
486 color: #6E42D3;
487 font-weight: 600;
488 text-decoration: none;
489 box-shadow: none;
490 }
491 .wpfnl .wpfnl-pro-note .wpfnl-pro-note__link:hover, .wpfnl .wpfnl-pro-note .wpfnl-pro-note__link:focus {
492 color: #6E42D3;
493 text-decoration: underline;
494 box-shadow: none;
495 }
496
497 body.wpfunnels-body #wpcontent {
498 padding-left: 0;
499 }
500
501 .wpfnl-switcher {
502 position: relative;
503 }
504 .wpfnl-switcher input[type=checkbox] {
505 display: none;
506 }
507 .wpfnl-switcher label {
508 display: block;
509 position: relative;
510 cursor: pointer;
511 outline: none;
512 user-select: none;
513 width: 40px;
514 height: 22px;
515 border-radius: 50px;
516 background-color: #CDC9DB;
517 transition: all 0.3s ease;
518 }
519 .wpfnl-switcher label:after {
520 content: "";
521 width: 16px;
522 height: 16px;
523 filter: drop-shadow(0px 2px 2px rgba(193, 193, 218, 0.45));
524 background-color: #ffffff;
525 border-radius: 100%;
526 position: absolute;
527 top: 3px;
528 left: 3px;
529 transition: all 0.3s ease;
530 }
531 .wpfnl-switcher input[type=checkbox]:checked + label {
532 border-color: #6E42D3;
533 background-color: #6E42D3;
534 }
535 .wpfnl-switcher input[type=checkbox]:checked + label:after {
536 margin-left: 18px;
537 filter: none;
538 }
539
540 .wpfnl-switcher.sm label {
541 width: 28px;
542 height: 16px;
543 }
544
545 .wpfnl-switcher.sm label:after {
546 width: 10px;
547 height: 10px;
548 top: 3px;
549 left: 3px;
550 }
551
552 .wpfnl-switcher.sm input[type=checkbox]:checked + label:after {
553 margin-left: 12px;
554 }
555
556 .wpfnl-switcher.extra-sm label {
557 width: 28px;
558 height: 16px;
559 border: none;
560 background-color: #BEC8D0;
561 }
562
563 .wpfnl-switcher.extra-sm label:after {
564 width: 10px;
565 height: 10px;
566 top: 3px;
567 left: 3px;
568 }
569
570 .wpfnl-switcher.extra-sm input[type=checkbox]:checked + label:after {
571 margin-left: 12px;
572 }
573
574 .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 {
575 width: 26px;
576 height: 16px;
577 border: none;
578 background: #BEC8D0;
579 }
580 .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 {
581 width: 14px;
582 height: 14px;
583 top: 1px;
584 left: 1px;
585 }
586 .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 {
587 background: #6E42D3;
588 }
589 .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 {
590 margin-left: 10px;
591 }
592
593 .wpfnl-checkbox input[type=checkbox] {
594 display: none;
595 }
596 .wpfnl-checkbox.no-title label {
597 height: 14px;
598 }
599 .wpfnl-checkbox label {
600 font-size: 12px;
601 line-height: 14px;
602 font-weight: 400;
603 color: #7A8B9A;
604 position: relative;
605 padding-left: 29px;
606 display: inline-block;
607 text-transform: capitalize;
608 cursor: pointer;
609 }
610 .wpfnl-checkbox label:before {
611 content: "";
612 position: absolute;
613 left: 0;
614 top: -3px;
615 width: 18px;
616 height: 18px;
617 border-radius: 4px;
618 border: 1px solid #bdc7eb;
619 background-color: #f6f6f8;
620 transition: all 0.3s ease;
621 }
622 .wpfnl-checkbox label:after {
623 content: "";
624 position: absolute;
625 left: 5px;
626 top: 3px;
627 width: 9px;
628 height: 4px;
629 transform: rotate(-45deg);
630 border-bottom: 2px solid #fff;
631 border-left: 2px solid #fff;
632 transition: all 0.3s ease;
633 opacity: 0;
634 visibility: hidden;
635 }
636 .wpfnl-checkbox input[type=checkbox]:checked + label::before {
637 background-color: #6E42D3;
638 border-color: #6E42D3;
639 }
640 .wpfnl-checkbox input[type=checkbox]:checked + label::after {
641 opacity: 1;
642 visibility: visible;
643 }
644
645 .wpfnl-radiobtn input[type=radio] {
646 display: none;
647 }
648 .wpfnl-radiobtn.no-title label {
649 height: 16px;
650 }
651 .wpfnl-radiobtn label {
652 font-size: 12px;
653 line-height: 14px;
654 font-weight: 400;
655 color: #7A8B9A;
656 position: relative;
657 padding-left: 29px;
658 display: inline-block;
659 text-transform: capitalize;
660 cursor: pointer;
661 }
662 .wpfnl-radiobtn label::before {
663 content: "";
664 position: absolute;
665 left: 0;
666 top: -3px;
667 width: 18px;
668 height: 18px;
669 border-radius: 100%;
670 background: #F7F7FA;
671 border: 1px solid #bdc7eb;
672 transition: all 0.3s ease;
673 }
674 .wpfnl-radiobtn label::after {
675 content: "";
676 position: absolute;
677 left: 4px;
678 top: 1px;
679 width: 10px;
680 height: 10px;
681 border-radius: 100%;
682 background: #6E42D3;
683 transform: scale(0);
684 transition: all 0.3s ease;
685 }
686 .wpfnl-radiobtn input[type=radio]:checked + label::before {
687 border-color: #6E42D3;
688 }
689 .wpfnl-radiobtn input[type=radio]:checked + label::after {
690 transform: scale(1);
691 }
692
693 .wpfnl-tooltip {
694 display: inline-block;
695 position: relative;
696 padding: 0px 3px 2px;
697 height: 15px;
698 }
699 .wpfnl-tooltip p {
700 position: absolute;
701 bottom: 24px;
702 left: 50%;
703 transform: translateX(-50%);
704 background: #525252;
705 color: #fff;
706 padding: 7px 10px;
707 border-radius: 3px;
708 font-size: 13px;
709 line-height: 1.4;
710 min-width: 240px;
711 text-align: center;
712 opacity: 0;
713 visibility: hidden;
714 transition: all 0.3s ease;
715 margin: 0;
716 }
717 .wpfnl-tooltip p:before {
718 content: "";
719 position: absolute;
720 left: 50%;
721 bottom: -4px;
722 width: 10px;
723 height: 10px;
724 background: #525252;
725 margin-left: -5px;
726 transform: rotate(45deg);
727 }
728 .wpfnl-tooltip:hover p {
729 opacity: 1;
730 visibility: visible;
731 }
732
733 .wpfnl-pagination {
734 display: flex;
735 align-items: center;
736 justify-content: center;
737 }
738 .wpfnl-pagination .nav-link {
739 width: 30px;
740 height: 30px;
741 border-radius: 6px;
742 background-color: transparent;
743 font-size: 16px;
744 color: #363b4e;
745 font-weight: 400;
746 display: flex;
747 flex-flow: column;
748 align-items: center;
749 justify-content: center;
750 margin: 0 6px;
751 }
752 .wpfnl-pagination .nav-link.active, .wpfnl-pagination .nav-link:hover {
753 background-color: #6E42D3;
754 color: #fff;
755 box-shadow: 0px 10px 16px rgba(97, 103, 116, 0.15);
756 }
757 .wpfnl-pagination .nav-link.next, .wpfnl-pagination .nav-link.prev {
758 background-color: #ffffff;
759 }
760 .wpfnl-pagination .nav-link.next:hover, .wpfnl-pagination .nav-link.prev:hover {
761 background-color: #6E42D3;
762 }
763 .wpfnl-pagination .nav-link.next:hover svg path, .wpfnl-pagination .nav-link.prev:hover svg path {
764 fill: #fff;
765 }
766
767 .wpfnl-loader {
768 border: 2px solid #8265c5;
769 border-radius: 50%;
770 border-top: 2px solid #fff;
771 width: 13px;
772 height: 13px;
773 animation: spin 0.7s linear infinite;
774 display: none;
775 margin-left: 4px;
776 }
777
778 @-webkit-keyframes spin {
779 0% {
780 -webkit-transform: rotate(0deg);
781 }
782 100% {
783 -webkit-transform: rotate(360deg);
784 }
785 }
786 @keyframes spin {
787 0% {
788 transform: rotate(0deg);
789 }
790 100% {
791 transform: rotate(360deg);
792 }
793 }
794 .select2-container.select2-container--default.select2-container--open {
795 background: #ffffff;
796 border-radius: 10px;
797 width: 248px;
798 border: 1px solid #E5E8F3;
799 z-index: 99;
800 }
801 .select2-container.select2-container--default.select2-container--open .select2-search--dropdown {
802 display: block;
803 width: 100%;
804 padding: 10px;
805 box-sizing: border-box;
806 }
807 .select2-container.select2-container--default.select2-container--open .select2-search__field {
808 width: 100%;
809 background: #fff;
810 border: 1px solid #E5E8F3;
811 padding: 0 8px;
812 }
813 .select2-container.select2-container--default.select2-container--open .select2-search__field:focus {
814 border-color: #E5E8F3;
815 box-shadow: none;
816 outline: none;
817 }
818 .select2-container.select2-container--default.select2-container--open .select2-dropdown {
819 background-color: transparent;
820 border: none;
821 border-radius: unset;
822 box-sizing: border-box;
823 display: block;
824 position: relative;
825 width: 100% !important;
826 }
827 .select2-container.select2-container--default.select2-container--open .select2-results__message {
828 margin-bottom: 0;
829 }
830 .select2-container.select2-container--default.select2-container--open .select2-results__option {
831 border-top: 1px solid #E5E8F3;
832 padding: 10px 15px;
833 margin: 0;
834 cursor: pointer;
835 }
836 .select2-container.select2-container--default.select2-container--open .select2-results__option--highlighted {
837 background: #eee;
838 color: #3c434a;
839 }
840 .select2-container.select2-container--default.select2-container--open .select2-results__options {
841 margin: 0;
842 max-height: 210px;
843 overflow: auto;
844 }
845 .select2-container.select2-container--default.select2-container--open .select2-results__options::-webkit-scrollbar {
846 width: 3px;
847 }
848 .select2-container.select2-container--default.select2-container--open .select2-results__options::-webkit-scrollbar-track {
849 background: #f2f5f8;
850 }
851 .select2-container.select2-container--default.select2-container--open .select2-results__options::-webkit-scrollbar-thumb {
852 background-color: #6E42D3;
853 border-radius: 20px;
854 }
855
856 .select2-container--default .select2-selection--single .select2-selection__clear {
857 float: none !important;
858 cursor: pointer;
859 margin-right: 3px;
860 }
861
862 .wpfnl .wpfnl-alert {
863 color: #383d41;
864 font-size: 13px;
865 font-weight: 500;
866 border-radius: 10px;
867 cursor: default;
868 display: none;
869 }
870 .wpfnl .wpfnl-alert.box {
871 background-color: #e2e3e5;
872 padding: 8px 20px;
873 border: 1px solid #d6d8db;
874 }
875 .wpfnl .wpfnl-alert.wpfnl-success {
876 color: #269c41;
877 }
878 .wpfnl .wpfnl-alert.wpfnl-success.box {
879 background-color: #d4edda;
880 border-color: #c3e6cb;
881 }
882 .wpfnl .wpfnl-alert.wpfnl-error {
883 color: #d63342;
884 }
885 .wpfnl .wpfnl-alert.wpfnl-error.box {
886 background-color: #f8d7da;
887 border-color: #f5c6cb;
888 }
889 .wpfnl .wpfnl-alert.wpfnl-warn {
890 color: #856404;
891 }
892 .wpfnl .wpfnl-alert.wpfnl-warn.box {
893 background-color: #fff3cd;
894 border-color: #ffeeba;
895 }
896
897 .wpfnl-hamburger {
898 display: block;
899 width: 20px;
900 height: 14px;
901 border-top: 2px solid #6E42D3;
902 border-bottom: 2px solid #6E42D3;
903 position: relative;
904 cursor: pointer;
905 }
906 .wpfnl-hamburger:before {
907 content: "";
908 position: absolute;
909 top: 50%;
910 left: 0;
911 width: 100%;
912 height: 2px;
913 background: #6E42D3;
914 margin-top: -1px;
915 }
916
917 ul.wpfnl-dropdown {
918 display: flex;
919 flex-flow: column;
920 gap: 2px;
921 position: absolute;
922 background: #fff;
923 right: 0;
924 top: 37px;
925 width: 220px;
926 border-radius: 10px;
927 border: 1px solid #EBEDF0;
928 box-shadow: 0 6px 8px 0 rgba(191, 191, 191, 0.1);
929 z-index: 5;
930 padding: 9px;
931 opacity: 0;
932 visibility: hidden;
933 transition: all 0.3s ease;
934 }
935 ul.wpfnl-dropdown:after {
936 content: "";
937 position: absolute;
938 right: 21px;
939 top: -6px;
940 width: 10px;
941 height: 10px;
942 background: white;
943 transform: rotate(45deg);
944 z-index: 0;
945 border-top: 1px solid #E5E8F3;
946 border-left: 1px solid #E5E8F3;
947 }
948 ul.wpfnl-dropdown li a {
949 font-size: 14px;
950 line-height: 15px;
951 color: #7A8B9A;
952 font-weight: 400;
953 margin: 0;
954 padding: 7px 9px;
955 display: flex;
956 flex-flow: row;
957 align-items: center;
958 position: relative;
959 z-index: 1;
960 border-radius: 10px;
961 }
962 ul.wpfnl-dropdown li a svg {
963 margin-right: 6px;
964 width: 19px;
965 height: 19px;
966 }
967 ul.wpfnl-dropdown li a:hover {
968 background: #F6F8FA;
969 color: #7A8B9A;
970 }
971
972 .wpfnl-delete-alert-wrapper {
973 position: fixed;
974 top: 0;
975 right: 0;
976 padding: 15px;
977 width: calc(100% - 160px);
978 height: 100%;
979 background: rgba(21, 17, 29, 0.3);
980 backdrop-filter: blur(4px);
981 z-index: 999;
982 display: none;
983 flex-flow: row wrap;
984 align-items: center;
985 justify-content: center;
986 }
987 .wpfnl-delete-alert-wrapper.show-alert {
988 display: flex;
989 }
990 .wpfnl-delete-alert-wrapper.hide-alert {
991 display: none;
992 }
993 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirmation {
994 background: #fff;
995 box-shadow: 0 1px 34px rgba(0, 0, 0, 0.06);
996 border-radius: 10px;
997 padding: 30px 20px;
998 width: 100%;
999 max-width: 420px;
1000 text-align: center;
1001 animation: wpfnl-bounce 0.3s;
1002 }
1003 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirmation h3 {
1004 font-size: 16px;
1005 font-weight: 500;
1006 }
1007 .wpfnl-delete-alert-wrapper .icon {
1008 width: 50px;
1009 height: 50px;
1010 border: 2px solid #e65555;
1011 display: flex;
1012 align-items: center;
1013 justify-content: center;
1014 margin: 0 auto 20px;
1015 border-radius: 100%;
1016 }
1017 .wpfnl-delete-alert-wrapper .icon svg {
1018 width: 18px;
1019 height: 18px;
1020 }
1021 .wpfnl-delete-alert-wrapper .icon svg path {
1022 stroke: #e65555;
1023 }
1024 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn {
1025 display: flex;
1026 flex-flow: row;
1027 align-items: center;
1028 justify-content: center;
1029 margin-top: 30px;
1030 }
1031 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn li {
1032 margin: 0 10px;
1033 }
1034 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default {
1035 height: 41px;
1036 line-height: 42px;
1037 padding: 0 20px;
1038 min-width: 110px;
1039 border-radius: 5px;
1040 }
1041 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.yes {
1042 background-color: #e65555;
1043 }
1044 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.yes:hover {
1045 background-color: #de6464;
1046 }
1047 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.cancel {
1048 background-color: #eee;
1049 color: #333;
1050 }
1051 .wpfnl-delete-alert-wrapper .wpfnl-delete-confirm-btn .btn-default.cancel:hover {
1052 background-color: #e2e2e2;
1053 }
1054
1055 .delete-alert-new-ui .wpfnl-delete-confirmation {
1056 position: relative;
1057 max-width: 514px;
1058 background: #F6F5FA;
1059 border-radius: 14px;
1060 padding: 0;
1061 text-align: left;
1062 }
1063 .delete-alert-new-ui .icon {
1064 width: 46px;
1065 height: 46px;
1066 border: none;
1067 margin: 0;
1068 border-radius: 100%;
1069 box-shadow: 0px 1px 1px #DADADA;
1070 background: #fff;
1071 position: absolute;
1072 right: -12px;
1073 top: -12px;
1074 cursor: pointer;
1075 }
1076 .delete-alert-new-ui .icon svg path {
1077 stroke: #A7A8B3;
1078 }
1079 .delete-alert-new-ui .wpfnl-delete-confirm-body {
1080 padding: 26px 20px 26px 26px;
1081 }
1082 .delete-alert-new-ui .wpfnl-delete-confirm-body h3 {
1083 font-weight: 500;
1084 font-size: 18px;
1085 line-height: 1.2;
1086 color: #2D3149;
1087 display: flex;
1088 align-items: center;
1089 gap: 7px;
1090 }
1091 .delete-alert-new-ui .wpfnl-delete-confirm-body h3 svg {
1092 position: relative;
1093 top: -2px;
1094 }
1095 .delete-alert-new-ui .wpfnl-delete-confirm-body h3 svg path {
1096 fill: #EC5956;
1097 }
1098 .delete-alert-new-ui .wpfnl-delete-confirm-body p {
1099 color: #9398A5;
1100 margin-top: 4px;
1101 }
1102 .delete-alert-new-ui .wpfnl-delete-confirm-btn {
1103 justify-content: flex-end;
1104 margin-top: 0;
1105 border-top: 1px solid #E2E2E2;
1106 padding: 20px 28px;
1107 gap: 14px;
1108 }
1109 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default {
1110 font-size: 15px;
1111 height: 40px;
1112 line-height: 41px;
1113 padding: 0 18px;
1114 min-width: auto;
1115 border-radius: 10px;
1116 }
1117 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default.cancel {
1118 background-color: transparent;
1119 color: #2D3149;
1120 border: 1px solid #E4E6EB;
1121 }
1122 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default.yes {
1123 background-color: #6E42D3;
1124 }
1125 .delete-alert-new-ui .wpfnl-delete-confirm-btn .btn-default.yes:hover {
1126 background-color: #4C25A5;
1127 }
1128
1129 .folded .wpfnl-delete-alert-wrapper {
1130 width: calc(100% - 36px);
1131 }
1132
1133 @keyframes wpfnl-bounce {
1134 0% {
1135 transform: scale(0.7);
1136 }
1137 45% {
1138 transform: scale(1.05);
1139 }
1140 80% {
1141 transform: scale(0.95);
1142 }
1143 100% {
1144 transform: scale(1);
1145 }
1146 }
1147 .funnel-loader {
1148 position: relative;
1149 width: 100px;
1150 height: 100px;
1151 margin: 0 auto;
1152 transform-style: preserve-3d;
1153 transform: perspective(500px) rotateX(60deg);
1154 }
1155 .funnel-loader span {
1156 position: absolute;
1157 display: block;
1158 border: 4px solid #6E42D3;
1159 box-sizing: border-box;
1160 border-radius: 100%;
1161 box-shadow: 0 5px 0 #6E42D3, inset 0 5px 0 #6E42D3;
1162 animation: funnel-animate 2s ease-in-out infinite;
1163 }
1164 .funnel-loader span:nth-child(1) {
1165 top: 0;
1166 left: 0;
1167 bottom: 0;
1168 right: 0;
1169 animation-delay: 0.6s;
1170 }
1171 .funnel-loader span:nth-child(2) {
1172 top: 10px;
1173 left: 10px;
1174 bottom: 10px;
1175 right: 10px;
1176 animation-delay: 0.5s;
1177 }
1178 .funnel-loader span:nth-child(3) {
1179 top: 20px;
1180 left: 20px;
1181 bottom: 20px;
1182 right: 20px;
1183 animation-delay: 0.4s;
1184 }
1185 .funnel-loader span:nth-child(4) {
1186 top: 30px;
1187 left: 30px;
1188 bottom: 30px;
1189 right: 30px;
1190 animation-delay: 0.3s;
1191 }
1192 .funnel-loader span:nth-child(5) {
1193 top: 40px;
1194 left: 40px;
1195 bottom: 40px;
1196 right: 40px;
1197 animation-delay: 0.2s;
1198 }
1199
1200 @keyframes funnel-animate {
1201 0% {
1202 transform: translateZ(-50px);
1203 }
1204 50% {
1205 transform: translateZ(50px);
1206 }
1207 100% {
1208 transform: translateZ(-50px);
1209 }
1210 }
1211 @media only screen and (max-width: 960px) {
1212 .wpfnl-delete-alert-wrapper {
1213 width: calc(100% - 35px);
1214 }
1215 }
1216 @media only screen and (max-width: 782px) {
1217 .wpfnl-delete-alert-wrapper {
1218 width: 100%;
1219 }
1220 }
1221 .dot-wrapper span {
1222 color: #fff;
1223 font-size: 16px;
1224 animation-duration: 1.5s;
1225 animation-iteration-count: infinite;
1226 }
1227 .dot-wrapper span.dot-one {
1228 animation-name: flashOne;
1229 margin-left: 2px;
1230 }
1231 .dot-wrapper span.dot-two {
1232 animation-name: flashTwo;
1233 }
1234 .dot-wrapper span.dot-three {
1235 animation-name: flashThree;
1236 }
1237
1238 @keyframes flashOne {
1239 0% {
1240 opacity: 0;
1241 }
1242 25% {
1243 opacity: 1;
1244 }
1245 50% {
1246 opacity: 1;
1247 }
1248 100% {
1249 opacity: 1;
1250 }
1251 }
1252 @keyframes flashTwo {
1253 0% {
1254 opacity: 0;
1255 }
1256 25% {
1257 opacity: 0;
1258 }
1259 50% {
1260 opacity: 1;
1261 }
1262 100% {
1263 opacity: 1;
1264 }
1265 }
1266 @keyframes flashThree {
1267 0% {
1268 opacity: 0;
1269 }
1270 50% {
1271 opacity: 0;
1272 }
1273 75% {
1274 opacity: 1;
1275 }
1276 100% {
1277 opacity: 1;
1278 }
1279 }
1280 .wpfnl .ui-widget-header .ui-icon {
1281 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggc3Ryb2tlPSIjN0E4QjlBIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMS42NyIgZD0iTTEyLjY2NSA4SDMuMzMybTAgMGw0LjY2NyA0LjY2N00zLjMzMiA4bDQuNjY3LTQuNjY3Ii8+PC9zdmc+);
1282 background-position: center;
1283 }
1284 .wpfnl .ui-widget-header .ui-datepicker-next .ui-icon {
1285 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggc3Ryb2tlPSIjN0E4QjlBIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMS42NyIgZD0iTTMuMzM1IDhoOS4zMzNtMCAwbC00LjY2NyA0LjY2N00xMi42NjggOEw4LjAwMSAzLjMzMyIvPjwvc3ZnPg==);
1286 }
1287 .wpfnl .ui-datepicker {
1288 width: 290px;
1289 z-index: 4 !important;
1290 }
1291 .wpfnl .ui-datepicker.ui-widget-content {
1292 border: none;
1293 box-shadow: none;
1294 }
1295 .wpfnl .ui-datepicker .ui-datepicker-header {
1296 background: transparent;
1297 border: none;
1298 padding: 0;
1299 margin-bottom: 4px;
1300 }
1301 .wpfnl .ui-datepicker .ui-datepicker-prev,
1302 .wpfnl .ui-datepicker .ui-datepicker-next {
1303 top: 4px;
1304 width: 24px;
1305 height: 24px;
1306 background: #ffffff !important;
1307 cursor: pointer;
1308 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.09);
1309 border-radius: 6px;
1310 border: 1px solid #F1F0F5;
1311 }
1312 .wpfnl .ui-datepicker .ui-datepicker-prev-hover,
1313 .wpfnl .ui-datepicker .ui-datepicker-next-hover {
1314 top: 4px;
1315 }
1316 .wpfnl .ui-datepicker .ui-datepicker-next {
1317 right: 4px;
1318 }
1319 .wpfnl .ui-datepicker .ui-datepicker-next-hover {
1320 right: 4px;
1321 }
1322 .wpfnl .ui-datepicker .ui-datepicker-prev {
1323 left: 4px;
1324 }
1325 .wpfnl .ui-datepicker .ui-datepicker-prev-hover {
1326 left: 4px;
1327 }
1328 .wpfnl .ui-datepicker .ui-datepicker-title select {
1329 line-height: 1.1;
1330 margin: 1px 2px;
1331 border: none;
1332 box-shadow: none;
1333 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.09);
1334 }
1335 .wpfnl .ui-datepicker table {
1336 margin: 0;
1337 }
1338 .wpfnl .ui-datepicker td span,
1339 .wpfnl .ui-datepicker td a {
1340 display: block;
1341 padding: 9px 7px 7px;
1342 height: 32.5px;
1343 width: 32.5px;
1344 text-align: center;
1345 text-decoration: none;
1346 border-radius: 50%;
1347 outline: none;
1348 margin: 0;
1349 color: #2D3149;
1350 font-size: 12px;
1351 font-weight: 500 !important;
1352 }
1353 .wpfnl .ui-datepicker .ui-state-default,
1354 .wpfnl .ui-datepicker .ui-widget-content .ui-state-default,
1355 .wpfnl .ui-datepicker .ui-widget-header .ui-state-default {
1356 border: none !important;
1357 background: transparent;
1358 font-weight: normal;
1359 color: #2D3149;
1360 position: relative;
1361 z-index: 1;
1362 }
1363 .wpfnl .ui-datepicker .ui-state-default:hover,
1364 .wpfnl .ui-datepicker .ui-state-hover,
1365 .wpfnl .ui-datepicker .ui-widget-content .ui-state-hover,
1366 .wpfnl .ui-datepicker .ui-state-active,
1367 .wpfnl .ui-datepicker .ui-widget-content .ui-state-highlight {
1368 background: #6E42D3;
1369 color: #fff;
1370 }
1371 .wpfnl .ui-datepicker .ui-priority-secondary,
1372 .wpfnl .ui-datepicker .ui-widget-content .ui-priority-secondary {
1373 opacity: 1;
1374 color: #9b9b9b !important;
1375 }
1376 .wpfnl .ui-datepicker .ui-state-disabled span {
1377 cursor: not-allowed;
1378 }
1379 .wpfnl .ui-datepicker .in-range {
1380 position: relative;
1381 }
1382 .wpfnl .ui-datepicker .in-range:before {
1383 content: "";
1384 position: absolute;
1385 top: 50%;
1386 transform: translateY(-50%);
1387 left: 0;
1388 z-index: 1;
1389 background: rgba(110, 66, 211, 0.12);
1390 height: 28px;
1391 width: 100%;
1392 }
1393 .wpfnl .ui-datepicker .in-range[title=Start]:before {
1394 border-radius: 50px 0 0 50px;
1395 opacity: 0;
1396 }
1397 .wpfnl .ui-datepicker .in-range[title=End]:before {
1398 border-radius: 0 50px 50px 0;
1399 }
1400 .wpfnl .ui-datepicker .in-range[title=Start] > a, .wpfnl .ui-datepicker .in-range[title=End] > a {
1401 background: #6E42D3 !important;
1402 color: #fff !important;
1403 border-radius: 50%;
1404 }
1405 .wpfnl .ui-datepicker .in-range:last-child:before {
1406 border-radius: 0 50px 50px 0;
1407 }
1408 .wpfnl .ui-datepicker .in-range:first-child:before {
1409 border-radius: 50px 0 0 50px;
1410 }
1411 .wpfnl .ui-datepicker .in-range[title=Start] + .in-range:before {
1412 left: -9px;
1413 width: calc(100% + 9px);
1414 }
1415 .wpfnl .ui-datepicker .in-range[title=End]:first-child:before {
1416 opacity: 0;
1417 }
1418
1419 .wpfnl-custom-selectbox {
1420 position: relative;
1421 }
1422 .wpfnl-custom-selectbox .selectbox-selected-value {
1423 position: relative;
1424 width: 100%;
1425 border: 1px solid #ebedf0;
1426 border-radius: 6px;
1427 padding: 13px 33px 13px 12px;
1428 background-color: transparent;
1429 text-align: left;
1430 font-weight: 400;
1431 font-size: 14px;
1432 line-height: 1.21;
1433 color: #6a707c;
1434 cursor: pointer;
1435 }
1436 .wpfnl-custom-selectbox .selectbox-selected-value:before {
1437 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);
1438 width: 12px;
1439 display: block;
1440 position: absolute;
1441 right: 15px;
1442 top: 50%;
1443 margin-top: -9px;
1444 transition: all 0.3s ease;
1445 }
1446 .wpfnl-custom-selectbox .selectbox-options {
1447 width: 100%;
1448 max-width: 300px;
1449 position: absolute;
1450 background: #fff;
1451 right: 0;
1452 top: calc(100% + 8px);
1453 border: 1px solid #E5E8F3;
1454 z-index: 5;
1455 transition: all 0.3s ease;
1456 box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.06);
1457 border-radius: 6px;
1458 padding: 8px;
1459 opacity: 0;
1460 visibility: hidden;
1461 }
1462 .wpfnl-custom-selectbox.show-options .selectbox-options {
1463 opacity: 1;
1464 visibility: visible;
1465 }
1466 .wpfnl-custom-selectbox.show-options .selectbox-selected-value:before {
1467 transform: rotate(-180deg);
1468 }
1469 .wpfnl-custom-selectbox .selectbox-search {
1470 padding: 8px 8px 14px;
1471 }
1472 .wpfnl-custom-selectbox .selectbox-search .search-icon {
1473 position: absolute;
1474 top: 24px;
1475 left: 25px;
1476 }
1477 .wpfnl-custom-selectbox .selectbox-search input[type=search] {
1478 font-weight: 400;
1479 height: 34px;
1480 padding: 6px 15px 4px 36px;
1481 }
1482 .wpfnl-custom-selectbox .list-title {
1483 font-weight: 500;
1484 font-size: 12px;
1485 line-height: 15px;
1486 letter-spacing: 1px;
1487 text-transform: uppercase;
1488 color: #667085;
1489 border-top: 1px solid #ebedf0;
1490 border-bottom: 1px solid #ebedf0;
1491 border-radius: 0;
1492 background: #f9fafb;
1493 position: relative;
1494 padding: 8px 18px;
1495 left: -8px;
1496 width: calc(100% + 16px);
1497 cursor: text;
1498 margin-bottom: 10px;
1499 }
1500 .wpfnl-custom-selectbox .options-tag,
1501 .wpfnl-custom-selectbox .options-list {
1502 max-height: 200px;
1503 overflow: auto;
1504 }
1505 .wpfnl-custom-selectbox .options-tag::-webkit-scrollbar,
1506 .wpfnl-custom-selectbox .options-list::-webkit-scrollbar {
1507 width: 5px;
1508 }
1509 .wpfnl-custom-selectbox .options-tag::-webkit-scrollbar-track,
1510 .wpfnl-custom-selectbox .options-list::-webkit-scrollbar-track {
1511 background: #f2f5f8;
1512 }
1513 .wpfnl-custom-selectbox .options-tag::-webkit-scrollbar-thumb,
1514 .wpfnl-custom-selectbox .options-list::-webkit-scrollbar-thumb {
1515 background-color: #c1c1c1;
1516 border-radius: 20px;
1517 }
1518 .wpfnl-custom-selectbox .single-option {
1519 display: block;
1520 padding: 8px 10px;
1521 border-radius: 6px;
1522 transition: all 0.3s ease;
1523 }
1524 .wpfnl-custom-selectbox .single-option:hover {
1525 background: #f6f8fa;
1526 }
1527 .wpfnl-custom-selectbox .single-option label {
1528 line-height: 1.3;
1529 display: block;
1530 }
1531
1532 .wpfnl-selectbox {
1533 max-width: 270px;
1534 width: 100%;
1535 border-radius: 6px;
1536 border: 1px solid #EEF0F3;
1537 background: #FFF;
1538 position: relative;
1539 cursor: pointer;
1540 }
1541 .wpfnl-selectbox .selected-option {
1542 color: #363B4E;
1543 font-size: 14px;
1544 line-height: 1;
1545 letter-spacing: -0.14px;
1546 padding: 13px 30px 11px 14px;
1547 }
1548 .wpfnl-selectbox .selected-option:before {
1549 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==");
1550 width: 10px;
1551 position: absolute;
1552 right: 14px;
1553 top: 50%;
1554 line-height: 1;
1555 transform: translateY(-50%);
1556 }
1557 .wpfnl-selectbox .selectable-options {
1558 width: 100%;
1559 list-style-type: none;
1560 padding: 8px;
1561 font-size: 16px;
1562 position: absolute;
1563 left: 0;
1564 top: calc(100% + 8px);
1565 z-index: 1;
1566 border-radius: 6px;
1567 border: 1px solid #EBEDF0;
1568 background: #FFF;
1569 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
1570 max-height: 230px;
1571 overflow-y: auto;
1572 opacity: 0;
1573 visibility: hidden;
1574 transition: all 0.3s ease;
1575 }
1576 .wpfnl-selectbox .selectable-options::-webkit-scrollbar {
1577 width: 3px;
1578 height: 3px;
1579 }
1580 .wpfnl-selectbox .selectable-options::-webkit-scrollbar-track {
1581 background: #f2f5f8;
1582 }
1583 .wpfnl-selectbox .selectable-options::-webkit-scrollbar-thumb {
1584 background-color: #CBCBCB;
1585 border-radius: 20px;
1586 }
1587 .wpfnl-selectbox .selectable-options li {
1588 padding: 11px 12px 9px;
1589 color: #363B4E;
1590 font-size: 14px;
1591 font-weight: 400;
1592 line-height: 1;
1593 letter-spacing: -0.14px;
1594 border-radius: 6px;
1595 }
1596 .wpfnl-selectbox .selectable-options li:hover {
1597 background: #F6F5FA;
1598 }
1599 .wpfnl-selectbox .selectable-options li.selected {
1600 background: #F6F5FA;
1601 font-weight: 500;
1602 }
1603 .wpfnl-selectbox.show-options .add-step-dropdown,
1604 .wpfnl-selectbox.show-options .selectable-options {
1605 opacity: 1;
1606 visibility: visible;
1607 }
1608
1609 .wpfnl-toast-alert {
1610 position: fixed;
1611 top: 150px;
1612 right: 20px;
1613 z-index: 9999;
1614 max-width: 360px;
1615 min-width: 250px;
1616 -webkit-animation: fadeinout 3s ease-in-out forwards;
1617 animation: fadeinout 3s ease-in-out forwards;
1618 }
1619 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box {
1620 background: #ffffff;
1621 border: 1px solid #039855;
1622 box-shadow: 0px 7px 30px rgba(16, 5, 46, 0.08);
1623 border-radius: 10px;
1624 display: flex;
1625 flex-flow: row wrap;
1626 align-items: center;
1627 padding: 15px;
1628 gap: 10px;
1629 }
1630 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .alert-text {
1631 width: calc(100% - 34px);
1632 position: relative;
1633 padding-left: 25px;
1634 }
1635 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .alert-text::before {
1636 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzAzOTg1NSIgZD0iTTkgMThBOSA5IDAgMTA5IDBhOSA5IDAgMDAwIDE4eiIvPjxwYXRoIGZpbGw9IiNmZmYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgZD0iTTYuMTkgMTMuMzlMMi44OTggOS44NjdhMS4yMDMgMS4yMDMgMCAwMS4wNTctMS42OTYgMS4yMDMgMS4yMDMgMCAwMTEuNjk3LjA1N2wyLjUzOSAyLjcxNyA0LjAxOC0zLjc1NGMuMDM3LS4wMzQuMDc0LS4wNjUuMTEzLS4wOTRsMS44OS0xLjc2NWExLjIwMyAxLjIwMyAwIDAxMS42OTYuMDU3IDEuMjAzIDEuMjAzIDAgMDEtLjA1NyAxLjY5NmwtNS43NzMgNS4zOTMtLjAwNi0uMDA2LTEuOTk2IDEuODY2LS44ODYtLjk0OHoiIGNsaXAtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==");
1637 position: absolute;
1638 left: 0;
1639 top: 0;
1640 height: 18px;
1641 width: 18px;
1642 display: block;
1643 }
1644 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .cross-icon {
1645 width: 24px;
1646 height: 24px;
1647 background: #ffffff;
1648 border: 1px solid #e4e6eb;
1649 border-radius: 6px;
1650 display: flex;
1651 justify-content: center;
1652 align-items: center;
1653 cursor: pointer;
1654 }
1655 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .cross-icon svg path {
1656 fill: #686f7f;
1657 }
1658 .wpfnl-toast-alert .wpfnl-toast-alert-wrapper .toast-alert-box .cross-icon:hover {
1659 background: #e4e6eb;
1660 }
1661
1662 @-webkit-keyframes fadeinout {
1663 0% {
1664 opacity: 0;
1665 top: 150px;
1666 }
1667 80%, 20% {
1668 opacity: 1;
1669 top: 125px;
1670 }
1671 100% {
1672 opacity: 0;
1673 top: 80px;
1674 }
1675 }
1676 @keyframes fadeinout {
1677 0% {
1678 opacity: 0;
1679 top: 150px;
1680 }
1681 80%, 20% {
1682 opacity: 1;
1683 top: 125px;
1684 }
1685 100% {
1686 opacity: 0;
1687 top: 80px;
1688 }
1689 }
1690 .wpfnl-modal .wpfnl-modal__header {
1691 display: flex;
1692 flex-flow: row wrap;
1693 align-items: center;
1694 justify-content: space-between;
1695 padding: 12px 15px;
1696 border-radius: 15px 15px 0 0;
1697 box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
1698 position: relative;
1699 }
1700 .wpfnl-modal .wpfnl-modal__header .title h2 {
1701 font-weight: 500;
1702 font-size: 16px;
1703 line-height: 1.3;
1704 color: #363B4E;
1705 }
1706 .wpfnl-modal .wpfnl-modal__header .wpfnl-modal-close {
1707 height: 28px;
1708 width: 28px;
1709 background: #F6F6F8;
1710 border: 1px solid #E5E8F3;
1711 display: flex;
1712 flex-flow: column;
1713 align-items: center;
1714 justify-content: center;
1715 border-radius: 100%;
1716 cursor: pointer;
1717 }
1718 .wpfnl-modal .wpfnl-modal__header .wpfnl-modal-close svg path {
1719 stroke: #6E42D3;
1720 }
1721 .wpfnl-modal .wpfnl-modal__body {
1722 background: #F2F5F8;
1723 padding: 23px 25px 0px;
1724 overflow: auto;
1725 height: calc(100% - 52px);
1726 }
1727 .wpfnl-modal .wpfnl-modal__body::-webkit-scrollbar {
1728 width: 5px;
1729 }
1730 .wpfnl-modal .wpfnl-modal__body::-webkit-scrollbar-track {
1731 background: #f2f5f8;
1732 }
1733 .wpfnl-modal .wpfnl-modal__body::-webkit-scrollbar-thumb {
1734 background-color: #6E42D3;
1735 border-radius: 20px;
1736 }
1737 .wpfnl-modal .wpfnl-modal__body .choose-step-type label {
1738 font-weight: 500;
1739 font-size: 13px;
1740 line-height: 15px;
1741 color: #363B4E;
1742 margin-bottom: 9px;
1743 display: inline-block;
1744 }
1745 .wpfnl-modal .wpfnl-modal__body .choose-step-type select {
1746 height: 36px;
1747 border-radius: 5px;
1748 padding: 4px 15px;
1749 max-width: 100%;
1750 }
1751 .wpfnl-modal .wpfnl-modal__body .choose-step-type select:focus {
1752 border-color: #6E42D3;
1753 }
1754 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav {
1755 margin-bottom: 30px;
1756 margin-left: 5px;
1757 border-bottom: 1px solid #E1E1EB;
1758 }
1759 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li {
1760 padding: 5px 0 10px;
1761 cursor: pointer;
1762 margin-right: 22px;
1763 text-transform: capitalize;
1764 font-weight: 500;
1765 font-size: 14px;
1766 line-height: 16px;
1767 color: #7A8B9A;
1768 position: relative;
1769 }
1770 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li:before {
1771 content: "";
1772 position: absolute;
1773 left: 0;
1774 bottom: -1px;
1775 width: 100%;
1776 height: 2px;
1777 background: #6E42D3;
1778 opacity: 0;
1779 visibility: hidden;
1780 transition: all 0.3s ease;
1781 }
1782 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li:hover, .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.active {
1783 color: #6E42D3;
1784 }
1785 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.active:before {
1786 opacity: 1;
1787 visibility: visible;
1788 }
1789 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li .pro-tag {
1790 position: absolute;
1791 top: -9px;
1792 right: -10px;
1793 font-size: 10px;
1794 padding: 0 4px;
1795 }
1796 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.disabled {
1797 font-weight: 400;
1798 color: rgba(122, 139, 154, 0.5);
1799 }
1800 .wpfnl-modal .wpfnl-modal__body .wpfnl-create-step__filter-nav > li.disabled:hover {
1801 color: rgba(122, 139, 154, 0.5);
1802 }
1803 .wpfnl-modal .wpfnl-modal__footer {
1804 padding: 15px 20px;
1805 border-top: 1px solid #E5E8F3;
1806 }
1807 .wpfnl-modal .wpfnl-modal__footer .step-save-btn {
1808 display: flex;
1809 flex-flow: row;
1810 align-items: center;
1811 justify-content: flex-end;
1812 }
1813 .wpfnl-modal .wpfnl-modal__footer .step-save-btn .wpfnl-alert {
1814 margin-right: 10px;
1815 }
1816 .wpfnl-modal .wpfnl-modal__footer .step-save-btn a.btn-default {
1817 background: transparent;
1818 border: 1px solid #E5E8F3;
1819 color: #363B4E;
1820 width: 110px;
1821 padding: 0 20px;
1822 margin-right: 10px;
1823 }
1824 .wpfnl-modal .wpfnl-modal__footer .step-save-btn a.btn-default:hover {
1825 background: rgba(0, 0, 0, 0.04);
1826 }
1827 .wpfnl-modal .wpfnl-modal__footer .step-save-btn button {
1828 width: 110px;
1829 padding: 0 20px;
1830 border: 1px solid transparent;
1831 display: flex;
1832 flex-flow: row;
1833 align-items: center;
1834 justify-content: center;
1835 }
1836
1837 .wpfnl-dashboard__nav {
1838 background: #fff;
1839 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
1840 position: relative;
1841 display: flex;
1842 flex-flow: row wrap;
1843 align-items: center;
1844 justify-content: space-between;
1845 gap: 10px;
1846 padding: 0 24px;
1847 }
1848 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-ul {
1849 display: flex;
1850 align-items: center;
1851 gap: 24px;
1852 }
1853 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li {
1854 display: block;
1855 position: relative;
1856 }
1857 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li:last-child {
1858 margin-bottom: 0;
1859 }
1860 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li a {
1861 display: block;
1862 text-align: center;
1863 font-weight: 400;
1864 font-size: 14px;
1865 line-height: 1;
1866 color: #707070;
1867 padding: 23px 3px;
1868 text-decoration: none;
1869 }
1870 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li a svg {
1871 display: block;
1872 margin: 0 auto 8px;
1873 }
1874 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li a:hover {
1875 color: #6E42D3;
1876 }
1877 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li.active:after {
1878 content: "";
1879 position: absolute;
1880 left: 0px;
1881 bottom: -2px;
1882 height: 2px;
1883 width: 100%;
1884 background: #6E42D3;
1885 z-index: 1;
1886 }
1887 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-li.active a {
1888 color: #6E42D3;
1889 }
1890 .wpfnl-dashboard__nav .logo {
1891 display: block;
1892 }
1893 .wpfnl-dashboard__nav .logo a {
1894 display: block;
1895 text-align: center;
1896 }
1897 .wpfnl-dashboard__nav .logo a svg {
1898 display: block;
1899 margin: 0 auto;
1900 }
1901 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-right {
1902 display: flex;
1903 align-items: center;
1904 margin-inline-start: auto;
1905 }
1906
1907 .dashboard-nav__content {
1908 position: relative;
1909 width: calc(100% - 280px);
1910 margin: 0 auto;
1911 }
1912 .dashboard-nav__content .import-funnel-modal {
1913 position: fixed;
1914 top: 0;
1915 left: 160px;
1916 width: calc(100% - 160px);
1917 height: 100%;
1918 background: rgba(21, 17, 29, 0.3);
1919 backdrop-filter: blur(6px);
1920 z-index: 99;
1921 opacity: 0;
1922 visibility: hidden;
1923 transition: all 0.3s ease;
1924 }
1925 .dashboard-nav__content .import-funnel-modal.show-modal {
1926 opacity: 1;
1927 visibility: visible;
1928 }
1929 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner {
1930 width: 100%;
1931 height: 100%;
1932 padding: 32px;
1933 display: flex;
1934 flex-flow: column;
1935 align-items: center;
1936 justify-content: center;
1937 }
1938 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper {
1939 background: #F6F5FA;
1940 border-radius: 15px 0px 15px 15px;
1941 width: 100%;
1942 max-width: 540px;
1943 position: relative;
1944 padding: 24px 30px 20px;
1945 }
1946 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper .import-funnel-modal-title {
1947 font-weight: 600;
1948 font-size: 18px;
1949 line-height: 1.18;
1950 color: #363B4E;
1951 margin-bottom: 13px;
1952 }
1953 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper .close-modal {
1954 border: none;
1955 width: 40px;
1956 height: 40px;
1957 position: absolute;
1958 top: -16px;
1959 right: -16px;
1960 display: flex;
1961 flex-flow: column;
1962 align-items: center;
1963 justify-content: center;
1964 cursor: pointer;
1965 border-radius: 100px;
1966 background: #ffffff;
1967 box-shadow: 0px 1px 1px 0px #DADADA;
1968 }
1969 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form {
1970 position: relative;
1971 }
1972 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form input[type=file] {
1973 position: absolute;
1974 width: 100%;
1975 height: 206px;
1976 top: 0;
1977 left: 0;
1978 opacity: 0;
1979 }
1980 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form input[type=file]::-webkit-file-upload-button {
1981 background: #F9F9FA;
1982 border: 1px solid #C9D0E9;
1983 border-radius: 6px;
1984 padding: 9px 17px;
1985 margin-right: 12px;
1986 cursor: pointer;
1987 }
1988 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .import-label {
1989 border-radius: 8px;
1990 padding: 50px 30px;
1991 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");
1992 display: flex;
1993 flex-flow: column;
1994 align-items: center;
1995 justify-content: center;
1996 }
1997 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .import-label h4 {
1998 color: #2D3149;
1999 font-size: 15px;
2000 line-height: 1;
2001 font-weight: 600;
2002 margin-bottom: 1px;
2003 }
2004 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .import-label h4 .primary-color {
2005 color: #6E42D3;
2006 font-weight: 600;
2007 }
2008 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-success-icon,
2009 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-icon {
2010 width: 50px;
2011 height: 50px;
2012 background: #6e42d3;
2013 display: flex;
2014 flex-flow: column;
2015 align-items: center;
2016 justify-content: center;
2017 border-radius: 100%;
2018 margin-bottom: 16px;
2019 }
2020 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-success-icon {
2021 display: none;
2022 background: #239654;
2023 }
2024 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .upload-success-icon svg {
2025 position: relative;
2026 top: 1px;
2027 left: 1px;
2028 }
2029 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .file-added .upload-success-icon {
2030 display: flex;
2031 }
2032 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .file-added .upload-icon {
2033 display: none;
2034 }
2035 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area {
2036 display: flex;
2037 flex-flow: row;
2038 align-items: center;
2039 justify-content: flex-end;
2040 border-top: 1px solid #E4E6EB;
2041 margin-top: 30px;
2042 padding: 20px 30px 0;
2043 gap: 12px;
2044 position: relative;
2045 left: -30px;
2046 width: calc(100% + 60px);
2047 }
2048 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .btn-default {
2049 padding: 8px 21px 6px;
2050 height: 40px;
2051 line-height: 1;
2052 border-radius: 10px;
2053 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
2054 min-width: auto;
2055 border: 1px solid transparent;
2056 }
2057 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .btn-default .wpfnl-loader {
2058 position: relative;
2059 top: 2px;
2060 }
2061 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .cancel {
2062 position: relative;
2063 top: inherit;
2064 right: inherit;
2065 border-color: #E4E6EB;
2066 width: auto;
2067 background: transparent;
2068 box-shadow: none;
2069 color: #3C3F47;
2070 }
2071 .dashboard-nav__content .import-funnel-modal .import-funnel-modal-inner .import-funnel-modal-wrapper form .button-area .cancel:hover {
2072 background: #f1f1f1;
2073 }
2074 .dashboard-nav__content .upgrade-to-pro {
2075 margin-top: 20px;
2076 }
2077 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper {
2078 display: flex;
2079 align-items: start;
2080 width: 100%;
2081 padding: 20px;
2082 border-radius: 10px;
2083 border: 1px solid rgba(238, 129, 52, 0.5);
2084 background: #FFFAF6;
2085 }
2086 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .warning-icon-wrapper {
2087 margin-right: 15px;
2088 }
2089 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .warning-icon {
2090 display: inline-block;
2091 vertical-align: middle;
2092 }
2093 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content {
2094 flex-grow: 1;
2095 color: #d9534f;
2096 font-size: 16px;
2097 line-height: 1.5;
2098 }
2099 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content .upgrade-to-pro-message {
2100 color: #667085;
2101 font-family: Roboto;
2102 font-size: 15px;
2103 font-style: normal;
2104 font-weight: 400;
2105 line-height: 24px;
2106 max-width: 636px;
2107 }
2108 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content .upgrade-to-pro-message h3 {
2109 color: #373B4D;
2110 font-family: Roboto;
2111 font-size: 18px;
2112 font-style: normal;
2113 font-weight: 700;
2114 line-height: normal;
2115 margin-bottom: 10px;
2116 }
2117 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action {
2118 display: flex;
2119 align-items: center;
2120 margin-left: 20px;
2121 }
2122 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro {
2123 background-color: #6f42c1;
2124 text-decoration: none;
2125 font-weight: 500;
2126 color: #FFF;
2127 text-align: center;
2128 font-family: Inter;
2129 font-size: 16px;
2130 font-style: normal;
2131 padding: 10px 20px;
2132 border-radius: 7px;
2133 }
2134 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro:hover {
2135 background-color: #563d7c;
2136 }
2137
2138 body.folded .dashboard-nav__content .import-funnel-modal {
2139 left: 36px;
2140 }
2141
2142 .wpfnl-dashboard__header {
2143 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
2144 background: #fff;
2145 width: 100%;
2146 display: flex;
2147 flex-flow: row wrap;
2148 align-items: center;
2149 justify-content: space-between;
2150 padding: 20px 20px 20px 30px;
2151 border-left: 1px solid #ebedf7;
2152 }
2153 .wpfnl-dashboard__header.overview-header {
2154 box-shadow: none;
2155 background: transparent;
2156 padding: 20px 0 0;
2157 border-left: none;
2158 }
2159 .wpfnl-dashboard__header .wpfnl-dashboard-header-left {
2160 display: flex;
2161 align-items: center;
2162 justify-content: center;
2163 }
2164 .wpfnl-dashboard__header .title h1 {
2165 font-weight: 500;
2166 font-size: 18px;
2167 line-height: 21px;
2168 color: #363B4E;
2169 text-transform: capitalize;
2170 }
2171 .wpfnl-dashboard__header .title .subtitle {
2172 font-size: 13px;
2173 display: inline-block;
2174 }
2175 .wpfnl-dashboard__header .funnel-search {
2176 margin-right: 20px;
2177 }
2178 .wpfnl-dashboard__header .funnel-search .search-group {
2179 position: relative;
2180 width: 230px;
2181 }
2182 .wpfnl-dashboard__header .funnel-search .search-group svg {
2183 position: absolute;
2184 top: 9px;
2185 left: 12px;
2186 }
2187 .wpfnl-dashboard__header .funnel-search .search-group input {
2188 padding-left: 40px;
2189 border-radius: 10px;
2190 font-size: 13px;
2191 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
2192 border: none;
2193 height: 39px;
2194 }
2195 .wpfnl-dashboard__header .funnel-search .search-group input::-webkit-input-placeholder {
2196 color: #7A8B9A;
2197 }
2198 .wpfnl-dashboard__header .funnel-search .search-group input::-moz-placeholder {
2199 color: #7A8B9A;
2200 }
2201 .wpfnl-dashboard__header .funnel-search .search-group input:-ms-input-placeholder {
2202 color: #7A8B9A;
2203 }
2204 .wpfnl-dashboard__header .funnel-search .search-group input:-moz-placeholder {
2205 color: #7A8B9A;
2206 }
2207 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper {
2208 margin-right: 20px;
2209 }
2210 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels,
2211 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels {
2212 margin-right: 16px;
2213 }
2214 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels:last-child,
2215 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels:last-child {
2216 margin-right: 0;
2217 }
2218 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels span,
2219 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels span {
2220 color: #2D3149;
2221 font-family: Inter;
2222 font-size: 14px;
2223 font-style: normal;
2224 font-weight: 500;
2225 line-height: 1;
2226 letter-spacing: -0.14px;
2227 }
2228 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels span.wpfnl-count,
2229 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels span.wpfnl-count {
2230 border-radius: 10px;
2231 background: #FFF;
2232 padding: 6px 8px;
2233 color: #7A8B9A;
2234 font-family: Inter;
2235 font-size: 10px;
2236 font-style: normal;
2237 font-weight: 500;
2238 line-height: 8px;
2239 letter-spacing: -0.1px;
2240 margin-left: 3px;
2241 display: inline-block;
2242 }
2243 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels.active span,
2244 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels.active span {
2245 color: #573BFF;
2246 }
2247 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-trash-all-funnels.active span.wpfnl-count,
2248 .wpfnl-dashboard__header .wpfnl-dashboard-links-wrapper a.wpfnl-all-funnels.active span.wpfnl-count {
2249 background: rgba(87, 59, 255, 0.1);
2250 }
2251 .wpfnl-dashboard__header a.import-export {
2252 background: #FFFFFF;
2253 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
2254 border-radius: 8px;
2255 font-weight: 400;
2256 font-size: 14px;
2257 line-height: 1.21;
2258 text-align: center;
2259 color: #363B4E;
2260 padding: 12px 20px 10px;
2261 display: flex;
2262 align-items: center;
2263 gap: 5px;
2264 margin-right: 14px;
2265 cursor: pointer;
2266 }
2267 .wpfnl-dashboard__header a.import-export .pro-tag-icon {
2268 width: 20px;
2269 height: 20px;
2270 }
2271 .wpfnl-dashboard__header a.import-export svg {
2272 display: block;
2273 position: relative;
2274 top: -1px;
2275 }
2276 .wpfnl-dashboard__header a.import-export path {
2277 transition: all 0.3s ease;
2278 }
2279 .wpfnl-dashboard__header a.import-export:hover {
2280 color: #6E42D3;
2281 }
2282 .wpfnl-dashboard__header a.import-export:hover path {
2283 fill: #6E42D3;
2284 }
2285 .wpfnl-dashboard__header a.import-export:hover .pro-tag-icon path {
2286 fill: #FFF;
2287 }
2288 .wpfnl-dashboard__header a.import-export.wpfnl-export-all-funnels {
2289 margin-left: auto;
2290 }
2291 .wpfnl-dashboard__header a.import-export#wpfnl-export-all-pro {
2292 margin-left: auto;
2293 }
2294 .wpfnl-dashboard__header a.import-export.disabled {
2295 opacity: 0.5;
2296 pointer-events: none;
2297 cursor: not-allowed;
2298 }
2299 .wpfnl-dashboard__header a.import-export.disabled svg path {
2300 stroke: #363B4E;
2301 }
2302 .wpfnl-dashboard__header a.pro-import-button {
2303 background: #FFFFFF;
2304 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
2305 border-radius: 8px;
2306 font-weight: 400;
2307 font-size: 14px;
2308 line-height: 1.21;
2309 text-align: center;
2310 color: #363B4E;
2311 padding: 12px 20px 10px;
2312 display: flex;
2313 align-items: center;
2314 gap: 5px;
2315 margin-right: 14px;
2316 cursor: pointer;
2317 }
2318 .wpfnl-dashboard__header a.pro-import-button .pro-tag-icon {
2319 width: 20px;
2320 height: 20px;
2321 }
2322 .wpfnl-dashboard__header a.pro-import-button svg {
2323 display: block;
2324 position: relative;
2325 top: -1px;
2326 }
2327 .wpfnl-dashboard__header a.pro-import-button path {
2328 transition: all 0.3s ease;
2329 }
2330 .wpfnl-dashboard__header a.pro-import-button:hover {
2331 color: #6E42D3;
2332 }
2333 .wpfnl-dashboard__header a.pro-import-button:hover path {
2334 fill: #6E42D3;
2335 }
2336 .wpfnl-dashboard__header a.pro-import-button:hover .pro-tag-icon path {
2337 fill: #FFF;
2338 }
2339 .wpfnl-dashboard__header a.pro-import-button.wpfnl-export-all-funnels {
2340 margin-left: auto;
2341 }
2342 .wpfnl-dashboard__header a.pro-import-button#wpfnl-export-all-pro {
2343 margin-left: auto;
2344 }
2345 .wpfnl-dashboard__header .btn-default.disabled,
2346 .wpfnl-dashboard__header .add-new-funnel-btn {
2347 font-weight: 400;
2348 height: 40px;
2349 line-height: 41px;
2350 border-radius: 10px;
2351 }
2352 .wpfnl-dashboard__header .add-new-funnel-btn svg {
2353 position: relative;
2354 top: 1px;
2355 margin-right: 3px;
2356 }
2357 .wpfnl-dashboard__header .add-new-funnel-btn svg path {
2358 stroke: #fff;
2359 }
2360 .wpfnl-dashboard__header .add-new-funnel-btn.disabled {
2361 opacity: 0.5;
2362 pointer-events: none;
2363 cursor: not-allowed;
2364 }
2365 .wpfnl-dashboard__header .add-new-funnel-btn.disabled svg {
2366 margin-right: 6px;
2367 }
2368 .wpfnl-dashboard__header .wpfnl-ai-funnel-btn {
2369 display: inline-flex;
2370 align-items: center;
2371 gap: 6px;
2372 background: linear-gradient(135deg, #6E42D3 0%, #9B6BFF 100%);
2373 color: #fff !important;
2374 border: none;
2375 padding: 8px 18px;
2376 border-radius: 10px;
2377 font-size: 14px;
2378 font-weight: 500;
2379 height: 40px;
2380 line-height: 41px;
2381 cursor: pointer;
2382 transition: all 0.2s ease;
2383 text-decoration: none !important;
2384 margin-left: 8px;
2385 white-space: nowrap;
2386 }
2387 .wpfnl-dashboard__header .wpfnl-ai-funnel-btn:hover {
2388 background: linear-gradient(135deg, #5C35B5 0%, #8A5AEE 100%);
2389 transform: translateY(-1px);
2390 box-shadow: 0 4px 12px rgba(110, 66, 211, 0.35);
2391 color: #fff !important;
2392 }
2393 .wpfnl-dashboard__header .wpfnl-ai-funnel-btn:active {
2394 transform: translateY(0);
2395 }
2396 .wpfnl-dashboard__header .wpfnl-ai-funnel-btn svg {
2397 flex-shrink: 0;
2398 }
2399
2400 .wpfnl-dashboard__inner-content {
2401 min-height: 425px;
2402 margin: 24px auto 30px;
2403 }
2404 .wpfnl-dashboard__inner-content.no-funnel .funnel-list__wrapper {
2405 display: flex;
2406 flex-flow: column;
2407 align-items: center;
2408 justify-content: center;
2409 background-color: transparent;
2410 border-radius: 0;
2411 }
2412 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-wrapper {
2413 background: transparent;
2414 width: 100%;
2415 }
2416 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-wrapper .no-funnel {
2417 color: #363B4E;
2418 font-size: 18px;
2419 font-style: normal;
2420 font-weight: 500;
2421 line-height: 0.88;
2422 }
2423 .wpfnl-dashboard__inner-content.no-funnel .no-trash-wrapper {
2424 text-align: center;
2425 background: #FFF;
2426 filter: drop-shadow(0px 1px 1px rgba(182, 185, 191, 0.3));
2427 width: 100%;
2428 height: 100%;
2429 display: flex;
2430 flex-direction: column;
2431 justify-content: center;
2432 align-items: center;
2433 gap: 40px;
2434 padding: 170px 0px;
2435 border-radius: 10px;
2436 }
2437 .wpfnl-dashboard__inner-content.no-funnel .no-trash-wrapper .no-funnel {
2438 font-family: "Roboto";
2439 font-style: normal;
2440 font-weight: 500;
2441 font-size: 18px;
2442 line-height: 16px;
2443 color: #363B4E;
2444 }
2445 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel {
2446 display: flex;
2447 flex-flow: row wrap;
2448 gap: 16px;
2449 }
2450 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default {
2451 font-size: 15px;
2452 padding: 0 20px;
2453 height: 44px;
2454 line-height: 44px;
2455 display: flex;
2456 align-items: center;
2457 gap: 7px;
2458 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
2459 border-radius: 10px;
2460 min-width: auto;
2461 border: 1px solid transparent;
2462 }
2463 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.import-export {
2464 background: transparent;
2465 color: #363B4E;
2466 border-color: #E4E2EB;
2467 filter: drop-shadow(0px 2px 4px rgba(223, 223, 249, 0.25));
2468 }
2469 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.import-export:hover {
2470 background: #fff;
2471 }
2472 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.pro-import-button {
2473 background: transparent;
2474 color: #363B4E;
2475 border-color: #E4E2EB;
2476 filter: drop-shadow(0px 2px 4px rgba(223, 223, 249, 0.25));
2477 }
2478 .wpfnl-dashboard__inner-content.no-funnel .create-new-funnel .btn-default.pro-import-button:hover {
2479 background: #fff;
2480 }
2481 .wpfnl-dashboard__inner-content.no-funnel a.wpfnl-trash-all-funnels {
2482 font-family: "Inter";
2483 font-style: normal;
2484 font-weight: 500;
2485 font-size: 14px;
2486 line-height: 17px;
2487 letter-spacing: -0.01em;
2488 color: #EC5956;
2489 display: flex;
2490 align-items: center;
2491 justify-content: center;
2492 gap: 5px;
2493 margin-top: 15px;
2494 }
2495 .wpfnl-dashboard__inner-content.no-funnel a.wpfnl-trash-all-funnels path {
2496 stroke: #EC5956;
2497 }
2498 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info {
2499 width: 100%;
2500 border-radius: 10px;
2501 background-color: #FFF;
2502 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
2503 padding: 70px 80px;
2504 display: flex;
2505 gap: 30px;
2506 align-items: center;
2507 }
2508 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-content {
2509 flex: 1;
2510 }
2511 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-title {
2512 color: #1D2327;
2513 font-size: 24px;
2514 font-weight: 500;
2515 line-height: 1.3;
2516 margin: 0 0 5px 0;
2517 }
2518 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-description {
2519 margin: 0 0 18px 0;
2520 color: #707070;
2521 font-size: 14px;
2522 font-weight: 400;
2523 line-height: 1.5;
2524 max-width: 330px;
2525 }
2526 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-features {
2527 list-style: none;
2528 margin: 0 0 28px 0;
2529 padding: 0;
2530 display: flex;
2531 flex-direction: column;
2532 gap: 12px;
2533 }
2534 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .feature-item {
2535 display: flex;
2536 align-items: center;
2537 gap: 10px;
2538 color: #1F2937;
2539 font-size: 14px;
2540 font-weight: 400;
2541 line-height: 1.5;
2542 margin: 0;
2543 padding-left: 22px;
2544 position: relative;
2545 }
2546 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .feature-item svg {
2547 position: absolute;
2548 left: 0;
2549 top: 6px;
2550 width: 14px;
2551 height: auto;
2552 }
2553 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-links {
2554 display: flex;
2555 align-items: center;
2556 flex-wrap: wrap;
2557 gap: 20px;
2558 row-gap: 10px;
2559 }
2560 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link {
2561 display: inline-flex;
2562 align-items: center;
2563 gap: 8px;
2564 color: #6E42D3;
2565 font-size: 15px;
2566 font-weight: 500;
2567 line-height: 1;
2568 text-decoration: none;
2569 transition: opacity 0.2s ease;
2570 }
2571 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link svg {
2572 display: block;
2573 flex-shrink: 0;
2574 }
2575 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link:hover {
2576 text-decoration: underline;
2577 }
2578 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .info-link:focus {
2579 outline: 2px solid #6E42D3;
2580 outline-offset: 2px;
2581 border-radius: 4px;
2582 }
2583 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-wrapper {
2584 flex-shrink: 0;
2585 height: 100%;
2586 }
2587 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview {
2588 position: relative;
2589 width: 570px;
2590 height: 100%;
2591 border-radius: 10px;
2592 cursor: pointer;
2593 transition: transform 0.2s ease;
2594 }
2595 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:before {
2596 content: "";
2597 position: absolute;
2598 inset: -20px;
2599 border: 1px solid #F6F5FA;
2600 border-radius: 14px;
2601 }
2602 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:after {
2603 content: "";
2604 position: absolute;
2605 inset: -40px;
2606 border: 1px solid #F6F5FA;
2607 border-radius: 14px;
2608 }
2609 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:focus {
2610 outline: 3px solid #6E42D3;
2611 outline-offset: 2px;
2612 }
2613 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-poster {
2614 width: 100%;
2615 height: auto;
2616 object-fit: cover;
2617 display: block;
2618 border-radius: 14px;
2619 }
2620 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-overlay {
2621 position: absolute;
2622 top: 0;
2623 left: 0;
2624 right: 0;
2625 bottom: 0;
2626 display: flex;
2627 align-items: center;
2628 justify-content: center;
2629 background: rgba(0, 0, 0, 0.3);
2630 transition: background 0.2s ease;
2631 border-radius: 14px;
2632 z-index: 1;
2633 }
2634 .video-preview:hover .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-overlay {
2635 background: rgba(0, 0, 0, 0.4);
2636 }
2637 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button {
2638 width: 57px;
2639 height: 57px;
2640 border-radius: 50%;
2641 background: #fff;
2642 display: flex;
2643 align-items: center;
2644 justify-content: center;
2645 transition: all 0.2s ease;
2646 box-shadow: 0 0 0 10px #e7e7e7;
2647 position: relative;
2648 }
2649 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button:before {
2650 content: "";
2651 position: absolute;
2652 inset: -11px;
2653 border-radius: 50%;
2654 background: transparent;
2655 border: 1px solid #fff;
2656 }
2657 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button svg {
2658 margin-left: 4px;
2659 display: block;
2660 }
2661 .video-preview:hover .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .play-button {
2662 background: rgb(110, 66, 211);
2663 transform: scale(1.1);
2664 }
2665 .wpfnl-dashboard__inner-content.no-funnel .video-popup-overlay {
2666 position: fixed;
2667 top: 0;
2668 left: 0;
2669 right: 0;
2670 bottom: 0;
2671 background: rgba(0, 0, 0, 0.8);
2672 display: flex;
2673 align-items: center;
2674 justify-content: center;
2675 z-index: 99999;
2676 padding: 20px;
2677 opacity: 0;
2678 visibility: hidden;
2679 transition: all 0.5s ease;
2680 }
2681 .wpfnl-dashboard__inner-content.no-funnel .video-popup-overlay.show {
2682 opacity: 1;
2683 visibility: visible;
2684 }
2685 .wpfnl-dashboard__inner-content.no-funnel .video-popup-content {
2686 position: relative;
2687 width: 100%;
2688 max-width: 760px;
2689 border-radius: 16px;
2690 background: #fff;
2691 padding: 20px;
2692 }
2693 .wpfnl-dashboard__inner-content.no-funnel .video-popup-close {
2694 position: absolute;
2695 top: -20px;
2696 right: -20px;
2697 width: 40px;
2698 height: 40px;
2699 background: rgb(255, 255, 255);
2700 border: none;
2701 border-radius: 50%;
2702 color: #fff;
2703 cursor: pointer;
2704 display: flex;
2705 align-items: center;
2706 justify-content: center;
2707 transition: all 0.2s ease;
2708 z-index: 10;
2709 box-shadow: 1px 1px 7px rgba(34, 34, 34, 0.2784313725);
2710 }
2711 .wpfnl-dashboard__inner-content.no-funnel .video-popup-close:focus {
2712 outline: 2px solid #fff;
2713 outline-offset: 2px;
2714 }
2715 .wpfnl-dashboard__inner-content.no-funnel .video-container {
2716 position: relative;
2717 padding-bottom: 56.25%;
2718 height: 0;
2719 overflow: hidden;
2720 }
2721 .wpfnl-dashboard__inner-content.no-funnel .video-container iframe {
2722 position: absolute;
2723 top: 0;
2724 left: 0;
2725 width: 100%;
2726 height: 100%;
2727 border-radius: 14px;
2728 }
2729 .wpfnl-dashboard__inner-content.no-funnel .visually-hidden {
2730 position: absolute;
2731 width: 1px;
2732 height: 1px;
2733 padding: 0;
2734 margin: -1px;
2735 overflow: hidden;
2736 clip: rect(0, 0, 0, 0);
2737 white-space: nowrap;
2738 border: 0;
2739 }
2740 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-enter-active,
2741 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-leave-active {
2742 transition: opacity 0.3s ease;
2743 }
2744 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-enter-from,
2745 .wpfnl-dashboard__inner-content.no-funnel .video-popup-fade-leave-to {
2746 opacity: 0;
2747 }
2748
2749 .wpfnl-ai-modal-overlay {
2750 position: fixed;
2751 top: 0;
2752 left: 0;
2753 width: 100%;
2754 height: 100%;
2755 background: rgba(0, 0, 0, 0.6);
2756 backdrop-filter: blur(4px);
2757 z-index: 999999;
2758 display: flex;
2759 align-items: center;
2760 justify-content: center;
2761 opacity: 0;
2762 visibility: hidden;
2763 transition: opacity 0.25s ease, visibility 0.25s ease;
2764 }
2765 .wpfnl-ai-modal-overlay.active {
2766 opacity: 1;
2767 visibility: visible;
2768 }
2769
2770 .wpfnl-ai-modal-wrapper {
2771 background: #fff;
2772 border-radius: 12px;
2773 box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
2774 max-height: 90vh;
2775 overflow-y: auto;
2776 position: relative;
2777 animation: wpfnlAiModalSlideIn 0.3s ease;
2778 }
2779
2780 @keyframes wpfnlAiModalSlideIn {
2781 from {
2782 opacity: 0;
2783 transform: translateY(20px) scale(0.98);
2784 }
2785 to {
2786 opacity: 1;
2787 transform: translateY(0) scale(1);
2788 }
2789 }
2790 .wpfnl-ai-modal-close {
2791 position: absolute;
2792 top: 16px;
2793 right: 16px;
2794 z-index: 10;
2795 }
2796
2797 .wpfnl-ai-modal-close-btn {
2798 display: flex;
2799 align-items: center;
2800 justify-content: center;
2801 width: 32px;
2802 height: 32px;
2803 border-radius: 50%;
2804 background: #f3f4f6;
2805 cursor: pointer;
2806 transition: all 0.2s ease;
2807 }
2808 .wpfnl-ai-modal-close-btn:hover {
2809 background: #e5e7eb;
2810 }
2811 .wpfnl-ai-modal-close-btn svg {
2812 width: 12px;
2813 height: 12px;
2814 }
2815
2816 .wpfnl-ai-upsell {
2817 width: 580px;
2818 max-width: 95vw;
2819 padding: 40px;
2820 }
2821
2822 .wpfnl-ai-modal-header {
2823 text-align: center;
2824 margin-bottom: 28px;
2825 }
2826
2827 .wpfnl-ai-modal-header-icon {
2828 display: inline-flex;
2829 align-items: center;
2830 justify-content: center;
2831 margin-bottom: 16px;
2832 }
2833
2834 .wpfnl-ai-heading {
2835 font-size: 22px;
2836 font-weight: 700;
2837 color: #1a1a2e;
2838 margin: 0 0 10px;
2839 }
2840
2841 .wpfnl-ai-sub-heading {
2842 font-size: 14px;
2843 color: #6b7280;
2844 line-height: 1.6;
2845 margin: 0;
2846 max-width: 460px;
2847 margin-left: auto;
2848 margin-right: auto;
2849 }
2850
2851 .wpfnl-ai-credit-indicator {
2852 background: #f8f7ff;
2853 border: 1px solid #e8e4f7;
2854 border-radius: 10px;
2855 padding: 20px;
2856 margin-bottom: 24px;
2857 }
2858
2859 .wpfnl-ai-credit-bar-wrapper {
2860 display: flex;
2861 align-items: center;
2862 gap: 12px;
2863 margin-bottom: 8px;
2864 }
2865
2866 .wpfnl-ai-credit-label {
2867 font-size: 13px;
2868 font-weight: 600;
2869 color: #374151;
2870 white-space: nowrap;
2871 }
2872
2873 .wpfnl-ai-credit-bar {
2874 flex: 1;
2875 height: 8px;
2876 background: #e5e7eb;
2877 border-radius: 4px;
2878 overflow: hidden;
2879 }
2880
2881 .wpfnl-ai-credit-bar-fill {
2882 height: 100%;
2883 background: linear-gradient(90deg, #6E42D3, #9B6BFF);
2884 border-radius: 4px;
2885 transition: width 0.4s ease;
2886 }
2887
2888 .wpfnl-ai-credit-count {
2889 font-size: 12px;
2890 color: #6b7280;
2891 white-space: nowrap;
2892 }
2893
2894 .wpfnl-ai-credit-note {
2895 font-size: 12px;
2896 color: #9ca3af;
2897 margin: 0;
2898 line-height: 1.4;
2899 }
2900
2901 .wpfnl-ai-features-grid {
2902 display: grid;
2903 grid-template-columns: 1fr 1fr;
2904 gap: 16px;
2905 margin-bottom: 8px;
2906 }
2907
2908 .wpfnl-ai-feature-item {
2909 display: flex;
2910 align-items: flex-start;
2911 gap: 12px;
2912 padding: 14px;
2913 background: #fafafa;
2914 border-radius: 8px;
2915 border: 1px solid #f0f0f0;
2916 transition: border-color 0.2s ease;
2917 }
2918 .wpfnl-ai-feature-item:hover {
2919 border-color: #e0d8f0;
2920 }
2921 .wpfnl-ai-feature-item strong {
2922 display: block;
2923 font-size: 13px;
2924 font-weight: 600;
2925 color: #1a1a2e;
2926 margin-bottom: 2px;
2927 }
2928 .wpfnl-ai-feature-item p {
2929 font-size: 12px;
2930 color: #6b7280;
2931 margin: 0;
2932 line-height: 1.4;
2933 }
2934
2935 .wpfnl-ai-feature-icon {
2936 flex-shrink: 0;
2937 width: 36px;
2938 height: 36px;
2939 display: flex;
2940 align-items: center;
2941 justify-content: center;
2942 background: #f0ecfa;
2943 border-radius: 8px;
2944 }
2945
2946 .wpfnl-ai-modal-footer {
2947 text-align: center;
2948 margin-top: 28px;
2949 padding-top: 24px;
2950 border-top: 1px solid #f0f0f0;
2951 }
2952
2953 .wpfnl-ai-upgrade-btn {
2954 display: inline-flex;
2955 align-items: center;
2956 gap: 8px;
2957 background: linear-gradient(135deg, #6E42D3 0%, #9B6BFF 100%);
2958 color: #fff !important;
2959 border: none;
2960 padding: 12px 28px;
2961 border-radius: 8px;
2962 font-size: 15px;
2963 font-weight: 600;
2964 cursor: pointer;
2965 text-decoration: none !important;
2966 transition: all 0.2s ease;
2967 }
2968 .wpfnl-ai-upgrade-btn:hover {
2969 background: linear-gradient(135deg, #5C35B5 0%, #8A5AEE 100%);
2970 transform: translateY(-1px);
2971 box-shadow: 0 6px 16px rgba(110, 66, 211, 0.35);
2972 color: #fff !important;
2973 }
2974 .wpfnl-ai-upgrade-btn svg {
2975 width: 18px;
2976 height: 18px;
2977 }
2978
2979 .wpfnl-ai-footer-note {
2980 font-size: 12px;
2981 color: #9ca3af;
2982 margin: 10px 0 0;
2983 }
2984
2985 .wpfnl-ai-wizard {
2986 width: 640px;
2987 max-width: 95vw;
2988 padding: 0;
2989 }
2990
2991 .wpfnl-ai-wizard-content {
2992 padding: 36px 40px;
2993 }
2994
2995 .wpfnl-ai-wizard-progress {
2996 margin-bottom: 32px;
2997 }
2998
2999 .wpfnl-ai-wizard-progress-bar {
3000 height: 6px;
3001 background: #e5e7eb;
3002 border-radius: 3px;
3003 overflow: hidden;
3004 margin-bottom: 8px;
3005 }
3006
3007 .wpfnl-ai-wizard-progress-fill {
3008 height: 100%;
3009 background: linear-gradient(90deg, #6E42D3, #9B6BFF);
3010 border-radius: 3px;
3011 transition: width 0.4s ease;
3012 }
3013
3014 .wpfnl-ai-wizard-step-indicator {
3015 font-size: 12px;
3016 color: #9ca3af;
3017 font-weight: 500;
3018 }
3019
3020 .wpfnl-ai-wizard-step {
3021 display: none;
3022 }
3023 .wpfnl-ai-wizard-step.active {
3024 display: block;
3025 animation: wpfnlAiStepFadeIn 0.3s ease;
3026 }
3027
3028 @keyframes wpfnlAiStepFadeIn {
3029 from {
3030 opacity: 0;
3031 transform: translateX(15px);
3032 }
3033 to {
3034 opacity: 1;
3035 transform: translateX(0);
3036 }
3037 }
3038 .wpfnl-ai-wizard-step-header {
3039 margin-bottom: 24px;
3040 }
3041 .wpfnl-ai-wizard-step-header h3 {
3042 font-size: 20px;
3043 font-weight: 700;
3044 color: #1a1a2e;
3045 margin: 0 0 6px;
3046 }
3047 .wpfnl-ai-wizard-step-header p {
3048 font-size: 14px;
3049 color: #6b7280;
3050 margin: 0;
3051 line-height: 1.5;
3052 }
3053
3054 .wpfnl-ai-option-grid {
3055 display: grid;
3056 grid-template-columns: 1fr 1fr 1fr;
3057 gap: 12px;
3058 }
3059 .wpfnl-ai-option-grid--three {
3060 grid-template-columns: 1fr 1fr 1fr;
3061 }
3062
3063 .wpfnl-ai-option-card {
3064 cursor: pointer;
3065 margin: 0;
3066 }
3067 .wpfnl-ai-option-card input[type=radio] {
3068 display: none;
3069 }
3070 .wpfnl-ai-option-card:hover .wpfnl-ai-option-card-inner {
3071 border-color: #c4b5e3;
3072 background: #faf8ff;
3073 }
3074 .wpfnl-ai-option-card input[type=radio]:checked + .wpfnl-ai-option-card-inner {
3075 border-color: #6E42D3;
3076 background: #f5f0ff;
3077 box-shadow: 0 0 0 3px rgba(110, 66, 211, 0.12);
3078 }
3079
3080 .wpfnl-ai-option-card-inner {
3081 display: flex;
3082 flex-direction: column;
3083 align-items: center;
3084 text-align: center;
3085 padding: 20px 12px;
3086 background: #fafafa;
3087 border: 2px solid #e5e7eb;
3088 border-radius: 10px;
3089 transition: all 0.2s ease;
3090 min-height: 90px;
3091 justify-content: center;
3092 }
3093
3094 .wpfnl-ai-option-icon {
3095 font-size: 24px;
3096 margin-bottom: 8px;
3097 display: block;
3098 line-height: 1;
3099 }
3100
3101 .wpfnl-ai-option-label {
3102 font-size: 13px;
3103 font-weight: 600;
3104 color: #374151;
3105 display: block;
3106 line-height: 1.3;
3107 }
3108
3109 .wpfnl-ai-option-desc {
3110 font-size: 11px;
3111 color: #9ca3af;
3112 margin-top: 4px;
3113 display: block;
3114 line-height: 1.3;
3115 }
3116
3117 .wpfnl-ai-custom-input {
3118 margin-top: 12px;
3119 }
3120 .wpfnl-ai-custom-input input[type=text] {
3121 width: 100%;
3122 padding: 10px 14px;
3123 border: 1px solid #d1d5db;
3124 border-radius: 8px;
3125 font-size: 14px;
3126 color: #374151;
3127 outline: none;
3128 transition: border-color 0.2s ease, box-shadow 0.2s ease;
3129 box-sizing: border-box;
3130 }
3131 .wpfnl-ai-custom-input input[type=text]:focus {
3132 border-color: #6E42D3;
3133 box-shadow: 0 0 0 3px rgba(110, 66, 211, 0.1);
3134 }
3135 .wpfnl-ai-custom-input input[type=text]::placeholder {
3136 color: #9ca3af;
3137 }
3138
3139 .wpfnl-ai-wizard-nav {
3140 display: flex;
3141 align-items: center;
3142 justify-content: space-between;
3143 margin-top: 32px;
3144 padding-top: 24px;
3145 border-top: 1px solid #f0f0f0;
3146 gap: 12px;
3147 }
3148
3149 .wpfnl-ai-wizard-back {
3150 display: inline-flex;
3151 align-items: center;
3152 gap: 4px;
3153 background: #f3f4f6 !important;
3154 color: #374151 !important;
3155 border: 1px solid #d1d5db !important;
3156 padding: 8px 16px;
3157 border-radius: 6px;
3158 font-size: 13px;
3159 font-weight: 500;
3160 cursor: pointer;
3161 transition: all 0.2s ease;
3162 }
3163 .wpfnl-ai-wizard-back:hover {
3164 background: #e5e7eb !important;
3165 }
3166
3167 .wpfnl-ai-wizard-skip {
3168 background: none;
3169 border: none;
3170 color: #9ca3af;
3171 font-size: 13px;
3172 cursor: pointer;
3173 padding: 8px 12px;
3174 transition: color 0.2s ease;
3175 margin-left: auto;
3176 }
3177 .wpfnl-ai-wizard-skip:hover {
3178 color: #6b7280;
3179 text-decoration: underline;
3180 }
3181
3182 .wpfnl-ai-wizard-next,
3183 .wpfnl-ai-wizard-generate {
3184 display: inline-flex;
3185 align-items: center;
3186 gap: 6px;
3187 background: linear-gradient(135deg, #6E42D3 0%, #9B6BFF 100%) !important;
3188 color: #fff !important;
3189 border: none !important;
3190 padding: 9px 20px;
3191 border-radius: 6px;
3192 font-size: 14px;
3193 font-weight: 600;
3194 cursor: pointer;
3195 transition: all 0.2s ease;
3196 }
3197 .wpfnl-ai-wizard-next:hover,
3198 .wpfnl-ai-wizard-generate:hover {
3199 background: linear-gradient(135deg, #5C35B5 0%, #8A5AEE 100%) !important;
3200 transform: translateY(-1px);
3201 box-shadow: 0 4px 12px rgba(110, 66, 211, 0.3);
3202 }
3203
3204 .wpfnl-ai-wizard-generate .wpfnl-loader {
3205 display: none;
3206 }
3207 .wpfnl-ai-wizard-generate.loading .wpfnl-loader {
3208 display: inline-block;
3209 }
3210
3211 .wpfnl-ai-automation-section {
3212 background: #faf8ff;
3213 border: 1px solid #e5e0f5;
3214 border-radius: 12px;
3215 padding: 20px;
3216 }
3217
3218 .wpfnl-ai-automation-section-header {
3219 display: flex;
3220 align-items: flex-start;
3221 gap: 12px;
3222 margin-bottom: 16px;
3223 }
3224
3225 .wpfnl-ai-automation-section-icon {
3226 font-size: 24px;
3227 line-height: 1;
3228 flex-shrink: 0;
3229 margin-top: 2px;
3230 }
3231
3232 .wpfnl-ai-automation-section-text h4 {
3233 font-size: 15px;
3234 font-weight: 600;
3235 color: #1a1a2e;
3236 margin: 0 0 4px;
3237 }
3238 .wpfnl-ai-automation-section-text p {
3239 font-size: 13px;
3240 color: #6b7280;
3241 margin: 0;
3242 line-height: 1.5;
3243 }
3244
3245 .wpfnl-ai-automation-choice {
3246 display: flex;
3247 flex-direction: column;
3248 gap: 10px;
3249 }
3250
3251 .wpfnl-ai-automation-radio {
3252 cursor: pointer;
3253 display: block;
3254 margin: 0;
3255 }
3256 .wpfnl-ai-automation-radio input[type=radio] {
3257 position: absolute;
3258 opacity: 0;
3259 width: 0;
3260 height: 0;
3261 }
3262
3263 .wpfnl-ai-automation-radio-inner {
3264 display: flex;
3265 align-items: flex-start;
3266 gap: 12px;
3267 padding: 14px 16px;
3268 background: #fff;
3269 border: 2px solid #e5e7eb;
3270 border-radius: 10px;
3271 transition: all 0.2s ease;
3272 }
3273
3274 .wpfnl-ai-automation-radio:hover .wpfnl-ai-automation-radio-inner {
3275 border-color: #c4b5e3;
3276 }
3277
3278 .wpfnl-ai-automation-radio input[type=radio]:checked + .wpfnl-ai-automation-radio-inner {
3279 border-color: #6E42D3;
3280 background: #f5f0ff;
3281 box-shadow: 0 0 0 3px rgba(110, 66, 211, 0.1);
3282 }
3283
3284 .wpfnl-ai-automation-radio-indicator {
3285 flex-shrink: 0;
3286 width: 18px;
3287 height: 18px;
3288 border-radius: 50%;
3289 border: 2px solid #d1d5db;
3290 margin-top: 2px;
3291 position: relative;
3292 transition: all 0.2s ease;
3293 }
3294 .wpfnl-ai-automation-radio-indicator::after {
3295 content: "";
3296 position: absolute;
3297 top: 50%;
3298 left: 50%;
3299 transform: translate(-50%, -50%) scale(0);
3300 width: 8px;
3301 height: 8px;
3302 border-radius: 50%;
3303 background: #6E42D3;
3304 transition: transform 0.15s ease;
3305 }
3306
3307 .wpfnl-ai-automation-radio input[type=radio]:checked + .wpfnl-ai-automation-radio-inner .wpfnl-ai-automation-radio-indicator {
3308 border-color: #6E42D3;
3309 }
3310 .wpfnl-ai-automation-radio input[type=radio]:checked + .wpfnl-ai-automation-radio-inner .wpfnl-ai-automation-radio-indicator::after {
3311 transform: translate(-50%, -50%) scale(1);
3312 }
3313
3314 .wpfnl-ai-automation-radio-text {
3315 display: flex;
3316 flex-direction: column;
3317 gap: 2px;
3318 }
3319 .wpfnl-ai-automation-radio-text strong {
3320 font-size: 14px;
3321 font-weight: 600;
3322 color: #1a1a2e;
3323 }
3324 .wpfnl-ai-automation-radio-text span {
3325 font-size: 12px;
3326 color: #6b7280;
3327 line-height: 1.4;
3328 }
3329
3330 .wpfnl-ai-automation-credit-note {
3331 display: none;
3332 align-items: flex-start;
3333 gap: 8px;
3334 margin-top: 14px;
3335 padding: 10px 14px;
3336 background: #fffbeb;
3337 border: 1px solid #fde68a;
3338 border-radius: 8px;
3339 }
3340 .wpfnl-ai-automation-credit-note.visible {
3341 display: flex;
3342 }
3343 .wpfnl-ai-automation-credit-note .wpfnl-ai-automation-credit-icon {
3344 flex-shrink: 0;
3345 font-size: 14px;
3346 line-height: 1;
3347 }
3348 .wpfnl-ai-automation-credit-note p {
3349 font-size: 12px;
3350 color: #92400e;
3351 margin: 0;
3352 line-height: 1.5;
3353 }
3354
3355 .wpfnl-ai-mint-info-section {
3356 background: #f9fafb;
3357 border: 1px solid #e5e7eb;
3358 border-radius: 12px;
3359 padding: 20px;
3360 }
3361
3362 .wpfnl-ai-mint-info-header {
3363 display: flex;
3364 align-items: center;
3365 gap: 10px;
3366 margin-bottom: 10px;
3367 }
3368 .wpfnl-ai-mint-info-header h4 {
3369 font-size: 15px;
3370 font-weight: 600;
3371 color: #374151;
3372 margin: 0;
3373 }
3374
3375 .wpfnl-ai-mint-info-icon {
3376 font-size: 22px;
3377 line-height: 1;
3378 }
3379
3380 .wpfnl-ai-mint-info-desc {
3381 font-size: 13px;
3382 color: #6b7280;
3383 line-height: 1.6;
3384 margin: 0 0 14px;
3385 }
3386
3387 .wpfnl-ai-mint-features-list {
3388 list-style: none;
3389 padding: 0;
3390 margin: 0 0 16px;
3391 }
3392 .wpfnl-ai-mint-features-list li {
3393 display: flex;
3394 align-items: center;
3395 gap: 8px;
3396 padding: 6px 0;
3397 font-size: 13px;
3398 color: #374151;
3399 line-height: 1.4;
3400 }
3401 .wpfnl-ai-mint-features-list li svg {
3402 flex-shrink: 0;
3403 }
3404
3405 .wpfnl-ai-install-mint-link {
3406 display: inline-flex;
3407 align-items: center;
3408 gap: 4px;
3409 color: #6E42D3 !important;
3410 font-size: 13px;
3411 font-weight: 600;
3412 text-decoration: none !important;
3413 transition: color 0.2s ease;
3414 }
3415 .wpfnl-ai-install-mint-link:hover {
3416 color: #5C35B5 !important;
3417 text-decoration: underline !important;
3418 }
3419 .wpfnl-ai-install-mint-link svg {
3420 flex-shrink: 0;
3421 }
3422
3423 @media (max-width: 768px) {
3424 .wpfnl-ai-upsell {
3425 padding: 24px;
3426 }
3427 .wpfnl-ai-features-grid {
3428 grid-template-columns: 1fr;
3429 }
3430 .wpfnl-ai-wizard-content {
3431 padding: 24px;
3432 }
3433 .wpfnl-ai-option-grid {
3434 grid-template-columns: 1fr 1fr;
3435 }
3436 .wpfnl-ai-option-grid--three {
3437 grid-template-columns: 1fr;
3438 }
3439 .wpfnl-ai-wizard-nav {
3440 flex-wrap: wrap;
3441 }
3442 .wpfnl-ai-wizard-skip {
3443 order: 3;
3444 width: 100%;
3445 text-align: center;
3446 margin-left: 0;
3447 }
3448 .wpfnl-ai-automation-section,
3449 .wpfnl-ai-mint-info-section {
3450 padding: 16px;
3451 }
3452 }
3453 @media (max-width: 480px) {
3454 .wpfnl-ai-option-grid {
3455 grid-template-columns: 1fr;
3456 }
3457 .wpfnl-ai-funnel-btn {
3458 margin-left: 0;
3459 margin-top: 8px;
3460 }
3461 }
3462 @media only screen and (min-width: 1921px) {
3463 .wpfnl-dashboard {
3464 min-height: calc(108vh - 120px);
3465 }
3466 }
3467 @media only screen and (max-width: 1699px) {
3468 .wpfnl-dashboard {
3469 min-height: calc(113vh - 120px);
3470 }
3471 .dashboard-nav__content {
3472 width: calc(100% - 80px);
3473 }
3474 .wpfnl-dashboard .no-funnel-info {
3475 width: calc(100% - 380px);
3476 padding: 20px;
3477 gap: 20px;
3478 }
3479 .wpfnl-dashboard .no-funnel-info .video-preview {
3480 width: 370px;
3481 }
3482 .wpfnl-dashboard .no-funnel-info .video-poster {
3483 height: 311px;
3484 }
3485 }
3486 @media only screen and (max-width: 1399px) {
3487 .wpfnl-dashboard__header.overview-header {
3488 padding: 24px 0 0;
3489 }
3490 .dashboard-nav__content {
3491 width: calc(100% - 48px);
3492 }
3493 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro {
3494 font-size: 15px;
3495 min-width: 150px;
3496 }
3497 .wpfnl-dashboard .no-funnel-info .info-link {
3498 font-size: 14px;
3499 }
3500 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info {
3501 padding: 30px 50px 30px 40px;
3502 }
3503 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview {
3504 width: 420px;
3505 }
3506 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:before {
3507 inset: -12px;
3508 }
3509 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:after {
3510 inset: -24px;
3511 }
3512 }
3513 @media only screen and (max-width: 1199px) {
3514 .wpfnl-dashboard__nav .wpfnl-dashboard__nav-ul {
3515 gap: 18px;
3516 }
3517 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-action .btn-upgrade-to-pro {
3518 min-width: 135px;
3519 padding: 10px 15px;
3520 font-size: 14px;
3521 }
3522 .dashboard-nav__content .upgrade-to-pro .upgrade-to-pro-wrapper .upgrade-to-pro-content .upgrade-to-pro-message h3 {
3523 font-size: 16px;
3524 }
3525 .wpfnl-dashboard__header.overview-header {
3526 padding: 20px 0 0;
3527 }
3528 .wpfnl-dashboard__header .wpfnl-dashboard-header-left:not(.trash-funnels-header) {
3529 flex-direction: column;
3530 align-items: flex-start;
3531 gap: 11px;
3532 }
3533 .overview-header .wpfnl-dashboard__inner-content {
3534 margin-top: 0px;
3535 }
3536 .wpfnl-dashboard__inner-content.no-funnel .no-trash-wrapper {
3537 padding: 100px 0;
3538 }
3539 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info {
3540 padding: 20px 36px 24px 24px;
3541 }
3542 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview {
3543 width: 330px;
3544 }
3545 .wpfnl-dashboard__inner-content.no-funnel .no-funnel-info .video-preview:after {
3546 opacity: 0;
3547 }
3548 }
3549 @media only screen and (max-width: 960px) {
3550 .dashboard-nav__content .import-funnel-modal {
3551 left: 34px;
3552 width: calc(100% - 34px);
3553 }
3554 }
3555 @media only screen and (max-width: 782px) {
3556 .dashboard-nav__content .import-funnel-modal {
3557 left: 0;
3558 width: 100%;
3559 }
3560 }
3561 .wpfnl-sc-analytics-overview {
3562 margin-top: 20px;
3563 margin-bottom: 24px;
3564 background: #fff;
3565 border: 1px solid #E4E6EB;
3566 border-radius: 10px;
3567 overflow: hidden;
3568 transition: max-height 0.3s ease;
3569 }
3570 .wpfnl-sc-analytics-overview.collapsed .wpfnl-sc-analytics-cards {
3571 display: none;
3572 }
3573 .wpfnl-sc-analytics-overview.collapsed .wpfnl-sc-analytics-toggle .toggle-arrow {
3574 transform: rotate(180deg);
3575 }
3576 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-cards {
3577 display: grid;
3578 grid-template-columns: repeat(4, 1fr);
3579 gap: 0;
3580 padding: 24px 20px;
3581 }
3582 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card {
3583 display: flex;
3584 align-items: center;
3585 gap: 16px;
3586 padding: 0 20px;
3587 border-right: 1px solid #E4E6EB;
3588 }
3589 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card:first-child {
3590 padding-left: 0;
3591 }
3592 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card:last-child {
3593 border-right: none;
3594 }
3595 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap {
3596 width: 48px;
3597 height: 48px;
3598 display: flex;
3599 align-items: center;
3600 justify-content: center;
3601 border-radius: 50%;
3602 background: linear-gradient(135deg, #FFF3EC 0%, #FFE8D9 100%);
3603 border: 1px solid #FDDCC9;
3604 }
3605 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap--purple {
3606 background: linear-gradient(135deg, #F3EEFF 0%, #E8DDFB 100%);
3607 border-color: #D8C9F5;
3608 }
3609 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap--orange {
3610 background: linear-gradient(135deg, #FFF3EC 0%, #FFE8D9 100%);
3611 border-color: #FDDCC9;
3612 }
3613 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__icon .icon-wrap--green {
3614 background: linear-gradient(135deg, #ECFDF5 0%, #D1FAE5 100%);
3615 border-color: #A7F3D0;
3616 }
3617 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__content .card-title {
3618 display: block;
3619 color: #7A8B9A;
3620 font-size: 13px;
3621 font-weight: 400;
3622 line-height: 1.3;
3623 margin-bottom: 4px;
3624 }
3625 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card__content .card-value {
3626 display: block;
3627 color: #2D3149;
3628 font-size: 22px;
3629 font-weight: 600;
3630 line-height: 1.2;
3631 }
3632 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle {
3633 display: flex;
3634 justify-content: center;
3635 padding: 8px 0;
3636 border-top: 1px solid #E4E6EB;
3637 cursor: pointer;
3638 }
3639 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle__btn {
3640 display: flex;
3641 align-items: center;
3642 justify-content: center;
3643 width: 28px;
3644 height: 28px;
3645 border-radius: 50%;
3646 border: 1px solid #E4E6EB;
3647 background: #fff;
3648 cursor: pointer;
3649 transition: background 0.2s;
3650 }
3651 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle__btn:hover {
3652 background: #F5F6FA;
3653 }
3654 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-toggle .toggle-arrow {
3655 transition: transform 0.3s ease;
3656 }
3657
3658 @media only screen and (max-width: 1199px) {
3659 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-cards {
3660 grid-template-columns: repeat(2, 1fr);
3661 gap: 20px;
3662 }
3663 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-card {
3664 border-right: none;
3665 padding-left: 0;
3666 }
3667 }
3668 @media only screen and (max-width: 600px) {
3669 .wpfnl-sc-analytics-overview .wpfnl-sc-analytics-cards {
3670 grid-template-columns: 1fr;
3671 }
3672 }
3673 .wpfnl-tpl-shimmer-block {
3674 border-radius: 8px;
3675 animation: shimmer-animation 1.6s infinite linear;
3676 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
3677 background-size: 1000px 100%;
3678 }
3679
3680 .wpfnl-tpl-shimmer-grid {
3681 display: grid;
3682 grid-template-columns: repeat(4, 1fr);
3683 gap: 20px;
3684 }
3685
3686 .wpfnl-tpl-shimmer-card {
3687 border-radius: 12px;
3688 overflow: hidden;
3689 padding: 12px;
3690 background: #f7f7fb;
3691 }
3692
3693 .wpfnl-tpl-shimmer-card-img {
3694 height: 140px;
3695 border-radius: 8px;
3696 margin-bottom: 10px;
3697 }
3698
3699 .wpfnl-tpl-shimmer-card-text {
3700 height: 16px;
3701 width: 80%;
3702 margin-bottom: 8px;
3703 }
3704
3705 .wpfnl-tpl-shimmer-card-badge {
3706 height: 22px;
3707 width: 40%;
3708 border-radius: 20px;
3709 }
3710
3711 .wpfnl-tpl-filter-shimmer {
3712 width: 100%;
3713 padding-top: 8px;
3714 }
3715
3716 .create-funnel-shimmer-overlay {
3717 background: #fff;
3718 display: flex;
3719 flex-direction: column;
3720 width: 100%;
3721 min-height: 100%;
3722 }
3723 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-header-bar {
3724 display: flex;
3725 align-items: center;
3726 justify-content: space-between;
3727 padding: 15px 24px;
3728 background: #fff;
3729 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.4);
3730 flex-shrink: 0;
3731 }
3732 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-title {
3733 height: 28px;
3734 width: 220px;
3735 }
3736 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-btn {
3737 height: 36px;
3738 width: 120px;
3739 border-radius: 8px;
3740 }
3741 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-body {
3742 display: flex;
3743 flex: 1;
3744 }
3745 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-sidebar {
3746 width: 247px;
3747 flex-shrink: 0;
3748 padding: 19px 20px;
3749 background: #fff;
3750 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
3751 }
3752 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-sidebar-title {
3753 height: 20px;
3754 width: 80%;
3755 margin-bottom: 24px;
3756 border-radius: 6px;
3757 }
3758 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-sidebar-item {
3759 height: 44px;
3760 border-radius: 8px;
3761 margin-bottom: 14px;
3762 }
3763 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-content {
3764 flex: 1;
3765 padding: 40px;
3766 overflow: hidden;
3767 }
3768 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-wrap,
3769 .create-funnel-shimmer-overlay .wpfnl-tpl-shimmer-header {
3770 display: none;
3771 }
3772
3773 .shimmer-line {
3774 height: 20px;
3775 margin-top: 20px;
3776 background: #777;
3777 }
3778
3779 .shimmer-line-br {
3780 border-radius: 8px;
3781 }
3782
3783 .shimmer-line-full {
3784 width: 100%;
3785 }
3786
3787 .shimmer-line-80 {
3788 width: 80%;
3789 }
3790
3791 .shimmer-line-60 {
3792 width: 60%;
3793 }
3794
3795 .shimmer-line-40 {
3796 width: 40%;
3797 }
3798
3799 .shimmer-line-20 {
3800 width: 20%;
3801 }
3802
3803 .shimmer-line-10 {
3804 width: 10%;
3805 }
3806
3807 .shimmer-circle {
3808 background: #777;
3809 border-radius: 50%;
3810 }
3811
3812 .shimmer-circle-lg {
3813 height: 129px;
3814 width: 129px;
3815 }
3816
3817 .shimmer-circle-md {
3818 height: 65px;
3819 width: 65px;
3820 }
3821
3822 .shimmer-circle-sm {
3823 height: 33px;
3824 width: 33px;
3825 }
3826
3827 .shimmer-circle-x-sm {
3828 height: 17px;
3829 width: 17px;
3830 }
3831
3832 .shimmer-wrapper, .shimmer-wrapper-center {
3833 width: 100%;
3834 height: 100%;
3835 padding: 10px;
3836 animation: shimmer-full-view 0.5s forwards cubic-bezier(0.25, 0.46, 0.45, 0.94);
3837 }
3838
3839 .shimmer-wrapper-center {
3840 display: flex;
3841 flex-direction: column;
3842 gap: 10px;
3843 justify-content: center;
3844 align-items: center;
3845 }
3846
3847 @keyframes shimmer-full-view {
3848 0% {
3849 background-position: -1000px 0;
3850 }
3851 100% {
3852 background-position: 1000px 0;
3853 }
3854 }
3855 @keyframes shimmer-animation {
3856 0% {
3857 background-position: -1000px 0;
3858 }
3859 100% {
3860 background-position: 1000px 0;
3861 }
3862 }
3863 .shimmer-animate {
3864 animation: shimmer-animation 4s infinite linear;
3865 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
3866 background-size: 1000px 100%;
3867 }
3868
3869 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter, .template-library-modal .funnel-templates-header .pro-free__filter {
3870 border-radius: 50px;
3871 box-shadow: none;
3872 border: 1px solid #E5E8F3;
3873 margin-left: 15px !important;
3874 background: #ffffff;
3875 display: inline-flex;
3876 align-items: center;
3877 }
3878 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li, .template-library-modal .funnel-templates-header .pro-free__filter li {
3879 color: #363B4E;
3880 font-size: 14px;
3881 padding: 9px 18px;
3882 font-weight: 400;
3883 text-transform: capitalize;
3884 cursor: pointer;
3885 position: relative;
3886 border-right: 1px solid #E5E8F3;
3887 z-index: 1;
3888 display: flex;
3889 flex-flow: row;
3890 align-items: center;
3891 }
3892 .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 {
3893 border-radius: 50px 0 0 50px;
3894 }
3895 .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 {
3896 border-radius: 0 50px 50px 0;
3897 }
3898 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li svg, .template-library-modal .funnel-templates-header .pro-free__filter li svg {
3899 position: relative;
3900 top: -1px;
3901 margin-right: 8px;
3902 }
3903 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li.active, .template-library-modal .funnel-templates-header .pro-free__filter li.active {
3904 background-color: #6E42D3;
3905 color: #ffffff;
3906 }
3907 .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 {
3908 stroke: #fff;
3909 }
3910
3911 .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 {
3912 position: absolute;
3913 top: 200px;
3914 left: calc(50% - 123px);
3915 background: #ffffff;
3916 width: 410px;
3917 z-index: 999;
3918 transform: translate(-50%, -50%);
3919 padding: 28px 30px 30px;
3920 border-radius: 10px;
3921 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
3922 transition: all 0.3s ease;
3923 opacity: 0;
3924 visibility: hidden;
3925 }
3926 .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 {
3927 opacity: 1;
3928 visibility: visible;
3929 top: 250px;
3930 }
3931 .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 {
3932 display: flex;
3933 flex-flow: row wrap;
3934 align-items: center;
3935 justify-content: space-between;
3936 margin-bottom: 10px;
3937 }
3938 .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 {
3939 font-size: 16px;
3940 line-height: normal;
3941 font-weight: 500;
3942 }
3943 .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 {
3944 position: absolute;
3945 border: none;
3946 right: -11px;
3947 top: -13px;
3948 display: flex;
3949 width: 40px;
3950 height: 40px;
3951 padding: 8px;
3952 justify-content: center;
3953 flex-flow: column;
3954 align-items: center;
3955 border-radius: 100px;
3956 background: #FFF;
3957 box-shadow: 0px 1px 1px 0px #DADADA;
3958 cursor: pointer;
3959 }
3960 .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 {
3961 display: block;
3962 width: 18px;
3963 height: 18px;
3964 }
3965 .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] {
3966 font-size: 14px;
3967 color: #363B4E;
3968 border-radius: 6px;
3969 border-color: #E2E2E2;
3970 height: 40px;
3971 margin-bottom: 15px;
3972 }
3973 .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 {
3974 -webkit-box-shadow: 0 0 0 30px #ffffff inset;
3975 box-shadow: 0 0 0 30px #ffffff inset;
3976 -webkit-text-fill-color: #363B4E !important;
3977 }
3978 .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 {
3979 color: #7A8B9A;
3980 }
3981 .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 {
3982 color: #7A8B9A;
3983 }
3984 .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 {
3985 color: #7A8B9A;
3986 }
3987 .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 {
3988 color: #7A8B9A;
3989 }
3990 .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] {
3991 border-radius: 10px;
3992 background: #6E42D3;
3993 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
3994 width: 100%;
3995 height: 40px;
3996 line-height: 1;
3997 padding: 14px 30px;
3998 }
3999
4000 .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 {
4001 position: absolute;
4002 left: 0;
4003 top: 0;
4004 width: 100%;
4005 height: 100%;
4006 padding: 13px 15px;
4007 background: rgba(38, 33, 51, 0.6);
4008 z-index: 1;
4009 border-radius: 10px 10px 0 0;
4010 display: flex;
4011 flex-flow: column;
4012 align-items: center;
4013 justify-content: center;
4014 gap: 14px;
4015 -webkit-backdrop-filter: blur(7px);
4016 backdrop-filter: blur(7px);
4017 transition: all 0.3s ease;
4018 opacity: 0;
4019 visibility: hidden;
4020 }
4021 .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 {
4022 margin: 0;
4023 padding: 11px 19px 9px;
4024 height: auto;
4025 width: 100px;
4026 min-width: auto;
4027 font-size: 15px;
4028 line-height: 1;
4029 font-weight: 500;
4030 border-radius: 8px;
4031 border: 1px solid #F2F2F2;
4032 background-color: transparent;
4033 color: #fff;
4034 }
4035 .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 {
4036 background-color: #fff;
4037 border-color: #fff;
4038 color: #363B4E;
4039 }
4040
4041 .template-library-modal {
4042 position: fixed;
4043 top: 32px;
4044 left: 160px;
4045 width: calc(100% - 160px);
4046 height: 100%;
4047 background: #F6F5FA;
4048 z-index: 99;
4049 }
4050 .template-library-modal .templates-title-wrapper {
4051 margin-bottom: 22px;
4052 display: flex;
4053 flex-flow: row;
4054 align-items: center;
4055 width: 100%;
4056 }
4057 .template-library-modal .templates-title-wrapper .title {
4058 line-height: 18px;
4059 text-transform: capitalize;
4060 font-size: 18px;
4061 color: #0e2244;
4062 font-weight: 500;
4063 }
4064 .template-library-modal .wpfnl-create-funnel__inner-content {
4065 height: 100%;
4066 }
4067 .template-library-modal .wpfnl-create-funnel__templates-wrapper {
4068 width: 100%;
4069 max-height: 890px;
4070 height: 100%;
4071 overflow: auto;
4072 }
4073 .template-library-modal .wpfnl-create-funnel__templates-wrapper::-webkit-scrollbar {
4074 width: 5px;
4075 }
4076 .template-library-modal .wpfnl-create-funnel__templates-wrapper::-webkit-scrollbar-track {
4077 background: #f2f5f8;
4078 }
4079 .template-library-modal .wpfnl-create-funnel__templates-wrapper::-webkit-scrollbar-thumb {
4080 background-color: #BCC0C3;
4081 border-radius: 20px;
4082 }
4083 .template-library-modal .funnel-templates-header {
4084 background: #FFFFFF;
4085 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.4);
4086 padding: 15px 24px;
4087 position: relative;
4088 }
4089 .template-library-modal .funnel-templates-header .template-library-filter-wrapper {
4090 display: flex;
4091 flex-flow: row wrap;
4092 align-items: center;
4093 justify-content: space-between;
4094 width: 100%;
4095 }
4096 .template-library-modal .funnel-templates-header .template-library-filter-wrapper.is-store-checkout .pro-free__filter {
4097 margin-left: auto !important;
4098 }
4099 .template-library-modal .funnel-templates-header .back-form-modal {
4100 height: 38px;
4101 width: 38px;
4102 border: 1px solid #EEF0F3;
4103 margin-right: 15px;
4104 border-radius: 10px;
4105 background: #FFFFFF;
4106 display: flex;
4107 flex-flow: column;
4108 align-items: center;
4109 justify-content: center;
4110 cursor: pointer;
4111 }
4112 .template-library-modal .funnel-templates-header .back-form-modal svg {
4113 position: relative;
4114 left: -1px;
4115 }
4116 .template-library-modal .funnel-templates-header .header-title {
4117 font-weight: 500;
4118 font-size: 16px;
4119 line-height: 1.3;
4120 color: #363B4E;
4121 }
4122 .template-library-modal .funnel-templates-header .sync-library-btn {
4123 display: inline-flex;
4124 align-items: center;
4125 gap: 6px;
4126 height: 38px;
4127 padding: 0 16px;
4128 border: 1px solid #EEF0F3;
4129 border-radius: 50px;
4130 background: #FFFFFF;
4131 color: #363B4E !important;
4132 font-size: 14px;
4133 font-weight: 400;
4134 cursor: pointer;
4135 margin-left: 12px;
4136 transition: border-color 0.2s, color 0.2s;
4137 }
4138 .template-library-modal .funnel-templates-header .sync-library-btn span {
4139 color: inherit;
4140 }
4141 .template-library-modal .funnel-templates-header .sync-library-btn svg {
4142 flex-shrink: 0;
4143 }
4144 .template-library-modal .funnel-templates-header .sync-library-btn:hover:not(:disabled) {
4145 border-color: #b3b8c7;
4146 color: #1a1f2e;
4147 }
4148 .template-library-modal .funnel-templates-header .sync-library-btn:disabled {
4149 opacity: 0.65;
4150 cursor: not-allowed;
4151 }
4152 .template-library-modal .funnel-templates-header .sync-library-btn .spinning {
4153 animation: sync-spin 1s linear infinite;
4154 }
4155 @keyframes sync-spin {
4156 from {
4157 transform: rotate(0deg);
4158 }
4159 to {
4160 transform: rotate(360deg);
4161 }
4162 }
4163 .template-library-modal .funnel-templates-header .wpfnl-template-header-title-wrapper {
4164 display: flex;
4165 align-items: center;
4166 }
4167 .template-library-modal .funnel-templates-header .template-type-filter {
4168 display: block;
4169 width: auto;
4170 margin-left: auto;
4171 border: 1px solid #EEF0F3;
4172 height: 38px;
4173 border-radius: 50px;
4174 color: #363B4E;
4175 letter-spacing: -0.01em;
4176 -moz-appearance: none; /* Firefox */
4177 -webkit-appearance: none; /* Safari and Chrome */
4178 appearance: none;
4179 background: transparent;
4180 background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgNyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTAuODEzIDFsLTQuNSA0LjUtNC41LTQuNSIvPjwvc3ZnPg==");
4181 background-repeat: no-repeat;
4182 background-position-x: calc(100% - 15px);
4183 background-position-y: 13px;
4184 background-size: 12px 12px;
4185 padding-top: 0px;
4186 }
4187 .template-library-modal .funnel-templates-header .funnel-global-import {
4188 min-width: 152px;
4189 display: flex;
4190 justify-content: flex-end;
4191 align-items: center;
4192 }
4193 .template-library-modal .funnel-templates-header .funnel-global-import .btn-default {
4194 height: 40px;
4195 line-height: 41px;
4196 position: relative;
4197 padding: 0 20px;
4198 min-width: auto;
4199 box-shadow: 0px 10px 16px rgba(97, 103, 116, 0.15);
4200 border-radius: 8px;
4201 }
4202 .template-library-modal .funnel-templates-header .funnel-global-import .btn-default .btn-text {
4203 position: relative;
4204 z-index: 1;
4205 color: #fff;
4206 font-weight: 500;
4207 }
4208 .template-library-modal .funnel-templates-header .funnel-global-import .btn-default .pro-tag {
4209 position: absolute;
4210 top: -21px;
4211 right: 10px;
4212 }
4213 .template-library-modal .funnel-templates-header .funnel-global-import .global-import-progress {
4214 position: absolute;
4215 left: 0;
4216 bottom: 0;
4217 width: 0;
4218 height: 100%;
4219 background: #8b5ef3;
4220 border-radius: 10px;
4221 z-index: 0;
4222 transition: all 0.4s linear;
4223 }
4224 .template-library-modal .funnel-templates-header .responsive-switcher {
4225 border: 1px solid #E4E6EB;
4226 border-radius: 8px;
4227 margin-left: -10%;
4228 }
4229 .template-library-modal .funnel-templates-header .responsive-switcher button {
4230 background: transparent;
4231 border: none;
4232 padding: 10px 10px;
4233 border-right: 1px solid #E4E6EB;
4234 cursor: pointer;
4235 }
4236 .template-library-modal .funnel-templates-header .responsive-switcher button:last-child {
4237 border-right: none;
4238 }
4239 .template-library-modal .funnel-templates-header .responsive-switcher button.active svg path,
4240 .template-library-modal .funnel-templates-header .responsive-switcher button.active svg rect {
4241 stroke: #6E42D3;
4242 }
4243 .template-library-modal .funnel-templates-header .responsive-switcher button.active svg circle {
4244 fill: #6E42D3;
4245 }
4246 .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 {
4247 fill: #6E42D3;
4248 }
4249 .template-library-modal .funnel-templates-body {
4250 display: flex;
4251 flex-flow: row wrap;
4252 height: calc(100% - 78px);
4253 }
4254 .template-library-modal .funnel-templates-sidebar {
4255 background: #FFFFFF;
4256 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
4257 width: 247px;
4258 padding: 19px 20px;
4259 }
4260 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav {
4261 display: flex;
4262 margin-bottom: 24px;
4263 }
4264 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span {
4265 font-size: 14px;
4266 line-height: 1.3;
4267 font-weight: 600;
4268 color: #292C2F;
4269 flex: 1;
4270 text-align: center;
4271 display: block;
4272 border-bottom: 1px solid #E4E6EB;
4273 padding-bottom: 15px;
4274 cursor: pointer;
4275 position: relative;
4276 }
4277 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span:before {
4278 content: "";
4279 position: absolute;
4280 bottom: 0;
4281 left: 0;
4282 width: 100%;
4283 height: 2px;
4284 background: #6E42D3;
4285 display: none;
4286 }
4287 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span.active {
4288 color: #6E42D3;
4289 }
4290 .template-library-modal .funnel-templates-sidebar .sidebar-tab-nav > span.active:before {
4291 display: block;
4292 }
4293 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper {
4294 height: 720px;
4295 padding-right: 8px;
4296 overflow: auto;
4297 }
4298 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper::-webkit-scrollbar {
4299 width: 5px;
4300 }
4301 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper::-webkit-scrollbar-track {
4302 background: #f2f5f8;
4303 }
4304 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper::-webkit-scrollbar-thumb {
4305 background-color: #BCC0C3;
4306 border-radius: 20px;
4307 }
4308 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li {
4309 font-weight: 500;
4310 font-size: 14px;
4311 line-height: 1.3;
4312 letter-spacing: -0.01em;
4313 color: #363B4E;
4314 background: #FFFFFF;
4315 border: 1px solid #EEF0F3;
4316 border-radius: 8px;
4317 padding: 12px 16px;
4318 margin-bottom: 14px;
4319 cursor: pointer;
4320 display: flex;
4321 align-items: center;
4322 gap: 7px;
4323 transition: all 0.3s ease;
4324 }
4325 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li.active, .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li:hover {
4326 color: #6E42D3;
4327 border-color: #6E42D3;
4328 box-shadow: 0px 20px 16px rgba(189, 193, 200, 0.2);
4329 }
4330 .template-library-modal .funnel-templates-sidebar .category-filter-wrapper ul li svg {
4331 position: relative;
4332 top: -1px;
4333 display: block;
4334 min-width: 20px;
4335 }
4336 .template-library-modal .funnel-templates-sidebar .wpfnl-create-step__filter-nav {
4337 width: 100%;
4338 min-height: auto;
4339 background: transparent;
4340 box-shadow: none;
4341 padding: 0;
4342 align-self: stretch;
4343 }
4344 .template-library-modal .funnel-templates-content {
4345 width: calc(100% - 247px);
4346 height: 100%;
4347 overflow-y: auto;
4348 position: relative;
4349 padding: 40px;
4350 box-sizing: border-box;
4351 }
4352 .template-library-modal .funnel-templates-content .not-clickable-overlay {
4353 z-index: 9;
4354 }
4355 .template-library-modal .funnel-templates-content .template-cat-filter-loader {
4356 position: absolute;
4357 inset: 0;
4358 z-index: 100;
4359 background: rgba(255, 255, 255, 0.8);
4360 backdrop-filter: blur(2px);
4361 display: flex;
4362 align-items: center;
4363 justify-content: center;
4364 border-radius: 4px;
4365 opacity: 0;
4366 visibility: hidden;
4367 transition: opacity 0.15s ease, visibility 0.15s ease;
4368 pointer-events: none;
4369 }
4370 .template-library-modal .funnel-templates-content .template-cat-filter-loader .wpfnl-loader {
4371 display: block;
4372 width: 50px;
4373 height: 50px;
4374 margin: 0;
4375 position: sticky;
4376 top: 50%;
4377 border-width: 3px;
4378 border-top-width: 3px;
4379 flex-shrink: 0;
4380 }
4381 .template-library-modal .funnel-templates-content .template-cat-filter-loader.show-loader {
4382 opacity: 1;
4383 visibility: visible;
4384 pointer-events: all;
4385 }
4386 .template-library-modal .no-sidebar .funnel-templates-content {
4387 width: 100%;
4388 }
4389 .template-library-modal .wpfnl-create-funnel__templates {
4390 position: relative;
4391 min-height: 370px;
4392 display: flex;
4393 flex-flow: row wrap;
4394 gap: 40px;
4395 }
4396 .template-library-modal .wpfnl-create-funnel__templates .wpfnl-create-funnel__loader {
4397 position: absolute;
4398 top: 0;
4399 left: 0;
4400 width: 100%;
4401 height: 100%;
4402 background: #f6f6f8;
4403 display: flex;
4404 flex-flow: column;
4405 align-items: center;
4406 justify-content: flex-start;
4407 z-index: 9;
4408 }
4409 .template-library-modal .wpfnl-create-funnel__templates .wpfnl-create-funnel__loader .wpfnl-loader {
4410 display: block;
4411 width: 40px;
4412 height: 40px;
4413 margin-top: 12%;
4414 }
4415 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
4416 width: calc(25% - 30px);
4417 position: relative;
4418 }
4419 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .freemium-tag {
4420 position: absolute;
4421 top: 10px;
4422 right: 10px;
4423 z-index: 1;
4424 padding: 3px 8px 4px;
4425 background-color: #2FCF5C;
4426 font-size: 10px;
4427 border-radius: 5px;
4428 }
4429 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch {
4430 background-color: transparent;
4431 border: 2px dashed #A1A1B6;
4432 border-radius: 10px;
4433 }
4434 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice,
4435 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default {
4436 height: 48px;
4437 line-height: 49px;
4438 width: 100%;
4439 max-width: 194px;
4440 padding: 0 8px;
4441 border-radius: 12px;
4442 position: absolute;
4443 top: 50%;
4444 left: 50%;
4445 transform: translate(-50%, -50%);
4446 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
4447 }
4448 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice svg,
4449 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default svg {
4450 margin-right: 2px;
4451 }
4452 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice path,
4453 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default path {
4454 stroke: #fff;
4455 }
4456 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .pro-tag {
4457 position: absolute;
4458 top: -23px;
4459 right: 11px;
4460 }
4461 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .wpfnl-single-remote-wrapper {
4462 opacity: 0;
4463 visibility: hidden;
4464 }
4465 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice {
4466 max-width: 100%;
4467 text-align: center;
4468 padding: 15px;
4469 height: auto;
4470 line-height: normal;
4471 border-radius: 0;
4472 box-shadow: none;
4473 }
4474 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice p {
4475 color: #d24d4d;
4476 line-height: 1.6;
4477 }
4478 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.show-step-preview {
4479 width: 100%;
4480 margin: 0;
4481 background: transparent;
4482 border-radius: 0;
4483 }
4484 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .wpfnl-single-remote-wrapper {
4485 position: relative;
4486 background: #ffffff;
4487 border-radius: 10px;
4488 height: 100%;
4489 transition: all 0.3s ease;
4490 }
4491 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .wpfnl-single-remote-template {
4492 position: relative;
4493 }
4494 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-image-wrapper {
4495 background-repeat: no-repeat;
4496 background-size: 100% auto;
4497 background-position: top center;
4498 border-radius: 10px 10px 0 0;
4499 position: relative;
4500 overflow: hidden;
4501 }
4502 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-image-wrapper:before {
4503 content: "";
4504 display: block;
4505 padding-top: 100%;
4506 }
4507 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-img {
4508 width: 100%;
4509 border-radius: 10px 10px 0 0;
4510 height: 350px;
4511 object-fit: contain;
4512 }
4513 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .importar-loader {
4514 background: rgba(38, 33, 51, 0.6);
4515 -webkit-backdrop-filter: blur(7px);
4516 backdrop-filter: blur(7px);
4517 }
4518 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .funnel-template-info {
4519 text-align: center;
4520 padding: 14px;
4521 background: #ffffff;
4522 border-radius: 0 0 10px 10px;
4523 position: relative;
4524 border-top: 1px solid #E5E8F3;
4525 }
4526 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .funnel-template-info .title {
4527 color: #363B4E;
4528 padding: 0;
4529 min-height: auto;
4530 display: block;
4531 font-weight: 500;
4532 transition: all 0.3s ease;
4533 }
4534 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .funnel-template-info .steps {
4535 color: #7A8B9A;
4536 letter-spacing: -0.01em;
4537 font-size: 12px;
4538 }
4539 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template:hover .wpfnl-single-remote-wrapper {
4540 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.2);
4541 }
4542 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template:hover .template-action {
4543 opacity: 1;
4544 visibility: visible;
4545 }
4546 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper {
4547 gap: 40px;
4548 position: relative;
4549 width: 100%;
4550 display: flex;
4551 flex-flow: row wrap;
4552 align-items: flex-start;
4553 }
4554 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
4555 width: calc(20% - 32px);
4556 }
4557 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper {
4558 margin: auto;
4559 width: 100%;
4560 }
4561 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper {
4562 display: flex;
4563 align-items: center;
4564 width: 100%;
4565 justify-content: center;
4566 gap: 10px;
4567 margin-bottom: 40px;
4568 }
4569 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step {
4570 width: 80px;
4571 text-align: center;
4572 }
4573 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step span {
4574 border-radius: 6px;
4575 background: #FFF;
4576 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;
4577 padding: 3px;
4578 cursor: pointer;
4579 display: block;
4580 border: 1px solid transparent;
4581 min-height: 80px;
4582 }
4583 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step span img {
4584 width: 70px;
4585 height: 70px;
4586 }
4587 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step p {
4588 color: #6B7589;
4589 font-size: 12px;
4590 margin-top: 10px;
4591 text-transform: capitalize;
4592 }
4593 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step.active span {
4594 border-color: #6E42D3;
4595 }
4596 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-steps-wrapper .wpfnl-template-step.active p {
4597 color: #6E42D3;
4598 }
4599 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview {
4600 width: 100%;
4601 background: #FFF;
4602 margin: auto;
4603 }
4604 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview .wpfnl-preview-checkout-placeholder {
4605 min-height: 650px;
4606 display: flex;
4607 align-items: center;
4608 justify-content: center;
4609 padding: 20px 0;
4610 }
4611 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.mobile {
4612 width: 425px;
4613 }
4614 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.tablet {
4615 width: 768px;
4616 }
4617 .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 {
4618 padding: 50px 10px 60px;
4619 box-shadow: 0 14px 28px 0 rgba(0, 0, 0, 0.0588235294);
4620 border-radius: 30px;
4621 position: relative;
4622 }
4623 .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 {
4624 border: 1px solid rgba(15, 12, 9, 0.1);
4625 }
4626 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview .wpfnl-template-iframe-wrapper {
4627 position: relative;
4628 }
4629 .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 {
4630 position: absolute;
4631 width: 100%;
4632 height: 100%;
4633 top: 0;
4634 display: none;
4635 align-items: center;
4636 justify-content: center;
4637 background: rgba(38, 27, 103, 0.2);
4638 }
4639 .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 {
4640 display: flex;
4641 }
4642 .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 {
4643 display: block;
4644 width: 50px;
4645 height: 50px;
4646 }
4647 .template-library-modal .wpfnl-create-funnel__templates .step-title-wrapper {
4648 position: absolute;
4649 top: 0;
4650 left: 0;
4651 }
4652 .template-library-modal .wpfnl-create-funnel__templates .step-title-wrapper .title {
4653 font-weight: 500;
4654 font-size: 18px;
4655 line-height: 1;
4656 color: #363B4E;
4657 }
4658 .template-library-modal .wpfnl-create-funnel-layout {
4659 width: 100%;
4660 background: #F6F5FA;
4661 border-radius: 14px;
4662 max-width: 1093px;
4663 position: fixed;
4664 top: 50% !important;
4665 left: calc(50% + 80px);
4666 transform: translate(-50%, -50%);
4667 height: 80%;
4668 max-height: 690px;
4669 }
4670 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout {
4671 height: auto;
4672 max-height: none;
4673 max-width: 520px;
4674 padding: 25px;
4675 }
4676 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-confirm-body {
4677 height: auto;
4678 }
4679 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-title {
4680 font-size: 20px;
4681 font-weight: 600;
4682 color: #2D3149;
4683 margin: 0 0 10px;
4684 line-height: 1.3;
4685 }
4686 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-subtitle {
4687 font-size: 14px;
4688 font-weight: 600;
4689 color: #2D3149;
4690 margin: 0 0 14px;
4691 }
4692 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-feature-list {
4693 list-style: none;
4694 padding: 0;
4695 margin: 0 0 18px;
4696 display: flex;
4697 flex-direction: column;
4698 gap: 10px;
4699 }
4700 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-feature-list li {
4701 display: flex;
4702 align-items: center;
4703 gap: 10px;
4704 font-size: 14px;
4705 color: #6B7280;
4706 }
4707 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-feature-list li svg {
4708 flex-shrink: 0;
4709 }
4710 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-desc {
4711 font-size: 13px;
4712 color: #6B7280;
4713 line-height: 1.6;
4714 margin: 0 0 24px;
4715 }
4716 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .button-area {
4717 margin-top: 0;
4718 }
4719 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions {
4720 display: flex;
4721 align-items: center;
4722 justify-content: flex-end;
4723 gap: 12px;
4724 }
4725 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-cancel {
4726 display: inline-flex;
4727 align-items: center;
4728 justify-content: center;
4729 height: 38px;
4730 padding: 0 24px;
4731 font-size: 14px;
4732 font-weight: 500;
4733 color: #6E42D3;
4734 background: transparent;
4735 border: 1.5px solid #6E42D3;
4736 border-radius: 10px;
4737 cursor: pointer;
4738 transition: all 0.3s ease;
4739 min-width: 100px;
4740 }
4741 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-cancel:hover {
4742 background: #f5f0ff;
4743 }
4744 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-create-store-checkout {
4745 min-width: 180px;
4746 height: 38px;
4747 line-height: 38px;
4748 padding: 0 24px;
4749 }
4750 .template-library-modal .wpfnl-create-funnel-layout.store-checkout-layout .store-checkout-modal-actions .btn-create-store-checkout:disabled {
4751 opacity: 0.7;
4752 cursor: not-allowed;
4753 }
4754 .template-library-modal .wpfnl-create-funnel-layout .close {
4755 position: absolute;
4756 border: none;
4757 right: -11px;
4758 top: -13px;
4759 display: flex;
4760 width: 40px;
4761 height: 40px;
4762 padding: 8px;
4763 justify-content: center;
4764 flex-flow: column;
4765 align-items: center;
4766 border-radius: 100px;
4767 background: #FFF;
4768 box-shadow: 0px 1px 1px 0px #DADADA;
4769 cursor: pointer;
4770 }
4771 .template-library-modal .wpfnl-create-funnel-layout .wpfnl-form-group {
4772 margin-bottom: 23px;
4773 }
4774 .template-library-modal .wpfnl-create-funnel-layout .wpfnl-form-group > label {
4775 color: #2D3149;
4776 font-size: 15px;
4777 font-weight: 500;
4778 line-height: 1.3;
4779 margin-bottom: 7px;
4780 display: block;
4781 }
4782 .template-library-modal .wpfnl-create-funnel-layout .modal-body {
4783 height: 100%;
4784 }
4785 .template-library-modal .wpfnl-create-funnel-layout .modal-body input[type=text] {
4786 margin-bottom: 0;
4787 border-radius: 8px;
4788 background: #FFF;
4789 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
4790 border: none;
4791 font-weight: 300;
4792 }
4793 .template-library-modal .wpfnl-create-funnel-layout .modal-body button[type=submit] {
4794 width: auto;
4795 }
4796 .template-library-modal .wpfnl-create-funnel-layout .layout-title {
4797 color: #2D3149;
4798 font-size: 15px;
4799 font-weight: 500;
4800 line-height: 1.3;
4801 margin-bottom: 9px;
4802 }
4803 .template-library-modal .wpfnl-create-funnel-layout form {
4804 height: 100%;
4805 }
4806 .template-library-modal .wpfnl-create-funnel-layout .funnels-layout-wrapper {
4807 display: flex;
4808 flex-flow: row wrap;
4809 gap: 20px;
4810 border-bottom: 1px solid #E5E1F1;
4811 padding-bottom: 20px;
4812 margin-bottom: 20px;
4813 overflow: auto;
4814 height: 100%;
4815 max-height: calc(100% - 176px);
4816 }
4817 .template-library-modal .wpfnl-create-funnel-layout .single-layout {
4818 width: calc(33.3333333333% - 14px);
4819 position: relative;
4820 }
4821 .template-library-modal .wpfnl-create-funnel-layout .single-layout .pro-tag {
4822 position: absolute;
4823 right: 24px;
4824 top: 24px;
4825 z-index: 2;
4826 border-radius: 5px;
4827 background: #2FCF5C;
4828 box-shadow: 0px 4px 6px 0px #E0DEE5;
4829 font-size: 12px;
4830 font-weight: 700;
4831 line-height: 1;
4832 padding: 3px 6px;
4833 }
4834 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner {
4835 border-radius: 16px;
4836 border: 1px solid #EBE9F5;
4837 box-shadow: 0px 8px 8px 0px rgba(226, 223, 237, 0.3);
4838 padding: 10px;
4839 display: block;
4840 background: #fff;
4841 transition: all 0.3s ease;
4842 cursor: pointer;
4843 position: relative;
4844 overflow: hidden;
4845 }
4846 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner:before {
4847 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgNjMgNTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGNpcmNsZSBjeD0iNDIuNSIgY3k9IjkuNSIgcj0iNDIuNSIgZmlsbD0iIzZFNDJEMyIvPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF80ODRfMTMpIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNNDAuNDg5IDE3LjU5NmExLjc0NSAxLjc0NSAwIDAwLTIuNDY4IDBMMjYuOTE1IDI4LjcwMmwtNC45MzYtNC45MzZhMS43NDUgMS43NDUgMCAxMC0yLjQ2OCAyLjQ2OGw2LjE3IDYuMTdjLjM0LjM0Ljc4Ny41MTEgMS4yMzQuNTExLjQ0NyAwIC44OTMtLjE3IDEuMjM0LS41MTFsMTIuMzQtMTIuMzRhMS43NDUgMS43NDUgMCAwMDAtMi40Njh6Ii8+PC9nPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDBfNDg0XzEzIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMCAwaDIydjIySDB6IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxOSAxNCkiLz48L2NsaXBQYXRoPjwvZGVmcz48L3N2Zz4=");
4848 position: absolute;
4849 right: -2px;
4850 top: -2px;
4851 display: block;
4852 width: 58px;
4853 opacity: 0;
4854 visibility: hidden;
4855 transition: all 0.3s ease;
4856 }
4857 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner.is-pro {
4858 cursor: not-allowed;
4859 }
4860 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner.is-pro:after {
4861 content: "";
4862 position: absolute;
4863 left: 0;
4864 top: 0;
4865 width: 100%;
4866 height: 100%;
4867 background: rgba(255, 255, 255, 0.4588235294);
4868 border-radius: 16px;
4869 z-index: 1;
4870 }
4871 .template-library-modal .wpfnl-create-funnel-layout .single-layout.active .single-layout-inner {
4872 border-color: #6E42D3;
4873 }
4874 .template-library-modal .wpfnl-create-funnel-layout .single-layout.active .single-layout-inner::before {
4875 opacity: 1;
4876 visibility: visible;
4877 }
4878 .template-library-modal .wpfnl-create-funnel-layout .inner-box {
4879 border-radius: 16px;
4880 background: #CEE4DD;
4881 display: flex;
4882 align-items: center;
4883 justify-content: center;
4884 flex-flow: column;
4885 height: 185px;
4886 padding: 15px;
4887 }
4888 .template-library-modal .wpfnl-create-funnel-layout .inner-box svg {
4889 max-width: 100%;
4890 }
4891 .template-library-modal .wpfnl-create-funnel-layout .layout2 .inner-box {
4892 background-color: #F3E8FF;
4893 }
4894 .template-library-modal .wpfnl-create-funnel-layout .layout3 .inner-box {
4895 background-color: rgba(167, 204, 245, 0.3019607843);
4896 }
4897 .template-library-modal .wpfnl-create-funnel-layout .layout4 .inner-box {
4898 background-color: #FDF2CB;
4899 }
4900 .template-library-modal .wpfnl-create-funnel-layout .layout5 .inner-box {
4901 background-color: #E5F0FC;
4902 }
4903 .template-library-modal .wpfnl-create-funnel-layout .layout6 .inner-box {
4904 background-color: #FFEAE1;
4905 }
4906 .template-library-modal .wpfnl-create-funnel-layout input[type=radio]:checked + .single-layout-inner {
4907 border-color: #6E42D3;
4908 }
4909 .template-library-modal .wpfnl-create-funnel-layout .button-area {
4910 text-align: right;
4911 display: flex;
4912 flex-flow: row wrap;
4913 align-items: center;
4914 justify-content: flex-end;
4915 gap: 10px;
4916 }
4917 .template-library-modal .wpfnl-create-funnel-layout .button-area .wpfnl-alert.box {
4918 padding: 10px 20px;
4919 }
4920
4921 #create-funnel-loader {
4922 position: absolute;
4923 left: 50%;
4924 top: 50%;
4925 z-index: 99;
4926 opacity: 0;
4927 visibility: hidden;
4928 margin-left: -50px;
4929 margin-top: -50px;
4930 }
4931 #create-funnel-loader.show {
4932 opacity: 1;
4933 visibility: visible;
4934 }
4935
4936 .create-funnel-loader-overlay#create-funnel-loader {
4937 background: #ffffff;
4938 position: fixed;
4939 left: 160px;
4940 top: 0;
4941 width: calc(100% - 160px);
4942 height: 100%;
4943 z-index: 100;
4944 display: none;
4945 margin: 0;
4946 }
4947 .create-funnel-loader-overlay#create-funnel-loader.show {
4948 display: block;
4949 }
4950 .create-funnel-loader-overlay#create-funnel-loader.create-funnel-shimmer-overlay {
4951 display: flex;
4952 }
4953 .create-funnel-loader-overlay#create-funnel-loader .wpfnl-loader {
4954 display: block;
4955 position: absolute;
4956 top: 50%;
4957 left: 50%;
4958 transform: translate(-50%, -50%);
4959 width: 40px;
4960 height: 40px;
4961 margin: 0;
4962 }
4963
4964 body.folded .create-funnel-loader-overlay#create-funnel-loader {
4965 left: 36px;
4966 width: calc(100% - 36px);
4967 }
4968
4969 .wpfnl-missing-plugin-notice {
4970 width: 60% !important;
4971 background: #fff;
4972 border-color: transparent !important;
4973 padding: 30px;
4974 border-radius: 10px;
4975 }
4976 .wpfnl-missing-plugin-notice .wpfnl-notice-title {
4977 font-size: 20px;
4978 font-weight: 500;
4979 color: #0e2244;
4980 margin-bottom: 10px;
4981 }
4982 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body span, .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p {
4983 color: #0e2244;
4984 font-size: 16px;
4985 line-height: 1.6;
4986 }
4987 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p {
4988 margin-bottom: 10px;
4989 }
4990 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p.note {
4991 margin-bottom: 0;
4992 }
4993 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body p b {
4994 font-weight: 500;
4995 }
4996 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body a {
4997 font-size: 16px;
4998 font-weight: 500;
4999 color: #6E42D3;
5000 }
5001 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body a:hover {
5002 text-decoration: none;
5003 }
5004 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .dot-wrapper span {
5005 margin-left: 0px;
5006 font-weight: 700;
5007 }
5008 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .wpfnl-plugin-installation-error {
5009 color: #d24d4d;
5010 display: block;
5011 margin-top: 10px;
5012 font-style: italic;
5013 font-size: 14px;
5014 }
5015 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .wpfnl-plugin-installation-error a {
5016 font-size: 14px;
5017 }
5018 .wpfnl-missing-plugin-notice .wpfnl-notice-notice-body .wpfnl-plugin-installation-error a:hover {
5019 text-decoration: underline;
5020 }
5021
5022 .importar-loader {
5023 position: absolute;
5024 top: 0;
5025 left: 0;
5026 width: 100%;
5027 height: 100%;
5028 background: rgba(51, 51, 51, 0.7);
5029 transition: all 0.3s ease;
5030 cursor: default;
5031 z-index: 2;
5032 border-radius: 10px 10px 0 0;
5033 }
5034 .importar-loader .title-wrapper {
5035 width: 100%;
5036 height: 100%;
5037 display: flex;
5038 align-items: center;
5039 justify-content: center;
5040 }
5041 .importar-loader .title {
5042 text-transform: capitalize;
5043 font-size: 16px;
5044 color: #fff;
5045 }
5046
5047 .folded .template-library-modal {
5048 left: 36px;
5049 width: calc(100% - 36px);
5050 }
5051
5052 @media only screen and (max-width: 1699px) {
5053 .template-library-modal .wpfnl-create-funnel__templates {
5054 gap: 30px;
5055 }
5056 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
5057 width: calc(25% - 23px);
5058 }
5059 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template .template-action .btn-default,
5060 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template .template-action .btn-default {
5061 padding: 9px 12px 7px;
5062 font-size: 14px;
5063 }
5064 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default {
5065 max-width: 174px;
5066 }
5067 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper {
5068 gap: 30px;
5069 }
5070 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
5071 width: calc(20% - 24px);
5072 }
5073 }
5074 @media only screen and (max-width: 1399px) {
5075 .template-library-modal .funnel-templates-content {
5076 padding: 30px;
5077 }
5078 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
5079 width: calc(33.3333333333% - 20px);
5080 }
5081 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
5082 width: calc(25% - 23px);
5083 }
5084 .template-library-modal .wpfnl-create-funnel-layout {
5085 max-width: 913px;
5086 }
5087 .template-library-modal .wpfnl-create-funnel-layout .inner-box {
5088 height: 175px;
5089 }
5090 }
5091 @media only screen and (max-width: 1199px) {
5092 .template-library-modal .funnel-templates-content {
5093 padding: 20px;
5094 }
5095 .template-library-modal .funnel-templates-sidebar {
5096 padding: 19px 15px;
5097 }
5098 .template-library-modal .wpfnl-create-funnel__templates {
5099 gap: 20px;
5100 }
5101 .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
5102 width: calc(50% - 10px);
5103 }
5104 .funnel-templates-content .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5105 width: calc(50% - 10px);
5106 }
5107 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper {
5108 gap: 20px;
5109 }
5110 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-step__single-template {
5111 width: calc(33.3333333333% - 14px);
5112 }
5113 .wpfnl-missing-plugin-notice {
5114 width: calc(50% - 30px) !important;
5115 padding: 20px;
5116 }
5117 .template-library-modal .wpfnl-create-funnel-layout {
5118 max-width: 780px;
5119 max-height: 585px;
5120 }
5121 .template-library-modal .wpfnl-create-funnel-layout .single-layout {
5122 width: calc(33.3333333333% - 8px);
5123 }
5124 .template-library-modal .wpfnl-create-funnel-layout .funnels-layout-wrapper {
5125 gap: 12px;
5126 max-height: calc(100% - 180px);
5127 }
5128 .template-library-modal .wpfnl-create-funnel-layout .single-layout-inner {
5129 border-radius: 10px;
5130 padding: 5px;
5131 }
5132 .template-library-modal .wpfnl-create-funnel-layout .inner-box {
5133 height: 145px;
5134 border-radius: 8px;
5135 }
5136 .template-library-modal .wpfnl-create-funnel__templates .steps-preview-wrapper .wpfnl-template-preview-wrapper .wpfnl-template-step-preview.desktop {
5137 width: 992px;
5138 transform: scale(0.7);
5139 transform-origin: left top;
5140 margin-left: 10%;
5141 }
5142 }
5143 @media only screen and (max-width: 960px) {
5144 .template-library-modal {
5145 left: 36px;
5146 width: calc(100% - 36px);
5147 }
5148 .template-library-modal .wpfnl-create-funnel-layout {
5149 left: calc(50% + 20px);
5150 }
5151 }
5152 .step-template-showcase-modal .wpfnl-step__single-template, .template-library-modal .wpfnl-step__single-template {
5153 position: relative;
5154 background: #ffffff;
5155 width: calc(25% - 30px);
5156 border-radius: 10px;
5157 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
5158 transition: all 0.3s ease;
5159 }
5160 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template, .template-library-modal .create__from-scratch.wpfnl-step__single-template {
5161 border: 2px dashed #A1A1B6;
5162 box-shadow: none !important;
5163 background: transparent;
5164 }
5165 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template:hover, .template-library-modal .create__from-scratch.wpfnl-step__single-template:hover {
5166 box-shadow: none !important;
5167 }
5168 .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 {
5169 height: 48px;
5170 line-height: 49px;
5171 width: 100%;
5172 max-width: 194px;
5173 position: absolute;
5174 top: 50%;
5175 left: 50%;
5176 transform: translate(-50%, -50%);
5177 border-radius: 12px;
5178 padding: 0 15px;
5179 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.5);
5180 }
5181 .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 {
5182 margin-right: 3px;
5183 }
5184 .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 {
5185 stroke: #fff;
5186 }
5187 .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,
5188 .step-template-showcase-modal .create__from-scratch.wpfnl-step__single-template .template-preview-image,
5189 .template-library-modal .create__from-scratch.wpfnl-step__single-template .template-preview-image {
5190 opacity: 0;
5191 visibility: hidden;
5192 }
5193 .step-template-showcase-modal .wpfnl-step__single-template .importar-loader, .template-library-modal .wpfnl-step__single-template .importar-loader {
5194 background: rgba(38, 33, 51, 0.6);
5195 -webkit-backdrop-filter: blur(7px);
5196 backdrop-filter: blur(7px);
5197 }
5198 .step-template-showcase-modal .wpfnl-step__single-template .template-preview-image, .template-library-modal .wpfnl-step__single-template .template-preview-image {
5199 position: relative;
5200 }
5201 .step-template-showcase-modal .wpfnl-step__single-template .step-image-wrapper, .template-library-modal .wpfnl-step__single-template .step-image-wrapper {
5202 border-radius: 10px 10px 0 0;
5203 background-repeat: no-repeat;
5204 background-size: 100% auto;
5205 background-position: center 0;
5206 position: relative;
5207 overflow: hidden;
5208 }
5209 .step-template-showcase-modal .wpfnl-step__single-template .step-image-wrapper:before, .template-library-modal .wpfnl-step__single-template .step-image-wrapper:before {
5210 content: "";
5211 display: block;
5212 padding-top: 100%;
5213 }
5214 .step-template-showcase-modal .wpfnl-step__single-template .template-img, .template-library-modal .wpfnl-step__single-template .template-img {
5215 width: 100%;
5216 height: 350px;
5217 object-fit: contain;
5218 border-radius: 10px 10px 0px 0px;
5219 transition: all 0.3s ease;
5220 }
5221 .step-template-showcase-modal .wpfnl-step__single-template .step-template-info, .template-library-modal .wpfnl-step__single-template .step-template-info {
5222 border-radius: 0 0 10px 10px;
5223 position: relative;
5224 border-top: 1px solid #E5E8F3;
5225 }
5226 .step-template-showcase-modal .wpfnl-step__single-template .step-template-info .title, .template-library-modal .wpfnl-step__single-template .step-template-info .title {
5227 margin-bottom: 0;
5228 font-size: 14px;
5229 line-height: 1.2;
5230 color: #363B4E;
5231 font-weight: 500;
5232 padding: 19px 15px 17px;
5233 text-align: center;
5234 text-transform: capitalize;
5235 display: flex;
5236 flex-flow: row wrap;
5237 align-items: center;
5238 justify-content: center;
5239 transition: all 0.3s ease;
5240 }
5241 .step-template-showcase-modal .wpfnl-step__single-template:hover, .template-library-modal .wpfnl-step__single-template:hover {
5242 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.2);
5243 }
5244 .step-template-showcase-modal .wpfnl-step__single-template:hover .template-action, .template-library-modal .wpfnl-step__single-template:hover .template-action {
5245 opacity: 1;
5246 visibility: visible;
5247 }
5248
5249 .step-template-showcase-modal .wpfnl-create-step_inner-content {
5250 width: 100%;
5251 height: 100%;
5252 }
5253 .step-template-showcase-modal .wpfnl-create-step__template-wrapper {
5254 position: relative;
5255 min-height: 400px;
5256 max-height: 100%;
5257 overflow: auto;
5258 display: flex;
5259 flex-flow: row wrap;
5260 align-items: flex-start;
5261 }
5262 .step-template-showcase-modal .wpfnl-create-step__template-wrapper::-webkit-scrollbar {
5263 width: 5px;
5264 }
5265 .step-template-showcase-modal .wpfnl-create-step__template-wrapper::-webkit-scrollbar-track {
5266 background: #f2f5f8;
5267 }
5268 .step-template-showcase-modal .wpfnl-create-step__template-wrapper::-webkit-scrollbar-thumb {
5269 background-color: #d9dce0;
5270 border-radius: 20px;
5271 }
5272 .step-template-showcase-modal .steps-template__filter-wrapper {
5273 display: flex;
5274 flex-flow: row wrap;
5275 align-items: center;
5276 justify-content: flex-start;
5277 width: 100%;
5278 background: #FFFFFF;
5279 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.31);
5280 padding: 15px 24px;
5281 position: relative;
5282 }
5283 .step-template-showcase-modal .steps-template__filter-wrapper .wpfnl-modal-close {
5284 background: #FFFFFF;
5285 border-radius: 10px;
5286 height: 38px;
5287 width: 38px;
5288 margin-right: 15px;
5289 display: flex;
5290 flex-flow: column;
5291 align-items: center;
5292 justify-content: center;
5293 cursor: pointer;
5294 border: 1px solid #EEF0F3;
5295 }
5296 .step-template-showcase-modal .steps-template__filter-wrapper .step-showcase-title {
5297 font-weight: 500;
5298 font-size: 16px;
5299 line-height: 1.5;
5300 color: #363B4E;
5301 text-transform: capitalize;
5302 }
5303 .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter {
5304 margin-left: auto !important;
5305 }
5306 .step-template-showcase-modal .wpfnl-create-step__filter-nav {
5307 width: 228px;
5308 min-height: 835px;
5309 background: #FFFFFF;
5310 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
5311 padding: 24px;
5312 align-self: stretch;
5313 }
5314 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item {
5315 height: 44px;
5316 line-height: 44px;
5317 font-weight: 500;
5318 color: #363B4E;
5319 padding: 0 16px;
5320 margin: 0 0 15px 0;
5321 text-align: left;
5322 box-shadow: none;
5323 border: 1px solid #EEF0F3;
5324 border-radius: 8px;
5325 text-transform: capitalize;
5326 cursor: pointer;
5327 position: relative;
5328 transition: all 0.3s ease;
5329 background: #fff;
5330 display: flex;
5331 align-items: center;
5332 gap: 8px;
5333 }
5334 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item .pro-tag-icon {
5335 position: static;
5336 margin-top: 6px;
5337 margin-left: -4px;
5338 }
5339 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item svg {
5340 position: relative;
5341 top: -1px;
5342 }
5343 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item svg path {
5344 transition: all 0.3s ease;
5345 }
5346 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.disabled {
5347 cursor: not-allowed;
5348 color: #939393;
5349 background: #dcdbe3;
5350 }
5351 .step-template-showcase-modal .wpfnl-create-step__filter-nav .filter-nav-item.active {
5352 border-color: #6E42D3;
5353 color: #6E42D3;
5354 box-shadow: 0px 20px 16px rgba(189, 193, 200, 0.2);
5355 }
5356 .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 {
5357 fill: #6E42D3;
5358 stroke: #6E42D3;
5359 }
5360 .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 {
5361 fill: #6E42D3;
5362 }
5363 .step-template-showcase-modal .wpfnl-create-step__filter-nav .pro-tag {
5364 position: absolute;
5365 top: -6px;
5366 right: -2px;
5367 }
5368 .step-template-showcase-modal .create-step-name-modal {
5369 left: 50%;
5370 }
5371 .step-template-showcase-modal .wpfnl-step__templates-wrapper-before {
5372 padding: 30px 35px;
5373 width: calc(100% - 228px);
5374 box-shadow: none;
5375 }
5376 .step-template-showcase-modal .wpfnl-step__templates-wrapper-before .step-counter {
5377 font-size: 20px;
5378 line-height: 1.2;
5379 font-weight: 600;
5380 color: #363B4E;
5381 margin-bottom: 24px;
5382 text-transform: capitalize;
5383 }
5384 .step-template-showcase-modal .wpfnl-step__templates-wrapper {
5385 display: flex;
5386 flex-flow: row wrap;
5387 gap: 40px;
5388 }
5389 .step-template-showcase-modal .wpfnl-step__single-template .template-action {
5390 flex-flow: row;
5391 }
5392
5393 @media only screen and (max-width: 1699px) {
5394 .step-template-showcase-modal .wpfnl-step__templates-wrapper {
5395 gap: 30px;
5396 }
5397 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5398 width: calc(25% - 23px);
5399 }
5400 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template .template-action .step-btn {
5401 padding: 9px 12px 7px;
5402 font-size: 14px;
5403 }
5404 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template.create__from-scratch .btn-default {
5405 max-width: 174px;
5406 }
5407 }
5408 @media only screen and (max-width: 1399px) {
5409 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5410 width: calc(33.3333333333% - 20px);
5411 }
5412 .step-template-showcase-modal.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template,
5413 .step-template-showcase-modal .wpfnl-ab-steps .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5414 width: calc(25% - 23px);
5415 }
5416 }
5417 @media only screen and (max-width: 1199px) {
5418 .step-template-showcase-modal .wpfnl-create-step__filter-nav {
5419 width: 198px;
5420 padding: 20px;
5421 }
5422 .step-template-showcase-modal .wpfnl-step__templates-wrapper-before {
5423 padding: 20px 20px;
5424 width: calc(100% - 198px);
5425 }
5426 .step-template-showcase-modal .wpfnl-step__templates-wrapper {
5427 gap: 20px;
5428 }
5429 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5430 width: calc(33.3333333333% - 14px);
5431 }
5432 .step-template-showcase-modal.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template,
5433 .step-template-showcase-modal .wpfnl-ab-steps .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5434 width: calc(33.3333333333% - 14px);
5435 }
5436 }
5437 @media only screen and (max-width: 991px) {
5438 .step-template-showcase-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5439 width: calc(50% - 10px);
5440 }
5441 .step-template-showcase-modal.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper .wpfnl-step__single-template,
5442 .step-template-showcase-modal .wpfnl-ab-steps .wpfnl-step__templates-wrapper .wpfnl-step__single-template {
5443 width: calc(50% - 10px);
5444 }
5445 }
5446 .funnel-list__wrapper {
5447 height: 100%;
5448 background-color: #ffffff;
5449 border-radius: 10px;
5450 }
5451 .funnel-list__wrapper .funnel__single-list {
5452 display: flex;
5453 flex-flow: row wrap;
5454 align-items: center;
5455 justify-content: space-between;
5456 padding: 14px 24px 14px 60px;
5457 position: relative;
5458 border-bottom: 1px solid #EBEDF0;
5459 gap: 12px;
5460 }
5461 .funnel-list__wrapper .funnel__single-list:last-child {
5462 margin-bottom: 0;
5463 }
5464 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper {
5465 position: absolute;
5466 top: 0;
5467 left: 60px;
5468 width: calc(100% - 60px);
5469 display: none;
5470 align-items: center;
5471 gap: 10px;
5472 z-index: 3;
5473 background: #ffffff;
5474 padding: 8px 0 6px;
5475 height: 100%;
5476 border-radius: 0 10px 0 0;
5477 }
5478 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler {
5479 font-weight: 400;
5480 font-size: 12px;
5481 line-height: 1.2;
5482 letter-spacing: -0.01em;
5483 padding: 7px 11px;
5484 min-width: auto;
5485 height: auto;
5486 border-radius: 50px;
5487 position: relative;
5488 background-color: #6E42D3;
5489 }
5490 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler:before {
5491 content: "";
5492 position: absolute;
5493 right: 27px;
5494 top: 0;
5495 height: 100%;
5496 width: 1px;
5497 background: #9373EA;
5498 }
5499 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler > svg {
5500 margin-left: 16px;
5501 }
5502 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler.show-dropdown .wpfnl-dropdown {
5503 opacity: 1;
5504 visibility: visible;
5505 }
5506 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li a:hover {
5507 background: #F6F8FA;
5508 color: #7A8B9A;
5509 }
5510 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li rect,
5511 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li path {
5512 stroke: #7A8B9A;
5513 }
5514 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler .wpfnl-dropdown li .wpfnl-bulk-export path {
5515 stroke: transparent;
5516 }
5517 .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .selected-funnel-count, .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper > p {
5518 color: #363B4E;
5519 font-weight: 500;
5520 }
5521 .funnel-list__wrapper .funnel__single-list .wpfnl-checkbox label:before {
5522 border-color: #E4E6EB;
5523 background-color: #fff;
5524 border-radius: 5px;
5525 }
5526 .funnel-list__wrapper .funnel__single-list.list-header {
5527 padding: 15px 24px 15px 60px;
5528 }
5529 .funnel-list__wrapper .funnel__single-list.list-header .list-cell {
5530 line-height: 1;
5531 transform: translateY(1px);
5532 }
5533 .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
5534 position: absolute;
5535 left: 24px;
5536 top: 50%;
5537 transform: translateY(-50%);
5538 z-index: 2;
5539 }
5540 .funnel-list__wrapper .funnel__single-list .wpfnl-name {
5541 padding-right: 15px;
5542 padding-left: 45px;
5543 position: relative;
5544 width: 240px;
5545 }
5546 .funnel-list__wrapper .funnel__single-list .wpfnl-name .builder-logo {
5547 position: absolute;
5548 left: 0;
5549 top: 50%;
5550 width: 30px;
5551 word-break: break-all;
5552 display: block;
5553 transform: translateY(-50%);
5554 }
5555 .funnel-list__wrapper .funnel__single-list .wpfnl-name .builder-logo svg {
5556 display: block;
5557 }
5558 .funnel-list__wrapper .funnel__single-list .wpfnl-name .name {
5559 font-weight: 500;
5560 font-size: 14px;
5561 line-height: 16px;
5562 color: #363B4E;
5563 }
5564 .funnel-list__wrapper .funnel__single-list .wpfnl-name .name:hover {
5565 color: #6E42D3;
5566 }
5567 .funnel-list__wrapper .funnel__single-list .wpfnl-name .steps {
5568 font-size: 12px;
5569 line-height: 16px;
5570 color: #7A8B9A;
5571 display: block;
5572 text-transform: capitalize;
5573 }
5574 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations {
5575 display: flex;
5576 flex-flow: row wrap;
5577 align-items: center;
5578 gap: 8px;
5579 width: 375px;
5580 }
5581 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag {
5582 border: 1px solid #E5E8F3;
5583 border-radius: 6px;
5584 font-size: 12px;
5585 line-height: 1.5;
5586 color: #7A8B9A;
5587 padding: 2px 8px;
5588 display: flex;
5589 flex-flow: row;
5590 align-items: center;
5591 justify-content: center;
5592 position: relative;
5593 }
5594 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag svg {
5595 margin-right: 6px;
5596 display: block;
5597 }
5598 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag .tooltip {
5599 background: #0C1015;
5600 border-radius: 6px;
5601 position: absolute;
5602 bottom: calc(100% + 10px);
5603 left: 0;
5604 padding: 7px 10px;
5605 color: #fff;
5606 width: 144px;
5607 z-index: 4;
5608 font-size: 13px;
5609 opacity: 0;
5610 visibility: hidden;
5611 transition: all 0.3s ease;
5612 }
5613 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag .tooltip:before {
5614 content: "";
5615 position: absolute;
5616 left: 13px;
5617 bottom: -4px;
5618 width: 10px;
5619 height: 10px;
5620 background: #0C1015;
5621 transform: rotate(45deg);
5622 border-radius: 2px;
5623 }
5624 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag:hover .tooltip {
5625 opacity: 1;
5626 visibility: visible;
5627 }
5628 .funnel-list__wrapper .funnel__single-list .wpfnl-creation-date {
5629 width: 135px;
5630 }
5631 .funnel-list__wrapper .funnel__single-list .wpfnl-creation-date .post-date {
5632 line-height: 1.14;
5633 display: block;
5634 }
5635 .funnel-list__wrapper .funnel__single-list .wpfnl-status {
5636 width: 75px;
5637 }
5638 .funnel-list__wrapper .funnel__single-list .wpfnl-status .post-status {
5639 font-size: 12px;
5640 line-height: 1.25;
5641 color: #2D3149;
5642 font-weight: 500;
5643 text-transform: capitalize;
5644 background: rgba(122, 139, 154, 0.15);
5645 border-radius: 100px;
5646 display: inline-block;
5647 padding: 5px 10px 4px;
5648 }
5649 .funnel-list__wrapper .funnel__single-list .wpfnl-status.published .post-status {
5650 background: rgba(35, 150, 84, 0.1);
5651 color: #239654;
5652 }
5653 .funnel-list__wrapper .funnel__single-list .list-action {
5654 display: flex;
5655 flex-flow: row;
5656 align-items: center;
5657 width: 80px;
5658 gap: 9px;
5659 }
5660 .funnel-list__wrapper .funnel__single-list .list-action > a {
5661 display: flex;
5662 flex-flow: row;
5663 align-items: center;
5664 font-weight: 500;
5665 font-size: 14px;
5666 line-height: 1.2;
5667 text-transform: capitalize;
5668 padding: 3px 4px;
5669 }
5670 .funnel-list__wrapper .funnel__single-list .list-action > a svg {
5671 display: block;
5672 }
5673 .funnel-list__wrapper .funnel__single-list .list-action > a svg path {
5674 transition: all 0.3s ease;
5675 }
5676 .funnel-list__wrapper .funnel__single-list .list-action > a.disabled {
5677 opacity: 0.5;
5678 cursor: not-allowed;
5679 text-decoration: none;
5680 }
5681 .funnel-list__wrapper .funnel__single-list .list-action > a.edit:hover path {
5682 fill: #6E42D3;
5683 }
5684 .funnel-list__wrapper .funnel__single-list .list-action > a.view:hover path {
5685 fill: #6E42D3;
5686 stroke: #6E42D3;
5687 }
5688 .funnel-list__wrapper .funnel__single-list .list-action .more-action {
5689 position: relative;
5690 padding: 3px 4px;
5691 cursor: pointer;
5692 }
5693 .funnel-list__wrapper .funnel__single-list .list-action .more-action svg {
5694 display: block;
5695 }
5696 .funnel-list__wrapper .funnel__single-list .list-action .more-action .duplicate svg {
5697 width: 18px;
5698 }
5699 .funnel-list__wrapper .funnel__single-list .list-action .more-action .duplicate .pro-tag-icon {
5700 margin-left: 7px;
5701 }
5702 .funnel-list__wrapper .funnel__single-list .list-action .more-action .duplicate .pro-tag-icon path {
5703 stroke: initial;
5704 }
5705 .funnel-list__wrapper .funnel__single-list .list-action ul.more-actions {
5706 right: -22px;
5707 }
5708 .funnel-list__wrapper .funnel__single-list .list-action ul.more-actions .wpfnl-loader {
5709 border-width: 1px;
5710 border-top-color: transparent;
5711 width: 10px;
5712 height: 10px;
5713 margin-left: 6px;
5714 }
5715 .funnel-list__wrapper .funnel__single-list .list-action .more-action.show-actions ul.more-actions {
5716 top: 27px;
5717 opacity: 1;
5718 visibility: visible;
5719 }
5720 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li a:hover {
5721 background: #F6F8FA;
5722 color: #7A8B9A;
5723 }
5724 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li rect,
5725 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li path {
5726 stroke: #7A8B9A;
5727 }
5728 .funnel-list__wrapper .funnel__single-list .list-action .wpfnl-dropdown li .wpfnl-export-funnel path {
5729 stroke: transparent;
5730 }
5731 .funnel-list__wrapper .funnel__single-list.funnel-disabled {
5732 border-bottom-color: #e3e3e3;
5733 }
5734 .funnel-list__wrapper .funnel__single-list.funnel-disabled::before {
5735 content: "";
5736 position: absolute;
5737 left: 0;
5738 top: 0;
5739 width: 100%;
5740 height: 100%;
5741 cursor: not-allowed;
5742 z-index: 2;
5743 background: rgba(32, 32, 32, 0.0784313725);
5744 }
5745 .funnel-list__wrapper .funnel__single-list.funnel-disabled .list-cell {
5746 opacity: 0.5;
5747 }
5748 .funnel-list__wrapper .funnel__single-list.funnel-disabled .list-action > a.disabled {
5749 opacity: 1;
5750 }
5751 .funnel-list__wrapper .funnel__single-list .funnel-alert {
5752 border: 1px solid #e3d7ff;
5753 background: linear-gradient(to right, #eff6ff, #eef2ff);
5754 border-radius: 8px;
5755 padding: 9px 12px;
5756 width: 100%;
5757 }
5758 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-inner {
5759 display: flex;
5760 align-items: center;
5761 justify-content: space-between;
5762 gap: 16px;
5763 }
5764 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-left {
5765 display: flex;
5766 align-items: center;
5767 gap: 12px;
5768 }
5769 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-icon {
5770 background: #dbeafe;
5771 padding: 8px;
5772 border-radius: 6px;
5773 display: flex;
5774 align-items: center;
5775 justify-content: center;
5776 }
5777 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-icon svg {
5778 width: 20px;
5779 height: 20px;
5780 color: #2563eb;
5781 }
5782 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-content {
5783 display: flex;
5784 flex-direction: column;
5785 }
5786 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-title {
5787 font-size: 14px;
5788 font-weight: 600;
5789 color: #111827;
5790 margin: 0;
5791 }
5792 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-alert-description {
5793 font-size: 12px;
5794 color: #4b5563;
5795 margin: 0;
5796 }
5797 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-activate-btn {
5798 background: #6E42D3;
5799 color: #ffffff;
5800 border: none;
5801 border-radius: 6px;
5802 padding: 7px 13px;
5803 font-size: 13px;
5804 font-weight: 500;
5805 cursor: pointer;
5806 transition: all 0.3s ease;
5807 white-space: nowrap;
5808 }
5809 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-activate-btn:hover {
5810 background: #5b36b0;
5811 }
5812 .funnel-list__wrapper .funnel__single-list .funnel-alert .funnel-activate-btn:disabled {
5813 opacity: 0.5;
5814 pointer-events: none;
5815 }
5816 .funnel-list__wrapper .list-footer {
5817 display: flex;
5818 flex-flow: row wrap;
5819 align-items: center;
5820 justify-content: space-between;
5821 padding: 17px 24px;
5822 }
5823 .funnel-list__wrapper .list-footer .pagination-number p {
5824 display: flex;
5825 align-items: center;
5826 gap: 10px;
5827 white-space: nowrap;
5828 }
5829 .funnel-list__wrapper .list-footer .pagination-number p strong {
5830 color: #363B4E;
5831 }
5832 .funnel-list__wrapper .list-footer .pagination-number p select {
5833 width: 56px;
5834 min-width: auto;
5835 padding: 2px 8px;
5836 height: 32px;
5837 }
5838
5839 @media only screen and (max-width: 1399px) {
5840 .funnel-list__wrapper .funnel__single-list .wpfnl-name {
5841 width: 200px;
5842 }
5843 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations {
5844 width: 220px;
5845 }
5846 }
5847 @media only screen and (max-width: 1199px) {
5848 .wpfnl-dashboard__header a.import-export {
5849 background: transparent;
5850 box-shadow: none;
5851 padding: 0;
5852 }
5853 .wpfnl-dashboard__header .btn-default.disabled,
5854 .wpfnl-dashboard__header .add-new-funnel-btn {
5855 padding: 0 18px;
5856 }
5857 .funnel-list__wrapper .funnel__single-list {
5858 padding: 10px 15px 10px 45px;
5859 gap: 8px;
5860 }
5861 .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
5862 left: 15px;
5863 }
5864 .funnel-list__wrapper .funnel__single-list .wpfnl-name {
5865 padding-right: 10px;
5866 }
5867 .funnel-list__wrapper .funnel__single-list .wpfnl-creation-date {
5868 width: 74px;
5869 }
5870 .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations {
5871 width: 136px;
5872 }
5873 .funnel-list__wrapper .funnel__single-list .list-action {
5874 width: 73px;
5875 gap: 3px;
5876 }
5877 .funnel-list__wrapper .funnel__single-list .list-action > a {
5878 margin-right: 0;
5879 width: 28px;
5880 text-indent: -999px;
5881 overflow: hidden;
5882 }
5883 .funnel-list__wrapper .funnel__single-list .list-action > a.edit {
5884 margin-right: 0;
5885 }
5886 }
5887 @media only screen and (max-width: 782px) {
5888 .wpfnl-dashboard__header {
5889 padding: 18px 20px 19px 30px;
5890 }
5891 }
5892 .remote-funnel-header {
5893 display: flex;
5894 flex-flow: row wrap;
5895 align-items: center;
5896 background: #FFFFFF;
5897 border-bottom: 1px solid #E5E8F3;
5898 position: relative;
5899 padding: 15px 15px 5px;
5900 }
5901 .remote-funnel-header .single-item {
5902 margin: 0 10px 10px 0;
5903 }
5904 .remote-funnel-header .single-item select {
5905 padding-right: 30px;
5906 }
5907 .remote-funnel-header .single-item .template-image-remove,
5908 .remote-funnel-header .single-item .template-image-upload {
5909 background: #F7F7FA;
5910 color: #363B4E;
5911 border: 1px solid #E5E8F3;
5912 }
5913 .remote-funnel-header .single-item.template-preview-image {
5914 display: flex;
5915 align-items: center;
5916 flex-flow: row wrap;
5917 max-width: 510px;
5918 }
5919 .remote-funnel-header .single-item.template-preview-image input[type=text] {
5920 width: 200px;
5921 margin-right: 10px;
5922 }
5923 .remote-funnel-header .single-item.template-preview-image .btn-default {
5924 margin-right: 10px;
5925 white-space: pre;
5926 }
5927 .remote-funnel-header .single-item.template-preview-image .btn-default:last-child {
5928 margin-right: 0;
5929 }
5930 .remote-funnel-header .btn-default {
5931 border-radius: 6px;
5932 padding: 0 20px;
5933 min-width: auto;
5934 }
5935
5936 .steps-page__header {
5937 display: flex;
5938 flex-flow: row wrap;
5939 align-items: center;
5940 background: #FFFFFF;
5941 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
5942 position: relative;
5943 justify-content: flex-start;
5944 padding: 15px 13px 15px 24px;
5945 }
5946
5947 .steps-page__header-left {
5948 display: flex;
5949 flex-flow: row wrap;
5950 align-items: center;
5951 }
5952 .steps-page__header-left .wpfnl-logo a {
5953 display: block;
5954 padding: 16px 25px;
5955 border-right: 1px solid #E5E8F3;
5956 }
5957 .steps-page__header-left .wpfnl-logo a svg {
5958 width: 26px;
5959 display: block;
5960 }
5961 .steps-page__header-left .back-link {
5962 font-weight: 400;
5963 font-size: 14px;
5964 color: #7A8B9A;
5965 text-transform: capitalize;
5966 padding: 0;
5967 text-align: center;
5968 display: flex;
5969 flex-flow: column;
5970 align-items: center;
5971 justify-content: center;
5972 box-shadow: none;
5973 height: 38px;
5974 width: 38px;
5975 border: 1px solid #EEF0F3;
5976 margin-right: 15px;
5977 border-radius: 10px;
5978 }
5979 .steps-page__header-left .back-link svg {
5980 display: block;
5981 margin: 0 auto;
5982 }
5983 .steps-page__header-left .back-link:hover {
5984 color: #6E42D3;
5985 }
5986 .steps-page__header-left .add-step-condtion-area {
5987 display: flex;
5988 flex-flow: row wrap;
5989 align-items: center;
5990 border-right: 1px solid #E5E8F3;
5991 }
5992 .steps-page__header-left .add-step-condtion-area li {
5993 position: relative;
5994 }
5995 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2 {
5996 position: absolute;
5997 left: 0;
5998 top: calc(100% + 35px);
5999 width: 305px;
6000 padding: 10px 32px 10px 15px;
6001 margin: 0;
6002 background: #6e42d3;
6003 color: #fff;
6004 border-radius: 10px;
6005 text-align: left;
6006 z-index: 1;
6007 opacity: 0;
6008 visibility: hidden;
6009 transition: all 0.5s ease 1.5s;
6010 }
6011 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2:before {
6012 content: "";
6013 position: absolute;
6014 left: 20px;
6015 top: -6px;
6016 width: 13px;
6017 height: 13px;
6018 background: #6e42d3;
6019 transform: rotate(45deg);
6020 }
6021 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2.show-tooltip {
6022 top: calc(100% + 15px);
6023 opacity: 1;
6024 visibility: visible;
6025 }
6026 .steps-page__header-left .add-step-condtion-area li .wpfnl-tooltip2 .close-tooltip {
6027 position: absolute;
6028 right: 13px;
6029 top: 11px;
6030 cursor: pointer;
6031 }
6032 .steps-page__header-left .add-step-condtion-area li > button {
6033 display: block;
6034 border: none;
6035 height: 60px;
6036 padding: 0 20px;
6037 background: transparent;
6038 font-size: 14px;
6039 font-weight: 500;
6040 color: #363B4E;
6041 cursor: pointer;
6042 position: relative;
6043 }
6044 .steps-page__header-left .add-step-condtion-area li > button svg {
6045 margin-right: 5px;
6046 }
6047 .steps-page__header-left .add-step-condtion-area li > button.add-new-step {
6048 background-color: #F6F5FA;
6049 color: #6E42D3;
6050 }
6051 .steps-page__header-left .add-step-condtion-area li > button.add-new-step:after {
6052 content: "";
6053 position: absolute;
6054 bottom: 0;
6055 left: 0;
6056 width: 100%;
6057 height: 3px;
6058 background: #6E42D3;
6059 border-radius: 60px 60px 0 0;
6060 }
6061 .steps-page__header-left .add-step-condtion-area li > button.add-new-step svg {
6062 margin-right: 5px;
6063 }
6064 .steps-page__header-left .add-step-condtion-area li > button.create-condition:hover {
6065 color: #6E42D3;
6066 }
6067 .steps-page__header-left .add-step-condtion-area li > button.create-condition:hover path {
6068 stroke: #6E42D3;
6069 }
6070 .steps-page__header-left .add-step-condtion-area li .steps-dropdown {
6071 position: absolute;
6072 box-shadow: 0px 10px 30px rgba(21, 21, 69, 0.0784313725);
6073 border-radius: 0px 0px 10px 10px;
6074 top: 100%;
6075 left: 0;
6076 width: 100%;
6077 z-index: 9;
6078 background: #F6F5FA;
6079 border: 1px solid #fff;
6080 padding: 10px 13px 12px;
6081 transition: all 0.3s ease;
6082 opacity: 0;
6083 visibility: hidden;
6084 }
6085 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li {
6086 background: #FFFFFF;
6087 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
6088 border-radius: 5px;
6089 font-weight: 500;
6090 font-size: 14px;
6091 line-height: 1.4;
6092 color: #8594A2;
6093 margin-bottom: 10px;
6094 text-transform: capitalize;
6095 padding: 7px 13px 6px;
6096 text-align: center;
6097 cursor: pointer;
6098 width: 100%;
6099 transition: all 0.3s ease;
6100 }
6101 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li:last-child {
6102 margin-bottom: 0;
6103 }
6104 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li:hover {
6105 background: #6E42D3;
6106 color: #fff;
6107 }
6108 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li.disabled {
6109 cursor: not-allowed;
6110 color: white;
6111 background: #B6B2CA;
6112 }
6113 .steps-page__header-left .add-step-condtion-area li .steps-dropdown > li .pro-tag {
6114 position: absolute;
6115 top: -6px;
6116 right: -2px;
6117 }
6118 .steps-page__header-left .add-step-condtion-area li.show-steps-dropdown > button.add-new-step svg {
6119 transform: rotate(180deg);
6120 }
6121 .steps-page__header-left .add-step-condtion-area li.show-steps-dropdown .steps-dropdown {
6122 opacity: 1;
6123 visibility: visible;
6124 }
6125 .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 {
6126 border-left: 1px solid #E5E8F3;
6127 }
6128 .steps-page__header-left .steps-page__fnl-name {
6129 display: flex;
6130 flex-flow: row wrap;
6131 align-items: center;
6132 }
6133 .steps-page__header-left .steps-page__fnl-name label {
6134 padding-right: 7px;
6135 font-size: 14px;
6136 }
6137 .steps-page__header-left .steps-page__fnl-name input {
6138 height: 28px;
6139 font-size: 12px;
6140 padding: 3px 10px;
6141 width: 230px;
6142 min-height: auto;
6143 min-width: auto;
6144 }
6145 .steps-page__header-left .steps-page__fnl-name .funnel-name {
6146 max-width: 230px;
6147 white-space: nowrap;
6148 overflow: hidden;
6149 text-overflow: ellipsis;
6150 }
6151 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn {
6152 min-width: auto;
6153 padding: 0 7px;
6154 width: 30px;
6155 height: 26px;
6156 display: flex;
6157 flex-flow: column;
6158 align-items: center;
6159 justify-content: center;
6160 background: rgba(0, 0, 0, 0.04) !important;
6161 border: 1px solid #e0e0e0;
6162 border-radius: 3px;
6163 cursor: pointer;
6164 margin-left: 10px;
6165 }
6166 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn svg {
6167 display: block;
6168 }
6169 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn.funnel-name-edit svg {
6170 fill: #6E42D3;
6171 }
6172 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn.funnel-name-submit {
6173 display: none;
6174 }
6175 .steps-page__header-left .steps-page__fnl-name .fnl-name-btn.funnel-name-submit svg {
6176 stroke: #6E42D3;
6177 }
6178 .steps-page__header-left .steps-page__fnl-name .funnel-name-input {
6179 display: none;
6180 }
6181 .steps-page__header-left .steps-page__fnl-name .funnel-name-submit-btn {
6182 display: none;
6183 }
6184 .steps-page__header-left .copy-clipboard {
6185 display: flex;
6186 flex-flow: row wrap;
6187 align-items: center;
6188 margin-left: 20px;
6189 position: relative;
6190 }
6191 .steps-page__header-left .copy-clipboard .link-icon {
6192 width: 28px;
6193 border: 1px solid #E5E8F3;
6194 height: 28px;
6195 display: flex;
6196 flex-flow: column;
6197 align-items: center;
6198 justify-content: center;
6199 border-right: 0;
6200 border-radius: 6px 0 0 6px;
6201 }
6202 .steps-page__header-left .copy-clipboard input[readonly] {
6203 height: 28px;
6204 font-size: 12px;
6205 padding: 2px 10px;
6206 border-radius: 0;
6207 width: 160px;
6208 background: #fff;
6209 min-height: auto;
6210 min-width: auto;
6211 display: block;
6212 white-space: nowrap;
6213 overflow: hidden;
6214 text-overflow: ellipsis;
6215 }
6216 .steps-page__header-left .copy-clipboard button {
6217 border: none;
6218 background: #ececee;
6219 color: #363B4E;
6220 height: 28px;
6221 display: inline-block;
6222 padding: 0 10px;
6223 text-transform: capitalize;
6224 font-size: 12px;
6225 font-weight: 500;
6226 border-radius: 0 6px 6px 0;
6227 cursor: pointer;
6228 }
6229 .steps-page__header-left .copy-clipboard .copied-msg {
6230 color: #6E42D3;
6231 font-weight: 500;
6232 position: absolute;
6233 top: 7px;
6234 right: -46px;
6235 font-size: 13px;
6236 display: none;
6237 }
6238
6239 .steps-page__header-center {
6240 display: flex;
6241 align-items: center;
6242 flex-flow: row wrap;
6243 gap: 40px;
6244 }
6245 .steps-page__header-center .steps-page__fnl-name {
6246 display: flex;
6247 flex-flow: row wrap;
6248 align-items: center;
6249 position: relative;
6250 }
6251 .steps-page__header-center .steps-page__fnl-name label {
6252 padding-right: 7px;
6253 font-size: 14px;
6254 cursor: text;
6255 }
6256 .steps-page__header-center .steps-page__fnl-name input[type=text] {
6257 line-height: 1;
6258 font-size: 16px;
6259 font-weight: 500;
6260 color: #363B4E;
6261 background: #fff;
6262 border-radius: 10px;
6263 border: 1px solid #6E42D3;
6264 }
6265 .steps-page__header-center .steps-page__fnl-name input[type=text]:hover {
6266 color: #363B4E;
6267 }
6268 .steps-page__header-center .steps-page__fnl-name .funnel-name {
6269 max-width: 250px;
6270 white-space: nowrap;
6271 overflow: hidden;
6272 text-overflow: ellipsis;
6273 font-size: 16px;
6274 font-weight: 500;
6275 line-height: 1.1;
6276 color: #363B4E;
6277 position: relative;
6278 padding-right: 25px;
6279 }
6280 .steps-page__header-center .steps-page__fnl-name .funnel-name:after {
6281 content: "";
6282 position: absolute;
6283 right: 0;
6284 top: 0;
6285 width: 17px;
6286 height: 17px;
6287 cursor: pointer;
6288 background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTciIHZpZXdCb3g9IjAgMCAxNyAxNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik00LjE2NjY3IDEuNjY2NjdDMi43ODU5NiAxLjY2NjY3IDEuNjY2NjcgMi43ODU5NiAxLjY2NjY3IDQuMTY2NjdWMTIuNUMxLjY2NjY3IDEzLjg4MDcgMi43ODU5NiAxNSA0LjE2NjY3IDE1SDEyLjVDMTMuODgwNyAxNSAxNSAxMy44ODA3IDE1IDEyLjVWNy41QzE1IDcuMDM5NzUgMTUuMzczMSA2LjY2NjY3IDE1LjgzMzMgNi42NjY2N0MxNi4yOTM2IDYuNjY2NjcgMTYuNjY2NyA3LjAzOTc1IDE2LjY2NjcgNy41VjEyLjVDMTYuNjY2NyAxNC44MDEyIDE0LjgwMTIgMTYuNjY2NyAxMi41IDE2LjY2NjdINC4xNjY2N0MxLjg2NTQ4IDE2LjY2NjcgMCAxNC44MDEyIDAgMTIuNVY0LjE2NjY3QzAgMS44NjU0OCAxLjg2NTQ4IDAgNC4xNjY2NyAwSDkuMTY2NjdDOS42MjY5MiAwIDEwIDAuMzczMSAxMCAwLjgzMzMzM0MxMCAxLjI5MzU3IDkuNjI2OTIgMS42NjY2NyA5LjE2NjY3IDEuNjY2NjdINC4xNjY2N1oiIGZpbGw9IiM3QThCOUEiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMi42Nzk3IDAuNjg0MDY3QzEzLjExNzcgMC4yNDYwNjcgMTMuNzExNyAwIDE0LjMzMTIgMEMxNC45NTA2IDAgMTUuNTQ0NiAwLjI0NjA2NyAxNS45ODI2IDAuNjg0MDY3QzE2LjQyMDYgMS4xMjIwNyAxNi42NjY3IDEuNzE2MTIgMTYuNjY2NyAyLjMzNTU0QzE2LjY2NjcgMi45NTQ5NyAxNi40MjA2IDMuNTQ5MDMgMTUuOTgyNiAzLjk4NzAzTDE1LjMzIDQuNjM5NjRDMTUuMDA0NiA0Ljk2NTA4IDE0LjQ3NjkgNC45NjUwOCAxNC4xNTE1IDQuNjM5NjRMMTIuMDI3IDIuNTE1MkMxMS43MDE2IDIuMTg5NzYgMTEuNzAxNiAxLjY2MjEzIDEyLjAyNyAxLjMzNjY4TDEyLjY3OTcgMC42ODQwNjdaTTEwLjg0ODUgMy42OTM3MUMxMC41MjMxIDMuMzY4MjcgOS45OTU0IDMuMzY4MjcgOS42Njk5OSAzLjY5MzcxTDUuOTUyMjMgNy40MTE1QzUuODQ1NDMgNy41MTgyNSA1Ljc2OTY3IDcuNjUyMDggNS43MzMwNCA3Ljc5ODU4TDUuMDI0ODkgMTAuNjMxM0M0Ljk1Mzg5IDEwLjkxNTIgNS4wMzcwOSAxMS4yMTU2IDUuMjQ0MDggMTEuNDIyNkM1LjQ1MTA2IDExLjYyOTYgNS43NTE0NyAxMS43MTI4IDYuMDM1NDUgMTEuNjQxOEw4Ljg2ODA3IDEwLjkzMzdDOS4wMTQ1NyAxMC44OTcgOS4xNDg0IDEwLjgyMTMgOS4yNTUxNSAxMC43MTQ0TDEyLjk3MyA2Ljk5NjY3QzEzLjI5ODQgNi42NzEyNSAxMy4yOTg0IDYuMTQzNTkgMTIuOTczIDUuODE4MTZMMTAuODQ4NSAzLjY5MzcxWiIgZmlsbD0iIzdBOEI5QSIvPgo8L3N2Zz4K);
6289 }
6290 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn {
6291 min-width: auto;
6292 padding: 1px 7px 0;
6293 width: 30px;
6294 height: 28px;
6295 display: flex;
6296 flex-flow: column;
6297 align-items: center;
6298 justify-content: center;
6299 background: #F6F5FA !important;
6300 border: 1px solid #e0e0e0;
6301 border-radius: 6px;
6302 cursor: pointer;
6303 margin-left: 10px;
6304 }
6305 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn svg {
6306 display: block;
6307 }
6308 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-edit svg {
6309 fill: #6E42D3;
6310 }
6311 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-submit {
6312 display: none;
6313 }
6314 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-submit svg {
6315 stroke: #6E42D3;
6316 }
6317 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-cancel {
6318 display: none;
6319 margin-left: 5px;
6320 }
6321 .steps-page__header-center .steps-page__fnl-name .fnl-name-btn.funnel-name-cancel svg {
6322 position: relative;
6323 top: 2px;
6324 }
6325 .steps-page__header-center .steps-page__fnl-name .funnel-name-input {
6326 display: none;
6327 }
6328 .steps-page__header-center .steps-page__fnl-name .funnel-name-submit-btn {
6329 display: none;
6330 }
6331 .steps-page__header-center .steps-page__fnl-name .wpfnl-alert {
6332 display: block;
6333 position: absolute;
6334 font-size: 12px;
6335 white-space: nowrap;
6336 bottom: -16px;
6337 left: 0;
6338 }
6339 .steps-page__header-center #wpfnl-change-funnel-name[data-tour=yes] {
6340 position: relative;
6341 z-index: 4;
6342 }
6343 .steps-page__header-center #wpfnl-change-funnel-name[data-tour=yes] .funnel-name-edit {
6344 color: #FFF;
6345 }
6346 .steps-page__header-center .enable-gbf {
6347 display: flex;
6348 align-items: center;
6349 font-weight: 500;
6350 position: relative;
6351 }
6352 .steps-page__header-center .enable-gbf::before {
6353 content: "";
6354 position: absolute;
6355 left: -20px;
6356 top: 50%;
6357 transform: translateY(-50%);
6358 width: 1px;
6359 height: 20px;
6360 background-color: #E9E6F4;
6361 }
6362 .steps-page__header-center .enable-gbf .pro-tag-icon {
6363 position: static;
6364 margin-top: 3px;
6365 margin-right: 4px;
6366 }
6367 .steps-page__header-center .enable-gbf .title {
6368 margin-right: 10px;
6369 line-height: 1.1;
6370 }
6371
6372 .steps-page__header-right {
6373 display: flex;
6374 flex-flow: row;
6375 align-items: center;
6376 margin-left: auto;
6377 }
6378 .steps-page__header-right .funnel-stats {
6379 display: flex;
6380 border-right: 1px solid #E5E8F3;
6381 padding-right: 20px;
6382 margin-right: 5px;
6383 font-weight: 500;
6384 align-items: center;
6385 }
6386 .steps-page__header-right .funnel-stats .pro-tag-icon {
6387 position: static;
6388 margin-top: 3px;
6389 margin-right: 4px;
6390 }
6391 .steps-page__header-right .funnel-stats .title {
6392 margin-right: 10px;
6393 line-height: 1.1;
6394 }
6395 .steps-page__header-right .saving-text {
6396 color: #848994;
6397 font-size: 14px;
6398 font-weight: 400;
6399 line-height: 1;
6400 margin-right: 20px;
6401 position: relative;
6402 top: 2px;
6403 }
6404 .steps-page__header-right .draft-publish-toggle {
6405 display: flex;
6406 align-items: center;
6407 border-radius: 10px;
6408 border: 1px solid #E5E8F3;
6409 margin-right: 40px;
6410 position: relative;
6411 }
6412 .steps-page__header-right .draft-publish-toggle:after {
6413 content: "";
6414 position: absolute;
6415 right: -20px;
6416 top: 50%;
6417 transform: translateY(-50%);
6418 width: 1px;
6419 height: 24px;
6420 background: #DEE2E6;
6421 }
6422 .steps-page__header-right .draft-publish-toggle > span {
6423 color: #2D3149;
6424 font-size: 14px;
6425 font-weight: 500;
6426 line-height: 1;
6427 display: block;
6428 padding: 10px 17px;
6429 border-radius: 10px;
6430 }
6431 .steps-page__header-right .draft-publish-toggle > span.active {
6432 background-color: #6E42D3;
6433 color: #fff;
6434 }
6435 .steps-page__header-right .wpfnl-header-actions {
6436 display: flex;
6437 align-items: center;
6438 gap: 10px;
6439 }
6440 .steps-page__header-right .wpfnl-header-action {
6441 text-align: center;
6442 display: flex;
6443 flex-flow: column;
6444 align-items: center;
6445 justify-content: center;
6446 box-shadow: none;
6447 height: 38px;
6448 width: 38px;
6449 border: 1px solid #EEF0F3;
6450 border-radius: 8px;
6451 position: relative;
6452 padding: 5px;
6453 }
6454 .steps-page__header-right .wpfnl-header-action svg {
6455 display: block;
6456 }
6457 .steps-page__header-right .wpfnl-header-action .action-tooltip {
6458 position: absolute;
6459 top: calc(100% + 20px);
6460 left: 50%;
6461 transform: translateX(-50%);
6462 border-radius: 8px;
6463 background: #10052E;
6464 box-shadow: 0 2px 15px 0 rgba(22, 28, 32, 0.08);
6465 color: #E8E8E9;
6466 font-size: 13px;
6467 font-weight: 400;
6468 line-height: 1;
6469 display: block;
6470 padding: 10px 14px;
6471 opacity: 0;
6472 visibility: hidden;
6473 transition: all 0.3s ease;
6474 white-space: nowrap;
6475 z-index: 1;
6476 }
6477 .steps-page__header-right .wpfnl-header-action .action-tooltip:before {
6478 content: "";
6479 position: absolute;
6480 top: 0px;
6481 left: 50%;
6482 width: 10px;
6483 height: 10px;
6484 background: #10052E;
6485 transform: rotate(45deg) translateX(-50%);
6486 border-radius: 2px;
6487 }
6488 .steps-page__header-right .wpfnl-header-action:hover .action-tooltip {
6489 opacity: 1;
6490 visibility: visible;
6491 top: calc(100% + 10px);
6492 z-index: 2;
6493 }
6494 .steps-page__header-right .btn-default {
6495 min-width: auto;
6496 position: relative;
6497 padding: 0 21px;
6498 }
6499 .steps-page__header-right .btn-default .wpfnl-loader {
6500 display: inline-block;
6501 position: relative;
6502 top: 2px;
6503 right: 0;
6504 }
6505 .steps-page__header-right .btn-default:disabled,
6506 .steps-page__header-right .btn-default[disabled] {
6507 color: rgba(64, 64, 64, 0.4);
6508 cursor: not-allowed;
6509 background-color: rgba(183, 183, 183, 0.4);
6510 }
6511 .steps-page__header-right .dropdown-option {
6512 position: relative;
6513 text-align: center;
6514 padding: 7px 12px;
6515 display: inline-block;
6516 margin-left: 6px;
6517 cursor: pointer;
6518 }
6519 .steps-page__header-right .dropdown-option svg {
6520 display: block;
6521 }
6522 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown {
6523 right: -14px;
6524 top: 50px;
6525 }
6526 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag {
6527 margin-left: 4px;
6528 }
6529 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown li:first-child {
6530 border-radius: 10px 10px 0 0;
6531 }
6532 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown li:last-child {
6533 border-radius: 0 0 10px 10px;
6534 }
6535 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown a svg {
6536 width: 19px;
6537 height: 19px;
6538 }
6539 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag-icon {
6540 position: static;
6541 margin-left: 6px;
6542 }
6543 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag-icon svg {
6544 width: 18px;
6545 height: 18px;
6546 }
6547 .steps-page__header-right .dropdown-option ul.wpfnl-dropdown .pro-tag-icon svg:hover path {
6548 stroke: inherit;
6549 fill: inherit;
6550 }
6551 .steps-page__header-right .dropdown-option.show ul.wpfnl-dropdown {
6552 top: 38px;
6553 opacity: 1;
6554 visibility: visible;
6555 }
6556 .steps-page__header-right .dropdown-option[data-tour=yes] {
6557 z-index: 4;
6558 background-color: #ffffff;
6559 }
6560 .steps-page__header-right .funnel-stats[data-tour=yes] {
6561 position: relative;
6562 z-index: 4;
6563 }
6564 .steps-page__header-right .funnel-stats[data-tour=yes] .title {
6565 color: #FFF;
6566 }
6567 .steps-page__header-right .preview-funnel[data-tour=yes] {
6568 position: relative;
6569 z-index: 4;
6570 }
6571 .steps-page__header-right .preview-funnel[data-tour=yes] svg circle, .steps-page__header-right .preview-funnel[data-tour=yes] svg path {
6572 stroke: #FFF;
6573 }
6574
6575 @media only screen and (max-width: 1199px) {
6576 .steps-page__header {
6577 padding-right: 10px;
6578 }
6579 .steps-page__header-left .back-link {
6580 width: 44px;
6581 }
6582 .steps-page__header-left .add-step-condtion-area li button {
6583 padding: 0 14px;
6584 }
6585 .steps-page__header-right .funnel-stats {
6586 border-right: none;
6587 padding-right: 0;
6588 }
6589 .steps-page__header-right .btn-default {
6590 padding: 0 20px;
6591 }
6592 .steps-page__header-center .steps-page__fnl-name label {
6593 display: none;
6594 }
6595 .steps-page__header-center .steps-page__fnl-name .wpfnl-alert {
6596 left: 0;
6597 }
6598 }
6599 @media only screen and (max-width: 991px) {
6600 .steps-page__header-center .steps-page__fnl-name input[type=text] {
6601 width: 200px;
6602 }
6603 }
6604 @media only screen and (max-width: 870px) {
6605 .steps-page__header {
6606 padding-right: 15px;
6607 }
6608 .steps-page__header-left .copy-clipboard .link-icon {
6609 display: none;
6610 }
6611 }
6612 .funnel-window .wpfnl-canvas-analytics {
6613 position: relative;
6614 display: flex;
6615 align-items: center;
6616 justify-content: center;
6617 gap: 60px;
6618 background: #FFF;
6619 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.14);
6620 padding: 18px 15px;
6621 border-top: 1px solid rgba(190, 190, 215, 0.14);
6622 transition: padding 0.2s ease;
6623 }
6624 .funnel-window .wpfnl-canvas-analytics.is-collapsed {
6625 padding: 0 5px;
6626 }
6627 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn {
6628 position: absolute;
6629 right: 20px;
6630 top: 100%;
6631 transform: translateY(-1px);
6632 width: 28px;
6633 height: 24px;
6634 display: flex;
6635 align-items: center;
6636 justify-content: center;
6637 cursor: pointer;
6638 border-radius: 0 0 5px 5px;
6639 background: #fff;
6640 box-shadow: 0 2px 5px 0 rgba(190, 190, 215, 0.31);
6641 z-index: 1;
6642 }
6643 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn:hover {
6644 background: #f0eefa;
6645 }
6646 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn__chevron {
6647 transition: transform 0.2s ease;
6648 display: block;
6649 transform-origin: center center;
6650 }
6651 .funnel-window .wpfnl-canvas-analytics .analytics-toggle-btn__chevron.is-up {
6652 transform: rotate(180deg);
6653 }
6654 .funnel-window .wpfnl-canvas-analytics .analytics-items {
6655 display: flex;
6656 align-items: center;
6657 justify-content: center;
6658 gap: 60px;
6659 }
6660 .funnel-window .wpfnl-canvas-analytics .analytics-item {
6661 text-align: center;
6662 position: relative;
6663 }
6664 .funnel-window .wpfnl-canvas-analytics .analytics-item:before {
6665 content: "";
6666 position: absolute;
6667 right: -30px;
6668 top: 50%;
6669 transform: translateY(-50%);
6670 width: 1px;
6671 height: 20px;
6672 background-color: #D9D6E3;
6673 }
6674 .funnel-window .wpfnl-canvas-analytics .analytics-item:last-child:before {
6675 display: none;
6676 }
6677 .funnel-window .wpfnl-canvas-analytics .analytics-label {
6678 color: #848994;
6679 font-size: 12px;
6680 font-weight: 400;
6681 line-height: 1;
6682 }
6683 .funnel-window .wpfnl-canvas-analytics .analytics-value {
6684 color: #2D3149;
6685 font-size: 14px;
6686 font-weight: 500;
6687 line-height: 1;
6688 margin-top: 8px;
6689 }
6690
6691 .steps-page__header-mode {
6692 position: absolute;
6693 left: 50%;
6694 top: 50%;
6695 transform: translate(-50%, -50%);
6696 display: flex;
6697 align-items: center;
6698 z-index: 1;
6699 }
6700
6701 .vf-mode-switcher {
6702 display: flex;
6703 flex-flow: row nowrap;
6704 align-items: center;
6705 background: #ffffff;
6706 border: 1px solid #e0e3ed;
6707 border-radius: 8px;
6708 flex-shrink: 0;
6709 }
6710
6711 .vf-mode-btn {
6712 display: flex;
6713 align-items: center;
6714 justify-content: center;
6715 height: 30px;
6716 padding: 0 18px;
6717 border: none;
6718 border-radius: 0;
6719 background: transparent;
6720 color: #98a2b3;
6721 font-size: 13px;
6722 font-weight: 500;
6723 line-height: 1;
6724 cursor: pointer;
6725 transition: background 0.15s ease, color 0.15s ease;
6726 white-space: nowrap;
6727 position: relative;
6728 }
6729 .vf-mode-btn:first-child {
6730 border-radius: 7px 0 0 7px;
6731 }
6732 .vf-mode-btn:last-child {
6733 border-radius: 0 7px 7px 0;
6734 }
6735 .vf-mode-btn + .vf-mode-btn {
6736 border-left: 1px solid #e0e3ed;
6737 }
6738 .vf-mode-btn:hover:not(.vf-mode-btn--active) {
6739 background: #f6f5fa;
6740 color: #667085;
6741 }
6742 .vf-mode-btn--active {
6743 background: #f1ecfb;
6744 color: #6e42d3;
6745 font-weight: 600;
6746 }
6747
6748 .vf-mode-switcher--rail {
6749 flex-flow: column nowrap;
6750 border-radius: 6px;
6751 border-color: #eaecf0;
6752 }
6753 .vf-mode-switcher--rail .vf-mode-btn {
6754 width: 100%;
6755 height: 30px;
6756 padding: 0 10px;
6757 font-size: 12px;
6758 }
6759 .vf-mode-switcher--rail .vf-mode-btn:first-child {
6760 border-radius: 5px 5px 0 0;
6761 }
6762 .vf-mode-switcher--rail .vf-mode-btn:last-child {
6763 border-radius: 0 0 5px 5px;
6764 }
6765 .vf-mode-switcher--rail .vf-mode-btn + .vf-mode-btn {
6766 border-left: none;
6767 border-top: 1px solid #eaecf0;
6768 }
6769
6770 @media screen and (max-width: 1280px) {
6771 .steps-page__header-mode {
6772 position: static;
6773 transform: none;
6774 margin-left: auto;
6775 }
6776 }
6777 .funnel-window {
6778 display: flex;
6779 flex-direction: column;
6780 height: calc(100vh - 32px);
6781 overflow: hidden;
6782 }
6783 .funnel-window .wpfnl-canvas-zoom-control {
6784 display: flex;
6785 align-items: center;
6786 row-gap: 6px;
6787 z-index: 2;
6788 padding: 0;
6789 position: absolute;
6790 top: 50px;
6791 right: 16px;
6792 flex-flow: column;
6793 }
6794 .funnel-window .wpfnl-canvas-zoom-control .zoom-controls {
6795 display: flex;
6796 align-items: center;
6797 flex-direction: column;
6798 gap: 0px;
6799 background: #ffffff;
6800 padding: 0;
6801 flex-shrink: 0;
6802 border-radius: 6px;
6803 border: 1px solid #eaecf0;
6804 }
6805 .funnel-window .wpfnl-canvas-zoom-control .zoom-level,
6806 .funnel-window .wpfnl-canvas-zoom-control .full-screen,
6807 .funnel-window .wpfnl-canvas-zoom-control .zoom-out,
6808 .funnel-window .wpfnl-canvas-zoom-control .zoom-in {
6809 border: none;
6810 border-bottom: 1px solid #EEF0F3;
6811 width: 34px;
6812 height: 34px;
6813 background: transparent;
6814 display: flex;
6815 flex-flow: column;
6816 align-items: center;
6817 justify-content: center;
6818 cursor: pointer;
6819 position: relative;
6820 }
6821 .funnel-window .wpfnl-canvas-zoom-control .zoom-level .action-tooltip,
6822 .funnel-window .wpfnl-canvas-zoom-control .full-screen .action-tooltip,
6823 .funnel-window .wpfnl-canvas-zoom-control .zoom-out .action-tooltip,
6824 .funnel-window .wpfnl-canvas-zoom-control .zoom-in .action-tooltip {
6825 position: absolute;
6826 top: 50%;
6827 right: calc(100% + 12px);
6828 transform: translateY(-50%);
6829 border-radius: 8px;
6830 background: #10052E;
6831 box-shadow: 0 2px 15px 0 rgba(22, 28, 32, 0.08);
6832 color: #E8E8E9;
6833 font-size: 12px;
6834 font-weight: 400;
6835 line-height: 1;
6836 padding: 8px 12px;
6837 opacity: 0;
6838 visibility: hidden;
6839 transition: opacity 0.2s ease, visibility 0.2s ease, right 0.2s ease;
6840 white-space: nowrap;
6841 z-index: 10;
6842 pointer-events: none;
6843 }
6844 .funnel-window .wpfnl-canvas-zoom-control .zoom-level .action-tooltip:after,
6845 .funnel-window .wpfnl-canvas-zoom-control .full-screen .action-tooltip:after,
6846 .funnel-window .wpfnl-canvas-zoom-control .zoom-out .action-tooltip:after,
6847 .funnel-window .wpfnl-canvas-zoom-control .zoom-in .action-tooltip:after {
6848 content: "";
6849 position: absolute;
6850 top: 50%;
6851 right: -4px;
6852 width: 8px;
6853 height: 8px;
6854 background: #10052E;
6855 transform: translateY(-50%) rotate(45deg);
6856 border-radius: 2px;
6857 }
6858 .funnel-window .wpfnl-canvas-zoom-control .zoom-level:hover .action-tooltip,
6859 .funnel-window .wpfnl-canvas-zoom-control .full-screen:hover .action-tooltip,
6860 .funnel-window .wpfnl-canvas-zoom-control .zoom-out:hover .action-tooltip,
6861 .funnel-window .wpfnl-canvas-zoom-control .zoom-in:hover .action-tooltip {
6862 opacity: 1;
6863 visibility: visible;
6864 right: calc(100% + 8px);
6865 }
6866 .funnel-window .wpfnl-canvas-zoom-control .zoom-in {
6867 border-bottom: none;
6868 }
6869 .funnel-window .wpfnl-canvas-zoom-control .zoom-level {
6870 font-weight: 500;
6871 font-size: 10px;
6872 line-height: 1.2;
6873 color: #7A8B9A;
6874 text-align: center;
6875 }
6876 .funnel-window .wpfnl-canvas-zoom-control[data-tour=yes] {
6877 z-index: 4;
6878 }
6879
6880 .wpfnl-drawflow-window.is-expand-mode {
6881 position: fixed;
6882 inset: 0;
6883 z-index: 99999;
6884 background: #f6f5fa;
6885 }
6886 .wpfnl-drawflow-window.is-expand-mode .drawflow-window-header {
6887 display: none;
6888 }
6889 .wpfnl-drawflow-window.is-expand-mode .funnel-window {
6890 height: 100vh;
6891 }
6892 .wpfnl-drawflow-window.is-expand-mode .wpfnl-drawing-wrapper {
6893 height: 100vh;
6894 }
6895 .wpfnl-drawflow-window.is-expand-mode .wpfnl-drawing-window {
6896 height: 100vh;
6897 }
6898 .wpfnl-drawflow-window.is-expand-mode .wpfnl-vertical-flow-view {
6899 height: 100vh;
6900 }
6901 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn {
6902 position: absolute;
6903 top: 12px;
6904 left: 16px;
6905 z-index: 10;
6906 display: flex;
6907 align-items: center;
6908 gap: 5px;
6909 background: #ffffff;
6910 border: 1px solid #eaecf0;
6911 border-radius: 6px;
6912 padding: 6px 12px;
6913 cursor: pointer;
6914 font-size: 12px;
6915 font-weight: 500;
6916 color: #7a8b9a;
6917 transition: background 0.15s ease, color 0.15s ease;
6918 }
6919 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn svg {
6920 width: 10px;
6921 height: 10px;
6922 flex-shrink: 0;
6923 }
6924 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn svg path {
6925 stroke: #7a8b9a;
6926 }
6927 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn:hover {
6928 background: #f6f5fa;
6929 color: #344054;
6930 }
6931 .wpfnl-drawflow-window.is-expand-mode .expand-mode-exit-btn:hover svg path {
6932 stroke: #344054;
6933 }
6934
6935 body.wpfnl-builder-expand {
6936 overflow: hidden;
6937 }
6938 body.wpfnl-builder-expand #wpadminbar,
6939 body.wpfnl-builder-expand #adminmenuwrap,
6940 body.wpfnl-builder-expand #adminmenuback {
6941 display: none !important;
6942 }
6943
6944 .wpfnl-box {
6945 background: #FFFFFF;
6946 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
6947 border-radius: 6px;
6948 padding: 25px 30px;
6949 margin-bottom: 20px;
6950 }
6951 .wpfnl-box:last-child {
6952 margin-bottom: 0;
6953 }
6954 .wpfnl-box.transparent {
6955 background: transparent;
6956 box-shadow: none;
6957 padding: 4px 0px;
6958 }
6959
6960 .wpfnl-field-wrapper {
6961 display: flex;
6962 flex-flow: row wrap;
6963 align-items: center;
6964 justify-content: flex-start;
6965 margin-bottom: 30px;
6966 }
6967 .wpfnl-field-wrapper:last-child {
6968 margin-bottom: 0;
6969 }
6970 .wpfnl-field-wrapper > label {
6971 width: 240px;
6972 padding-right: 10px;
6973 }
6974 .wpfnl-field-wrapper > label.has-tooltip {
6975 display: flex;
6976 flex-flow: row;
6977 align-items: center;
6978 justify-content: flex-start;
6979 }
6980 .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
6981 margin-left: 10px;
6982 }
6983 .wpfnl-field-wrapper .wpfnl-fields {
6984 max-width: 410px;
6985 width: calc(100% - 240px);
6986 }
6987 .wpfnl-field-wrapper .wpfnl-fields select {
6988 margin-right: 0;
6989 }
6990
6991 .steps-settings .steps-settings__tab-nav {
6992 display: flex;
6993 flex-flow: row wrap;
6994 align-items: center;
6995 margin: 25px 0 22px;
6996 }
6997 .steps-settings .steps-settings__tab-nav li a {
6998 color: #7A8B9A;
6999 font-weight: 500;
7000 position: relative;
7001 display: flex;
7002 align-items: center;
7003 padding: 0 18px;
7004 height: 42px;
7005 line-height: 43px;
7006 border: 1px solid transparent;
7007 border-radius: 8px;
7008 cursor: pointer;
7009 transition: none;
7010 }
7011 .steps-settings .steps-settings__tab-nav li a svg {
7012 display: block;
7013 margin-right: 8px;
7014 position: relative;
7015 }
7016 .steps-settings .steps-settings__tab-nav li .pro-tag {
7017 position: absolute;
7018 top: -10px;
7019 right: 15px;
7020 }
7021 .steps-settings .steps-settings__tab-nav li.disabled .pro-tag-icon {
7022 position: static;
7023 margin-left: 6px;
7024 margin-top: -3px;
7025 }
7026 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a {
7027 color: #363B4E;
7028 border-color: #6E42D3;
7029 background-color: #ffffff;
7030 box-shadow: 0 20px 16px 0 rgba(189, 193, 200, 0.2);
7031 }
7032 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a .icon.stroke {
7033 stroke: #6E42D3;
7034 }
7035 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a .icon.order-bump-icon path {
7036 fill: #6E42D3;
7037 }
7038 .steps-settings .steps-settings__tab-nav li.active:not(.disabled) a[href="#general"] path {
7039 stroke: #6E42D3;
7040 }
7041 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-settings rect,
7042 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-settings circle,
7043 .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,
7044 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-stats circle,
7045 .steps-settings .steps-settings__tab-nav li.active:not(.disabled).nav-stats path {
7046 stroke: #6E42D3;
7047 }
7048 .steps-settings .steps-settings__tab-nav li.declare-winner.active a path {
7049 stroke: #6E42D3;
7050 }
7051 .steps-settings .steps-settings__tab-nav li.reset {
7052 margin-left: auto;
7053 margin-right: 40px;
7054 }
7055 .steps-settings .steps-settings__tab-nav li.reset button {
7056 font-size: 14px;
7057 line-height: 1;
7058 font-weight: 500;
7059 color: #7A8B9A;
7060 border: none;
7061 background: transparent;
7062 display: flex;
7063 align-items: center;
7064 cursor: pointer;
7065 }
7066 .steps-settings .steps-settings__tab-nav li.reset button svg {
7067 display: block;
7068 margin-left: 8px;
7069 position: relative;
7070 top: -1px;
7071 }
7072 .steps-settings .steps-settings__tab-nav li.reset button.reseting svg {
7073 animation: spin 0.9s linear infinite;
7074 }
7075 .steps-settings .steps-settings__tab-nav li.nav-tag {
7076 margin-left: auto;
7077 }
7078 .steps-settings .steps-settings__tab-nav li.nav-tag span {
7079 color: #8292A0;
7080 background: #F7F7FA;
7081 border-radius: 30px;
7082 display: inline-block;
7083 padding: 6px 17px;
7084 }
7085 .steps-settings .step-settings__single-tab-content {
7086 display: none;
7087 }
7088 .steps-settings .step-settings__single-tab-content #wpfnl-choose-offer[data-tour=yes],
7089 .steps-settings .step-settings__single-tab-content #gbf-product-quantity[data-tour=yes],
7090 .steps-settings .step-settings__single-tab-content #discount-options[data-tour=yes] {
7091 position: relative;
7092 z-index: 4;
7093 border: 1px solid #FFF;
7094 }
7095 .steps-settings .step-settings__single-tab-content:first-child {
7096 display: block;
7097 }
7098 .steps-settings .step-settings__single-tab-content .checkout-edit-field-tab__content-wrapper .pro-tag {
7099 padding: 14px 35px;
7100 text-align: center;
7101 margin-top: 30px;
7102 box-shadow: none;
7103 border-radius: 10px;
7104 }
7105 .steps-settings .single__settings-box.transparent .wpfnl-field-wrapper > label {
7106 width: 250px;
7107 }
7108 .steps-settings .single__settings-box .select2-hidden-accessible {
7109 display: none;
7110 }
7111 .steps-settings .single__settings-box .select2-container--default {
7112 width: 100% !important;
7113 border: 1px solid #E5E8F3;
7114 border-radius: 4px;
7115 padding: 8px;
7116 display: block;
7117 }
7118 .steps-settings .single__settings-box .select2-selection__rendered {
7119 font-size: 13px;
7120 display: block;
7121 }
7122 .steps-settings .single__settings-box .select2-selection__rendered .select2-selection__clear {
7123 background: #f8d7da;
7124 display: inline-block;
7125 padding: 0 3px;
7126 line-height: 14px;
7127 color: #ec4050;
7128 margin-right: 2px;
7129 border-radius: 100%;
7130 cursor: pointer;
7131 }
7132 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper {
7133 align-items: flex-start;
7134 }
7135 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper label {
7136 position: relative;
7137 top: 21px;
7138 }
7139 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper .btn-default {
7140 height: 26px;
7141 line-height: 26px;
7142 font-size: 12px;
7143 padding: 0 10px;
7144 min-width: auto;
7145 margin-right: 6px;
7146 border: 1px solid transparent;
7147 }
7148 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper .btn-default.create-product {
7149 background: #f6f6f8;
7150 color: #363B4E;
7151 }
7152 .steps-settings .single__settings-box.select-product .wpfnl-field-wrapper .btn-default.create-product:hover {
7153 color: #6E42D3;
7154 }
7155 .steps-settings .single__settings-box.select-product .products-wrapper {
7156 border: 1px solid #E5E8F3;
7157 box-sizing: border-box;
7158 border-radius: 5px;
7159 padding: 10px;
7160 margin-bottom: 10px;
7161 }
7162 .steps-settings .single__settings-box.select-product .single-product {
7163 display: flex;
7164 margin-bottom: 10px;
7165 }
7166 .steps-settings .single__settings-box.select-product .single-product:last-child {
7167 margin-bottom: 0;
7168 }
7169 .steps-settings .single__settings-box.select-product .single-product .select2-container--default {
7170 width: calc(100% - 46px) !important;
7171 }
7172 .steps-settings .single__settings-box.select-product .single-product button {
7173 background: #FAFAFB;
7174 border: 1px solid #E5E8F3;
7175 box-sizing: border-box;
7176 border-radius: 4px;
7177 width: 36px;
7178 height: 36px;
7179 margin-left: 10px;
7180 display: flex;
7181 flex-flow: column;
7182 align-items: center;
7183 justify-content: center;
7184 cursor: pointer;
7185 transition: all 0.3s ease;
7186 }
7187 .steps-settings .single__settings-box.select-product .single-product button:hover {
7188 background-color: #f8d7da;
7189 border-color: #f5c6cb;
7190 }
7191 .steps-settings .single__settings-box.select-product .single-product button:hover svg path {
7192 stroke: #ec4050;
7193 }
7194 .steps-settings .wpfnl-product-options {
7195 padding: 0;
7196 }
7197 .steps-settings .product-options__tab-nav {
7198 display: flex;
7199 flex-flow: row wrap;
7200 align-items: center;
7201 justify-content: flex-start;
7202 border-bottom: 1px solid #F4F4F9;
7203 padding: 0 40px;
7204 }
7205 .steps-settings .product-options__tab-nav li {
7206 margin-right: 35px;
7207 }
7208 .steps-settings .product-options__tab-nav li:last-child {
7209 margin-right: 0;
7210 }
7211 .steps-settings .product-options__tab-nav li a {
7212 font-weight: 500;
7213 font-size: 13px;
7214 line-height: 15px;
7215 color: #7A8B9A;
7216 padding: 15px 0;
7217 display: block;
7218 position: relative;
7219 }
7220 .steps-settings .product-options__tab-nav li a:after {
7221 content: "";
7222 position: absolute;
7223 left: 0;
7224 bottom: -1px;
7225 width: 100%;
7226 height: 2px;
7227 background: transparent;
7228 }
7229 .steps-settings .product-options__tab-nav li a:hover, .steps-settings .product-options__tab-nav li.active a {
7230 color: #6E42D3;
7231 }
7232 .steps-settings .product-options__tab-nav li a:hover:after, .steps-settings .product-options__tab-nav li.active a:after {
7233 background: #6E42D3;
7234 }
7235 .steps-settings .product-options__single-tab-content {
7236 display: none;
7237 padding: 30px 40px;
7238 }
7239 .steps-settings .product-options__single-tab-content:first-child {
7240 display: block;
7241 }
7242 .steps-settings .product-options__single-tab-content .wpfnl-field-wrapper {
7243 margin-bottom: 25px;
7244 }
7245 .steps-settings .product-options__single-tab-content .wpfnl-field-wrapper:last-child {
7246 margin-bottom: 0;
7247 }
7248 .steps-settings .settings-content__footer {
7249 padding: 23px 0 20px;
7250 display: flex;
7251 flex-flow: row wrap;
7252 align-items: center;
7253 justify-content: flex-end;
7254 gap: 14px;
7255 }
7256 .steps-settings .settings-content__footer .back2-edit {
7257 background: #fff;
7258 color: #363B4E;
7259 }
7260 .steps-settings .settings-content__footer .back2-edit:hover {
7261 background: rgba(0, 0, 0, 0.04);
7262 }
7263 .steps-settings .settings-content__footer #save-order-bump[hide-btn=yes] {
7264 display: none;
7265 }
7266 .steps-settings .settings-content__footer .btn-default {
7267 display: flex;
7268 flex-flow: row;
7269 align-items: center;
7270 justify-content: center;
7271 line-height: 1;
7272 height: auto;
7273 min-width: auto;
7274 padding: 14px 20px 12px;
7275 letter-spacing: -0.01em;
7276 border-radius: 8px;
7277 filter: drop-shadow(0px 10px 16px rgba(97, 103, 116, 0.15));
7278 }
7279 .steps-settings .settings-content__footer .btn-default .wpfnl-loader {
7280 display: block;
7281 }
7282 .steps-settings .settings-content__footer .btn-default[data-tour=yes] {
7283 position: relative;
7284 z-index: 4;
7285 border: 1px solid #FFF;
7286 }
7287 .steps-settings .settings-content__footer .cancel {
7288 border: 1px solid #EEF0F3;
7289 background: transparent;
7290 color: #363B4E;
7291 }
7292 .steps-settings .settings-content__footer .cancel:hover {
7293 background: #EEF0F3;
7294 }
7295 .steps-settings .settings-content__footer .wpfnl-alert {
7296 display: block;
7297 border-radius: 8px;
7298 padding: 10px 20px;
7299 }
7300
7301 .steps-settings.downsell .steps-settings__tab-nav li a svg,
7302 .steps-settings.upsell .steps-settings__tab-nav li a svg {
7303 position: relative;
7304 top: 1px;
7305 }
7306 .steps-settings.downsell .steps-settings__tab-nav li.conditonal-redirect.active a svg path,
7307 .steps-settings.upsell .steps-settings__tab-nav li.conditonal-redirect.active a svg path {
7308 fill: #6E42D3;
7309 stroke: none;
7310 }
7311 .steps-settings.downsell .wpfnl-field-wrapper .single-product svg,
7312 .steps-settings.upsell .wpfnl-field-wrapper .single-product svg {
7313 display: none;
7314 }
7315 .steps-settings.downsell .single__settings-box,
7316 .steps-settings.upsell .single__settings-box {
7317 border: 1px solid #E5E8F3;
7318 box-shadow: none;
7319 }
7320 .steps-settings.downsell .single__settings-box .select2-container--default,
7321 .steps-settings.upsell .single__settings-box .select2-container--default {
7322 border: 1px solid #E5E8F3;
7323 border-radius: 6px;
7324 padding: 4px 8px 2px;
7325 display: block;
7326 }
7327 .steps-settings.downsell .single__settings-box .select2-container--default .select2-selection--single,
7328 .steps-settings.upsell .single__settings-box .select2-container--default .select2-selection--single {
7329 background-color: #fff;
7330 border: none;
7331 border-radius: 0;
7332 }
7333 .steps-settings.downsell .single__settings-box .select2-container--default .select2-selection--single .select2-selection__arrow,
7334 .steps-settings.upsell .single__settings-box .select2-container--default .select2-selection--single .select2-selection__arrow {
7335 height: 26px;
7336 position: absolute;
7337 top: 4px;
7338 right: 1px;
7339 width: 20px;
7340 }
7341 .steps-settings.downsell .offer-discount-area .wpfnl-box,
7342 .steps-settings.upsell .offer-discount-area .wpfnl-box {
7343 box-shadow: none;
7344 border-radius: 10px;
7345 }
7346 .steps-settings.downsell .offer-discount-area .non-input-field,
7347 .steps-settings.upsell .offer-discount-area .non-input-field {
7348 cursor: not-allowed;
7349 background-color: #F6F5FA;
7350 font-size: 14px;
7351 color: #7A8B9A;
7352 padding: 13px 15px;
7353 height: 44px;
7354 width: 100%;
7355 min-width: 190px;
7356 border-radius: 6px;
7357 display: block;
7358 border: 1px solid #EBEDF0;
7359 }
7360 .steps-settings.downsell .offer-discount-area .hints.mobile,
7361 .steps-settings.upsell .offer-discount-area .hints.mobile {
7362 display: none;
7363 }
7364 .steps-settings.downsell .settings-content__footer .wpfnl-loader,
7365 .steps-settings.upsell .settings-content__footer .wpfnl-loader {
7366 display: block;
7367 }
7368 .steps-settings.downsell .settings-content__footer .wpfnl-alert,
7369 .steps-settings.upsell .settings-content__footer .wpfnl-alert {
7370 display: block;
7371 }
7372 .steps-settings.downsell .wpfnl-fields.price-range,
7373 .steps-settings.upsell .wpfnl-fields.price-range {
7374 display: flex;
7375 flex-flow: row wrap;
7376 }
7377 .steps-settings.downsell .wpfnl-fields.price-range .price-to,
7378 .steps-settings.downsell .wpfnl-fields.price-range .price-from,
7379 .steps-settings.upsell .wpfnl-fields.price-range .price-to,
7380 .steps-settings.upsell .wpfnl-fields.price-range .price-from {
7381 width: 50%;
7382 }
7383 .steps-settings.downsell .wpfnl-fields.price-range .price-to > label,
7384 .steps-settings.downsell .wpfnl-fields.price-range .price-from > label,
7385 .steps-settings.upsell .wpfnl-fields.price-range .price-to > label,
7386 .steps-settings.upsell .wpfnl-fields.price-range .price-from > label {
7387 margin-bottom: 5px;
7388 display: block;
7389 }
7390 .steps-settings.downsell .wpfnl-fields.price-range .price-to .wpfnl-fields,
7391 .steps-settings.downsell .wpfnl-fields.price-range .price-from .wpfnl-fields,
7392 .steps-settings.upsell .wpfnl-fields.price-range .price-to .wpfnl-fields,
7393 .steps-settings.upsell .wpfnl-fields.price-range .price-from .wpfnl-fields {
7394 width: 100%;
7395 }
7396 .steps-settings.downsell .wpfnl-fields.price-range .price-to .wpfnl-fields input[type=number],
7397 .steps-settings.downsell .wpfnl-fields.price-range .price-from .wpfnl-fields input[type=number],
7398 .steps-settings.upsell .wpfnl-fields.price-range .price-to .wpfnl-fields input[type=number],
7399 .steps-settings.upsell .wpfnl-fields.price-range .price-from .wpfnl-fields input[type=number] {
7400 min-width: auto;
7401 }
7402 .steps-settings.downsell .wpfnl-fields.price-range .price-from,
7403 .steps-settings.upsell .wpfnl-fields.price-range .price-from {
7404 padding-right: 10px;
7405 }
7406 .steps-settings.downsell .wpfnl-fields.price-range .price-to,
7407 .steps-settings.upsell .wpfnl-fields.price-range .price-to {
7408 padding-left: 10px;
7409 }
7410
7411 .steps-settings.thank-you .single__settings-box {
7412 border: 1px solid #E5E8F3;
7413 box-shadow: none;
7414 border-radius: 10px;
7415 }
7416 .steps-settings.thank-you .enabled-thankyou-page-redirection {
7417 margin-top: 24px;
7418 background-color: #F6F5FA;
7419 padding: 24px;
7420 border-radius: 10px;
7421 }
7422 .steps-settings.thank-you .redirect-thankyou-page {
7423 margin-top: 24px;
7424 display: grid;
7425 grid-template-columns: repeat(2, 1fr);
7426 gap: 20px;
7427 background-color: #F6F5FA;
7428 border-radius: 10px;
7429 }
7430 .steps-settings.thank-you .redirect-thankyou-page .single-page-option {
7431 position: relative;
7432 }
7433 .steps-settings.thank-you .redirect-thankyou-page .single-page-option > input[type=radio] {
7434 display: none;
7435 }
7436 .steps-settings.thank-you .redirect-thankyou-page .single-page-option .option-label {
7437 border-radius: 10px;
7438 border: 1px solid #E4E0F0;
7439 background-color: #FFF;
7440 cursor: pointer;
7441 padding: 24px;
7442 display: block;
7443 height: 100%;
7444 }
7445 .steps-settings.thank-you .redirect-thankyou-page .single-page-option .radio-point {
7446 position: absolute;
7447 top: 16px;
7448 right: 16px;
7449 }
7450 .steps-settings.thank-you .redirect-thankyou-page .single-page-option .radio-point circle:first-child {
7451 transform: scale(0);
7452 transform-origin: center;
7453 transition: all 0.3s ease;
7454 }
7455 .steps-settings.thank-you .redirect-thankyou-page .single-page-option > input[type=radio]:checked + .option-label {
7456 border-color: #6E42D3;
7457 }
7458 .steps-settings.thank-you .redirect-thankyou-page .single-page-option > input[type=radio]:checked + .option-label .radio-point circle:first-child {
7459 transform: scale(1);
7460 }
7461 .steps-settings.thank-you .redirect-thankyou-page .single-page-option h4 {
7462 color: #363B4E;
7463 font-size: 16px;
7464 font-weight: 500;
7465 line-height: 1.37;
7466 margin-bottom: 8px;
7467 max-width: 95%;
7468 }
7469 .steps-settings.thank-you .redirect-thankyou-page .single-page-option p {
7470 color: #525562;
7471 font-size: 14px;
7472 font-weight: 400;
7473 line-height: 1.4;
7474 }
7475 .steps-settings.thank-you .settings-content__footer .wpfnl-loader {
7476 display: none;
7477 }
7478 .steps-settings.thank-you .settings-content__footer .wpfnl-alert {
7479 display: none;
7480 }
7481
7482 @media only screen and (max-width: 1400px) {
7483 .wpfnl-box {
7484 padding: 20px 20px;
7485 }
7486 }
7487 @media only screen and (max-width: 1199px) {
7488 .steps-settings .product .single__settings-box .wpfnl-field-wrapper label {
7489 width: 150px;
7490 }
7491 .steps-settings .product .single__settings-box .wpfnl-field-wrapper .wpfnl-fields {
7492 width: calc(100% - 150px);
7493 }
7494 .steps-settings .steps-settings__tab-nav li.reset {
7495 margin-right: 0;
7496 }
7497 }
7498 .step-settings__single-tab-content .product-mode-selection,
7499 .checkout-product-setting-tab__content-wrapper .product-mode-selection {
7500 border-radius: 10px;
7501 padding: 20px;
7502 margin-bottom: 20px;
7503 border: 1px solid #EEF0F3;
7504 background: #fff;
7505 }
7506 .step-settings__single-tab-content .product-mode-selection .pms-header,
7507 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-header {
7508 display: flex;
7509 flex-direction: column;
7510 gap: 2px;
7511 margin-bottom: 16px;
7512 }
7513 .step-settings__single-tab-content .product-mode-selection .pms-title,
7514 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-title {
7515 font-size: 16px;
7516 font-weight: 600;
7517 color: #111827;
7518 line-height: 1.4;
7519 }
7520 .step-settings__single-tab-content .product-mode-selection .pms-subtitle,
7521 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-subtitle {
7522 font-size: 14px;
7523 color: #6b7280;
7524 line-height: 1.4;
7525 }
7526 .step-settings__single-tab-content .product-mode-selection .pms-cards,
7527 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-cards {
7528 display: grid;
7529 grid-template-columns: 1fr 1fr;
7530 gap: 12px;
7531 }
7532 .step-settings__single-tab-content .product-mode-selection .pms-card,
7533 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card {
7534 position: relative;
7535 display: flex;
7536 flex-direction: column;
7537 gap: 10px;
7538 padding: 16px;
7539 border: 1.5px solid #e5e7eb;
7540 border-radius: 10px;
7541 cursor: pointer;
7542 background: #fff;
7543 transition: border-color 0.15s, background 0.15s;
7544 }
7545 .step-settings__single-tab-content .product-mode-selection .pms-card.pms-card--active,
7546 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card.pms-card--active {
7547 border-color: #7c6ff7;
7548 background: #f0effe;
7549 }
7550 .step-settings__single-tab-content .product-mode-selection .pms-radio-input,
7551 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-input {
7552 position: absolute;
7553 opacity: 0;
7554 pointer-events: none;
7555 width: 0;
7556 height: 0;
7557 }
7558 .step-settings__single-tab-content .product-mode-selection .pms-card-top,
7559 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-top {
7560 display: flex;
7561 align-items: center;
7562 gap: 10px;
7563 }
7564 .step-settings__single-tab-content .product-mode-selection .pms-card-icon,
7565 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-icon {
7566 display: inline-flex;
7567 align-items: center;
7568 justify-content: center;
7569 width: 32px;
7570 height: 32px;
7571 border-radius: 8px;
7572 flex-shrink: 0;
7573 }
7574 .step-settings__single-tab-content .product-mode-selection .pms-card-icon.pms-card-icon--assign,
7575 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-icon.pms-card-icon--assign {
7576 background: #ede9ff;
7577 color: #6c5ce7;
7578 }
7579 .step-settings__single-tab-content .product-mode-selection .pms-card-icon.pms-card-icon--smart,
7580 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-icon.pms-card-icon--smart {
7581 background: #d1fae5;
7582 color: #059669;
7583 }
7584 .step-settings__single-tab-content .product-mode-selection .pms-card-name,
7585 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-name {
7586 font-size: 14px;
7587 font-weight: 600;
7588 color: #111827;
7589 flex: 1;
7590 }
7591 .step-settings__single-tab-content .product-mode-selection .pms-radio-dot,
7592 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-dot {
7593 display: inline-flex;
7594 align-items: center;
7595 justify-content: center;
7596 width: 18px;
7597 height: 18px;
7598 border-radius: 50%;
7599 border: 2px solid #d1d5db;
7600 flex-shrink: 0;
7601 transition: border-color 0.15s, background 0.15s;
7602 }
7603 .step-settings__single-tab-content .product-mode-selection .pms-radio-dot.pms-radio-dot--checked,
7604 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-dot.pms-radio-dot--checked {
7605 border-color: #7c6ff7;
7606 background: #7c6ff7;
7607 }
7608 .step-settings__single-tab-content .product-mode-selection .pms-radio-inner,
7609 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-radio-inner {
7610 display: block;
7611 width: 6px;
7612 height: 6px;
7613 border-radius: 50%;
7614 background: #fff;
7615 }
7616 .step-settings__single-tab-content .product-mode-selection .pms-card-desc,
7617 .checkout-product-setting-tab__content-wrapper .product-mode-selection .pms-card-desc {
7618 font-size: 13px;
7619 color: #6b7280;
7620 line-height: 1.5;
7621 margin: 0;
7622 }
7623 .step-settings__single-tab-content,
7624 .checkout-product-setting-tab__content-wrapper {
7625 /* Conditional Funnel dummy/upgrade preview */
7626 }
7627 .step-settings__single-tab-content .conditional-funnel-preview,
7628 .checkout-product-setting-tab__content-wrapper .conditional-funnel-preview {
7629 position: relative;
7630 overflow: hidden;
7631 padding: 0;
7632 background: #f5f6fa;
7633 }
7634 .step-settings__single-tab-content .conditional-funnel-dummy,
7635 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy {
7636 pointer-events: none;
7637 user-select: none;
7638 padding: 20px;
7639 }
7640 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-wrapper,
7641 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-wrapper {
7642 display: flex;
7643 flex-direction: column;
7644 gap: 0;
7645 }
7646 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-row,
7647 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-row {
7648 display: grid;
7649 grid-template-columns: 1fr 1fr;
7650 gap: 16px;
7651 background: #fff;
7652 border-radius: 8px;
7653 padding: 20px 24px;
7654 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
7655 }
7656 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-left,
7657 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-right,
7658 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-left,
7659 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-right {
7660 display: flex;
7661 flex-direction: column;
7662 }
7663 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-left .wpfnl-form-group,
7664 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-right .wpfnl-form-group,
7665 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-left .wpfnl-form-group,
7666 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-right .wpfnl-form-group {
7667 display: flex;
7668 flex-direction: column;
7669 gap: 8px;
7670 }
7671 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-left label,
7672 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-condition-right label,
7673 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-left label,
7674 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-condition-right label {
7675 font-size: 13px;
7676 font-weight: 500;
7677 color: #363b4e;
7678 }
7679 .step-settings__single-tab-content .conditional-funnel-dummy .required-star,
7680 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .required-star {
7681 color: #e74c3c;
7682 }
7683 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-select,
7684 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-select {
7685 display: flex;
7686 align-items: center;
7687 justify-content: space-between;
7688 background: #fff;
7689 border: 1px solid #dde1e7;
7690 border-radius: 6px;
7691 padding: 10px 14px;
7692 font-size: 13px;
7693 color: #7a8b9a;
7694 }
7695 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-select-text,
7696 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-select-text {
7697 color: #7a8b9a;
7698 }
7699 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-input,
7700 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-input {
7701 width: 100%;
7702 border: 1px solid #dde1e7;
7703 border-radius: 6px;
7704 padding: 10px 14px;
7705 font-size: 13px;
7706 color: #363b4e;
7707 background: #fff;
7708 }
7709 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-tag-field,
7710 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-tag-field {
7711 display: flex;
7712 align-items: center;
7713 flex-wrap: wrap;
7714 gap: 6px;
7715 background: #fff;
7716 border: 1px solid #dde1e7;
7717 border-radius: 6px;
7718 padding: 8px 14px;
7719 min-height: 42px;
7720 }
7721 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-tag,
7722 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-tag {
7723 display: inline-flex;
7724 align-items: center;
7725 background: #f0f1f5;
7726 border-radius: 4px;
7727 padding: 2px 8px;
7728 font-size: 12px;
7729 color: #363b4e;
7730 }
7731 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-connector,
7732 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-connector {
7733 display: flex;
7734 justify-content: center;
7735 height: 32px;
7736 position: relative;
7737 }
7738 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-connector-line,
7739 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-connector-line {
7740 width: 1px;
7741 height: 100%;
7742 background: #c5cad4;
7743 }
7744 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-add-condition,
7745 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-add-condition {
7746 display: flex;
7747 flex-direction: column;
7748 align-items: center;
7749 margin-top: 0;
7750 }
7751 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-add-line,
7752 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-add-line {
7753 width: 1px;
7754 height: 20px;
7755 background: #c5cad4;
7756 }
7757 .step-settings__single-tab-content .conditional-funnel-dummy .dummy-add-btn,
7758 .checkout-product-setting-tab__content-wrapper .conditional-funnel-dummy .dummy-add-btn {
7759 width: 32px;
7760 height: 32px;
7761 border-radius: 50%;
7762 background: #6a3fc8;
7763 border: none;
7764 display: flex;
7765 align-items: center;
7766 justify-content: center;
7767 cursor: default;
7768 box-shadow: 0 2px 8px rgba(106, 63, 200, 0.35);
7769 }
7770 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay,
7771 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay {
7772 position: absolute;
7773 inset: 0;
7774 z-index: 10;
7775 display: flex;
7776 align-items: center;
7777 justify-content: center;
7778 background: rgba(255, 255, 255, 0.78);
7779 border-radius: 10px;
7780 }
7781 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay .upgrade-overlay-content,
7782 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay .upgrade-overlay-content {
7783 display: flex;
7784 flex-direction: column;
7785 align-items: center;
7786 text-align: center;
7787 justify-content: center;
7788 gap: 12px;
7789 padding: 32px 24px;
7790 max-width: 420px;
7791 background: rgba(255, 255, 255, 0.9215686275);
7792 height: 100%;
7793 }
7794 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay .upgrade-lock-icon,
7795 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay .upgrade-lock-icon {
7796 display: flex;
7797 align-items: center;
7798 justify-content: center;
7799 width: 56px;
7800 height: 56px;
7801 border-radius: 50%;
7802 background: #f1f3f5;
7803 margin-bottom: 4px;
7804 }
7805 .step-settings__single-tab-content .conditional-funnel-upgrade-overlay .upgrade-overlay-content p,
7806 .checkout-product-setting-tab__content-wrapper .conditional-funnel-upgrade-overlay .upgrade-overlay-content p {
7807 font-size: 13px;
7808 color: #7a8b9a;
7809 line-height: 1.6;
7810 margin: 0;
7811 }
7812 .step-settings__single-tab-content .product-accordion__wrapper,
7813 .checkout-product-setting-tab__content-wrapper .product-accordion__wrapper {
7814 position: relative;
7815 }
7816 .step-settings__single-tab-content .product-area,
7817 .checkout-product-setting-tab__content-wrapper .product-area {
7818 background: #FFFFFF;
7819 border-radius: 10px;
7820 border: 1px solid #EEF0F3;
7821 }
7822 .step-settings__single-tab-content .product-head,
7823 .checkout-product-setting-tab__content-wrapper .product-head {
7824 display: flex;
7825 align-items: center;
7826 justify-content: space-between;
7827 padding: 16px 16px 16px 30px;
7828 border-bottom: 1px solid #EEF0F3;
7829 }
7830 .step-settings__single-tab-content .product-head .title,
7831 .checkout-product-setting-tab__content-wrapper .product-head .title {
7832 font-weight: 600;
7833 font-size: 16px;
7834 line-height: 1;
7835 color: #363B4E;
7836 text-transform: capitalize;
7837 margin-right: 10px;
7838 }
7839 .step-settings__single-tab-content .product-head .product-right,
7840 .checkout-product-setting-tab__content-wrapper .product-head .product-right {
7841 display: flex;
7842 align-items: center;
7843 gap: 15px;
7844 row-gap: 8px;
7845 }
7846 .step-settings__single-tab-content .product-head .create-product-btn,
7847 .checkout-product-setting-tab__content-wrapper .product-head .create-product-btn {
7848 margin-left: auto;
7849 margin-right: 10px;
7850 }
7851 .step-settings__single-tab-content .product-head .create-product-btn .btn-default,
7852 .checkout-product-setting-tab__content-wrapper .product-head .create-product-btn .btn-default {
7853 background: none;
7854 color: #6e42d3;
7855 padding: 0px;
7856 border-bottom: 1px solid #6e42d3;
7857 border-radius: 0px;
7858 min-width: auto;
7859 line-height: 1;
7860 height: auto;
7861 }
7862 .step-settings__single-tab-content .product-head .wpfnl-tooltip,
7863 .checkout-product-setting-tab__content-wrapper .product-head .wpfnl-tooltip {
7864 margin-left: 5px;
7865 margin-right: 10px;
7866 }
7867 .step-settings__single-tab-content .product-head .add-product-btn .btn-default,
7868 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default {
7869 height: 40px;
7870 line-height: 41px;
7871 background: #F7F7FA;
7872 border: 1px solid #E5E8F3;
7873 color: #363B4E;
7874 padding: 0 16px;
7875 }
7876 .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],
7877 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default:disabled,
7878 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default[disabled=disabled] {
7879 opacity: 0.7;
7880 cursor: not-allowed;
7881 }
7882 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color,
7883 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color {
7884 background: #6E42D3;
7885 border-color: #6E42D3;
7886 color: #FFFFFF;
7887 }
7888 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color svg path,
7889 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.wpfnl-btn-primary-color svg path {
7890 stroke: #FFFFFF;
7891 }
7892 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .add-product-icon,
7893 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .add-product-icon {
7894 position: relative;
7895 display: inline-block;
7896 width: 18px;
7897 height: 18px;
7898 }
7899 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .icon-tabler-arrow-narrow-left,
7900 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .icon-tabler-arrow-narrow-left {
7901 transform: rotate(-90deg);
7902 position: relative;
7903 top: 5px;
7904 display: none;
7905 animation: scrollDown1 1.5s ease infinite;
7906 stroke: none;
7907 }
7908 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .product-adding .icon-tabler-arrow-narrow-left,
7909 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .product-adding .icon-tabler-arrow-narrow-left {
7910 display: block;
7911 }
7912 .step-settings__single-tab-content .product-head .add-product-btn .btn-default .product-adding .plus-icon,
7913 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default .product-adding .plus-icon {
7914 display: none;
7915 }
7916 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.product-added,
7917 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.product-added {
7918 border-color: #6E42D3;
7919 background-color: #6E42D3;
7920 color: #fff;
7921 }
7922 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.product-added .plus-icon path,
7923 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.product-added .plus-icon path {
7924 stroke: #fff;
7925 }
7926 .step-settings__single-tab-content .product-head .add-product-btn .btn-default.product-added .icon-tabler-arrow-narrow-left,
7927 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn .btn-default.product-added .icon-tabler-arrow-narrow-left {
7928 stroke: #fff;
7929 }
7930 .step-settings__single-tab-content .product-head .add-product-btn button[data-tour=yes],
7931 .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn button[data-tour=yes] {
7932 position: relative;
7933 z-index: 4;
7934 }
7935 .step-settings__single-tab-content .product-head .create-product-button button[data-tour=yes],
7936 .checkout-product-setting-tab__content-wrapper .product-head .create-product-button button[data-tour=yes] {
7937 position: relative;
7938 z-index: 4;
7939 }
7940 @keyframes scrollDown1 {
7941 0% {
7942 transform: rotate(-90deg) translateX(15px);
7943 opacity: 0;
7944 }
7945 50% {
7946 transform: rotate(-90deg) translateX(0px);
7947 opacity: 1;
7948 }
7949 100% {
7950 transform: rotate(-90deg) translateX(-15px);
7951 opacity: 0;
7952 }
7953 }
7954 .step-settings__single-tab-content .accordion-footer .accordion-col,
7955 .step-settings__single-tab-content .accordion-head .accordion-col,
7956 .checkout-product-setting-tab__content-wrapper .accordion-footer .accordion-col,
7957 .checkout-product-setting-tab__content-wrapper .accordion-head .accordion-col {
7958 color: #7A8B9A;
7959 font-size: 14px;
7960 font-weight: 400;
7961 line-height: 1;
7962 text-transform: capitalize;
7963 letter-spacing: 0.35px;
7964 }
7965 .step-settings__single-tab-content .accordion-head,
7966 .checkout-product-setting-tab__content-wrapper .accordion-head {
7967 background-color: #F6F5FA;
7968 padding: 15px 30px;
7969 }
7970 .step-settings__single-tab-content .accordion-footer,
7971 .step-settings__single-tab-content .product-single__accordion-head,
7972 .step-settings__single-tab-content .accordion-head,
7973 .checkout-product-setting-tab__content-wrapper .accordion-footer,
7974 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head,
7975 .checkout-product-setting-tab__content-wrapper .accordion-head {
7976 display: flex;
7977 flex-flow: row wrap;
7978 align-items: center;
7979 justify-content: space-between;
7980 }
7981 .step-settings__single-tab-content .accordion-footer .product-name,
7982 .step-settings__single-tab-content .product-single__accordion-head .product-name,
7983 .step-settings__single-tab-content .accordion-head .product-name,
7984 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-name,
7985 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name,
7986 .checkout-product-setting-tab__content-wrapper .accordion-head .product-name {
7987 width: 340px;
7988 }
7989 .step-settings__single-tab-content .accordion-footer .product-price,
7990 .step-settings__single-tab-content .product-single__accordion-head .product-price,
7991 .step-settings__single-tab-content .accordion-head .product-price,
7992 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-price,
7993 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-price,
7994 .checkout-product-setting-tab__content-wrapper .accordion-head .product-price {
7995 width: 77px;
7996 cursor: text;
7997 }
7998 .step-settings__single-tab-content .accordion-footer .product-quantity,
7999 .step-settings__single-tab-content .product-single__accordion-head .product-quantity,
8000 .step-settings__single-tab-content .accordion-head .product-quantity,
8001 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-quantity,
8002 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-quantity,
8003 .checkout-product-setting-tab__content-wrapper .accordion-head .product-quantity {
8004 width: 80px;
8005 }
8006 .step-settings__single-tab-content .accordion-footer .total-price,
8007 .step-settings__single-tab-content .product-single__accordion-head .total-price,
8008 .step-settings__single-tab-content .accordion-head .total-price,
8009 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price,
8010 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .total-price,
8011 .checkout-product-setting-tab__content-wrapper .accordion-head .total-price {
8012 width: 120px;
8013 text-align: right;
8014 }
8015 .step-settings__single-tab-content .accordion-footer .total-price span,
8016 .step-settings__single-tab-content .product-single__accordion-head .total-price span,
8017 .step-settings__single-tab-content .accordion-head .total-price span,
8018 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price span,
8019 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .total-price span,
8020 .checkout-product-setting-tab__content-wrapper .accordion-head .total-price span {
8021 color: #363B4E;
8022 font-size: 14px;
8023 line-height: 14px;
8024 }
8025 .step-settings__single-tab-content .accordion-footer .product-action,
8026 .step-settings__single-tab-content .product-single__accordion-head .product-action,
8027 .step-settings__single-tab-content .accordion-head .product-action,
8028 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-action,
8029 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action,
8030 .checkout-product-setting-tab__content-wrapper .accordion-head .product-action {
8031 width: 60px;
8032 text-align: right;
8033 }
8034 .step-settings__single-tab-content .product__single-accordion,
8035 .checkout-product-setting-tab__content-wrapper .product__single-accordion {
8036 border-top: 1px solid #EEF0F3;
8037 position: relative;
8038 }
8039 .step-settings__single-tab-content .product__single-accordion.ui-sortable-helper,
8040 .checkout-product-setting-tab__content-wrapper .product__single-accordion.ui-sortable-helper {
8041 background: #ececec;
8042 }
8043 .step-settings__single-tab-content .product-single__accordion-head,
8044 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head {
8045 padding: 14px 30px;
8046 position: relative;
8047 }
8048 .step-settings__single-tab-content .product-single__accordion-head .accordion-col,
8049 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col {
8050 font-size: 14px;
8051 line-height: 16px;
8052 color: #7A8B9A;
8053 }
8054 .step-settings__single-tab-content .product-single__accordion-head .accordion-col span,
8055 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col span {
8056 color: #7A8B9A;
8057 }
8058 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select,
8059 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input,
8060 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select,
8061 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input {
8062 font-size: 14px;
8063 line-height: 16px;
8064 color: #363B4E;
8065 }
8066 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select::placeholder,
8067 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input::placeholder,
8068 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select::placeholder,
8069 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input::placeholder {
8070 color: #363B4E;
8071 }
8072 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select:-ms-input-placeholder,
8073 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input:-ms-input-placeholder,
8074 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select:-ms-input-placeholder,
8075 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input:-ms-input-placeholder {
8076 color: #363B4E;
8077 }
8078 .step-settings__single-tab-content .product-single__accordion-head .accordion-col select::-ms-input-placeholder,
8079 .step-settings__single-tab-content .product-single__accordion-head .accordion-col input::-ms-input-placeholder,
8080 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col select::-ms-input-placeholder,
8081 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .accordion-col input::-ms-input-placeholder {
8082 color: #363B4E;
8083 }
8084 .step-settings__single-tab-content .product-single__accordion-head .product-name ul,
8085 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul {
8086 display: flex;
8087 align-items: center;
8088 }
8089 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-img a,
8090 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-img a {
8091 display: block;
8092 }
8093 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-img img,
8094 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-img img {
8095 width: 36px;
8096 height: 36px;
8097 object-fit: cover;
8098 border-radius: 50%;
8099 }
8100 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title,
8101 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title {
8102 padding-left: 12px;
8103 width: calc(100% - 50px);
8104 }
8105 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title .title,
8106 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title .title {
8107 font-weight: 500;
8108 font-size: 14px;
8109 line-height: 16px;
8110 color: #363B4E;
8111 }
8112 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title .title:hover,
8113 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title .title:hover {
8114 text-decoration: underline;
8115 }
8116 .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title .price,
8117 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title .price {
8118 display: block;
8119 font-size: 12px;
8120 line-height: 14px;
8121 color: #363B4E;
8122 margin-top: 4px;
8123 }
8124 .step-settings__single-tab-content .product-single__accordion-head .product-quantity input[type=number],
8125 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-quantity input[type=number] {
8126 min-width: auto;
8127 border-color: #EEF0F3;
8128 border-radius: 8px;
8129 padding: 5px 10px;
8130 height: 30px;
8131 width: 63px;
8132 }
8133 .step-settings__single-tab-content .product-single__accordion-head .product-action,
8134 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action {
8135 display: flex;
8136 }
8137 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-edit,
8138 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-delete,
8139 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-edit,
8140 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-delete {
8141 width: 30px;
8142 height: 30px;
8143 display: flex;
8144 align-items: center;
8145 justify-content: flex-end;
8146 background: transparent;
8147 border: none;
8148 cursor: pointer;
8149 }
8150 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-edit svg,
8151 .step-settings__single-tab-content .product-single__accordion-head .product-action .product-delete svg,
8152 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-edit svg,
8153 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-delete svg {
8154 display: block;
8155 }
8156 .step-settings__single-tab-content .accordion-footer,
8157 .checkout-product-setting-tab__content-wrapper .accordion-footer {
8158 border-top: 1px solid #EEF0F3;
8159 padding: 14px 30px;
8160 justify-content: flex-end;
8161 }
8162 .step-settings__single-tab-content .accordion-footer .total-price,
8163 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price {
8164 display: flex;
8165 justify-content: flex-end;
8166 color: #363B4E;
8167 font-size: 16px;
8168 font-weight: 600;
8169 line-height: 1;
8170 }
8171 .step-settings__single-tab-content .accordion-footer .total-price span,
8172 .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price span {
8173 letter-spacing: 0.857143px;
8174 font-weight: 700;
8175 margin-left: 4px;
8176 font-size: 12px;
8177 }
8178 .step-settings__single-tab-content .product__single-accordion .product-single__accordion-body,
8179 .checkout-product-setting-tab__content-wrapper .product__single-accordion .product-single__accordion-body {
8180 display: none;
8181 }
8182 .step-settings__single-tab-content .product__single-accordion.active,
8183 .checkout-product-setting-tab__content-wrapper .product__single-accordion.active {
8184 background: rgba(110, 66, 211, 0.07);
8185 border-top-color: transparent;
8186 }
8187 .step-settings__single-tab-content .product__single-accordion.active::before,
8188 .checkout-product-setting-tab__content-wrapper .product__single-accordion.active::before {
8189 background-color: #6E42D3;
8190 }
8191 .step-settings__single-tab-content .product-single__accordion-body,
8192 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body {
8193 padding: 0 25px 25px;
8194 }
8195 .step-settings__single-tab-content .product-single__accordion-body-content,
8196 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content {
8197 display: flex;
8198 flex-flow: row wrap;
8199 background: #fff;
8200 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
8201 border-radius: 10px;
8202 }
8203 .step-settings__single-tab-content .product-single__accordion-body-content .subtext-settings,
8204 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings {
8205 width: 50%;
8206 padding: 20px 60px 20px 25px;
8207 border-right: 1px solid #E5E8F3;
8208 }
8209 .step-settings__single-tab-content .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper,
8210 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper {
8211 align-items: flex-start;
8212 }
8213 .step-settings__single-tab-content .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper label,
8214 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings .wpfnl-field-wrapper label {
8215 margin-top: 11px;
8216 }
8217 .step-settings__single-tab-content .product-single__accordion-body-content .highlights,
8218 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .highlights {
8219 width: 50%;
8220 padding: 20px 20px 20px 60px;
8221 }
8222 .step-settings__single-tab-content .product-single__accordion-body-content .wpfnl-field-wrapper label,
8223 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-field-wrapper label {
8224 width: 145px;
8225 }
8226 .step-settings__single-tab-content .product-single__accordion-body-content .wpfnl-fields,
8227 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-fields {
8228 max-width: 100%;
8229 width: calc(100% - 145px);
8230 }
8231 .step-settings__single-tab-content .no-product-notice,
8232 .checkout-product-setting-tab__content-wrapper .no-product-notice {
8233 text-align: center;
8234 padding: 15px 10px;
8235 }
8236 .step-settings__single-tab-content .wpfnl-discount-settings,
8237 .checkout-product-setting-tab__content-wrapper .wpfnl-discount-settings {
8238 border: 1px solid #EEF0F3;
8239 box-shadow: none;
8240 border-radius: 10px;
8241 margin-top: 30px;
8242 padding: 30px;
8243 }
8244 .step-settings__single-tab-content .wpfnl-discount-settings .non-input-field,
8245 .checkout-product-setting-tab__content-wrapper .wpfnl-discount-settings .non-input-field {
8246 cursor: not-allowed;
8247 background-color: #F6F5FA;
8248 font-size: 14px;
8249 color: #7A8B9A;
8250 padding: 13px 15px;
8251 height: 44px;
8252 width: 100%;
8253 min-width: 190px;
8254 border-radius: 6px;
8255 display: block;
8256 border: 1px solid #EBEDF0;
8257 }
8258 .step-settings__single-tab-content .wpfnl-discount-settings[data-tour=yes] #discount-options,
8259 .checkout-product-setting-tab__content-wrapper .wpfnl-discount-settings[data-tour=yes] #discount-options {
8260 z-index: 4;
8261 position: relative;
8262 }
8263 .step-settings__single-tab-content .wpfnl-single-settings-control,
8264 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control {
8265 display: flex;
8266 flex-flow: row wrap;
8267 align-items: center;
8268 justify-content: space-between;
8269 gap: 15px;
8270 border-bottom: 1px solid #EEF0F3;
8271 padding: 24px 0;
8272 }
8273 .step-settings__single-tab-content .wpfnl-single-settings-control:first-child,
8274 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control:first-child {
8275 padding-top: 0;
8276 }
8277 .step-settings__single-tab-content .wpfnl-single-settings-control:last-child,
8278 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control:last-child {
8279 border-bottom: none;
8280 padding-bottom: 0;
8281 }
8282 .step-settings__single-tab-content .wpfnl-single-settings-control.wpnfl-align-top,
8283 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.wpnfl-align-top {
8284 align-items: flex-start;
8285 }
8286 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-title,
8287 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-title {
8288 width: calc(55% - 15px);
8289 }
8290 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-title h4,
8291 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-title h4 {
8292 color: #363B4E;
8293 font-size: 16px;
8294 font-weight: 500;
8295 line-height: 1.3;
8296 }
8297 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-title p,
8298 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-title p {
8299 color: #525562;
8300 font-size: 14px;
8301 font-weight: 400;
8302 line-height: 1.4;
8303 margin-top: 3px;
8304 }
8305 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field,
8306 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field {
8307 width: 45%;
8308 max-width: 250px;
8309 display: flex;
8310 flex-flow: column;
8311 align-items: flex-end;
8312 gap: 12px;
8313 }
8314 .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,
8315 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field > input:not([type=checkbox], [type=radio]),
8316 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field > select {
8317 width: 250px;
8318 height: 44px;
8319 border-radius: 10px;
8320 border-color: #EBEDF0;
8321 margin-left: auto;
8322 color: #525562;
8323 }
8324 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .settings-control-price,
8325 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .settings-control-price {
8326 width: 250px;
8327 height: 44px;
8328 border-radius: 10px;
8329 border-color: #EBEDF0;
8330 margin-left: auto;
8331 background: #F6F5FA;
8332 padding: 10px 15px;
8333 display: flex;
8334 flex-flow: column;
8335 justify-content: center;
8336 }
8337 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .wpfnl-switcher .pro-tag-icon,
8338 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .wpfnl-switcher .pro-tag-icon {
8339 position: absolute;
8340 top: 0;
8341 left: -30px;
8342 }
8343 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox,
8344 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox {
8345 position: relative;
8346 }
8347 .step-settings__single-tab-content .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox .pro-tag-icon,
8348 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .settings-control-field .wpfnl-checkbox .pro-tag-icon {
8349 position: absolute;
8350 top: 0;
8351 left: -30px;
8352 }
8353 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender,
8354 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender {
8355 position: absolute;
8356 }
8357 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker,
8358 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker {
8359 border: 1px solid #eef0f3;
8360 border-radius: 10px;
8361 padding: 8px;
8362 }
8363 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title,
8364 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
8365 display: flex;
8366 }
8367 .step-settings__single-tab-content .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title select,
8368 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control .div-to-append-range-calender .ui-datepicker .ui-datepicker-title select {
8369 width: auto;
8370 min-width: max-content;
8371 flex: 1;
8372 height: 28px;
8373 min-height: auto;
8374 margin: 0;
8375 }
8376 .step-settings__single-tab-content .wpfnl-single-settings-control.enable-discount,
8377 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.enable-discount {
8378 border-bottom: 0;
8379 padding-bottom: 0;
8380 }
8381 .step-settings__single-tab-content .wpfnl-single-settings-control.discount .settings-control-field,
8382 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.discount .settings-control-field {
8383 flex-flow: row;
8384 width: 100%;
8385 max-width: 100%;
8386 justify-content: flex-end;
8387 }
8388 .step-settings__single-tab-content .wpfnl-single-settings-control.discount .settings-control-field label,
8389 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.discount .settings-control-field label {
8390 display: block;
8391 margin-bottom: 6px;
8392 }
8393 .step-settings__single-tab-content .wpfnl-single-settings-control.discount .settings-control-field input[type=text],
8394 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.discount .settings-control-field input[type=text] {
8395 height: 44px;
8396 }
8397 .step-settings__single-tab-content .wpfnl-single-settings-control.no-border,
8398 .checkout-product-setting-tab__content-wrapper .wpfnl-single-settings-control.no-border {
8399 padding-bottom: 0;
8400 border-bottom: none;
8401 }
8402 .step-settings__single-tab-content .no-product,
8403 .checkout-product-setting-tab__content-wrapper .no-product {
8404 display: flex;
8405 flex-flow: column;
8406 align-items: center;
8407 justify-content: center;
8408 padding: 30px 24px;
8409 gap: 14px;
8410 }
8411 .step-settings__single-tab-content .no-product p,
8412 .checkout-product-setting-tab__content-wrapper .no-product p {
8413 color: #363B4E;
8414 font-size: 16px;
8415 font-weight: 500;
8416 line-height: 1;
8417 }
8418 .step-settings__single-tab-content .disable-payment-gateways .settings-control-field,
8419 .checkout-product-setting-tab__content-wrapper .disable-payment-gateways .settings-control-field {
8420 gap: 10px;
8421 align-items: flex-start;
8422 max-width: 140px;
8423 }
8424 .step-settings__single-tab-content .disable-payment-gateways .settings-control-field.is-not-pro,
8425 .checkout-product-setting-tab__content-wrapper .disable-payment-gateways .settings-control-field.is-not-pro {
8426 max-width: max-content;
8427 }
8428 .step-settings__single-tab-content .wpfnl-additional-replacement-options,
8429 .step-settings__single-tab-content .checkout-product-options,
8430 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options,
8431 .checkout-product-setting-tab__content-wrapper .checkout-product-options {
8432 margin-top: 30px;
8433 border-radius: 10px;
8434 padding: 26px 30px 30px;
8435 border: 1px solid #EEF0F3;
8436 box-shadow: none;
8437 }
8438 .step-settings__single-tab-content .wpfnl-additional-replacement-options .additional-options,
8439 .step-settings__single-tab-content .checkout-product-options .additional-options,
8440 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .additional-options,
8441 .checkout-product-setting-tab__content-wrapper .checkout-product-options .additional-options {
8442 width: 100%;
8443 margin-right: 12px;
8444 }
8445 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox label:before,
8446 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox label:before,
8447 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox label:before,
8448 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox label:before {
8449 border-color: #CDD2E6;
8450 }
8451 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox input[type=checkbox]:checked + label::before,
8452 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox input[type=checkbox]:checked + label::before,
8453 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox input[type=checkbox]:checked + label::before,
8454 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox input[type=checkbox]:checked + label::before {
8455 border-color: #6E42D3;
8456 }
8457 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label:before,
8458 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox.disabled label:before,
8459 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label:before,
8460 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox.disabled label:before {
8461 border-color: #E5E8F3 !important;
8462 background-color: rgba(0, 0, 0, 0.2196078431) !important;
8463 cursor: not-allowed;
8464 }
8465 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label::after,
8466 .step-settings__single-tab-content .checkout-product-options .wpfnl-checkbox.disabled label::after,
8467 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-checkbox.disabled label::after,
8468 .checkout-product-setting-tab__content-wrapper .checkout-product-options .wpfnl-checkbox.disabled label::after {
8469 display: none;
8470 }
8471 .step-settings__single-tab-content .wpfnl-additional-replacement-options .option-title,
8472 .step-settings__single-tab-content .checkout-product-options .option-title,
8473 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .option-title,
8474 .checkout-product-setting-tab__content-wrapper .checkout-product-options .option-title {
8475 margin-bottom: 18px;
8476 color: #7A8B9A;
8477 font-size: 14px;
8478 font-weight: 600;
8479 line-height: 1;
8480 letter-spacing: 1.68px;
8481 text-transform: uppercase;
8482 }
8483 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper,
8484 .step-settings__single-tab-content .checkout-product-options .options-wrapper,
8485 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper,
8486 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper {
8487 padding: 0 !important;
8488 }
8489 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #checkout-coupon[data-tour=yes],
8490 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #auto-coupon[data-tour=yes],
8491 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #enable-quantity-selection[data-tour=yes],
8492 .step-settings__single-tab-content .checkout-product-options .options-wrapper #checkout-coupon[data-tour=yes],
8493 .step-settings__single-tab-content .checkout-product-options .options-wrapper #auto-coupon[data-tour=yes],
8494 .step-settings__single-tab-content .checkout-product-options .options-wrapper #enable-quantity-selection[data-tour=yes],
8495 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #checkout-coupon[data-tour=yes],
8496 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #auto-coupon[data-tour=yes],
8497 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #enable-quantity-selection[data-tour=yes],
8498 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #checkout-coupon[data-tour=yes],
8499 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #auto-coupon[data-tour=yes],
8500 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #enable-quantity-selection[data-tour=yes] {
8501 position: relative;
8502 z-index: 4;
8503 }
8504 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes],
8505 .step-settings__single-tab-content .checkout-product-options .options-wrapper #disable-payments[data-tour=yes],
8506 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes],
8507 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #disable-payments[data-tour=yes] {
8508 position: relative;
8509 z-index: 4;
8510 }
8511 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes] label,
8512 .step-settings__single-tab-content .checkout-product-options .options-wrapper #disable-payments[data-tour=yes] label,
8513 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .options-wrapper #disable-payments[data-tour=yes] label,
8514 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper #disable-payments[data-tour=yes] label {
8515 color: #fff;
8516 }
8517 .step-settings__single-tab-content .wpfnl-additional-replacement-options select#choose-coupon,
8518 .step-settings__single-tab-content .checkout-product-options select#choose-coupon,
8519 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options select#choose-coupon,
8520 .checkout-product-setting-tab__content-wrapper .checkout-product-options select#choose-coupon {
8521 display: none;
8522 }
8523 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box,
8524 .step-settings__single-tab-content .checkout-product-options .coupon-box,
8525 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box,
8526 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box {
8527 height: 44px;
8528 width: 250px;
8529 border-radius: 6px;
8530 position: relative;
8531 display: flex;
8532 position: relative;
8533 }
8534 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .search-icon,
8535 .step-settings__single-tab-content .checkout-product-options .coupon-box .search-icon,
8536 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .search-icon,
8537 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .search-icon {
8538 position: absolute;
8539 left: 12px;
8540 top: 13px;
8541 z-index: 100;
8542 }
8543 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .search-icon svg,
8544 .step-settings__single-tab-content .checkout-product-options .coupon-box .search-icon svg,
8545 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .search-icon svg,
8546 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .search-icon svg {
8547 display: block;
8548 }
8549 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .select2.select2-container.select2-container--default,
8550 .step-settings__single-tab-content .checkout-product-options .coupon-box .select2.select2-container.select2-container--default,
8551 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .select2.select2-container.select2-container--default,
8552 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .select2.select2-container.select2-container--default {
8553 width: 100% !important;
8554 border: none;
8555 }
8556 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .select2-container--default .select2-selection--single,
8557 .step-settings__single-tab-content .checkout-product-options .coupon-box .select2-container--default .select2-selection--single,
8558 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .select2-container--default .select2-selection--single,
8559 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .select2-container--default .select2-selection--single {
8560 background-color: transparent;
8561 border: none;
8562 height: auto;
8563 }
8564 .step-settings__single-tab-content .wpfnl-additional-replacement-options .coupon-box .select2-selection__rendered,
8565 .step-settings__single-tab-content .checkout-product-options .coupon-box .select2-selection__rendered,
8566 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .coupon-box .select2-selection__rendered,
8567 .checkout-product-setting-tab__content-wrapper .checkout-product-options .coupon-box .select2-selection__rendered {
8568 padding: 12px 15px 11px 35px;
8569 width: 100%;
8570 border-radius: 10px;
8571 white-space: pre;
8572 overflow: hidden;
8573 text-overflow: ellipsis;
8574 display: block;
8575 -webkit-line-clamp: 3;
8576 -webkit-box-orient: vertical;
8577 line-height: normal;
8578 border: 1px solid #e9e7e7;
8579 background: #ffffff;
8580 }
8581 .step-settings__single-tab-content .wpfnl-additional-replacement-options .wpfnl-additional-replacement-options,
8582 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .wpfnl-additional-replacement-options {
8583 margin-top: 0;
8584 }
8585 .step-settings__single-tab-content .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper,
8586 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper {
8587 width: 100%;
8588 }
8589 .step-settings__single-tab-content .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper .wpfnl-fields,
8590 .checkout-product-setting-tab__content-wrapper .wpfnl-additional-replacement-options .variation-options .wpfnl-field-wrapper .wpfnl-fields {
8591 width: 100%;
8592 max-width: 270px;
8593 }
8594 .step-settings__single-tab-content .enabled-replace-settings,
8595 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings {
8596 margin-top: 24px;
8597 display: grid;
8598 grid-template-columns: repeat(3, 1fr);
8599 background-color: #F6F5FA;
8600 gap: 20px;
8601 padding: 20px 24px;
8602 border-radius: 10px;
8603 }
8604 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option,
8605 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option {
8606 position: relative;
8607 }
8608 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option > input[type=radio],
8609 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option > input[type=radio] {
8610 display: none;
8611 }
8612 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option .option-label,
8613 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option .option-label {
8614 border-radius: 10px;
8615 border: 1px solid #E4E0F0;
8616 background-color: #FFF;
8617 cursor: pointer;
8618 padding: 24px;
8619 display: block;
8620 height: 100%;
8621 }
8622 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option .radio-point,
8623 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option .radio-point {
8624 position: absolute;
8625 top: 16px;
8626 right: 16px;
8627 }
8628 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option .radio-point circle:first-child,
8629 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option .radio-point circle:first-child {
8630 transform: scale(0);
8631 transform-origin: center;
8632 transition: all 0.3s ease;
8633 }
8634 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label,
8635 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label {
8636 border-color: #6E42D3;
8637 }
8638 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label .radio-point circle:first-child,
8639 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option > input[type=radio]:checked + .option-label .radio-point circle:first-child {
8640 transform: scale(1);
8641 }
8642 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option h4,
8643 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option h4 {
8644 color: #363B4E;
8645 font-size: 16px;
8646 font-weight: 500;
8647 line-height: 1.37;
8648 margin-bottom: 8px;
8649 max-width: 95%;
8650 }
8651 .step-settings__single-tab-content .enabled-replace-settings .single-replace-option p,
8652 .checkout-product-setting-tab__content-wrapper .enabled-replace-settings .single-replace-option p {
8653 color: #525562;
8654 font-size: 14px;
8655 font-weight: 400;
8656 line-height: 1.4;
8657 }
8658
8659 .step-settings__single-tab-content.product .product-head .product-search {
8660 margin-left: 0;
8661 }
8662
8663 @media only screen and (max-width: 1499px) {
8664 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings {
8665 padding: 20px;
8666 }
8667 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .highlights {
8668 padding: 20px;
8669 }
8670 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-field-wrapper label {
8671 width: 111px;
8672 }
8673 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .wpfnl-fields {
8674 width: calc(100% - 111px);
8675 }
8676 }
8677 @media only screen and (max-width: 1299px) {
8678 .step-settings__single-tab-content .wpfnl-additional-replacement-options,
8679 .checkout-product-setting-tab__content-wrapper .checkout-product-options {
8680 padding: 20px;
8681 }
8682 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper,
8683 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper {
8684 padding: 15px;
8685 }
8686 }
8687 @media only screen and (max-width: 1199px) {
8688 .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name,
8689 .checkout-product-setting-tab__content-wrapper .accordion-footer .product-name,
8690 .checkout-product-setting-tab__content-wrapper .accordion-head .product-name {
8691 width: 220px;
8692 }
8693 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content {
8694 display: block;
8695 }
8696 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .subtext-settings {
8697 width: 100%;
8698 }
8699 .checkout-product-setting-tab__content-wrapper .product-single__accordion-body-content .highlights {
8700 padding: 0 20px 20px;
8701 width: 100%;
8702 }
8703 .step-settings__single-tab-content .wpfnl-additional-replacement-options,
8704 .checkout-product-setting-tab__content-wrapper .checkout-product-options {
8705 display: block;
8706 }
8707 .step-settings__single-tab-content .wpfnl-additional-replacement-options .additional-options,
8708 .checkout-product-setting-tab__content-wrapper .checkout-product-options .additional-options {
8709 width: 100%;
8710 margin-right: 0;
8711 margin-bottom: 24px;
8712 }
8713 .step-settings__single-tab-content .wpfnl-additional-replacement-options .variation-options,
8714 .checkout-product-setting-tab__content-wrapper .checkout-product-options .variation-options {
8715 width: 100%;
8716 margin-left: 0;
8717 }
8718 .step-settings__single-tab-content .wpfnl-additional-replacement-options .options-wrapper,
8719 .checkout-product-setting-tab__content-wrapper .checkout-product-options .options-wrapper {
8720 height: auto;
8721 }
8722 }
8723 @media only screen and (max-width: 991px) {
8724 .checkout-product-setting-tab__content-wrapper .product-head .product-search {
8725 width: 190px;
8726 }
8727 }
8728 .order-bump-accordion-wrapper {
8729 border: 1px solid #EEF0F3;
8730 border-radius: 10px;
8731 }
8732 .order-bump-accordion-wrapper .order-bump-header {
8733 display: flex;
8734 align-items: center;
8735 justify-content: space-between;
8736 background: #FFFFFF;
8737 border-radius: 10px 10px 0px 0px;
8738 padding: 15px 24px;
8739 border-bottom: 1px solid #EEF0F3;
8740 }
8741 .order-bump-accordion-wrapper .order-bump-header .title {
8742 font-weight: 500;
8743 font-size: 16px;
8744 line-height: 19px;
8745 color: #363B4E;
8746 text-transform: capitalize;
8747 margin-right: 10px;
8748 }
8749 .order-bump-accordion-wrapper .order-bump-header .btn-default {
8750 position: relative;
8751 }
8752 .order-bump-accordion-wrapper .order-bump-header .btn-default .pro-tag-icon {
8753 position: static;
8754 margin-left: 4px;
8755 transform: translateY(5px);
8756 display: inline-block;
8757 }
8758 .order-bump-accordion-wrapper .order-bump-header .btn-default:disabled {
8759 opacity: 0.6;
8760 cursor: not-allowed;
8761 }
8762 .order-bump-accordion-wrapper .order-bump-header .btn-default:disabled:hover {
8763 background-color: #6E42D3;
8764 }
8765 .order-bump-accordion-wrapper .order-bump-accordion-header {
8766 width: 100%;
8767 background: #FFFFFF;
8768 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
8769 border-bottom: 1px solid transparent;
8770 border-radius: 10px;
8771 padding: 0 24px;
8772 display: flex;
8773 align-items: center;
8774 justify-content: space-between;
8775 }
8776 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area {
8777 padding: 14px 0;
8778 cursor: pointer;
8779 width: calc(100% - 67px);
8780 }
8781 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .title {
8782 font-weight: 500;
8783 color: #363B4E;
8784 }
8785 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .title small {
8786 color: #7A8B9A;
8787 font-weight: 400;
8788 }
8789 .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .icon {
8790 width: 9px;
8791 height: 9px;
8792 display: inline-block;
8793 border: 2px solid #363B4E;
8794 border-top: none;
8795 border-left: none;
8796 transform: rotate(45deg);
8797 transform-origin: center;
8798 position: relative;
8799 top: -1px;
8800 margin-right: 12px;
8801 transition: transform 0.3s ease;
8802 }
8803 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area {
8804 display: flex;
8805 align-items: center;
8806 }
8807 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area .wpfnl-switcher.has-loader {
8808 display: flex;
8809 align-items: center;
8810 }
8811 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area .wpfnl-switcher.has-loader .wpfnl-loader {
8812 display: inline-block;
8813 margin-left: 0;
8814 margin-right: 5px;
8815 }
8816 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area button {
8817 border: none;
8818 cursor: pointer;
8819 text-align: center;
8820 padding: 0 6px;
8821 display: inline-block;
8822 height: 30px;
8823 line-height: 30px;
8824 background-color: transparent;
8825 margin: 0 0 0 2px;
8826 }
8827 .order-bump-accordion-wrapper .order-bump-accordion-header .action-area button.delete-checkout-field svg {
8828 width: 20px;
8829 height: 20px;
8830 }
8831 .order-bump-accordion-wrapper .order-bump-body {
8832 border-radius: 0 0 10px 10px;
8833 }
8834 .order-bump-accordion-wrapper .order-bump-body .wpfnl-order-bump-modal-header,
8835 .order-bump-accordion-wrapper .order-bump-body .wpfnl-order-bump-modal-footer {
8836 display: none;
8837 }
8838 .order-bump-accordion-wrapper .order-bump-body .order-bump-table-header {
8839 background-color: #F6F5FA;
8840 display: grid;
8841 grid-template-columns: 9fr 1fr 1fr;
8842 padding: 15px 24px;
8843 border-bottom: 1px solid #EEF0F3;
8844 }
8845 .order-bump-accordion-wrapper .order-bump-body .order-bump-table-header .oder-bump-table-header-text {
8846 color: #7A8B9A;
8847 font-family: Roboto;
8848 font-size: 14px;
8849 font-style: normal;
8850 font-weight: 400;
8851 line-height: normal;
8852 text-transform: capitalize;
8853 }
8854 .order-bump-accordion-wrapper .order-bump-body .order-bump-table-header .oder-bump-table-header-text.order-bump-actions {
8855 margin-left: auto;
8856 padding-right: 5px;
8857 }
8858 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump {
8859 margin-bottom: 0;
8860 box-shadow: none;
8861 border-bottom: 1px solid #EEF0F3;
8862 border-radius: 0;
8863 }
8864 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump:last-child {
8865 border-radius: 0 0 10px 10px;
8866 border-bottom: none;
8867 }
8868 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump .order-bump-accordion-header {
8869 padding: 0 24px;
8870 border-radius: 0;
8871 display: grid;
8872 grid-template-columns: 9fr 1fr 1fr;
8873 border: none;
8874 }
8875 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump .order-bump-accordion-header .action-area {
8876 justify-content: flex-end;
8877 }
8878 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump:last-child .order-bump-accordion-header {
8879 border-radius: 0 0 10px 10px;
8880 }
8881 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-order-bump-create-modal {
8882 position: absolute;
8883 width: 100%;
8884 max-height: 300%;
8885 top: 7px;
8886 background: #fff;
8887 left: 0px;
8888 z-index: 2;
8889 padding: 24px;
8890 }
8891 .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 {
8892 display: flex;
8893 align-items: center;
8894 justify-content: space-between;
8895 margin-bottom: 20px;
8896 }
8897 .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 {
8898 display: flex;
8899 align-items: center;
8900 gap: 10px;
8901 }
8902 .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 {
8903 border-radius: 10px;
8904 border: 1px solid #EBEDF0;
8905 background: #FFF;
8906 display: flex;
8907 align-items: center;
8908 justify-content: center;
8909 padding: 7px;
8910 cursor: pointer;
8911 }
8912 .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 {
8913 color: #363B4E;
8914 font-family: Roboto;
8915 font-size: 18px;
8916 font-style: normal;
8917 font-weight: 600;
8918 line-height: normal;
8919 }
8920 .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 {
8921 border-radius: 10px;
8922 border: 1px solid #EBEDF0;
8923 cursor: pointer;
8924 padding: 12px;
8925 display: flex;
8926 align-items: center;
8927 justify-content: center;
8928 }
8929 .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 {
8930 display: flex;
8931 align-items: center;
8932 justify-content: flex-end;
8933 margin-top: 30px;
8934 }
8935 .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 {
8936 display: flex;
8937 align-items: center;
8938 gap: 14px;
8939 }
8940 .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 {
8941 color: #000;
8942 background: none;
8943 border: 1px solid #E4E6EB;
8944 padding: 11px 20px;
8945 min-width: auto;
8946 line-height: normal;
8947 }
8948 .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 {
8949 opacity: 0.5;
8950 cursor: not-allowed;
8951 }
8952 .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 {
8953 padding: 0;
8954 border-radius: 10px;
8955 border: 1px solid #EEF0F3;
8956 }
8957 .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 {
8958 width: 60%;
8959 margin-right: 0;
8960 background: #fff;
8961 border-bottom-left-radius: 8px;
8962 border-right: 1px solid #EEF0F3;
8963 align-self: stretch;
8964 }
8965 .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 {
8966 padding: 14px 20px;
8967 border-right: 1px solid #EBEDF0;
8968 }
8969 .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 {
8970 gap: 10px;
8971 }
8972 .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 {
8973 border: none;
8974 }
8975 .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] {
8976 max-width: calc(100% - 40px);
8977 margin: 0 auto;
8978 }
8979 .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] {
8980 z-index: inherit;
8981 }
8982 .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] {
8983 z-index: 4;
8984 position: relative;
8985 }
8986 .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] {
8987 z-index: 4;
8988 position: relative;
8989 opacity: 1;
8990 border: 1px solid #fff;
8991 }
8992 .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] {
8993 z-index: 4;
8994 position: relative;
8995 }
8996 .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] {
8997 z-index: 4;
8998 position: relative;
8999 }
9000 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #product-title[data-tour=yes] {
9001 z-index: 4;
9002 position: relative;
9003 }
9004 .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] {
9005 z-index: 1;
9006 }
9007 .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] {
9008 z-index: 1;
9009 position: relative;
9010 }
9011 .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] {
9012 z-index: 1;
9013 position: relative;
9014 }
9015 .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] {
9016 z-index: 1;
9017 position: relative;
9018 }
9019 .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] {
9020 z-index: 1;
9021 position: relative;
9022 }
9023 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump #product-title[data-tour=yes] {
9024 z-index: 4;
9025 position: relative;
9026 }
9027 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .upload-product-image .wpfnl-fields {
9028 width: calc(100% - 180px);
9029 }
9030 .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 {
9031 border-radius: 50%;
9032 }
9033 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.no-more-one {
9034 border-radius: 0 0 10px 10px;
9035 }
9036 .order-bump-accordion-wrapper .order-bump-body .reset-arrow-color,
9037 .order-bump-accordion-wrapper .order-bump-body .reset-obbg {
9038 margin-left: 1px;
9039 padding: 4px 5px;
9040 position: relative;
9041 top: -1px;
9042 border: none;
9043 border-radius: 3px;
9044 background: transparent;
9045 color: #fff;
9046 font-size: 12px;
9047 line-height: 1;
9048 cursor: pointer;
9049 }
9050 .order-bump-accordion-wrapper .order-bump-body .reset-arrow-color svg,
9051 .order-bump-accordion-wrapper .order-bump-body .reset-obbg svg {
9052 width: 16px;
9053 height: 16px;
9054 display: block;
9055 }
9056 .order-bump-accordion-wrapper .order-bump-body .reset-arrow-color {
9057 top: 3px;
9058 }
9059
9060 .wpfnl-back-icon {
9061 border-radius: 10px;
9062 border: 1px solid #EBEDF0;
9063 background: #FFF;
9064 display: flex;
9065 align-items: center;
9066 justify-content: center;
9067 padding: 7px !important;
9068 cursor: pointer;
9069 margin-right: 10px;
9070 }
9071
9072 .wpfnl-checkbox label:before {
9073 border: 1px solid #EBEDF0;
9074 background-color: none;
9075 }
9076
9077 .checkout-order-bump-setting-tab__content-wrapper {
9078 background: #FFFFFF;
9079 border: 1px solid transparent;
9080 box-shadow: 0px 5px 20px rgba(148, 135, 180, 0.15);
9081 border-radius: 10px;
9082 margin-bottom: 15px;
9083 }
9084 .checkout-order-bump-setting-tab__content-wrapper:last-child {
9085 margin-bottom: 0;
9086 }
9087 .checkout-order-bump-setting-tab__content-wrapper .order-bump-accordion-content {
9088 display: none;
9089 flex-flow: row wrap;
9090 align-items: flex-start;
9091 padding: 24px;
9092 }
9093 .checkout-order-bump-setting-tab__content-wrapper .order-bump-accordion-content.show-content {
9094 display: flex;
9095 }
9096 .checkout-order-bump-setting-tab__content-wrapper.no-order-bump {
9097 text-align: center;
9098 padding: 12px 24px;
9099 }
9100 .checkout-order-bump-setting-tab__content-wrapper.no-more-one {
9101 padding: 18px 24px;
9102 color: #272727;
9103 display: flex;
9104 flex-flow: row wrap;
9105 align-items: center;
9106 justify-content: space-between;
9107 }
9108 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .hints {
9109 color: #272727;
9110 margin: 0;
9111 width: calc(100% - 168px);
9112 font-style: normal;
9113 padding-right: 14px;
9114 }
9115 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .hints .highlight-color {
9116 color: #ee5f5a;
9117 }
9118 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .hints .pro-tag {
9119 color: #ffffff;
9120 }
9121 .checkout-order-bump-setting-tab__content-wrapper.no-more-one .pro-link {
9122 font-weight: 500;
9123 text-decoration: underline;
9124 color: #6e42d3;
9125 width: 168px;
9126 }
9127 .checkout-order-bump-setting-tab__content-wrapper.expanded-orderbump .order-bump-accordion-header {
9128 box-shadow: none;
9129 border-bottom-color: #6E42D3;
9130 border-bottom-right-radius: 0;
9131 border-bottom-left-radius: 0;
9132 }
9133 .checkout-order-bump-setting-tab__content-wrapper.expanded-orderbump .order-bump-accordion-header .title-area .icon {
9134 top: 1px;
9135 transform: rotate(-135deg);
9136 }
9137 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings {
9138 border-top: 1px solid #E5E8F3;
9139 }
9140 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper {
9141 margin-bottom: 25px;
9142 }
9143 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper:last-child {
9144 margin-bottom: 0;
9145 }
9146 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper label {
9147 font-size: 14px;
9148 line-height: 16px;
9149 }
9150 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper select {
9151 padding: 5px 9px;
9152 }
9153 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .hints.mobile {
9154 display: none;
9155 }
9156 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label {
9157 width: 250px;
9158 position: relative;
9159 padding-right: 30px;
9160 }
9161 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label .color-picker {
9162 position: absolute;
9163 right: 10px;
9164 top: -4px;
9165 line-height: 1;
9166 }
9167 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .vc-color-wrap {
9168 width: 25px;
9169 }
9170 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.top-align .color-picker {
9171 top: 6px;
9172 }
9173 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.orderbump-bg .vc-color-wrap {
9174 position: relative;
9175 top: -5px;
9176 }
9177 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
9178 top: -2px;
9179 }
9180 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields {
9181 width: 50%;
9182 }
9183 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields select {
9184 border: 1px solid #EBEDF0;
9185 padding-top: 3px;
9186 }
9187 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields .icp__input {
9188 border-radius: 0 !important;
9189 border: 1px solid #e5e5e5;
9190 background: #000000;
9191 }
9192 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-box {
9193 padding: 30px 0;
9194 margin: 0;
9195 box-shadow: none;
9196 background: transparent;
9197 border-radius: 0;
9198 }
9199 .checkout-order-bump-setting-tab__content-wrapper .hints {
9200 word-break: break-word;
9201 }
9202 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .enable-order-bump {
9203 border-top: none;
9204 padding-bottom: 30px;
9205 }
9206 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .enable-order-bump .wpfnl-fields input {
9207 width: 97%;
9208 }
9209 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area > .title {
9210 position: relative;
9211 font-weight: 500;
9212 font-size: 16px;
9213 line-height: 19px;
9214 color: #363B4E;
9215 background-color: #F7F7FA;
9216 padding: 18px 30px 18px 30px;
9217 border-radius: 10px 10px 0 0;
9218 border-bottom: 1px solid #EEF0F3;
9219 }
9220 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon,
9221 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product {
9222 border: 1px solid #E9E9EF;
9223 border-radius: 6px;
9224 height: 36px;
9225 position: relative;
9226 display: flex;
9227 }
9228 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .wpfnl-ob-replace-product-search,
9229 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .wpfnl-ob-product-search,
9230 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .wpfnl-ob-replace-product-search,
9231 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .wpfnl-ob-product-search {
9232 display: none;
9233 }
9234 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon svg,
9235 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product svg {
9236 position: absolute;
9237 left: 10px;
9238 top: 10px;
9239 }
9240 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-container--default .select2-selection--single .select2-selection__arrow,
9241 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-container--default .select2-selection--single .select2-selection__arrow {
9242 display: none;
9243 }
9244 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2.select2-container.select2-container--default,
9245 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2.select2-container.select2-container--default {
9246 width: 100% !important;
9247 }
9248 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-container--default .select2-selection--single,
9249 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-container--default .select2-selection--single {
9250 background-color: transparent;
9251 border: none;
9252 height: auto;
9253 }
9254 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-selection__rendered,
9255 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-selection__rendered {
9256 padding: 8px 12px 7px;
9257 width: 100%;
9258 border-radius: 6px;
9259 white-space: pre;
9260 overflow: hidden;
9261 text-overflow: ellipsis;
9262 display: block;
9263 -webkit-line-clamp: 3;
9264 -webkit-box-orient: vertical;
9265 line-height: normal;
9266 }
9267 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-selection__rendered .select2-selection__placeholder,
9268 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-selection__rendered .select2-selection__placeholder {
9269 color: #7A8B9A;
9270 }
9271 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon.product-selected .select2-selection__rendered,
9272 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product.product-selected .select2-selection__rendered {
9273 display: flex;
9274 align-items: center;
9275 flex-flow: row-reverse;
9276 justify-content: space-between;
9277 }
9278 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-container.select2-container--default.select2-container--open,
9279 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-container.select2-container--default.select2-container--open {
9280 border: none;
9281 }
9282 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .select2-selection__clear,
9283 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product .select2-selection__clear {
9284 cursor: pointer;
9285 padding: 0 2px;
9286 }
9287 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-product[data-tour=yes] {
9288 z-index: 4;
9289 position: relative;
9290 }
9291 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product {
9292 height: auto;
9293 }
9294 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__rendered {
9295 display: flex;
9296 flex-flow: row wrap;
9297 gap: 6px;
9298 padding: 5px 7px 5px;
9299 }
9300 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__rendered .select2-selection__clear {
9301 display: none;
9302 }
9303 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__choice {
9304 border: 1px solid #EBEDF0;
9305 display: inline;
9306 padding: 7px 4px 7px 10px;
9307 border-radius: 6px;
9308 color: #363B4E;
9309 font-size: 13px;
9310 display: inline-flex;
9311 gap: 5px;
9312 flex-flow: row-reverse;
9313 }
9314 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product .select2-selection__choice .select2-selection__choice__remove {
9315 padding: 0px 6px;
9316 line-height: 1;
9317 display: flex;
9318 align-items: center;
9319 cursor: pointer;
9320 }
9321 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-ob-replace-product input.select2-search__field {
9322 width: auto !important;
9323 padding: 0 8px;
9324 height: auto;
9325 min-width: 80px;
9326 border: none;
9327 }
9328 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn {
9329 background-color: #F6F5FA;
9330 border-radius: 10px;
9331 padding: 20px;
9332 margin-top: 16px;
9333 display: grid;
9334 grid-template-columns: repeat(2, 1fr);
9335 gap: 20px;
9336 }
9337 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option {
9338 position: relative;
9339 }
9340 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option > input[type=radio] {
9341 display: none;
9342 }
9343 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option .option-label {
9344 border-radius: 10px;
9345 border: 1px solid #E4E0F0;
9346 background-color: #FFF;
9347 cursor: pointer;
9348 padding: 12px 16px;
9349 display: block;
9350 height: 100%;
9351 }
9352 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option .radio-point {
9353 position: absolute;
9354 top: 11px;
9355 right: 16px;
9356 }
9357 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option .radio-point circle:first-child {
9358 transform: scale(0);
9359 transform-origin: center;
9360 transition: all 0.3s ease;
9361 }
9362 .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 {
9363 border-color: #6E42D3;
9364 }
9365 .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 {
9366 transform: scale(1);
9367 }
9368 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option h4 {
9369 color: #363B4E;
9370 font-size: 14px;
9371 font-weight: 500;
9372 line-height: 1.37;
9373 margin-bottom: 0;
9374 max-width: 95%;
9375 }
9376 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .wpfnl-replace-products-radio-btn .single-page-option p {
9377 color: #525562;
9378 font-size: 14px;
9379 font-weight: 400;
9380 line-height: 1.4;
9381 }
9382 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .icon-wrapper {
9383 display: inline-flex;
9384 flex-flow: column;
9385 justify-content: center;
9386 align-items: center;
9387 gap: 8px;
9388 }
9389 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label {
9390 box-sizing: border-box;
9391 border-radius: 10px;
9392 height: 160px;
9393 display: flex;
9394 flex-flow: column;
9395 align-items: center;
9396 justify-content: center;
9397 margin: 0;
9398 padding: 0;
9399 text-align: center;
9400 background-repeat: no-repeat;
9401 background-position: center;
9402 background-size: cover;
9403 cursor: pointer;
9404 border: 1px dashed #CCC3E1;
9405 background-color: transparent;
9406 background-image: none;
9407 }
9408 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label .title {
9409 display: block;
9410 line-height: 16px;
9411 transition: all 0.3s ease;
9412 color: #363B4E;
9413 font-size: 14px;
9414 font-style: normal;
9415 font-weight: 500;
9416 line-height: 14px;
9417 letter-spacing: -0.14px;
9418 }
9419 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label .title .wpfnl-link-text {
9420 color: #6E42D3;
9421 }
9422 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label .hints {
9423 font-style: normal;
9424 margin: 0;
9425 color: #7A8B9A;
9426 width: 100%;
9427 display: block;
9428 }
9429 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded {
9430 border-color: transparent;
9431 }
9432 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded .icon-wrapper {
9433 background: rgba(0, 0, 0, 0.4);
9434 width: 100%;
9435 height: 100%;
9436 border-radius: 10px;
9437 display: flex;
9438 flex-flow: column;
9439 align-items: center;
9440 justify-content: center;
9441 flex-wrap: wrap;
9442 opacity: 0;
9443 visibility: hidden;
9444 transition: all 0.3s ease;
9445 }
9446 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded:hover .icon-wrapper {
9447 opacity: 1;
9448 visibility: visible;
9449 }
9450 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded:hover .title {
9451 color: #ffffff;
9452 }
9453 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded:hover path {
9454 fill: #ffffff;
9455 }
9456 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .upload-product-image .image-label.img-uploaded .hints {
9457 color: #fff;
9458 }
9459 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .select-coupon .coupon .wpfnl-ob-coupon-search {
9460 display: none;
9461 }
9462 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area .non-input-field {
9463 cursor: not-allowed;
9464 background-color: #F6F5FA;
9465 font-size: 14px;
9466 color: #7A8B9A;
9467 padding: 13px 15px;
9468 height: 44px;
9469 width: 100%;
9470 min-width: 190px;
9471 border-radius: 6px;
9472 display: block;
9473 border: 1px solid #EBEDF0;
9474 }
9475 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell {
9476 width: 100%;
9477 justify-content: space-between;
9478 }
9479 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell .wpfnl-tooltip {
9480 position: relative;
9481 top: 3px;
9482 }
9483 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell .wpfnl-fields {
9484 width: auto;
9485 }
9486 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pre-purchase-upsell .pro-tag-icon {
9487 transform: translateY(7px);
9488 display: inline-block;
9489 }
9490 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area {
9491 width: 40%;
9492 position: sticky;
9493 top: 0px;
9494 padding-bottom: 24px;
9495 }
9496 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area .preview-header {
9497 padding: 14px 20px;
9498 }
9499 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area .preview-header h4 {
9500 text-transform: capitalize;
9501 font-family: Roboto;
9502 font-size: 14px;
9503 font-style: normal;
9504 font-weight: 400;
9505 line-height: normal;
9506 }
9507 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area .preview-header h4 span {
9508 color: #363B4E;
9509 font-weight: 600;
9510 }
9511 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs {
9512 display: flex;
9513 gap: 30px;
9514 border-bottom: 1px solid #EEF0F3;
9515 background-color: #F9FAFB;
9516 border-radius: 8px 8px 0 0;
9517 width: 100%;
9518 padding: 0 30px;
9519 }
9520 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button {
9521 display: flex;
9522 align-items: center;
9523 gap: 8px;
9524 padding: 14px 0;
9525 background: transparent;
9526 border: none;
9527 cursor: pointer;
9528 font-size: 14px;
9529 font-weight: 500;
9530 color: #6B7280;
9531 transition: all 0.2s ease;
9532 white-space: nowrap;
9533 position: relative;
9534 }
9535 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button::before {
9536 content: "";
9537 position: absolute;
9538 bottom: -1px;
9539 left: 0;
9540 width: 100%;
9541 height: 2px;
9542 background-color: transparent;
9543 transition: background-color 0.2s ease;
9544 }
9545 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button svg {
9546 width: 18px;
9547 height: 18px;
9548 color: #9CA3AF;
9549 transition: color 0.2s ease;
9550 }
9551 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button:first-child {
9552 border-radius: 8px 0 0 0;
9553 }
9554 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button:hover {
9555 color: #374151;
9556 }
9557 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button:hover svg {
9558 color: #6E42D2;
9559 }
9560 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button.active {
9561 color: #6E42D2;
9562 }
9563 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button.active::before {
9564 background-color: #6E42D2;
9565 }
9566 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs .ob-tab-button.active svg {
9567 color: #6E42D2;
9568 }
9569 @keyframes fadeIn {
9570 from {
9571 opacity: 0;
9572 transform: translateY(10px);
9573 }
9574 to {
9575 opacity: 1;
9576 transform: translateY(0);
9577 }
9578 }
9579 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category {
9580 padding: 26px 30px;
9581 animation: fadeIn 0.3s ease-in;
9582 }
9583 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category:last-child {
9584 border-bottom: none;
9585 }
9586 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .category-title {
9587 color: #363B4E;
9588 font-size: 16px;
9589 font-weight: 500;
9590 line-height: 1;
9591 display: flex;
9592 align-items: center;
9593 gap: 8px;
9594 margin-bottom: 26px;
9595 }
9596 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper {
9597 display: flex;
9598 flex-flow: row wrap;
9599 justify-content: space-between;
9600 gap: 16px;
9601 row-gap: 24px;
9602 }
9603 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .single-ob-settings {
9604 width: calc(50% - 8px);
9605 }
9606 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .single-ob-settings.full-width {
9607 width: 100%;
9608 }
9609 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .mce-tinymce div.mce-toolbar-grp {
9610 padding-left: 35px;
9611 }
9612 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .quicktags-toolbar {
9613 padding: 5px 2px 5px 45px;
9614 }
9615 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .ob-settings-input {
9616 position: relative;
9617 margin-top: 20px;
9618 }
9619 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .color-picker {
9620 position: absolute;
9621 top: 46px;
9622 left: 13px;
9623 z-index: 9;
9624 }
9625 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-description .vc-color-wrap {
9626 margin: 0;
9627 width: 20px;
9628 height: 20px;
9629 border-radius: 50%;
9630 }
9631 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-replace .wpfnl-tooltip {
9632 position: relative;
9633 top: 3px;
9634 }
9635 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-wrapper .ob-product-replace .wpfnl-tooltip p {
9636 color: #ffffff;
9637 }
9638 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-title {
9639 color: #363B4E;
9640 font-size: 14px;
9641 font-weight: 500;
9642 line-height: 1;
9643 margin-bottom: 8px;
9644 display: flex;
9645 align-items: center;
9646 gap: 3px;
9647 }
9648 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-title .wpfnl-tooltip {
9649 padding-bottom: 0;
9650 }
9651 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-title .wpfnl-tooltip svg {
9652 display: block;
9653 }
9654 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input select,
9655 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=password],
9656 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=url],
9657 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=number],
9658 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-settings-input input[type=text] {
9659 border-radius: 8px;
9660 height: 40px;
9661 }
9662 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-color-picker-wrapper {
9663 display: flex;
9664 align-items: center;
9665 }
9666 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-color-picker-wrapper .vc-color-wrap.transparent {
9667 height: 40px;
9668 width: 40px;
9669 border-radius: 6px;
9670 }
9671 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .ob-color-picker-wrapper input[type=text] {
9672 max-width: max-content;
9673 min-width: auto;
9674 border-radius: 6px;
9675 background: #F6F5FA;
9676 width: 120px;
9677 }
9678 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color {
9679 border: 1px solid #E5E8F3;
9680 border-radius: 8px;
9681 display: flex;
9682 align-items: center;
9683 }
9684 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color input[type=text] {
9685 width: calc(100% - 40px);
9686 border: none;
9687 height: 38px !important;
9688 }
9689 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color .color-picker {
9690 width: 40px;
9691 height: 38px;
9692 display: flex;
9693 align-items: center;
9694 justify-content: center;
9695 border-left: 1px solid #E5E8F3;
9696 }
9697 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category .fields-with-color .color-picker .vc-color-wrap {
9698 width: 20px;
9699 height: 20px;
9700 border-radius: 50%;
9701 margin: 0;
9702 }
9703 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details {
9704 border-bottom: 1px solid #EEF0F3;
9705 }
9706 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode {
9707 display: flex;
9708 gap: 15px;
9709 }
9710 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .ob-settings-title {
9711 margin-bottom: 0;
9712 }
9713 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option {
9714 display: flex;
9715 align-items: center;
9716 gap: 5px;
9717 cursor: pointer;
9718 position: relative;
9719 }
9720 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option input[type=radio] {
9721 cursor: pointer;
9722 margin: 0;
9723 }
9724 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option input[type=radio]:checked {
9725 border-color: #6E42D3;
9726 }
9727 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option input[type=radio]:checked::before {
9728 background-color: #6E42D3;
9729 }
9730 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option span {
9731 font-size: 14px;
9732 color: #363B4E;
9733 font-weight: 400;
9734 }
9735 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .offer-selection-mode .radio-option .recommended-badge {
9736 background: #ded3f8;
9737 color: #6e42d3;
9738 font-size: 12px;
9739 font-weight: 400;
9740 padding: 2px 8px;
9741 border-radius: 4px;
9742 margin-left: 4px;
9743 letter-spacing: 0.5px;
9744 }
9745 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .auto-match-settings {
9746 width: 100%;
9747 display: flex;
9748 flex-flow: row wrap;
9749 justify-content: space-between;
9750 gap: 16px;
9751 row-gap: 20px;
9752 }
9753 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options {
9754 display: flex;
9755 align-items: flex-start;
9756 gap: 30px;
9757 }
9758 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-group {
9759 display: flex;
9760 flex-direction: column;
9761 gap: 7px;
9762 }
9763 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option {
9764 display: flex;
9765 align-items: center;
9766 gap: 8px;
9767 cursor: pointer;
9768 }
9769 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option input[type=checkbox] {
9770 width: 18px;
9771 height: 18px;
9772 cursor: pointer;
9773 margin: 0;
9774 }
9775 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option input[type=checkbox]:checked::before {
9776 margin: -0.12rem 0 0 -0.2rem;
9777 }
9778 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-filter-options .checkbox-option span {
9779 font-size: 14px;
9780 color: #363B4E;
9781 user-select: none;
9782 }
9783 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .wpfnl-ob-fallback-product-search.select2-hidden-accessible {
9784 border: 0 !important;
9785 clip: rect(0 0 0 0) !important;
9786 -webkit-clip-path: inset(50%) !important;
9787 clip-path: inset(50%) !important;
9788 height: 1px !important;
9789 overflow: hidden !important;
9790 padding: 0 !important;
9791 position: absolute !important;
9792 width: 1px !important;
9793 white-space: nowrap !important;
9794 }
9795 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior input[type=radio] {
9796 cursor: pointer;
9797 margin: 0;
9798 }
9799 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior input[type=radio]:checked {
9800 border-color: #6E42D3;
9801 }
9802 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior input[type=radio]:checked::before {
9803 background-color: #6E42D3;
9804 }
9805 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options {
9806 display: flex;
9807 flex-direction: column;
9808 gap: 16px;
9809 }
9810 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option {
9811 display: flex;
9812 align-items: flex-start;
9813 gap: 10px;
9814 padding: 10px 12px;
9815 border: 1px solid #E5E8F3;
9816 border-radius: 8px;
9817 cursor: pointer;
9818 transition: all 0.2s ease;
9819 background: #FFFFFF;
9820 }
9821 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option:hover {
9822 border-color: #6E42D3;
9823 background: #F9F7FD;
9824 }
9825 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option .radio-content {
9826 display: flex;
9827 flex-direction: column;
9828 gap: 4px;
9829 flex: 1;
9830 }
9831 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option .radio-content .radio-title {
9832 font-size: 14px;
9833 color: #363B4E;
9834 font-weight: 500;
9835 }
9836 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .fallback-options .radio-option .radio-content .radio-subtitle {
9837 font-size: 13px;
9838 color: #7A8B9A;
9839 font-weight: 400;
9840 }
9841 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .default-product-select {
9842 margin-top: 6px;
9843 }
9844 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .default-product-select > label {
9845 font-weight: 400;
9846 font-size: 13px;
9847 margin-bottom: 4px;
9848 display: block;
9849 }
9850 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default {
9851 background: #ffffff;
9852 border-radius: 10px;
9853 border: 1px solid #E5E8F3;
9854 z-index: 99;
9855 display: block;
9856 }
9857 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default .select2-selection--single {
9858 height: 34px;
9859 border-radius: 8px;
9860 border: none;
9861 box-sizing: border-box;
9862 cursor: pointer;
9863 display: block;
9864 }
9865 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default .select2-selection__rendered {
9866 padding-top: 7px;
9867 line-height: 1;
9868 display: block;
9869 padding-left: 8px;
9870 padding-right: 20px;
9871 overflow: hidden;
9872 text-overflow: ellipsis;
9873 white-space: nowrap;
9874 }
9875 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.product-details .ob-fallback-behavior .select2-container.select2-container--default .select2-selection__arrow {
9876 top: 3px;
9877 right: 3px;
9878 }
9879 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.color-customization .ob-settings-wrapper .single-ob-settings {
9880 width: calc(33.3333333333% - 11px);
9881 }
9882 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.conditional-rules .ob-settings-wrapper .enable-conditional .wpfnl-tooltip {
9883 position: relative;
9884 top: 3px;
9885 }
9886 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.conditional-rules .ob-settings-wrapper .enable-conditional .wpfnl-tooltip p {
9887 color: #ffffff;
9888 }
9889 .checkout-order-bump-setting-tab__content-wrapper {
9890 /* Upgrade overlay - full screen backdrop */
9891 }
9892 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-overlay {
9893 position: fixed;
9894 inset: 0;
9895 z-index: 9999;
9896 background: rgba(0, 0, 0, 0.45);
9897 display: flex;
9898 align-items: center;
9899 justify-content: center;
9900 padding: 20px;
9901 }
9902 .checkout-order-bump-setting-tab__content-wrapper {
9903 /* Upgrade modal card */
9904 }
9905 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal {
9906 position: relative;
9907 background: #fff;
9908 border-radius: 16px;
9909 padding: 36px 32px 32px;
9910 max-width: 420px;
9911 width: 100%;
9912 text-align: center;
9913 box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
9914 }
9915 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-close {
9916 position: absolute;
9917 top: 14px;
9918 right: 16px;
9919 background: none;
9920 border: none;
9921 font-size: 18px;
9922 color: #667085;
9923 cursor: pointer;
9924 line-height: 1;
9925 padding: 4px;
9926 }
9927 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-close:hover {
9928 color: #344054;
9929 }
9930 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-icon {
9931 margin-bottom: 16px;
9932 }
9933 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-title {
9934 font-size: 20px;
9935 font-weight: 700;
9936 color: #101828;
9937 margin: 0 0 12px;
9938 }
9939 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-desc {
9940 font-size: 14px;
9941 color: #667085;
9942 margin: 0 0 24px;
9943 line-height: 1.6;
9944 }
9945 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-btn {
9946 display: inline-block;
9947 background: linear-gradient(135deg, #7A3CF6 0%, #5B21E6 100%);
9948 color: #fff !important;
9949 padding: 12px 28px;
9950 border-radius: 8px;
9951 font-size: 14px;
9952 font-weight: 600;
9953 text-decoration: none;
9954 transition: opacity 0.2s ease;
9955 }
9956 .checkout-order-bump-setting-tab__content-wrapper .ob-upgrade-modal-btn:hover {
9957 opacity: 0.9;
9958 text-decoration: none;
9959 color: #fff !important;
9960 }
9961 .checkout-order-bump-setting-tab__content-wrapper {
9962 /* Locked auto-match label styling */
9963 }
9964 .checkout-order-bump-setting-tab__content-wrapper .ob-automatch-locked {
9965 opacity: 0.6;
9966 }
9967 .checkout-order-bump-setting-tab__content-wrapper {
9968 /*-----Rule Groups Styles-----*/
9969 }
9970 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container {
9971 width: 100%;
9972 }
9973 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .rule-group {
9974 background: #fff;
9975 border: 1px solid #E5E7EB;
9976 border-radius: 8px;
9977 }
9978 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .rule-group-header {
9979 display: flex;
9980 justify-content: space-between;
9981 align-items: center;
9982 padding: 6px 12px 5px;
9983 border-bottom: 1px solid #E5E7EB;
9984 }
9985 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .rule-group-body {
9986 padding: 20px;
9987 }
9988 .checkout-order-bump-setting-tab__content-wrapper .rule-groups-container .btn-create-rule-group {
9989 margin-top: 20px;
9990 }
9991 .checkout-order-bump-setting-tab__content-wrapper .rule-group-title {
9992 font-size: 14px;
9993 font-weight: 600;
9994 color: #374151;
9995 margin: 0;
9996 }
9997 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-rule-group {
9998 background: transparent;
9999 border: none;
10000 color: #EF4444;
10001 cursor: pointer;
10002 padding: 4px;
10003 display: flex;
10004 align-items: center;
10005 justify-content: center;
10006 transition: opacity 0.2s;
10007 }
10008 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-rule-group:hover {
10009 opacity: 0.7;
10010 }
10011 .checkout-order-bump-setting-tab__content-wrapper .rule-condition {
10012 margin-bottom: 12px;
10013 }
10014 .checkout-order-bump-setting-tab__content-wrapper .condition-row {
10015 display: flex;
10016 gap: 12px;
10017 align-items: flex-end;
10018 background: #F9FAFB;
10019 padding: 16px;
10020 border-radius: 6px;
10021 border: 1px solid #E5E7EB;
10022 }
10023 .checkout-order-bump-setting-tab__content-wrapper .condition-row input[type=text],
10024 .checkout-order-bump-setting-tab__content-wrapper .condition-row input[type=number],
10025 .checkout-order-bump-setting-tab__content-wrapper .condition-row select {
10026 padding: 3px 12px !important;
10027 min-width: auto;
10028 }
10029 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view {
10030 font-size: 14px;
10031 background: #fff;
10032 border: 1px solid #D1D5DB;
10033 border-radius: 4px;
10034 }
10035 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view .arco-select-view-inner {
10036 padding: 0;
10037 }
10038 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view .arco-select-view-inner .arco-select-view-input {
10039 height: auto;
10040 min-height: auto;
10041 width: 100% !important;
10042 padding: 0;
10043 height: 32px;
10044 }
10045 .checkout-order-bump-setting-tab__content-wrapper .condition-row .arco-select-view .arco-select-view-inner .arco-select-view-tag {
10046 font-size: 11px;
10047 line-height: 1.2;
10048 padding: 4px;
10049 }
10050 .checkout-order-bump-setting-tab__content-wrapper .condition-field,
10051 .checkout-order-bump-setting-tab__content-wrapper .condition-operator,
10052 .checkout-order-bump-setting-tab__content-wrapper .condition-value {
10053 display: flex;
10054 flex-direction: column;
10055 gap: 6px;
10056 }
10057 .checkout-order-bump-setting-tab__content-wrapper .condition-field {
10058 flex: 0 0 240px;
10059 }
10060 .checkout-order-bump-setting-tab__content-wrapper .condition-operator {
10061 flex: 0 0 180px;
10062 }
10063 .checkout-order-bump-setting-tab__content-wrapper .condition-value {
10064 flex: 0 0 130px;
10065 }
10066 .checkout-order-bump-setting-tab__content-wrapper .condition-field label,
10067 .checkout-order-bump-setting-tab__content-wrapper .condition-value label {
10068 font-size: 12px;
10069 font-weight: 500;
10070 color: #6B7280;
10071 }
10072 .checkout-order-bump-setting-tab__content-wrapper .condition-field select,
10073 .checkout-order-bump-setting-tab__content-wrapper .condition-operator select,
10074 .checkout-order-bump-setting-tab__content-wrapper .condition-value input,
10075 .checkout-order-bump-setting-tab__content-wrapper .condition-value select {
10076 width: 100%;
10077 padding: 8px 12px;
10078 border: 1px solid #D1D5DB;
10079 border-radius: 4px;
10080 font-size: 14px;
10081 color: #374151;
10082 background: #fff;
10083 }
10084 .checkout-order-bump-setting-tab__content-wrapper .condition-field select:focus,
10085 .checkout-order-bump-setting-tab__content-wrapper .condition-operator select:focus,
10086 .checkout-order-bump-setting-tab__content-wrapper .condition-value input:focus,
10087 .checkout-order-bump-setting-tab__content-wrapper .condition-value select:focus {
10088 outline: none;
10089 border-color: #6E42D2;
10090 box-shadow: 0 0 0 3px rgba(110, 66, 210, 0.1);
10091 }
10092 .checkout-order-bump-setting-tab__content-wrapper .condition-actions {
10093 display: flex;
10094 gap: 8px;
10095 align-items: center;
10096 position: relative;
10097 top: -6px;
10098 }
10099 .checkout-order-bump-setting-tab__content-wrapper .btn-drag-handle,
10100 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-condition {
10101 background: transparent;
10102 border: none;
10103 color: #6B7280;
10104 cursor: pointer;
10105 padding: 4px;
10106 display: flex;
10107 align-items: center;
10108 justify-content: center;
10109 transition: color 0.2s;
10110 }
10111 .checkout-order-bump-setting-tab__content-wrapper .btn-drag-handle:hover {
10112 color: #374151;
10113 }
10114 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-condition {
10115 color: #EF4444;
10116 }
10117 .checkout-order-bump-setting-tab__content-wrapper .btn-delete-condition:hover {
10118 opacity: 0.7;
10119 }
10120 .checkout-order-bump-setting-tab__content-wrapper .logic-separator {
10121 display: flex;
10122 align-items: center;
10123 justify-content: center;
10124 margin: 12px 0;
10125 position: relative;
10126 }
10127 .checkout-order-bump-setting-tab__content-wrapper .logic-separator.and-label:before {
10128 content: "";
10129 position: absolute;
10130 left: 50%;
10131 transform: translateX(-50%);
10132 top: -13px;
10133 height: calc(100% + 26px);
10134 width: 2px;
10135 background: #e5e7eb;
10136 z-index: 0;
10137 }
10138 .checkout-order-bump-setting-tab__content-wrapper .logic-label {
10139 background: #F3F4F6;
10140 color: #6B7280;
10141 font-size: 12px;
10142 font-weight: 600;
10143 padding: 4px 12px;
10144 border-radius: 12px;
10145 border: 1px solid #E5E7EB;
10146 position: relative;
10147 z-index: 1;
10148 }
10149 .checkout-order-bump-setting-tab__content-wrapper .or-separator {
10150 margin: 24px 0;
10151 }
10152 .checkout-order-bump-setting-tab__content-wrapper .or-separator::before,
10153 .checkout-order-bump-setting-tab__content-wrapper .or-separator::after {
10154 content: "";
10155 position: absolute;
10156 top: 50%;
10157 width: 45%;
10158 height: 1px;
10159 background: #E5E7EB;
10160 }
10161 .checkout-order-bump-setting-tab__content-wrapper .or-separator::before {
10162 left: 0;
10163 }
10164 .checkout-order-bump-setting-tab__content-wrapper .or-separator::after {
10165 right: 0;
10166 }
10167 .checkout-order-bump-setting-tab__content-wrapper .or-label {
10168 background: #FEF3C7;
10169 color: #D97706;
10170 border-color: #FCD34D;
10171 }
10172 .checkout-order-bump-setting-tab__content-wrapper .btn-add-condition {
10173 background: transparent;
10174 border: 1px dashed #D1D5DB;
10175 color: #6E42D2;
10176 font-size: 14px;
10177 font-weight: 500;
10178 padding: 10px 16px;
10179 border-radius: 6px;
10180 cursor: pointer;
10181 width: 100%;
10182 margin-top: 12px;
10183 transition: all 0.2s;
10184 }
10185 .checkout-order-bump-setting-tab__content-wrapper .btn-add-condition:hover {
10186 background: rgba(110, 66, 210, 0.05);
10187 border-color: #6E42D2;
10188 }
10189 .checkout-order-bump-setting-tab__content-wrapper .btn-create-rule-group {
10190 background: transparent;
10191 border: 2px dashed #D1D5DB;
10192 color: #2563EB;
10193 font-size: 14px;
10194 font-weight: 600;
10195 padding: 12px 20px;
10196 border-radius: 8px;
10197 cursor: pointer;
10198 width: 100%;
10199 transition: all 0.2s;
10200 }
10201 .checkout-order-bump-setting-tab__content-wrapper .btn-create-rule-group:hover {
10202 background: rgba(37, 99, 235, 0.05);
10203 border-color: #2563EB;
10204 }
10205 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner {
10206 display: flex;
10207 align-items: center;
10208 justify-content: space-between;
10209 background: #faf9fb;
10210 border: 1px solid #d3c2fa;
10211 border-radius: 10px;
10212 padding: 24px;
10213 box-sizing: border-box;
10214 }
10215 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-content {
10216 display: flex;
10217 flex-direction: column;
10218 gap: 6px;
10219 }
10220 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-title {
10221 font-size: 16px;
10222 font-weight: 600;
10223 color: #23272F;
10224 }
10225 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-desc {
10226 font-size: 14px;
10227 color: #4B5563;
10228 line-height: 1.5;
10229 max-width: 520px;
10230 }
10231 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-cta {
10232 background: #6E42D3;
10233 color: #fff;
10234 font-weight: 600;
10235 font-size: 13px;
10236 border: none;
10237 border-radius: 6px;
10238 padding: 12px 18px;
10239 text-decoration: none;
10240 transition: background 0.2s;
10241 box-shadow: 0 1px 2px rgba(244, 99, 27, 0.08);
10242 cursor: pointer;
10243 white-space: nowrap;
10244 margin-left: 32px;
10245 display: inline-flex;
10246 align-items: center;
10247 justify-content: center;
10248 }
10249 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-cta:hover {
10250 background: #6434d4;
10251 color: #fff;
10252 text-decoration: none;
10253 }
10254 @media (max-width: 700px) {
10255 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner {
10256 flex-direction: column;
10257 align-items: flex-start;
10258 padding: 18px 12px;
10259 }
10260 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-pro-orderbump-banner .wpfnl-pro-orderbump-banner-cta {
10261 margin-left: 0;
10262 margin-top: 16px;
10263 width: 100%;
10264 justify-content: center;
10265 }
10266 }
10267
10268 .arco-trigger-popup {
10269 width: 230px !important;
10270 }
10271
10272 .arco-select-dropdown .arco-select-option {
10273 padding: 8px 6px !important;
10274 margin: 0;
10275 }
10276 .arco-select-dropdown .arco-select-option-checkbox .arco-checkbox-label {
10277 line-height: 1.3;
10278 }
10279
10280 @media only screen and (max-width: 1599px) {
10281 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper .wpfnl-fields {
10282 width: 50%;
10283 }
10284 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-fields-with-color,
10285 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .wpfnl-product-description,
10286 .order-bump-accordion-wrapper .order-bump-body .checkout-order-bump-setting-tab__content-wrapper.single-order-bump.expanded-orderbump .upload-product-image .wpfnl-fields {
10287 width: calc(100% - 250px);
10288 }
10289 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-category.color-customization .ob-settings-wrapper .single-ob-settings {
10290 width: calc(50% - 8px);
10291 }
10292 }
10293 @media only screen and (max-width: 1350px) and (min-width: 1200px) {
10294 .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 {
10295 width: 55%;
10296 }
10297 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area {
10298 width: 45%;
10299 }
10300 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper::not('.no-title-checkbox') {
10301 margin-bottom: 18px;
10302 display: block;
10303 }
10304 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox > label {
10305 width: auto;
10306 margin-bottom: 0;
10307 padding-right: 10px;
10308 padding-top: 4px;
10309 display: inline-block;
10310 }
10311 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .wpfnl-fields {
10312 width: 50%;
10313 max-width: 410px;
10314 }
10315 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .hints.desktop {
10316 display: none;
10317 }
10318 .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper.no-title-checkbox .hints.mobile {
10319 display: block;
10320 }
10321 }
10322 @media only screen and (max-width: 1199px) {
10323 .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area {
10324 width: 100%;
10325 margin-right: 0;
10326 margin-bottom: 30px;
10327 }
10328 .checkout-order-bump-setting-tab__content-wrapper .order-bump-template-preview-area {
10329 width: 100%;
10330 }
10331 .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 {
10332 width: 100%;
10333 border-radius: 10px 10px 0 0;
10334 margin-bottom: 0;
10335 border-bottom: 1px solid #EEF0F3;
10336 }
10337 .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 {
10338 border-radius: 0px;
10339 }
10340 .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 {
10341 border-radius: 0px;
10342 }
10343 .checkout-order-bump-setting-tab__content-wrapper .ob-settings-tabs {
10344 gap: 20px;
10345 padding: 0 21px;
10346 }
10347 }
10348 .edit-field-tabNcontent {
10349 border: 1px solid #E5E8F3;
10350 border-radius: 10px;
10351 }
10352
10353 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav {
10354 display: flex;
10355 flex-flow: row wrap;
10356 align-items: center;
10357 justify-content: flex-start;
10358 padding: 23px 20px 23px 0;
10359 border-bottom: 1px solid #E5E8F3;
10360 }
10361 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li {
10362 padding: 0 15px;
10363 }
10364 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li:last-child {
10365 margin-right: 0;
10366 }
10367 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li a {
10368 font-size: 14px;
10369 color: #7A8B9A;
10370 height: 44px;
10371 line-height: 44px;
10372 display: block;
10373 position: relative;
10374 }
10375 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li a:hover {
10376 color: #363B4E;
10377 }
10378 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li a:before {
10379 content: "";
10380 position: absolute;
10381 top: -24px;
10382 left: 0;
10383 width: 100%;
10384 height: 3px;
10385 background: #6E42D3;
10386 border-radius: 0 0 50px 50px;
10387 visibility: hidden;
10388 opacity: 0;
10389 }
10390 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.active a {
10391 color: #6E42D3;
10392 }
10393 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.active a:before {
10394 visibility: visible;
10395 opacity: 1;
10396 }
10397 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn {
10398 margin-left: 20px;
10399 padding: 0;
10400 }
10401 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn .btn-default {
10402 line-height: 39px;
10403 }
10404 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn svg {
10405 margin-right: 5px;
10406 }
10407 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn {
10408 margin-left: auto;
10409 padding: 0;
10410 }
10411 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .btn-default {
10412 line-height: 39px;
10413 background: #F7F7FA;
10414 color: #363B4E;
10415 border: 1px solid #E5E8F3;
10416 }
10417 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .btn-default.error {
10418 color: #d63342;
10419 background-color: #f8d7da;
10420 border-color: #f5c6cb;
10421 }
10422 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .btn-default.success {
10423 color: #269c41;
10424 background-color: #d4edda;
10425 border-color: #c3e6cb;
10426 }
10427 .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn .wpfnl-loader {
10428 display: inline-block;
10429 }
10430 .checkout-edit-field-tab__content-wrapper .settings-content__footer .btn-default:disabled {
10431 cursor: not-allowed;
10432 opacity: 0.7;
10433 display: flex;
10434 align-items: center;
10435 gap: 10px;
10436 }
10437 .checkout-edit-field-tab__content-wrapper .wpfnl-additional-replacement-options {
10438 position: relative;
10439 }
10440
10441 .edit-field-settings__single-tab-content {
10442 display: none;
10443 position: relative;
10444 }
10445 .edit-field-settings__single-tab-content .checkout-edit-field {
10446 background: #FFFFFF;
10447 box-shadow: 0px 2px 4px rgba(223, 223, 249, 0.25);
10448 border-radius: 0px 10px 10px 10px;
10449 }
10450 .edit-field-settings__single-tab-content:first-child {
10451 display: block;
10452 }
10453 .edit-field-settings__single-tab-content .single-tab-header {
10454 display: flex;
10455 flex-flow: row;
10456 align-items: center;
10457 padding: 25px;
10458 justify-content: space-between;
10459 }
10460 .edit-field-settings__single-tab-content .single-tab-header .tab-title {
10461 font-weight: 500;
10462 font-size: 16px;
10463 line-height: 19px;
10464 color: #363B4E;
10465 text-transform: capitalize;
10466 }
10467 .edit-field-settings__single-tab-content .single-tab-header .restore-btn {
10468 margin-left: auto;
10469 margin-right: 10px;
10470 }
10471 .edit-field-settings__single-tab-content .single-tab-header .restore-btn .wpfnl-alert {
10472 margin-right: 6px;
10473 }
10474 .edit-field-settings__single-tab-content .single-tab-header .restore-btn .wpfnl-loader {
10475 position: relative;
10476 top: 2px;
10477 }
10478 .edit-field-settings__single-tab-content .single-tab-header .btn-default {
10479 height: 40px;
10480 line-height: 41px;
10481 min-width: 100px;
10482 }
10483 .edit-field-settings__single-tab-content .checkout-field-header {
10484 position: sticky;
10485 top: 0;
10486 z-index: 2;
10487 display: flex;
10488 flex-flow: row wrap;
10489 align-items: center;
10490 justify-content: space-between;
10491 padding: 20px 20px 20px 77px;
10492 border-bottom: 1px solid #E5E8F3;
10493 background: #F7F7FA;
10494 }
10495 .edit-field-settings__single-tab-content .checkout-field-header .field-item {
10496 font-size: 12px;
10497 line-height: 14px;
10498 letter-spacing: 0.857143px;
10499 text-transform: uppercase;
10500 color: #7A8B9A;
10501 }
10502 .edit-field-settings__single-tab-content .checkout-field-header.bottom {
10503 border-bottom: 0;
10504 border-radius: 0 0 10px 10px;
10505 }
10506 .edit-field-settings__single-tab-content .checkout-field-header .field-hamburger,
10507 .edit-field-settings__single-tab-content .checkout__single-field .field-hamburger {
10508 width: 25px;
10509 position: absolute;
10510 left: 20px;
10511 top: 50%;
10512 transform: translateY(-50%);
10513 }
10514 .edit-field-settings__single-tab-content .checkout-field-header .field-name,
10515 .edit-field-settings__single-tab-content .checkout__single-field .field-name {
10516 width: 160px;
10517 padding-right: 10px;
10518 }
10519 .edit-field-settings__single-tab-content .checkout-field-header .field-type,
10520 .edit-field-settings__single-tab-content .checkout__single-field .field-type {
10521 width: 75px;
10522 padding-right: 10px;
10523 }
10524 .edit-field-settings__single-tab-content .checkout-field-header .field-label,
10525 .edit-field-settings__single-tab-content .checkout__single-field .field-label {
10526 width: 150px;
10527 padding-right: 10px;
10528 }
10529 .edit-field-settings__single-tab-content .checkout-field-header .field-placeholder,
10530 .edit-field-settings__single-tab-content .checkout__single-field .field-placeholder {
10531 width: 250px;
10532 padding-right: 10px;
10533 }
10534 .edit-field-settings__single-tab-content .checkout-field-header .field-validation,
10535 .edit-field-settings__single-tab-content .checkout__single-field .field-validation {
10536 width: 94px;
10537 padding-right: 10px;
10538 }
10539 .edit-field-settings__single-tab-content .checkout-field-header .field-required,
10540 .edit-field-settings__single-tab-content .checkout__single-field .field-required {
10541 width: 74px;
10542 padding-right: 10px;
10543 }
10544 .edit-field-settings__single-tab-content .checkout-field-header .field-status,
10545 .edit-field-settings__single-tab-content .checkout__single-field .field-status {
10546 width: 65px;
10547 padding-right: 10px;
10548 }
10549 .edit-field-settings__single-tab-content .checkout-field-header .field-action,
10550 .edit-field-settings__single-tab-content .checkout__single-field .field-action {
10551 width: 57px;
10552 }
10553 .edit-field-settings__single-tab-content .checkout__single-field {
10554 position: relative;
10555 padding: 25px 20px 25px 65px;
10556 display: flex;
10557 flex-flow: row wrap;
10558 align-items: center;
10559 justify-content: space-between;
10560 border-bottom: 1px solid #E5E8F3;
10561 cursor: all-scroll;
10562 min-height: 81px;
10563 }
10564 .edit-field-settings__single-tab-content .checkout__single-field:last-child {
10565 border-bottom: 0;
10566 }
10567 .edit-field-settings__single-tab-content .checkout__single-field.ui-sortable-helper {
10568 background-color: #F7F7FA;
10569 }
10570 .edit-field-settings__single-tab-content .checkout__single-field .field-item {
10571 font-weight: 400;
10572 font-size: 14px;
10573 line-height: 16px;
10574 color: #363B4E;
10575 word-break: break-all;
10576 }
10577 .edit-field-settings__single-tab-content .checkout__single-field .hamburger-bar {
10578 display: block;
10579 width: 18px;
10580 height: 14px;
10581 border-top: 2px solid #CDD2E6;
10582 border-bottom: 2px solid #CDD2E6;
10583 position: relative;
10584 cursor: all-scroll;
10585 }
10586 .edit-field-settings__single-tab-content .checkout__single-field .hamburger-bar:before {
10587 content: "";
10588 position: absolute;
10589 left: 0;
10590 top: 50%;
10591 width: 100%;
10592 height: 2px;
10593 margin-top: -1px;
10594 background: #CDD2E6;
10595 }
10596 .edit-field-settings__single-tab-content .checkout__single-field .field-required,
10597 .edit-field-settings__single-tab-content .checkout__single-field .field-status {
10598 display: flex;
10599 align-items: center;
10600 }
10601 .edit-field-settings__single-tab-content .checkout__single-field .field-action {
10602 display: flex;
10603 }
10604 .edit-field-settings__single-tab-content .checkout__single-field .field-action button {
10605 border: none;
10606 cursor: pointer;
10607 text-align: center;
10608 padding: 0 6px;
10609 display: inline-block;
10610 height: 30px;
10611 line-height: 30px;
10612 background-color: transparent;
10613 margin: 0;
10614 }
10615 .edit-field-settings__single-tab-content .checkout__single-field .field-action button svg {
10616 width: 20px;
10617 height: 20px;
10618 display: block;
10619 }
10620
10621 .checkout-edit-field__settings-option {
10622 background: #FFFFFF;
10623 border-radius: 10px;
10624 margin-top: 30px;
10625 border: 1px solid #E5E8F3;
10626 }
10627 .checkout-edit-field__settings-option .settings-title {
10628 font-weight: 700;
10629 font-size: 14px;
10630 line-height: 16px;
10631 padding: 20px 25px;
10632 color: #363B4E;
10633 border-bottom: 1px solid #E5E8F3;
10634 background: #F7F7FA;
10635 border-radius: 10px 10px 0 0;
10636 }
10637 .checkout-edit-field__settings-option .options-wrapper {
10638 padding: 30px 25px;
10639 display: flex;
10640 flex-flow: row wrap;
10641 align-items: flex-start;
10642 position: relative;
10643 }
10644 .checkout-edit-field__settings-option .options-wrapper::before {
10645 content: "";
10646 position: absolute;
10647 left: 50%;
10648 top: 50%;
10649 height: calc(100% - 60px);
10650 width: 1px;
10651 background: #E5E8F3;
10652 transform: translateY(-50%);
10653 }
10654 .checkout-edit-field__settings-option .options-wrapper .single-option {
10655 margin-bottom: 20px;
10656 width: 50%;
10657 }
10658 .checkout-edit-field__settings-option .options-wrapper .single-option:last-child {
10659 margin-bottom: 0;
10660 }
10661 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(odd) {
10662 padding-right: 50px;
10663 }
10664 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(even) {
10665 padding-left: 60px;
10666 }
10667 .checkout-edit-field__settings-option .options-wrapper .single-option .wpfnl-checkbox label {
10668 font-size: 14px;
10669 line-height: 16px;
10670 color: #363B4E;
10671 padding-left: 33px;
10672 }
10673
10674 .dradndrop-icon .st0 {
10675 fill: none;
10676 stroke: #7A8B9A;
10677 stroke-width: 5;
10678 stroke-miterlimit: 10;
10679 }
10680 .dradndrop-icon .st1 {
10681 fill: none;
10682 stroke: #7A8B9A;
10683 stroke-width: 5;
10684 stroke-linecap: round;
10685 stroke-linejoin: round;
10686 stroke-dasharray: 18.3682, 8.1636;
10687 }
10688 .dradndrop-icon .st2 {
10689 fill: #7A8B9A;
10690 }
10691 .dradndrop-icon .st3 {
10692 fill: none;
10693 stroke: #7A8B9A;
10694 stroke-width: 5;
10695 stroke-linecap: round;
10696 stroke-linejoin: round;
10697 stroke-miterlimit: 10;
10698 stroke-dasharray: 18, 8;
10699 }
10700
10701 .checkout-edit-field-tab__content-wrapper {
10702 padding-bottom: 30px;
10703 }
10704 .checkout-edit-field-tab__content-wrapper .edit-field-drawer form {
10705 height: 100%;
10706 }
10707 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body {
10708 padding: 20px 20px 24px;
10709 max-height: calc(100% - 80px);
10710 overflow: auto;
10711 }
10712 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body::-webkit-scrollbar {
10713 width: 5px;
10714 }
10715 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body::-webkit-scrollbar-track {
10716 background: #f2f5f8;
10717 }
10718 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body::-webkit-scrollbar-thumb {
10719 background-color: #6E42D3;
10720 border-radius: 20px;
10721 }
10722 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper {
10723 display: block;
10724 margin-bottom: 22px;
10725 }
10726 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper:last-child {
10727 margin-bottom: 0;
10728 }
10729 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .options-label {
10730 display: flex;
10731 align-items: center;
10732 justify-content: space-between;
10733 margin-bottom: 10px;
10734 }
10735 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .options-label > label {
10736 font-weight: 500;
10737 font-size: 14px;
10738 line-height: 16px;
10739 color: #000000;
10740 display: inline-block;
10741 }
10742 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .options-label .btn-default {
10743 min-width: auto;
10744 border-radius: 4px;
10745 padding: 0;
10746 width: 40px;
10747 background: #f0e9ff;
10748 border: 1px solid #d5c6f9;
10749 }
10750 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields {
10751 display: flex;
10752 align-items: center;
10753 justify-content: space-between;
10754 margin-bottom: 10px;
10755 }
10756 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields input[type=text] {
10757 width: calc(50% - 30px);
10758 min-width: auto;
10759 }
10760 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields.fullwidth input[type=text] {
10761 width: calc(50% - 4px);
10762 }
10763 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields .btn-default {
10764 min-width: auto;
10765 border-radius: 4px;
10766 padding: 0;
10767 width: 40px;
10768 background: #f0e9ff;
10769 border: 1px solid #d5c6f9;
10770 }
10771 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper.field-type-options .wpfnl-fields .btn-default.remove {
10772 background: #f8d7da;
10773 border-color: #f5c2c7;
10774 }
10775 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper .wpfnl-fields {
10776 max-width: inherit;
10777 width: 100%;
10778 }
10779 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper > label {
10780 font-weight: 500;
10781 font-size: 14px;
10782 line-height: 16px;
10783 color: #000000;
10784 display: block;
10785 padding: 0;
10786 margin: 0 0 10px 0;
10787 width: 100%;
10788 }
10789 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper input[type=text],
10790 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper select {
10791 border-radius: 4px;
10792 height: 40px;
10793 }
10794 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper .wpfnl-checkbox label {
10795 font-size: 14px;
10796 line-height: 16px;
10797 color: #000000;
10798 padding-left: 33px;
10799 }
10800 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer {
10801 padding: 24px;
10802 text-align: center;
10803 }
10804 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .btn-default {
10805 height: 40px;
10806 line-height: 41px;
10807 width: 100%;
10808 }
10809 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .btn-default .wpfnl-loader {
10810 position: relative;
10811 top: 2px;
10812 display: inline-block;
10813 }
10814 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .btn-default:disabled {
10815 cursor: not-allowed;
10816 opacity: 0.7;
10817 display: flex;
10818 align-items: center;
10819 gap: 10px;
10820 justify-content: center;
10821 }
10822 .checkout-edit-field-tab__content-wrapper .edit-field-drawer .field-footer .wpfnl-alert {
10823 text-align: center;
10824 margin-top: 10px;
10825 display: block;
10826 }
10827
10828 @media only screen and (max-width: 1499px) {
10829 .edit-field-settings__single-tab-content .single-tab-header {
10830 padding: 25px 20px;
10831 }
10832 .edit-field-settings__single-tab-content .checkout-field-header {
10833 padding: 25px 20px 25px 57px;
10834 }
10835 .edit-field-settings__single-tab-content .checkout__single-field {
10836 padding: 25px 20px 25px 57px;
10837 }
10838 .edit-field-settings__single-tab-content .checkout-field-header .field-hamburger,
10839 .edit-field-settings__single-tab-content .checkout__single-field .field-hamburger {
10840 left: 20px;
10841 }
10842 .edit-field-settings__single-tab-content .checkout-field-header .field-placeholder,
10843 .edit-field-settings__single-tab-content .checkout__single-field .field-placeholder {
10844 width: 160px;
10845 }
10846 .edit-field-settings__single-tab-content .checkout-field-header .field-name,
10847 .edit-field-settings__single-tab-content .checkout__single-field .field-name {
10848 width: 140px;
10849 }
10850 .edit-field-settings__single-tab-content .checkout-field-header .field-label,
10851 .edit-field-settings__single-tab-content .checkout__single-field .field-label {
10852 width: 100px;
10853 }
10854 }
10855 @media only screen and (max-width: 1299px) {
10856 .edit-field-settings__single-tab-content .checkout-edit-field {
10857 background: transparent;
10858 box-shadow: none;
10859 border-radius: 0;
10860 }
10861 .edit-field-settings__single-tab-content .single-tab-header {
10862 box-shadow: 0px 2px 4px rgba(238, 238, 245, 0.47);
10863 background-color: #ffffff;
10864 padding: 15px 20px;
10865 border-radius: 0px 10px 10px 10px;
10866 }
10867 .edit-field-settings__single-tab-content .checkout-field-header {
10868 display: none;
10869 }
10870 .edit-field-settings__single-tab-content .checkout__single-field {
10871 display: block;
10872 padding: 15px 20px 15px 57px;
10873 background-color: #ffffff;
10874 margin-top: 20px;
10875 border-radius: 10px;
10876 border-bottom: none;
10877 }
10878 .edit-field-settings__single-tab-content .checkout__single-field .field-item:not(.field-hamburger) {
10879 padding-right: 0;
10880 width: 100%;
10881 display: flex;
10882 flex-flow: row wrap;
10883 align-items: center;
10884 padding: 8px 0;
10885 border-bottom: 1px solid #f0f1f3;
10886 }
10887 .edit-field-settings__single-tab-content .checkout__single-field .field-item:not(.field-hamburger):last-child {
10888 margin-bottom: 0;
10889 border-bottom: none;
10890 padding-bottom: 0;
10891 }
10892 .edit-field-settings__single-tab-content .checkout__single-field .field-item:not(.field-hamburger):before {
10893 content: attr(data-label);
10894 vertical-align: middle;
10895 width: 95px;
10896 font-weight: 500;
10897 }
10898 .checkout-edit-field__settings-option .options-wrapper::before {
10899 height: calc(100% - 50px);
10900 }
10901 .checkout-edit-field__settings-option .settings-title {
10902 padding: 20px 20px;
10903 }
10904 .checkout-edit-field__settings-option .options-wrapper {
10905 padding: 25px 20px;
10906 }
10907 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(odd) {
10908 padding-right: 20px;
10909 }
10910 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(even) {
10911 padding-left: 20px;
10912 }
10913 }
10914 @media only screen and (max-width: 1199px) {
10915 .checkout-edit-field__settings-option .options-wrapper {
10916 padding: 25px 20px;
10917 }
10918 .checkout-edit-field__settings-option .options-wrapper::before {
10919 display: none;
10920 }
10921 .checkout-edit-field__settings-option .options-wrapper .single-option {
10922 width: 100%;
10923 }
10924 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(odd) {
10925 padding-right: 0;
10926 }
10927 .checkout-edit-field__settings-option .options-wrapper .single-option:nth-child(even) {
10928 padding-left: 0;
10929 }
10930 }
10931 .wpfunnels-addons {
10932 background: #f6f5fa;
10933 }
10934 .wpfunnels-addons .addons-content {
10935 background: #F6F5FA;
10936 padding: 40px 30px;
10937 }
10938 .wpfunnels-addons .section-title {
10939 margin: 0 0 20px;
10940 color: #363B4E;
10941 font-size: 24px;
10942 font-weight: 600;
10943 line-height: 1.3;
10944 }
10945 .wpfunnels-addons .wpfunnels-addons-grid {
10946 display: grid;
10947 grid-template-columns: repeat(3, 1fr);
10948 gap: 24px;
10949 }
10950 .wpfunnels-addons .wpfunnels-addons-card {
10951 background: #ffffff;
10952 border-radius: 10px;
10953 padding: 20px;
10954 position: relative;
10955 transition: all 0.3s ease;
10956 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
10957 }
10958 .wpfunnels-addons .wpfunnels-addons-card:hover {
10959 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
10960 transform: translateY(-2px);
10961 }
10962 .wpfunnels-addons .wpfunnels-addons-card .badge {
10963 position: absolute;
10964 top: 12px;
10965 right: 12px;
10966 padding: 4px 9px;
10967 border-radius: 4px;
10968 font-size: 11px;
10969 font-weight: 500;
10970 line-height: 1;
10971 background-color: #ececec;
10972 }
10973 .wpfunnels-addons .wpfunnels-addons-card .badge.hot {
10974 background-color: #7742E6;
10975 color: #ffffff;
10976 }
10977 .wpfunnels-addons .wpfunnels-addons-card .addons-icon {
10978 margin-bottom: 16px;
10979 width: 46px;
10980 height: 46px;
10981 border-radius: 50%;
10982 border: 1px solid #ECF1F6;
10983 display: flex;
10984 align-items: center;
10985 justify-content: center;
10986 }
10987 .wpfunnels-addons .wpfunnels-addons-card .addons-icon svg {
10988 display: block;
10989 }
10990 .wpfunnels-addons .wpfunnels-addons-card .addons-title {
10991 margin: 0 0 7px;
10992 color: #2D3149;
10993 font-size: 16px;
10994 font-weight: 500;
10995 line-height: 1.3;
10996 }
10997 .wpfunnels-addons .wpfunnels-addons-card .addons-description {
10998 margin: 0 0 20px;
10999 color: #6E7A85;
11000 font-size: 14px;
11001 font-weight: 400;
11002 line-height: 1.5;
11003 }
11004 .wpfunnels-addons .wpfunnels-addons-card .addons-description .guide-link {
11005 color: #6E42D3;
11006 font-weight: 500;
11007 text-decoration: none;
11008 display: inline-flex;
11009 align-items: center;
11010 gap: 4px;
11011 transition: all 0.2s ease;
11012 }
11013 .wpfunnels-addons .wpfunnels-addons-card .addons-description .guide-link svg {
11014 display: inline-block;
11015 vertical-align: middle;
11016 }
11017 .wpfunnels-addons .wpfunnels-addons-card .addons-description .guide-link:hover {
11018 text-decoration: underline;
11019 }
11020 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button {
11021 padding: 6px 14px;
11022 font-size: 14px;
11023 font-weight: 500;
11024 line-height: 1.4;
11025 cursor: pointer;
11026 transition: all 0.3s ease;
11027 border-radius: 8px;
11028 border: 1px solid #6E42D3;
11029 display: inline-flex;
11030 align-items: center;
11031 justify-content: center;
11032 gap: 8px;
11033 text-decoration: none;
11034 background: #ffffff;
11035 color: #6E42D3;
11036 }
11037 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button:hover {
11038 background: #6E42D3;
11039 color: #ffffff;
11040 }
11041 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.activate-button {
11042 background: #ffffff;
11043 color: #6E42D3;
11044 border: 1px solid #6E42D3;
11045 }
11046 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.activate-button:hover {
11047 background: #6E42D3;
11048 color: #ffffff;
11049 }
11050 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.active-status {
11051 color: #10B981;
11052 border: 1px solid #10B981;
11053 cursor: default;
11054 }
11055 .wpfunnels-addons .wpfunnels-addons-card .addons-cta-button.active-status:hover {
11056 background: transparent;
11057 color: #10B981;
11058 }
11059 @media (max-width: 1280px) {
11060 .wpfunnels-addons .wpfunnels-addons-grid {
11061 grid-template-columns: repeat(2, 1fr);
11062 }
11063 }
11064 @media (max-width: 768px) {
11065 .wpfunnels-addons .wpfunnels-addons-grid {
11066 grid-template-columns: 1fr;
11067 }
11068 }
11069
11070 @media (max-width: 1399px) {
11071 .wpfunnels-addons .addons-content {
11072 padding: 20px 0px;
11073 }
11074 .wpfunnels-addons .wpfunnels-addons-grid {
11075 gap: 20px;
11076 }
11077 }
11078 .wpfunnels-setup {
11079 background: #F6F5FA;
11080 margin: 0;
11081 padding: 0;
11082 }
11083 .wpfunnels-setup * {
11084 padding: 0;
11085 margin: 0;
11086 box-sizing: border-box;
11087 }
11088 .wpfunnels-setup #wpfunnels_setup_wizard {
11089 height: 100vh;
11090 width: 100%;
11091 margin: 0 auto;
11092 }
11093 .wpfunnels-setup .wpfnl-mm-setup-wizard {
11094 display: flex;
11095 align-items: stretch;
11096 position: relative;
11097 height: 100vh;
11098 width: 100%;
11099 }
11100 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar {
11101 width: 260px;
11102 background: #FFF;
11103 height: 100vh;
11104 position: sticky;
11105 top: 0;
11106 box-shadow: 1px 0px 2px rgba(190, 190, 215, 0.14);
11107 display: flex;
11108 flex-direction: column;
11109 flex-shrink: 0;
11110 padding: 30px;
11111 }
11112 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-branding {
11113 border-bottom: 1px solid #EAE9EE;
11114 padding: 0 0 30px 0;
11115 display: flex;
11116 align-items: center;
11117 gap: 12px;
11118 }
11119 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-branding .wpfnl-mm-setup-wizard-logo {
11120 width: 36px;
11121 height: 27px;
11122 flex-shrink: 0;
11123 object-fit: contain;
11124 }
11125 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-branding .wpfnl-mm-setup-wizard-brand-name {
11126 font-size: 22px;
11127 color: #111827;
11128 line-height: 16px;
11129 font-weight: 700;
11130 letter-spacing: 0px;
11131 font-family: "Inter", sans-serif;
11132 margin: 0;
11133 }
11134 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps {
11135 padding: 30px 0;
11136 flex: 1;
11137 display: flex;
11138 flex-direction: column;
11139 gap: 0;
11140 }
11141 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step {
11142 display: flex;
11143 align-items: center;
11144 gap: 8px;
11145 padding: 9px 11px;
11146 cursor: pointer;
11147 transition: all 0.3s ease;
11148 border-radius: 100px;
11149 margin-bottom: 12px;
11150 border: 1px solid transparent;
11151 }
11152 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step:last-child {
11153 margin-bottom: 0;
11154 }
11155 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-steps .wpfnl-mm-setup-wizard-step.active {
11156 background: #F6F5FA;
11157 border: 1px solid #6E42D3;
11158 padding: 8px 10px;
11159 }
11160 .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 {
11161 background: #6E42D3;
11162 color: #FFF;
11163 font-weight: 700;
11164 }
11165 .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 {
11166 color: #6E42D3;
11167 font-weight: 500;
11168 }
11169 .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 {
11170 background: transparent;
11171 color: rgba(122, 140, 154, 0.7);
11172 }
11173 .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 {
11174 width: 20px;
11175 height: 20px;
11176 }
11177 .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 {
11178 color: rgba(122, 140, 154, 0.7);
11179 }
11180 .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 {
11181 width: 24px;
11182 height: 24px;
11183 border-radius: 16px;
11184 background: #EDE5FF;
11185 color: #6E42D3;
11186 display: flex;
11187 align-items: center;
11188 justify-content: center;
11189 font-size: 12px;
11190 font-weight: 600;
11191 font-family: "DM Sans", sans-serif;
11192 line-height: 12px;
11193 flex-shrink: 0;
11194 }
11195 .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 {
11196 font-size: 16px;
11197 color: #6D707D;
11198 font-family: "DM Sans", sans-serif;
11199 font-weight: 400;
11200 letter-spacing: -0.16px;
11201 line-height: normal;
11202 white-space: nowrap;
11203 }
11204 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-exit {
11205 margin-top: auto;
11206 padding: 0;
11207 text-align: left;
11208 }
11209 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-exit .wpfnl-mm-setup-wizard-exit-link {
11210 font-size: 15px;
11211 color: #7A8C9A;
11212 text-decoration: none;
11213 font-family: "DM Sans", sans-serif;
11214 font-weight: 400;
11215 line-height: 18px;
11216 transition: color 0.3s ease;
11217 }
11218 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-sidebar .wpfnl-mm-setup-wizard-exit .wpfnl-mm-setup-wizard-exit-link:hover {
11219 color: #6E42D3;
11220 }
11221 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn {
11222 position: fixed;
11223 bottom: 40px;
11224 right: 54px;
11225 z-index: 100;
11226 }
11227 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn .wpfnl-mm-help-btn-circle {
11228 width: 34px;
11229 height: 34px;
11230 border-radius: 100px;
11231 background: #201F22;
11232 border: none;
11233 cursor: pointer;
11234 display: flex;
11235 align-items: center;
11236 justify-content: center;
11237 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.16);
11238 transition: all 0.3s ease;
11239 }
11240 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn .wpfnl-mm-help-btn-circle svg {
11241 width: 16px;
11242 height: 16px;
11243 }
11244 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-help-btn .wpfnl-mm-help-btn-circle:hover {
11245 background: #363B4E;
11246 transform: scale(1.05);
11247 }
11248 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content {
11249 flex: 1;
11250 display: flex;
11251 align-items: flex-start;
11252 justify-content: center;
11253 padding: 80px 20px 24px;
11254 position: relative;
11255 overflow-y: auto;
11256 background: #EFEEF1;
11257 }
11258 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content * {
11259 font-family: "DM Sans", sans-serif;
11260 }
11261 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons {
11262 display: flex;
11263 justify-content: space-between;
11264 align-items: center;
11265 width: 100%;
11266 }
11267 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn {
11268 padding: 10px 24px;
11269 border-radius: 10px;
11270 font-size: 16px;
11271 font-weight: 500;
11272 line-height: 24px;
11273 cursor: pointer;
11274 transition: all 0.3s ease;
11275 border: none;
11276 display: inline-flex;
11277 align-items: center;
11278 justify-content: center;
11279 gap: 8px;
11280 height: 44px;
11281 }
11282 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-secondary {
11283 background: #FFF;
11284 color: #363B4E;
11285 border: 1px solid #ECEBF0;
11286 min-width: 87px;
11287 }
11288 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-secondary:hover {
11289 border-color: #6E42D3;
11290 color: #6E42D3;
11291 }
11292 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary {
11293 background: #6E42D3;
11294 color: #FFF;
11295 letter-spacing: 0.2px;
11296 }
11297 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary svg {
11298 width: 17px;
11299 height: 12px;
11300 }
11301 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary:hover {
11302 background: #5c36b3;
11303 }
11304 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn.wpfnl-mm-btn-primary:disabled {
11305 background: #ccc;
11306 cursor: not-allowed;
11307 }
11308 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-buttons .wpfnl-mm-btn-group {
11309 display: flex;
11310 gap: 12px;
11311 }
11312 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent {
11313 display: flex;
11314 justify-content: center;
11315 margin-top: 30px;
11316 }
11317 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox {
11318 display: flex;
11319 align-items: center;
11320 gap: 8px;
11321 cursor: pointer;
11322 user-select: none;
11323 }
11324 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox input[type=checkbox] {
11325 position: absolute;
11326 opacity: 0;
11327 cursor: pointer;
11328 height: 0;
11329 width: 0;
11330 }
11331 .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 {
11332 background: #6E42D3;
11333 border-color: #6E42D3;
11334 }
11335 .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 {
11336 display: block;
11337 }
11338 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox .wpfnl-mm-checkbox-checkmark {
11339 width: 16px;
11340 height: 16px;
11341 border: 1px solid #ab91e6;
11342 border-radius: 4px;
11343 background: #FFF;
11344 flex-shrink: 0;
11345 position: relative;
11346 transition: all 0.3s ease;
11347 }
11348 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox .wpfnl-mm-checkbox-checkmark:after {
11349 content: "";
11350 position: absolute;
11351 display: none;
11352 border: solid white;
11353 border-width: 0 2px 2px 0;
11354 transform: rotate(45deg);
11355 left: 5px;
11356 top: 2px;
11357 width: 3px;
11358 height: 7px;
11359 }
11360 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal-consent .wpfnl-mm-checkbox .wpfnl-mm-checkbox-label {
11361 font-size: 14px;
11362 font-weight: 500;
11363 color: #7A8C9A;
11364 line-height: 20px;
11365 }
11366 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal {
11367 width: 100%;
11368 max-width: 908px;
11369 display: flex;
11370 flex-direction: column;
11371 gap: 0;
11372 position: relative;
11373 }
11374 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-header {
11375 text-align: center;
11376 margin-bottom: 30px;
11377 }
11378 .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 {
11379 font-size: 24px;
11380 font-weight: 600;
11381 font-family: "DM Sans", sans-serif;
11382 color: #363B4E;
11383 line-height: 30px;
11384 letter-spacing: -0.6px;
11385 margin: 0 0 10px 0;
11386 max-width: 592px;
11387 margin-left: auto;
11388 margin-right: auto;
11389 }
11390 .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 {
11391 font-size: 15px;
11392 font-weight: 400;
11393 font-family: "DM Sans", sans-serif;
11394 color: #6E7A85;
11395 line-height: 19px;
11396 margin: 0;
11397 }
11398 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-goal .wpfnl-mm-choose-goal-container {
11399 border-radius: 20px;
11400 padding: 60px 30px;
11401 display: flex;
11402 flex-direction: column;
11403 align-items: center;
11404 gap: 35px;
11405 margin-bottom: 25px;
11406 background: #FFF;
11407 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
11408 }
11409 .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 {
11410 display: grid;
11411 gap: 20px;
11412 grid-template-columns: repeat(3, 1fr);
11413 width: 100%;
11414 }
11415 .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 {
11416 background: #FFF;
11417 border: 1px solid #F6F5FA;
11418 border-radius: 16px;
11419 padding: 20px 10px 24px;
11420 cursor: pointer;
11421 transition: all 0.3s ease;
11422 position: relative;
11423 text-align: center;
11424 display: flex;
11425 flex-direction: column;
11426 align-items: center;
11427 justify-content: space-between;
11428 gap: 0;
11429 }
11430 .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 {
11431 border-color: #EDE5FF;
11432 box-shadow: 0px 4px 12px rgba(110, 66, 211, 0.1);
11433 }
11434 .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 {
11435 border-color: #6E42D3;
11436 box-shadow: 0 20px 30px rgba(199, 191, 217, 0.3019607843);
11437 }
11438 .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 {
11439 position: absolute;
11440 top: 12px;
11441 right: 12px;
11442 width: 24px;
11443 height: 24px;
11444 background: #6E42D3;
11445 border-radius: 100px;
11446 display: flex;
11447 align-items: center;
11448 justify-content: center;
11449 }
11450 .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 {
11451 width: 16px;
11452 height: 16px;
11453 }
11454 .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 {
11455 display: block;
11456 }
11457 .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 {
11458 font-size: 16px;
11459 font-weight: 700;
11460 font-family: "DM Sans", sans-serif;
11461 color: #363B4E;
11462 line-height: 13px;
11463 margin: 0 0 10px 0;
11464 }
11465 .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 {
11466 font-size: 15px;
11467 font-weight: 400;
11468 color: #6E7A85;
11469 line-height: 1.5;
11470 margin: 0;
11471 }
11472 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container {
11473 display: flex;
11474 align-items: center;
11475 justify-content: space-between;
11476 }
11477 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn {
11478 display: inline-flex;
11479 align-items: center;
11480 gap: 8px;
11481 padding: 12px 24px;
11482 border-radius: 8px;
11483 font-weight: 500;
11484 font-size: 14px;
11485 transition: all 0.3s ease;
11486 border: none;
11487 cursor: pointer;
11488 }
11489 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-primary {
11490 background: #6E42D3;
11491 color: white;
11492 }
11493 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-primary:hover:not(:disabled) {
11494 background: #5B35B8;
11495 }
11496 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn:disabled {
11497 opacity: 0.5;
11498 cursor: not-allowed;
11499 }
11500 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-secondary {
11501 background: white;
11502 color: #363B4E;
11503 border-radius: 10px;
11504 border: 1px solid #ECEBF0;
11505 }
11506 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-mm-btn-secondary:hover:not(:disabled) {
11507 border-color: #D1D5DB;
11508 background: #F9FAFB;
11509 }
11510 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-buttons-container .wpfnl-spinner {
11511 animation: spin 0.8s linear infinite;
11512 }
11513 @keyframes spin {
11514 0% {
11515 transform: rotate(0deg);
11516 }
11517 100% {
11518 transform: rotate(360deg);
11519 }
11520 }
11521 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup {
11522 width: 100%;
11523 max-width: 940px;
11524 display: flex;
11525 flex-direction: column;
11526 gap: 24px;
11527 position: relative;
11528 }
11529 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-header {
11530 text-align: center;
11531 margin-bottom: 20px;
11532 }
11533 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-header .wpfnl-mm-setup-title {
11534 font-size: 24px;
11535 font-weight: 700;
11536 color: #363B4E;
11537 line-height: 35px;
11538 margin: 0 0 8px 0;
11539 }
11540 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-header .wpfnl-mm-setup-subtitle {
11541 font-size: 15px;
11542 font-weight: 400;
11543 color: #6E7A85;
11544 line-height: 15px;
11545 margin: 0;
11546 }
11547 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section {
11548 background: #FFF;
11549 border-radius: 20px;
11550 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
11551 }
11552 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-woo-notice {
11553 background: #EBF5FF;
11554 border: 1px solid #B3D9FF;
11555 border-radius: 12px;
11556 padding: 16px 20px;
11557 display: flex;
11558 align-items: flex-start;
11559 gap: 12px;
11560 width: 100%;
11561 margin-top: 16px;
11562 }
11563 .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 {
11564 flex-shrink: 0;
11565 display: flex;
11566 align-items: center;
11567 justify-content: center;
11568 width: 20px;
11569 height: 20px;
11570 margin-top: 2px;
11571 }
11572 .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 {
11573 width: 20px;
11574 height: 20px;
11575 }
11576 .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 {
11577 flex: 1;
11578 display: flex;
11579 flex-direction: column;
11580 gap: 4px;
11581 }
11582 .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 {
11583 font-size: 14px;
11584 font-weight: 600;
11585 font-family: "DM Sans", sans-serif;
11586 color: #0073E6;
11587 line-height: 18px;
11588 margin: 0;
11589 }
11590 .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 {
11591 font-size: 13px;
11592 font-weight: 400;
11593 font-family: "DM Sans", sans-serif;
11594 color: #1E4D7A;
11595 line-height: 18px;
11596 margin: 0;
11597 }
11598 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-section .wpfnl-mm-setup-section-content {
11599 display: flex;
11600 flex-direction: column;
11601 align-items: center;
11602 gap: 24px;
11603 padding: 45px 109px;
11604 }
11605 .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 {
11606 gap: 24px;
11607 }
11608 .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 {
11609 border-radius: 12px;
11610 border: 1.5px solid #F1EFF7;
11611 background: #FFF;
11612 display: flex;
11613 flex-direction: column;
11614 align-items: center;
11615 justify-content: center;
11616 gap: 12px;
11617 position: relative;
11618 width: 110px;
11619 height: 100px;
11620 }
11621 .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 {
11622 box-shadow: 0 20px 30px 0 rgba(199, 191, 217, 0.3);
11623 border-color: #239654;
11624 }
11625 .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 {
11626 position: absolute;
11627 background: #239654;
11628 display: flex;
11629 align-items: center;
11630 justify-content: center;
11631 width: 18px;
11632 height: 18px;
11633 border-radius: 50%;
11634 top: 5px;
11635 right: 5px;
11636 }
11637 .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 {
11638 color: #6E7A85;
11639 font-size: 14px;
11640 font-weight: 400;
11641 line-height: 1;
11642 }
11643 .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 {
11644 cursor: pointer;
11645 width: auto;
11646 min-width: 110px;
11647 padding: 10px 12px;
11648 }
11649 .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 {
11650 border-color: #6E42D3;
11651 }
11652 .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 {
11653 opacity: 0.5;
11654 cursor: not-allowed;
11655 pointer-events: auto;
11656 }
11657 .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 {
11658 border-color: #F1EFF7;
11659 box-shadow: none;
11660 }
11661 .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 {
11662 border-color: #F1EFF7;
11663 box-shadow: none;
11664 }
11665 .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 {
11666 background: #6E42D3;
11667 }
11668 .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 {
11669 position: absolute;
11670 top: 5px;
11671 right: 5px;
11672 background: #f68524;
11673 color: #fff;
11674 font-size: 9px;
11675 font-weight: 600;
11676 line-height: 1;
11677 padding: 3px 6px;
11678 border-radius: 4px;
11679 white-space: nowrap;
11680 }
11681 .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 {
11682 width: 30px;
11683 height: 30px;
11684 }
11685 .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 {
11686 padding: 45px 30px;
11687 }
11688 .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 {
11689 cursor: pointer;
11690 width: 100%;
11691 min-width: unset;
11692 padding: 16px 20px;
11693 flex-direction: column;
11694 align-items: center;
11695 justify-content: center;
11696 gap: 16px;
11697 text-align: center;
11698 background: transparent;
11699 border: 1px solid #F1EFF7;
11700 border-radius: 14px;
11701 transition: all 0.3s ease;
11702 height: 100%;
11703 width: auto;
11704 }
11705 .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 {
11706 border-color: #E8E4F3;
11707 background: #FEFEFE;
11708 }
11709 .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 {
11710 border-color: #6E42D3;
11711 box-shadow: 0 20px 30px rgba(199, 191, 217, 0.3);
11712 }
11713 .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 {
11714 background: #6E42D3;
11715 top: 12px;
11716 right: 12px;
11717 width: 24px;
11718 height: 24px;
11719 box-shadow: 0px 2px 6px rgba(110, 66, 211, 0.3);
11720 }
11721 .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 {
11722 width: 16px;
11723 height: 16px;
11724 }
11725 .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 {
11726 width: 48px;
11727 height: 48px;
11728 flex-shrink: 0;
11729 object-fit: contain;
11730 }
11731 .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 {
11732 display: flex;
11733 flex-direction: column;
11734 gap: 4px;
11735 flex: 1;
11736 min-width: 0;
11737 }
11738 .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 {
11739 font-size: 15px;
11740 font-weight: 600;
11741 color: #363B4E;
11742 line-height: 1.4;
11743 }
11744 .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 {
11745 font-size: 14px;
11746 font-weight: 400;
11747 color: #6E7A85;
11748 line-height: 1.5;
11749 max-width: 240px;
11750 }
11751 .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 {
11752 font-size: 16px;
11753 font-weight: 500;
11754 color: #363B4E;
11755 line-height: 18px;
11756 margin: 0;
11757 text-align: center;
11758 }
11759 .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 {
11760 display: flex;
11761 gap: 10px;
11762 align-items: center;
11763 width: 100%;
11764 justify-content: center;
11765 }
11766 .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 {
11767 display: grid;
11768 grid-template-columns: repeat(3, 1fr);
11769 gap: 10px;
11770 width: 100%;
11771 }
11772 .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 {
11773 grid-column: 1/-1;
11774 max-width: 50%;
11775 margin: 0 auto;
11776 }
11777 .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 {
11778 width: 110px;
11779 height: 100px;
11780 border: 1.5px solid #F1EFF7;
11781 border-radius: 12px;
11782 background: #FFF;
11783 display: flex;
11784 flex-direction: column;
11785 align-items: center;
11786 justify-content: center;
11787 gap: 10px;
11788 position: relative;
11789 cursor: pointer;
11790 transition: all 0.3s ease;
11791 }
11792 .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 {
11793 border-color: #239654;
11794 box-shadow: 0px 20px 30px rgba(199, 191, 217, 0.3);
11795 }
11796 .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 {
11797 display: flex;
11798 }
11799 .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 {
11800 position: absolute;
11801 top: 10px;
11802 right: 10px;
11803 width: 18px;
11804 height: 18px;
11805 background: #239654;
11806 border-radius: 100px;
11807 display: none;
11808 align-items: center;
11809 justify-content: center;
11810 }
11811 .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 {
11812 width: 16px;
11813 height: 16px;
11814 }
11815 .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 {
11816 width: 28px;
11817 height: 24px;
11818 }
11819 .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 {
11820 width: 100%;
11821 height: 100%;
11822 }
11823 .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 {
11824 font-size: 14px;
11825 font-weight: 400;
11826 font-family: "DM Sans", sans-serif;
11827 color: #6E7A85;
11828 line-height: 13px;
11829 }
11830 .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 {
11831 display: grid;
11832 grid-template-columns: repeat(6, 110px);
11833 gap: 10px;
11834 justify-content: center;
11835 }
11836 .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 {
11837 width: 110px;
11838 height: 100px;
11839 border: 1px solid #F1EFF7;
11840 border-radius: 10px;
11841 background: #FFF;
11842 display: flex;
11843 flex-direction: column;
11844 align-items: center;
11845 justify-content: center;
11846 gap: 10px;
11847 position: relative;
11848 cursor: pointer;
11849 transition: all 0.3s ease;
11850 }
11851 .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 {
11852 border-color: #EDE5FF;
11853 }
11854 .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 {
11855 border: 1.5px solid #6E42D3;
11856 border-radius: 14px;
11857 box-shadow: 0px 20px 30px rgba(199, 191, 217, 0.3);
11858 }
11859 .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 {
11860 display: flex;
11861 }
11862 .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 {
11863 position: absolute;
11864 top: 10px;
11865 right: 10px;
11866 width: 18px;
11867 height: 18px;
11868 background: #6E42D3;
11869 border-radius: 100px;
11870 display: none;
11871 align-items: center;
11872 justify-content: center;
11873 }
11874 .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 {
11875 width: 16px;
11876 height: 16px;
11877 }
11878 .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 {
11879 width: 30px;
11880 height: 30px;
11881 }
11882 .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 {
11883 font-size: 14px;
11884 font-weight: 400;
11885 font-family: "DM Sans", sans-serif;
11886 color: #6E7A85;
11887 line-height: 13px;
11888 }
11889 .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 {
11890 display: flex;
11891 gap: 10px;
11892 justify-content: center;
11893 flex-wrap: wrap;
11894 }
11895 .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 {
11896 min-width: 86px;
11897 height: 44px;
11898 border: 1px solid #F1EFF7;
11899 border-radius: 12px;
11900 background: #FFF;
11901 display: flex;
11902 align-items: center;
11903 justify-content: center;
11904 padding: 0 20px;
11905 position: relative;
11906 }
11907 .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 {
11908 position: absolute;
11909 top: -8px;
11910 right: -8px;
11911 background: #239654;
11912 color: #FFF;
11913 font-size: 10px;
11914 font-weight: 700;
11915 font-family: "DM Sans", sans-serif;
11916 padding: 5px;
11917 border-radius: 5px;
11918 line-height: 24px;
11919 }
11920 .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 {
11921 display: flex;
11922 align-items: center;
11923 justify-content: center;
11924 }
11925 .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 {
11926 max-width: 100%;
11927 height: auto;
11928 }
11929 .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 {
11930 display: flex;
11931 align-items: flex-start;
11932 gap: 7px;
11933 padding-top: 22px;
11934 border-top: 1px solid #EAE9EE;
11935 margin-top: 0;
11936 width: 100%;
11937 justify-content: center;
11938 }
11939 .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 {
11940 width: 16px;
11941 height: 16px;
11942 flex-shrink: 0;
11943 margin-top: 2px;
11944 }
11945 .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 {
11946 font-size: 14px;
11947 font-weight: 400;
11948 font-family: "DM Sans", sans-serif;
11949 color: #7A8C9A;
11950 line-height: 15px;
11951 margin: 0;
11952 max-width: 588px;
11953 }
11954 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info {
11955 display: flex;
11956 align-items: center;
11957 justify-content: center;
11958 gap: 6px;
11959 border-top: 1px solid #F1EFF7;
11960 padding: 20px 20px;
11961 }
11962 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info svg {
11963 flex-shrink: 0;
11964 }
11965 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info p {
11966 margin: 0;
11967 color: #E4781B;
11968 font-size: 14px;
11969 font-weight: 400;
11970 line-height: 1.3;
11971 }
11972 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-page-builder-info strong {
11973 font-weight: 600;
11974 }
11975 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns {
11976 display: grid;
11977 grid-template-columns: 2fr 1fr;
11978 gap: 16px;
11979 align-items: start;
11980 }
11981 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-setup .wpfnl-mm-setup-columns .wpfnl-mm-setup-section-content {
11982 padding: 28px 20px;
11983 }
11984 .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 {
11985 display: grid;
11986 grid-template-columns: repeat(3, 1fr);
11987 gap: 10px;
11988 width: 100%;
11989 justify-content: unset;
11990 }
11991 .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 {
11992 width: 100%;
11993 min-width: unset;
11994 }
11995 .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 {
11996 grid-template-columns: 1fr;
11997 }
11998 .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 {
11999 max-width: 100%;
12000 grid-column: auto;
12001 margin: 0;
12002 }
12003 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel {
12004 width: 100%;
12005 max-width: 1049px;
12006 display: flex;
12007 flex-direction: column;
12008 gap: 15px;
12009 position: relative;
12010 }
12011 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-header {
12012 text-align: center;
12013 margin-bottom: 15px;
12014 }
12015 .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 {
12016 font-size: 24px;
12017 font-weight: 700;
12018 font-family: "DM Sans", sans-serif;
12019 color: #363B4E;
12020 line-height: 35px;
12021 letter-spacing: -1px;
12022 margin: 0 0 8px 0;
12023 }
12024 .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 {
12025 font-size: 15px;
12026 font-weight: 400;
12027 font-family: "DM Sans", sans-serif;
12028 color: #6E7A85;
12029 line-height: 15px;
12030 margin: 0;
12031 }
12032 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-container {
12033 display: flex;
12034 gap: 3px;
12035 }
12036 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-form {
12037 width: 461px;
12038 background: #FFF;
12039 border-radius: 16px;
12040 padding: 40px;
12041 display: flex;
12042 flex-direction: column;
12043 min-height: 482px;
12044 gap: 30px;
12045 }
12046 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-fields {
12047 display: flex;
12048 flex-direction: column;
12049 gap: 40px;
12050 flex: 1;
12051 }
12052 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-field {
12053 display: flex;
12054 flex-direction: column;
12055 gap: 9px;
12056 }
12057 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-label {
12058 font-size: 15px;
12059 font-weight: 500;
12060 font-family: "DM Sans", sans-serif;
12061 color: #363B4E;
12062 letter-spacing: -0.44px;
12063 line-height: 16px;
12064 }
12065 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-label .required {
12066 color: red;
12067 }
12068 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-label .optional {
12069 font-weight: 400;
12070 color: #7A8C9A;
12071 }
12072 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-dropdown {
12073 position: relative;
12074 }
12075 .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 {
12076 height: 46px;
12077 background: #FFF;
12078 border: 1px solid #F1EFF7;
12079 border-radius: 8px;
12080 padding: 0 16px;
12081 display: flex;
12082 align-items: center;
12083 justify-content: space-between;
12084 cursor: pointer;
12085 transition: all 0.3s ease;
12086 }
12087 .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 {
12088 font-size: 14px;
12089 font-family: "DM Sans", sans-serif;
12090 color: #7A8C9A;
12091 }
12092 .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 {
12093 font-size: 14px;
12094 font-family: "DM Sans", sans-serif;
12095 color: #363B4E;
12096 }
12097 .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 {
12098 transition: transform 0.3s ease;
12099 }
12100 .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 {
12101 border-color: #6E42D3;
12102 }
12103 .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 {
12104 transform: rotate(180deg);
12105 }
12106 .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 {
12107 position: absolute;
12108 top: 100%;
12109 left: 0;
12110 right: 0;
12111 background: #FFF;
12112 border: 1px solid #F1EFF7;
12113 border-radius: 8px;
12114 margin-top: 4px;
12115 z-index: 100;
12116 box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
12117 max-height: 270px;
12118 }
12119 .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 {
12120 padding: 12px 16px;
12121 font-size: 14px;
12122 font-family: "DM Sans", sans-serif;
12123 color: #363B4E;
12124 cursor: pointer;
12125 display: flex;
12126 align-items: center;
12127 justify-content: space-between;
12128 transition: background 0.2s ease;
12129 }
12130 .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 {
12131 background: #F6F5FA;
12132 }
12133 .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 {
12134 background: #F6F5FA;
12135 color: #6E42D3;
12136 }
12137 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-hint {
12138 font-size: 12px;
12139 font-family: "Inter", sans-serif;
12140 color: #7A8C9A;
12141 line-height: 16px;
12142 margin: 0;
12143 }
12144 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-revenue {
12145 margin-top: auto;
12146 padding: 16px 20px;
12147 background: #F6F5FA;
12148 border: 1px dashed #6E42D3;
12149 border-radius: 8px;
12150 display: none;
12151 }
12152 .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 {
12153 font-size: 14px;
12154 font-family: "DM Sans", sans-serif;
12155 color: #7A8C9A;
12156 margin: 0 0 4px 0;
12157 font-weight: 500;
12158 }
12159 .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 {
12160 font-size: 16px;
12161 font-family: "DM Sans", sans-serif;
12162 font-weight: 500;
12163 color: #363B4E;
12164 margin: 0;
12165 }
12166 .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 {
12167 color: #6E42D3;
12168 font-weight: 700;
12169 }
12170 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview {
12171 flex: 1;
12172 background: #FFF;
12173 border-radius: 16px;
12174 min-height: 484px;
12175 display: flex;
12176 flex-direction: column;
12177 }
12178 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tabs {
12179 display: flex;
12180 align-items: center;
12181 justify-content: center;
12182 padding: 20px 20px 0;
12183 gap: 0;
12184 }
12185 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab {
12186 display: flex;
12187 flex-direction: column;
12188 align-items: center;
12189 gap: 8px;
12190 cursor: pointer;
12191 }
12192 .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 {
12193 width: 48px;
12194 height: 48px;
12195 border-radius: 50%;
12196 border: 1px solid #F1EFF7;
12197 display: flex;
12198 align-items: center;
12199 justify-content: center;
12200 color: #6E7A85;
12201 transition: all 0.3s ease;
12202 }
12203 .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 {
12204 font-size: 12px;
12205 font-family: "Inter", sans-serif;
12206 font-weight: 500;
12207 color: #6E7A85;
12208 text-align: center;
12209 }
12210 .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 {
12211 border: 1.5px solid #6E42D3;
12212 color: #6E42D3;
12213 box-shadow: 0px 20px 30px rgba(199, 191, 217, 0.3);
12214 }
12215 .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 {
12216 color: #363B4E;
12217 }
12218 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-tab-line {
12219 width: 22px;
12220 height: 1px;
12221 background: #E5E5E5;
12222 margin: 0 8px;
12223 margin-bottom: 24px;
12224 }
12225 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-content {
12226 flex: 1;
12227 padding: 20px;
12228 }
12229 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-image {
12230 width: 100%;
12231 height: 100%;
12232 min-height: auto;
12233 background: #F6F5FA;
12234 border-radius: 16px;
12235 overflow: hidden;
12236 display: flex;
12237 align-items: flex-start;
12238 justify-content: center;
12239 padding: 16px;
12240 }
12241 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-image img {
12242 width: 100%;
12243 height: 350px;
12244 object-fit: cover;
12245 object-position: top center;
12246 border-radius: 10px;
12247 }
12248 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder,
12249 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty {
12250 display: flex;
12251 flex-direction: column;
12252 align-items: center;
12253 justify-content: center;
12254 height: 100%;
12255 min-height: 400px;
12256 color: #7A8C9A;
12257 text-align: center;
12258 padding: 40px;
12259 }
12260 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder svg,
12261 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty svg {
12262 margin-bottom: 16px;
12263 opacity: 0.5;
12264 }
12265 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder p,
12266 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty p {
12267 font-size: 14px;
12268 font-family: "DM Sans", sans-serif;
12269 margin: 0;
12270 }
12271 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-placeholder h4,
12272 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-preview-empty h4 {
12273 font-size: 18px;
12274 font-family: "DM Sans", sans-serif;
12275 font-weight: 600;
12276 color: #363B4E;
12277 margin: 0 0 8px 0;
12278 }
12279 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-buttons {
12280 display: flex;
12281 justify-content: space-between;
12282 align-items: center;
12283 width: 100%;
12284 }
12285 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-build-funnel .wpfnl-mm-build-funnel-buttons .wpfnl-mm-btn-skip {
12286 background: transparent;
12287 color: #7A8C9A;
12288 font-weight: 500;
12289 font-size: 15px;
12290 padding: 10px;
12291 border: none;
12292 cursor: pointer;
12293 }
12294 .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 {
12295 color: #6E42D3;
12296 }
12297 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template {
12298 width: 100%;
12299 max-width: 940px;
12300 display: flex;
12301 flex-direction: column;
12302 gap: 0;
12303 position: relative;
12304 }
12305 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-setup-header {
12306 text-align: center;
12307 margin-bottom: 24px;
12308 }
12309 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-setup-header .wpfnl-mm-setup-title {
12310 font-size: 24px;
12311 font-weight: 700;
12312 font-family: "DM Sans", sans-serif;
12313 color: #363B4E;
12314 line-height: 35px;
12315 letter-spacing: -1px;
12316 margin: 0 0 8px 0;
12317 height: 30px;
12318 }
12319 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-setup-header .wpfnl-mm-setup-subtitle {
12320 font-size: 15px;
12321 font-weight: 400;
12322 font-family: "DM Sans", sans-serif;
12323 color: #6E7A85;
12324 line-height: 15px;
12325 margin: 0;
12326 height: 19px;
12327 }
12328 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-templates-grid {
12329 display: flex;
12330 flex-wrap: wrap;
12331 gap: 30px;
12332 justify-content: center;
12333 align-items: center;
12334 background: #FFF;
12335 border-radius: 16px;
12336 padding: 40px 45px;
12337 margin-bottom: 15px;
12338 }
12339 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card {
12340 width: 259px;
12341 height: 305px;
12342 background: #FFF;
12343 border: 1px solid #F1EFF7;
12344 border-radius: 10px;
12345 cursor: pointer;
12346 transition: all 0.3s ease;
12347 position: relative;
12348 overflow: hidden;
12349 box-shadow: 0px 20px 20px 0px rgba(190, 190, 215, 0.15);
12350 }
12351 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card:hover {
12352 border-color: #C4B5F4;
12353 }
12354 .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 {
12355 opacity: 1;
12356 visibility: visible;
12357 }
12358 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-preview {
12359 width: 100%;
12360 height: 237px;
12361 position: relative;
12362 overflow: hidden;
12363 background: #F6F5FA;
12364 border-radius: 10px 10px 0 0;
12365 }
12366 .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 {
12367 width: 100%;
12368 height: 100%;
12369 object-fit: cover;
12370 object-position: top center;
12371 }
12372 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-overlay {
12373 position: absolute;
12374 top: 0;
12375 left: 0;
12376 width: 100%;
12377 height: 237px;
12378 background: rgba(38, 33, 51, 0.44);
12379 display: flex;
12380 align-items: center;
12381 justify-content: center;
12382 gap: 10px;
12383 opacity: 0;
12384 visibility: hidden;
12385 transition: all 0.3s ease;
12386 border-radius: 10px 10px 0 0;
12387 }
12388 .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,
12389 .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 {
12390 height: 30px;
12391 border-radius: 8px;
12392 font-size: 14px;
12393 font-weight: 500;
12394 cursor: pointer;
12395 transition: all 0.3s ease;
12396 border: none;
12397 display: inline-flex;
12398 align-items: center;
12399 justify-content: center;
12400 padding: 0 12px;
12401 }
12402 .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 {
12403 background: #FFF;
12404 color: #363B4E;
12405 }
12406 .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 {
12407 background: #F6F5FA;
12408 }
12409 .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 {
12410 background: transparent;
12411 color: #FFF;
12412 border: 1px solid #F2F2F2;
12413 }
12414 .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 {
12415 background: rgba(255, 255, 255, 0.1);
12416 }
12417 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-checkmark {
12418 position: absolute;
12419 top: 12px;
12420 right: 12px;
12421 width: 24px;
12422 height: 24px;
12423 background: #FFF;
12424 border-radius: 50%;
12425 display: flex;
12426 align-items: center;
12427 justify-content: center;
12428 z-index: 2;
12429 box-shadow: 0 2px 10px 1px rgba(143, 130, 196, 0.431372549);
12430 }
12431 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-suggested {
12432 position: absolute;
12433 top: 10px;
12434 left: 10px;
12435 z-index: 2;
12436 display: inline-flex;
12437 align-items: center;
12438 gap: 4px;
12439 padding: 3px 8px 3px 6px;
12440 border-radius: 100px;
12441 background: #6E42D3;
12442 color: #FFF;
12443 font-size: 10px;
12444 font-weight: 600;
12445 font-family: "DM Sans", sans-serif;
12446 line-height: 1.4;
12447 letter-spacing: 0.1px;
12448 box-shadow: 0 2px 6px rgba(110, 66, 211, 0.35);
12449 }
12450 .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 {
12451 flex-shrink: 0;
12452 }
12453 .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) {
12454 border-color: #C4B5F4;
12455 }
12456 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-divider {
12457 width: 100%;
12458 height: 1px;
12459 background: #F1EFF7;
12460 }
12461 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-body {
12462 padding: 16px 20px;
12463 display: flex;
12464 flex-direction: column;
12465 align-items: center;
12466 justify-content: center;
12467 text-align: center;
12468 gap: 4px;
12469 }
12470 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-title {
12471 font-size: 14px;
12472 font-weight: 500;
12473 font-family: "Roboto", sans-serif;
12474 color: #363B4E;
12475 line-height: normal;
12476 margin: 0;
12477 }
12478 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card .wpfnl-mm-template-card-steps {
12479 font-size: 12px;
12480 font-weight: 400;
12481 font-family: "Inter", sans-serif;
12482 color: #7A8B9A;
12483 line-height: 12px;
12484 letter-spacing: -0.12px;
12485 }
12486 @keyframes wpfnl-skeleton-shimmer {
12487 0% {
12488 background-position: -600px 0;
12489 }
12490 100% {
12491 background-position: 600px 0;
12492 }
12493 }
12494 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-skeleton-block {
12495 background: linear-gradient(90deg, #f0eef8 25%, #e4e0f2 50%, #f0eef8 75%);
12496 background-size: 600px 100%;
12497 animation: wpfnl-skeleton-shimmer 1.4s ease-in-out infinite;
12498 border-radius: 6px;
12499 }
12500 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-templates-skeleton {
12501 pointer-events: none;
12502 }
12503 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card--skeleton {
12504 cursor: default;
12505 }
12506 .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 {
12507 border-radius: 10px 10px 0 0;
12508 }
12509 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card--skeleton .wpfnl-mm-skeleton-title {
12510 width: 120px;
12511 height: 14px;
12512 }
12513 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-choose-template .wpfnl-mm-template-card--skeleton .wpfnl-mm-skeleton-steps {
12514 width: 60px;
12515 height: 10px;
12516 margin-top: 2px;
12517 }
12518 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete {
12519 width: 100%;
12520 max-width: 785px;
12521 display: flex;
12522 flex-direction: column;
12523 gap: 28px;
12524 align-items: center;
12525 position: relative;
12526 }
12527 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-header {
12528 text-align: center;
12529 max-width: 631px;
12530 }
12531 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-header .wpfnl-mm-complete-title {
12532 font-size: 24px;
12533 font-weight: 700;
12534 font-family: "DM Sans", sans-serif;
12535 color: #363B4E;
12536 line-height: 35px;
12537 letter-spacing: -1px;
12538 margin: 0 0 8px 0;
12539 }
12540 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-header .wpfnl-mm-complete-subtitle {
12541 font-size: 15px;
12542 font-weight: 400;
12543 font-family: "DM Sans", sans-serif;
12544 color: #6E7A85;
12545 line-height: 22px;
12546 margin: 0;
12547 max-width: 534px;
12548 margin-left: auto;
12549 margin-right: auto;
12550 }
12551 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper {
12552 width: 100%;
12553 padding: 10px;
12554 background: #FFF;
12555 border-radius: 16px;
12556 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);
12557 }
12558 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-video-wrapper .wpfnl-mm-complete-video {
12559 width: 100%;
12560 height: 382px;
12561 border-radius: 16px;
12562 background: #F6F5FA;
12563 position: relative;
12564 overflow: hidden;
12565 display: flex;
12566 flex-direction: column;
12567 }
12568 .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 {
12569 position: absolute;
12570 top: 0;
12571 left: 0;
12572 width: 100%;
12573 height: 100%;
12574 }
12575 .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 {
12576 width: 100%;
12577 height: 100%;
12578 object-fit: cover;
12579 object-position: center top;
12580 }
12581 .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 {
12582 position: absolute;
12583 top: 0;
12584 left: 0;
12585 width: 100%;
12586 height: 100%;
12587 background: linear-gradient(180deg, rgba(60, 37, 111, 0) 37.658%, rgba(75, 52, 129, 0.3) 74.038%);
12588 border-radius: 16px;
12589 cursor: pointer;
12590 }
12591 .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 {
12592 width: 100%;
12593 height: 100%;
12594 }
12595 .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 {
12596 position: absolute;
12597 bottom: 18px;
12598 left: 20px;
12599 right: 20px;
12600 display: flex;
12601 align-items: center;
12602 gap: 12px;
12603 }
12604 .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 {
12605 width: 16px;
12606 height: 16px;
12607 background: transparent;
12608 border: none;
12609 cursor: pointer;
12610 padding: 0;
12611 display: flex;
12612 align-items: center;
12613 justify-content: center;
12614 flex-shrink: 0;
12615 }
12616 .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 {
12617 width: 16px;
12618 height: 16px;
12619 }
12620 .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 {
12621 flex: 1;
12622 height: 9px;
12623 background: linear-gradient(90deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
12624 border-radius: 100px;
12625 overflow: hidden;
12626 }
12627 .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 {
12628 width: 0%;
12629 height: 100%;
12630 background: #6E42D3;
12631 border-radius: 100px;
12632 }
12633 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions {
12634 display: flex;
12635 flex-direction: column;
12636 align-items: center;
12637 gap: 6px;
12638 width: 100%;
12639 }
12640 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-complete-buttons {
12641 display: flex;
12642 gap: 12px;
12643 align-items: center;
12644 justify-content: center;
12645 }
12646 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-btn {
12647 padding: 10px 20px;
12648 border-radius: 10px;
12649 font-size: 16px;
12650 line-height: 24px;
12651 cursor: pointer;
12652 transition: all 0.3s ease;
12653 border: none;
12654 display: inline-flex;
12655 align-items: center;
12656 justify-content: center;
12657 gap: 8px;
12658 height: 44px;
12659 }
12660 .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 {
12661 background: #FFF;
12662 color: #363B4E;
12663 border: 1px solid #ECEBF0;
12664 font-weight: 700;
12665 }
12666 .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 {
12667 border-color: #6E42D3;
12668 color: #6E42D3;
12669 }
12670 .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 {
12671 background: #6E42D3;
12672 color: #FFF;
12673 font-weight: 600;
12674 letter-spacing: 0.2px;
12675 }
12676 .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 {
12677 width: 17px;
12678 height: 12px;
12679 }
12680 .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 {
12681 background: #5c36b3;
12682 }
12683 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-complete-info {
12684 padding: 10px;
12685 text-align: center;
12686 }
12687 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-mm-setup-wizard-content .wpfnl-mm-complete .wpfnl-mm-complete-actions .wpfnl-mm-complete-info p {
12688 font-size: 14px;
12689 font-weight: 400;
12690 color: #7A8C9A;
12691 line-height: 22px;
12692 margin: 0;
12693 }
12694 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome {
12695 width: 100%;
12696 }
12697 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-wizard-welcome-content {
12698 width: 100%;
12699 max-width: 918px;
12700 margin: 0 auto;
12701 padding: 40px 30px 0;
12702 border-radius: 20px;
12703 background: #FFF;
12704 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
12705 overflow: hidden;
12706 }
12707 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-wizard-welcome-title {
12708 color: #363B4E;
12709 text-align: center;
12710 font-size: 34px;
12711 font-weight: 600;
12712 line-height: 1.3;
12713 letter-spacing: -0.6px;
12714 text-align: center;
12715 }
12716 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-wizard-welcome-subtitle {
12717 color: #6E7A85;
12718 font-size: 15px;
12719 font-weight: 400;
12720 line-height: 1.4;
12721 text-align: center;
12722 margin-top: 4px;
12723 }
12724 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .wpfnl-mm-choose-goal-buttons {
12725 justify-content: center;
12726 margin-top: 24px;
12727 }
12728 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .welcome-image {
12729 margin: 0;
12730 display: block;
12731 transform: translateX(30px);
12732 }
12733 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-wizard-welcome .welcome-image img {
12734 display: block;
12735 margin-left: auto;
12736 margin-top: 67px;
12737 }
12738 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container {
12739 padding: 40px 30px 30px;
12740 border-radius: 20px;
12741 background: #FFF;
12742 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
12743 }
12744 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search {
12745 display: flex;
12746 align-items: center;
12747 justify-content: space-between;
12748 gap: 16px;
12749 margin-bottom: 24px;
12750 }
12751 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper {
12752 flex: 1;
12753 position: relative;
12754 display: flex;
12755 align-items: center;
12756 gap: 0px;
12757 padding: 10px 14px;
12758 border: 1px solid #EEF0F3;
12759 border-radius: 8px;
12760 background: #FFF;
12761 transition: all 0.3s ease;
12762 }
12763 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper:focus-within {
12764 border-color: #6E42D3;
12765 }
12766 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper svg {
12767 flex-shrink: 0;
12768 }
12769 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-product-sync-search-wrapper .wpfnl-product-sync-search-input {
12770 flex: 1;
12771 border: none !important;
12772 outline: none;
12773 font-size: 14px;
12774 color: #7A8B9A;
12775 background: transparent;
12776 box-shadow: none !important;
12777 }
12778 .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 {
12779 color: #9CA3AF;
12780 }
12781 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn {
12782 display: inline-flex;
12783 align-items: center;
12784 gap: 5px;
12785 padding: 12px 20px;
12786 border: none;
12787 border-radius: 10px;
12788 color: #6E42D3;
12789 font-size: 14px;
12790 font-weight: 500;
12791 cursor: pointer;
12792 transition: all 0.3s ease;
12793 white-space: nowrap;
12794 background: rgba(110, 66, 211, 0.12);
12795 }
12796 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn path {
12797 transition: all 0.3s ease;
12798 stroke: #5B35B8;
12799 }
12800 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn:hover {
12801 background: #5B35B8;
12802 border-color: #5B35B8;
12803 color: #fff;
12804 }
12805 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn:hover path {
12806 stroke: #fff;
12807 }
12808 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-search .wpfnl-create-product-btn svg {
12809 display: block;
12810 }
12811 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-label {
12812 margin-bottom: 16px;
12813 color: #7A8B9A;
12814 font-size: 14px;
12815 font-weight: 400;
12816 line-height: 1;
12817 }
12818 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-cards {
12819 display: flex;
12820 flex-direction: column;
12821 gap: 12px;
12822 }
12823 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card {
12824 display: flex;
12825 align-items: center;
12826 gap: 14px;
12827 padding: 20px;
12828 border: 1px solid #F1EFF7;
12829 border-radius: 12px;
12830 background: #FFF;
12831 cursor: pointer;
12832 transition: all 0.3s ease;
12833 position: relative;
12834 }
12835 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-radio {
12836 position: absolute;
12837 opacity: 0;
12838 width: 0;
12839 height: 0;
12840 pointer-events: none;
12841 }
12842 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card:hover {
12843 border-color: #D1D5DB;
12844 }
12845 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card.active {
12846 border-color: #6E42D3;
12847 }
12848 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-image {
12849 width: 67px;
12850 height: 67px;
12851 border-radius: 8px;
12852 display: flex;
12853 align-items: center;
12854 justify-content: center;
12855 border: 1px solid #F1EFF7;
12856 }
12857 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-image img {
12858 display: block;
12859 height: 100%;
12860 width: 100%;
12861 object-fit: cover;
12862 border-radius: 8px;
12863 }
12864 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-image svg {
12865 width: 32px;
12866 height: 32px;
12867 }
12868 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-content {
12869 display: flex;
12870 flex-direction: column;
12871 width: calc(100% - 82px);
12872 padding-right: 30px;
12873 }
12874 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-title {
12875 margin: 0;
12876 color: #363B4E;
12877 font-size: 14px;
12878 font-weight: 700;
12879 line-height: 1.3;
12880 }
12881 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-description {
12882 margin: 0;
12883 color: #6E7A85;
12884 font-size: 15px;
12885 font-weight: 400;
12886 line-height: 1.4;
12887 }
12888 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-price {
12889 margin: 3px 0 0 0;
12890 color: #363B4E;
12891 font-size: 15px;
12892 font-weight: 700;
12893 line-height: 1;
12894 }
12895 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-checkbox {
12896 position: absolute;
12897 right: 20px;
12898 top: 50%;
12899 transform: translateY(-50%);
12900 }
12901 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-card .wpfnl-product-sync-card-checkbox .wpfnl-product-sync-checkbox-circle {
12902 width: 24px;
12903 height: 24px;
12904 border-radius: 50%;
12905 border: 1px solid #D1D5DB;
12906 background: #FFF;
12907 display: flex;
12908 align-items: center;
12909 justify-content: center;
12910 transition: all 0.3s ease;
12911 }
12912 .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 {
12913 width: 14px;
12914 height: 14px;
12915 display: none;
12916 }
12917 .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 {
12918 background: #6E42D3;
12919 border-color: #6E42D3;
12920 }
12921 .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 {
12922 display: block;
12923 }
12924 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-skeleton {
12925 display: flex;
12926 flex-direction: column;
12927 gap: 12px;
12928 }
12929 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-skeleton-card {
12930 display: flex;
12931 align-items: center;
12932 gap: 14px;
12933 padding: 20px;
12934 border: 1px solid #F1EFF7;
12935 border-radius: 12px;
12936 background: #FFF;
12937 }
12938 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-pulse {
12939 background: linear-gradient(90deg, #F3F4F6 25%, #E5E7EB 50%, #F3F4F6 75%);
12940 background-size: 200% 100%;
12941 animation: wpfnl-skeleton-shimmer 1.5s ease-in-out infinite;
12942 border-radius: 6px;
12943 }
12944 @keyframes wpfnl-skeleton-shimmer {
12945 0% {
12946 background-position: 200% 0;
12947 }
12948 100% {
12949 background-position: -200% 0;
12950 }
12951 }
12952 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-image {
12953 width: 67px;
12954 height: 67px;
12955 border-radius: 8px;
12956 flex-shrink: 0;
12957 }
12958 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-content {
12959 flex: 1;
12960 display: flex;
12961 flex-direction: column;
12962 gap: 8px;
12963 padding-right: 30px;
12964 }
12965 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-title {
12966 height: 14px;
12967 width: 50%;
12968 }
12969 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-description {
12970 height: 12px;
12971 width: 70%;
12972 }
12973 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-price {
12974 height: 14px;
12975 width: 30%;
12976 }
12977 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-skeleton-checkbox {
12978 width: 24px;
12979 height: 24px;
12980 border-radius: 50%;
12981 flex-shrink: 0;
12982 }
12983 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error {
12984 display: flex;
12985 flex-direction: column;
12986 align-items: center;
12987 justify-content: center;
12988 padding: 40px 20px;
12989 text-align: center;
12990 border: 1px solid #FEE2E2;
12991 border-radius: 12px;
12992 background: #FEF2F2;
12993 }
12994 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-error-icon {
12995 margin-bottom: 12px;
12996 }
12997 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-error-icon svg {
12998 display: block;
12999 }
13000 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-error-text {
13001 margin: 0 0 16px;
13002 color: #991B1B;
13003 font-size: 14px;
13004 font-weight: 500;
13005 line-height: 1.5;
13006 }
13007 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-retry-btn {
13008 display: inline-flex;
13009 align-items: center;
13010 gap: 6px;
13011 padding: 8px 18px;
13012 border: 1px solid #DC2626;
13013 border-radius: 8px;
13014 background: #FFF;
13015 color: #DC2626;
13016 font-size: 13px;
13017 font-weight: 500;
13018 cursor: pointer;
13019 transition: all 0.2s ease;
13020 }
13021 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error .wpfnl-product-sync-retry-btn:hover {
13022 background: #DC2626;
13023 color: #FFF;
13024 }
13025 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-error.wpfnl-product-sync-template-error {
13026 flex-direction: row;
13027 padding: 14px 20px;
13028 margin-top: 12px;
13029 gap: 10px;
13030 }
13031 .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 {
13032 margin-bottom: 0;
13033 }
13034 .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 {
13035 margin: 0;
13036 }
13037 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty {
13038 display: flex;
13039 flex-direction: column;
13040 align-items: center;
13041 justify-content: center;
13042 padding: 48px 20px;
13043 text-align: center;
13044 border: 1px dashed #D1D5DB;
13045 border-radius: 12px;
13046 background: #FAFAFA;
13047 }
13048 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-empty-icon {
13049 width: 64px;
13050 height: 64px;
13051 border-radius: 50%;
13052 background: #F3F4F6;
13053 display: flex;
13054 align-items: center;
13055 justify-content: center;
13056 margin-bottom: 16px;
13057 }
13058 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-empty-title {
13059 margin: 0 0 6px;
13060 color: #363B4E;
13061 font-size: 15px;
13062 font-weight: 600;
13063 line-height: 1.3;
13064 }
13065 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-empty-subtitle {
13066 margin: 0 0 20px;
13067 color: #6E7A85;
13068 font-size: 13px;
13069 font-weight: 400;
13070 line-height: 1.5;
13071 max-width: 300px;
13072 }
13073 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-create-btn {
13074 display: inline-flex;
13075 align-items: center;
13076 gap: 6px;
13077 padding: 10px 22px;
13078 border: none;
13079 border-radius: 10px;
13080 background: #6E42D3;
13081 color: #FFF;
13082 font-size: 14px;
13083 font-weight: 500;
13084 cursor: pointer;
13085 transition: all 0.2s ease;
13086 }
13087 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-product-sync-container .wpfnl-product-sync-state-empty .wpfnl-product-sync-create-btn:hover {
13088 background: #5B35B8;
13089 }
13090 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container {
13091 border-radius: 20px;
13092 background: #FFF;
13093 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
13094 display: flex;
13095 align-items: center;
13096 justify-content: center;
13097 height: 508px;
13098 position: relative;
13099 }
13100 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .wpfnl-generate-funnel-canvas {
13101 width: 100%;
13102 height: auto;
13103 max-width: 580px;
13104 border-radius: 20px;
13105 }
13106 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .wpfnl-generate-funnel-canvas img {
13107 width: 100%;
13108 height: 100%;
13109 border-radius: 20px;
13110 }
13111 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-funnel-overlay {
13112 position: absolute;
13113 top: 0;
13114 left: 0;
13115 right: 0;
13116 bottom: 0;
13117 border-radius: 20px;
13118 background: rgba(75, 52, 129, 0.4);
13119 backdrop-filter: blur(0);
13120 border: 1px solid #fff;
13121 padding: 20px;
13122 display: flex;
13123 flex-flow: column;
13124 align-items: center;
13125 justify-content: flex-end;
13126 }
13127 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-funnel-overlay .generated-notice {
13128 border-radius: 12px;
13129 background: #FFF;
13130 box-shadow: 0 4px 4px 0 rgba(151, 145, 166, 0.3);
13131 display: inline-flex;
13132 align-items: center;
13133 justify-content: center;
13134 gap: 6px;
13135 color: #6E7A85;
13136 font-size: 16px;
13137 font-weight: 400;
13138 line-height: 1;
13139 padding: 13px 20px;
13140 }
13141 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container.generating .generate-funnel-overlay {
13142 justify-content: center;
13143 backdrop-filter: blur(5px);
13144 }
13145 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container {
13146 /* HTML: <div class="loader"></div> */
13147 }
13148 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader {
13149 width: 50px;
13150 aspect-ratio: 1;
13151 display: grid;
13152 border-radius: 50%;
13153 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%;
13154 background-repeat: no-repeat;
13155 animation: l23 1s infinite steps(12);
13156 }
13157 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader::before,
13158 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader::after {
13159 content: "";
13160 grid-area: 1/1;
13161 border-radius: 50%;
13162 background: inherit;
13163 opacity: 0.915;
13164 transform: rotate(30deg);
13165 }
13166 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-generate-funnel-container .generate-loader::after {
13167 opacity: 0.83;
13168 transform: rotate(60deg);
13169 }
13170 @keyframes l23 {
13171 100% {
13172 transform: rotate(1turn);
13173 }
13174 }
13175 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay {
13176 position: fixed;
13177 top: 0;
13178 left: 0;
13179 width: 100%;
13180 height: 100%;
13181 background-color: rgba(0, 0, 0, 0.3);
13182 justify-content: center;
13183 align-items: center;
13184 display: flex;
13185 z-index: 999999;
13186 }
13187 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay .wpfnl-modal-wrapper {
13188 width: 80%;
13189 background: #FFF;
13190 padding: 25px;
13191 height: 80%;
13192 border-radius: 10px;
13193 position: relative;
13194 }
13195 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay .wpfnl-modal-close-btn {
13196 position: absolute;
13197 right: -14px;
13198 top: -14px;
13199 background: #ffffff;
13200 box-shadow: 0px 1px 1px #dadada;
13201 border-radius: 100px;
13202 width: 34px;
13203 height: 34px;
13204 display: flex;
13205 align-items: center;
13206 justify-content: center;
13207 cursor: pointer;
13208 z-index: 2;
13209 }
13210 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay #wpfnl-create-product {
13211 width: 100%;
13212 height: 100%;
13213 }
13214 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay #wpfnl-create-product iframe {
13215 height: 100%;
13216 }
13217 .wpfunnels-setup .wpfnl-mm-setup-wizard .wpfnl-modal-overlay .wpfnl-loader {
13218 border: 2px solid #8265c5;
13219 border-radius: 50%;
13220 border-top: 2px solid #fff;
13221 width: 50px;
13222 height: 50px;
13223 animation: spin 0.7s linear infinite;
13224 display: block;
13225 margin-left: 4px;
13226 position: absolute;
13227 left: 50%;
13228 top: 50%;
13229 transform: translate(-50%, -50%);
13230 z-index: 2;
13231 background: #fff;
13232 }
13233 @-webkit-keyframes spin {
13234 0% {
13235 -webkit-transform: rotate(0deg);
13236 }
13237 100% {
13238 -webkit-transform: rotate(360deg);
13239 }
13240 }
13241 @keyframes spin {
13242 0% {
13243 transform: rotate(0deg);
13244 }
13245 100% {
13246 transform: rotate(360deg);
13247 }
13248 }
13249 .wpfunnels-setup {
13250 /* ==========================================================================
13251 Setup wizard shell — top bar + centered body + progress footer.
13252
13253 Replaces the former left-sidebar chrome. Uses the existing WPFunnels
13254 brand tokens (#6E42D3 / DM Sans) so the wizard stays consistent with the
13255 rest of the admin.
13256 ========================================================================== */
13257 }
13258 .wpfunnels-setup .wpfnl-wz {
13259 font-family: "DM Sans", sans-serif;
13260 background: #F6F5FA;
13261 display: flex;
13262 flex-direction: column;
13263 height: 100%;
13264 min-height: 100vh;
13265 color: #363B4E;
13266 -webkit-font-smoothing: antialiased;
13267 }
13268 .wpfunnels-setup .wpfnl-wz *, .wpfunnels-setup .wpfnl-wz *::before, .wpfunnels-setup .wpfnl-wz *::after {
13269 box-sizing: border-box;
13270 }
13271 .wpfunnels-setup .wpfnl-wz {
13272 /* ---------- Top bar ---------- */
13273 }
13274 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-top {
13275 flex-shrink: 0;
13276 height: 60px;
13277 background: #FFFFFF;
13278 border-bottom: 1px solid #ECEBF0;
13279 padding: 0 28px;
13280 display: flex;
13281 align-items: center;
13282 justify-content: space-between;
13283 gap: 16px;
13284 }
13285 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-logo {
13286 display: flex;
13287 align-items: center;
13288 gap: 9px;
13289 flex: 1 0 0;
13290 }
13291 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-logo-mark {
13292 width: 26px;
13293 height: 26px;
13294 display: block;
13295 }
13296 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-logo-text {
13297 font-size: 15px;
13298 font-weight: 700;
13299 letter-spacing: -0.2px;
13300 color: #363B4E;
13301 }
13302 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-step-label {
13303 margin: 0;
13304 font-size: 12px;
13305 font-weight: 700;
13306 letter-spacing: 0.08em;
13307 text-transform: uppercase;
13308 white-space: nowrap;
13309 }
13310 .wpfunnels-setup .wpfnl-wz {
13311 /* Balances the logo column so the step counter stays centered — see the
13312 template comment. The visible chip lives on the button inside it. */
13313 }
13314 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit-slot {
13315 flex: 1 0 0;
13316 display: flex;
13317 justify-content: flex-end;
13318 }
13319 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit {
13320 display: inline-flex;
13321 align-items: center;
13322 gap: 8px;
13323 background: none;
13324 border: 0;
13325 padding: 8px 4px;
13326 cursor: pointer;
13327 font-family: inherit;
13328 font-weight: 700;
13329 white-space: nowrap;
13330 color: #363B4E;
13331 }
13332 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit svg {
13333 flex-shrink: 0;
13334 }
13335 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit:focus-visible {
13336 outline: 2px solid #6E42D3;
13337 outline-offset: 2px;
13338 border-radius: 4px;
13339 }
13340 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit-text {
13341 font-size: 12px;
13342 }
13343 .wpfunnels-setup .wpfnl-wz {
13344 /* ---------- Body ---------- */
13345 }
13346 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-body {
13347 flex: 1 1 auto;
13348 overflow-y: auto;
13349 display: flex;
13350 align-items: flex-start;
13351 justify-content: center;
13352 padding: 40px 24px 24px;
13353 }
13354 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-center {
13355 width: 100%;
13356 max-width: 960px;
13357 margin: auto;
13358 text-align: center;
13359 display: flex;
13360 flex-direction: column;
13361 align-items: center;
13362 }
13363 .wpfunnels-setup .wpfnl-wz {
13364 /* ---------- Welcome step ----------
13365 This step has no wizard footer — its own "Get started" button is the
13366 primary action — so it stretches to fill the body. The hero group takes
13367 the free space via auto margins, which centers it and leaves the consent
13368 opt-in resting on the bottom edge rather than floating under the CTA. */
13369 }
13370 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome {
13371 align-self: stretch;
13372 margin: 0;
13373 /* .wpfnl-wz-center caps at 960px; the one-line subtitle alone runs ~930px,
13374 which leaves almost no margin. The higher specificity here (two chained
13375 classes) reliably wins over that single-class rule regardless of source
13376 order, giving both lines real breathing room. */
13377 max-width: 1040px;
13378 }
13379 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome-main {
13380 margin: auto 0;
13381 display: flex;
13382 flex-direction: column;
13383 align-items: center;
13384 width: 100%;
13385 }
13386 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-consent {
13387 margin-top: 0;
13388 padding-top: 24px;
13389 /* Long enough that both new copy strings need the full center column
13390 width (960px) to have a shot at fitting on one line; narrower windows
13391 still wrap gracefully since neither has white-space: nowrap. */
13392 max-width: none;
13393 }
13394 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-sub {
13395 /* The new copy runs ~930px wide at 15px — needs the full center column
13396 (960px) to have a shot at one line, same reasoning as the consent text
13397 above it. */
13398 max-width: none;
13399 }
13400 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-h1 {
13401 font-size: 34px;
13402 }
13403 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-h1 {
13404 font-size: 26px;
13405 font-weight: 700;
13406 line-height: 1.3;
13407 letter-spacing: -0.4px;
13408 color: #363B4E;
13409 margin: 0 0 10px;
13410 padding: 0;
13411 }
13412 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-sub {
13413 font-size: 15px;
13414 line-height: 1.7;
13415 color: #7A8B9A;
13416 margin: 0 0 24px;
13417 max-width: 560px;
13418 }
13419 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-error {
13420 background: #FEF2F2;
13421 border: 1px solid #FECACA;
13422 color: #B91C1C;
13423 font-size: 14px;
13424 border-radius: 8px;
13425 padding: 10px 16px;
13426 margin: 0 0 20px;
13427 }
13428 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-empty {
13429 font-size: 14px;
13430 color: #6E7A85;
13431 max-width: 420px;
13432 line-height: 1.7;
13433 }
13434 .wpfunnels-setup .wpfnl-wz {
13435 /* ---------- Hero artwork ----------
13436 welcome-image.png is 1450x832 RGBA line art that carries its own soft
13437 purple wash out to the edges of the canvas. It is illustration, not a
13438 screenshot, so it gets no frame — a border/radius/shadow would box the
13439 artwork's own transparent bounds and read as a pasted-in thumbnail.
13440 It sits directly on the page and blends into it. */
13441 }
13442 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-art {
13443 width: 100%;
13444 max-width: 900px;
13445 margin: 4px 0 20px;
13446 border: 0;
13447 background: none;
13448 box-shadow: none;
13449 /* Capped by viewport height, not just width — this is the tallest single
13450 element on the welcome step, and the step has no footer to borrow space
13451 from, so on a short viewport it must be the thing that shrinks. 54vh
13452 only binds below ~950px of viewport height; taller screens fall back to
13453 the artwork's true size (900x516) via max-width instead. width: auto +
13454 both max- constraints keeps the aspect ratio intact either way. */
13455 }
13456 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-art img {
13457 display: block;
13458 width: auto;
13459 height: auto;
13460 max-width: 100%;
13461 max-height: 54vh;
13462 margin: 0 auto;
13463 }
13464 .wpfunnels-setup .wpfnl-wz {
13465 /* ---------- Buttons ---------- */
13466 }
13467 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn {
13468 display: inline-flex;
13469 align-items: center;
13470 justify-content: center;
13471 gap: 8px;
13472 font-family: "DM Sans", sans-serif;
13473 font-size: 14px;
13474 font-weight: 600;
13475 line-height: 1;
13476 padding: 12px 24px;
13477 border-radius: 8px;
13478 border: 1px solid transparent;
13479 cursor: pointer;
13480 transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
13481 min-width: 132px;
13482 text-decoration: none;
13483 }
13484 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn:focus-visible {
13485 outline: 2px solid #6E42D3;
13486 outline-offset: 2px;
13487 }
13488 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn:disabled {
13489 opacity: 0.5;
13490 cursor: not-allowed;
13491 }
13492 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn.is-hidden {
13493 visibility: hidden;
13494 pointer-events: none;
13495 }
13496 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--lg {
13497 padding: 14px 34px;
13498 font-size: 15px;
13499 border-radius: 9999px;
13500 }
13501 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--primary {
13502 background: #6E42D3;
13503 color: #fff;
13504 }
13505 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--primary:hover:not(:disabled) {
13506 background: #5B35B8;
13507 }
13508 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--ghost {
13509 background: transparent;
13510 border-color: #ECEBF0;
13511 color: #6E7A85;
13512 }
13513 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--ghost:hover:not(:disabled) {
13514 border-color: #6E42D3;
13515 color: #6E42D3;
13516 }
13517 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--danger {
13518 background: #EF4444;
13519 color: #fff;
13520 }
13521 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--danger:hover:not(:disabled) {
13522 background: #DC2626;
13523 }
13524 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--placeholder {
13525 visibility: hidden;
13526 pointer-events: none;
13527 }
13528 .wpfunnels-setup .wpfnl-wz {
13529 /* ---------- Spinner ---------- */
13530 }
13531 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-spinner {
13532 display: inline-block;
13533 width: 14px;
13534 height: 14px;
13535 border: 2px solid rgba(255, 255, 255, 0.4);
13536 border-top-color: #fff;
13537 border-radius: 50%;
13538 animation: wpfnl-wz-spin 0.7s linear infinite;
13539 }
13540 .wpfunnels-setup .wpfnl-wz {
13541 /* ---------- Footer ---------- */
13542 }
13543 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-footer {
13544 flex-shrink: 0;
13545 background: #FFFFFF;
13546 border-top: 1px solid #ECEBF0;
13547 padding: 16px 28px;
13548 display: flex;
13549 align-items: center;
13550 justify-content: space-between;
13551 gap: 16px;
13552 }
13553 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-footer-actions {
13554 display: flex;
13555 align-items: center;
13556 gap: 4px;
13557 }
13558 .wpfunnels-setup .wpfnl-wz {
13559 /* Quiet text action beside the primary button — deliberately low
13560 emphasis so it reads as an escape hatch, not an alternative path. */
13561 }
13562 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip {
13563 background: none;
13564 border: 0;
13565 padding: 12px 16px;
13566 cursor: pointer;
13567 font-family: inherit;
13568 font-size: 14px;
13569 font-weight: 600;
13570 color: #6E7A85;
13571 transition: color 0.2s ease;
13572 }
13573 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip:hover:not(:disabled) {
13574 color: #363B4E;
13575 }
13576 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip:focus-visible {
13577 outline: 2px solid #6E42D3;
13578 outline-offset: 2px;
13579 border-radius: 6px;
13580 }
13581 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skip:disabled {
13582 opacity: 0.5;
13583 cursor: not-allowed;
13584 }
13585 .wpfunnels-setup .wpfnl-wz {
13586 /* ---------- Template grid ---------- */
13587 }
13588 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-grid {
13589 display: grid;
13590 grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
13591 gap: 20px;
13592 width: 100%;
13593 text-align: left;
13594 }
13595 .wpfunnels-setup .wpfnl-wz {
13596 /* Held inert while the funnel builds — the grid stays on screen for
13597 context, but the selection must not change mid-flight. */
13598 }
13599 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-grid.is-busy {
13600 pointer-events: none;
13601 opacity: 0.6;
13602 transition: opacity 0.2s ease;
13603 }
13604 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card {
13605 background: #FFFFFF;
13606 border: 1.5px solid #ECEBF0;
13607 border-radius: 12px;
13608 padding: 12px;
13609 cursor: pointer;
13610 transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
13611 }
13612 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card:hover {
13613 border-color: #C4B5F4;
13614 transform: translateY(-2px);
13615 }
13616 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-active {
13617 border-color: #6E42D3;
13618 box-shadow: 0 4px 16px rgba(110, 66, 211, 0.12);
13619 }
13620 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card:focus-visible {
13621 outline: 2px solid #6E42D3;
13622 outline-offset: 2px;
13623 }
13624 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-skeleton {
13625 cursor: default;
13626 pointer-events: none;
13627 }
13628 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-thumb {
13629 position: relative;
13630 border-radius: 8px;
13631 overflow: hidden;
13632 background: #F6F5FA;
13633 aspect-ratio: 4/3;
13634 margin-bottom: 12px;
13635 }
13636 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-thumb img {
13637 width: 100%;
13638 height: 100%;
13639 object-fit: cover;
13640 object-position: top;
13641 display: block;
13642 }
13643 .wpfunnels-setup .wpfnl-wz {
13644 /* Sits inside the thumb, which is `overflow: hidden`, so the pill clips
13645 to the rounded corner rather than overhanging the card. */
13646 }
13647 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-badge {
13648 position: absolute;
13649 top: 0;
13650 left: 0;
13651 z-index: 1;
13652 display: inline-flex;
13653 align-items: center;
13654 gap: 5px;
13655 padding: 6px 12px;
13656 border-radius: 8px 0 8px 0;
13657 background: #6E42D3;
13658 color: #fff;
13659 font-size: 12px;
13660 font-weight: 700;
13661 line-height: 1;
13662 white-space: nowrap;
13663 }
13664 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-badge svg {
13665 flex-shrink: 0;
13666 }
13667 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-suggested {
13668 border-color: #C4B5F4;
13669 }
13670 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-preview {
13671 position: absolute;
13672 bottom: 10px;
13673 left: 50%;
13674 transform: translateX(-50%) translateY(6px);
13675 opacity: 0;
13676 background: rgba(54, 59, 78, 0.92);
13677 color: #fff;
13678 border: 0;
13679 border-radius: 9999px;
13680 padding: 7px 18px;
13681 font-family: inherit;
13682 font-size: 12.5px;
13683 font-weight: 600;
13684 cursor: pointer;
13685 transition: opacity 0.2s ease, transform 0.2s ease;
13686 }
13687 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card:hover .wpfnl-wz-template-preview,
13688 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-preview:focus-visible {
13689 opacity: 1;
13690 transform: translateX(-50%) translateY(0);
13691 }
13692 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-title {
13693 font-size: 14.5px;
13694 font-weight: 600;
13695 color: #363B4E;
13696 margin: 0 0 4px;
13697 }
13698 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-meta {
13699 font-size: 12.5px;
13700 color: #6E7A85;
13701 margin: 0;
13702 }
13703 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skeleton-line {
13704 height: 12px;
13705 border-radius: 4px;
13706 background: linear-gradient(90deg, #EFEEF3 25%, #F7F6FA 50%, #EFEEF3 75%);
13707 background-size: 200% 100%;
13708 animation: wpfnl-wz-shimmer 1.4s ease infinite;
13709 margin-bottom: 8px;
13710 }
13711 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-skeleton-line.is-short {
13712 width: 45%;
13713 }
13714 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-template-card.is-skeleton .wpfnl-wz-template-thumb {
13715 background: linear-gradient(90deg, #EFEEF3 25%, #F7F6FA 50%, #EFEEF3 75%);
13716 background-size: 200% 100%;
13717 animation: wpfnl-wz-shimmer 1.4s ease infinite;
13718 }
13719 .wpfunnels-setup .wpfnl-wz {
13720 /* ---------- Template preview modal ----------
13721 PreviewTemplate.vue's own component — its styling never changed, only
13722 moved here. Previously scoped under `.wpfnl-mm-setup-wizard-content`,
13723 a wrapper the sidebar-based wizard used that no longer exists in the
13724 DOM, so none of it was reaching the modal. */
13725 }
13726 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay {
13727 position: fixed;
13728 top: 0;
13729 left: 0;
13730 right: 0;
13731 bottom: 0;
13732 background: rgba(0, 0, 0, 0.6);
13733 display: flex;
13734 align-items: center;
13735 justify-content: center;
13736 z-index: 99999;
13737 padding: 40px;
13738 backdrop-filter: blur(4px);
13739 }
13740 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal {
13741 background: #FFF;
13742 border-radius: 16px;
13743 width: 100%;
13744 max-width: 1399px;
13745 height: 90vh;
13746 display: flex;
13747 flex-direction: column;
13748 box-shadow: 0px 20px 60px rgba(0, 0, 0, 0.3);
13749 overflow: hidden;
13750 }
13751 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header {
13752 padding: 24px 32px;
13753 border-bottom: 1px solid #EAE9EE;
13754 display: flex;
13755 align-items: center;
13756 justify-content: space-between;
13757 flex-shrink: 0;
13758 }
13759 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-title {
13760 font-size: 20px;
13761 font-weight: 700;
13762 font-family: "DM Sans", sans-serif;
13763 color: #363B4E;
13764 margin: 0;
13765 line-height: 24px;
13766 }
13767 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-device-switcher {
13768 display: flex;
13769 gap: 4px;
13770 background: #F6F5FA;
13771 border-radius: 8px;
13772 padding: 4px;
13773 }
13774 .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 {
13775 width: 36px;
13776 height: 36px;
13777 border: none;
13778 background: transparent;
13779 border-radius: 6px;
13780 cursor: pointer;
13781 display: flex;
13782 align-items: center;
13783 justify-content: center;
13784 transition: all 0.2s ease;
13785 color: #7A8C9A;
13786 }
13787 .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 {
13788 width: 16px;
13789 height: 16px;
13790 }
13791 .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 {
13792 background: rgba(110, 66, 211, 0.1);
13793 color: #6E42D3;
13794 }
13795 .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 {
13796 background: #FFF;
13797 color: #6E42D3;
13798 box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.08);
13799 }
13800 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-header .wpfnl-mm-preview-modal-actions {
13801 display: flex;
13802 align-items: center;
13803 gap: 16px;
13804 }
13805 .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 {
13806 padding: 12px 24px;
13807 border-radius: 8px;
13808 font-size: 14px;
13809 font-weight: 600;
13810 background: #6E42D3;
13811 color: #FFF;
13812 border: none;
13813 cursor: pointer;
13814 display: inline-flex;
13815 align-items: center;
13816 gap: 8px;
13817 transition: all 0.2s ease;
13818 }
13819 .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 {
13820 width: 16px;
13821 height: 12px;
13822 }
13823 .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 {
13824 background: #5c36b3;
13825 transform: translateY(-1px);
13826 box-shadow: 0px 4px 12px rgba(110, 66, 211, 0.3);
13827 }
13828 .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 {
13829 width: 32px;
13830 height: 32px;
13831 background: transparent;
13832 border-radius: 6px;
13833 cursor: pointer;
13834 display: flex;
13835 align-items: center;
13836 justify-content: center;
13837 transition: all 0.2s ease;
13838 color: #7A8C9A;
13839 border: 1px solid #7A8B9A;
13840 }
13841 .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 {
13842 background: #F6F5FA;
13843 color: #363B4E;
13844 }
13845 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body {
13846 flex: 1;
13847 display: flex;
13848 overflow: hidden;
13849 flex-direction: column;
13850 }
13851 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-steps {
13852 width: 180px;
13853 border-right: 1px solid #EAE9EE;
13854 padding: 20px;
13855 display: flex;
13856 gap: 12px;
13857 overflow-y: auto;
13858 flex-shrink: 0;
13859 width: 100%;
13860 align-items: center;
13861 justify-content: center;
13862 }
13863 .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 {
13864 cursor: pointer;
13865 }
13866 .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 {
13867 border-color: #6E42D3;
13868 }
13869 .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 {
13870 aspect-ratio: 16/10;
13871 background: #F6F5FA;
13872 border-radius: 8px;
13873 border: 2px solid transparent;
13874 overflow: hidden;
13875 transition: all 0.2s ease;
13876 width: 78px;
13877 height: 78px;
13878 padding: 3px;
13879 }
13880 .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 {
13881 width: 100%;
13882 height: 100%;
13883 object-fit: cover;
13884 }
13885 .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 {
13886 border-color: #E5E7EB;
13887 }
13888 .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 {
13889 padding: 8px;
13890 font-size: 12px;
13891 font-weight: 500;
13892 font-family: "DM Sans", sans-serif;
13893 color: #363B4E;
13894 text-align: center;
13895 margin: 0;
13896 background: #FFF;
13897 text-transform: capitalize;
13898 }
13899 .wpfunnels-setup .wpfnl-wz .wpfnl-mm-preview-modal-overlay .wpfnl-mm-preview-modal .wpfnl-mm-preview-modal-body .wpfnl-mm-preview-content {
13900 flex: 1;
13901 display: flex;
13902 align-items: center;
13903 justify-content: center;
13904 padding: 30px;
13905 background: #F6F5FA;
13906 overflow: auto;
13907 }
13908 .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 {
13909 width: 100%;
13910 height: 100%;
13911 background: #FFF;
13912 border-radius: 12px;
13913 overflow: hidden;
13914 box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
13915 transition: all 0.3s ease;
13916 }
13917 .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 {
13918 overflow-x: hidden;
13919 }
13920 .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 {
13921 width: 100%;
13922 height: 100%;
13923 position: relative;
13924 overflow: auto;
13925 }
13926 .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 {
13927 min-height: 650px;
13928 display: flex;
13929 align-items: center;
13930 justify-content: center;
13931 }
13932 .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 {
13933 width: 100%;
13934 height: 100%;
13935 border: none;
13936 }
13937 .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 {
13938 position: absolute;
13939 top: 0;
13940 left: 0;
13941 right: 0;
13942 bottom: 0;
13943 display: flex;
13944 align-items: center;
13945 justify-content: center;
13946 background: rgba(255, 255, 255, 0.9);
13947 z-index: 10;
13948 }
13949 .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 {
13950 border: 3px solid #E5E7EB;
13951 border-top-color: #6E42D3;
13952 border-radius: 50%;
13953 width: 40px;
13954 height: 40px;
13955 animation: spin 1s linear infinite;
13956 }
13957 .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 {
13958 max-width: 768px;
13959 margin: 0 auto;
13960 }
13961 .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 {
13962 max-width: 375px;
13963 margin: 0 auto;
13964 }
13965 .wpfunnels-setup .wpfnl-wz {
13966 /* ---------- Consent ---------- */
13967 }
13968 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent {
13969 display: inline-flex;
13970 align-items: flex-start;
13971 gap: 10px;
13972 margin-top: 20px;
13973 max-width: 440px;
13974 text-align: left;
13975 cursor: pointer;
13976 }
13977 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input {
13978 position: absolute;
13979 opacity: 0;
13980 width: 0;
13981 height: 0;
13982 }
13983 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-box {
13984 flex-shrink: 0;
13985 width: 17px;
13986 height: 17px;
13987 margin-top: 1px;
13988 border: 1.5px solid #C9CDD6;
13989 border-radius: 4px;
13990 background: #FFFFFF;
13991 position: relative;
13992 transition: background 0.2s ease, border-color 0.2s ease;
13993 }
13994 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-box::after {
13995 content: "";
13996 position: absolute;
13997 left: 5px;
13998 top: 1.5px;
13999 width: 4px;
14000 height: 8px;
14001 border: solid #fff;
14002 border-width: 0 2px 2px 0;
14003 transform: rotate(45deg) scale(0);
14004 transition: transform 0.15s ease;
14005 }
14006 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input:checked + .wpfnl-wz-consent-box {
14007 background: #6E42D3;
14008 border-color: #6E42D3;
14009 }
14010 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input:checked + .wpfnl-wz-consent-box::after {
14011 transform: rotate(45deg) scale(1);
14012 }
14013 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent input:focus-visible + .wpfnl-wz-consent-box {
14014 outline: 2px solid #6E42D3;
14015 outline-offset: 2px;
14016 }
14017 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-text {
14018 font-size: 13px;
14019 line-height: 1.6;
14020 color: #6E7A85;
14021 }
14022 .wpfunnels-setup .wpfnl-wz {
14023 /* Sits inside the <label>, so the click is stopped in the template to keep
14024 opening the policy from toggling the consent box. */
14025 }
14026 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-link {
14027 color: #6E42D3;
14028 font-weight: 600;
14029 text-decoration: underline;
14030 text-underline-offset: 2px;
14031 white-space: nowrap;
14032 }
14033 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-link:hover, .wpfunnels-setup .wpfnl-wz .wpfnl-wz-consent-link:focus-visible {
14034 color: #5B35B8;
14035 }
14036 .wpfunnels-setup .wpfnl-wz {
14037 /* ---------- Completion screen ----------
14038 Ported from Mail Mint's SuccessStep onto WPFunnels' tokens. Covers the
14039 whole shell rather than sitting in the step body: this screen is
14040 terminal, so the top bar's step counter and exit affordance would only
14041 invite the user back into a flow that has already finished. */
14042 }
14043 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success {
14044 position: fixed;
14045 inset: 0;
14046 z-index: 9999;
14047 background: #FFFFFF;
14048 display: flex;
14049 flex-direction: column;
14050 align-items: center;
14051 justify-content: center;
14052 overflow-y: auto;
14053 overflow-x: hidden;
14054 scrollbar-width: none;
14055 -ms-overflow-style: none;
14056 }
14057 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success::-webkit-scrollbar {
14058 display: none;
14059 }
14060 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__confetti {
14061 position: fixed;
14062 inset: 0;
14063 pointer-events: none;
14064 z-index: 0;
14065 }
14066 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__body {
14067 position: relative;
14068 z-index: 1;
14069 display: flex;
14070 flex-direction: column;
14071 align-items: center;
14072 text-align: center;
14073 padding: 40px 40px 40px;
14074 width: 100%;
14075 max-width: 980px;
14076 box-sizing: border-box;
14077 }
14078 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__emoji {
14079 font-size: 54px;
14080 line-height: 1;
14081 margin-bottom: 18px;
14082 user-select: none;
14083 }
14084 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__heading {
14085 font-size: 42px;
14086 font-weight: 700;
14087 color: #363B4E;
14088 letter-spacing: -1px;
14089 margin: 0 0 14px;
14090 line-height: 1.15;
14091 }
14092 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__sub {
14093 font-size: 15px;
14094 color: #6E7A85;
14095 margin: 0 0 34px;
14096 line-height: 1.65;
14097 max-width: 560px;
14098 }
14099 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__actions {
14100 display: flex;
14101 gap: 14px;
14102 flex-wrap: wrap;
14103 justify-content: center;
14104 margin: 0 0 48px;
14105 }
14106 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources {
14107 background: #F4F5F7;
14108 border-radius: 18px;
14109 padding: 22px 24px 20px;
14110 width: 100%;
14111 box-sizing: border-box;
14112 }
14113 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-title {
14114 font-size: 14px;
14115 font-weight: 600;
14116 color: #6E7A85;
14117 margin: 0 0 16px;
14118 }
14119 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-grid {
14120 display: grid;
14121 grid-template-columns: repeat(4, 1fr);
14122 gap: 12px;
14123 margin-bottom: 18px;
14124 }
14125 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-card {
14126 display: flex;
14127 flex-direction: row;
14128 align-items: center;
14129 gap: 12px;
14130 background: #FFFFFF;
14131 border: 1px solid #ECEBF0;
14132 border-radius: 12px;
14133 padding: 16px 18px;
14134 text-decoration: none !important;
14135 color: #363B4E !important;
14136 transition: border-color 0.2s ease, box-shadow 0.2s ease;
14137 }
14138 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-card:hover {
14139 border-color: rgba(110, 66, 211, 0.35);
14140 box-shadow: 0 2px 10px rgba(110, 66, 211, 0.08);
14141 text-decoration: none !important;
14142 color: #363B4E !important;
14143 }
14144 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-card:focus-visible {
14145 outline: none;
14146 box-shadow: 0 0 0 3px rgba(110, 66, 211, 0.25);
14147 }
14148 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-icon {
14149 flex-shrink: 0;
14150 display: flex;
14151 align-items: center;
14152 }
14153 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resource-label {
14154 font-size: 13px;
14155 font-weight: 600;
14156 color: #363B4E;
14157 text-align: left;
14158 line-height: 1.35;
14159 }
14160 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-footer {
14161 text-align: center;
14162 }
14163 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-footer p {
14164 font-size: 12px;
14165 color: #6E7A85;
14166 margin: 0 0 4px;
14167 }
14168 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-footer p:last-child {
14169 margin-bottom: 0;
14170 }
14171 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__pro-link {
14172 color: #6E42D3 !important;
14173 font-weight: 600;
14174 text-decoration: underline !important;
14175 text-underline-offset: 2px;
14176 }
14177 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__pro-link:hover {
14178 color: #5B35B8 !important;
14179 }
14180 @media (max-width: 782px) {
14181 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__body {
14182 padding: 32px 20px 40px;
14183 }
14184 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__heading {
14185 font-size: 32px;
14186 letter-spacing: -0.6px;
14187 }
14188 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-success__resources-grid {
14189 grid-template-columns: repeat(2, 1fr);
14190 }
14191 }
14192 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn--pill {
14193 border-radius: 9999px;
14194 }
14195 .wpfunnels-setup .wpfnl-wz {
14196 /* ---------- Exit modal ---------- */
14197 }
14198 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-overlay {
14199 position: fixed;
14200 inset: 0;
14201 background: rgba(0, 0, 0, 0.5);
14202 display: flex;
14203 align-items: center;
14204 justify-content: center;
14205 z-index: 10000;
14206 animation: wpfnl-wz-fade 0.2s ease;
14207 }
14208 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal {
14209 background: #FFFFFF;
14210 border-radius: 16px;
14211 padding: 32px;
14212 max-width: 440px;
14213 width: 90%;
14214 box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
14215 animation: wpfnl-wz-rise 0.3s ease;
14216 }
14217 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-head {
14218 display: flex;
14219 flex-direction: column;
14220 align-items: center;
14221 text-align: center;
14222 margin-bottom: 24px;
14223 }
14224 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-head svg {
14225 margin-bottom: 16px;
14226 }
14227 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-title {
14228 font-size: 20px;
14229 font-weight: 700;
14230 color: #363B4E;
14231 margin: 0 0 12px;
14232 letter-spacing: -0.3px;
14233 }
14234 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-text {
14235 font-size: 14px;
14236 line-height: 1.6;
14237 color: #6E7A85;
14238 margin: 0;
14239 }
14240 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-modal-actions {
14241 display: flex;
14242 gap: 12px;
14243 justify-content: center;
14244 }
14245 .wpfunnels-setup .wpfnl-wz {
14246 /* ---------- Required-installation step ----------
14247 Re-parented from the old sidebar DOM chain; the card markup inside
14248 Setup.vue is unchanged, so these rules carry over as-is. */
14249 }
14250 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install {
14251 width: 100%;
14252 max-width: 940px;
14253 display: flex;
14254 flex-direction: column;
14255 gap: 0;
14256 position: relative;
14257 }
14258 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-mm-setup-header {
14259 text-align: center;
14260 margin-bottom: 24px;
14261 }
14262 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-mm-setup-header .wpfnl-mm-setup-title {
14263 font-size: 24px;
14264 font-weight: 700;
14265 color: #363B4E;
14266 line-height: 1.3;
14267 letter-spacing: -0.5px;
14268 margin: 0 0 8px 0;
14269 }
14270 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-mm-setup-header .wpfnl-mm-setup-subtitle {
14271 font-size: 15px;
14272 font-weight: 400;
14273 color: #6E7A85;
14274 line-height: 1.5;
14275 margin: 0;
14276 }
14277 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-card {
14278 background: #FFF;
14279 border-radius: 20px;
14280 box-shadow: 0 20px 25px -5px rgba(143, 130, 196, 0.05), 0 8px 10px -6px rgba(143, 130, 196, 0.08);
14281 margin-bottom: 24px;
14282 overflow: hidden;
14283 }
14284 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-divider {
14285 width: 100%;
14286 height: 1px;
14287 background: #F1EFF7;
14288 }
14289 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section {
14290 padding: 32px 40px 28px;
14291 }
14292 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-label {
14293 font-size: 14px;
14294 font-weight: 500;
14295 color: #7A8C9A;
14296 margin: 0 0 16px 0;
14297 text-align: center;
14298 }
14299 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options {
14300 display: flex;
14301 gap: 10px;
14302 justify-content: center;
14303 flex-wrap: wrap;
14304 }
14305 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn {
14306 display: flex;
14307 flex-direction: column;
14308 align-items: center;
14309 gap: 8px;
14310 padding: 16px 14px 12px;
14311 border-radius: 10px;
14312 border: 1px solid #ECEBF0;
14313 background: #FFF;
14314 cursor: pointer;
14315 transition: border-color 0.15s ease;
14316 min-width: 90px;
14317 position: relative;
14318 font-family: "DM Sans", sans-serif;
14319 }
14320 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn img {
14321 width: 32px;
14322 height: 32px;
14323 object-fit: contain;
14324 }
14325 .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) {
14326 font-size: 13px;
14327 font-weight: 400;
14328 color: #7A8C9A;
14329 line-height: 1;
14330 }
14331 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn:hover:not(:disabled) {
14332 border-color: #C4B5F4;
14333 }
14334 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn.active {
14335 border-color: #6E42D3;
14336 background: #FAFAFE;
14337 }
14338 .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) {
14339 color: #6E42D3;
14340 font-weight: 500;
14341 }
14342 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn.disabled {
14343 opacity: 0.4;
14344 cursor: not-allowed;
14345 }
14346 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-builder-section .wpfnl-ri-builder-options .wpfnl-ri-builder-btn .wpfnl-ri-not-installed {
14347 position: absolute;
14348 top: 4px;
14349 right: 4px;
14350 background: #f68524;
14351 color: #fff;
14352 font-size: 8px;
14353 font-weight: 600;
14354 padding: 2px 5px;
14355 border-radius: 4px;
14356 white-space: nowrap;
14357 line-height: 1.4;
14358 }
14359 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section {
14360 padding: 28px 40px 32px;
14361 }
14362 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards {
14363 display: flex;
14364 flex-direction: column;
14365 gap: 8px;
14366 text-align: left;
14367 }
14368 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card {
14369 display: flex;
14370 align-items: center;
14371 gap: 14px;
14372 padding: 12px 16px;
14373 border-radius: 10px;
14374 border: 1px solid #ECEBF0;
14375 background: #FFF;
14376 }
14377 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--active {
14378 border-color: #D1FAE5;
14379 background: #F0FDF4;
14380 }
14381 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--installed {
14382 border-color: #FDE68A;
14383 background: #FFFBEB;
14384 }
14385 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--optional {
14386 cursor: pointer;
14387 user-select: none;
14388 transition: border-color 0.15s ease;
14389 }
14390 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--optional:hover {
14391 border-color: #C4B5F4;
14392 }
14393 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--optional:focus-visible {
14394 outline: 2px solid #6E42D3;
14395 outline-offset: 2px;
14396 }
14397 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--unchecked {
14398 border-color: #ECEBF0;
14399 background: #FAFAFA;
14400 opacity: 0.5;
14401 }
14402 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card--unchecked:hover {
14403 border-color: #ECEBF0;
14404 opacity: 0.65;
14405 }
14406 .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 {
14407 filter: grayscale(1) opacity(0.4);
14408 }
14409 .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 {
14410 display: none;
14411 }
14412 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-icon {
14413 width: 38px;
14414 height: 38px;
14415 flex-shrink: 0;
14416 border-radius: 8px;
14417 background: #F6F5FA;
14418 display: flex;
14419 align-items: center;
14420 justify-content: center;
14421 overflow: hidden;
14422 }
14423 .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 {
14424 width: 26px;
14425 height: 26px;
14426 object-fit: contain;
14427 }
14428 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-body {
14429 flex: 1;
14430 min-width: 0;
14431 }
14432 .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 {
14433 display: flex;
14434 align-items: center;
14435 gap: 7px;
14436 margin-bottom: 3px;
14437 }
14438 .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 {
14439 font-size: 14px;
14440 font-weight: 600;
14441 color: #363B4E;
14442 line-height: 1.3;
14443 }
14444 .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 {
14445 font-size: 10px;
14446 font-weight: 600;
14447 color: #6E42D3;
14448 background: #EDE5FF;
14449 padding: 2px 7px;
14450 border-radius: 100px;
14451 line-height: 1.5;
14452 white-space: nowrap;
14453 }
14454 .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 {
14455 font-size: 10px;
14456 font-weight: 600;
14457 color: #6B7280;
14458 background: #F3F4F6;
14459 padding: 2px 7px;
14460 border-radius: 100px;
14461 line-height: 1.5;
14462 white-space: nowrap;
14463 }
14464 .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 {
14465 font-size: 12px;
14466 font-weight: 400;
14467 color: #7A8C9A;
14468 line-height: 1.5;
14469 margin: 0;
14470 }
14471 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-status {
14472 flex-shrink: 0;
14473 }
14474 .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 {
14475 display: inline-flex;
14476 align-items: center;
14477 gap: 4px;
14478 font-size: 11px;
14479 font-weight: 600;
14480 padding: 4px 10px;
14481 border-radius: 100px;
14482 white-space: nowrap;
14483 }
14484 .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 {
14485 background: #D1FAE5;
14486 color: #059669;
14487 }
14488 .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 {
14489 background: #FEF3C7;
14490 color: #D97706;
14491 }
14492 .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 {
14493 background: #F3F4F6;
14494 color: #6B7280;
14495 }
14496 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-plugins-section .wpfnl-ri-plugin-cards .wpfnl-ri-plugin-card .wpfnl-ri-plugin-card-toggle {
14497 flex-shrink: 0;
14498 padding-left: 8px;
14499 }
14500 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-install .wpfnl-ri-footer {
14501 display: none;
14502 }
14503 .wpfunnels-setup .wpfnl-wz {
14504 /* ---------- Responsive ---------- */
14505 }
14506 @media (max-width: 782px) {
14507 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-top {
14508 padding: 0 16px;
14509 }
14510 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-step-label {
14511 display: none;
14512 }
14513 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-exit-text {
14514 display: none;
14515 }
14516 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-body {
14517 padding: 24px 16px;
14518 }
14519 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-h1 {
14520 font-size: 22px;
14521 }
14522 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-welcome .wpfnl-wz-h1 {
14523 font-size: 26px;
14524 }
14525 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-art {
14526 margin-bottom: 16px;
14527 }
14528 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-footer {
14529 padding: 12px 16px;
14530 }
14531 .wpfunnels-setup .wpfnl-wz .wpfnl-wz-btn {
14532 min-width: 0;
14533 padding: 11px 18px;
14534 }
14535 }
14536 @keyframes wpfnl-wz-spin {
14537 to {
14538 transform: rotate(360deg);
14539 }
14540 }
14541 @keyframes wpfnl-wz-fade {
14542 from {
14543 opacity: 0;
14544 }
14545 to {
14546 opacity: 1;
14547 }
14548 }
14549 @keyframes wpfnl-wz-rise {
14550 from {
14551 transform: translateY(20px);
14552 opacity: 0;
14553 }
14554 to {
14555 transform: translateY(0);
14556 opacity: 1;
14557 }
14558 }
14559 @keyframes wpfnl-wz-shimmer {
14560 from {
14561 background-position: 200% 0;
14562 }
14563 to {
14564 background-position: -200% 0;
14565 }
14566 }
14567
14568 #wpfunnels-app {
14569 margin: 0 0 0 -20px;
14570 min-height: calc(100vh - 32px);
14571 }
14572
14573 .wp-funnels_page_edit_funnel #wpbody-content,
14574 .wpfunnels_page_edit_funnel #wpbody-content {
14575 padding-bottom: 0;
14576 }
14577
14578 .wp-funnels_page_edit_funnel #wpfooter,
14579 .wpfunnels_page_edit_funnel #wpfooter {
14580 display: none;
14581 }
14582
14583 .wpfnl-admin-notices-wrapper {
14584 background: #fff;
14585 padding: 15px 14px;
14586 border-bottom: 1px solid #E5E8F3;
14587 }
14588 .wpfnl-admin-notices-wrapper .single-notice {
14589 background: #eee;
14590 padding: 12px 14px;
14591 margin-bottom: 10px;
14592 border-left: 3px solid #ddd;
14593 }
14594 .wpfnl-admin-notices-wrapper .single-notice:last-child {
14595 margin-bottom: 0;
14596 }
14597 .wpfnl-admin-notices-wrapper .single-notice.notice-warning {
14598 color: #473D3D;
14599 background-color: #FFF9EB;
14600 border-left-color: #FFB802;
14601 }
14602 .wpfnl-admin-notices-wrapper .single-notice.notice-error {
14603 color: #473D3D;
14604 background-color: #FFF3F3;
14605 border-left-color: #DB0D0D;
14606 }
14607
14608 .wpfnl-drawflow-window.wpfnl-tour-active {
14609 pointer-events: none;
14610 }
14611 .wpfnl-drawflow-window svg path {
14612 transition: none;
14613 }
14614 .wpfnl-drawflow-window .not-clickable-overlay.downflow {
14615 background: rgba(255, 255, 255, 0);
14616 display: block;
14617 backdrop-filter: blur(0);
14618 }
14619 .wpfnl-drawflow-window .wpfn-drawflow-alert-wrapper {
14620 position: absolute;
14621 right: 50%;
14622 transform: translateX(50%);
14623 top: 80px;
14624 z-index: -1;
14625 }
14626 .wpfnl-drawflow-window .wpfnl-drawing-wrapper {
14627 position: relative;
14628 flex: 1;
14629 min-height: 0;
14630 display: flex;
14631 flex-direction: column;
14632 transition: all 0.3s ease;
14633 }
14634 .wpfnl-drawflow-window .wpfnl-drawing-wrapper[data-tour=yes] {
14635 position: relative;
14636 background-color: #E5E5E5;
14637 z-index: 4;
14638 top: 100px;
14639 }
14640 .wpfnl-drawflow-window .wpfnl-drawing-wrapper[data-tour=yes] .wpfnl-drawing-window {
14641 height: 100vh;
14642 }
14643 .wpfnl-drawflow-window .save-name-loader {
14644 position: absolute;
14645 left: 0;
14646 top: 0;
14647 width: 100%;
14648 height: 100%;
14649 z-index: 9;
14650 display: flex;
14651 flex-flow: column;
14652 align-items: center;
14653 justify-content: center;
14654 background: rgb(246, 245, 250);
14655 }
14656 .wpfnl-drawflow-window .save-name-loader .wpfnl-loader {
14657 display: block;
14658 width: 50px;
14659 height: 50px;
14660 }
14661 .wpfnl-drawflow-window .wpfn-drawflow-alert {
14662 display: flex;
14663 align-items: center;
14664 flex-flow: row;
14665 justify-content: flex-start;
14666 background-color: #fff;
14667 width: 270px;
14668 height: 40px;
14669 padding: 10px 15px;
14670 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
14671 border-radius: 0px 6px 6px 0px;
14672 border-left: 2px solid #00D057;
14673 transform: translateY(-30px);
14674 transition: all 0.5s ease;
14675 opacity: 0;
14676 visibility: hidden;
14677 }
14678 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-icon {
14679 margin-right: 14px;
14680 }
14681 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-icon svg {
14682 display: block;
14683 }
14684 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-icon .error-icon {
14685 display: none;
14686 }
14687 .wpfnl-drawflow-window .wpfn-drawflow-alert .alert-text {
14688 font-weight: 500;
14689 font-size: 14px;
14690 line-height: 16px;
14691 color: #363B4E;
14692 }
14693 .wpfnl-drawflow-window .wpfn-drawflow-alert .close-alert {
14694 display: block;
14695 padding: 3px 0 3px 10px;
14696 margin-left: auto;
14697 cursor: pointer;
14698 }
14699 .wpfnl-drawflow-window .wpfn-drawflow-alert.drawflow-error {
14700 border-left-color: #EE5F5A;
14701 }
14702 .wpfnl-drawflow-window .wpfn-drawflow-alert.drawflow-error .error-icon {
14703 display: block;
14704 }
14705 .wpfnl-drawflow-window .wpfn-drawflow-alert.drawflow-error .success-icon {
14706 display: none;
14707 }
14708 .wpfnl-drawflow-window .wpfn-drawflow-alert-wrapper.show {
14709 z-index: 9;
14710 }
14711 .wpfnl-drawflow-window .wpfn-drawflow-alert-wrapper.show .wpfn-drawflow-alert {
14712 transform: translateY(0);
14713 opacity: 1;
14714 visibility: visible;
14715 }
14716 .wpfnl-drawflow-window .step-importer-wrapper {
14717 position: absolute;
14718 top: 0;
14719 left: 0;
14720 width: 100%;
14721 height: 100%;
14722 max-height: 100%;
14723 z-index: 4;
14724 background: rgb(246, 245, 250);
14725 }
14726 .wpfnl-drawflow-window .step-importer-wrapper.wpfnl-ab-steps-modal {
14727 z-index: 101;
14728 }
14729 .wpfnl-drawflow-window .step-importer-wrapper.wpfnl-ab-steps-modal .wpfnl-step__templates-wrapper-before,
14730 .wpfnl-drawflow-window .step-importer-wrapper .wpfnl-ab-steps .wpfnl-step__templates-wrapper-before {
14731 width: 100%;
14732 }
14733 .wpfnl-drawflow-window .wpfnl-drawing-window-loader {
14734 background: rgb(246, 245, 250);
14735 position: absolute;
14736 top: 0;
14737 right: 0;
14738 width: 100%;
14739 height: 100%;
14740 z-index: 99;
14741 opacity: 1;
14742 visibility: visible;
14743 display: flex;
14744 align-items: center;
14745 justify-content: center;
14746 gap: 24px;
14747 padding: 40px;
14748 }
14749 .wpfnl-drawflow-window .wpfnl-drawing-window-loader .wpfnl-canvas-shimmer-node {
14750 flex-shrink: 0;
14751 width: 160px;
14752 height: 80px;
14753 border-radius: 12px;
14754 animation: shimmer-animation 1.6s infinite linear;
14755 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
14756 background-size: 1000px 100%;
14757 }
14758 .wpfnl-drawflow-window .wpfnl-drawing-window-loader .wpfnl-canvas-shimmer-node + .wpfnl-canvas-shimmer-node {
14759 position: relative;
14760 }
14761 .wpfnl-drawflow-window .wpfnl-drawing-window-loader .wpfnl-canvas-shimmer-node + .wpfnl-canvas-shimmer-node::before {
14762 content: "";
14763 position: absolute;
14764 left: -24px;
14765 top: 50%;
14766 transform: translateY(-50%);
14767 width: 24px;
14768 height: 2px;
14769 background: #d0d0d0;
14770 }
14771 .wpfnl-drawflow-window .wpfnl-drawing-window-loader.drawing-window-loaded {
14772 opacity: 0;
14773 visibility: hidden;
14774 }
14775
14776 .ab-testing-drawer .add-step-wrapper, .wpfnl-drawing-window .addstep .add-step-wrapper {
14777 position: relative;
14778 border: 1px dashed #7A8B9A;
14779 border-radius: 14px;
14780 width: 180px;
14781 height: 251px;
14782 display: flex;
14783 flex-flow: column;
14784 align-items: center;
14785 justify-content: center;
14786 padding: 20px;
14787 background: #f6f5fa;
14788 }
14789 .ab-testing-drawer .add-step-wrapper svg, .wpfnl-drawing-window .addstep .add-step-wrapper svg {
14790 position: relative;
14791 }
14792 .ab-testing-drawer .add-step-wrapper .icon, .wpfnl-drawing-window .addstep .add-step-wrapper .icon {
14793 background: #6E42D3;
14794 box-shadow: 0px 8px 16px rgba(193, 183, 232, 0.5);
14795 border-radius: 100px;
14796 width: 70px;
14797 height: 70px;
14798 display: flex;
14799 align-items: center;
14800 justify-content: center;
14801 cursor: pointer;
14802 }
14803 .ab-testing-drawer .add-step-wrapper .icon svg, .wpfnl-drawing-window .addstep .add-step-wrapper .icon svg {
14804 width: 19px;
14805 height: 19px;
14806 }
14807 .ab-testing-drawer .add-step-wrapper .icon svg path, .wpfnl-drawing-window .addstep .add-step-wrapper .icon svg path {
14808 stroke: #fff;
14809 }
14810 .ab-testing-drawer .add-step-wrapper h6, .wpfnl-drawing-window .addstep .add-step-wrapper h6 {
14811 font-weight: 500;
14812 font-size: 16px;
14813 line-height: 1;
14814 color: #363B4E;
14815 margin-top: 23px;
14816 }
14817 .ab-testing-drawer .add-step-wrapper p, .wpfnl-drawing-window .addstep .add-step-wrapper p {
14818 font-size: 12px;
14819 line-height: 17px;
14820 text-align: center;
14821 color: #363B4E;
14822 width: 104px;
14823 margin-top: 8px;
14824 }
14825 .ab-testing-drawer .add-step-wrapper .add-steps-options, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options {
14826 position: absolute;
14827 left: calc(100% + 15px);
14828 top: 50%;
14829 background: #FFFFFF;
14830 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
14831 border-radius: 10px;
14832 width: 100px;
14833 z-index: 2;
14834 transform: translateY(-50%);
14835 display: flex;
14836 flex-flow: column;
14837 display: none;
14838 }
14839 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option, .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option {
14840 font-size: 14px;
14841 line-height: 1;
14842 letter-spacing: -0.01em;
14843 color: #7A8B9A;
14844 flex: 1;
14845 border: none;
14846 background: transparent;
14847 display: flex;
14848 flex-flow: column;
14849 align-items: center;
14850 justify-content: center;
14851 cursor: pointer;
14852 transition: all 0.3s ease;
14853 padding: 19px 15px;
14854 }
14855 .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,
14856 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option path,
14857 .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option path {
14858 transition: all 0.3s ease;
14859 }
14860 .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 {
14861 background: rgba(110, 66, 211, 0.16);
14862 color: #6E42D3;
14863 font-weight: 500;
14864 }
14865 .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 {
14866 border-radius: 10px 10px 0 0;
14867 border-bottom: 1px solid #EEF0F3;
14868 }
14869 .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 {
14870 border-radius: 0 0 10px 10px;
14871 }
14872 .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 {
14873 margin-bottom: 8px;
14874 }
14875 .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 {
14876 fill: #6E42D3;
14877 stroke: #6E42D3;
14878 }
14879 .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 {
14880 margin-bottom: 3px;
14881 }
14882 .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,
14883 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option.option-condition:hover path,
14884 .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options .single-option.option-condition:hover path {
14885 stroke: #6E42D3;
14886 }
14887 .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 {
14888 border-radius: 10px !important;
14889 }
14890 .ab-testing-drawer .show-options.add-step-wrapper .add-steps-options, .wpfnl-drawing-window .addstep .show-options.add-step-wrapper .add-steps-options {
14891 display: flex;
14892 }
14893
14894 .add-step-wrapper[data-tour=yes] {
14895 background: #fff;
14896 z-index: 4;
14897 position: relative;
14898 }
14899
14900 .ab-testing-drawer .single-ab-step .step-body .step-stats, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats {
14901 display: flex;
14902 flex-flow: row wrap;
14903 align-items: center;
14904 border-radius: 8px;
14905 border: 1px solid #EEF0F3;
14906 margin-top: 10px;
14907 }
14908 .ab-testing-drawer .single-ab-step .step-body .step-stats .single-stat, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .single-stat {
14909 flex: 1;
14910 text-align: center;
14911 padding: 11px 8px;
14912 }
14913 .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 {
14914 border-right: 1px solid #EEF0F3;
14915 }
14916 .ab-testing-drawer .single-ab-step .step-body .step-stats .number, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .number {
14917 color: #363B4E;
14918 font-size: 13px;
14919 font-weight: 500;
14920 line-height: 1;
14921 text-transform: capitalize;
14922 display: block;
14923 }
14924 .ab-testing-drawer .single-ab-step .step-body .step-stats .number-skeleton, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .number-skeleton {
14925 display: block;
14926 width: 28px;
14927 height: 13px;
14928 margin: 0 auto;
14929 border-radius: 3px;
14930 background: linear-gradient(90deg, #EEF0F3 25%, #F7F8FA 50%, #EEF0F3 75%);
14931 background-size: 200% 100%;
14932 animation: wpfnl-stat-shimmer 1.2s ease-in-out infinite;
14933 }
14934 .ab-testing-drawer .single-ab-step .step-body .step-stats .title, .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .node-stats .title {
14935 color: #7A8B9A;
14936 font-size: 11px;
14937 font-weight: 400;
14938 line-height: 1;
14939 text-transform: capitalize;
14940 display: block;
14941 margin-top: 5px;
14942 }
14943
14944 @keyframes wpfnl-stat-shimmer {
14945 0% {
14946 background-position: 200% 0;
14947 }
14948 100% {
14949 background-position: -200% 0;
14950 }
14951 }
14952 .wpfnl-drawing-window {
14953 flex: 1;
14954 min-height: 0;
14955 position: relative;
14956 overflow: auto !important;
14957 overflow-x: hidden !important;
14958 }
14959 .wpfnl-drawing-window::-webkit-scrollbar {
14960 width: 4px;
14961 height: 4px;
14962 }
14963 .wpfnl-drawing-window::-webkit-scrollbar-track {
14964 background: #f2f5f8;
14965 }
14966 .wpfnl-drawing-window::-webkit-scrollbar-thumb {
14967 background-color: #CBCBCB;
14968 border-radius: 20px;
14969 }
14970 .wpfnl-drawing-window .drawflow .drawflow-delete {
14971 background: #f6f5fa;
14972 }
14973 .wpfnl-drawing-window .drawflow .drawflow-add-step {
14974 position: absolute;
14975 display: flex;
14976 justify-content: center;
14977 align-items: center;
14978 width: 34px;
14979 height: 34px;
14980 color: white !important;
14981 z-index: 4;
14982 font-weight: bold;
14983 text-align: center;
14984 border-radius: 50%;
14985 font-family: monospace;
14986 cursor: pointer;
14987 background: #7A8B9A;
14988 border: 6px solid #F6F5FA;
14989 margin: -6px;
14990 }
14991 .wpfnl-drawing-window .drawflow .drawflow-add-step:hover {
14992 background: #6E42D3;
14993 }
14994 .wpfnl-drawing-window .drawflow .drawflow > .drawflow-add-step {
14995 margin-left: -15px;
14996 margin-top: 15px;
14997 }
14998 .wpfnl-drawing-window .drawflow .parent-node .drawflow-add-step {
14999 right: -15px;
15000 top: -15px;
15001 }
15002 .wpfnl-drawing-window .drawflow .drawflow-paste-step {
15003 position: absolute;
15004 display: flex;
15005 justify-content: center;
15006 align-items: center;
15007 z-index: 4;
15008 font-weight: 500;
15009 text-align: center;
15010 font-family: Roboto;
15011 cursor: pointer;
15012 border-radius: 100px;
15013 border: 6px solid #F6F5FA;
15014 background: #FFF;
15015 width: auto;
15016 height: auto;
15017 padding: 6px 10px;
15018 color: #363B4E !important;
15019 font-size: 10px;
15020 min-width: 80px;
15021 }
15022 .wpfnl-drawing-window .drawflow .drawflow > .drawflow-paste-step {
15023 margin-left: -15px;
15024 margin-top: 15px;
15025 }
15026 .wpfnl-drawing-window .drawflow .parent-node .drawflow-paste-step {
15027 right: -15px;
15028 top: -15px;
15029 }
15030 .wpfnl-drawing-window .drawflow .connection .main-path {
15031 stroke-dasharray: 0;
15032 stroke: #7a8b9a;
15033 stroke-width: 1.8px;
15034 }
15035 .wpfnl-drawing-window .drawflow .connection .main-path:hover, .wpfnl-drawing-window .drawflow .connection .main-path.selected {
15036 stroke: #7a8b9a;
15037 }
15038 .wpfnl-drawing-window .drawflow .drawflow-node {
15039 border: none;
15040 background-color: transparent !important;
15041 border-radius: 10px;
15042 padding: 0;
15043 width: 180px;
15044 }
15045 .wpfnl-drawing-window .drawflow .drawflow-node .drawflow_content_node {
15046 text-align: center;
15047 cursor: default;
15048 }
15049 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper {
15050 position: relative;
15051 }
15052 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .not-clickable-overlay {
15053 position: fixed;
15054 background: rgba(0, 0, 0, 0.2901960784);
15055 display: block;
15056 }
15057 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal {
15058 position: fixed;
15059 top: calc(50% - 90px);
15060 opacity: 1;
15061 visibility: visible;
15062 }
15063 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header {
15064 background: #FFFFFF;
15065 border-bottom: 1px dashed #7A8B9A;
15066 border-radius: 5px 5px 0px 0px;
15067 left: -45px;
15068 position: relative;
15069 top: -45px;
15070 display: flex;
15071 align-items: center;
15072 width: calc(100% + 90px);
15073 padding: 6px 15px;
15074 }
15075 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button {
15076 display: flex;
15077 align-items: center;
15078 background: transparent;
15079 border: none;
15080 cursor: pointer;
15081 font-weight: 500;
15082 font-size: 14px;
15083 line-height: 1;
15084 text-align: center;
15085 color: #787F96;
15086 margin-left: 13px;
15087 }
15088 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button svg {
15089 margin-left: 5px;
15090 position: relative;
15091 top: -1px;
15092 }
15093 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button.edit svg {
15094 width: 17px;
15095 }
15096 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .ab-testing-header button.start {
15097 margin-left: auto;
15098 }
15099 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-overlay {
15100 position: fixed;
15101 top: 0;
15102 left: 0;
15103 width: 100%;
15104 height: 100%;
15105 background-color: transparent;
15106 }
15107 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper {
15108 box-sizing: border-box;
15109 margin-bottom: 40px;
15110 }
15111 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper:last-child {
15112 margin-bottom: 0;
15113 }
15114 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper button.active {
15115 position: relative;
15116 }
15117 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper button.active .wpfnl-dropdown {
15118 visibility: visible;
15119 opacity: 1;
15120 }
15121 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown {
15122 top: 20px;
15123 left: 0;
15124 border-radius: 6px;
15125 border: 1px solid #EBEDF0;
15126 background: #FFF;
15127 box-shadow: 0px 2px 20px 0px rgba(210, 209, 218, 0.3);
15128 padding: 10px;
15129 }
15130 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown .wpfnl-dropdown-item {
15131 border-radius: 4px;
15132 background: #F6F8FA;
15133 padding: 8px;
15134 width: auto;
15135 height: auto;
15136 flex-direction: row;
15137 align-items: center;
15138 justify-content: flex-start;
15139 display: flex;
15140 gap: 8px;
15141 cursor: pointer;
15142 }
15143 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown .wpfnl-dropdown-item svg {
15144 margin: 0;
15145 }
15146 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown .wpfnl-dropdown-item span {
15147 color: #2D3149;
15148 font-weight: 500;
15149 }
15150 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node-wrapper .wpfnl-dropdown::after {
15151 content: none;
15152 }
15153 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .has-mailmint-step .single-node-wrapper:not(.single-node-thankyou):nth-last-of-type(2) {
15154 margin-bottom: 0;
15155 }
15156 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .single-node {
15157 position: relative;
15158 background: #FFFFFF;
15159 box-sizing: border-box;
15160 border-radius: 10px;
15161 border: 1px solid #EDECF2;
15162 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
15163 }
15164 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper svg {
15165 display: block;
15166 position: relative;
15167 }
15168 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .placeholder-img svg {
15169 width: 100%;
15170 }
15171 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button {
15172 background: #fff;
15173 display: flex;
15174 flex-flow: row;
15175 align-items: center;
15176 justify-content: center;
15177 z-index: 2;
15178 transition: all 0.3s ease;
15179 width: 100%;
15180 margin-top: 12px;
15181 margin-bottom: 3px;
15182 gap: 10px;
15183 }
15184 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li {
15185 width: 24px;
15186 height: 22px;
15187 display: flex;
15188 flex-flow: column;
15189 align-items: center;
15190 justify-content: center;
15191 position: relative;
15192 }
15193 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li > button {
15194 border: none;
15195 background: transparent;
15196 }
15197 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li > a, .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li > button {
15198 display: block;
15199 text-align: center;
15200 line-height: 22px;
15201 width: 100%;
15202 cursor: pointer;
15203 }
15204 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li svg {
15205 margin: 0 auto;
15206 }
15207 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag {
15208 position: absolute;
15209 top: -23px;
15210 left: 50%;
15211 padding: 0;
15212 transform: translateX(-50%);
15213 }
15214 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag::before {
15215 content: "";
15216 position: absolute;
15217 left: calc(50% - 1px);
15218 bottom: -6px;
15219 width: 10px;
15220 height: 10px;
15221 background: #6E42D3;
15222 border-radius: 2px;
15223 transform: rotate(45deg) translateX(-50%);
15224 z-index: 0;
15225 }
15226 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag.has-opacity {
15227 background: #9F8ACD;
15228 }
15229 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag.has-opacity::before {
15230 background: #9F8ACD;
15231 }
15232 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button li .pro-tag a {
15233 font-size: 12px;
15234 line-height: 1;
15235 font-weight: 700;
15236 letter-spacing: -0.3px;
15237 padding: 3px 5px 3px;
15238 display: block;
15239 position: relative;
15240 white-space: nowrap;
15241 }
15242 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown {
15243 background: #FFFFFF;
15244 box-shadow: 0px 8px 30px rgba(21, 21, 69, 0.1019607843);
15245 border-radius: 10px;
15246 position: absolute;
15247 left: calc(100% + 8px);
15248 top: 0;
15249 z-index: 3;
15250 width: 184px;
15251 text-align: left;
15252 border: 1px solid #E5E8F3;
15253 display: none;
15254 }
15255 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown button {
15256 font-weight: 500;
15257 font-size: 14px;
15258 line-height: 1;
15259 color: #787F96;
15260 border: none;
15261 background: transparent;
15262 padding: 10px 15px;
15263 border-bottom: 1px solid #F1F3FA;
15264 text-align: left;
15265 width: 100%;
15266 cursor: pointer;
15267 transition: color 0.3s ease;
15268 }
15269 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown button:last-child {
15270 border-bottom: 0;
15271 }
15272 .wpfnl-drawing-window .drawflow .drawflow-node .node-control-button .create-ab-dropdown button:hover {
15273 color: #6E42D3;
15274 }
15275 .wpfnl-drawing-window .drawflow .drawflow-node .node-header {
15276 background: #ffffff;
15277 box-sizing: border-box;
15278 border-radius: 10px 10px 0px 0px;
15279 padding: 10px 3px 9px;
15280 }
15281 .wpfnl-drawing-window .drawflow .drawflow-node .node-header .node-title {
15282 color: #363B4E;
15283 font-weight: 500;
15284 font-size: 13px;
15285 line-height: 14px;
15286 padding: 0;
15287 margin: 0;
15288 text-transform: capitalize;
15289 display: flex;
15290 align-items: center;
15291 justify-content: center;
15292 gap: 6px;
15293 }
15294 .wpfnl-drawing-window .drawflow .drawflow-node .node-header .node-title span {
15295 font-size: 11px;
15296 color: #797e94;
15297 max-width: 88px;
15298 white-space: nowrap;
15299 overflow: hidden;
15300 text-overflow: ellipsis;
15301 display: inline-block;
15302 vertical-align: middle;
15303 }
15304 .wpfnl-drawing-window .drawflow .drawflow-node .node-body {
15305 padding: 10px;
15306 }
15307 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .placeholder-img.thankyou {
15308 padding: 14px 0px;
15309 }
15310 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .no-product-notice {
15311 transform: translateY(-7px);
15312 width: 100%;
15313 }
15314 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .preview-img {
15315 border-radius: 8px;
15316 border: 1px solid #EEF0F3;
15317 position: relative;
15318 overflow: hidden;
15319 height: 121px;
15320 background: #f6f5fa;
15321 }
15322 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .preview-img > div {
15323 height: 100%;
15324 background-repeat: no-repeat;
15325 background-size: cover;
15326 background-position: center -5px;
15327 }
15328 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .preview-img img {
15329 border-radius: 8px;
15330 height: 100%;
15331 object-fit: cover;
15332 }
15333 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta {
15334 background: linear-gradient(180deg, rgba(217, 217, 217, 0) 44.08%, rgba(0, 0, 0, 0.53) 100%);
15335 border-radius: 8px;
15336 position: absolute;
15337 bottom: -6px;
15338 left: 0;
15339 width: 100%;
15340 height: 100%;
15341 display: flex;
15342 flex-flow: column;
15343 align-items: center;
15344 justify-content: flex-end;
15345 padding-bottom: 15px;
15346 }
15347 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span {
15348 font-weight: 500;
15349 font-size: 12px;
15350 line-height: 10px;
15351 text-transform: capitalize;
15352 color: #FFFFFF;
15353 display: block;
15354 }
15355 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span.clickable-tag {
15356 cursor: pointer;
15357 text-decoration: underline;
15358 text-underline-offset: 2px;
15359 transition: opacity 0.15s ease;
15360 }
15361 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span.clickable-tag:hover {
15362 opacity: 0.8;
15363 }
15364 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .orderbump-cta > span.has-orderbump {
15365 font-weight: 600;
15366 }
15367 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span {
15368 border: 1px solid #EEF0F3;
15369 border-radius: 8px;
15370 display: block;
15371 font-weight: 500;
15372 font-size: 12px;
15373 line-height: 1;
15374 text-align: center;
15375 text-transform: capitalize;
15376 color: #363B4E;
15377 padding: 8px 5px;
15378 margin-top: 10px;
15379 }
15380 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.no-product {
15381 color: #ee5f5a;
15382 }
15383 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.has-product {
15384 color: #45b959;
15385 font-weight: 600;
15386 border-color: #45b959;
15387 }
15388 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag {
15389 cursor: pointer;
15390 transition: opacity 0.15s ease, border-color 0.15s ease;
15391 }
15392 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag:hover {
15393 opacity: 0.75;
15394 }
15395 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag.no-product:hover {
15396 border-color: #ee5f5a;
15397 }
15398 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .node-cta > span.clickable-tag.has-product:hover {
15399 border-color: #45b959;
15400 }
15401 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag {
15402 position: absolute;
15403 top: 98px;
15404 left: calc(100% + 54px);
15405 width: 50px;
15406 height: 50px;
15407 border: 1px solid #EDECF2;
15408 box-shadow: 0px 6px 10px 0px rgba(190, 190, 215, 0.08);
15409 background: #ffffff;
15410 display: flex;
15411 align-items: center;
15412 justify-content: center;
15413 border-radius: 100%;
15414 }
15415 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag .flag-line {
15416 position: absolute;
15417 right: calc(100% + 11px);
15418 top: 18px;
15419 width: 42px;
15420 height: 2px;
15421 background: #7A8B9A;
15422 }
15423 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag:before {
15424 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzdBOEI5QSIgZD0iTTEuNzUgMTUuNTg1YTEuMDgzIDEuMDgzIDAgMDEtLjc3LTEuODUybDUuNzQyLTUuNzMxTC45ODEgMi4yN0ExLjA4OCAxLjA4OCAwIDAxMi41MTkuNzMzbDYuNSA2LjVhMS4wODMgMS4wODMgMCAwMTAgMS41MjdsLTYuNSA2LjVhMS4wODMgMS4wODMgMCAwMS0uNzcuMzI1eiIvPjwvc3ZnPg==");
15425 position: absolute;
15426 right: calc(100% + 9px);
15427 top: 17px;
15428 width: 10px;
15429 height: 16px;
15430 }
15431 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag:after {
15432 content: "";
15433 position: absolute;
15434 left: -61px;
15435 top: 20px;
15436 width: 12px;
15437 height: 12px;
15438 border: 2px solid #7A8B9A;
15439 border-radius: 100%;
15440 box-sizing: border-box;
15441 background: #fff;
15442 }
15443 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag path {
15444 stroke: #6E42D3;
15445 }
15446 .wpfnl-drawing-window .drawflow .drawflow-node .node-body .end-flag > span {
15447 font-size: 14px;
15448 line-height: 1.2;
15449 font-weight: 600;
15450 color: #363B4E;
15451 margin-top: 6px;
15452 display: block;
15453 }
15454 .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input,
15455 .wpfnl-drawing-window .drawflow .drawflow-node .output {
15456 border-radius: 50%;
15457 border: 2px solid #7A8B9A;
15458 background: #fff;
15459 width: 12px;
15460 height: 12px;
15461 position: absolute;
15462 right: 7px;
15463 top: 120px;
15464 pointer-events: none !important;
15465 }
15466 .wpfnl-drawing-window .drawflow .drawflow-node .output {
15467 opacity: 1 !important;
15468 right: -5px;
15469 pointer-events: none !important;
15470 }
15471 .wpfnl-drawing-window .drawflow .drawflow-node .output.output_2 {
15472 top: 120px;
15473 }
15474 .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input {
15475 background: #f6f5fa;
15476 opacity: 1 !important;
15477 border: none;
15478 left: -13px;
15479 }
15480 .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input.input-connected:before {
15481 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzdBOEI5QSIgZD0iTTEuNzUgMTUuNTg1YTEuMDgzIDEuMDgzIDAgMDEtLjc3LTEuODUybDUuNzQyLTUuNzMxTC45ODEgMi4yN0ExLjA4OCAxLjA4OCAwIDAxMi41MTkuNzMzbDYuNSA2LjVhMS4wODMgMS4wODMgMCAwMTAgMS41MjdsLTYuNSA2LjVhMS4wODMgMS4wODMgMCAwMS0uNzcuMzI1eiIvPjwvc3ZnPg==");
15482 width: 10px;
15483 height: 16px;
15484 border-radius: 0px;
15485 position: absolute;
15486 left: -9px;
15487 top: -2px;
15488 }
15489 .wpfnl-drawing-window .drawflow .drawflow-node.selected {
15490 z-index: 4;
15491 }
15492 .wpfnl-drawing-window .drawflow .drawflow-node.landing .node-header {
15493 background: #E8F1FF;
15494 }
15495 .wpfnl-drawing-window .drawflow .drawflow-node.landing .node-header .node-title svg {
15496 width: 15px;
15497 height: 15px;
15498 }
15499 .wpfnl-drawing-window .drawflow .drawflow-node.checkout .node-header {
15500 background: #FDF0E8;
15501 padding: 9px 3px 8px;
15502 }
15503 .wpfnl-drawing-window .drawflow .drawflow-node.checkout .node-header .node-title svg {
15504 width: 15px;
15505 height: 17px;
15506 top: -1px;
15507 }
15508 .wpfnl-drawing-window .drawflow .drawflow-node.upsell .node-header {
15509 background: #E9F9E8;
15510 }
15511 .wpfnl-drawing-window .drawflow .drawflow-node.upsell .node-header .node-title svg {
15512 width: 15px;
15513 height: 15px;
15514 }
15515 .wpfnl-drawing-window .drawflow .drawflow-node.downsell .node-header {
15516 background: #FCF0F1;
15517 }
15518 .wpfnl-drawing-window .drawflow .drawflow-node.downsell .node-header .node-title svg {
15519 width: 15px;
15520 height: 15px;
15521 }
15522 .wpfnl-drawing-window .drawflow .drawflow-node.thankyou .node-header {
15523 background: #E6FAF5;
15524 }
15525 .wpfnl-drawing-window .drawflow .drawflow-node.thankyou .node-header .node-title svg {
15526 width: 15px;
15527 height: 15px;
15528 }
15529 .wpfnl-drawing-window .drawflow .drawflow-node.custom .node-header {
15530 background: #E0F2F4;
15531 }
15532 .wpfnl-drawing-window .drawflow .drawflow-node.custom .node-header .node-title svg {
15533 width: 15px;
15534 height: 15px;
15535 }
15536 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .output:before {
15537 display: none;
15538 }
15539 .wpfnl-drawing-window .drawflow .drawflow-node.conditional.selected .actions {
15540 top: -35px;
15541 }
15542 .wpfnl-drawing-window .drawflow .drawflow-step-delete {
15543 position: absolute;
15544 right: -8px;
15545 top: -8px;
15546 width: 22px;
15547 height: 22px;
15548 border-radius: 30px;
15549 background: #ffffff;
15550 color: #ffffff;
15551 border: 2px solid #EE5F5A;
15552 line-height: 1.3;
15553 cursor: pointer;
15554 z-index: 1;
15555 opacity: 0;
15556 visibility: hidden;
15557 transition: all 0.3s ease;
15558 }
15559 .wpfnl-drawing-window .drawflow .drawflow-step-delete:before {
15560 content: "";
15561 position: absolute;
15562 left: 0;
15563 top: 0;
15564 width: 100%;
15565 height: 100%;
15566 background-image: url("../images/cross.svg");
15567 background-repeat: no-repeat;
15568 background-size: 80% 80%;
15569 background-position: center center;
15570 border-radius: 50%;
15571 }
15572 .wpfnl-drawing-window .drawflow .ab-testing-indicator {
15573 position: absolute;
15574 top: -28px;
15575 left: 50%;
15576 transform: translateX(-50%);
15577 color: #FFF;
15578 font-size: 10px;
15579 font-weight: 600;
15580 line-height: 1;
15581 background-color: #EC813F;
15582 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
15583 z-index: 2;
15584 padding: 5px 10px;
15585 white-space: nowrap;
15586 border-radius: 50px;
15587 }
15588 .wpfnl-drawing-window .drawflow .node-condition-wrapper .drawflow-step-delete {
15589 left: -3px;
15590 right: inherit;
15591 top: -7px;
15592 }
15593 .wpfnl-drawing-window .drawflow .node-condition-wrapper:hover .drawflow-step-delete,
15594 .wpfnl-drawing-window .drawflow .node-wrapper:hover .drawflow-step-delete {
15595 opacity: 1;
15596 visibility: visible;
15597 }
15598 .wpfnl-drawing-window .drawflow .drawflow-delete:before {
15599 content: "";
15600 position: absolute;
15601 left: 0;
15602 top: 0;
15603 width: 100%;
15604 height: 100%;
15605 background-image: url("../images/cross.svg");
15606 background-repeat: no-repeat;
15607 background-size: 80% 80%;
15608 background-position: center center;
15609 border-radius: 50%;
15610 }
15611 .wpfnl-drawing-window .drawflow .drawflow-node:not(.conditional) .outputs .output,
15612 .wpfnl-drawing-window .drawflow .drawflow-node:not(.conditional) .inputs .input {
15613 opacity: 0;
15614 }
15615 .wpfnl-drawing-window .drawflow .drawflow-node.selected:not(.conditional) .outputs .output,
15616 .wpfnl-drawing-window .drawflow .drawflow-node.selected:not(.conditional) .inputs .input {
15617 opacity: 1;
15618 }
15619 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .outputs .output,
15620 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .inputs .input {
15621 width: 9px;
15622 height: 9px;
15623 border-radius: 50%;
15624 border: 2px solid #7A8B9A;
15625 background: #fff;
15626 background-image: none;
15627 }
15628 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .outputs .output {
15629 right: 5px;
15630 }
15631 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .inputs .input {
15632 left: -5px;
15633 }
15634 .wpfnl-drawing-window .drawflow .drawflow-delete {
15635 width: 22px;
15636 height: 22px;
15637 background: #ffffff;
15638 color: #ffffff;
15639 border: 2px solid #EE5F5A;
15640 line-height: 1.3;
15641 display: none;
15642 opacity: 0;
15643 visibility: hidden;
15644 }
15645 .wpfnl-drawing-window .drawflow .drawflow-node.conditional {
15646 background: #ffffff !important;
15647 border-radius: 100%;
15648 width: 56px;
15649 height: 56px;
15650 border: 1px solid #E5E8F3;
15651 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
15652 }
15653 .wpfnl-drawing-window .drawflow .drawflow-node.conditional svg {
15654 position: relative;
15655 top: 3px;
15656 }
15657 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .drawflow-delete {
15658 left: -2px;
15659 top: -6px;
15660 }
15661 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .actions {
15662 position: absolute;
15663 top: -19px;
15664 background: #fff;
15665 left: 50%;
15666 transform: translateX(-50%);
15667 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
15668 border-radius: 5px;
15669 transition: all 0.3s ease;
15670 opacity: 0;
15671 visibility: hidden;
15672 }
15673 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .actions:before {
15674 content: "";
15675 position: absolute;
15676 bottom: -5px;
15677 left: 50%;
15678 width: 8px;
15679 height: 8px;
15680 background: white;
15681 margin-left: -4px;
15682 transform: rotate(45deg);
15683 }
15684 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .actions li {
15685 padding: 2px 6px;
15686 cursor: pointer;
15687 }
15688 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-label {
15689 position: absolute;
15690 bottom: -10px;
15691 left: 50%;
15692 background: #fff;
15693 font-size: 13px;
15694 text-transform: capitalize;
15695 padding: 2px 6px;
15696 border-radius: 4px;
15697 transform: translateX(-50%);
15698 opacity: 0;
15699 visibility: hidden;
15700 transition: all 0.3s ease;
15701 }
15702 .wpfnl-drawing-window .drawflow .drawflow-node.conditional.selected .actions {
15703 top: -39px;
15704 opacity: 1;
15705 visibility: visible;
15706 }
15707 .wpfnl-drawing-window .drawflow .drawflow-node.conditional.selected .condition-label {
15708 bottom: -30px;
15709 opacity: 1;
15710 visibility: visible;
15711 }
15712 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-else,
15713 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-if {
15714 position: absolute;
15715 background: #fff;
15716 border-radius: 50%;
15717 cursor: pointer;
15718 font-size: 11px;
15719 text-transform: uppercase;
15720 font-weight: 600;
15721 width: 20px;
15722 height: 20px;
15723 border: 2px solid #00D057;
15724 color: #00D057;
15725 padding: 1px 0;
15726 }
15727 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-if {
15728 top: -8px;
15729 right: -17px;
15730 }
15731 .wpfnl-drawing-window .drawflow .drawflow-node.conditional .condition-else {
15732 bottom: -7px;
15733 right: -17px;
15734 color: #EE5F5A;
15735 border-color: #EE5F5A;
15736 }
15737 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper.ab-testing-started {
15738 border-color: #6E42D3;
15739 }
15740 .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper.ab-testing-started .ab-testing-header {
15741 border-bottom-color: #6E42D3;
15742 }
15743 .wpfnl-drawing-window .drawflow > .drawflow-delete {
15744 margin-top: -9px;
15745 margin-left: -11px;
15746 }
15747
15748 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing {
15749 cursor: not-allowed;
15750 }
15751 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing:before {
15752 content: url(../images/disabled.svg);
15753 position: absolute;
15754 top: 0;
15755 z-index: 1;
15756 left: 0;
15757 color: #e33e3e;
15758 background: rgba(249, 249, 249, 0.6509803922);
15759 width: 100%;
15760 height: 100%;
15761 border-radius: 10px;
15762 display: flex;
15763 flex-flow: column;
15764 align-items: center;
15765 justify-content: center;
15766 font-size: 15px;
15767 font-weight: 500;
15768 }
15769 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing .add-new-action {
15770 display: none;
15771 }
15772 .wpfnl-drawing-window.enabled-gbf .drawflow .drawflow-node.landing .mintmrm-automation-step-wrapper {
15773 display: none;
15774 }
15775
15776 .wpfnl-vertical-flow-view {
15777 width: 100%;
15778 flex: 1;
15779 min-height: 0;
15780 overflow: hidden;
15781 display: flex;
15782 justify-content: center;
15783 align-items: flex-start;
15784 padding: 40px 40px 60px;
15785 background: #f6f5fa;
15786 cursor: grab;
15787 }
15788 .wpfnl-vertical-flow-view.vf--panning {
15789 cursor: grabbing;
15790 user-select: none;
15791 }
15792 .wpfnl-vertical-flow-view .vf-flow-container {
15793 display: flex;
15794 flex-direction: column;
15795 align-items: center;
15796 flex-shrink: 0;
15797 }
15798 .wpfnl-vertical-flow-view .vf-step-card {
15799 width: 300px;
15800 flex-shrink: 0;
15801 background: #fff;
15802 border-radius: 12px;
15803 border-top: 3px solid #ec813f;
15804 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
15805 overflow: visible;
15806 position: relative;
15807 cursor: pointer;
15808 transition: box-shadow 0.18s ease, border-color 0.18s ease;
15809 }
15810 .wpfnl-vertical-flow-view .vf-step-card:hover {
15811 box-shadow: 0 3px 12px rgba(0, 0, 0, 0.08);
15812 }
15813 .wpfnl-vertical-flow-view .vf-step-card:hover .vf-step-card__hover-actions {
15814 opacity: 1;
15815 visibility: visible;
15816 transform: translateX(0);
15817 }
15818 .wpfnl-vertical-flow-view .vf-step-card--gbf-disabled {
15819 cursor: not-allowed;
15820 }
15821 .wpfnl-vertical-flow-view .vf-step-card--gbf-disabled::before {
15822 content: url(../images/disabled.svg);
15823 position: absolute;
15824 top: 0;
15825 left: 0;
15826 z-index: 5;
15827 width: 100%;
15828 height: 100%;
15829 border-radius: 12px;
15830 background: rgba(249, 249, 249, 0.65);
15831 display: flex;
15832 align-items: center;
15833 justify-content: center;
15834 }
15835 .wpfnl-vertical-flow-view .vf-step-card--landing {
15836 border-top-color: #2b74ff;
15837 }
15838 .wpfnl-vertical-flow-view .vf-step-card--landing .vf-step-card__icon-wrap {
15839 background: #E8F1FF;
15840 color: #0284c7;
15841 }
15842 .wpfnl-vertical-flow-view .vf-step-card--checkout {
15843 border-top-color: #ec813f;
15844 }
15845 .wpfnl-vertical-flow-view .vf-step-card--checkout .vf-step-card__icon-wrap {
15846 background: #FDF0E8;
15847 color: #d97706;
15848 }
15849 .wpfnl-vertical-flow-view .vf-step-card--upsell {
15850 border-top-color: #3bc219;
15851 }
15852 .wpfnl-vertical-flow-view .vf-step-card--upsell .vf-step-card__icon-wrap {
15853 background: #E9F9E8;
15854 color: #059669;
15855 }
15856 .wpfnl-vertical-flow-view .vf-step-card--downsell {
15857 border-top-color: #d94f80;
15858 }
15859 .wpfnl-vertical-flow-view .vf-step-card--downsell .vf-step-card__icon-wrap {
15860 background: #FCF0F1;
15861 color: #dc2626;
15862 }
15863 .wpfnl-vertical-flow-view .vf-step-card--thankyou {
15864 border-top-color: #44d6ad;
15865 }
15866 .wpfnl-vertical-flow-view .vf-step-card--thankyou .vf-step-card__icon-wrap {
15867 background: #E6FAF5;
15868 color: #7c3aed;
15869 }
15870 .wpfnl-vertical-flow-view .vf-step-card--custom .vf-step-card__icon-wrap {
15871 background: #E0F2F4;
15872 color: #64748b;
15873 }
15874 .wpfnl-vertical-flow-view .vf-step-card__header {
15875 display: flex;
15876 align-items: flex-start;
15877 gap: 12px;
15878 padding: 16px;
15879 }
15880 .wpfnl-vertical-flow-view .vf-step-card__icon-wrap {
15881 width: 44px;
15882 height: 44px;
15883 border-radius: 10px;
15884 display: flex;
15885 align-items: center;
15886 justify-content: center;
15887 flex-shrink: 0;
15888 background: #f1f5f9;
15889 }
15890 .wpfnl-vertical-flow-view .vf-step-card__icon-wrap svg,
15891 .wpfnl-vertical-flow-view .vf-step-card__icon-wrap img {
15892 width: 22px;
15893 height: 22px;
15894 }
15895 .wpfnl-vertical-flow-view .vf-step-card__info {
15896 flex: 1;
15897 min-width: 0;
15898 display: flex;
15899 flex-direction: column;
15900 gap: 3px;
15901 padding-top: 2px;
15902 }
15903 .wpfnl-vertical-flow-view .vf-step-card__title {
15904 font-size: 14px;
15905 font-weight: 500;
15906 color: #1d2939;
15907 line-height: 1.2;
15908 text-transform: capitalize;
15909 }
15910 .wpfnl-vertical-flow-view .vf-step-card__subtitle {
15911 font-size: 13px;
15912 }
15913 .wpfnl-vertical-flow-view .vf-step-card__subtitle {
15914 font-size: 11px !important;
15915 font-weight: 400 !important;
15916 color: #98a2b3 !important;
15917 white-space: nowrap;
15918 overflow: hidden;
15919 text-overflow: ellipsis;
15920 line-height: 1.3;
15921 }
15922 .wpfnl-vertical-flow-view .vf-step-card__cond-status {
15923 font-size: 12px;
15924 line-height: 1.3;
15925 display: flex;
15926 align-items: center;
15927 gap: 5px;
15928 }
15929 .wpfnl-vertical-flow-view .vf-step-card__cond-status--active {
15930 color: #16a34a;
15931 }
15932 .wpfnl-vertical-flow-view .vf-step-card__cond-status--active::before {
15933 content: "";
15934 display: inline-block;
15935 width: 7px;
15936 height: 7px;
15937 border-radius: 50%;
15938 background: #16a34a;
15939 flex-shrink: 0;
15940 }
15941 .wpfnl-vertical-flow-view .vf-step-card__cond-status--warn {
15942 color: #dc2626 !important;
15943 }
15944 .wpfnl-vertical-flow-view .vf-step-card__hover-actions {
15945 position: absolute;
15946 left: calc(100% + 10px);
15947 top: 0;
15948 transform: translateX(8px);
15949 }
15950 .wpfnl-vertical-flow-view .vf-step-card__hover-actions--flip {
15951 left: auto;
15952 right: calc(100% + 10px);
15953 transform: translateX(-8px);
15954 }
15955 .wpfnl-vertical-flow-view .vf-step-card__hover-actions {
15956 display: flex;
15957 flex-direction: column;
15958 padding: 5px;
15959 background: #fff;
15960 border: 1px solid #eaecf0;
15961 border-radius: 10px;
15962 box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
15963 opacity: 0;
15964 visibility: hidden;
15965 z-index: 100;
15966 min-width: 150px;
15967 transition: opacity 0.18s ease, visibility 0.18s ease, transform 0.18s ease;
15968 white-space: nowrap;
15969 }
15970 .wpfnl-vertical-flow-view .vf-hover-btn {
15971 display: flex;
15972 align-items: center;
15973 gap: 8px;
15974 width: 100%;
15975 padding: 7px 14px;
15976 background: transparent;
15977 border: none;
15978 border-radius: 7px;
15979 cursor: pointer;
15980 color: #344054;
15981 text-decoration: none;
15982 font-size: 13px;
15983 font-weight: 500;
15984 text-align: left;
15985 transition: background 0.12s ease, color 0.12s ease;
15986 }
15987 .wpfnl-vertical-flow-view .vf-hover-btn svg {
15988 flex-shrink: 0;
15989 width: 14px;
15990 height: 14px;
15991 }
15992 .wpfnl-vertical-flow-view .vf-hover-btn span {
15993 font-size: 13px !important;
15994 font-weight: 500 !important;
15995 color: inherit !important;
15996 line-height: 1;
15997 white-space: nowrap;
15998 }
15999 .wpfnl-vertical-flow-view .vf-hover-btn:hover {
16000 background: #f4f5f7;
16001 color: #6e42d3;
16002 text-decoration: none;
16003 }
16004 .wpfnl-vertical-flow-view .vf-hover-btn--danger {
16005 color: #f04438;
16006 }
16007 .wpfnl-vertical-flow-view .vf-hover-btn--danger:hover {
16008 background: #fff1f0;
16009 color: #f04438;
16010 }
16011 .wpfnl-vertical-flow-view .vf-step-card__status {
16012 display: flex;
16013 flex-wrap: wrap;
16014 gap: 4px;
16015 padding: 0 16px 10px;
16016 }
16017 .wpfnl-vertical-flow-view .vf-status-pill {
16018 display: inline-flex;
16019 align-items: center;
16020 gap: 4px;
16021 font-size: 10px;
16022 font-weight: 600;
16023 line-height: 1;
16024 padding: 4px 8px;
16025 border-radius: 50px;
16026 white-space: nowrap;
16027 }
16028 .wpfnl-vertical-flow-view .vf-status-pill svg {
16029 width: 10px;
16030 height: 10px;
16031 flex-shrink: 0;
16032 }
16033 .wpfnl-vertical-flow-view .vf-status-pill--automation {
16034 color: #24C21A;
16035 background: rgba(36, 194, 26, 0.1);
16036 }
16037 .wpfnl-vertical-flow-view .vf-status-pill--automation svg path {
16038 stroke: #24C21A;
16039 }
16040 .wpfnl-vertical-flow-view .vf-status-pill--ab {
16041 color: #EC813F;
16042 background: rgba(236, 129, 63, 0.12);
16043 }
16044 .wpfnl-vertical-flow-view .vf-step-card__badges {
16045 display: flex;
16046 flex-wrap: wrap;
16047 gap: 4px;
16048 padding: 0 16px 12px;
16049 }
16050 .wpfnl-vertical-flow-view .vf-step-card__badges:empty {
16051 display: none;
16052 }
16053 .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag {
16054 display: inline-block;
16055 font-size: 10px;
16056 font-weight: 400;
16057 padding: 5px 8px 4px;
16058 border-radius: 20px;
16059 cursor: pointer;
16060 line-height: 1;
16061 background-color: #eef0f1;
16062 border: 1px solid #e6e6e6;
16063 transition: opacity 0.15s ease;
16064 letter-spacing: 0.2px;
16065 }
16066 .wpfnl-vertical-flow-view .vf-step-card__badges .vf-cta-tag:hover {
16067 opacity: 0.75;
16068 }
16069 .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 {
16070 background: #f0fdf4;
16071 color: #58151c;
16072 border-color: #bbf7d0;
16073 }
16074 .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 {
16075 background: #fff8f8;
16076 color: #f38282;
16077 border-color: #fecaca;
16078 }
16079 .wpfnl-vertical-flow-view .vf-dropdown {
16080 position: absolute;
16081 right: 0;
16082 background: #fff;
16083 border: 1px solid #eaecf0;
16084 border-radius: 10px;
16085 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
16086 padding: 4px;
16087 min-width: 140px;
16088 z-index: 200;
16089 list-style: none;
16090 margin: 0;
16091 }
16092 .wpfnl-vertical-flow-view .vf-dropdown__item {
16093 display: flex;
16094 align-items: center;
16095 gap: 8px;
16096 padding: 8px 10px;
16097 font-size: 12px !important;
16098 color: #344054;
16099 border-radius: 6px;
16100 cursor: pointer;
16101 transition: background 0.12s ease;
16102 }
16103 .wpfnl-vertical-flow-view .vf-dropdown__item:hover {
16104 background: #f9fafb;
16105 }
16106 .wpfnl-vertical-flow-view .vf-dropdown__item a {
16107 display: flex;
16108 align-items: center;
16109 gap: 8px;
16110 width: 100%;
16111 text-decoration: none;
16112 color: inherit;
16113 font-size: 12px;
16114 }
16115 .wpfnl-vertical-flow-view .vf-dropdown__item svg {
16116 width: 14px;
16117 height: 14px;
16118 flex-shrink: 0;
16119 }
16120 .wpfnl-vertical-flow-view .vf-dropdown__item span {
16121 font-size: 12px !important;
16122 font-weight: 400 !important;
16123 color: inherit !important;
16124 }
16125 .wpfnl-vertical-flow-view .vf-dropdown__item--danger {
16126 color: #f04438;
16127 }
16128 .wpfnl-vertical-flow-view .vf-dropdown__item--danger:hover {
16129 background: #fff1f0;
16130 }
16131 .wpfnl-vertical-flow-view .vf-step-card__stats {
16132 display: flex;
16133 align-items: center;
16134 justify-content: space-between;
16135 padding: 8px 16px;
16136 border-top: 1px solid #f2f4f7;
16137 background: #f9f9fc;
16138 border-radius: 0 0 12px 12px;
16139 }
16140 .wpfnl-vertical-flow-view .vf-stat {
16141 display: flex;
16142 align-items: baseline;
16143 gap: 5px;
16144 }
16145 .wpfnl-vertical-flow-view .vf-stat__value {
16146 font-size: 13px;
16147 font-weight: 600;
16148 color: #344054;
16149 line-height: 1;
16150 }
16151 .wpfnl-vertical-flow-view .vf-stat__label {
16152 font-size: 12px;
16153 font-weight: 400;
16154 color: #98a2b3;
16155 line-height: 1;
16156 }
16157 .wpfnl-vertical-flow-view .number-skeleton {
16158 display: block;
16159 width: 28px;
16160 height: 13px;
16161 border-radius: 3px;
16162 background: linear-gradient(90deg, #EEF0F3 25%, #F7F8FA 50%, #EEF0F3 75%);
16163 background-size: 200% 100%;
16164 animation: wpfnl-stat-shimmer 1.2s ease-in-out infinite;
16165 }
16166 .wpfnl-vertical-flow-view .vf-add-step-btn {
16167 display: flex;
16168 align-items: center;
16169 justify-content: center;
16170 gap: 6px;
16171 width: 300px;
16172 flex-shrink: 0;
16173 padding: 12px 20px;
16174 background: #fff;
16175 border: 1.5px dashed #d0d5dd;
16176 border-radius: 12px;
16177 font-size: 13px;
16178 font-weight: 500;
16179 color: #667085;
16180 cursor: pointer;
16181 transition: all 0.18s ease;
16182 }
16183 .wpfnl-vertical-flow-view .vf-add-step-btn svg {
16184 color: #667085;
16185 transition: color 0.18s ease;
16186 }
16187 .wpfnl-vertical-flow-view .vf-add-step-btn:hover {
16188 border-color: #6e42d3;
16189 color: #6e42d3;
16190 background: #faf5ff;
16191 }
16192 .wpfnl-vertical-flow-view .vf-add-step-btn:hover svg {
16193 color: #6e42d3;
16194 }
16195 .wpfnl-vertical-flow-view .vf-connector {
16196 display: flex;
16197 flex-direction: column;
16198 align-items: center;
16199 position: relative;
16200 }
16201 .wpfnl-vertical-flow-view .vf-connector--merge .vf-connector__merge-icon {
16202 display: flex;
16203 align-items: center;
16204 justify-content: center;
16205 margin-bottom: 2px;
16206 opacity: 0.6;
16207 }
16208 .wpfnl-vertical-flow-view .vf-connector__line {
16209 width: 1px;
16210 height: 44px;
16211 background: #8896a7;
16212 position: relative;
16213 }
16214 .wpfnl-vertical-flow-view .vf-connector__line::after {
16215 content: "";
16216 position: absolute;
16217 bottom: 0;
16218 left: 50%;
16219 width: 6px;
16220 height: 6px;
16221 border-right: 1px solid #8896a7;
16222 border-bottom: 1px solid #8896a7;
16223 transform: translate(-50%, 1px) rotate(45deg);
16224 }
16225 .wpfnl-vertical-flow-view .vf-connector__line--half {
16226 height: 22px;
16227 }
16228 .wpfnl-vertical-flow-view .vf-connector__line--half::after {
16229 content: none;
16230 }
16231 .wpfnl-vertical-flow-view .vf-connector__dot {
16232 width: 8px;
16233 height: 8px;
16234 border-radius: 50%;
16235 background: #fff;
16236 border: 1px solid #8896a7;
16237 flex-shrink: 0;
16238 }
16239 .wpfnl-vertical-flow-view .vf-insert-connector {
16240 position: relative;
16241 display: flex;
16242 flex-direction: column;
16243 align-items: center;
16244 }
16245 .wpfnl-vertical-flow-view .vf-insert-connector .vf-connector__line {
16246 height: 88px;
16247 }
16248 .wpfnl-vertical-flow-view .vf-insert-connector:hover .vf-insert-btn {
16249 background: #6e42d3;
16250 transform: translateY(-50%) scale(1.08);
16251 }
16252 .wpfnl-vertical-flow-view .vf-insert-btn {
16253 position: absolute;
16254 top: 50%;
16255 transform: translateY(-50%);
16256 width: 28px;
16257 height: 28px;
16258 border-radius: 50%;
16259 border: none;
16260 background: #7A8B9A;
16261 color: #fff;
16262 display: flex;
16263 align-items: center;
16264 justify-content: center;
16265 cursor: pointer;
16266 z-index: 2;
16267 transition: background 0.15s ease, transform 0.15s ease;
16268 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
16269 flex-shrink: 0;
16270 }
16271 .wpfnl-vertical-flow-view .vf-insert-btn svg {
16272 pointer-events: none;
16273 width: 12px;
16274 height: 12px;
16275 }
16276 .wpfnl-vertical-flow-view .vf-insert-btn--paste {
16277 width: auto;
16278 height: 28px;
16279 border-radius: 14px;
16280 padding: 0 12px;
16281 font-size: 11px;
16282 font-weight: 600;
16283 white-space: nowrap;
16284 background: #6e42d3;
16285 opacity: 1 !important;
16286 transform: translateY(-50%) !important;
16287 }
16288 .wpfnl-vertical-flow-view .vf-insert-btn--paste:hover {
16289 background: #5b35b5;
16290 }
16291 .wpfnl-vertical-flow-view .vf-insert-connector--paste-mode:hover .vf-insert-btn--paste {
16292 background: #5b35b5;
16293 transform: translateY(-50%) scale(1.04) !important;
16294 }
16295 .wpfnl-vertical-flow-view .vf-paste-here-btn {
16296 display: flex;
16297 align-items: center;
16298 justify-content: center;
16299 gap: 6px;
16300 width: 300px;
16301 flex-shrink: 0;
16302 padding: 12px 20px;
16303 background: #faf5ff;
16304 border: 1.5px solid #6e42d3;
16305 border-radius: 12px;
16306 font-size: 13px;
16307 font-weight: 600;
16308 color: #6e42d3;
16309 cursor: pointer;
16310 transition: all 0.18s ease;
16311 }
16312 .wpfnl-vertical-flow-view .vf-paste-here-btn svg {
16313 color: #6e42d3;
16314 }
16315 .wpfnl-vertical-flow-view .vf-paste-here-btn:hover {
16316 background: #ede9fe;
16317 border-color: #5b35b5;
16318 color: #5b35b5;
16319 }
16320 .wpfnl-vertical-flow-view .vf-paste-here-btn:hover svg {
16321 color: #5b35b5;
16322 }
16323 .wpfnl-vertical-flow-view .vf-branch-group {
16324 display: flex;
16325 flex-direction: column;
16326 align-items: stretch;
16327 flex-shrink: 0;
16328 }
16329 .wpfnl-vertical-flow-view .vf-branch-connector {
16330 display: flex;
16331 flex-direction: column;
16332 align-items: center;
16333 }
16334 .wpfnl-vertical-flow-view .vf-branch-connector__stem {
16335 width: 1px;
16336 height: 28px;
16337 background: #8896a7;
16338 flex-shrink: 0;
16339 }
16340 .wpfnl-vertical-flow-view .vf-branch-connector__bar {
16341 display: none;
16342 }
16343 .wpfnl-vertical-flow-view .vf-branch-connector--nested .vf-branch-connector__stem {
16344 height: 18px;
16345 }
16346 .wpfnl-vertical-flow-view .vf-fork-label {
16347 font-size: 11px;
16348 font-weight: 400;
16349 padding: 5px 12px 4px;
16350 border-radius: 20px;
16351 white-space: nowrap;
16352 line-height: 1;
16353 margin-bottom: 12px;
16354 flex-shrink: 0;
16355 }
16356 .wpfnl-vertical-flow-view .vf-fork-label--yes {
16357 background: #fff;
16358 color: #16a34a;
16359 border: 1px solid #86efac;
16360 }
16361 .wpfnl-vertical-flow-view .vf-fork-label--no {
16362 background: #fff;
16363 color: #dc2626;
16364 border: 1px solid #fca5a5;
16365 }
16366 .wpfnl-vertical-flow-view .vf-branches-container {
16367 display: flex;
16368 flex-shrink: 0;
16369 min-height: 80px;
16370 gap: 70px;
16371 }
16372 .wpfnl-vertical-flow-view .vf-branch-column {
16373 position: relative;
16374 min-width: 300px;
16375 flex: 1 0 auto;
16376 display: flex;
16377 flex-direction: column;
16378 align-items: center;
16379 padding: 0 10px 12px;
16380 }
16381 .wpfnl-vertical-flow-view .vf-branch-column--no::before {
16382 content: "";
16383 position: absolute;
16384 top: 0;
16385 left: calc(50% - 0.5px);
16386 right: -35px;
16387 height: 1px;
16388 background: #8896a7;
16389 }
16390 .wpfnl-vertical-flow-view .vf-branch-column--no::after {
16391 content: none;
16392 }
16393 .wpfnl-vertical-flow-view .vf-branch-column--yes::before {
16394 content: "";
16395 position: absolute;
16396 top: 0;
16397 left: -35px;
16398 right: calc(50% - 0.5px);
16399 height: 1px;
16400 background: #8896a7;
16401 }
16402 .wpfnl-vertical-flow-view .vf-branch-column--yes::after {
16403 content: none;
16404 }
16405 .wpfnl-vertical-flow-view .vf-branch-column--no > .vf-fork-label {
16406 position: absolute;
16407 top: -1px;
16408 left: 75%;
16409 transform: translate(-50%, -50%);
16410 z-index: 2;
16411 margin-bottom: 0;
16412 }
16413 .wpfnl-vertical-flow-view .vf-branch-column--yes > .vf-fork-label {
16414 position: absolute;
16415 top: -1px;
16416 left: 25%;
16417 transform: translate(-50%, -50%);
16418 z-index: 2;
16419 margin-bottom: 0;
16420 }
16421 .wpfnl-vertical-flow-view .vf-conditional {
16422 display: flex;
16423 flex-direction: column;
16424 align-items: center;
16425 flex-shrink: 0;
16426 }
16427 .wpfnl-vertical-flow-view .vf-conditional__header {
16428 width: 300px;
16429 display: flex;
16430 align-items: center;
16431 gap: 10px;
16432 padding: 12px 16px;
16433 background: linear-gradient(108deg, #f3eeff 0%, #fff 60%);
16434 border: 1.5px solid #e9d9fc;
16435 border-radius: 12px;
16436 box-shadow: 0 1px 4px rgba(110, 66, 211, 0.08);
16437 cursor: pointer;
16438 }
16439 .wpfnl-vertical-flow-view .vf-conditional__header:hover {
16440 background: linear-gradient(108deg, #ebe1ff 0%, #faf5ff 60%);
16441 }
16442 .wpfnl-vertical-flow-view .vf-conditional__icon {
16443 width: 32px;
16444 height: 32px;
16445 border-radius: 8px;
16446 background: #ede2fc;
16447 display: flex;
16448 align-items: center;
16449 justify-content: center;
16450 flex-shrink: 0;
16451 }
16452 .wpfnl-vertical-flow-view .vf-conditional__title {
16453 font-size: 13px;
16454 font-weight: 600;
16455 color: #6e42d3;
16456 }
16457 .wpfnl-vertical-flow-view .vf-conditional__hint {
16458 font-size: 11px;
16459 color: #98a2b3;
16460 margin-left: auto;
16461 }
16462 .wpfnl-vertical-flow-view .vf-branch__add-btn {
16463 display: flex;
16464 align-items: center;
16465 justify-content: center;
16466 gap: 5px;
16467 width: 300px;
16468 flex-shrink: 0;
16469 padding: 10px 12px;
16470 background: #fff;
16471 border: 1.5px dashed #d0d5dd;
16472 border-radius: 10px;
16473 font-size: 12px;
16474 font-weight: 500;
16475 color: #98a2b3;
16476 cursor: pointer;
16477 transition: all 0.18s ease;
16478 }
16479 .wpfnl-vertical-flow-view .vf-branch__add-btn svg {
16480 flex-shrink: 0;
16481 }
16482 .wpfnl-vertical-flow-view .vf-branch__add-btn:hover {
16483 border-color: #6e42d3;
16484 color: #6e42d3;
16485 background: #faf5ff;
16486 }
16487 .wpfnl-vertical-flow-view .vf-branch__add-btn--paste {
16488 background: #faf5ff;
16489 border-color: #6e42d3;
16490 border-style: solid;
16491 color: #6e42d3;
16492 font-weight: 600;
16493 }
16494 .wpfnl-vertical-flow-view .vf-branch__add-btn--paste:hover {
16495 background: #ede9fe;
16496 border-color: #5b35b5;
16497 color: #5b35b5;
16498 }
16499 .wpfnl-vertical-flow-view .vf-funnel-end {
16500 display: flex;
16501 align-items: center;
16502 gap: 6px;
16503 padding: 6px 16px;
16504 background: #f1f1f1;
16505 border: 1px solid #e5e6e7;
16506 border-radius: 20px;
16507 font-size: 12px;
16508 font-weight: 500;
16509 color: #7A8B9A;
16510 white-space: nowrap;
16511 pointer-events: none;
16512 user-select: none;
16513 flex-shrink: 0;
16514 }
16515 .wpfnl-vertical-flow-view .vf-funnel-end svg {
16516 flex-shrink: 0;
16517 width: 13px;
16518 height: 13px;
16519 }
16520
16521 .wpfnl-step-settings-drawer {
16522 position: fixed;
16523 top: 32px;
16524 right: -190px;
16525 background-color: #fff;
16526 z-index: 99;
16527 width: 1300px;
16528 height: calc(100vh - 32px);
16529 box-shadow: -1px 3px 13px rgba(150, 141, 169, 0.1);
16530 opacity: 0;
16531 visibility: hidden;
16532 }
16533 .wpfnl-step-settings-drawer .drawer-bg-overlay {
16534 position: fixed;
16535 right: 0;
16536 top: 0;
16537 background: rgba(21, 17, 29, 0.3019607843);
16538 backdrop-filter: blur(4px);
16539 width: 100%;
16540 height: 100%;
16541 z-index: -1;
16542 }
16543 .wpfnl-step-settings-drawer .show-overlay .drawer-bg-overlay {
16544 z-index: 2;
16545 }
16546 .wpfnl-step-settings-drawer.show-drawer {
16547 z-index: 99;
16548 right: 0;
16549 opacity: 1;
16550 visibility: visible;
16551 }
16552 .wpfnl-step-settings-drawer .drawer-full-loader {
16553 position: absolute;
16554 top: 0;
16555 left: 0;
16556 width: 100%;
16557 height: 100%;
16558 background: #fff;
16559 border-radius: 10px 0 0 10px;
16560 z-index: 2;
16561 display: flex;
16562 flex-direction: column;
16563 }
16564 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-header {
16565 display: flex;
16566 align-items: center;
16567 justify-content: space-between;
16568 padding: 20px 30px;
16569 flex-shrink: 0;
16570 border-bottom: 1px solid #EEF0F3;
16571 }
16572 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-title {
16573 height: 24px;
16574 width: 180px;
16575 border-radius: 6px;
16576 }
16577 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-close {
16578 height: 38px;
16579 width: 38px;
16580 border-radius: 10px;
16581 }
16582 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-body {
16583 padding: 20px 30px;
16584 flex: 1;
16585 overflow: hidden;
16586 }
16587 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-section {
16588 border: 1px solid #EEF0F3;
16589 border-radius: 10px;
16590 padding: 16px 20px;
16591 margin-bottom: 16px;
16592 }
16593 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-section-title {
16594 height: 18px;
16595 width: 40%;
16596 border-radius: 6px;
16597 margin-bottom: 16px;
16598 }
16599 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-fields {
16600 display: flex;
16601 gap: 16px;
16602 }
16603 .wpfnl-step-settings-drawer .drawer-full-loader .drawer-shimmer-field {
16604 height: 36px;
16605 flex: 1;
16606 border-radius: 6px;
16607 }
16608 .wpfnl-step-settings-drawer .drawer-switcher-loader {
16609 position: absolute;
16610 top: 0;
16611 left: 0;
16612 width: 100%;
16613 height: 100%;
16614 background: transparent;
16615 border-radius: 10px 0 0 10px;
16616 z-index: 2;
16617 display: none;
16618 }
16619 .wpfnl-step-settings-drawer .drawer-wrapper {
16620 height: 100%;
16621 width: 100%;
16622 background: #fff;
16623 }
16624 .wpfnl-step-settings-drawer .drawer-header {
16625 display: flex;
16626 flex-flow: row wrap;
16627 align-items: center;
16628 justify-content: space-between;
16629 padding: 20px 30px 4px;
16630 position: relative;
16631 }
16632 .wpfnl-step-settings-drawer .drawer-header .drawer-title {
16633 display: flex;
16634 align-items: center;
16635 }
16636 .wpfnl-step-settings-drawer .drawer-header .drawer-title > p {
16637 font-weight: 600;
16638 font-size: 18px;
16639 line-height: 1.27;
16640 color: #363B4E;
16641 text-transform: capitalize;
16642 margin: 0;
16643 display: inline-block;
16644 }
16645 .wpfnl-step-settings-drawer .drawer-header .drawer-title span {
16646 padding-left: 4px;
16647 }
16648 .wpfnl-step-settings-drawer .drawer-header .wpfnl-drawer-close {
16649 padding: 3px 7px;
16650 height: 38px;
16651 width: 38px;
16652 cursor: pointer;
16653 position: relative;
16654 top: 0;
16655 border-radius: 10px;
16656 border: 1px solid #EBEDF0;
16657 display: flex;
16658 align-items: center;
16659 justify-content: center;
16660 }
16661 .wpfnl-step-settings-drawer .drawer-body {
16662 padding: 0 30px;
16663 height: calc(100% - 70px);
16664 overflow: auto;
16665 position: relative;
16666 }
16667 .wpfnl-step-settings-drawer .drawer-body::-webkit-scrollbar {
16668 width: 5px;
16669 height: 5px;
16670 }
16671 .wpfnl-step-settings-drawer .drawer-body::-webkit-scrollbar-track {
16672 background: #f2f5f8;
16673 }
16674 .wpfnl-step-settings-drawer .drawer-body::-webkit-scrollbar-thumb {
16675 background-color: #CBCBCB;
16676 border-radius: 20px;
16677 }
16678 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion {
16679 border: 1px solid #EEF0F3;
16680 border-radius: 10px;
16681 margin-top: 20px;
16682 }
16683 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header {
16684 display: flex;
16685 align-items: center;
16686 justify-content: space-between;
16687 gap: 10px;
16688 padding: 12px 20px;
16689 cursor: pointer;
16690 }
16691 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header h2 {
16692 font-size: 16px;
16693 font-weight: 600;
16694 color: #363B4E;
16695 }
16696 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header .accordion-icon {
16697 position: relative;
16698 top: 5px;
16699 }
16700 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-header .accordion-open {
16701 transform: rotate(180deg);
16702 top: -5px;
16703 }
16704 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content {
16705 padding: 20px;
16706 border-top: 1px solid rgb(238, 240, 243);
16707 }
16708 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .steps-url-slug.inline-url-slug {
16709 border: none;
16710 }
16711 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .steps-url-slug-wrapper {
16712 justify-content: space-between;
16713 width: 100%;
16714 border: none;
16715 padding-bottom: 18px;
16716 }
16717 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .custom-script-wrapper .field-group.step-name label {
16718 margin-bottom: 6px;
16719 display: inline-block;
16720 }
16721 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .custom-script-wrapper .field-group.step-name label .wpfnl-tooltip {
16722 top: 2px;
16723 }
16724 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .field-group.url-slug-save-btn {
16725 display: flex;
16726 justify-content: flex-end;
16727 margin-top: 20px;
16728 }
16729 .wpfnl-step-settings-drawer .drawer-body .wpfnl-drawer-accordion .accordion-content .field-group.url-slug-save-btn button {
16730 height: 40px;
16731 line-height: 39px;
16732 padding: 0 20px;
16733 }
16734 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body {
16735 padding: 30px 0;
16736 }
16737 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body input[type=file] {
16738 display: none;
16739 }
16740 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body label {
16741 width: 350px;
16742 height: 380px;
16743 border: 2px dashed #ddd;
16744 border-radius: 10px;
16745 display: flex;
16746 flex-flow: column;
16747 align-items: center;
16748 justify-content: center;
16749 text-align: center;
16750 }
16751 .wpfnl-step-settings-drawer .step-featured-image .featured-image-body label svg {
16752 display: block;
16753 margin: 0 auto;
16754 }
16755 .wpfnl-step-settings-drawer .step-featured-image .featured-image-footer {
16756 border-top: 1px solid #E2E5ED;
16757 padding: 20px 0 20px;
16758 margin-top: 10px;
16759 display: flex;
16760 flex-flow: row wrap;
16761 align-items: center;
16762 position: relative;
16763 }
16764 .wpfnl-step-settings-drawer.edit-field-drawer {
16765 right: -100px;
16766 width: 300px;
16767 }
16768 .wpfnl-step-settings-drawer.edit-field-drawer.show-edit-field-drawer {
16769 right: 0;
16770 opacity: 1;
16771 visibility: visible;
16772 z-index: 99;
16773 }
16774 .wpfnl-step-settings-drawer.edit-field-drawer .drawer-header {
16775 padding: 26px 16px 20px 20px;
16776 }
16777 .wpfnl-step-settings-drawer.create-condition-drawer .drawer-header {
16778 padding: 20px 30px 20px;
16779 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
16780 }
16781 .wpfnl-step-settings-drawer .wpfnl-modal-overlay {
16782 position: fixed;
16783 top: 0;
16784 left: 0;
16785 width: 100%;
16786 height: 100%;
16787 background-color: rgba(0, 0, 0, 0.3);
16788 justify-content: center;
16789 align-items: center;
16790 display: flex;
16791 z-index: 999999;
16792 }
16793 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper {
16794 width: 80%;
16795 background: #FFF;
16796 padding: 25px;
16797 height: 80%;
16798 border-radius: 10px;
16799 position: relative;
16800 }
16801 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper .wpfnl-modal-close .wpfnl-modal-close-btn {
16802 position: absolute;
16803 right: -14px;
16804 top: -14px;
16805 background: #ffffff;
16806 box-shadow: 0px 1px 1px #dadada;
16807 border-radius: 100px;
16808 width: 34px;
16809 height: 34px;
16810 display: flex;
16811 align-items: center;
16812 justify-content: center;
16813 cursor: pointer;
16814 z-index: 2;
16815 }
16816 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper #wpfnl-create-product {
16817 width: 100%;
16818 height: 100%;
16819 }
16820 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper #wpfnl-create-product iframe {
16821 height: 100%;
16822 }
16823 .wpfnl-step-settings-drawer .wpfnl-modal-overlay .wpfnl-modal-wrapper .wpfnl-loader {
16824 border: 2px solid #8265c5;
16825 border-radius: 50%;
16826 border-top: 2px solid #fff;
16827 width: 50px;
16828 height: 50px;
16829 animation: spin 0.7s linear infinite;
16830 display: block;
16831 margin-left: 4px;
16832 position: absolute;
16833 left: 50%;
16834 top: 50%;
16835 transform: translate(-50%, -50%);
16836 z-index: 2;
16837 background: #fff;
16838 }
16839 @-webkit-keyframes spin {
16840 0% {
16841 -webkit-transform: rotate(0deg);
16842 }
16843 100% {
16844 -webkit-transform: rotate(360deg);
16845 }
16846 }
16847 @keyframes spin {
16848 0% {
16849 transform: rotate(0deg);
16850 }
16851 100% {
16852 transform: rotate(360deg);
16853 }
16854 }
16855
16856 @media only screen and (max-width: 1599px) {
16857 .wpfnl-step-settings-drawer {
16858 width: 1183px;
16859 }
16860 }
16861 @media only screen and (max-width: 1400px) {
16862 .wpfnl-step-settings-drawer {
16863 width: 1085px;
16864 }
16865 }
16866 @media only screen and (max-width: 1199px) {
16867 .wpfnl-step-settings-drawer {
16868 width: 803px;
16869 }
16870 }
16871 @media only screen and (max-width: 991px) {
16872 .wpfnl-step-settings-drawer {
16873 width: 740px;
16874 }
16875 .create-condition-drawer .single-condition .single-condition-filed input[type=text],
16876 .create-condition-drawer .single-condition .single-condition-filed input[type=number],
16877 .create-condition-drawer .single-condition .single-condition-filed input[type=email],
16878 .create-condition-drawer .single-condition .single-condition-filed select {
16879 width: 170px;
16880 min-width: auto;
16881 }
16882 }
16883 .wpfnl-step-settings-drawer .steps-url-slug {
16884 padding-top: 10px;
16885 }
16886 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper {
16887 background: #FFFFFF;
16888 border-bottom: 1px solid #EEF0F3;
16889 padding-bottom: 30px;
16890 }
16891 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group {
16892 margin-bottom: 17px;
16893 }
16894 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group:last-child {
16895 margin-bottom: 0;
16896 }
16897 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group > label {
16898 margin-bottom: 6px;
16899 display: block;
16900 }
16901 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .field-group input[type=text] {
16902 border-color: #EEF0F3;
16903 color: #7A8B9A;
16904 box-shadow: none;
16905 }
16906 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input {
16907 display: flex;
16908 align-items: center;
16909 border: 1px solid #EEF0F3;
16910 border-radius: 6px;
16911 }
16912 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url {
16913 width: 40px;
16914 height: 34px;
16915 display: flex;
16916 align-items: center;
16917 justify-content: center;
16918 cursor: pointer;
16919 border: none;
16920 border-left: 1px solid #EEF0F3;
16921 box-shadow: none;
16922 outline: none;
16923 position: relative;
16924 background: transparent;
16925 }
16926 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url .copyed {
16927 background-color: #464646;
16928 position: absolute;
16929 right: 0;
16930 top: -18px;
16931 font-size: 11px;
16932 font-style: normal;
16933 color: #fff;
16934 line-height: 1;
16935 padding: 4px;
16936 border-radius: 3px;
16937 transition: all 0.3s ease;
16938 opacity: 0;
16939 visibility: hidden;
16940 }
16941 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url .copyed:before {
16942 content: "";
16943 position: absolute;
16944 left: 50%;
16945 bottom: -4px;
16946 width: 6px;
16947 height: 6px;
16948 background: #464646;
16949 transform: rotate(45deg) translateX(-50%);
16950 }
16951 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug .inline-input .copy-slug-url.copy-confirmed .copyed {
16952 top: -25px;
16953 opacity: 1;
16954 visibility: visible;
16955 }
16956 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug input[type=text] {
16957 border: 0;
16958 height: 34px;
16959 }
16960 .wpfnl-step-settings-drawer .steps-url-slug .steps-url-slug-wrapper .step-slug input[type=text]:disabled {
16961 cursor: not-allowed;
16962 }
16963 .wpfnl-step-settings-drawer .url-slug-save-btn {
16964 display: flex;
16965 justify-content: flex-end;
16966 gap: 14px;
16967 margin-top: 30px;
16968 }
16969 .wpfnl-step-settings-drawer .url-slug-save-btn .btn-default {
16970 height: 40px;
16971 line-height: 39px;
16972 padding: 0 20px;
16973 }
16974 .wpfnl-step-settings-drawer .url-slug-save-btn .btn-default.cancel {
16975 border: 1px solid #E4E6EB;
16976 background: transparent;
16977 min-width: auto;
16978 color: #3C3F47;
16979 }
16980 .wpfnl-step-settings-drawer .url-slug-save-btn .btn-default .wpfnl-loader {
16981 display: inline-block;
16982 position: relative;
16983 top: 3px;
16984 }
16985 .wpfnl-step-settings-drawer .inline-url-slug {
16986 display: flex;
16987 flex-flow: row wrap;
16988 align-items: flex-start;
16989 gap: 20px;
16990 padding-bottom: 24px;
16991 }
16992 .wpfnl-step-settings-drawer .inline-url-slug .steps-url-slug-wrapper {
16993 background: transparent;
16994 border: none;
16995 border-radius: 0;
16996 padding: 0;
16997 display: flex;
16998 gap: 20px;
16999 width: calc(100% - 150px);
17000 }
17001 .wpfnl-step-settings-drawer .inline-url-slug .steps-url-slug-wrapper .field-group {
17002 margin-bottom: 0;
17003 flex: 1;
17004 }
17005 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn {
17006 display: block;
17007 margin-top: 0;
17008 position: relative;
17009 top: 20px;
17010 }
17011 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn .btn-default {
17012 padding: 0 15px;
17013 width: 130px;
17014 height: 36px;
17015 line-height: 35px;
17016 }
17017 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn .btn-default.cancel {
17018 display: none;
17019 }
17020 .wpfnl-step-settings-drawer .inline-url-slug .url-slug-save-btn .btn-default .wpfnl-loader {
17021 display: inline-block;
17022 position: relative;
17023 top: 3px;
17024 }
17025 .wpfnl-step-settings-drawer .general-settings-content {
17026 padding: 0;
17027 }
17028 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-box {
17029 background: #FFFFFF;
17030 border-radius: 10px;
17031 border: 1px solid #EEF0F3;
17032 padding: 24px;
17033 box-shadow: none;
17034 margin-bottom: 6px;
17035 }
17036 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper {
17037 margin-bottom: 20px;
17038 }
17039 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper:last-child {
17040 margin-bottom: 0;
17041 }
17042 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper > label {
17043 display: block;
17044 margin-bottom: 0;
17045 font-size: 16px;
17046 font-weight: 500;
17047 color: #363B4E;
17048 line-height: 1.4;
17049 }
17050 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-field-wrapper.custom-script-field {
17051 align-items: flex-start;
17052 }
17053 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields {
17054 position: relative;
17055 max-width: 100%;
17056 }
17057 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea,
17058 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields input[type=text] {
17059 width: 100%;
17060 height: 44px;
17061 padding: 8px 16px;
17062 font-size: 15px;
17063 color: #23282D;
17064 background: #FFFFFF;
17065 transition: all 0.3s ease;
17066 border-radius: 10px;
17067 border: 1px solid #EBEDF0;
17068 outline: none;
17069 }
17070 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea:focus,
17071 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields input[type=text]:focus {
17072 border-color: #6E42D3;
17073 }
17074 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea::placeholder,
17075 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields input[type=text]::placeholder {
17076 color: #7A8B9A;
17077 }
17078 .wpfnl-step-settings-drawer .general-settings-content .wpfnl-fields textarea {
17079 line-height: 1.5;
17080 resize: vertical;
17081 min-height: 100px;
17082 height: auto;
17083 }
17084 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper {
17085 display: flex;
17086 align-items: center;
17087 border: 1px solid #EBEDF0;
17088 border-radius: 10px;
17089 transition: all 0.3s ease;
17090 }
17091 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper:focus-within {
17092 border-color: #6E42D3;
17093 box-shadow: none;
17094 }
17095 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper input[type=text] {
17096 flex: 1;
17097 border: none;
17098 box-shadow: none !important;
17099 }
17100 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper input[type=text]:focus {
17101 box-shadow: none !important;
17102 }
17103 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url {
17104 width: 44px;
17105 height: 44px;
17106 display: flex;
17107 align-items: center;
17108 justify-content: center;
17109 cursor: pointer;
17110 border: none;
17111 border-left: 1px solid #EBEDF0;
17112 background: #FFFFFF;
17113 outline: none;
17114 position: relative;
17115 flex-shrink: 0;
17116 border-radius: 0 10px 10px 0;
17117 }
17118 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url .copyed {
17119 background-color: #464646;
17120 position: absolute;
17121 right: 0;
17122 top: -32px;
17123 font-size: 11px;
17124 font-weight: 500;
17125 color: #fff;
17126 line-height: 1;
17127 padding: 6px 8px;
17128 border-radius: 4px;
17129 transition: all 0.3s ease;
17130 opacity: 0;
17131 visibility: hidden;
17132 white-space: nowrap;
17133 }
17134 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url .copyed:before {
17135 content: "";
17136 position: absolute;
17137 left: 50%;
17138 bottom: -4px;
17139 width: 6px;
17140 height: 6px;
17141 background: #464646;
17142 transform: rotate(45deg) translateX(-50%);
17143 }
17144 .wpfnl-step-settings-drawer .general-settings-content .slug-input-wrapper .copy-slug-url.copy-confirmed .copyed {
17145 opacity: 1;
17146 visibility: visible;
17147 }
17148 .wpfnl-step-settings-drawer .general-settings-content .field-description {
17149 margin: 8px 0 0;
17150 font-size: 12px;
17151 color: #7A8B9A;
17152 line-height: 1.5;
17153 }
17154 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer {
17155 padding-top: 20px;
17156 display: flex;
17157 justify-content: flex-end;
17158 }
17159 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update {
17160 min-width: 120px;
17161 height: 40px;
17162 padding: 0 24px;
17163 background: #6E42D3;
17164 color: #fff;
17165 border: none;
17166 border-radius: 6px;
17167 font-size: 14px;
17168 font-weight: 500;
17169 cursor: pointer;
17170 transition: background-color 0.2s ease;
17171 display: inline-flex;
17172 align-items: center;
17173 justify-content: center;
17174 gap: 8px;
17175 }
17176 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update:hover {
17177 background: rgb(89.208583691, 44.6042918455, 191.5957081545);
17178 }
17179 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update:active {
17180 background: rgb(81.5038626609, 40.7519313305, 175.0480686695);
17181 }
17182 .wpfnl-step-settings-drawer .general-settings-content .settings-content__footer .btn-default.update .wpfnl-loader {
17183 display: inline-block;
17184 width: 14px;
17185 height: 14px;
17186 }
17187
17188 .wpfunnels_page_wpfnl-ai-funnel .wpfnl-ai-funnel-admin-page .wpfnl-dashboard__nav {
17189 border-bottom: 1px solid #ebedf0;
17190 }
17191 .wpfunnels_page_wpfnl-ai-funnel .wpfnl-ai-funnel-admin-page .wpfnl-dashboard__nav ul {
17192 margin: 0;
17193 }
17194 .wpfunnels_page_wpfnl-ai-funnel .wpfnl-ai-funnel-admin-page .wpfnl-dashboard__nav ul .wpfnl-dashboard__nav-li.active:after {
17195 bottom: -4px;
17196 }
17197 .wpfunnels_page_wpfnl-ai-funnel .wpfnl-ai-funnel-admin-page .dashboard-nav__content {
17198 width: 100%;
17199 margin: 0;
17200 }
17201
17202 .step-condition-drawer {
17203 width: 700px;
17204 }
17205 .step-condition-drawer.show-drawer {
17206 z-index: 2;
17207 }
17208 .step-condition-drawer .drawer-header {
17209 padding: 16px 30px 16px;
17210 border-bottom: 1px solid #EEF0F3;
17211 }
17212 .step-condition-drawer .drawer-body {
17213 padding: 24px 30px;
17214 }
17215 .step-condition-drawer .enable-disable-switcher {
17216 display: flex;
17217 align-items: center;
17218 gap: 10px;
17219 margin-bottom: 24px;
17220 }
17221 .step-condition-drawer .enable-disable-switcher .switcher-label {
17222 color: #363B4E;
17223 font-size: 14px;
17224 font-weight: 600;
17225 line-height: 1;
17226 }
17227 .step-condition-drawer .enable-disable-switcher .wpfnl-switcher label {
17228 width: 28px;
17229 }
17230 .step-condition-drawer .enable-disable-switcher .wpfnl-switcher input[type=checkbox]:checked + label:after {
17231 margin-left: 12px;
17232 }
17233 .step-condition-drawer .enable-disable-switcher .wpfnl-loader {
17234 display: block;
17235 margin: 0;
17236 }
17237 .step-condition-drawer .no-condition-stat {
17238 border-radius: 10px;
17239 border: 1px solid #EEF0F3;
17240 height: 360px;
17241 padding: 20px;
17242 display: flex;
17243 flex-flow: column;
17244 align-items: center;
17245 justify-content: center;
17246 gap: 9px;
17247 }
17248 .step-condition-drawer .wpfnl-field-wrapper {
17249 gap: 28px;
17250 }
17251 .step-condition-drawer .wpfnl-field-wrapper > label {
17252 width: 122px;
17253 padding-right: 0;
17254 }
17255 .step-condition-drawer .true-condition-wapper {
17256 border-radius: 10px;
17257 border: 1px solid #EEF0F3;
17258 background: #F6F5FA;
17259 padding: 20px;
17260 position: relative;
17261 }
17262 .step-condition-drawer .true-condition-wapper .true-lable {
17263 color: #00D44E;
17264 font-size: 15px;
17265 font-weight: 600;
17266 line-height: 1;
17267 margin-bottom: 12px;
17268 display: block;
17269 }
17270 .step-condition-drawer .true-condition-wapper .and-condition-group {
17271 border-radius: 10px;
17272 background: #FFF;
17273 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
17274 padding: 20px;
17275 margin-bottom: 36px;
17276 position: relative;
17277 }
17278 .step-condition-drawer .true-condition-wapper .and-condition-group:before {
17279 content: "OR";
17280 position: absolute;
17281 top: -23px;
17282 left: 0;
17283 color: #7A8B9A;
17284 font-size: 14px;
17285 font-weight: 400;
17286 line-height: 1;
17287 }
17288 .step-condition-drawer .true-condition-wapper .and-condition-group:nth-child(2)::before {
17289 display: none;
17290 }
17291 .step-condition-drawer .true-condition-wapper .and-condition-group:last-child {
17292 margin-bottom: 16px;
17293 }
17294 .step-condition-drawer .true-condition-wapper .condition-single-row {
17295 display: flex;
17296 flex-flow: row wrap;
17297 align-items: center;
17298 gap: 10px;
17299 position: relative;
17300 padding: 10px 0;
17301 }
17302 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child {
17303 padding-top: 0;
17304 }
17305 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child .condition-connection {
17306 display: none;
17307 }
17308 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child {
17309 padding-top: 0;
17310 }
17311 .step-condition-drawer .true-condition-wapper .condition-single-row:first-child .condition-connection {
17312 display: none;
17313 }
17314 .step-condition-drawer .true-condition-wapper .condition-single-row .single-condition {
17315 width: calc(33.3333333333% - 33px);
17316 }
17317 .step-condition-drawer .true-condition-wapper .condition-single-row .input-field {
17318 color: #363B4E;
17319 padding: 11px 14px 10px;
17320 max-width: 240px;
17321 min-width: auto;
17322 height: auto;
17323 width: 100%;
17324 border-radius: 6px;
17325 border: 1px solid #EEF0F3;
17326 background: #FFF;
17327 line-height: 1;
17328 }
17329 .step-condition-drawer .true-condition-wapper .condition-single-row .delete-condition {
17330 border: 1px solid #EEF0F3;
17331 width: 40px;
17332 height: 40px;
17333 display: flex;
17334 align-items: center;
17335 justify-content: center;
17336 border-radius: 7px;
17337 cursor: pointer;
17338 background: transparent;
17339 }
17340 .step-condition-drawer .true-condition-wapper .condition-single-row .condition-connection {
17341 width: 30px;
17342 height: calc(100% + 1px);
17343 border: 1px solid #EEF0F3;
17344 border-left: none;
17345 display: block;
17346 position: absolute;
17347 bottom: 50%;
17348 right: 0;
17349 }
17350 .step-condition-drawer .true-condition-wapper .condition-single-row .condition-connection:before {
17351 content: "&";
17352 border: 1px solid #EEF0F3;
17353 width: 22px;
17354 height: 22px;
17355 position: absolute;
17356 top: 50%;
17357 right: -11px;
17358 transform: translateY(-50%);
17359 background: #fff;
17360 border-radius: 100%;
17361 display: flex;
17362 flex-flow: column;
17363 align-items: center;
17364 justify-content: center;
17365 font-weight: 500;
17366 color: #6E42D3;
17367 }
17368 .step-condition-drawer .true-condition-wapper .condition-single-row.only-one .single-condition {
17369 width: calc(33.3333333333% - 7px);
17370 }
17371 .step-condition-drawer .true-condition-wapper .condition-single-row.only-one .delete-condition {
17372 display: none;
17373 }
17374 .step-condition-drawer .true-condition-wapper .add-and-condition {
17375 border: none;
17376 display: flex;
17377 align-items: center;
17378 color: #6E42D3;
17379 font-size: 14px;
17380 font-weight: 600;
17381 line-height: 1;
17382 gap: 3px;
17383 background: transparent;
17384 cursor: pointer;
17385 margin-top: 10px;
17386 }
17387 .step-condition-drawer .true-condition-wapper .or-condition-box {
17388 border-radius: 10px;
17389 border: 1px dashed #C1C6CD;
17390 padding: 15px 16px;
17391 }
17392 .step-condition-drawer .true-condition-wapper .or-condition-box button {
17393 border-radius: 100px;
17394 border: 1px solid #6E42D3;
17395 background: #FFF;
17396 box-shadow: 0px 20px 16px 0px rgba(189, 193, 200, 0.2);
17397 padding: 8px 16px 6px;
17398 display: flex;
17399 align-items: center;
17400 gap: 3px;
17401 margin: 0 auto;
17402 color: #6E42D3;
17403 font-size: 14px;
17404 font-weight: 600;
17405 line-height: 1;
17406 cursor: pointer;
17407 }
17408 .step-condition-drawer .true-condition-wapper .or-condition-box button svg {
17409 position: relative;
17410 top: -1px;
17411 }
17412 .step-condition-drawer .true-condition-wapper .next-step-box {
17413 padding-top: 20px;
17414 margin-top: 20px;
17415 position: relative;
17416 }
17417 .step-condition-drawer .true-condition-wapper .next-step-box:before {
17418 content: "";
17419 position: absolute;
17420 top: 0;
17421 left: -20px;
17422 width: calc(100% + 40px);
17423 height: 1px;
17424 background: #E8E6F1;
17425 }
17426 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox {
17427 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
17428 border: none;
17429 }
17430 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox .selected-option {
17431 padding: 14px 30px 12px 14px;
17432 }
17433 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button {
17434 border: none;
17435 background: transparent;
17436 color: #6E42D3;
17437 font-size: 14px;
17438 font-weight: 400;
17439 line-height: 1;
17440 letter-spacing: -0.14px;
17441 box-shadow: none;
17442 outline: none;
17443 cursor: pointer;
17444 }
17445 .step-condition-drawer .true-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button svg {
17446 margin-left: 1px;
17447 }
17448 .step-condition-drawer .add-step-dropdown {
17449 width: 100%;
17450 padding: 8px;
17451 position: absolute;
17452 left: 0;
17453 top: calc(100% + 8px);
17454 z-index: 1;
17455 border-radius: 6px;
17456 border: 1px solid #EBEDF0;
17457 background: #FFF;
17458 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
17459 height: 128px;
17460 opacity: 0;
17461 visibility: hidden;
17462 transition: all 0.3s ease;
17463 display: flex;
17464 flex-flow: column;
17465 align-items: center;
17466 justify-content: center;
17467 gap: 8px;
17468 }
17469 .step-condition-drawer .add-step-dropdown p {
17470 letter-spacing: -0.14px;
17471 }
17472 .step-condition-drawer .add-step-dropdown .btn-default {
17473 padding: 11px 22px 10px;
17474 height: auto;
17475 line-height: 1;
17476 min-width: auto;
17477 border-radius: 8px;
17478 font-size: 12px;
17479 }
17480 .step-condition-drawer .wpfnl-selectbox.show-options .add-step-dropdown {
17481 opacity: 1;
17482 visibility: visible;
17483 }
17484 .step-condition-drawer .false-condition-wapper {
17485 border-radius: 10px;
17486 border: 1px solid #EEF0F3;
17487 background: #F6F5FA;
17488 margin-top: 20px;
17489 position: relative;
17490 }
17491 .step-condition-drawer .false-condition-wapper .false-lable {
17492 color: #FF5155;
17493 font-size: 15px;
17494 font-weight: 600;
17495 line-height: 1;
17496 padding: 14px 20px;
17497 }
17498 .step-condition-drawer .false-condition-wapper .next-step-box {
17499 padding: 20px;
17500 position: relative;
17501 border-top: 1px solid #E8E6F1;
17502 }
17503 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox {
17504 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
17505 border: none;
17506 }
17507 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .selected-option {
17508 padding: 14px 30px 12px 14px;
17509 }
17510 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button {
17511 border: none;
17512 background: transparent;
17513 color: #6E42D3;
17514 font-size: 14px;
17515 font-weight: 400;
17516 line-height: 1;
17517 letter-spacing: -0.14px;
17518 box-shadow: none;
17519 outline: none;
17520 cursor: pointer;
17521 }
17522 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button svg {
17523 margin-left: 1px;
17524 }
17525 .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .selectable-options {
17526 bottom: calc(100% + 8px);
17527 top: inherit;
17528 box-shadow: 0px 10px 22px 0px rgba(73, 59, 104, 0.1);
17529 }
17530 .step-condition-drawer .save-btn-area {
17531 margin-top: 30px;
17532 display: flex;
17533 flex-flow: row wrap;
17534 align-items: center;
17535 justify-content: flex-end;
17536 gap: 14px;
17537 }
17538 .step-condition-drawer .save-btn-area .wpfnl-alert {
17539 display: block;
17540 }
17541 .step-condition-drawer .save-btn-area .btn-default {
17542 min-width: auto;
17543 line-height: 1;
17544 padding: 10px 19px 9px;
17545 height: 40px;
17546 border: 1px solid #6E42D3;
17547 }
17548 .step-condition-drawer .save-btn-area .btn-default.cancel {
17549 background-color: transparent;
17550 border-color: #E4E6EB;
17551 color: #3C3F47;
17552 letter-spacing: -0.14px;
17553 font-weight: 600;
17554 }
17555 .step-condition-drawer .save-btn-area .btn-default .wpfnl-loader {
17556 display: inline-block;
17557 position: relative;
17558 top: 2px;
17559 }
17560 .step-condition-drawer .condition-disabled .false-condition-wapper,
17561 .step-condition-drawer .condition-disabled .true-condition-wapper {
17562 opacity: 0.3;
17563 }
17564 .step-condition-drawer .condition-disabled .false-condition-wapper:before,
17565 .step-condition-drawer .condition-disabled .true-condition-wapper:before {
17566 content: "";
17567 position: absolute;
17568 left: 0;
17569 top: 0;
17570 width: 100%;
17571 height: 100%;
17572 z-index: 2;
17573 border-radius: 10px;
17574 cursor: not-allowed;
17575 }
17576
17577 .reconfigure-condition-modal .close-alert {
17578 width: 38px;
17579 height: 38px;
17580 box-shadow: 0px 2px 2px #DADADA;
17581 }
17582 .reconfigure-condition-modal .close-alert svg {
17583 width: 13px;
17584 height: 13px;
17585 }
17586 .reconfigure-condition-modal .close-alert svg path {
17587 stroke-width: 2px;
17588 }
17589 .reconfigure-condition-modal .wpfnl-delete-confirm-body {
17590 padding: 28px 26px 30px;
17591 }
17592 .reconfigure-condition-modal .wpfnl-delete-confirm-body h3 svg path {
17593 fill: none;
17594 }
17595 .reconfigure-condition-modal .wpfnl-delete-confirm-body p {
17596 color: #9398A5;
17597 margin-top: 7px;
17598 max-width: 350px;
17599 }
17600 .reconfigure-condition-modal .wpfnl-delete-confirm-btn {
17601 padding: 20px 24px;
17602 }
17603 .reconfigure-condition-modal .wpfnl-delete-confirm-btn .btn-default {
17604 padding: 0 16px;
17605 }
17606 .reconfigure-condition-modal .wpfnl-delete-confirm-btn .btn-default.cancel:hover {
17607 background-color: transparent;
17608 }
17609 .reconfigure-condition-modal .wpfnl-delete-confirm-btn .btn-default.yes {
17610 box-shadow: 0px 10px 16px 0px rgba(189, 193, 200, 0.5);
17611 }
17612
17613 .create-condition-drawer .condition-form-loader {
17614 position: absolute;
17615 left: 0;
17616 top: 2px;
17617 background: white;
17618 width: 100%;
17619 height: calc(100% - 2px);
17620 z-index: 2;
17621 text-align: center;
17622 padding-top: 110px;
17623 font-size: 18px;
17624 color: #363B4E;
17625 font-weight: 500;
17626 }
17627 .create-condition-drawer .condition-form-loader.drawer-loaded {
17628 display: none;
17629 }
17630
17631 .condition-form-wrapper {
17632 padding: 30px 0;
17633 }
17634 .condition-form-wrapper .single-condition {
17635 display: flex;
17636 flex-flow: row wrap;
17637 align-items: center;
17638 justify-content: flex-start;
17639 padding-top: 55px;
17640 width: 100%;
17641 max-width: 726px;
17642 position: relative;
17643 }
17644 .condition-form-wrapper .single-condition:before {
17645 content: "";
17646 position: absolute;
17647 right: 16px;
17648 bottom: 17px;
17649 width: 2px;
17650 height: 100%;
17651 background: #E5E8F3;
17652 z-index: 0;
17653 }
17654 .condition-form-wrapper .single-condition:first-child:before {
17655 display: none;
17656 }
17657 .condition-form-wrapper .single-condition .condition-number {
17658 align-self: flex-end;
17659 margin-bottom: 6px;
17660 color: #363B4E;
17661 font-weight: 500;
17662 font-size: 16px;
17663 }
17664 .condition-form-wrapper .single-condition .single-condition-filed {
17665 margin-left: 20px;
17666 }
17667 .condition-form-wrapper .single-condition .single-condition-filed label {
17668 font-size: 14px;
17669 line-height: 16px;
17670 color: #363B4E;
17671 text-transform: capitalize;
17672 margin-bottom: 10px;
17673 display: block;
17674 }
17675 .condition-form-wrapper .single-condition .single-condition-filed input[type=text],
17676 .condition-form-wrapper .single-condition .single-condition-filed input[type=number],
17677 .condition-form-wrapper .single-condition .single-condition-filed input[type=email],
17678 .condition-form-wrapper .single-condition .single-condition-filed select {
17679 height: 40px;
17680 width: 190px;
17681 min-width: auto;
17682 transition: all 0.3s ease;
17683 }
17684 .condition-form-wrapper .single-condition .single-condition-filed input[type=text] option[disabled],
17685 .condition-form-wrapper .single-condition .single-condition-filed input[type=number] option[disabled],
17686 .condition-form-wrapper .single-condition .single-condition-filed input[type=email] option[disabled],
17687 .condition-form-wrapper .single-condition .single-condition-filed select option[disabled] {
17688 color: rgba(122, 139, 154, 0.631372549);
17689 }
17690 .condition-form-wrapper .single-condition .single-condition-filed input[type=text]:focus,
17691 .condition-form-wrapper .single-condition .single-condition-filed input[type=number]:focus,
17692 .condition-form-wrapper .single-condition .single-condition-filed input[type=email]:focus,
17693 .condition-form-wrapper .single-condition .single-condition-filed select:focus {
17694 border-color: #6E42D3;
17695 }
17696 .condition-form-wrapper .single-condition .single-condition-filed select {
17697 padding-right: 27px;
17698 }
17699 .condition-form-wrapper .single-condition .condition-repeater {
17700 align-self: flex-end;
17701 margin-bottom: 0px;
17702 margin-left: 20px;
17703 position: relative;
17704 width: 70px;
17705 }
17706 .condition-form-wrapper .single-condition .condition-repeater span {
17707 position: relative;
17708 background: #fff;
17709 cursor: pointer;
17710 cursor: pointer;
17711 width: 24px;
17712 height: 24px;
17713 display: inline-block;
17714 }
17715 .condition-form-wrapper .single-condition .condition-repeater span svg {
17716 display: block;
17717 position: relative;
17718 z-index: 1;
17719 }
17720 .condition-form-wrapper .single-condition .condition-repeater .add-condition:before {
17721 content: "";
17722 position: absolute;
17723 left: 22px;
17724 top: 11px;
17725 background: #E5E8F3;
17726 width: 38px;
17727 height: 2px;
17728 z-index: 0;
17729 }
17730 .condition-form-wrapper .single-condition .condition-repeater .add-condition .wpfnl-dropdown {
17731 right: -15px;
17732 top: 50px;
17733 width: 100px;
17734 }
17735 .condition-form-wrapper .single-condition .condition-repeater .add-condition .wpfnl-dropdown li a {
17736 text-transform: uppercase;
17737 }
17738 .condition-form-wrapper .single-condition .condition-repeater .add-condition .wpfnl-dropdown.show-condition {
17739 top: 37px;
17740 opacity: 1;
17741 visibility: visible;
17742 }
17743 .condition-form-wrapper .single-condition .condition-repeater .delete-condition {
17744 position: absolute;
17745 bottom: 4px;
17746 right: -2px;
17747 opacity: 0;
17748 visibility: hidden;
17749 }
17750 .condition-form-wrapper .single-condition .condition-repeater:hover .delete-condition {
17751 opacity: 1;
17752 visibility: visible;
17753 }
17754 .condition-form-wrapper .single-condition .condition-symbol {
17755 position: absolute;
17756 top: calc(50% - 14px);
17757 right: 7px;
17758 transform: translateY(-50%);
17759 }
17760 .condition-form-wrapper .single-condition .condition-symbol span {
17761 width: 22px;
17762 height: 22px;
17763 border: 2px solid #E5E8F3;
17764 color: #6E42D3;
17765 border-radius: 100%;
17766 font-size: 12px;
17767 font-weight: 500;
17768 background: #fff;
17769 display: block;
17770 padding: 1px 2px;
17771 text-align: center;
17772 }
17773 .condition-form-wrapper .single-condition:first-child {
17774 padding-top: 0;
17775 }
17776 .condition-form-wrapper .single-condition:first-child .condition-repeater .delete-condition {
17777 display: none;
17778 }
17779 .condition-form-wrapper .single-condition:first-child .condition-symbol {
17780 display: none;
17781 }
17782 .condition-form-wrapper .only-one-condition .condition-repeater .add-condition::before {
17783 display: none;
17784 }
17785 .condition-form-wrapper .condition-form__footer {
17786 border-top: 1px solid #E2E5ED;
17787 padding: 30px;
17788 margin-top: 30px;
17789 display: flex;
17790 flex-flow: row wrap;
17791 align-items: center;
17792 justify-content: flex-end;
17793 position: relative;
17794 }
17795 .condition-form-wrapper .condition-form__footer .wpfnl-alert {
17796 display: block;
17797 margin-right: 20px;
17798 }
17799 .condition-form-wrapper .condition-form__footer .btn-default .wpfnl-loader {
17800 position: relative;
17801 top: 3px;
17802 display: inline-block;
17803 }
17804
17805 @media only screen and (max-width: 991px) {
17806 .condition-form-wrapper .single-condition {
17807 max-width: 666px;
17808 }
17809 .condition-form-wrapper .single-condition .single-condition-filed input[type=text],
17810 .condition-form-wrapper .single-condition .single-condition-filed input[type=number],
17811 .condition-form-wrapper .single-condition .single-condition-filed input[type=email],
17812 .condition-form-wrapper .single-condition .single-condition-filed select {
17813 width: 170px;
17814 }
17815 }
17816 .wpfnl-drawflow-window .wpfnl-analytics {
17817 position: fixed;
17818 top: 30px;
17819 right: 0px;
17820 background: #F6F5FA;
17821 height: calc(100% - 30px);
17822 width: calc(100% - 160px);
17823 z-index: 4;
17824 padding: 40px 25px;
17825 overflow: auto;
17826 }
17827 .wpfnl-drawflow-window .wpfnl-analytics::-webkit-scrollbar {
17828 width: 5px;
17829 height: 5px;
17830 }
17831 .wpfnl-drawflow-window .wpfnl-analytics::-webkit-scrollbar-track {
17832 background: #f2f5f8;
17833 }
17834 .wpfnl-drawflow-window .wpfnl-analytics::-webkit-scrollbar-thumb {
17835 background-color: #CBCBCB;
17836 border-radius: 20px;
17837 }
17838 .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
17839 position: fixed;
17840 top: 32px;
17841 left: 160px;
17842 width: 100%;
17843 height: 100%;
17844 background: #f6f5fa;
17845 border-radius: 0;
17846 z-index: 9;
17847 display: flex;
17848 flex-flow: column;
17849 align-items: center;
17850 justify-content: center;
17851 }
17852 .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader .wpfnl-loader {
17853 display: block;
17854 width: 40px;
17855 height: 40px;
17856 }
17857 .wpfnl-drawflow-window .wpfnl-analytics .overlay-click {
17858 position: fixed;
17859 left: 0;
17860 top: 0;
17861 background: rgba(255, 255, 255, 0);
17862 width: 100%;
17863 height: 100%;
17864 z-index: 2;
17865 display: none;
17866 }
17867 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper {
17868 width: 100%;
17869 max-width: 1320px;
17870 margin: 0 auto;
17871 position: relative;
17872 }
17873 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper.pro-active {
17874 padding: 20px;
17875 }
17876 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper:hover .hoverlay {
17877 visibility: visible;
17878 opacity: 1;
17879 }
17880 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay {
17881 visibility: hidden;
17882 opacity: 0;
17883 background: rgba(246, 248, 250, 0.6);
17884 display: flex;
17885 flex-flow: column;
17886 justify-content: center;
17887 align-items: center;
17888 transition: all 0.3s ease;
17889 width: calc(100% - 10px);
17890 height: calc(100% - 70px);
17891 left: 5px;
17892 bottom: 0;
17893 position: absolute;
17894 z-index: 9;
17895 padding: 0 15px;
17896 border-radius: 10px;
17897 border: 1px solid #DDDDDD;
17898 }
17899 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn {
17900 position: fixed;
17901 top: 50%;
17902 left: 50%;
17903 transform: translate(-50%, -50%);
17904 z-index: 9999;
17905 background: none;
17906 border: none;
17907 outline: none;
17908 }
17909 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a {
17910 display: flex;
17911 align-items: center;
17912 justify-content: center;
17913 gap: 10px;
17914 background: #2FCF5C;
17915 padding: 15px 20px;
17916 line-height: 17px;
17917 height: auto;
17918 }
17919 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a svg circle {
17920 fill: #FFF;
17921 }
17922 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a svg path {
17923 fill: #2FCF5C;
17924 }
17925 .wpfnl-drawflow-window .wpfnl-analytics .analytics-wrapper .hoverlay .wpfnl-upgrade-btn a:hover {
17926 background: #1a8939;
17927 }
17928 .wpfnl-drawflow-window .wpfnl-analytics .analytics-body {
17929 display: flex;
17930 flex-flow: column;
17931 gap: 24px;
17932 }
17933 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header {
17934 display: flex;
17935 align-items: center;
17936 justify-content: space-between;
17937 margin-bottom: 24px;
17938 }
17939 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-left {
17940 display: flex;
17941 align-items: center;
17942 gap: 10px;
17943 width: 200px;
17944 }
17945 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-left h3 {
17946 font-weight: 600;
17947 font-size: 24px;
17948 color: #363B4E;
17949 }
17950 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .backto-steps {
17951 background: #FFFFFF;
17952 border-radius: 10px;
17953 height: 38px;
17954 width: 38px;
17955 display: flex;
17956 flex-flow: column;
17957 align-items: center;
17958 justify-content: center;
17959 cursor: pointer;
17960 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
17961 }
17962 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right {
17963 display: flex;
17964 flex-flow: row wrap;
17965 align-items: center;
17966 justify-content: flex-end;
17967 gap: 14px;
17968 width: calc(80% - 200px);
17969 position: relative;
17970 z-index: 3;
17971 }
17972 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .reset-analytics a {
17973 display: flex;
17974 justify-content: center;
17975 align-items: center;
17976 padding: 8px 15px;
17977 min-width: 100px;
17978 border-radius: 100px;
17979 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
17980 background: #fff;
17981 background-size: 11px 11px;
17982 border: none;
17983 }
17984 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .reset-analytics a .reset-icon svg {
17985 width: 18px;
17986 margin-top: 3px;
17987 }
17988 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .reset-analytics a .reset-text {
17989 font-weight: 600;
17990 color: #000;
17991 font-size: 14px;
17992 line-height: 1;
17993 padding-left: 8px;
17994 }
17995 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .download-analytics a {
17996 display: flex;
17997 justify-content: center;
17998 align-items: center;
17999 padding: 11px 15px;
18000 min-width: 58px;
18001 border-radius: 100px;
18002 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
18003 background: #fff;
18004 background-size: 11px 11px;
18005 border: none;
18006 }
18007 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right .download-analytics a .download-icon svg {
18008 width: 18px;
18009 margin-top: 3px;
18010 }
18011 .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right select {
18012 border-radius: 100px;
18013 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
18014 border: none;
18015 height: auto;
18016 padding: 14px 40px 12px 20px;
18017 min-width: auto;
18018 color: #2D3149;
18019 font-size: 14px;
18020 font-weight: 600;
18021 line-height: 1;
18022 width: auto;
18023 appearance: none;
18024 background: #fff url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjgiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==) no-repeat right 15px top 54%;
18025 background-size: 11px 11px;
18026 }
18027 .wpfnl-drawflow-window .wpfnl-analytics .analytics-box {
18028 border-radius: 10px;
18029 background: #FFF;
18030 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
18031 padding: 19px 20px 19px;
18032 position: relative;
18033 }
18034 .wpfnl-drawflow-window .wpfnl-analytics .analytics-box .analytics-title {
18035 color: #2D3149;
18036 font-size: 18px;
18037 font-weight: 600;
18038 line-height: 1;
18039 }
18040 .wpfnl-drawflow-window .wpfnl-analytics .loader-wrapper {
18041 position: absolute;
18042 top: 0;
18043 left: 0;
18044 width: 100%;
18045 height: 100%;
18046 border-radius: 10px;
18047 background: #FFF;
18048 z-index: 2;
18049 display: flex;
18050 flex-flow: column;
18051 align-items: center;
18052 justify-content: center;
18053 }
18054 .wpfnl-drawflow-window .wpfnl-analytics .loader-wrapper .wpfnl-loader {
18055 display: block;
18056 width: 20px;
18057 height: 20px;
18058 }
18059 .wpfnl-drawflow-window .wpfnl-analytics .no-data-notice {
18060 width: 100%;
18061 height: 338px;
18062 display: flex;
18063 flex-flow: column;
18064 align-items: center;
18065 justify-content: center;
18066 }
18067 .wpfnl-drawflow-window .wpfnl-analytics .no-data-notice p {
18068 color: #2d3149;
18069 font-weight: 500;
18070 font-size: 16px;
18071 }
18072
18073 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator {
18074 display: flex;
18075 align-items: center;
18076 justify-content: center;
18077 gap: 24px;
18078 }
18079 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator {
18080 font-weight: 400;
18081 font-size: 14px;
18082 line-height: 1.3;
18083 color: #9398a5;
18084 position: relative;
18085 display: flex;
18086 align-items: center;
18087 }
18088 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator:last-child {
18089 margin-right: 0;
18090 }
18091 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator:before {
18092 content: "";
18093 width: 10px;
18094 height: 10px;
18095 background: #6E42D3;
18096 display: inline-block;
18097 border-radius: 50px;
18098 margin-right: 8px;
18099 position: relative;
18100 top: -1px;
18101 }
18102 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator2:before {
18103 background-color: #F7900A;
18104 }
18105
18106 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .progress-badge {
18107 background: #D1FADF;
18108 color: #12B76A;
18109 padding: 7px 10px 7px 25px;
18110 font-size: 10px;
18111 line-height: 1;
18112 font-weight: 500;
18113 border-radius: 50px;
18114 display: flex;
18115 align-items: center;
18116 gap: 7px;
18117 position: relative;
18118 }
18119 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge svg, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .progress-badge svg {
18120 position: absolute;
18121 left: 6px;
18122 top: 4px;
18123 }
18124 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .downgrade.progress-badge, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .downgrade.progress-badge {
18125 background: #FEE4E2;
18126 color: #F04438;
18127 }
18128 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .downgrade.progress-badge svg, .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .downgrade.progress-badge svg {
18129 left: 9px;
18130 top: 8px;
18131 }
18132
18133 .folded .wpfnl-drawflow-window .wpfnl-analytics {
18134 width: calc(100% - 36px);
18135 }
18136 .folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
18137 left: 36px;
18138 }
18139
18140 .wpfnl-analytics .analytics-card {
18141 display: flex;
18142 flex-flow: row wrap;
18143 gap: 20px;
18144 }
18145 .wpfnl-analytics .analytics-card .analytics-single-card {
18146 width: calc(16.6666666667% - 17px);
18147 }
18148 .wpfnl-analytics .analytics-card .analytics-single-card .icon-area {
18149 display: flex;
18150 align-items: flex-start;
18151 justify-content: space-between;
18152 gap: 10px;
18153 }
18154 .wpfnl-analytics .analytics-card .analytics-single-card .icon-area .icon {
18155 width: 42px;
18156 height: 42px;
18157 border: 1px solid #E4E6EB;
18158 display: flex;
18159 flex-flow: column;
18160 align-items: center;
18161 justify-content: center;
18162 border-radius: 100%;
18163 padding: 5px;
18164 }
18165 .wpfnl-analytics .analytics-card .analytics-single-card .card-title {
18166 color: #9398A5;
18167 font-size: 14px;
18168 line-height: 1.2;
18169 margin-top: 18px;
18170 }
18171 .wpfnl-analytics .analytics-card .analytics-single-card .card-value {
18172 color: #2D3149;
18173 font-size: 22px;
18174 font-weight: 500;
18175 line-height: 1;
18176 margin-top: 8px;
18177 }
18178
18179 @media only screen and (max-width: 1399px) {
18180 .wpfnl-analytics .analytics-card .analytics-single-card {
18181 width: calc(33.3333333333% - 14px);
18182 }
18183 }
18184 @media only screen and (max-width: 1199px) {
18185 .wpfnl-analytics .analytics-card .analytics-single-card .card-value {
18186 font-size: 20px;
18187 }
18188 }
18189 .wpfnl-analytics .analytics-revenue .no-data-notice {
18190 background: #fcfcff;
18191 border-radius: 10px;
18192 border: 1px solid #F1F0F5;
18193 }
18194 .wpfnl-analytics .analytics-revenue .revenue-box-header {
18195 display: flex;
18196 flex-flow: row wrap;
18197 align-items: center;
18198 justify-content: space-between;
18199 margin-bottom: 27px;
18200 }
18201 .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator2:before {
18202 background-color: #EAE1FF;
18203 }
18204 .wpfnl-analytics .analytics-revenue .revenue-tab-nav {
18205 display: flex;
18206 flex-flow: row wrap;
18207 align-items: center;
18208 gap: 12px;
18209 margin-bottom: -1px;
18210 position: relative;
18211 z-index: 1;
18212 margin-bottom: 12px;
18213 }
18214 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav {
18215 width: calc(20% - 10px);
18216 position: relative;
18217 border: 1px solid rgba(238, 240, 243, 0.8);
18218 border-radius: 8px;
18219 padding: 19px 24px;
18220 cursor: pointer;
18221 }
18222 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav.active {
18223 border-color: rgba(238, 240, 243, 0.8);
18224 background: #FCFCFF;
18225 }
18226 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav.active:before {
18227 display: none;
18228 }
18229 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav:last-child:before {
18230 display: none;
18231 }
18232 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .revenue-value {
18233 font-size: 22px;
18234 font-weight: 500;
18235 color: #2D3149;
18236 line-height: 1;
18237 letter-spacing: -0.6px;
18238 display: flex;
18239 flex-flow: row wrap;
18240 align-items: flex-start;
18241 gap: 10px;
18242 }
18243 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .step-type {
18244 color: #667085;
18245 font-size: 14px;
18246 font-weight: 500;
18247 line-height: 1;
18248 text-transform: capitalize;
18249 margin-top: 7px;
18250 }
18251 .wpfnl-analytics .analytics-revenue .single-tab-content {
18252 border-radius: 8px;
18253 border: 1px solid rgba(238, 240, 243, 0.8);
18254 background: #FCFCFF;
18255 padding: 24px 24px 31px;
18256 }
18257 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label {
18258 position: absolute;
18259 top: 3px;
18260 left: 0;
18261 height: 100%;
18262 width: 100%;
18263 display: flex;
18264 flex-flow: column;
18265 justify-content: space-between;
18266 }
18267 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label {
18268 font-size: 12px;
18269 line-height: 1.2;
18270 color: #9398A5;
18271 display: block;
18272 position: relative;
18273 }
18274 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label:before {
18275 content: "";
18276 position: absolute;
18277 left: 50px;
18278 top: 7px;
18279 width: calc(100% - 50px);
18280 height: 1px;
18281 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");
18282 }
18283 .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label span {
18284 width: 33px;
18285 display: block;
18286 text-align: right;
18287 }
18288 .wpfnl-analytics .analytics-revenue .single-tab-content .barchart-inner-wrapper {
18289 height: 292px;
18290 display: flex;
18291 flex-flow: row wrap;
18292 align-items: flex-end;
18293 justify-content: space-between;
18294 padding: 10px 15px 9px 60px;
18295 gap: 30px;
18296 position: relative;
18297 z-index: 1;
18298 }
18299 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar {
18300 width: 34px;
18301 height: 100%;
18302 position: relative;
18303 display: flex;
18304 flex-flow: row wrap;
18305 align-items: flex-end;
18306 gap: 6px;
18307 }
18308 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip {
18309 padding: 14px 15px;
18310 width: 164px;
18311 position: absolute;
18312 bottom: calc(100% + 8px);
18313 left: 50%;
18314 transform: translateX(-50%);
18315 z-index: 9;
18316 opacity: 0;
18317 visibility: hidden;
18318 transition: all 0.3s ease;
18319 border-radius: 8px;
18320 background: #10052E;
18321 box-shadow: 0px 2px 15px 0px rgba(22, 28, 32, 0.08);
18322 }
18323 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip:before {
18324 content: "";
18325 position: absolute;
18326 left: 50%;
18327 bottom: -5px;
18328 width: 10px;
18329 height: 10px;
18330 background: #10052e;
18331 transform: rotate(45deg);
18332 margin-left: -6px;
18333 }
18334 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip .item {
18335 color: #CDCFD6;
18336 font-size: 13px;
18337 line-height: 1;
18338 margin-bottom: 6px;
18339 }
18340 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip .item:last-child {
18341 margin-bottom: 0;
18342 }
18343 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-tooltip .item b {
18344 color: #fff;
18345 font-weight: 500;
18346 }
18347 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item {
18348 width: 14px;
18349 display: block;
18350 background-color: #EAE1FF;
18351 border-radius: 30px 30px 0 0;
18352 position: relative;
18353 }
18354 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item.indicator1 .bar-tooltip {
18355 left: calc(50% + 11px);
18356 }
18357 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item.indicator2 {
18358 background-color: #6E42D3;
18359 }
18360 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item.indicator2 .bar-tooltip {
18361 left: calc(50% - 9px);
18362 }
18363 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-title {
18364 font-size: 12px;
18365 line-height: 1.2;
18366 color: #9398A5;
18367 position: absolute;
18368 bottom: -20px;
18369 left: 50%;
18370 transform: translateX(-50%);
18371 white-space: nowrap;
18372 transition: all 0.3s ease;
18373 }
18374 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar:hover .bar-item.same-height .bar-tooltip,
18375 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar:hover .bar-item.its-highest .bar-tooltip {
18376 opacity: 1;
18377 visibility: visible;
18378 }
18379 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .barchart-inner-wrapper {
18380 gap: 10px;
18381 }
18382 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .single-bar {
18383 width: 23px;
18384 gap: 6px;
18385 }
18386 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .single-bar .bar-item {
18387 width: 7px;
18388 }
18389 .wpfnl-analytics .analytics-revenue.monthly .single-tab-content .single-bar .bar-title {
18390 transform: translate(-50%, 8px) rotate(-45deg);
18391 }
18392
18393 @media only screen and (max-width: 1199px) {
18394 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav {
18395 width: calc(25% - 9px);
18396 padding: 16px;
18397 }
18398 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .revenue-value {
18399 font-size: 22px;
18400 }
18401 .wpfnl-analytics .analytics-revenue .single-tab-content .barchart-inner-wrapper {
18402 gap: 24px;
18403 }
18404 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar {
18405 width: 20px;
18406 gap: 4px;
18407 }
18408 .wpfnl-analytics .analytics-revenue .single-tab-content .single-bar .bar-item {
18409 width: 8px;
18410 }
18411 }
18412 @media only screen and (max-width: 991px) {
18413 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav {
18414 padding: 13px 13px;
18415 }
18416 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .revenue-value {
18417 font-size: 18px;
18418 }
18419 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .single-nav .step-type {
18420 font-size: 12px;
18421 }
18422 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge {
18423 padding: 5px 8px 4px 21px;
18424 }
18425 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .progress-badge svg {
18426 left: 4px;
18427 top: 1px;
18428 }
18429 .wpfnl-analytics .analytics-revenue .revenue-tab-nav .downgrade.progress-badge svg {
18430 left: 9px;
18431 top: 5px;
18432 }
18433 }
18434 .wpfnl-analytics .analytics-conversion .conversion-box-header {
18435 display: flex;
18436 flex-flow: row wrap;
18437 align-items: center;
18438 justify-content: space-between;
18439 margin-bottom: 15px;
18440 }
18441 .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator {
18442 display: flex;
18443 gap: 8px;
18444 }
18445 .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator button {
18446 border-radius: 8px;
18447 border: 1px solid #F1F0F5;
18448 background: #FFF;
18449 width: 30px;
18450 height: 30px;
18451 display: flex;
18452 align-items: center;
18453 justify-content: center;
18454 flex-flow: column;
18455 cursor: pointer;
18456 }
18457 .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator button:disabled {
18458 opacity: 0.5;
18459 cursor: not-allowed;
18460 }
18461 .wpfnl-analytics .analytics-conversion .conversion-table {
18462 border-radius: 10px;
18463 border: 1px solid #F1F0F5;
18464 background: #FCFCFF;
18465 padding: 40px;
18466 }
18467 .wpfnl-analytics .analytics-conversion .conversion-table-wrapper {
18468 max-width: 1080px;
18469 width: 100%;
18470 margin: 0 auto;
18471 overflow: hidden;
18472 }
18473 .wpfnl-analytics .analytics-conversion .conversion-table-inner {
18474 display: flex;
18475 gap: 30px;
18476 transition: transform 0.5s;
18477 }
18478 .wpfnl-analytics .analytics-conversion .conversion-table-inner.data-center {
18479 justify-content: center;
18480 }
18481 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
18482 border-radius: 10px;
18483 border: 1px solid #F1F0F5;
18484 background: #FFF;
18485 box-shadow: 0px 20px 20px 0px rgba(190, 190, 215, 0.08);
18486 width: calc(20% - 24px);
18487 flex-shrink: 0;
18488 }
18489 .wpfnl-analytics .analytics-conversion .conversion-table-inner .tbl-head {
18490 display: flex;
18491 flex-flow: row wrap;
18492 align-items: center;
18493 justify-content: center;
18494 gap: 7px;
18495 background: #E8F1FF;
18496 border-radius: 10px 10px 0 0;
18497 padding: 8px 10px 6px;
18498 }
18499 .wpfnl-analytics .analytics-conversion .conversion-table-inner .tbl-head .tbl-title {
18500 color: #363B4E;
18501 font-size: 13px;
18502 font-weight: 500;
18503 line-height: 1.1;
18504 width: calc(100% - 60px);
18505 white-space: nowrap;
18506 overflow: hidden;
18507 text-overflow: ellipsis;
18508 display: inline-block;
18509 }
18510 .wpfnl-analytics .analytics-conversion .conversion-table-inner .tbl-head svg {
18511 width: 14px;
18512 display: block;
18513 }
18514 .wpfnl-analytics .analytics-conversion .conversion-table-inner .step-preview-img {
18515 padding: 16px;
18516 }
18517 .wpfnl-analytics .analytics-conversion .conversion-table-inner .step-preview-img svg {
18518 max-width: 100%;
18519 width: 100%;
18520 }
18521 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data {
18522 text-align: center;
18523 }
18524 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper) {
18525 border-bottom: 1px solid #F1F0F5;
18526 color: #7A8B9A;
18527 font-size: 14px;
18528 line-height: 14px;
18529 text-transform: capitalize;
18530 padding: 14px 10px;
18531 }
18532 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper) b {
18533 color: #2D3149;
18534 font-weight: 500;
18535 }
18536 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper):last-child {
18537 border-bottom: 0;
18538 }
18539 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper).conversion-rates b {
18540 color: #12B76A;
18541 }
18542 .wpfnl-analytics .analytics-conversion .conversion-table-inner .conversion-data li:not(.loader-wrapper).bounce-rate b {
18543 color: #F04438;
18544 }
18545 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-checkout .tbl-head {
18546 background: #FDF0E8;
18547 }
18548 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-checkout .tbl-head svg {
18549 position: relative;
18550 top: -1px;
18551 }
18552 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-upsell .tbl-head {
18553 background: #E9F9E8;
18554 }
18555 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-downsell .tbl-head {
18556 background: #FCF0F1;
18557 }
18558 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-thankyou .tbl-head {
18559 background: #E6FAF5;
18560 }
18561 .wpfnl-analytics .analytics-conversion .conversion-table-inner .table-custom .tbl-head {
18562 background: #E0F2F4;
18563 }
18564
18565 @media only screen and (max-width: 1299px) {
18566 .wpfnl-analytics .analytics-conversion .conversion-table {
18567 padding: 20px;
18568 }
18569 .wpfnl-analytics .analytics-conversion .conversion-table-inner {
18570 gap: 20px;
18571 }
18572 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
18573 width: calc(20% - 16px);
18574 }
18575 }
18576 @media only screen and (max-width: 1199px) {
18577 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
18578 width: calc(25% - 15px);
18579 }
18580 }
18581 @media only screen and (max-width: 991px) {
18582 .wpfnl-analytics .analytics-conversion .conversion-table-inner .single-table {
18583 width: calc(33.3333333333% - 14px);
18584 }
18585 }
18586 .wpfnl-analytics .custom-date-range {
18587 display: none;
18588 }
18589 .wpfnl-analytics .filter-selectbox {
18590 background: #fff;
18591 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
18592 padding: 14px 62px 12px 18px;
18593 border-radius: 50px;
18594 position: relative;
18595 cursor: pointer;
18596 display: inline-flex;
18597 flex-flow: row wrap;
18598 align-items: center;
18599 justify-content: flex-start;
18600 }
18601 .wpfnl-analytics .filter-selectbox > ul {
18602 display: flex;
18603 flex-flow: row wrap;
18604 align-items: center;
18605 }
18606 .wpfnl-analytics .filter-selectbox > ul li {
18607 position: relative;
18608 color: #9398A5;
18609 line-height: 1;
18610 font-size: 14px;
18611 font-weight: 500;
18612 }
18613 .wpfnl-analytics .filter-selectbox > ul li:first-child {
18614 margin-right: 24px;
18615 }
18616 .wpfnl-analytics .filter-selectbox > ul li:first-child:before {
18617 content: "";
18618 width: 9px;
18619 height: 1px;
18620 background: #66666d;
18621 position: absolute;
18622 right: -16px;
18623 top: 7px;
18624 }
18625 .wpfnl-analytics .filter-selectbox .calendar-icon {
18626 position: absolute;
18627 right: 0;
18628 top: 0;
18629 height: 100%;
18630 width: 45px;
18631 padding: 10px 15px 10px 14px;
18632 border-left: 1px solid #E4E6EB;
18633 display: flex;
18634 flex-flow: column;
18635 align-items: center;
18636 justify-content: center;
18637 }
18638 .wpfnl-analytics .filter-selectbox .calendar-icon svg {
18639 transition: all 0.3s ease;
18640 }
18641 .wpfnl-analytics .filter-wrapper {
18642 border-bottom: 1px solid #E5E8F3;
18643 padding: 2px 18px;
18644 display: flex;
18645 align-items: center;
18646 justify-content: space-between;
18647 color: #7A8B9A;
18648 width: 100%;
18649 }
18650 .wpfnl-analytics .filter-wrapper input {
18651 background: transparent;
18652 border: none;
18653 font-size: 14px;
18654 color: #9398A5;
18655 font-weight: 400;
18656 width: 87px;
18657 min-width: auto;
18658 cursor: pointer;
18659 padding: 0;
18660 height: 40px;
18661 z-index: 1;
18662 position: relative;
18663 }
18664 .wpfnl-analytics .filter-wrapper input[readonly] {
18665 background: transparent;
18666 cursor: pointer;
18667 }
18668 .wpfnl-analytics .filter-wrapper input:focus {
18669 box-shadow: none;
18670 }
18671 .wpfnl-analytics .filter-wrapper input#to {
18672 margin-right: 5px;
18673 }
18674 .wpfnl-analytics .filter-wrapper .to-date,
18675 .wpfnl-analytics .filter-wrapper .from-date {
18676 position: relative;
18677 display: flex;
18678 align-items: center;
18679 gap: 8px;
18680 }
18681 .wpfnl-analytics .filter-wrapper .divider {
18682 width: 9px;
18683 height: 1px;
18684 background: #7A8B9A;
18685 margin: 0 5px;
18686 }
18687 .wpfnl-analytics .filter-wrapper .icon {
18688 position: relative;
18689 top: 0px;
18690 }
18691 .wpfnl-analytics .filter-wrapper .icon svg {
18692 display: block;
18693 }
18694 .wpfnl-analytics .filter-wrapper .filter-icon {
18695 margin-left: auto;
18696 border-left: 1px solid #9064f6;
18697 height: 40px;
18698 width: 40px;
18699 padding-left: 13px;
18700 display: flex;
18701 flex-flow: column;
18702 align-items: center;
18703 justify-content: center;
18704 }
18705 .wpfnl-analytics .calendar-dorpdown {
18706 position: absolute;
18707 top: calc(100% + 10px);
18708 right: 0;
18709 background: #fff;
18710 width: 291px;
18711 z-index: 10;
18712 border: 1px solid #F1F0F5;
18713 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
18714 border-radius: 10px;
18715 cursor: default;
18716 opacity: 0;
18717 visibility: hidden;
18718 transition: all 0.3s ease;
18719 }
18720 .wpfnl-analytics .calendar-dorpdown .date-range-input {
18721 display: flex;
18722 flex-flow: row wrap;
18723 align-items: center;
18724 gap: 10px;
18725 border-bottom: 1px solid #F1F0F5;
18726 padding: 5px 20px;
18727 position: relative;
18728 }
18729 .wpfnl-analytics .calendar-dorpdown .date-range-input:before {
18730 content: "";
18731 position: absolute;
18732 left: calc(50% - 6px);
18733 top: 50%;
18734 transform: translateY(-50%);
18735 height: 16px;
18736 width: 1px;
18737 background: #F1F0F5;
18738 }
18739 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text] {
18740 min-width: auto;
18741 width: calc(50% - 5px);
18742 background: transparent;
18743 border: none;
18744 border-radius: 0;
18745 height: 30px;
18746 padding: 0;
18747 cursor: text;
18748 color: #2D3149;
18749 }
18750 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text]::placeholder {
18751 color: #9398A5;
18752 }
18753 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text]:-ms-input-placeholder {
18754 color: #9398A5;
18755 }
18756 .wpfnl-analytics .calendar-dorpdown .date-range-input input[type=text]::-ms-input-placeholder {
18757 color: #9398A5;
18758 }
18759 .wpfnl-analytics .calendar-dorpdown .date-range-input #date-from {
18760 padding-right: 12px;
18761 }
18762 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker {
18763 padding: 15px 20px 10px;
18764 }
18765 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker {
18766 width: 100%;
18767 }
18768 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-prev,
18769 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-next {
18770 display: none;
18771 }
18772 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-title {
18773 margin: 0;
18774 display: flex;
18775 align-items: center;
18776 gap: 10px;
18777 }
18778 .wpfnl-analytics .calendar-dorpdown .wpfunnel-datepicker .ui-datepicker .ui-datepicker-title select {
18779 color: #2D3149;
18780 font-size: 13px;
18781 margin: 0;
18782 width: calc(50% - 4px);
18783 border-radius: 8px;
18784 border: 1px solid #F1F0F5;
18785 box-shadow: none;
18786 padding: 10px 40px 8px 12px;
18787 background-position: right 10px top 54%;
18788 }
18789 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender {
18790 padding: 4px 15px 23px;
18791 }
18792 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender #ui-datepicker-div {
18793 position: relative !important;
18794 top: 10px !important;
18795 left: 0 !important;
18796 width: 100%;
18797 display: block !important;
18798 }
18799 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender .ui-datepicker .ui-datepicker-title {
18800 display: flex;
18801 width: 90%;
18802 margin: 0 2.5em;
18803 }
18804 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender .ui-datepicker select.ui-datepicker-month,
18805 .wpfnl-analytics .calendar-dorpdown .div-to-append-calender .ui-datepicker select.ui-datepicker-year {
18806 width: 116px;
18807 min-width: auto;
18808 height: 36px;
18809 border-radius: 3px;
18810 }
18811 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender {
18812 padding: 4px 15px 23px;
18813 }
18814 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender #ui-datepicker-div {
18815 position: relative !important;
18816 top: 10px !important;
18817 left: 0 !important;
18818 width: 100%;
18819 display: block !important;
18820 }
18821 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
18822 display: flex;
18823 width: 90%;
18824 margin: 0 2.5em;
18825 }
18826 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender .ui-datepicker select.ui-datepicker-month,
18827 .wpfnl-analytics .calendar-dorpdown .div-to-append-range-calender .ui-datepicker select.ui-datepicker-year {
18828 width: 116px;
18829 min-width: auto;
18830 height: 36px;
18831 border-radius: 3px;
18832 }
18833 .wpfnl-analytics .calendar-dorpdown .btn-default {
18834 padding: 0 18px;
18835 height: 32px;
18836 line-height: 32px;
18837 width: auto;
18838 min-width: auto;
18839 margin-left: auto;
18840 display: block;
18841 border-radius: 10px 0 10px 0;
18842 box-shadow: 0px 10px 16px rgba(189, 193, 200, 0.5);
18843 }
18844 .wpfnl-analytics .show-calendar .calendar-dorpdown {
18845 opacity: 1;
18846 visibility: visible;
18847 }
18848
18849 @media only screen and (max-width: 1399px) {
18850 .wpfnl-drawflow-window .wpfnl-analytics .analytics-box {
18851 padding: 17px 17px 16px;
18852 }
18853 }
18854 @media only screen and (max-width: 782px) {
18855 .folded .wpfnl-drawflow-window .wpfnl-analytics {
18856 width: 100%;
18857 }
18858 .folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
18859 left: 0;
18860 }
18861 }
18862 .wpfnl-license-page {
18863 background: transparent;
18864 }
18865
18866 .wpfnl-license-wrapper {
18867 display: flex;
18868 flex-flow: row wrap;
18869 padding: 24px;
18870 gap: 30px;
18871 }
18872 .wpfnl-license-wrapper .wpfnl-license-filed {
18873 background: #FFFFFF;
18874 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
18875 border-radius: 10px;
18876 width: calc(100% - 390px);
18877 padding: 15px 20px 20px;
18878 }
18879 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .product-title,
18880 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
18881 width: 390px;
18882 position: relative;
18883 }
18884 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .input-field,
18885 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field {
18886 width: calc(100% - 460px);
18887 max-width: 420px;
18888 padding: 0 40px;
18889 }
18890 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .btn-area,
18891 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area {
18892 width: 170px;
18893 }
18894 .wpfnl-license-wrapper .wpfnl-license-filed .field-header {
18895 display: flex;
18896 flex-flow: row wrap;
18897 align-items: center;
18898 justify-content: space-between;
18899 margin-bottom: 30px;
18900 position: relative;
18901 padding-bottom: 15px;
18902 }
18903 .wpfnl-license-wrapper .wpfnl-license-filed .field-header:before {
18904 content: "";
18905 position: absolute;
18906 left: -20px;
18907 bottom: 0;
18908 width: calc(100% + 40px);
18909 height: 1px;
18910 background: #E5E8F3;
18911 }
18912 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .single-field {
18913 text-transform: uppercase;
18914 }
18915 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area {
18916 display: flex;
18917 flex-flow: row wrap;
18918 justify-content: space-between;
18919 align-items: center;
18920 width: 100%;
18921 }
18922 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
18923 display: flex;
18924 align-items: center;
18925 }
18926 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title .icon-info {
18927 width: calc(100% - 50px);
18928 padding-left: 15px;
18929 }
18930 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title h3 {
18931 font-weight: 500;
18932 font-size: 20px;
18933 line-height: 23px;
18934 color: #363B4E;
18935 }
18936 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .license-status {
18937 font-size: 14px;
18938 line-height: 16px;
18939 color: #7A8B9A;
18940 margin-top: 5px;
18941 display: block;
18942 }
18943 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .addon-icon {
18944 width: 50px;
18945 height: 50px;
18946 border-radius: 100%;
18947 display: flex;
18948 align-items: center;
18949 justify-content: center;
18950 }
18951 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field input {
18952 height: 46px;
18953 padding: 6px 15px 5px;
18954 }
18955 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area {
18956 position: relative;
18957 }
18958 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area .btn-default {
18959 padding: 0 22px;
18960 height: 46px;
18961 min-width: 162px;
18962 border-radius: 10px;
18963 }
18964 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .btn-area .lnc-notice {
18965 color: green;
18966 font-size: 15px;
18967 text-transform: capitalize;
18968 margin-left: 8px;
18969 position: absolute;
18970 bottom: -24px;
18971 left: -4px;
18972 }
18973 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license {
18974 padding: 15px;
18975 background: #F7F7FA;
18976 margin-top: 30px;
18977 border-radius: 0 8px 8px 0;
18978 border-left: 2px solid #6E42D3;
18979 }
18980 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .single-addons {
18981 margin-bottom: 15px;
18982 }
18983 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .single-addons:last-child {
18984 margin-bottom: 0;
18985 }
18986 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area {
18987 padding: 12px 15px;
18988 background-color: #fff;
18989 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
18990 border-radius: 6px;
18991 }
18992 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .product-title {
18993 width: 362px;
18994 }
18995 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .addon-icon {
18996 background: #F7F7FA;
18997 }
18998 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area h3 {
18999 font-weight: 500;
19000 font-size: 14px;
19001 line-height: 1.1;
19002 color: #363B4E;
19003 }
19004 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .input-field input {
19005 height: 38px;
19006 }
19007 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .btn-area {
19008 width: 145px;
19009 }
19010 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .btn-area .btn-default {
19011 padding: 0 18px;
19012 font-size: 13px;
19013 height: 38px;
19014 min-width: auto;
19015 margin-left: auto;
19016 display: block;
19017 border-radius: 6px;
19018 width: 100%;
19019 }
19020 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .not-get-addons .input-field-area .product-title {
19021 width: calc(100% - 200px);
19022 }
19023 .wpfnl-license-wrapper .promo-text-area {
19024 width: 360px;
19025 background: #FFF;
19026 border-radius: 10px;
19027 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
19028 }
19029 .wpfnl-license-wrapper .promo-text-area .single-area {
19030 position: relative;
19031 padding: 25px 25px 25px 90px;
19032 background: #FFFFFF;
19033 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
19034 border-radius: 10px;
19035 margin-bottom: 30px;
19036 }
19037 .wpfnl-license-wrapper .promo-text-area .single-area:last-child {
19038 margin-bottom: 0;
19039 }
19040 .wpfnl-license-wrapper .promo-text-area .single-area .icon {
19041 background-color: #F7F7FA;
19042 width: 50px;
19043 height: 50px;
19044 display: flex;
19045 flex-flow: column;
19046 align-items: center;
19047 justify-content: center;
19048 border-radius: 100%;
19049 position: absolute;
19050 top: 30px;
19051 left: 26px;
19052 }
19053 .wpfnl-license-wrapper .promo-text-area .single-area h4 {
19054 font-size: 18px;
19055 margin-bottom: 8px;
19056 color: #363B4E;
19057 font-weight: 500;
19058 }
19059 .wpfnl-license-wrapper .promo-text-area .single-area P {
19060 font-size: 14px;
19061 }
19062 .wpfnl-license-wrapper .promo-text-area .manage-license-area {
19063 padding: 20px;
19064 display: flex;
19065 flex-flow: column;
19066 align-items: center;
19067 justify-content: center;
19068 overflow: hidden;
19069 height: 100%;
19070 }
19071 .wpfnl-license-wrapper .promo-text-area .manage-license-area .logo {
19072 margin-bottom: 12px;
19073 }
19074 .wpfnl-license-wrapper .promo-text-area .manage-license-area p {
19075 text-align: center;
19076 margin-bottom: 20px;
19077 }
19078 .wpfnl-license-wrapper .promo-text-area .manage-license-area .btn-default {
19079 height: 40px;
19080 line-height: 40px;
19081 position: relative;
19082 z-index: 1;
19083 }
19084
19085 .cl-doc-row {
19086 display: flex;
19087 flex-flow: row wrap;
19088 padding: 24px;
19089 gap: 30px;
19090 }
19091 .cl-doc-row .single-col {
19092 background: #fff;
19093 padding: 30px;
19094 width: calc(25% - 23px);
19095 border-radius: 8px;
19096 display: flex;
19097 flex-flow: column;
19098 align-items: flex-start;
19099 position: relative;
19100 }
19101 .cl-doc-row .single-col:last-child {
19102 margin-right: 0;
19103 }
19104 .cl-doc-row .single-col .icon {
19105 background-color: #f0f1f3;
19106 width: 40px;
19107 height: 40px;
19108 display: flex;
19109 flex-flow: column;
19110 align-items: center;
19111 justify-content: center;
19112 border-radius: 100%;
19113 position: absolute;
19114 top: 24px;
19115 left: 30px;
19116 }
19117 .cl-doc-row .single-col h4 {
19118 font-size: 20px;
19119 margin-bottom: 22px;
19120 font-weight: 500;
19121 padding-left: 53px;
19122 color: #3c434a;
19123 }
19124 .cl-doc-row .single-col p {
19125 font-size: 14px;
19126 margin-bottom: 20px;
19127 }
19128 .cl-doc-row .single-col .btn-default {
19129 margin-top: auto;
19130 }
19131 .cl-doc-row .single-col.manage-license .icon svg {
19132 width: 27px;
19133 }
19134
19135 @media only screen and (max-width: 1620px) {
19136 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .product-title,
19137 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
19138 width: 280px;
19139 }
19140 .wpfnl-license-wrapper .wpfnl-license-filed .field-header .input-field,
19141 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field {
19142 padding: 0 20px;
19143 }
19144 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .product-title {
19145 width: 260px;
19146 }
19147 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .btn-area {
19148 width: 150px;
19149 }
19150 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .input-field {
19151 width: calc(100% - 410px);
19152 }
19153 }
19154 @media only screen and (max-width: 1399px) {
19155 .wpfnl-license-wrapper .wpfnl-license-filed {
19156 width: 100%;
19157 margin-right: 0;
19158 }
19159 .wpfnl-license-wrapper .promo-text-area {
19160 width: 100%;
19161 display: flex;
19162 flex-flow: row wrap;
19163 justify-content: center;
19164 }
19165 .wpfnl-license-wrapper .promo-text-area .single-area {
19166 width: calc(33.3333333333% - 20px);
19167 margin-left: 30px;
19168 margin-bottom: 0;
19169 }
19170 .wpfnl-license-wrapper .promo-text-area .single-area:first-child {
19171 margin-left: 0;
19172 }
19173 }
19174 @media only screen and (max-width: 1199px) {
19175 .wpfnl-license-wrapper {
19176 gap: 20px;
19177 }
19178 .wpfnl-license-wrapper .promo-text-area .manage-license-area:before {
19179 left: -47px;
19180 }
19181 .wpfnl-license-wrapper .promo-text-area .manage-license-area {
19182 padding: 20px;
19183 display: flex;
19184 flex-flow: column;
19185 justify-content: center;
19186 }
19187 .wpfnl-license-wrapper .promo-text-area .single-area {
19188 width: calc(33.3333333333% - 14px);
19189 margin-left: 20px;
19190 padding: 20px;
19191 }
19192 .wpfnl-license-wrapper .promo-text-area .single-area .icon {
19193 position: relative;
19194 top: inherit;
19195 left: inherit;
19196 margin-bottom: 12px;
19197 }
19198 .cl-doc-row {
19199 margin-top: 20px;
19200 gap: 20px;
19201 }
19202 .cl-doc-row .single-col {
19203 padding: 20px;
19204 width: calc(50% - 10px);
19205 }
19206 .cl-doc-row .single-col .icon {
19207 top: 18px;
19208 left: 20px;
19209 }
19210 }
19211 @media only screen and (max-width: 991px) {
19212 .wpfnl-license-wrapper .wpfnl-license-filed .field-header {
19213 display: none;
19214 }
19215 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .product-title {
19216 width: 100%;
19217 margin-bottom: 10px;
19218 }
19219 .wpfnl-license-wrapper .wpfnl-license-filed .input-field-area .input-field {
19220 width: calc(100% - 180px);
19221 max-width: initial;
19222 padding: 0;
19223 }
19224 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .product-title {
19225 width: 100%;
19226 }
19227 .wpfnl-license-wrapper .wpfnl-license-filed .addons-license .input-field-area .input-field {
19228 width: calc(100% - 160px);
19229 }
19230 .cl-doc-row .single-col:nth-child(2) {
19231 margin-right: 0;
19232 }
19233 }
19234 .gbf-product-area .product-head {
19235 padding: 17px 25px;
19236 }
19237 .gbf-product-area .wpfnl-box {
19238 box-shadow: none;
19239 border-radius: 10px;
19240 }
19241 .gbf-product-area .condition-wrapper {
19242 background: #f7f8f9;
19243 border-radius: 10px;
19244 padding: 25px 25px 33px;
19245 }
19246 .gbf-product-area .single-condition-wrapper {
19247 padding: 0 0 27px;
19248 position: relative;
19249 }
19250 .gbf-product-area .single-condition-wrapper:after {
19251 content: "";
19252 position: absolute;
19253 left: 50%;
19254 height: 27px;
19255 width: 2px;
19256 background: #A0ADB9;
19257 margin-left: -1px;
19258 }
19259 .gbf-product-area .single-condition-wrapper:after {
19260 bottom: 0;
19261 }
19262 .gbf-product-area .single-condition-wrapper .add-condition {
19263 border: none;
19264 background: transparent;
19265 display: block;
19266 height: 30px;
19267 width: 30px;
19268 position: absolute;
19269 left: 50%;
19270 bottom: -13px;
19271 transform: translate(-50%);
19272 z-index: 1;
19273 border-radius: 50%;
19274 cursor: pointer;
19275 }
19276 .gbf-product-area .single-condition-wrapper .add-condition svg {
19277 width: 30px;
19278 height: 30px;
19279 }
19280 .gbf-product-area .single-condition-wrapper .add-condition svg circle {
19281 fill: #6e42d3;
19282 stroke: #6e42d3;
19283 }
19284 .gbf-product-area .single-condition-wrapper .add-condition svg path {
19285 stroke: #fff;
19286 }
19287 .gbf-product-area .single-condition-wrapper .add-condition[data-tour=yes] {
19288 position: relative;
19289 z-index: 4;
19290 }
19291 .gbf-product-area .single-condition-wrapper .add-condition[data-tour=yes] circle {
19292 fill: #6e42d3;
19293 stroke: #6e42d3;
19294 }
19295 .gbf-product-area .single-condition-wrapper .add-condition[data-tour=yes] path {
19296 stroke: #fff;
19297 }
19298 .gbf-product-area .single-condition-wrapper:not(:last-child) .add-condition {
19299 display: none;
19300 }
19301 .gbf-product-area .wpfnl-gbf-type-product-search,
19302 .gbf-product-area .wpfnl-product-search-gbf,
19303 .gbf-product-area .wpfnl-category-search {
19304 display: none;
19305 }
19306 .gbf-product-area .select2-container.select2-container--default.select2-container--open {
19307 background: transparent;
19308 border: none;
19309 }
19310 .gbf-product-area .select2-container--default .select2-selection--single {
19311 background-color: transparent;
19312 border: none;
19313 border-radius: 0;
19314 height: auto;
19315 }
19316 .gbf-product-area .select2-container--default .select2-selection--single .select2-selection__arrow {
19317 top: 50%;
19318 transform: translateY(-50%);
19319 display: none;
19320 }
19321 .gbf-product-area .select2-container {
19322 display: block;
19323 width: 100% !important;
19324 }
19325 .gbf-product-area .select2-container .select2-selection__rendered {
19326 border: 1px solid #E5E8F3;
19327 padding: 7px 15px;
19328 width: 100%;
19329 border-radius: 6px;
19330 overflow: hidden;
19331 text-overflow: ellipsis;
19332 display: block;
19333 color: #7A8B9A;
19334 line-height: 1;
19335 }
19336 .gbf-product-area .single-condition {
19337 background: #FFFFFF;
19338 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
19339 border-radius: 10px;
19340 display: flex;
19341 flex-flow: row wrap;
19342 position: relative;
19343 }
19344 .gbf-product-area .single-condition .selectbox-wrapper select {
19345 height: 40px;
19346 background-color: transparent;
19347 min-width: auto;
19348 width: 100%;
19349 }
19350 .gbf-product-area .single-condition .selectbox-wrapper .wpfnl-tag-search {
19351 position: absolute;
19352 opacity: 0;
19353 visibility: hidden;
19354 }
19355 .gbf-product-area .single-condition #gbf-select-box[data-tour=yes] select {
19356 position: relative;
19357 z-index: 4;
19358 border: 1px solid #FFF;
19359 background: #ffffff;
19360 }
19361 .gbf-product-area .single-condition label {
19362 cursor: default;
19363 padding-right: 10px;
19364 }
19365 .gbf-product-area .single-condition .hints {
19366 color: #EE5F5A;
19367 display: none;
19368 }
19369 .gbf-product-area .single-condition .selectbox-wrapper {
19370 position: relative;
19371 width: calc(100% - 112px);
19372 }
19373 .gbf-product-area .single-condition .required-star {
19374 color: #EE5F5A;
19375 }
19376 .gbf-product-area .single-condition .wpfnl-form-group {
19377 width: 100%;
19378 display: flex;
19379 flex-flow: row wrap;
19380 align-items: center;
19381 }
19382 .gbf-product-area .single-condition .condition-if {
19383 padding: 20px;
19384 width: 50%;
19385 position: relative;
19386 }
19387 .gbf-product-area .single-condition .condition-then {
19388 display: flex;
19389 flex-flow: row wrap;
19390 padding: 20px 13px;
19391 width: 50%;
19392 background: #F9F9FD;
19393 border-radius: 0px 10px 10px 0px;
19394 position: relative;
19395 }
19396 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date,
19397 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date {
19398 flex: 1;
19399 position: relative;
19400 display: flex;
19401 align-items: center;
19402 }
19403 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date label,
19404 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date label {
19405 width: 80px;
19406 }
19407 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date input[type=text],
19408 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date input[type=text] {
19409 height: 40px;
19410 min-width: auto;
19411 cursor: pointer;
19412 }
19413 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date {
19414 padding-left: 25px;
19415 }
19416 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date label {
19417 width: 48px;
19418 }
19419 .gbf-product-area .single-condition .div-to-append-calender .ui-datepicker .ui-datepicker-title {
19420 display: flex;
19421 width: 90%;
19422 margin: 0 2.5em;
19423 }
19424 .gbf-product-area .single-condition .div-to-append-calender .ui-datepicker select.ui-datepicker-year,
19425 .gbf-product-area .single-condition .div-to-append-calender .ui-datepicker select.ui-datepicker-month {
19426 width: calc(50% - 25px);
19427 min-width: auto;
19428 height: 36px;
19429 min-height: auto;
19430 border-radius: 3px;
19431 }
19432 .gbf-product-area .single-condition .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
19433 display: flex;
19434 width: 90%;
19435 margin: 0 2.5em;
19436 }
19437 .gbf-product-area .single-condition .div-to-append-range-calender .ui-datepicker select.ui-datepicker-year,
19438 .gbf-product-area .single-condition .div-to-append-range-calender .ui-datepicker select.ui-datepicker-month {
19439 width: calc(50% - 25px);
19440 min-width: auto;
19441 height: 36px;
19442 min-height: auto;
19443 border-radius: 3px;
19444 }
19445 .gbf-product-area .single-condition .close-condition {
19446 border: 1px solid #EE5F5A;
19447 padding: 0;
19448 height: 26px;
19449 width: 26px;
19450 display: flex;
19451 flex-flow: column;
19452 align-items: center;
19453 justify-content: center;
19454 border-radius: 100%;
19455 position: absolute;
19456 right: -8px;
19457 top: -11px;
19458 cursor: pointer;
19459 background: #fff;
19460 opacity: 0;
19461 visibility: hidden;
19462 transition: all 0.3s ease;
19463 z-index: 3;
19464 }
19465 .gbf-product-area .single-condition .close-condition svg {
19466 width: 17px;
19467 }
19468 .gbf-product-area .single-condition .close-condition svg path {
19469 stroke: #EE5F5A;
19470 }
19471 .gbf-product-area .single-condition:hover .close-condition {
19472 opacity: 1;
19473 visibility: visible;
19474 }
19475 .gbf-product-area .single-condition .wpfnl-form-group.field-required select {
19476 border-color: #EE5F5A;
19477 }
19478 .gbf-product-area .single-condition .wpfnl-form-group.field-required .hints {
19479 display: block;
19480 }
19481 .gbf-product-area input[type=time],
19482 .gbf-product-area input[type=date],
19483 .gbf-product-area input[type=search],
19484 .gbf-product-area input[type=url],
19485 .gbf-product-area input[type=tel],
19486 .gbf-product-area input[type=number],
19487 .gbf-product-area input[type=password],
19488 .gbf-product-area input[type=email],
19489 .gbf-product-area input[type=text],
19490 .gbf-product-area textarea,
19491 .gbf-product-area select {
19492 height: 44px;
19493 border-radius: 10px;
19494 }
19495 .gbf-product-area .offer-selection-mode .pms-card-top .recommended-badge {
19496 background: #FEF3C7;
19497 color: #D97706;
19498 border: 1px solid #FDE68A;
19499 font-size: 11px;
19500 font-weight: 500;
19501 padding: 2px 8px;
19502 border-radius: 20px;
19503 letter-spacing: 0.3px;
19504 white-space: nowrap;
19505 margin-left: 2px;
19506 }
19507 .gbf-product-area select#wpfnl-choose-offer {
19508 height: 44px;
19509 padding-right: 30px;
19510 }
19511 .gbf-product-area .manual-product-buttons {
19512 display: flex;
19513 justify-content: flex-end;
19514 gap: 12px;
19515 margin-bottom: 16px;
19516 }
19517 .gbf-product-area .manual-product-buttons button {
19518 height: 40px;
19519 font-size: 14px;
19520 font-weight: 500;
19521 border-radius: 6px;
19522 display: flex;
19523 align-items: center;
19524 gap: 8px;
19525 padding: 0 16px;
19526 cursor: pointer;
19527 transition: all 0.2s ease;
19528 }
19529 .gbf-product-area .manual-product-buttons button.add-existing-product {
19530 background: #6E42D3;
19531 border: 1px solid #6E42D3;
19532 color: #FFFFFF;
19533 }
19534 .gbf-product-area .manual-product-buttons button.add-existing-product:hover {
19535 background: #5c35b8;
19536 border-color: #5c35b8;
19537 }
19538 .gbf-product-area .manual-product-buttons button.add-existing-product .add-product-icon {
19539 display: inline-flex;
19540 align-items: center;
19541 justify-content: center;
19542 }
19543 .gbf-product-area .manual-product-buttons button.add-existing-product .add-product-icon svg path {
19544 stroke: #FFFFFF;
19545 }
19546 .gbf-product-area .manual-product-buttons button.create-product-button {
19547 background: #F7F7FA;
19548 border: 1px solid #E5E8F3;
19549 color: #363B4E;
19550 }
19551 .gbf-product-area .manual-product-buttons button.create-product-button:hover {
19552 background: #ECECF5;
19553 border-color: #D5D8E8;
19554 }
19555 .gbf-product-area .manual-product-buttons button.create-product-button .create-product-icon {
19556 display: inline-flex;
19557 align-items: center;
19558 justify-content: center;
19559 }
19560 .gbf-product-area .manual-product-buttons button.create-product-button .create-product-icon svg path {
19561 stroke: #363B4E;
19562 }
19563 .gbf-product-area .wpfnl-field-wrapper.product-list-box {
19564 display: block;
19565 width: 100%;
19566 border: 1px solid #EEF0F3;
19567 margin: 0;
19568 border-radius: 8px;
19569 }
19570 .gbf-product-area .wpfnl-field-wrapper.product-list-box .accordion-head {
19571 border-radius: 8px 8px 0 0;
19572 }
19573 .gbf-product-area .filter-options-section {
19574 align-items: flex-start;
19575 }
19576 .gbf-product-area .filter-options-section .checkbox-group {
19577 display: flex;
19578 flex-direction: column;
19579 gap: 12px;
19580 }
19581 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option {
19582 display: flex;
19583 align-items: center;
19584 gap: 8px;
19585 cursor: pointer;
19586 }
19587 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option input[type=checkbox] {
19588 width: 18px;
19589 height: 18px;
19590 cursor: pointer;
19591 margin: 0;
19592 }
19593 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option input[type=checkbox]:checked::before {
19594 margin: -0.12rem 0 0 -0.2rem;
19595 }
19596 .gbf-product-area .filter-options-section .checkbox-group .checkbox-option span {
19597 font-size: 14px;
19598 color: #363B4E;
19599 user-select: none;
19600 }
19601 .gbf-product-area .fallback-behavior-section {
19602 align-items: flex-start;
19603 }
19604 .gbf-product-area .fallback-behavior-section input[type=radio] {
19605 cursor: pointer;
19606 margin: 0;
19607 }
19608 .gbf-product-area .fallback-behavior-section input[type=radio]:checked {
19609 border-color: #6E42D3;
19610 }
19611 .gbf-product-area .fallback-behavior-section input[type=radio]:checked::before {
19612 background-color: #6E42D3;
19613 }
19614 .gbf-product-area .fallback-behavior-section .fallback-options {
19615 display: flex;
19616 flex-direction: column;
19617 gap: 16px;
19618 }
19619 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option {
19620 display: flex;
19621 align-items: flex-start;
19622 gap: 12px;
19623 padding: 10px 12px;
19624 border: 1px solid #E5E8F3;
19625 border-radius: 8px;
19626 cursor: pointer;
19627 transition: all 0.2s ease;
19628 background: #FFFFFF;
19629 }
19630 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option:hover {
19631 border-color: #6E42D3;
19632 background: #F9F7FD;
19633 }
19634 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option .radio-content {
19635 display: flex;
19636 flex-direction: column;
19637 gap: 4px;
19638 flex: 1;
19639 }
19640 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option .radio-content .radio-title {
19641 font-size: 14px;
19642 color: #363B4E;
19643 font-weight: 500;
19644 }
19645 .gbf-product-area .fallback-behavior-section .fallback-options .radio-option .radio-content .radio-subtitle {
19646 font-size: 13px;
19647 color: #7A8B9A;
19648 font-weight: 400;
19649 }
19650 .gbf-product-area .fallback-behavior-section .default-product-select {
19651 margin-top: 6px;
19652 }
19653 .gbf-product-area .fallback-behavior-section .default-product-select > label {
19654 font-weight: 400;
19655 font-size: 13px;
19656 margin-bottom: 4px;
19657 display: block;
19658 }
19659 .gbf-product-area .gbf-upgrade-overlay {
19660 position: relative;
19661 }
19662 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy {
19663 display: flex;
19664 flex-direction: column;
19665 gap: 16px;
19666 pointer-events: none;
19667 user-select: none;
19668 }
19669 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled select,
19670 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled input[type=number] {
19671 background: #f3f4f6;
19672 cursor: not-allowed;
19673 }
19674 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options {
19675 display: flex;
19676 flex-direction: column;
19677 gap: 16px;
19678 }
19679 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option {
19680 display: flex;
19681 align-items: flex-start;
19682 gap: 12px;
19683 padding: 10px 12px;
19684 border: 1px solid #E5E8F3;
19685 border-radius: 8px;
19686 background: #FFFFFF;
19687 }
19688 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option input[type=radio] {
19689 margin: 0;
19690 flex-shrink: 0;
19691 }
19692 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content {
19693 display: flex;
19694 flex-direction: column;
19695 gap: 4px;
19696 flex: 1;
19697 }
19698 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-title {
19699 font-size: 14px;
19700 color: #363B4E;
19701 font-weight: 500;
19702 }
19703 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-subtitle {
19704 font-size: 13px;
19705 color: #7A8B9A;
19706 font-weight: 400;
19707 }
19708 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-cta {
19709 position: absolute;
19710 right: 0;
19711 top: 0;
19712 width: calc(100% - 230px);
19713 height: 100%;
19714 display: flex;
19715 align-items: center;
19716 background: rgba(255, 255, 255, 0.6);
19717 backdrop-filter: blur(1px);
19718 border-radius: 10px;
19719 padding: 24px;
19720 }
19721 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-cta-inner {
19722 display: flex;
19723 flex-direction: column;
19724 align-items: center;
19725 gap: 10px;
19726 text-align: center;
19727 max-width: 380px;
19728 margin-left: 92px;
19729 }
19730 .gbf-product-area .gbf-upgrade-overlay .gbf-upgrade-overlay-btn {
19731 display: inline-flex;
19732 align-items: center;
19733 gap: 6px;
19734 margin-top: 4px;
19735 padding: 0 20px;
19736 height: 40px;
19737 font-size: 14px;
19738 font-weight: 500;
19739 border-radius: 6px;
19740 text-decoration: none;
19741 cursor: pointer;
19742 transition: all 0.2s ease;
19743 }
19744
19745 .steps-settings.downsell .gbf-offer-product .offer-discount-area,
19746 .steps-settings.upsell .gbf-offer-product .offer-discount-area {
19747 border: none;
19748 }
19749
19750 @media only screen and (max-width: 1199px) {
19751 .gbf-product-area .single-condition .wpfnl-form-group {
19752 width: 100%;
19753 }
19754 .gbf-product-area .single-condition label {
19755 padding-right: 0;
19756 margin-bottom: 5px;
19757 display: block;
19758 }
19759 .gbf-product-area .single-condition .selectbox-wrapper {
19760 width: 100%;
19761 }
19762 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .to-date,
19763 .gbf-product-area .single-condition .condition-then.gbf-date-is .wpfnl-form-group .from-date {
19764 display: block;
19765 }
19766 }
19767 .gbf-dynamic-funnel-notice {
19768 display: flex;
19769 align-items: flex-start;
19770 gap: 10px;
19771 padding: 12px 14px;
19772 background: #f0f4ff;
19773 border: 1px solid #c7d7fd;
19774 border-radius: 6px;
19775 margin-top: 12px;
19776 }
19777 .gbf-dynamic-funnel-notice svg {
19778 flex-shrink: 0;
19779 margin-top: 2px;
19780 }
19781 .gbf-dynamic-funnel-notice p {
19782 margin: 0;
19783 font-size: 13px;
19784 color: #4b5563;
19785 line-height: 1.5;
19786 }
19787
19788 .gbf-upgrade-overlay {
19789 position: relative;
19790 margin-top: 8px;
19791 border-radius: 10px;
19792 overflow: hidden;
19793 }
19794 .gbf-upgrade-overlay__dummy {
19795 display: flex;
19796 flex-direction: column;
19797 gap: 16px;
19798 filter: blur(3px);
19799 pointer-events: none;
19800 user-select: none;
19801 }
19802 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled {
19803 opacity: 0.6;
19804 }
19805 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled select,
19806 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled input[type=number] {
19807 background: #f3f4f6;
19808 cursor: not-allowed;
19809 }
19810 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options {
19811 display: flex;
19812 flex-direction: column;
19813 gap: 16px;
19814 }
19815 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option {
19816 display: flex;
19817 align-items: flex-start;
19818 gap: 12px;
19819 padding: 10px 12px;
19820 border: 1px solid #E5E8F3;
19821 border-radius: 8px;
19822 background: #FFFFFF;
19823 }
19824 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option input[type=radio] {
19825 margin: 0;
19826 flex-shrink: 0;
19827 }
19828 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content {
19829 display: flex;
19830 flex-direction: column;
19831 gap: 4px;
19832 flex: 1;
19833 }
19834 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-title {
19835 font-size: 14px;
19836 color: #363B4E;
19837 font-weight: 500;
19838 }
19839 .gbf-upgrade-overlay__dummy .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-subtitle {
19840 font-size: 13px;
19841 color: #7A8B9A;
19842 font-weight: 400;
19843 }
19844 .gbf-upgrade-overlay__cta {
19845 position: absolute;
19846 inset: 0;
19847 display: flex;
19848 align-items: center;
19849 justify-content: center;
19850 background: rgba(255, 255, 255, 0.7);
19851 backdrop-filter: blur(2px);
19852 border-radius: 10px;
19853 padding: 24px;
19854 }
19855 .gbf-upgrade-overlay__cta-inner {
19856 display: flex;
19857 flex-direction: column;
19858 align-items: center;
19859 gap: 10px;
19860 text-align: center;
19861 max-width: 380px;
19862 }
19863 .gbf-upgrade-overlay__icon {
19864 display: flex;
19865 align-items: center;
19866 justify-content: center;
19867 }
19868 .gbf-upgrade-overlay__title {
19869 font-size: 16px;
19870 font-weight: 600;
19871 color: #363B4E;
19872 margin: 0;
19873 }
19874 .gbf-upgrade-overlay__desc {
19875 font-size: 13px;
19876 color: #7A8B9A;
19877 line-height: 1.6;
19878 margin: 0;
19879 }
19880 .gbf-upgrade-overlay__btn {
19881 display: inline-flex;
19882 align-items: center;
19883 gap: 6px;
19884 margin-top: 4px;
19885 padding: 0 20px;
19886 height: 40px;
19887 font-size: 14px;
19888 font-weight: 500;
19889 border-radius: 6px;
19890 text-decoration: none;
19891 cursor: pointer;
19892 transition: all 0.2s ease;
19893 }
19894
19895 .gbf-dummy-preview .gbf-not-available-notice {
19896 display: flex;
19897 align-items: flex-start;
19898 gap: 8px;
19899 padding: 10px 14px;
19900 background: #f8f9fb;
19901 border: 1px solid #e5e7eb;
19902 border-radius: 6px;
19903 margin-bottom: 16px;
19904 }
19905 .gbf-dummy-preview .gbf-not-available-notice svg {
19906 flex-shrink: 0;
19907 margin-top: 2px;
19908 }
19909 .gbf-dummy-preview .gbf-not-available-notice p {
19910 margin: 0;
19911 font-size: 13px;
19912 color: #6b7280;
19913 line-height: 1.5;
19914 }
19915 .gbf-dummy-preview .gbf-dummy-disabled {
19916 opacity: 0.45;
19917 pointer-events: none;
19918 user-select: none;
19919 }
19920 .gbf-dummy-preview .gbf-dummy-disabled select,
19921 .gbf-dummy-preview .gbf-dummy-disabled input[type=number] {
19922 background: #f3f4f6;
19923 cursor: not-allowed;
19924 }
19925 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options {
19926 display: flex;
19927 flex-direction: column;
19928 gap: 16px;
19929 }
19930 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option {
19931 display: flex;
19932 align-items: flex-start;
19933 gap: 12px;
19934 padding: 10px 12px;
19935 border: 1px solid #E5E8F3;
19936 border-radius: 8px;
19937 background: #FFFFFF;
19938 }
19939 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option input[type=radio] {
19940 margin: 0;
19941 flex-shrink: 0;
19942 }
19943 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option .radio-content {
19944 display: flex;
19945 flex-direction: column;
19946 gap: 4px;
19947 flex: 1;
19948 }
19949 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-title {
19950 font-size: 14px;
19951 color: #363B4E;
19952 font-weight: 500;
19953 }
19954 .gbf-dummy-preview .gbf-dummy-disabled .fallback-options .radio-option .radio-content .radio-subtitle {
19955 font-size: 13px;
19956 color: #7A8B9A;
19957 font-weight: 400;
19958 }
19959
19960 .wpfnl-webhook-drawer {
19961 width: calc(100% - 36px);
19962 right: 0;
19963 transition: none;
19964 }
19965 .wpfnl-webhook-drawer .drawer-wrapper {
19966 background: #F6F5FA;
19967 }
19968 .wpfnl-webhook-drawer .drawer-header {
19969 background: #FFFFFF;
19970 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.31) !important;
19971 padding: 15px 24px !important;
19972 justify-content: flex-start;
19973 gap: 14px;
19974 }
19975 .wpfnl-webhook-drawer .drawer-header .wpfnl-drawer-close {
19976 background: #FFFFFF;
19977 border-radius: 10px;
19978 height: 38px;
19979 width: 38px;
19980 display: flex;
19981 flex-flow: column;
19982 align-items: center;
19983 justify-content: center;
19984 cursor: pointer;
19985 border: 1px solid #EEF0F3;
19986 }
19987 .wpfnl-webhook-drawer .drawer-header .drawer-title {
19988 font-weight: 500;
19989 font-size: 16px;
19990 line-height: 1;
19991 }
19992 .wpfnl-webhook-drawer .drawer-header .webhook-search {
19993 margin-left: auto;
19994 }
19995 .wpfnl-webhook-drawer .drawer-header .webhook-search form {
19996 position: relative;
19997 }
19998 .wpfnl-webhook-drawer .drawer-header .webhook-search svg {
19999 position: absolute;
20000 top: 12px;
20001 left: 14px;
20002 }
20003 .wpfnl-webhook-drawer .drawer-header .webhook-search input[type=text] {
20004 padding-left: 34px;
20005 min-width: auto;
20006 width: 194px;
20007 background: #FFFFFF;
20008 border-color: #EEF0F3;
20009 border-radius: 10px;
20010 height: 40px;
20011 }
20012 .wpfnl-webhook-drawer .drawer-header .btn-default {
20013 height: 40px;
20014 line-height: 41px;
20015 display: flex;
20016 align-items: center;
20017 padding: 0 20px;
20018 gap: 7px;
20019 border-radius: 10px;
20020 }
20021 .wpfnl-webhook-drawer .drawer-body {
20022 padding-top: 40px;
20023 }
20024 .wpfnl-webhook-drawer .drawer-body .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
20025 margin-left: 3px;
20026 position: relative;
20027 top: -1px;
20028 }
20029 .wpfnl-webhook-drawer .webhook-content {
20030 background: #FFFFFF;
20031 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
20032 border-radius: 10px;
20033 position: relative;
20034 }
20035 .wpfnl-webhook-drawer .drawer-footer {
20036 border-top: 1px solid #EEF0F3;
20037 padding: 20px 0 20px;
20038 margin-top: 30px;
20039 display: flex;
20040 flex-flow: row wrap;
20041 align-items: center;
20042 justify-content: flex-end;
20043 gap: 14px;
20044 position: relative;
20045 }
20046 .wpfnl-webhook-drawer .drawer-footer .btn-default {
20047 display: flex;
20048 flex-flow: row;
20049 align-items: center;
20050 justify-content: center;
20051 line-height: 41px;
20052 height: 40px;
20053 padding: 2px 20px 0;
20054 min-width: auto;
20055 }
20056 .wpfnl-webhook-drawer .drawer-footer .btn-default .wpfnl-loader {
20057 display: inline-block;
20058 }
20059 .wpfnl-webhook-drawer .drawer-footer .btn-default[disabled] {
20060 opacity: 0.6;
20061 display: flex;
20062 align-items: center;
20063 gap: 10px;
20064 cursor: not-allowed;
20065 }
20066 .wpfnl-webhook-drawer .drawer-footer .cancel-btn {
20067 background: transparent;
20068 box-shadow: 0 0 0 1px #E4E6EB;
20069 color: #3C3F47;
20070 }
20071 .wpfnl-webhook-drawer .drawer-footer .wpfnl-alert {
20072 display: inline-block;
20073 padding: 10px 20px;
20074 }
20075 .wpfnl-webhook-drawer .no-webhook-data {
20076 height: 550px;
20077 display: flex;
20078 flex-flow: column;
20079 align-items: center;
20080 justify-content: center;
20081 gap: 40px;
20082 font-weight: 500;
20083 font-size: 18px;
20084 line-height: 1;
20085 color: #363B4E;
20086 }
20087 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list,
20088 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header {
20089 display: flex;
20090 flex-flow: row wrap;
20091 align-items: center;
20092 justify-content: space-between;
20093 gap: 15px;
20094 }
20095 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .name-field,
20096 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .name-field {
20097 width: calc((80% - 135px) / 2);
20098 max-width: 300px;
20099 color: #363B4E;
20100 font-weight: 500;
20101 }
20102 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .request-url-field,
20103 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .request-url-field {
20104 width: calc((80% - 135px) / 2);
20105 }
20106 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field,
20107 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .status-field {
20108 width: 92px;
20109 margin-left: auto;
20110 }
20111 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field,
20112 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .action-field {
20113 width: 74px;
20114 text-align: center;
20115 }
20116 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header {
20117 padding: 13px 24px;
20118 border-bottom: 1px solid #E5E8F3;
20119 }
20120 .wpfnl-webhook-drawer .webhook-list-wrapper .list-header .name-field {
20121 color: #7A8B9A;
20122 font-weight: 400;
20123 }
20124 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list {
20125 padding: 15px 24px;
20126 border-bottom: 1px solid #E5E8F3;
20127 }
20128 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list:last-child {
20129 border-bottom: 0;
20130 }
20131 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list.no-data {
20132 text-align: center;
20133 display: block;
20134 }
20135 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .request-url-field {
20136 word-break: break-all;
20137 }
20138 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .status-field .wpfnl-loader {
20139 display: block;
20140 position: absolute;
20141 top: 1px;
20142 left: 30px;
20143 }
20144 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field button {
20145 border: none;
20146 cursor: pointer;
20147 text-align: center;
20148 padding: 0 6px;
20149 display: inline-block;
20150 height: 30px;
20151 line-height: 30px;
20152 background-color: transparent;
20153 margin-left: 2px;
20154 }
20155 .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field button svg {
20156 position: relative;
20157 top: 4px;
20158 }
20159
20160 .webhook-settings-drawer {
20161 width: 860px;
20162 }
20163 .webhook-settings-drawer .drawer-wrapper {
20164 background: #fff;
20165 }
20166 .webhook-settings-drawer .drawer-wrapper .drawer-body {
20167 padding-top: 0;
20168 }
20169 .webhook-settings-drawer .drawer-wrapper .drawer-header {
20170 justify-content: space-between;
20171 box-shadow: none !important;
20172 padding: 16px 30px 15px 30px !important;
20173 }
20174 .webhook-settings-drawer .webhook-settings-content {
20175 background: #FFFFFF;
20176 border-radius: 0;
20177 border-top: 1px solid #EEF0F3;
20178 }
20179 .webhook-settings-drawer .wpfnl-field-wrapper {
20180 margin-bottom: 20px;
20181 }
20182 .webhook-settings-drawer .wpfnl-field-wrapper:last-child {
20183 margin-bottom: 0;
20184 }
20185 .webhook-settings-drawer .wpfnl-field-wrapper > label {
20186 width: 170px;
20187 }
20188 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-fields .link-icon {
20189 position: absolute;
20190 top: 0;
20191 width: 38px;
20192 height: 38px;
20193 display: flex;
20194 align-items: center;
20195 justify-content: center;
20196 border-right: 1px solid #EEF0F3;
20197 }
20198 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-fields .hints {
20199 color: #e65555;
20200 display: none;
20201 }
20202 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date],
20203 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search],
20204 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url],
20205 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel],
20206 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number],
20207 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password],
20208 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email],
20209 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text],
20210 .webhook-settings-drawer .wpfnl-field-wrapper select {
20211 height: 38px;
20212 border-color: #EEF0F3;
20213 color: #363B4E;
20214 letter-spacing: -0.01em;
20215 font-weight: 400;
20216 }
20217 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]:-webkit-autofill,
20218 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]:-webkit-autofill,
20219 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]:-webkit-autofill,
20220 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]:-webkit-autofill,
20221 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]:-webkit-autofill,
20222 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]:-webkit-autofill,
20223 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]:-webkit-autofill,
20224 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]:-webkit-autofill,
20225 .webhook-settings-drawer .wpfnl-field-wrapper select:-webkit-autofill {
20226 -webkit-box-shadow: 0 0 0 30px #ffffff inset;
20227 box-shadow: 0 0 0 30px #ffffff inset;
20228 -webkit-text-fill-color: #363B4E !important;
20229 }
20230 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]::-webkit-input-placeholder,
20231 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]::-webkit-input-placeholder,
20232 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]::-webkit-input-placeholder,
20233 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]::-webkit-input-placeholder,
20234 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]::-webkit-input-placeholder,
20235 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]::-webkit-input-placeholder,
20236 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]::-webkit-input-placeholder,
20237 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]::-webkit-input-placeholder,
20238 .webhook-settings-drawer .wpfnl-field-wrapper select::-webkit-input-placeholder {
20239 color: #A7A8B3;
20240 }
20241 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]::-moz-placeholder,
20242 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]::-moz-placeholder,
20243 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]::-moz-placeholder,
20244 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]::-moz-placeholder,
20245 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]::-moz-placeholder,
20246 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]::-moz-placeholder,
20247 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]::-moz-placeholder,
20248 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]::-moz-placeholder,
20249 .webhook-settings-drawer .wpfnl-field-wrapper select::-moz-placeholder {
20250 color: #A7A8B3;
20251 }
20252 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]:-ms-input-placeholder,
20253 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]:-ms-input-placeholder,
20254 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]:-ms-input-placeholder,
20255 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]:-ms-input-placeholder,
20256 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]:-ms-input-placeholder,
20257 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]:-ms-input-placeholder,
20258 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]:-ms-input-placeholder,
20259 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]:-ms-input-placeholder,
20260 .webhook-settings-drawer .wpfnl-field-wrapper select:-ms-input-placeholder {
20261 color: #A7A8B3;
20262 }
20263 .webhook-settings-drawer .wpfnl-field-wrapper input[type=date]:-moz-placeholder,
20264 .webhook-settings-drawer .wpfnl-field-wrapper input[type=search]:-moz-placeholder,
20265 .webhook-settings-drawer .wpfnl-field-wrapper input[type=url]:-moz-placeholder,
20266 .webhook-settings-drawer .wpfnl-field-wrapper input[type=tel]:-moz-placeholder,
20267 .webhook-settings-drawer .wpfnl-field-wrapper input[type=number]:-moz-placeholder,
20268 .webhook-settings-drawer .wpfnl-field-wrapper input[type=password]:-moz-placeholder,
20269 .webhook-settings-drawer .wpfnl-field-wrapper input[type=email]:-moz-placeholder,
20270 .webhook-settings-drawer .wpfnl-field-wrapper input[type=text]:-moz-placeholder,
20271 .webhook-settings-drawer .wpfnl-field-wrapper select:-moz-placeholder {
20272 color: #A7A8B3;
20273 }
20274 .webhook-settings-drawer .wpfnl-field-wrapper select {
20275 color: #A7A8B3;
20276 max-width: 240px;
20277 width: 100%;
20278 padding-right: 36px;
20279 -moz-appearance: none;
20280 -webkit-appearance: none;
20281 appearance: none;
20282 background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgNyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiBkPSJNMTAuODEzIDFsLTQuNSA0LjUtNC41LTQuNSIvPjwvc3ZnPg==");
20283 background-repeat: no-repeat;
20284 background-position-x: calc(100% - 13px);
20285 background-position-y: 13px;
20286 background-size: 12px 12px;
20287 }
20288 .webhook-settings-drawer .wpfnl-field-wrapper select.value-selected {
20289 color: #363B4E;
20290 }
20291 .webhook-settings-drawer .wpfnl-field-wrapper select option {
20292 color: #A7A8B3;
20293 }
20294 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-tooltip p {
20295 min-width: 160px;
20296 }
20297 .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-custom-single-select {
20298 width: 240px;
20299 }
20300 .webhook-settings-drawer .feed-name .wpfnl-tooltip p {
20301 left: calc(100% + 8px);
20302 transform: translate(0, 50%);
20303 bottom: 50%;
20304 }
20305 .webhook-settings-drawer .feed-name .wpfnl-tooltip p:before {
20306 left: -4px;
20307 bottom: 50%;
20308 margin: 0 0px -6px 0px;
20309 }
20310 .webhook-settings-drawer .request-url input[type=text] {
20311 padding-left: 50px;
20312 }
20313 .webhook-settings-drawer .primary-settings {
20314 padding: 30px 0;
20315 }
20316 .webhook-settings-drawer .additional-settings {
20317 padding-top: 30px;
20318 }
20319 .webhook-settings-drawer .request-header-settings,
20320 .webhook-settings-drawer .primary-settings {
20321 border-bottom: 1px solid #EEF0F3;
20322 }
20323 .webhook-settings-drawer .primary-settings .request-formate .wpfnl-fields,
20324 .webhook-settings-drawer .primary-settings .request-method .wpfnl-fields {
20325 max-width: 100%;
20326 }
20327 .webhook-settings-drawer .request-header {
20328 align-items: flex-start;
20329 }
20330 .webhook-settings-drawer .request-header > label {
20331 position: relative;
20332 top: 34px;
20333 }
20334 .webhook-settings-drawer .request-body-loop-wrapper .loop-header,
20335 .webhook-settings-drawer .request-body-loop-wrapper .single-loop {
20336 display: flex;
20337 flex-flow: row wrap;
20338 align-items: flex-start;
20339 margin-bottom: 14px;
20340 gap: 10px;
20341 }
20342 .webhook-settings-drawer .request-body-loop-wrapper .loop-header:last-child,
20343 .webhook-settings-drawer .request-body-loop-wrapper .single-loop:last-child {
20344 margin-bottom: 0;
20345 }
20346 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .value,
20347 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .name,
20348 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .value,
20349 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .name {
20350 width: calc(50% - 29px);
20351 }
20352 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .value .crm-data-loader,
20353 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .value .crm-data-loader {
20354 width: calc(100% - 13px);
20355 left: 2px;
20356 }
20357 .webhook-settings-drawer .request-body-loop-wrapper .loop-header input,
20358 .webhook-settings-drawer .request-body-loop-wrapper .loop-header select,
20359 .webhook-settings-drawer .request-body-loop-wrapper .single-loop input,
20360 .webhook-settings-drawer .request-body-loop-wrapper .single-loop select {
20361 min-width: auto;
20362 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
20363 border-radius: 6px;
20364 border: none;
20365 max-width: 100%;
20366 }
20367 .webhook-settings-drawer .request-body-loop-wrapper .loop-header {
20368 margin-bottom: 8px;
20369 }
20370 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .value,
20371 .webhook-settings-drawer .request-body-loop-wrapper .loop-header .name {
20372 font-size: 14px;
20373 line-height: 1.2;
20374 font-weight: 500;
20375 color: #363B4E;
20376 }
20377 .webhook-settings-drawer .request-body-loop-wrapper .single-loop {
20378 background: #F6F5FA;
20379 border-radius: 10px;
20380 padding: 16px;
20381 }
20382 .webhook-settings-drawer .request-body-loop-wrapper .single-loop.only-one .value,
20383 .webhook-settings-drawer .request-body-loop-wrapper .single-loop.only-one .name {
20384 width: calc(50% - 5px);
20385 }
20386 .webhook-settings-drawer .request-body-loop-wrapper .single-loop.only-one .actions {
20387 display: none;
20388 }
20389 .webhook-settings-drawer .request-body-loop-wrapper .single-loop .wpfnl-custom-single-select .custom-select-wrapper {
20390 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
20391 border: none;
20392 }
20393 .webhook-settings-drawer .request-body-loop-wrapper .actions button {
20394 border: none;
20395 line-height: 1;
20396 padding: 3px;
20397 cursor: pointer;
20398 background: #FFFFFF;
20399 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
20400 border-radius: 6px;
20401 width: 38px;
20402 height: 38px;
20403 display: flex;
20404 flex-flow: column;
20405 align-items: center;
20406 justify-content: center;
20407 }
20408 .webhook-settings-drawer .request-body-loop-wrapper .actions button svg {
20409 display: block;
20410 }
20411 .webhook-settings-drawer .request-body-loop-wrapper .add-option-area {
20412 border: 1px dashed #C1C6CD;
20413 border-radius: 10px;
20414 padding: 20px;
20415 display: flex;
20416 flex-flow: column;
20417 align-items: center;
20418 justify-content: center;
20419 }
20420 .webhook-settings-drawer .request-body-loop-wrapper .add-option-area .add-option {
20421 display: flex;
20422 align-items: center;
20423 justify-content: center;
20424 gap: 8px;
20425 padding: 2px 25px 0 25px;
20426 line-height: 1;
20427 }
20428 .webhook-settings-drawer .request-body-loop-wrapper .add-option-area .add-option svg {
20429 width: 12px;
20430 height: 12px;
20431 }
20432 .webhook-settings-drawer .request-body-loop-wrapper.data-loaded .single-loop .value .crm-data-loader {
20433 display: none;
20434 }
20435 .webhook-settings-drawer .additional-settings .webhook-event .wpfnl-fields {
20436 max-width: 100%;
20437 }
20438 .webhook-settings-drawer .additional-settings .request-body {
20439 align-items: flex-start;
20440 }
20441 .webhook-settings-drawer .additional-settings .request-body > label {
20442 position: relative;
20443 top: 2px;
20444 width: 180px;
20445 }
20446 .webhook-settings-drawer .additional-settings .request-body > .wpfnl-fields {
20447 max-width: 100%;
20448 width: calc(100% - 180px);
20449 }
20450 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn {
20451 margin-bottom: 10px;
20452 display: block;
20453 }
20454 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label {
20455 font-size: 13px;
20456 color: #363B4E;
20457 }
20458 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label::before {
20459 background: #F6F5FA;
20460 border-color: #EEF0F3;
20461 width: 20px;
20462 height: 20px;
20463 }
20464 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label::after {
20465 left: 6px;
20466 top: 3px;
20467 width: 8px;
20468 height: 8px;
20469 }
20470 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn input[type=radio]:checked + label::before {
20471 background: #6E42D3;
20472 }
20473 .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn input[type=radio]:checked + label::after {
20474 background: #ffffff;
20475 }
20476 .webhook-settings-drawer .additional-settings .request-body .request-body-loop-wrapper {
20477 margin-top: 20px;
20478 border: 1px solid #EEF0F3;
20479 border-radius: 10px;
20480 padding: 16px 20px 20px;
20481 }
20482
20483 @media only screen and (max-width: 1699px) {
20484 .wpfnl-webhook-drawer .webhook-content {
20485 max-width: 1280px;
20486 width: 100%;
20487 margin: 0 auto;
20488 }
20489 }
20490 @media only screen and (max-width: 991px) {
20491 .webhook-settings-drawer {
20492 width: 700px;
20493 }
20494 }
20495 @media only screen and (max-width: 782px) {
20496 .wpfnl-webhook-drawer {
20497 width: 100%;
20498 }
20499 }
20500 .wpfnl-settings-drawer .drawer-body {
20501 background: #f6f5fa;
20502 }
20503 .wpfnl-settings-drawer .fnl-settings-content {
20504 margin-top: 30px;
20505 }
20506 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-field-wrapper > label {
20507 width: 310px;
20508 }
20509 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-field-wrapper .wpfnl-fields {
20510 max-width: 350px;
20511 width: calc(100% - 350px);
20512 }
20513 .wpfnl-settings-drawer .fnl-settings-content .settings-title {
20514 padding: 16px 24px;
20515 display: flex;
20516 flex-flow: row wrap;
20517 align-items: center;
20518 font-weight: 500;
20519 color: #363B4E;
20520 text-transform: capitalize;
20521 box-shadow: 0px 2px 4px rgba(220, 220, 237, 0.4);
20522 background: #ffffff;
20523 border-radius: 10px 10px 0 0;
20524 position: relative;
20525 }
20526 .wpfnl-settings-drawer .fnl-settings-content .settings-title > svg {
20527 margin-right: 10px;
20528 }
20529 .wpfnl-settings-drawer .fnl-settings-content .settings-title a {
20530 line-height: 1;
20531 position: relative;
20532 top: 3px;
20533 margin-left: auto;
20534 }
20535 .wpfnl-settings-drawer .fnl-settings-content .settings-title a svg {
20536 width: 20px;
20537 height: 20px;
20538 }
20539 .wpfnl-settings-drawer .fnl-settings-content .settings-title a svg path {
20540 stroke: #6E42D3;
20541 }
20542 .wpfnl-settings-drawer .fnl-settings-content .hints {
20543 width: 100%;
20544 display: block;
20545 color: #f68a40;
20546 }
20547 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-box {
20548 background: #ffffff;
20549 border-radius: 10px;
20550 padding: 30px;
20551 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
20552 }
20553 .wpfnl-settings-drawer .fnl-settings-content .pro-tag-icon {
20554 transform: translateY(6px);
20555 margin-left: 0px;
20556 position: static;
20557 display: inline-block;
20558 }
20559 .wpfnl-settings-drawer .fnl-settings-content .settings-title + .wpfnl-box {
20560 border-radius: 0 0 10px 10px;
20561 }
20562 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-checkbox.disabled > label {
20563 cursor: not-allowed;
20564 opacity: 0.5;
20565 }
20566 .wpfnl-settings-drawer .fnl-settings-content .wpfnl-checkbox.disabled > label:before {
20567 background-color: #d7d7d7;
20568 }
20569 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm {
20570 display: flex;
20571 flex-flow: row wrap;
20572 }
20573 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper {
20574 display: block;
20575 width: 50%;
20576 padding-right: 30px;
20577 }
20578 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper > label {
20579 width: auto;
20580 margin-bottom: 8px;
20581 display: block;
20582 padding: 0;
20583 }
20584 .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper .wpfnl-fields {
20585 max-width: 100%;
20586 width: 100%;
20587 }
20588 .wpfnl-settings-drawer .settings-content__footer {
20589 border-top: 1px solid #E2E5ED;
20590 padding: 20px 0 20px;
20591 margin-top: 30px;
20592 display: flex;
20593 flex-flow: row wrap;
20594 align-items: center;
20595 justify-content: flex-end;
20596 position: relative;
20597 }
20598 .wpfnl-settings-drawer .settings-content__footer .update {
20599 display: flex;
20600 flex-flow: row;
20601 align-items: center;
20602 justify-content: center;
20603 line-height: 39px;
20604 }
20605 .wpfnl-settings-drawer .settings-content__footer .wpfnl-alert {
20606 display: inline-block;
20607 margin-right: 10px;
20608 }
20609 .wpfnl-settings-drawer .settings-content__footer .wpfnl-loader {
20610 display: inline-block;
20611 }
20612
20613 .wpfnl-automations {
20614 position: relative;
20615 }
20616 .wpfnl-automations::before {
20617 content: "";
20618 position: absolute;
20619 top: 0;
20620 left: 0;
20621 pointer-events: none;
20622 background: linear-gradient(188deg, #E8E2FF 6.05%, #FFF 95.27%);
20623 height: 650px;
20624 width: 100%;
20625 }
20626 .wpfnl-automations .wpfnl-automation-hero {
20627 display: flex;
20628 flex-flow: row wrap;
20629 align-items: flex-start;
20630 gap: 40px;
20631 justify-content: space-between;
20632 max-width: 950px;
20633 margin: 0 auto;
20634 width: 100%;
20635 padding-top: 84px;
20636 margin-bottom: 60px;
20637 }
20638 .wpfnl-automations .wpfnl-automation-hero .wpfnl-automation-hero-left {
20639 width: 50%;
20640 max-width: 500px;
20641 }
20642 .wpfnl-automations .wpfnl-automation-hero .wpfnl-automation-hero-right {
20643 width: 240px;
20644 }
20645 .wpfnl-automations .wpfnl-automation-hero .hero-title {
20646 color: #1D2327;
20647 font-size: 40px;
20648 font-weight: 700;
20649 line-height: 1.15;
20650 margin-bottom: 10px;
20651 }
20652 .wpfnl-automations .wpfnl-automation-hero .hero-description {
20653 color: #1F2937;
20654 font-size: 16px;
20655 font-weight: 400;
20656 line-height: 1.5;
20657 margin-bottom: 20px;
20658 }
20659 .wpfnl-automations .wpfnl-automation-hero .cta-buttons {
20660 display: flex;
20661 gap: 8px;
20662 }
20663 .wpfnl-automations .wpfnl-automation-hero .btn-default {
20664 height: auto;
20665 line-height: 1;
20666 padding: 17px 22px;
20667 border: 1px solid transparent;
20668 display: inline-flex;
20669 gap: 6px;
20670 }
20671 .wpfnl-automations .wpfnl-automation-hero .btn-default .btn-text {
20672 font-size: 14px;
20673 display: block;
20674 color: #fff;
20675 font-weight: 500;
20676 line-height: 1;
20677 }
20678 .wpfnl-automations .wpfnl-automation-hero .btn-default.outline {
20679 background: #eee;
20680 border-color: #d8d8d8;
20681 color: #1e2327;
20682 }
20683 .wpfnl-automations .wpfnl-automation-hero .btn-default.outline .btn-text {
20684 color: #1e2327;
20685 }
20686 .wpfnl-automations .wpfnl-automation-hero .loader svg {
20687 display: block;
20688 }
20689 .wpfnl-automations .wpfnl-automation-hero .rating {
20690 color: #1F2937;
20691 font-size: 13px;
20692 font-weight: 400;
20693 line-height: 1;
20694 border-radius: 40px;
20695 border: 1px solid #D3CAF3;
20696 padding: 7px 10px;
20697 display: inline-flex;
20698 align-items: center;
20699 gap: 5px;
20700 }
20701 .wpfnl-automations .wpfnl-automation-hero .feature-list {
20702 display: flex;
20703 flex-flow: column;
20704 gap: 20px;
20705 margin-top: 23px;
20706 }
20707 .wpfnl-automations .wpfnl-automation-hero .feature-list li {
20708 color: #1F2937;
20709 font-size: 15px;
20710 font-weight: 400;
20711 line-height: 1.1;
20712 position: relative;
20713 padding-left: 26px;
20714 }
20715 .wpfnl-automations .wpfnl-automation-hero .feature-list li::before {
20716 content: "";
20717 position: absolute;
20718 top: 0;
20719 left: 0;
20720 width: 18px;
20721 height: 18px;
20722 background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHZpZXdCb3g9IjAgMCAxOCAxOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1IDQuNUw2Ljc1IDEyLjc1TDMgOSIgc3Ryb2tlPSIjNkU0MkQzIiBzdHJva2Utd2lkdGg9IjEuOCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=);
20723 }
20724
20725 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-left {
20726 margin-bottom: 0 !important;
20727 }
20728 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-left .wpfnl-dashboard-title {
20729 color: #363B4E;
20730 font-size: 20px;
20731 font-style: normal;
20732 font-weight: 600;
20733 line-height: 1.1;
20734 }
20735 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-right {
20736 display: flex;
20737 align-items: center;
20738 gap: 15px;
20739 }
20740 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-right .funnel-search,
20741 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__header .wpfnl-dashboard-header-right .import-export {
20742 margin: 0;
20743 }
20744 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .hero-section .hero-video-container {
20745 position: relative;
20746 padding: 0 15px 553px 15px;
20747 height: 0;
20748 overflow: hidden;
20749 border-radius: 24px;
20750 max-width: 950px;
20751 width: 100%;
20752 margin: 0 auto;
20753 border: 6px solid #FFFFFF;
20754 }
20755 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .hero-section .hero-video-container iframe {
20756 position: absolute;
20757 top: 0;
20758 left: 0;
20759 width: 100%;
20760 height: 553px;
20761 }
20762 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section {
20763 margin-bottom: 80px;
20764 margin-top: 80px;
20765 }
20766 @media (max-width: 1199px) {
20767 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section {
20768 margin-bottom: 60px;
20769 margin-top: 60px;
20770 }
20771 }
20772 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container {
20773 max-width: 1440px;
20774 margin: 0 auto;
20775 padding: 0 15px;
20776 }
20777 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .section-title {
20778 color: #1D2327;
20779 text-align: center;
20780 font-size: 30px;
20781 font-weight: 700;
20782 line-height: 1.2;
20783 margin-bottom: 40px;
20784 }
20785 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid {
20786 display: grid;
20787 grid-template-columns: repeat(2, 1fr);
20788 gap: 20px;
20789 max-width: 846px;
20790 width: 100%;
20791 margin: 0 auto;
20792 }
20793 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card {
20794 background: #ffffff;
20795 border-radius: 20px;
20796 padding: 40px;
20797 box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
20798 transition: transform 0.3s ease, box-shadow 0.3s ease;
20799 }
20800 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card:hover {
20801 transform: translateY(-0.5px);
20802 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
20803 }
20804 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card .feature-title {
20805 color: #363B4E;
20806 font-size: 18px;
20807 font-style: normal;
20808 font-weight: 600;
20809 line-height: 1.1;
20810 margin: 22px 0 10px;
20811 }
20812 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card .feature-description {
20813 color: #7A8B9A;
20814 font-size: 15px;
20815 font-style: normal;
20816 font-weight: 400;
20817 line-height: 1.6;
20818 }
20819 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-footer {
20820 color: #363B4E;
20821 text-align: center;
20822 font-size: 20px;
20823 font-style: normal;
20824 font-weight: 700;
20825 line-height: 1.2;
20826 margin-top: 30px;
20827 }
20828 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section {
20829 margin: 0 15px;
20830 }
20831 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container {
20832 display: flex;
20833 align-items: center;
20834 justify-content: space-between;
20835 gap: 40px;
20836 max-width: 950px;
20837 width: 100%;
20838 margin: 0 auto 64px;
20839 border-radius: 30px;
20840 background: linear-gradient(180deg, #08020C 0%, #2C0C47 56.01%, #4D157C 100%);
20841 padding: 56px 60px;
20842 position: relative;
20843 overflow: hidden;
20844 }
20845 @media (max-width: 1399px) {
20846 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container {
20847 margin-bottom: 50px;
20848 }
20849 }
20850 @media (max-width: 1199px) {
20851 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container {
20852 padding: 36px 40px;
20853 border-radius: 20px;
20854 }
20855 }
20856 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container::before {
20857 content: "";
20858 position: absolute;
20859 top: 0;
20860 left: 0;
20861 right: 0;
20862 bottom: 0;
20863 background: url("../images/automation-cta-bg.webp") no-repeat center center;
20864 background-size: cover;
20865 opacity: 0.3;
20866 pointer-events: none;
20867 z-index: -1;
20868 }
20869 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text {
20870 width: calc(100% - 260px);
20871 max-width: 470px;
20872 }
20873 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text .cta-title {
20874 font-weight: 600;
20875 font-size: 30px;
20876 line-height: 1.33;
20877 color: #ffffff;
20878 margin-bottom: 16px;
20879 }
20880 @media (max-width: 1199px) {
20881 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text .cta-title {
20882 font-size: 26px;
20883 }
20884 }
20885 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-text .cta-subtitle {
20886 font-weight: 400;
20887 font-size: 15px;
20888 line-height: 1.6;
20889 color: rgba(255, 255, 255, 0.9);
20890 }
20891 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper {
20892 width: 218px;
20893 display: flex;
20894 align-items: center;
20895 justify-content: end;
20896 }
20897 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn {
20898 padding: 12px 24px;
20899 border-radius: 10px;
20900 font-weight: 500;
20901 font-size: 16px;
20902 cursor: pointer;
20903 border: none;
20904 transition: all 0.3s ease;
20905 font-style: normal;
20906 line-height: normal;
20907 display: inline-block;
20908 }
20909 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn:hover {
20910 transform: translateY(-2px);
20911 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
20912 }
20913 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn-primary {
20914 background: #ffffff;
20915 color: #6E41D3;
20916 box-shadow: 0 2px 4px rgba(223, 223, 249, 0.25);
20917 }
20918 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .bottom-cta-section .cta-content-container .cta-btn-wrapper .btn-primary:hover {
20919 color: rgb(94.9871244635, 47.4935622318, 204.0064377682);
20920 }
20921 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-name {
20922 width: 240px;
20923 }
20924 @media (max-width: 1199px) {
20925 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-name {
20926 width: 180px;
20927 }
20928 }
20929 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-customers {
20930 display: flex;
20931 flex-flow: row wrap;
20932 align-items: center;
20933 gap: 8px;
20934 width: 375px;
20935 }
20936 @media (max-width: 1199px) {
20937 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-customers {
20938 width: 270px;
20939 }
20940 }
20941 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-status {
20942 width: 75px;
20943 position: relative;
20944 }
20945 @media (max-width: 1199px) {
20946 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .wpfnl-status {
20947 width: 60px;
20948 }
20949 }
20950 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .list-action {
20951 display: flex;
20952 flex-flow: row;
20953 align-items: center;
20954 width: 80px;
20955 gap: 9px;
20956 }
20957 @media (max-width: 1199px) {
20958 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list .list-action {
20959 width: 80px;
20960 }
20961 }
20962 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .funnel-list__wrapper .funnel__single-list.list-header .list-cell {
20963 color: #7A8B9A;
20964 font-family: Roboto;
20965 font-size: 14px;
20966 font-style: normal;
20967 font-weight: 400;
20968 line-height: normal;
20969 }
20970 .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 {
20971 padding: 0;
20972 }
20973 .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 {
20974 display: flex;
20975 align-items: center;
20976 gap: 5px;
20977 }
20978 .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 {
20979 display: flex;
20980 align-items: center;
20981 gap: 6px;
20982 padding: 8px 12px;
20983 border: 1px solid #EEF0F3;
20984 border-radius: 100px;
20985 }
20986 @media (max-width: 1199px) {
20987 .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 {
20988 padding: 6px 10px;
20989 }
20990 }
20991 .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 {
20992 color: #7A8B9A;
20993 font-size: 13px;
20994 font-style: normal;
20995 font-weight: 400;
20996 line-height: 1.08;
20997 }
20998 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer {
20999 display: flex;
21000 flex-flow: row wrap;
21001 align-items: center;
21002 justify-content: space-between;
21003 padding: 17px 24px;
21004 }
21005 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer .pagination-number p {
21006 display: flex;
21007 align-items: center;
21008 gap: 10px;
21009 white-space: nowrap;
21010 }
21011 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer .pagination-number p select {
21012 width: 56px;
21013 min-width: auto;
21014 padding: 2px 8px;
21015 height: 32px;
21016 }
21017 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .list-footer .pagination .wpfnl-pagination {
21018 display: flex;
21019 align-items: center;
21020 justify-content: center;
21021 }
21022 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
21023 padding: 95px 85px;
21024 background: #FFFFFF;
21025 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
21026 border-radius: 10px;
21027 display: flex;
21028 gap: 20px;
21029 }
21030 @media (max-width: 1550px) {
21031 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
21032 padding: 40px;
21033 }
21034 }
21035 @media (max-width: 1399px) {
21036 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
21037 flex-direction: column;
21038 }
21039 }
21040 @media (max-width: 1199px) {
21041 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper {
21042 padding: 30px;
21043 }
21044 }
21045 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-dashboard__inner-content .wpfnl-funnel-automation-pro-settings-wrapper .feature-content-wrapper {
21046 border: 1px solid #EEF0F3;
21047 border-radius: 10px;
21048 flex: 1;
21049 }
21050 .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 {
21051 border-radius: 10px 10px 0 0;
21052 background: #F6F5FA;
21053 display: grid;
21054 grid-template-columns: repeat(2, 1fr);
21055 gap: 10px;
21056 padding: 20px;
21057 border-bottom: 1px solid #EEF0F3;
21058 }
21059 .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 {
21060 display: flex;
21061 align-items: center;
21062 justify-content: center;
21063 padding: 26px;
21064 }
21065 .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 {
21066 max-width: 433px;
21067 width: 100%;
21068 }
21069 .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 {
21070 background: #ffffff;
21071 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
21072 border-radius: 10px;
21073 padding: 20px;
21074 }
21075 @media (max-width: 1550px) {
21076 .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 {
21077 padding: 17px;
21078 }
21079 }
21080 .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 {
21081 color: #2D3149;
21082 font-size: 14px;
21083 font-style: normal;
21084 font-weight: 600;
21085 line-height: 1.14;
21086 letter-spacing: -0.14px;
21087 margin: 10px 0;
21088 }
21089 .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 {
21090 padding: 30px;
21091 }
21092 .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 {
21093 color: #2D3149;
21094 font-size: 18px;
21095 text-align: center;
21096 font-style: normal;
21097 font-weight: 700;
21098 line-height: 1.2;
21099 margin-bottom: 14px;
21100 }
21101 .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 {
21102 color: #7A8B9A;
21103 text-align: center;
21104 font-size: 14px;
21105 font-style: normal;
21106 font-weight: 400;
21107 line-height: 1.5;
21108 max-width: 372px;
21109 width: 100%;
21110 margin: 0 auto;
21111 }
21112
21113 @media screen and (max-width: 1399px) {
21114 .wpfnl-automations .wpfnl-automation-hero {
21115 padding-top: 54px;
21116 }
21117 .wpfnl-automations .wpfnl-automation-hero .hero-title {
21118 font-size: 34px;
21119 }
21120 }
21121 @media screen and (max-width: 1199px) {
21122 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .hero-section .hero-video-container {
21123 padding: 0 15px 493px 15px;
21124 }
21125 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .section-title {
21126 font-size: 24px;
21127 margin-bottom: 25px;
21128 }
21129 .wpfunnels_page_wpfnl_automations .wpfnl-dashboard .dashboard-nav__content .wpfnl-automation-content .features-section .feature-container .features-grid .feature-card {
21130 padding: 26px;
21131 border-radius: 14px;
21132 }
21133 }
21134 .wpfnl-integrations {
21135 width: 100%;
21136 margin-top: 20px;
21137 padding-bottom: 40px;
21138 }
21139 .wpfnl-integrations .dashboard-nav__content {
21140 max-width: 1200px;
21141 }
21142 .wpfnl-integrations .integration-section-title {
21143 color: #1D2327;
21144 font-size: 20px;
21145 font-weight: 600;
21146 line-height: 1.2;
21147 margin-bottom: 30px;
21148 display: flex;
21149 align-items: center;
21150 gap: 10px;
21151 }
21152 .wpfnl-integrations .integrations-content {
21153 margin-top: 30px;
21154 }
21155 .wpfnl-integrations .integrations-banner {
21156 background-color: #171427;
21157 background-image: url("../images/integration-banner-bg.webp");
21158 background-size: cover;
21159 background-position: center;
21160 background-repeat: no-repeat;
21161 border-radius: 20px;
21162 padding: 30px;
21163 display: flex;
21164 flex-direction: column;
21165 align-items: center;
21166 justify-content: center;
21167 text-align: center;
21168 height: 303px;
21169 overflow: hidden;
21170 position: relative;
21171 }
21172 .wpfnl-integrations .integrations-banner .circle-blur {
21173 position: absolute;
21174 top: 50%;
21175 left: 50%;
21176 width: 570px;
21177 height: 550px;
21178 background: #6E42D3;
21179 filter: blur(250px);
21180 border-radius: 50%;
21181 transform: translate(-50%, -50%);
21182 display: block;
21183 z-index: 0;
21184 }
21185 .wpfnl-integrations .integrations-banner .banner-title {
21186 color: #FFF;
21187 font-size: 30px;
21188 font-weight: 600;
21189 line-height: 1.2;
21190 position: relative;
21191 z-index: 1;
21192 }
21193 .wpfnl-integrations .integrations-banner .banner-description {
21194 color: #FFF;
21195 font-size: 14px;
21196 font-weight: 400;
21197 line-height: 1.5;
21198 max-width: 618px;
21199 margin: 9px auto 0;
21200 position: relative;
21201 z-index: 1;
21202 }
21203 .wpfnl-integrations .integrations-banner .banner-cta-btn {
21204 color: #442D81;
21205 font-size: 17px;
21206 font-weight: 500;
21207 line-height: 1;
21208 border-radius: 10px;
21209 background: #FFF;
21210 padding: 12px 25px;
21211 margin-top: 24px;
21212 display: flex;
21213 align-items: center;
21214 justify-content: center;
21215 gap: 6px;
21216 position: relative;
21217 z-index: 1;
21218 }
21219 .wpfnl-integrations .integrations-banner .banner-cta-btn:focus, .wpfnl-integrations .integrations-banner .banner-cta-btn:hover {
21220 background-color: #6E42D3;
21221 color: #FFF;
21222 }
21223 .wpfnl-integrations .integrations-list {
21224 margin-top: 33px;
21225 }
21226 .wpfnl-integrations .integrations-header {
21227 display: flex;
21228 align-items: center;
21229 justify-content: space-between;
21230 margin-bottom: 24px;
21231 }
21232 .wpfnl-integrations .integrations-title {
21233 color: #1D2327;
21234 font-size: 24px;
21235 font-weight: 600;
21236 line-height: 1.2;
21237 margin: 0;
21238 }
21239 .wpfnl-integrations .integrations-search {
21240 position: relative;
21241 display: flex;
21242 align-items: center;
21243 }
21244 .wpfnl-integrations .integrations-search svg {
21245 position: absolute;
21246 left: 14px;
21247 pointer-events: none;
21248 top: 14px;
21249 }
21250 .wpfnl-integrations input[type=text].integrations-search-input {
21251 width: 260px;
21252 padding: 7px 16px 7px 36px;
21253 height: 40px;
21254 font-size: 14px;
21255 color: #1D2327;
21256 background: #FFF;
21257 transition: all 0.3s ease;
21258 border-radius: 10px;
21259 box-shadow: 0 1px 1px 0 rgba(182, 185, 191, 0.3);
21260 border: none;
21261 }
21262 .wpfnl-integrations input[type=text].integrations-search-input::placeholder {
21263 color: #707070;
21264 }
21265 .wpfnl-integrations input[type=text].integrations-search-input:focus {
21266 outline: 1px solid #b9a3ee;
21267 }
21268 .wpfnl-integrations .integrations-grid {
21269 display: grid;
21270 grid-template-columns: repeat(4, 1fr);
21271 gap: 20px;
21272 }
21273 .wpfnl-integrations .integrations-no-results {
21274 text-align: center;
21275 padding: 60px 20px;
21276 }
21277 .wpfnl-integrations .integrations-no-results p {
21278 font-size: 18px;
21279 color: #1F2937;
21280 line-height: 1.2;
21281 }
21282 .wpfnl-integrations .integration-card {
21283 background: #FFF;
21284 border-radius: 10px;
21285 padding: 24px;
21286 transition: all 0.3s ease;
21287 position: relative;
21288 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
21289 }
21290 .wpfnl-integrations .integration-card-icon {
21291 display: block;
21292 margin-bottom: 20px;
21293 }
21294 .wpfnl-integrations .integration-card-lock {
21295 position: absolute;
21296 top: 16px;
21297 right: 16px;
21298 }
21299 .wpfnl-integrations .integration-card-lock svg {
21300 display: block;
21301 }
21302 .wpfnl-integrations .integration-card-title {
21303 color: #1F2937;
21304 font-size: 16px;
21305 font-weight: 600;
21306 line-height: 1.2;
21307 margin: 0 0 8px 0;
21308 display: flex;
21309 align-items: center;
21310 gap: 8px;
21311 }
21312 .wpfnl-integrations .integration-card-badge {
21313 background: #6E42D3;
21314 color: #FFF;
21315 font-size: 11px;
21316 font-weight: 500;
21317 padding: 3px 8px;
21318 border-radius: 4px;
21319 line-height: 1;
21320 }
21321 .wpfnl-integrations .integration-card-description {
21322 color: #707070;
21323 font-size: 14px;
21324 font-weight: 400;
21325 line-height: 1.5;
21326 margin: 0;
21327 }
21328
21329 @media screen and (max-width: 1199px) {
21330 .wpfnl-integrations .integrations-banner {
21331 height: 263px;
21332 }
21333 .wpfnl-integrations .integrations-banner .banner-title {
21334 font-size: 26px;
21335 }
21336 .wpfnl-integrations .integrations-title {
21337 font-size: 20px;
21338 }
21339 .wpfnl-integrations .integrations-grid {
21340 grid-template-columns: repeat(3, 1fr);
21341 }
21342 }
21343 .wpfnl-templates-page .dashboard-nav__content {
21344 width: 100%;
21345 padding: 24px;
21346 }
21347 .wpfnl-templates-page #templates-library {
21348 min-height: 580px;
21349 width: 100%;
21350 }
21351 .wpfnl-templates-page .create-funnel-loader-overlay#create-funnel-loader {
21352 position: static;
21353 opacity: 1;
21354 visibility: visible;
21355 display: flex;
21356 width: 100%;
21357 min-height: calc(100vh - 120px);
21358 height: auto;
21359 margin: 0;
21360 }
21361 .wpfnl-templates-page .template-library-modal {
21362 position: relative !important;
21363 top: 0 !important;
21364 left: 0 !important;
21365 width: 100% !important;
21366 height: auto !important;
21367 background: transparent !important;
21368 z-index: 1 !important;
21369 }
21370 .wpfnl-templates-page .template-library-modal .funnel-templates-sidebar .category-filter-wrapper {
21371 height: max-content;
21372 overflow: inherit;
21373 }
21374 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates-wrapper {
21375 max-height: max-content;
21376 overflow: inherit;
21377 width: calc(100% - 280px);
21378 margin: 0 auto;
21379 }
21380 .wpfnl-templates-page .template-library-modal .back-form-modal.wpfnl-modal-close {
21381 display: none !important;
21382 }
21383 .wpfnl-templates-page .template-library-modal #wpfnl-create-funnel__inner-content {
21384 display: block !important;
21385 }
21386 .wpfnl-templates-page .template-library-modal .funnel-templates-content {
21387 padding-right: 0;
21388 }
21389 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates {
21390 gap: 24px;
21391 row-gap: 40px;
21392 }
21393 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
21394 width: calc(25% - 18px);
21395 }
21396
21397 @media only screen and (max-width: 1699px) {
21398 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates-wrapper {
21399 width: calc(100% - 80px);
21400 }
21401 }
21402 @media only screen and (max-width: 1399px) {
21403 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates-wrapper {
21404 width: calc(100% - 48px);
21405 }
21406 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates {
21407 row-gap: 30px;
21408 }
21409 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
21410 width: calc(33.3333333333% - 16px);
21411 }
21412 }
21413 @media only screen and (max-width: 1199px) {
21414 .wpfnl-templates-page .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template {
21415 width: calc(50% - 12px);
21416 }
21417 }
21418 .ab-testing-drawer {
21419 box-shadow: none;
21420 width: calc(100% - 160px);
21421 transition: none;
21422 }
21423 .ab-testing-drawer .drawer-wrapper {
21424 background: #F6F5FA;
21425 }
21426 .ab-testing-drawer .ab-testing-drawer-loader {
21427 position: absolute;
21428 left: 0;
21429 top: 0;
21430 width: 100%;
21431 height: 100%;
21432 display: flex;
21433 flex-flow: column;
21434 align-items: center;
21435 justify-content: center;
21436 background: #f6f5fa;
21437 z-index: 2;
21438 }
21439 .ab-testing-drawer .ab-testing-drawer-loader .wpfnl-loader {
21440 display: block;
21441 width: 50px;
21442 height: 50px;
21443 }
21444
21445 .folded .ab-testing-drawer {
21446 width: calc(100% - 36px);
21447 }
21448
21449 @media only screen and (max-width: 782px) {
21450 .folded .ab-testing-drawer {
21451 width: 100%;
21452 top: 46px;
21453 }
21454 }
21455 .ab-testing-drawer .drawer-header {
21456 background: #ffffff;
21457 position: relative;
21458 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
21459 padding: 15px 24px;
21460 gap: 10px;
21461 }
21462 .ab-testing-drawer .header-left {
21463 display: flex;
21464 align-items: center;
21465 gap: 10px;
21466 }
21467 .ab-testing-drawer .header-left.is-pro {
21468 position: relative;
21469 z-index: 2;
21470 }
21471 .ab-testing-drawer .header-left > h4 {
21472 display: flex;
21473 flex-flow: row wrap;
21474 align-items: center;
21475 }
21476 .ab-testing-drawer .header-left .step-type,
21477 .ab-testing-drawer .header-left .step-title {
21478 color: #363B4E;
21479 font-size: 15px;
21480 font-weight: 500;
21481 line-height: 1;
21482 }
21483 .ab-testing-drawer .header-left .step-title {
21484 max-width: 235px;
21485 white-space: nowrap;
21486 overflow: hidden;
21487 text-overflow: ellipsis;
21488 }
21489 .ab-testing-drawer .header-left .step-type {
21490 text-transform: capitalize;
21491 }
21492 .ab-testing-drawer .header-left .ab-testing-status {
21493 border-radius: 100px;
21494 border: 1px solid #EFEFEF;
21495 background: #F4F4F4;
21496 display: inline-block;
21497 color: #2D3149;
21498 font-size: 10px;
21499 font-weight: 500;
21500 line-height: 1;
21501 padding: 5px 11px;
21502 margin-left: 8px;
21503 text-transform: capitalize;
21504 }
21505 .ab-testing-drawer .header-left .ab-testing-status.running {
21506 background: rgba(36, 194, 26, 0.1);
21507 color: #25C11B;
21508 border-color: rgba(36, 194, 26, 0.1);
21509 }
21510 .ab-testing-drawer .header-center .header-title {
21511 font-size: 18px;
21512 font-weight: 500;
21513 line-height: 1;
21514 color: #363B4E;
21515 }
21516 .ab-testing-drawer .header-right {
21517 display: flex;
21518 align-items: center;
21519 gap: 14px;
21520 }
21521 .ab-testing-drawer .header-right .wpfnl-alert {
21522 display: block;
21523 }
21524 .ab-testing-drawer .header-right .copy-ab-url {
21525 width: auto;
21526 height: 40px;
21527 display: flex;
21528 align-items: center;
21529 justify-content: center;
21530 cursor: pointer;
21531 border-radius: 8px;
21532 border: 1px solid #EEF0F3;
21533 box-shadow: none;
21534 outline: none;
21535 position: relative;
21536 background: transparent;
21537 padding: 11px 20px 9px;
21538 gap: 9px;
21539 }
21540 .ab-testing-drawer .header-right .copy-ab-url .copy-text {
21541 font-size: 14px;
21542 font-weight: 500;
21543 line-height: 1;
21544 color: #363B4E;
21545 }
21546 .ab-testing-drawer .header-right .copy-ab-url .copyed {
21547 background-color: #464646;
21548 position: absolute;
21549 right: -4px;
21550 bottom: -18px;
21551 font-size: 11px;
21552 font-style: normal;
21553 color: #fff;
21554 line-height: 1;
21555 padding: 4px;
21556 border-radius: 3px;
21557 transition: all 0.3s ease;
21558 opacity: 0;
21559 visibility: hidden;
21560 }
21561 .ab-testing-drawer .header-right .copy-ab-url .copyed:before {
21562 content: "";
21563 position: absolute;
21564 left: 50%;
21565 top: -1px;
21566 width: 6px;
21567 height: 6px;
21568 background: #464646;
21569 transform: rotate(45deg) translateX(-50%);
21570 }
21571 .ab-testing-drawer .header-right .copy-ab-url.copy-confirmed .copyed {
21572 bottom: -25px;
21573 opacity: 1;
21574 visibility: visible;
21575 }
21576 .ab-testing-drawer .header-right .traffic-distribution[data-tour=yes],
21577 .ab-testing-drawer .header-right .start[data-tour=yes],
21578 .ab-testing-drawer .header-right .stats[data-tour=yes] {
21579 z-index: 4;
21580 position: relative;
21581 }
21582 .ab-testing-drawer .header-right .more-options[data-tour=yes] {
21583 z-index: 4;
21584 position: relative;
21585 background: #fff;
21586 }
21587 .ab-testing-drawer .header-right .btn-default {
21588 height: auto;
21589 line-height: 1;
21590 padding: 11px 20px 9px;
21591 min-width: auto;
21592 display: flex;
21593 align-items: center;
21594 gap: 9px;
21595 letter-spacing: -0.14px;
21596 color: #363B4E;
21597 border-radius: 8px;
21598 border: 1px solid #EEF0F3;
21599 background: #FFF;
21600 }
21601 .ab-testing-drawer .header-right .btn-default:hover {
21602 background-color: #f7f7f7;
21603 }
21604 .ab-testing-drawer .header-right .btn-default.stats svg {
21605 display: block;
21606 position: relative;
21607 top: -1px;
21608 }
21609 .ab-testing-drawer .header-right .btn-default.start {
21610 background: #6E42D3;
21611 border-color: #6E42D3;
21612 color: #fff;
21613 width: 40px;
21614 height: auto;
21615 padding: 10px;
21616 border-radius: 10px;
21617 }
21618 .ab-testing-drawer .header-right .btn-default.start svg {
21619 position: relative;
21620 top: 0px;
21621 }
21622 .ab-testing-drawer .header-right .btn-default.start:hover {
21623 background-color: #4C25A5;
21624 }
21625 .ab-testing-drawer .header-right .btn-default.its-disabled {
21626 color: rgba(54, 59, 78, 0.4);
21627 background: #ffffff;
21628 cursor: not-allowed;
21629 }
21630 .ab-testing-drawer .header-right .btn-default.its-disabled.stats path {
21631 fill: rgba(167, 168, 179, 0.4);
21632 }
21633 .ab-testing-drawer .header-right .btn-default.its-disabled.start {
21634 background: rgba(110, 66, 211, 0.5);
21635 border-color: transparent;
21636 color: rgba(255, 255, 255, 0.7);
21637 }
21638 .ab-testing-drawer .header-right .btn-default.its-disabled.start path {
21639 fill: rgba(255, 255, 255, 0.7);
21640 }
21641 .ab-testing-drawer .header-right .btn-default .wpfnl-loader {
21642 display: inline-block;
21643 margin-left: 0;
21644 }
21645 .ab-testing-drawer .header-right .action-buttons {
21646 display: flex;
21647 align-items: stretch;
21648 border-radius: 8px;
21649 overflow: hidden;
21650 }
21651 .ab-testing-drawer .header-right .action-buttons button {
21652 width: 40px;
21653 height: auto;
21654 display: flex;
21655 align-items: center;
21656 justify-content: center;
21657 background-color: #FF5155;
21658 padding: 10px;
21659 border: 1px solid #FF5155;
21660 border-right: 1px solid #ffffff;
21661 cursor: pointer;
21662 transition: background-color 0.3s ease, box-shadow 0.3s ease;
21663 }
21664 .ab-testing-drawer .header-right .action-buttons button:last-child {
21665 border-right: none;
21666 }
21667 .ab-testing-drawer .header-right .action-buttons button:hover {
21668 background-color: #FF5C5C;
21669 }
21670 .ab-testing-drawer .header-right .action-buttons button:active {
21671 transform: scale(0.95);
21672 }
21673 .ab-testing-drawer .header-right .action-buttons button .icon {
21674 width: 20px;
21675 height: 20px;
21676 fill: #FF4D4D;
21677 transition: fill 0.3s ease;
21678 }
21679 .ab-testing-drawer .header-right .action-buttons button .icon:hover {
21680 fill: #FFFFFF;
21681 }
21682 .ab-testing-drawer .header-right .more-options {
21683 line-height: 1;
21684 background: transparent;
21685 border: none;
21686 padding: 6px 9px;
21687 cursor: pointer;
21688 position: relative;
21689 }
21690 .ab-testing-drawer .header-right .more-options .options-dropdown {
21691 position: absolute;
21692 right: -10px;
21693 top: 50px;
21694 background: #FFFFFF;
21695 width: 148px;
21696 padding: 8px 9px;
21697 border-radius: 6px;
21698 border: 1px solid #EBEDF0;
21699 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
21700 opacity: 0;
21701 visibility: hidden;
21702 transition: all 0.3s ease;
21703 }
21704 .ab-testing-drawer .header-right .more-options .options-dropdown li {
21705 font-weight: 500;
21706 font-size: 14px;
21707 line-height: 1.14;
21708 color: #363B4E;
21709 display: flex;
21710 align-items: center;
21711 gap: 8px;
21712 padding: 8px;
21713 border-radius: 4px;
21714 cursor: pointer;
21715 transition: all 0.3s ease;
21716 }
21717 .ab-testing-drawer .header-right .more-options .options-dropdown li:hover {
21718 background: #F6F8FA;
21719 }
21720 .ab-testing-drawer .header-right .more-options.show-options .options-dropdown {
21721 top: 44px;
21722 opacity: 1;
21723 visibility: visible;
21724 z-index: 1;
21725 }
21726
21727 @media only screen and (max-width: 1199px) {
21728 .ab-testing-drawer .header-left .step-title {
21729 max-width: 195px;
21730 }
21731 .ab-testing-drawer .header-right {
21732 gap: 10px;
21733 }
21734 .ab-testing-drawer .header-right .btn-default {
21735 padding: 11px 15px 9px;
21736 }
21737 }
21738 @media only screen and (max-width: 991px) {
21739 .ab-testing-drawer .drawer-header {
21740 padding: 15px 15px;
21741 gap: 5px;
21742 }
21743 .ab-testing-drawer .header-center .header-title {
21744 font-size: 16px;
21745 }
21746 .ab-testing-drawer .header-left .step-type,
21747 .ab-testing-drawer .header-left .step-title {
21748 font-size: 14px;
21749 }
21750 .ab-testing-drawer .header-left .step-title {
21751 max-width: 160px;
21752 }
21753 .ab-testing-drawer .header-right .btn-default {
21754 padding: 9px 10px 7px;
21755 }
21756 }
21757 .ab-testing-drawer .single-ab-step {
21758 width: 180px;
21759 position: relative;
21760 background: #FFFFFF;
21761 box-sizing: border-box;
21762 border-radius: 10px;
21763 border: 1px solid #EDECF2;
21764 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
21765 position: relative;
21766 }
21767 .ab-testing-drawer .single-ab-step .ab-variation-delete {
21768 position: absolute;
21769 right: -8px;
21770 top: -8px;
21771 width: 22px;
21772 height: 22px;
21773 border-radius: 30px;
21774 background: #f6f5fa;
21775 color: #ffffff;
21776 border: 2px solid #EE5F5A;
21777 line-height: 1.3;
21778 cursor: pointer;
21779 z-index: 1;
21780 opacity: 0;
21781 visibility: hidden;
21782 transition: all 0.3s ease;
21783 }
21784 .ab-testing-drawer .single-ab-step .ab-variation-delete:before {
21785 content: "";
21786 position: absolute;
21787 left: 0;
21788 top: 0;
21789 width: 100%;
21790 height: 100%;
21791 background-image: url(../images/cross.svg);
21792 background-repeat: no-repeat;
21793 background-size: 80% 80%;
21794 background-position: center center;
21795 border-radius: 50%;
21796 }
21797 .ab-testing-drawer .single-ab-step:hover .ab-variation-delete {
21798 opacity: 1;
21799 visibility: visible;
21800 }
21801 .ab-testing-drawer .single-ab-step .variation-type {
21802 background: #0094A6;
21803 position: absolute;
21804 top: -20px;
21805 left: 15px;
21806 color: #FFF;
21807 font-size: 10px;
21808 font-weight: 600;
21809 line-height: 1;
21810 padding: 5px 11px;
21811 border-radius: 8px 8px 0 0;
21812 text-transform: capitalize;
21813 }
21814 .ab-testing-drawer .single-ab-step .variation-type.variant {
21815 background: #EE8134;
21816 }
21817 .ab-testing-drawer .single-ab-step .variation-type .variant-no {
21818 font-size: 10px;
21819 font-weight: 600;
21820 line-height: 1;
21821 color: #FFF;
21822 }
21823 .ab-testing-drawer .single-ab-step .step-header {
21824 background: #E8F1FF;
21825 box-sizing: border-box;
21826 border-radius: 10px 10px 0px 0px;
21827 padding: 10px 3px 9px;
21828 }
21829 .ab-testing-drawer .single-ab-step .step-header .step-title {
21830 color: #363B4E;
21831 font-weight: 500;
21832 font-size: 13px;
21833 line-height: 14px;
21834 padding: 0;
21835 margin: 0;
21836 text-transform: capitalize;
21837 display: flex;
21838 align-items: center;
21839 justify-content: center;
21840 gap: 6px;
21841 }
21842 .ab-testing-drawer .single-ab-step .step-header .step-title svg {
21843 width: 15px;
21844 height: 15px;
21845 }
21846 .ab-testing-drawer .single-ab-step .step-body {
21847 padding: 10px;
21848 }
21849 .ab-testing-drawer .single-ab-step .step-body .preview-img {
21850 border-radius: 8px;
21851 border: 1px solid #EEF0F3;
21852 position: relative;
21853 overflow: hidden;
21854 height: 121px;
21855 background: #f6f5fa;
21856 }
21857 .ab-testing-drawer .single-ab-step .step-body .preview-img > div {
21858 height: 100%;
21859 background-repeat: no-repeat;
21860 background-size: cover;
21861 background-position: center -5px;
21862 }
21863 .ab-testing-drawer .single-ab-step .step-body .winner-badge {
21864 position: absolute;
21865 left: 0;
21866 top: 0;
21867 background: transparent;
21868 width: 50px;
21869 height: 50px;
21870 padding: 6px;
21871 }
21872 .ab-testing-drawer .single-ab-step .step-body .winner-badge::before {
21873 content: "";
21874 position: absolute;
21875 left: 0;
21876 top: 0;
21877 border-top: 50px solid #24C21A;
21878 border-right: 50px solid transparent;
21879 border-top-left-radius: 8px;
21880 z-index: 0;
21881 }
21882 .ab-testing-drawer .single-ab-step .step-body .winner-badge svg {
21883 position: relative;
21884 z-index: 1;
21885 }
21886 .ab-testing-drawer .single-ab-step .step-body .step-cta > span {
21887 border: 1px solid #EEF0F3;
21888 border-radius: 8px;
21889 display: block;
21890 font-weight: 500;
21891 font-size: 12px;
21892 line-height: 1;
21893 text-align: center;
21894 text-transform: capitalize;
21895 color: #363B4E;
21896 padding: 8px 5px;
21897 margin-top: 10px;
21898 }
21899 .ab-testing-drawer .single-ab-step .step-control-button {
21900 background: #fff;
21901 display: flex;
21902 flex-flow: row;
21903 align-items: center;
21904 justify-content: center;
21905 z-index: 2;
21906 transition: all 0.3s ease;
21907 width: 100%;
21908 margin-top: 12px;
21909 gap: 10px;
21910 }
21911 .ab-testing-drawer .single-ab-step .step-control-button > li {
21912 width: 24px;
21913 height: 22px;
21914 display: flex;
21915 flex-flow: column;
21916 align-items: center;
21917 justify-content: center;
21918 position: relative;
21919 }
21920 .ab-testing-drawer .single-ab-step .step-control-button > li > a, .ab-testing-drawer .single-ab-step .step-control-button > li > button {
21921 display: flex;
21922 text-align: center;
21923 align-items: center;
21924 line-height: 22px;
21925 width: 100%;
21926 cursor: pointer;
21927 justify-content: center;
21928 }
21929 .ab-testing-drawer .single-ab-step .step-control-button > li > button {
21930 border: none;
21931 background: transparent;
21932 }
21933 .ab-testing-drawer .single-ab-step .step-control-button > li > button svg {
21934 display: block;
21935 position: relative;
21936 margin: 0 auto;
21937 }
21938 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown {
21939 position: absolute;
21940 left: 0;
21941 top: 30px;
21942 background: #FFFFFF;
21943 border-radius: 6px;
21944 border: 1px solid #EBEDF0;
21945 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
21946 width: 190px;
21947 padding: 10px;
21948 opacity: 0;
21949 visibility: hidden;
21950 transition: all 0.3s ease;
21951 z-index: 2;
21952 }
21953 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown li {
21954 font-size: 14px;
21955 line-height: 1.14;
21956 color: #2D3149;
21957 display: flex;
21958 align-items: center;
21959 gap: 8px;
21960 padding: 8px;
21961 border-radius: 4px;
21962 transition: all 0.3s ease;
21963 cursor: pointer;
21964 }
21965 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown li svg {
21966 position: relative;
21967 top: -1px;
21968 }
21969 .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown li:hover {
21970 background: #F6F8FA;
21971 }
21972 .ab-testing-drawer .single-ab-step .step-control-button li.show-dorpdown .options-dropdown {
21973 top: 25px;
21974 opacity: 1;
21975 visibility: visible;
21976 }
21977 .ab-testing-drawer .single-ab-step.landing .step-header {
21978 background: #E8F1FF;
21979 }
21980 .ab-testing-drawer .single-ab-step.landing .step-header .step-title svg {
21981 width: 15px;
21982 height: 15px;
21983 }
21984 .ab-testing-drawer .single-ab-step.checkout .step-header {
21985 background: #FDF0E8;
21986 padding: 9px 3px 8px;
21987 }
21988 .ab-testing-drawer .single-ab-step.checkout .step-header .step-title svg {
21989 width: 15px;
21990 height: 17px;
21991 top: -1px;
21992 }
21993 .ab-testing-drawer .single-ab-step.upsell .step-header {
21994 background: #E9F9E8;
21995 }
21996 .ab-testing-drawer .single-ab-step.upsell .step-header .step-title svg {
21997 width: 15px;
21998 height: 15px;
21999 }
22000 .ab-testing-drawer .single-ab-step.downsell .step-header {
22001 background: #FCF0F1;
22002 }
22003 .ab-testing-drawer .single-ab-step.downsell .step-header .step-title svg {
22004 width: 15px;
22005 height: 15px;
22006 }
22007 .ab-testing-drawer .single-ab-step.thankyou .step-header {
22008 background: #E6FAF5;
22009 }
22010 .ab-testing-drawer .single-ab-step.thankyou .step-header .step-title svg {
22011 width: 15px;
22012 height: 15px;
22013 }
22014 .ab-testing-drawer .single-ab-step.custom .step-header {
22015 background: #E0F2F4;
22016 }
22017 .ab-testing-drawer .single-ab-step.custom .step-header .step-title svg {
22018 width: 15px;
22019 height: 15px;
22020 }
22021
22022 .ab-testing-drawer .ab-testing-steps-wrapper {
22023 padding: 127px 50px 50px;
22024 display: flex;
22025 flex-flow: row wrap;
22026 align-items: center;
22027 gap: 40px;
22028 }
22029 .ab-testing-drawer .add-step-wrapper .add-steps-options {
22030 left: calc(100% + 15px);
22031 }
22032 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option svg {
22033 margin-bottom: 9px;
22034 }
22035 .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option g, .ab-testing-drawer .add-step-wrapper .add-steps-options .single-option path {
22036 transition: all 0.3s ease;
22037 }
22038 .ab-testing-drawer .add-step-wrapper .add-steps-options .option-templates:hover g {
22039 stroke: #6E42D3;
22040 }
22041 .ab-testing-drawer .add-step-wrapper .add-steps-options .option-duplicate:hover path {
22042 stroke: #6E42D3;
22043 fill: #6E42D3;
22044 }
22045
22046 .ab-testing-drawer .traffic-distribution-modal {
22047 position: absolute;
22048 top: 0;
22049 right: 0;
22050 height: 100%;
22051 width: 680px;
22052 z-index: 2;
22053 opacity: 0;
22054 visibility: hidden;
22055 }
22056 .ab-testing-drawer .traffic-distribution-modal.show-modal {
22057 opacity: 1;
22058 visibility: visible;
22059 }
22060 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner {
22061 background: #FFF;
22062 box-shadow: -2px 3px 6px rgba(186, 176, 210, 0.1);
22063 padding: 18px 30px;
22064 width: 100%;
22065 height: 100%;
22066 position: relative;
22067 z-index: 1;
22068 overflow-y: auto;
22069 }
22070 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner::-webkit-scrollbar {
22071 width: 3px;
22072 }
22073 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner::-webkit-scrollbar-track {
22074 background: #f2f5f8;
22075 }
22076 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-inner::-webkit-scrollbar-thumb {
22077 background-color: #CBCBCB;
22078 border-radius: 20px;
22079 }
22080 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header {
22081 display: flex;
22082 align-items: center;
22083 justify-content: space-between;
22084 border-bottom: 1px solid #EEF0F3;
22085 padding-bottom: 18px;
22086 }
22087 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title h4 {
22088 color: #363B4E;
22089 font-size: 18px;
22090 font-weight: 600;
22091 line-height: 1;
22092 }
22093 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title .wpfnl-tooltip svg {
22094 width: 13px;
22095 height: 13px;
22096 }
22097 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title .wpfnl-tooltip p {
22098 bottom: inherit;
22099 top: calc(100% + 10px);
22100 background: #2D3149;
22101 min-width: 131px;
22102 border-radius: 6px;
22103 font-size: 12px;
22104 line-height: 1.3;
22105 }
22106 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-title .wpfnl-tooltip p:before {
22107 background: #2D3149;
22108 bottom: inherit;
22109 top: -4px;
22110 }
22111 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-actions {
22112 display: flex;
22113 gap: 12px;
22114 }
22115 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-header .header-actions .action-btn {
22116 border-radius: 10px;
22117 border: 1px solid #EBEDF0;
22118 width: 38px;
22119 height: 38px;
22120 display: flex;
22121 align-items: center;
22122 justify-content: center;
22123 cursor: pointer;
22124 }
22125 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body {
22126 padding: 30px 0;
22127 }
22128 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender #ui-datepicker-div {
22129 border: 1px solid #F1F0F5;
22130 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
22131 border-radius: 8px;
22132 padding: 10px;
22133 }
22134 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker .ui-datepicker-title {
22135 display: flex;
22136 width: 74%;
22137 margin: 0 2.5em;
22138 }
22139 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker-prev,
22140 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker-next {
22141 height: 34px;
22142 }
22143 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker select.ui-datepicker-month,
22144 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .div-to-append-range-calender .ui-datepicker select.ui-datepicker-year {
22145 width: 116px;
22146 min-width: auto;
22147 height: 36px;
22148 border-radius: 3px;
22149 }
22150 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list {
22151 display: flex;
22152 flex-flow: row wrap;
22153 align-items: center;
22154 gap: 30px;
22155 margin-bottom: 20px;
22156 }
22157 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list:last-child {
22158 margin-bottom: 0;
22159 }
22160 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title {
22161 color: #363B4E;
22162 font-size: 15px;
22163 font-weight: 500;
22164 line-height: 1;
22165 width: calc(100% - 190px);
22166 }
22167 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .step-type {
22168 color: #363B4E;
22169 font-size: 15px;
22170 font-weight: 500;
22171 line-height: 1;
22172 text-transform: capitalize;
22173 }
22174 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .variation-type {
22175 background: rgba(0, 148, 166, 0.1);
22176 display: inline-block;
22177 color: #0094A6;
22178 font-size: 12px;
22179 font-weight: 500;
22180 line-height: 1;
22181 padding: 6px 11px;
22182 text-transform: capitalize;
22183 border-radius: 40px;
22184 margin-left: 8px;
22185 }
22186 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .variation-type.variant {
22187 background: rgba(238, 129, 52, 0.1);
22188 color: #EE8134;
22189 }
22190 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic {
22191 display: flex;
22192 align-items: center;
22193 gap: 10px;
22194 position: relative;
22195 }
22196 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .unlock-notice {
22197 border-radius: 6px;
22198 background: #2D3149;
22199 position: absolute;
22200 color: #fff;
22201 font-size: 12px;
22202 font-weight: 500;
22203 line-height: 1.33;
22204 padding: 9px 10px 6px;
22205 bottom: calc(100% + 11px);
22206 left: 23px;
22207 width: 140px;
22208 text-align: center;
22209 opacity: 0;
22210 visibility: hidden;
22211 transition: all 0.3s ease;
22212 }
22213 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .unlock-notice:before {
22214 content: "";
22215 position: absolute;
22216 left: 50%;
22217 transform: translateX(-50%) rotate(45deg);
22218 bottom: -4px;
22219 width: 11px;
22220 height: 11px;
22221 background: #2D3149;
22222 border-radius: 2px;
22223 }
22224 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .lock-unlock {
22225 border-radius: 6px;
22226 border: 1px solid #EEF0F3;
22227 background: transparent;
22228 width: 38px;
22229 height: 38px;
22230 display: flex;
22231 align-items: center;
22232 justify-content: center;
22233 cursor: pointer;
22234 }
22235 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic input[type=number] {
22236 border: 1px solid #EEF0F3;
22237 height: 38px;
22238 border-radius: 6px;
22239 min-width: auto;
22240 width: 88px;
22241 color: #363B4E;
22242 padding: 5px 12px;
22243 }
22244 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .unit {
22245 color: #363B4E;
22246 font-size: 14px;
22247 font-weight: 500;
22248 }
22249 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variations-traffic .variation-traffic:disabled:hover + .unlock-notice {
22250 opacity: 1;
22251 visibility: visible;
22252 }
22253 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer {
22254 border-top: 1px solid #EEF0F3;
22255 padding-top: 20px;
22256 display: flex;
22257 align-items: center;
22258 justify-content: flex-end;
22259 gap: 14px;
22260 }
22261 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .wpfnl-alert {
22262 display: block;
22263 }
22264 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default {
22265 min-width: auto;
22266 border-radius: 10px;
22267 height: auto;
22268 line-height: 1;
22269 padding: 13px 19px 11px;
22270 border: 1px solid transparent;
22271 }
22272 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default.cancel {
22273 background: transparent;
22274 color: #3C3F47;
22275 border-color: #E4E6EB;
22276 }
22277 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default.cancel:hover {
22278 background: #f5f5f5;
22279 }
22280 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default .wpfnl-loader {
22281 display: inline-block;
22282 position: relative;
22283 top: 1px;
22284 }
22285 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default[disabled] {
22286 cursor: not-allowed;
22287 opacity: 0.6;
22288 display: flex;
22289 gap: 10px;
22290 align-items: center;
22291 padding: 8px 19px 8px;
22292 }
22293 .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-footer .btn-default[disabled] svg {
22294 display: block;
22295 }
22296
22297 .ab-testing-drawer .ab-testing-winner-modal {
22298 position: absolute;
22299 top: 0;
22300 right: 0;
22301 height: 100%;
22302 width: 594px;
22303 z-index: 2;
22304 opacity: 0;
22305 visibility: hidden;
22306 }
22307 .ab-testing-drawer .ab-testing-winner-modal.show-modal {
22308 opacity: 1;
22309 visibility: visible;
22310 }
22311 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner {
22312 background: #fff;
22313 box-shadow: -2px 3px 6px rgba(186, 176, 210, 0.1);
22314 padding: 18px 30px;
22315 width: 100%;
22316 height: 100%;
22317 position: relative;
22318 z-index: 1;
22319 overflow-y: auto;
22320 }
22321 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner::-webkit-scrollbar {
22322 width: 3px;
22323 }
22324 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner::-webkit-scrollbar-track {
22325 background: #f2f5f8;
22326 }
22327 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-inner::-webkit-scrollbar-thumb {
22328 background-color: #CBCBCB;
22329 border-radius: 20px;
22330 }
22331 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-header {
22332 display: flex;
22333 align-items: center;
22334 justify-content: space-between;
22335 padding-bottom: 18px;
22336 }
22337 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-header .header-title h4 {
22338 color: #363B4E;
22339 font-size: 18px;
22340 font-weight: 600;
22341 line-height: 1;
22342 }
22343 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-header .header-actions .modal-close {
22344 border-radius: 10px;
22345 border: 1px solid #EBEDF0;
22346 width: 38px;
22347 height: 38px;
22348 display: flex;
22349 align-items: center;
22350 justify-content: center;
22351 cursor: pointer;
22352 }
22353 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body {
22354 padding-bottom: 30px;
22355 }
22356 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info {
22357 border: 1px solid #EEF0F3;
22358 border-radius: 10px;
22359 margin-bottom: 16px;
22360 }
22361 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .img-area {
22362 background: #D7D1E7;
22363 height: 303px;
22364 text-align: center;
22365 border-radius: 10px 10px 0 0;
22366 overflow: hidden;
22367 }
22368 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .img-area svg {
22369 position: relative;
22370 top: 14px;
22371 }
22372 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .content-area {
22373 padding: 30px 24px;
22374 }
22375 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .content-area .winner-title {
22376 color: #363B4E;
22377 font-size: 16px;
22378 font-weight: 600;
22379 text-align: center;
22380 margin-bottom: 20px;
22381 }
22382 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .winner-check-list li {
22383 color: #363B4E;
22384 font-size: 13px;
22385 line-height: 1.3;
22386 position: relative;
22387 margin-bottom: 10px;
22388 padding-left: 23px;
22389 }
22390 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .winner-check-list li:last-child {
22391 margin-bottom: 0;
22392 }
22393 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .winner-step-info .winner-check-list li:before {
22394 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTkgMTQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzAwQjQyQyIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNNS43MzQgMTMuNTY0YS4yNTkuMjU5IDAgMDEtLjIzNi0uMTYzYy0uMDE4LS4wMzctMS41OC00LjA2Ny0zLjk5NC01LjU5Mi0uNDczLS4yOS0uODM2LS42LS42OS0xLjI5LjE0NS0uNjcxLjU5OS0xLjA1MiAxLjQxNi0xLjIzNCAxLjQ1Mi0uMzA5IDMuMDEzIDEuOTQzIDMuNTk0IDIuODY5IDIuMDM0LTIuOTYgNi4xLTcuNjA3IDEyLjAyLTguMTUyLjI4NS0uMDM0LjM5LjM5LjEyNi41MDgtLjA5LjAzNy04LjU1IDMuOTA0LTExLjk4MiAxMi45MDlhLjI5LjI5IDAgMDEtLjI1NC4xNDV6IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");
22395 position: absolute;
22396 left: 0;
22397 top: 2px;
22398 width: 17px;
22399 height: 13px;
22400 }
22401 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label {
22402 color: #344054;
22403 font-size: 13px;
22404 line-height: 1;
22405 text-transform: none;
22406 }
22407 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label:after {
22408 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTIgMTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTUuNTM4IDEwLjYzNWEuMjMyLjIzMiAwIDAxLS4xNy0uMDc0TC44IDUuNjE4YS4yMy4yMyAwIDAxLjE2OS0uMzg3aDIuMmEuMjMuMjMgMCAwMS4xNzMuMDhMNC44NyA3LjA2NmMuMTY1LS4zNTMuNDg1LS45NCAxLjA0NS0xLjY1Ni44My0xLjA1OCAyLjM3LTIuNjE0IDUuMDA4LTQuMDE5YS4yMy4yMyAwIDAxLjI1LjM4NmMtLjAxLjAwOC0xLjAyNy44MDktMi4xOTcgMi4yNzUtMS4wNzcgMS4zNS0yLjUwOSAzLjU1Ny0zLjIxMyA2LjQwN2EuMjMuMjMgMCAwMS0uMjI0LjE3NXoiLz48L3N2Zz4=");
22409 left: 3px;
22410 top: 0px;
22411 width: 14px;
22412 height: 14px;
22413 transform: rotate(0);
22414 border-bottom: none;
22415 border-left: none;
22416 }
22417 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer {
22418 border-top: 1px solid #EEF0F3;
22419 padding-top: 20px;
22420 display: flex;
22421 align-items: center;
22422 justify-content: flex-end;
22423 gap: 14px;
22424 }
22425 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default {
22426 min-width: auto;
22427 border-radius: 10px;
22428 height: auto;
22429 line-height: 1;
22430 padding: 12px 19px 10px;
22431 border: 1px solid transparent;
22432 }
22433 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default.cancel {
22434 background: transparent;
22435 color: #3C3F47;
22436 border-color: #E4E6EB;
22437 }
22438 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default.cancel:hover {
22439 background: #f5f5f5;
22440 }
22441 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default .wpfnl-loader {
22442 display: inline-block;
22443 position: relative;
22444 top: 2px;
22445 }
22446 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default[disabled] {
22447 cursor: not-allowed;
22448 opacity: 0.6;
22449 display: flex;
22450 gap: 10px;
22451 align-items: center;
22452 padding: 8px 19px 8px;
22453 }
22454 .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-footer .btn-default[disabled] svg {
22455 display: block;
22456 }
22457
22458 .ab-testing-stats {
22459 padding-top: 40px;
22460 }
22461 .ab-testing-stats .stats-wrapper {
22462 width: 100%;
22463 max-width: 1160px;
22464 margin: 0 auto;
22465 background: #fff;
22466 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
22467 border-radius: 10px;
22468 }
22469 .ab-testing-stats .stats-wrapper.ab-testing-stats-header {
22470 background: none;
22471 box-shadow: none;
22472 border-radius: 0;
22473 }
22474 .ab-testing-stats .stats-wrapper.ab-testing-stats-header .stats-back-button {
22475 background: none;
22476 border: none;
22477 outline: none;
22478 display: flex;
22479 align-items: center;
22480 justify-content: center;
22481 gap: 8px;
22482 margin-bottom: 18px;
22483 cursor: pointer;
22484 }
22485 .ab-testing-stats .stats-wrapper.ab-testing-stats-header .stats-back-button .stats-back-button-icon {
22486 background: #fff;
22487 display: inline-flex;
22488 align-items: center;
22489 padding: 5px;
22490 border-radius: 8px;
22491 }
22492 .ab-testing-stats .stats-wrapper.ab-testing-stats-header .stats-back-button .stats-back-button-text {
22493 color: #2D3149;
22494 }
22495 .ab-testing-stats .stats-wrapper table {
22496 width: 100%;
22497 border: none;
22498 border-collapse: collapse;
22499 }
22500 .ab-testing-stats .stats-wrapper table .name {
22501 width: 320px;
22502 }
22503 .ab-testing-stats .stats-wrapper table .status {
22504 width: 120px;
22505 }
22506 .ab-testing-stats .stats-wrapper table .visits {
22507 width: 100px;
22508 }
22509 .ab-testing-stats .stats-wrapper table .revenue {
22510 width: 100px;
22511 }
22512 .ab-testing-stats .stats-wrapper table .conversion-rate {
22513 width: 140px;
22514 }
22515 .ab-testing-stats .stats-wrapper table .declare-winner {
22516 width: 128px;
22517 }
22518 .ab-testing-stats .stats-wrapper thead th {
22519 padding: 16px 24px;
22520 border-bottom: 1px solid #EEF0F3;
22521 }
22522 .ab-testing-stats .stats-wrapper thead th .col-inner-wrap {
22523 color: #7A8B9A;
22524 font-size: 14px;
22525 line-height: 1;
22526 text-align: left;
22527 }
22528 .ab-testing-stats .stats-wrapper tbody td {
22529 padding: 18px 24px;
22530 border-bottom: 1px solid #EEF0F3;
22531 }
22532 .ab-testing-stats .stats-wrapper tbody tr:last-child td {
22533 border-bottom: none;
22534 }
22535 .ab-testing-stats .stats-wrapper tbody .name .col-inner-wrap {
22536 font-size: 14px;
22537 line-height: 1;
22538 color: #363B4E;
22539 font-weight: 500;
22540 white-space: nowrap;
22541 overflow: hidden;
22542 text-overflow: ellipsis;
22543 width: 270px;
22544 }
22545 .ab-testing-stats .stats-wrapper tbody .variation-type {
22546 background: rgba(0, 148, 166, 0.1);
22547 display: inline-block;
22548 color: #0094A6;
22549 font-size: 12px;
22550 font-weight: 500;
22551 line-height: 1;
22552 padding: 6px 11px;
22553 text-transform: capitalize;
22554 border-radius: 40px;
22555 }
22556 .ab-testing-stats .stats-wrapper tbody .variation-type.variant {
22557 background: rgba(238, 129, 52, 0.1);
22558 color: #EE8134;
22559 }
22560 .ab-testing-stats .stats-wrapper tbody .declare-winner .col-inner-wrap {
22561 display: flex;
22562 align-items: center;
22563 }
22564 .ab-testing-stats .stats-wrapper tbody .declare-winner .col-inner-wrap .wpfnl-loader {
22565 display: inline-block;
22566 position: relative;
22567 top: -1px;
22568 }
22569 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher label {
22570 width: 34px;
22571 height: 20px;
22572 }
22573 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher label:after {
22574 width: 16px;
22575 height: 16px;
22576 top: 2px;
22577 left: 2px;
22578 }
22579 .ab-testing-stats .stats-wrapper tbody .wpfnl-switcher input[type=checkbox]:checked + label:after {
22580 margin-left: 14px;
22581 }
22582
22583 @media only screen and (max-width: 1399px) {
22584 .ab-testing-stats .stats-wrapper thead th {
22585 padding: 16px 17px;
22586 }
22587 .ab-testing-stats .stats-wrapper tbody td {
22588 padding: 18px 17px;
22589 }
22590 }
22591 @media only screen and (max-width: 1199px) {
22592 .ab-testing-stats .stats-wrapper table .declare-winner {
22593 width: 160px;
22594 padding: 16px 14px;
22595 }
22596 .ab-testing-stats .stats-wrapper tbody td {
22597 padding: 14px 14px;
22598 }
22599 }
22600 @media only screen and (max-width: 991px) {
22601 .ab-testing-stats .stats-wrapper table .name {
22602 width: 230px;
22603 }
22604 .ab-testing-stats .stats-wrapper tbody .name .col-inner-wrap {
22605 width: 203px;
22606 }
22607 }
22608 .ab-testing-archive-list .stats-wrapper table .conversion-rate {
22609 width: 122px;
22610 }
22611 .ab-testing-archive-list .stats-wrapper table .action {
22612 width: 160px;
22613 }
22614 .ab-testing-archive-list .stats-wrapper table .action .col-inner-wrap {
22615 display: flex;
22616 align-items: center;
22617 gap: 5px;
22618 width: 108px;
22619 margin-left: auto;
22620 }
22621 .ab-testing-archive-list .stats-wrapper table .action .retrive {
22622 color: #363B4E;
22623 font-size: 13px;
22624 font-weight: 500;
22625 line-height: 1;
22626 letter-spacing: -0.13px;
22627 padding: 7px 10px;
22628 border-radius: 6px;
22629 border: 1px solid #EEF0F3;
22630 background: #F6F5FA;
22631 cursor: pointer;
22632 }
22633 .ab-testing-archive-list .stats-wrapper table .action .delete {
22634 padding: 8px 10px;
22635 background: transparent;
22636 border: none;
22637 cursor: pointer;
22638 }
22639 .ab-testing-archive-list .stats-wrapper table .action .delete svg {
22640 display: block;
22641 }
22642 .ab-testing-archive-list .stats-wrapper table .no-archived-variant {
22643 text-align: center;
22644 }
22645
22646 .ab-testing-drawer .ab-testing-confirmation-modal {
22647 position: fixed;
22648 top: 0;
22649 left: 160px;
22650 width: calc(100% - 160px);
22651 height: 100%;
22652 z-index: 2;
22653 background: rgba(21, 17, 29, 0.3);
22654 backdrop-filter: blur(4px);
22655 display: flex;
22656 flex-flow: column;
22657 align-items: center;
22658 justify-content: center;
22659 }
22660 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-overlay {
22661 position: absolute;
22662 left: 0;
22663 top: 0;
22664 width: 100%;
22665 height: 100%;
22666 background: transparent;
22667 }
22668 .ab-testing-drawer .ab-testing-confirmation-modal .close-confirmation-modal {
22669 width: 35px;
22670 height: 35px;
22671 border-radius: 100px;
22672 background: #FFF;
22673 box-shadow: 0px 1px 1px 0px #DADADA;
22674 border: none;
22675 position: absolute;
22676 right: -13px;
22677 top: -13px;
22678 cursor: pointer;
22679 padding-top: 2px;
22680 }
22681 .ab-testing-drawer .ab-testing-confirmation-modal .close-confirmation-modal path {
22682 stroke-width: 2px;
22683 }
22684 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-wrapper {
22685 width: 450px;
22686 background: #F6F5FA;
22687 border-radius: 10px;
22688 position: relative;
22689 }
22690 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body {
22691 padding: 35px;
22692 text-align: center;
22693 }
22694 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon {
22695 width: 50px;
22696 height: 50px;
22697 display: flex;
22698 align-items: center;
22699 justify-content: center;
22700 background: #EE5F5A;
22701 margin: 0 auto 14px;
22702 border-radius: 100%;
22703 }
22704 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.delete-icon svg {
22705 width: 16px;
22706 height: 16px;
22707 }
22708 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.delete-icon svg path {
22709 stroke: #fff;
22710 }
22711 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.warning-icon {
22712 background: transparent;
22713 }
22714 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .icon.archive-icon svg {
22715 position: relative;
22716 top: 1px;
22717 left: 1px;
22718 }
22719 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .title {
22720 color: #2D3149;
22721 font-size: 16px;
22722 font-weight: 600;
22723 line-height: 1;
22724 margin-bottom: 8px;
22725 }
22726 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .subtitle {
22727 color: #7A8B9A;
22728 font-size: 14px;
22729 font-weight: 400;
22730 line-height: 1.2;
22731 }
22732 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container {
22733 display: flex;
22734 justify-content: center;
22735 margin-top: 15px;
22736 width: 100%;
22737 flex-direction: column;
22738 align-items: flex-start;
22739 }
22740 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .variant-select {
22741 margin-bottom: 10px;
22742 }
22743 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .archive-checkbox label {
22744 color: #2D3149;
22745 padding-left: 26px;
22746 }
22747 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .archive-checkbox label::before {
22748 border: 1px solid #C5C6C8;
22749 height: 16px;
22750 width: 16px;
22751 }
22752 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-body .variant-select-container .archive-checkbox label::after {
22753 left: 4px;
22754 top: 2px;
22755 width: 8px;
22756 height: 4px;
22757 }
22758 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer {
22759 padding: 20px;
22760 border-top: 1px solid #E2E2E2;
22761 display: flex;
22762 flex-flow: row wrap;
22763 align-items: center;
22764 justify-content: flex-end;
22765 gap: 12px;
22766 }
22767 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .btn-default {
22768 min-width: auto;
22769 height: auto;
22770 line-height: 1;
22771 font-size: 15px;
22772 font-weight: 600;
22773 padding: 12px 19px;
22774 border: 1px solid transparent;
22775 }
22776 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .btn-default.confirm {
22777 box-shadow: 0px 10px 16px 0px rgba(189, 193, 200, 0.5);
22778 }
22779 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .btn-default.cancel {
22780 color: #2D3149;
22781 background: transparent;
22782 border: 1px solid #E4E6EB;
22783 letter-spacing: -0.15px;
22784 }
22785 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .wpfnl-checkbox {
22786 margin-right: auto;
22787 }
22788 .ab-testing-drawer .ab-testing-confirmation-modal .confirmation-modal-footer .variant-alert {
22789 margin-right: auto;
22790 color: #D8000C;
22791 }
22792 .ab-testing-drawer .ab-testing-confirmation-modal.archive-modal .confirmation-modal-body .icon {
22793 background: #239654;
22794 }
22795 .ab-testing-drawer .ab-testing-confirmation-modal.archive-modal .confirmation-modal-body .icon.warning-icon {
22796 background: transparent;
22797 }
22798
22799 .folded .ab-testing-drawer .ab-testing-confirmation-modal {
22800 left: 36px;
22801 width: calc(100% - 36px);
22802 }
22803
22804 .wpfnl-automation-window .automation-list-wrapper {
22805 padding: 0 30px 0;
22806 }
22807 .wpfnl-automation-window .automation-list-wrapper > .bulk-check {
22808 display: flex;
22809 align-items: center;
22810 padding-left: 31px;
22811 height: 50px;
22812 }
22813 .wpfnl-automation-window .automation-list-wrapper > .bulk-check .wpfnl-checkbox label:before {
22814 border-color: #c2c2c2;
22815 background-color: #ffffff;
22816 }
22817 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area {
22818 padding-left: 30px;
22819 height: 33px;
22820 }
22821 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area button {
22822 background: #EE8134;
22823 border-radius: 6px;
22824 border: none;
22825 color: #fff;
22826 height: 30px;
22827 padding: 0 10px;
22828 display: flex;
22829 align-items: center;
22830 justify-content: center;
22831 font-weight: 500;
22832 cursor: pointer;
22833 }
22834 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area button svg {
22835 height: 18px;
22836 width: 18px;
22837 margin-right: 4px;
22838 }
22839 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area button svg path {
22840 stroke: #fff;
22841 }
22842 .wpfnl-automation-window .automation-list-header {
22843 display: flex;
22844 flex-flow: row wrap;
22845 align-items: center;
22846 justify-content: space-between;
22847 }
22848 .wpfnl-automation-window .automation-list-header .field-item {
22849 font-weight: 500;
22850 font-size: 14px;
22851 line-height: 1.14;
22852 letter-spacing: 1px;
22853 text-transform: uppercase;
22854 color: #7A8B9A;
22855 }
22856 .wpfnl-automation-window .automation-list-header,
22857 .wpfnl-automation-window .automation-single-list {
22858 padding: 15px 30px;
22859 }
22860 .wpfnl-automation-window .automation-list-header .wpfnl-checkbox label:before,
22861 .wpfnl-automation-window .automation-single-list .wpfnl-checkbox label:before {
22862 border-color: #CDD2E6;
22863 background-color: #ffffff;
22864 }
22865 .wpfnl-automation-window .automation-list-header .field-item,
22866 .wpfnl-automation-window .automation-single-list .field-item {
22867 padding: 0 10px;
22868 }
22869 .wpfnl-automation-window .automation-list-header .field-item:first-child,
22870 .wpfnl-automation-window .automation-single-list .field-item:first-child {
22871 padding-left: 0;
22872 }
22873 .wpfnl-automation-window .automation-list-header .field-item:last-child,
22874 .wpfnl-automation-window .automation-single-list .field-item:last-child {
22875 padding-right: 0;
22876 }
22877 .wpfnl-automation-window .automation-list-header .bulk-check,
22878 .wpfnl-automation-window .automation-single-list .bulk-check {
22879 margin-right: 20px;
22880 }
22881 .wpfnl-automation-window .automation-list-header .title,
22882 .wpfnl-automation-window .automation-single-list .title {
22883 width: 250px;
22884 display: flex;
22885 flex-flow: row wrap;
22886 align-items: center;
22887 justify-content: flex-start;
22888 }
22889 .wpfnl-automation-window .automation-list-header .trigger,
22890 .wpfnl-automation-window .automation-single-list .trigger {
22891 width: calc(80% - 280px);
22892 text-align: center;
22893 }
22894 .wpfnl-automation-window .automation-list-header .trigger-action,
22895 .wpfnl-automation-window .automation-single-list .trigger-action {
22896 width: 100px;
22897 }
22898 .wpfnl-automation-window .automation-list-header .crm,
22899 .wpfnl-automation-window .automation-single-list .crm {
22900 width: 45px;
22901 }
22902 .wpfnl-automation-window .automation-list-header .status,
22903 .wpfnl-automation-window .automation-single-list .status {
22904 width: 66px;
22905 }
22906 .wpfnl-automation-window .automation-list-header .actions,
22907 .wpfnl-automation-window .automation-single-list .actions {
22908 width: 75px;
22909 }
22910 .wpfnl-automation-window .automation-single-list {
22911 background: #FFFFFF;
22912 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.2);
22913 border-radius: 8px;
22914 display: flex;
22915 flex-flow: row wrap;
22916 align-items: flex-start;
22917 justify-content: space-between;
22918 margin-bottom: 20px;
22919 }
22920 .wpfnl-automation-window .automation-single-list.no-data-list {
22921 justify-content: center;
22922 }
22923 .wpfnl-automation-window .automation-single-list.no-data-list .field-item {
22924 color: #363B4E;
22925 font-weight: 500;
22926 }
22927 .wpfnl-automation-window .automation-single-list.no-data-list .field-item .btn-default {
22928 height: 54px;
22929 padding: 0 40px;
22930 margin: 10px 0;
22931 font-size: 16px;
22932 }
22933 .wpfnl-automation-window .automation-single-list.no-data-list.not-enabled {
22934 margin-left: 20px;
22935 margin-right: 20px;
22936 }
22937 .wpfnl-automation-window .automation-single-list .title {
22938 font-size: 15px;
22939 line-height: 1.2;
22940 font-weight: 500;
22941 color: #363B4E;
22942 position: relative;
22943 top: 6px;
22944 }
22945 .wpfnl-automation-window .automation-single-list .crm .icon {
22946 box-sizing: border-box;
22947 border-radius: 6px;
22948 width: 30px;
22949 height: 30px;
22950 display: flex;
22951 flex-flow: column;
22952 align-items: center;
22953 justify-content: center;
22954 }
22955 .wpfnl-automation-window .automation-single-list .trigger-lists {
22956 display: flex;
22957 flex-flow: row wrap;
22958 align-items: center;
22959 justify-content: center;
22960 margin-left: -2px;
22961 margin-top: -2px;
22962 width: 100%;
22963 }
22964 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list-flex,
22965 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-more-list,
22966 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list {
22967 padding: 2px;
22968 }
22969 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list-flex > span,
22970 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-more-list > span,
22971 .wpfnl-automation-window .automation-single-list .trigger-lists .trigger-list > span {
22972 font-size: 12px;
22973 line-height: 1.15;
22974 color: #7A8B9A;
22975 border: 1px solid #E5E8F3;
22976 border-radius: 6px;
22977 padding: 6px 6px 4px;
22978 display: block;
22979 }
22980 .wpfnl-automation-window .automation-single-list .more-list-trigger > span {
22981 font-size: 12px;
22982 line-height: 1.15;
22983 color: #7A8B9A;
22984 border: 1px solid #E5E8F3;
22985 border-radius: 6px;
22986 padding: 6px 6px 4px;
22987 display: inline-block;
22988 }
22989 .wpfnl-automation-window .automation-single-list .trigger-action {
22990 display: flex;
22991 align-items: center;
22992 }
22993 .wpfnl-automation-window .automation-single-list .trigger-action > span {
22994 display: block;
22995 line-height: 1;
22996 }
22997 .wpfnl-automation-window .automation-single-list .trigger-action > span svg {
22998 display: block;
22999 }
23000 .wpfnl-automation-window .automation-single-list .trigger-action .action-separator {
23001 margin: 0 18px;
23002 }
23003 .wpfnl-automation-window .automation-single-list .status {
23004 position: relative;
23005 top: 6px;
23006 }
23007 .wpfnl-automation-window .automation-single-list .actions {
23008 display: flex;
23009 }
23010 .wpfnl-automation-window .automation-single-list .actions button {
23011 width: 33px;
23012 padding: 0;
23013 border: none;
23014 height: 30px;
23015 padding-top: 2px;
23016 cursor: pointer;
23017 background: transparent;
23018 margin: 0 auto;
23019 display: flex;
23020 align-items: center;
23021 justify-content: center;
23022 }
23023 .wpfnl-automation-window .automation-single-list .actions button svg {
23024 height: 20px;
23025 display: block;
23026 }
23027
23028 @media only screen and (max-width: 1440px) {
23029 .wpfnl-automation-window .automation-list-header .trigger,
23030 .wpfnl-automation-window .automation-single-list .trigger {
23031 width: calc(80% - 340px);
23032 }
23033 }
23034 @media only screen and (max-width: 1199px) {
23035 .wpfnl-automation-window .automation-list-header,
23036 .wpfnl-automation-window .automation-single-list {
23037 padding: 14px 16px;
23038 }
23039 .wpfnl-automation-window .automation-list-header .title,
23040 .wpfnl-automation-window .automation-single-list .title {
23041 width: 220px;
23042 }
23043 .wpfnl-automation-window .automation-list-wrapper .bulk-delete-area {
23044 padding-left: 16px;
23045 }
23046 }
23047 @media only screen and (max-width: 991px) {
23048 .wpfnl-automation-window .automation-list-header .title,
23049 .wpfnl-automation-window .automation-single-list .title {
23050 width: 220px;
23051 }
23052 .wpfnl-automation-window .automation-list-header .trigger,
23053 .wpfnl-automation-window .automation-single-list .trigger {
23054 width: calc(80% - 369px);
23055 }
23056 }
23057 .crm-data-loader {
23058 position: absolute;
23059 z-index: 999;
23060 top: 1px;
23061 left: 1px;
23062 background: #fff;
23063 width: calc(100% - 3px);
23064 height: calc(100% - 3px);
23065 display: flex;
23066 flex-flow: row;
23067 align-items: center;
23068 border-radius: 10px;
23069 padding-left: 10px;
23070 }
23071 .crm-data-loader > span {
23072 display: inline-block;
23073 width: 8px;
23074 height: 8px;
23075 border-radius: 20px;
23076 background: #a184e5;
23077 margin: 3px;
23078 transition: all 0.3s;
23079 }
23080 .crm-data-loader > span:nth-child(1) {
23081 -webkit-animation: crm-data-loader 1.5s infinite;
23082 -moz-animation: crm-data-loader 1.5s infinite;
23083 -o-animation: crm-data-loader 1.5s infinite;
23084 animation: crm-data-loader 1.5s infinite;
23085 }
23086 .crm-data-loader > span:nth-child(2) {
23087 -webkit-animation: crm-data-loader 1.5s infinite;
23088 -moz-animation: crm-data-loader 1.5s infinite;
23089 -o-animation: crm-data-loader 1.5s infinite;
23090 animation: crm-data-loader 1.5s infinite;
23091 animation-delay: 0.4s;
23092 }
23093 .crm-data-loader > span:nth-child(3) {
23094 -webkit-animation: crm-data-loader 1.5s infinite;
23095 -moz-animation: crm-data-loader 1.5s infinite;
23096 -o-animation: crm-data-loader 1.5s infinite;
23097 animation: crm-data-loader 1.5s infinite;
23098 animation-delay: 0.6s;
23099 }
23100 @-webkit-keyframes crm-data-loader {
23101 0%, 100% {
23102 opacity: 0;
23103 }
23104 50% {
23105 opacity: 1;
23106 }
23107 }
23108 @-moz-keyframes crm-data-loader {
23109 0%, 100% {
23110 opacity: 0;
23111 }
23112 50% {
23113 opacity: 1;
23114 }
23115 }
23116 @-o-keyframes crm-data-loader {
23117 0%, 100% {
23118 opacity: 0;
23119 }
23120 50% {
23121 opacity: 1;
23122 }
23123 }
23124 @keyframes crm-data-loader {
23125 0%, 100% {
23126 opacity: 0;
23127 }
23128 50% {
23129 opacity: 1;
23130 }
23131 }
23132
23133 .wpfnl-automation-window .automation-darwer {
23134 position: fixed;
23135 top: 32px;
23136 right: -190px;
23137 background-color: #fff;
23138 z-index: 99;
23139 width: 1133px;
23140 height: calc(100vh - 32px);
23141 box-shadow: -8px 3px 6px rgba(186, 176, 210, 0.15);
23142 transition: all 0.3s ease-in-out;
23143 opacity: 0;
23144 visibility: hidden;
23145 }
23146 .wpfnl-automation-window .automation-darwer .drawer-bg-overlay {
23147 position: fixed;
23148 right: 0;
23149 top: 0;
23150 background: rgba(0, 0, 0, 0.3019607843);
23151 width: 100%;
23152 height: 100%;
23153 z-index: -1;
23154 }
23155 .wpfnl-automation-window .automation-darwer.show-drawer {
23156 right: 0;
23157 opacity: 1;
23158 visibility: visible;
23159 }
23160 .wpfnl-automation-window .automation-darwer .drawer-wrapper {
23161 height: 100%;
23162 width: 100%;
23163 background: #fff;
23164 position: relative;
23165 }
23166 .wpfnl-automation-window .automation-darwer .drawer-loader {
23167 position: absolute;
23168 top: 0;
23169 left: 0;
23170 width: 100%;
23171 height: 100%;
23172 background: #fff;
23173 border-radius: 10px 0 0 10px;
23174 z-index: 2;
23175 }
23176 .wpfnl-automation-window .automation-darwer .drawer-loader .wpfnl-loader {
23177 display: block;
23178 position: absolute;
23179 top: 50%;
23180 left: 50%;
23181 width: 50px;
23182 height: 50px;
23183 margin-left: -48px;
23184 margin-top: -46px;
23185 transition: all 0.3s linear;
23186 }
23187 .wpfnl-automation-window .automation-darwer .drawer-header {
23188 display: flex;
23189 flex-flow: row wrap;
23190 align-items: center;
23191 justify-content: space-between;
23192 gap: 10px;
23193 padding: 20px 16px 20px 30px;
23194 box-shadow: 0px 1px 1px rgba(190, 190, 215, 0.2);
23195 position: relative;
23196 z-index: 1;
23197 }
23198 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper {
23199 display: flex;
23200 flex-flow: row wrap;
23201 align-items: center;
23202 }
23203 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper label {
23204 padding-right: 7px;
23205 cursor: text;
23206 }
23207 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper input {
23208 height: 40px;
23209 font-size: 14px;
23210 line-height: 1.14;
23211 color: #7A8B9A;
23212 padding: 3px 10px;
23213 width: 180px;
23214 min-height: auto;
23215 min-width: auto;
23216 }
23217 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper .automation-name-preview {
23218 max-width: 200px;
23219 white-space: nowrap;
23220 overflow: hidden;
23221 text-overflow: ellipsis;
23222 }
23223 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button {
23224 min-width: auto;
23225 padding: 1px 7px 0;
23226 width: 40px;
23227 height: 40px;
23228 display: flex;
23229 flex-flow: column;
23230 align-items: center;
23231 justify-content: center;
23232 background: #F6F5FA !important;
23233 border: 1px solid #e0e0e0;
23234 border-radius: 6px;
23235 cursor: pointer;
23236 margin-left: 10px;
23237 }
23238 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button svg {
23239 display: block;
23240 width: 22px;
23241 height: 22px;
23242 }
23243 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-edit svg {
23244 fill: #6E42D3;
23245 }
23246 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-submit {
23247 display: none;
23248 }
23249 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-submit svg {
23250 stroke: #6E42D3;
23251 position: relative;
23252 top: -3px;
23253 }
23254 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button.automation-name-cancel {
23255 display: none;
23256 margin-left: 5px;
23257 }
23258 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper .automation-name-input {
23259 display: none;
23260 }
23261 .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper .wpfnl-alert {
23262 display: block;
23263 position: absolute;
23264 bottom: 2px;
23265 font-size: 12px;
23266 font-weight: 400;
23267 }
23268 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm {
23269 display: flex;
23270 flex-flow: row;
23271 align-items: center;
23272 margin-left: 30px;
23273 }
23274 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm .connect-crm-title {
23275 padding-right: 7px;
23276 font-weight: 500;
23277 color: #363B4E;
23278 white-space: nowrap;
23279 line-height: 1;
23280 position: relative;
23281 top: 2px;
23282 }
23283 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm select {
23284 height: 40px;
23285 padding-right: 30px;
23286 background-color: #f6f4fb;
23287 border-color: #6E42D3;
23288 color: #716395;
23289 }
23290 .wpfnl-automation-window .automation-darwer .drawer-header .zapier-doc-link a {
23291 font-weight: 500;
23292 color: #6E42D3;
23293 text-decoration: underline;
23294 }
23295 .wpfnl-automation-window .automation-darwer .drawer-header .zapier-doc-link a:hover {
23296 text-decoration: none;
23297 }
23298 .wpfnl-automation-window .automation-darwer .drawer-header .wpfnl-drawer-close {
23299 display: block;
23300 padding: 3px 7px;
23301 height: 24px;
23302 cursor: pointer;
23303 position: relative;
23304 top: -2px;
23305 margin-left: auto;
23306 }
23307 .wpfnl-automation-window .automation-darwer .drawer-body {
23308 padding: 30px;
23309 height: calc(100% - 80px);
23310 overflow: auto;
23311 position: relative;
23312 }
23313 .wpfnl-automation-window .automation-darwer .drawer-body::-webkit-scrollbar {
23314 width: 5px;
23315 }
23316 .wpfnl-automation-window .automation-darwer .drawer-body::-webkit-scrollbar-track {
23317 background: #f2f5f8;
23318 }
23319 .wpfnl-automation-window .automation-darwer .drawer-body::-webkit-scrollbar-thumb {
23320 background-color: #6E42D3;
23321 border-radius: 20px;
23322 }
23323 .wpfnl-automation-window .automation-darwer .trigger-wrapper {
23324 background: #FAF9FF;
23325 border: 1px solid #F0F0F0;
23326 border-radius: 10px;
23327 padding: 86px 40px 52px;
23328 position: relative;
23329 }
23330 .wpfnl-automation-window .automation-darwer .trigger-wrapper .zapier-save-btn {
23331 position: absolute;
23332 top: 30px;
23333 right: 0;
23334 z-index: 1;
23335 display: flex;
23336 align-items: center;
23337 justify-content: flex-end;
23338 gap: 13px;
23339 width: 100%;
23340 padding: 0 40px;
23341 }
23342 .wpfnl-automation-window .automation-darwer .trigger-wrapper .zapier-save-btn .wpfnl-alert {
23343 display: block;
23344 }
23345 .wpfnl-automation-window .automation-darwer .trigger-wrapper .zapier-save-btn .wpfnl-loader {
23346 display: inline-block;
23347 position: relative;
23348 top: 2px;
23349 }
23350 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper {
23351 padding: 0 0 27px;
23352 position: relative;
23353 }
23354 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:after {
23355 content: "";
23356 position: absolute;
23357 left: 50%;
23358 height: 27px;
23359 width: 2px;
23360 background: #7A8B9A;
23361 margin-left: -1px;
23362 }
23363 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:after {
23364 bottom: 0;
23365 }
23366 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper .add-trigger {
23367 border: none;
23368 background: transparent;
23369 display: block;
23370 height: 24px;
23371 width: 24px;
23372 position: absolute;
23373 left: 50%;
23374 bottom: -13px;
23375 transform: translate(-50%);
23376 z-index: 1;
23377 border-radius: 50%;
23378 cursor: pointer;
23379 }
23380 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:not(:last-child) .add-trigger {
23381 display: none;
23382 }
23383 .wpfnl-automation-window .automation-darwer .single-trigger {
23384 background: #FFFFFF;
23385 box-shadow: 0px 2px 3px rgba(190, 190, 215, 0.4);
23386 border-radius: 10px;
23387 display: flex;
23388 flex-flow: row wrap;
23389 position: relative;
23390 }
23391 .wpfnl-automation-window .automation-darwer .single-trigger select {
23392 height: 40px;
23393 background-color: transparent;
23394 min-width: auto;
23395 width: 100%;
23396 }
23397 .wpfnl-automation-window .automation-darwer .single-trigger label {
23398 margin-bottom: 10px;
23399 display: block;
23400 cursor: default;
23401 }
23402 .wpfnl-automation-window .automation-darwer .single-trigger .hints {
23403 color: #EE5F5A;
23404 display: none;
23405 }
23406 .wpfnl-automation-window .automation-darwer .single-trigger .selectbox-wrapper {
23407 position: relative;
23408 }
23409 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-tag {
23410 background: #6E42D3;
23411 border-radius: 50px;
23412 font-size: 12px;
23413 color: #fff;
23414 padding: 3px 11px 2px;
23415 position: absolute;
23416 left: 50%;
23417 top: -45px;
23418 transform: translate(-50%);
23419 display: none;
23420 }
23421 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-tag:before {
23422 content: "";
23423 position: absolute;
23424 left: 50%;
23425 top: calc(100% + 1px);
23426 height: 20px;
23427 width: 1px;
23428 border-right: 2px dashed #7A8B9A;
23429 margin-left: -1px;
23430 }
23431 .wpfnl-automation-window .automation-darwer .single-trigger .required-star {
23432 color: #EE5F5A;
23433 }
23434 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-when {
23435 padding: 20px;
23436 width: 50%;
23437 position: relative;
23438 }
23439 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-when .wpfnl-form-group {
23440 width: 100%;
23441 padding: 0;
23442 }
23443 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-then {
23444 display: flex;
23445 flex-flow: row wrap;
23446 padding: 20px 13px;
23447 width: 50%;
23448 background: #F6F6F9;
23449 border-radius: 0px 10px 10px 0px;
23450 position: relative;
23451 }
23452 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-then .trigger-tag {
23453 background-color: #EE8134;
23454 }
23455 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group {
23456 width: 50%;
23457 padding: 0 7px;
23458 }
23459 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group.wpfnl-col-1 {
23460 width: 100%;
23461 }
23462 .wpfnl-automation-window .automation-darwer .single-trigger .close-trigger {
23463 border: 1px solid #EE5F5A;
23464 padding: 0;
23465 height: 26px;
23466 width: 26px;
23467 display: flex;
23468 flex-flow: column;
23469 align-items: center;
23470 justify-content: center;
23471 border-radius: 100%;
23472 position: absolute;
23473 right: -8px;
23474 top: -11px;
23475 cursor: pointer;
23476 background: #fff;
23477 opacity: 0;
23478 visibility: hidden;
23479 transition: all 0.3s ease;
23480 z-index: 3;
23481 }
23482 .wpfnl-automation-window .automation-darwer .single-trigger .close-trigger svg {
23483 width: 17px;
23484 }
23485 .wpfnl-automation-window .automation-darwer .single-trigger .close-trigger svg path {
23486 stroke: #EE5F5A;
23487 }
23488 .wpfnl-automation-window .automation-darwer .single-trigger:hover .close-trigger {
23489 opacity: 1;
23490 visibility: visible;
23491 }
23492 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group.field-required select {
23493 border-color: #EE5F5A;
23494 }
23495 .wpfnl-automation-window .automation-darwer .single-trigger .wpfnl-form-group.field-required .hints {
23496 display: block;
23497 }
23498 .wpfnl-automation-window .automation-darwer .data-loaded .single-trigger .crm-data-loader {
23499 display: none;
23500 }
23501 .wpfnl-automation-window .automation-darwer .single-trigger-wrapper:first-child .single-trigger .trigger-tag {
23502 display: block;
23503 }
23504 .wpfnl-automation-window .automation-darwer .save-btn-area {
23505 margin-top: 30px;
23506 display: flex;
23507 justify-content: flex-end;
23508 align-items: center;
23509 }
23510 .wpfnl-automation-window .automation-darwer .save-btn-area .wpfnl-alert {
23511 display: inline-block;
23512 padding: 10px 20px;
23513 margin-right: 13px;
23514 }
23515 .wpfnl-automation-window .automation-darwer .save-btn-area .btn-default {
23516 min-width: 90px;
23517 }
23518 .wpfnl-automation-window .automation-darwer .save-btn-area .wpfnl-loader {
23519 display: inline-block;
23520 position: relative;
23521 top: 3px;
23522 }
23523 .wpfnl-automation-window .automation-darwer .no-data-message {
23524 text-align: center;
23525 color: #363B4E;
23526 font-weight: 500;
23527 }
23528 .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 {
23529 font-size: 14px;
23530 color: #7A8B9A;
23531 padding: 5px 15px;
23532 height: 40px;
23533 background-color: transparent;
23534 min-width: auto;
23535 width: 100%;
23536 border-radius: 6px;
23537 border: 1px solid #E5E8F3;
23538 }
23539 .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 {
23540 border-color: #E5E8F3;
23541 box-shadow: none;
23542 }
23543 .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 {
23544 width: 100% !important;
23545 }
23546 .wpfnl-automation-window .automation-darwer :where(.css-dev-only-do-not-override-1p3hq3p).ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder {
23547 color: #7A8B9A;
23548 }
23549 .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 {
23550 height: 38px !important;
23551 }
23552
23553 @media only screen and (max-width: 1400px) {
23554 .wpfnl-automation-window .automation-darwer {
23555 width: 983px;
23556 }
23557 }
23558 @media only screen and (max-width: 1199px) {
23559 .wpfnl-automation-window .automation-darwer {
23560 width: 803px;
23561 }
23562 .wpfnl-automation-window .automation-darwer .trigger-wrapper {
23563 padding: 40px 20px 40px;
23564 }
23565 }
23566 @media only screen and (max-width: 991px) {
23567 .wpfnl-automation-window .automation-darwer {
23568 width: 740px;
23569 }
23570 .wpfnl-automation-window .automation-darwer .drawer-header {
23571 padding: 20px 16px 20px 20px;
23572 }
23573 .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm select {
23574 width: 143px;
23575 min-width: auto;
23576 }
23577 .wpfnl-automation-window .automation-darwer .drawer-body {
23578 padding: 20px;
23579 }
23580 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-when {
23581 padding: 15px;
23582 }
23583 .wpfnl-automation-window .automation-darwer .single-trigger .trigger-then {
23584 padding: 15px 8px;
23585 }
23586 }
23587 .wpfnl-automation-window {
23588 background: #f6f5fa;
23589 position: absolute;
23590 top: 0;
23591 left: 0;
23592 width: 100%;
23593 height: 100%;
23594 z-index: 99;
23595 }
23596 .wpfnl-automation-window .automation-content {
23597 position: relative;
23598 }
23599 .wpfnl-automation-window .automation-window-loader {
23600 background: #f6f5fa;
23601 position: absolute;
23602 top: 0;
23603 right: 0;
23604 width: 100%;
23605 height: calc(100vh - 32px);
23606 z-index: 99;
23607 transition: all 0.9s linear;
23608 }
23609 .wpfnl-automation-window .automation-window-loader .wpfnl-loader {
23610 display: block;
23611 position: absolute;
23612 top: 50%;
23613 left: 50%;
23614 width: 50px;
23615 height: 50px;
23616 margin-left: -48px;
23617 margin-top: -46px;
23618 transition: all 0.3s linear;
23619 }
23620 .wpfnl-automation-window .automation-content-header {
23621 display: flex;
23622 flex-flow: row wrap;
23623 align-items: center;
23624 justify-content: space-between;
23625 background: #FFFFFF;
23626 box-shadow: 0 1px 2px 0 rgba(190, 190, 215, 0.2);
23627 padding-right: 8px;
23628 margin-bottom: 20px;
23629 }
23630 .wpfnl-automation-window .automation-content-header .header-left {
23631 display: flex;
23632 flex-flow: row wrap;
23633 align-items: center;
23634 }
23635 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-logo a {
23636 display: block;
23637 padding: 16px 25px;
23638 border-right: 1px solid #E5E8F3;
23639 }
23640 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-logo a svg {
23641 width: 26px;
23642 display: block;
23643 }
23644 .wpfnl-automation-window .automation-content-header .header-left .backto-funnel-edit {
23645 background: #FFFFFF;
23646 cursor: pointer;
23647 border: none;
23648 padding: 0;
23649 text-align: center;
23650 width: 57px;
23651 height: 60px;
23652 margin-right: 20px;
23653 display: flex;
23654 flex-flow: column;
23655 align-items: center;
23656 justify-content: center;
23657 border-right: 1px solid #E5E8F3;
23658 }
23659 .wpfnl-automation-window .automation-content-header .header-left h2 {
23660 font-size: 18px;
23661 line-height: 1.16;
23662 font-weight: 500;
23663 color: #363B4E;
23664 margin-right: 13px;
23665 }
23666 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-switcher {
23667 display: flex;
23668 align-items: center;
23669 }
23670 .wpfnl-automation-window .automation-content-header .header-left .wpfnl-switcher .wpfnl-loader {
23671 display: inline-block;
23672 margin-left: 8px;
23673 }
23674 .wpfnl-automation-window .wpfnl-switcher label {
23675 width: 32px;
23676 height: 18px;
23677 }
23678 .wpfnl-automation-window .wpfnl-switcher label:after {
23679 width: 12px;
23680 height: 12px;
23681 top: 2px;
23682 left: 3px;
23683 }
23684 .wpfnl-automation-window .wpfnl-switcher input[type=checkbox]:checked + label:after {
23685 margin-left: 13px;
23686 }
23687 .wpfnl-automation-window .btn-default {
23688 height: 40px;
23689 line-height: 41px;
23690 padding: 0 20px;
23691 }
23692
23693 .wpfnl .mailmint-automation {
23694 box-shadow: none;
23695 width: calc(100% - 160px);
23696 transition: none;
23697 }
23698 .wpfnl .mailmint-automation .automation-drawer-loader {
23699 position: absolute;
23700 top: 0;
23701 left: 0;
23702 width: 100%;
23703 height: 100%;
23704 background: #F6F5FA;
23705 z-index: 3;
23706 display: flex;
23707 flex-flow: column;
23708 align-items: center;
23709 justify-content: center;
23710 }
23711 .wpfnl .mailmint-automation .automation-drawer-loader .wpfnl-loader {
23712 display: block;
23713 width: 40px;
23714 height: 40px;
23715 }
23716 .wpfnl .mailmint-automation .drawer-wrapper {
23717 background: #F6F5FA;
23718 }
23719 .wpfnl .mailmint-automation .drawer-body {
23720 padding: 24px;
23721 overflow: hidden;
23722 }
23723 .wpfnl .mailmint-automation .drawer-body-inner-wrapper {
23724 display: flex;
23725 flex-flow: row wrap;
23726 gap: 24px;
23727 height: 100%;
23728 }
23729 .wpfnl .mailmint-automation .automation-steps-wrapper {
23730 text-align: center;
23731 width: 100%;
23732 height: calc(100% + 20px);
23733 overflow: auto;
23734 padding-top: 10px;
23735 padding-bottom: 30px;
23736 }
23737 .wpfnl .mailmint-automation .automation-steps-wrapper::-webkit-scrollbar {
23738 width: 5px;
23739 height: 5px;
23740 }
23741 .wpfnl .mailmint-automation .automation-steps-wrapper::-webkit-scrollbar-track {
23742 background: #f2f5f8;
23743 }
23744 .wpfnl .mailmint-automation .automation-steps-wrapper::-webkit-scrollbar-thumb {
23745 background-color: #CBCBCB;
23746 border-radius: 20px;
23747 }
23748 .wpfnl .mailmint-automation .has-sidebar .automation-steps-wrapper {
23749 width: calc(100% - 474px);
23750 }
23751 .wpfnl .mailmint-automation .steps-settings-sidebar {
23752 width: 450px;
23753 height: 100%;
23754 background: #FFF;
23755 box-shadow: -2px 3px 6px rgba(186, 176, 210, 0.1);
23756 border-radius: 10px;
23757 padding: 24px 30px;
23758 overflow: auto;
23759 }
23760 .wpfnl .mailmint-automation .steps-settings-sidebar::-webkit-scrollbar {
23761 width: 5px;
23762 }
23763 .wpfnl .mailmint-automation .steps-settings-sidebar::-webkit-scrollbar-track {
23764 background: #f2f5f8;
23765 }
23766 .wpfnl .mailmint-automation .steps-settings-sidebar::-webkit-scrollbar-thumb {
23767 background-color: #CBCBCB;
23768 border-radius: 20px;
23769 }
23770 .wpfnl .mailmint-automation .condition .steps-settings-sidebar {
23771 width: 710px;
23772 }
23773 .wpfnl .mailmint-automation .condition .automation-steps-wrapper {
23774 width: calc(100% - 734px);
23775 }
23776 .wpfnl .mailmint-automation .automation-start-point {
23777 position: relative;
23778 border-radius: 8px;
23779 background: #FFF;
23780 width: 245px;
23781 margin: 0 auto;
23782 padding: 18px 15px 16px;
23783 text-align: center;
23784 color: #2D3149;
23785 font-size: 16px;
23786 font-weight: 600;
23787 line-height: 1.2;
23788 display: flex;
23789 align-items: center;
23790 justify-content: center;
23791 gap: 9px;
23792 cursor: pointer;
23793 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");
23794 }
23795 .wpfnl .mailmint-automation .automation-start-point .tigger-lists {
23796 position: absolute;
23797 left: 0;
23798 top: calc(100% + 26px);
23799 background: #FFFFFF;
23800 width: 100%;
23801 padding: 8px 10px;
23802 border-radius: 6px;
23803 border: 1px solid #EBEDF0;
23804 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
23805 z-index: 3;
23806 opacity: 0;
23807 visibility: hidden;
23808 transition: all 0.3s ease;
23809 }
23810 .wpfnl .mailmint-automation .automation-start-point .tigger-lists li {
23811 font-size: 14px;
23812 line-height: 1.14;
23813 color: #2D3149;
23814 font-weight: 400;
23815 display: flex;
23816 align-items: center;
23817 gap: 8px;
23818 padding: 8px;
23819 border-radius: 4px;
23820 cursor: pointer;
23821 transition: all 0.3s ease;
23822 }
23823 .wpfnl .mailmint-automation .automation-start-point .tigger-lists li:hover {
23824 background: #F6F8FA;
23825 }
23826 .wpfnl .mailmint-automation .automation-start-point .tigger-lists li.active {
23827 background: #F6F8FA;
23828 font-weight: 500;
23829 }
23830 .wpfnl .mailmint-automation .automation-start-point.show-dropdown .tigger-lists {
23831 top: calc(100% + 12px);
23832 opacity: 1;
23833 visibility: visible;
23834 }
23835 .wpfnl .mailmint-automation .selected-trigger {
23836 max-width: 210px;
23837 margin: 0 auto;
23838 display: flex;
23839 flex-flow: column;
23840 align-items: center;
23841 justify-content: center;
23842 position: relative;
23843 }
23844 .wpfnl .mailmint-automation .selected-trigger .close-trigger {
23845 background: transparent;
23846 color: #ffffff;
23847 border: none;
23848 position: absolute;
23849 right: -5px;
23850 top: -8px;
23851 cursor: pointer;
23852 opacity: 0;
23853 visibility: hidden;
23854 transition: all 0.3s ease;
23855 }
23856 .wpfnl .mailmint-automation .selected-trigger .close-trigger svg {
23857 display: block;
23858 }
23859 .wpfnl .mailmint-automation .selected-trigger .trigger-title {
23860 border-radius: 100px;
23861 background: #7A8B9A;
23862 display: inline-block;
23863 color: #FFF;
23864 font-size: 13px;
23865 font-weight: 500;
23866 line-height: 1.2;
23867 padding: 13px 24px 11px;
23868 position: relative;
23869 }
23870 .wpfnl .mailmint-automation .selected-trigger .trigger-title:hover .close-trigger {
23871 opacity: 1;
23872 visibility: visible;
23873 }
23874 .wpfnl .mailmint-automation .selected-trigger .add-action {
23875 height: 62px;
23876 position: relative;
23877 background: #7A8B9A;
23878 width: 2px;
23879 margin: 0 auto;
23880 }
23881 .wpfnl .mailmint-automation .selected-trigger .add-action:before {
23882 content: "";
23883 position: absolute;
23884 left: -5px;
23885 top: -7px;
23886 width: 6px;
23887 height: 6px;
23888 background: #7A8B9A;
23889 border-radius: 50px;
23890 border: 3px solid #fff;
23891 box-shadow: 0 0 0 2px #7A8B9A;
23892 }
23893 .wpfnl .mailmint-automation .selected-trigger .add-action > button {
23894 background: #7A8B9A;
23895 box-shadow: 0px 0px 0 6px #f6f5fa;
23896 width: 24px;
23897 height: 24px;
23898 border: none;
23899 display: flex;
23900 align-items: center;
23901 justify-content: center;
23902 border-radius: 100%;
23903 cursor: pointer;
23904 z-index: 1;
23905 position: absolute;
23906 bottom: 0;
23907 left: 0;
23908 margin-left: -11px;
23909 }
23910 .wpfnl .mailmint-automation .selected-trigger .add-action > button path {
23911 stroke: #fff;
23912 }
23913 .wpfnl .add-new-action {
23914 position: absolute;
23915 left: 50%;
23916 bottom: -8px;
23917 transform: translateX(-50%);
23918 z-index: 2;
23919 }
23920 .wpfnl .add-new-action .add-new-action-btn {
23921 background: #7A8B9A;
23922 box-shadow: 0px 0px 0 6px #f6f5fa;
23923 width: 24px;
23924 height: 24px;
23925 border: none;
23926 position: relative;
23927 display: flex;
23928 align-items: center;
23929 justify-content: center;
23930 border-radius: 100%;
23931 cursor: pointer;
23932 z-index: 1;
23933 }
23934 .wpfnl .add-new-action .add-new-action-btn path {
23935 stroke: #fff;
23936 }
23937 .wpfnl .first-add-new-action {
23938 height: 49px;
23939 bottom: inherit;
23940 top: 100%;
23941 display: flex;
23942 flex-flow: column;
23943 align-items: center;
23944 justify-content: flex-end;
23945 }
23946 .wpfnl .first-add-new-action:before {
23947 content: "";
23948 position: absolute;
23949 left: 50%;
23950 top: 0;
23951 margin-left: -1px;
23952 width: 2px;
23953 height: 100%;
23954 background: #7A8B9A;
23955 }
23956 .wpfnl .first-add-new-action:after {
23957 content: "";
23958 position: absolute;
23959 left: 50%;
23960 top: -8px;
23961 transform: translateX(-50%);
23962 width: 8px;
23963 height: 8px;
23964 background: #FFFFFF;
23965 border: 2px solid #7A8B9A;
23966 border-radius: 50px;
23967 }
23968 .wpfnl .first-add-new-action.automation-added:before {
23969 display: none;
23970 }
23971 .wpfnl .mintmrm-automation-step-wrapper {
23972 position: absolute;
23973 left: 50%;
23974 transform: translateX(-50%);
23975 top: 100%;
23976 width: 100%;
23977 }
23978 .wpfnl .mintmrm-automation-step-wrapper .no-automation {
23979 font-size: 10px;
23980 font-weight: 500;
23981 line-height: 1;
23982 color: #363B4E;
23983 text-align: center;
23984 text-transform: capitalize;
23985 white-space: nowrap;
23986 background: #FFFFFF;
23987 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
23988 padding: 6px 12px;
23989 border-radius: 50px;
23990 margin-top: 58px;
23991 display: inline-block;
23992 width: auto;
23993 }
23994 .wpfnl .mintmrm-automation-step-wrapper.automation-running .no-automation {
23995 box-shadow: 0px 1px 2px 0px rgba(190, 190, 215, 0.14);
23996 color: #24C21A;
23997 }
23998
23999 .folded .wpfnl .mailmint-automation {
24000 width: calc(100% - 36px);
24001 }
24002
24003 @media only screen and (max-width: 782px) {
24004 .folded .wpfnl .mailmint-automation {
24005 width: 100%;
24006 top: 46px;
24007 }
24008 }
24009 .mailmint-automation .drawer-header {
24010 background: #ffffff;
24011 position: relative;
24012 box-shadow: 0px 1px 2px rgba(190, 190, 215, 0.14);
24013 padding: 16px 12px 16px 24px;
24014 gap: 10px;
24015 z-index: 1;
24016 }
24017 .mailmint-automation .header-left {
24018 display: flex;
24019 align-items: center;
24020 gap: 14px;
24021 }
24022 .mailmint-automation .header-left .automation-title {
24023 color: #363B4E;
24024 font-size: 16px;
24025 font-weight: 500;
24026 line-height: 1;
24027 }
24028 .mailmint-automation .header-right {
24029 display: flex;
24030 align-items: center;
24031 gap: 14px;
24032 }
24033 .mailmint-automation .header-right .wpfnl-alert {
24034 display: block;
24035 }
24036 .mailmint-automation .header-right .btn-default {
24037 height: auto;
24038 line-height: 1;
24039 padding: 12px 16px 10px;
24040 min-width: auto;
24041 display: flex;
24042 align-items: center;
24043 gap: 9px;
24044 border-radius: 10px;
24045 }
24046 .mailmint-automation .header-right .btn-default.is-disabled {
24047 color: rgba(64, 64, 64, 0.4);
24048 cursor: not-allowed;
24049 background-color: rgba(183, 183, 183, 0.4);
24050 }
24051 .mailmint-automation .header-right .btn-default .wpfnl-loader {
24052 display: inline-block;
24053 margin-left: 0;
24054 }
24055 .mailmint-automation .header-right .more-options {
24056 line-height: 1;
24057 background: transparent;
24058 border: none;
24059 padding: 6px 9px;
24060 cursor: pointer;
24061 position: relative;
24062 }
24063 .mailmint-automation .header-right .more-options .options-dropdown {
24064 position: absolute;
24065 right: -10px;
24066 top: 50px;
24067 background: #FFFFFF;
24068 width: 148px;
24069 padding: 8px 9px;
24070 border-radius: 6px;
24071 border: 1px solid #EBEDF0;
24072 box-shadow: 0px 6px 8px 0px rgba(191, 191, 191, 0.1);
24073 opacity: 0;
24074 visibility: hidden;
24075 transition: all 0.3s ease;
24076 }
24077 .mailmint-automation .header-right .more-options .options-dropdown li {
24078 font-weight: 500;
24079 font-size: 14px;
24080 line-height: 1.14;
24081 color: #363B4E;
24082 display: flex;
24083 align-items: center;
24084 gap: 8px;
24085 padding: 8px;
24086 border-radius: 4px;
24087 cursor: pointer;
24088 transition: all 0.3s ease;
24089 }
24090 .mailmint-automation .header-right .more-options .options-dropdown li:hover {
24091 background: #F6F8FA;
24092 }
24093 .mailmint-automation .header-right .more-options .options-dropdown .wpfnl-loader {
24094 display: inline-block;
24095 }
24096 .mailmint-automation .header-right .more-options.show-dropdown .options-dropdown {
24097 top: 44px;
24098 opacity: 1;
24099 visibility: visible;
24100 }
24101
24102 .mailmint-automation .automation-single-step .automation-step-name {
24103 height: 100%;
24104 min-width: 150px;
24105 max-width: 245px;
24106 position: relative;
24107 background: #FFFFFF !important;
24108 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3019607843);
24109 border: 1px solid transparent;
24110 display: inline-block;
24111 padding: 35px 24px 15px;
24112 border-radius: 8px;
24113 cursor: pointer;
24114 transition: all 0.3s ease;
24115 }
24116 .mailmint-automation .automation-single-step .selected.automation-step-name {
24117 border-color: #6E42D3;
24118 box-shadow: 0px 20px 20px 0px rgba(189, 193, 200, 0.2);
24119 }
24120 .mailmint-automation .automation-single-step .automation-step-name .action-icon {
24121 background: #FFFFFF;
24122 border: 6px solid #F6F8FA;
24123 border-radius: 100%;
24124 width: 58px;
24125 height: 58px;
24126 display: flex;
24127 align-items: center;
24128 justify-content: center;
24129 position: absolute;
24130 left: 50%;
24131 top: -28px;
24132 transform: translateX(-50%);
24133 }
24134 .mailmint-automation .automation-single-step .automation-step-name .action-title {
24135 display: block;
24136 font-weight: 500;
24137 text-align: center;
24138 font-size: 14px;
24139 line-height: 1.2;
24140 color: #363B4E;
24141 margin-top: 5px;
24142 }
24143 .mailmint-automation .automation-single-step {
24144 position: relative;
24145 padding: 55px 0 0;
24146 max-width: 570px;
24147 margin: 0 auto;
24148 }
24149 .mailmint-automation .automation-single-step:before {
24150 content: "";
24151 position: absolute;
24152 left: 50%;
24153 top: 0;
24154 margin-left: -1px;
24155 width: 2px;
24156 height: 100%;
24157 background: #7A8B9A;
24158 }
24159 .mailmint-automation .automation-single-step .action-subtitle span,
24160 .mailmint-automation .automation-single-step .action-subtitle {
24161 color: #A4A8B5;
24162 display: block;
24163 margin-top: 4px;
24164 font-size: 12px;
24165 }
24166 .mailmint-automation .automation-single-step .action-subtitle span .not-set,
24167 .mailmint-automation .automation-single-step .action-subtitle .not-set {
24168 color: #FF5155;
24169 }
24170 .mailmint-automation .automation-single-step .action-subtitle span .tag-list,
24171 .mailmint-automation .automation-single-step .action-subtitle .tag-list {
24172 display: flex;
24173 flex-flow: row wrap;
24174 align-items: center;
24175 justify-content: center;
24176 }
24177 .mailmint-automation .automation-single-step .action-subtitle span .tag-list span,
24178 .mailmint-automation .automation-single-step .action-subtitle .tag-list span {
24179 margin: 0;
24180 }
24181 .mailmint-automation .automation-single-step .automation-step-name.not-setup-yet .action-subtitle {
24182 color: #FF5155;
24183 }
24184 .mailmint-automation .automation-single-step.stopAutomation .automation-step-name:before {
24185 content: "";
24186 position: absolute;
24187 top: 100%;
24188 left: 0;
24189 width: 100%;
24190 height: 30px;
24191 background: #f6f5fa;
24192 z-index: 1;
24193 }
24194 .mailmint-automation .automation-single-step .add-action {
24195 height: 54px;
24196 position: relative;
24197 width: 2px;
24198 margin: 0 auto;
24199 }
24200 .mailmint-automation .automation-single-step .add-action > button {
24201 background: #7A8B9A;
24202 box-shadow: 0px 0px 0 6px #f6f5fa;
24203 width: 24px;
24204 height: 24px;
24205 border: none;
24206 display: flex;
24207 align-items: center;
24208 justify-content: center;
24209 border-radius: 100%;
24210 cursor: pointer;
24211 z-index: 1;
24212 position: absolute;
24213 bottom: 0;
24214 left: 0;
24215 margin-left: -11px;
24216 }
24217 .mailmint-automation .automation-single-step .add-action > button path {
24218 stroke: #fff;
24219 }
24220 .mailmint-automation .automation-single-step .delete-action {
24221 border: none;
24222 background: transparent;
24223 line-height: 1;
24224 position: absolute;
24225 top: -12px;
24226 right: -10px;
24227 cursor: pointer;
24228 opacity: 0;
24229 visibility: hidden;
24230 transition: all 0.3s ease;
24231 }
24232 .mailmint-automation .automation-single-step .delete-action svg {
24233 display: block;
24234 }
24235 .mailmint-automation .automation-single-step .automation-step-name:hover .delete-action {
24236 opacity: 1;
24237 visibility: visible;
24238 }
24239 .mailmint-automation .automation-single-step.sendMail .action-icon svg path {
24240 stroke: #7DC09B;
24241 fill: #7DC09B;
24242 }
24243 .mailmint-automation .automation-single-step.addTag .action-icon svg circle,
24244 .mailmint-automation .automation-single-step.addTag .action-icon svg path {
24245 stroke: #5FA2DB;
24246 }
24247 .mailmint-automation .automation-single-step.addList .action-icon svg path {
24248 stroke: #AB8BC5;
24249 }
24250 .mailmint-automation .automation-single-step.removeTag .action-icon svg circle,
24251 .mailmint-automation .automation-single-step.removeTag .action-icon svg path {
24252 stroke: #E8A758;
24253 }
24254 .mailmint-automation .automation-single-step.circle .action-icon svg path, .mailmint-automation .automation-single-step.removeList .action-icon svg path {
24255 stroke: #E8A758;
24256 }
24257 .mailmint-automation .automation-single-step.delay .action-icon svg path {
24258 fill: #E3B152;
24259 stroke: #E3B152;
24260 }
24261 .mailmint-automation .automation-single-step.sequence .action-icon svg path {
24262 fill: #5FA2DC;
24263 }
24264 .mailmint-automation .automation-single-step.condition > .automation-step-name > .action-icon svg path {
24265 stroke: #84c246;
24266 fill: #84c246;
24267 }
24268 .mailmint-automation .automation-single-step.createUser .action-icon svg path {
24269 fill: #6d79a2;
24270 stroke: #6d79a2;
24271 }
24272 .mailmint-automation .automation-single-step.stopAutomation .action-icon svg path {
24273 fill: #e7887f;
24274 stroke: #e7887f;
24275 }
24276 .mailmint-automation .automation-single-step.webHookOutgoing .action-icon svg path {
24277 fill: #7064dc;
24278 }
24279 .mailmint-automation .automation-exit {
24280 color: #363B4E;
24281 font-size: 14px;
24282 font-weight: 600;
24283 line-height: 1.3;
24284 display: flex;
24285 flex-flow: column;
24286 align-items: center;
24287 justify-content: center;
24288 gap: 11px;
24289 width: 50px;
24290 margin: 0 auto;
24291 }
24292 .mailmint-automation .automation-exit:before {
24293 content: "";
24294 height: 25px;
24295 width: 2px;
24296 background: #7a8b9a;
24297 }
24298 .mailmint-automation .logical-decision-box {
24299 align-items: flex-start;
24300 border: 2px solid #a7a8b3;
24301 border-radius: 20px;
24302 display: flex;
24303 flex-flow: row wrap;
24304 gap: 30px;
24305 justify-content: space-between;
24306 margin: 30px auto 0;
24307 max-width: 416px;
24308 padding: 15px 0;
24309 position: relative;
24310 z-index: 2;
24311 top: 50%;
24312 width: 100%;
24313 background: #f6f5fa;
24314 }
24315 .mailmint-automation .logical-decision-box .automation-single-step {
24316 padding-top: 28px;
24317 }
24318 .mailmint-automation .logical-decision-box .automation-single-step:before {
24319 display: none;
24320 }
24321 .mailmint-automation .logical-decision-box .logical-text {
24322 background-color: #239654;
24323 box-shadow: 0px 0 0 8px #f6f8fa;
24324 border-radius: 50px;
24325 color: #fff;
24326 font-size: 11px;
24327 font-weight: 700;
24328 right: 25%;
24329 transform: translate(50%, 0px);
24330 line-height: 1.09;
24331 padding: 4px 6px;
24332 position: absolute;
24333 top: -12px;
24334 width: 31px;
24335 }
24336 .mailmint-automation .logical-decision-box .logical-text.logical-no-text {
24337 background: #ec5956;
24338 left: 25%;
24339 transform: translate(-50%, 0);
24340 }
24341 .mailmint-automation .logical-decision-box .single-decision {
24342 width: calc(50% - 15px);
24343 }
24344 .mailmint-automation .logical-decision-box .single-decision.decision-no {
24345 transform: translateX(calc(-50% - 1px));
24346 }
24347 .mailmint-automation .logical-decision-box .single-decision.decision-yes {
24348 transform: translateX(calc(50% + 1px));
24349 }
24350 .mailmint-automation .logical-decision-box .add-action {
24351 height: 85px;
24352 }
24353 .mailmint-automation .logical-decision-box .add-action > button {
24354 bottom: 50%;
24355 transform: translateY(50%);
24356 }
24357 .mailmint-automation .logical-decision-box .stopAutomation .automation-step-name:before {
24358 display: none;
24359 }
24360 .mailmint-automation .logical-decision-box .no-separator {
24361 height: 50px;
24362 background: #f6f5fa;
24363 width: 100%;
24364 }
24365
24366 .mailmint-automation .mailmint-actions {
24367 position: absolute;
24368 left: 50%;
24369 transform: translateX(-50%);
24370 top: calc(100% + 5px);
24371 width: 626px;
24372 z-index: 99;
24373 background: #FFF;
24374 border: 1px solid #EDECF2;
24375 box-shadow: 0px 20px 20px rgba(190, 190, 215, 0.08);
24376 border-radius: 10px;
24377 padding: 30px;
24378 transition: all 0.3s ease;
24379 display: none;
24380 }
24381 .mailmint-automation .mailmint-actions .action-search {
24382 position: relative;
24383 }
24384 .mailmint-automation .mailmint-actions .action-search .search-input {
24385 width: 100%;
24386 padding: 8px 32px 8px 12px;
24387 background: #F0F0F0;
24388 min-height: 40px;
24389 color: #2d3149;
24390 border-radius: 0;
24391 }
24392 .mailmint-automation .mailmint-actions .action-search .search-input:focus {
24393 border: 1px solid #6E42D2;
24394 }
24395 .mailmint-automation .mailmint-actions .action-search .clear-search-btn {
24396 display: flex;
24397 align-items: center;
24398 justify-content: center;
24399 background: #ddd;
24400 padding: 2px 3px;
24401 position: absolute;
24402 top: 50%;
24403 right: 6px;
24404 transform: translateY(-50%);
24405 background: #ddd;
24406 border: none;
24407 font-size: 18px;
24408 color: #666;
24409 cursor: pointer;
24410 line-height: 1;
24411 }
24412 .mailmint-automation .mailmint-actions .action-search .clear-search-btn.hover {
24413 color: #000;
24414 }
24415 .mailmint-automation .mailmint-actions .action-tabs {
24416 display: flex;
24417 gap: 10px;
24418 margin: 14px 0 28px 0;
24419 }
24420 .mailmint-automation .mailmint-actions .action-tabs .tab-button {
24421 border: 1px solid #dee1e8;
24422 border-radius: 8px;
24423 cursor: pointer;
24424 font-size: 14px;
24425 color: #2d3149;
24426 line-height: 1;
24427 margin-bottom: 0;
24428 background: none;
24429 padding: 9px 12px;
24430 }
24431 .mailmint-automation .mailmint-actions .action-tabs .tab-button.active {
24432 background: #6E42D2;
24433 color: #fff;
24434 }
24435 .mailmint-automation .mailmint-actions .mailmint-actions-wrapper {
24436 display: flex;
24437 flex-flow: row wrap;
24438 gap: 14px;
24439 }
24440 .mailmint-automation .mailmint-actions .mailmint-actions-wrapper .actions-title {
24441 color: #9398A5;
24442 font-size: 14px;
24443 font-weight: 500;
24444 line-height: 1;
24445 text-align: left;
24446 border-bottom: 1px solid #DEE1E8;
24447 padding-bottom: 10px;
24448 margin-bottom: 6px;
24449 width: 100%;
24450 }
24451 .mailmint-automation .mailmint-actions .mailmint-single-action {
24452 background: #FFFFFF;
24453 border: 1px solid #E4E6EB;
24454 border-radius: 10px;
24455 display: flex;
24456 flex-flow: column;
24457 align-items: center;
24458 justify-content: center;
24459 text-align: center;
24460 width: calc(25% - 11px);
24461 padding: 10px;
24462 cursor: pointer;
24463 min-height: 88px;
24464 transition: all 0.3s ease;
24465 }
24466 .mailmint-automation .mailmint-actions .mailmint-single-action .icon {
24467 margin-bottom: 10px;
24468 }
24469 .mailmint-automation .mailmint-actions .mailmint-single-action .icon circle,
24470 .mailmint-automation .mailmint-actions .mailmint-single-action .icon path {
24471 transition: all 0.3s ease;
24472 }
24473 .mailmint-automation .mailmint-actions .mailmint-single-action .icon svg {
24474 display: block;
24475 }
24476 .mailmint-automation .mailmint-actions .mailmint-single-action .title {
24477 font-weight: 500;
24478 font-size: 14px;
24479 line-height: 1.28;
24480 text-align: center;
24481 letter-spacing: -0.01em;
24482 color: #2D3149;
24483 }
24484 .mailmint-automation .mailmint-actions .mailmint-single-action:hover {
24485 border-color: #6E42D3;
24486 box-shadow: 0px 20px 16px rgba(189, 193, 200, 0.2);
24487 }
24488 .mailmint-automation .mailmint-actions .mailmint-single-action:hover .title {
24489 color: #6E42D3;
24490 }
24491 .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 {
24492 fill: #6E42D3;
24493 stroke: #6E42D3;
24494 }
24495 .mailmint-automation .mailmint-actions .mailmint-single-action.webhook-outgoing:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.email-sequence:hover .icon path {
24496 fill: #6E42D3;
24497 }
24498 .mailmint-automation .mailmint-actions .mailmint-single-action.remove-tag:hover .icon path, .mailmint-automation .mailmint-actions .mailmint-single-action.add-tag:hover .icon path {
24499 fill: #6E42D3;
24500 stroke: #6E42D3;
24501 }
24502 .mailmint-automation .mailmint-actions .mailmint-single-action.remove-tag:hover .icon circle, .mailmint-automation .mailmint-actions .mailmint-single-action.add-tag:hover .icon circle {
24503 stroke: #6E42D3;
24504 }
24505 .mailmint-automation .show-actions .mailmint-actions {
24506 display: block;
24507 }
24508
24509 .mailmint-automation .steps-settings-sidebar .sidebar-header {
24510 display: flex;
24511 flex-flow: row wrap;
24512 justify-content: space-between;
24513 gap: 10px;
24514 padding: 0;
24515 border-bottom: 1px solid #EEF0F3;
24516 padding-bottom: 13px;
24517 }
24518 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title {
24519 display: flex;
24520 align-items: center;
24521 flex-flow: row wrap;
24522 width: calc(100% - 48px);
24523 }
24524 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title h4 {
24525 color: #363B4E;
24526 font-size: 18px;
24527 font-weight: 500;
24528 display: flex;
24529 align-items: center;
24530 gap: 8px;
24531 }
24532 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title h4 svg {
24533 width: 23px;
24534 height: 23px;
24535 }
24536 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title h4 path {
24537 fill: #363B4E;
24538 }
24539 .mailmint-automation .steps-settings-sidebar .sidebar-header .sidebar-title .short-desc {
24540 width: 100%;
24541 margin-top: 5px;
24542 color: #7A8B9A;
24543 font-size: 14px;
24544 line-height: 1.28;
24545 text-transform: none;
24546 }
24547 .mailmint-automation .steps-settings-sidebar .sidebar-header .close-sidebar {
24548 padding: 3px 7px;
24549 height: 38px;
24550 width: 38px;
24551 cursor: pointer;
24552 position: relative;
24553 border-radius: 10px;
24554 border: 1px solid #EBEDF0;
24555 display: flex;
24556 align-items: center;
24557 justify-content: center;
24558 background: transparent;
24559 }
24560 .mailmint-automation .steps-settings-sidebar .sidebar-header .close-sidebar path {
24561 stroke-width: 2px;
24562 }
24563 .mailmint-automation .steps-settings-sidebar .sidebar-body {
24564 padding-top: 20px;
24565 }
24566 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group {
24567 margin-bottom: 21px;
24568 position: relative;
24569 }
24570 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown {
24571 position: absolute;
24572 background: #fff;
24573 right: 0;
24574 top: calc(100% + 8px);
24575 width: 300px;
24576 border: 1px solid #e2e5ed;
24577 z-index: 9999;
24578 transition: all 0.3s ease;
24579 box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.06);
24580 border-radius: 6px;
24581 padding: 8px;
24582 display: none;
24583 }
24584 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown::-webkit-scrollbar {
24585 width: 5px;
24586 }
24587 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown::-webkit-scrollbar-track {
24588 background: #f2f5f8;
24589 }
24590 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown::-webkit-scrollbar-thumb {
24591 background-color: #c1c1c1;
24592 border-radius: 20px;
24593 }
24594 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.show {
24595 display: block;
24596 }
24597 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.timezone {
24598 width: 320px;
24599 }
24600 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.country {
24601 width: 320px;
24602 }
24603 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.dropdown-left {
24604 right: inherit;
24605 left: 0;
24606 }
24607 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown.width-120px {
24608 width: 120px;
24609 }
24610 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li {
24611 font-weight: 400;
24612 font-size: 14px;
24613 line-height: 17px;
24614 color: #2d3149;
24615 text-align: left;
24616 padding: 8px 10px;
24617 border-radius: 6px;
24618 cursor: pointer;
24619 transition: all 0.3s ease;
24620 display: flex;
24621 align-items: center;
24622 margin-bottom: 0;
24623 }
24624 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li svg {
24625 margin-right: 7px;
24626 }
24627 .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 {
24628 background: #f6f8fa;
24629 }
24630 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:first-child a {
24631 border-radius: 5px 5px 0 0;
24632 }
24633 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:last-child {
24634 border-bottom: 0;
24635 }
24636 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li:last-child a {
24637 border-radius: 0 0 5px 5px;
24638 }
24639 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.delete {
24640 color: #ec5956;
24641 }
24642 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.searchbar {
24643 background: transparent;
24644 padding: 8px 8px 14px;
24645 display: list-item;
24646 }
24647 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.searchbar svg {
24648 position: absolute;
24649 top: 9px;
24650 left: 16px;
24651 }
24652 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.searchbar input[type=search] {
24653 font-weight: 400;
24654 height: 34px;
24655 padding: 4px 15px 4px 40px;
24656 }
24657 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.single-column {
24658 display: block;
24659 }
24660 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.list-title {
24661 font-weight: 600;
24662 font-size: 12px;
24663 line-height: 15px;
24664 letter-spacing: 0.05em;
24665 text-transform: uppercase;
24666 color: #667085;
24667 border-top: 1px solid #ebedf0;
24668 border-bottom: 1px solid #ebedf0;
24669 border-radius: 0;
24670 background: #f9fafb;
24671 position: relative;
24672 padding: 8px 18px;
24673 left: -8px;
24674 width: calc(100% + 16px);
24675 cursor: text;
24676 margin-bottom: 10px;
24677 }
24678 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.list-title.not-found {
24679 color: #ec5956;
24680 }
24681 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.button-area {
24682 border-top: 1px solid #ebedf0;
24683 border-radius: 0;
24684 position: relative;
24685 left: -12px;
24686 width: calc(100% + 16px);
24687 padding: 20px 20px 8px;
24688 display: flex;
24689 align-items: center;
24690 background: transparent;
24691 margin-top: 10px;
24692 margin-left: 4px;
24693 }
24694 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.button-area button {
24695 cursor: pointer;
24696 }
24697 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.button-area .cancel-btn {
24698 margin-left: auto;
24699 margin-right: 12px;
24700 }
24701 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown {
24702 position: relative;
24703 }
24704 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown::before {
24705 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");
24706 position: absolute;
24707 width: 6px;
24708 top: 50%;
24709 right: 10px;
24710 transform: translateY(-50%);
24711 }
24712 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown ul.mintmrm-dropdown {
24713 left: calc(100% + 8px);
24714 top: -10px;
24715 }
24716 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.has-sub-dropdown.show::before {
24717 top: 25%;
24718 transform: rotate(90deg);
24719 transition: all 0.3s ease;
24720 }
24721 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown li.group-item {
24722 transition: all 0.3s ease;
24723 padding-left: 20px;
24724 }
24725 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .no-found {
24726 background-color: #f9fafb;
24727 padding: 5px 0 5px 20px;
24728 border-radius: 0;
24729 background: #f9fafb;
24730 position: relative;
24731 left: -12px;
24732 width: calc(100% + 24px);
24733 cursor: text;
24734 margin-top: 10px;
24735 display: none;
24736 }
24737 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .no-found span {
24738 font-weight: 600;
24739 font-size: 12px;
24740 line-height: 15px;
24741 letter-spacing: 0.05em;
24742 text-transform: uppercase;
24743 color: #ec5956;
24744 }
24745 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action {
24746 display: flex;
24747 align-items: center;
24748 padding: 15px 17px 10px;
24749 color: #573bff;
24750 font-weight: 600;
24751 font-size: 14px;
24752 line-height: 17px;
24753 border-top: 1px solid #e2e5ed;
24754 position: relative;
24755 text-decoration: underline;
24756 left: -12px;
24757 width: calc(100% + 24px);
24758 }
24759 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action svg {
24760 margin-right: 5px;
24761 }
24762 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action svg path {
24763 stroke: #573bff;
24764 }
24765 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action:hover {
24766 color: #4c25a5;
24767 }
24768 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .add-action:hover svg path {
24769 stroke: #4c25a5;
24770 }
24771 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section {
24772 max-height: 200px;
24773 overflow: auto;
24774 }
24775 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section::-webkit-scrollbar {
24776 width: 5px;
24777 }
24778 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section::-webkit-scrollbar-track {
24779 background: #f2f5f8;
24780 }
24781 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group ul.mintmrm-dropdown .option-section::-webkit-scrollbar-thumb {
24782 background-color: #c1c1c1;
24783 border-radius: 20px;
24784 }
24785 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .merge-tag-icon {
24786 position: absolute;
24787 bottom: 0;
24788 right: 8px;
24789 cursor: pointer;
24790 }
24791 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown {
24792 width: 225px;
24793 top: calc(100% + 5px);
24794 }
24795 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown::before {
24796 display: none;
24797 }
24798 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown .title {
24799 margin-bottom: 6px;
24800 border-bottom: 1px solid #f0f1f4;
24801 font-weight: 600;
24802 font-size: 14px;
24803 line-height: 16px;
24804 color: #2d3149;
24805 padding: 5px 12px 12px;
24806 margin-left: -8px;
24807 width: calc(100% + 16px);
24808 }
24809 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper .personalization.mintmrm-dropdown li {
24810 font-weight: 400;
24811 }
24812 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown {
24813 position: relative;
24814 }
24815 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown::before {
24816 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");
24817 position: absolute;
24818 width: 6px;
24819 top: 50%;
24820 right: 10px;
24821 transform: translateY(-50%);
24822 }
24823 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown ul.mintmrm-dropdown {
24824 left: calc(100% + 8px);
24825 top: -10px;
24826 }
24827 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.has-sub-dropdown.show::before {
24828 top: 25%;
24829 transform: rotate(90deg);
24830 transition: all 0.3s ease;
24831 }
24832 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .mintmrm-merge-tag-wrapper li.group-item {
24833 transition: all 0.3s ease;
24834 padding-left: 20px;
24835 }
24836 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon {
24837 cursor: pointer;
24838 position: absolute;
24839 bottom: 0;
24840 right: 10px;
24841 }
24842 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon .openai-icon-wrapper .personalized-tooltip {
24843 position: absolute;
24844 top: -45px;
24845 right: 0;
24846 background: #333;
24847 font-size: 12px;
24848 color: #fff;
24849 width: 80px;
24850 text-align: center;
24851 padding: 6px;
24852 border-radius: 7px;
24853 opacity: 0;
24854 visibility: hidden;
24855 transition: all 0.3s ease;
24856 }
24857 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon .openai-icon-wrapper .personalized-tooltip:before {
24858 content: "";
24859 position: absolute;
24860 right: 5px;
24861 bottom: -4px;
24862 background: #333333;
24863 width: 12px;
24864 height: 12px;
24865 transform: rotate(45deg);
24866 }
24867 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .openai-icon:hover .personalized-tooltip {
24868 opacity: 1;
24869 visibility: visible;
24870 }
24871 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay {
24872 position: fixed;
24873 top: 0;
24874 left: 0;
24875 right: 0;
24876 bottom: 0;
24877 background-color: rgba(0, 0, 0, 0.5);
24878 display: flex;
24879 justify-content: center;
24880 align-items: center;
24881 z-index: 9999;
24882 }
24883 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner {
24884 position: relative;
24885 max-width: 650px;
24886 width: 100%;
24887 }
24888 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .close-icon {
24889 position: absolute;
24890 cursor: pointer;
24891 height: 46px;
24892 right: -17px;
24893 top: -17px;
24894 width: 46px;
24895 z-index: 6;
24896 align-items: center;
24897 background: #fff;
24898 border-radius: 100px;
24899 box-shadow: 0 1px 1px #dadada;
24900 cursor: pointer;
24901 display: flex;
24902 justify-content: center;
24903 position: absolute;
24904 }
24905 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .close-icon svg {
24906 height: 12px;
24907 width: 12px;
24908 cursor: pointer;
24909 }
24910 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content {
24911 background-color: white;
24912 padding: 40px;
24913 border-radius: 8px;
24914 text-align: center;
24915 max-width: 100%;
24916 width: 100%;
24917 }
24918 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title {
24919 align-items: center;
24920 display: flex;
24921 flex-flow: column;
24922 margin-bottom: 24px;
24923 width: 100%;
24924 }
24925 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title svg {
24926 height: 56px;
24927 width: 56px;
24928 }
24929 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title svg path {
24930 fill: #11a37f;
24931 }
24932 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .welcome-title .title {
24933 color: #2d3149;
24934 font-size: 20px;
24935 font-weight: 500;
24936 line-height: 1.2;
24937 padding: 17px 0 0;
24938 }
24939 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .openai-input-wrapper {
24940 text-align: center;
24941 width: 100%;
24942 }
24943 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .modal-overlay .modal-inner .modal-content .openai-input-wrapper .openai-connect-btn {
24944 background-color: #573bff;
24945 border: 1px solid transparent;
24946 border-radius: 6px;
24947 color: #fff;
24948 cursor: pointer;
24949 display: inline-block;
24950 font-size: 16px;
24951 font-style: normal;
24952 font-weight: 500;
24953 letter-spacing: -0.01em;
24954 line-height: 17px;
24955 padding: 11px 18px;
24956 text-align: center;
24957 text-transform: capitalize;
24958 opacity: 1;
24959 transition: all 0.3s ease;
24960 text-decoration: none;
24961 }
24962 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group:last-child {
24963 margin-bottom: 0;
24964 }
24965 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group > label {
24966 font-size: 15px;
24967 color: #363B4E;
24968 font-weight: 500;
24969 letter-spacing: -0.01em;
24970 display: flex;
24971 align-items: center;
24972 gap: 4px;
24973 margin-bottom: 8px;
24974 }
24975 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select,
24976 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number],
24977 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text],
24978 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email] {
24979 border: 1px solid #EEF0F3;
24980 padding: 7px 15px;
24981 height: auto;
24982 }
24983 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea,
24984 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select,
24985 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number],
24986 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text],
24987 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email] {
24988 color: #363B4E;
24989 }
24990 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea:-webkit-autofill,
24991 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select:-webkit-autofill,
24992 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]:-webkit-autofill,
24993 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]:-webkit-autofill,
24994 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]:-webkit-autofill {
24995 -webkit-box-shadow: 0 0 0 30px #ffffff inset;
24996 box-shadow: 0 0 0 30px #ffffff inset;
24997 -webkit-text-fill-color: #363B4E !important;
24998 }
24999 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea::-webkit-input-placeholder,
25000 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select::-webkit-input-placeholder,
25001 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]::-webkit-input-placeholder,
25002 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]::-webkit-input-placeholder,
25003 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]::-webkit-input-placeholder {
25004 color: #A7A8B3;
25005 }
25006 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea::-moz-placeholder,
25007 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select::-moz-placeholder,
25008 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]::-moz-placeholder,
25009 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]::-moz-placeholder,
25010 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]::-moz-placeholder {
25011 color: #A7A8B3;
25012 }
25013 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea:-ms-input-placeholder,
25014 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select:-ms-input-placeholder,
25015 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]:-ms-input-placeholder,
25016 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]:-ms-input-placeholder,
25017 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]:-ms-input-placeholder {
25018 color: #A7A8B3;
25019 }
25020 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group textarea:-moz-placeholder,
25021 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select:-moz-placeholder,
25022 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=number]:-moz-placeholder,
25023 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=text]:-moz-placeholder,
25024 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group input[type=email]:-moz-placeholder {
25025 color: #A7A8B3;
25026 }
25027 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select {
25028 color: #A7A8B3;
25029 padding-right: 38px;
25030 -webkit-appearance: none;
25031 appearance: none;
25032 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiNBN0E4QjMiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==);
25033 background-repeat: no-repeat;
25034 background-position-x: calc(100% - 15px);
25035 background-position-y: 16px;
25036 background-size: 12px 12px;
25037 }
25038 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select.value-selected {
25039 color: #363B4E;
25040 }
25041 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select option {
25042 color: #A7A8B3;
25043 }
25044 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input {
25045 display: flex;
25046 flex-flow: row wrap;
25047 gap: 15px;
25048 }
25049 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input .single-input {
25050 width: calc(50% - 8px);
25051 }
25052 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input select,
25053 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .inline-input input[type=number] {
25054 min-width: auto;
25055 }
25056 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .has-tooltip {
25057 position: relative;
25058 }
25059 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .has-tooltip .mintmrm-tooltip {
25060 position: unset;
25061 margin-left: 4px;
25062 transform: translateY(2px);
25063 }
25064 .mailmint-automation .steps-settings-sidebar .steps-settings .form-group .has-tooltip .mintmrm-tooltip p {
25065 left: 0;
25066 }
25067 .mailmint-automation .steps-settings-sidebar .steps-settings .inline-with-link {
25068 display: flex;
25069 align-items: center;
25070 justify-content: space-between;
25071 }
25072 .mailmint-automation .steps-settings-sidebar .steps-settings .inline-with-link a {
25073 font-weight: 500;
25074 font-size: 14px;
25075 line-height: 1;
25076 letter-spacing: -0.01em;
25077 color: #6E42D3;
25078 text-decoration: underline;
25079 }
25080 .mailmint-automation .steps-settings-sidebar .steps-settings .inline-with-link a:hover {
25081 text-decoration: none;
25082 }
25083 .mailmint-automation .steps-settings-sidebar .add-template-section {
25084 border: 1px solid #E4E6EB;
25085 border-radius: 6px;
25086 padding: 24px 24px 22px;
25087 }
25088 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template {
25089 display: flex;
25090 flex-flow: column;
25091 align-items: center;
25092 justify-content: center;
25093 width: 160px;
25094 margin: 0 auto;
25095 cursor: pointer;
25096 }
25097 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper {
25098 align-items: center;
25099 background-color: #f6f6f7;
25100 border-radius: 100px;
25101 display: flex;
25102 height: 190px;
25103 justify-content: center;
25104 position: relative;
25105 width: 190px;
25106 }
25107 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg {
25108 background-color: #f4f5fa;
25109 border: 1px solid #e4e6eb;
25110 border-radius: 6px;
25111 padding: 4px 7px;
25112 position: relative;
25113 }
25114 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .hoverlay {
25115 position: absolute;
25116 width: 154px;
25117 height: 168px;
25118 border-radius: 6px;
25119 background: rgba(38, 27, 103, 0.6);
25120 transform: translate(-50%, -50%);
25121 top: 50%;
25122 left: 50%;
25123 display: flex;
25124 align-items: center;
25125 justify-content: center;
25126 opacity: 0;
25127 z-index: 999;
25128 }
25129 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .hoverlay:hover {
25130 opacity: 1;
25131 transition: all 0.3s ease;
25132 }
25133 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .hoverlay button {
25134 background: #fff;
25135 border-radius: 8px;
25136 border: none;
25137 box-shadow: 0 10px 16px rgba(97, 103, 116, 0.15);
25138 color: #2d3149;
25139 font-size: 12px;
25140 font-weight: 600;
25141 letter-spacing: -0.01em;
25142 line-height: 1;
25143 padding: 8px 11px;
25144 width: 105px;
25145 cursor: pointer;
25146 }
25147 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .thumbnail-image-wrapper .thumbnail-image-bg .image-wrapper {
25148 background-position: 50%;
25149 background-repeat: no-repeat;
25150 background-size: 100% auto;
25151 height: 158px;
25152 overflow: hidden;
25153 position: relative;
25154 width: 139px;
25155 }
25156 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode {
25157 font-weight: 600;
25158 font-size: 15px;
25159 line-height: 1.3;
25160 letter-spacing: -0.01em;
25161 text-decoration-line: underline;
25162 color: #6E42D3;
25163 display: block;
25164 margin-top: 12px;
25165 }
25166 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode svg {
25167 position: relative;
25168 top: 3px;
25169 margin-left: 8px;
25170 }
25171 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode svg path {
25172 stroke: #6E42D3;
25173 }
25174 .mailmint-automation .steps-settings-sidebar .add-template-section .add-template .edit-mode.edit-mood svg {
25175 margin-right: 8px;
25176 margin-left: 0;
25177 }
25178 .mailmint-automation .steps-settings-sidebar .wpfnl-mint-automation-add-item {
25179 background: none;
25180 color: #6E42D3;
25181 font-size: 14px;
25182 line-height: 1;
25183 font-weight: 600;
25184 letter-spacing: -0.01em;
25185 text-decoration-line: underline;
25186 text-transform: capitalize;
25187 border: none;
25188 cursor: pointer;
25189 display: flex;
25190 align-items: center;
25191 gap: 6px;
25192 padding-left: 7px;
25193 margin-bottom: 2px;
25194 }
25195 .mailmint-automation .steps-settings-sidebar .wpfnl-mint-automation-add-item .wpfnl-loader {
25196 display: block;
25197 }
25198 .mailmint-automation .steps-settings-sidebar .wpfnl-mint-automation-add-item svg path {
25199 stroke: #6E42D3;
25200 }
25201 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater {
25202 border: 1px solid #e4e6eb;
25203 border-radius: 6px;
25204 margin-bottom: 16px;
25205 padding: 10px 15px 15px;
25206 width: 100%;
25207 }
25208 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater > hr {
25209 left: -15px;
25210 margin: 15px 0;
25211 position: relative;
25212 width: calc(100% + 30px);
25213 display: block;
25214 border-top: 1px solid #e4e6eb;
25215 border-bottom: 0;
25216 }
25217 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater .btn-default {
25218 min-width: auto;
25219 padding: 0 20px;
25220 }
25221 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .repeater-wrapper {
25222 align-items: flex-start;
25223 display: flex;
25224 gap: 5px;
25225 margin-bottom: 10px;
25226 }
25227 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .single-repeater-item {
25228 width: calc(50% - 23px);
25229 }
25230 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .single-repeater-item > label {
25231 margin-bottom: 6px;
25232 display: block;
25233 font-size: 13px;
25234 }
25235 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .single-repeater-item input[type=text] {
25236 min-width: auto;
25237 color: #A7A8B3;
25238 font-size: 13px;
25239 }
25240 .mailmint-automation .steps-settings-sidebar .webhook-outgoing .trash-btn {
25241 align-items: center;
25242 background: transparent;
25243 border: 1px solid #e4e6eb;
25244 border-radius: 5px;
25245 display: flex;
25246 height: 36px;
25247 justify-content: center;
25248 position: relative;
25249 top: 22px;
25250 width: 36px;
25251 cursor: pointer;
25252 }
25253 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper {
25254 position: relative;
25255 background: #f6f8fa;
25256 border-radius: 10px;
25257 padding: 20px 24px;
25258 }
25259 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper:first-child::before {
25260 display: none;
25261 }
25262 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper::before {
25263 content: "Or";
25264 position: absolute;
25265 z-index: 1;
25266 font-weight: 600;
25267 font-size: 16px;
25268 line-height: 1;
25269 letter-spacing: -0.01em;
25270 color: #2D3149;
25271 top: -25px;
25272 left: 0;
25273 }
25274 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules {
25275 display: flex;
25276 flex-flow: row wrap;
25277 gap: 12px;
25278 padding-bottom: 20px;
25279 position: relative;
25280 }
25281 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions {
25282 position: relative;
25283 }
25284 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions::before {
25285 content: "";
25286 width: 30px;
25287 height: 1px;
25288 background: #E2E6F2;
25289 position: absolute;
25290 right: -30px;
25291 top: 50%;
25292 transform: translateY(-50%);
25293 }
25294 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions > button {
25295 width: 38px;
25296 height: 38px;
25297 background: #ffffff;
25298 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
25299 border-radius: 6px;
25300 display: flex;
25301 flex-flow: column;
25302 align-items: center;
25303 justify-content: center;
25304 border: none;
25305 cursor: pointer;
25306 }
25307 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition svg {
25308 display: block;
25309 }
25310 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition path {
25311 fill: #A7A8B3;
25312 }
25313 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is {
25314 width: 114px;
25315 }
25316 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is .wpfnl-selectbox .selectable-options {
25317 width: calc(100% + 124px);
25318 }
25319 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is .selected-option {
25320 overflow: hidden;
25321 white-space: nowrap;
25322 text-overflow: ellipsis;
25323 }
25324 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-1 {
25325 width: 170px;
25326 }
25327 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-2 {
25328 width: 205px;
25329 }
25330 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-2 .wpfnl-custom-selectbox select {
25331 padding: 5px 15px;
25332 }
25333 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-1,
25334 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-is,
25335 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-2 {
25336 position: relative;
25337 }
25338 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:before {
25339 content: "";
25340 position: absolute;
25341 right: 8px;
25342 bottom: calc(50% + 10px);
25343 width: 1px;
25344 height: 100%;
25345 background: #E2E6F2;
25346 z-index: 0;
25347 }
25348 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:first-child::before {
25349 display: none;
25350 }
25351 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol {
25352 position: absolute;
25353 top: -50%;
25354 right: -4px;
25355 transform: translateY(50%);
25356 }
25357 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol > span {
25358 width: 22px;
25359 height: 22px;
25360 border: 1px solid #E2E6F2;
25361 color: #573BFF;
25362 border-radius: 100%;
25363 font-size: 12px;
25364 font-weight: 500;
25365 display: block;
25366 padding: 2px 2px;
25367 text-align: center;
25368 background-color: #F6F8FA;
25369 }
25370 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:first-child .condition-symbol {
25371 display: none;
25372 }
25373 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .selectable-options {
25374 overflow: visible;
25375 display: none;
25376 }
25377 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .selectable-options li {
25378 position: relative;
25379 line-height: 1.3;
25380 padding: 9px 12px 7px;
25381 }
25382 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .selected-option:before {
25383 transition: all 0.3s ease;
25384 }
25385 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox.show-options > .selectable-options {
25386 display: block;
25387 }
25388 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox.show-options .selected-option:before {
25389 transform: translateY(-50%) rotate(-180deg);
25390 }
25391 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .submenu {
25392 position: absolute;
25393 left: 100%;
25394 top: 0;
25395 width: 160px;
25396 border-radius: 6px;
25397 border: 1px solid #EBEDF0;
25398 background: #FFF;
25399 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
25400 padding: 8px;
25401 display: none;
25402 }
25403 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox li.show-options .submenu {
25404 display: block;
25405 }
25406 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .angle-right {
25407 position: absolute;
25408 right: 9px;
25409 top: 12px;
25410 line-height: 1;
25411 width: 11px;
25412 height: 11px;
25413 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");
25414 background-repeat: no-repeat;
25415 background-position: center;
25416 background-size: contain;
25417 transform: rotate(-90deg);
25418 }
25419 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules input.input-value {
25420 line-height: 1;
25421 padding: 10px 15px;
25422 min-width: auto;
25423 }
25424 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .selectbox-selected-value {
25425 width: 100%;
25426 padding: 8px 33px 7px 12px;
25427 background-color: #fff;
25428 display: flex;
25429 gap: 2px;
25430 align-items: center;
25431 min-height: 38px;
25432 }
25433 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .selectbox-selected-value:before {
25434 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==");
25435 width: 10px;
25436 }
25437 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .selectbox-search input[type=search] {
25438 min-width: 100%;
25439 }
25440 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .wpfnl-selected-item {
25441 white-space: nowrap;
25442 overflow: hidden;
25443 width: 101px;
25444 text-overflow: ellipsis;
25445 margin: 0;
25446 }
25447 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-custom-selectbox .more-items {
25448 width: 25px;
25449 line-height: 1;
25450 display: block;
25451 }
25452 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition {
25453 display: flex;
25454 align-items: center;
25455 gap: 5px;
25456 font-weight: 500;
25457 font-size: 15px;
25458 line-height: 1.12;
25459 color: #6E42D3;
25460 background: transparent;
25461 border: none;
25462 cursor: pointer;
25463 }
25464 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition svg {
25465 width: 12px;
25466 height: 12px;
25467 }
25468 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition path {
25469 stroke: #6E42D3;
25470 }
25471 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__input {
25472 font-size: 14px;
25473 padding: 11px 30px 9px 32px;
25474 border: 1px solid #EEF0F3;
25475 color: #363B4E;
25476 line-height: 1;
25477 border-radius: 6px;
25478 }
25479 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__arrow_top {
25480 display: none;
25481 }
25482 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu {
25483 border-radius: 10px;
25484 border: 1px solid #F1F0F5;
25485 background: #FFF;
25486 box-shadow: 0px 18px 22px 0px rgba(73, 59, 104, 0.1);
25487 width: 277px;
25488 }
25489 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row {
25490 width: calc(100% - 50px) !important;
25491 margin-left: auto;
25492 }
25493 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_buttons {
25494 gap: 7px;
25495 }
25496 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_button {
25497 padding: 3px 8px;
25498 height: auto;
25499 margin: 0;
25500 }
25501 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_select {
25502 background-color: #6E42D3;
25503 color: #fff;
25504 }
25505 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu > .dp__action_row .dp__action_cancel {
25506 border: 1px solid var(--dp-border-color);
25507 }
25508 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__menu_inner {
25509 padding: 10px;
25510 }
25511 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__month_year_row {
25512 border-radius: 8px;
25513 gap: 6px;
25514 margin-bottom: 6px;
25515 }
25516 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__calendar_header_item {
25517 color: #9398A5;
25518 }
25519 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__calendar_header_separator {
25520 background: #F1F0F5;
25521 margin-bottom: 15px;
25522 }
25523 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp--arrow-btn-nav {
25524 border-radius: 8px;
25525 border: 1px solid #F1F0F5;
25526 height: 35px;
25527 }
25528 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp--arrow-btn-nav svg {
25529 width: 17px;
25530 height: 17px;
25531 }
25532 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__inner_nav {
25533 border-radius: 8px;
25534 background: transparent;
25535 }
25536 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__month_year_wrap {
25537 gap: 6px;
25538 }
25539 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__month_year_wrap .dp__btn {
25540 background: #fff;
25541 border-radius: 8px;
25542 border: 1px solid #F1F0F5;
25543 }
25544 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_inner {
25545 color: #2D3149;
25546 font-weight: 500;
25547 border-radius: 50%;
25548 }
25549 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_offset {
25550 color: #a6a7a9;
25551 }
25552 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_disabled,
25553 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__cell_offset.dp__cell_disabled {
25554 color: #D0D5DD;
25555 }
25556 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__active_date {
25557 background: #6E42D3;
25558 border-radius: 50%;
25559 color: #fff;
25560 border: none;
25561 }
25562 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__today {
25563 border: none;
25564 }
25565 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__instance_calendar button[aria-label="Open time picker"] {
25566 position: absolute;
25567 left: 5px;
25568 bottom: -40px;
25569 width: auto;
25570 background: transparent;
25571 z-index: 1;
25572 }
25573 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__overlay button[aria-label="Close time Picker"] {
25574 position: absolute;
25575 left: 5px;
25576 bottom: -40px;
25577 width: auto;
25578 background: white;
25579 z-index: 1;
25580 }
25581 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__overlay_cell_active {
25582 color: #fff;
25583 }
25584 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__selection_preview {
25585 display: none;
25586 }
25587 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__time_display {
25588 font-weight: 500;
25589 padding: 10px 5px;
25590 }
25591 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__inc_dec_button_inline {
25592 width: 15px;
25593 height: 15px;
25594 position: relative;
25595 background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTAgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBzdHJva2U9IiM3QThCOUEiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIxLjUiIGQ9Ik0xIDFsNCA0IDQtNCIvPjwvc3ZnPg==);
25596 background-repeat: no-repeat;
25597 background-size: 15px 15px;
25598 background-position: center;
25599 left: -1px;
25600 }
25601 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__inc_dec_button_inline .dp__tp_inline_btn_bar {
25602 display: none;
25603 }
25604 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__time_input .dp__time_col .dp__tp_inline_btn_top {
25605 transform: rotate(-180deg);
25606 }
25607 .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__pm_am_button {
25608 font-size: 13px;
25609 padding: 5px;
25610 background: #f1f1f1;
25611 border: 1px solid var(--dp-border-color);
25612 color: #333;
25613 width: 32px;
25614 }
25615
25616 @media only screen and (max-width: 1399px) {
25617 .wpfnl .mailmint-automation .condition .automation-steps-wrapper {
25618 width: calc(100% - 484px);
25619 }
25620 .wpfnl .mailmint-automation .condition .steps-settings-sidebar {
25621 width: 460px;
25622 }
25623 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper {
25624 background: transparent;
25625 border-radius: 0;
25626 padding: 0;
25627 }
25628 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules {
25629 flex-flow: column;
25630 background: #f6f8fa;
25631 margin-top: 40px;
25632 padding: 15px;
25633 border-radius: 10px;
25634 }
25635 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:first-child {
25636 margin-top: 0;
25637 }
25638 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules {
25639 width: 100%;
25640 }
25641 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox {
25642 max-width: 100%;
25643 }
25644 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions {
25645 position: absolute;
25646 right: -12px;
25647 top: -13px;
25648 }
25649 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions > button {
25650 width: 30px;
25651 height: 30px;
25652 box-shadow: 0px 1px 6px rgba(182, 185, 191, 0.33);
25653 border-radius: 100%;
25654 }
25655 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions::before {
25656 display: none;
25657 }
25658 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition svg {
25659 display: block;
25660 width: 15px;
25661 height: 15px;
25662 }
25663 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions .delete-condition path {
25664 fill: #ec5956;
25665 }
25666 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:before {
25667 display: none;
25668 }
25669 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol {
25670 position: absolute;
25671 top: 0;
25672 right: 50%;
25673 transform: translate(11px, -31px);
25674 }
25675 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol:before {
25676 content: "";
25677 position: absolute;
25678 left: 10px;
25679 top: -10px;
25680 height: calc(100% + 20px);
25681 width: 1px;
25682 background: #E2E6F2;
25683 z-index: -1;
25684 }
25685 .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .add-and-condition {
25686 margin-top: 14px;
25687 }
25688 }
25689 @media only screen and (max-width: 1199px) {
25690 .wpfnl .mailmint-automation .condition .steps-settings-sidebar,
25691 .wpfnl .mailmint-automation .steps-settings-sidebar {
25692 width: 380px;
25693 padding: 14px 15px;
25694 }
25695 .wpfnl .mailmint-automation .has-sidebar .automation-steps-wrapper {
25696 width: calc(100% - 404px);
25697 }
25698 .mailmint-automation .logical-decision-box {
25699 max-width: 345px;
25700 }
25701 }
25702 .arco-popover-content,
25703 .arco-popconfirm-content {
25704 border-radius: 8px;
25705 border: none;
25706 width: 293px;
25707 padding: 20px;
25708 }
25709 .arco-popover-content .arco-tree-node-title,
25710 .arco-popconfirm-content .arco-tree-node-title {
25711 width: 100%;
25712 }
25713 .arco-popover-content .color-input-picker-wrapper,
25714 .arco-popconfirm-content .color-input-picker-wrapper {
25715 display: flex;
25716 align-items: start;
25717 justify-content: space-between;
25718 padding-bottom: 20px;
25719 margin-bottom: 20px;
25720 border-bottom: 1px solid #EBEDF0;
25721 }
25722 .arco-popover-content .color-title,
25723 .arco-popconfirm-content .color-title {
25724 color: #2D3149;
25725 font-size: 13px;
25726 font-weight: 500;
25727 line-height: 1.2;
25728 letter-spacing: -0.13px;
25729 margin-bottom: 8px;
25730 }
25731 .arco-popover-content .title-field-wrapper .color-field-wrapper,
25732 .arco-popconfirm-content .title-field-wrapper .color-field-wrapper {
25733 display: flex;
25734 gap: 7px;
25735 }
25736 .arco-popover-content .title-field-wrapper .color-field-wrapper input[type=text],
25737 .arco-popconfirm-content .title-field-wrapper .color-field-wrapper input[type=text] {
25738 width: 96px;
25739 padding: 6px 12px;
25740 border-radius: 4px;
25741 border: 1px solid #EBEDF0;
25742 line-height: 1.3;
25743 }
25744 .arco-popover-content .title-field-wrapper .color-field-wrapper .color-bg,
25745 .arco-popconfirm-content .title-field-wrapper .color-field-wrapper .color-bg {
25746 border-radius: 4px;
25747 border: 1px solid #EBEDF0;
25748 }
25749 .arco-popover-content .title-field-wrapper .picker-btn,
25750 .arco-popconfirm-content .title-field-wrapper .picker-btn {
25751 position: relative;
25752 width: 34px;
25753 height: 32px;
25754 border-radius: 4px;
25755 border: 1px solid #EBEDF0;
25756 }
25757 .arco-popover-content .title-field-wrapper .picker-btn:before,
25758 .arco-popconfirm-content .title-field-wrapper .picker-btn:before {
25759 position: absolute;
25760 top: 50%;
25761 left: 50%;
25762 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iIzJEMzE0OSIgZD0iTTE0LjMgMS43NWMtMS0xLTIuNi0xLTMuNTUgMEw4LjkgMy42Yy0uNTUtLjI1LTEuMjUtLjItMS43LjMtLjYuNi0uNiAxLjU1IDAgMi4xNWwtNC4zIDQuM2MtLjMuMy0uNDUuNy0uNDUgMS4xNWwtMSAxYy0uNi42LS42IDEuNTUgMCAyLjE1LjM1LjIuNy4zNSAxLjEuMzUuNCAwIC43NS0uMTUgMS4wNS0uNDVsMS0xYy40LjA1Ljg1LS4xNSAxLjE1LS40NWw0LjMtNC4zYy4zLjMuNy40NSAxLjA1LjQ1LjQgMCAuNzUtLjE1IDEuMDUtLjQ1LjQ1LS40NS41NS0xLjE1LjMtMS43bDEuODUtMS44NWMxLS45NSAxLTIuNTUgMC0zLjV6bS00Ljk1IDYuNEw3LjUgMTBINC42bDMuMy0zLjMgMS40NSAxLjQ1eiIvPjwvc3ZnPg==");
25763 height: 16px;
25764 width: 16px;
25765 transform: translate(-50%, -50%);
25766 }
25767
25768 .openai-button-wrapper {
25769 width: 100%;
25770 padding: 14px 14px 0;
25771 display: none;
25772 }
25773 .openai-button-wrapper .arco-space-item .arco-btn-size-default {
25774 height: auto;
25775 padding: 11px 14px;
25776 border-radius: 8px;
25777 font-size: 15px;
25778 font-weight: 600;
25779 background-color: #11A37F;
25780 display: flex;
25781 align-items: center;
25782 gap: 6px;
25783 line-height: 1;
25784 }
25785 .openai-button-wrapper .arco-space-item .arco-btn-size-default:hover {
25786 background-color: #11A37F;
25787 }
25788 .openai-button-wrapper .arco-space-item .arco-btn::before {
25789 content: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMTggMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTE2LjcxIDcuMzY2YTQuNDg4IDQuNDg4IDAgMDAtLjM4Ny0zLjY4MyA0LjUzNSA0LjUzNSAwIDAwLTQuODgyLTIuMTc1IDQuNTQ4IDQuNTQ4IDAgMDAtNy43MDcgMS42MjhBNC40ODkgNC40ODkgMCAwMC43MzYgNS4zMTFhNC41MzUgNC41MzUgMCAwMC41NTcgNS4zMjMgNC40ODUgNC40ODUgMCAwMC4zODMgMy42ODMgNC41MzggNC41MzggMCAwMDQuODg2IDIuMTc1QTQuNDg4IDQuNDg4IDAgMDA5Ljk0NCAxOGE0LjU0MSA0LjU0MSAwIDAwNC4zMjktMy4xNTQgNC40OTEgNC40OTEgMCAwMDIuOTk4LTIuMTc1IDQuNTQyIDQuNTQyIDAgMDAtLjU2LTUuMzA1em0tNi43NjYgOS40NTZhMy4zNTcgMy4zNTcgMCAwMS0yLjE1OC0uNzhsLjEwNy0uMDYxIDMuNTg0LTIuMDY5YS41OTYuNTk2IDAgMDAuMjk0LS41MVY4LjM0OGwxLjUxNS44NzZhLjA1My4wNTMgMCAwMS4wMjkuMDR2NC4xODZhMy4zNzggMy4zNzggMCAwMS0zLjM3MSAzLjM3em0tNy4yNDYtMy4wOTRhMy4zNTMgMy4zNTMgMCAwMS0uNC0yLjI2bC4xMDYuMDYzIDMuNTg3IDIuMDdhLjU3OC41NzggMCAwMC41ODUgMGw0LjM4My0yLjUyN3YxLjc0OWEuMDYuMDYgMCAwMS0uMDI1LjA0NmwtMy42MyAyLjA5NGEzLjM3NCAzLjM3NCAwIDAxLTQuNjA2LTEuMjM1em0tLjk0NC03LjgwNmEzLjM2NCAzLjM2NCAwIDAxMS43NzUtMS40OFY4LjdhLjU3NS41NzUgMCAwMC4yOS41MDdsNC4zNjEgMi41MTYtMS41MTUuODc3YS4wNTcuMDU3IDAgMDEtLjA1MyAwbC0zLjYyMy0yLjA5YTMuMzc4IDMuMzc4IDAgMDEtMS4yMzUtNC42MDZ2LjAxOHptMTIuNDQ4IDIuODkyTDkuODI3IDYuMjczbDEuNTExLS44NzNhLjA1Ny4wNTcgMCAwMS4wNTQgMGwzLjYyMiAyLjA5M2EzLjM3IDMuMzcgMCAwMS0uNTA3IDYuMDc5VjkuMzE0YS41OTIuNTkyIDAgMDAtLjMwNS0uNXptMS41MDgtMi4yNjhsLS4xMDctLjA2NC0zLjU4LTIuMDg2YS41ODIuNTgyIDAgMDAtLjU4OSAwTDcuMDU2IDYuOTIyVjUuMTczYS4wNS4wNSAwIDAxLjAyLS4wNDZsMy42MjQtMi4wOWEzLjM3NCAzLjM3NCAwIDAxNS4wMSAzLjQ5NXYuMDE0ek02LjIyOSA5LjY0N2wtMS41MTUtLjg3M2EuMDYuMDYgMCAwMS0uMDI5LS4wNDJWNC41NTZhMy4zNzQgMy4zNzQgMCAwMTUuNTMyLTIuNTlsLS4xMDcuMDYtMy41ODMgMi4wNjhhLjU5Ni41OTYgMCAwMC0uMjk1LjUxMUw2LjIzIDkuNjQ3em0uODIzLTEuNzc0bDEuOTUxLTEuMTI1IDEuOTU2IDEuMTI1djIuMjVMOS4wMSAxMS4yNDhsLTEuOTU2LTEuMTI1LS4wMDMtMi4yNXoiLz48L3N2Zz4=");
25790 width: 16px;
25791 height: 16px;
25792 display: block;
25793 }
25794
25795 .wpfnl-mrm-email-template__wrapper {
25796 position: fixed;
25797 top: 32px;
25798 right: 0;
25799 background: rgba(0, 0, 0, 0.3215686275);
25800 z-index: 999;
25801 width: calc(100% - 160px);
25802 height: 100%;
25803 display: flex;
25804 flex-flow: column;
25805 align-items: center;
25806 justify-content: center;
25807 }
25808 .wpfnl-mrm-email-template__wrapper .modal-loader {
25809 position: absolute;
25810 left: 0;
25811 top: 0;
25812 width: 100%;
25813 height: 100%;
25814 background: #f6f8fa;
25815 border-radius: 10px;
25816 z-index: 11;
25817 display: flex;
25818 flex-flow: column;
25819 align-items: center;
25820 justify-content: center;
25821 }
25822 .wpfnl-mrm-email-template__wrapper .modal-loader .wpfnl-loader {
25823 display: block;
25824 width: 40px;
25825 height: 40px;
25826 }
25827
25828 .folded .wpfnl-mrm-email-template__wrapper {
25829 width: calc(100% - 36px);
25830 }
25831
25832 .wpfnl-mrm-email-builder__modal {
25833 width: 100%;
25834 height: 100%;
25835 background: #fff;
25836 }
25837
25838 .wpfnl-mrm-email-template__modal {
25839 padding: 40px;
25840 width: 100%;
25841 height: 100%;
25842 max-height: 905px;
25843 }
25844 .wpfnl-mrm-email-template__modal .wpfnl-mrm-email-template__inner {
25845 position: relative;
25846 height: 100%;
25847 width: 100%;
25848 max-width: 1365px;
25849 margin: 0 auto;
25850 }
25851 .wpfnl-mrm-email-template__modal .template-modal-overflow {
25852 background: #f6f8fa;
25853 border-radius: 10px;
25854 position: relative;
25855 padding: 40px 80px;
25856 height: 100%;
25857 width: 100%;
25858 margin: 0 auto;
25859 overflow: auto;
25860 }
25861 .wpfnl-mrm-email-template__modal .template-modal-header {
25862 display: flex;
25863 flex-flow: row wrap;
25864 justify-content: space-between;
25865 align-items: center;
25866 }
25867 .wpfnl-mrm-email-template__modal .template-modal-header .modal-title {
25868 font-weight: 600;
25869 font-size: 20px;
25870 line-height: 1.2;
25871 color: #2d3149;
25872 }
25873 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter {
25874 display: flex;
25875 align-items: center;
25876 gap: 28px;
25877 }
25878 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item {
25879 font-weight: 400;
25880 font-size: 15px;
25881 color: #9398a5;
25882 cursor: pointer;
25883 padding: 4px 0;
25884 transition: all 0.3s ease;
25885 position: relative;
25886 background: transparent;
25887 border: none;
25888 line-height: 1;
25889 }
25890 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item:before {
25891 content: "";
25892 position: absolute;
25893 bottom: 0;
25894 left: 0;
25895 width: 100%;
25896 height: 2px;
25897 background: #6E42D3;
25898 visibility: hidden;
25899 opacity: 0;
25900 transition: all 0.3s ease;
25901 }
25902 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item.active {
25903 color: #6E42D3;
25904 }
25905 .wpfnl-mrm-email-template__modal .template-modal-header .template-filter .filter-item.active:before {
25906 opacity: 1;
25907 visibility: visible;
25908 }
25909 .wpfnl-mrm-email-template__modal .cross-icon {
25910 position: absolute;
25911 right: -20px;
25912 top: -20px;
25913 background: #ffffff;
25914 box-shadow: 0px 1px 1px #dadada;
25915 border-radius: 100px;
25916 width: 46px;
25917 height: 46px;
25918 display: flex;
25919 align-items: center;
25920 justify-content: center;
25921 cursor: pointer;
25922 z-index: 12;
25923 }
25924 .wpfnl-mrm-email-template__modal .mintmrm-template-wrapper {
25925 position: relative;
25926 display: flex;
25927 flex-flow: row wrap;
25928 margin-left: -40px;
25929 }
25930 .wpfnl-mrm-email-template__modal .mintmrm-single-template {
25931 width: calc(25% - 40px);
25932 margin-left: 40px;
25933 margin-top: 40px;
25934 position: relative;
25935 }
25936 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .mintmrm-single-remote-template {
25937 border-radius: 10px;
25938 cursor: default;
25939 }
25940 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .mintmrm-single-remote-template .template-image-wrapper {
25941 background-color: #fff;
25942 border-radius: 10px;
25943 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");
25944 }
25945 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .template-info .title {
25946 opacity: 0;
25947 visibility: hidden;
25948 }
25949 .wpfnl-mrm-email-template__modal .mintmrm-single-template.create-from-scratch .btn-default {
25950 position: absolute;
25951 top: 50%;
25952 left: 50%;
25953 transform: translate(-50%, -50%);
25954 width: 175px;
25955 box-shadow: 0px 10px 16px rgba(189, 193, 200, 0.5019607843);
25956 font-size: 15px;
25957 padding: 12px 15px;
25958 border: none;
25959 z-index: 9;
25960 height: auto;
25961 line-height: 1;
25962 }
25963 .wpfnl-mrm-email-template__modal .mintmrm-single-template.coming-soon {
25964 width: calc(75% - 40px);
25965 }
25966 .wpfnl-mrm-email-template__modal .mintmrm-single-template.coming-soon .coming-soon-inner {
25967 width: 100%;
25968 height: calc(100% - 35px);
25969 min-height: 120px;
25970 background: #fff;
25971 text-align: center;
25972 border-radius: 10px;
25973 display: flex;
25974 flex-flow: column;
25975 align-items: center;
25976 justify-content: center;
25977 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
25978 }
25979 .wpfnl-mrm-email-template__modal .mintmrm-single-template.coming-soon h2 {
25980 width: 100%;
25981 text-align: center;
25982 z-index: 2;
25983 font-size: 16px;
25984 font-weight: 600;
25985 color: #2d3149;
25986 cursor: text;
25987 }
25988 .wpfnl-mrm-email-template__modal .mintmrm-single-template .mintmrm-single-remote-wrapper {
25989 position: relative;
25990 }
25991 .wpfnl-mrm-email-template__modal .mintmrm-single-template .mintmail-delete-email-template {
25992 border: none;
25993 padding: 5px;
25994 margin-top: 10px;
25995 background: transparent;
25996 color: #d63638;
25997 text-decoration: underline;
25998 }
25999 .wpfnl-mrm-email-template__modal .mintmrm-single-template .mintmrm-single-remote-template {
26000 position: relative;
26001 }
26002 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-image-wrapper {
26003 background-repeat: no-repeat;
26004 background-size: 100% auto;
26005 background-position: center center;
26006 border-radius: 10px;
26007 position: relative;
26008 overflow: hidden;
26009 }
26010 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-image-wrapper:before {
26011 content: "";
26012 display: block;
26013 padding-top: calc(100% + 20px);
26014 }
26015 .wpfnl-mrm-email-template__modal .mintmrm-single-template .hoverlay {
26016 background: rgba(255, 255, 255, 0.85);
26017 border-radius: 6px;
26018 position: absolute;
26019 top: 0;
26020 left: 0;
26021 width: 100%;
26022 height: 100%;
26023 z-index: 9;
26024 padding: 0 15px;
26025 display: flex;
26026 flex-flow: column;
26027 align-items: center;
26028 justify-content: center;
26029 opacity: 0;
26030 visibility: hidden;
26031 transition: all 0.3s ease;
26032 }
26033 .wpfnl-mrm-email-template__modal .mintmrm-single-template .hoverlay .mintmrm-btn {
26034 padding: 11px 18px;
26035 }
26036 .wpfnl-mrm-email-template__modal .mintmrm-single-template.importing .hoverlay, .wpfnl-mrm-email-template__modal .mintmrm-single-template:hover .hoverlay {
26037 opacity: 1;
26038 visibility: visible;
26039 }
26040 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-img {
26041 width: 100%;
26042 height: 350px;
26043 border-radius: 10px 10px 0 0;
26044 object-fit: contain;
26045 }
26046 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-info {
26047 margin-top: 16px;
26048 }
26049 .wpfnl-mrm-email-template__modal .mintmrm-single-template .template-info .title {
26050 margin-bottom: 0;
26051 text-align: center;
26052 display: block;
26053 color: #2d3149;
26054 font-weight: 600;
26055 font-size: 18px;
26056 line-height: 1;
26057 letter-spacing: -0.01em;
26058 transition: all 0.3s ease;
26059 }
26060
26061 .mintmrm-delete-alert-wrapper {
26062 position: fixed;
26063 top: 0;
26064 right: 0;
26065 padding: 15px;
26066 width: calc(100% - 160px);
26067 height: 100%;
26068 background: rgba(16, 5, 46, 0.3);
26069 z-index: 999;
26070 display: none;
26071 flex-flow: row wrap;
26072 align-items: center;
26073 justify-content: center;
26074 }
26075 .mintmrm-delete-alert-wrapper.show-modal {
26076 display: flex;
26077 }
26078
26079 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation {
26080 background: #ffffff;
26081 border-radius: 10px;
26082 width: 100%;
26083 max-width: 514px;
26084 animation: mintmrm-bounce 0.3s;
26085 }
26086
26087 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header {
26088 border-radius: 10px 10px 0 0;
26089 justify-content: space-between;
26090 padding: 24px;
26091 position: relative;
26092 }
26093
26094 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header h3 {
26095 font-weight: 600;
26096 font-size: 18px;
26097 line-height: 1.11;
26098 }
26099
26100 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .delete-title {
26101 display: flex;
26102 align-items: center;
26103 gap: 8px;
26104 }
26105
26106 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .delete-title svg path {
26107 fill: #ec5956;
26108 }
26109
26110 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header p {
26111 margin-top: 14px;
26112 font-weight: 400;
26113 font-size: 14px;
26114 line-height: 1.21;
26115 color: #9398a5;
26116 }
26117
26118 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .cross-icon {
26119 height: 40px;
26120 width: 40px;
26121 background: #ffffff;
26122 box-shadow: 0px 1px 1px #dadada;
26123 border-radius: 100px;
26124 display: flex;
26125 justify-content: center;
26126 align-items: center;
26127 position: absolute;
26128 cursor: pointer;
26129 top: -12px;
26130 right: -12px;
26131 }
26132
26133 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .cross-icon svg path {
26134 fill: #686f7f;
26135 }
26136
26137 .mintmrm-delete-alert-wrapper .icon {
26138 width: 50px;
26139 height: 50px;
26140 border: 2px solid #e65555;
26141 display: flex;
26142 align-items: center;
26143 justify-content: center;
26144 }
26145
26146 .mintmrm-delete-alert-wrapper .icon svg {
26147 width: 18px;
26148 height: 18px;
26149 }
26150
26151 .mintmrm-delete-alert-wrapper .icon svg path {
26152 stroke: #e65555;
26153 }
26154
26155 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn {
26156 display: flex;
26157 flex-flow: row;
26158 align-items: center;
26159 justify-content: flex-end;
26160 padding: 20px;
26161 border-top: 1px solid #E9EAEE;
26162 }
26163
26164 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li {
26165 margin: 0 6px;
26166 }
26167
26168 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li:last-child {
26169 margin-right: 0;
26170 }
26171
26172 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li .cancel {
26173 background-color: transparent;
26174 border: 1px solid #e4e6eb;
26175 color: #2d3149;
26176 }
26177
26178 .mintmrm-delete-alert-wrapper .mintmrm-delete-confirm-btn li .cancel:hover {
26179 background-color: rgba(0, 0, 0, 0.031372549);
26180 }
26181
26182 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation {
26183 max-width: 530px;
26184 }
26185
26186 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header {
26187 background-color: transparent;
26188 border-bottom-color: #ebedf0;
26189 position: relative;
26190 padding: 25px 30px 25px 30px;
26191 }
26192
26193 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-header .cross-icon {
26194 height: 46px;
26195 width: 46px;
26196 box-shadow: 0px 1px 1px #dadada;
26197 border-radius: 100px;
26198 border: none;
26199 position: absolute;
26200 right: -14px;
26201 top: -15px;
26202 }
26203
26204 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-body {
26205 display: block;
26206 padding: 5px 30px 30px;
26207 }
26208
26209 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-body .form-group label {
26210 margin-bottom: 7px;
26211 color: #2d3149;
26212 font-weight: 600;
26213 }
26214
26215 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .delete-confirmation-body .form-group input[type=email] {
26216 font-size: 14px;
26217 min-height: 48px;
26218 color: #6a707c;
26219 border-color: #E9EAEE;
26220 width: 100%;
26221 }
26222
26223 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn li {
26224 margin: 0;
26225 }
26226
26227 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .mintmrm-btn {
26228 display: inline-block;
26229 border: none;
26230 height: 38px;
26231 font-size: 14px;
26232 line-height: 38px;
26233 color: #fff;
26234 font-weight: 500;
26235 padding: 0 30px;
26236 min-width: 130px;
26237 cursor: pointer;
26238 text-align: center;
26239 letter-spacing: 0.2px;
26240 border-radius: 10px;
26241 text-transform: capitalize;
26242 background-color: #6E42D3;
26243 border: 1px solid transparent;
26244 }
26245
26246 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .mintmrm-btn.outline {
26247 border-color: #6E42D3;
26248 color: #6E42D3;
26249 background-color: transparent;
26250 }
26251
26252 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .cancel {
26253 margin-right: 14px;
26254 }
26255
26256 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .alert-message p {
26257 color: #09af09;
26258 margin-right: 10px;
26259 font-size: 14px;
26260 font-weight: 500;
26261 }
26262
26263 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .alert-message.mintmrm-error p {
26264 color: #eb1010;
26265 }
26266
26267 .mrm-email-editor .mintmrm-delete-alert-wrapper .mintmrm-delete-confirmation .mintmrm-delete-confirm-btn .mintmrm-loader {
26268 display: inline-block;
26269 position: relative;
26270 top: 2px;
26271 }
26272
26273 .mintmrm-loader {
26274 border: 2px solid #8265c5;
26275 border-radius: 50%;
26276 border-top: 2px solid #fff;
26277 width: 13px;
26278 height: 13px;
26279 animation: spin 0.7s linear infinite;
26280 display: inline-block;
26281 margin-left: 4px;
26282 }
26283
26284 .mintmrm-loader.show {
26285 display: block;
26286 }
26287
26288 @-webkit-keyframes spin {
26289 0% {
26290 -webkit-transform: rotate(0deg);
26291 }
26292 100% {
26293 -webkit-transform: rotate(360deg);
26294 }
26295 }
26296 @keyframes spin {
26297 0% {
26298 transform: rotate(0deg);
26299 }
26300 100% {
26301 transform: rotate(360deg);
26302 }
26303 }
26304 .folded .mintmrm-delete-alert-wrapper {
26305 width: calc(100% - 36px);
26306 }
26307
26308 .wpfnl-mrm-email-template__wrapper {
26309 width: calc(100% - 36px);
26310 }
26311 .wpfnl-mrm-email-template__wrapper .template-modal-inner {
26312 align-items: center;
26313 display: flex;
26314 max-width: 1215px;
26315 width: 100%;
26316 }
26317 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper {
26318 background: #f6f8fa;
26319 border-radius: 10px;
26320 padding: 24px 48px 40px 40px;
26321 position: relative;
26322 width: 100%;
26323 }
26324 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .cross-icon {
26325 align-items: center;
26326 background: #fff;
26327 border-radius: 100px;
26328 box-shadow: 0 1px 1px #dadada;
26329 cursor: pointer;
26330 display: flex;
26331 height: 34px;
26332 justify-content: center;
26333 position: absolute;
26334 right: -15px;
26335 top: -15px;
26336 width: 34px;
26337 z-index: 2;
26338 }
26339 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper h2 {
26340 color: #2d3149;
26341 font-size: 20px;
26342 font-weight: 600;
26343 line-height: 1.2;
26344 margin-bottom: 25px;
26345 }
26346 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper {
26347 align-items: start;
26348 display: flex;
26349 gap: 24px;
26350 }
26351 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section {
26352 background: #fff;
26353 border-radius: 10px;
26354 box-shadow: 0 1px 1px hsla(220, 7%, 73%, 0.3);
26355 width: 65%;
26356 }
26357 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header {
26358 align-items: center;
26359 border-bottom: 1px solid #ebedf0;
26360 display: flex;
26361 justify-content: space-between;
26362 padding: 17px 20px 17px 24px;
26363 }
26364 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .preview-email-header .responsive-view-section {
26365 border-radius: 6px;
26366 display: flex;
26367 }
26368 .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 {
26369 border-radius: 6px 0 0 6px;
26370 cursor: pointer;
26371 }
26372 .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 {
26373 stroke: #573BFF;
26374 }
26375 .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 {
26376 stroke: #573BFF;
26377 }
26378 .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 {
26379 border-radius: 0 6px 6px 0;
26380 cursor: pointer;
26381 }
26382 .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 {
26383 stroke: #573BFF;
26384 }
26385 .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 {
26386 stroke: #573BFF;
26387 }
26388 .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 {
26389 align-items: center;
26390 background-color: #fff;
26391 border-right: 1px solid #ebedf0;
26392 border: 1px solid #ebedf0;
26393 display: flex;
26394 height: 34px;
26395 justify-content: center;
26396 width: 44px;
26397 }
26398 .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 {
26399 align-items: center;
26400 background-color: transparent;
26401 border: 1px solid #ebedf0;
26402 border-radius: 6px;
26403 color: #2d3149;
26404 display: flex;
26405 font-size: 14px;
26406 font-weight: 500;
26407 gap: 7px;
26408 line-height: 1.07;
26409 padding: 8px 16px;
26410 cursor: pointer;
26411 }
26412 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .template-modal-overflow {
26413 display: flex;
26414 height: 500px;
26415 justify-content: center;
26416 padding: 19px 24px 24px;
26417 background: #fff;
26418 border-radius: 10px;
26419 overflow: auto;
26420 width: 100%;
26421 margin: 0 auto;
26422 max-width: 1365px;
26423 position: relative;
26424 }
26425 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .preview-test-section .template-modal-overflow .mobile-view {
26426 max-width: 400px;
26427 width: 100%;
26428 }
26429 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section {
26430 background: #fff;
26431 border-radius: 10px;
26432 box-shadow: 0 1px 1px hsla(220, 7%, 73%, 0.3);
26433 padding: 24px;
26434 width: 35%;
26435 }
26436 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .form-group {
26437 margin-bottom: 20px;
26438 position: relative;
26439 }
26440 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .form-group .at-the-rate-icon {
26441 bottom: 10px;
26442 left: 15px;
26443 position: absolute;
26444 }
26445 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .form-group input[type=email] {
26446 padding: 14px 15px 14px 43px;
26447 border: 1px solid #ebedf0;
26448 border-radius: 6px;
26449 color: #2d3149;
26450 display: block;
26451 font-weight: 400;
26452 line-height: 1.3;
26453 width: 100%;
26454 box-shadow: 0 0 0 transparent;
26455 background-color: #fff;
26456 }
26457 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn {
26458 display: flex;
26459 gap: 12px;
26460 justify-content: end;
26461 position: relative;
26462 }
26463 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn .alert-message {
26464 left: 0;
26465 max-width: 240px;
26466 position: absolute;
26467 top: 0;
26468 width: 100%;
26469 }
26470 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn .alert-message.wpfnl-error {
26471 color: #f44336;
26472 }
26473 .wpfnl-mrm-email-template__wrapper .template-modal-inner .preview-modal-wrapper .preview-test-email-wrapper .test-email-section .footer-btn .alert-message.wpfnl-success {
26474 color: #4caf50;
26475 }
26476
26477 .wpfnl-order-bump__template .template-preview-wrapper .description p {
26478 margin-bottom: 10px;
26479 }
26480 .wpfnl-order-bump__template .template-preview-wrapper .description p:last-child {
26481 margin-bottom: 0;
26482 }
26483 .wpfnl-order-bump__template .template-preview-wrapper .description ul {
26484 list-style: disc;
26485 }
26486 .wpfnl-order-bump__template .template-preview-wrapper .description ol,
26487 .wpfnl-order-bump__template .template-preview-wrapper .description ul {
26488 padding-left: 20px;
26489 margin-bottom: 10px;
26490 }
26491 .wpfnl-order-bump__template .template-preview-wrapper .description ol:last-child,
26492 .wpfnl-order-bump__template .template-preview-wrapper .description ul:last-child {
26493 margin-bottom: 0;
26494 }
26495
26496 .wpfnl-order-bump__template-style1 {
26497 background-color: #ffffff;
26498 border-radius: 12px;
26499 position: relative;
26500 border: 1px solid #E5E8F3;
26501 }
26502 .wpfnl-order-bump__template-style1 .preview-tag {
26503 background: #6E42D3;
26504 border-radius: 0px 3px 3px 0px;
26505 font-weight: 500;
26506 font-size: 12px;
26507 line-height: 14px;
26508 color: #FFFFFF;
26509 text-transform: capitalize;
26510 display: inline-block;
26511 padding: 5px 9px;
26512 position: absolute;
26513 top: -11px;
26514 left: -8px;
26515 }
26516 .wpfnl-order-bump__template-style1 .preview-tag:before {
26517 content: "";
26518 position: absolute;
26519 left: 0px;
26520 bottom: -10px;
26521 width: 0;
26522 height: 0;
26523 border-top: 10px solid #28027F;
26524 border-left: 8px solid transparent;
26525 }
26526 .wpfnl-order-bump__template-style1 .template-preview-wrapper {
26527 padding: 20px;
26528 display: flex;
26529 flex-flow: row wrap;
26530 align-items: flex-start;
26531 }
26532 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-img {
26533 width: 150px;
26534 height: 150px;
26535 background-color: #F2F2F8;
26536 border-radius: 10px;
26537 position: relative;
26538 background-repeat: no-repeat;
26539 background-position: center center;
26540 background-size: cover;
26541 object-fit: cover;
26542 }
26543 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-content {
26544 width: calc(100% - 160px);
26545 padding-left: 20px;
26546 }
26547 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-content .product-options .option-selector {
26548 color: #F34D01;
26549 font-weight: 500;
26550 font-size: 14px;
26551 line-height: 18px;
26552 margin-top: 10px;
26553 }
26554 .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-title {
26555 font-weight: 500;
26556 font-size: 14px;
26557 line-height: 16px;
26558 color: #363B4E;
26559 margin-bottom: 9px;
26560 }
26561 .wpfnl-order-bump__template-style1 .template-preview-wrapper .subtitle {
26562 font-weight: 500;
26563 font-size: 14px;
26564 line-height: 16px;
26565 color: #6E42D3;
26566 margin-bottom: 14px;
26567 }
26568 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description li,
26569 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description strong,
26570 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description span,
26571 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description p,
26572 .wpfnl-order-bump__template-style1 .template-preview-wrapper .description {
26573 font-size: 13px;
26574 line-height: 20px;
26575 color: #7A8B9A;
26576 }
26577 .wpfnl-order-bump__template-style1 .template-preview-wrapper .product-price {
26578 display: inline-block;
26579 font-weight: 500;
26580 font-size: 13px;
26581 line-height: 15px;
26582 color: #EE8134;
26583 margin-left: auto;
26584 margin-top: 10px;
26585 }
26586 .wpfnl-order-bump__template-style1 .template-preview-wrapper .product-price span {
26587 font-size: 13px;
26588 color: #EE8134;
26589 font-weight: 500;
26590 }
26591 .wpfnl-order-bump__template-style1 .template-preview-wrapper .product-price ins {
26592 text-decoration: none;
26593 }
26594 .wpfnl-order-bump__template-style1 .offer-checkbox {
26595 background-color: #6E42D3;
26596 padding: 11px 20px;
26597 border-radius: 0 0 10px 10px;
26598 box-shadow: 0 -1px 2px 0 rgba(190, 190, 215, 0.29);
26599 }
26600 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label {
26601 font-weight: 500;
26602 font-size: 15px;
26603 line-height: 18px;
26604 color: #d9d9d9;
26605 padding-left: 26px;
26606 margin: 0;
26607 border: none;
26608 }
26609 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label:before {
26610 top: 1px;
26611 width: 15px;
26612 height: 15px;
26613 }
26614 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label:after {
26615 left: 4px;
26616 top: 6px;
26617 width: 7px;
26618 height: 3px;
26619 border-bottom-color: #6E42D3;
26620 border-left-color: #6E42D3;
26621 }
26622 .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
26623 background-color: #fff;
26624 border-color: #ffffff;
26625 }
26626
26627 .wpfnl-order-bump__template-style2 {
26628 border-radius: 10px;
26629 position: relative;
26630 margin: 0 0 20px;
26631 background-color: #ffffff;
26632 }
26633 .wpfnl-order-bump__template-style2 .preview-tag {
26634 background: #6E42D3;
26635 border-radius: 0px 3px 3px 0px;
26636 font-weight: 500;
26637 font-size: 12px;
26638 line-height: 14px;
26639 color: #FFFFFF;
26640 text-transform: capitalize;
26641 display: inline-block;
26642 padding: 5px 9px;
26643 position: absolute;
26644 top: -11px;
26645 left: -8px;
26646 }
26647 .wpfnl-order-bump__template-style2 .preview-tag:before {
26648 content: "";
26649 position: absolute;
26650 left: 0px;
26651 bottom: -10px;
26652 width: 0;
26653 height: 0;
26654 border-top: 10px solid #28027F;
26655 border-left: 8px solid transparent;
26656 }
26657 .wpfnl-order-bump__template-style2 .template-preview-wrapper {
26658 padding: 20px 15px;
26659 display: flex;
26660 flex-flow: row wrap;
26661 align-items: flex-start;
26662 border: 1px dashed #6E42D3;
26663 border-radius: 0 0 10px 10px;
26664 border-top: none;
26665 }
26666 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-img {
26667 width: 150px;
26668 height: 150px;
26669 background-color: #F2F2F8;
26670 border-radius: 10px;
26671 position: relative;
26672 background-repeat: no-repeat;
26673 background-position: center center;
26674 background-size: cover;
26675 object-fit: cover;
26676 }
26677 .wpfnl-order-bump__template-style2 .template-preview-wrapper .for-mobile {
26678 display: none;
26679 border-radius: 10px;
26680 }
26681 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-content {
26682 width: calc(100% - 150px);
26683 padding-left: 20px;
26684 }
26685 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-content .product-options .option-selector {
26686 color: #F34D01;
26687 font-weight: 500;
26688 font-size: 14px;
26689 line-height: 18px;
26690 margin-top: 10px;
26691 }
26692 .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-title {
26693 font-weight: 500;
26694 font-size: 14px;
26695 line-height: 16px;
26696 color: #363B4E;
26697 margin-bottom: 9px;
26698 }
26699 .wpfnl-order-bump__template-style2 .template-preview-wrapper .subtitle {
26700 font-weight: 500;
26701 font-size: 14px;
26702 line-height: 16px;
26703 color: #6E42D3;
26704 margin-bottom: 14px;
26705 }
26706 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description li,
26707 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description strong,
26708 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description span,
26709 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description p,
26710 .wpfnl-order-bump__template-style2 .template-preview-wrapper .description {
26711 font-size: 13px;
26712 line-height: 20px;
26713 color: #7A8B9A;
26714 margin: 0;
26715 }
26716 @keyframes moveArrow {
26717 0%, 100% {
26718 transform: translateX(-8px);
26719 opacity: 1;
26720 }
26721 50%, 90% {
26722 transform: translateX(15px);
26723 opacity: 0;
26724 }
26725 99% {
26726 transform: translateX(-8px);
26727 opacity: 0;
26728 }
26729 }
26730 .wpfnl-order-bump__template-style2 .offer-checkbox {
26731 background-color: #6E42D3;
26732 padding: 8px 15px;
26733 border-radius: 10px 10px 0 0;
26734 display: flex;
26735 flex-flow: row wrap;
26736 align-items: flex-start;
26737 border: 1px dashed #6e42d3;
26738 }
26739 .wpfnl-order-bump__template-style2 .offer-checkbox .nav-arrow {
26740 display: inherit;
26741 line-height: normal;
26742 position: relative;
26743 top: 1px;
26744 margin-right: 10px;
26745 animation: moveArrow 1s linear infinite;
26746 }
26747 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox {
26748 line-height: normal;
26749 display: inherit;
26750 width: calc(100% - 130px);
26751 }
26752 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label {
26753 font-weight: 500;
26754 color: #d9d9d9;
26755 padding: 0 0 0 20px;
26756 font-size: 12px;
26757 line-height: 14px;
26758 margin: 0;
26759 border: none;
26760 }
26761 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label:before {
26762 top: 0;
26763 border: none;
26764 width: 14px;
26765 height: 14px;
26766 }
26767 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label:after {
26768 left: 2px;
26769 top: 4px;
26770 width: 7px;
26771 height: 3px;
26772 border-bottom-color: #6E42D3;
26773 border-left-color: #6E42D3;
26774 }
26775 .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
26776 background-color: #fff;
26777 border-color: #ffffff;
26778 }
26779 .wpfnl-order-bump__template-style2 .offer-checkbox .product-price {
26780 display: inline-block;
26781 font-weight: 500;
26782 font-size: 12px;
26783 line-height: 14px;
26784 color: #EE8134;
26785 margin-left: auto;
26786 }
26787 .wpfnl-order-bump__template-style2 .offer-checkbox .product-price span {
26788 font-size: 12px;
26789 color: #EE8134;
26790 font-weight: 500;
26791 line-height: normal;
26792 }
26793 .wpfnl-order-bump__template-style2 .offer-checkbox .product-price ins {
26794 text-decoration: none;
26795 }
26796
26797 .wpfnl-order-bump__template-style3 {
26798 border-radius: 10px;
26799 position: relative;
26800 margin: 20px 0;
26801 }
26802 .wpfnl-order-bump__template-style3 .template-preview-wrapper {
26803 padding: 20px 15px;
26804 border: 1px solid #6E42D3;
26805 border-radius: 10px;
26806 }
26807 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-img {
26808 width: 150px;
26809 height: 150px;
26810 background-color: #F2F2F8;
26811 border-radius: 10px;
26812 position: relative;
26813 background-repeat: no-repeat;
26814 background-position: center center;
26815 background-size: cover;
26816 object-fit: cover;
26817 }
26818 .wpfnl-order-bump__template-style3 .template-preview-wrapper .for-mobile {
26819 display: none;
26820 border-radius: 10px;
26821 }
26822 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-content {
26823 width: 100%;
26824 margin-top: 12px;
26825 }
26826 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-content .product-options .option-selector {
26827 color: #F34D01;
26828 font-weight: 500;
26829 font-size: 14px;
26830 line-height: 18px;
26831 margin-top: 10px;
26832 }
26833 .wpfnl-order-bump__template-style3 .template-preview-wrapper .product-price {
26834 font-weight: 500;
26835 font-size: 18px;
26836 line-height: 1.2;
26837 margin-bottom: 15px;
26838 display: block;
26839 color: #EE8134;
26840 }
26841 .wpfnl-order-bump__template-style3 .template-preview-wrapper .product-price del {
26842 color: #7A8B9A;
26843 }
26844 .wpfnl-order-bump__template-style3 .template-preview-wrapper .product-price ins {
26845 text-decoration: none;
26846 }
26847 .wpfnl-order-bump__template-style3 .template-preview-wrapper .template-title {
26848 font-weight: 500;
26849 margin: 0 0 9px 0;
26850 font-size: 16px;
26851 line-height: 1.3;
26852 color: #363B4E;
26853 }
26854 .wpfnl-order-bump__template-style3 .template-preview-wrapper .subtitle {
26855 font-weight: 500;
26856 font-size: 14px;
26857 line-height: 16px;
26858 color: #6E42D3;
26859 margin-bottom: 14px;
26860 }
26861 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description li,
26862 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description strong,
26863 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description span,
26864 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description p,
26865 .wpfnl-order-bump__template-style3 .template-preview-wrapper .description {
26866 font-size: 13px;
26867 line-height: 20px;
26868 color: #7A8B9A;
26869 margin: 0;
26870 }
26871 .wpfnl-order-bump__template-style3 .offer-checkbox {
26872 display: flex;
26873 flex-flow: row wrap;
26874 align-items: flex-start;
26875 }
26876 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox {
26877 line-height: normal;
26878 display: inherit;
26879 width: calc(100% - 60px);
26880 }
26881 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox .option-selector {
26882 color: #F34D01;
26883 font-weight: 500;
26884 font-size: 14px;
26885 line-height: 18px;
26886 }
26887 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label {
26888 font-weight: 600;
26889 color: #363B4E;
26890 padding-left: 28px;
26891 font-size: 14px;
26892 line-height: 14px;
26893 margin: 0;
26894 }
26895 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label:before {
26896 top: -1px;
26897 border: none;
26898 width: 18px;
26899 height: 18px;
26900 background-color: #c0c0c3;
26901 }
26902 .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label:after {
26903 left: 4px;
26904 top: 4px;
26905 width: 10px;
26906 height: 6px;
26907 border-bottom-color: #ffffff;
26908 border-left-color: #ffffff;
26909 }
26910 .wpfnl-order-bump__template-style3 .offer-checkbox .product-price {
26911 display: inline-block;
26912 font-weight: 500;
26913 font-size: 13px;
26914 line-height: 15px;
26915 color: #EE8134;
26916 margin-left: auto;
26917 }
26918 .wpfnl-order-bump__template-style3 .offer-checkbox .product-price del {
26919 margin-right: 2px;
26920 }
26921
26922 .wpfnl-order-bump__template-style4 {
26923 background-color: #f7f7f7;
26924 border-radius: 10px;
26925 position: relative;
26926 margin: 20px 0;
26927 }
26928 .wpfnl-order-bump__template-style4 .template-preview-wrapper {
26929 padding: 20px;
26930 display: flex;
26931 flex-flow: row wrap;
26932 align-items: center;
26933 }
26934 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-img {
26935 width: 70px;
26936 height: 70px;
26937 background-color: #F2F2F8;
26938 border-radius: 5px;
26939 position: relative;
26940 background-repeat: no-repeat;
26941 background-position: center center;
26942 background-size: cover;
26943 object-fit: cover;
26944 }
26945 .wpfnl-order-bump__template-style4 .template-preview-wrapper .for-mobile {
26946 display: none;
26947 border-radius: 5px;
26948 }
26949 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-content {
26950 width: calc(100% - 340px);
26951 padding-left: 14px;
26952 }
26953 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-title {
26954 font-weight: 500;
26955 font-size: 16px;
26956 line-height: 1.2;
26957 color: #363B4E;
26958 margin: 0 0 7px 0;
26959 max-width: 206px;
26960 }
26961 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating {
26962 color: #363B4E;
26963 font-weight: 600;
26964 display: flex;
26965 align-items: center;
26966 line-height: 1;
26967 font-size: 15px;
26968 }
26969 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating .star-rating {
26970 float: none;
26971 width: 86px;
26972 height: 15px;
26973 }
26974 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating .star-rating::before {
26975 content: "s s s s s";
26976 font-size: 13px;
26977 line-height: 1.2;
26978 color: #EE8134;
26979 }
26980 .wpfnl-order-bump__template-style4 .template-preview-wrapper .rating .star-rating span::before {
26981 content: "S S S S S";
26982 font-size: 13px;
26983 line-height: 1.2;
26984 color: #EE8134;
26985 }
26986 .wpfnl-order-bump__template-style4 .template-preview-wrapper .subtitle {
26987 font-weight: 500;
26988 font-size: 14px;
26989 line-height: 16px;
26990 color: #6E42D3;
26991 margin-bottom: 14px;
26992 }
26993 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description li,
26994 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description strong,
26995 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description span,
26996 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description p,
26997 .wpfnl-order-bump__template-style4 .template-preview-wrapper .description {
26998 font-size: 13px;
26999 line-height: 20px;
27000 color: #7A8B9A;
27001 margin: 0;
27002 }
27003 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-price {
27004 line-height: 1;
27005 padding-left: 20px;
27006 width: 110px;
27007 }
27008 .wpfnl-order-bump__template-style4 .template-preview-wrapper .product-price {
27009 display: inline-block;
27010 font-weight: 500;
27011 font-size: 13px;
27012 line-height: 15px;
27013 color: #EE8134;
27014 margin-left: auto;
27015 }
27016 .wpfnl-order-bump__template-style4 .template-preview-wrapper .product-price span {
27017 font-size: 13px;
27018 line-height: 15px;
27019 color: #EE8134;
27020 font-weight: 500;
27021 }
27022 .wpfnl-order-bump__template-style4 .template-preview-wrapper .product-price ins {
27023 text-decoration: none;
27024 background: transparent;
27025 }
27026 .wpfnl-order-bump__template-style4 .offer-checkbox {
27027 margin-left: auto;
27028 max-width: 160px;
27029 }
27030 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox .option-selector {
27031 color: #6E42D3;
27032 font-size: 14px;
27033 font-weight: 500;
27034 text-align: center;
27035 line-height: 1.2;
27036 }
27037 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox label:before,
27038 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox label:after {
27039 display: none;
27040 }
27041 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox label {
27042 border: 1px solid #6E42D3;
27043 color: #6E42D3;
27044 padding: 10px 15px;
27045 border-radius: 5px;
27046 font-size: 16px;
27047 font-weight: 500;
27048 text-align: center;
27049 line-height: 1.2;
27050 }
27051 .wpfnl-order-bump__template-style4 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label {
27052 color: #fff;
27053 background-color: #6E42D3;
27054 }
27055
27056 @media only screen and (max-width: 575px) {
27057 .wpfnl-order-bump__template-style4 .template-preview-wrapper {
27058 padding: 15px;
27059 display: block;
27060 }
27061 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-img {
27062 width: auto;
27063 height: auto;
27064 background-image: none !important;
27065 }
27066 .wpfnl-order-bump__template-style4 .template-preview-wrapper .for-mobile {
27067 display: block;
27068 margin-bottom: 16px;
27069 }
27070 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-content {
27071 width: 100%;
27072 padding-left: 0;
27073 }
27074 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-title {
27075 max-width: 100%;
27076 }
27077 .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-price {
27078 padding-left: 0;
27079 margin: 12px 0;
27080 width: 100%;
27081 }
27082 .wpfnl-order-bump__template-style4 .offer-checkbox {
27083 margin-left: 0;
27084 max-width: inherit;
27085 }
27086 }
27087 .wpfnl-order-bump__template-style5 {
27088 background-color: transparent;
27089 border: 2px dashed #6E42D3;
27090 border-radius: 10px;
27091 position: relative;
27092 margin: 20px 0;
27093 padding: 20px;
27094 }
27095 .wpfnl-order-bump__template-style5 .template-preview-wrapper {
27096 display: flex;
27097 flex-flow: row-reverse;
27098 }
27099 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-img {
27100 width: 100px;
27101 height: 100px;
27102 background-color: #F2F2F8;
27103 border-radius: 5px;
27104 position: relative;
27105 background-repeat: no-repeat;
27106 background-position: center center;
27107 background-size: cover;
27108 object-fit: cover;
27109 }
27110 .wpfnl-order-bump__template-style5 .template-preview-wrapper .for-mobile {
27111 display: none;
27112 border-radius: 5px;
27113 }
27114 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content {
27115 width: calc(100% - 100px);
27116 padding-right: 14px;
27117 }
27118 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content .product-options .option-selector {
27119 color: #F34D01;
27120 font-weight: 500;
27121 font-size: 14px;
27122 line-height: 18px;
27123 margin-top: 10px;
27124 }
27125 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-title {
27126 font-weight: 500;
27127 font-size: 18px;
27128 line-height: 1.2;
27129 color: #363B4E;
27130 margin: 0 0 7px 0;
27131 }
27132 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating {
27133 color: #363B4E;
27134 font-weight: 600;
27135 display: flex;
27136 align-items: center;
27137 line-height: 1;
27138 font-size: 15px;
27139 }
27140 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating .star-rating {
27141 float: none;
27142 width: 86px;
27143 height: 15px;
27144 }
27145 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating .star-rating::before {
27146 content: "s s s s s";
27147 font-size: 13px;
27148 line-height: 1.2;
27149 color: #EE8134;
27150 }
27151 .wpfnl-order-bump__template-style5 .template-preview-wrapper .rating .star-rating span::before {
27152 content: "S S S S S";
27153 font-size: 13px;
27154 line-height: 1.2;
27155 color: #EE8134;
27156 }
27157 .wpfnl-order-bump__template-style5 .template-preview-wrapper .subtitle {
27158 font-weight: 500;
27159 font-size: 14px;
27160 line-height: 16px;
27161 color: #6E42D3;
27162 margin-bottom: 5px;
27163 }
27164 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description li,
27165 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description strong,
27166 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description span,
27167 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description p,
27168 .wpfnl-order-bump__template-style5 .template-preview-wrapper .description {
27169 font-size: 13px;
27170 line-height: 20px;
27171 color: #7A8B9A;
27172 margin: 0;
27173 }
27174 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-price {
27175 line-height: 1;
27176 margin-bottom: 10px;
27177 width: 100%;
27178 }
27179 .wpfnl-order-bump__template-style5 .template-preview-wrapper .product-price {
27180 display: inline-block;
27181 font-weight: 500;
27182 font-size: 16px;
27183 line-height: 15px;
27184 color: #EE8134;
27185 margin-left: auto;
27186 }
27187 .wpfnl-order-bump__template-style5 .template-preview-wrapper .product-price span {
27188 font-size: 16px;
27189 line-height: 15px;
27190 color: #EE8134;
27191 font-weight: 500;
27192 }
27193 .wpfnl-order-bump__template-style5 .template-preview-wrapper .product-price ins {
27194 text-decoration: none;
27195 background: transparent;
27196 }
27197 .wpfnl-order-bump__template-style5 .offer-checkbox {
27198 line-height: 1.2;
27199 padding: 0 0 16px 0;
27200 border-bottom: 1px solid #ddd;
27201 margin-bottom: 15px;
27202 }
27203 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox {
27204 display: block;
27205 }
27206 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox .option-selector {
27207 color: #6E42D3;
27208 font-weight: 500;
27209 font-size: 14px;
27210 line-height: 1.2;
27211 text-transform: uppercase;
27212 }
27213 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label {
27214 display: block;
27215 color: #6E42D3;
27216 font-size: 14px;
27217 font-weight: 500;
27218 line-height: 1.2;
27219 text-transform: uppercase;
27220 padding-left: 0;
27221 padding-right: 50px;
27222 }
27223 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:before {
27224 left: inherit;
27225 right: 0;
27226 top: -3px;
27227 width: 43px;
27228 height: 20px;
27229 border-radius: 30px;
27230 border-color: #6E42D3;
27231 }
27232 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:after {
27233 left: inherit;
27234 right: 26px;
27235 top: 1px;
27236 width: 14px;
27237 height: 14px;
27238 border-radius: 30px;
27239 transform: none;
27240 border-bottom: none;
27241 border-left: none;
27242 background-color: #6E42D3;
27243 opacity: 1;
27244 visibility: visible;
27245 }
27246 .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::after {
27247 background-color: #fff;
27248 right: 4px;
27249 }
27250
27251 @media only screen and (max-width: 575px) {
27252 .wpfnl-order-bump__template-style5 .template-preview-wrapper {
27253 display: block;
27254 }
27255 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-img {
27256 width: auto;
27257 height: auto;
27258 background-image: none !important;
27259 }
27260 .wpfnl-order-bump__template-style5 .template-preview-wrapper .for-mobile {
27261 display: block;
27262 margin-bottom: 16px;
27263 }
27264 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content {
27265 width: 100%;
27266 padding-left: 0;
27267 }
27268 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-title {
27269 max-width: 100%;
27270 }
27271 .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-price {
27272 padding-left: 0;
27273 margin: 12px 0;
27274 width: 100%;
27275 }
27276 .wpfnl-order-bump__template-style5 .offer-checkbox {
27277 margin-left: 0;
27278 max-width: inherit;
27279 }
27280 }
27281 .wpfnl-order-bump__template-style6 {
27282 background-color: #f7f7f7;
27283 border-radius: 10px;
27284 position: relative;
27285 margin: 20px 0;
27286 }
27287 .wpfnl-order-bump__template-style6 .template-preview-wrapper {
27288 padding: 20px;
27289 display: flex;
27290 flex-flow: row wrap;
27291 align-items: flex-start;
27292 justify-content: space-between;
27293 }
27294 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-img {
27295 width: 150px;
27296 height: 150px;
27297 background-color: #F2F2F8;
27298 border-radius: 10px;
27299 position: relative;
27300 background-repeat: no-repeat;
27301 background-position: center center;
27302 background-size: cover;
27303 object-fit: cover;
27304 }
27305 .wpfnl-order-bump__template-style6 .template-preview-wrapper .for-mobile {
27306 display: none;
27307 border-radius: 10px;
27308 }
27309 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content {
27310 width: calc(100% - 142px);
27311 padding-right: 20px;
27312 }
27313 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content .product-options .option-selector {
27314 color: #F34D01;
27315 font-weight: 500;
27316 font-size: 14px;
27317 line-height: 18px;
27318 margin-bottom: 5px;
27319 }
27320 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-title {
27321 font-weight: 500;
27322 font-size: 14px;
27323 line-height: 16px;
27324 color: #363B4E;
27325 margin: 0 0 9px 0;
27326 }
27327 .wpfnl-order-bump__template-style6 .template-preview-wrapper .subtitle {
27328 font-weight: 500;
27329 font-size: 14px;
27330 line-height: 16px;
27331 color: #6E42D3;
27332 margin-bottom: 14px;
27333 }
27334 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description li,
27335 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description strong,
27336 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description span,
27337 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description p,
27338 .wpfnl-order-bump__template-style6 .template-preview-wrapper .description {
27339 font-size: 13px;
27340 line-height: 20px;
27341 color: #7A8B9A;
27342 margin: 0;
27343 }
27344 .wpfnl-order-bump__template-style6 .template-preview-wrapper .product-price {
27345 display: inline-block;
27346 font-weight: 500;
27347 font-size: 15px;
27348 line-height: 15px;
27349 color: #EE8134;
27350 margin-left: auto;
27351 width: 142px;
27352 text-align: right;
27353 }
27354 .wpfnl-order-bump__template-style6 .template-preview-wrapper .product-price span {
27355 font-size: 15px;
27356 line-height: 15px;
27357 color: #EE8134;
27358 font-weight: 500;
27359 }
27360 .wpfnl-order-bump__template-style6 .template-preview-wrapper .product-price ins {
27361 text-decoration: none;
27362 background: transparent;
27363 }
27364 .wpfnl-order-bump__template-style6 .offer-checkbox {
27365 margin-bottom: 15px;
27366 }
27367 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox {
27368 display: block;
27369 line-height: 1;
27370 }
27371 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox .option-selector {
27372 color: #F34D01;
27373 font-weight: 500;
27374 font-size: 15px;
27375 line-height: 18px;
27376 }
27377 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label {
27378 font-weight: 500;
27379 font-size: 15px;
27380 line-height: 18px;
27381 color: #363B4E;
27382 padding: 0 0 0 26px;
27383 margin: 0;
27384 border: 0;
27385 }
27386 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label:before {
27387 top: 1px;
27388 background: #fff;
27389 }
27390 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label:after {
27391 left: 4px;
27392 top: 6px;
27393 width: 10px;
27394 height: 6px;
27395 border-bottom-color: #ffffff;
27396 border-left-color: #ffffff;
27397 }
27398 .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
27399 background-color: #6E42D3;
27400 border-color: #6E42D3;
27401 }
27402
27403 @media only screen and (max-width: 575px) {
27404 .wpfnl-order-bump__template-style6 .template-preview-wrapper {
27405 padding: 15px;
27406 display: block;
27407 }
27408 .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content {
27409 width: 100%;
27410 padding-right: 0;
27411 }
27412 .wpfnl-order-bump__template-style6 .offer-checkbox {
27413 margin-bottom: 10px;
27414 }
27415 }
27416 .wpfnl-order-bump__template-style7 {
27417 position: relative;
27418 margin-bottom: 20px;
27419 }
27420 .wpfnl-order-bump__template-style7 .template-preview-wrapper {
27421 background: #5a26d1;
27422 border-radius: 10px;
27423 padding: 15px 15px;
27424 }
27425 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content-wrapper {
27426 width: calc(100% - 50px);
27427 padding-right: 15px;
27428 }
27429 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content {
27430 display: flex;
27431 flex-flow: row wrap;
27432 align-items: flex-start;
27433 justify-content: space-between;
27434 }
27435 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .product-options .option-selector {
27436 color: #F34D01;
27437 font-weight: 500;
27438 font-size: 14px;
27439 line-height: 18px;
27440 margin-top: 10px;
27441 }
27442 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .template-title {
27443 color: #fff;
27444 font-size: 18px;
27445 font-weight: 600;
27446 margin-bottom: 5px;
27447 }
27448 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description li,
27449 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description strong,
27450 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description span,
27451 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description p,
27452 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .description {
27453 font-size: 16px;
27454 color: #fff;
27455 line-height: 1.5;
27456 font-weight: 400;
27457 }
27458 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox .option-selector {
27459 color: #F34D01;
27460 font-weight: 500;
27461 font-size: 14px;
27462 line-height: 18px;
27463 margin-top: 5px;
27464 }
27465 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label {
27466 padding: 0;
27467 width: 50px;
27468 height: 50px;
27469 background: #fff;
27470 border-radius: 10px;
27471 display: flex;
27472 align-items: center;
27473 justify-content: center;
27474 }
27475 .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 {
27476 display: none;
27477 }
27478 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label svg {
27479 transition: all 0.3s ease;
27480 }
27481 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox label svg path {
27482 stroke: #ffffff;
27483 }
27484 .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content .wpfnl-checkbox input[type=checkbox]:checked + label svg {
27485 transform: rotate(45deg);
27486 }
27487
27488 .wpfnl-order-bump__template-style8 {
27489 position: relative;
27490 margin-bottom: 20px;
27491 }
27492 .wpfnl-order-bump__template-style8 .template-preview-wrapper {
27493 padding: 15px 15px;
27494 border: 2px dashed #6E42D3;
27495 }
27496 .wpfnl-order-bump__template-style8 .template-preview-wrapper .product-options .option-selector {
27497 color: #F34D01;
27498 font-weight: 500;
27499 font-size: 14px;
27500 line-height: 18px;
27501 margin-bottom: 10px;
27502 }
27503 .wpfnl-order-bump__template-style8 .template-preview-wrapper .template-title {
27504 font-weight: 500;
27505 font-size: 14px;
27506 line-height: 16px;
27507 color: #363B4E;
27508 margin: 0 0 9px 0;
27509 }
27510 .wpfnl-order-bump__template-style8 .template-preview-wrapper .subtitle {
27511 font-weight: 500;
27512 font-size: 14px;
27513 line-height: 16px;
27514 color: #6E42D3;
27515 margin-bottom: 14px;
27516 text-transform: uppercase;
27517 text-decoration: underline;
27518 }
27519 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description li,
27520 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description strong,
27521 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description span,
27522 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description p,
27523 .wpfnl-order-bump__template-style8 .template-preview-wrapper .description {
27524 font-size: 13px;
27525 line-height: 20px;
27526 color: #7A8B9A;
27527 margin: 0;
27528 }
27529 .wpfnl-order-bump__template-style8 .offer-checkbox {
27530 background-color: #6E42D3;
27531 padding: 8px 15px;
27532 display: flex;
27533 flex-flow: row wrap;
27534 align-items: flex-start;
27535 border: none;
27536 margin-bottom: 15px;
27537 }
27538 .wpfnl-order-bump__template-style8 .offer-checkbox .nav-arrow {
27539 display: inherit;
27540 line-height: normal;
27541 position: relative;
27542 top: 2px;
27543 margin-right: 10px;
27544 }
27545 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox {
27546 line-height: normal;
27547 display: inherit;
27548 width: calc(100% - 130px);
27549 }
27550 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox .option-selector {
27551 color: #F34D01;
27552 font-weight: 500;
27553 font-size: 14px;
27554 line-height: 18px;
27555 }
27556 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label {
27557 font-weight: 500;
27558 color: #d9d9d9;
27559 padding: 0 0 0 20px;
27560 font-size: 12px;
27561 line-height: 14px;
27562 margin: 0;
27563 }
27564 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label:before {
27565 top: 2px;
27566 border: none;
27567 width: 12px;
27568 height: 12px;
27569 }
27570 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label:after {
27571 left: 2px;
27572 top: 5px;
27573 width: 8px;
27574 height: 5px;
27575 border-bottom-color: #6E42D3;
27576 border-left-color: #6E42D3;
27577 }
27578 .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
27579 background-color: #fff;
27580 border-color: #ffffff;
27581 }
27582 .wpfnl-order-bump__template-style8 .offer-checkbox .product-price {
27583 display: inline-block;
27584 font-weight: 500;
27585 font-size: 12px;
27586 line-height: 14px;
27587 color: #EE8134;
27588 margin-left: auto;
27589 }
27590 .wpfnl-order-bump__template-style8 .offer-checkbox .product-price span {
27591 font-size: 12px;
27592 line-height: 14px;
27593 color: #EE8134;
27594 font-weight: 500;
27595 line-height: normal;
27596 }
27597 .wpfnl-order-bump__template-style8 .offer-checkbox .product-price ins {
27598 text-decoration: none;
27599 background: transparent;
27600 }
27601
27602 .wpfnl-order-bump__template-style9 {
27603 background-color: #ffffff;
27604 border: 1px solid #E5E8F3;
27605 border-radius: 12px;
27606 position: relative;
27607 margin: 20px 0;
27608 }
27609 .wpfnl-order-bump__template-style9 > .subtitle {
27610 font-weight: 500;
27611 font-size: 14px;
27612 line-height: 16px;
27613 color: #333;
27614 margin-bottom: 0;
27615 background: #ffd921;
27616 text-align: center;
27617 padding: 10px 15px;
27618 border-radius: 10px 10px 0 0;
27619 }
27620 .wpfnl-order-bump__template-style9 .template-preview-wrapper {
27621 padding: 20px;
27622 display: flex;
27623 flex-flow: row wrap;
27624 align-items: center;
27625 }
27626 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-img {
27627 width: 150px;
27628 height: 150px;
27629 background-color: #F2F2F8;
27630 border-radius: 10px;
27631 position: relative;
27632 background-repeat: no-repeat;
27633 background-position: center center;
27634 background-size: cover;
27635 object-fit: cover;
27636 }
27637 .wpfnl-order-bump__template-style9 .template-preview-wrapper .for-mobile {
27638 display: none;
27639 border-radius: 10px;
27640 }
27641 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-content {
27642 width: calc(100% - 160px);
27643 padding-left: 20px;
27644 }
27645 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-title {
27646 font-weight: 500;
27647 font-size: 14px;
27648 line-height: 16px;
27649 color: #363B4E;
27650 margin: 0 0 9px 0;
27651 }
27652 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-price {
27653 display: inline-block;
27654 font-weight: 500;
27655 font-size: 13px;
27656 line-height: 15px;
27657 color: #EE8134;
27658 margin-left: auto;
27659 margin-top: 10px;
27660 }
27661 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-price span {
27662 font-size: 13px;
27663 line-height: 15px;
27664 color: #EE8134;
27665 font-weight: 500;
27666 }
27667 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-price ins {
27668 text-decoration: none;
27669 background: transparent;
27670 }
27671 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-options {
27672 margin: 10px 0 0 0;
27673 }
27674 .wpfnl-order-bump__template-style9 .template-preview-wrapper .product-options .option-selector {
27675 color: #F34D01;
27676 cursor: pointer;
27677 font-size: 14px;
27678 }
27679 .wpfnl-order-bump__template-style9 .description-wrapper {
27680 background: #f7f7f7;
27681 padding: 12px 20px;
27682 margin: 0;
27683 }
27684 .wpfnl-order-bump__template-style9 .description-wrapper .description li,
27685 .wpfnl-order-bump__template-style9 .description-wrapper .description strong,
27686 .wpfnl-order-bump__template-style9 .description-wrapper .description span,
27687 .wpfnl-order-bump__template-style9 .description-wrapper .description p,
27688 .wpfnl-order-bump__template-style9 .description-wrapper .description {
27689 font-size: 13px;
27690 line-height: 20px;
27691 color: #7A8B9A;
27692 margin: 0;
27693 }
27694 .wpfnl-order-bump__template-style9 .offer-checkbox {
27695 background-color: #6E42D3;
27696 padding: 12px 20px 12px;
27697 border-radius: 0 0 10px 10px;
27698 box-shadow: 0 -1px 2px 0 rgba(190, 190, 215, 0.29);
27699 text-align: center;
27700 }
27701 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox {
27702 display: block;
27703 line-height: 1;
27704 }
27705 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox .option-selector {
27706 color: #F34D01;
27707 font-weight: 500;
27708 font-size: 14px;
27709 line-height: 18px;
27710 }
27711 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label {
27712 font-weight: 500;
27713 font-size: 15px;
27714 line-height: 18px;
27715 color: #d9d9d9;
27716 padding: 0 0 0 26px;
27717 margin: 0;
27718 border: 0;
27719 }
27720 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label:before {
27721 top: 1px;
27722 border: none;
27723 }
27724 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label:after {
27725 left: 3px;
27726 top: 5px;
27727 width: 10px;
27728 height: 6px;
27729 border-bottom-color: #6E42D3;
27730 border-left-color: #6E42D3;
27731 }
27732 .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
27733 background-color: #fff;
27734 border-color: #ffffff;
27735 }
27736
27737 @media only screen and (max-width: 460px) {
27738 .wpfnl-order-bump__template-style9 .template-preview-wrapper {
27739 padding: 15px;
27740 display: block;
27741 }
27742 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-img {
27743 width: auto;
27744 height: auto;
27745 background-image: none !important;
27746 }
27747 .wpfnl-order-bump__template-style9 .template-preview-wrapper .for-mobile {
27748 display: block;
27749 border-radius: 10px;
27750 margin-bottom: 16px;
27751 }
27752 .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-content {
27753 width: 100%;
27754 padding-left: 0;
27755 }
27756 .wpfnl-order-bump__template-style9 .offer-checkbox {
27757 padding: 9px 15px 13px;
27758 }
27759 }
27760 .wpfnl-order-bump__template-style10 {
27761 border-radius: 10px;
27762 position: relative;
27763 margin: 20px 0;
27764 background-color: #f7f7f7;
27765 border: 1px solid #E5E8F3;
27766 }
27767 .wpfnl-order-bump__template-style10 .template-preview-wrapper {
27768 padding: 20px 15px;
27769 }
27770 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-content .option-selector {
27771 color: #F34D01;
27772 font-weight: 500;
27773 font-size: 14px;
27774 line-height: 18px;
27775 margin-bottom: 10px;
27776 }
27777 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title-area {
27778 display: flex;
27779 align-items: flex-start;
27780 justify-content: space-between;
27781 margin: 0 0 15px 0;
27782 }
27783 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title {
27784 font-weight: 700;
27785 font-size: 14px;
27786 line-height: 16px;
27787 color: #363B4E;
27788 margin: 0;
27789 width: calc(100% - 60px);
27790 padding-right: 15px;
27791 }
27792 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .nav-arrow {
27793 line-height: 1;
27794 position: relative;
27795 top: -1px;
27796 margin-right: 7px;
27797 }
27798 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .product-price {
27799 display: inline-block;
27800 color: #EE8134;
27801 margin-left: auto;
27802 }
27803 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .product-price span {
27804 color: #EE8134;
27805 font-weight: 700;
27806 }
27807 .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .product-price ins {
27808 text-decoration: none;
27809 background: transparent;
27810 }
27811 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description li,
27812 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description strong,
27813 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description span,
27814 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description p,
27815 .wpfnl-order-bump__template-style10 .template-preview-wrapper .description {
27816 font-size: 13px;
27817 line-height: 20px;
27818 color: #7A8B9A;
27819 margin: 0;
27820 }
27821 .wpfnl-order-bump__template-style10 .offer-checkbox {
27822 display: block;
27823 width: 60px;
27824 text-align: right;
27825 }
27826 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox {
27827 line-height: 1;
27828 display: block;
27829 }
27830 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox label {
27831 font-weight: 700;
27832 color: #6E42D3;
27833 font-size: 16px;
27834 line-height: 14px;
27835 margin: 0;
27836 padding: 0;
27837 }
27838 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox label:after,
27839 .wpfnl-order-bump__template-style10 .offer-checkbox .wpfnl-checkbox label:before {
27840 display: none;
27841 }
27842
27843 .wpfnl-order-bump__template-style11 {
27844 border-radius: 5px;
27845 position: relative;
27846 margin: 20px 0;
27847 background-color: #fff;
27848 border: 1px solid #6E42D3;
27849 }
27850 .wpfnl-order-bump__template-style11 .oderbump-loader {
27851 border-radius: 5px;
27852 }
27853 .wpfnl-order-bump__template-style11 .template-preview-wrapper {
27854 padding: 20px 15px;
27855 }
27856 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-content .option-selector {
27857 color: #F34D01;
27858 font-weight: 500;
27859 font-size: 14px;
27860 line-height: 18px;
27861 margin-bottom: 10px;
27862 }
27863 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area {
27864 display: flex;
27865 align-items: flex-start;
27866 justify-content: space-between;
27867 margin: 0 0 15px 0;
27868 }
27869 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price {
27870 display: inline-block;
27871 color: #EE8134;
27872 margin-left: auto;
27873 width: 120px;
27874 text-align: right;
27875 }
27876 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price span {
27877 color: #EE8134;
27878 font-weight: 700;
27879 }
27880 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price ins {
27881 text-decoration: none;
27882 background: transparent;
27883 }
27884 .wpfnl-order-bump__template-style11 .template-preview-wrapper .description {
27885 font-size: 13px;
27886 line-height: 20px;
27887 color: #7A8B9A;
27888 margin: 0;
27889 }
27890 .wpfnl-order-bump__template-style11 .offer-checkbox {
27891 background-color: transparent;
27892 padding: 0;
27893 border-radius: 0;
27894 box-shadow: none;
27895 width: calc(100% - 120px);
27896 }
27897 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox {
27898 display: block;
27899 line-height: 1;
27900 }
27901 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label {
27902 font-weight: 600;
27903 font-size: 15px;
27904 line-height: 18px;
27905 color: #363B4E;
27906 padding: 0 0 0 26px;
27907 margin: 0;
27908 border: 0;
27909 }
27910 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label:before {
27911 top: 1px;
27912 border-color: #6E42D3;
27913 }
27914 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label:after {
27915 left: 4px;
27916 top: 6px;
27917 width: 10px;
27918 height: 6px;
27919 border-bottom-color: #6E42D3;
27920 border-left-color: #6E42D3;
27921 }
27922 .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
27923 background-color: #fff;
27924 }
27925
27926 @media only screen and (max-width: 460px) {
27927 .wpfnl-order-bump__template-style11 .template-preview-wrapper {
27928 padding: 15px;
27929 display: block;
27930 }
27931 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-img {
27932 width: auto;
27933 height: auto;
27934 background-image: none !important;
27935 }
27936 .wpfnl-order-bump__template-style11 .template-preview-wrapper .for-mobile {
27937 display: block;
27938 border-radius: 10px;
27939 margin-bottom: 16px;
27940 }
27941 .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-content {
27942 width: 100%;
27943 padding-left: 0;
27944 }
27945 .wpfnl-order-bump__template-style11 .offer-checkbox {
27946 padding: 9px 15px 13px;
27947 }
27948 }
27949 .wpfnl-order-bump__template-style12 {
27950 background-color: #ffffff;
27951 border-radius: 12px;
27952 padding: 20px;
27953 position: relative;
27954 border: 1px solid #E5E8F3;
27955 }
27956 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-img {
27957 width: 150px;
27958 height: 150px;
27959 background-color: #F2F2F8;
27960 border-radius: 10px;
27961 position: relative;
27962 background-repeat: no-repeat;
27963 background-position: center center;
27964 background-size: cover;
27965 object-fit: cover;
27966 margin: 0 16px 6px 0;
27967 float: left;
27968 }
27969 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-content .option-selector {
27970 color: #F34D01;
27971 font-weight: 500;
27972 font-size: 14px;
27973 line-height: 18px;
27974 margin-bottom: 10px;
27975 }
27976 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-content::after {
27977 content: "";
27978 display: block;
27979 clear: both;
27980 }
27981 .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-title {
27982 font-weight: 500;
27983 font-size: 14px;
27984 line-height: 16px;
27985 color: #363B4E;
27986 margin-bottom: 0;
27987 margin-left: 5px;
27988 }
27989 .wpfnl-order-bump__template-style12 .template-preview-wrapper .subtitle {
27990 font-weight: 500;
27991 font-size: 14px;
27992 line-height: 16px;
27993 color: #6E42D3;
27994 margin: 0;
27995 display: flex;
27996 flex-flow: row wrap;
27997 }
27998 .wpfnl-order-bump__template-style12 .template-preview-wrapper .description {
27999 font-size: 13px;
28000 line-height: 20px;
28001 color: #7A8B9A;
28002 width: 100%;
28003 margin: 8px 0;
28004 }
28005 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-options {
28006 margin: 8px 0;
28007 }
28008 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-options .option-selector {
28009 color: #F34D01;
28010 cursor: pointer;
28011 font-size: 14px;
28012 }
28013 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-price {
28014 display: inline-block;
28015 font-weight: 500;
28016 font-size: 13px;
28017 line-height: 15px;
28018 color: #EE8134;
28019 }
28020 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-price span {
28021 font-size: 13px;
28022 color: #EE8134;
28023 font-weight: 500;
28024 }
28025 .wpfnl-order-bump__template-style12 .template-preview-wrapper .product-price ins {
28026 text-decoration: none;
28027 }
28028 .wpfnl-order-bump__template-style12 .offer-checkbox {
28029 background-color: #6E42D3;
28030 padding: 11px 20px;
28031 margin-top: 10px;
28032 border-radius: 5px;
28033 }
28034 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox .option-selector {
28035 color: #6E42D3;
28036 font-weight: 500;
28037 font-size: 14px;
28038 line-height: 18px;
28039 }
28040 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label {
28041 font-weight: 500;
28042 font-size: 15px;
28043 line-height: 18px;
28044 color: #d9d9d9;
28045 padding-left: 26px;
28046 margin: 0;
28047 border: none;
28048 }
28049 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label:before {
28050 top: 1px;
28051 width: 15px;
28052 height: 15px;
28053 }
28054 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label:after {
28055 left: 4px;
28056 top: 6px;
28057 width: 7px;
28058 height: 3px;
28059 border-bottom-color: #6E42D3;
28060 border-left-color: #6E42D3;
28061 }
28062 .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
28063 background-color: #fff;
28064 border-color: #ffffff;
28065 }
28066
28067 .wpfnl-order-bump__template-style13 {
28068 background-color: #ffffff;
28069 border-radius: 12px;
28070 position: relative;
28071 border: 2px dashed #E5E8F3;
28072 padding: 20px;
28073 }
28074 .wpfnl-order-bump__template-style13 .subtitle {
28075 font-weight: 500;
28076 font-size: 18px;
28077 line-height: 1.3;
28078 color: #6E42D3;
28079 margin-bottom: 20px;
28080 text-align: center;
28081 }
28082 .wpfnl-order-bump__template-style13 .template-preview-wrapper {
28083 display: flex;
28084 flex-flow: row wrap;
28085 align-items: flex-start;
28086 }
28087 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-content .option-selector {
28088 color: #F34D01;
28089 font-weight: 500;
28090 font-size: 14px;
28091 line-height: 18px;
28092 margin-bottom: 10px;
28093 }
28094 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-img {
28095 width: 150px;
28096 height: 150px;
28097 background-color: #F2F2F8;
28098 border-radius: 10px;
28099 position: relative;
28100 background-repeat: no-repeat;
28101 background-position: center center;
28102 background-size: cover;
28103 object-fit: cover;
28104 }
28105 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-content {
28106 width: calc(100% - 160px);
28107 padding-left: 20px;
28108 }
28109 .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-title {
28110 font-weight: 500;
28111 font-size: 14px;
28112 line-height: 16px;
28113 color: #363B4E;
28114 margin-bottom: 9px;
28115 }
28116 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description li,
28117 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description span,
28118 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description p,
28119 .wpfnl-order-bump__template-style13 .template-preview-wrapper .description {
28120 font-size: 13px;
28121 line-height: 20px;
28122 color: #7A8B9A;
28123 }
28124 .wpfnl-order-bump__template-style13 .template-preview-wrapper .product-options {
28125 margin: 10px 0 0 0;
28126 }
28127 .wpfnl-order-bump__template-style13 .template-preview-wrapper .product-options .option-selector {
28128 color: #F34D01;
28129 cursor: pointer;
28130 font-size: 14px;
28131 }
28132 .wpfnl-order-bump__template-style13 .product-price {
28133 display: inline-block;
28134 font-weight: 500;
28135 font-size: 15px;
28136 line-height: 1.2;
28137 color: #EE8134;
28138 margin-left: 5px;
28139 }
28140 .wpfnl-order-bump__template-style13 .product-price span {
28141 font-size: 15px;
28142 color: #EE8134;
28143 font-weight: 500;
28144 }
28145 .wpfnl-order-bump__template-style13 .product-price ins {
28146 text-decoration: none;
28147 }
28148 .wpfnl-order-bump__template-style13 .offer-checkbox {
28149 background-color: #6E42D3;
28150 padding: 11px 20px;
28151 margin-bottom: 20px;
28152 border-radius: 10px;
28153 }
28154 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox .option-selector {
28155 color: #6E42D3;
28156 font-weight: 500;
28157 font-size: 15px;
28158 line-height: 18px;
28159 display: flex;
28160 align-items: center;
28161 justify-content: space-between;
28162 }
28163 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label {
28164 font-weight: 500;
28165 font-size: 15px;
28166 line-height: 18px;
28167 color: #d9d9d9;
28168 padding-left: 26px;
28169 margin: 0;
28170 border: none;
28171 }
28172 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label:before {
28173 top: 1px;
28174 width: 15px;
28175 height: 15px;
28176 }
28177 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label:after {
28178 left: 4px;
28179 top: 6px;
28180 width: 7px;
28181 height: 3px;
28182 border-bottom-color: #6E42D3;
28183 border-left-color: #6E42D3;
28184 }
28185 .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::before {
28186 background-color: #fff;
28187 border-color: #ffffff;
28188 }
28189
28190 .wpfnl-order-bump__template-style14 {
28191 border-radius: 10px;
28192 position: relative;
28193 margin: 0 0 20px;
28194 background-color: #ffffff;
28195 border: 1px solid #6E42D3;
28196 }
28197 .wpfnl-order-bump__template-style14 .template-preview-wrapper {
28198 padding: 20px 15px;
28199 display: flex;
28200 flex-flow: row wrap;
28201 align-items: flex-start;
28202 border-radius: 0 0 10px 10px;
28203 border-top: none;
28204 }
28205 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-content .option-selector {
28206 color: #F34D01;
28207 font-weight: 500;
28208 font-size: 14px;
28209 line-height: 18px;
28210 margin: 5px 0;
28211 }
28212 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-img {
28213 width: 150px;
28214 height: 150px;
28215 background-color: #F2F2F8;
28216 border-radius: 10px;
28217 position: relative;
28218 background-repeat: no-repeat;
28219 background-position: center center;
28220 background-size: cover;
28221 object-fit: cover;
28222 }
28223 .wpfnl-order-bump__template-style14 .template-preview-wrapper .for-mobile {
28224 display: none;
28225 border-radius: 10px;
28226 }
28227 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-content {
28228 width: calc(100% - 150px);
28229 padding-left: 20px;
28230 }
28231 .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-title {
28232 font-weight: 500;
28233 font-size: 14px;
28234 line-height: 16px;
28235 color: #363B4E;
28236 margin-bottom: 9px;
28237 }
28238 .wpfnl-order-bump__template-style14 .template-preview-wrapper .subtitle {
28239 font-weight: 500;
28240 font-size: 14px;
28241 line-height: 16px;
28242 color: #6E42D3;
28243 }
28244 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description li,
28245 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description span,
28246 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description p,
28247 .wpfnl-order-bump__template-style14 .template-preview-wrapper .description {
28248 font-size: 13px;
28249 line-height: 20px;
28250 color: #7A8B9A;
28251 margin: 0;
28252 }
28253 .wpfnl-order-bump__template-style14 .template-preview-wrapper .product-price {
28254 font-weight: 500;
28255 font-size: 12px;
28256 line-height: 14px;
28257 color: #EE8134;
28258 margin-left: auto;
28259 text-align: right;
28260 margin-top: 15px;
28261 display: block;
28262 }
28263 .wpfnl-order-bump__template-style14 .template-preview-wrapper .product-price span {
28264 font-size: 12px;
28265 color: #EE8134;
28266 font-weight: 500;
28267 line-height: normal;
28268 }
28269 .wpfnl-order-bump__template-style14 .template-preview-wrapper .product-price ins {
28270 text-decoration: none;
28271 }
28272 .wpfnl-order-bump__template-style14 .offer-checkbox {
28273 padding: 12px 15px 9px;
28274 border-radius: 7px 7px 0 0;
28275 display: flex;
28276 flex-flow: row wrap;
28277 align-items: flex-start;
28278 border-bottom: 1px solid #6e42d3;
28279 }
28280 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox {
28281 line-height: normal;
28282 display: inherit;
28283 width: calc(100% - 130px);
28284 }
28285 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox .option-selector {
28286 color: #6E42D3;
28287 font-weight: 500;
28288 font-size: 15px;
28289 line-height: 1.2x;
28290 }
28291 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label {
28292 font-weight: 500;
28293 color: #363B4E;
28294 padding: 0 0 0 26px;
28295 font-size: 12px;
28296 line-height: 14px;
28297 margin: 0;
28298 border: none;
28299 }
28300 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label:before {
28301 border: none;
28302 width: 18px;
28303 height: 18px;
28304 background-color: #cacacb;
28305 }
28306 .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label:after {
28307 left: 4px;
28308 top: 2px;
28309 }
28310
28311 .wpfnl-modal-wrapper .product-search {
28312 border: 1px solid #6E42D3;
28313 background: #f6f4fb;
28314 border-radius: 10px;
28315 height: 40px;
28316 width: 250px;
28317 position: relative;
28318 margin-left: 10px;
28319 display: flex;
28320 }
28321 .wpfnl-modal-wrapper .product-search .wpfnl-product-search {
28322 display: none;
28323 }
28324 .wpfnl-modal-wrapper .product-search .search-icon {
28325 position: absolute;
28326 left: 10px;
28327 top: 10px;
28328 }
28329 .wpfnl-modal-wrapper .product-search .search-icon path,
28330 .wpfnl-modal-wrapper .product-search .search-icon circle {
28331 stroke: #716395;
28332 }
28333 .wpfnl-modal-wrapper .product-search .select2.select2-container.select2-container--default {
28334 width: 100% !important;
28335 }
28336 .wpfnl-modal-wrapper .product-search .single-product {
28337 display: flex;
28338 position: relative;
28339 }
28340 .wpfnl-modal-wrapper .product-search .single-product svg {
28341 position: absolute;
28342 left: 10px;
28343 top: 10px;
28344 }
28345 .wpfnl-modal-wrapper .product-search .select2-selection__rendered {
28346 padding: 10px 10px 10px 35px;
28347 width: 100%;
28348 border-radius: 10px;
28349 white-space: pre;
28350 overflow: hidden;
28351 text-overflow: ellipsis;
28352 display: block;
28353 -webkit-line-clamp: 3;
28354 -webkit-box-orient: vertical;
28355 line-height: normal;
28356 color: #716395;
28357 }
28358 .wpfnl-modal-wrapper .product-search .select2-selection__placeholder {
28359 color: #716395;
28360 }
28361 .wpfnl-modal-wrapper .product-search .select2-container--default .select2-selection--single {
28362 background-color: transparent;
28363 border: none;
28364 height: auto;
28365 }
28366 .wpfnl-modal-wrapper .product-search .select2-selection__clear {
28367 padding: 0 3px;
28368 cursor: pointer;
28369 }
28370 .wpfnl-modal-wrapper .product-search .select2-container.select2-container--default.select2-container--open {
28371 background: transparent;
28372 border-radius: 0;
28373 border: none;
28374 z-index: 2;
28375 }
28376 .wpfnl-modal-wrapper .product-search .select2-container--default .select2-selection--single .select2-selection__arrow {
28377 display: none;
28378 }
28379
28380 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper {
28381 max-width: 540px;
28382 max-height: 250px;
28383 padding: 0;
28384 }
28385 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-close .wpfnl-modal-close-btn {
28386 top: -10px;
28387 right: -10px;
28388 }
28389 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents {
28390 display: flex;
28391 flex-direction: column;
28392 justify-content: space-between;
28393 height: 100%;
28394 }
28395 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper {
28396 padding: 24px 30px;
28397 }
28398 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .title {
28399 color: #363B4E;
28400 font-size: 18px;
28401 font-style: normal;
28402 font-weight: 500;
28403 line-height: normal;
28404 margin-bottom: 30px;
28405 }
28406 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper p {
28407 color: #2D3149;
28408 font-size: 15px;
28409 font-style: normal;
28410 font-weight: 500;
28411 line-height: normal;
28412 margin-bottom: 6px;
28413 }
28414 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search {
28415 margin: 0;
28416 width: 100%;
28417 border-radius: 8px;
28418 border: 1px solid #DFE1E6;
28419 background: transparent;
28420 }
28421 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search .search-icon circle,
28422 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-body-wrapper .product-search .search-icon path {
28423 stroke: #A7A8B3;
28424 }
28425 .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 {
28426 color: #7A8B9A;
28427 font-size: 14px;
28428 font-style: normal;
28429 font-weight: 300;
28430 line-height: normal;
28431 letter-spacing: -0.14px;
28432 margin-right: auto;
28433 padding-top: 3px;
28434 }
28435 .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 {
28436 padding: 0;
28437 padding-top: 8px;
28438 padding-left: 35px;
28439 display: flex;
28440 flex-direction: row-reverse;
28441 justify-content: space-between;
28442 padding-right: 10px;
28443 align-items: center;
28444 }
28445 .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 {
28446 margin-top: 3px;
28447 }
28448 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper {
28449 border-top: 1px solid #DFE1E6;
28450 display: flex;
28451 justify-content: flex-end;
28452 gap: 12px;
28453 padding: 20px 30px;
28454 }
28455 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button {
28456 min-width: auto;
28457 display: flex;
28458 justify-content: center;
28459 align-items: center;
28460 }
28461 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button.outline {
28462 background: transparent;
28463 color: #3C3F47;
28464 border-radius: 10px;
28465 border: 1px solid #DFE1E6;
28466 min-width: auto;
28467 }
28468 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button.outline:hover {
28469 background: #6E42D3;
28470 color: #FFF;
28471 border-color: transparent;
28472 }
28473 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button:disabled {
28474 opacity: 0.5;
28475 pointer-events: none;
28476 cursor: not-allowed;
28477 }
28478 .wpfnl-modal-overlay.wpfnl-product-add-modal .wpfnl-modal-wrapper .wpfnl-modal-contents .wpfnl-modal-footer-wrapper button .wpfnl-loader {
28479 position: static;
28480 width: 15px;
28481 height: 15px;
28482 background: transparent;
28483 }
28484
28485 .wpfnl .v-tour .v-step {
28486 border-radius: 10px;
28487 background: #6E42D3;
28488 box-shadow: 0px 2px 15px 0px rgba(22, 28, 32, 0.08);
28489 padding: 0;
28490 z-index: 999999999999 !important;
28491 }
28492 .wpfnl .v-tour .v-step .v-step__header {
28493 background: #6E42D3;
28494 border-radius: 10px 10px 0 0;
28495 padding: 16px 18px 0px;
28496 margin: 0;
28497 }
28498 .wpfnl .v-tour .v-step .v-step__header div {
28499 color: #FFF;
28500 font-size: 14px;
28501 font-style: normal;
28502 font-weight: 500;
28503 line-height: normal;
28504 text-align: left;
28505 }
28506 .wpfnl .v-tour .v-step .v-step__content {
28507 padding: 8px 18px 16px;
28508 border-bottom: 1px solid #8860E3;
28509 margin: 0;
28510 }
28511 .wpfnl .v-tour .v-step .v-step__content div {
28512 color: rgba(255, 255, 255, 0.9);
28513 font-size: 13px;
28514 font-style: normal;
28515 font-weight: 400;
28516 line-height: 1.53;
28517 text-align: left;
28518 }
28519 .wpfnl .v-tour .v-step .v-step__buttons {
28520 padding: 13px 16px;
28521 display: flex;
28522 align-items: center;
28523 justify-content: flex-end;
28524 gap: 8px;
28525 }
28526 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button {
28527 font-size: 13px;
28528 font-style: normal;
28529 font-weight: 500;
28530 line-height: 1.07;
28531 letter-spacing: 0.2px;
28532 border-radius: 8px;
28533 height: auto;
28534 width: auto;
28535 margin: 0;
28536 padding: 9px 14px;
28537 }
28538 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-skip {
28539 color: #FFF;
28540 border: 1px solid #FFF;
28541 background: transparent;
28542 }
28543 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-skip:hover {
28544 color: #6E42D3;
28545 background: #FFF;
28546 border-color: #6E42D3;
28547 }
28548 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-next {
28549 color: #6E42D3;
28550 background: #FFF;
28551 padding: 10px 14px;
28552 }
28553 .wpfnl .v-tour .v-step .v-step__buttons .v-step__button.v-step__button-next:hover {
28554 color: #FFF;
28555 background: #6E42D3;
28556 }
28557 .wpfnl .v-tour .v-step .v-step__arrow::before {
28558 background: #6E42D3;
28559 }
28560 .wpfnl .wpfnl-guided-tour.has-overlay::before {
28561 content: "";
28562 position: fixed;
28563 left: 0;
28564 top: 0;
28565 width: 100%;
28566 height: 100%;
28567 background: rgba(29, 29, 29, 0.4901960784);
28568 z-index: 3;
28569 pointer-events: none;
28570 -webkit-mask-image: var(--mask);
28571 mask-image: var(--mask);
28572 }
28573
28574 .wpfnl-copy-notice {
28575 display: flex;
28576 align-items: center;
28577 justify-content: space-between;
28578 border-radius: 10px;
28579 background: #2B0C45;
28580 box-shadow: 0px 10px 20px 0px rgba(176, 174, 186, 0.6);
28581 max-width: 670px;
28582 margin: auto;
28583 padding: 16px 20px;
28584 position: absolute;
28585 width: 100%;
28586 border: none;
28587 bottom: 21px;
28588 left: 50%;
28589 transform: translateX(-50%);
28590 }
28591 .wpfnl-copy-notice .wpfnl-notice-body-text {
28592 display: flex;
28593 gap: 10px;
28594 }
28595 .wpfnl-copy-notice .wpfnl-notice-body-text .wpfnl-notice-icon svg path {
28596 fill: #FFF;
28597 }
28598 .wpfnl-copy-notice .wpfnl-notice-body-text .wpfnl-notice-text {
28599 color: #FFF;
28600 }
28601 .wpfnl-copy-notice .wpfnl-button-wrapper button {
28602 background: transparent;
28603 border: none;
28604 outline: none;
28605 cursor: pointer;
28606 }
28607 .wpfnl-copy-notice .wpfnl-button-wrapper button.wpfnl-notice-undo {
28608 color: #EC813F;
28609 margin-right: 26px;
28610 }
28611
28612 .wpfnl .wpfnl-btn.view-analytics-stat {
28613 background-color: transparent;
28614 border: 1px solid #EBEDF0;
28615 padding: 8px 10px;
28616 cursor: pointer;
28617 text-align: center;
28618 border-radius: 10px;
28619 text-transform: capitalize;
28620 }
28621 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher {
28622 display: flex;
28623 align-items: center;
28624 gap: 9px;
28625 color: #2D3149;
28626 font-weight: 500;
28627 }
28628 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher label {
28629 width: 30px;
28630 height: 18px;
28631 }
28632 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher label::after {
28633 width: 12px;
28634 height: 12px;
28635 top: 3px;
28636 }
28637 .wpfnl .wpfnl-btn.view-analytics-stat .wpfnl-switcher input[type=checkbox]:checked + label::after {
28638 left: 3px;
28639 margin-left: 12px;
28640 }
28641 .wpfnl .automation-step-name .step-stats {
28642 position: relative;
28643 display: flex;
28644 flex-flow: row wrap;
28645 align-items: center;
28646 justify-content: center;
28647 gap: 10px;
28648 padding-top: 16px;
28649 margin-top: 15px;
28650 }
28651 .wpfnl .automation-step-name .step-stats::before {
28652 content: "";
28653 position: absolute;
28654 top: 0;
28655 left: -24px;
28656 width: calc(100% + 48px);
28657 height: 1px;
28658 background: #F2F2F2;
28659 }
28660 .wpfnl .automation-step-name .step-stats .single-stats {
28661 border: 1px solid #F2F2F2;
28662 border-radius: 6px;
28663 font-size: 14px;
28664 line-height: 1;
28665 color: #2D3149;
28666 min-width: 62px;
28667 text-align: center;
28668 padding: 6px 4px;
28669 display: flex;
28670 align-items: center;
28671 justify-content: center;
28672 gap: 4px;
28673 }
28674 .wpfnl .automation-step-name .step-stats .single-stats.converion-rate {
28675 color: #12B76A;
28676 }
28677 .wpfnl .view-analytics-btn {
28678 background-color: transparent;
28679 border: 1px solid #EBEDF0;
28680 padding: 9px 10px;
28681 cursor: pointer;
28682 text-align: center;
28683 border-radius: 10px;
28684 text-transform: capitalize;
28685 display: flex;
28686 align-items: center;
28687 gap: 10px;
28688 font-weight: 500;
28689 }
28690 .wpfnl .view-analytics-btn:hover {
28691 background: #6E42D3;
28692 color: #FFF;
28693 }
28694 .wpfnl .view-analytics-btn:hover svg path {
28695 fill: #FFF;
28696 }
28697 .wpfnl .wpfnl-automation-reports-wrapper {
28698 position: fixed;
28699 width: 100vw;
28700 height: 100vh;
28701 background: #f0f0f1;
28702 top: 32px;
28703 z-index: 999;
28704 padding: 40px 60px;
28705 display: flex;
28706 flex-direction: column;
28707 align-items: center;
28708 }
28709 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header {
28710 width: 90%;
28711 max-width: 1180px;
28712 display: flex;
28713 align-items: center;
28714 justify-content: space-between;
28715 }
28716 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-left .back-to-flow {
28717 font-weight: 500;
28718 font-size: 14px;
28719 line-height: 14px;
28720 color: #A4A8B5;
28721 text-transform: capitalize;
28722 margin-bottom: 7px;
28723 border: none;
28724 background: none;
28725 display: flex;
28726 align-items: center;
28727 gap: 5px;
28728 cursor: pointer;
28729 }
28730 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-left .back-to-flow h1 {
28731 font-weight: 600;
28732 font-size: 22px;
28733 line-height: 1;
28734 color: #2d3149;
28735 }
28736 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right {
28737 display: flex;
28738 }
28739 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox {
28740 position: relative;
28741 }
28742 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .drop-down-button {
28743 position: relative;
28744 border: 1px solid #dee1e8;
28745 border-radius: 6px;
28746 padding: 10px 31px 10px 12px;
28747 background-color: transparent;
28748 text-align: left;
28749 font-weight: 600;
28750 font-size: 14px;
28751 line-height: 1;
28752 color: #2d3149;
28753 width: 105px;
28754 text-transform: capitalize;
28755 cursor: pointer;
28756 }
28757 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .drop-down-button::before {
28758 content: " ";
28759 display: block;
28760 position: absolute;
28761 border-style: solid;
28762 border-color: #a4a8b5;
28763 border-width: 0px 2px 2px 0px;
28764 transform: rotate(45deg) translateY(-50%);
28765 transform-origin: center;
28766 transition: all 0.3s ease;
28767 height: 6px;
28768 right: 17px;
28769 top: calc(50% - 3px);
28770 width: 6px;
28771 cursor: pointer;
28772 }
28773 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .drop-down-button.show::before {
28774 transform: rotate(225deg) translateY(-50%);
28775 }
28776 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown {
28777 top: 40px;
28778 width: 130px;
28779 }
28780 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li {
28781 padding: 10px 15px;
28782 cursor: pointer;
28783 color: #1d2327;
28784 }
28785 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li:first-child {
28786 border-radius: 10px 10px 0 0;
28787 }
28788 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li:last-child {
28789 border-radius: 0 0 10px 10px;
28790 }
28791 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown li:hover {
28792 background-color: #f6f8fa;
28793 }
28794 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown.show {
28795 visibility: visible;
28796 opacity: 1;
28797 }
28798 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-page__header-right .selectbox .wpfnl-dropdown::after {
28799 content: none;
28800 }
28801 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-refresh-btn {
28802 background: transparent;
28803 border: 1px solid #dee1e8;
28804 margin-right: 12px;
28805 margin-left: 0;
28806 border-radius: 6px;
28807 height: 36px;
28808 width: 36px;
28809 padding: 1px 0 0 1px;
28810 display: flex;
28811 align-items: center;
28812 justify-content: center;
28813 cursor: pointer;
28814 }
28815 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__header .wpfnl-refresh-btn.rotate svg {
28816 animation: spin 0.7s linear infinite;
28817 }
28818 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body {
28819 width: 90%;
28820 max-width: 1180px;
28821 }
28822 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report {
28823 background: #ffffff;
28824 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3019607843);
28825 border-radius: 10px;
28826 padding: 24px 24px 32px;
28827 position: relative;
28828 margin-top: 30px;
28829 }
28830 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body {
28831 display: grid;
28832 grid-template-columns: repeat(3, 1fr);
28833 gap: 15px;
28834 margin-bottom: 20px;
28835 }
28836 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .box-header {
28837 margin-bottom: 15px;
28838 grid-column: span 3;
28839 }
28840 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .box-header .header-title {
28841 font-weight: 600;
28842 font-size: 18px;
28843 line-height: 1;
28844 color: #2d3149;
28845 text-transform: capitalize;
28846 }
28847 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report {
28848 border: 1px solid #E9EAEE;
28849 border-radius: 10px;
28850 padding: 20px;
28851 display: flex;
28852 flex-flow: row wrap;
28853 align-items: center;
28854 justify-content: space-between;
28855 }
28856 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .report {
28857 width: calc(100% - 44px);
28858 }
28859 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .report .report-title {
28860 font-weight: 400;
28861 font-size: 14px;
28862 line-height: 1.3;
28863 color: #9398A5;
28864 text-transform: capitalize;
28865 }
28866 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .report h6 {
28867 font-weight: 600;
28868 font-size: 20px;
28869 line-height: 1;
28870 color: #2D3149;
28871 margin-top: 5px;
28872 }
28873 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .wpfnl-overall-report .wpfnl-template-overall-report-body .single-report .icon {
28874 width: 44px;
28875 height: 44px;
28876 background: #FFFFFF;
28877 border: 1px solid #E4E6EB;
28878 display: flex;
28879 align-items: center;
28880 justify-content: center;
28881 border-radius: 100%;
28882 }
28883 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics {
28884 background: #ffffff;
28885 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3019607843);
28886 border-radius: 10px;
28887 padding: 24px 24px 32px;
28888 position: relative;
28889 margin-top: 20px;
28890 }
28891 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header {
28892 display: flex;
28893 flex-flow: row wrap;
28894 align-items: center;
28895 justify-content: space-between;
28896 margin-bottom: 30px;
28897 }
28898 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .header-title {
28899 font-weight: 500;
28900 font-size: 18px;
28901 line-height: 1;
28902 color: #2d3149;
28903 text-transform: capitalize;
28904 }
28905 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator {
28906 display: flex;
28907 align-items: center;
28908 justify-content: center;
28909 }
28910 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span {
28911 font-weight: 400;
28912 font-size: 14px;
28913 line-height: 1.3;
28914 color: #9398a5;
28915 position: relative;
28916 display: flex;
28917 align-items: center;
28918 }
28919 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span::before {
28920 content: "";
28921 width: 10px;
28922 height: 10px;
28923 background: #02c4fb;
28924 display: inline-block;
28925 border-radius: 50px;
28926 margin-right: 10px;
28927 }
28928 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span.opened {
28929 margin-right: 30px;
28930 }
28931 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .box-header .stat-indicator span.opened::before {
28932 background: #573BFF;
28933 }
28934 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .performance-wrapper {
28935 position: relative;
28936 }
28937 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label {
28938 position: absolute;
28939 top: 3px;
28940 left: 0;
28941 height: 100%;
28942 width: 100%;
28943 display: flex;
28944 flex-flow: column;
28945 justify-content: space-between;
28946 }
28947 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label .single-label {
28948 font-size: 12px;
28949 line-height: 1.2;
28950 color: #9398A5;
28951 display: block;
28952 position: relative;
28953 }
28954 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label .single-label:before {
28955 content: "";
28956 position: absolute;
28957 left: 50px;
28958 top: 7px;
28959 width: calc(100% - 50px);
28960 height: 1px;
28961 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");
28962 }
28963 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .chart-percent-label .single-label span {
28964 width: 33px;
28965 display: block;
28966 text-align: right;
28967 }
28968 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper {
28969 height: 266px;
28970 display: flex;
28971 flex-flow: row wrap;
28972 align-items: flex-end;
28973 justify-content: space-between;
28974 padding: 10px 15px 3px 60px;
28975 gap: 15px;
28976 position: relative;
28977 z-index: 1;
28978 }
28979 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly {
28980 gap: 0px;
28981 padding: 10px 15px 3px 45px;
28982 }
28983 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly .single-bar {
28984 width: 8px;
28985 }
28986 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly .single-performance:before {
28987 left: -4px;
28988 width: calc(100% + 4px);
28989 }
28990 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-chart-wrapper.monthly .bar-title {
28991 font-size: 10px;
28992 transform: rotate(-55deg) translate(-10px, -10px);
28993 transform-origin: left;
28994 bottom: -32px;
28995 }
28996 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance {
28997 height: 100%;
28998 display: flex;
28999 flex-flow: column;
29000 justify-content: flex-end;
29001 position: relative;
29002 }
29003 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:before {
29004 content: "";
29005 position: absolute;
29006 bottom: 0;
29007 left: -7px;
29008 width: calc(100% + 10px);
29009 height: 100%;
29010 z-index: 0;
29011 background: #F6F8FA;
29012 border-right: 2px dashed #E4E7EC;
29013 border-left: 2px dashed #E4E7EC;
29014 opacity: 0;
29015 visibility: hidden;
29016 }
29017 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover:before {
29018 opacity: 1;
29019 visibility: visible;
29020 }
29021 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar {
29022 width: 30px;
29023 height: 100%;
29024 display: flex;
29025 gap: 3px;
29026 }
29027 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item {
29028 width: 50%;
29029 display: block;
29030 margin-top: auto;
29031 }
29032 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item.open {
29033 background-color: #573BFF;
29034 border-radius: 6px 6px 0 0;
29035 }
29036 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item.clicked {
29037 background-color: #02C4FB;
29038 border-radius: 6px 6px 0 0;
29039 }
29040 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-item.send {
29041 background-color: #12B76A;
29042 }
29043 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-bar .bar-title {
29044 font-size: 12px;
29045 line-height: 1.2;
29046 color: #9398A5;
29047 position: absolute;
29048 bottom: -20px;
29049 left: 50%;
29050 transform: translateX(-50%);
29051 white-space: nowrap;
29052 transition: all 0.3s ease;
29053 }
29054 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip {
29055 background: #FFFFFF;
29056 border: 1px solid #F0F1F4;
29057 box-shadow: 0px 2px 15px rgba(22, 28, 32, 0.0784313725);
29058 border-radius: 4px;
29059 padding: 15px;
29060 width: 180px;
29061 position: absolute;
29062 bottom: calc(100% + 16px);
29063 left: 50%;
29064 transform: translateX(-50%);
29065 z-index: 9;
29066 opacity: 0;
29067 visibility: hidden;
29068 transition: all 0.3s ease;
29069 }
29070 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip:before {
29071 content: "";
29072 position: absolute;
29073 left: 50%;
29074 bottom: -6px;
29075 width: 12px;
29076 height: 12px;
29077 background: white;
29078 transform: rotate(45deg);
29079 margin-left: -6px;
29080 }
29081 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item {
29082 font-size: 12px;
29083 line-height: 1;
29084 color: #9398A5;
29085 margin-bottom: 10px;
29086 position: relative;
29087 display: flex;
29088 align-items: center;
29089 justify-content: space-between;
29090 padding-left: 17px;
29091 }
29092 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item:last-child {
29093 margin-bottom: 0;
29094 }
29095 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item:before {
29096 content: "";
29097 position: absolute;
29098 left: 0;
29099 top: 4px;
29100 width: 8px;
29101 height: 8px;
29102 background: #12B76A;
29103 border-radius: 100%;
29104 }
29105 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item small {
29106 margin-left: 7px;
29107 display: inline-block;
29108 }
29109 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.open:before {
29110 background: #573BFF;
29111 }
29112 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.open small {
29113 color: #12B76A;
29114 }
29115 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.click:before {
29116 background: #02C4FB;
29117 }
29118 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.click small {
29119 color: #F7900A;
29120 }
29121 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item.email small {
29122 color: #02C4FB;
29123 }
29124 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .bar-tooltip .item-value {
29125 color: #2D3149;
29126 }
29127 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover .single-bar {
29128 z-index: 1;
29129 }
29130 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover .single-bar .bar-tooltip {
29131 opacity: 1;
29132 visibility: visible;
29133 }
29134 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:hover .single-bar .bar-title {
29135 opacity: 1;
29136 visibility: visible;
29137 }
29138 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:last-child .bar-tooltip {
29139 left: inherit;
29140 right: -34px;
29141 transform: translateX(0);
29142 }
29143 .wpfnl .wpfnl-automation-reports-wrapper .wpfnl-page__body .performance-analytics .single-performance:last-child .bar-tooltip:before {
29144 left: inherit;
29145 right: 42px;
29146 }
29147
29148 @keyframes spin {
29149 0% {
29150 transform: rotate(0deg);
29151 }
29152 100% {
29153 transform: rotate(360deg);
29154 }
29155 }
29156 .shimmer-line {
29157 height: 20px;
29158 margin-top: 20px;
29159 background: #777;
29160 }
29161
29162 .shimmer-line-br {
29163 border-radius: 8px;
29164 }
29165
29166 .shimmer-line-full {
29167 width: 100%;
29168 }
29169
29170 .shimmer-line-80 {
29171 width: 80%;
29172 }
29173
29174 .shimmer-line-60 {
29175 width: 60%;
29176 }
29177
29178 .shimmer-line-40 {
29179 width: 40%;
29180 }
29181
29182 .shimmer-line-20 {
29183 width: 20%;
29184 }
29185
29186 .shimmer-line-10 {
29187 width: 10%;
29188 }
29189
29190 .shimmer-circle {
29191 background: #777;
29192 border-radius: 50%;
29193 }
29194
29195 .shimmer-circle-lg {
29196 height: 129px;
29197 width: 129px;
29198 }
29199
29200 .shimmer-circle-md {
29201 height: 65px;
29202 width: 65px;
29203 }
29204
29205 .shimmer-circle-sm {
29206 height: 33px;
29207 width: 33px;
29208 }
29209
29210 .shimmer-circle-x-sm {
29211 height: 17px;
29212 width: 17px;
29213 }
29214
29215 .shimmer-wrapper, .shimmer-wrapper-center {
29216 width: 100%;
29217 height: 100%;
29218 padding: 10px;
29219 animation: shimmer-full-view 0.5s forwards cubic-bezier(0.25, 0.46, 0.45, 0.94);
29220 }
29221
29222 .shimmer-wrapper-center {
29223 display: flex;
29224 flex-direction: column;
29225 gap: 10px;
29226 justify-content: center;
29227 align-items: center;
29228 }
29229
29230 @keyframes shimmer-full-view {
29231 0% {
29232 background-position: -1000px 0;
29233 }
29234 100% {
29235 background-position: 1000px 0;
29236 }
29237 }
29238 @keyframes shimmer-animation {
29239 0% {
29240 background-position: -1000px 0;
29241 }
29242 100% {
29243 background-position: 1000px 0;
29244 }
29245 }
29246 .shimmer-animate {
29247 animation: shimmer-animation 4s infinite linear;
29248 background: linear-gradient(to right, #eff1f3 4%, #e2e2e2 25%, #eff1f3 36%);
29249 background-size: 1000px 100%;
29250 }
29251
29252 .wpfunnels_page_wpf_feature_comparison .updated, .wpfunnels_page_wpf_feature_comparison .notice {
29253 display: none !important;
29254 }
29255
29256 .wpfunnels_page_wpf_feature_comparison #wpcontent {
29257 background: #F6F5FA;
29258 padding-left: 0;
29259 }
29260 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper {
29261 padding: 0 50px;
29262 background: #F6F5FA;
29263 }
29264 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .free-vs-pro-menu {
29265 background: #FFFFFF;
29266 box-shadow: 0px 1px 1px rgba(182, 185, 191, 0.3);
29267 border-radius: 0 0 10px 10px;
29268 padding: 28px 20px;
29269 margin-bottom: 20px;
29270 }
29271 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .free-vs-pro-menu .title {
29272 text-align: center;
29273 font-weight: 600;
29274 font-size: 24px;
29275 color: #2D3149;
29276 margin: 0;
29277 }
29278 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .free-vs-pro-menu .free-pro-description {
29279 text-align: center;
29280 color: #7A8B9A;
29281 font-size: 14px;
29282 margin: 5px 0 0 0;
29283 }
29284 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table {
29285 width: 100%;
29286 border-collapse: collapse;
29287 text-align: center;
29288 }
29289 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead {
29290 background: transparent;
29291 position: sticky;
29292 top: 32px;
29293 z-index: 2;
29294 }
29295 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead::after {
29296 content: "";
29297 display: block;
29298 height: 5px;
29299 }
29300 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th {
29301 border: none;
29302 padding: 16px 8px;
29303 font-weight: 600;
29304 background: #FFFFFF;
29305 }
29306 .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 {
29307 padding: 16px 16px 16px 8px;
29308 }
29309 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.regular:last-child {
29310 border-radius: 0 20px 0 0;
29311 }
29312 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.feature-column {
29313 border-radius: 20px 0 0 0;
29314 position: relative;
29315 }
29316 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th.feature-column .feature-header {
29317 color: #363B4E;
29318 font-weight: 600;
29319 font-size: 20px;
29320 line-height: 1.2;
29321 text-align: start;
29322 margin: 10px 0 0 12px;
29323 position: absolute;
29324 bottom: 20px;
29325 }
29326 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody {
29327 background: #FFFFFF;
29328 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
29329 border-radius: 16px;
29330 border-radius: 0 0 16px 16px;
29331 }
29332 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .group-row td {
29333 background: #FFFFFF;
29334 text-align: left;
29335 padding: 26px 12px 12px;
29336 border: none;
29337 color: #363B4E;
29338 font-weight: 600;
29339 font-size: 16px;
29340 line-height: 1.5;
29341 }
29342 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row td {
29343 padding: 12px;
29344 border: 1px solid #EEE4F2;
29345 background: #FFFFFF;
29346 }
29347 .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 {
29348 border-left: none;
29349 border-right: none;
29350 }
29351 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row:last-child td {
29352 border-bottom: none;
29353 }
29354 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row:last-child td:first-child {
29355 border-radius: 0 0 0 16px;
29356 }
29357 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row:last-child td:last-child {
29358 border-radius: 0 0 16px 0;
29359 }
29360 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row.no-border-top td {
29361 border-top: none !important;
29362 }
29363 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content {
29364 text-align: left;
29365 color: #7A8B9A;
29366 font-weight: 500;
29367 font-size: 14px;
29368 line-height: 1.7;
29369 display: flex;
29370 align-items: center;
29371 }
29372 .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 {
29373 display: inline-flex;
29374 align-items: center;
29375 margin-left: 6px;
29376 position: relative;
29377 cursor: pointer;
29378 }
29379 .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 {
29380 visibility: hidden;
29381 opacity: 0;
29382 width: max-content;
29383 max-width: 217px;
29384 background: #10052E;
29385 box-shadow: 0 2px 15px 0 rgba(22, 28, 32, 0.08);
29386 color: rgba(255, 255, 255, 0.8);
29387 text-align: left;
29388 font-weight: 500;
29389 font-size: 13px;
29390 line-height: 1.38;
29391 padding: 11px 14px;
29392 border-radius: 8px;
29393 position: absolute;
29394 z-index: 10;
29395 bottom: 125%;
29396 left: 50%;
29397 transform: translateX(-50%);
29398 transition: opacity 0.2s ease;
29399 white-space: normal;
29400 }
29401 .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 {
29402 content: "";
29403 position: absolute;
29404 top: 100%;
29405 left: 50%;
29406 margin-left: -5px;
29407 border: 5px solid;
29408 border-color: #333 transparent transparent transparent;
29409 }
29410 .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 {
29411 visibility: visible;
29412 opacity: 1;
29413 }
29414 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-cell {
29415 color: #2D3149;
29416 font-weight: 400;
29417 font-size: 14px;
29418 line-height: 1.8;
29419 }
29420 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .pro-features-link-row td {
29421 border: none;
29422 padding: 15px 0;
29423 text-align: center;
29424 background: #FFFFFF;
29425 border-radius: 0 0 16px 16px;
29426 }
29427 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .pro-features-link-row a {
29428 color: #6E42D3;
29429 text-decoration: none;
29430 font-weight: 500;
29431 font-size: 16px;
29432 line-height: 1.5;
29433 display: inline-flex;
29434 align-items: center;
29435 gap: 10px;
29436 }
29437 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .pro-features-link-row a:hover {
29438 color: #5934a5;
29439 }
29440 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card {
29441 position: relative;
29442 background: #F6F5FA;
29443 height: 194px;
29444 display: flex;
29445 flex-direction: column;
29446 align-items: center;
29447 justify-content: end;
29448 border-radius: 16px;
29449 }
29450 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card.popular-card {
29451 background: #6E42D3;
29452 padding: 2px;
29453 }
29454 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content {
29455 background: #F6F5FA;
29456 width: 100%;
29457 height: 100%;
29458 border-radius: 16px;
29459 display: flex;
29460 flex-direction: column;
29461 align-items: center;
29462 justify-content: end;
29463 padding: 16px 16px 14px;
29464 }
29465 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .plan-name {
29466 color: #2D3149;
29467 font-weight: 600;
29468 font-size: 20px;
29469 line-height: 1.2;
29470 opacity: 0.8;
29471 }
29472 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
29473 color: #2D3149;
29474 font-weight: 500;
29475 font-size: 34px;
29476 line-height: 1.2;
29477 margin: 6px 0 14px;
29478 }
29479 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price .time {
29480 color: #2D3149;
29481 font-weight: 450;
29482 font-size: 14px;
29483 line-height: 2.3;
29484 }
29485 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .upgrade-btn {
29486 max-width: 166px;
29487 width: 100%;
29488 background: #6E42D3;
29489 color: #FFFFFF;
29490 border: none;
29491 padding: 10px 15px;
29492 border-radius: 10px;
29493 cursor: pointer;
29494 text-decoration: none;
29495 font-weight: 600;
29496 font-size: 14px;
29497 transition: all 0.2s;
29498 }
29499 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .upgrade-btn:hover {
29500 background: #5934a5;
29501 }
29502 .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 {
29503 background: #9D95C0;
29504 pointer-events: none;
29505 display: flex;
29506 align-items: center;
29507 justify-content: center;
29508 gap: 5px;
29509 }
29510 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .badge {
29511 margin: 5px 0;
29512 color: #FFFFFF;
29513 opacity: 0.8;
29514 font-weight: 600;
29515 font-size: 12px;
29516 }
29517 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .current {
29518 color: #6E42D3;
29519 font-weight: 600;
29520 }
29521 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper {
29522 display: flex;
29523 align-items: center;
29524 justify-content: center;
29525 gap: 5px;
29526 margin-top: 20px;
29527 }
29528 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper .list-item {
29529 border-radius: 100px;
29530 background: #FFFFFF;
29531 box-shadow: 0 1px 1px rgba(182, 185, 191, 0.3);
29532 padding: 7px 15px;
29533 display: flex;
29534 align-items: center;
29535 justify-content: center;
29536 gap: 7px;
29537 }
29538 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer {
29539 margin-top: 30px;
29540 padding: 0 50px;
29541 background: #ffffff;
29542 }
29543 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper {
29544 background-color: #ffffff;
29545 }
29546 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges {
29547 display: flex;
29548 align-items: center;
29549 justify-content: center;
29550 max-width: 621px;
29551 width: 100%;
29552 margin: 0 auto;
29553 padding: 30px 0 25px;
29554 margin-top: 45px;
29555 }
29556 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .payment-image {
29557 max-width: 70px;
29558 width: 100%;
29559 margin: 0 25px;
29560 position: relative;
29561 }
29562 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .payment-image img {
29563 width: 100%;
29564 }
29565 .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 {
29566 content: "";
29567 position: absolute;
29568 top: 0;
29569 height: 70px;
29570 width: 1.47px;
29571 background: linear-gradient(180deg, transparent 0%, #D1D1D1 49.48%, transparent 100%);
29572 }
29573 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .satisfaction-image::before {
29574 left: -25px;
29575 }
29576 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .satisfaction-image::after {
29577 right: -25px;
29578 }
29579 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .review-image {
29580 max-width: 102px;
29581 width: 100%;
29582 margin: 0 25px;
29583 }
29584 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .security-badges .review-image img {
29585 width: 100%;
29586 }
29587 .wpfunnels_page_wpf_feature_comparison .wpfnl-free-vs-pro-comparison-wrapper .free-vs-pro-table-footer .badges-wrapper .badges-description {
29588 max-width: 555px;
29589 width: 100%;
29590 margin: 0 auto;
29591 text-align: center;
29592 color: #2D3149;
29593 font-size: 14px;
29594 font-weight: 400;
29595 line-height: 1.7;
29596 padding-bottom: 26px;
29597 }
29598
29599 @media only screen and (max-width: 1550px) {
29600 .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 {
29601 width: 218px;
29602 }
29603 }
29604 @media only screen and (max-width: 1399px) {
29605 .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 {
29606 width: 190px;
29607 }
29608 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .plan-name {
29609 font-size: 18px;
29610 }
29611 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
29612 font-size: 26px;
29613 }
29614 }
29615 @media only screen and (max-width: 1199px) {
29616 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper {
29617 padding: 0 20px;
29618 }
29619 .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 {
29620 width: 145px;
29621 }
29622 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table thead th {
29623 padding: 16px 5px;
29624 }
29625 .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 {
29626 padding: 16px 10px 16px 5px;
29627 }
29628 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card {
29629 height: 162px;
29630 }
29631 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content {
29632 padding: 10px;
29633 }
29634 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
29635 font-size: 24px !important;
29636 }
29637 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .current-plan-btn svg {
29638 display: none;
29639 }
29640 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .plan-name {
29641 font-size: 16px;
29642 }
29643 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .price {
29644 font-size: 24px;
29645 margin: 6px 0 10px;
29646 }
29647 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table .plan-card .card-content .upgrade-btn {
29648 font-size: 13px !important;
29649 padding: 10px 8px !important;
29650 }
29651 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content {
29652 align-items: start;
29653 justify-content: space-between;
29654 }
29655 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .comparison-table tbody .feature-row .feature-label .feature-label-content .tooltip-wrapper {
29656 display: inline-block;
29657 margin-top: 2px;
29658 }
29659 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper {
29660 flex-wrap: wrap;
29661 }
29662 .wpfnl-free-vs-pro-comparison-wrapper .table-content-wrapper .list-item-wrapper .list-item {
29663 padding: 5px 10px;
29664 gap: 5px;
29665 }
29666 }
29667 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal {
29668 position: relative;
29669 z-index: 9999999999;
29670 }
29671 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm-automation-editor .mintmrm-automation-sidebar .mintmrm-template-modal {
29672 right: -70px;
29673 top: 30px;
29674 }
29675 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm-automation-editor .mintmrm-automation-sidebar .mintmrm-template-modal .template-modal-inner {
29676 max-height: calc(100vh - 90px);
29677 }
29678 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm-automation-editor .email-builder-editor {
29679 top: 32px;
29680 }
29681 .wpfunnels_page_wpfnl_automations .wpfnl-automation-modal .mintmrm .mintmrm-automaiton__block-popover .trigger-tab-nav li[data-trigger-type=logical] {
29682 display: none;
29683 }
29684
29685 .wpfnl-comparison-chart-wrapper {
29686 border-radius: 10px;
29687 background: #FFF;
29688 box-shadow: 0px 1px 1px 0px rgba(182, 185, 191, 0.3);
29689 padding: 24px;
29690 }
29691 .wpfnl-comparison-chart-wrapper .wpfnl-loader {
29692 display: flex;
29693 margin: 150px auto;
29694 padding: 40px;
29695 }
29696 .wpfnl-comparison-chart-wrapper .wpfnl-chart-title {
29697 color: #2D3149;
29698 font-size: 18px;
29699 font-style: normal;
29700 font-weight: 600;
29701 line-height: 18px;
29702 margin: 0;
29703 margin-bottom: 24px;
29704 }
29705 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container {
29706 display: flex;
29707 align-items: center;
29708 justify-content: space-between;
29709 }
29710 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab {
29711 padding: 16px 24px;
29712 position: relative;
29713 cursor: pointer;
29714 }
29715 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.disabled {
29716 pointer-events: none;
29717 cursor: not-allowed;
29718 }
29719 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.disabled .wpfnl-overlay {
29720 width: 99.5%;
29721 padding: 0;
29722 left: -1px;
29723 border-radius: 0;
29724 bottom: -1px;
29725 top: unset;
29726 border: 1px solid rgba(238, 240, 243, 0.8);
29727 border-bottom: none;
29728 border-radius: 10px 10px 0 0;
29729 }
29730 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header {
29731 display: flex;
29732 align-items: center;
29733 justify-content: flex-start;
29734 gap: 10px;
29735 margin-bottom: 10px;
29736 }
29737 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-tab-total-amount {
29738 margin: 0;
29739 color: #2D3149;
29740 font-size: 22px;
29741 font-style: normal;
29742 font-weight: 500;
29743 line-height: 1.36;
29744 letter-spacing: -0.44px;
29745 }
29746 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage {
29747 border-radius: 100px;
29748 padding: 4px 7px;
29749 display: flex;
29750 align-items: center;
29751 gap: 1px;
29752 justify-content: center;
29753 font-size: 12px;
29754 font-style: normal;
29755 font-weight: 500;
29756 line-height: 1;
29757 margin: 0;
29758 min-width: 40px;
29759 }
29760 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage.wpfnl-decrease {
29761 background: rgba(236, 89, 86, 0.1);
29762 color: #EC5956;
29763 }
29764 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage.wpfnl-increase {
29765 background: rgba(18, 183, 106, 0.1);
29766 color: #12B76A;
29767 }
29768 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-title {
29769 margin: 0;
29770 color: #667085;
29771 font-size: 14px;
29772 font-style: normal;
29773 font-weight: 400;
29774 line-height: 1;
29775 }
29776 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab::after {
29777 content: "";
29778 width: 1px;
29779 height: 60%;
29780 position: absolute;
29781 background: #E4E6EB;
29782 right: 0;
29783 top: 30%;
29784 }
29785 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.active {
29786 border-radius: 8px 8px 0px 0px;
29787 border: 1px solid rgba(238, 240, 243, 0.8);
29788 background: #FCFCFF;
29789 border-bottom: 0;
29790 }
29791 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.active::after {
29792 content: none;
29793 }
29794 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab.no-after::after {
29795 content: none;
29796 }
29797 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab:last-child::after {
29798 content: none;
29799 }
29800 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body {
29801 border-radius: 0px 0px 8px 8px;
29802 border: 1px solid rgba(241, 240, 245, 0.8);
29803 background: #FCFCFF;
29804 padding: 24px;
29805 }
29806 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container {
29807 position: relative;
29808 }
29809 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps {
29810 position: absolute;
29811 top: 3px;
29812 left: 0;
29813 height: 292px;
29814 width: 100%;
29815 display: flex;
29816 flex-flow: column;
29817 justify-content: space-between;
29818 }
29819 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step {
29820 color: #9398A5;
29821 text-align: right;
29822 font-size: 12px;
29823 font-style: normal;
29824 font-weight: 400;
29825 line-height: 1.5;
29826 display: block;
29827 position: relative;
29828 }
29829 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step::before {
29830 content: "";
29831 position: absolute;
29832 left: 50px;
29833 bottom: 1px;
29834 top: inherit;
29835 width: calc(100% - 50px);
29836 height: 1px;
29837 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");
29838 }
29839 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-chart-steps-container .wpfnl-comparison-chart-steps .wpfnl-single-step span {
29840 width: 33px;
29841 display: block;
29842 text-align: right;
29843 position: relative;
29844 bottom: -7px;
29845 }
29846 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container {
29847 height: 320px;
29848 padding: 10px 0px 9px 60px;
29849 position: relative;
29850 z-index: 1;
29851 display: grid;
29852 grid-template-columns: repeat(12, 1fr);
29853 gap: 0;
29854 }
29855 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar {
29856 width: 100%;
29857 height: 94%;
29858 position: relative;
29859 display: flex;
29860 flex-flow: row nowrap;
29861 align-items: flex-end;
29862 gap: 6px;
29863 bottom: 0px;
29864 }
29865 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar::before {
29866 height: 100%;
29867 width: 1px;
29868 position: absolute;
29869 background: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgMSAxOTkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggc3Ryb2tlPSIjMkQzMTQ5IiBzdHJva2UtZGFzaGFycmF5PSI0IDQiIHN0cm9rZS13aWR0aD0iLjUiIGQ9Ik0uMjUuMjVoLjV2MTk4LjVoLS41eiIvPjwvc3ZnPg==");
29870 left: 38%;
29871 }
29872 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar:hover::before {
29873 content: "";
29874 }
29875 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar:hover .wpfnl-comparison-bar-tooltip {
29876 display: block;
29877 }
29878 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip {
29879 display: none;
29880 border-radius: 8px;
29881 background: #10052E;
29882 box-shadow: 0px 2px 15px 0px rgba(22, 28, 32, 0.08);
29883 padding: 15px 14px;
29884 width: 160px;
29885 z-index: 99;
29886 position: absolute;
29887 transform: translateX(-50%);
29888 left: 45%;
29889 }
29890 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip::before {
29891 content: "";
29892 background: #10052E;
29893 width: 10px;
29894 height: 10px;
29895 position: absolute;
29896 bottom: -5px;
29897 transform: rotate(45deg);
29898 left: 45%;
29899 }
29900 .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,
29901 .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 {
29902 color: #CDCFD6;
29903 font-size: 13px;
29904 font-style: normal;
29905 font-weight: 400;
29906 line-height: 12px;
29907 margin: 0;
29908 display: flex;
29909 }
29910 .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,
29911 .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 {
29912 color: #FFF;
29913 }
29914 .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,
29915 .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 {
29916 width: 10px;
29917 height: 10px;
29918 border-radius: 50%;
29919 background: #6E42D3;
29920 display: inline-block;
29921 margin-right: 5px;
29922 }
29923 .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,
29924 .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 {
29925 display: flex;
29926 flex-wrap: wrap;
29927 gap: 2px;
29928 }
29929 .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 {
29930 margin-top: 8px;
29931 }
29932 .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 {
29933 background: #EAE1FF;
29934 }
29935 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-bar-label {
29936 font-size: 12px;
29937 line-height: 1.2;
29938 color: #9398A5;
29939 position: absolute;
29940 bottom: -40px;
29941 left: 40%;
29942 transform: translateX(-50%);
29943 white-space: nowrap;
29944 transition: all 0.3s ease;
29945 }
29946 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-single-bar {
29947 flex: 1;
29948 min-width: 0;
29949 display: block;
29950 border-radius: 30px 30px 0 0;
29951 position: relative;
29952 }
29953 .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 {
29954 background-color: #EAE1FF;
29955 }
29956 .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 {
29957 background-color: #6E42D3;
29958 }
29959
29960 @media only screen and (max-width: 1600px) {
29961 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip {
29962 left: 40%;
29963 width: 94px;
29964 padding: 10px;
29965 }
29966 .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,
29967 .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 {
29968 font-size: 10px;
29969 }
29970 .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,
29971 .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 {
29972 width: 6px;
29973 height: 6px;
29974 margin-right: 3px;
29975 }
29976 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar .wpfnl-comparison-bar-tooltip b {
29977 display: block;
29978 margin-top: 2px;
29979 }
29980 .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 {
29981 margin-top: -3px;
29982 }
29983 }
29984 @media only screen and (max-width: 1399px) {
29985 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab {
29986 padding: 10px 15px;
29987 }
29988 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-tab-total-amount {
29989 font-size: 18px;
29990 }
29991 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage {
29992 min-width: 40px;
29993 padding: 4px 5px;
29994 font-size: 9px;
29995 }
29996 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-header .wpfnl-percentage svg {
29997 width: 12px;
29998 height: 12px;
29999 }
30000 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container .wpfnl-comparison-bar-single-tab .wpfnl-tab-title {
30001 font-size: 12px;
30002 }
30003 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-chart-body .wpfnl-comparison-bars-container .wpfnl-comparison-bar::before {
30004 left: 42%;
30005 }
30006 }
30007 @media only screen and (max-width: 960px) {
30008 .wpfnl-comparison-chart-wrapper .wpfnl-comparison-chart .wpfnl-comparison-tabs-container {
30009 flex-wrap: wrap;
30010 }
30011 }
30012 .wpfnl-datepicker {
30013 position: relative;
30014 min-width: 350px;
30015 }
30016 .wpfnl-datepicker input {
30017 cursor: default;
30018 margin: 0.5em;
30019 border-radius: 4px;
30020 background: inherit;
30021 border-radius: 8px;
30022 color: #2D3149;
30023 font-family: Inter;
30024 font-size: 13px;
30025 font-style: normal;
30026 font-weight: 500;
30027 line-height: 1.15;
30028 border: 1px solid #F1F0F5;
30029 padding: 9px 12px;
30030 width: 45%;
30031 }
30032 .wpfnl-datepicker input.single-date {
30033 width: 100%;
30034 margin-left: -1px;
30035 }
30036 .wpfnl-datepicker .multi-input {
30037 display: flex;
30038 align-items: center;
30039 }
30040 .wpfnl-datepicker .multi-input span {
30041 margin: 0 0.5em;
30042 }
30043 .wpfnl-datepicker .calendar {
30044 background: white;
30045 padding: 1em;
30046 }
30047 .wpfnl-datepicker .calendar .calendar-header {
30048 display: flex;
30049 justify-content: space-between;
30050 align-items: center;
30051 margin-bottom: 1em;
30052 }
30053 .wpfnl-datepicker .calendar .calendar-header .pre-month,
30054 .wpfnl-datepicker .calendar .calendar-header .next-month {
30055 border-radius: 8px;
30056 border: 1px solid #F1F0F5;
30057 padding: 8px 15px;
30058 }
30059 .wpfnl-datepicker .calendar .calendar-header .month-name {
30060 color: #2D3149;
30061 font-family: Inter;
30062 font-size: 16px;
30063 font-style: normal;
30064 font-weight: 500;
30065 line-height: 15px;
30066 }
30067 .wpfnl-datepicker .calendar .calendar-header button {
30068 background: none;
30069 border: none;
30070 cursor: pointer;
30071 font-size: 1.2em;
30072 }
30073 .wpfnl-datepicker .calendar .calendar-grid {
30074 display: grid;
30075 grid-template-columns: repeat(7, 1fr);
30076 gap: 0.5em;
30077 }
30078 .wpfnl-datepicker .calendar .calendar-grid .calendar-day {
30079 color: #9398A5;
30080 font-family: Inter;
30081 font-size: 14px;
30082 font-style: normal;
30083 font-weight: 500;
30084 line-height: 14px;
30085 cursor: default;
30086 }
30087 .wpfnl-datepicker .calendar .calendar-grid .calendar-day:hover {
30088 background: none !important;
30089 }
30090 .wpfnl-datepicker .calendar .calendar-grid div {
30091 text-align: center;
30092 padding: 0.5em;
30093 cursor: pointer;
30094 border-radius: 4px;
30095 color: #2D3149;
30096 text-align: center;
30097 font-family: Inter;
30098 font-size: 12px;
30099 font-style: normal;
30100 font-weight: 500;
30101 line-height: 2.667;
30102 }
30103 .wpfnl-datepicker .calendar .calendar-grid div.empty {
30104 background: none;
30105 cursor: default;
30106 }
30107 .wpfnl-datepicker .calendar .calendar-grid div.selected, .wpfnl-datepicker .calendar .calendar-grid div.start-date, .wpfnl-datepicker .calendar .calendar-grid div.end-date {
30108 background: #6E42D3;
30109 color: white;
30110 }
30111 .wpfnl-datepicker .calendar .calendar-grid div.in-range {
30112 background: #e5daff;
30113 }
30114 .wpfnl-datepicker .calendar .calendar-grid div.disabled {
30115 opacity: 0.5;
30116 cursor: default;
30117 pointer-events: none;
30118 }
30119 .wpfnl-datepicker .calendar .calendar-grid div.disabled:hover {
30120 background: none !important;
30121 }
30122 .wpfnl-datepicker .calendar .calendar-grid div:hover:not(.empty) {
30123 background: #f0f0f0;
30124 }
30125
30126 .wpfnl-pro-modal-overlay {
30127 position: fixed;
30128 top: 0;
30129 left: 0;
30130 width: 100%;
30131 height: 100%;
30132 background: rgba(16, 5, 46, 0.3);
30133 backdrop-filter: blur(7px);
30134 justify-content: center;
30135 align-items: center;
30136 display: flex;
30137 z-index: 999999;
30138 }
30139 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper {
30140 background: #fff;
30141 border-radius: 20px;
30142 padding: 40px;
30143 position: relative;
30144 width: 100%;
30145 max-width: 463px;
30146 position: relative;
30147 box-shadow: 0px 14px 14px #A7A4AF;
30148 animation: wpfnl-bounce 0.3s;
30149 -webkit-animation: wpfnl-bounce 0.3s;
30150 -moz-animation: wpfnl-bounce 0.3s;
30151 -ms-animation: wpfnl-bounce 0.3s;
30152 -o-animation: wpfnl-bounce 0.3s;
30153 }
30154 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-close .wpfnl-pro-modal-close-btn {
30155 position: absolute;
30156 right: -14px;
30157 top: -14px;
30158 background: #ffffff;
30159 box-shadow: 0px 1px 1px #dadada;
30160 border-radius: 100px;
30161 width: 34px;
30162 height: 34px;
30163 display: flex;
30164 align-items: center;
30165 justify-content: center;
30166 cursor: pointer;
30167 z-index: 2;
30168 }
30169 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content {
30170 display: flex;
30171 flex-direction: column;
30172 }
30173 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header-icon svg {
30174 display: block;
30175 margin-bottom: -18px;
30176 }
30177 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header {
30178 width: 100%;
30179 display: flex;
30180 flex-flow: column;
30181 align-items: center;
30182 position: relative;
30183 height: 100%;
30184 overflow: hidden;
30185 }
30186 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header .wpfnl-pro-heading {
30187 color: #1D2327;
30188 text-align: center;
30189 font-family: "Inter";
30190 font-size: 22px;
30191 font-weight: 600;
30192 line-height: 1.3;
30193 max-width: 330px;
30194 }
30195 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-header .wpfnl-pro-sub-heading {
30196 color: #9398A5;
30197 text-align: center;
30198 font-family: Inter;
30199 font-size: 14px;
30200 font-style: normal;
30201 font-weight: 400;
30202 line-height: 1.42;
30203 margin-top: 6px;
30204 width: 80%;
30205 }
30206 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body {
30207 margin-top: 26px;
30208 border-top: 1px solid rgba(173, 173, 203, 0.2);
30209 padding-top: 24px;
30210 }
30211 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .feature-title {
30212 color: #4B4B4B;
30213 font-family: "Inter";
30214 font-size: 16px;
30215 font-weight: 600;
30216 line-height: 1;
30217 margin-bottom: 16px;
30218 }
30219 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .wpfnl-pro-features {
30220 display: flex;
30221 flex-flow: column;
30222 gap: 13px;
30223 }
30224 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .wpfnl-pro-features li {
30225 display: flex;
30226 align-items: center;
30227 gap: 8px;
30228 color: #707070;
30229 font-family: "Inter";
30230 font-size: 16px;
30231 font-weight: 400;
30232 line-height: 1.3;
30233 letter-spacing: -0.16px;
30234 }
30235 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-body .wpfnl-pro-features li span {
30236 color: #707070;
30237 font-size: 16px;
30238 font-weight: 400;
30239 line-height: 1.3;
30240 letter-spacing: -0.14px;
30241 }
30242 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer {
30243 margin-top: 24px;
30244 }
30245 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .btn-default {
30246 display: block;
30247 line-height: 1;
30248 padding: 18px 30px;
30249 height: auto;
30250 border-radius: 12px;
30251 box-shadow: 0 9px 14px 0 rgba(193, 183, 232, 0.4);
30252 }
30253 .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 {
30254 display: flex;
30255 align-items: center;
30256 justify-content: center;
30257 gap: 10px;
30258 padding: 0px 0px 10px 0px;
30259 position: relative;
30260 }
30261 .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 {
30262 text-align: left;
30263 width: 42%;
30264 white-space: nowrap;
30265 overflow: hidden;
30266 text-overflow: ellipsis;
30267 padding: 10px;
30268 }
30269 .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 {
30270 color: #2D3149;
30271 font-size: 20px;
30272 font-weight: 500;
30273 }
30274 .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 {
30275 color: #9398A5;
30276 font-size: 12px;
30277 font-weight: 400;
30278 }
30279 .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 {
30280 flex-grow: 1;
30281 padding: 10px;
30282 }
30283 .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 {
30284 color: #2D3149;
30285 font-size: 20px;
30286 font-weight: 500;
30287 }
30288 .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 {
30289 color: #9398A5;
30290 font-size: 12px;
30291 font-weight: 400;
30292 }
30293 .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 {
30294 background: transparent;
30295 border: 1px solid #E8E6EE;
30296 border-radius: 10px;
30297 }
30298 .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 {
30299 width: 10%;
30300 padding: 16px 0px;
30301 }
30302 .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 {
30303 transition: all 0.3s ease;
30304 }
30305 .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 {
30306 transform: rotate(180deg);
30307 }
30308 .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 {
30309 position: absolute;
30310 display: none;
30311 width: 56%;
30312 top: 92%;
30313 right: 0;
30314 background: #FFFFFF;
30315 border-radius: 10px;
30316 z-index: 1;
30317 border: 1px solid #F6F5FA;
30318 box-shadow: 0px 10px 20px rgba(226, 220, 237, 0.4);
30319 }
30320 .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 {
30321 padding: 10px;
30322 cursor: pointer;
30323 }
30324 .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 {
30325 color: #2D3149;
30326 font-size: 14px;
30327 font-weight: 500;
30328 }
30329 .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 {
30330 color: #9398A5;
30331 font-size: 12px;
30332 font-weight: 400;
30333 }
30334 .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 {
30335 background: #F6F5FA;
30336 }
30337 .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) {
30338 border-bottom: 1px solid #E8E6EE;
30339 }
30340 .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 {
30341 display: block;
30342 }
30343 .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 {
30344 display: flex;
30345 align-items: center;
30346 justify-content: center;
30347 gap: 16px;
30348 flex-wrap: wrap;
30349 }
30350 .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 {
30351 color: #2D3149;
30352 font-size: 15px;
30353 font-style: normal;
30354 font-weight: 500;
30355 line-height: normal;
30356 letter-spacing: -0.15px;
30357 background: none;
30358 padding: 0;
30359 height: auto;
30360 min-width: unset;
30361 }
30362 .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 {
30363 border-radius: 10px;
30364 background: #6E42D3;
30365 box-shadow: 0px 9px 14px 0px rgba(193, 183, 232, 0.4);
30366 display: flex;
30367 align-items: center;
30368 gap: 8px;
30369 cursor: pointer;
30370 min-height: 40px;
30371 width: 100%;
30372 margin: 0 auto;
30373 justify-content: center;
30374 }
30375 .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 {
30376 color: #FFF;
30377 font-size: 16px;
30378 font-style: normal;
30379 font-weight: 400;
30380 line-height: normal;
30381 text-align: center;
30382 }
30383 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text {
30384 display: flex;
30385 align-items: center;
30386 justify-content: center;
30387 margin-top: 10px;
30388 gap: 6px;
30389 font-size: 13px;
30390 }
30391 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text strong {
30392 color: #2D3149;
30393 font-size: 14px;
30394 font-weight: 500;
30395 }
30396 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text span {
30397 color: #9398A5;
30398 font-size: 12px;
30399 font-weight: 400;
30400 }
30401 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text svg {
30402 margin-top: -2px;
30403 }
30404 .wpfnl-pro-modal-overlay .wpfnl-pro-modal-wrapper .wpfnl-pro-modal-content .wpfnl-pro-modal-footer .wpfnl-pro-modal-footer-text svg path {
30405 fill: #4CBB17;
30406 }
30407
30408 /* Standard syntax */
30409 @keyframes wpfnl-bounce {
30410 0% {
30411 transform: scale(0.7);
30412 }
30413 45% {
30414 transform: scale(1.05);
30415 }
30416 80% {
30417 transform: scale(0.95);
30418 }
30419 100% {
30420 transform: scale(1);
30421 }
30422 }
30423 /* Webkit (Safari, older versions of Chrome, etc.) */
30424 @-webkit-keyframes wpfnl-bounce {
30425 0% {
30426 -webkit-transform: scale(0.7);
30427 }
30428 45% {
30429 -webkit-transform: scale(1.05);
30430 }
30431 80% {
30432 -webkit-transform: scale(0.95);
30433 }
30434 100% {
30435 -webkit-transform: scale(1);
30436 }
30437 }
30438 /* Mozilla (Firefox) */
30439 @-moz-keyframes wpfnl-bounce {
30440 0% {
30441 -moz-transform: scale(0.7);
30442 }
30443 45% {
30444 -moz-transform: scale(1.05);
30445 }
30446 80% {
30447 -moz-transform: scale(0.95);
30448 }
30449 100% {
30450 -moz-transform: scale(1);
30451 }
30452 }
30453 /* Microsoft (Internet Explorer) */
30454 @-ms-keyframes wpfnl-bounce {
30455 0% {
30456 -ms-transform: scale(0.7);
30457 }
30458 45% {
30459 -ms-transform: scale(1.05);
30460 }
30461 80% {
30462 -ms-transform: scale(0.95);
30463 }
30464 100% {
30465 -ms-transform: scale(1);
30466 }
30467 }
30468 /* Opera */
30469 @-o-keyframes wpfnl-bounce {
30470 0% {
30471 -o-transform: scale(0.7);
30472 }
30473 45% {
30474 -o-transform: scale(1.05);
30475 }
30476 80% {
30477 -o-transform: scale(0.95);
30478 }
30479 100% {
30480 -o-transform: scale(1);
30481 }
30482 }
30483 #wpfnl-toaster-wrapper {
30484 display: none;
30485 }
30486 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast {
30487 position: fixed;
30488 top: 50px;
30489 right: 30px;
30490 z-index: 9999;
30491 -webkit-animation: quick-toastify-fadeinout 3s linear forwards;
30492 animation: quick-toastify-fadeinout 3s ease-in-out forwards;
30493 }
30494 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container {
30495 background: #ffffff;
30496 border: 1px solid #039855;
30497 box-shadow: 0px 7px 30px rgba(16, 5, 46, 0.08);
30498 border-radius: 10px;
30499 display: flex;
30500 flex-flow: row wrap;
30501 align-items: center;
30502 padding: 15px;
30503 }
30504 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-successfull-icon,
30505 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
30506 height: 26px;
30507 width: 26px;
30508 }
30509 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container p {
30510 padding: 0 60px 0 13px;
30511 }
30512 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
30513 background: #ffffff;
30514 border: 1px solid #e4e6eb;
30515 border-radius: 6px;
30516 display: flex;
30517 justify-content: center;
30518 align-items: center;
30519 cursor: pointer;
30520 }
30521 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon svg path {
30522 fill: #686f7f;
30523 }
30524 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon:hover {
30525 background: #e4e6eb;
30526 }
30527 #wpfnl-toaster-wrapper.quick-toastify-successful-notification .quick-toastify-successful-notification.quick-toastify-hide {
30528 display: none;
30529 }
30530 #wpfnl-toaster-wrapper {
30531 /* -------Warn notification alert toast------------ */
30532 }
30533 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast {
30534 position: fixed;
30535 top: 120px;
30536 right: 30px;
30537 z-index: 9999;
30538 -webkit-animation: quick-toastify-fadeinout 3s linear forwards;
30539 animation: quick-toastify-fadeinout 3s ease-in-out forwards;
30540 }
30541 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container {
30542 background: #ffffff;
30543 border: 1px solid #ec0707;
30544 box-shadow: 0px 7px 30px rgba(16, 5, 46, 0.08);
30545 border-radius: 10px;
30546 display: flex;
30547 flex-flow: row wrap;
30548 align-items: center;
30549 padding: 15px;
30550 }
30551 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-successfull-icon,
30552 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
30553 height: 26px;
30554 width: 26px;
30555 }
30556 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container p {
30557 padding: 0 60px 0 13px;
30558 }
30559 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon {
30560 background: #ffffff;
30561 border: 1px solid #e4e6eb;
30562 border-radius: 6px;
30563 display: flex;
30564 justify-content: center;
30565 align-items: center;
30566 cursor: pointer;
30567 }
30568 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon svg path {
30569 fill: #686f7f;
30570 }
30571 #wpfnl-toaster-wrapper.quick-toastify-warn-notification .quick-toastify-alert-toast .quick-toastify-alert-container .quick-toastify-cross-icon:hover {
30572 background: #e4e6eb;
30573 }
30574 @-webkit-keyframes quick-toastify-fadeinout {
30575 0% {
30576 opacity: 0;
30577 top: 80px;
30578 }
30579 20%, 80% {
30580 opacity: 1;
30581 top: 50px;
30582 }
30583 100% {
30584 opacity: 0;
30585 top: 20px;
30586 }
30587 }
30588 @keyframes quick-toastify-fadeinout {
30589 0% {
30590 opacity: 0;
30591 top: 80px;
30592 }
30593 20%, 80% {
30594 opacity: 1;
30595 top: 50px;
30596 }
30597 100% {
30598 opacity: 0;
30599 top: 20px;
30600 }
30601 }
30602
30603 body.rtl .wpfnl-checkbox label {
30604 padding-right: 29px;
30605 padding-left: 0;
30606 }
30607 body.rtl .wpfnl-checkbox label:before {
30608 left: inherit;
30609 right: 0;
30610 }
30611 body.rtl .wpfnl-checkbox label:after {
30612 left: inherit;
30613 right: 5px;
30614 }
30615 body.rtl .wpfnl-radiobtn label {
30616 padding-right: 29px;
30617 padding-left: 0;
30618 }
30619 body.rtl .wpfnl-radiobtn label::before {
30620 content: "";
30621 position: absolute;
30622 left: inherit;
30623 right: 0;
30624 }
30625 body.rtl .wpfnl-radiobtn label::after {
30626 right: 5px;
30627 left: inherit;
30628 }
30629 body.rtl .wpfnl-delete-alert-wrapper {
30630 right: inherit;
30631 left: 0;
30632 }
30633 body.rtl .delete-alert-new-ui .icon {
30634 right: inherit;
30635 left: -12px;
30636 }
30637 body.rtl .delete-alert-new-ui .wpfnl-delete-confirm-body p {
30638 text-align: right;
30639 }
30640 body.rtl .wpfnl-loader {
30641 margin-left: 0;
30642 margin-right: 4px;
30643 }
30644 body.rtl ul.wpfnl-dropdown {
30645 left: 0;
30646 right: inherit;
30647 }
30648 body.rtl ul.wpfnl-dropdown:after {
30649 left: 21px;
30650 right: inherit;
30651 }
30652 body.rtl ul.wpfnl-dropdown li a svg {
30653 margin-left: 6px;
30654 margin-right: 0;
30655 }
30656 body.rtl .wpfnl-field-wrapper > label {
30657 padding-left: 10px;
30658 padding-right: 0;
30659 }
30660 body.rtl .wpfnl-custom-selectbox .selectbox-selected-value {
30661 text-align: right;
30662 }
30663 body.rtl .wpfnl-custom-selectbox .selectbox-selected-value:before {
30664 left: 15px;
30665 right: inherit;
30666 }
30667 body.rtl .wpfnl-custom-selectbox .selectbox-selected-value {
30668 padding: 13px 12px 13px 33px;
30669 }
30670 body.rtl .wpfnl-custom-selectbox .list-title {
30671 right: -8px;
30672 left: inherit;
30673 }
30674
30675 body.rtl .template-library-modal {
30676 left: inherit;
30677 right: 160px;
30678 }
30679 body.rtl .template-library-modal .funnel-templates-header .back-form-modal {
30680 margin-right: 0;
30681 margin-left: 15px;
30682 }
30683 body.rtl .template-library-modal .funnel-templates-header .back-form-modal svg {
30684 left: 1px;
30685 transform: rotate(180deg);
30686 }
30687 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .wpfnl-modal-close {
30688 margin-right: 0;
30689 margin-left: 15px;
30690 }
30691 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .wpfnl-modal-close svg {
30692 transform: rotate(180deg);
30693 }
30694 body.rtl .template-library-modal .funnel-templates-header .template-type-filter {
30695 margin-left: 0;
30696 margin-right: auto;
30697 background-position-x: 13px;
30698 }
30699 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter,
30700 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter {
30701 margin-left: 0 !important;
30702 margin-right: auto;
30703 }
30704 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li:first-child,
30705 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter li:first-child {
30706 border-radius: 0 50px 50px 0;
30707 }
30708 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li:last-child,
30709 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter li:last-child {
30710 border-radius: 50px 0 0 50px;
30711 }
30712 body.rtl .step-template-showcase-modal .steps-template__filter-wrapper .pro-free__filter li svg,
30713 body.rtl .template-library-modal .funnel-templates-header .pro-free__filter li svg {
30714 margin-right: 0;
30715 margin-left: 8px;
30716 }
30717 body.rtl .template-library-modal .funnel-templates-sidebar .category-filter-wrapper {
30718 padding-right: 0;
30719 padding-left: 8px;
30720 }
30721 body.rtl .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .funnel-limit-notice svg,
30722 body.rtl .template-library-modal .wpfnl-create-funnel__templates .create-funnel__single-template.create__from-scratch .btn-default svg {
30723 margin-right: 0;
30724 margin-left: 2px;
30725 }
30726 body.rtl .wpfnl-drawing-window .drawflow .drawflow-node .node-wrapper .create-step-name-modal .modal-header .close,
30727 body.rtl .step-template-showcase-modal .create-step-name-modal .modal-header .close,
30728 body.rtl .template-library-modal .wpfnl-create-funnel__templates-wrapper .create-funnel-name-modal .modal-header .close {
30729 right: inherit;
30730 left: -11px;
30731 }
30732
30733 body.rtl.folded .template-library-modal {
30734 right: 36px;
30735 width: calc(100% - 36px);
30736 }
30737
30738 body.rtl.wp-funnels_page_edit_funnel #wpcontent {
30739 padding-right: 0;
30740 }
30741 body.rtl .steps-page__header {
30742 padding-right: 24px;
30743 padding-left: 12px;
30744 }
30745 body.rtl .steps-page__header-left .wpfnl-logo a {
30746 border-left: 1px solid #E5E8F3;
30747 border-right: 0;
30748 }
30749 body.rtl .steps-page__header-left .back-link {
30750 margin-right: 0;
30751 margin-left: 15px;
30752 }
30753 body.rtl .steps-page__header-left .back-link svg {
30754 transform: rotate(180deg);
30755 }
30756 body.rtl .steps-page__header-left .add-step-condtion-area li > button svg {
30757 margin-right: 0;
30758 margin-left: 5px;
30759 }
30760 body.rtl .steps-page__header-left .add-step-condtion-area li > button.add-new-step svg {
30761 margin-right: 0;
30762 margin-left: 5px;
30763 }
30764 body.rtl .steps-page__header-center .steps-page__fnl-name .fnl-name-btn {
30765 margin-left: 0;
30766 margin-right: 10px;
30767 }
30768 body.rtl .steps-page__header-right {
30769 margin-left: 0;
30770 margin-right: auto;
30771 }
30772 body.rtl .steps-page__header-right .enable-gbf {
30773 margin-right: 0;
30774 margin-left: 15px;
30775 }
30776 body.rtl .steps-page__header-right .enable-gbf,
30777 body.rtl .steps-page__header-right .funnel-stats {
30778 border-right: none;
30779 padding-right: 0;
30780 margin-right: 0;
30781 border-left: 1px solid #E5E8F3;
30782 margin-left: 5px;
30783 padding-left: 20px;
30784 }
30785 body.rtl .steps-page__header-right .enable-gbf .title,
30786 body.rtl .steps-page__header-right .funnel-stats .title {
30787 margin-right: 0;
30788 margin-left: 10px;
30789 }
30790 body.rtl .steps-page__header-right .dropdown-option {
30791 margin-left: 0;
30792 margin-right: 6px;
30793 }
30794 body.rtl .steps-page__header-right .dropdown-option ul.wpfnl-dropdown {
30795 right: inherit;
30796 left: -4px;
30797 }
30798 body.rtl .steps-page__header-right ul.wpfnl-dropdown:after {
30799 left: 11px;
30800 right: inherit;
30801 }
30802 body.rtl .steps-page__header-right .dropdown-option ul.wpfnl-dropdown a svg {
30803 margin-right: 0;
30804 margin-left: 6px;
30805 }
30806 body.rtl .funnel-window .wpfnl-canvas-zoom-control {
30807 left: inherit;
30808 right: 20px;
30809 }
30810 body.rtl .wpfnl-drawing-window .drawflow .drawflow-node .inputs .input {
30811 left: -20px;
30812 right: inherit;
30813 }
30814 body.rtl .reconfigure-condition-modal .wpfnl-delete-confirm-body {
30815 text-align: right;
30816 }
30817
30818 body.rtl .wpfnl-step-settings-drawer {
30819 right: inherit;
30820 left: -190px;
30821 }
30822 body.rtl .wpfnl-step-settings-drawer.show-drawer {
30823 right: inherit;
30824 left: 0;
30825 }
30826 body.rtl .wpfnl-step-settings-drawer .drawer-header .drawer-title {
30827 display: flex;
30828 align-items: center;
30829 gap: 3px;
30830 flex-flow: row wrap;
30831 }
30832 body.rtl .steps-settings .steps-settings__tab-nav li a svg {
30833 margin-right: 0;
30834 margin-left: 8px;
30835 }
30836 body.rtl .step-settings__single-tab-content.product .product-head .product-search {
30837 margin-left: 0;
30838 margin-right: 0;
30839 }
30840 body.rtl .step-settings__single-tab-content .product-head .wpfnl-tooltip,
30841 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .wpfnl-tooltip {
30842 margin-left: 10px;
30843 margin-right: auto;
30844 }
30845 body.rtl .step-settings__single-tab-content .product-head .add-product-btn,
30846 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .add-product-btn {
30847 margin-left: 0;
30848 margin-right: 15px;
30849 }
30850 body.rtl .step-settings__single-tab-content .product-head .title,
30851 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .title {
30852 margin-right: 0;
30853 margin-left: 10px;
30854 }
30855 body.rtl .step-settings__single-tab-content .accordion-footer,
30856 body.rtl .step-settings__single-tab-content .accordion-head,
30857 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-footer,
30858 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-head {
30859 padding: 20px 60px 20px 25px;
30860 }
30861 body.rtl .step-settings__single-tab-content .product-single__accordion-head,
30862 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head {
30863 padding: 25px 60px 25px 25px;
30864 }
30865 body.rtl .step-settings__single-tab-content .accordion-footer .total-price,
30866 body.rtl .step-settings__single-tab-content .product-single__accordion-head .total-price,
30867 body.rtl .step-settings__single-tab-content .accordion-head .total-price,
30868 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-footer .total-price,
30869 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .total-price,
30870 body.rtl .checkout-product-setting-tab__content-wrapper .accordion-head .total-price {
30871 text-align: left;
30872 }
30873 body.rtl .step-settings__single-tab-content .product-single__accordion-head .product-name ul .product-title,
30874 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-name ul .product-title {
30875 padding-left: 0;
30876 padding-right: 19px;
30877 }
30878 body.rtl .step-settings__single-tab-content .product-single__accordion-head .product-action .product-edit,
30879 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head .product-action .product-edit {
30880 margin-left: 0;
30881 margin-right: 6px;
30882 }
30883 body.rtl .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .icon {
30884 margin-right: 0;
30885 margin-left: 12px;
30886 }
30887 body.rtl .order-bump-accordion-wrapper .order-bump-accordion-header .title-area .title {
30888 display: inline-flex;
30889 gap: 3px;
30890 }
30891 body.rtl .order-bump-accordion-wrapper .order-bump-accordion-header .action-area button {
30892 margin: 0 6px 0 0;
30893 }
30894 body.rtl .checkout-order-bump-setting-tab__content-wrapper .order-bump-settings-area {
30895 margin-right: 0;
30896 margin-left: 25px;
30897 }
30898 body.rtl .checkout-order-bump-setting-tab__content-wrapper .wpfnl-field-wrapper > label .color-picker {
30899 right: inherit;
30900 left: 10px;
30901 }
30902 body.rtl .wpfnl-order-bump__template-style1 .template-preview-wrapper .template-content {
30903 padding-left: 0;
30904 padding-right: 20px;
30905 }
30906 body.rtl .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label {
30907 padding-left: 0;
30908 padding-right: 26px;
30909 }
30910 body.rtl .wpfnl-order-bump__template-style1 .offer-checkbox .wpfnl-checkbox label:after {
30911 left: inherit;
30912 right: 4px;
30913 }
30914 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label {
30915 padding: 0 20px 0 0;
30916 }
30917 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .nav-arrow svg {
30918 transform: rotate(180deg);
30919 }
30920 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .nav-arrow {
30921 margin-right: 0;
30922 margin-left: 10px;
30923 animation: moveArrowRtl 1s linear infinite;
30924 }
30925 body.rtl .wpfnl-order-bump__template-style2 .template-preview-wrapper .template-content {
30926 padding-left: 0;
30927 padding-right: 20px;
30928 }
30929 body.rtl .wpfnl-order-bump__template-style2 .offer-checkbox .wpfnl-checkbox label:after {
30930 left: inherit;
30931 right: 3px;
30932 }
30933 body.rtl .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label {
30934 padding-left: 0;
30935 padding-right: 28px;
30936 }
30937 body.rtl .wpfnl-order-bump__template-style3 .offer-checkbox .wpfnl-checkbox label:after {
30938 left: inherit;
30939 right: 4px;
30940 width: 9px;
30941 height: 5px;
30942 }
30943 body.rtl .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-content {
30944 padding-left: 0;
30945 padding-right: 14px;
30946 }
30947 body.rtl .wpfnl-order-bump__template-style4 .template-preview-wrapper .template-price {
30948 padding-left: 10px;
30949 padding-right: 10px;
30950 }
30951 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label {
30952 padding-left: 50px;
30953 padding-right: 0;
30954 }
30955 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:before {
30956 left: 0;
30957 right: inherit;
30958 }
30959 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox label:after {
30960 left: 4px;
30961 right: inherit;
30962 }
30963 body.rtl .wpfnl-order-bump__template-style5 .offer-checkbox .wpfnl-checkbox input[type=checkbox]:checked + label::after {
30964 right: inherit;
30965 left: 26px;
30966 }
30967 body.rtl .wpfnl-order-bump__template-style5 .template-preview-wrapper .template-content {
30968 padding-right: 0;
30969 padding-left: 14px;
30970 }
30971 body.rtl .wpfnl-order-bump__template-style6 .template-preview-wrapper .template-content {
30972 padding-right: 0;
30973 padding-left: 20px;
30974 }
30975 body.rtl .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label {
30976 padding: 0 26px 0 0;
30977 }
30978 body.rtl .wpfnl-order-bump__template-style6 .offer-checkbox .wpfnl-checkbox label:after {
30979 left: inherit;
30980 right: 4px;
30981 width: 9px;
30982 height: 5px;
30983 }
30984 body.rtl .wpfnl-order-bump__template-style7 .template-preview-wrapper .template-content-wrapper {
30985 padding-right: 0;
30986 padding-left: 15px;
30987 }
30988 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .nav-arrow {
30989 margin-right: 0;
30990 margin-left: 10px;
30991 }
30992 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label {
30993 padding: 0 20px 0 0;
30994 }
30995 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .wpfnl-checkbox label:after {
30996 left: inherit;
30997 right: 2px;
30998 top: 5px;
30999 width: 6px;
31000 height: 3px;
31001 }
31002 body.rtl .wpfnl-order-bump__template-style8 .offer-checkbox .nav-arrow svg {
31003 transform: rotate(180deg);
31004 }
31005 body.rtl .wpfnl-order-bump__template-style9 .template-preview-wrapper .template-content {
31006 padding-right: 20px;
31007 padding-left: 0;
31008 }
31009 body.rtl .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label {
31010 padding: 0 26px 0 0;
31011 }
31012 body.rtl .wpfnl-order-bump__template-style9 .offer-checkbox .wpfnl-checkbox label:after {
31013 right: 3px;
31014 left: inherit;
31015 }
31016 body.rtl .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title {
31017 padding-left: 15px;
31018 padding-right: 0;
31019 }
31020 body.rtl .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .nav-arrow {
31021 top: 2px;
31022 margin-left: 7px;
31023 margin-right: 0;
31024 }
31025 body.rtl .wpfnl-order-bump__template-style10 .template-preview-wrapper .template-title .nav-arrow svg {
31026 transform: rotate(-180deg);
31027 }
31028 body.rtl .wpfnl-order-bump__template-style10 .offer-checkbox {
31029 text-align: left;
31030 }
31031 body.rtl .wpfnl-order-bump__template-style11 .template-preview-wrapper .template-title-area .product-price {
31032 text-align: left;
31033 }
31034 body.rtl .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label {
31035 padding: 0 26px 0 0;
31036 }
31037 body.rtl .wpfnl-order-bump__template-style11 .offer-checkbox .wpfnl-checkbox label:after {
31038 right: 4px;
31039 left: inherit;
31040 }
31041 body.rtl .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-img {
31042 margin: 0 0 6px 16px;
31043 float: right;
31044 }
31045 body.rtl .wpfnl-order-bump__template-style12 .template-preview-wrapper .template-content {
31046 clear: left;
31047 }
31048 body.rtl .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label {
31049 padding-right: 26px;
31050 padding-left: 0;
31051 }
31052 body.rtl .wpfnl-order-bump__template-style12 .offer-checkbox .wpfnl-checkbox label:after {
31053 right: 4px;
31054 left: inherit;
31055 }
31056 body.rtl .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label {
31057 padding-right: 26px;
31058 padding-left: 0;
31059 }
31060 body.rtl .wpfnl-order-bump__template-style13 .offer-checkbox .wpfnl-checkbox label:after {
31061 right: 4px;
31062 left: inherit;
31063 }
31064 body.rtl .wpfnl-order-bump__template-style13 .product-price {
31065 margin-right: 5px;
31066 margin-left: 0;
31067 }
31068 body.rtl .wpfnl-order-bump__template-style13 .template-preview-wrapper .template-content {
31069 padding-right: 20px;
31070 padding-left: 0;
31071 }
31072 body.rtl .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label {
31073 padding: 0 26px 0 0;
31074 }
31075 body.rtl .wpfnl-order-bump__template-style14 .offer-checkbox .wpfnl-checkbox label:after {
31076 right: 3px;
31077 left: inherit;
31078 }
31079 body.rtl .wpfnl-order-bump__template-style14 .template-preview-wrapper .template-content {
31080 padding-right: 20px;
31081 padding-left: 0;
31082 }
31083 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.restore-btn {
31084 margin-right: auto;
31085 margin-left: 0;
31086 }
31087 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav li.add-new-checkout-field-btn {
31088 margin-right: 20px;
31089 margin-left: 0;
31090 }
31091 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-settings__tab-nav {
31092 padding: 23px 0 23px 20px;
31093 }
31094 body.rtl .edit-field-settings__single-tab-content .checkout-field-header {
31095 padding: 20px 65px 20px 20px;
31096 }
31097 body.rtl .edit-field-settings__single-tab-content .checkout__single-field {
31098 padding: 25px 65px 25px 20px;
31099 }
31100 body.rtl .edit-field-settings__single-tab-content .checkout-field-header .field-hamburger,
31101 body.rtl .edit-field-settings__single-tab-content .checkout__single-field .field-hamburger {
31102 right: 20px;
31103 left: inherit;
31104 }
31105 body.rtl .wpfnl-step-settings-drawer.edit-field-drawer.show-edit-field-drawer {
31106 right: inherit;
31107 left: 0;
31108 }
31109 body.rtl .checkout-edit-field-tab__content-wrapper .edit-field-drawer .drawer-body .wpfnl-field-wrapper .wpfnl-checkbox label {
31110 padding-right: 33px;
31111 padding-left: 0;
31112 }
31113 body.rtl .step-settings__single-tab-content .product-head .product-search,
31114 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .product-search {
31115 margin-left: 0;
31116 margin-right: auto;
31117 }
31118 body.rtl .step-settings__single-tab-content .product-head .product-search .select2-selection__rendered,
31119 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .product-search .select2-selection__rendered {
31120 padding: 10px 35px 10px 10px;
31121 }
31122 body.rtl .step-settings__single-tab-content .product-head .product-search .search-icon,
31123 body.rtl .checkout-product-setting-tab__content-wrapper .product-head .product-search .search-icon {
31124 left: inherit;
31125 right: 10px;
31126 }
31127 body.rtl .steps-settings .settings-content__footer .btn-default .wpfnl-loader {
31128 margin-left: 0;
31129 margin-right: 6px;
31130 }
31131 @keyframes moveArrowRtl {
31132 0%, 100% {
31133 transform: translateX(8px);
31134 opacity: 1;
31135 }
31136 50%, 90% {
31137 transform: translateX(-15px);
31138 opacity: 0;
31139 }
31140 99% {
31141 transform: translateX(8px);
31142 opacity: 0;
31143 }
31144 }
31145
31146 @media only screen and (max-width: 1199px) {
31147 body.rtl .step-settings__single-tab-content .product-single__accordion-head,
31148 body.rtl .checkout-product-setting-tab__content-wrapper .product-single__accordion-head {
31149 padding: 20px 50px 20px 20px;
31150 }
31151 }
31152 body.rtl .wpfnl-selectbox .selected-option {
31153 padding: 13px 14px 11px 30px;
31154 }
31155 body.rtl .wpfnl-selectbox .selected-option:before {
31156 left: 14px;
31157 right: inherit;
31158 }
31159 body.rtl .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .selected-option {
31160 padding: 14px 14px 12px 30px;
31161 }
31162 body.rtl .step-condition-drawer .false-condition-wapper .next-step-box .wpfnl-selectbox .add-item-step button svg {
31163 transform: rotate(-180deg);
31164 }
31165
31166 body.rtl .ab-testing-drawer .header-left .ab-testing-status {
31167 margin-left: 0;
31168 margin-right: 8px;
31169 }
31170 body.rtl .wpfnl-step-settings-drawer .drawer-header .wpfnl-drawer-close svg {
31171 transform: rotate(180deg);
31172 }
31173 body.rtl .ab-testing-drawer .header-right .more-options .options-dropdown {
31174 left: -10px;
31175 right: inherit;
31176 }
31177 body.rtl .ab-testing-drawer .traffic-distribution-modal {
31178 right: inherit;
31179 left: 0;
31180 }
31181 body.rtl .ab-testing-drawer .traffic-distribution-modal .traffic-distribution-modal-body .variation-single-list .variation-step-title .variation-type {
31182 margin-left: 0;
31183 margin-right: 8px;
31184 }
31185 body.rtl .ab-testing-drawer .header-right .btn-default .wpfnl-loader {
31186 margin: 0;
31187 }
31188 body.rtl .ab-testing-stats .stats-wrapper thead th .col-inner-wrap {
31189 text-align: right;
31190 }
31191 body.rtl .ab-testing-drawer .ab-testing-winner-modal {
31192 right: inherit;
31193 left: 0;
31194 }
31195 body.rtl .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label {
31196 padding-right: 29px;
31197 padding-left: 0;
31198 }
31199 body.rtl .ab-testing-drawer .ab-testing-winner-modal .ab-testing-winner-modal-body .wpfnl-checkbox label:after {
31200 right: 3px;
31201 left: inherit;
31202 }
31203 body.rtl .ab-testing-drawer .single-ab-step .step-control-button .options-dropdown {
31204 left: inherit;
31205 right: 0;
31206 }
31207 body.rtl .ab-testing-drawer .single-ab-step .variation-type {
31208 right: 15px;
31209 left: inherit;
31210 }
31211 body.rtl .ab-testing-drawer .single-ab-step .ab-variation-delete {
31212 right: inherit;
31213 left: -8px;
31214 }
31215 body.rtl .ab-testing-drawer .add-step-wrapper .add-steps-options,
31216 body.rtl .wpfnl-drawing-window .addstep .add-step-wrapper .add-steps-options {
31217 right: calc(100% + 15px);
31218 left: inherit;
31219 }
31220 body.rtl .ab-testing-drawer .add-step-wrapper .add-steps-options {
31221 right: calc(100% + 15px);
31222 left: inherit;
31223 }
31224 body.rtl .ab-testing-drawer .ab-testing-confirmation-modal {
31225 right: 160px;
31226 left: inherit;
31227 }
31228 body.rtl .folded .ab-testing-drawer .ab-testing-confirmation-modal {
31229 right: 36px;
31230 left: inherit;
31231 }
31232 body.rtl .ab-testing-drawer .ab-testing-confirmation-modal .close-confirmation-modal {
31233 left: -13px;
31234 right: inherit;
31235 }
31236
31237 body.rtl .wpfnl-webhook-drawer .drawer-header .webhook-search {
31238 margin-right: auto;
31239 margin-left: 0;
31240 }
31241 body.rtl .wpfnl-webhook-drawer .drawer-header .webhook-search input[type=text] {
31242 padding-right: 34px;
31243 margin-left: 15px;
31244 }
31245 body.rtl .wpfnl-webhook-drawer .drawer-header .webhook-search svg {
31246 right: 14px;
31247 left: inherit;
31248 }
31249 body.rtl .webhook-settings-drawer .wpfnl-field-wrapper .wpfnl-fields .link-icon {
31250 border-left: 1px solid #EEF0F3;
31251 border-right: 0;
31252 }
31253 body.rtl .webhook-settings-drawer .request-url input[type=text] {
31254 padding-right: 50px;
31255 padding-left: 15px;
31256 }
31257 body.rtl .webhook-settings-drawer .wpfnl-field-wrapper select {
31258 padding-left: 36px;
31259 padding-right: 15px;
31260 background-position-x: 15px;
31261 }
31262 body.rtl .webhook-settings-drawer .additional-settings .request-body .wpfnl-radiobtn label::after {
31263 right: 6px;
31264 left: inherit;
31265 }
31266 body.rtl .wpfnl-webhook-drawer .drawer-body .wpfnl-field-wrapper > label.has-tooltip .wpfnl-tooltip {
31267 margin-right: 3px;
31268 margin-left: 0;
31269 }
31270 body.rtl .webhook-settings-drawer .feed-name .wpfnl-tooltip p {
31271 right: calc(100% + 8px);
31272 left: inherit;
31273 }
31274 body.rtl .webhook-settings-drawer .feed-name .wpfnl-tooltip p:before {
31275 right: -4px;
31276 left: inherit;
31277 }
31278 body.rtl .wpfnl-webhook-drawer .webhook-list-wrapper .webhook-single-list .action-field button {
31279 margin-right: 2px;
31280 margin-left: 0;
31281 }
31282 body.rtl .delete-alert-new-ui .wpfnl-delete-confirm-body {
31283 padding: 26px 26px 26px 20px;
31284 }
31285
31286 body.rtl .wpfnl-drawflow-window .wpfnl-analytics {
31287 right: inherit;
31288 left: 0px;
31289 }
31290 body.rtl .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .backto-steps svg {
31291 transform: rotate(180deg);
31292 }
31293 body.rtl .wpfnl-drawflow-window .wpfnl-analytics .analytics-header .header-right select {
31294 padding: 14px 20px 12px 40px;
31295 background-position-x: 15px;
31296 }
31297 body.rtl .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
31298 right: 160px;
31299 left: inherit;
31300 }
31301 body.rtl.folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
31302 right: 36px;
31303 left: inherit;
31304 }
31305 body.rtl .wpfnl-analytics .analytics-revenue .revenue-box-header .stat-indicator .indicator:before {
31306 margin-left: 8px;
31307 margin-right: 0;
31308 }
31309 body.rtl .wpfnl-analytics .analytics-revenue .single-tab-content .barchart-inner-wrapper {
31310 padding: 10px 60px 9px 15px;
31311 }
31312 body.rtl .wpfnl-analytics .analytics-revenue .single-tab-content .chart-percent-label .single-label:before {
31313 right: 50px;
31314 left: inherit;
31315 }
31316 body.rtl .wpfnl-analytics .analytics-conversion .conversion-box-header .carousel-navigator {
31317 direction: ltr;
31318 }
31319
31320 @media only screen and (max-width: 782px) {
31321 body.rtl.folded .wpfnl-drawflow-window .wpfnl-analytics .analytics-full-loader {
31322 right: 0;
31323 left: inherit;
31324 }
31325 }
31326 body.rtl .wpfnl-dashboard__header .funnel-search {
31327 margin-left: 20px;
31328 margin-right: 0;
31329 }
31330 body.rtl .wpfnl-dashboard__header .funnel-search .search-group input {
31331 padding-right: 40px;
31332 padding-left: 0;
31333 }
31334 body.rtl .wpfnl-dashboard__header .funnel-search .search-group svg {
31335 right: 12px;
31336 left: inherit;
31337 }
31338 body.rtl .wpfnl-dashboard__header a.import-export {
31339 margin-left: 14px;
31340 margin-right: 0;
31341 }
31342 body.rtl .wpfnl-dashboard__header a.import-export.wpfnl-export-all-funnels {
31343 margin-left: 14px;
31344 margin-right: auto;
31345 }
31346 body.rtl .wpfnl-dashboard__header .add-new-funnel-btn svg {
31347 margin-left: 3px;
31348 margin-right: 0;
31349 }
31350 body.rtl .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
31351 right: 24px;
31352 left: inherit;
31353 }
31354 body.rtl .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper {
31355 right: 60px;
31356 left: inherit;
31357 }
31358 body.rtl .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler > svg {
31359 margin-right: 16px;
31360 margin-left: 0;
31361 }
31362 body.rtl .funnel-list__wrapper .funnel__single-list .bulk-action-wrapper .bulk-delete-toggler:before {
31363 left: 27px;
31364 right: inherit;
31365 }
31366 body.rtl .funnel-list__wrapper .funnel__single-list.list-header {
31367 padding: 15px 60px 15px 24px;
31368 }
31369 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-name {
31370 padding-right: 45px;
31371 padding-left: 15px;
31372 }
31373 body.rtl .funnel-list__wrapper .funnel__single-list {
31374 padding: 14px 60px 14px 24px;
31375 }
31376 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-name .builder-logo {
31377 right: 0;
31378 left: inherit;
31379 }
31380 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-intigrations .automation-tag svg {
31381 margin-left: 6px;
31382 margin-right: 0;
31383 }
31384 body.rtl .funnel-list__wrapper .funnel__single-list .list-action ul.more-actions {
31385 left: -22px;
31386 right: inherit;
31387 }
31388 body.rtl .wpfnl-pagination .nav-link.prev svg,
31389 body.rtl .wpfnl-pagination .nav-link.next svg {
31390 transform: rotate(180deg);
31391 }
31392
31393 @media only screen and (max-width: 1199px) {
31394 body.rtl .funnel-list__wrapper .funnel__single-list.list-header {
31395 padding: 15px 45px 15px 15px;
31396 }
31397 body.rtl .funnel-list__wrapper .funnel__single-list {
31398 padding: 10px 45px 10px 15px;
31399 }
31400 body.rtl .funnel-list__wrapper .funnel__single-list .funnel-list__bulk-action {
31401 right: 15px;
31402 }
31403 body.rtl .funnel-list__wrapper .funnel__single-list .wpfnl-name {
31404 padding-left: 10px;
31405 }
31406 }
31407 body.rtl .mailmint-automation .header-right .more-options .options-dropdown {
31408 left: -10px;
31409 right: inherit;
31410 }
31411 body.rtl .mailmint-automation .automation-single-step .delete-action {
31412 left: -10px;
31413 right: inherit;
31414 }
31415 body.rtl .wpfnl-custom-selectbox .selectbox-search input[type=search] {
31416 padding: 6px 36px 4px 15px;
31417 }
31418 body.rtl .wpfnl-custom-selectbox .selectbox-search .search-icon {
31419 right: 25px;
31420 left: inherit;
31421 }
31422 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .submenu {
31423 right: 100%;
31424 left: inherit;
31425 }
31426 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .wpfnl-selectbox .angle-right {
31427 left: 9px;
31428 right: inherit;
31429 transform: rotate(90deg);
31430 }
31431 body.rtl .mailmint-automation .steps-settings-sidebar .vue-datpicker .dp__input {
31432 padding: 11px 32px 9px 20px;
31433 }
31434 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules:before {
31435 left: 8px;
31436 right: inherit;
31437 }
31438 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .condition-symbol {
31439 left: -4px;
31440 right: inherit;
31441 }
31442 body.rtl .mailmint-automation .steps-settings-sidebar .logical-condition .rules-wrapper .single-rules .rules-actions::before {
31443 left: -30px;
31444 right: inherit;
31445 }
31446 body.rtl .mailmint-automation .steps-settings-sidebar .steps-settings .form-group select {
31447 padding-left: 38px;
31448 padding-right: 15px;
31449 background-position-x: 15px;
31450 }
31451 body.rtl .mailmint-automation .steps-settings-sidebar .webhook-outgoing .current-user-repeater > hr {
31452 right: -15px;
31453 left: inherit;
31454 }
31455 body.rtl .mailmint-automation .steps-settings-sidebar .add-template-section .add-template > span svg {
31456 margin-left: 0;
31457 margin-right: 8px;
31458 transform: rotate(180deg);
31459 }
31460 body.rtl .wpfnl-mrm-email-template__wrapper {
31461 left: 0;
31462 right: inherit;
31463 }
31464 body.rtl .wpfnl-mrm-email-template__modal .cross-icon {
31465 left: -20px;
31466 right: inherit;
31467 }
31468 body.rtl .mailmint-automation .logical-decision-box .single-decision.decision-yes {
31469 transform: translateX(calc(-50% + 1px));
31470 }
31471 body.rtl .mailmint-automation .logical-decision-box .single-decision.decision-no {
31472 transform: translateX(calc(50% - 1px));
31473 }
31474 body.rtl .mailmint-automation .logical-decision-box .logical-text {
31475 left: 25%;
31476 right: inherit;
31477 }
31478 body.rtl .mailmint-automation .logical-decision-box .logical-text.logical-no-text {
31479 right: 25%;
31480 left: inherit;
31481 }
31482
31483 body.rtl .wpfnl-settings-drawer .fnl-settings-content .settings-title > svg {
31484 margin-left: 10px;
31485 margin-right: 0;
31486 }
31487 body.rtl .wpfnl-settings-drawer .fnl-settings-content #wpfnl-utm .wpfnl-field-wrapper {
31488 padding-left: 30px;
31489 margin-right: 0;
31490 }
31491 body.rtl .wpfnl-settings-drawer .fnl-settings-content .settings-title a {
31492 margin-right: auto;
31493 margin-left: 0;
31494 }
31495
31496 body.rtl .wpfnl-automation-window .automation-darwer {
31497 left: -190px;
31498 right: inherit;
31499 }
31500 body.rtl .wpfnl-automation-window .automation-darwer.show-drawer {
31501 left: 0;
31502 right: inherit;
31503 }
31504 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper label {
31505 padding-left: 7px;
31506 padding-right: 0;
31507 }
31508 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .automation-name-wrapper > button {
31509 margin-right: 10px;
31510 margin-left: 0;
31511 }
31512 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm {
31513 margin-right: 30px;
31514 margin-left: 0;
31515 }
31516 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .wpfnl-drawer-close {
31517 margin-right: auto;
31518 margin-left: 0;
31519 }
31520 body.rtl .wpfnl-automation-window .automation-darwer .drawer-header .connect-crm .connect-crm-title {
31521 padding-left: 7px;
31522 padding-right: 0;
31523 }
31524
31525 /*# sourceMappingURL=wpfnl-admin.css.map */
31526