Issues:
1/*
2 1. SHORTCODE HOT DEAL
3 2. SHORTCODE BANNER
4 3. SHORTCODE LOGO SLIDER
5 4. SHORTCODE PRODUCT SLIDER
6 5. SHORTCODE TESTIMONIAL
7 6. SHORTCODE TEAM MEMBER
8 7. SHORTCODE PRODUCT BRANDS
9 8. SHORTCODE TAB PRODUCTS
10 9. SHORTCODE SUBSCRIPTION
11 10. SHORTCODE PRODUCTS CATEGORIES LIST
12 11. SHORTCODE PRODUCTS DEALS
13 12. SHORTCODE COUPONS
14 13. SHORTCODE SOCIAL
15 14. SHORTCODE FILTER BY TAXONOMIES
16*/
17/*-------------------------------------------------------------------------------------------------------------------
18 EFFECTS
19---------------------------------------------------------------------------------------------------------------------*/
20.animated{
-webkit-animation-duration: 1s;animation-duration: 1s;
-webkit-animation-fill-mode: both;animation-fill-mode: both }
21@-webkit-keyframes fadeIn{0%{opacity: 0}
22100%{opacity: 1}
23}
24@keyframes fadeIn{0%{opacity: 0}
25100%{opacity: 1}
26}
27
28.fadeIn{
-webkit-animation-name: fadeIn;animation-name: fadeIn }
29@-webkit-keyframes fadeOut{0%{opacity: 1}
30100%{opacity: 0}
31}
32@keyframes fadeOut{0%{opacity: 1}
33100%{opacity: 0}
34}
35
36.fadeOut{
-webkit-animation-name: fadeOut;animation-name: fadeOut }
37
38.ts-effect-image{text-align: center;backface-visibility: hidden;
-webkit-backface-visibility: hidden;}
39
40.ts-effect-image .image-link{display: block;position: relative;max-width: 100%;overflow: hidden;}
41
42/*-------------------------------------------------------------------------------------------------------------------
43 1. SHORTCODE HOT DEAL
44---------------------------------------------------------------------------------------------------------------------*/
45.counter-wrapper {
46 display: flex;
47 flex-wrap: wrap;
48 gap: 18px;
49 justify-content: center;
50}
51
52.counter-wrapper > div {
53 min-width: 54px;
54 text-align: center;
55}
56
57.counter-wrapper > div,
58.counter-wrapper > span {
59 font-size: 40px;
60 line-height: 1;
61}
62
63.counter-wrapper .number-wrapper {
64 display: inline-flex;
65 align-items: center;
66 justify-content: center;
67 font-weight: 600;
68}
69
70.counter-wrapper .ref-wrapper {
71 text-align: center;
72 font-size: 0.35em;
73 line-height: 20px;
74 margin-top: 5px;
75}
76
77
78/*-------------------------------------------------------------------------------------------------------------------
79 2. SHORTCODE BANNER
80---------------------------------------------------------------------------------------------------------------------*/
81.ts-banner,
82.ts-banner * {
83 backface-visibility: hidden;
84
-webkit-backface-visibility: hidden;
85}
86
87.ts-banner {
88 width: 100%;
89 overflow: hidden;
90}
91
92.ts-banner .banner-wrapper {
93 position: relative;
94 overflow: hidden;
95
-webkit-backface-visibility: hidden;
96
-moz-backface-visibility: hidden;
97
-webkit-transform: translate3d(0, 0, 0);
98
-moz-transform: translate3d(0, 0, 0)
99}
100
101.ts-banner .banner-wrapper > a {
102 position: absolute;
103 inset: 0;
104 z-index: 6;
105}
106
107.ts-banner .box-content h2 {
108 line-height: 1.3;
109}
110
111.ts-banner-button a.button {
112 display: inline-block;
113}
114
115.banner-wrapper > * {
116 position: relative;
117 z-index: 3;
118}
119
120.ts-banner .background-overlay {
121 height: 100%;
122 width: 100%;
123 top: 0;left: 0;
124 position: absolute;
125 z-index: 4;
126}
127
128.ts-banner .banner-bg img {
129 position: relative;
130 margin: 0 auto;
131 width: 100%;
132 transition: 0.3s ease 0s;
133}
134
135.ts-banner .box-content {
136 position: absolute;
137 z-index: 5;
138 left: 0;
139 right: 0;
140 bottom: 0;
141 top: 0;
142 display: flex;
143 flex-direction: column;
144 height: 100%;
145}
146
147.ts-banner .banner-bg .mobile-banner{display: none;}
148
149.ts-banner .ts-banner-button a.button{
150 padding: 5px 20px;
151 font-size: calc(var(--ts-btn-font-size) - 1px);
152}
153
154.ts-banner .content-text u{
155 text-decoration-line: underline;
156 text-underline-offset: 5px;
157 text-decoration-thickness: 2px;
158}
159
160
161/*** Effects Banner ***/
162.eff-grow-rotate:hover img.bg-image,
163.eff-zoom-in:hover img.bg-image {
164 transform: scale(1.12,1.12);
165}
166
167.eff-grow-rotate img.bg-image{
168 transform: rotate(0deg) scale(1,1);
169 transition: 0.3s ease 0s;
170}
171
172.eff-grow-rotate:hover img.bg-image {
173 transform: rotate(3deg) scale(1.12);
174}
175
176.eff-flash .banner-wrapper {
177 position: relative;
178 overflow: hidden;
179}
180
181.eff-flash .banner-wrapper:before,
182.eff-flash .banner-wrapper:after {
183 content: '';
184 width: 100%;
185 height: 100%;
186 background: rgba(255,255,255,.3);
187 position: absolute;
188 top: 0;
189 left: 0;
190 z-index: 5;
191 transition: transform .4s,opacity .15s ease-in-out 0s;
192 opacity: 0;
193}
194
195.eff-flash:hover .banner-wrapper:before {
196 transform: scale(0,1);
197 opacity: 1;
198}
199
200.eff-flash:hover .banner-wrapper:after {
201 transform: scale(1,0);
202 opacity: 1;
203}
204
205
206/*-------------------------------------------------------------------------------------------------------------------
207 3. SHORTCODE LOGO SLIDER
208---------------------------------------------------------------------------------------------------------------------*/
209.ts-logo-slider-wrapper, .ts-product-brand-wrapper {
210 --ts-h-gap: 17px;
211 --ts-v-gap: 17px;
212}
213
214.ts-logo-slider-wrapper .item > a {
215 background: var(--ts-brand-bg);
216 display: flex;
217 justify-content: center;
218 flex-wrap: wrap;
219 align-items: center;
220 min-height: 80px;
221 transition: none;
222 border-radius: var(--ts-border-radius);
223}
224
225.ts-logo-slider-wrapper.has-border .item > a {
226 border-width: 1px;
227 border-style: solid;
228}
229
230.ts-logo-slider-wrapper .item a img {
231 max-height: 80px;
232 width: auto;
233 transition: 200ms ease;
234 border-radius: var(--ts-border-radius);
235}
236
237.ts-logo-slider-wrapper .item:hover img {filter: grayscale(1);}
238
239.ts-logo-slider-wrapper .item img {transition: 200ms ease;}
240
241/**/
242.ts-logo-slider-wrapper.item-border .item > a {
243 border-width: 1px;
244 border-style: solid;
245}
246
247
248/*-------------------------------------------------------------------------------------------------------------------
249 4. SHORTCODE PRODUCT SLIDER
250---------------------------------------------------------------------------------------------------------------------*/
251.ts-shortcode {position: relative; clear: both;}
252
253.ts-shortcode:not(.ts-product) {overflow: hidden}
254
255.ts-shortcode .shortcode-heading-wrapper h3:empty,
256.ts-shortcode .shortcode-heading-wrapper .shortcode-title:empty {margin-bottom: 0; padding-bottom: 0; border: 0;}
257
258.column-tabs .list-categories,
259.ts-shortcode .shortcode-heading-wrapper {
260 display: flex;
261 flex-wrap: wrap;
262 align-items: center;
263}
264
265.column-tabs * {
266 color: inherit;
267}
268
269.shortcode-heading-wrapper .ts-countdown-wrapper > span {
270 font-size: 0.93em;
271 font-weight: 500;
272 color: var(--ts-gray-color);
273}
274
275.shortcode-heading-wrapper .ts-countdown-wrapper,
276.shortcode-heading-wrapper .shop-more {
277 display: inline-flex;
278 align-items: center;
279 gap: 10px;
280 margin-left: auto; /*rtl*/
281}
282
283.shortcode-heading-wrapper .shop-more {
284 min-height: 20px;
285}
286
287.column-tabs .shop-more {line-height: 1;}
288
289.column-tabs .shop-more,
290.shortcode-heading-wrapper .ts-countdown-wrapper + .shop-more {
291 position: relative;
292 padding-left: 30px; /*rtl*/
293}
294
295.column-tabs .shop-more:before,
296.shortcode-heading-wrapper .ts-countdown-wrapper + .shop-more:before {
297 content: '';
298 width: 0;
299 height: 20px;
300 border-left: 1px solid var(--ts-border); /*rtl*/
301 position: absolute;
302 top: 50%;
303 left: 0;
304 transform: translateY(-50%);
305}
306
307.column-tabs .shop-more:before {height: 14px;}
308
309
310/*-------------------------------------------------------------------------------------------------------------------
311 5. SHORTCODE TESTIMONIAL
312---------------------------------------------------------------------------------------------------------------------*/
313.ts-testimonial-wrapper .author-image-meta {
314 display: flex;
315 flex-wrap: wrap;
316 gap: 0 15px;
317 align-items: center;
318 margin: 8px 0 0;
319}
320
321.ts-testimonial-wrapper .author-image-meta .image {width: 50px;}
322
323.ts-testimonial-wrapper .author-image-meta .image img {
324 border-radius: 50%;
325 box-shadow: 2px 2px 0 rgba(0, 0, 0, 0.2);
326}
327
328.ts-testimonial-wrapper .author-image-meta .author-meta {
329 color: var(--ts-gray-color);
330 font-size: 0.85rem;
331 line-height: 18px;
332 font-weight: normal;
333 display: flex;
334 flex-wrap: wrap;
335 gap: 2px 10px;
336 flex: 1;
337}
338
339.ts-testimonial-wrapper .author-image-meta .author-meta .author a {color: var(--ts-text-color);}
340
341.ts-testimonial-wrapper .author-image-meta .author-meta .author {width: 100%;}
342
343.ts-testimonial-wrapper .author-image-meta .author-meta .role + .date-time {
344 padding-left: 20px; /* rtl */
345 position: relative;
346}
347
348.ts-testimonial-wrapper .author-image-meta .author-meta .role + .date-time:before {
349 content: " ";
350 display: inline-block;
351 width: 10px;
352 height: 1px;
353 background: var(--ts-border);
354 position: absolute;
355 left: 0; /* rtl */
356 top: 50%;
357}
358
359
360/*-------------------------------------------------------------------------------------------------------------------
361 6. SHORTCODE TEAM MEMBER
362---------------------------------------------------------------------------------------------------------------------*/
363.ts-team-members .team-content,
364.ts-team-members .team-info {
365 display: flex;
366 flex-flow: column wrap;
367 align-items: center;
368 gap: 25px;
369}
370
371.ts-team-members .image-thumbnail img {border-radius: 10px;}
372
373.ts-team-members .team-info {gap: 8px;}
374
375.ts-team-members .team-info > * {margin: 0; padding: 0;}
376
377.ts-team-members .team-info .name {font-size: 1.33rem;}
378
379.ts-team-members .team-info > .member-social {
380 display: flex;
381 flex-wrap: wrap;
382 align-items: center;
383 gap: 20px;
384 font-size: 25px;
385 margin-top: 4px;
386}
387
388.ts-team-members .team-info .member-social a {text-decoration: none; color: inherit;}
389
390.ts-team-members .team-info .member-social a:hover {color: var(--ts-primary-color);}
391
392
393/*-------------------------------------------------------------------------------------------------------------------
394 7. SHORTCODE PRODUCT BRANDS
395---------------------------------------------------------------------------------------------------------------------*/
396.ts-product-brand-wrapper .item > a {
397 display: flex;
398 justify-content: center;
399 flex-wrap: wrap;
400 align-items: center;
401 min-height: 80px;
402 transition: none;
403 border: 1px solid #EAEFF2;
404 border-radius: var(--ts-border-radius);
405 padding: 0 10px;
406}
407
408.ts-product-brand-wrapper .item a img {
409 max-height: 80px;
410 width: auto;
411 transition: 200ms ease;
412 border-radius: var(--ts-border-radius);
413}
414
415.ts-product-brand-wrapper .item:hover a {
416 border-color: var(--ts-heading-color);
417}
418
419.ts-product-brand-wrapper .meta-wrapper {
420 margin-top: 15px;
421 text-align: center;
422 padding: 0;
423 line-height: 1.3;
424 display: flex;
425 flex-flow: column wrap;
426 gap: 5px;
427}
428
429
430/*-------------------------------------------------------------------------------------------------------------------
431 8. SHORTCODE TAB PRODUCTS
432---------------------------------------------------------------------------------------------------------------------*/
433.column-tabs .list-categories {
434 justify-content: space-between;
435}
436
437.ts-product-in-product-type-tab-wrapper .column-tabs,
438.column-tabs .list-categories,
439.ts-shortcode .shortcode-heading-wrapper {
440 margin-bottom: 30px;
441 gap: 0 30px;
442}
443
444.ts-shortcode .shortcode-title {
445 flex: 1;
446 margin-bottom: 0;
447}
448
449.column-tabs .list-categories ul.tabs {
450 display: flex;
451 flex-wrap: wrap;
452 align-items: center;
453 gap: 10px 30px;
454 margin-left: auto; /* rtl */
455}
456
457.column-tabs .list-categories ul.tabs li {
458 font-size: 1em;
459 list-style: none;
460 padding: 0;
461 margin: 0;
462 line-height: 1.4;
463 font-weight: 500;
464 position: relative;
465 overflow: hidden;
466}
467
468.column-tabs .list-categories ul.tabs li:after {
469 content: '';
470 width: 100%;
471 height: 1px;
472 border-bottom: 1px solid;
473 position: absolute;
474 bottom: 0;
475 left: -100%;/* rtl */
476 right: auto;/* rtl */
477 transition: 250ms ease;
478}
479
480.column-tabs .list-categories ul.tabs li:hover:after,
481.column-tabs .list-categories ul.tabs li.current:after {
482 left: 0;/* rtl */
483 right: 0;/* rtl */
484}
485
486.column-tabs .list-categories ul.tabs li,
487.column-tabs .list-categories ul.tabs li:hover,
488.column-tabs .list-categories ul.tabs li.current {
489 color: var(--ts-heading-color);
490}
491
492.column-tabs .list-categories ul.tabs li:hover {
493 cursor: pointer;
494}
495
496.column-tabs .list-categories ul.tabs li.current {
497 cursor: default;
498}
499
500.column-tabs ul.tabs,
501.column-tabs .heading-tab .heading-title {
502 margin-bottom: 0 !important;
503}
504
505.column-tabs ul.tabs {
506 display: flex;
507 flex-wrap: wrap;
508 gap: 20px 0;
509}
510
511.column-tabs ul.tabs li {
512 list-style: none;
513 padding: 0;
514 position: relative;
515 font-family: var(--ts-heading-font-family);
516 font-weight: var(--ts-heading-font-weight);
517 font-style: var(--ts-heading-font-style);
518 line-height: var(--ts-heading-line-height);
519 letter-spacing: var(--ts-heading-letter-spacing);
520}
521
522.ts-product-in-product-type-tab-wrapper .column-tabs ul.tabs li:not(:last-child) {
523 padding: 0 20px 0 0; /* rtl */
524 margin: 0 20px 0 0; /* rtl */
525}
526
527.ts-product-in-product-type-tab-wrapper .column-tabs ul.tabs li:not(:last-child):after {
528 content: '';
529 width: 1px;
530 height: 20px;
531 background: var(--ts-border);
532 position:absolute;
533 right: 0; /* rtl */
534 top: 50%;
535 transform: translateY(-50%);
536}
537
538.ts-product-in-product-type-tab-wrapper .column-tabs {
539 display: flex;
540 flex-wrap: wrap;
541 justify-content: space-between;
542 align-items: center;
543}
544
545.ts-product-in-product-type-tab-wrapper .column-tabs .shop-more {padding: 5px 0 0;}
546
547.ts-product-in-product-type-tab-wrapper .column-tabs .shop-more:before {display: none;}
548
549.ts-product-in-product-type-tab-wrapper .column-tabs ul.tabs li {color: var(--ts-gray-color);}
550
551.ts-product-in-product-type-tab-wrapper .column-tabs ul.tabs li:hover,
552.ts-product-in-product-type-tab-wrapper .column-tabs ul.tabs li.current {color: var(--ts-heading-color);}
553
554.column-tabs ul.tabs li span.count {text-transform: none;}
555
556.ts-product-in-category-tab-wrapper .column-products {
557 display: flex;
558 flex-flow: column wrap;
559 gap: var(--ts-h-gap);
560}
561
562.ts-shortcode .tab-banner {
563 grid-column: span 2;
564 overflow: hidden;
565 display: inline-grid;
566 position: relative;
567 align-self: flex-start;
568}
569
570.ts-shortcode .tab-banner img {
571 border-radius: 10px;
572}
573
574.ts-shortcode .tab-banner:before {
575 content: '';
576 position: absolute;
577 top: 0;
578 left: -100%;
579 z-index: 2;
580 display: block;
581 width: 50%;
582 height: 100%;
583 background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.1) 100%);transform: skewX(-25deg);
584}
585
586.ts-shortcode .tab-banner:hover:before {
587
-webkit-animation: shine 1.2s;
588 animation: shine 1.2s;
589}
590
591
592/*** Fix loading ***/
593.woocommerce .column-products.loading .products {transition: 300ms ease 0s;}
594
595.column-products.loading:after {top: 35%;}
596
597
598/*-------------------------------------------------------------------------------------------------------------------
599 9. SHORTCODE SUBSCRIPTION
600---------------------------------------------------------------------------------------------------------------------*/
601.mailchimp-subscription .newsletter p,
602.mailchimp-subscription .widget-title-wrapper .widget-title {margin-bottom: 0;}
603
604.mailchimp-subscription .newsletter {line-height: 1.4em;}
605
606.widget-container.mailchimp-subscription .widget-title-wrapper,
607.widget-container.mailchimp-subscription .widget-title-wrapper .widget-title {margin-bottom: 22px;}
608
609.mc4wp-form .subscribe-email {
610 display: flex;
611 flex-wrap: wrap;
612 color: var(--ts-input-color);
613 background: var(--ts-input-background-color);
614 padding: 3px;
615 border-radius: var(--ts-border-radius);
616 overflow: hidden;
617 border: 1px solid;
618}
619
620form .subscribe-email input[type="text"],
621form .subscribe-email input[type="tel"],
622form .subscribe-email input[type="number"],
623form .subscribe-email input[type="password"],
624form .subscribe-email input[type="email"] {
625 margin: 0;
626 padding-top: 9px;
627 padding-bottom: 9px;
628 flex: 1;
629 background: transparent !important;
630 border-color: transparent !important;
631 color: inherit !important;
632}
633
634form .subscribe-email button,
635form .subscribe-email input[type="text"],
636form .subscribe-email input[type="tel"],
637form .subscribe-email input[type="number"],
638form .subscribe-email input[type="password"],
639form .subscribe-email input[type="email"] {border: 0 !important;}
640
641form .subscribe-email input[type="email"] {padding-right: 5px;/* rtl */}
642
643.mc4wp-form .subscribe-email a {color: inherit;}
644
645form .subscribe-email button {white-space: nowrap; position: relative;}
646
647form .processing button {color: transparent !important;}
648
649.woocommerce .style-button-icon .subscribe-email button.button,
650.style-button-icon .subscribe-email button.button {
651 font-size: 0;
652 padding: 0;
653 text-align: center;
654 background: transparent;
655 color: inherit;
656 border-radius: var(--ts-border-radius);
657}
658
659.style-button-icon .processing.subscribe-email button:after {
660 opacity: 0;
661 visibility: hidden;
662}
663
664.style-button-icon .subscribe-email button:after {
665 font-family: 'icomoon';
666 font-weight: normal;
667 font-style: normal;
668 letter-spacing: 0;
669 content: '\e974';
670 width: 50px;
671 line-height: 42px;
672 display: inline-block;
673 font-size: 18px;
674 background: transparent;
675}
676
677.style-button-icon .subscribe-email button:hover {
678 color: var(--ts-primary-color);
679}
680
681
682/*-------------------------------------------------------------------------------------------------------------------
683 10. SHORTCODE PRODUCTS CATEGORIES LIST
684---------------------------------------------------------------------------------------------------------------------*/
685.ts-list-of-product-categories-wrapper {
686 display: flex;
687 flex-wrap: wrap;
688 align-items: center;
689 gap: 30px;
690}
691
692.ts-list-of-product-categories-wrapper .list-categories {
693 flex: 1;
694 align-items: flex-start;
695 gap: 20px 15px;
696 margin: 0;
697}
698
699.ts-list-of-product-categories-wrapper .list-categories .heading-title {
700 font-size: var(--ts-body-font-size);
701 line-height: 1.4;
702 margin: 0;
703}
704
705.ts-list-of-product-categories-wrapper .list-categories ul {
706 margin: 0;
707 padding: 0;
708 display: grid;
709 gap: 14px;
710}
711
712.ts-list-of-product-categories-wrapper .list-categories ul li a {
713 color: inherit;
714 text-decoration: none;
715}
716
717.ts-list-of-product-categories-wrapper .list-categories ul li:hover,
718.ts-list-of-product-categories-wrapper .list-categories ul li a:not(.shop-more-button):hover {
719 color: var(--ts-primary-color);
720}
721
722.ts-list-of-product-categories-wrapper .list-categories ul li {
723 list-style: none;
724 padding: 0;
725}
726
727.ts-list-of-product-categories-wrapper .list-categories ul li.shop-more {
728 margin-top: 5px;
729}
730
731
732/*-------------------------------------------------------------------------------------------------------------------
733 11. SHORTCODE PRODUCTS DEALS
734---------------------------------------------------------------------------------------------------------------------*/
735.availability-status {
736 display: flex;
737 flex-wrap: wrap;
738 justify-content: space-between;
739 align-items: center;
740 margin-bottom: 7px;
741 font-size: 12px;
742}
743
744.availability-bar .progress-bar {
745 display: block;
746 width: 100%;
747 height: 6px;
748 background-color: #e6e6e6;
749 position: relative;
750 border-radius: 10px;
751 overflow: hidden;
752}
753
754.availability-bar .progress-bar > span {
755 display: inline-block;
756 position: absolute;
757 top: 0;
758 bottom: 0;
759 left: 0; /* rtl */
760 background-color: var(--ts-text-color);
761 border-radius: 10px;
762}
763
764.availability-status > span > span:first-child {
765 color: var(--ts-gray-color);
766}
767
768/*** Shortcode Deals ***/
769.woocommerce div.summary .counter-wrapper,
770.ts-product-deals-wrapper .counter-wrapper {
771 align-items: center;
772 justify-content: flex-start;
773 gap: 5px;
774}
775
776.woocommerce div.summary .counter-wrapper > div,
777.ts-product-deals-wrapper .counter-wrapper > div {
778 min-width: 0;
779}
780
781.ts-product-deals-wrapper .counter-wrapper > div,
782.woocommerce div.summary .counter-wrapper > span,
783.ts-product-deals-wrapper .counter-wrapper > span {
784 font-size: 16px;
785}
786
787.woocommerce div.summary .counter-wrapper > div {
788 font-size: 14px;
789}
790
791.woocommerce div.summary .counter-wrapper > span,
792.ts-product-deals-wrapper .counter-wrapper > span {
793 color: var(--ts-primary-color);
794}
795
796.woocommerce div.summary .counter-wrapper .number-wrapper,
797.ts-product-deals-wrapper .counter-wrapper .number-wrapper {
798 min-width: 45px;
799 min-height: 30px;
800 padding: 0 5px;
801 background: var(--ts-primary-color);
802 color: var(--ts-text-in-primary-color);
803 border-radius: var(--ts-border-radius);
804}
805
806.woocommerce div.summary .counter-wrapper .ref-wrapper,
807.ts-product-deals-wrapper .counter-wrapper .ref-wrapper {
808 display: none;
809}
810
811.ts-product-deals-wrapper .shortcode-heading-wrapper .counter-wrapper .number-wrapper {
812 min-width: 34px;
813 min-height: 34px;
814 border-radius: 50%;
815 background: var(--ts-text-color);
816 color: var(--ts-main-bg);
817}
818
819.ts-product-deals-wrapper .shortcode-heading-wrapper .counter-wrapper > span {
820 color: var(--ts-text-color);
821}
822
823
824/*-------------------------------------------------------------------------------------------------------------------
825 12. SHORTCODE COUPONS
826---------------------------------------------------------------------------------------------------------------------*/
827.coupon-code {
828 display: inline-flex;
829 align-items: center;
830 justify-content: center;
831 padding: 7px 15px 5px;
832 line-height: 1.2;
833 font-size: 0.86em;
834 font-weight: bold;
835 position: relative;
836 transition: 250ms ease 0s;
837 border: 1px dashed;
838 border-radius: var(--ts-border-radius);
839 text-transform: uppercase;
840}
841
842.coupon-code:hover {
843 cursor: pointer;
844 border-style: solid;
845}
846
847.coupon-code.loading .copy-message {
848 display: block;
849 transition: 150ms ease 0s;
850}
851
852.coupon-code .copy-message {
853 content: "";
854 display: inline-block;
855 vertical-align: middle;
856 display: none;
857}
858
859.coupon-code.loading > span:first-child {display: none;}
860
861
862.coupon-code.style-underline {
863 padding: 0;
864 border: 0;
865 border-radius: 0;
866}
867
868.coupon-code.style-underline:after {
869 content: '';
870 width: 100%;
871 height: 1px;
872 position: absolute;
873 bottom: 0;
874 left: 0;
875 right: 0;
876 border-bottom: 1px solid;
877 transition: 250ms ease;
878}
879
880.coupon-code.style-underline:hover:after {
881 border-bottom: 1px dashed;
882}
883
884
885/*-------------------------------------------------------------------------------------------------------------------
886 13. SHORTCODE SOCIAL
887---------------------------------------------------------------------------------------------------------------------*/
888.ts-social-icons-elementor-widget .list-items {
889 display: flex;
890 flex-wrap: wrap;
891 gap: 5px;
892}
893
894.ts-social-icons-elementor-widget .elementor-icon.elementor-social-icon {
895 width: auto;
896 height: auto;
897 font-size: inherit;
898 line-height: 1;
899 display: flex;
900 flex-wrap: wrap;
901 gap: 10px;
902}
903
904.ts-social-icons-elementor-widget .elementor-social-icon:hover {
905 opacity: 1;
906 color: var(--ts-primary-color);
907 text-decoration: none;
908}
909
910.ts-social-icons-elementor-widget .elementor-icon.elementor-social-icon i,
911.ts-social-icons-elementor-widget .elementor-icon.elementor-social-icon svg {
912 width: 1.8em;
913 height: 1.8em;
914 line-height: 1.8em;
915 display: inline-block;
916 box-sizing: content-box;
917 border-radius: 50%;
918 color: inherit;
919}
920
921.ts-social-icons-elementor-widget .elementor-icon.elementor-social-icon i:before {
922 position: static;
923 transform: none;
924 line-height: 1;
925}
926
927/**/
928.ts-social-icons-elementor-widget.style-vertical .list-items > span {width: 100%;}
929
930.ts-social-icons-elementor-widget.style-vertical .elementor-icon.elementor-social-icon {justify-content: flex-start;}
931
932
933/*-------------------------------------------------------------------------------------------------------------------
934 14. SHORTCODE FILTER BY TAXONOMIES
935---------------------------------------------------------------------------------------------------------------------*/
936.ts-product-filter-by-taxonomies .form-content select {max-width: 100%;}
937
938.ts-product-filter-by-taxonomies .form-content .button {text-transform: uppercase;line-height: 24px;}
939
940.style--row .ts-product-filter-by-taxonomies .form-content form > * {flex: 1 0 calc(20% - 20px);}
941
942.ts-product-filter-by-taxonomies .form-content form {
943 display: flex;
944 flex-wrap: wrap;
945 gap: 20px;
946 position: relative;
947}