PluginProbe
Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant / 1.11.2
Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant v1.11.2
2.3.1 2.3.0 2.2.8 2.2.7 trunk 1.10.0 1.10.1 1.10.2 1.10.3 1.10.4 1.10.5 1.11.0 1.11.1 1.11.2 1.6 1.7 1.8 1.8.1 1.8.2 1.8.3 1.9.0 1.9.1 1.9.10 1.9.11 1.9.12 All 59 releases
merchant / assets / css / admin / admin.css

admin.css in Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant 1.11.2, at assets/css/admin/admin.css

5,698 lines 157.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* Utilities */
2 .mrc-w-100 {
3 width: 100% !important;
4 }
5
6 .mrc-mb-0 {
7 margin-bottom: 0;
8 }
9
10 .mrc-mt-0 {
11 margin-top: 0;
12 }
13
14 .merchant-animated-buttons .merchant-button-flash:hover {
15 -webkit-animation: merchant-flash 1s infinite both;
16 animation: merchant-flash 1s infinite both;
17 -webkit-animation-iteration-count: 1;
18 animation-iteration-count: 1;
19 }
20 .merchant-animated-buttons .merchant-button-bounce:hover {
21 -webkit-animation: merchant-bounce 0.3s alternate;
22 animation: merchant-bounce 0.3s alternate;
23 -webkit-animation-iteration-count: 4;
24 animation-iteration-count: 4;
25 }
26 .merchant-animated-buttons .merchant-button-zoom-in:hover {
27 -webkit-transform: scale(1.2);
28 transform: scale(1.2);
29 }
30 .merchant-animated-buttons .merchant-button-shake:hover {
31 -webkit-animation: merchant-shake 0.3s;
32 animation: merchant-shake 0.3s;
33 -webkit-animation-iteration-count: 2;
34 animation-iteration-count: 2;
35 }
36 .merchant-animated-buttons .merchant-button-pulse:hover {
37 -webkit-animation: merchant-pulse 1.5s ease-in-out infinite both;
38 animation: merchant-pulse 1.5s ease-in-out infinite both;
39 }
40 .merchant-animated-buttons .merchant-button-jello-shake:hover {
41 -webkit-animation: merchant-jello-shake 1.5s infinite both;
42 animation: merchant-jello-shake 1.5s infinite both;
43 }
44 .merchant-animated-buttons .merchant-button-wobble:hover {
45 -webkit-animation: merchant-wobble 1.5s ease-in-out infinite both;
46 animation: merchant-wobble 1.5s ease-in-out infinite both;
47 }
48 .merchant-animated-buttons .merchant-button-vibrate:hover {
49 -webkit-animation: merchant-vibrate 0.3s linear 4 both;
50 animation: merchant-vibrate 0.3s linear 4 both;
51 }
52 .merchant-animated-buttons .merchant-button-swing:hover {
53 -webkit-animation: merchant-swing 2s ease-in-out infinite alternate;
54 animation: merchant-swing 2s ease-in-out infinite alternate;
55 }
56 .merchant-animated-buttons .merchant-button-tada:hover {
57 -webkit-animation: merchant-tada 1s infinite both;
58 animation: merchant-tada 1s infinite both;
59 }
60
61 @-webkit-keyframes merchant-flash {
62 0%, 50%, to {
63 opacity: 1;
64 }
65 25%, 75% {
66 opacity: 0;
67 }
68 }
69
70 @keyframes merchant-flash {
71 0%, 50%, to {
72 opacity: 1;
73 }
74 25%, 75% {
75 opacity: 0;
76 }
77 }
78 @-webkit-keyframes merchant-bounce {
79 to {
80 -webkit-transform: scale(1.2);
81 transform: scale(1.2);
82 }
83 }
84 @keyframes merchant-bounce {
85 to {
86 -webkit-transform: scale(1.2);
87 transform: scale(1.2);
88 }
89 }
90 @-webkit-keyframes merchant-shake {
91 33% {
92 -webkit-transform: rotate(10deg);
93 transform: rotate(10deg);
94 }
95 67% {
96 -webkit-transform: rotate(-10deg);
97 transform: rotate(-10deg);
98 }
99 to {
100 -webkit-transform: rotate(10deg);
101 transform: rotate(10deg);
102 }
103 }
104 @keyframes merchant-shake {
105 33% {
106 -webkit-transform: rotate(10deg);
107 transform: rotate(10deg);
108 }
109 67% {
110 -webkit-transform: rotate(-10deg);
111 transform: rotate(-10deg);
112 }
113 to {
114 -webkit-transform: rotate(10deg);
115 transform: rotate(10deg);
116 }
117 }
118 @-webkit-keyframes merchant-pulse {
119 0% {
120 -webkit-animation-timing-function: ease-out;
121 animation-timing-function: ease-out;
122 -webkit-transform: scale(1);
123 transform: scale(1);
124 -webkit-transform-origin: center center;
125 transform-origin: center center;
126 }
127 10% {
128 -webkit-animation-timing-function: ease-in;
129 animation-timing-function: ease-in;
130 -webkit-transform: scale(0.91);
131 transform: scale(0.91);
132 }
133 17% {
134 -webkit-animation-timing-function: ease-out;
135 animation-timing-function: ease-out;
136 -webkit-transform: scale(0.98);
137 transform: scale(0.98);
138 }
139 33% {
140 -webkit-animation-timing-function: ease-in;
141 animation-timing-function: ease-in;
142 -webkit-transform: scale(0.87);
143 transform: scale(0.87);
144 }
145 45% {
146 -webkit-animation-timing-function: ease-out;
147 animation-timing-function: ease-out;
148 -webkit-transform: scale(1);
149 transform: scale(1);
150 }
151 }
152 @keyframes merchant-pulse {
153 0% {
154 -webkit-animation-timing-function: ease-out;
155 animation-timing-function: ease-out;
156 -webkit-transform: scale(1);
157 transform: scale(1);
158 -webkit-transform-origin: center center;
159 transform-origin: center center;
160 }
161 10% {
162 -webkit-animation-timing-function: ease-in;
163 animation-timing-function: ease-in;
164 -webkit-transform: scale(0.91);
165 transform: scale(0.91);
166 }
167 17% {
168 -webkit-animation-timing-function: ease-out;
169 animation-timing-function: ease-out;
170 -webkit-transform: scale(0.98);
171 transform: scale(0.98);
172 }
173 33% {
174 -webkit-animation-timing-function: ease-in;
175 animation-timing-function: ease-in;
176 -webkit-transform: scale(0.87);
177 transform: scale(0.87);
178 }
179 45% {
180 -webkit-animation-timing-function: ease-out;
181 animation-timing-function: ease-out;
182 -webkit-transform: scale(1);
183 transform: scale(1);
184 }
185 }
186 @-webkit-keyframes merchant-jello-shake {
187 0% {
188 -webkit-transform: scaleX(1);
189 transform: scaleX(1);
190 }
191 30% {
192 -webkit-transform: scale3d(1.25, 0.75, 1);
193 transform: scale3d(1.25, 0.75, 1);
194 }
195 40% {
196 -webkit-transform: scale3d(0.75, 1.25, 1);
197 transform: scale3d(0.75, 1.25, 1);
198 }
199 50% {
200 -webkit-transform: scale3d(1.15, 0.85, 1);
201 transform: scale3d(1.15, 0.85, 1);
202 }
203 65% {
204 -webkit-transform: scale3d(0.95, 1.05, 1);
205 transform: scale3d(0.95, 1.05, 1);
206 }
207 75% {
208 -webkit-transform: scale3d(1.05, 0.95, 1);
209 transform: scale3d(1.05, 0.95, 1);
210 }
211 to {
212 -webkit-transform: scaleX(1);
213 transform: scaleX(1);
214 }
215 }
216 @keyframes merchant-jello-shake {
217 0% {
218 -webkit-transform: scaleX(1);
219 transform: scaleX(1);
220 }
221 30% {
222 -webkit-transform: scale3d(1.25, 0.75, 1);
223 transform: scale3d(1.25, 0.75, 1);
224 }
225 40% {
226 -webkit-transform: scale3d(0.75, 1.25, 1);
227 transform: scale3d(0.75, 1.25, 1);
228 }
229 50% {
230 -webkit-transform: scale3d(1.15, 0.85, 1);
231 transform: scale3d(1.15, 0.85, 1);
232 }
233 65% {
234 -webkit-transform: scale3d(0.95, 1.05, 1);
235 transform: scale3d(0.95, 1.05, 1);
236 }
237 75% {
238 -webkit-transform: scale3d(1.05, 0.95, 1);
239 transform: scale3d(1.05, 0.95, 1);
240 }
241 to {
242 -webkit-transform: scaleX(1);
243 transform: scaleX(1);
244 }
245 }
246 @-webkit-keyframes merchant-wobble {
247 0%, to {
248 -webkit-transform: translateX(0);
249 transform: translateX(0);
250 -webkit-transform-origin: 50% 50%;
251 transform-origin: 50% 50%;
252 }
253 15% {
254 -webkit-transform: translateX(-30px) rotate(-6deg);
255 transform: translateX(-30px) rotate(-6deg);
256 }
257 30% {
258 -webkit-transform: translateX(15px) rotate(6deg);
259 transform: translateX(15px) rotate(6deg);
260 }
261 45% {
262 -webkit-transform: translateX(-15px) rotate(-3.6deg);
263 transform: translateX(-15px) rotate(-3.6deg);
264 }
265 60% {
266 -webkit-transform: translateX(9px) rotate(2.4deg);
267 transform: translateX(9px) rotate(2.4deg);
268 }
269 75% {
270 -webkit-transform: translateX(-6px) rotate(-1.2deg);
271 transform: translateX(-6px) rotate(-1.2deg);
272 }
273 }
274 @keyframes merchant-wobble {
275 0%, to {
276 -webkit-transform: translateX(0);
277 transform: translateX(0);
278 -webkit-transform-origin: 50% 50%;
279 transform-origin: 50% 50%;
280 }
281 15% {
282 -webkit-transform: translateX(-30px) rotate(-6deg);
283 transform: translateX(-30px) rotate(-6deg);
284 }
285 30% {
286 -webkit-transform: translateX(15px) rotate(6deg);
287 transform: translateX(15px) rotate(6deg);
288 }
289 45% {
290 -webkit-transform: translateX(-15px) rotate(-3.6deg);
291 transform: translateX(-15px) rotate(-3.6deg);
292 }
293 60% {
294 -webkit-transform: translateX(9px) rotate(2.4deg);
295 transform: translateX(9px) rotate(2.4deg);
296 }
297 75% {
298 -webkit-transform: translateX(-6px) rotate(-1.2deg);
299 transform: translateX(-6px) rotate(-1.2deg);
300 }
301 }
302 @-webkit-keyframes merchant-vibrate {
303 0% {
304 -webkit-transform: translate(0);
305 transform: translate(0);
306 }
307 20% {
308 -webkit-transform: translate(-2px, 2px);
309 transform: translate(-2px, 2px);
310 }
311 40% {
312 -webkit-transform: translate(-2px, -2px);
313 transform: translate(-2px, -2px);
314 }
315 60% {
316 -webkit-transform: translate(2px, 2px);
317 transform: translate(2px, 2px);
318 }
319 80% {
320 -webkit-transform: translate(2px, -2px);
321 transform: translate(2px, -2px);
322 }
323 to {
324 -webkit-transform: translate(0);
325 transform: translate(0);
326 }
327 }
328 @keyframes merchant-vibrate {
329 0% {
330 -webkit-transform: translate(0);
331 transform: translate(0);
332 }
333 20% {
334 -webkit-transform: translate(-2px, 2px);
335 transform: translate(-2px, 2px);
336 }
337 40% {
338 -webkit-transform: translate(-2px, -2px);
339 transform: translate(-2px, -2px);
340 }
341 60% {
342 -webkit-transform: translate(2px, 2px);
343 transform: translate(2px, 2px);
344 }
345 80% {
346 -webkit-transform: translate(2px, -2px);
347 transform: translate(2px, -2px);
348 }
349 to {
350 -webkit-transform: translate(0);
351 transform: translate(0);
352 }
353 }
354 @-webkit-keyframes merchant-swing {
355 0% {
356 -webkit-transform: rotate(0deg);
357 transform: rotate(0deg);
358 }
359 20% {
360 -webkit-transform: rotate(3deg);
361 transform: rotate(3deg);
362 }
363 40% {
364 -webkit-transform: rotate(-3deg);
365 transform: rotate(-3deg);
366 }
367 60% {
368 -webkit-transform: rotate(3deg);
369 transform: rotate(3deg);
370 }
371 80% {
372 -webkit-transform: rotate(-3deg);
373 transform: rotate(-3deg);
374 }
375 to {
376 -webkit-transform: rotate(0deg);
377 transform: rotate(0deg);
378 }
379 }
380 @keyframes merchant-swing {
381 0% {
382 -webkit-transform: rotate(0deg);
383 transform: rotate(0deg);
384 }
385 20% {
386 -webkit-transform: rotate(3deg);
387 transform: rotate(3deg);
388 }
389 40% {
390 -webkit-transform: rotate(-3deg);
391 transform: rotate(-3deg);
392 }
393 60% {
394 -webkit-transform: rotate(3deg);
395 transform: rotate(3deg);
396 }
397 80% {
398 -webkit-transform: rotate(-3deg);
399 transform: rotate(-3deg);
400 }
401 to {
402 -webkit-transform: rotate(0deg);
403 transform: rotate(0deg);
404 }
405 }
406 @-webkit-keyframes merchant-tada {
407 0% {
408 -webkit-transform: scaleX(1);
409 transform: scaleX(1);
410 }
411 10%, 20% {
412 -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
413 transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
414 }
415 30%, 50%, 70%, 90% {
416 -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
417 transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
418 }
419 40%, 60%, 80% {
420 -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
421 transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
422 }
423 to {
424 -webkit-transform: scaleX(1);
425 transform: scaleX(1);
426 }
427 }
428 @keyframes merchant-tada {
429 0% {
430 -webkit-transform: scaleX(1);
431 transform: scaleX(1);
432 }
433 10%, 20% {
434 -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
435 transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
436 }
437 30%, 50%, 70%, 90% {
438 -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
439 transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
440 }
441 40%, 60%, 80% {
442 -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
443 transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
444 }
445 to {
446 -webkit-transform: scaleX(1);
447 transform: scaleX(1);
448 }
449 }
450 .merchant-pcr-app * {
451 outline: none;
452 border: none;
453 -webkit-box-sizing: border-box;
454 box-sizing: border-box;
455 }
456
457 .merchant-pcr-app input:focus,
458 .merchant-pcr-app input.pcr-active,
459 .merchant-pcr-app button:focus,
460 .merchant-pcr-app button.pcr-active {
461 -webkit-box-shadow: none;
462 box-shadow: none;
463 }
464
465 .merchant-pcr-app .pcr-palette:focus,
466 .merchant-pcr-app .pcr-slider:focus {
467 -webkit-box-shadow: none;
468 box-shadow: none;
469 }
470
471 .merchant-pcr-app {
472 position: fixed;
473 z-index: 999999;
474 top: 0;
475 left: 0;
476 display: -webkit-box;
477 display: -ms-flexbox;
478 display: flex;
479 -webkit-box-orient: vertical;
480 -webkit-box-direction: normal;
481 -ms-flex-direction: column;
482 flex-direction: column;
483 border-radius: 0.1em;
484 opacity: 0;
485 visibility: hidden;
486 -webkit-transition: opacity 0.2s, visibility 0s 0.2s;
487 transition: opacity 0.2s, visibility 0s 0.2s;
488 -webkit-box-shadow: 0 0.15em 1.5em 0 rgba(0, 0, 0, 0.1), 0 0 1em 0 rgba(0, 0, 0, 0.03);
489 box-shadow: 0 0.15em 1.5em 0 rgba(0, 0, 0, 0.1), 0 0 1em 0 rgba(0, 0, 0, 0.03);
490 background: #fff;
491 }
492
493 .merchant-pcr-app.visible {
494 visibility: visible;
495 opacity: 1;
496 -webkit-transition: opacity 0.2s;
497 transition: opacity 0.2s;
498 }
499
500 .merchant-pcr-app .pcr-swatches {
501 display: -webkit-box;
502 display: -ms-flexbox;
503 display: flex;
504 -webkit-box-pack: justify;
505 -ms-flex-pack: justify;
506 justify-content: space-between;
507 }
508
509 .merchant-pcr-app .pcr-swatches > button {
510 cursor: pointer;
511 font-size: 1em;
512 position: relative;
513 z-index: 1;
514 width: 20px;
515 height: 20px;
516 margin: 0;
517 padding: 0;
518 background: none;
519 }
520
521 .merchant-pcr-app .pcr-swatches > button::before {
522 position: absolute;
523 content: "";
524 top: 0;
525 left: 0;
526 bottom: 0;
527 right: 0;
528 background-image: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
529 background-size: 6px;
530 border-radius: 20px;
531 border: 1px solid transparent;
532 z-index: -1;
533 }
534
535 .merchant-pcr-app .pcr-swatches > button::after {
536 content: "";
537 position: absolute;
538 z-index: 1;
539 top: 0;
540 left: 0;
541 right: 0;
542 bottom: 0;
543 border-radius: 20px;
544 border: 1px solid rgba(0, 0, 0, 0.3);
545 background: var(--pcr-color);
546 }
547
548 .merchant-pcr-app .pcr-interaction {
549 display: -webkit-box;
550 display: -ms-flexbox;
551 display: flex;
552 grid-gap: 5px;
553 }
554
555 .merchant-pcr-app .pcr-interaction input {
556 font-size: 11px;
557 border-radius: 3px;
558 }
559 .merchant-pcr-app .pcr-interaction input:focus {
560 border-color: #3858E9;
561 }
562
563 .merchant-pcr-app .pcr-interaction .pcr-result {
564 -webkit-box-flex: 1;
565 -ms-flex: 1;
566 flex: 1;
567 margin: 0;
568 width: 100%;
569 max-width: 100%;
570 }
571
572 .merchant-pcr-app .pcr-interaction .pcr-clear {
573 cursor: pointer;
574 margin: 0;
575 padding: 0 10px;
576 border-radius: 3px;
577 color: #fff;
578 background-color: #3858E9;
579 text-transform: uppercase;
580 }
581
582 .merchant-pcr-app .pcr-selection .pcr-picker {
583 -webkit-user-select: none;
584 -moz-user-select: none;
585 -ms-user-select: none;
586 user-select: none;
587 position: absolute;
588 height: 16px;
589 width: 16px;
590 border-radius: 16px;
591 background-color: #fff !important;
592 -webkit-box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.2);
593 box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.2);
594 }
595
596 .merchant-pcr-app .pcr-selection .pcr-color-palette,
597 .merchant-pcr-app .pcr-selection .pcr-color-chooser,
598 .merchant-pcr-app .pcr-selection .pcr-color-opacity {
599 -webkit-user-select: none;
600 -moz-user-select: none;
601 -ms-user-select: none;
602 user-select: none;
603 position: relative;
604 display: -webkit-box;
605 display: -ms-flexbox;
606 display: flex;
607 -webkit-box-orient: vertical;
608 -webkit-box-direction: normal;
609 -ms-flex-direction: column;
610 flex-direction: column;
611 cursor: -webkit-grab;
612 cursor: grab;
613 }
614
615 .merchant-pcr-app .pcr-selection .pcr-color-palette:active,
616 .merchant-pcr-app .pcr-selection .pcr-color-chooser:active,
617 .merchant-pcr-app .pcr-selection .pcr-color-opacity:active {
618 cursor: -webkit-grabbing;
619 cursor: grabbing;
620 }
621
622 .merchant-pcr-app[data-theme=merchant] {
623 width: 250px;
624 max-width: 95vw;
625 padding: 10px;
626 -webkit-box-sizing: border-box;
627 box-sizing: border-box;
628 display: -webkit-box;
629 display: -ms-flexbox;
630 display: flex;
631 grid-gap: 10px;
632 -webkit-box-orient: vertical;
633 -webkit-box-direction: normal;
634 -ms-flex-direction: column;
635 flex-direction: column;
636 }
637
638 .merchant-pcr-app[data-theme=merchant] .pcr-selection {
639 display: grid;
640 grid-gap: 10px;
641 grid-template-columns: 1fr 4fr;
642 grid-template-rows: 5fr auto auto;
643 -webkit-box-align: center;
644 -ms-flex-align: center;
645 align-items: center;
646 height: 150px;
647 width: 100%;
648 align-self: flex-start;
649 }
650
651 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-preview {
652 grid-area: 2/1/4/1;
653 height: 100%;
654 width: 100%;
655 display: -webkit-box;
656 display: -ms-flexbox;
657 display: flex;
658 -webkit-box-align: center;
659 -ms-flex-align: center;
660 align-items: center;
661 -webkit-box-pack: center;
662 -ms-flex-pack: center;
663 justify-content: center;
664 }
665
666 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-preview .pcr-last-color {
667 display: none;
668 }
669
670 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-preview .pcr-current-color {
671 position: relative;
672 width: 32px;
673 height: 32px;
674 border-radius: 32px;
675 overflow: hidden;
676 border: 1px solid rgba(0, 0, 0, 0.3);
677 background-color: var(--pcr-color);
678 }
679
680 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-preview .pcr-current-color::before {
681 position: absolute;
682 content: "";
683 top: 0;
684 left: 0;
685 width: 100%;
686 height: 100%;
687 background: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
688 background-size: 6px;
689 border-radius: 100%;
690 z-index: -1;
691 }
692
693 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-palette {
694 grid-area: 1/1/2/3;
695 width: 100%;
696 height: 100%;
697 z-index: 1;
698 }
699
700 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-palette .pcr-picker {
701 width: 18px;
702 height: 18px;
703 border: 2px solid #fff;
704 -webkit-box-shadow: 0 0 1px 2px #000, inset 0 0 1px 1px #000;
705 box-shadow: 0 0 1px 2px #000, inset 0 0 1px 1px #000;
706 background-color: transparent !important;
707 }
708
709 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-palette .pcr-palette {
710 width: 100%;
711 height: 100%;
712 }
713
714 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-palette .pcr-palette::before {
715 position: absolute;
716 content: "";
717 top: 0;
718 left: 0;
719 width: 100%;
720 height: 100%;
721 background: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
722 background-size: 8px;
723 z-index: -1;
724 }
725
726 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-chooser {
727 grid-area: 2/2/2/2;
728 }
729
730 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-opacity {
731 grid-area: 3/2/3/2;
732 }
733
734 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-chooser,
735 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-opacity {
736 height: 12px;
737 margin-right: 10px;
738 }
739
740 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-chooser .pcr-picker,
741 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-opacity .pcr-picker {
742 top: 50%;
743 -webkit-transform: translateY(-50%);
744 transform: translateY(-50%);
745 }
746
747 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-chooser .pcr-slider,
748 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-opacity .pcr-slider {
749 -webkit-box-flex: 1;
750 -ms-flex-positive: 1;
751 flex-grow: 1;
752 }
753
754 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-chooser .pcr-slider {
755 background: -webkit-gradient(linear, left top, right top, from(red), color-stop(#ff0), color-stop(lime), color-stop(cyan), color-stop(blue), color-stop(#f0f), to(red));
756 background: linear-gradient(to right, red, #ff0, lime, cyan, blue, #f0f, red);
757 }
758
759 .merchant-pcr-app[data-theme=merchant] .pcr-selection .pcr-color-opacity .pcr-slider {
760 background: -webkit-gradient(linear, left top, right top, from(transparent), to(black)), url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
761 background: linear-gradient(to right, transparent, black), url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="white" d="M1,0H2V1H1V0ZM0,1H1V2H0V1Z"/><path fill="gray" d="M0,0H1V1H0V0ZM1,1H2V2H1V1Z"/></svg>');
762 background-size: 100%, 6px;
763 }
764
765 /* Buttons */
766 .button-tertiary {
767 cursor: pointer;
768 -webkit-user-select: none;
769 -moz-user-select: none;
770 -ms-user-select: none;
771 user-select: none;
772 display: -webkit-inline-box;
773 display: -ms-inline-flexbox;
774 display: inline-flex;
775 padding: 0.4375rem 1rem;
776 font-size: 0.875rem;
777 font-weight: 600;
778 line-height: 1.5;
779 white-space: nowrap;
780 text-transform: none;
781 text-decoration: none;
782 color: #212b36;
783 background-color: #fff;
784 border: 1px solid #c4cdd5;
785 border-radius: 0.25rem;
786 -webkit-transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
787 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
788 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
789 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
790 }
791 .button-tertiary:hover, .button-tertiary:focus {
792 outline: none;
793 -webkit-box-shadow: none;
794 box-shadow: none;
795 }
796
797 /* Botiga Dashboard Tabs Nav Items */
798 .merchant-tabs-nav {
799 padding: 0 20px;
800 margin-bottom: -100%;
801 -webkit-transform: translate3d(0, 100%, 0);
802 transform: translate3d(0, 100%, 0);
803 }
804 .merchant-tabs-nav ul {
805 display: -webkit-box;
806 display: -ms-flexbox;
807 display: flex;
808 padding: 0;
809 }
810 .merchant-tabs-nav .merchant-tabs-nav-item .merchant-tabs-nav-link {
811 position: relative;
812 font-size: 14px;
813 line-height: 20px;
814 padding: 16px;
815 color: #6D7175;
816 text-decoration: none;
817 -webkit-transition: ease color 300ms;
818 transition: ease color 300ms;
819 outline: none;
820 -webkit-box-shadow: none;
821 box-shadow: none;
822 }
823 .merchant-tabs-nav .merchant-tabs-nav-item .merchant-tabs-nav-link:after {
824 content: "";
825 position: absolute;
826 bottom: 0;
827 left: 0;
828 width: 100%;
829 height: 3px;
830 background-color: transparent;
831 border-radius: 4px 4px 0 0;
832 }
833 .merchant-tabs-nav .merchant-tabs-nav-item.active .merchant-tabs-nav-link {
834 color: #3858E9;
835 font-weight: 500;
836 }
837 .merchant-tabs-nav .merchant-tabs-nav-item.active .merchant-tabs-nav-link:after {
838 background-color: #3858E9;
839 }
840 .merchant-tabs-nav .merchant-tabs-nav-item:hover .merchant-tabs-nav-link, .merchant-tabs-nav .merchant-tabs-nav-item:focus .merchant-tabs-nav-link, .merchant-tabs-nav .merchant-tabs-nav-item:active .merchant-tabs-nav-link {
841 color: #3858E9;
842 }
843 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item .merchant-tabs-nav-link {
844 position: relative;
845 display: -webkit-box;
846 display: -ms-flexbox;
847 display: flex;
848 -webkit-box-align: center;
849 -ms-flex-align: center;
850 align-items: center;
851 font-size: 18px;
852 font-weight: 600;
853 line-height: 26px;
854 padding: 9px 16px;
855 border-bottom: 0;
856 color: #1e1e1e;
857 -webkit-transition: ease color 200ms;
858 transition: ease color 200ms;
859 }
860 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item .merchant-tabs-nav-link svg {
861 margin-right: 8px;
862 }
863 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item .merchant-tabs-nav-link svg path {
864 -webkit-transition: ease fill 200ms;
865 transition: ease fill 200ms;
866 }
867 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item .merchant-tabs-nav-link:after {
868 content: none;
869 }
870 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item .merchant-tabs-nav-link:before {
871 content: "";
872 position: absolute;
873 top: 0;
874 left: 0;
875 background-color: transparent;
876 width: 4px;
877 height: 100%;
878 border-radius: 0 4px 4px 0;
879 opacity: 0;
880 visibility: hidden;
881 -webkit-transition: ease opacity 200ms;
882 transition: ease opacity 200ms;
883 }
884 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:hover .merchant-tabs-nav-link, .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:focus .merchant-tabs-nav-link, .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:active .merchant-tabs-nav-link {
885 color: #757575;
886 }
887 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:hover .merchant-tabs-nav-link svg path, .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:focus .merchant-tabs-nav-link svg path, .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:active .merchant-tabs-nav-link svg path {
888 fill: #757575;
889 }
890 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:hover .merchant-tabs-nav-link:before, .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:focus .merchant-tabs-nav-link:before, .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item:active .merchant-tabs-nav-link:before {
891 background-color: #e1e1e1;
892 opacity: 1;
893 visibility: visible;
894 }
895 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item.active .merchant-tabs-nav-link {
896 color: #3858E9;
897 }
898 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item.active .merchant-tabs-nav-link svg path {
899 fill: #3858E9;
900 }
901 .merchant-tabs-nav.merchant-tabs-nav-with-icons .merchant-tabs-nav-item.active .merchant-tabs-nav-link:before {
902 background-color: #3858E9;
903 opacity: 1;
904 visibility: visible;
905 }
906 .merchant-tabs-nav.merchant-tabs-nav-vertical {
907 padding: 0;
908 margin-left: -20px;
909 }
910 .merchant-tabs-nav.merchant-tabs-nav-vertical ul {
911 -webkit-box-orient: vertical;
912 -webkit-box-direction: normal;
913 -ms-flex-direction: column;
914 flex-direction: column;
915 margin: 0;
916 }
917 .merchant-tabs-nav.merchant-tabs-nav-no-negative-margin {
918 margin-bottom: 0;
919 -webkit-transform: none;
920 transform: none;
921 }
922
923 /* Botiga Tabs Content */
924 .merchant-tab-content {
925 display: none;
926 }
927 .merchant-tab-content.active {
928 display: block;
929 }
930
931 .toplevel_page_merchant {
932 background-color: #F4F6F8;
933 }
934 .toplevel_page_merchant #wpbody-content > .updated,
935 .toplevel_page_merchant #wpbody-content > .notice {
936 display: none;
937 }
938
939 .merchant-top-bar {
940 display: -webkit-box;
941 display: -ms-flexbox;
942 display: flex;
943 -webkit-box-align: center;
944 -ms-flex-align: center;
945 align-items: center;
946 -webkit-box-pack: justify;
947 -ms-flex-pack: justify;
948 justify-content: space-between;
949 background-color: #FFF;
950 margin: 0 0 30px -20px;
951 padding: 18px 20px;
952 }
953 .merchant-top-bar * {
954 -webkit-box-sizing: border-box;
955 box-sizing: border-box;
956 }
957 .merchant-top-bar * *:before,
958 .merchant-top-bar * *:after {
959 -webkit-box-sizing: border-box;
960 box-sizing: border-box;
961 }
962 .merchant-top-bar .merchant-top-bar-infos {
963 display: -webkit-box;
964 display: -ms-flexbox;
965 display: flex;
966 -webkit-box-align: center;
967 -ms-flex-align: center;
968 align-items: center;
969 }
970 .merchant-top-bar .merchant-top-bar-infos .merchant-top-bar-info-item {
971 position: relative;
972 padding: 0 10px;
973 }
974 .merchant-top-bar .merchant-top-bar-infos .merchant-top-bar-info-item + .merchant-top-bar-info-item:before {
975 content: "";
976 position: absolute;
977 top: 50%;
978 left: 0;
979 height: 17px;
980 -webkit-transform: translateY(-50%);
981 transform: translateY(-50%);
982 border-left: 1px solid #F0F0F0;
983 }
984 .merchant-top-bar .merchant-version {
985 font-size: 13px;
986 line-height: 13px;
987 color: #97A3B6;
988 }
989 .merchant-top-bar .merchant-version strong {
990 position: relative;
991 top: 1px;
992 }
993 .merchant-top-bar .merchant-version .merchant-badge {
994 display: -webkit-inline-box;
995 display: -ms-inline-flexbox;
996 display: inline-flex;
997 margin-left: 5px;
998 font-size: 9px;
999 line-height: 10px;
1000 }
1001 .merchant-top-bar .merchant-notifications {
1002 position: relative;
1003 display: -webkit-inline-box;
1004 display: -ms-inline-flexbox;
1005 display: inline-flex;
1006 -webkit-box-align: center;
1007 -ms-flex-align: center;
1008 align-items: center;
1009 -webkit-box-pack: center;
1010 -ms-flex-pack: center;
1011 justify-content: center;
1012 width: 27px;
1013 height: 27px;
1014 border: 1px solid #DFDFDF;
1015 border-radius: 35px;
1016 }
1017 .merchant-top-bar .merchant-notifications:focus {
1018 -webkit-box-shadow: none;
1019 box-shadow: none;
1020 }
1021 .merchant-top-bar .merchant-notifications .merchant-notifications-count {
1022 position: absolute;
1023 top: -8px;
1024 right: -7px;
1025 display: -webkit-box;
1026 display: -ms-flexbox;
1027 display: flex;
1028 -webkit-box-align: center;
1029 -ms-flex-align: center;
1030 align-items: center;
1031 -webkit-box-pack: center;
1032 -ms-flex-pack: center;
1033 justify-content: center;
1034 width: 16px;
1035 height: 16px;
1036 color: #FFF;
1037 background-color: #FA1212;
1038 border-radius: 35px;
1039 font-size: 10px;
1040 line-height: 1;
1041 }
1042 .merchant-top-bar .merchant-notifications.read .merchant-notifications-count {
1043 display: none;
1044 }
1045 .merchant-top-bar .merchant-website {
1046 display: -webkit-box;
1047 display: -ms-flexbox;
1048 display: flex;
1049 -webkit-box-align: center;
1050 -ms-flex-align: center;
1051 align-items: center;
1052 gap: 8px;
1053 font-size: 13px;
1054 line-height: 16px;
1055 color: #3858E9;
1056 text-decoration: none;
1057 }
1058
1059 /* Notifications Sidebar */
1060 .merchant-notifications-sidebar {
1061 position: fixed;
1062 top: 96px;
1063 right: 0;
1064 width: 100%;
1065 max-width: 500px;
1066 height: calc(100vh - 92px);
1067 background-color: #FFF;
1068 -webkit-box-shadow: -10px 12px 14px rgba(0, 0, 0, 0.05);
1069 box-shadow: -10px 12px 14px rgba(0, 0, 0, 0.05);
1070 opacity: 0;
1071 visibility: hidden;
1072 -webkit-transform: translate3d(100%, 0, 0);
1073 transform: translate3d(100%, 0, 0);
1074 -webkit-transition: ease transform 300ms, ease opacity 300ms;
1075 transition: ease transform 300ms, ease opacity 300ms;
1076 z-index: 1000;
1077 }
1078 .merchant-notifications-sidebar.opened {
1079 opacity: 1;
1080 visibility: visible;
1081 -webkit-transform: none;
1082 transform: none;
1083 }
1084 .merchant-notifications-sidebar.closing {
1085 opacity: 0;
1086 -webkit-transform: translate3d(100%, 0, 0);
1087 transform: translate3d(100%, 0, 0);
1088 }
1089 .merchant-notifications-sidebar .merchant-notifications-sidebar-close {
1090 position: absolute;
1091 top: 15px;
1092 right: 15px;
1093 -webkit-transition: ease opacity 300ms;
1094 transition: ease opacity 300ms;
1095 }
1096 .merchant-notifications-sidebar .merchant-notifications-sidebar-close:hover {
1097 opacity: 0.7;
1098 }
1099 .merchant-notifications-sidebar .merchant-notifications-sidebar-header {
1100 display: -webkit-box;
1101 display: -ms-flexbox;
1102 display: flex;
1103 -webkit-box-align: center;
1104 -ms-flex-align: center;
1105 align-items: center;
1106 gap: 10px;
1107 background-color: #EAEEF2;
1108 padding: 20px 22px;
1109 }
1110 .merchant-notifications-sidebar .merchant-notifications-sidebar-header .merchant-notifications-sidebar-header-icon {
1111 display: -webkit-box;
1112 display: -ms-flexbox;
1113 display: flex;
1114 -webkit-box-align: center;
1115 -ms-flex-align: center;
1116 align-items: center;
1117 -webkit-box-pack: center;
1118 -ms-flex-pack: center;
1119 justify-content: center;
1120 width: 40px;
1121 height: 40px;
1122 background-color: #FFF;
1123 border: 1px solid #EBEDEF;
1124 border-radius: 35px;
1125 }
1126 .merchant-notifications-sidebar .merchant-notifications-sidebar-header .merchant-notifications-sidebar-header-icon svg {
1127 position: relative;
1128 top: -2px;
1129 }
1130 .merchant-notifications-sidebar .merchant-notifications-sidebar-header .merchant-notifications-sidebar-header-content h3 {
1131 font-size: 16px;
1132 line-height: 26px;
1133 font-weight: 600;
1134 color: #3858E9;
1135 margin: 0;
1136 }
1137 .merchant-notifications-sidebar .merchant-notifications-sidebar-header .merchant-notifications-sidebar-header-content p {
1138 font-size: 13px;
1139 line-height: 18px;
1140 color: #757575;
1141 margin: 0;
1142 }
1143 .merchant-notifications-sidebar .merchant-notifications-sidebar-tabs {
1144 position: relative;
1145 }
1146 .merchant-notifications-sidebar .merchant-notifications-sidebar-tabs:after {
1147 content: "";
1148 position: absolute;
1149 bottom: -10px;
1150 left: 20px;
1151 width: calc(100% - 40px);
1152 border-bottom: 1px solid #F0F0F1;
1153 }
1154 .merchant-notifications-sidebar .merchant-notifications-sidebar-tabs + .merchant-notifications-sidebar-body {
1155 max-height: calc(100vh - 232px);
1156 }
1157 .merchant-notifications-sidebar .merchant-notifications-sidebar-body {
1158 padding: 20px;
1159 overflow-y: auto;
1160 max-height: calc(100vh - 230px);
1161 }
1162 .merchant-notifications-sidebar .merchant-notifications-sidebar-body::-webkit-scrollbar {
1163 width: 5px;
1164 }
1165 .merchant-notifications-sidebar .merchant-notifications-sidebar-body::-webkit-scrollbar-track {
1166 background: #e2e2e2;
1167 }
1168 .merchant-notifications-sidebar .merchant-notifications-sidebar-body::-webkit-scrollbar-thumb {
1169 background-color: #CCC;
1170 }
1171
1172 /* Notifications (card) */
1173 .merchant-notification .merchant-notification-date {
1174 display: block;
1175 font-size: 13px;
1176 line-height: 18px;
1177 color: #757575;
1178 }
1179 .merchant-notification .merchant-notification-date + .merchant-notification-content {
1180 margin-top: 20px;
1181 }
1182 .merchant-notification .changelog-tag {
1183 display: inline-block;
1184 font-size: 10px;
1185 line-height: 18px;
1186 color: #FFF;
1187 padding: 0px 10px;
1188 background-color: #CCC;
1189 border-radius: 3px;
1190 text-transform: uppercase;
1191 font-weight: 600;
1192 margin-bottom: 5px;
1193 }
1194 .merchant-notification .changelog-tag.changelog-added {
1195 background-color: #73B189;
1196 }
1197 .merchant-notification .changelog-tag.changelog-changed {
1198 background-color: #F6CA45;
1199 }
1200 .merchant-notification .changelog-tag.changelog-fixed {
1201 background-color: #967BE3;
1202 }
1203 .merchant-notification .changelog-description {
1204 display: block;
1205 font-size: 13px;
1206 line-height: 21px;
1207 font-weight: 400;
1208 color: #757575;
1209 margin-top: 5px;
1210 }
1211 .merchant-notification .merchant-notification-content ul {
1212 margin: 0;
1213 }
1214 .merchant-notification .merchant-notification-content ul li {
1215 display: -webkit-box;
1216 display: -ms-flexbox;
1217 display: flex;
1218 -webkit-box-orient: vertical;
1219 -webkit-box-direction: normal;
1220 -ms-flex-direction: column;
1221 flex-direction: column;
1222 -webkit-box-align: start;
1223 -ms-flex-align: start;
1224 align-items: flex-start;
1225 font-size: 16px;
1226 line-height: 26px;
1227 font-weight: 600;
1228 color: #101517;
1229 }
1230 .merchant-notification .merchant-notification-content ul li + li {
1231 margin-top: 15px;
1232 padding-top: 15px;
1233 border-top: 1px solid #E7E7E7;
1234 }
1235 .merchant-notification + .merchant-notification {
1236 margin: 20px -20px 0px;
1237 padding: 20px 20px 0px;
1238 border-top: 1px solid #E7E7E7;
1239 }
1240
1241 .merchant-wrap {
1242 padding-left: 5px;
1243 padding-right: 5px;
1244 }
1245 .merchant-wrap * {
1246 -webkit-box-sizing: border-box;
1247 box-sizing: border-box;
1248 }
1249 .merchant-wrap * *:before,
1250 .merchant-wrap * *:after {
1251 -webkit-box-sizing: border-box;
1252 box-sizing: border-box;
1253 }
1254
1255 .merchant-modules-panel {
1256 display: -webkit-box;
1257 display: -ms-flexbox;
1258 display: flex;
1259 grid-gap: 20px;
1260 -webkit-box-orient: vertical;
1261 -webkit-box-direction: normal;
1262 -ms-flex-direction: column;
1263 flex-direction: column;
1264 }
1265
1266 .merchant-modules-header {
1267 display: -webkit-box;
1268 display: -ms-flexbox;
1269 display: flex;
1270 grid-gap: 30px;
1271 }
1272
1273 .merchant-modules-header-left,
1274 .merchant-modules-header-right {
1275 -webkit-box-flex: 1;
1276 -ms-flex: 1;
1277 flex: 1;
1278 display: -webkit-box;
1279 display: -ms-flexbox;
1280 display: flex;
1281 grid-gap: 10px;
1282 -webkit-box-orient: vertical;
1283 -webkit-box-direction: normal;
1284 -ms-flex-direction: column;
1285 flex-direction: column;
1286 -webkit-box-pack: center;
1287 -ms-flex-pack: center;
1288 justify-content: center;
1289 }
1290
1291 .merchant-admin-hand-icon {
1292 width: 24px;
1293 height: auto;
1294 margin-left: 7px;
1295 position: relative;
1296 top: 2px;
1297 }
1298
1299 .merchant-modules-header-heading {
1300 font-size: 24px;
1301 line-height: 34px;
1302 font-weight: 500;
1303 color: #101517;
1304 }
1305
1306 .merchant-modules-header-subheading {
1307 font-size: 16px;
1308 line-height: 1.35em;
1309 color: #7B7B7B;
1310 font-weight: 400;
1311 }
1312
1313 .merchant-modules-header-status {
1314 margin-top: 20px;
1315 margin-bottom: 40px;
1316 display: -webkit-box;
1317 display: -ms-flexbox;
1318 display: flex;
1319 grid-gap: 20px;
1320 }
1321
1322 .merchant-modules-header-status-box {
1323 display: -webkit-box;
1324 display: -ms-flexbox;
1325 display: flex;
1326 grid-gap: 10px;
1327 -webkit-box-orient: vertical;
1328 -webkit-box-direction: normal;
1329 -ms-flex-direction: column;
1330 flex-direction: column;
1331 -webkit-box-align: center;
1332 -ms-flex-align: center;
1333 align-items: center;
1334 padding: 20px;
1335 font-size: 14px;
1336 font-weight: 500;
1337 color: #101517;
1338 background-color: #fff;
1339 -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
1340 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
1341 border-radius: 4px;
1342 }
1343 @media (min-width: 421px) {
1344 .merchant-modules-header-status-box {
1345 min-width: 175px;
1346 }
1347 }
1348 @media (max-width: 420px) {
1349 .merchant-modules-header-status-box {
1350 -webkit-box-flex: 1;
1351 -ms-flex: 1;
1352 flex: 1;
1353 }
1354 }
1355 .merchant-modules-header-status-box span {
1356 display: -webkit-box;
1357 display: -ms-flexbox;
1358 display: flex;
1359 grid-gap: 5px;
1360 -webkit-box-align: center;
1361 -ms-flex-align: center;
1362 align-items: center;
1363 }
1364 .merchant-modules-header-status-box strong {
1365 color: #101517;
1366 font-size: 40px;
1367 line-height: 1em;
1368 }
1369
1370 .merchant-modules-header-image {
1371 height: 100%;
1372 display: -webkit-box;
1373 display: -ms-flexbox;
1374 display: flex;
1375 -webkit-box-pack: center;
1376 -ms-flex-pack: center;
1377 justify-content: center;
1378 -webkit-box-align: end;
1379 -ms-flex-align: end;
1380 align-items: flex-end;
1381 }
1382 .merchant-modules-header-image svg {
1383 width: 300px;
1384 }
1385 @media (max-width: 1400px) {
1386 .merchant-modules-header-image img {
1387 max-width: 450px;
1388 margin-top: 20px;
1389 }
1390 }
1391
1392 .merchant-modules-header-shortlinks {
1393 margin: 20px 0;
1394 padding: 0;
1395 list-style: none;
1396 display: -webkit-box;
1397 display: -ms-flexbox;
1398 display: flex;
1399 -webkit-box-orient: vertical;
1400 -webkit-box-direction: normal;
1401 -ms-flex-direction: column;
1402 flex-direction: column;
1403 border-radius: 4px;
1404 border: 2px solid #F0F0F1;
1405 background-color: #fff;
1406 border-radius: 4px;
1407 }
1408 .merchant-modules-header-shortlinks li {
1409 margin: 0 15px;
1410 border-bottom: 1px solid #EFEFEF;
1411 }
1412 .merchant-modules-header-shortlinks li:last-child {
1413 border-bottom: none;
1414 margin-bottom: 5px;
1415 }
1416 .merchant-modules-header-shortlinks li:first-child {
1417 margin-top: 5px;
1418 }
1419 .merchant-modules-header-shortlinks a {
1420 font-size: 14px;
1421 display: -webkit-box;
1422 display: -ms-flexbox;
1423 display: flex;
1424 grid-gap: 8px;
1425 -webkit-box-align: center;
1426 -ms-flex-align: center;
1427 align-items: center;
1428 -webkit-box-pack: justify;
1429 -ms-flex-pack: justify;
1430 justify-content: space-between;
1431 color: #757575;
1432 text-decoration: none;
1433 padding: 10px 0;
1434 }
1435 .merchant-modules-header-shortlinks a:focus {
1436 outline: none;
1437 -webkit-box-shadow: none;
1438 box-shadow: none;
1439 }
1440 .merchant-modules-header-shortlinks span {
1441 -webkit-box-flex: 1;
1442 -ms-flex: 1;
1443 flex: 1;
1444 }
1445 .merchant-modules-header-shortlinks strong {
1446 color: #101517;
1447 font-weight: 500;
1448 }
1449
1450 .merchant-modules-box {
1451 display: -webkit-box;
1452 display: -ms-flexbox;
1453 display: flex;
1454 grid-gap: 20px;
1455 -webkit-box-orient: vertical;
1456 -webkit-box-direction: normal;
1457 -ms-flex-direction: column;
1458 flex-direction: column;
1459 padding: 20px;
1460 background-color: #fff;
1461 -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
1462 box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
1463 border-radius: 4px;
1464 }
1465
1466 .merchant-modules-box-heading {
1467 font-size: 20px;
1468 font-weight: 500;
1469 line-height: 30px;
1470 color: #101517;
1471 }
1472
1473 .merchant-modules-list {
1474 display: grid;
1475 grid-template-columns: repeat(3, minmax(0, 1fr));
1476 grid-gap: 20px;
1477 }
1478
1479 .merchant-modules-list-item {
1480 position: relative;
1481 display: -webkit-box;
1482 display: -ms-flexbox;
1483 display: flex;
1484 grid-gap: 10px;
1485 padding: 20px;
1486 text-decoration: none;
1487 border: 2px solid #F0F0F1;
1488 background-color: #fff;
1489 border-radius: 4px;
1490 -webkit-transition: all 0.2s;
1491 transition: all 0.2s;
1492 }
1493 .merchant-modules-list-item.merchant-module-deactivated-by-bp .merchant-modules-list-item-icon,
1494 .merchant-modules-list-item.merchant-module-deactivated-by-bp .merchant-modules-list-item-content {
1495 opacity: 0.5;
1496 }
1497 .merchant-modules-list-item:hover {
1498 -webkit-box-shadow: 0px 8px 12px 0px rgba(240, 240, 241, 0.7);
1499 box-shadow: 0px 8px 12px 0px rgba(240, 240, 241, 0.7);
1500 }
1501 .merchant-modules-list-item:focus {
1502 outline: none;
1503 -webkit-box-shadow: none;
1504 box-shadow: none;
1505 }
1506
1507 .merchant-badge {
1508 color: #99A5B8;
1509 padding: 3px 6px;
1510 border: 1px solid #DFDFDF;
1511 border-radius: 2px;
1512 font-weight: 700;
1513 }
1514 .merchant-badge.merchant-badge-pro {
1515 color: #3858e9;
1516 border-color: #3858e9;
1517 }
1518
1519 .merchant-pro-badge.merchant-pro-tooltip {
1520 position: relative;
1521 }
1522 .merchant-pro-badge.merchant-pro-tooltip:before {
1523 content: attr(data-tooltip-message);
1524 position: absolute;
1525 right: -30px;
1526 bottom: calc(100% + 11px);
1527 color: #FFF;
1528 font-size: 11px;
1529 line-height: 16px;
1530 padding: 3px 6px;
1531 background-color: #1E1E1E;
1532 white-space: nowrap;
1533 opacity: 0;
1534 visibility: hidden;
1535 -webkit-transform: translate3d(0, 6px, 0);
1536 transform: translate3d(0, 6px, 0);
1537 -webkit-transition: ease opacity 300ms, ease transform 300ms;
1538 transition: ease opacity 300ms, ease transform 300ms;
1539 z-index: 2;
1540 }
1541 .merchant-pro-badge.merchant-pro-tooltip:after {
1542 content: "";
1543 position: absolute;
1544 bottom: calc(100% + 3px);
1545 right: 10px;
1546 width: 0;
1547 height: 0;
1548 border-style: solid;
1549 border-width: 4px 4px 4px 4px;
1550 border-color: #1E1E1E transparent transparent transparent;
1551 opacity: 0;
1552 visibility: hidden;
1553 -webkit-transform: translate3d(0, 6px, 0);
1554 transform: translate3d(0, 6px, 0);
1555 -webkit-transition: ease opacity 300ms, ease transform 300ms;
1556 transition: ease opacity 300ms, ease transform 300ms;
1557 z-index: 2;
1558 }
1559 .merchant-pro-badge.merchant-pro-tooltip:hover:before, .merchant-pro-badge.merchant-pro-tooltip:hover:after {
1560 opacity: 1;
1561 visibility: visible;
1562 -webkit-transform: translate3d(0, 0, 0);
1563 transform: translate3d(0, 0, 0);
1564 }
1565
1566 .merchant-modules-list-item-badge-wrapper {
1567 position: absolute;
1568 top: 20px;
1569 right: 20px;
1570 }
1571
1572 .merchant-modules-list-item-removed-by-bp .merchant-pro-badge {
1573 padding: 3px 7px;
1574 color: #FFF;
1575 border: 1px solid #212121;
1576 background-color: #212121;
1577 border-radius: 3px;
1578 font-size: 10px;
1579 line-height: 1.2;
1580 font-weight: 400;
1581 display: -webkit-inline-box;
1582 display: -ms-inline-flexbox;
1583 display: inline-flex;
1584 top: -2px;
1585 text-transform: uppercase;
1586 }
1587 .merchant-modules-list-item-removed-by-bp .merchant-pro-badge:before {
1588 font-weight: 400;
1589 text-transform: none;
1590 }
1591
1592 .merchant-modules-list-item-woo-required .merchant-pro-badge {
1593 padding: 1px 2px;
1594 color: #674399;
1595 border: 1px solid #674399;
1596 border-radius: 3px;
1597 font-size: 9px;
1598 line-height: 1.2;
1599 font-weight: 700;
1600 display: -webkit-inline-box;
1601 display: -ms-inline-flexbox;
1602 display: inline-flex;
1603 top: -2px;
1604 }
1605 .merchant-modules-list-item-woo-required .merchant-pro-badge:before {
1606 font-weight: 400;
1607 }
1608 .merchant-modules-list-item-woo-required + .merchant-modules-list-item-upsell {
1609 right: 53px;
1610 }
1611
1612 .merchant-modules-list-item-icon {
1613 display: -webkit-box;
1614 display: -ms-flexbox;
1615 display: flex;
1616 }
1617 .merchant-modules-list-item-icon svg {
1618 width: 18px;
1619 height: 26px;
1620 fill: #787C82;
1621 }
1622 .merchant-modules-list-item-icon svg.stroke-based {
1623 fill: none;
1624 stroke: #787C82;
1625 }
1626
1627 .merchant-modules-list-item-content {
1628 display: -webkit-box;
1629 display: -ms-flexbox;
1630 display: flex;
1631 grid-gap: 8px;
1632 -webkit-box-orient: vertical;
1633 -webkit-box-direction: normal;
1634 -ms-flex-direction: column;
1635 flex-direction: column;
1636 }
1637
1638 .merchant-modules-list-item-title {
1639 display: -webkit-box;
1640 display: -ms-flexbox;
1641 display: flex;
1642 -webkit-box-align: center;
1643 -ms-flex-align: center;
1644 align-items: center;
1645 grid-gap: 5px;
1646 font-size: 16px;
1647 line-height: 26px;
1648 font-weight: 500;
1649 color: #101517;
1650 }
1651
1652 .merchant-modules-indicator {
1653 width: 10px;
1654 height: 10px;
1655 border-radius: 10px;
1656 background-color: #3c8733;
1657 }
1658
1659 .merchant-modules-list-item-desc {
1660 color: #757575;
1661 font-size: 13px;
1662 line-height: 20px;
1663 max-width: 400px;
1664 }
1665
1666 .merchant-module-page {
1667 display: -webkit-box;
1668 display: -ms-flexbox;
1669 display: flex;
1670 }
1671
1672 .merchant-module-page-back a {
1673 display: -webkit-box;
1674 display: -ms-flexbox;
1675 display: flex;
1676 grid-gap: 5px;
1677 -webkit-box-align: center;
1678 -ms-flex-align: center;
1679 align-items: center;
1680 -webkit-transition: all 0.2s;
1681 transition: all 0.2s;
1682 text-decoration: none;
1683 color: #1D2327;
1684 font-weight: 500;
1685 }
1686 .merchant-module-page-back a:focus, .merchant-module-page-back a:active {
1687 -webkit-box-shadow: none;
1688 box-shadow: none;
1689 outline: none;
1690 }
1691
1692 .merchant-module-page-content {
1693 width: 50%;
1694 -webkit-box-flex: 1;
1695 -ms-flex: 1;
1696 flex: 1;
1697 display: -webkit-box;
1698 display: -ms-flexbox;
1699 display: flex;
1700 grid-gap: 20px;
1701 -webkit-box-orient: vertical;
1702 -webkit-box-direction: normal;
1703 -ms-flex-direction: column;
1704 flex-direction: column;
1705 }
1706
1707 .merchant-module-page-body {
1708 display: -webkit-box;
1709 display: -ms-flexbox;
1710 display: flex;
1711 }
1712
1713 .merchant-module-page-preview {
1714 width: 50%;
1715 margin-left: 20px;
1716 }
1717
1718 .merchant-module-page-body.has-preview .merchant-module-page-setting-box {
1719 -webkit-box-orient: vertical;
1720 -webkit-box-direction: normal;
1721 -ms-flex-direction: column;
1722 flex-direction: column;
1723 grid-gap: 20px;
1724 }
1725 .merchant-module-page-body.has-preview .merchant-module-page-setting-title,
1726 .merchant-module-page-body.has-preview .merchant-module-page-setting-fields {
1727 width: 100%;
1728 }
1729
1730 .merchant-module-page-ajax-form {
1731 -webkit-box-flex: 1;
1732 -ms-flex: 1;
1733 flex: 1;
1734 display: -webkit-box;
1735 display: -ms-flexbox;
1736 display: flex;
1737 grid-gap: 20px;
1738 -webkit-box-orient: vertical;
1739 -webkit-box-direction: normal;
1740 -ms-flex-direction: column;
1741 flex-direction: column;
1742 }
1743
1744 .merchant-module-page-header {
1745 display: -webkit-box;
1746 display: -ms-flexbox;
1747 display: flex;
1748 -webkit-box-align: center;
1749 -ms-flex-align: center;
1750 align-items: center;
1751 background-color: #fff;
1752 -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
1753 box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
1754 border-radius: 4px;
1755 }
1756
1757 .merchant-module-page-header-content {
1758 width: 100%;
1759 display: -webkit-box;
1760 display: -ms-flexbox;
1761 display: flex;
1762 grid-gap: 20px;
1763 -webkit-box-orient: vertical;
1764 -webkit-box-direction: normal;
1765 -ms-flex-direction: column;
1766 flex-direction: column;
1767 padding: 30px;
1768 }
1769
1770 .merchant-module-page-header-placeholder {
1771 width: 40%;
1772 display: -webkit-box;
1773 display: -ms-flexbox;
1774 display: flex;
1775 -ms-flex-item-align: end;
1776 align-self: flex-end;
1777 -webkit-box-pack: center;
1778 -ms-flex-pack: center;
1779 justify-content: center;
1780 margin: 40px 60px 0 60px;
1781 }
1782 .merchant-module-page-header-placeholder img {
1783 max-width: 100%;
1784 max-height: 300px;
1785 }
1786
1787 body.merchant-has-admin-preview .merchant-module-page-header-content {
1788 width: 100%;
1789 }
1790 body.merchant-has-admin-preview .merchant-module-page-header-placeholder {
1791 display: none;
1792 }
1793 body.merchant-has-admin-preview .merchant-module-page-desc {
1794 max-width: none;
1795 }
1796
1797 .merchant-module-page-heading {
1798 display: -webkit-box;
1799 display: -ms-flexbox;
1800 display: flex;
1801 grid-gap: 12px;
1802 }
1803
1804 .merchant-module-page-info {
1805 display: -webkit-box;
1806 display: -ms-flexbox;
1807 display: flex;
1808 grid-gap: 10px;
1809 -webkit-box-orient: vertical;
1810 -webkit-box-direction: normal;
1811 -ms-flex-direction: column;
1812 flex-direction: column;
1813 }
1814
1815 .merchant-module-page-title {
1816 font-size: 32px;
1817 line-height: 40px;
1818 font-weight: 500;
1819 color: #101517;
1820 display: -webkit-box;
1821 display: -ms-flexbox;
1822 display: flex;
1823 grid-gap: 15px;
1824 -webkit-box-align: center;
1825 -ms-flex-align: center;
1826 align-items: center;
1827 }
1828 .merchant-module-page-title svg {
1829 width: 28px;
1830 height: 28px;
1831 fill: #787C82;
1832 }
1833
1834 .merchant-module-page-desc {
1835 font-size: 18px;
1836 line-height: 28px;
1837 font-weight: normal;
1838 color: #757575;
1839 max-width: none;
1840 }
1841
1842 .merchant-module-page-actions {
1843 display: -webkit-box;
1844 display: -ms-flexbox;
1845 display: flex;
1846 grid-gap: 10px;
1847 -webkit-box-pack: justify;
1848 -ms-flex-pack: justify;
1849 justify-content: space-between;
1850 }
1851
1852 .merchant-module-page-actions-inner {
1853 display: -webkit-box;
1854 display: -ms-flexbox;
1855 display: flex;
1856 grid-gap: 15px;
1857 }
1858
1859 .merchant-module-page-button {
1860 cursor: pointer;
1861 display: -webkit-box;
1862 display: -ms-flexbox;
1863 display: flex;
1864 grid-gap: 7px;
1865 -webkit-box-pack: center;
1866 -ms-flex-pack: center;
1867 justify-content: center;
1868 -webkit-box-align: center;
1869 -ms-flex-align: center;
1870 align-items: center;
1871 padding: 14px 25px;
1872 font-size: 16px;
1873 line-height: 1em;
1874 font-weight: 500;
1875 -webkit-user-select: none;
1876 -moz-user-select: none;
1877 -ms-user-select: none;
1878 user-select: none;
1879 text-decoration: none;
1880 border-radius: 4px;
1881 color: #fff;
1882 border: 1px solid transparent;
1883 background-color: #3858E9;
1884 }
1885 .merchant-module-page-button.merchant-module-question-answer-button:disabled {
1886 cursor: not-allowed;
1887 background: rgba(239, 239, 239, 0.3);
1888 color: rgba(16, 16, 16, 0.3);
1889 border: 1px solid rgba(195, 195, 195, 0.3);
1890 }
1891 .merchant-module-page-button:focus, .merchant-module-page-button:hover {
1892 outline: none;
1893 -webkit-box-shadow: none;
1894 box-shadow: none;
1895 color: #fff;
1896 }
1897 .merchant-module-page-button svg {
1898 width: 8px;
1899 height: 8px;
1900 }
1901
1902 .merchant-module-deactivate {
1903 display: none;
1904 }
1905
1906 .merchant-module-action {
1907 position: relative;
1908 }
1909 .merchant-module-action.merchant-enabled .merchant-module-activate {
1910 display: none;
1911 }
1912 .merchant-module-action.merchant-enabled .merchant-module-deactivate {
1913 display: block;
1914 }
1915
1916 .merchant-module-deactivate-dropdown {
1917 cursor: pointer;
1918 position: absolute;
1919 top: 100%;
1920 left: 0;
1921 padding: 5px;
1922 white-space: nowrap;
1923 border-radius: 8px;
1924 background-color: #fff;
1925 font-size: 14px;
1926 line-height: 16px;
1927 margin: 0;
1928 -webkit-box-shadow: 0 3px 6px -3px rgba(23, 24, 24, 0.08), 0 8px 20px -4px rgba(23, 24, 24, 0.12);
1929 box-shadow: 0 3px 6px -3px rgba(23, 24, 24, 0.08), 0 8px 20px -4px rgba(23, 24, 24, 0.12);
1930 opacity: 0;
1931 pointer-events: none;
1932 -webkit-transition: all 0.1s;
1933 transition: all 0.1s;
1934 }
1935 .merchant-module-deactivate-dropdown.merchant-show {
1936 opacity: 1;
1937 pointer-events: auto;
1938 margin-top: 10px;
1939 }
1940
1941 .merchant-module-dropdown {
1942 position: absolute;
1943 overflow: hidden;
1944 top: 100%;
1945 left: 0;
1946 min-width: 275px;
1947 white-space: nowrap;
1948 border-radius: 8px;
1949 background-color: #fff;
1950 font-size: 13px;
1951 line-height: 14px;
1952 margin: 0;
1953 -webkit-box-shadow: 0 3px 6px -3px rgba(23, 24, 24, 0.08), 0 8px 20px -4px rgba(23, 24, 24, 0.12);
1954 box-shadow: 0 3px 6px -3px rgba(23, 24, 24, 0.08), 0 8px 20px -4px rgba(23, 24, 24, 0.12);
1955 opacity: 0;
1956 pointer-events: none;
1957 -webkit-transition: all 0.1s;
1958 transition: all 0.1s;
1959 z-index: 99;
1960 }
1961 .merchant-module-dropdown.merchant-show {
1962 opacity: 1;
1963 pointer-events: auto;
1964 margin-top: 10px;
1965 }
1966 .merchant-module-dropdown ul {
1967 margin: 0;
1968 padding: 0;
1969 list-style: none;
1970 display: -webkit-box;
1971 display: -ms-flexbox;
1972 display: flex;
1973 -webkit-box-orient: vertical;
1974 -webkit-box-direction: normal;
1975 -ms-flex-direction: column;
1976 flex-direction: column;
1977 }
1978 .merchant-module-dropdown ul li {
1979 cursor: pointer;
1980 position: relative;
1981 margin: 0;
1982 display: -webkit-box;
1983 display: -ms-flexbox;
1984 display: flex;
1985 -webkit-box-align: center;
1986 -ms-flex-align: center;
1987 align-items: center;
1988 -webkit-box-pack: justify;
1989 -ms-flex-pack: justify;
1990 justify-content: space-between;
1991 white-space: nowrap;
1992 padding: 15px 15px 0 15px;
1993 color: #202223;
1994 -webkit-transition: all 0.2s;
1995 transition: all 0.2s;
1996 }
1997 .merchant-module-dropdown ul li:before {
1998 content: "";
1999 position: absolute;
2000 z-index: 1;
2001 top: 0;
2002 left: 0;
2003 bottom: 0;
2004 width: 0;
2005 opacity: 0;
2006 -webkit-transition: all 0.2s;
2007 transition: all 0.2s;
2008 background-color: #3858E9;
2009 }
2010 .merchant-module-dropdown ul li:hover {
2011 background-color: #F2F7FE;
2012 }
2013 .merchant-module-dropdown ul li:hover:before {
2014 opacity: 1;
2015 width: 3px;
2016 }
2017 .merchant-module-dropdown ul li span {
2018 width: 100%;
2019 padding-bottom: 15px;
2020 border-bottom: 1px solid #eee;
2021 }
2022 .merchant-module-dropdown ul li:last-child span {
2023 border-bottom: none;
2024 }
2025 .merchant-module-dropdown.merchant-show {
2026 opacity: 1;
2027 pointer-events: auto;
2028 margin-top: 10px;
2029 }
2030
2031 .merchant-module-dropdown-close {
2032 cursor: pointer;
2033 }
2034
2035 .merchant-module-question-title {
2036 display: -webkit-box;
2037 display: -ms-flexbox;
2038 display: flex;
2039 grid-gap: 15px;
2040 -webkit-box-align: center;
2041 -ms-flex-align: center;
2042 align-items: center;
2043 -webkit-box-pack: justify;
2044 -ms-flex-pack: justify;
2045 justify-content: space-between;
2046 white-space: nowrap;
2047 padding: 15px 15px 5px 15px;
2048 font-size: 14px;
2049 line-height: 16px;
2050 color: #202223;
2051 font-weight: 500;
2052 }
2053 .merchant-module-question-title i {
2054 width: auto;
2055 height: auto;
2056 font-size: 24px;
2057 line-height: 1;
2058 }
2059
2060 .merchant-module-question-answer-title {
2061 display: none;
2062 grid-gap: 15px;
2063 -webkit-box-align: center;
2064 -ms-flex-align: center;
2065 align-items: center;
2066 -webkit-box-pack: justify;
2067 -ms-flex-pack: justify;
2068 justify-content: space-between;
2069 white-space: nowrap;
2070 padding: 15px;
2071 font-size: 14px;
2072 line-height: 16px;
2073 color: #202223;
2074 font-weight: 500;
2075 }
2076 .merchant-module-question-answer-title i {
2077 width: auto;
2078 height: auto;
2079 font-size: 20px;
2080 line-height: 1;
2081 }
2082 .merchant-module-question-answer-title.merchant-show {
2083 display: -webkit-box;
2084 display: -ms-flexbox;
2085 display: flex;
2086 }
2087
2088 .merchant-module-question-answer-form {
2089 padding: 5px 15px 15px 15px;
2090 display: -webkit-box;
2091 display: -ms-flexbox;
2092 display: flex;
2093 grid-gap: 10px;
2094 -webkit-box-orient: vertical;
2095 -webkit-box-direction: normal;
2096 -ms-flex-direction: column;
2097 flex-direction: column;
2098 }
2099 .merchant-module-question-answer-form textarea {
2100 width: 100%;
2101 height: 100px;
2102 padding: 12px;
2103 line-height: 1em;
2104 width: 100%;
2105 max-width: 100%;
2106 min-height: auto;
2107 border: 1px solid #D6D6D6;
2108 }
2109 .merchant-module-question-answer-form textarea:focus {
2110 outline: none;
2111 -webkit-box-shadow: none;
2112 box-shadow: none;
2113 border-color: #3858E9;
2114 }
2115 .merchant-module-question-answer-form button {
2116 -ms-flex-item-align: end;
2117 align-self: flex-end;
2118 padding: 8px 10px;
2119 font-size: 13px;
2120 font-weight: 400;
2121 }
2122
2123 .merchant-module-question-answer-thank-you-text {
2124 padding: 5px 15px 15px 15px;
2125 }
2126
2127 .merchant-module-question-thank-you-dropdown .merchant-module-question-answer-title {
2128 display: -webkit-box;
2129 display: -ms-flexbox;
2130 display: flex;
2131 }
2132
2133 .merchant-module-page-button-action-deactivate {
2134 border-radius: 8px;
2135 padding: 12px 16px;
2136 display: -webkit-box;
2137 display: -ms-flexbox;
2138 display: flex;
2139 justify-items: center;
2140 -webkit-box-align: center;
2141 -ms-flex-align: center;
2142 align-items: center;
2143 text-decoration: none;
2144 color: #d82c0d;
2145 }
2146 .merchant-module-page-button-action-deactivate:hover {
2147 background-color: #fff4f4;
2148 }
2149
2150 .merchant-module-page-button-deactivate {
2151 color: #3858E9;
2152 border-color: #3858E9;
2153 background-color: transparent;
2154 }
2155 .merchant-module-page-button-deactivate:focus, .merchant-module-page-button-deactivate:hover {
2156 color: #3858E9;
2157 }
2158 .merchant-module-page-button-deactivate.merchant-show .merchant-module-deactivate-dropdown {
2159 pointer-events: auto;
2160 }
2161
2162 .merchant-module-page-actions-links {
2163 display: -webkit-box;
2164 display: -ms-flexbox;
2165 display: flex;
2166 }
2167
2168 .merchant-module-page-link {
2169 display: -webkit-box;
2170 display: -ms-flexbox;
2171 display: flex;
2172 grid-gap: 5px;
2173 -webkit-box-pack: center;
2174 -ms-flex-pack: center;
2175 justify-content: center;
2176 -webkit-box-align: center;
2177 -ms-flex-align: center;
2178 align-items: center;
2179 padding: 10px;
2180 font-size: 13px;
2181 font-weight: 500;
2182 text-decoration: none;
2183 color: #3858E9;
2184 }
2185 .merchant-module-page-link span {
2186 text-decoration: underline;
2187 }
2188 .merchant-module-page-link:focus, .merchant-module-page-link:hover {
2189 outline: none;
2190 -webkit-box-shadow: none;
2191 box-shadow: none;
2192 color: #3858E9;
2193 }
2194
2195 body.merchant-module-disabled .merchant-module-page-link-preview {
2196 pointer-events: none;
2197 color: #CCC;
2198 }
2199 body.merchant-module-disabled .merchant-module-page-link-preview span {
2200 text-decoration: none;
2201 }
2202 body.merchant-module-disabled .merchant-module-page-link-preview svg path {
2203 fill: #CCC;
2204 }
2205
2206 .merchant-module-page-ajax-header {
2207 display: -webkit-box;
2208 display: -ms-flexbox;
2209 display: flex;
2210 -webkit-box-pack: justify;
2211 -ms-flex-pack: justify;
2212 justify-content: space-between;
2213 -webkit-box-align: center;
2214 -ms-flex-align: center;
2215 align-items: center;
2216 position: fixed;
2217 z-index: 10000;
2218 overflow: hidden;
2219 padding-left: 20px;
2220 padding-right: 20px;
2221 top: 32px;
2222 left: 160px;
2223 right: 0;
2224 height: 56px;
2225 opacity: 0;
2226 pointer-events: none;
2227 background-color: #1d2327;
2228 -webkit-transition: opacity 0.3s cubic-bezier(0, 0, 0.42, 1);
2229 transition: opacity 0.3s cubic-bezier(0, 0, 0.42, 1);
2230 }
2231 .merchant-module-page-ajax-header.merchant-show {
2232 opacity: 1;
2233 pointer-events: auto;
2234 }
2235 .merchant-module-page-ajax-header.merchant-saving {
2236 -webkit-user-select: none;
2237 -moz-user-select: none;
2238 -ms-user-select: none;
2239 user-select: none;
2240 }
2241 .merchant-module-page-ajax-header.merchant-saving i {
2242 opacity: 1;
2243 }
2244 .merchant-module-page-ajax-header.merchant-saving span {
2245 opacity: 0;
2246 }
2247 .merchant-module-page-ajax-header.merchant-saving .merchant-module-page-ajax-buttons {
2248 -webkit-user-select: none;
2249 -moz-user-select: none;
2250 -ms-user-select: none;
2251 user-select: none;
2252 pointer-events: none;
2253 }
2254
2255 .merchant-module-page-ajax-notice {
2256 font-size: 14px;
2257 font-weight: 500;
2258 color: #e3e5e7;
2259 }
2260
2261 .merchant-module-page-ajax-buttons {
2262 display: -webkit-box;
2263 display: -ms-flexbox;
2264 display: flex;
2265 -webkit-box-align: center;
2266 -ms-flex-align: center;
2267 align-items: center;
2268 grid-gap: 15px;
2269 }
2270
2271 .merchant-module-save-button {
2272 position: relative;
2273 cursor: pointer;
2274 display: -webkit-box;
2275 display: -ms-flexbox;
2276 display: flex;
2277 -webkit-box-pack: center;
2278 -ms-flex-pack: center;
2279 justify-content: center;
2280 -webkit-box-align: center;
2281 -ms-flex-align: center;
2282 align-items: center;
2283 font-size: 14px;
2284 line-height: 16px;
2285 border: 0;
2286 border-radius: 4px;
2287 min-width: 60px;
2288 min-height: 36px;
2289 padding-left: 16px;
2290 padding-right: 16px;
2291 color: #fff;
2292 background-color: #3858E9;
2293 }
2294 .merchant-module-save-button i {
2295 position: absolute;
2296 width: auto;
2297 height: auto;
2298 font-size: 20px;
2299 opacity: 0;
2300 -webkit-animation: merchant-spin 1.5s infinite linear;
2301 animation: merchant-spin 1.5s infinite linear;
2302 }
2303
2304 @-webkit-keyframes merchant-spin {
2305 0% {
2306 -webkit-transform: rotate(0deg);
2307 transform: rotate(0deg);
2308 }
2309 100% {
2310 -webkit-transform: rotate(359deg);
2311 transform: rotate(359deg);
2312 }
2313 }
2314
2315 @keyframes merchant-spin {
2316 0% {
2317 -webkit-transform: rotate(0deg);
2318 transform: rotate(0deg);
2319 }
2320 100% {
2321 -webkit-transform: rotate(359deg);
2322 transform: rotate(359deg);
2323 }
2324 }
2325 .merchant-module-discard-button {
2326 cursor: pointer;
2327 display: -webkit-box;
2328 display: -ms-flexbox;
2329 display: flex;
2330 -webkit-box-pack: center;
2331 -ms-flex-pack: center;
2332 justify-content: center;
2333 -webkit-box-align: center;
2334 -ms-flex-align: center;
2335 align-items: center;
2336 font-size: 14px;
2337 line-height: 16px;
2338 min-width: 36px;
2339 min-height: 36px;
2340 color: #fff;
2341 text-decoration: none;
2342 }
2343 .merchant-module-discard-button:hover {
2344 color: #fff;
2345 opacity: 0.75;
2346 }
2347 .merchant-module-discard-button:focus {
2348 outline: none;
2349 -webkit-box-shadow: none;
2350 box-shadow: none;
2351 }
2352
2353 .merchant-module-page-preview-browser-top {
2354 background: #323232;
2355 display: -webkit-box;
2356 display: -ms-flexbox;
2357 display: flex;
2358 -webkit-box-align: center;
2359 -ms-flex-align: center;
2360 align-items: center;
2361 height: 45px;
2362 padding-left: 9px;
2363 }
2364
2365 .merchant-module-page-preview-browser-top-circle {
2366 background: #616161;
2367 width: 12px;
2368 height: 12px;
2369 border-radius: 50%;
2370 display: block;
2371 margin-left: 7px;
2372 }
2373
2374 .merchant-module-page-preview-browser {
2375 border-top-left-radius: 5px;
2376 border-top-right-radius: 5px;
2377 overflow: hidden;
2378 -webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.1215686275);
2379 box-shadow: 0 0 50px rgba(0, 0, 0, 0.1215686275);
2380 margin-bottom: -29px;
2381 display: -webkit-box;
2382 display: -ms-flexbox;
2383 display: flex;
2384 -webkit-box-orient: vertical;
2385 -webkit-box-direction: normal;
2386 -ms-flex-direction: column;
2387 flex-direction: column;
2388 }
2389
2390 .merchant-module-page-preview-browser-inner {
2391 -webkit-box-flex: 1;
2392 -ms-flex-positive: 1;
2393 flex-grow: 1;
2394 position: relative;
2395 display: block;
2396 }
2397
2398 .merchant-module-page-preview-box {
2399 overflow: hidden;
2400 position: sticky;
2401 top: 45px;
2402 }
2403
2404 .merchant-module-page-settings,
2405 .merchant-module-page-preview-box {
2406 display: -webkit-box;
2407 display: -ms-flexbox;
2408 display: flex;
2409 grid-gap: 30px;
2410 -webkit-box-orient: vertical;
2411 -webkit-box-direction: normal;
2412 -ms-flex-direction: column;
2413 flex-direction: column;
2414 padding: 30px;
2415 background-color: #fff;
2416 -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
2417 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
2418 border-radius: 4px;
2419 }
2420
2421 .merchant-module-page-setting-box {
2422 display: -webkit-box;
2423 display: -ms-flexbox;
2424 display: flex;
2425 }
2426 .merchant-module-page-setting-box.merchant-module-page-setting-box-style-2 {
2427 -webkit-box-orient: vertical;
2428 -webkit-box-direction: normal;
2429 -ms-flex-direction: column;
2430 flex-direction: column;
2431 grid-gap: 20px;
2432 }
2433 .merchant-module-page-setting-box.merchant-module-page-setting-box-style-2 .merchant-module-page-setting-title,
2434 .merchant-module-page-setting-box.merchant-module-page-setting-box-style-2 .merchant-module-page-setting-fields {
2435 width: 100%;
2436 }
2437
2438 .merchant-module-page-preview-title,
2439 .merchant-module-page-setting-title {
2440 margin-top: 0;
2441 padding-right: 50px;
2442 font-size: 20px;
2443 font-weight: 500;
2444 color: #2F2F2F;
2445 }
2446
2447 .merchant-module-page-setting-title {
2448 width: 40%;
2449 }
2450
2451 .merchant-module-page-setting-subtitle {
2452 margin-top: 20px;
2453 font-size: 13px;
2454 font-weight: 400;
2455 color: #757575;
2456 }
2457
2458 .merchant-module-page-setting-fields {
2459 display: -webkit-box;
2460 display: -ms-flexbox;
2461 display: flex;
2462 -webkit-box-orient: vertical;
2463 -webkit-box-direction: normal;
2464 -ms-flex-direction: column;
2465 flex-direction: column;
2466 width: 60%;
2467 padding: 30px;
2468 border-radius: 4px;
2469 border: 2px solid #F0F0F1;
2470 background-color: #fff;
2471 }
2472 .merchant-module-page-setting-fields > .merchant-module-page-setting-field:last-of-type {
2473 margin-bottom: 0;
2474 }
2475
2476 .merchant-module-page-setting-field {
2477 display: -webkit-box;
2478 display: -ms-flexbox;
2479 display: flex;
2480 grid-gap: 10px;
2481 -webkit-box-orient: vertical;
2482 -webkit-box-direction: normal;
2483 -ms-flex-direction: column;
2484 flex-direction: column;
2485 margin-bottom: 24px;
2486 }
2487 .merchant-module-page-setting-field.merchant-show {
2488 display: -webkit-box;
2489 display: -ms-flexbox;
2490 display: flex;
2491 }
2492 .merchant-module-page-setting-field.merchant-hide {
2493 display: none;
2494 }
2495 .merchant-module-page-setting-field[data-id=shortcode_text] {
2496 margin-top: 24px;
2497 }
2498
2499 .merchant-module-page-setting-field-title {
2500 font-size: 14px;
2501 font-weight: 500;
2502 color: #2F2F2F;
2503 }
2504 .merchant-module-page-setting-field-title__has-upsell {
2505 gap: 7px !important;
2506 }
2507 .merchant-module-page-setting-field-title__has-upsell,
2508 .merchant-module-page-setting-field-title__has-upsell a span {
2509 display: -webkit-box;
2510 display: -ms-flexbox;
2511 display: flex;
2512 -webkit-box-align: center;
2513 -ms-flex-align: center;
2514 align-items: center;
2515 }
2516
2517 .merchant-module-page-setting-field-desc {
2518 font-size: 13px;
2519 font-weight: 400;
2520 color: #777;
2521 }
2522 .merchant-module-page-setting-field-desc-has-hidden-desc {
2523 display: -webkit-box;
2524 display: -ms-flexbox;
2525 display: flex;
2526 gap: 5px;
2527 }
2528 .merchant-module-page-setting-field-desc a {
2529 color: #3858E9;
2530 }
2531 .merchant-module-page-setting-field-desc a:focus {
2532 -webkit-box-shadow: none;
2533 box-shadow: none;
2534 }
2535
2536 .merchant-module-page-setting-field-hidden-desc {
2537 display: none;
2538 }
2539 .merchant-module-page-setting-field-hidden-desc-trigger {
2540 color: #3858E9;
2541 font-weight: 500;
2542 display: -webkit-box;
2543 display: -ms-flexbox;
2544 display: flex;
2545 cursor: pointer;
2546 gap: 3px;
2547 }
2548 .merchant-module-page-setting-field-hidden-desc-trigger img {
2549 margin-top: 2px;
2550 }
2551 .merchant-module-page-setting-field-hidden-desc-trigger.expanded img {
2552 -webkit-transform: rotate(180deg);
2553 transform: rotate(180deg);
2554 }
2555
2556 .merchant-license-form-wrapper .merchant-license-form {
2557 display: -webkit-box;
2558 display: -ms-flexbox;
2559 display: flex;
2560 -ms-flex-wrap: wrap;
2561 flex-wrap: wrap;
2562 grid-gap: 10px;
2563 }
2564 .merchant-license-form-wrapper .merchant-license-form input {
2565 width: 400px;
2566 max-width: 100%;
2567 padding-left: 36px;
2568 min-height: 36px;
2569 }
2570 .merchant-license-form-wrapper .merchant-license-form input::-webkit-input-placeholder {
2571 opacity: 0.75;
2572 }
2573 .merchant-license-form-wrapper .merchant-license-form input::-moz-placeholder {
2574 opacity: 0.75;
2575 }
2576 .merchant-license-form-wrapper .merchant-license-form input:-ms-input-placeholder {
2577 opacity: 0.75;
2578 }
2579 .merchant-license-form-wrapper .merchant-license-form input::-ms-input-placeholder {
2580 opacity: 0.75;
2581 }
2582 .merchant-license-form-wrapper .merchant-license-form input::placeholder {
2583 opacity: 0.75;
2584 }
2585 .merchant-license-form-wrapper .merchant-license-form button {
2586 position: relative;
2587 display: -webkit-box;
2588 display: -ms-flexbox;
2589 display: flex;
2590 grid-gap: 2px;
2591 -webkit-box-align: center;
2592 -ms-flex-align: center;
2593 align-items: center;
2594 line-height: 1em;
2595 min-height: 36px;
2596 padding: 10px 40px !important;
2597 background-color: transparent;
2598 color: #3858E9;
2599 border-color: #3858E9;
2600 }
2601 .merchant-license-form-wrapper .merchant-license-form button:hover, .merchant-license-form-wrapper .merchant-license-form button:focus, .merchant-license-form-wrapper .merchant-license-form button:active {
2602 color: #FFF;
2603 background-color: #3452da;
2604 border-color: #3452da;
2605 }
2606 .merchant-license-form-wrapper .merchant-license-form button.merchant-license-button-deactivate {
2607 color: #d82c0d;
2608 border-color: #d82c0d;
2609 }
2610 .merchant-license-form-wrapper .merchant-license-form button.merchant-license-button-deactivate:hover, .merchant-license-form-wrapper .merchant-license-form button.merchant-license-button-deactivate:focus, .merchant-license-form-wrapper .merchant-license-form button.merchant-license-button-deactivate:active {
2611 color: #FFF;
2612 background-color: #d82c0d;
2613 border-color: #d82c0d;
2614 }
2615 .merchant-license-form-wrapper .merchant-license-key-input {
2616 position: relative;
2617 display: -webkit-box;
2618 display: -ms-flexbox;
2619 display: flex;
2620 }
2621 @media (max-width: 768px) {
2622 .merchant-license-form-wrapper .merchant-license-key-input {
2623 max-width: 100%;
2624 }
2625 }
2626 .merchant-license-form-wrapper .merchant-license-key-input i {
2627 position: absolute;
2628 z-index: 1;
2629 top: 50%;
2630 left: 10px;
2631 -webkit-transform: translateY(-50%);
2632 transform: translateY(-50%);
2633 margin-top: -1px;
2634 font-size: 20px !important;
2635 color: #5C5F62;
2636 }
2637
2638 .mechant-license-response-wrapper,
2639 .merchant-dashboard-license-success {
2640 display: block;
2641 margin-top: 10px;
2642 color: #757575;
2643 }
2644 .mechant-license-response-wrapper span,
2645 .merchant-dashboard-license-success span {
2646 margin-left: 5px;
2647 }
2648
2649 .merchant-datetime-field input,
2650 .merchant-module-page-setting-field-text input,
2651 .merchant-module-page-setting-field-number input,
2652 .merchant-module-page-setting-field-text_readonly input {
2653 padding: 12px;
2654 line-height: 1.3em;
2655 width: 100%;
2656 max-width: 100%;
2657 min-height: auto;
2658 border: 1px solid #D6D6D6;
2659 }
2660 .merchant-datetime-field input:focus,
2661 .merchant-module-page-setting-field-text input:focus,
2662 .merchant-module-page-setting-field-number input:focus,
2663 .merchant-module-page-setting-field-text_readonly input:focus {
2664 outline: none;
2665 -webkit-box-shadow: none;
2666 box-shadow: none;
2667 border-color: #3858E9;
2668 }
2669
2670 .merchant-module-page-setting-field-textarea_multiline textarea,
2671 .merchant-module-page-setting-field-textarea textarea,
2672 .merchant-module-page-setting-field-textarea_code textarea {
2673 padding: 12px;
2674 line-height: 1.4;
2675 width: 100%;
2676 max-width: 100%;
2677 min-height: 120px;
2678 border: 1px solid #D6D6D6;
2679 }
2680 .merchant-module-page-setting-field-textarea_multiline textarea:focus,
2681 .merchant-module-page-setting-field-textarea textarea:focus,
2682 .merchant-module-page-setting-field-textarea_code textarea:focus {
2683 outline: none;
2684 -webkit-box-shadow: none;
2685 box-shadow: none;
2686 border-color: #3858E9;
2687 }
2688
2689 .merchant-module-page-setting-field-radio div:not(.merchant-module-page-setting-field-desc),
2690 .merchant-module-page-setting-field-radio_alt div:not(.merchant-module-page-setting-field-desc),
2691 .merchant-module-page-setting-field-checkbox div:not(.merchant-module-page-setting-field-desc),
2692 .merchant-module-page-setting-field-checkbox_multiple div:not(.merchant-module-page-setting-field-desc) {
2693 display: -webkit-box;
2694 display: -ms-flexbox;
2695 display: flex;
2696 grid-gap: 30px;
2697 }
2698 .merchant-module-page-setting-field-radio label,
2699 .merchant-module-page-setting-field-radio_alt label,
2700 .merchant-module-page-setting-field-checkbox label,
2701 .merchant-module-page-setting-field-checkbox_multiple label {
2702 display: -webkit-box;
2703 display: -ms-flexbox;
2704 display: flex;
2705 grid-gap: 12px;
2706 -webkit-box-align: center;
2707 -ms-flex-align: center;
2708 align-items: center;
2709 -webkit-user-select: none;
2710 -moz-user-select: none;
2711 -ms-user-select: none;
2712 user-select: none;
2713 }
2714 .merchant-module-page-setting-field-radio span,
2715 .merchant-module-page-setting-field-radio_alt span,
2716 .merchant-module-page-setting-field-checkbox span,
2717 .merchant-module-page-setting-field-checkbox_multiple span {
2718 font-size: 14px;
2719 font-weight: 400;
2720 color: #1D2327;
2721 }
2722 .merchant-module-page-setting-field-radio input,
2723 .merchant-module-page-setting-field-radio_alt input,
2724 .merchant-module-page-setting-field-checkbox input,
2725 .merchant-module-page-setting-field-checkbox_multiple input {
2726 -ms-flex-negative: 0;
2727 flex-shrink: 0;
2728 margin: 0;
2729 width: 20px;
2730 height: 20px;
2731 border: 1px solid #D6D6D6;
2732 background-color: #fff;
2733 display: -webkit-inline-box;
2734 display: -ms-inline-flexbox;
2735 display: inline-flex;
2736 -webkit-box-align: center;
2737 -ms-flex-align: center;
2738 align-items: center;
2739 -webkit-box-pack: center;
2740 -ms-flex-pack: center;
2741 justify-content: center;
2742 -webkit-transition: none;
2743 transition: none;
2744 -webkit-box-sizing: border-box;
2745 box-sizing: border-box;
2746 -webkit-box-shadow: none;
2747 box-shadow: none;
2748 }
2749 .merchant-module-page-setting-field-radio input:checked,
2750 .merchant-module-page-setting-field-radio_alt input:checked,
2751 .merchant-module-page-setting-field-checkbox input:checked,
2752 .merchant-module-page-setting-field-checkbox_multiple input:checked {
2753 -webkit-transition: none;
2754 transition: none;
2755 }
2756 .merchant-module-page-setting-field-radio input:checked::before,
2757 .merchant-module-page-setting-field-radio_alt input:checked::before,
2758 .merchant-module-page-setting-field-checkbox input:checked::before,
2759 .merchant-module-page-setting-field-checkbox_multiple input:checked::before {
2760 content: "";
2761 margin: 0;
2762 padding: 0;
2763 -webkit-box-sizing: border-box;
2764 box-sizing: border-box;
2765 -webkit-transition: none;
2766 transition: none;
2767 }
2768 .merchant-module-page-setting-field-radio input[type=checkbox],
2769 .merchant-module-page-setting-field-radio_alt input[type=checkbox],
2770 .merchant-module-page-setting-field-checkbox input[type=checkbox],
2771 .merchant-module-page-setting-field-checkbox_multiple input[type=checkbox] {
2772 border-radius: 6px;
2773 }
2774 .merchant-module-page-setting-field-radio input[type=checkbox]:focus,
2775 .merchant-module-page-setting-field-radio_alt input[type=checkbox]:focus,
2776 .merchant-module-page-setting-field-checkbox input[type=checkbox]:focus,
2777 .merchant-module-page-setting-field-checkbox_multiple input[type=checkbox]:focus {
2778 border-color: #fff;
2779 -webkit-box-shadow: 0 0 0 2px #3858E9;
2780 box-shadow: 0 0 0 2px #3858E9;
2781 }
2782 .merchant-module-page-setting-field-radio input[type=checkbox]:checked,
2783 .merchant-module-page-setting-field-radio_alt input[type=checkbox]:checked,
2784 .merchant-module-page-setting-field-checkbox input[type=checkbox]:checked,
2785 .merchant-module-page-setting-field-checkbox_multiple input[type=checkbox]:checked {
2786 border-color: #fff;
2787 background-color: #3858E9;
2788 }
2789 .merchant-module-page-setting-field-radio input[type=checkbox]:checked::before,
2790 .merchant-module-page-setting-field-radio_alt input[type=checkbox]:checked::before,
2791 .merchant-module-page-setting-field-checkbox input[type=checkbox]:checked::before,
2792 .merchant-module-page-setting-field-checkbox_multiple input[type=checkbox]:checked::before {
2793 width: 100%;
2794 height: 100%;
2795 background-image: url("data:image/svg+xml,%3Csvg width='11' height='9' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m10.7.89-6 8.07-3.77-2.8.75-1L4.44 7.2 9.69.14l1 .75Z' fill='%23fff'/%3E%3C/svg%3E");
2796 background-repeat: no-repeat;
2797 background-position: 3px 4px;
2798 }
2799 .merchant-module-page-setting-field-radio input[type=radio],
2800 .merchant-module-page-setting-field-radio_alt input[type=radio],
2801 .merchant-module-page-setting-field-checkbox input[type=radio],
2802 .merchant-module-page-setting-field-checkbox_multiple input[type=radio] {
2803 border-radius: 100%;
2804 }
2805 .merchant-module-page-setting-field-radio input[type=radio]:focus,
2806 .merchant-module-page-setting-field-radio_alt input[type=radio]:focus,
2807 .merchant-module-page-setting-field-checkbox input[type=radio]:focus,
2808 .merchant-module-page-setting-field-checkbox_multiple input[type=radio]:focus {
2809 border-color: #fff;
2810 -webkit-box-shadow: none;
2811 box-shadow: none;
2812 }
2813 .merchant-module-page-setting-field-radio input[type=radio]:checked,
2814 .merchant-module-page-setting-field-radio_alt input[type=radio]:checked,
2815 .merchant-module-page-setting-field-checkbox input[type=radio]:checked,
2816 .merchant-module-page-setting-field-checkbox_multiple input[type=radio]:checked {
2817 border-color: #3858E9;
2818 background-color: #fff;
2819 -webkit-box-shadow: 0 0 0 1px #3858E9;
2820 box-shadow: 0 0 0 1px #3858E9;
2821 }
2822 .merchant-module-page-setting-field-radio input[type=radio]:checked::before,
2823 .merchant-module-page-setting-field-radio_alt input[type=radio]:checked::before,
2824 .merchant-module-page-setting-field-checkbox input[type=radio]:checked::before,
2825 .merchant-module-page-setting-field-checkbox_multiple input[type=radio]:checked::before {
2826 width: 12px;
2827 height: 12px;
2828 border-radius: 12px;
2829 background-color: #3858E9;
2830 }
2831
2832 .merchant-module-page-setting-field-checkbox_multiple div {
2833 grid-gap: 0;
2834 }
2835 .merchant-module-page-setting-field-checkbox_multiple .merchant-module-page-setting-field-inner {
2836 display: -webkit-box;
2837 display: -ms-flexbox;
2838 display: flex;
2839 -webkit-box-orient: vertical;
2840 -webkit-box-direction: normal;
2841 -ms-flex-direction: column;
2842 flex-direction: column;
2843 gap: 15px !important;
2844 }
2845
2846 @media (max-width: 1300px) {
2847 .merchant-module-page-setting-field-radio div {
2848 grid-gap: 20px;
2849 }
2850 }
2851 .merchant-module-page-setting-field-radio span {
2852 opacity: 0.8;
2853 }
2854 .merchant-module-page-setting-field-radio input[type=radio]:checked + span {
2855 opacity: 1;
2856 }
2857
2858 .merchant-module-page-setting-field-radio_alt div {
2859 display: -webkit-box;
2860 display: -ms-flexbox;
2861 display: flex;
2862 grid-gap: 10px;
2863 -webkit-box-orient: vertical;
2864 -webkit-box-direction: normal;
2865 -ms-flex-direction: column;
2866 flex-direction: column;
2867 }
2868 .merchant-module-page-setting-field-radio_alt label span {
2869 font-size: 14px;
2870 font-weight: 400;
2871 color: #1D2327;
2872 }
2873 .merchant-module-page-setting-field-radio_alt p {
2874 margin: 0;
2875 color: #757575;
2876 }
2877 .merchant-module-page-setting-field-radio_alt .merchant-module-page-setting-field-inner {
2878 grid-gap: 30px;
2879 -webkit-box-orient: vertical;
2880 -webkit-box-direction: normal;
2881 -ms-flex-direction: column;
2882 flex-direction: column;
2883 }
2884
2885 .merchant-module-page-setting-field-content {
2886 max-width: 60vw;
2887 }
2888 .merchant-module-page-setting-field-content a {
2889 color: #3858E9;
2890 }
2891 .merchant-module-page-setting-field-content a:focus {
2892 -webkit-box-shadow: none;
2893 box-shadow: none;
2894 }
2895 .merchant-module-page-setting-field-content .merchant-module-page-setting-field-inner:empty {
2896 display: none;
2897 }
2898
2899 .merchant-info-block,
2900 .merchant-tag-pre-orders {
2901 display: -webkit-box;
2902 display: -ms-flexbox;
2903 display: flex;
2904 grid-gap: 16px;
2905 }
2906 .merchant-info-block a,
2907 .merchant-tag-pre-orders a {
2908 display: -webkit-box;
2909 display: -ms-flexbox;
2910 display: flex;
2911 -webkit-box-align: center;
2912 -ms-flex-align: center;
2913 align-items: center;
2914 -webkit-box-pack: center;
2915 -ms-flex-pack: center;
2916 justify-content: center;
2917 margin: 0;
2918 padding: 8px 26px;
2919 font-size: 14px;
2920 line-height: 20px;
2921 -webkit-user-select: none;
2922 -moz-user-select: none;
2923 -ms-user-select: none;
2924 user-select: none;
2925 min-width: 145px;
2926 font-weight: 500;
2927 text-decoration: none;
2928 border-radius: 4px;
2929 color: #202223;
2930 border: 1px solid #C9CCCF;
2931 background-color: #fff;
2932 }
2933 .merchant-info-block a:focus, .merchant-info-block a:active,
2934 .merchant-tag-pre-orders a:focus,
2935 .merchant-tag-pre-orders a:active {
2936 outline: none;
2937 -webkit-box-shadow: none;
2938 box-shadow: none;
2939 }
2940 .merchant-info-block p,
2941 .merchant-tag-pre-orders p {
2942 display: -webkit-box;
2943 display: -ms-flexbox;
2944 display: flex;
2945 -webkit-box-orient: vertical;
2946 -webkit-box-direction: normal;
2947 -ms-flex-direction: column;
2948 flex-direction: column;
2949 -webkit-box-align: start;
2950 -ms-flex-align: start;
2951 align-items: flex-start;
2952 grid-gap: 16px;
2953 font-size: 14px;
2954 line-height: 20px;
2955 margin: 0;
2956 padding: 0;
2957 }
2958 .merchant-info-block p i,
2959 .merchant-tag-pre-orders p i {
2960 -ms-flex-negative: 0;
2961 flex-shrink: 0;
2962 }
2963
2964 .merchant-info-block {
2965 padding: 15px;
2966 border-radius: 4px;
2967 border: 1px solid #BABFC3;
2968 }
2969
2970 .merchant-module-page-setting-field-select select,
2971 .merchant-module-page-setting-field-select_ajax select,
2972 .merchant-module-page-setting-field-select_size_chart select {
2973 padding: 12px 20px 12px 12px;
2974 line-height: 1.3em;
2975 width: 100%;
2976 max-width: 100%;
2977 min-height: auto;
2978 border-radius: 6px;
2979 color: #2F2F2F;
2980 border: 1px solid #D6D6D6;
2981 }
2982 .merchant-module-page-setting-field-select select:hover,
2983 .merchant-module-page-setting-field-select_ajax select:hover,
2984 .merchant-module-page-setting-field-select_size_chart select:hover {
2985 color: #2F2F2F;
2986 }
2987 .merchant-module-page-setting-field-select select:focus,
2988 .merchant-module-page-setting-field-select_ajax select:focus,
2989 .merchant-module-page-setting-field-select_size_chart select:focus {
2990 outline: none;
2991 -webkit-box-shadow: none;
2992 box-shadow: none;
2993 border-color: #3858E9;
2994 }
2995 .merchant-module-page-setting-field-select select option,
2996 .merchant-module-page-setting-field-select_ajax select option,
2997 .merchant-module-page-setting-field-select_size_chart select option {
2998 color: #2F2F2F;
2999 }
3000 .merchant-module-page-setting-field-select .select2-container .select2-selection--single,
3001 .merchant-module-page-setting-field-select_ajax .select2-container .select2-selection--single,
3002 .merchant-module-page-setting-field-select_size_chart .select2-container .select2-selection--single {
3003 height: 44px !important;
3004 border: solid #d6d6d6 1px;
3005 }
3006 .merchant-module-page-setting-field-select .select2-container .select2-selection--single .select2-selection__rendered,
3007 .merchant-module-page-setting-field-select_ajax .select2-container .select2-selection--single .select2-selection__rendered,
3008 .merchant-module-page-setting-field-select_size_chart .select2-container .select2-selection--single .select2-selection__rendered {
3009 line-height: 41px !important;
3010 }
3011 .merchant-module-page-setting-field-select .select2-container .select2-selection--multiple,
3012 .merchant-module-page-setting-field-select_ajax .select2-container .select2-selection--multiple,
3013 .merchant-module-page-setting-field-select_size_chart .select2-container .select2-selection--multiple {
3014 display: -webkit-box;
3015 display: -ms-flexbox;
3016 display: flex;
3017 -webkit-box-align: center;
3018 -ms-flex-align: center;
3019 align-items: center;
3020 border: solid #d6d6d6 1px;
3021 }
3022 .merchant-module-page-setting-field-select .select2-container .select2-selection--multiple .select2-selection__rendered,
3023 .merchant-module-page-setting-field-select_ajax .select2-container .select2-selection--multiple .select2-selection__rendered,
3024 .merchant-module-page-setting-field-select_size_chart .select2-container .select2-selection--multiple .select2-selection__rendered {
3025 padding: 5px 10px;
3026 }
3027 .merchant-module-page-setting-field-select .select2-container .select2-selection--multiple .select2-selection__choice,
3028 .merchant-module-page-setting-field-select_ajax .select2-container .select2-selection--multiple .select2-selection__choice,
3029 .merchant-module-page-setting-field-select_size_chart .select2-container .select2-selection--multiple .select2-selection__choice {
3030 margin-top: 6px;
3031 margin-bottom: 0;
3032 }
3033 .merchant-module-page-setting-field-select .select2-container .select2-selection--multiple .select2-selection__choice ~ li .select2-search__field,
3034 .merchant-module-page-setting-field-select_ajax .select2-container .select2-selection--multiple .select2-selection__choice ~ li .select2-search__field,
3035 .merchant-module-page-setting-field-select_size_chart .select2-container .select2-selection--multiple .select2-selection__choice ~ li .select2-search__field {
3036 position: relative;
3037 top: 3px;
3038 margin-top: 0;
3039 }
3040 .merchant-module-page-setting-field-select .select2-container .select2-selection--multiple .select2-search__field,
3041 .merchant-module-page-setting-field-select_ajax .select2-container .select2-selection--multiple .select2-search__field,
3042 .merchant-module-page-setting-field-select_size_chart .select2-container .select2-selection--multiple .select2-search__field {
3043 min-height: 0;
3044 border: none;
3045 }
3046 .merchant-module-page-setting-field-select .select2-container.select2-container--focus .select2-selection--single,
3047 .merchant-module-page-setting-field-select .select2-container.select2-container--focus .select2-selection--multiple,
3048 .merchant-module-page-setting-field-select_ajax .select2-container.select2-container--focus .select2-selection--single,
3049 .merchant-module-page-setting-field-select_ajax .select2-container.select2-container--focus .select2-selection--multiple,
3050 .merchant-module-page-setting-field-select_size_chart .select2-container.select2-container--focus .select2-selection--single,
3051 .merchant-module-page-setting-field-select_size_chart .select2-container.select2-container--focus .select2-selection--multiple {
3052 border-color: #3858E9;
3053 }
3054 .merchant-module-page-setting-field-select .select2-selection__arrow,
3055 .merchant-module-page-setting-field-select_ajax .select2-selection__arrow,
3056 .merchant-module-page-setting-field-select_size_chart .select2-selection__arrow {
3057 height: 43px !important;
3058 }
3059
3060 .merchant-module-page-setting-field-hook_select .merchant-module-page-setting-field-hook_select-wrapper {
3061 display: -webkit-box;
3062 display: -ms-flexbox;
3063 display: flex;
3064 grid-gap: 15px;
3065 }
3066 .merchant-module-page-setting-field-hook_select .merchant-module-page-setting-field-hook_select-wrapper .merchant-module-page-setting-field-select {
3067 width: 100%;
3068 }
3069 .merchant-module-page-setting-field-hook_select .merchant-module-page-setting-field-hook_select-wrapper .merchant-module-page-setting-field-number {
3070 width: 100px;
3071 }
3072
3073 .merchant-module-page-setting-field-choices input {
3074 display: none;
3075 }
3076 .merchant-module-page-setting-field-choices input:checked + figure {
3077 border-color: #3858E9;
3078 }
3079 .merchant-module-page-setting-field-choices input:disabled + figure {
3080 opacity: 0.5;
3081 cursor: not-allowed;
3082 }
3083 .merchant-module-page-setting-field-choices label {
3084 display: -webkit-box;
3085 display: -ms-flexbox;
3086 display: flex;
3087 position: relative;
3088 }
3089 .merchant-module-page-setting-field-choices label:hover .merchant-tooltip {
3090 opacity: 1;
3091 visibility: visible;
3092 -webkit-transform: translate3d(-50%, 0, 0);
3093 transform: translate3d(-50%, 0, 0);
3094 }
3095 .merchant-module-page-setting-field-choices figure {
3096 display: -webkit-box;
3097 display: -ms-flexbox;
3098 display: flex;
3099 margin: 0;
3100 padding: 2px;
3101 border-radius: 4px;
3102 border: 2px solid transparent;
3103 }
3104 .merchant-module-page-setting-field-choices .merchant-tooltip {
3105 position: absolute;
3106 z-index: 10;
3107 left: 50%;
3108 bottom: calc(100% + 12px);
3109 padding: 3px 12px;
3110 font-size: 11px;
3111 white-space: nowrap;
3112 opacity: 0;
3113 visibility: hidden;
3114 -webkit-transform: translate3d(-50%, 6px, 0);
3115 transform: translate3d(-50%, 6px, 0);
3116 -webkit-transition: all 0.2s;
3117 transition: all 0.2s;
3118 border-radius: 3px;
3119 color: #f7f7f7;
3120 background-color: #212121;
3121 }
3122 .merchant-module-page-setting-field-choices .merchant-tooltip:after {
3123 content: "";
3124 position: absolute;
3125 left: 50%;
3126 bottom: -12px;
3127 border: 6px solid transparent;
3128 border-top-color: #212121;
3129 -webkit-transform: translate3d(-50%, 0, 0);
3130 transform: translate3d(-50%, 0, 0);
3131 }
3132 .merchant-module-page-setting-field-choices .merchant-choices {
3133 display: -webkit-box;
3134 display: -ms-flexbox;
3135 display: flex;
3136 grid-gap: 10px;
3137 }
3138 .merchant-module-page-setting-field-choices .merchant-choices label {
3139 cursor: pointer;
3140 }
3141 .merchant-module-page-setting-field-choices .merchant-choices svg {
3142 width: 20px;
3143 height: 20px;
3144 }
3145
3146 .merchant-module-page-setting-field-buttons input {
3147 display: none;
3148 }
3149 .merchant-module-page-setting-field-buttons input:checked + span {
3150 color: #fff;
3151 background-color: #3858E9;
3152 }
3153 .merchant-module-page-setting-field-buttons label {
3154 display: -webkit-box;
3155 display: -ms-flexbox;
3156 display: flex;
3157 }
3158 .merchant-module-page-setting-field-buttons span {
3159 display: -webkit-box;
3160 display: -ms-flexbox;
3161 display: flex;
3162 -webkit-box-align: center;
3163 -ms-flex-align: center;
3164 align-items: center;
3165 -webkit-box-pack: center;
3166 -ms-flex-pack: center;
3167 justify-content: center;
3168 margin: 0;
3169 padding: 10px 15px;
3170 border-radius: 2px;
3171 -webkit-user-select: none;
3172 -moz-user-select: none;
3173 -ms-user-select: none;
3174 user-select: none;
3175 min-width: 120px;
3176 font-weight: 500;
3177 }
3178 .merchant-module-page-setting-field-buttons .merchant-buttons {
3179 display: -webkit-inline-box;
3180 display: -ms-inline-flexbox;
3181 display: inline-flex;
3182 padding: 3px;
3183 border: 1px solid #D6D6D6;
3184 border-radius: 4px;
3185 }
3186 .merchant-module-page-setting-field-buttons .merchant-button-underline span {
3187 text-decoration: underline;
3188 }
3189 .merchant-module-page-setting-field-buttons .merchant-button-line-through span {
3190 text-decoration: line-through;
3191 }
3192 .merchant-module-page-setting-field-buttons .merchant-button-overline span {
3193 text-decoration: overline;
3194 }
3195
3196 .merchant-module-page-setting-field-buttons_content input,
3197 .merchant-module-page-setting-field-buttons_alt input {
3198 display: none;
3199 }
3200 .merchant-module-page-setting-field-buttons_content label,
3201 .merchant-module-page-setting-field-buttons_alt label {
3202 display: -webkit-box;
3203 display: -ms-flexbox;
3204 display: flex;
3205 cursor: pointer;
3206 }
3207 .merchant-module-page-setting-field-buttons_content label:hover,
3208 .merchant-module-page-setting-field-buttons_alt label:hover {
3209 position: relative;
3210 z-index: 10;
3211 }
3212 .merchant-module-page-setting-field-buttons_content label > span,
3213 .merchant-module-page-setting-field-buttons_alt label > span {
3214 display: -webkit-box;
3215 display: -ms-flexbox;
3216 display: flex;
3217 -webkit-box-align: center;
3218 -ms-flex-align: center;
3219 align-items: center;
3220 -webkit-box-pack: center;
3221 -ms-flex-pack: center;
3222 justify-content: center;
3223 margin: 0;
3224 padding: 10px 15px;
3225 -webkit-user-select: none;
3226 -moz-user-select: none;
3227 -ms-user-select: none;
3228 user-select: none;
3229 min-width: 120px;
3230 font-weight: 500;
3231 border-radius: 4px;
3232 border: 1px solid #D6D6D6;
3233 background-color: #fff;
3234 }
3235 .merchant-module-page-setting-field-buttons_content .merchant-buttons-content,
3236 .merchant-module-page-setting-field-buttons_content .merchant-buttons,
3237 .merchant-module-page-setting-field-buttons_alt .merchant-buttons-content,
3238 .merchant-module-page-setting-field-buttons_alt .merchant-buttons {
3239 display: -webkit-box;
3240 display: -ms-flexbox;
3241 display: flex;
3242 -ms-flex-wrap: wrap;
3243 flex-wrap: wrap;
3244 grid-gap: 5px;
3245 padding: 3px;
3246 }
3247
3248 .merchant-module-page-setting-field-buttons_alt input:checked + span {
3249 color: #fff;
3250 background-color: #3858E9;
3251 }
3252
3253 .merchant-module-page-setting-field-buttons_content input:checked + span {
3254 color: inherit;
3255 border: 1px solid #3858E9;
3256 -webkit-box-shadow: 0 0 0 1px #3858e9 inset;
3257 box-shadow: 0 0 0 1px #3858e9 inset;
3258 }
3259 .merchant-module-page-setting-field-buttons_content label {
3260 -webkit-box-flex: 1;
3261 -ms-flex: 1;
3262 flex: 1;
3263 }
3264 .merchant-module-page-setting-field-buttons_content .merchant-buttons-content {
3265 gap: 10px;
3266 }
3267 .merchant-module-page-setting-field-buttons_content .merchant-buttons-inner-content {
3268 display: -webkit-box;
3269 display: -ms-flexbox;
3270 display: flex;
3271 -webkit-box-align: center;
3272 -ms-flex-align: center;
3273 align-items: center;
3274 -webkit-box-pack: start;
3275 -ms-flex-pack: start;
3276 justify-content: flex-start;
3277 gap: 10px;
3278 -webkit-box-flex: 1;
3279 -ms-flex: 1;
3280 flex: 1;
3281 }
3282 .merchant-module-page-setting-field-buttons_content .merchant-buttons-inner-content > span {
3283 display: -webkit-box;
3284 display: -ms-flexbox;
3285 display: flex;
3286 -ms-flex-item-align: stretch;
3287 align-self: stretch;
3288 -webkit-box-orient: vertical;
3289 -webkit-box-direction: normal;
3290 -ms-flex-direction: column;
3291 flex-direction: column;
3292 gap: 5px;
3293 }
3294
3295 .merchant-animated-buttons .merchant-buttons {
3296 display: grid;
3297 grid-template-columns: repeat(5, 1fr);
3298 }
3299 .merchant-animated-buttons span {
3300 width: 100%;
3301 }
3302
3303 @media (max-width: 1470px) {
3304 .merchant-animated-buttons .merchant-buttons {
3305 grid-template-columns: repeat(3, 1fr);
3306 }
3307 }
3308 @media (max-width: 1050px) {
3309 .merchant-animated-buttons .merchant-buttons {
3310 grid-template-columns: repeat(2, 1fr);
3311 }
3312 }
3313 /* Sortable Field */
3314 .merchant-sortable {
3315 max-width: 300px;
3316 }
3317 .merchant-sortable ul.ui-sortable li {
3318 position: relative;
3319 overflow: hidden;
3320 padding: 0;
3321 color: #1E1E1E;
3322 border: 1px solid #ddd;
3323 border-radius: 2px;
3324 text-transform: capitalize;
3325 line-height: 36px;
3326 cursor: -webkit-grab;
3327 cursor: grab;
3328 }
3329 .merchant-sortable ul.ui-sortable li .dashicons {
3330 width: 36px;
3331 height: 36px;
3332 -ms-flex-preferred-size: 36px;
3333 flex-basis: 36px;
3334 display: -webkit-box;
3335 display: -ms-flexbox;
3336 display: flex;
3337 -webkit-box-pack: center;
3338 -ms-flex-pack: center;
3339 justify-content: center;
3340 -webkit-box-align: center;
3341 -ms-flex-align: center;
3342 align-items: center;
3343 text-align: center;
3344 -webkit-box-sizing: border-box;
3345 box-sizing: border-box;
3346 }
3347 .merchant-sortable ul.ui-sortable li .dashicons:before {
3348 font-size: 16px;
3349 line-height: 1em;
3350 }
3351 .merchant-sortable ul.ui-sortable li .dashicons.dashicons-menu {
3352 float: left;
3353 padding: 0;
3354 margin: 0 10px 0 0;
3355 border: none;
3356 border-right: 1px solid #ddd;
3357 }
3358 .merchant-sortable ul.ui-sortable li .dashicons.dashicons-visibility {
3359 float: right;
3360 color: #3858E9;
3361 padding: 0;
3362 margin: 0 0 0 10px;
3363 border: none;
3364 border-left: 1px solid #ddd;
3365 }
3366 .merchant-sortable ul.ui-sortable li .dashicons.visibility {
3367 cursor: pointer;
3368 }
3369 .merchant-sortable ul.ui-sortable li.invisible {
3370 color: #6E7780;
3371 border: 1px solid #CAD2F6;
3372 background-color: #EBEEFB;
3373 }
3374 .merchant-sortable ul.ui-sortable li.invisible .dashicons.dashicons-visibility:before {
3375 content: "\f530";
3376 }
3377
3378 /* Sortable Repeater Field */
3379 .merchant-group-field {
3380 padding: 30px 20px;
3381 border: 2px solid #F0F0F1;
3382 border-radius: 4px;
3383 margin-bottom: 20px;
3384 }
3385 .merchant-group-field .title-area {
3386 position: relative;
3387 }
3388 .merchant-group-field .title-area .merchant-module-page-setting-field-title {
3389 margin-bottom: 10px;
3390 }
3391 .merchant-group-field .title-area .field-status:not(.hidden) {
3392 border-radius: 15px;
3393 padding: 3px 8px;
3394 font-size: 12px;
3395 margin-left: 20px;
3396 }
3397 .merchant-group-field .title-area .field-status:not(.hidden).active {
3398 color: #04543F;
3399 background-color: #DEF7EC;
3400 }
3401 .merchant-group-field .title-area .field-status:not(.hidden).inactive {
3402 color: #723B14;
3403 background-color: #FDF6B2;
3404 }
3405 .merchant-group-field .title-area.accordion-style {
3406 padding-right: 40px;
3407 }
3408 .merchant-group-field .title-area.accordion-style .accordion-icon {
3409 position: absolute;
3410 top: 0;
3411 right: -7px;
3412 width: 40px;
3413 height: 40px;
3414 line-height: 40px;
3415 cursor: pointer;
3416 font-size: 17px;
3417 -webkit-transition: 300ms;
3418 transition: 300ms;
3419 }
3420 .merchant-group-field .title-area.accordion-style.ui-accordion-header-active .accordion-icon {
3421 -webkit-transform: rotate(180deg);
3422 transform: rotate(180deg);
3423 }
3424 .merchant-group-field .merchant-group-fields-container {
3425 padding-top: 20px;
3426 }
3427 .merchant-group-field .merchant-module-page-setting-field:last-child {
3428 margin-bottom: 0 !important;
3429 }
3430
3431 .merchant-sortable-repeater-control {
3432 max-width: 100%;
3433 }
3434 .merchant-sortable-repeater-control .sortable {
3435 list-style-type: none;
3436 margin: 0;
3437 padding: 0;
3438 }
3439 .merchant-sortable-repeater-control .sortable input[type=text] {
3440 width: 100%;
3441 margin: 0;
3442 border-radius: 4px 0 0 4px;
3443 border: 1px solid #D6D6D6;
3444 padding: 12px 8px;
3445 line-height: 1.3em;
3446 }
3447 .merchant-sortable-repeater-control .sortable input[type=text]:focus {
3448 border-color: #3858E9;
3449 outline: none;
3450 -webkit-box-shadow: none;
3451 box-shadow: none;
3452 }
3453 .merchant-sortable-repeater-control .sortable div {
3454 cursor: -webkit-grab;
3455 cursor: grab;
3456 margin-bottom: 7px;
3457 }
3458 .merchant-sortable-repeater-control .customize-control-sortable-repeater-delete {
3459 display: -webkit-box;
3460 display: -ms-flexbox;
3461 display: flex;
3462 -webkit-box-align: center;
3463 -ms-flex-align: center;
3464 align-items: center;
3465 -webkit-box-pack: center;
3466 -ms-flex-pack: center;
3467 justify-content: center;
3468 margin: 0;
3469 width: 44px;
3470 height: auto;
3471 font-size: 1.3em;
3472 line-height: 34px;
3473 color: #d4d4d4;
3474 background: #fff;
3475 padding: 0;
3476 vertical-align: top;
3477 margin-left: -1px;
3478 border: 1px solid #D6D6D6;
3479 text-decoration: none;
3480 }
3481 .merchant-sortable-repeater-control .customize-control-sortable-repeater-delete .dashicons-no-alt {
3482 width: 100%;
3483 text-decoration: none;
3484 margin: 0;
3485 font-weight: 600;
3486 color: #50575e;
3487 font-size: 1.1em;
3488 line-height: 34px;
3489 height: auto;
3490 }
3491 .merchant-sortable-repeater-control .customize-control-sortable-repeater-delete:hover, .merchant-sortable-repeater-control .customize-control-sortable-repeater-delete:focus {
3492 outline: none;
3493 -webkit-box-shadow: none;
3494 box-shadow: none;
3495 }
3496 .merchant-sortable-repeater-control .customize-control-sortable-repeater-delete:hover .dashicons-no-alt, .merchant-sortable-repeater-control .customize-control-sortable-repeater-delete:focus .dashicons-no-alt {
3497 color: #a7a7a7;
3498 }
3499 .merchant-sortable-repeater-control .repeater {
3500 display: -webkit-box;
3501 display: -ms-flexbox;
3502 display: flex;
3503 }
3504 .merchant-sortable-repeater-control .repeater .dashicons-menu {
3505 display: -webkit-box;
3506 display: -ms-flexbox;
3507 display: flex;
3508 -webkit-box-align: center;
3509 -ms-flex-align: center;
3510 align-items: center;
3511 -webkit-box-pack: center;
3512 -ms-flex-pack: center;
3513 justify-content: center;
3514 margin: 0;
3515 width: 44px;
3516 height: auto;
3517 font-size: 1.3em;
3518 line-height: 34px;
3519 background: #fff;
3520 padding: 0;
3521 vertical-align: top;
3522 margin-left: -1px;
3523 border: 1px solid #D6D6D6;
3524 }
3525 .merchant-sortable-repeater-control .repeater .dashicons-menu:hover {
3526 color: #a7a7a7;
3527 }
3528 .merchant-sortable-repeater-control .customize-control-sortable-repeater-add {
3529 color: #3858E9;
3530 border-color: #3858E9;
3531 background-color: transparent;
3532 margin-top: 10px;
3533 padding: 4px 19px;
3534 }
3535 .merchant-sortable-repeater-control .customize-control-sortable-repeater-add:hover, .merchant-sortable-repeater-control .customize-control-sortable-repeater-add:focus {
3536 outline: none;
3537 -webkit-box-shadow: none;
3538 box-shadow: none;
3539 background-color: #ffffff;
3540 }
3541 .merchant-sortable-repeater-control.disable-sorting .dashicons-menu {
3542 display: none;
3543 }
3544
3545 /* Flexible Content Field */
3546 .merchant-flexible-content-control {
3547 max-width: 100%;
3548 }
3549 .merchant-flexible-content-control .layout {
3550 position: relative;
3551 }
3552 .merchant-flexible-content-control .sortable {
3553 position: relative;
3554 list-style-type: none;
3555 margin: 0;
3556 padding: 0;
3557 }
3558 .merchant-flexible-content-control .sortable input[type=text] {
3559 width: 100%;
3560 margin: 0;
3561 border-radius: 4px 0 0 4px;
3562 border: 1px solid #D6D6D6;
3563 padding: 8px;
3564 line-height: 1.3em;
3565 }
3566 .merchant-flexible-content-control .sortable input[type=text]:focus {
3567 border-color: #3858E9;
3568 outline: none;
3569 -webkit-box-shadow: none;
3570 box-shadow: none;
3571 }
3572 .merchant-flexible-content-control .customize-control-flexible-content-move {
3573 display: none;
3574 cursor: -webkit-grab;
3575 cursor: grab;
3576 position: absolute;
3577 top: 19px;
3578 left: -22px;
3579 z-index: 999;
3580 }
3581 .merchant-flexible-content-control .customize-control-flexible-content-delete,
3582 .merchant-flexible-content-control .customize-control-flexible-content-duplicate {
3583 text-decoration: none;
3584 }
3585 .merchant-flexible-content-control .customize-control-flexible-content-delete .dashicons-no-alt,
3586 .merchant-flexible-content-control .customize-control-flexible-content-duplicate .dashicons-no-alt {
3587 width: 100%;
3588 text-decoration: none;
3589 margin: 0;
3590 font-weight: 600;
3591 color: #50575e;
3592 font-size: 1.1em;
3593 line-height: 34px;
3594 height: auto;
3595 }
3596 .merchant-flexible-content-control .customize-control-flexible-content-delete:hover, .merchant-flexible-content-control .customize-control-flexible-content-delete:focus,
3597 .merchant-flexible-content-control .customize-control-flexible-content-duplicate:hover,
3598 .merchant-flexible-content-control .customize-control-flexible-content-duplicate:focus {
3599 outline: none;
3600 -webkit-box-shadow: none;
3601 box-shadow: none;
3602 }
3603 .merchant-flexible-content-control .customize-control-flexible-content-delete:hover .dashicons-no-alt, .merchant-flexible-content-control .customize-control-flexible-content-delete:focus .dashicons-no-alt,
3604 .merchant-flexible-content-control .customize-control-flexible-content-duplicate:hover .dashicons-no-alt,
3605 .merchant-flexible-content-control .customize-control-flexible-content-duplicate:focus .dashicons-no-alt {
3606 color: #a7a7a7;
3607 }
3608 .merchant-flexible-content-control .customize-control-flexible-content-delete:hover svg, .merchant-flexible-content-control .customize-control-flexible-content-delete:focus svg,
3609 .merchant-flexible-content-control .customize-control-flexible-content-duplicate:hover svg,
3610 .merchant-flexible-content-control .customize-control-flexible-content-duplicate:focus svg {
3611 fill: #a7a7a7;
3612 }
3613 .merchant-flexible-content-control .customize-control-flexible-content-accordion {
3614 display: -webkit-box;
3615 display: -ms-flexbox;
3616 display: flex;
3617 -webkit-box-align: center;
3618 -ms-flex-align: center;
3619 align-items: center;
3620 -webkit-box-pack: end;
3621 -ms-flex-pack: end;
3622 justify-content: flex-end;
3623 margin: 0;
3624 width: 40px;
3625 height: auto;
3626 font-size: 1.5em;
3627 line-height: 34px;
3628 color: #50575e;
3629 background: #fff;
3630 padding: 0;
3631 vertical-align: top;
3632 cursor: pointer;
3633 }
3634 .merchant-flexible-content-control .customize-control-flexible-content-accordion svg {
3635 -webkit-transition: 300ms;
3636 transition: 300ms;
3637 -webkit-transform: rotate(180deg);
3638 transform: rotate(180deg);
3639 }
3640 .merchant-flexible-content-control .layout-header.ui-accordion-header-collapsed .customize-control-flexible-content-accordion svg {
3641 -webkit-transform: rotate(0deg);
3642 transform: rotate(0deg);
3643 }
3644 .merchant-flexible-content-control .merchant-flexible-content.empty {
3645 border: 2px dashed #dcdcde;
3646 min-height: 100px;
3647 margin-bottom: 10px;
3648 }
3649 .merchant-flexible-content-control.default-style .layout {
3650 background: white;
3651 border: 1px solid #c3c4c7;
3652 border-left: 3px solid #3858e9;
3653 }
3654 .merchant-flexible-content-control.default-style .layout .layout-header {
3655 padding: 15px 20px;
3656 }
3657 .merchant-flexible-content-control.default-style .layout .layout-body {
3658 padding: 15px 20px;
3659 }
3660 .merchant-flexible-content-control.default-style .layout .layout-body .layout-field:last-of-type .merchant-group-field {
3661 margin-bottom: 5px;
3662 }
3663 .merchant-flexible-content-control.table-style .layout .layout-header {
3664 padding-bottom: 8px;
3665 margin-bottom: 15px;
3666 }
3667 .merchant-flexible-content-control.table-style .layout .layout-body {
3668 -webkit-box-orient: horizontal;
3669 -webkit-box-direction: normal;
3670 -ms-flex-direction: row;
3671 flex-direction: row;
3672 }
3673 .merchant-flexible-content-control.table-style .layout .layout-body .merchant-module-page-setting-field-title {
3674 display: none;
3675 }
3676 .merchant-flexible-content-control.has-accordion .layout-header {
3677 cursor: pointer;
3678 }
3679 .merchant-flexible-content-control .layouts {
3680 display: none;
3681 }
3682 .merchant-flexible-content-control .layout {
3683 margin-bottom: 20px;
3684 }
3685 .merchant-flexible-content-control .layout .layout__inner {
3686 width: calc(100% + 60px);
3687 margin-left: -30px;
3688 padding-inline: 30px;
3689 }
3690 .merchant-flexible-content-control .layout .layout__inner:hover .customize-control-flexible-content-move {
3691 display: block;
3692 }
3693 .merchant-flexible-content-control .layout .layout-header {
3694 display: -webkit-box;
3695 display: -ms-flexbox;
3696 display: flex;
3697 -webkit-box-align: center;
3698 -ms-flex-align: center;
3699 align-items: center;
3700 border-bottom: 1px solid #f3f3f3;
3701 }
3702 .merchant-flexible-content-control .layout .layout-count {
3703 border-radius: 50%;
3704 width: 24px;
3705 height: 23px;
3706 border: 1px solid #949494;
3707 text-align: center;
3708 display: -webkit-box;
3709 display: -ms-flexbox;
3710 display: flex;
3711 -webkit-box-pack: center;
3712 -ms-flex-pack: center;
3713 justify-content: center;
3714 -webkit-box-orient: vertical;
3715 -webkit-box-direction: normal;
3716 -ms-flex-direction: column;
3717 flex-direction: column;
3718 font-size: 12px;
3719 font-weight: bold;
3720 margin-right: 10px;
3721 }
3722 .merchant-flexible-content-control .layout .layout-title {
3723 font-size: 14px;
3724 font-weight: bold;
3725 }
3726 .merchant-flexible-content-control .layout .layout-toggle {
3727 display: -webkit-box;
3728 display: -ms-flexbox;
3729 display: flex;
3730 margin: 0;
3731 padding: 0;
3732 -webkit-box-pack: end;
3733 -ms-flex-pack: end;
3734 justify-content: flex-end;
3735 -webkit-box-flex: 1;
3736 -ms-flex-positive: 1;
3737 flex-grow: 1;
3738 }
3739 .merchant-flexible-content-control .layout .layout-toggle span:hover {
3740 opacity: 0.6;
3741 }
3742 .merchant-flexible-content-control .layout .layout-body {
3743 display: -webkit-box;
3744 display: -ms-flexbox;
3745 display: flex;
3746 -webkit-box-orient: vertical;
3747 -webkit-box-direction: normal;
3748 -ms-flex-direction: column;
3749 flex-direction: column;
3750 }
3751 .merchant-flexible-content-control .layout .layout-actions {
3752 position: absolute;
3753 top: 15px;
3754 right: 22px;
3755 }
3756 .merchant-flexible-content-control .layout .layout-actions-has_accordion {
3757 right: 43px;
3758 }
3759 .merchant-flexible-content-control .layout .layout-actions-no_accordion {
3760 top: 0;
3761 right: 0;
3762 }
3763 .merchant-flexible-content-control .layout .layout-actions a:hover {
3764 opacity: 0.6;
3765 }
3766 .merchant-flexible-content-control .layout .layout-actions__toggle:focus {
3767 outline: none;
3768 -webkit-box-shadow: none;
3769 box-shadow: none;
3770 }
3771 .merchant-flexible-content-control .layout .layout-actions__inner {
3772 position: absolute;
3773 right: -5px;
3774 top: 25px;
3775 z-index: 99;
3776 font-size: 13px;
3777 padding: 7px 15px;
3778 min-width: 200px;
3779 background: #fff;
3780 border: 1px solid #DDDDDD;
3781 border-radius: 5px;
3782 }
3783 .merchant-flexible-content-control .layout .layout-actions__inner a {
3784 width: 100%;
3785 display: -webkit-box;
3786 display: -ms-flexbox;
3787 display: flex;
3788 padding: 10px 0;
3789 -webkit-box-align: center;
3790 -ms-flex-align: center;
3791 align-items: center;
3792 gap: 8px;
3793 }
3794 .merchant-flexible-content-control .layout .layout-actions__inner svg {
3795 width: 24px;
3796 height: 20px;
3797 }
3798 .merchant-flexible-content-control .layout .layout-actions__inner span {
3799 color: #1E1E1E;
3800 }
3801 .merchant-flexible-content-control .layout .layout-field.flex-grow {
3802 -webkit-box-flex: 1;
3803 -ms-flex-positive: 1;
3804 flex-grow: 1;
3805 }
3806 .merchant-flexible-content-control .layout .layout-field:last-of-type .merchant-module-page-setting-field {
3807 margin-bottom: 0;
3808 }
3809 .merchant-flexible-content-control .layout .dashicons-menu {
3810 display: -webkit-box;
3811 display: -ms-flexbox;
3812 display: flex;
3813 -webkit-box-align: center;
3814 -ms-flex-align: center;
3815 align-items: center;
3816 -webkit-box-pack: center;
3817 -ms-flex-pack: center;
3818 justify-content: center;
3819 margin: 0;
3820 width: 40px;
3821 height: auto;
3822 font-size: 1.3em;
3823 line-height: 34px;
3824 background: #fff;
3825 padding: 0;
3826 vertical-align: top;
3827 margin-left: -1px;
3828 }
3829 .merchant-flexible-content-control .layout .dashicons-menu:hover {
3830 color: #a7a7a7;
3831 }
3832 .merchant-flexible-content-control .customize-control-flexible-content-add-wrapper {
3833 position: relative;
3834 display: inline-block;
3835 }
3836 .merchant-flexible-content-control .customize-control-flexible-content-add-list {
3837 opacity: 0;
3838 visibility: hidden;
3839 position: absolute;
3840 background-color: #ffffff;
3841 border: 1px solid #c3c4c7;
3842 border-left: 3px solid #3858e9;
3843 -webkit-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1019607843);
3844 box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1019607843);
3845 width: 180px;
3846 bottom: 100%;
3847 display: -webkit-box;
3848 display: -ms-flexbox;
3849 display: flex;
3850 -webkit-box-orient: vertical;
3851 -webkit-box-direction: normal;
3852 -ms-flex-direction: column;
3853 flex-direction: column;
3854 left: 50%;
3855 -webkit-transform: translate(-50%, 10px);
3856 transform: translate(-50%, 10px);
3857 padding: 3px 3px 3px 5px;
3858 }
3859 .merchant-flexible-content-control .customize-control-flexible-content-add-list.active {
3860 z-index: 10;
3861 opacity: 1;
3862 visibility: visible;
3863 -webkit-transform: translate(-50%, -15px);
3864 transform: translate(-50%, -15px);
3865 -webkit-transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
3866 transition: all 0.5s cubic-bezier(0.75, -0.02, 0.2, 0.97);
3867 }
3868 .merchant-flexible-content-control .customize-control-flexible-content-add-list:before {
3869 right: calc(50% - 12px);
3870 bottom: -14px;
3871 border-width: 14px 14px 0 15px;
3872 border-color: #c3c4c7 transparent transparent transparent;
3873 }
3874 .merchant-flexible-content-control .customize-control-flexible-content-add-list:after {
3875 content: "";
3876 right: calc(50% - 10px);
3877 bottom: -12px;
3878 border-width: 12px 12px 0 13px;
3879 border-color: #ffffff transparent transparent transparent;
3880 }
3881 .merchant-flexible-content-control .customize-control-flexible-content-add-list:before, .merchant-flexible-content-control .customize-control-flexible-content-add-list:after {
3882 position: absolute;
3883 z-index: -1;
3884 content: "";
3885 border-style: solid;
3886 -webkit-transition-duration: 0.3s;
3887 transition-duration: 0.3s;
3888 transition-property: -webkit-transform;
3889 -webkit-transition-property: -webkit-transform;
3890 transition-property: transform;
3891 transition-property: transform, -webkit-transform;
3892 }
3893 .merchant-flexible-content-control .customize-control-flexible-content-add {
3894 display: block;
3895 -ms-flex-negative: 0;
3896 flex-shrink: 0;
3897 padding: 10px;
3898 text-decoration: none;
3899 }
3900 .merchant-flexible-content-control .customize-control-flexible-content-add:hover {
3901 background: #f0f0f1;
3902 }
3903 .merchant-flexible-content-control .customize-control-flexible-content-add-button {
3904 color: #3858E9;
3905 border-color: #3858E9;
3906 background-color: transparent;
3907 margin-bottom: 0;
3908 padding: 4px 19px;
3909 }
3910 .merchant-flexible-content-control .customize-control-flexible-content-add-button:hover, .merchant-flexible-content-control .customize-control-flexible-content-add-button:focus {
3911 outline: none;
3912 -webkit-box-shadow: none;
3913 box-shadow: none;
3914 background-color: #ffffff;
3915 }
3916 .merchant-flexible-content-control.disable-sorting .dashicons-menu {
3917 display: none;
3918 }
3919 .merchant-flexible-content-control .merchant-datetime-field input {
3920 padding: 12px !important;
3921 line-height: 1.3em;
3922 width: 100%;
3923 max-width: 100%;
3924 min-height: auto;
3925 border: 1px solid #d6d6d6;
3926 border-radius: 4px !important;
3927 }
3928 .merchant-flexible-content-control .merchant-datetime-field input:focus {
3929 outline: none;
3930 -webkit-box-shadow: none;
3931 box-shadow: none;
3932 border-color: #3858E9;
3933 }
3934
3935 .flexible-content-template {
3936 display: none;
3937 }
3938
3939 .merchant-module-page-setting-field-range .merchant-range {
3940 position: relative;
3941 width: 100%;
3942 width: 300px;
3943 display: -webkit-box;
3944 display: -ms-flexbox;
3945 display: flex;
3946 -webkit-box-align: center;
3947 -ms-flex-align: center;
3948 align-items: center;
3949 -webkit-box-pack: justify;
3950 -ms-flex-pack: justify;
3951 justify-content: space-between;
3952 }
3953 .merchant-module-page-setting-field-range input[type=range] {
3954 -webkit-appearance: none;
3955 -moz-appearance: none;
3956 appearance: none;
3957 width: calc(100% - 105px);
3958 height: 2px;
3959 border-radius: 5px;
3960 outline: none;
3961 padding: 0;
3962 margin: 0;
3963 background-color: #ddd;
3964 background-image: -webkit-gradient(linear, left top, right top, from(#3858E9), color-stop(0%, #3858E9), color-stop(0%, #ddd), to(#ddd));
3965 background-image: linear-gradient(to right, #3858E9 0%, #3858E9 0%, #ddd 0%, #ddd 100%);
3966 }
3967 .merchant-module-page-setting-field-range input[type=range]::-webkit-slider-thumb {
3968 -webkit-appearance: none;
3969 appearance: none;
3970 width: 15px;
3971 height: 15px;
3972 border-radius: 50%;
3973 background: #3858E9;
3974 cursor: pointer;
3975 -webkit-transition: background 0.15s ease-in-out;
3976 transition: background 0.15s ease-in-out;
3977 }
3978 .merchant-module-page-setting-field-range input[type=range]::-webkit-slider-thumb:hover {
3979 background: #3858E9;
3980 }
3981 .merchant-module-page-setting-field-range input[type=range]:active::-webkit-slider-thumb {
3982 background: #3858E9;
3983 }
3984 .merchant-module-page-setting-field-range input[type=range]::-moz-range-thumb {
3985 width: 15px;
3986 height: 15px;
3987 border: 0;
3988 border-radius: 50%;
3989 background: #3858E9;
3990 cursor: pointer;
3991 -moz-transition: background 0.15s ease-in-out;
3992 transition: background 0.15s ease-in-out;
3993 }
3994 .merchant-module-page-setting-field-range input[type=range]::-moz-range-thumb:hover {
3995 background: #3858E9;
3996 }
3997 .merchant-module-page-setting-field-range input[type=range]:active::-moz-range-thumb {
3998 background: #3858E9;
3999 }
4000 .merchant-module-page-setting-field-range input[type=range]:focus::-webkit-slider-thumb {
4001 -webkit-box-shadow: 0 0 0 3px #fff, 0 0 0 6px #3858E9;
4002 box-shadow: 0 0 0 3px #fff, 0 0 0 6px #3858E9;
4003 }
4004 .merchant-module-page-setting-field-range input[type=range]::-moz-range-track {
4005 border: 0;
4006 background: #d7dcdf;
4007 }
4008 .merchant-module-page-setting-field-range input[type=number] {
4009 padding: 12px 25px 12px 10px;
4010 line-height: 1.3em;
4011 width: 100%;
4012 max-width: 85px;
4013 min-height: auto;
4014 border: 1px solid #D6D6D6;
4015 }
4016 .merchant-module-page-setting-field-range input[type=number]:focus {
4017 outline: none;
4018 -webkit-box-shadow: none;
4019 box-shadow: none;
4020 border-color: #3858E9;
4021 }
4022 .merchant-module-page-setting-field-range .merchant-range-unit {
4023 color: #3858E9;
4024 position: absolute;
4025 z-index: 1;
4026 right: 10px;
4027 font-size: 11px;
4028 line-height: 1em;
4029 }
4030
4031 .merchant-module-page-setting-field-color input {
4032 padding: 0 10px;
4033 line-height: 1em;
4034 width: 100%;
4035 max-width: 254px;
4036 min-height: auto;
4037 border: 1px solid #D6D6D6;
4038 }
4039 .merchant-module-page-setting-field-color input:focus {
4040 outline: none;
4041 -webkit-box-shadow: none;
4042 box-shadow: none;
4043 border-color: #3858E9;
4044 }
4045 .merchant-module-page-setting-field-color .merchant-color {
4046 display: -webkit-box;
4047 display: -ms-flexbox;
4048 display: flex;
4049 grid-gap: 10px;
4050 }
4051 .merchant-module-page-setting-field-color .merchant-color-picker {
4052 cursor: pointer;
4053 width: 36px;
4054 height: 36px;
4055 border: 1px solid rgba(0, 0, 0, 0.1);
4056 border-radius: 4px;
4057 }
4058
4059 .merchant-module-page-settings-dimensions {
4060 display: -webkit-box;
4061 display: -ms-flexbox;
4062 display: flex;
4063 grid-gap: 10px;
4064 }
4065 .merchant-module-page-settings-dimensions > div {
4066 display: -webkit-box;
4067 display: -ms-flexbox;
4068 display: flex;
4069 -webkit-box-orient: vertical;
4070 -webkit-box-direction: normal;
4071 -ms-flex-direction: column;
4072 flex-direction: column;
4073 }
4074 .merchant-module-page-settings-dimensions label {
4075 color: gray;
4076 font-size: 12px;
4077 margin-top: 7px;
4078 }
4079 .merchant-module-page-settings-dimensions input {
4080 max-width: 70px;
4081 width: 100%;
4082 font-size: 12px;
4083 border: 1px solid #D6D6D6;
4084 }
4085
4086 .merchant-module-page-setting-field-wc_coupons .merchant-wc-coupon-selector select {
4087 width: 300px;
4088 min-height: auto;
4089 border: 1px solid #D6D6D6;
4090 padding: 12px;
4091 line-height: 1.3em;
4092 border-radius: 6px;
4093 color: #2F2F2F;
4094 border: 1px solid #D6D6D6;
4095 }
4096
4097 .merchant-module-page-settings-unit {
4098 margin-bottom: 10px;
4099 }
4100 .merchant-module-page-settings-unit select {
4101 font-size: 13px;
4102 border: 0;
4103 }
4104
4105 .merchant-module-page-settings-devices {
4106 display: -webkit-box;
4107 display: -ms-flexbox;
4108 display: flex;
4109 -webkit-column-gap: 10px;
4110 -moz-column-gap: 10px;
4111 column-gap: 10px;
4112 -webkit-box-pack: end;
4113 -ms-flex-pack: end;
4114 justify-content: flex-end;
4115 }
4116 .merchant-module-page-settings-devices button {
4117 border: 0;
4118 background: transparent;
4119 padding: 0;
4120 cursor: pointer;
4121 }
4122 .merchant-module-page-settings-devices button.active {
4123 color: #3858e9;
4124 }
4125 .merchant-module-page-settings-devices button:hover {
4126 color: #3858e9;
4127 }
4128 .merchant-module-page-settings-devices button i {
4129 font-size: 14px;
4130 line-height: 20px;
4131 width: auto;
4132 }
4133
4134 .merchant-module-page-settings-device-container:not(.active) {
4135 display: none;
4136 }
4137
4138 .merchant-module-page-setting-field-responsive_dimensions .merchant-module-page-setting-field-inner {
4139 max-width: 320px;
4140 }
4141 .merchant-module-page-setting-field-responsive_dimensions .merchant-module-page-settings-devices {
4142 margin-bottom: -30px;
4143 margin-top: 0;
4144 }
4145
4146 .review-photos-popup {
4147 position: fixed;
4148 top: 0;
4149 left: 0;
4150 bottom: 0;
4151 right: 0;
4152 display: -webkit-box;
4153 display: -ms-flexbox;
4154 display: flex;
4155 -webkit-box-pack: center;
4156 -ms-flex-pack: center;
4157 justify-content: center;
4158 -webkit-box-align: center;
4159 -ms-flex-align: center;
4160 align-items: center;
4161 -ms-flex-wrap: wrap;
4162 flex-wrap: wrap;
4163 z-index: 9992;
4164 padding: 50px;
4165 gap: 40px;
4166 overflow: scroll;
4167 visibility: hidden;
4168 opacity: 0;
4169 -webkit-transition: 300ms;
4170 transition: 300ms;
4171 }
4172 .review-photos-popup.active {
4173 visibility: visible;
4174 opacity: 1;
4175 }
4176 .review-photos-popup .overlay {
4177 position: fixed;
4178 top: 0;
4179 left: 0;
4180 bottom: 0;
4181 right: 0;
4182 background-color: rgba(0, 0, 0, 0.8);
4183 }
4184 .review-photos-popup .review-photo {
4185 z-index: 9993;
4186 -webkit-box-flex: 0;
4187 -ms-flex: 0 0 30%;
4188 flex: 0 0 30%;
4189 }
4190 .review-photos-popup .review-photo img {
4191 max-width: 100%;
4192 max-height: 300px;
4193 height: auto;
4194 display: block;
4195 margin: 0 auto;
4196 border: 2px solid #fff;
4197 border-radius: 5px;
4198 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
4199 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
4200 }
4201 .review-photos-popup.images-count-1 .review-photo {
4202 -webkit-box-flex: 0;
4203 -ms-flex: 0 0 100%;
4204 flex: 0 0 100%;
4205 }
4206 .review-photos-popup.images-count-1 .review-photo img {
4207 max-height: 400px;
4208 }
4209 .review-photos-popup.images-count-2 .review-photo {
4210 -webkit-box-flex: 0;
4211 -ms-flex: 0 0 46%;
4212 flex: 0 0 46%;
4213 }
4214 .review-photos-popup.images-count-2 .review-photo img {
4215 max-height: 400px;
4216 }
4217 @media (max-width: 768px) {
4218 .review-photos-popup {
4219 padding-top: 100px;
4220 }
4221 .review-photos-popup .review-photo {
4222 -webkit-box-flex: 0;
4223 -ms-flex: 0 0 100%;
4224 flex: 0 0 100%;
4225 }
4226 .review-photos-popup .review-photo img {
4227 max-height: 400px;
4228 }
4229 }
4230
4231 .merchant-btn-control {
4232 color: #3858e9;
4233 border: 1px solid #3858e9;
4234 background-color: rgba(0, 0, 0, 0);
4235 padding: 4px 19px;
4236 border-radius: 4px;
4237 font-size: 13px;
4238 line-height: 2.1;
4239 cursor: pointer;
4240 }
4241
4242 .merchant-reviews-selector * {
4243 -webkit-box-sizing: border-box;
4244 box-sizing: border-box;
4245 }
4246 .merchant-reviews-selector .star-rating {
4247 overflow: hidden;
4248 position: relative;
4249 height: 1.618em;
4250 line-height: 1.618;
4251 width: 5.3em;
4252 font-family: star;
4253 font-weight: 400;
4254 margin-left: auto;
4255 margin-right: auto;
4256 letter-spacing: 0;
4257 color: #ffa441;
4258 }
4259 .merchant-reviews-selector .star-rating::before {
4260 content: "SSSSS";
4261 opacity: 0.25;
4262 float: left;
4263 top: 0;
4264 left: 0;
4265 position: absolute;
4266 }
4267 .merchant-reviews-selector .star-rating span {
4268 overflow: hidden;
4269 float: left;
4270 top: 0;
4271 left: 0;
4272 position: absolute;
4273 padding-top: 1.5em;
4274 }
4275 .merchant-reviews-selector .star-rating span::before {
4276 content: "SSSSS";
4277 top: 0;
4278 position: absolute;
4279 left: 0;
4280 color: #ffa441;
4281 }
4282 .merchant-reviews-selector .overlay {
4283 position: fixed;
4284 top: 0;
4285 left: 0;
4286 width: 100%;
4287 height: 100%;
4288 background-color: rgba(0, 0, 0, 0.5);
4289 z-index: 9990;
4290 visibility: hidden;
4291 opacity: 0;
4292 -webkit-transition: 300ms;
4293 transition: 300ms;
4294 }
4295 .merchant-reviews-selector .overlay.active {
4296 visibility: visible;
4297 opacity: 1;
4298 }
4299 .merchant-reviews-selector .tooltip {
4300 position: absolute;
4301 min-width: 180px;
4302 right: calc(100% + 10px);
4303 background-color: #333;
4304 color: #fff;
4305 padding: 5px 10px;
4306 border-radius: 5px;
4307 font-size: 12px;
4308 visibility: hidden;
4309 opacity: 0;
4310 -webkit-transition: 300ms;
4311 transition: 300ms;
4312 top: 50%;
4313 -webkit-transform: translateY(-50%);
4314 transform: translateY(-50%);
4315 }
4316 .merchant-reviews-selector .tooltip:before {
4317 content: "";
4318 position: absolute;
4319 top: 50%;
4320 right: -7px;
4321 -webkit-transform: translateY(-50%);
4322 transform: translateY(-50%);
4323 width: 0;
4324 height: 0;
4325 border-top: 5px solid transparent;
4326 border-bottom: 5px solid transparent;
4327 border-left: 7px solid #333;
4328 }
4329 .merchant-reviews-selector .product-reviews {
4330 -ms-flex-preferred-size: 100%;
4331 flex-basis: 100%;
4332 }
4333 .merchant-reviews-selector .product-reviews .product-review {
4334 display: -webkit-box;
4335 display: -ms-flexbox;
4336 display: flex;
4337 gap: 15px;
4338 -webkit-box-align: center;
4339 -ms-flex-align: center;
4340 align-items: center;
4341 padding: 8px 15px;
4342 border-bottom: 2px solid #ffffff;
4343 -webkit-box-pack: start;
4344 -ms-flex-pack: start;
4345 justify-content: flex-start;
4346 -ms-flex-wrap: nowrap;
4347 flex-wrap: nowrap;
4348 -webkit-box-orient: horizontal;
4349 -webkit-box-direction: normal;
4350 -ms-flex-direction: row;
4351 flex-direction: row;
4352 border-top: none;
4353 background-color: #f4f4f4;
4354 min-height: 60px;
4355 }
4356 .merchant-reviews-selector .product-reviews .product-review:last-of-type {
4357 border-bottom: none;
4358 }
4359 .merchant-reviews-selector .product-reviews .product-review .product-review-add-checkbox {
4360 -webkit-box-flex: 0;
4361 -ms-flex: 0 0 20px;
4362 flex: 0 0 20px;
4363 }
4364 .merchant-reviews-selector .product-reviews .product-review .product-review-product-image {
4365 display: none;
4366 }
4367 .merchant-reviews-selector .product-reviews .product-review .product-review-product-image a {
4368 display: block;
4369 text-decoration: none;
4370 }
4371 .merchant-reviews-selector .product-reviews .product-review .product-review-product-image a img {
4372 border-radius: 5px;
4373 width: 50px;
4374 height: auto;
4375 }
4376 .merchant-reviews-selector .product-reviews .product-review .product-review-product-name {
4377 display: none;
4378 }
4379 .merchant-reviews-selector .product-reviews .product-review .product-review-product-name a {
4380 text-decoration: none;
4381 }
4382 .merchant-reviews-selector .product-reviews .product-review .product-review-rating {
4383 -webkit-box-flex: 0;
4384 -ms-flex: 0 0 70px;
4385 flex: 0 0 70px;
4386 width: 70px;
4387 }
4388 .merchant-reviews-selector .product-reviews .product-review .product-review-status {
4389 -webkit-box-flex: 0;
4390 -ms-flex: 0 0 90px;
4391 flex: 0 0 90px;
4392 width: 90px;
4393 }
4394 .merchant-reviews-selector .product-reviews .product-review .product-review-status .status {
4395 text-transform: capitalize;
4396 border-radius: 4px;
4397 background-color: #eee;
4398 padding: 3px 8px;
4399 display: inline-block;
4400 }
4401 .merchant-reviews-selector .product-reviews .product-review .product-review-status .status.status-approved {
4402 background-color: #c3e6cb; /* Softer light green */
4403 color: #155724; /* Darker green */
4404 }
4405 .merchant-reviews-selector .product-reviews .product-review .product-review-status .status.status-pending {
4406 background-color: #fff3cd; /* Light yellow */
4407 color: #856404; /* Dark yellow/brown */
4408 }
4409 .merchant-reviews-selector .product-reviews .product-review .product-review-status .status.status-unapproved {
4410 background-color: #f5c6cb; /* Light coral/pink */
4411 color: #721c24; /* Darker red */
4412 }
4413 .merchant-reviews-selector .product-reviews .product-review .product-review-status .status.status-spam {
4414 background-color: #f8d7da; /* Light red */
4415 color: #721c24; /* Dark red */
4416 }
4417 .merchant-reviews-selector .product-reviews .product-review .product-review-author {
4418 -webkit-box-flex: 0;
4419 -ms-flex: 0 0 90px;
4420 flex: 0 0 90px;
4421 width: 90px;
4422 }
4423 .merchant-reviews-selector .product-reviews .product-review .product-review-content {
4424 -webkit-box-flex: 0;
4425 -ms-flex: 0 0 40%;
4426 flex: 0 0 40%;
4427 }
4428 .merchant-reviews-selector .product-reviews .product-review .product-review-photos {
4429 -webkit-box-flex: 0;
4430 -ms-flex: 0 0 40px;
4431 flex: 0 0 40px;
4432 width: 40px;
4433 position: relative;
4434 }
4435 .merchant-reviews-selector .product-reviews .product-review .product-review-photos:hover .tooltip {
4436 visibility: visible;
4437 opacity: 1;
4438 }
4439 .merchant-reviews-selector .product-reviews .product-review .product-review-photos img {
4440 border-radius: 5px;
4441 width: 40px;
4442 height: auto;
4443 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
4444 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
4445 border: 2px solid #fff;
4446 display: block;
4447 }
4448 .merchant-reviews-selector .product-reviews .product-review .product-review-photos img.loading {
4449 -webkit-animation: loading 1500ms infinite;
4450 animation: loading 1500ms infinite;
4451 }
4452 .merchant-reviews-selector .product-reviews .product-review .product-review-photos .review-photo {
4453 position: relative;
4454 cursor: pointer;
4455 }
4456 .merchant-reviews-selector .product-reviews .product-review .product-review-photos .review-photo .count {
4457 -webkit-user-select: none;
4458 -moz-user-select: none;
4459 -ms-user-select: none;
4460 user-select: none;
4461 position: absolute;
4462 top: -8px;
4463 right: -8px;
4464 background-color: #000;
4465 color: #fff;
4466 padding: 0px 5px;
4467 border-radius: 50%;
4468 width: 18px;
4469 height: 18px;
4470 text-align: center;
4471 font-size: 11px;
4472 }
4473 .merchant-reviews-selector .product-reviews .product-review .product-review-date {
4474 -webkit-box-flex: 0;
4475 -ms-flex: 0 0 70px;
4476 flex: 0 0 70px;
4477 width: 70px;
4478 }
4479 .merchant-reviews-selector .product-reviews .product-review .product-review-edit a {
4480 text-decoration: none;
4481 color: #3858E9;
4482 }
4483 .merchant-reviews-selector .product-reviews .product-review .product-review-move,
4484 .merchant-reviews-selector .product-reviews .product-review .product-review-delete {
4485 display: none;
4486 }
4487 .merchant-reviews-selector .product-reviews .product-reviews-load-more {
4488 text-align: center;
4489 padding: 10px;
4490 }
4491 .merchant-reviews-selector .product-reviews .product-reviews-load-more button {
4492 display: inline-block;
4493 padding: 10px 20px;
4494 border-radius: 5px;
4495 text-decoration: none;
4496 outline: none;
4497 background: none;
4498 border: none;
4499 cursor: pointer;
4500 }
4501 .merchant-reviews-selector .product-reviews .product-reviews-load-more.loading {
4502 -webkit-animation: loading 1500ms infinite;
4503 animation: loading 1500ms infinite;
4504 }
4505 .merchant-reviews-selector .selected-reviews {
4506 padding: 0 0 15px;
4507 }
4508 .merchant-reviews-selector .selected-reviews .product-reviews {
4509 border: 1px solid #c9c7c7;
4510 border-radius: 4px;
4511 position: relative;
4512 }
4513 .merchant-reviews-selector .selected-reviews .product-reviews:empty {
4514 display: none;
4515 }
4516 .merchant-reviews-selector .selected-reviews .product-reviews .placeholder {
4517 background-color: #f0f0f0;
4518 border: 1px dashed #ccc;
4519 visibility: visible;
4520 width: 100%;
4521 }
4522 .merchant-reviews-selector .selected-reviews .product-reviews .product-review {
4523 background-color: #fff;
4524 border-bottom: 1px dotted #c9c7c7;
4525 position: relative;
4526 padding: 12px 20px;
4527 }
4528 .merchant-reviews-selector .selected-reviews .product-reviews .product-review:first-of-type {
4529 border-top-left-radius: 4px;
4530 border-top-right-radius: 4px;
4531 }
4532 .merchant-reviews-selector .selected-reviews .product-reviews .product-review:last-of-type {
4533 border-bottom: none;
4534 border-bottom-left-radius: 4px;
4535 border-bottom-right-radius: 4px;
4536 }
4537 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-move,
4538 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-delete {
4539 display: block;
4540 position: absolute;
4541 background: none;
4542 border: none;
4543 cursor: pointer;
4544 color: #3858E9;
4545 width: 25px;
4546 height: 25px;
4547 padding: 0;
4548 margin: 0;
4549 top: 50%;
4550 -webkit-transform: translateY(-50%);
4551 transform: translateY(-50%);
4552 border-radius: 50%;
4553 padding-top: 2px;
4554 visibility: hidden;
4555 opacity: 0;
4556 -webkit-transition: 300ms;
4557 transition: 300ms;
4558 background-color: #d5d5d5;
4559 }
4560 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-move svg,
4561 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-delete svg {
4562 width: 18px;
4563 height: 18px;
4564 }
4565 .merchant-reviews-selector .selected-reviews .product-reviews .product-review:hover .product-review-move,
4566 .merchant-reviews-selector .selected-reviews .product-reviews .product-review:hover .product-review-delete {
4567 visibility: visible;
4568 opacity: 1;
4569 }
4570 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-delete {
4571 right: -14px;
4572 }
4573 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-delete:hover {
4574 background-color: #ff7575;
4575 }
4576 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-move {
4577 cursor: move;
4578 left: -14px;
4579 }
4580 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-move:hover {
4581 background-color: #6f89ff;
4582 }
4583 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-content {
4584 -webkit-box-flex: 0;
4585 -ms-flex: none;
4586 flex: none;
4587 width: 140px;
4588 }
4589 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .spacer {
4590 margin-right: auto;
4591 }
4592 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-edit,
4593 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-photos,
4594 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-date,
4595 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-status,
4596 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-add-checkbox {
4597 display: none;
4598 }
4599 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-product-name,
4600 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-product-image {
4601 display: block;
4602 }
4603 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-product-image a img {
4604 width: 30px;
4605 }
4606 .merchant-reviews-selector .selected-reviews .product-reviews .product-review .product-review-product-name {
4607 width: 120px;
4608 }
4609 @-webkit-keyframes loading {
4610 0% {
4611 opacity: 1;
4612 }
4613 50% {
4614 opacity: 0.2;
4615 }
4616 100% {
4617 opacity: 1;
4618 }
4619 }
4620 @keyframes loading {
4621 0% {
4622 opacity: 1;
4623 }
4624 50% {
4625 opacity: 0.2;
4626 }
4627 100% {
4628 opacity: 1;
4629 }
4630 }
4631 .merchant-reviews-selector .selector-popup {
4632 position: fixed;
4633 background-color: #fff;
4634 -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
4635 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
4636 border-radius: 5px;
4637 top: 50%;
4638 left: 50%;
4639 -webkit-transform: translate(-50%, -50%);
4640 transform: translate(-50%, -50%);
4641 width: 1000px;
4642 max-width: 100%;
4643 z-index: 9991;
4644 visibility: hidden;
4645 opacity: 0;
4646 -webkit-transition: 300ms;
4647 transition: 300ms;
4648 }
4649 .merchant-reviews-selector .selector-popup.active {
4650 visibility: visible;
4651 opacity: 1;
4652 }
4653 .merchant-reviews-selector .selector-popup .popup-content .popup-header {
4654 position: relative;
4655 border-bottom: 1px solid #eee;
4656 padding: 14px 50px 14px 24px;
4657 background-color: #f3f3f3;
4658 border-top-left-radius: 5px;
4659 border-top-right-radius: 5px;
4660 }
4661 .merchant-reviews-selector .selector-popup .popup-content .popup-header label {
4662 display: -webkit-box;
4663 display: -ms-flexbox;
4664 display: flex;
4665 -webkit-box-align: center;
4666 -ms-flex-align: center;
4667 align-items: center;
4668 }
4669 .merchant-reviews-selector .selector-popup .popup-content .popup-header label span {
4670 font-size: 16px;
4671 font-weight: 500;
4672 min-width: 120px;
4673 }
4674 .merchant-reviews-selector .selector-popup .popup-content .popup-header label input {
4675 margin-left: 10px;
4676 padding: 5px 10px;
4677 width: 100%;
4678 border: 1px solid #d6d6d6;
4679 outline: none;
4680 }
4681 .merchant-reviews-selector .selector-popup .popup-content .popup-header .close {
4682 position: absolute;
4683 top: 50%;
4684 right: 10px;
4685 cursor: pointer;
4686 display: block;
4687 padding: 10px;
4688 font-size: 23px;
4689 -webkit-transform: translateY(-50%);
4690 transform: translateY(-50%);
4691 }
4692 @-webkit-keyframes loadingAnimation {
4693 from {
4694 background-position: 200% 0;
4695 }
4696 to {
4697 background-position: -200% 0;
4698 }
4699 }
4700 @keyframes loadingAnimation {
4701 from {
4702 background-position: 200% 0;
4703 }
4704 to {
4705 background-position: -200% 0;
4706 }
4707 }
4708 .merchant-reviews-selector .selector-popup .popup-content .popup-header.loading::after {
4709 content: "";
4710 position: absolute;
4711 bottom: -2px;
4712 left: 0;
4713 width: 100%;
4714 height: 3px;
4715 background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(50%, #3858e9), to(transparent));
4716 background: linear-gradient(to right, transparent 0%, #3858e9 50%, transparent 100%);
4717 background-size: 200% 100%;
4718 -webkit-animation: loadingAnimation 1.5s infinite linear;
4719 animation: loadingAnimation 1.5s infinite linear;
4720 }
4721 .merchant-reviews-selector .selector-popup .popup-content .popup-header.popup-error::after {
4722 content: "";
4723 position: absolute;
4724 bottom: -2px;
4725 left: 0;
4726 width: 100%;
4727 height: 3px;
4728 background-color: #d93232;
4729 -webkit-animation: loading 1.5s infinite linear;
4730 animation: loading 1.5s infinite linear;
4731 }
4732 .merchant-reviews-selector .selector-popup .popup-content .popup-body {
4733 height: 700px;
4734 overflow-y: auto;
4735 }
4736 .merchant-reviews-selector .selector-popup .popup-content .popup-body .products-search-results {
4737 padding: 24px;
4738 }
4739 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item {
4740 border-top: 1px solid #eee;
4741 border-left: 1px solid #eee;
4742 border-right: 1px solid #eee;
4743 -webkit-transition: 300ms;
4744 transition: 300ms;
4745 }
4746 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .header {
4747 cursor: pointer;
4748 display: -webkit-box;
4749 display: -ms-flexbox;
4750 display: flex;
4751 gap: 25px;
4752 -ms-flex-wrap: wrap;
4753 flex-wrap: wrap;
4754 position: relative;
4755 width: 100%;
4756 padding: 10px 80px 10px 10px;
4757 -webkit-box-align: center;
4758 -ms-flex-align: center;
4759 align-items: center;
4760 }
4761 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .header .product-expander {
4762 content: "";
4763 padding: 15px;
4764 display: block;
4765 position: absolute;
4766 right: 10px;
4767 top: 50%;
4768 -webkit-transform: translateY(-50%);
4769 transform: translateY(-50%);
4770 -webkit-transition: 300ms;
4771 transition: 300ms;
4772 }
4773 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .header .product-expander svg {
4774 width: 20px;
4775 height: 20px;
4776 }
4777 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .header.ui-state-active .product-expander {
4778 -webkit-transform: translateY(-50%) rotate(180deg);
4779 transform: translateY(-50%) rotate(180deg);
4780 }
4781 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item:first-of-type {
4782 border-top-left-radius: 5px;
4783 border-top-right-radius: 5px;
4784 }
4785 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item:last-of-type {
4786 border-bottom-left-radius: 5px;
4787 border-bottom-right-radius: 5px;
4788 border-bottom: 1px solid #eee;
4789 }
4790 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-image a {
4791 display: block;
4792 text-decoration: none;
4793 line-height: 0;
4794 }
4795 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-image img {
4796 border-radius: 5px;
4797 width: 50px;
4798 max-width: 100%;
4799 height: auto;
4800 }
4801 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-title {
4802 font-size: 14px;
4803 font-weight: 500;
4804 }
4805 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-title a {
4806 text-decoration: none;
4807 }
4808 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .spacer {
4809 margin-left: auto;
4810 }
4811 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-status {
4812 text-transform: capitalize;
4813 border-radius: 4px;
4814 background-color: #eee;
4815 padding: 3px 8px;
4816 }
4817 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-status.product-status-publish {
4818 background-color: #c3e6cb; /* Softer light green */
4819 color: #155724; /* Darker green */
4820 }
4821 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-status.product-status-draft {
4822 background-color: #d1ecf1; /* Light blue */
4823 color: #0c5460; /* Dark teal */
4824 }
4825 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-status.product-status-pending {
4826 background-color: #fff3cd; /* Light yellow */
4827 color: #856404; /* Dark yellow/brown */
4828 }
4829 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .selected-reviews-count {
4830 color: #fff;
4831 display: -webkit-box;
4832 display: -ms-flexbox;
4833 display: flex;
4834 -webkit-box-align: center;
4835 -ms-flex-align: center;
4836 align-items: center;
4837 background-color: #79b0f8;
4838 border-radius: 3px;
4839 padding: 3px 6px;
4840 gap: 5px;
4841 position: relative;
4842 opacity: 0.5;
4843 -webkit-transition: 300ms;
4844 transition: 300ms;
4845 }
4846 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .selected-reviews-count:before {
4847 content: "";
4848 display: block;
4849 background-image: url("data:image/svg+xml,%3Csvg fill='%23ffffff' version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='800px' height='800px' viewBox='0 0 305.002 305.002' xml:space='preserve'%3E%3Cg%3E%3Cg%3E%3Cpath d='M152.502,0.001C68.412,0.001,0,68.412,0,152.501s68.412,152.5,152.502,152.5c84.089,0,152.5-68.411,152.5-152.5 S236.591,0.001,152.502,0.001z M152.502,280.001C82.197,280.001,25,222.806,25,152.501c0-70.304,57.197-127.5,127.502-127.5 c70.304,0,127.5,57.196,127.5,127.5C280.002,222.806,222.806,280.001,152.502,280.001z'%3E%3C/path%3E%3Cpath d='M218.473,93.97l-90.546,90.547l-41.398-41.398c-4.882-4.881-12.796-4.881-17.678,0c-4.881,4.882-4.881,12.796,0,17.678 l50.237,50.237c2.441,2.44,5.64,3.661,8.839,3.661c3.199,0,6.398-1.221,8.839-3.661l99.385-99.385 c4.881-4.882,4.881-12.796,0-17.678C231.269,89.089,223.354,89.089,218.473,93.97z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
4850 background-size: contain; /* Adjust as necessary */
4851 background-repeat: no-repeat; /* Adjust as necessary */
4852 width: 15px; /* Set width */
4853 height: 15px; /* Set height */
4854 }
4855 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .selected-reviews-count:hover {
4856 opacity: 1;
4857 }
4858 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .selected-reviews-count:hover .tooltip {
4859 visibility: visible;
4860 opacity: 1;
4861 }
4862 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item .product-reviews-count {
4863 color: #8e8e8e;
4864 }
4865 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item:hover {
4866 background-color: #f4f4f4;
4867 }
4868 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item:not(.product-item-has-reviews) {
4869 cursor: auto;
4870 }
4871 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item:not(.product-item-has-reviews) .product-expander {
4872 opacity: 0.2;
4873 }
4874 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item:not(.product-item-has-reviews):hover {
4875 background-color: transparent;
4876 }
4877 .merchant-reviews-selector .selector-popup .popup-content .popup-body .product-item.opened:hover {
4878 background-color: transparent;
4879 }
4880 .merchant-module-page-setting-field-warning {
4881 padding: 8px 10px;
4882 font-size: 14px;
4883 line-height: 1.6;
4884 color: #1D2327;
4885 border-radius: 4px;
4886 border: 1px solid #D72C0D;
4887 background-color: #FFF4F4;
4888 }
4889
4890 .merchant-module-page-setting-field-info {
4891 padding: 8px 10px;
4892 font-size: 14px;
4893 line-height: 1.6;
4894 color: #1D2327;
4895 border-radius: 4px;
4896 border: 1px solid #0d65d7;
4897 background-color: #e6effa;
4898 }
4899 .merchant-module-page-setting-field-info[data-id=shortcode_info] {
4900 margin-bottom: 0;
4901 }
4902
4903 .merchant-module-page-setting-field-divider {
4904 border-bottom: 1px solid #F0F0F1;
4905 }
4906 .merchant-module-page-setting-field-divider .merchant-module-page-setting-field-title {
4907 font-size: 16px;
4908 }
4909
4910 .merchant-module-page-setting-field-gallery .merchant-gallery-images {
4911 display: -webkit-box;
4912 display: -ms-flexbox;
4913 display: flex;
4914 grid-gap: 5px;
4915 -ms-flex-wrap: wrap;
4916 flex-wrap: wrap;
4917 margin-bottom: 15px;
4918 }
4919 .merchant-module-page-setting-field-gallery .merchant-gallery-images:empty {
4920 display: none;
4921 }
4922 .merchant-module-page-setting-field-gallery .merchant-gallery-image {
4923 position: relative;
4924 display: -webkit-box;
4925 display: -ms-flexbox;
4926 display: flex;
4927 -webkit-box-align: center;
4928 -ms-flex-align: center;
4929 align-items: center;
4930 -webkit-box-pack: center;
4931 -ms-flex-pack: center;
4932 justify-content: center;
4933 border-radius: 4px;
4934 padding: 2px;
4935 border: 1px solid #eee;
4936 background-color: #fff;
4937 }
4938 .merchant-module-page-setting-field-gallery .merchant-gallery-image img {
4939 cursor: -webkit-grab;
4940 cursor: grab;
4941 width: 100%;
4942 height: 100%;
4943 max-height: 75px;
4944 -o-object-fit: cover;
4945 object-fit: cover;
4946 }
4947 .merchant-module-page-setting-field-gallery .merchant-gallery-image.ui-sortable-helper img {
4948 cursor: -webkit-grabbing;
4949 cursor: grabbing;
4950 }
4951 .merchant-module-page-setting-field-gallery .merchant-gallery-image i {
4952 cursor: pointer;
4953 position: absolute;
4954 z-index: 1;
4955 top: 5px;
4956 right: 5px;
4957 width: 16px;
4958 height: 16px;
4959 display: -webkit-box;
4960 display: -ms-flexbox;
4961 display: flex;
4962 -webkit-box-pack: center;
4963 -ms-flex-pack: center;
4964 justify-content: center;
4965 -webkit-box-align: center;
4966 -ms-flex-align: center;
4967 align-items: center;
4968 color: #fff;
4969 background-color: #c5280c;
4970 font-size: 14px;
4971 line-height: 1em;
4972 border-radius: 16px;
4973 opacity: 0;
4974 -webkit-transition: all 0.2s;
4975 transition: all 0.2s;
4976 }
4977 .merchant-module-page-setting-field-gallery .merchant-gallery-image:hover i {
4978 opacity: 1;
4979 }
4980 .merchant-module-page-setting-field-gallery .merchant-gallery-button {
4981 cursor: pointer;
4982 -webkit-user-select: none;
4983 -moz-user-select: none;
4984 -ms-user-select: none;
4985 user-select: none;
4986 display: -webkit-inline-box;
4987 display: -ms-inline-flexbox;
4988 display: inline-flex;
4989 padding: 0.4375rem 1rem;
4990 font-size: 0.875rem;
4991 font-weight: 600;
4992 line-height: 1.5;
4993 white-space: nowrap;
4994 text-transform: none;
4995 text-decoration: none;
4996 color: #212b36;
4997 background-color: #fff;
4998 border: 1px solid #c4cdd5;
4999 border-radius: 0.25rem;
5000 -webkit-transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5001 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5002 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5003 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5004 }
5005 .merchant-module-page-setting-field-gallery .merchant-gallery-button:hover, .merchant-module-page-setting-field-gallery .merchant-gallery-button:focus {
5006 outline: none;
5007 -webkit-box-shadow: none;
5008 box-shadow: none;
5009 }
5010 .merchant-module-page-setting-field-gallery .ui-sortable-placeholder {
5011 visibility: visible !important;
5012 border: 1px dashed #ddd;
5013 background-color: #f9f9f9;
5014 border-radius: 4px;
5015 }
5016
5017 .merchant-module-page-setting-field-upload .merchant-upload-wrapper {
5018 display: -webkit-box;
5019 display: -ms-flexbox;
5020 display: flex;
5021 grid-gap: 5px;
5022 -ms-flex-wrap: wrap;
5023 flex-wrap: wrap;
5024 margin-bottom: 15px;
5025 }
5026 .merchant-module-page-setting-field-upload .merchant-upload-wrapper:empty {
5027 display: none;
5028 }
5029 .merchant-module-page-setting-field-upload .merchant-upload-button-wrapper.merchant-upload-button-drag-drop {
5030 position: relative;
5031 background: #F6F6F6;
5032 border: 1px solid #EAEAEB;
5033 border-radius: 5px;
5034 height: 150px;
5035 }
5036 .merchant-module-page-setting-field-upload .merchant-upload-button-wrapper.merchant-upload-button-drag-drop .merchant-upload-button {
5037 display: -webkit-box;
5038 display: -ms-flexbox;
5039 display: flex;
5040 -webkit-box-orient: vertical;
5041 -webkit-box-direction: normal;
5042 -ms-flex-direction: column;
5043 flex-direction: column;
5044 -webkit-box-align: center;
5045 -ms-flex-align: center;
5046 align-items: center;
5047 -webkit-box-pack: center;
5048 -ms-flex-pack: center;
5049 justify-content: center;
5050 width: 100%;
5051 height: 100%;
5052 margin-top: 10px;
5053 border: none;
5054 background: no-repeat;
5055 outline: none;
5056 -webkit-box-shadow: none;
5057 box-shadow: none;
5058 }
5059 .merchant-module-page-setting-field-upload .merchant-upload-button-wrapper.merchant-upload-button-drag-drop img {
5060 position: absolute;
5061 left: 50%;
5062 top: 50%;
5063 -webkit-transform: translate(-50%, -50%);
5064 transform: translate(-50%, -50%);
5065 margin-top: -15px;
5066 }
5067 .merchant-module-page-setting-field-upload .merchant-upload-image {
5068 position: relative;
5069 display: -webkit-box;
5070 display: -ms-flexbox;
5071 display: flex;
5072 -webkit-box-align: center;
5073 -ms-flex-align: center;
5074 align-items: center;
5075 -webkit-box-pack: center;
5076 -ms-flex-pack: center;
5077 justify-content: center;
5078 border-radius: 4px;
5079 padding: 2px;
5080 border: 1px solid #eee;
5081 background-color: #fff;
5082 }
5083 .merchant-module-page-setting-field-upload .merchant-upload-image img {
5084 cursor: -webkit-grab;
5085 cursor: grab;
5086 width: 100%;
5087 height: 100%;
5088 max-height: 75px;
5089 -o-object-fit: cover;
5090 object-fit: cover;
5091 }
5092 .merchant-module-page-setting-field-upload .merchant-upload-image i {
5093 cursor: pointer;
5094 position: absolute;
5095 z-index: 1;
5096 top: 5px;
5097 right: 5px;
5098 width: 16px;
5099 height: 16px;
5100 display: -webkit-box;
5101 display: -ms-flexbox;
5102 display: flex;
5103 -webkit-box-pack: center;
5104 -ms-flex-pack: center;
5105 justify-content: center;
5106 -webkit-box-align: center;
5107 -ms-flex-align: center;
5108 align-items: center;
5109 color: #fff;
5110 background-color: #c5280c;
5111 font-size: 14px;
5112 line-height: 1em;
5113 border-radius: 16px;
5114 opacity: 0;
5115 -webkit-transition: all 0.2s;
5116 transition: all 0.2s;
5117 }
5118 .merchant-module-page-setting-field-upload .merchant-upload-image:hover i {
5119 opacity: 1;
5120 }
5121 .merchant-module-page-setting-field-upload .merchant-upload-button {
5122 cursor: pointer;
5123 -webkit-user-select: none;
5124 -moz-user-select: none;
5125 -ms-user-select: none;
5126 user-select: none;
5127 display: -webkit-inline-box;
5128 display: -ms-inline-flexbox;
5129 display: inline-flex;
5130 padding: 0.4375rem 1rem;
5131 font-size: 0.875rem;
5132 font-weight: 600;
5133 line-height: 1.5;
5134 white-space: nowrap;
5135 text-transform: none;
5136 text-decoration: none;
5137 color: #212b36;
5138 background-color: #fff;
5139 border: 1px solid #c4cdd5;
5140 border-radius: 0.25rem;
5141 -webkit-transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5142 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5143 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5144 transition: background 0.2s cubic-bezier(0.64, 0, 0.35, 1), border 0.2s cubic-bezier(0.64, 0, 0.35, 1), box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1), -webkit-box-shadow 0.2s cubic-bezier(0.64, 0, 0.35, 1);
5145 }
5146 .merchant-module-page-setting-field-upload .merchant-upload-button:hover, .merchant-module-page-setting-field-upload .merchant-upload-button:focus {
5147 outline: none;
5148 -webkit-box-shadow: none;
5149 box-shadow: none;
5150 }
5151
5152 .merchant-module-page-setting-field-switcher .merchant-toggle-switch {
5153 display: -webkit-box;
5154 display: -ms-flexbox;
5155 display: flex;
5156 -webkit-box-pack: start;
5157 -ms-flex-pack: start;
5158 justify-content: flex-start;
5159 }
5160 .merchant-module-page-setting-field-switcher input {
5161 display: none;
5162 }
5163 .merchant-module-page-setting-field-switcher input:checked + .toggle-switch-label .toggle-switch-inner {
5164 margin-left: 0;
5165 background: #3858E9;
5166 }
5167 .merchant-module-page-setting-field-switcher input:checked + .toggle-switch-label .toggle-switch-switch {
5168 right: 1px;
5169 }
5170 .merchant-module-page-setting-field-switcher .toggle-switch {
5171 float: right;
5172 position: relative;
5173 width: 36px;
5174 margin-top: 2px;
5175 -webkit-user-select: none;
5176 -moz-user-select: none;
5177 -ms-user-select: none;
5178 user-select: none;
5179 }
5180 .merchant-module-page-setting-field-switcher .toggle-switch-label {
5181 position: relative;
5182 display: inline-block;
5183 overflow: hidden;
5184 cursor: pointer;
5185 border-radius: 20px;
5186 padding: 0;
5187 margin: 0;
5188 width: 36px;
5189 }
5190 .merchant-module-page-setting-field-switcher .toggle-switch-inner {
5191 display: block;
5192 width: 200%;
5193 margin-left: -100%;
5194 background: #c8c8c8;
5195 height: 18px;
5196 }
5197 .merchant-module-page-setting-field-switcher .toggle-switch-switch {
5198 display: block;
5199 width: 12px;
5200 height: 12px;
5201 margin: 3px;
5202 background-color: #fff;
5203 position: absolute;
5204 top: 0;
5205 bottom: 0;
5206 right: 18px;
5207 border-radius: 20px;
5208 -webkit-transition: all 0.1s ease-in 0s;
5209 transition: all 0.1s ease-in 0s;
5210 }
5211
5212 .merchant-module-alert {
5213 position: fixed;
5214 top: 0;
5215 left: 0;
5216 right: 0;
5217 bottom: 0;
5218 z-index: 99999;
5219 display: -webkit-box;
5220 display: -ms-flexbox;
5221 display: flex;
5222 -webkit-box-pack: center;
5223 -ms-flex-pack: center;
5224 justify-content: center;
5225 -webkit-box-align: center;
5226 -ms-flex-align: center;
5227 align-items: center;
5228 background-color: rgba(0, 0, 0, 0.6);
5229 opacity: 0;
5230 visibility: hidden;
5231 -webkit-user-select: none;
5232 -moz-user-select: none;
5233 -ms-user-select: none;
5234 user-select: none;
5235 pointer-events: none;
5236 -webkit-transition: all 0.2s;
5237 transition: all 0.2s;
5238 }
5239 .merchant-module-alert.merchant-show {
5240 -webkit-user-select: auto;
5241 -moz-user-select: auto;
5242 -ms-user-select: auto;
5243 user-select: auto;
5244 pointer-events: auto;
5245 opacity: 1;
5246 visibility: visible;
5247 }
5248
5249 .merchant-module-alert-wrapper {
5250 display: -webkit-box;
5251 display: -ms-flexbox;
5252 display: flex;
5253 -webkit-box-orient: vertical;
5254 -webkit-box-direction: normal;
5255 -ms-flex-direction: column;
5256 flex-direction: column;
5257 width: 640px;
5258 max-width: 90%;
5259 border-radius: 4px;
5260 background-color: #fff;
5261 }
5262
5263 .merchant-module-alert-header {
5264 display: -webkit-box;
5265 display: -ms-flexbox;
5266 display: flex;
5267 -webkit-box-align: center;
5268 -ms-flex-align: center;
5269 align-items: center;
5270 -webkit-box-pack: justify;
5271 -ms-flex-pack: justify;
5272 justify-content: space-between;
5273 padding: 20px 30px;
5274 }
5275 .merchant-module-alert-header strong {
5276 font-size: 18px;
5277 line-height: 1em;
5278 }
5279 .merchant-module-alert-header a {
5280 position: relative;
5281 right: -5px;
5282 display: -webkit-box;
5283 display: -ms-flexbox;
5284 display: flex;
5285 color: #212121;
5286 text-decoration: none;
5287 -webkit-transition: all 0.2s;
5288 transition: all 0.2s;
5289 }
5290 .merchant-module-alert-header a:hover {
5291 opacity: 0.6;
5292 }
5293 .merchant-module-alert-header a:focus, .merchant-module-alert-header a:active {
5294 outline: none;
5295 -webkit-box-shadow: none;
5296 box-shadow: none;
5297 }
5298 .merchant-module-alert-header i {
5299 font-size: 32px;
5300 line-height: 1em;
5301 width: auto;
5302 height: auto;
5303 }
5304
5305 .merchant-module-alert-content {
5306 display: -webkit-box;
5307 display: -ms-flexbox;
5308 display: flex;
5309 -webkit-box-orient: vertical;
5310 -webkit-box-direction: normal;
5311 -ms-flex-direction: column;
5312 flex-direction: column;
5313 grid-gap: 20px;
5314 padding: 0 30px 30px 30px;
5315 }
5316 .merchant-module-alert-content p {
5317 margin: 0;
5318 padding: 0;
5319 font-size: 15px;
5320 font-weight: 500;
5321 color: #757575;
5322 }
5323 .merchant-module-alert-content figure {
5324 display: -webkit-box;
5325 display: -ms-flexbox;
5326 display: flex;
5327 margin: 0;
5328 padding: 0;
5329 }
5330 .merchant-module-alert-content img {
5331 max-width: 100%;
5332 }
5333
5334 .merchant-module-alert-footer {
5335 display: -webkit-box;
5336 display: -ms-flexbox;
5337 display: flex;
5338 -webkit-box-pack: end;
5339 -ms-flex-pack: end;
5340 justify-content: flex-end;
5341 padding: 30px;
5342 }
5343 .merchant-module-alert-footer a {
5344 font-weight: bold;
5345 font-size: 14px;
5346 padding: 10px 15px;
5347 text-decoration: none;
5348 border-radius: 4px;
5349 color: #212121;
5350 border: 1px solid #e5e5e5;
5351 }
5352 .merchant-module-alert-footer a:focus, .merchant-module-alert-footer a:active {
5353 outline: none;
5354 -webkit-box-shadow: none;
5355 box-shadow: none;
5356 }
5357
5358 .merchant-module-page-setting-field-inner.disabled .merchant-color-picker {
5359 pointer-events: none;
5360 opacity: 0.8;
5361 }
5362 .merchant-module-page-setting-field-inner.disabled .merchant-toggle-switch {
5363 opacity: 0.5;
5364 }
5365 .merchant-module-page-setting-field-inner.disabled .merchant-range {
5366 opacity: 0.5;
5367 }
5368 .merchant-module-page-setting-field-inner.disabled .merchant-module-page-settings-devices {
5369 opacity: 0.5;
5370 }
5371
5372 /* Utils */
5373 .merchant-height-auto {
5374 height: auto;
5375 }
5376
5377 /* Admin Footer Text */
5378 .merchant-admin-page .merchant-admin-footer-text-link {
5379 display: inline-block;
5380 padding-right: 5px;
5381 color: #3858E9;
5382 }
5383 .merchant-admin-page .merchant-admin-footer-text-link:hover, .merchant-admin-page .merchant-admin-footer-text-link:active, .merchant-admin-page .merchant-admin-footer-text-link:visited {
5384 color: #3858E9;
5385 }
5386
5387 .merchant-admin-page-module #wpfooter {
5388 display: none;
5389 }
5390 .merchant-admin-page-module #wpbody-content {
5391 padding-bottom: 30px;
5392 }
5393
5394 .merchant-module-footer-text {
5395 display: -webkit-box;
5396 display: -ms-flexbox;
5397 display: flex;
5398 grid-gap: 5px;
5399 -webkit-box-pack: center;
5400 -ms-flex-pack: center;
5401 justify-content: center;
5402 text-align: center;
5403 margin-top: 37px;
5404 }
5405 .merchant-module-footer-text i {
5406 color: #3858E9;
5407 }
5408
5409 /* Responsive */
5410 @media (max-width: 991px) {
5411 .merchant-wrap {
5412 display: -webkit-box;
5413 display: -ms-flexbox;
5414 display: flex;
5415 -webkit-box-orient: vertical;
5416 -webkit-box-direction: normal;
5417 -ms-flex-direction: column;
5418 flex-direction: column;
5419 grid-gap: 20px;
5420 }
5421 .merchant-modules-header-shortlinks {
5422 margin: 0;
5423 }
5424 .merchant-modules-header {
5425 -webkit-box-orient: vertical;
5426 -webkit-box-direction: normal;
5427 -ms-flex-direction: column;
5428 flex-direction: column;
5429 grid-gap: 20px;
5430 }
5431 .merchant-module-page-header-content {
5432 width: 100%;
5433 }
5434 .merchant-module-page-desc {
5435 max-width: none;
5436 }
5437 .merchant-module-page-header-placeholder {
5438 display: none;
5439 }
5440 .merchant-modules-header-image {
5441 display: none;
5442 }
5443 .merchant-modules-list {
5444 grid-template-columns: repeat(1, minmax(0, 1fr));
5445 }
5446 .merchant-modules-header-status {
5447 margin-bottom: 0;
5448 }
5449 .merchant-module-page-setting-box {
5450 -webkit-box-orient: vertical;
5451 -webkit-box-direction: normal;
5452 -ms-flex-direction: column;
5453 flex-direction: column;
5454 grid-gap: 20px;
5455 }
5456 .merchant-module-page-setting-title,
5457 .merchant-module-page-setting-fields {
5458 width: 100%;
5459 }
5460 .merchant-module-page-body {
5461 -webkit-box-orient: vertical;
5462 -webkit-box-direction: reverse;
5463 -ms-flex-direction: column-reverse;
5464 flex-direction: column-reverse;
5465 }
5466 .merchant-module-page-content {
5467 width: 100%;
5468 }
5469 .merchant-module-page-preview {
5470 margin-left: 0;
5471 margin-bottom: 20px;
5472 width: 100%;
5473 }
5474 }
5475 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area {
5476 margin-bottom: 0px;
5477 position: relative;
5478 }
5479 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area .merchant-search-field {
5480 background-color: #F0F0F0;
5481 border: none;
5482 border-radius: 3px;
5483 padding: 13px 0 13px 40px;
5484 width: 100%;
5485 }
5486 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area .merchant-search-field::-webkit-input-placeholder {
5487 font-size: 12px;
5488 }
5489 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area .merchant-search-field::-moz-placeholder {
5490 font-size: 12px;
5491 }
5492 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area .merchant-search-field:-ms-input-placeholder {
5493 font-size: 12px;
5494 }
5495 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area .merchant-search-field::-ms-input-placeholder {
5496 font-size: 12px;
5497 }
5498 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area .merchant-search-field::placeholder {
5499 font-size: 12px;
5500 }
5501 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-search-area .merchant-search-icon {
5502 position: absolute;
5503 top: 50%;
5504 left: 15px;
5505 -webkit-transform: translateY(-50%);
5506 transform: translateY(-50%);
5507 }
5508 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-searching {
5509 margin-left: 10px;
5510 margin-right: 10px;
5511 font-style: italic;
5512 font-size: 11px;
5513 position: absolute;
5514 top: 13px;
5515 right: 0;
5516 color: #9d9d9d;
5517 display: none;
5518 }
5519 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-searching.active {
5520 display: inline;
5521 }
5522 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-selections-products-preview {
5523 position: absolute;
5524 top: 100%;
5525 left: 0;
5526 right: 0;
5527 z-index: 10;
5528 background-color: #fff;
5529 border: 1px solid #ddd;
5530 padding: 0;
5531 margin: 0;
5532 height: 190px;
5533 overflow-y: scroll;
5534 display: none;
5535 }
5536 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-selections-products-preview li {
5537 cursor: pointer;
5538 }
5539 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-selections-products-preview li.hierarchy-style {
5540 padding-left: 15px;
5541 }
5542 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-selections-products-preview li.hierarchy-style:before {
5543 content: "";
5544 display: inline-block;
5545 width: 6px;
5546 height: 6px;
5547 border-radius: 50%;
5548 background-color: #d1d1d1;
5549 margin-right: 7px;
5550 }
5551 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-selected-products-preview ul li {
5552 border-radius: 4px;
5553 margin: 15px 0 15px;
5554 border: 1px solid #dfe1e1;
5555 }
5556 .merchant-module-page-setting-field-products_selector .merchant-products-search-container .merchant-selected-products-preview ul li:last-child {
5557 margin-bottom: 0;
5558 }
5559 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul {
5560 padding: 0;
5561 margin: 0;
5562 }
5563 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li {
5564 padding: 5px 10px;
5565 margin: 0 -3px;
5566 min-height: 30px;
5567 display: -webkit-box;
5568 display: -ms-flexbox;
5569 display: flex;
5570 -webkit-box-pack: justify;
5571 -ms-flex-pack: justify;
5572 justify-content: space-between;
5573 -webkit-box-align: center;
5574 -ms-flex-align: center;
5575 align-items: center;
5576 border-bottom: 1px dotted #eee;
5577 position: relative;
5578 overflow: hidden;
5579 -webkit-user-select: none;
5580 -moz-user-select: none;
5581 -ms-user-select: none;
5582 user-select: none;
5583 -webkit-transition: 300ms;
5584 transition: 300ms;
5585 }
5586 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li:hover {
5587 background-color: #fafafa;
5588 }
5589 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li > span {
5590 margin-left: 3px;
5591 margin-right: 3px;
5592 }
5593 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li span.img {
5594 width: 30px;
5595 -webkit-box-flex: 0;
5596 -ms-flex: 0 0 30px;
5597 flex: 0 0 30px;
5598 }
5599 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li span.img img {
5600 width: 30px;
5601 height: 30px;
5602 border-radius: 4px;
5603 display: block;
5604 }
5605 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li span.data {
5606 -webkit-box-flex: 1;
5607 -ms-flex-positive: 1;
5608 flex-grow: 1;
5609 }
5610 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li span.type {
5611 font-size: 10px;
5612 color: #999;
5613 min-width: 40px;
5614 text-decoration: none;
5615 text-align: end;
5616 }
5617 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li del .amount {
5618 text-decoration: line-through;
5619 }
5620 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li span.info {
5621 font-size: 12px;
5622 font-style: italic;
5623 height: 18px;
5624 line-height: 18px;
5625 color: #999;
5626 background-color: #f1f1f1;
5627 text-decoration: none;
5628 padding: 0 6px;
5629 border-radius: 2px;
5630 margin-left: 3px;
5631 margin-right: 3px;
5632 }
5633 .merchant-module-page-setting-field-products_selector .merchant-products-search-container ul li .remove {
5634 width: 30px;
5635 height: 30px;
5636 line-height: 28px;
5637 font-size: 15px;
5638 -webkit-box-flex: 0;
5639 -ms-flex: 0 0 30px;
5640 flex: 0 0 30px;
5641 border-radius: 50%;
5642 text-align: center;
5643 background-color: #f6f3f3;
5644 cursor: pointer;
5645 }
5646
5647 .merchant-image-picker label {
5648 position: relative;
5649 display: inline-block;
5650 margin-right: 10px;
5651 margin-bottom: 5px;
5652 }
5653 .merchant-image-picker label .tool-tip-text {
5654 visibility: hidden;
5655 opacity: 0;
5656 width: 120px;
5657 background-color: black;
5658 color: #fff;
5659 text-align: center;
5660 border-radius: 6px;
5661 padding: 5px 0;
5662 position: absolute;
5663 z-index: 1;
5664 top: -35px;
5665 left: 50%;
5666 margin-left: -60px;
5667 -webkit-transition: opacity 300ms;
5668 transition: opacity 300ms;
5669 }
5670 .merchant-image-picker label .tool-tip-text::after {
5671 content: "";
5672 position: absolute;
5673 top: 100%;
5674 left: 50%;
5675 margin-left: -5px;
5676 border-width: 5px;
5677 border-style: solid;
5678 border-color: black transparent transparent transparent;
5679 }
5680 .merchant-image-picker label:hover .tool-tip-text {
5681 visibility: visible;
5682 opacity: 1;
5683 }
5684 .merchant-image-picker input[type=radio] {
5685 display: none;
5686 clear: both;
5687 }
5688 .merchant-image-picker img {
5689 border: 2px solid #F0F0F1;
5690 border-radius: 4px;
5691 cursor: pointer;
5692 padding: 7px 3px;
5693 -webkit-transition: 300ms;
5694 transition: 300ms;
5695 }
5696 .merchant-image-picker input[type=radio]:checked + img {
5697 border: 2px solid #3858E9;
5698 }