@sc-360-v2/storefront-cms-library 0.3.29 → 0.3.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/animation-control.scss +23 -0
  2. package/dist/builder.js +1 -1
  3. package/dist/bulk-order-pad.scss +72 -7
  4. package/dist/cart-details.scss +570 -278
  5. package/dist/cart-summary.scss +102 -73
  6. package/dist/cartDropdownOverlay.scss +10 -5
  7. package/dist/checkout.scss +130 -77
  8. package/dist/contact-us.scss +3 -0
  9. package/dist/dropdownTemplate.scss +13 -2
  10. package/dist/fb-dropdown.scss +6 -2
  11. package/dist/form-preview.scss +24 -1
  12. package/dist/form-zindex-module.scss +25 -0
  13. package/dist/functions.scss +72 -2
  14. package/dist/icons.js +1 -1
  15. package/dist/index.js +1 -1
  16. package/dist/light-box-v2.scss +1 -1
  17. package/dist/modal.scss +60 -33
  18. package/dist/position-module.scss +74 -0
  19. package/dist/prefix-list.scss +55 -0
  20. package/dist/quick-order-pad.scss +36 -8
  21. package/dist/responsive-behaviour.scss +21 -0
  22. package/dist/section.scss +13 -9
  23. package/dist/shareCartSideBar.scss +4 -2
  24. package/dist/submit-quote.scss +107 -49
  25. package/dist/types/builder/interfaces/global.d.ts +13 -0
  26. package/dist/types/builder/tools/element-edit/amountEstimator.d.ts +441 -0
  27. package/dist/types/builder/tools/element-edit/buttonInstance.d.ts +364 -0
  28. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +2 -2
  29. package/dist/types/builder/tools/element-edit/common.d.ts +1 -0
  30. package/dist/types/builder/tools/element-edit/countdown.d.ts +384 -44
  31. package/dist/types/builder/tools/element-edit/dummy.d.ts +0 -0
  32. package/dist/types/builder/tools/element-edit/productActions.d.ts +390 -43
  33. package/dist/types/builder/tools/element-edit/quickLinks.d.ts +192 -22
  34. package/dist/types/builder/tools/element-edit/repeater.d.ts +439 -1
  35. package/dist/types/builder/tools/element-edit/table.d.ts +0 -1
  36. package/dist/types/builder/tools/element-edit/typographyInstance.d.ts +981 -0
  37. package/dist/types/builder/tools/element-edit/video.d.ts +192 -22
  38. package/dist/types/global/types.d.ts +2 -0
  39. package/package.json +1 -1
package/dist/cart-details.scss CHANGED
@@ -41,12 +41,36 @@ $resizeActive: '[data-cms-element-resizer="true"]';
41
41
  flex: 1 0 0;
42
42
  max-width: 100%;
43
43
 
44
- .car_group_item {
44
+ .cart_group_item {
45
45
  width: 100%;
46
- .group_name {
47
- font-size: 20px;
48
- color: #101828;
49
- font-weight: 700;
46
+
47
+ .cart_group_title {
48
+ display: flex;
49
+ align-items: center;
50
+ cursor: pointer;
51
+ margin-bottom: 16px;
52
+ h4 {
53
+ font-size: 20px;
54
+ color: var(--_gray-900);
55
+ font-weight: 700;
56
+ margin-right: 8px;
57
+ .cart_items_length {
58
+ font-size: 14px;
59
+ color: var(--_gray-600);
60
+ margin-left: 4px;
61
+ }
62
+ }
63
+ .toggle_btn {
64
+ display: flex;
65
+ margin-right: 8px;
66
+ svg {
67
+ width: 24px;
68
+ height: 24px;
69
+ path {
70
+ stroke: var(--_gray-600);
71
+ }
72
+ }
73
+ }
50
74
  }
51
75
  .attr_header {
52
76
  display: flex;
@@ -449,24 +473,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
449
473
  background-repeat: no-repeat;
450
474
  background-position: center;
451
475
  background-color: #eaeaea;
452
-
453
- border-style: var(
454
- --_ctm-mob-dn-pt-ie-ss-br-se,
455
- var(--_ctm-tab-dn-pt-ie-ss-br-se, var(--_ctm-dn-pt-ie-ss-br-se))
456
- );
457
- border-width: var(
458
- --_ctm-mob-dn-pt-ie-ss-br-wh,
459
- var(--_ctm-tab-dn-pt-ie-ss-br-wh, var(--_ctm-dn-pt-ie-ss-br-wh))
460
- );
461
- // border: ;
462
- border-radius: var(
463
- --_ctm-mob-dn-pt-ie-ss-br-rs,
464
- var(--_ctm-tab-dn-pt-ie-ss-br-rs, var(--_ctm-dn-pt-ie-ss-br-rs))
465
- );
466
- border-color: var(
467
- --_ctm-mob-dn-pt-ie-ss-br-cr,
468
- var(--_ctm-tab-dn-pt-ie-ss-br-cr, var(--_ctm-dn-pt-ie-ss-br-cr))
469
- );
476
+ border: 1px solid var(--_gray-100);
477
+ border-radius: 4px;
470
478
  }
471
479
 
472
480
  .product_info_wrapper {
@@ -486,51 +494,11 @@ $resizeActive: '[data-cms-element-resizer="true"]';
486
494
  word-break: normal;
487
495
 
488
496
  .product_title {
489
- // color: var(--_ctm-dn-pt-ne-ss-cr);
490
- // font-size: var(--_ctm-dn-pt-ne-ss-ft-se);
491
- // font-weight: 700;
492
- // align-self: stretch;
493
- // line-height: 28px;
494
- // font-family: var(--_ctm-dn-pt-ne-ss-ft-fy);
495
- color: var(
496
- --_ctm-mob-dn-pt-ne-ss-cr,
497
- var(--_ctm-tab-dn-pt-ne-ss-cr, var(--_ctm-dn-pt-ne-ss-cr))
498
- );
499
- font-family: var(
500
- --_sf-hr-ff,
501
- var(
502
- --_ctm-mob-dn-pt-ne-ss-ft-fy,
503
- var(--_ctm-tab-dn-pt-ne-ss-ft-fy, var(--_ctm-dn-pt-ne-ss-ft-fy))
504
- )
505
- );
506
- font-size: var(
507
- --_ctm-mob-dn-pt-ne-ss-ft-se,
508
- var(--_ctm-tab-dn-pt-ne-ss-ft-se, var(--_ctm-dn-pt-ne-ss-ft-se))
509
- );
510
- font-weight: var(
511
- --_ctm-mob-dn-pt-ne-ss-ft-wt,
512
- var(--_ctm-tab-dn-pt-ne-ss-ft-wt, var(--_ctm-dn-pt-ne-ss-ft-wt))
513
- );
514
- font-style: var(
515
- --_ctm-mob-dn-pt-ne-ss-ft-se-ic,
516
- var(--_ctm-tab-dn-pt-ne-ss-ft-se-ic, var(--_ctm-dn-pt-ne-ss-ft-se-ic))
517
- );
518
- text-align: var(
519
- --_ctm-mob-dn-pt-ne-ss-tt-an,
520
- var(--_ctm-tab-dn-pt-ne-ss-tt-an, var(--_ctm-dn-pt-ne-ss-tt-an))
521
- );
522
- letter-spacing: var(
523
- --_ctm-mob-dn-pt-ne-ss-lr-sg,
524
- var(--_ctm-tab-dn-pt-ne-ss-lr-sg, var(--_ctm-dn-pt-ne-ss-lr-sg))
525
- );
526
- line-height: var(
527
- --_ctm-mob-dn-pt-ne-ss-le-ht,
528
- var(--_ctm-tab-dn-pt-ne-ss-le-ht, var(--_ctm-dn-pt-ne-ss-le-ht))
529
- );
530
- text-decoration: var(
531
- --_ctm-mob-dn-pt-ne-ss-ue,
532
- var(--_ctm-tab-dn-pt-ne-ss-ue, var(--_ctm-dn-pt-ne-ss-ue))
533
- );
497
+ color: var(--_gray-900);
498
+ font-family: lato;
499
+ font-size: 18px;
500
+ font-weight: 700;
501
+ line-height: 28px;
534
502
  }
535
503
 
536
504
  .product_code {
@@ -539,53 +507,24 @@ $resizeActive: '[data-cms-element-resizer="true"]';
539
507
  gap: 6px;
540
508
  align-self: stretch;
541
509
  flex-wrap: wrap;
542
- background-color: var(--_ctm-dn-pt-in-ss-bd-cr);
543
510
 
544
- p {
545
- // color: #475467;
546
- // font-size: 14px;
547
- // font-weight: 400;
548
- // line-height: 20px;
511
+ span {
512
+ color: var(--_gray-600);
513
+ font-size: 14px;
514
+ font-weight: 400;
515
+ line-height: 20px;
549
516
  white-space: nowrap;
550
- color: var(
551
- --_ctm-mob-dn-pt-in-ss-cr,
552
- var(--_ctm-tab-dn-pt-in-ss-cr, var(--_ctm-dn-pt-in-ss-cr))
553
- );
554
- font-family: var(
555
- --_sf-hr-ff,
556
- var(
557
- --_ctm-mob-dn-pt-in-ss-ft-fy,
558
- var(--_ctm-tab-dn-pt-in-ss-ft-fy, var(--_ctm-dn-pt-in-ss-ft-fy))
559
- )
560
- );
561
- font-size: var(
562
- --_ctm-mob-dn-pt-in-ss-ft-se,
563
- var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
564
- );
565
- font-weight: var(
566
- --_ctm-mob-dn-pt-in-ss-ft-wt,
567
- var(--_ctm-tab-dn-pt-in-ss-ft-wt, var(--_ctm-dn-pt-in-ss-ft-wt))
568
- );
569
- font-style: var(
570
- --_ctm-mob-dn-pt-in-ss-ft-se-ic,
571
- var(--_ctm-tab-dn-pt-in-ss-ft-se-ic, var(--_ctm-dn-pt-in-ss-ft-se-ic))
572
- );
573
- text-align: var(
574
- --_ctm-mob-dn-pt-in-ss-tt-an,
575
- var(--_ctm-tab-dn-pt-in-ss-tt-an, var(--_ctm-dn-pt-in-ss-tt-an))
576
- );
577
- letter-spacing: var(
578
- --_ctm-mob-dn-pt-in-ss-lr-sg,
579
- var(--_ctm-tab-dn-pt-in-ss-lr-sg, var(--_ctm-dn-pt-in-ss-lr-sg))
580
- );
581
- line-height: var(
582
- --_ctm-mob-dn-pt-in-ss-le-ht,
583
- var(--_ctm-tab-dn-pt-in-ss-le-ht, var(--_ctm-dn-pt-in-ss-le-ht))
584
- );
585
- text-decoration: var(
586
- --_ctm-mob-dn-pt-in-ss-ue,
587
- var(--_ctm-tab-dn-pt-in-ss-ue, var(--_ctm-dn-pt-in-ss-ue))
588
- );
517
+ &::after {
518
+ content: "";
519
+ display: inline-block;
520
+ height: 10px;
521
+ border-right: 1px solid var(--_gray-600);
522
+ padding-right: 8px;
523
+ }
524
+
525
+ &:last-of-type::after {
526
+ border-right: 0;
527
+ }
589
528
  }
590
529
  }
591
530
 
@@ -595,48 +534,19 @@ $resizeActive: '[data-cms-element-resizer="true"]';
595
534
  gap: 4px;
596
535
  align-self: stretch;
597
536
  flex-wrap: wrap;
598
- background-color: var(--_ctm-dn-pt-in-ss-bd-cr);
599
- p {
537
+ span {
600
538
  white-space: nowrap;
601
- color: var(
602
- --_ctm-mob-dn-pt-in-ss-cr,
603
- var(--_ctm-tab-dn-pt-in-ss-cr, var(--_ctm-dn-pt-in-ss-cr))
604
- );
605
- font-family: var(
606
- --_sf-hr-ff,
607
- var(
608
- --_ctm-mob-dn-pt-in-ss-ft-fy,
609
- var(--_ctm-tab-dn-pt-in-ss-ft-fy, var(--_ctm-dn-pt-in-ss-ft-fy))
610
- )
611
- );
612
- font-size: var(
613
- --_ctm-mob-dn-pt-in-ss-ft-se,
614
- var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
615
- );
616
- font-weight: var(
617
- --_ctm-mob-dn-pt-in-ss-ft-wt,
618
- var(--_ctm-tab-dn-pt-in-ss-ft-wt, var(--_ctm-dn-pt-in-ss-ft-wt))
619
- );
620
- font-style: var(
621
- --_ctm-mob-dn-pt-in-ss-ft-se-ic,
622
- var(--_ctm-tab-dn-pt-in-ss-ft-se-ic, var(--_ctm-dn-pt-in-ss-ft-se-ic))
623
- );
624
- text-align: var(
625
- --_ctm-mob-dn-pt-in-ss-tt-an,
626
- var(--_ctm-tab-dn-pt-in-ss-tt-an, var(--_ctm-dn-pt-in-ss-tt-an))
627
- );
628
- letter-spacing: var(
629
- --_ctm-mob-dn-pt-in-ss-lr-sg,
630
- var(--_ctm-tab-dn-pt-in-ss-lr-sg, var(--_ctm-dn-pt-in-ss-lr-sg))
631
- );
632
- line-height: var(
633
- --_ctm-mob-dn-pt-in-ss-le-ht,
634
- var(--_ctm-tab-dn-pt-in-ss-le-ht, var(--_ctm-dn-pt-in-ss-le-ht))
635
- );
636
- text-decoration: var(
637
- --_ctm-mob-dn-pt-in-ss-ue,
638
- var(--_ctm-tab-dn-pt-in-ss-ue, var(--_ctm-dn-pt-in-ss-ue))
639
- );
539
+ font-size: 14px;
540
+ font-weight: 400;
541
+ color: var(--_gray-600);
542
+ line-height: 20px;
543
+ &::after {
544
+ content: "/";
545
+ padding-left: 4px;
546
+ }
547
+ &:last-of-type::after {
548
+ content: "";
549
+ }
640
550
  }
641
551
  }
642
552
  }
@@ -651,56 +561,23 @@ $resizeActive: '[data-cms-element-resizer="true"]';
651
561
  display: flex;
652
562
  justify-content: center;
653
563
  align-items: center;
654
- gap: 8px;
564
+ gap: 4px;
655
565
  white-space: nowrap;
656
- // color: #243dc6;
657
- // font-size: 14px;
658
- // font-weight: 400;
659
- // line-height: 20px;
660
- // color: prepareMediaVariable(--_ctm-dn-pt-as-ss-cr);
661
- color: var(
662
- --_ctm-mob-dn-pt-as-ss-cr,
663
- var(--_ctm-tab-dn-pt-as-ss-cr, var(--_ctm-dn-pt-as-ss-cr))
664
- );
665
- font-family: var(
666
- --_sf-hr-ff,
667
- var(
668
- --_ctm-mob-dn-pt-as-ss-ft-fy,
669
- var(--_ctm-tab-dn-pt-as-ss-ft-fy, var(--_ctm-dn-pt-as-ss-ft-fy))
670
- )
671
- );
672
- font-size: var(
673
- --_ctm-mob-dn-pt-as-ss-ft-se,
674
- var(--_ctm-tab-dn-pt-as-ss-ft-se, var(--_ctm-dn-pt-as-ss-ft-se))
675
- );
676
- font-weight: var(
677
- --_ctm-mob-dn-pt-as-ss-ft-wt,
678
- var(--_ctm-tab-dn-pt-as-ss-ft-wt, var(--_ctm-dn-pt-as-ss-ft-wt))
679
- );
680
- font-style: var(
681
- --_ctm-mob-dn-pt-as-ss-ft-se-ic,
682
- var(--_ctm-tab-dn-pt-as-ss-ft-se-ic, var(--_ctm-dn-pt-as-ss-ft-se-ic))
683
- );
684
- text-align: var(
685
- --_ctm-mob-dn-pt-as-ss-tt-an,
686
- var(--_ctm-tab-dn-pt-as-ss-tt-an, var(--_ctm-dn-pt-as-ss-tt-an))
687
- );
688
- letter-spacing: var(
689
- --_ctm-mob-dn-pt-as-ss-lr-sg,
690
- var(--_ctm-tab-dn-pt-as-ss-lr-sg, var(--_ctm-dn-pt-as-ss-lr-sg))
691
- );
692
- line-height: var(
693
- --_ctm-mob-dn-pt-as-ss-le-ht,
694
- var(--_ctm-tab-dn-pt-as-ss-le-ht, var(--_ctm-dn-pt-as-ss-le-ht))
695
- );
696
- text-decoration: var(
697
- --_ctm-mob-dn-pt-as-ss-ue,
698
- var(--_ctm-tab-dn-pt-as-ss-ue, var(--_ctm-dn-pt-as-ss-ue))
699
- );
700
-
701
- // &:hover {
702
- // font-weight: 600;
703
- // }
566
+ color: var(--_primary-400);
567
+ font-size: 14px;
568
+ font-weight: 400;
569
+ line-height: 20px;
570
+ .attr_val_info_detail{
571
+ b{
572
+ margin-right: 4px;
573
+ }
574
+ }
575
+ }
576
+ .svg_icon svg{
577
+ vertical-align: middle;
578
+ }
579
+ .svg_icon.down svg {
580
+ transform: rotate(180deg);
704
581
  }
705
582
  .customizationInfo_button {
706
583
  display: flex;
@@ -811,51 +688,12 @@ $resizeActive: '[data-cms-element-resizer="true"]';
811
688
  }
812
689
 
813
690
  .product_price {
814
- // color: #101828;
815
- // text-align: right;
816
- // font-size: 20px;
817
- // font-weight: 700;
818
- // line-height: 30px;
691
+ color: var(--_gray-900);
692
+ text-align: right;
693
+ font-size: 20px;
694
+ font-weight: 700;
695
+ line-height: 30px;
819
696
  white-space: nowrap;
820
- color: var(
821
- --_ctm-mob-dn-pt-pe-ss-cr,
822
- var(--_ctm-tab-dn-pt-pe-ss-cr, var(--_ctm-dn-pt-pe-ss-cr))
823
- );
824
- font-family: var(
825
- --_sf-hr-ff,
826
- var(
827
- --_ctm-mob-dn-pt-pe-ss-ft-fy,
828
- var(--_ctm-tab-dn-pt-pe-ss-ft-fy, var(--_ctm-dn-pt-pe-ss-ft-fy))
829
- )
830
- );
831
- font-size: var(
832
- --_ctm-mob-dn-pt-pe-ss-ft-se,
833
- var(--_ctm-tab-dn-pt-pe-ss-ft-se, var(--_ctm-dn-pt-pe-ss-ft-se))
834
- );
835
- font-weight: var(
836
- --_ctm-mob-dn-pt-pe-ss-ft-wt,
837
- var(--_ctm-tab-dn-pt-pe-ss-ft-wt, var(--_ctm-dn-pt-pe-ss-ft-wt))
838
- );
839
- font-style: var(
840
- --_ctm-mob-dn-pt-pe-ss-ft-se-ic,
841
- var(--_ctm-tab-dn-pt-pe-ss-ft-se-ic, var(--_ctm-dn-pt-pe-ss-ft-se-ic))
842
- );
843
- text-align: var(
844
- --_ctm-mob-dn-pt-pe-ss-tt-an,
845
- var(--_ctm-tab-dn-pt-pe-ss-tt-an, var(--_ctm-dn-pt-pe-ss-tt-an))
846
- );
847
- letter-spacing: var(
848
- --_ctm-mob-dn-pt-pe-ss-lr-sg,
849
- var(--_ctm-tab-dn-pt-pe-ss-lr-sg, var(--_ctm-dn-pt-pe-ss-lr-sg))
850
- );
851
- line-height: var(
852
- --_ctm-mob-dn-pt-pe-ss-le-ht,
853
- var(--_ctm-tab-dn-pt-pe-ss-le-ht, var(--_ctm-dn-pt-pe-ss-le-ht))
854
- );
855
- text-decoration: var(
856
- --_ctm-mob-dn-pt-pe-ss-ue,
857
- var(--_ctm-tab-dn-pt-pe-ss-ue, var(--_ctm-dn-pt-pe-ss-ue))
858
- );
859
697
  min-width: 80px;
860
698
  }
861
699
  }
@@ -868,46 +706,500 @@ $resizeActive: '[data-cms-element-resizer="true"]';
868
706
  display: flex;
869
707
  justify-content: center;
870
708
  align-items: center;
871
-
872
- // &:last-child svg {
873
- // width: 16px;
874
- // height: 16px;
875
- // path {
876
- // stroke: #dc2626;
877
- // }
878
- // }
879
709
  }
880
710
  .product_action_button {
881
711
  display: flex;
882
712
  justify-content: center;
883
713
  align-items: center;
884
714
  gap: 8px;
885
- // color: #243dc6;
886
- // font-size: 14px;
887
- // font-weight: 400;
888
- // line-height: 20px;
889
-
890
- // &:hover {
891
- // font-weight: 600;
892
- // }
893
715
  }
894
-
895
- // .remove_button {
896
- // display: flex;
897
- // justify-content: center;
898
- // align-items: center;
899
- // color: #dc2626;
900
- // font-size: 14px;
901
- // font-weight: 400;
902
- // line-height: 20px;
903
- // white-space: nowrap;
904
- // // &:hover {
905
- // // font-weight: 600;
906
- // // }
907
- // }
908
716
  }
909
717
  }
910
718
  }
719
+ // .cart_product_wrapper {
720
+ // display: flex;
721
+ // justify-content: space-between;
722
+ // align-items: flex-start;
723
+ // align-self: stretch;
724
+ // height: auto;
725
+ // // flex-wrap: wrap;
726
+
727
+ // .cart_product_left_wrapper {
728
+ // display: flex;
729
+ // align-items: flex-start;
730
+ // gap: 16px;
731
+ // // max-width: 60%;
732
+ // height: 100%;
733
+ // .checkbox_wrapper {
734
+ // width: fit-content;
735
+ // }
736
+
737
+ // .product_image {
738
+ // width: 100px;
739
+ // background-size: 100%;
740
+ // height: 148px;
741
+ // background-repeat: no-repeat;
742
+ // background-position: center;
743
+ // background-color: #eaeaea;
744
+
745
+ // border-style: var(
746
+ // --_ctm-mob-dn-pt-ie-ss-br-se,
747
+ // var(--_ctm-tab-dn-pt-ie-ss-br-se, var(--_ctm-dn-pt-ie-ss-br-se))
748
+ // );
749
+ // border-width: var(
750
+ // --_ctm-mob-dn-pt-ie-ss-br-wh,
751
+ // var(--_ctm-tab-dn-pt-ie-ss-br-wh, var(--_ctm-dn-pt-ie-ss-br-wh))
752
+ // );
753
+ // // border: ;
754
+ // border-radius: var(
755
+ // --_ctm-mob-dn-pt-ie-ss-br-rs,
756
+ // var(--_ctm-tab-dn-pt-ie-ss-br-rs, var(--_ctm-dn-pt-ie-ss-br-rs))
757
+ // );
758
+ // border-color: var(
759
+ // --_ctm-mob-dn-pt-ie-ss-br-cr,
760
+ // var(--_ctm-tab-dn-pt-ie-ss-br-cr, var(--_ctm-dn-pt-ie-ss-br-cr))
761
+ // );
762
+ // }
763
+
764
+ // .product_info_wrapper {
765
+ // display: flex;
766
+ // width: 380px;
767
+ // flex-direction: column;
768
+ // justify-content: space-between;
769
+ // align-items: flex-start;
770
+ // align-self: stretch;
771
+
772
+ // .product_info_container {
773
+ // display: flex;
774
+ // flex-direction: column;
775
+ // align-items: flex-start;
776
+ // gap: 2px;
777
+ // align-self: stretch;
778
+ // word-break: normal;
779
+
780
+ // .product_title {
781
+ // // color: var(--_ctm-dn-pt-ne-ss-cr);
782
+ // // font-size: var(--_ctm-dn-pt-ne-ss-ft-se);
783
+ // // font-weight: 700;
784
+ // // align-self: stretch;
785
+ // // line-height: 28px;
786
+ // // font-family: var(--_ctm-dn-pt-ne-ss-ft-fy);
787
+ // color: var(
788
+ // --_ctm-mob-dn-pt-ne-ss-cr,
789
+ // var(--_ctm-tab-dn-pt-ne-ss-cr, var(--_ctm-dn-pt-ne-ss-cr))
790
+ // );
791
+ // font-family: var(
792
+ // --_sf-hr-ff,
793
+ // var(
794
+ // --_ctm-mob-dn-pt-ne-ss-ft-fy,
795
+ // var(--_ctm-tab-dn-pt-ne-ss-ft-fy, var(--_ctm-dn-pt-ne-ss-ft-fy))
796
+ // )
797
+ // );
798
+ // font-size: var(
799
+ // --_ctm-mob-dn-pt-ne-ss-ft-se,
800
+ // var(--_ctm-tab-dn-pt-ne-ss-ft-se, var(--_ctm-dn-pt-ne-ss-ft-se))
801
+ // );
802
+ // font-weight: var(
803
+ // --_ctm-mob-dn-pt-ne-ss-ft-wt,
804
+ // var(--_ctm-tab-dn-pt-ne-ss-ft-wt, var(--_ctm-dn-pt-ne-ss-ft-wt))
805
+ // );
806
+ // font-style: var(
807
+ // --_ctm-mob-dn-pt-ne-ss-ft-se-ic,
808
+ // var(--_ctm-tab-dn-pt-ne-ss-ft-se-ic, var(--_ctm-dn-pt-ne-ss-ft-se-ic))
809
+ // );
810
+ // text-align: var(
811
+ // --_ctm-mob-dn-pt-ne-ss-tt-an,
812
+ // var(--_ctm-tab-dn-pt-ne-ss-tt-an, var(--_ctm-dn-pt-ne-ss-tt-an))
813
+ // );
814
+ // letter-spacing: var(
815
+ // --_ctm-mob-dn-pt-ne-ss-lr-sg,
816
+ // var(--_ctm-tab-dn-pt-ne-ss-lr-sg, var(--_ctm-dn-pt-ne-ss-lr-sg))
817
+ // );
818
+ // line-height: var(
819
+ // --_ctm-mob-dn-pt-ne-ss-le-ht,
820
+ // var(--_ctm-tab-dn-pt-ne-ss-le-ht, var(--_ctm-dn-pt-ne-ss-le-ht))
821
+ // );
822
+ // text-decoration: var(
823
+ // --_ctm-mob-dn-pt-ne-ss-ue,
824
+ // var(--_ctm-tab-dn-pt-ne-ss-ue, var(--_ctm-dn-pt-ne-ss-ue))
825
+ // );
826
+ // }
827
+
828
+ // .product_code {
829
+ // display: flex;
830
+ // align-items: center;
831
+ // gap: 6px;
832
+ // align-self: stretch;
833
+ // flex-wrap: wrap;
834
+ // background-color: var(--_ctm-dn-pt-in-ss-bd-cr);
835
+
836
+ // p {
837
+ // // color: #475467;
838
+ // // font-size: 14px;
839
+ // // font-weight: 400;
840
+ // // line-height: 20px;
841
+ // white-space: nowrap;
842
+ // color: var(
843
+ // --_ctm-mob-dn-pt-in-ss-cr,
844
+ // var(--_ctm-tab-dn-pt-in-ss-cr, var(--_ctm-dn-pt-in-ss-cr))
845
+ // );
846
+ // font-family: var(
847
+ // --_sf-hr-ff,
848
+ // var(
849
+ // --_ctm-mob-dn-pt-in-ss-ft-fy,
850
+ // var(--_ctm-tab-dn-pt-in-ss-ft-fy, var(--_ctm-dn-pt-in-ss-ft-fy))
851
+ // )
852
+ // );
853
+ // font-size: var(
854
+ // --_ctm-mob-dn-pt-in-ss-ft-se,
855
+ // var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
856
+ // );
857
+ // font-weight: var(
858
+ // --_ctm-mob-dn-pt-in-ss-ft-wt,
859
+ // var(--_ctm-tab-dn-pt-in-ss-ft-wt, var(--_ctm-dn-pt-in-ss-ft-wt))
860
+ // );
861
+ // font-style: var(
862
+ // --_ctm-mob-dn-pt-in-ss-ft-se-ic,
863
+ // var(--_ctm-tab-dn-pt-in-ss-ft-se-ic, var(--_ctm-dn-pt-in-ss-ft-se-ic))
864
+ // );
865
+ // text-align: var(
866
+ // --_ctm-mob-dn-pt-in-ss-tt-an,
867
+ // var(--_ctm-tab-dn-pt-in-ss-tt-an, var(--_ctm-dn-pt-in-ss-tt-an))
868
+ // );
869
+ // letter-spacing: var(
870
+ // --_ctm-mob-dn-pt-in-ss-lr-sg,
871
+ // var(--_ctm-tab-dn-pt-in-ss-lr-sg, var(--_ctm-dn-pt-in-ss-lr-sg))
872
+ // );
873
+ // line-height: var(
874
+ // --_ctm-mob-dn-pt-in-ss-le-ht,
875
+ // var(--_ctm-tab-dn-pt-in-ss-le-ht, var(--_ctm-dn-pt-in-ss-le-ht))
876
+ // );
877
+ // text-decoration: var(
878
+ // --_ctm-mob-dn-pt-in-ss-ue,
879
+ // var(--_ctm-tab-dn-pt-in-ss-ue, var(--_ctm-dn-pt-in-ss-ue))
880
+ // );
881
+ // }
882
+ // }
883
+
884
+ // .product_options {
885
+ // display: flex;
886
+ // align-items: center;
887
+ // gap: 4px;
888
+ // align-self: stretch;
889
+ // flex-wrap: wrap;
890
+ // background-color: var(--_ctm-dn-pt-in-ss-bd-cr);
891
+ // p {
892
+ // white-space: nowrap;
893
+ // color: var(
894
+ // --_ctm-mob-dn-pt-in-ss-cr,
895
+ // var(--_ctm-tab-dn-pt-in-ss-cr, var(--_ctm-dn-pt-in-ss-cr))
896
+ // );
897
+ // font-family: var(
898
+ // --_sf-hr-ff,
899
+ // var(
900
+ // --_ctm-mob-dn-pt-in-ss-ft-fy,
901
+ // var(--_ctm-tab-dn-pt-in-ss-ft-fy, var(--_ctm-dn-pt-in-ss-ft-fy))
902
+ // )
903
+ // );
904
+ // font-size: var(
905
+ // --_ctm-mob-dn-pt-in-ss-ft-se,
906
+ // var(--_ctm-tab-dn-pt-in-ss-ft-se, var(--_ctm-dn-pt-in-ss-ft-se))
907
+ // );
908
+ // font-weight: var(
909
+ // --_ctm-mob-dn-pt-in-ss-ft-wt,
910
+ // var(--_ctm-tab-dn-pt-in-ss-ft-wt, var(--_ctm-dn-pt-in-ss-ft-wt))
911
+ // );
912
+ // font-style: var(
913
+ // --_ctm-mob-dn-pt-in-ss-ft-se-ic,
914
+ // var(--_ctm-tab-dn-pt-in-ss-ft-se-ic, var(--_ctm-dn-pt-in-ss-ft-se-ic))
915
+ // );
916
+ // text-align: var(
917
+ // --_ctm-mob-dn-pt-in-ss-tt-an,
918
+ // var(--_ctm-tab-dn-pt-in-ss-tt-an, var(--_ctm-dn-pt-in-ss-tt-an))
919
+ // );
920
+ // letter-spacing: var(
921
+ // --_ctm-mob-dn-pt-in-ss-lr-sg,
922
+ // var(--_ctm-tab-dn-pt-in-ss-lr-sg, var(--_ctm-dn-pt-in-ss-lr-sg))
923
+ // );
924
+ // line-height: var(
925
+ // --_ctm-mob-dn-pt-in-ss-le-ht,
926
+ // var(--_ctm-tab-dn-pt-in-ss-le-ht, var(--_ctm-dn-pt-in-ss-le-ht))
927
+ // );
928
+ // text-decoration: var(
929
+ // --_ctm-mob-dn-pt-in-ss-ue,
930
+ // var(--_ctm-tab-dn-pt-in-ss-ue, var(--_ctm-dn-pt-in-ss-ue))
931
+ // );
932
+ // }
933
+ // }
934
+ // }
935
+
936
+ // .product_customization_container {
937
+ // display: flex;
938
+ // align-items: center;
939
+ // gap: 8px;
940
+ // min-height: 28px;
941
+
942
+ // .customization_button {
943
+ // display: flex;
944
+ // justify-content: center;
945
+ // align-items: center;
946
+ // gap: 8px;
947
+ // white-space: nowrap;
948
+ // // color: #243dc6;
949
+ // // font-size: 14px;
950
+ // // font-weight: 400;
951
+ // // line-height: 20px;
952
+ // // color: prepareMediaVariable(--_ctm-dn-pt-as-ss-cr);
953
+ // color: var(
954
+ // --_ctm-mob-dn-pt-as-ss-cr,
955
+ // var(--_ctm-tab-dn-pt-as-ss-cr, var(--_ctm-dn-pt-as-ss-cr))
956
+ // );
957
+ // font-family: var(
958
+ // --_sf-hr-ff,
959
+ // var(
960
+ // --_ctm-mob-dn-pt-as-ss-ft-fy,
961
+ // var(--_ctm-tab-dn-pt-as-ss-ft-fy, var(--_ctm-dn-pt-as-ss-ft-fy))
962
+ // )
963
+ // );
964
+ // font-size: var(
965
+ // --_ctm-mob-dn-pt-as-ss-ft-se,
966
+ // var(--_ctm-tab-dn-pt-as-ss-ft-se, var(--_ctm-dn-pt-as-ss-ft-se))
967
+ // );
968
+ // font-weight: var(
969
+ // --_ctm-mob-dn-pt-as-ss-ft-wt,
970
+ // var(--_ctm-tab-dn-pt-as-ss-ft-wt, var(--_ctm-dn-pt-as-ss-ft-wt))
971
+ // );
972
+ // font-style: var(
973
+ // --_ctm-mob-dn-pt-as-ss-ft-se-ic,
974
+ // var(--_ctm-tab-dn-pt-as-ss-ft-se-ic, var(--_ctm-dn-pt-as-ss-ft-se-ic))
975
+ // );
976
+ // text-align: var(
977
+ // --_ctm-mob-dn-pt-as-ss-tt-an,
978
+ // var(--_ctm-tab-dn-pt-as-ss-tt-an, var(--_ctm-dn-pt-as-ss-tt-an))
979
+ // );
980
+ // letter-spacing: var(
981
+ // --_ctm-mob-dn-pt-as-ss-lr-sg,
982
+ // var(--_ctm-tab-dn-pt-as-ss-lr-sg, var(--_ctm-dn-pt-as-ss-lr-sg))
983
+ // );
984
+ // line-height: var(
985
+ // --_ctm-mob-dn-pt-as-ss-le-ht,
986
+ // var(--_ctm-tab-dn-pt-as-ss-le-ht, var(--_ctm-dn-pt-as-ss-le-ht))
987
+ // );
988
+ // text-decoration: var(
989
+ // --_ctm-mob-dn-pt-as-ss-ue,
990
+ // var(--_ctm-tab-dn-pt-as-ss-ue, var(--_ctm-dn-pt-as-ss-ue))
991
+ // );
992
+
993
+ // // &:hover {
994
+ // // font-weight: 600;
995
+ // // }
996
+ // }
997
+ // .customizationInfo_button {
998
+ // display: flex;
999
+ // justify-content: center;
1000
+ // align-items: center;
1001
+ // gap: 8px;
1002
+ // white-space: nowrap;
1003
+ // color: var(
1004
+ // --_ctm-mob-dn-pt-rd-io-cr,
1005
+ // var(--_ctm-tab-dn-pt-rd-io-cr, var(--_ctm-dn-pt-rd-io-cr))
1006
+ // );
1007
+ // font-family: var(
1008
+ // --_sf-hr-ff,
1009
+ // var(
1010
+ // --_ctm-mob-dn-pt-rd-io-ft-fy,
1011
+ // var(--_ctm-tab-dn-pt-rd-io-ft-fy, var(--_ctm-dn-pt-rd-io-ft-fy))
1012
+ // )
1013
+ // );
1014
+ // font-size: var(
1015
+ // --_ctm-mob-dn-pt-rd-io-ft-se,
1016
+ // var(--_ctm-tab-dn-pt-rd-io-ft-se, var(--_ctm-dn-pt-rd-io-ft-se))
1017
+ // );
1018
+ // font-weight: var(
1019
+ // --_ctm-mob-dn-pt-rd-io-ft-wt,
1020
+ // var(--_ctm-tab-dn-pt-rd-io-ft-wt, var(--_ctm-dn-pt-rd-io-ft-wt))
1021
+ // );
1022
+ // font-style: var(
1023
+ // --_ctm-mob-dn-pt-rd-io-ft-se-ic,
1024
+ // var(--_ctm-tab-dn-pt-rd-io-ft-se-ic, var(--_ctm-dn-pt-rd-io-ft-se-ic))
1025
+ // );
1026
+ // text-align: var(
1027
+ // --_ctm-mob-dn-pt-rd-io-tt-an,
1028
+ // var(--_ctm-tab-dn-pt-rd-io-tt-an, var(--_ctm-dn-pt-rd-io-tt-an))
1029
+ // );
1030
+ // letter-spacing: var(
1031
+ // --_ctm-mob-dn-pt-rd-io-lr-sg,
1032
+ // var(--_ctm-tab-dn-pt-rd-io-lr-sg, var(--_ctm-dn-pt-rd-io-lr-sg))
1033
+ // );
1034
+ // line-height: var(
1035
+ // --_ctm-mob-dn-pt-rd-io-le-ht,
1036
+ // var(--_ctm-tab-dn-pt-rd-io-le-ht, var(--_ctm-dn-pt-rd-io-le-ht))
1037
+ // );
1038
+ // text-decoration: var(
1039
+ // --_ctm-mob-dn-pt-qy-ss-ue,
1040
+ // var(--_ctm-tab-dn-pt-qy-ss-ue, var(--_ctm-dn-pt-qy-ss-ue))
1041
+ // );
1042
+ // }
1043
+ // }
1044
+ // }
1045
+ // }
1046
+
1047
+ // .cart_product_right_wrapper {
1048
+ // display: flex;
1049
+ // flex-direction: column;
1050
+ // justify-content: space-between;
1051
+ // align-items: flex-end;
1052
+ // align-self: stretch;
1053
+
1054
+ // .product_qty_price_wrapper {
1055
+ // display: flex;
1056
+ // justify-content: var(--_dm-flt);
1057
+ // align-items: center;
1058
+ // gap: 32px;
1059
+ // align-self: stretch;
1060
+
1061
+ // .product_qty_wrapper {
1062
+ // display: flex;
1063
+ // // width: 124px;
1064
+ // flex-direction: column;
1065
+ // align-items: flex-start;
1066
+ // gap: 6px;
1067
+
1068
+ // .product_qty_container {
1069
+ // display: flex;
1070
+ // align-items: flex-start;
1071
+ // align-self: stretch;
1072
+ // border-radius: 4px;
1073
+ // border: 0.5px solid #d0d5dd;
1074
+ // background: #fff;
1075
+ // box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
1076
+
1077
+ // .product_qty_label {
1078
+ // display: flex;
1079
+ // padding: 8px 12px;
1080
+ // align-items: center;
1081
+ // border-radius: 8px 0px 0px 8px;
1082
+ // p {
1083
+ // color: #475467;
1084
+ // font-size: 16px;
1085
+ // font-weight: 400;
1086
+ // line-height: 24px;
1087
+ // }
1088
+ // }
1089
+
1090
+ // .product_qty_number {
1091
+ // display: flex;
1092
+ // padding: 8px 12px;
1093
+ // align-items: center;
1094
+ // gap: 8px;
1095
+ // flex: 1 0 0;
1096
+ // align-self: stretch;
1097
+ // border-radius: 0px 4px 4px 0px;
1098
+ // background: #fff;
1099
+ // border-left: 1px solid #d0d5dd;
1100
+ // max-width: 80px;
1101
+ // }
1102
+ // }
1103
+ // }
1104
+
1105
+ // .product_price {
1106
+ // // color: #101828;
1107
+ // // text-align: right;
1108
+ // // font-size: 20px;
1109
+ // // font-weight: 700;
1110
+ // // line-height: 30px;
1111
+ // white-space: nowrap;
1112
+ // color: var(
1113
+ // --_ctm-mob-dn-pt-pe-ss-cr,
1114
+ // var(--_ctm-tab-dn-pt-pe-ss-cr, var(--_ctm-dn-pt-pe-ss-cr))
1115
+ // );
1116
+ // font-family: var(
1117
+ // --_sf-hr-ff,
1118
+ // var(
1119
+ // --_ctm-mob-dn-pt-pe-ss-ft-fy,
1120
+ // var(--_ctm-tab-dn-pt-pe-ss-ft-fy, var(--_ctm-dn-pt-pe-ss-ft-fy))
1121
+ // )
1122
+ // );
1123
+ // font-size: var(
1124
+ // --_ctm-mob-dn-pt-pe-ss-ft-se,
1125
+ // var(--_ctm-tab-dn-pt-pe-ss-ft-se, var(--_ctm-dn-pt-pe-ss-ft-se))
1126
+ // );
1127
+ // font-weight: var(
1128
+ // --_ctm-mob-dn-pt-pe-ss-ft-wt,
1129
+ // var(--_ctm-tab-dn-pt-pe-ss-ft-wt, var(--_ctm-dn-pt-pe-ss-ft-wt))
1130
+ // );
1131
+ // font-style: var(
1132
+ // --_ctm-mob-dn-pt-pe-ss-ft-se-ic,
1133
+ // var(--_ctm-tab-dn-pt-pe-ss-ft-se-ic, var(--_ctm-dn-pt-pe-ss-ft-se-ic))
1134
+ // );
1135
+ // text-align: var(
1136
+ // --_ctm-mob-dn-pt-pe-ss-tt-an,
1137
+ // var(--_ctm-tab-dn-pt-pe-ss-tt-an, var(--_ctm-dn-pt-pe-ss-tt-an))
1138
+ // );
1139
+ // letter-spacing: var(
1140
+ // --_ctm-mob-dn-pt-pe-ss-lr-sg,
1141
+ // var(--_ctm-tab-dn-pt-pe-ss-lr-sg, var(--_ctm-dn-pt-pe-ss-lr-sg))
1142
+ // );
1143
+ // line-height: var(
1144
+ // --_ctm-mob-dn-pt-pe-ss-le-ht,
1145
+ // var(--_ctm-tab-dn-pt-pe-ss-le-ht, var(--_ctm-dn-pt-pe-ss-le-ht))
1146
+ // );
1147
+ // text-decoration: var(
1148
+ // --_ctm-mob-dn-pt-pe-ss-ue,
1149
+ // var(--_ctm-tab-dn-pt-pe-ss-ue, var(--_ctm-dn-pt-pe-ss-ue))
1150
+ // );
1151
+ // min-width: 80px;
1152
+ // }
1153
+ // }
1154
+
1155
+ // .product_actions_wrapper {
1156
+ // display: flex;
1157
+ // align-items: center;
1158
+ // gap: 16px;
1159
+ // .svg_icon {
1160
+ // display: flex;
1161
+ // justify-content: center;
1162
+ // align-items: center;
1163
+
1164
+ // // &:last-child svg {
1165
+ // // width: 16px;
1166
+ // // height: 16px;
1167
+ // // path {
1168
+ // // stroke: #dc2626;
1169
+ // // }
1170
+ // // }
1171
+ // }
1172
+ // .product_action_button {
1173
+ // display: flex;
1174
+ // justify-content: center;
1175
+ // align-items: center;
1176
+ // gap: 8px;
1177
+ // // color: #243dc6;
1178
+ // // font-size: 14px;
1179
+ // // font-weight: 400;
1180
+ // // line-height: 20px;
1181
+
1182
+ // // &:hover {
1183
+ // // font-weight: 600;
1184
+ // // }
1185
+ // }
1186
+
1187
+ // // .remove_button {
1188
+ // // display: flex;
1189
+ // // justify-content: center;
1190
+ // // align-items: center;
1191
+ // // color: #dc2626;
1192
+ // // font-size: 14px;
1193
+ // // font-weight: 400;
1194
+ // // line-height: 20px;
1195
+ // // white-space: nowrap;
1196
+ // // // &:hover {
1197
+ // // // font-weight: 600;
1198
+ // // // }
1199
+ // // }
1200
+ // }
1201
+ // }
1202
+ // }
911
1203
  }
912
1204
 
913
1205
  .brand_group_wrapper {
@@ -955,7 +1247,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
955
1247
  .infinite-list-container {
956
1248
  display: flex;
957
1249
  flex-direction: column;
958
- gap: 48px;
1250
+ gap: 24px;
959
1251
  max-width: 100%;
960
1252
  min-width: 100%;
961
1253