@sc-360-v2/storefront-cms-library 0.5.73 → 0.5.74

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 (135) hide show
  1. package/dist/add-existing-form.scss +5 -13
  2. package/dist/add-order.scss +236 -126
  3. package/dist/add-products-tab-details.scss +2097 -1048
  4. package/dist/add-products-tab.scss +1204 -666
  5. package/dist/allocation-header-quota-details.scss +407 -189
  6. package/dist/allocationDetails.scss +2143 -1661
  7. package/dist/allocations-quota-details.scss +323 -159
  8. package/dist/allocations.scss +793 -475
  9. package/dist/amount-estimator.scss +743 -405
  10. package/dist/badge.scss +18 -43
  11. package/dist/brand-basic-elements.scss +124 -76
  12. package/dist/brand.scss +55 -28
  13. package/dist/breadcrumbs.scss +718 -356
  14. package/dist/builder.js +1 -1
  15. package/dist/builderLite.js +1 -1
  16. package/dist/bulk-variant-picker.scss +2027 -1128
  17. package/dist/bundle.scss +1477 -841
  18. package/dist/bundleDetails.scss +5072 -3774
  19. package/dist/button.scss +103 -79
  20. package/dist/buy-for-tab-container.scss +106 -77
  21. package/dist/buyForHeaders.scss +2976 -1722
  22. package/dist/cart-details.scss +1012 -481
  23. package/dist/cart-summary.scss +1149 -557
  24. package/dist/cart-wrapper.scss +79 -37
  25. package/dist/cart.scss +225 -117
  26. package/dist/cartAttributes.scss +735 -416
  27. package/dist/category-groups-element.scss +108 -127
  28. package/dist/category-groups-product-grid.scss +147 -120
  29. package/dist/category-groups-product-image.scss +1457 -1162
  30. package/dist/category-groups-product-options.scss +680 -613
  31. package/dist/category-groups-product-price.scss +3244 -1966
  32. package/dist/category-groups-quota-details.scss +464 -210
  33. package/dist/category.scss +50 -26
  34. package/dist/checkout.scss +16 -24
  35. package/dist/confirm-modal.scss +2 -22
  36. package/dist/container.scss +54 -32
  37. package/dist/countdown.scss +443 -255
  38. package/dist/coupon.scss +710 -351
  39. package/dist/default-dropdown.scss +1 -12
  40. package/dist/embroider-template-1-v2.scss +172 -123
  41. package/dist/embroider-template-1.scss +104 -68
  42. package/dist/embroidery.scss +31 -30
  43. package/dist/employee-bulk-order.scss +142 -418
  44. package/dist/faq.scss +408 -228
  45. package/dist/filter-results.scss +265 -125
  46. package/dist/filters.scss +1797 -900
  47. package/dist/gallery-slider-temp.scss +750 -432
  48. package/dist/global-styles.scss +7 -23
  49. package/dist/grid.scss +33 -25
  50. package/dist/hotspot.scss +115 -68
  51. package/dist/image-temp.scss +20 -21
  52. package/dist/item-stock.scss +16 -9
  53. package/dist/kitDetails.scss +4301 -2721
  54. package/dist/kits.scss +19 -24
  55. package/dist/language-selector.scss +361 -211
  56. package/dist/last-x-orders.scss +174 -95
  57. package/dist/layouter-item.scss +103 -75
  58. package/dist/layouter-pro-item.scss +95 -89
  59. package/dist/layouter-pro.scss +92 -87
  60. package/dist/layouter.scss +445 -383
  61. package/dist/light-box-v2.scss +104 -89
  62. package/dist/login.scss +566 -287
  63. package/dist/map.scss +368 -221
  64. package/dist/marchandiserSets.scss +104 -95
  65. package/dist/mega-menu-container.scss +109 -96
  66. package/dist/mega-menu.scss +731 -624
  67. package/dist/menu-item.scss +2 -2
  68. package/dist/menu-v2.scss +619 -507
  69. package/dist/multi-select-dropdown.scss +3 -27
  70. package/dist/my-templates.scss +9 -38
  71. package/dist/option-bar.scss +375 -215
  72. package/dist/option-families.scss +252 -0
  73. package/dist/order-status.scss +1117 -646
  74. package/dist/overflow-module.scss +7 -6
  75. package/dist/past-orders.scss +149 -118
  76. package/dist/payment-methods.scss +30 -46
  77. package/dist/pickup-locations.scss +1118 -558
  78. package/dist/position-module.scss +17 -20
  79. package/dist/prefix-list.scss +10 -21
  80. package/dist/product-actions.scss +2316 -1610
  81. package/dist/product-basic-elements.scss +169 -108
  82. package/dist/product-highlights.scss +152 -107
  83. package/dist/product-image-bundles.scss +642 -337
  84. package/dist/product-inventory.scss +1357 -673
  85. package/dist/product-labels.scss +105 -84
  86. package/dist/product-options.scss +1274 -1117
  87. package/dist/product-price.scss +2561 -1283
  88. package/dist/product-promotions.scss +2830 -1388
  89. package/dist/product-sizechart.scss +905 -516
  90. package/dist/product.scss +61 -28
  91. package/dist/productDetails.scss +39 -19
  92. package/dist/profile.scss +447 -207
  93. package/dist/quantity-selector.scss +550 -313
  94. package/dist/quick-inventory-check.scss +174 -95
  95. package/dist/quick-links.scss +133 -55
  96. package/dist/quick-order-pad.scss +271 -218
  97. package/dist/quota-details.scss +282 -152
  98. package/dist/quotes.scss +122 -89
  99. package/dist/repeater-embla-controls.scss +15 -35
  100. package/dist/repeater-grid-toggle.scss +166 -156
  101. package/dist/repeater-item.scss +64 -41
  102. package/dist/repeater.scss +814 -671
  103. package/dist/request-for-quotes.scss +16 -66
  104. package/dist/responsive-behaviour.scss +1 -3
  105. package/dist/rfqs.scss +181 -118
  106. package/dist/scroll.scss +172 -93
  107. package/dist/search.scss +326 -179
  108. package/dist/section.scss +51 -27
  109. package/dist/shipping-payments.scss +58 -198
  110. package/dist/simple-list.scss +164 -74
  111. package/dist/social.scss +145 -80
  112. package/dist/sort.scss +19 -11
  113. package/dist/stack.scss +34 -23
  114. package/dist/static-global.scss +26 -44
  115. package/dist/stockStatus.scss +19 -11
  116. package/dist/store-locations.scss +1105 -577
  117. package/dist/tab-container.scss +108 -81
  118. package/dist/table-common.scss +408 -217
  119. package/dist/table.scss +502 -271
  120. package/dist/text-temp.scss +7 -8
  121. package/dist/theme-classes.scss +13 -17
  122. package/dist/types/builder/enums/data-connectors.d.ts +3 -1
  123. package/dist/types/builder/enums/index.d.ts +3 -1
  124. package/dist/types/builder/tools/element-edit/index.d.ts +2 -1
  125. package/dist/types/builder/tools/element-edit/optionFamilies.d.ts +20 -0
  126. package/dist/types/website/constants/data-connector-souces.d.ts +40 -8
  127. package/dist/types/website/constants/data-connectors.d.ts +12 -1
  128. package/dist/types/website/helper/ssr-functions.d.ts +8 -0
  129. package/dist/uom-selector.scss +949 -489
  130. package/dist/user-elements.scss +837 -529
  131. package/dist/variant-picker.scss +2555 -1281
  132. package/dist/volume-pricing.scss +1037 -541
  133. package/dist/website.js +1 -1
  134. package/dist/widget.scss +1 -0
  135. package/package.json +1 -1
@@ -8,22 +8,27 @@ $minWidth: 70px;
8
8
  &[data-element-type="bulkVariantPicker"] {
9
9
  --_ctm-mob-var-lt-mn-cn-wh: 70px;
10
10
 
11
- width: var(--_sf-el-wh-st-mx,
12
- calc(1% * var(--_ctm-mob-ele-nw-wh-vl,
13
- var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))));
11
+ width: var(
12
+ --_sf-el-wh-st-mx,
13
+ calc(
14
+ 1% *
15
+ var(
16
+ --_ctm-mob-ele-nw-wh-vl,
17
+ var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh)))
18
+ )
19
+ )
20
+ );
14
21
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
15
22
 
16
23
  min-width: #{$minWidth} !important;
17
24
 
18
- &>.wrapper {
25
+ & > .wrapper {
19
26
  width: 100%;
20
27
  // height: 100%;
21
28
  }
22
-
23
29
  &[data-show-shadow="false"] {
24
30
  --_show-shadow: none;
25
31
  }
26
-
27
32
  .text-element {
28
33
  color: #333;
29
34
 
@@ -33,32 +38,53 @@ $minWidth: 70px;
33
38
  line-height: 18px;
34
39
  margin-bottom: 6px;
35
40
  }
36
-
37
41
  .option__title {
38
42
  margin-bottom: 4px;
39
43
  color: var(--_ctm-mob-dn-on-te-cr, var(--_ctm-tab-dn-on-te-cr, var(--_ctm-dn-on-te-cr)));
40
- font-family: var(--_ctm-mob-dn-on-te-ft-fy,
41
- var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy)));
42
- text-transform: var(--_ctm-mob-dn-on-te-tt-tm,
43
- var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm)));
44
- word-wrap: var(--_ctm-mob-dn-on-te-wd-wp,
45
- var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp)));
46
- word-break: var(--_ctm-mob-dn-on-te-wd-bk,
47
- var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk)));
48
- font-size: var(--_ctm-mob-dn-on-te-ft-se,
49
- var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se)));
50
- font-weight: var(--_ctm-mob-dn-on-te-ft-wt,
51
- var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt)));
52
- font-style: var(--_ctm-mob-dn-on-te-ft-se-ic,
53
- var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic)));
54
- text-align: var(--_ctm-mob-dn-on-te-tt-an,
55
- var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an)));
56
- letter-spacing: var(--_ctm-mob-dn-on-te-lr-sg,
57
- var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg)));
58
- line-height: var(--_ctm-mob-dn-on-te-le-ht,
59
- var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht)));
60
- text-decoration: var(--_ctm-mob-dn-on-te-ue,
61
- var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue)));
44
+ font-family: var(
45
+ --_ctm-mob-dn-on-te-ft-fy,
46
+ var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))
47
+ );
48
+ text-transform: var(
49
+ --_ctm-mob-dn-on-te-tt-tm,
50
+ var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm))
51
+ );
52
+ word-wrap: var(
53
+ --_ctm-mob-dn-on-te-wd-wp,
54
+ var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp))
55
+ );
56
+ word-break: var(
57
+ --_ctm-mob-dn-on-te-wd-bk,
58
+ var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk))
59
+ );
60
+ font-size: var(
61
+ --_ctm-mob-dn-on-te-ft-se,
62
+ var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se))
63
+ );
64
+ font-weight: var(
65
+ --_ctm-mob-dn-on-te-ft-wt,
66
+ var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt))
67
+ );
68
+ font-style: var(
69
+ --_ctm-mob-dn-on-te-ft-se-ic,
70
+ var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic))
71
+ );
72
+ text-align: var(
73
+ --_ctm-mob-dn-on-te-tt-an,
74
+ var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an))
75
+ );
76
+ letter-spacing: var(
77
+ --_ctm-mob-dn-on-te-lr-sg,
78
+ var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg))
79
+ );
80
+ line-height: var(
81
+ --_ctm-mob-dn-on-te-le-ht,
82
+ var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht))
83
+ );
84
+ text-decoration: var(
85
+ --_ctm-mob-dn-on-te-ue,
86
+ var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue))
87
+ );
62
88
  }
63
89
 
64
90
  .is__combination_avail {
@@ -66,7 +92,6 @@ $minWidth: 70px;
66
92
  font-size: 14px;
67
93
  font-weight: 600;
68
94
  }
69
-
70
95
  .variant__container {
71
96
  display: flex;
72
97
  flex-direction: column;
@@ -74,34 +99,50 @@ $minWidth: 70px;
74
99
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
75
100
  white-space: nowrap;
76
101
 
77
- background-color: var(--_ctm-mob-dn-wt-se-bd-cr,
78
- var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr)));
79
-
80
- border-color: var(--_ctm-mob-dn-wt-se-br-cr,
81
- var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr)));
82
-
83
- border-style: var(--_ctm-mob-dn-wt-se-br-se,
84
- var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se)));
85
-
86
- border-width: var(--_ctm-mob-dn-wt-se-br-wh,
87
- var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh)));
88
-
89
- border-radius: var(--_ctm-mob-dn-wt-se-br-rs,
90
- var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs)));
91
-
92
- box-shadow: var(--_show-shadow,
93
- var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae))) var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br))) var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd))) var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr))));
102
+ background-color: var(
103
+ --_ctm-mob-dn-wt-se-bd-cr,
104
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
105
+ );
106
+
107
+ border-color: var(
108
+ --_ctm-mob-dn-wt-se-br-cr,
109
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
110
+ );
111
+
112
+ border-style: var(
113
+ --_ctm-mob-dn-wt-se-br-se,
114
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
115
+ );
116
+
117
+ border-width: var(
118
+ --_ctm-mob-dn-wt-se-br-wh,
119
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
120
+ );
121
+
122
+ border-radius: var(
123
+ --_ctm-mob-dn-wt-se-br-rs,
124
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
125
+ );
126
+
127
+ box-shadow: var(
128
+ --_show-shadow,
129
+ var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
130
+ var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
131
+ var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
132
+ var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
133
+ );
94
134
 
95
135
  .standard_wrapper {
96
-
97
136
  // Select Colors
98
137
  .select__colors {
99
138
  font-size: 16px;
100
139
  color: var(--_gray-500);
101
140
  display: flex;
102
141
  flex-direction: column;
103
- gap: var(--_ctm-mob-lt-on-te-ve-sg,
104
- var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg)));
142
+ gap: var(
143
+ --_ctm-mob-lt-on-te-ve-sg,
144
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
145
+ );
105
146
  // padding: var(
106
147
  // --_ctm-mob-lt-sh-te-dy-se-im-pg,
107
148
  // var(--_ctm-tab-lt-sh-te-dy-se-im-pg, var(--_ctm-lt-sh-te-dy-se-im-pg))
@@ -110,62 +151,107 @@ $minWidth: 70px;
110
151
  .select__group {
111
152
  display: flex;
112
153
  flex-direction: row;
113
- gap: var(--_ctm-mob-lt-sh-te-dy-se-im-sg,
114
- var(--_ctm-tab-lt-sh-te-dy-se-im-sg, var(--_ctm-lt-sh-te-dy-se-im-sg)));
154
+ gap: var(
155
+ --_ctm-mob-lt-sh-te-dy-se-im-sg,
156
+ var(--_ctm-tab-lt-sh-te-dy-se-im-sg, var(--_ctm-lt-sh-te-dy-se-im-sg))
157
+ );
115
158
 
116
159
  &[data-swatch-dispaly="Vertically"] {
117
160
  flex-direction: column;
118
161
  }
119
-
120
162
  &[data-swatch-overflow="Scroll"] {
121
163
  flex-wrap: nowrap;
122
164
  overflow-x: auto;
123
165
  }
124
-
125
166
  &[data-swatch-overflow="Wrap"] {
126
167
  flex-wrap: wrap;
127
168
  }
128
169
 
129
170
  .show_more_button {
130
- background-color: var(--_ctm-mob-dn-sw-me-is-bn-bd-cr,
131
- var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr)));
132
- font-family: var(--_ctm-mob-dn-sw-me-is-bn-ft-fy,
133
- var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy)));
134
- text-transform: var(--_ctm-mob-dn-sw-me-is-bn-tt-tm,
135
- var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm)));
136
- word-wrap: var(--_ctm-mob-dn-sw-me-is-bn-wd-wp,
137
- var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp)));
138
- word-break: var(--_ctm-mob-dn-sw-me-is-bn-wd-bk,
139
- var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk)));
140
- border-color: var(--_ctm-mob-dn-sw-me-is-bn-br-cr,
141
- var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr)));
142
- border-radius: var(--_ctm-mob-dn-sw-me-is-bn-br-rs,
143
- var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs)));
144
- border-style: var(--_ctm-mob-dn-sw-me-is-bn-br-se,
145
- var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se)));
146
- border-width: var(--_ctm-mob-dn-sw-me-is-bn-br-wh,
147
- var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh)));
148
- font-size: var(--_ctm-mob-dn-sw-me-is-bn-ft-se,
149
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se)));
150
- font-style: var(--_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
151
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic)));
152
- font-weight: var(--_ctm-mob-dn-sw-me-is-bn-ft-wt,
153
- var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt)));
154
- line-height: var(--_ctm-mob-dn-sw-me-is-bn-le-ht,
155
- var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht)));
156
- letter-spacing: var(--_ctm-mob-dn-sw-me-is-bn-lr-sg,
157
- var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg)));
158
- box-shadow: var(--_ctm-mob-dn-sw-me-is-bn-sw-ae,
159
- var(--_ctm-tab-dn-sw-me-is-bn-sw-ae, var(--_ctm-dn-sw-me-is-bn-sw-ae))) var(--_ctm-mob-dn-sw-me-is-bn-sw-br,
160
- var(--_ctm-tab-dn-sw-me-is-bn-sw-br, var(--_ctm-dn-sw-me-is-bn-sw-br))) var(--_ctm-mob-dn-sw-me-is-bn-sw-sd,
161
- var(--_ctm-tab-dn-sw-me-is-bn-sw-sd, var(--_ctm-dn-sw-me-is-bn-sw-sd))) var(--_ctm-mob-dn-sw-me-is-bn-sw-cr,
162
- var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr)));
163
- text-align: var(--_ctm-mob-dn-sw-me-is-bn-tt-an,
164
- var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an)));
165
- color: var(--_ctm-mob-dn-sw-me-is-bn-tt-cr,
166
- var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr)));
167
- text-decoration: var(--_ctm-mob-dn-sw-me-is-bn-ue,
168
- var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue)));
171
+ background-color: var(
172
+ --_ctm-mob-dn-sw-me-is-bn-bd-cr,
173
+ var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr))
174
+ );
175
+ font-family: var(
176
+ --_ctm-mob-dn-sw-me-is-bn-ft-fy,
177
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy))
178
+ );
179
+ text-transform: var(
180
+ --_ctm-mob-dn-sw-me-is-bn-tt-tm,
181
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm))
182
+ );
183
+ word-wrap: var(
184
+ --_ctm-mob-dn-sw-me-is-bn-wd-wp,
185
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp))
186
+ );
187
+ word-break: var(
188
+ --_ctm-mob-dn-sw-me-is-bn-wd-bk,
189
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk))
190
+ );
191
+ border-color: var(
192
+ --_ctm-mob-dn-sw-me-is-bn-br-cr,
193
+ var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr))
194
+ );
195
+ border-radius: var(
196
+ --_ctm-mob-dn-sw-me-is-bn-br-rs,
197
+ var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs))
198
+ );
199
+ border-style: var(
200
+ --_ctm-mob-dn-sw-me-is-bn-br-se,
201
+ var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se))
202
+ );
203
+ border-width: var(
204
+ --_ctm-mob-dn-sw-me-is-bn-br-wh,
205
+ var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh))
206
+ );
207
+ font-size: var(
208
+ --_ctm-mob-dn-sw-me-is-bn-ft-se,
209
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se))
210
+ );
211
+ font-style: var(
212
+ --_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
213
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic))
214
+ );
215
+ font-weight: var(
216
+ --_ctm-mob-dn-sw-me-is-bn-ft-wt,
217
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt))
218
+ );
219
+ line-height: var(
220
+ --_ctm-mob-dn-sw-me-is-bn-le-ht,
221
+ var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht))
222
+ );
223
+ letter-spacing: var(
224
+ --_ctm-mob-dn-sw-me-is-bn-lr-sg,
225
+ var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg))
226
+ );
227
+ box-shadow: var(
228
+ --_ctm-mob-dn-sw-me-is-bn-sw-ae,
229
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-ae, var(--_ctm-dn-sw-me-is-bn-sw-ae))
230
+ )
231
+ var(
232
+ --_ctm-mob-dn-sw-me-is-bn-sw-br,
233
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-br, var(--_ctm-dn-sw-me-is-bn-sw-br))
234
+ )
235
+ var(
236
+ --_ctm-mob-dn-sw-me-is-bn-sw-sd,
237
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-sd, var(--_ctm-dn-sw-me-is-bn-sw-sd))
238
+ )
239
+ var(
240
+ --_ctm-mob-dn-sw-me-is-bn-sw-cr,
241
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr))
242
+ );
243
+ text-align: var(
244
+ --_ctm-mob-dn-sw-me-is-bn-tt-an,
245
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an))
246
+ );
247
+ color: var(
248
+ --_ctm-mob-dn-sw-me-is-bn-tt-cr,
249
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr))
250
+ );
251
+ text-decoration: var(
252
+ --_ctm-mob-dn-sw-me-is-bn-ue,
253
+ var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue))
254
+ );
169
255
  }
170
256
 
171
257
  .select__group__item {
@@ -176,40 +262,51 @@ $minWidth: 70px;
176
262
  width: prepareMediaVariable(--_ctm-lt-sh-te-dy-se-im-se);
177
263
  padding: prepareMediaVariable(--_ctm-lt-sh-te-dy-se-im-pg);
178
264
 
179
- border-color: var(--_sf-hr-br-cr,
180
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr));
181
-
182
- background-color: var(--_sf-hr-bd-cr,
183
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr));
184
-
185
- border-style: var(--_sf-hr-br-se,
186
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se));
187
-
188
- border-width: var(--_sf-hr-br-wh,
189
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh));
190
- border-radius: var(--_sf-hr-br-rs,
191
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs));
192
-
193
- box-shadow: var(--_sf-hr-sw-ae,
194
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr));
265
+ border-color: var(
266
+ --_sf-hr-br-cr,
267
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr)
268
+ );
269
+
270
+ background-color: var(
271
+ --_sf-hr-bd-cr,
272
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr)
273
+ );
274
+
275
+ border-style: var(
276
+ --_sf-hr-br-se,
277
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se)
278
+ );
279
+
280
+ border-width: var(
281
+ --_sf-hr-br-wh,
282
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh)
283
+ );
284
+ border-radius: var(
285
+ --_sf-hr-br-rs,
286
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs)
287
+ );
288
+
289
+ box-shadow: var(
290
+ --_sf-hr-sw-ae,
291
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae)
292
+ )
293
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-br))
294
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd))
295
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr));
195
296
 
196
297
  cursor: pointer;
197
298
  overflow: hidden;
198
-
199
299
  .product-select-image {
200
300
  object-fit: cover;
201
301
  width: 100%;
202
302
  height: 100%;
203
303
  }
204
-
205
304
  &[data-background-shape="circle"] {
206
305
  border-radius: 50%;
207
306
  }
208
-
209
307
  &[data-background-shape="square"] {
210
308
  border-radius: 5px;
211
309
  }
212
-
213
310
  &[data-background-shape="capsule"] {
214
311
  --toggle-height: var(--_ctm-lt-sh-te-dy-se-im-se);
215
312
  --toggle-width: calc(var(--_ctm-lt-sh-te-dy-se-im-se) * 1.5);
@@ -217,23 +314,17 @@ $minWidth: 70px;
217
314
  width: var(--toggle-width);
218
315
  height: var(--toggle-height);
219
316
 
220
- border-radius: var(--toggle-height);
221
- /* Full pill shape */
317
+ border-radius: var(--toggle-height); /* Full pill shape */
222
318
  box-sizing: border-box;
223
319
  }
224
-
225
320
  &[data-swatch-shape="circle"] {
226
-
227
321
  & div,
228
322
  .product-select-image {
229
323
  border-radius: 50%;
230
324
  }
231
-
232
325
  // border-radius: 50%;
233
326
  }
234
-
235
327
  &[data-swatch-shape="capsule"] {
236
-
237
328
  & div,
238
329
  .product-select-image {
239
330
  // border-radius: 50%;
@@ -241,31 +332,41 @@ $minWidth: 70px;
241
332
  height: 100%;
242
333
  border-radius: inherit;
243
334
  }
244
-
245
335
  // border-radius: 50%;
246
336
  }
247
337
 
248
338
  &[data-selected="true"] {
249
- border-color: var(--_sf-sd-br-cr,
250
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-cr));
251
-
252
- background-color: var(--_sf-sd-bd-cr,
253
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr));
254
- border-style: var(--_sf-sd-br-se,
255
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-se));
256
- border-width: var(--_sf-sd-br-wh,
257
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-wh));
258
- box-shadow: var(--_sf-sd-sw-ae,
259
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae)) var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-br)) var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd)) var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr));
339
+ border-color: var(
340
+ --_sf-sd-br-cr,
341
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-cr)
342
+ );
343
+
344
+ background-color: var(
345
+ --_sf-sd-bd-cr,
346
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr)
347
+ );
348
+ border-style: var(
349
+ --_sf-sd-br-se,
350
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-se)
351
+ );
352
+ border-width: var(
353
+ --_sf-sd-br-wh,
354
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-wh)
355
+ );
356
+ box-shadow: var(
357
+ --_sf-sd-sw-ae,
358
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae)
359
+ )
360
+ var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-br))
361
+ var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd))
362
+ var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr));
260
363
 
261
364
  &[data-background-shape-selected="circle"] {
262
365
  border-radius: 50%;
263
366
  }
264
-
265
367
  &[data-background-shape-selected="square"] {
266
368
  border-radius: 5px;
267
369
  }
268
-
269
370
  &[data-background-shape-selected="capsule"] {
270
371
  border-radius: 80%;
271
372
  // width: calc(
@@ -273,64 +374,73 @@ $minWidth: 70px;
273
374
  // 8px
274
375
  // );
275
376
  }
276
-
277
377
  &[data-swatch-shape-selected="circle"] {
278
-
279
378
  & div,
280
379
  .product-select-image {
281
380
  border-radius: 50%;
282
381
  }
283
382
  }
284
-
285
383
  &[data-swatch-shape-selected="capsule"] {
286
-
287
384
  & div,
288
385
  .product-select-image {
289
386
  border-radius: 50%;
290
387
  }
291
388
  }
292
-
293
389
  &[data-swatch-shape-selected="square"] {
294
-
295
390
  & div,
296
391
  .product-select-image {
297
392
  border-radius: 5px;
298
393
  }
299
394
  }
300
395
  }
301
-
302
396
  &:hover {
303
- --_sf-hr-bd-cr: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-bd-cr,
304
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-bd-cr)));
305
- --_sf-hr-br-cr: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-cr,
306
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-br-cr)));
307
- --_sf-hr-br-se: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-se,
308
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-se, var(--_ctm-dn-sh-on-ve-se-hr-se-br-se)));
309
- --_sf-hr-br-wh: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-wh,
310
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-wh, var(--_ctm-dn-sh-on-ve-se-hr-se-br-wh)));
311
- --_sf-hr-br-bs: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-rs,
312
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-rs, var(--_ctm-dn-sh-on-ve-se-hr-se-br-rs)));
397
+ --_sf-hr-bd-cr: var(
398
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-bd-cr,
399
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-bd-cr))
400
+ );
401
+ --_sf-hr-br-cr: var(
402
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-cr,
403
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-br-cr))
404
+ );
405
+ --_sf-hr-br-se: var(
406
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-se,
407
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-se, var(--_ctm-dn-sh-on-ve-se-hr-se-br-se))
408
+ );
409
+ --_sf-hr-br-wh: var(
410
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-wh,
411
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-wh, var(--_ctm-dn-sh-on-ve-se-hr-se-br-wh))
412
+ );
413
+ --_sf-hr-br-bs: var(
414
+ --_ctm-mob-dn-sh-on-ve-se-hr-se-br-rs,
415
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-rs, var(--_ctm-dn-sh-on-ve-se-hr-se-br-rs))
416
+ );
313
417
 
314
418
  // new
315
- --_sf-hr-sw-ae: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-ae,
316
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-ae)));
317
- --_sf-hr-sw-br: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-br,
318
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-br, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-br)));
319
- --_sf-hr-sw-hr: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-hr,
320
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-hr)));
321
- --_sf-hr-sw-cr: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-cr,
322
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-cr)));
419
+ --_sf-hr-sw-ae: var(
420
+ --_ctm-mob-dn-on-ve-se-hr-se-sw-ae,
421
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-ae))
422
+ );
423
+ --_sf-hr-sw-br: var(
424
+ --_ctm-mob-dn-on-ve-se-hr-se-sw-br,
425
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-br, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-br))
426
+ );
427
+ --_sf-hr-sw-hr: var(
428
+ --_ctm-mob-dn-on-ve-se-hr-se-sw-hr,
429
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-hr))
430
+ );
431
+ --_sf-hr-sw-cr: var(
432
+ --_ctm-mob-dn-on-ve-se-hr-se-sw-cr,
433
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-cr))
434
+ );
323
435
  }
324
436
 
325
437
  &:hover {
326
438
  &[data-background-shape-hover="circle"] {
327
439
  border-radius: 50%;
328
440
  }
329
-
330
441
  &[data-background-shape-hover="square"] {
331
442
  border-radius: 5px;
332
443
  }
333
-
334
444
  &[data-background-shape-hover="capsule"] {
335
445
  border-radius: 80%;
336
446
  // width: calc(
@@ -341,27 +451,20 @@ $minWidth: 70px;
341
451
  // 8px
342
452
  // );
343
453
  }
344
-
345
454
  &[data-swatch-shape-hover="circle"] {
346
-
347
455
  & div,
348
456
  .product-select-image {
349
457
  border-radius: 50%;
350
458
  }
351
-
352
459
  // border-radius: 50%;
353
460
  }
354
-
355
461
  &[data-swatch-shape-hover="capsule"] {
356
-
357
462
  & div,
358
463
  .product-select-image {
359
464
  border-radius: 50%;
360
465
  }
361
466
  }
362
-
363
467
  &[data-swatch-shape-hover="square"] {
364
-
365
468
  & div,
366
469
  .product-select-image {
367
470
  border-radius: 5px;
@@ -370,52 +473,83 @@ $minWidth: 70px;
370
473
  }
371
474
 
372
475
  &[data-selected="true"] {
373
- --_sf-sd-bd-cr: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-bd-cr,
374
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr)));
375
- --_sf-sd-br-cr: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-cr,
376
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-br-cr)));
377
- --_sf-sd-br-se: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-se,
378
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-se, var(--_ctm-dn-sh-on-ve-se-sd-se-br-se)));
379
- --_sf-sd-br-wh: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-wh,
380
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-wh, var(--_ctm-dn-sh-on-ve-se-sd-se-br-wh)));
381
- --_sf-sd-br-bs: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-rs,
382
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-rs, var(--_ctm-dn-sh-on-ve-se-sd-se-br-rs)));
476
+ --_sf-sd-bd-cr: var(
477
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-bd-cr,
478
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr))
479
+ );
480
+ --_sf-sd-br-cr: var(
481
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-cr,
482
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-br-cr))
483
+ );
484
+ --_sf-sd-br-se: var(
485
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-se,
486
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-se, var(--_ctm-dn-sh-on-ve-se-sd-se-br-se))
487
+ );
488
+ --_sf-sd-br-wh: var(
489
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-wh,
490
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-wh, var(--_ctm-dn-sh-on-ve-se-sd-se-br-wh))
491
+ );
492
+ --_sf-sd-br-bs: var(
493
+ --_ctm-mob-dn-sh-on-ve-se-sd-se-br-rs,
494
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-rs, var(--_ctm-dn-sh-on-ve-se-sd-se-br-rs))
495
+ );
383
496
 
384
497
  // new
385
- --_sf-sd-sw-ae: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
386
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae)));
387
- --_sf-sd-sw-br: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-br,
388
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-br, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-br)));
389
- --_sf-sd-sw-sd: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-sd,
390
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-sd, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd)));
391
- --_sf-sd-sw-cr: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
392
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr)));
393
-
394
- border-color: var(--_sf-sd-br-cr,
395
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr));
396
-
397
- background-color: var(--_sf-sd-bd-cr,
398
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr));
399
-
400
- border-style: var(--_sf-sd-br-se,
401
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se));
402
-
403
- border-width: var(--_sf-sd-br-wh,
404
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh));
405
- border-radius: var(--_sf-sd-br-rs,
406
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs));
407
-
408
- box-shadow: var(--_sf-sd-sw-ae,
409
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae)) var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-br)) var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd)) var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr));
498
+ --_sf-sd-sw-ae: var(
499
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
500
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae))
501
+ );
502
+ --_sf-sd-sw-br: var(
503
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-br,
504
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-br, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-br))
505
+ );
506
+ --_sf-sd-sw-sd: var(
507
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-sd,
508
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-sd, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd))
509
+ );
510
+ --_sf-sd-sw-cr: var(
511
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
512
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr))
513
+ );
514
+
515
+ border-color: var(
516
+ --_sf-sd-br-cr,
517
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr)
518
+ );
519
+
520
+ background-color: var(
521
+ --_sf-sd-bd-cr,
522
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr)
523
+ );
524
+
525
+ border-style: var(
526
+ --_sf-sd-br-se,
527
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se)
528
+ );
529
+
530
+ border-width: var(
531
+ --_sf-sd-br-wh,
532
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh)
533
+ );
534
+ border-radius: var(
535
+ --_sf-sd-br-rs,
536
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs)
537
+ );
538
+
539
+ box-shadow: var(
540
+ --_sf-sd-sw-ae,
541
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae)
542
+ )
543
+ var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-br))
544
+ var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd))
545
+ var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr));
410
546
 
411
547
  &[data-background-shape-selected="circle"] {
412
548
  border-radius: 50%;
413
549
  }
414
-
415
550
  &[data-background-shape-selected="square"] {
416
551
  border-radius: 5px;
417
552
  }
418
-
419
553
  &[data-background-shape-selected="capsule"] {
420
554
  --toggle-height: var(--_ctm-lt-sh-te-dy-se-im-se);
421
555
  --toggle-width: calc(var(--_ctm-lt-sh-te-dy-se-im-se) * 1.5);
@@ -423,22 +557,17 @@ $minWidth: 70px;
423
557
  width: var(--toggle-width);
424
558
  height: var(--toggle-height);
425
559
 
426
- border-radius: var(--toggle-height);
427
- /* Full pill shape */
560
+ border-radius: var(--toggle-height); /* Full pill shape */
428
561
  box-sizing: border-box;
429
562
  // border-radius: 80%;
430
563
  }
431
-
432
564
  &[data-swatch-shape-selected="circle"] {
433
-
434
565
  & div,
435
566
  .product-select-image {
436
567
  border-radius: 50%;
437
568
  }
438
569
  }
439
-
440
570
  &[data-swatch-shape-selected="capsule"] {
441
-
442
571
  & div,
443
572
  .product-select-image {
444
573
  // border-radius: 50%;
@@ -447,9 +576,7 @@ $minWidth: 70px;
447
576
  border-radius: inherit;
448
577
  }
449
578
  }
450
-
451
579
  &[data-swatch-shape-selected="square"] {
452
-
453
580
  & div,
454
581
  .product-select-image {
455
582
  border-radius: 5px;
@@ -510,7 +637,6 @@ $minWidth: 70px;
510
637
  clip-path: polygon(100% 0, 100% 1px, 0 100%, 0 96%);
511
638
  pointer-events: none;
512
639
  }
513
-
514
640
  .product-select-image {
515
641
  width: 100%;
516
642
  height: 100%;
@@ -519,15 +645,16 @@ $minWidth: 70px;
519
645
  }
520
646
  }
521
647
  }
522
-
523
648
  // Select Fit and Size
524
649
  .select__fit {
525
650
  font-size: 16px;
526
651
  color: var(--_gray-500);
527
652
  display: flex;
528
653
  flex-direction: column;
529
- gap: var(--_ctm-mob-lt-on-te-ve-sg,
530
- var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg)));
654
+ gap: var(
655
+ --_ctm-mob-lt-on-te-ve-sg,
656
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
657
+ );
531
658
 
532
659
  // padding: var(
533
660
  // --_ctm-mob-lt-se-st-dy-se-im-pg,
@@ -540,72 +667,119 @@ $minWidth: 70px;
540
667
  flex-wrap: wrap;
541
668
  margin-bottom: 10px;
542
669
  flex-direction: row;
543
- gap: var(--_ctm-mob-lt-se-st-dy-se-im-sg,
544
- var(--_ctm-tab-lt-se-st-dy-se-im-sg, var(--_ctm-lt-se-st-dy-se-im-sg)));
670
+ gap: var(
671
+ --_ctm-mob-lt-se-st-dy-se-im-sg,
672
+ var(--_ctm-tab-lt-se-st-dy-se-im-sg, var(--_ctm-lt-se-st-dy-se-im-sg))
673
+ );
545
674
 
546
675
  &[data-single-dispaly="Vertically"] {
547
676
  flex-direction: column;
548
677
  }
549
-
550
678
  &[data-single-overflow="Scroll"] {
551
679
  overflow-x: auto;
552
680
  overflow-y: hidden;
553
681
  flex-wrap: nowrap;
554
682
  }
555
-
556
683
  &[data-swatch-overflow="Scroll"] {
557
684
  overflow-x: auto;
558
685
  flex-wrap: nowrap;
559
686
  overflow-y: hidden;
560
687
  }
561
-
562
688
  .show_more_button {
563
- background-color: var(--_ctm-mob-dn-sw-me-is-bn-bd-cr,
564
- var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr)));
565
- font-family: var(--_ctm-mob-dn-sw-me-is-bn-ft-fy,
566
- var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy)));
567
- text-transform: var(--_ctm-mob-dn-sw-me-is-bn-tt-tm,
568
- var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm)));
569
- word-wrap: var(--_ctm-mob-dn-sw-me-is-bn-wd-wp,
570
- var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp)));
571
- word-break: var(--_ctm-mob-dn-sw-me-is-bn-wd-bk,
572
- var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk)));
573
- border-color: var(--_ctm-mob-dn-sw-me-is-bn-br-cr,
574
- var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr)));
575
- border-radius: var(--_ctm-mob-dn-sw-me-is-bn-br-rs,
576
- var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs)));
577
- border-style: var(--_ctm-mob-dn-sw-me-is-bn-br-se,
578
- var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se)));
579
- border-width: var(--_ctm-mob-dn-sw-me-is-bn-br-wh,
580
- var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh)));
581
- font-size: var(--_ctm-mob-dn-sw-me-is-bn-ft-se,
582
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se)));
583
- font-style: var(--_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
584
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic)));
585
- font-weight: var(--_ctm-mob-dn-sw-me-is-bn-ft-wt,
586
- var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt)));
587
- line-height: var(--_ctm-mob-dn-sw-me-is-bn-le-ht,
588
- var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht)));
589
- letter-spacing: var(--_ctm-mob-dn-sw-me-is-bn-lr-sg,
590
- var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg)));
591
- box-shadow: var(--_ctm-mob-dn-sw-me-is-bn-sw-ae,
592
- var(--_ctm-tab-dn-sw-me-is-bn-sw-ae, var(--_ctm-dn-sw-me-is-bn-sw-ae))) var(--_ctm-mob-dn-sw-me-is-bn-sw-br,
593
- var(--_ctm-tab-dn-sw-me-is-bn-sw-br, var(--_ctm-dn-sw-me-is-bn-sw-br))) var(--_ctm-mob-dn-sw-me-is-bn-sw-sd,
594
- var(--_ctm-tab-dn-sw-me-is-bn-sw-sd, var(--_ctm-dn-sw-me-is-bn-sw-sd))) var(--_ctm-mob-dn-sw-me-is-bn-sw-cr,
595
- var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr)));
596
- text-align: var(--_ctm-mob-dn-sw-me-is-bn-tt-an,
597
- var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an)));
598
- color: var(--_ctm-mob-dn-sw-me-is-bn-tt-cr,
599
- var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr)));
600
- text-decoration: var(--_ctm-mob-dn-sw-me-is-bn-ue,
601
- var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue)));
689
+ background-color: var(
690
+ --_ctm-mob-dn-sw-me-is-bn-bd-cr,
691
+ var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr))
692
+ );
693
+ font-family: var(
694
+ --_ctm-mob-dn-sw-me-is-bn-ft-fy,
695
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy))
696
+ );
697
+ text-transform: var(
698
+ --_ctm-mob-dn-sw-me-is-bn-tt-tm,
699
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm))
700
+ );
701
+ word-wrap: var(
702
+ --_ctm-mob-dn-sw-me-is-bn-wd-wp,
703
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp))
704
+ );
705
+ word-break: var(
706
+ --_ctm-mob-dn-sw-me-is-bn-wd-bk,
707
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk))
708
+ );
709
+ border-color: var(
710
+ --_ctm-mob-dn-sw-me-is-bn-br-cr,
711
+ var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr))
712
+ );
713
+ border-radius: var(
714
+ --_ctm-mob-dn-sw-me-is-bn-br-rs,
715
+ var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs))
716
+ );
717
+ border-style: var(
718
+ --_ctm-mob-dn-sw-me-is-bn-br-se,
719
+ var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se))
720
+ );
721
+ border-width: var(
722
+ --_ctm-mob-dn-sw-me-is-bn-br-wh,
723
+ var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh))
724
+ );
725
+ font-size: var(
726
+ --_ctm-mob-dn-sw-me-is-bn-ft-se,
727
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se))
728
+ );
729
+ font-style: var(
730
+ --_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
731
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic))
732
+ );
733
+ font-weight: var(
734
+ --_ctm-mob-dn-sw-me-is-bn-ft-wt,
735
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt))
736
+ );
737
+ line-height: var(
738
+ --_ctm-mob-dn-sw-me-is-bn-le-ht,
739
+ var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht))
740
+ );
741
+ letter-spacing: var(
742
+ --_ctm-mob-dn-sw-me-is-bn-lr-sg,
743
+ var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg))
744
+ );
745
+ box-shadow: var(
746
+ --_ctm-mob-dn-sw-me-is-bn-sw-ae,
747
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-ae, var(--_ctm-dn-sw-me-is-bn-sw-ae))
748
+ )
749
+ var(
750
+ --_ctm-mob-dn-sw-me-is-bn-sw-br,
751
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-br, var(--_ctm-dn-sw-me-is-bn-sw-br))
752
+ )
753
+ var(
754
+ --_ctm-mob-dn-sw-me-is-bn-sw-sd,
755
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-sd, var(--_ctm-dn-sw-me-is-bn-sw-sd))
756
+ )
757
+ var(
758
+ --_ctm-mob-dn-sw-me-is-bn-sw-cr,
759
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr))
760
+ );
761
+ text-align: var(
762
+ --_ctm-mob-dn-sw-me-is-bn-tt-an,
763
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an))
764
+ );
765
+ color: var(
766
+ --_ctm-mob-dn-sw-me-is-bn-tt-cr,
767
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr))
768
+ );
769
+ text-decoration: var(
770
+ --_ctm-mob-dn-sw-me-is-bn-ue,
771
+ var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue))
772
+ );
602
773
  }
603
-
604
774
  &[data-single-dispaly="Grid"] {
605
775
  display: grid;
606
- grid-template-columns: repeat(var(--_ctm-mob-lt-se-st-dy-se-is-pr-rw,
607
- var(--_ctm-tab-lt-se-st-dy-se-is-pr-rw, var(--_ctm-lt-se-st-dy-se-is-pr-rw))),
608
- minmax(auto, 1fr));
776
+ grid-template-columns: repeat(
777
+ var(
778
+ --_ctm-mob-lt-se-st-dy-se-is-pr-rw,
779
+ var(--_ctm-tab-lt-se-st-dy-se-is-pr-rw, var(--_ctm-lt-se-st-dy-se-is-pr-rw))
780
+ ),
781
+ minmax(auto, 1fr)
782
+ );
609
783
  }
610
784
 
611
785
  .select__group__item {
@@ -623,118 +797,194 @@ $minWidth: 70px;
623
797
  min-width: 20px;
624
798
  min-height: 20px;
625
799
  box-sizing: content-box;
626
- border-radius: var(--_ctm-mob-dn-se-on-ve-se-dt-se-br-rs,
627
- var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-rs, var(--_ctm-dn-se-on-ve-se-dt-se-br-rs)));
628
-
629
- border-color: var(--_sf-hr-br-cr,
630
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr));
631
-
632
- background-color: var(--_sf-hr-bd-cr,
633
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr));
634
- border-style: var(--_sf-hr-br-se,
635
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se));
636
- border-width: var(--_sf-hr-br-wh,
637
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh));
638
-
639
- box-shadow: var(--_sf-hr-sw-ae,
640
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-cr));
800
+ border-radius: var(
801
+ --_ctm-mob-dn-se-on-ve-se-dt-se-br-rs,
802
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-rs, var(--_ctm-dn-se-on-ve-se-dt-se-br-rs))
803
+ );
804
+
805
+ border-color: var(
806
+ --_sf-hr-br-cr,
807
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr)
808
+ );
809
+
810
+ background-color: var(
811
+ --_sf-hr-bd-cr,
812
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr)
813
+ );
814
+ border-style: var(
815
+ --_sf-hr-br-se,
816
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se)
817
+ );
818
+ border-width: var(
819
+ --_sf-hr-br-wh,
820
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh)
821
+ );
822
+
823
+ box-shadow: var(
824
+ --_sf-hr-sw-ae,
825
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-ae)
826
+ )
827
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-br))
828
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-sd))
829
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-cr));
641
830
 
642
831
  // font is pending
643
832
 
644
833
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-cr));
645
- font-family: var(--_sf-hr-ft-fy,
646
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy));
647
- text-transform: var(--_sf-hr-tt-tm,
648
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm));
649
- word-wrap: var(--_sf-hr-wd-wp,
650
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp));
651
- word-break: var(--_sf-hr-wd-bk,
652
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk));
653
-
834
+ font-family: var(
835
+ --_sf-hr-ft-fy,
836
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)
837
+ );
838
+ text-transform: var(
839
+ --_sf-hr-tt-tm,
840
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm)
841
+ );
842
+ word-wrap: var(
843
+ --_sf-hr-wd-wp,
844
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp)
845
+ );
846
+ word-break: var(
847
+ --_sf-hr-wd-bk,
848
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk)
849
+ );
654
850
  &.flex__overflow {
655
851
  white-space: normal;
656
852
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
657
853
  }
658
-
659
- font-size: var(--_sf-hr-ft-se,
660
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se));
661
- font-weight: var(--_sf-hr-ft-wt,
662
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt));
663
- font-style: var(--_sf-hr-ft-se-ic,
664
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic));
665
- text-align: var(--_sf-hr-tt-an,
666
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an));
667
- letter-spacing: var(--_sf-hr-lr-sg,
668
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg));
669
- line-height: var(--_sf-hr-le-ht,
670
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht-dc));
671
- text-decoration: var(--_sf-hr-ue,
672
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue));
854
+ font-size: var(
855
+ --_sf-hr-ft-se,
856
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se)
857
+ );
858
+ font-weight: var(
859
+ --_sf-hr-ft-wt,
860
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt)
861
+ );
862
+ font-style: var(
863
+ --_sf-hr-ft-se-ic,
864
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic)
865
+ );
866
+ text-align: var(
867
+ --_sf-hr-tt-an,
868
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an)
869
+ );
870
+ letter-spacing: var(
871
+ --_sf-hr-lr-sg,
872
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg)
873
+ );
874
+ line-height: var(
875
+ --_sf-hr-le-ht,
876
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht-dc)
877
+ );
878
+ text-decoration: var(
879
+ --_sf-hr-ue,
880
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue)
881
+ );
673
882
 
674
883
  &[data-background-shape="circle"] {
675
884
  border-radius: 50%;
676
885
  }
677
-
678
886
  &[data-background-shape="square"] {
679
887
  border-radius: 5px;
680
888
  }
681
-
682
889
  &[data-background-shape="capsule"] {
683
- border-radius: 40px;
684
- /* Full pill shape */
890
+ border-radius: 40px; /* Full pill shape */
685
891
  box-sizing: border-box;
686
892
  }
687
893
 
688
894
  &:hover {
689
- --_sf-hr-bd-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-bd-cr,
690
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-se-on-ve-se-hr-se-bd-cr)));
691
- --_sf-hr-br-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-cr,
692
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-cr, var(--_ctm-dn-se-on-ve-se-hr-se-br-cr)));
693
- --_sf-hr-br-se: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-se,
694
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-se, var(--_ctm-dn-se-on-ve-se-hr-se-br-se)));
695
- --_sf-hr-br-wh: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-wh,
696
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-wh, var(--_ctm-dn-se-on-ve-se-hr-se-br-wh)));
697
- --_sf-hr-br-bs: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-rs,
698
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-rs, var(--_ctm-dn-se-on-ve-se-hr-se-br-rs)));
895
+ --_sf-hr-bd-cr: var(
896
+ --_ctm-mob-dn-se-on-ve-se-hr-se-bd-cr,
897
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-se-on-ve-se-hr-se-bd-cr))
898
+ );
899
+ --_sf-hr-br-cr: var(
900
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-cr,
901
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-cr, var(--_ctm-dn-se-on-ve-se-hr-se-br-cr))
902
+ );
903
+ --_sf-hr-br-se: var(
904
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-se,
905
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-se, var(--_ctm-dn-se-on-ve-se-hr-se-br-se))
906
+ );
907
+ --_sf-hr-br-wh: var(
908
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-wh,
909
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-wh, var(--_ctm-dn-se-on-ve-se-hr-se-br-wh))
910
+ );
911
+ --_sf-hr-br-bs: var(
912
+ --_ctm-mob-dn-se-on-ve-se-hr-se-br-rs,
913
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-rs, var(--_ctm-dn-se-on-ve-se-hr-se-br-rs))
914
+ );
699
915
 
700
916
  // new
701
- --_sf-hr-sw-ae: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-ae,
702
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-se-on-ve-se-hr-se-sw-ae)));
703
- --_sf-hr-sw-br: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-br,
704
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-br, var(--_ctm-dn-se-on-ve-se-hr-se-sw-br)));
705
- --_sf-hr-sw-hr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-hr,
706
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-hr)));
707
- --_sf-hr-sw-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-cr,
708
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-cr)));
917
+ --_sf-hr-sw-ae: var(
918
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-ae,
919
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-se-on-ve-se-hr-se-sw-ae))
920
+ );
921
+ --_sf-hr-sw-br: var(
922
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-br,
923
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-br, var(--_ctm-dn-se-on-ve-se-hr-se-sw-br))
924
+ );
925
+ --_sf-hr-sw-hr: var(
926
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-hr,
927
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-hr))
928
+ );
929
+ --_sf-hr-sw-cr: var(
930
+ --_ctm-mob-dn-se-on-ve-se-hr-se-sw-cr,
931
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-cr))
932
+ );
709
933
 
710
934
  // for font
711
935
 
712
- --_sf-hr-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-cr,
713
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-cr, var(--_ctm-dn-se-on-ve-se-hr-se-cr)));
714
- --_sf-hr-ft-fy: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-fy,
715
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-fy, var(--_ctm-dn-se-on-ve-se-hr-se-ft-fy)));
716
- --_sf-hr-tt-tm: var(--_ctm-mob-dn-se-on-ve-se-hr-se-tt-tm,
717
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-tm, var(--_ctm-dn-se-on-ve-se-hr-se-tt-tm)));
718
- --_sf-hr-wd-wp: var(--_ctm-mob-dn-se-on-ve-se-hr-se-wd-wp,
719
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-wp, var(--_ctm-dn-se-on-ve-se-hr-se-wd-wp)));
720
- --_sf-hr-wd-bk: var(--_ctm-mob-dn-se-on-ve-se-hr-se-wd-bk,
721
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-bk, var(--_ctm-dn-se-on-ve-se-hr-se-wd-bk)));
722
- --_sf-hr-ft-se: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-se,
723
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-se, var(--_ctm-dn-se-on-ve-se-hr-se-ft-se)));
724
- --_sf-hr-ft-wt: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-wt,
725
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-wt, var(--_ctm-dn-se-on-ve-se-hr-se-ft-wt)));
726
- --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-se-ic,
727
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-se-ic,
728
- var(--_ctm-dn-se-on-ve-se-hr-se-ft-se-ic)));
729
- --_sf-hr-tt-an: var(--_ctm-mob-dn-se-on-ve-se-hr-se-tt-an,
730
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-an, var(--_ctm-dn-se-on-ve-se-hr-se-tt-an)));
731
- --_sf-hr-lr-sg: var(--_ctm-mob-dn-se-on-ve-se-hr-se-lr-sg,
732
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-lr-sg, var(--_ctm-dn-se-on-ve-se-hr-se-lr-sg)));
733
- --_sf-hr-le-ht: var(--_ctm-mob-dn-se-on-ve-se-hr-se-le-ht,
734
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-le-ht, var(--_ctm-dn-se-on-ve-se-hr-se-le-ht)));
735
-
736
- --_sf-hr-ue: var(--_ctm-mob-dn-on-ve-se-hr-se-ue,
737
- var(--_ctm-tab-dn-on-ve-se-hr-se-ue, var(--_ctm-dn-on-ve-se-hr-se-ue)));
936
+ --_sf-hr-cr: var(
937
+ --_ctm-mob-dn-se-on-ve-se-hr-se-cr,
938
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-cr, var(--_ctm-dn-se-on-ve-se-hr-se-cr))
939
+ );
940
+ --_sf-hr-ft-fy: var(
941
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-fy,
942
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-fy, var(--_ctm-dn-se-on-ve-se-hr-se-ft-fy))
943
+ );
944
+ --_sf-hr-tt-tm: var(
945
+ --_ctm-mob-dn-se-on-ve-se-hr-se-tt-tm,
946
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-tm, var(--_ctm-dn-se-on-ve-se-hr-se-tt-tm))
947
+ );
948
+ --_sf-hr-wd-wp: var(
949
+ --_ctm-mob-dn-se-on-ve-se-hr-se-wd-wp,
950
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-wp, var(--_ctm-dn-se-on-ve-se-hr-se-wd-wp))
951
+ );
952
+ --_sf-hr-wd-bk: var(
953
+ --_ctm-mob-dn-se-on-ve-se-hr-se-wd-bk,
954
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-bk, var(--_ctm-dn-se-on-ve-se-hr-se-wd-bk))
955
+ );
956
+ --_sf-hr-ft-se: var(
957
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-se,
958
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-se, var(--_ctm-dn-se-on-ve-se-hr-se-ft-se))
959
+ );
960
+ --_sf-hr-ft-wt: var(
961
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-wt,
962
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-wt, var(--_ctm-dn-se-on-ve-se-hr-se-ft-wt))
963
+ );
964
+ --_sf-hr-ft-se-ic: var(
965
+ --_ctm-mob-dn-se-on-ve-se-hr-se-ft-se-ic,
966
+ var(
967
+ --_ctm-tab-dn-se-on-ve-se-hr-se-ft-se-ic,
968
+ var(--_ctm-dn-se-on-ve-se-hr-se-ft-se-ic)
969
+ )
970
+ );
971
+ --_sf-hr-tt-an: var(
972
+ --_ctm-mob-dn-se-on-ve-se-hr-se-tt-an,
973
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-an, var(--_ctm-dn-se-on-ve-se-hr-se-tt-an))
974
+ );
975
+ --_sf-hr-lr-sg: var(
976
+ --_ctm-mob-dn-se-on-ve-se-hr-se-lr-sg,
977
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-lr-sg, var(--_ctm-dn-se-on-ve-se-hr-se-lr-sg))
978
+ );
979
+ --_sf-hr-le-ht: var(
980
+ --_ctm-mob-dn-se-on-ve-se-hr-se-le-ht,
981
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-le-ht, var(--_ctm-dn-se-on-ve-se-hr-se-le-ht))
982
+ );
983
+
984
+ --_sf-hr-ue: var(
985
+ --_ctm-mob-dn-on-ve-se-hr-se-ue,
986
+ var(--_ctm-tab-dn-on-ve-se-hr-se-ue, var(--_ctm-dn-on-ve-se-hr-se-ue))
987
+ );
738
988
  }
739
989
 
740
990
  &.child {
@@ -742,102 +992,179 @@ $minWidth: 70px;
742
992
  border-radius: 0;
743
993
  border-bottom: 2px solid var(--_gray-200);
744
994
  }
745
-
746
995
  &[data-selected="true"] {
747
- --_sf-sd-bd-cr: var(--_ctm-mob-dn-se-on-ve-se-sd-se-bd-cr,
748
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-se-on-ve-se-sd-se-bd-cr)));
749
- --_sf-sd-br-cr: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-cr,
750
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-cr, var(--_ctm-dn-se-on-ve-se-sd-se-br-cr)));
751
- --_sf-sd-br-se: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-se,
752
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-se, var(--_ctm-dn-se-on-ve-se-sd-se-br-se)));
753
- --_sf-sd-br-wh: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-wh,
754
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-wh, var(--_ctm-dn-se-on-ve-se-sd-se-br-wh)));
755
- --_sf-sd-br-bs: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-rs,
756
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-rs, var(--_ctm-dn-se-on-ve-se-sd-se-br-rs)));
996
+ --_sf-sd-bd-cr: var(
997
+ --_ctm-mob-dn-se-on-ve-se-sd-se-bd-cr,
998
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-se-on-ve-se-sd-se-bd-cr))
999
+ );
1000
+ --_sf-sd-br-cr: var(
1001
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-cr,
1002
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-cr, var(--_ctm-dn-se-on-ve-se-sd-se-br-cr))
1003
+ );
1004
+ --_sf-sd-br-se: var(
1005
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-se,
1006
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-se, var(--_ctm-dn-se-on-ve-se-sd-se-br-se))
1007
+ );
1008
+ --_sf-sd-br-wh: var(
1009
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-wh,
1010
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-wh, var(--_ctm-dn-se-on-ve-se-sd-se-br-wh))
1011
+ );
1012
+ --_sf-sd-br-bs: var(
1013
+ --_ctm-mob-dn-se-on-ve-se-sd-se-br-rs,
1014
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-rs, var(--_ctm-dn-se-on-ve-se-sd-se-br-rs))
1015
+ );
757
1016
 
758
1017
  // new
759
- --_sf-sd-sw-ae: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
760
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-se-on-ve-se-sd-se-sw-ae)));
761
- --_sf-sd-sw-br: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-br,
762
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-br, var(--_ctm-dn-se-on-ve-se-sd-se-sw-br)));
763
- --_sf-sd-sw-hr: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-hr,
764
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-hr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-hr)));
765
- --_sf-sd-sw-cr: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
766
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-cr)));
1018
+ --_sf-sd-sw-ae: var(
1019
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
1020
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-se-on-ve-se-sd-se-sw-ae))
1021
+ );
1022
+ --_sf-sd-sw-br: var(
1023
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-br,
1024
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-br, var(--_ctm-dn-se-on-ve-se-sd-se-sw-br))
1025
+ );
1026
+ --_sf-sd-sw-hr: var(
1027
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-hr,
1028
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-hr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-hr))
1029
+ );
1030
+ --_sf-sd-sw-cr: var(
1031
+ --_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
1032
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-cr))
1033
+ );
767
1034
 
768
1035
  // for font
769
1036
 
770
- --_sf-sd-cr: var(--_ctm-mob-dn-se-on-ve-se-sd-se-cr,
771
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-cr, var(--_ctm-dn-se-on-ve-se-sd-se-cr)));
772
- --_sf-sd-ft-fy: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-fy,
773
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-fy, var(--_ctm-dn-se-on-ve-se-sd-se-ft-fy)));
774
- --_sf-sd-tt-tm: var(--_ctm-mob-dn-se-on-ve-se-sd-se-tt-tm,
775
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-tm, var(--_ctm-dn-se-on-ve-se-sd-se-tt-tm)));
776
- --_sf-sd-wd-wp: var(--_ctm-mob-dn-se-on-ve-se-sd-se-wd-wp,
777
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-wp, var(--_ctm-dn-se-on-ve-se-sd-se-wd-wp)));
778
- --_sf-sd-wd-bk: var(--_ctm-mob-dn-se-on-ve-se-sd-se-wd-bk,
779
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-bk, var(--_ctm-dn-se-on-ve-se-sd-se-wd-bk)));
780
- --_sf-sd-ft-se: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-se,
781
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-se, var(--_ctm-dn-se-on-ve-se-sd-se-ft-se)));
782
- --_sf-sd-ft-wt: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-wt,
783
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-wt, var(--_ctm-dn-se-on-ve-se-sd-se-ft-wt)));
784
- --_sf-sd-ft-se-ic: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-se-ic,
785
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-se-ic,
786
- var(--_ctm-dn-se-on-ve-se-sd-se-ft-se-ic)));
787
- --_sf-sd-tt-an: var(--_ctm-mob-dn-se-on-ve-se-sd-se-tt-an,
788
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-an, var(--_ctm-dn-se-on-ve-se-sd-se-tt-an)));
789
- --_sf-sd-lr-sg: var(--_ctm-mob-dn-se-on-ve-se-sd-se-lr-sg,
790
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-lr-sg, var(--_ctm-dn-se-on-ve-se-sd-se-lr-sg)));
791
- --_sf-sd-le-ht: var(--_ctm-mob-dn-se-on-ve-se-sd-se-le-ht,
792
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-le-ht, var(--_ctm-dn-se-on-ve-se-sd-se-le-ht)));
793
-
794
- --_sf-sd-ue: var(--_ctm-mob-dn-on-ve-se-sd-se-ue,
795
- var(--_ctm-tab-dn-on-ve-se-sd-se-ue, var(--_ctm-dn-on-ve-se-sd-se-ue)));
796
-
797
- border-color: var(--_sf-sd-br-cr,
798
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr));
799
-
800
- background-color: var(--_sf-sd-bd-cr,
801
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr));
802
- border-style: var(--_sf-sd-br-se,
803
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se));
804
- border-width: var(--_sf-sd-br-wh,
805
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh));
806
-
807
- box-shadow: var(--_sf-sd-sw-ae,
808
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-ae)) var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-br)) var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-sd)) var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-cr));
1037
+ --_sf-sd-cr: var(
1038
+ --_ctm-mob-dn-se-on-ve-se-sd-se-cr,
1039
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-cr, var(--_ctm-dn-se-on-ve-se-sd-se-cr))
1040
+ );
1041
+ --_sf-sd-ft-fy: var(
1042
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-fy,
1043
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-fy, var(--_ctm-dn-se-on-ve-se-sd-se-ft-fy))
1044
+ );
1045
+ --_sf-sd-tt-tm: var(
1046
+ --_ctm-mob-dn-se-on-ve-se-sd-se-tt-tm,
1047
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-tm, var(--_ctm-dn-se-on-ve-se-sd-se-tt-tm))
1048
+ );
1049
+ --_sf-sd-wd-wp: var(
1050
+ --_ctm-mob-dn-se-on-ve-se-sd-se-wd-wp,
1051
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-wp, var(--_ctm-dn-se-on-ve-se-sd-se-wd-wp))
1052
+ );
1053
+ --_sf-sd-wd-bk: var(
1054
+ --_ctm-mob-dn-se-on-ve-se-sd-se-wd-bk,
1055
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-bk, var(--_ctm-dn-se-on-ve-se-sd-se-wd-bk))
1056
+ );
1057
+ --_sf-sd-ft-se: var(
1058
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-se,
1059
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-se, var(--_ctm-dn-se-on-ve-se-sd-se-ft-se))
1060
+ );
1061
+ --_sf-sd-ft-wt: var(
1062
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-wt,
1063
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-wt, var(--_ctm-dn-se-on-ve-se-sd-se-ft-wt))
1064
+ );
1065
+ --_sf-sd-ft-se-ic: var(
1066
+ --_ctm-mob-dn-se-on-ve-se-sd-se-ft-se-ic,
1067
+ var(
1068
+ --_ctm-tab-dn-se-on-ve-se-sd-se-ft-se-ic,
1069
+ var(--_ctm-dn-se-on-ve-se-sd-se-ft-se-ic)
1070
+ )
1071
+ );
1072
+ --_sf-sd-tt-an: var(
1073
+ --_ctm-mob-dn-se-on-ve-se-sd-se-tt-an,
1074
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-an, var(--_ctm-dn-se-on-ve-se-sd-se-tt-an))
1075
+ );
1076
+ --_sf-sd-lr-sg: var(
1077
+ --_ctm-mob-dn-se-on-ve-se-sd-se-lr-sg,
1078
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-lr-sg, var(--_ctm-dn-se-on-ve-se-sd-se-lr-sg))
1079
+ );
1080
+ --_sf-sd-le-ht: var(
1081
+ --_ctm-mob-dn-se-on-ve-se-sd-se-le-ht,
1082
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-le-ht, var(--_ctm-dn-se-on-ve-se-sd-se-le-ht))
1083
+ );
1084
+
1085
+ --_sf-sd-ue: var(
1086
+ --_ctm-mob-dn-on-ve-se-sd-se-ue,
1087
+ var(--_ctm-tab-dn-on-ve-se-sd-se-ue, var(--_ctm-dn-on-ve-se-sd-se-ue))
1088
+ );
1089
+
1090
+ border-color: var(
1091
+ --_sf-sd-br-cr,
1092
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr)
1093
+ );
1094
+
1095
+ background-color: var(
1096
+ --_sf-sd-bd-cr,
1097
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr)
1098
+ );
1099
+ border-style: var(
1100
+ --_sf-sd-br-se,
1101
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se)
1102
+ );
1103
+ border-width: var(
1104
+ --_sf-sd-br-wh,
1105
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh)
1106
+ );
1107
+
1108
+ box-shadow: var(
1109
+ --_sf-sd-sw-ae,
1110
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-ae)
1111
+ )
1112
+ var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-br))
1113
+ var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-sd))
1114
+ var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-cr));
809
1115
  // font is pending
810
1116
 
811
1117
  color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-cr));
812
- font-family: var(--_sf-sd-ft-fy,
813
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy));
814
- text-transform: var(--_sf-sd-tt-tm,
815
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm));
816
- word-wrap: var(--_sf-sd-wd-wp,
817
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp));
818
- word-break: var(--_sf-sd-wd-bk,
819
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk));
820
- font-size: var(--_sf-sd-ft-se,
821
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se));
822
- font-weight: var(--_sf-sd-ft-wt,
823
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt));
824
- font-style: var(--_sf-sd-ft-se-ic,
825
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic));
826
- text-align: var(--_sf-sd-tt-an,
827
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an));
828
- letter-spacing: var(--_sf-sd-lr-sg,
829
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg));
830
- line-height: var(--_sf-sd-le-ht,
831
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht-dc));
832
- text-decoration: var(--_sf-sd-ue,
833
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue));
1118
+ font-family: var(
1119
+ --_sf-sd-ft-fy,
1120
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)
1121
+ );
1122
+ text-transform: var(
1123
+ --_sf-sd-tt-tm,
1124
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm)
1125
+ );
1126
+ word-wrap: var(
1127
+ --_sf-sd-wd-wp,
1128
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp)
1129
+ );
1130
+ word-break: var(
1131
+ --_sf-sd-wd-bk,
1132
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk)
1133
+ );
1134
+ font-size: var(
1135
+ --_sf-sd-ft-se,
1136
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se)
1137
+ );
1138
+ font-weight: var(
1139
+ --_sf-sd-ft-wt,
1140
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt)
1141
+ );
1142
+ font-style: var(
1143
+ --_sf-sd-ft-se-ic,
1144
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic)
1145
+ );
1146
+ text-align: var(
1147
+ --_sf-sd-tt-an,
1148
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an)
1149
+ );
1150
+ letter-spacing: var(
1151
+ --_sf-sd-lr-sg,
1152
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg)
1153
+ );
1154
+ line-height: var(
1155
+ --_sf-sd-le-ht,
1156
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht-dc)
1157
+ );
1158
+ text-decoration: var(
1159
+ --_sf-sd-ue,
1160
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue)
1161
+ );
834
1162
  }
835
1163
 
836
1164
  &.selected__child {
837
1165
  border: 0px;
838
1166
  border-bottom: 2px solid var(--_primary-400);
839
1167
  }
840
-
841
1168
  // &.disabled {
842
1169
  // cursor: not-allowed;
843
1170
  // opacity: 0.4;
@@ -890,7 +1217,6 @@ $minWidth: 70px;
890
1217
  }
891
1218
  }
892
1219
  }
893
-
894
1220
  &[data-show-divider="true"] {
895
1221
  &:not(:last-child)::after {
896
1222
  content: "";
@@ -899,38 +1225,64 @@ $minWidth: 70px;
899
1225
  height: 1px;
900
1226
  width: 100%;
901
1227
  display: flex;
902
- top: calc(calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px) / 2);
1228
+ top: calc(
1229
+ calc(
1230
+ var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px
1231
+ ) /
1232
+ 2
1233
+ );
903
1234
  }
904
1235
  }
905
1236
 
906
1237
  .title {
907
1238
  margin-bottom: 4px;
908
1239
  color: var(--_ctm-mob-dn-on-te-cr, var(--_ctm-tab-dn-on-te-cr, var(--_ctm-dn-on-te-cr)));
909
- font-family: var(--_ctm-mob-dn-on-te-ft-fy,
910
- var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy)));
911
- text-transform: var(--_ctm-mob-dn-on-te-tt-tm,
912
- var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm)));
913
- word-wrap: var(--_ctm-mob-dn-on-te-wd-wp,
914
- var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp)));
915
- word-break: var(--_ctm-mob-dn-on-te-wd-bk,
916
- var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk)));
917
- font-size: var(--_ctm-mob-dn-on-te-ft-se,
918
- var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se)));
919
- font-weight: var(--_ctm-mob-dn-on-te-ft-wt,
920
- var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt)));
921
- font-style: var(--_ctm-mob-dn-on-te-ft-se-ic,
922
- var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic)));
923
- text-align: var(--_ctm-mob-dn-on-te-tt-an,
924
- var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an)));
925
- letter-spacing: var(--_ctm-mob-dn-on-te-lr-sg,
926
- var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg)));
927
- line-height: var(--_ctm-mob-dn-on-te-le-ht,
928
- var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht)));
929
- text-decoration: var(--_ctm-mob-dn-on-te-ue,
930
- var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue)));
1240
+ font-family: var(
1241
+ --_ctm-mob-dn-on-te-ft-fy,
1242
+ var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))
1243
+ );
1244
+ text-transform: var(
1245
+ --_ctm-mob-dn-on-te-tt-tm,
1246
+ var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm))
1247
+ );
1248
+ word-wrap: var(
1249
+ --_ctm-mob-dn-on-te-wd-wp,
1250
+ var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp))
1251
+ );
1252
+ word-break: var(
1253
+ --_ctm-mob-dn-on-te-wd-bk,
1254
+ var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk))
1255
+ );
1256
+ font-size: var(
1257
+ --_ctm-mob-dn-on-te-ft-se,
1258
+ var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se))
1259
+ );
1260
+ font-weight: var(
1261
+ --_ctm-mob-dn-on-te-ft-wt,
1262
+ var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt))
1263
+ );
1264
+ font-style: var(
1265
+ --_ctm-mob-dn-on-te-ft-se-ic,
1266
+ var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic))
1267
+ );
1268
+ text-align: var(
1269
+ --_ctm-mob-dn-on-te-tt-an,
1270
+ var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an))
1271
+ );
1272
+ letter-spacing: var(
1273
+ --_ctm-mob-dn-on-te-lr-sg,
1274
+ var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg))
1275
+ );
1276
+ line-height: var(
1277
+ --_ctm-mob-dn-on-te-le-ht,
1278
+ var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht))
1279
+ );
1280
+ text-decoration: var(
1281
+ --_ctm-mob-dn-on-te-ue,
1282
+ var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue))
1283
+ );
931
1284
  }
932
1285
  }
933
-
934
1286
  //Dropdown
935
1287
  //Dropdown
936
1288
  .language__conatiner {
@@ -938,98 +1290,188 @@ $minWidth: 70px;
938
1290
 
939
1291
  // Option hover state custom properties (no inherit fallback — must be guaranteed-invalid when unset)
940
1292
  .option:hover {
941
- --_sf-hr-bd-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-bd-cr,
942
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-bd-cr, var(--_ctm-dn-dn-se-im-se-hr-se-bd-cr)));
943
- --_sf-hr-br-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-cr,
944
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-cr, var(--_ctm-dn-dn-se-im-se-hr-se-br-cr)));
945
- --_sf-hr-br-se: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-se,
946
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-se, var(--_ctm-dn-dn-se-im-se-hr-se-br-se)));
947
- --_sf-hr-br-wh: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-wh,
948
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-wh, var(--_ctm-dn-dn-se-im-se-hr-se-br-wh)));
949
- --_sf-hr-br-rs: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-rs,
950
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-rs, var(--_ctm-dn-dn-se-im-se-hr-se-br-rs)));
951
- --_sf-hr-sw-ae: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-ae,
952
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-ae, var(--_ctm-dn-dn-se-im-se-hr-se-sw-ae)));
953
- --_sf-hr-sw-br: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-br,
954
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-br, var(--_ctm-dn-dn-se-im-se-hr-se-sw-br)));
955
- --_sf-hr-sw-sd: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-sd,
956
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-sd, var(--_ctm-dn-dn-se-im-se-hr-se-sw-sd)));
957
- --_sf-hr-sw-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-cr,
958
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-cr, var(--_ctm-dn-dn-se-im-se-hr-se-sw-cr)));
959
- --_sf-hr-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-cr,
960
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-cr, var(--_ctm-dn-dn-se-im-se-hr-se-cr)));
961
- --_sf-hr-ft-fy: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-fy,
962
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-fy, var(--_ctm-dn-dn-se-im-se-hr-se-ft-fy)));
963
- --_sf-hr-tt-tm: var(--_ctm-mob-dn-dn-se-im-se-hr-se-tt-tm,
964
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-tm, var(--_ctm-dn-dn-se-im-se-hr-se-tt-tm)));
965
- --_sf-hr-wd-wp: var(--_ctm-mob-dn-dn-se-im-se-hr-se-wd-wp,
966
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-wp, var(--_ctm-dn-dn-se-im-se-hr-se-wd-wp)));
967
- --_sf-hr-wd-bk: var(--_ctm-mob-dn-dn-se-im-se-hr-se-wd-bk,
968
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-bk, var(--_ctm-dn-dn-se-im-se-hr-se-wd-bk)));
969
- --_sf-hr-ft-se: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-se,
970
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-se, var(--_ctm-dn-dn-se-im-se-hr-se-ft-se)));
971
- --_sf-hr-ft-wt: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-wt,
972
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-wt, var(--_ctm-dn-dn-se-im-se-hr-se-ft-wt)));
973
- --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-se-ic,
974
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-se-ic,
975
- var(--_ctm-dn-dn-se-im-se-hr-se-ft-se-ic)));
976
- --_sf-hr-tt-an: var(--_ctm-mob-dn-dn-se-im-se-hr-se-tt-an,
977
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-an, var(--_ctm-dn-dn-se-im-se-hr-se-tt-an)));
978
- --_sf-hr-lr-sg: var(--_ctm-mob-dn-dn-se-im-se-hr-se-lr-sg,
979
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-lr-sg, var(--_ctm-dn-dn-se-im-se-hr-se-lr-sg)));
980
- --_sf-hr-le-ht: var(--_ctm-mob-dn-dn-se-im-se-hr-se-le-ht,
981
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-le-ht, var(--_ctm-dn-dn-se-im-se-hr-se-le-ht)));
982
- --_sf-hr-ue: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ue,
983
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ue, var(--_ctm-dn-dn-se-im-se-hr-se-ue)));
984
- --_sf-hr-pg: var(--_ctm-mob-dn-dn-se-im-se-hr-se-pg,
985
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-pg, var(--_ctm-dn-dn-se-im-se-hr-se-pg)));
1293
+ --_sf-hr-bd-cr: var(
1294
+ --_ctm-mob-dn-dn-se-im-se-hr-se-bd-cr,
1295
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-bd-cr, var(--_ctm-dn-dn-se-im-se-hr-se-bd-cr))
1296
+ );
1297
+ --_sf-hr-br-cr: var(
1298
+ --_ctm-mob-dn-dn-se-im-se-hr-se-br-cr,
1299
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-cr, var(--_ctm-dn-dn-se-im-se-hr-se-br-cr))
1300
+ );
1301
+ --_sf-hr-br-se: var(
1302
+ --_ctm-mob-dn-dn-se-im-se-hr-se-br-se,
1303
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-se, var(--_ctm-dn-dn-se-im-se-hr-se-br-se))
1304
+ );
1305
+ --_sf-hr-br-wh: var(
1306
+ --_ctm-mob-dn-dn-se-im-se-hr-se-br-wh,
1307
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-wh, var(--_ctm-dn-dn-se-im-se-hr-se-br-wh))
1308
+ );
1309
+ --_sf-hr-br-rs: var(
1310
+ --_ctm-mob-dn-dn-se-im-se-hr-se-br-rs,
1311
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-rs, var(--_ctm-dn-dn-se-im-se-hr-se-br-rs))
1312
+ );
1313
+ --_sf-hr-sw-ae: var(
1314
+ --_ctm-mob-dn-dn-se-im-se-hr-se-sw-ae,
1315
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-ae, var(--_ctm-dn-dn-se-im-se-hr-se-sw-ae))
1316
+ );
1317
+ --_sf-hr-sw-br: var(
1318
+ --_ctm-mob-dn-dn-se-im-se-hr-se-sw-br,
1319
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-br, var(--_ctm-dn-dn-se-im-se-hr-se-sw-br))
1320
+ );
1321
+ --_sf-hr-sw-sd: var(
1322
+ --_ctm-mob-dn-dn-se-im-se-hr-se-sw-sd,
1323
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-sd, var(--_ctm-dn-dn-se-im-se-hr-se-sw-sd))
1324
+ );
1325
+ --_sf-hr-sw-cr: var(
1326
+ --_ctm-mob-dn-dn-se-im-se-hr-se-sw-cr,
1327
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-cr, var(--_ctm-dn-dn-se-im-se-hr-se-sw-cr))
1328
+ );
1329
+ --_sf-hr-cr: var(
1330
+ --_ctm-mob-dn-dn-se-im-se-hr-se-cr,
1331
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-cr, var(--_ctm-dn-dn-se-im-se-hr-se-cr))
1332
+ );
1333
+ --_sf-hr-ft-fy: var(
1334
+ --_ctm-mob-dn-dn-se-im-se-hr-se-ft-fy,
1335
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-fy, var(--_ctm-dn-dn-se-im-se-hr-se-ft-fy))
1336
+ );
1337
+ --_sf-hr-tt-tm: var(
1338
+ --_ctm-mob-dn-dn-se-im-se-hr-se-tt-tm,
1339
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-tm, var(--_ctm-dn-dn-se-im-se-hr-se-tt-tm))
1340
+ );
1341
+ --_sf-hr-wd-wp: var(
1342
+ --_ctm-mob-dn-dn-se-im-se-hr-se-wd-wp,
1343
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-wp, var(--_ctm-dn-dn-se-im-se-hr-se-wd-wp))
1344
+ );
1345
+ --_sf-hr-wd-bk: var(
1346
+ --_ctm-mob-dn-dn-se-im-se-hr-se-wd-bk,
1347
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-bk, var(--_ctm-dn-dn-se-im-se-hr-se-wd-bk))
1348
+ );
1349
+ --_sf-hr-ft-se: var(
1350
+ --_ctm-mob-dn-dn-se-im-se-hr-se-ft-se,
1351
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-se, var(--_ctm-dn-dn-se-im-se-hr-se-ft-se))
1352
+ );
1353
+ --_sf-hr-ft-wt: var(
1354
+ --_ctm-mob-dn-dn-se-im-se-hr-se-ft-wt,
1355
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-wt, var(--_ctm-dn-dn-se-im-se-hr-se-ft-wt))
1356
+ );
1357
+ --_sf-hr-ft-se-ic: var(
1358
+ --_ctm-mob-dn-dn-se-im-se-hr-se-ft-se-ic,
1359
+ var(
1360
+ --_ctm-tab-dn-dn-se-im-se-hr-se-ft-se-ic,
1361
+ var(--_ctm-dn-dn-se-im-se-hr-se-ft-se-ic)
1362
+ )
1363
+ );
1364
+ --_sf-hr-tt-an: var(
1365
+ --_ctm-mob-dn-dn-se-im-se-hr-se-tt-an,
1366
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-an, var(--_ctm-dn-dn-se-im-se-hr-se-tt-an))
1367
+ );
1368
+ --_sf-hr-lr-sg: var(
1369
+ --_ctm-mob-dn-dn-se-im-se-hr-se-lr-sg,
1370
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-lr-sg, var(--_ctm-dn-dn-se-im-se-hr-se-lr-sg))
1371
+ );
1372
+ --_sf-hr-le-ht: var(
1373
+ --_ctm-mob-dn-dn-se-im-se-hr-se-le-ht,
1374
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-le-ht, var(--_ctm-dn-dn-se-im-se-hr-se-le-ht))
1375
+ );
1376
+ --_sf-hr-ue: var(
1377
+ --_ctm-mob-dn-dn-se-im-se-hr-se-ue,
1378
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ue, var(--_ctm-dn-dn-se-im-se-hr-se-ue))
1379
+ );
1380
+ --_sf-hr-pg: var(
1381
+ --_ctm-mob-dn-dn-se-im-se-hr-se-pg,
1382
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-pg, var(--_ctm-dn-dn-se-im-se-hr-se-pg))
1383
+ );
986
1384
  }
987
1385
 
988
1386
  // Option selected state custom properties (no inherit fallback — must be guaranteed-invalid when unset)
989
1387
  .option[data-selected="true"] {
990
- --_sf-sd-bd-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-bd-cr,
991
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-bd-cr, var(--_ctm-dn-dn-se-im-se-sd-se-bd-cr)));
992
- --_sf-sd-br-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-br-cr,
993
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-cr, var(--_ctm-dn-dn-se-im-se-sd-se-br-cr)));
994
- --_sf-sd-br-se: var(--_ctm-mob-dn-dn-se-im-se-sd-se-br-se,
995
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-se, var(--_ctm-dn-dn-se-im-se-sd-se-br-se)));
996
- --_sf-sd-br-wh: var(--_ctm-mob-dn-dn-se-im-se-sd-se-br-wh,
997
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-wh, var(--_ctm-dn-dn-se-im-se-sd-se-br-wh)));
998
- --_sf-sd-sw-ae: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-ae,
999
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-ae, var(--_ctm-dn-dn-se-im-se-sd-se-sw-ae)));
1000
- --_sf-sd-sw-br: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-br,
1001
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-br, var(--_ctm-dn-dn-se-im-se-sd-se-sw-br)));
1002
- --_sf-sd-sw-sd: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-sd,
1003
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-sd, var(--_ctm-dn-dn-se-im-se-sd-se-sw-sd)));
1004
- --_sf-sd-sw-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-cr,
1005
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-cr, var(--_ctm-dn-dn-se-im-se-sd-se-sw-cr)));
1006
- --_sf-sd-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-cr,
1007
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-cr, var(--_ctm-dn-dn-se-im-se-sd-se-cr)));
1008
- --_sf-sd-ft-fy: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-fy,
1009
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-fy, var(--_ctm-dn-dn-se-im-se-sd-se-ft-fy)));
1010
- --_sf-sd-tt-tm: var(--_ctm-mob-dn-dn-se-im-se-sd-se-tt-tm,
1011
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-tm, var(--_ctm-dn-dn-se-im-se-sd-se-tt-tm)));
1012
- --_sf-sd-wd-wp: var(--_ctm-mob-dn-dn-se-im-se-sd-se-wd-wp,
1013
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-wp, var(--_ctm-dn-dn-se-im-se-sd-se-wd-wp)));
1014
- --_sf-sd-wd-bk: var(--_ctm-mob-dn-dn-se-im-se-sd-se-wd-bk,
1015
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-bk, var(--_ctm-dn-dn-se-im-se-sd-se-wd-bk)));
1016
- --_sf-sd-ft-se: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-se,
1017
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-se, var(--_ctm-dn-dn-se-im-se-sd-se-ft-se)));
1018
- --_sf-sd-ft-wt: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-wt,
1019
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-wt, var(--_ctm-dn-dn-se-im-se-sd-se-ft-wt)));
1020
- --_sf-sd-ft-se-ic: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-se-ic,
1021
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-se-ic,
1022
- var(--_ctm-dn-dn-se-im-se-sd-se-ft-se-ic)));
1023
- --_sf-sd-tt-an: var(--_ctm-mob-dn-dn-se-im-se-sd-se-tt-an,
1024
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-an, var(--_ctm-dn-dn-se-im-se-sd-se-tt-an)));
1025
- --_sf-sd-lr-sg: var(--_ctm-mob-dn-dn-se-im-se-sd-se-lr-sg,
1026
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-lr-sg, var(--_ctm-dn-dn-se-im-se-sd-se-lr-sg)));
1027
- --_sf-sd-le-ht: var(--_ctm-mob-dn-dn-se-im-se-sd-se-le-ht,
1028
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-le-ht, var(--_ctm-dn-dn-se-im-se-sd-se-le-ht)));
1029
- --_sf-sd-ue: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ue,
1030
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ue, var(--_ctm-dn-dn-se-im-se-sd-se-ue)));
1031
- --_sf-sd-pg: var(--_ctm-mob-dn-dn-se-im-se-sd-se-pg,
1032
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-pg, var(--_ctm-dn-dn-se-im-se-sd-se-pg)));
1388
+ --_sf-sd-bd-cr: var(
1389
+ --_ctm-mob-dn-dn-se-im-se-sd-se-bd-cr,
1390
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-bd-cr, var(--_ctm-dn-dn-se-im-se-sd-se-bd-cr))
1391
+ );
1392
+ --_sf-sd-br-cr: var(
1393
+ --_ctm-mob-dn-dn-se-im-se-sd-se-br-cr,
1394
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-cr, var(--_ctm-dn-dn-se-im-se-sd-se-br-cr))
1395
+ );
1396
+ --_sf-sd-br-se: var(
1397
+ --_ctm-mob-dn-dn-se-im-se-sd-se-br-se,
1398
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-se, var(--_ctm-dn-dn-se-im-se-sd-se-br-se))
1399
+ );
1400
+ --_sf-sd-br-wh: var(
1401
+ --_ctm-mob-dn-dn-se-im-se-sd-se-br-wh,
1402
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-wh, var(--_ctm-dn-dn-se-im-se-sd-se-br-wh))
1403
+ );
1404
+ --_sf-sd-sw-ae: var(
1405
+ --_ctm-mob-dn-dn-se-im-se-sd-se-sw-ae,
1406
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-ae, var(--_ctm-dn-dn-se-im-se-sd-se-sw-ae))
1407
+ );
1408
+ --_sf-sd-sw-br: var(
1409
+ --_ctm-mob-dn-dn-se-im-se-sd-se-sw-br,
1410
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-br, var(--_ctm-dn-dn-se-im-se-sd-se-sw-br))
1411
+ );
1412
+ --_sf-sd-sw-sd: var(
1413
+ --_ctm-mob-dn-dn-se-im-se-sd-se-sw-sd,
1414
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-sd, var(--_ctm-dn-dn-se-im-se-sd-se-sw-sd))
1415
+ );
1416
+ --_sf-sd-sw-cr: var(
1417
+ --_ctm-mob-dn-dn-se-im-se-sd-se-sw-cr,
1418
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-cr, var(--_ctm-dn-dn-se-im-se-sd-se-sw-cr))
1419
+ );
1420
+ --_sf-sd-cr: var(
1421
+ --_ctm-mob-dn-dn-se-im-se-sd-se-cr,
1422
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-cr, var(--_ctm-dn-dn-se-im-se-sd-se-cr))
1423
+ );
1424
+ --_sf-sd-ft-fy: var(
1425
+ --_ctm-mob-dn-dn-se-im-se-sd-se-ft-fy,
1426
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-fy, var(--_ctm-dn-dn-se-im-se-sd-se-ft-fy))
1427
+ );
1428
+ --_sf-sd-tt-tm: var(
1429
+ --_ctm-mob-dn-dn-se-im-se-sd-se-tt-tm,
1430
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-tm, var(--_ctm-dn-dn-se-im-se-sd-se-tt-tm))
1431
+ );
1432
+ --_sf-sd-wd-wp: var(
1433
+ --_ctm-mob-dn-dn-se-im-se-sd-se-wd-wp,
1434
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-wp, var(--_ctm-dn-dn-se-im-se-sd-se-wd-wp))
1435
+ );
1436
+ --_sf-sd-wd-bk: var(
1437
+ --_ctm-mob-dn-dn-se-im-se-sd-se-wd-bk,
1438
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-bk, var(--_ctm-dn-dn-se-im-se-sd-se-wd-bk))
1439
+ );
1440
+ --_sf-sd-ft-se: var(
1441
+ --_ctm-mob-dn-dn-se-im-se-sd-se-ft-se,
1442
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-se, var(--_ctm-dn-dn-se-im-se-sd-se-ft-se))
1443
+ );
1444
+ --_sf-sd-ft-wt: var(
1445
+ --_ctm-mob-dn-dn-se-im-se-sd-se-ft-wt,
1446
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-wt, var(--_ctm-dn-dn-se-im-se-sd-se-ft-wt))
1447
+ );
1448
+ --_sf-sd-ft-se-ic: var(
1449
+ --_ctm-mob-dn-dn-se-im-se-sd-se-ft-se-ic,
1450
+ var(
1451
+ --_ctm-tab-dn-dn-se-im-se-sd-se-ft-se-ic,
1452
+ var(--_ctm-dn-dn-se-im-se-sd-se-ft-se-ic)
1453
+ )
1454
+ );
1455
+ --_sf-sd-tt-an: var(
1456
+ --_ctm-mob-dn-dn-se-im-se-sd-se-tt-an,
1457
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-an, var(--_ctm-dn-dn-se-im-se-sd-se-tt-an))
1458
+ );
1459
+ --_sf-sd-lr-sg: var(
1460
+ --_ctm-mob-dn-dn-se-im-se-sd-se-lr-sg,
1461
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-lr-sg, var(--_ctm-dn-dn-se-im-se-sd-se-lr-sg))
1462
+ );
1463
+ --_sf-sd-le-ht: var(
1464
+ --_ctm-mob-dn-dn-se-im-se-sd-se-le-ht,
1465
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-le-ht, var(--_ctm-dn-dn-se-im-se-sd-se-le-ht))
1466
+ );
1467
+ --_sf-sd-ue: var(
1468
+ --_ctm-mob-dn-dn-se-im-se-sd-se-ue,
1469
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ue, var(--_ctm-dn-dn-se-im-se-sd-se-ue))
1470
+ );
1471
+ --_sf-sd-pg: var(
1472
+ --_ctm-mob-dn-dn-se-im-se-sd-se-pg,
1473
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-pg, var(--_ctm-dn-dn-se-im-se-sd-se-pg))
1474
+ );
1033
1475
  }
1034
1476
 
1035
1477
  // Placeholder text
@@ -1087,7 +1529,10 @@ $minWidth: 70px;
1087
1529
  border-radius: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-br-rs);
1088
1530
 
1089
1531
  // Widget style — shadow
1090
- box-shadow: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-ae) prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-br) prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-sd) prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-cr);
1532
+ box-shadow: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-ae)
1533
+ prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-br)
1534
+ prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-sd)
1535
+ prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-cr);
1091
1536
 
1092
1537
  // Widget style — font
1093
1538
  color: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-cr);
@@ -1095,12 +1540,10 @@ $minWidth: 70px;
1095
1540
  text-transform: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-tt-tm);
1096
1541
  word-wrap: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-wd-wp);
1097
1542
  word-break: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-wd-bk);
1098
-
1099
1543
  &.flex__overflow {
1100
1544
  white-space: normal;
1101
1545
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
1102
1546
  }
1103
-
1104
1547
  font-size: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-ft-se);
1105
1548
  font-weight: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-ft-wt);
1106
1549
  font-style: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-ft-se-ic);
@@ -1121,18 +1564,14 @@ $minWidth: 70px;
1121
1564
  .est__dropdown__icon {
1122
1565
  transition: transform 0.4s ease-in-out;
1123
1566
  display: flex;
1124
-
1125
1567
  &.rotate__180 {
1126
1568
  transform: rotate(180deg);
1127
1569
  }
1128
-
1129
1570
  &.rotate__0 {
1130
1571
  transform: rotate(0deg);
1131
1572
  }
1132
-
1133
1573
  width: 16px;
1134
1574
  height: 16px;
1135
-
1136
1575
  svg {
1137
1576
  width: 100%;
1138
1577
  height: 100%;
@@ -1157,7 +1596,10 @@ $minWidth: 70px;
1157
1596
  border-color: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-br-cr);
1158
1597
  padding: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-pg);
1159
1598
  gap: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-im-gp);
1160
- box-shadow: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-ae) prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-br) prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-sd) prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-cr);
1599
+ box-shadow: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-ae)
1600
+ prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-br)
1601
+ prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-sd)
1602
+ prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-cr);
1161
1603
 
1162
1604
  &.top {
1163
1605
  bottom: 100%;
@@ -1191,52 +1633,93 @@ $minWidth: 70px;
1191
1633
 
1192
1634
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-pg));
1193
1635
  border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-cr));
1194
- background-color: var(--_sf-hr-bd-cr,
1195
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr));
1636
+ background-color: var(
1637
+ --_sf-hr-bd-cr,
1638
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr)
1639
+ );
1196
1640
  border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-se));
1197
- border-radius: var(--_sf-hr-br-rs,
1198
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs));
1641
+ border-radius: var(
1642
+ --_sf-hr-br-rs,
1643
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs)
1644
+ );
1199
1645
  border-width: var(--_sf-hr-br-wh, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-wh));
1200
1646
 
1201
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-cr));
1647
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-ae))
1648
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-br))
1649
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-sd))
1650
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-cr));
1202
1651
 
1203
1652
  &[data-selected="true"] {
1204
- border-color: var(--_sf-sd-br-cr,
1205
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-cr));
1206
- background-color: var(--_sf-sd-bd-cr,
1207
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr));
1208
- border-style: var(--_sf-sd-br-se,
1209
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-se));
1210
- border-width: var(--_sf-sd-br-wh,
1211
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-wh));
1212
- border-radius: var(--_sf-sd-br-rs,
1213
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs));
1214
- box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-ae)) var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-br)) var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-sd)) var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-cr));
1215
-
1653
+ border-color: var(
1654
+ --_sf-sd-br-cr,
1655
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-cr)
1656
+ );
1657
+ background-color: var(
1658
+ --_sf-sd-bd-cr,
1659
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr)
1660
+ );
1661
+ border-style: var(
1662
+ --_sf-sd-br-se,
1663
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-se)
1664
+ );
1665
+ border-width: var(
1666
+ --_sf-sd-br-wh,
1667
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-wh)
1668
+ );
1669
+ border-radius: var(
1670
+ --_sf-sd-br-rs,
1671
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs)
1672
+ );
1673
+ box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-ae))
1674
+ var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-br))
1675
+ var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-sd))
1676
+ var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-cr));
1216
1677
  .language__name {
1217
1678
  color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-cr));
1218
- font-family: var(--_sf-sd-ft-fy,
1219
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-fy));
1220
- text-transform: var(--_sf-sd-tt-tm,
1221
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-tm));
1222
- word-wrap: var(--_sf-sd-wd-wp,
1223
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-wp));
1224
- word-break: var(--_sf-sd-wd-bk,
1225
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-bk));
1226
- font-size: var(--_sf-sd-ft-se,
1227
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se));
1228
- font-weight: var(--_sf-sd-ft-wt,
1229
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-wt));
1230
- font-style: var(--_sf-sd-ft-se-ic,
1231
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic));
1232
- text-align: var(--_sf-sd-tt-an,
1233
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-an));
1234
- letter-spacing: var(--_sf-sd-lr-sg,
1235
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg));
1236
- line-height: var(--_sf-sd-le-ht,
1237
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-le-ht));
1238
- text-decoration: var(--_sf-sd-ue,
1239
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ue));
1679
+ font-family: var(
1680
+ --_sf-sd-ft-fy,
1681
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-fy)
1682
+ );
1683
+ text-transform: var(
1684
+ --_sf-sd-tt-tm,
1685
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-tm)
1686
+ );
1687
+ word-wrap: var(
1688
+ --_sf-sd-wd-wp,
1689
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-wp)
1690
+ );
1691
+ word-break: var(
1692
+ --_sf-sd-wd-bk,
1693
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-bk)
1694
+ );
1695
+ font-size: var(
1696
+ --_sf-sd-ft-se,
1697
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se)
1698
+ );
1699
+ font-weight: var(
1700
+ --_sf-sd-ft-wt,
1701
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-wt)
1702
+ );
1703
+ font-style: var(
1704
+ --_sf-sd-ft-se-ic,
1705
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic)
1706
+ );
1707
+ text-align: var(
1708
+ --_sf-sd-tt-an,
1709
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-an)
1710
+ );
1711
+ letter-spacing: var(
1712
+ --_sf-sd-lr-sg,
1713
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg)
1714
+ );
1715
+ line-height: var(
1716
+ --_sf-sd-le-ht,
1717
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-le-ht)
1718
+ );
1719
+ text-decoration: var(
1720
+ --_sf-sd-ue,
1721
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ue)
1722
+ );
1240
1723
  @include restrictToLinesShow(1);
1241
1724
  }
1242
1725
  }
@@ -1247,10 +1730,11 @@ $minWidth: 70px;
1247
1730
  display: flex;
1248
1731
  align-items: center;
1249
1732
  position: relative;
1250
-
1251
1733
  .language__name {
1252
- color: var(--_sf-hr-cr,
1253
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-cr));
1734
+ color: var(
1735
+ --_sf-hr-cr,
1736
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-cr)
1737
+ );
1254
1738
  @include restrictToLinesShow(1);
1255
1739
  }
1256
1740
  }
@@ -1263,13 +1747,19 @@ $minWidth: 70px;
1263
1747
  word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-bk));
1264
1748
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se));
1265
1749
  font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-wt));
1266
- font-style: var(--_sf-hr-ft-se-ic,
1267
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic));
1750
+ font-style: var(
1751
+ --_sf-hr-ft-se-ic,
1752
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic)
1753
+ );
1268
1754
  text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-an));
1269
- letter-spacing: var(--_sf-hr-lr-sg,
1270
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg));
1271
- line-height: var(--_sf-hr-le-ht,
1272
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-le-ht));
1755
+ letter-spacing: var(
1756
+ --_sf-hr-lr-sg,
1757
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg)
1758
+ );
1759
+ line-height: var(
1760
+ --_sf-hr-le-ht,
1761
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-le-ht)
1762
+ );
1273
1763
  text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ue));
1274
1764
  white-space: nowrap;
1275
1765
  @include restrictToLinesShow(1);
@@ -1280,21 +1770,22 @@ $minWidth: 70px;
1280
1770
  .var__drop__selection {
1281
1771
  display: flex;
1282
1772
  width: 100%;
1283
- gap: var(--_ctm-mob-lt-dn-dy-se-dn-lt-im-sg,
1284
- var(--_ctm-tab-lt-dn-dy-se-dn-lt-im-sg,
1285
- var(--_ctm-lt-dn-dy-se-dn-lt-im-sg, var(--_ctm-lt-im-sg))));
1773
+ gap: var(
1774
+ --_ctm-mob-lt-dn-dy-se-dn-lt-im-sg,
1775
+ var(
1776
+ --_ctm-tab-lt-dn-dy-se-dn-lt-im-sg,
1777
+ var(--_ctm-lt-dn-dy-se-dn-lt-im-sg, var(--_ctm-lt-im-sg))
1778
+ )
1779
+ );
1286
1780
 
1287
1781
  flex-direction: row;
1288
1782
  flex-wrap: wrap;
1289
-
1290
1783
  &[data-dropdown-style="Vertical List"] {
1291
1784
  flex-direction: column;
1292
1785
  gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
1293
1786
  }
1294
-
1295
1787
  .dropdown_wrapper {
1296
1788
  position: relative;
1297
-
1298
1789
  &[data-show-divider="true"] {
1299
1790
  &:not(:last-child)::after {
1300
1791
  content: "";
@@ -1303,7 +1794,12 @@ $minWidth: 70px;
1303
1794
  height: 1px;
1304
1795
  width: 100%;
1305
1796
  display: flex;
1306
- top: calc(calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px) / 2);
1797
+ top: calc(
1798
+ calc(
1799
+ var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px
1800
+ ) /
1801
+ 2
1802
+ );
1307
1803
  }
1308
1804
  }
1309
1805
 
@@ -1319,9 +1815,16 @@ $minWidth: 70px;
1319
1815
  height: 1px;
1320
1816
  width: 100%;
1321
1817
  display: flex;
1322
- top: calc(var(--_ctm-mob-lt-dn-dy-se-dn-lt-im-sg,
1323
- var(--_ctm-tab-lt-dn-dy-se-dn-lt-im-sg,
1324
- var(--_ctm-lt-dn-dy-se-dn-lt-im-sg))) / 2);
1818
+ top: calc(
1819
+ var(
1820
+ --_ctm-mob-lt-dn-dy-se-dn-lt-im-sg,
1821
+ var(
1822
+ --_ctm-tab-lt-dn-dy-se-dn-lt-im-sg,
1823
+ var(--_ctm-lt-dn-dy-se-dn-lt-im-sg)
1824
+ )
1825
+ ) /
1826
+ 2
1827
+ );
1325
1828
  }
1326
1829
  }
1327
1830
  }
@@ -1331,20 +1834,26 @@ $minWidth: 70px;
1331
1834
  }
1332
1835
 
1333
1836
  }
1334
-
1335
1837
  // Quantity Fields
1336
1838
  .field__group {
1337
1839
  // display: flex;
1338
1840
  // flex-wrap: wrap;
1339
1841
  // gap: 8px;
1340
1842
  display: grid;
1341
- grid-template-columns: repeat(auto-fit,
1342
- minmax(var(--_ctm-mob-var-lt-mn-cn-wh,
1343
- var(--_ctm-tab-var-lt-mn-cn-wh, var(--_ctm-var-lt-mn-cn-wh))),
1344
- var(--_ctm-mob-var-lt-mn-cn-wh)));
1345
- gap: var(--_ctm-mob-lt-gd-os-dy-se-tb-rw-sg,
1346
- var(--_ctm-tab-lt-gd-os-dy-se-tb-rw-sg, var(--_ctm-lt-gd-os-dy-se-tb-rw-sg)));
1347
-
1843
+ grid-template-columns: repeat(
1844
+ auto-fit,
1845
+ minmax(
1846
+ var(
1847
+ --_ctm-mob-var-lt-mn-cn-wh,
1848
+ var(--_ctm-tab-var-lt-mn-cn-wh, var(--_ctm-var-lt-mn-cn-wh))
1849
+ ),
1850
+ var(--_ctm-mob-var-lt-mn-cn-wh)
1851
+ )
1852
+ );
1853
+ gap: var(
1854
+ --_ctm-mob-lt-gd-os-dy-se-tb-rw-sg,
1855
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-rw-sg, var(--_ctm-lt-gd-os-dy-se-tb-rw-sg))
1856
+ );
1348
1857
  .field__group__item {
1349
1858
  font-size: 16px;
1350
1859
  display: flex;
@@ -1352,7 +1861,6 @@ $minWidth: 70px;
1352
1861
  align-items: center;
1353
1862
  justify-content: center;
1354
1863
  gap: 8px;
1355
-
1356
1864
  input[type="number"] {
1357
1865
  // width: 70px !important;
1358
1866
  width: 100%;
@@ -1361,12 +1869,10 @@ $minWidth: 70px;
1361
1869
  border-radius: 4px;
1362
1870
  text-align: center;
1363
1871
  height: 40px;
1364
-
1365
1872
  &:focus-within {
1366
1873
  border: 1px solid var(--_primary-200);
1367
1874
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
1368
1875
  }
1369
-
1370
1876
  &:disabled {
1371
1877
  cursor: not-allowed;
1372
1878
  opacity: 0.4;
@@ -1374,15 +1880,18 @@ $minWidth: 70px;
1374
1880
  }
1375
1881
  }
1376
1882
  }
1377
-
1378
1883
  // Enter quantity styles
1379
1884
  .quantiy__details {
1380
1885
  display: flex;
1381
1886
  flex-direction: column;
1382
- gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-sg,
1383
- var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg)));
1384
- padding: var(--_ctm-mob-lt-gd-os-dy-se-gp-pg,
1385
- var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg)));
1887
+ gap: var(
1888
+ --_ctm-mob-lt-gd-os-dy-se-gp-sg,
1889
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg))
1890
+ );
1891
+ padding: var(
1892
+ --_ctm-mob-lt-gd-os-dy-se-gp-pg,
1893
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg))
1894
+ );
1386
1895
 
1387
1896
  .title {
1388
1897
  display: flex;
@@ -1390,36 +1899,35 @@ $minWidth: 70px;
1390
1899
  align-items: center;
1391
1900
  font-weight: 600;
1392
1901
  font-size: 18px;
1393
-
1394
- &>button {
1902
+ & > button {
1395
1903
  border-bottom: 1px solid var(--_gray-400);
1396
1904
  color: var(--_gray-600);
1397
1905
  font-size: 14px;
1398
1906
  }
1399
1907
  }
1400
-
1401
1908
  .fit__details {
1402
1909
  display: flex;
1403
1910
  flex-direction: column;
1404
1911
  gap: 12px;
1405
-
1406
1912
  .fit__desc {
1407
1913
  display: flex;
1408
1914
  flex-direction: column;
1409
- gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1410
- var(--_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1411
- var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)));
1915
+ gap: var(
1916
+ --_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1917
+ var(
1918
+ --_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1919
+ var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)
1920
+ )
1921
+ );
1412
1922
 
1413
1923
  font-size: 16px;
1414
1924
  color: var(--_gray-900);
1415
-
1416
1925
  .each__price {
1417
1926
  font-weight: 600;
1418
1927
  }
1419
1928
  }
1420
1929
  }
1421
1930
  }
1422
-
1423
1931
  .grouped_items {
1424
1932
  display: flex;
1425
1933
  flex-direction: column;
@@ -1436,25 +1944,35 @@ $minWidth: 70px;
1436
1944
 
1437
1945
  .tab {
1438
1946
  &:first-child {
1439
- margin-bottom: var(--_ctm-mob-lt-on-te-ve-sg,
1440
- var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg)));
1947
+ margin-bottom: var(
1948
+ --_ctm-mob-lt-on-te-ve-sg,
1949
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
1950
+ );
1441
1951
  }
1442
1952
  }
1443
1953
 
1444
1954
  .tab__content {
1445
1955
  display: flex;
1446
1956
  flex-direction: column;
1447
- padding: var(--_ctm-mob-lt-gd-os-dy-se-gp-pg,
1448
- var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg)));
1957
+ padding: var(
1958
+ --_ctm-mob-lt-gd-os-dy-se-gp-pg,
1959
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg))
1960
+ );
1449
1961
 
1450
1962
  .field__group {
1451
- gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-sg,
1452
- var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg)));
1963
+ gap: var(
1964
+ --_ctm-mob-lt-gd-os-dy-se-gp-sg,
1965
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg))
1966
+ );
1453
1967
 
1454
1968
  .field__group__item {
1455
- gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1456
- var(--_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1457
- var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)));
1969
+ gap: var(
1970
+ --_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1971
+ var(
1972
+ --_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
1973
+ var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)
1974
+ )
1975
+ );
1458
1976
  }
1459
1977
  }
1460
1978
  }
@@ -1462,7 +1980,7 @@ $minWidth: 70px;
1462
1980
  }
1463
1981
 
1464
1982
  &[data-show-divider="true"] {
1465
- &>div {
1983
+ & > div {
1466
1984
  &:not(:last-child)::after {
1467
1985
  content: "";
1468
1986
  position: relative;
@@ -1470,7 +1988,9 @@ $minWidth: 70px;
1470
1988
  height: 1px;
1471
1989
  width: 100%;
1472
1990
  display: flex;
1473
- top: calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2);
1991
+ top: calc(
1992
+ var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2
1993
+ );
1474
1994
  }
1475
1995
  }
1476
1996
 
@@ -1482,17 +2002,17 @@ $minWidth: 70px;
1482
2002
  height: 1px;
1483
2003
  width: 100%;
1484
2004
  display: flex;
1485
- top: calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2);
2005
+ top: calc(
2006
+ var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2
2007
+ );
1486
2008
  }
1487
2009
  }
1488
2010
  }
1489
2011
  }
1490
-
1491
2012
  // tabs
1492
2013
  .tabs__container {
1493
2014
  display: flex;
1494
2015
  position: relative;
1495
-
1496
2016
  .tab {
1497
2017
  flex: 1;
1498
2018
  padding-block: 20px;
@@ -1500,12 +2020,10 @@ $minWidth: 70px;
1500
2020
  text-align: center;
1501
2021
  cursor: pointer;
1502
2022
  position: relative;
1503
-
1504
2023
  &.tab__active {
1505
2024
  font-weight: bold;
1506
2025
  }
1507
2026
  }
1508
-
1509
2027
  .tab__active-indicator {
1510
2028
  position: absolute;
1511
2029
  bottom: 0;
@@ -1523,24 +2041,35 @@ $minWidth: 70px;
1523
2041
  .tab__accordion {
1524
2042
  display: flex;
1525
2043
  flex-direction: column;
1526
- padding: var(--_ctm-mob-lt-gd-os-dy-se-cr-pg,
1527
- var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg)));
2044
+ padding: var(
2045
+ --_ctm-mob-lt-gd-os-dy-se-cr-pg,
2046
+ var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg))
2047
+ );
1528
2048
 
1529
2049
  .tab__container {
1530
2050
  display: flex;
1531
2051
  flex-direction: column;
1532
- gap: var(--_ctm-mob-lt-gd-os-dy-se-an-sg,
1533
- var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg)));
2052
+ gap: var(
2053
+ --_ctm-mob-lt-gd-os-dy-se-an-sg,
2054
+ var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg))
2055
+ );
1534
2056
 
1535
2057
  .tab_acc_wrapper {
1536
2058
  display: flex;
1537
2059
  flex-direction: column;
1538
- gap: var(--_ctm-mob-lt-gd-os-dy-se-an-ad-cr-sg,
1539
- var(--_ctm-tab-lt-gd-os-dy-se-an-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-an-ad-cr-sg)));
1540
-
1541
- padding: var(--_ctm-mob-lt-gd-os-dy-se-an-vl-pg,
1542
- var(--_ctm-tab-lt-gd-os-dy-se-an-vl-pg, var(--_ctm-lt-gd-os-dy-se-an-vl-pg))) var(--_ctm-mob-lt-gd-os-dy-se-an-hl-pg,
1543
- var(--_ctm-tab-lt-gd-os-dy-se-an-hl-pg, var(--_ctm-lt-gd-os-dy-se-an-hl-pg)));
2060
+ gap: var(
2061
+ --_ctm-mob-lt-gd-os-dy-se-an-ad-cr-sg,
2062
+ var(--_ctm-tab-lt-gd-os-dy-se-an-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-an-ad-cr-sg))
2063
+ );
2064
+
2065
+ padding: var(
2066
+ --_ctm-mob-lt-gd-os-dy-se-an-vl-pg,
2067
+ var(--_ctm-tab-lt-gd-os-dy-se-an-vl-pg, var(--_ctm-lt-gd-os-dy-se-an-vl-pg))
2068
+ )
2069
+ var(
2070
+ --_ctm-mob-lt-gd-os-dy-se-an-hl-pg,
2071
+ var(--_ctm-tab-lt-gd-os-dy-se-an-hl-pg, var(--_ctm-lt-gd-os-dy-se-an-hl-pg))
2072
+ );
1544
2073
 
1545
2074
  .tab {
1546
2075
  display: flex;
@@ -1548,12 +2077,10 @@ $minWidth: 70px;
1548
2077
  position: relative;
1549
2078
  cursor: pointer;
1550
2079
  flex-direction: row;
1551
-
1552
2080
  &[data-expand-icon="Left"] {
1553
2081
  flex-direction: row-reverse;
1554
2082
  justify-content: flex-end;
1555
2083
  }
1556
-
1557
2084
  &[data-item-dividers="true"] {
1558
2085
  &::after {
1559
2086
  content: "";
@@ -1564,26 +2091,21 @@ $minWidth: 70px;
1564
2091
  border-bottom: 1px solid var(--_gray-200);
1565
2092
  }
1566
2093
  }
1567
-
1568
2094
  span {
1569
2095
  padding-block: 12px;
1570
2096
  display: inline-block;
1571
2097
  }
1572
-
1573
2098
  .active {
1574
2099
  border-bottom: 2px solid var(--_primary-400);
1575
2100
  }
1576
-
1577
2101
  &.inactive {
1578
2102
  height: 0px;
1579
2103
  }
1580
2104
  }
1581
-
1582
2105
  .tab__content {
1583
2106
  &.d-none {
1584
2107
  display: none;
1585
2108
  }
1586
-
1587
2109
  &.d-block {
1588
2110
  display: block;
1589
2111
  }
@@ -1603,8 +2125,13 @@ $minWidth: 70px;
1603
2125
  height: 1px;
1604
2126
  width: 100%;
1605
2127
  display: flex;
1606
- top: calc(var(--_ctm-mob-lt-gd-os-dy-se-an-sg,
1607
- var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg))) / 2);
2128
+ top: calc(
2129
+ var(
2130
+ --_ctm-mob-lt-gd-os-dy-se-an-sg,
2131
+ var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg))
2132
+ ) /
2133
+ 2
2134
+ );
1608
2135
  }
1609
2136
  }
1610
2137
  }
@@ -1762,115 +2289,205 @@ $minWidth: 70px;
1762
2289
  }
1763
2290
  }
1764
2291
  }
1765
-
1766
2292
  &.tabs__hr {
1767
2293
  .tabs {
1768
2294
  flex-direction: column;
1769
- gap: var(--_ctm-mob-lt-gd-os-dy-se-tb-ad-cr-sg,
1770
- var(--_ctm-tab-lt-gd-os-dy-se-tb-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-tb-ad-cr-sg)));
2295
+ gap: var(
2296
+ --_ctm-mob-lt-gd-os-dy-se-tb-ad-cr-sg,
2297
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-tb-ad-cr-sg))
2298
+ );
1771
2299
 
1772
2300
  .tabs__container {
1773
2301
  width: 100%;
1774
2302
  }
1775
2303
  }
1776
2304
  }
1777
-
1778
2305
  .tabs {
1779
2306
  display: flex;
1780
- gap: var(--_ctm-mob-lt-tb-im-se-dt-se-tb-ad-cr-sg,
1781
- var(--_ctm-tab-lt-tb-im-se-dt-se-tb-ad-cr-sg, var(--_ctm-dn-tb-im-se-dt-se-tb-ad-cr-sg)));
2307
+ gap: var(
2308
+ --_ctm-mob-lt-tb-im-se-dt-se-tb-ad-cr-sg,
2309
+ var(--_ctm-tab-lt-tb-im-se-dt-se-tb-ad-cr-sg, var(--_ctm-dn-tb-im-se-dt-se-tb-ad-cr-sg))
2310
+ );
1782
2311
 
1783
2312
  .tabs__container {
1784
2313
  display: flex;
1785
- gap: var(--_ctm-mob-lt-gd-os-dy-se-tb-sg,
1786
- var(--_ctm-tab-lt-gd-os-dy-se-tb-sg, var(--_ctm-lt-gd-os-dy-se-tb-sg)));
2314
+ gap: var(
2315
+ --_ctm-mob-lt-gd-os-dy-se-tb-sg,
2316
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-sg, var(--_ctm-lt-gd-os-dy-se-tb-sg))
2317
+ );
1787
2318
 
1788
2319
  .tab {
1789
2320
  display: flex;
1790
2321
  justify-content: var(--_tab-aliginment);
1791
- padding: var(--_ctm-mob-lt-gd-os-dy-se-tb-vl-pg,
1792
- var(--_ctm-tab-lt-gd-os-dy-se-tb-vl-pg, var(--_ctm-lt-gd-os-dy-se-tb-vl-pg))) var(--_ctm-mob-lt-gd-os-dy-se-tb-hl-pg,
1793
- var(--_ctm-tab-lt-gd-os-dy-se-tb-hl-pg, var(--_ctm-lt-gd-os-dy-se-tb-hl-pg)));
1794
- background-color: var(--_ctm-mob-lt-dn-tb-im-se-dt-se-bd-cr,
1795
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-bd-cr, var(--_ctm-dn-tb-im-se-dt-se-bd-cr)));
1796
- border-color: var(--_show-border-im-se,
1797
- var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-cr,
1798
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-cr, var(--_ctm-dn-tb-im-se-dt-se-br-cr))));
1799
- border-style: var(--_show-border-im-se,
1800
- var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-se,
1801
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-se, var(--_ctm-dn-tb-im-se-dt-se-br-se))));
1802
- border-width: var(--_show-border-im-se,
1803
- var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-wh,
1804
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-wh, var(--_ctm-dn-tb-im-se-dt-se-br-wh))));
1805
- border-radius: var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
1806
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs, var(--_ctm-dn-tb-im-se-dt-se-br-rs)));
1807
- box-shadow: var(--_show-shadow-im-se,
1808
- var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-ae,
1809
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-ae)),
1810
- var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-br,
1811
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-br)),
1812
- var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-sd,
1813
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-sd)),
1814
- var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-cr,
1815
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-cr)));
1816
- border-radius: var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
1817
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs));
2322
+ padding: var(
2323
+ --_ctm-mob-lt-gd-os-dy-se-tb-vl-pg,
2324
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-vl-pg, var(--_ctm-lt-gd-os-dy-se-tb-vl-pg))
2325
+ )
2326
+ var(
2327
+ --_ctm-mob-lt-gd-os-dy-se-tb-hl-pg,
2328
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-hl-pg, var(--_ctm-lt-gd-os-dy-se-tb-hl-pg))
2329
+ );
2330
+ background-color: var(
2331
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-bd-cr,
2332
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-bd-cr, var(--_ctm-dn-tb-im-se-dt-se-bd-cr))
2333
+ );
2334
+ border-color: var(
2335
+ --_show-border-im-se,
2336
+ var(
2337
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-cr,
2338
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-cr, var(--_ctm-dn-tb-im-se-dt-se-br-cr))
2339
+ )
2340
+ );
2341
+ border-style: var(
2342
+ --_show-border-im-se,
2343
+ var(
2344
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-se,
2345
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-se, var(--_ctm-dn-tb-im-se-dt-se-br-se))
2346
+ )
2347
+ );
2348
+ border-width: var(
2349
+ --_show-border-im-se,
2350
+ var(
2351
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-wh,
2352
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-wh, var(--_ctm-dn-tb-im-se-dt-se-br-wh))
2353
+ )
2354
+ );
2355
+ border-radius: var(
2356
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
2357
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs, var(--_ctm-dn-tb-im-se-dt-se-br-rs))
2358
+ );
2359
+ box-shadow: var(
2360
+ --_show-shadow-im-se,
2361
+ var(
2362
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-ae,
2363
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-ae)
2364
+ ),
2365
+ var(
2366
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-br,
2367
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-br)
2368
+ ),
2369
+ var(
2370
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-sd,
2371
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-sd)
2372
+ ),
2373
+ var(
2374
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-cr,
2375
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-cr)
2376
+ )
2377
+ );
2378
+ border-radius: var(
2379
+ --_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
2380
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs)
2381
+ );
1818
2382
 
1819
2383
  &:hover {
1820
- background-color: var(--_ctm-mob-lt-dn-tb-im-se-hr-se-bd-cr,
1821
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-bd-cr, var(--_ctm-dn-tb-im-se-hr-se-bd-cr)));
1822
- border-color: var(--_show-border-im-se,
1823
- var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-cr,
1824
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-cr, var(--_ctm-dn-tb-im-se-hr-se-br-cr))));
1825
- border-style: var(--_show-border-im-se,
1826
- var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-se,
1827
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-se, var(--_ctm-dn-tb-im-se-hr-se-br-se))));
1828
- border-width: var(--_show-border-im-se,
1829
- var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-wh,
1830
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-wh, var(--_ctm-dn-tb-im-se-hr-se-br-wh))));
1831
- border-radius: var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-rs,
1832
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-rs, var(--_ctm-dn-tb-im-se-hr-se-br-rs)));
1833
- box-shadow: var(--_show-shadow-im-se,
1834
- var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-ae,
1835
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-ae)),
1836
- var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-br,
1837
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-br)),
1838
- var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-sd,
1839
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-sd)),
1840
- var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-cr,
1841
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-cr)));
2384
+ background-color: var(
2385
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-bd-cr,
2386
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-bd-cr, var(--_ctm-dn-tb-im-se-hr-se-bd-cr))
2387
+ );
2388
+ border-color: var(
2389
+ --_show-border-im-se,
2390
+ var(
2391
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-cr,
2392
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-cr, var(--_ctm-dn-tb-im-se-hr-se-br-cr))
2393
+ )
2394
+ );
2395
+ border-style: var(
2396
+ --_show-border-im-se,
2397
+ var(
2398
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-se,
2399
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-se, var(--_ctm-dn-tb-im-se-hr-se-br-se))
2400
+ )
2401
+ );
2402
+ border-width: var(
2403
+ --_show-border-im-se,
2404
+ var(
2405
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-wh,
2406
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-wh, var(--_ctm-dn-tb-im-se-hr-se-br-wh))
2407
+ )
2408
+ );
2409
+ border-radius: var(
2410
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-br-rs,
2411
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-rs, var(--_ctm-dn-tb-im-se-hr-se-br-rs))
2412
+ );
2413
+ box-shadow: var(
2414
+ --_show-shadow-im-se,
2415
+ var(
2416
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-ae,
2417
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-ae)
2418
+ ),
2419
+ var(
2420
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-br,
2421
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-br)
2422
+ ),
2423
+ var(
2424
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-sd,
2425
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-sd)
2426
+ ),
2427
+ var(
2428
+ --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-cr,
2429
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-cr)
2430
+ )
2431
+ );
1842
2432
  }
1843
2433
 
1844
2434
  &.active {
1845
- background-color: var(--_ctm-mob-lt-dn-tb-im-se-sd-se-bd-cr,
1846
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-bd-cr, var(--_ctm-dn-tb-im-se-sd-se-bd-cr)));
1847
- border-color: var(--_show-border-im-se,
1848
- var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-cr,
1849
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-cr, var(--_ctm-dn-tb-im-se-sd-se-br-cr))));
1850
- border-style: var(--_show-border-im-se,
1851
- var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-se,
1852
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-se, var(--_ctm-dn-tb-im-se-sd-se-br-se))));
1853
- border-width: var(--_show-border-im-se,
1854
- var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-wh,
1855
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-wh, var(--_ctm-dn-tb-im-se-sd-se-br-wh))));
1856
- border-radius: var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-rs,
1857
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-rs, var(--_ctm-dn-tb-im-se-sd-se-br-rs)));
1858
- box-shadow: var(--_show-shadow-im-se,
1859
- var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-ae,
1860
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-ae)),
1861
- var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-br,
1862
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-br)),
1863
- var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-sd,
1864
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-sd)),
1865
- var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-cr,
1866
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-cr)));
2435
+ background-color: var(
2436
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-bd-cr,
2437
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-bd-cr, var(--_ctm-dn-tb-im-se-sd-se-bd-cr))
2438
+ );
2439
+ border-color: var(
2440
+ --_show-border-im-se,
2441
+ var(
2442
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-cr,
2443
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-cr, var(--_ctm-dn-tb-im-se-sd-se-br-cr))
2444
+ )
2445
+ );
2446
+ border-style: var(
2447
+ --_show-border-im-se,
2448
+ var(
2449
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-se,
2450
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-se, var(--_ctm-dn-tb-im-se-sd-se-br-se))
2451
+ )
2452
+ );
2453
+ border-width: var(
2454
+ --_show-border-im-se,
2455
+ var(
2456
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-wh,
2457
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-wh, var(--_ctm-dn-tb-im-se-sd-se-br-wh))
2458
+ )
2459
+ );
2460
+ border-radius: var(
2461
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-br-rs,
2462
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-rs, var(--_ctm-dn-tb-im-se-sd-se-br-rs))
2463
+ );
2464
+ box-shadow: var(
2465
+ --_show-shadow-im-se,
2466
+ var(
2467
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-ae,
2468
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-ae)
2469
+ ),
2470
+ var(
2471
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-br,
2472
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-br)
2473
+ ),
2474
+ var(
2475
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-sd,
2476
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-sd)
2477
+ ),
2478
+ var(
2479
+ --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-cr,
2480
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-cr)
2481
+ )
2482
+ );
1867
2483
  }
1868
2484
  }
1869
2485
  }
1870
-
1871
2486
  .tab__content {
1872
- padding: var(--_ctm-mob-lt-gd-os-dy-se-cr-pg,
1873
- var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg)));
2487
+ padding: var(
2488
+ --_ctm-mob-lt-gd-os-dy-se-cr-pg,
2489
+ var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg))
2490
+ );
1874
2491
  }
1875
2492
  }
1876
2493
  }
@@ -1909,18 +2526,37 @@ $minWidth: 70px;
1909
2526
  gap: var(--_ctm-mob-lt-sh-im-sg, var(--_ctm-tab-lt-sh-im-sg, var(--_ctm-lt-sh-im-sg)));
1910
2527
 
1911
2528
  &[data-control-type="Bottom"][data-slider-control="Arrows"] {
1912
- height: calc(100% - calc(var(--_ctm-mob-dn-pn-as-aw-se,
1913
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) + 8px));
2529
+ height: calc(
2530
+ 100% - calc(
2531
+ var(
2532
+ --_ctm-mob-dn-pn-as-aw-se,
2533
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
2534
+ ) +
2535
+ 8px
2536
+ )
2537
+ );
1914
2538
  }
1915
-
1916
2539
  &[data-control-type="Bottom"][data-slider-control="Pagination Line"] {
1917
- height: calc(100% - calc(var(--_ctm-mob-dn-pn-le-le-ht,
1918
- var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))) + 20px));
2540
+ height: calc(
2541
+ 100% - calc(
2542
+ var(
2543
+ --_ctm-mob-dn-pn-le-le-ht,
2544
+ var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))
2545
+ ) +
2546
+ 20px
2547
+ )
2548
+ );
1919
2549
  }
1920
-
1921
2550
  &[data-control-type="Bottom"][data-slider-control="Dots"] {
1922
- height: calc(100% - calc(var(--_ctm-mob-dn-pn-ds-dt-se,
1923
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))) + 20px));
2551
+ height: calc(
2552
+ 100% - calc(
2553
+ var(
2554
+ --_ctm-mob-dn-pn-ds-dt-se,
2555
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
2556
+ ) +
2557
+ 20px
2558
+ )
2559
+ );
1924
2560
  }
1925
2561
 
1926
2562
  .embla__slide {
@@ -1938,25 +2574,20 @@ $minWidth: 70px;
1938
2574
  width: 100%;
1939
2575
  justify-content: space-between;
1940
2576
  transform: translate(-50%, -50%);
1941
-
1942
2577
  // padding-left: 20px;
1943
2578
  &[data-control-type="Side"] {
1944
-
1945
2579
  .left-button,
1946
2580
  .right-button {
1947
2581
  background-color: transparent;
1948
2582
  }
1949
2583
  }
1950
-
1951
2584
  &[data-background-shape="Round"] {
1952
-
1953
2585
  .left-button,
1954
2586
  .right-button {
1955
2587
  background-color: #f2f5f5;
1956
2588
  box-sizing: 0 4px 8px rgba(0, 0, 0, 0.1);
1957
2589
  }
1958
2590
  }
1959
-
1960
2591
  &[data-control-type="Bottom-Overflow"] {
1961
2592
  transform: translateX(-50%);
1962
2593
  width: 100%;
@@ -1965,7 +2596,6 @@ $minWidth: 70px;
1965
2596
  top: unset;
1966
2597
  bottom: 6px;
1967
2598
  }
1968
-
1969
2599
  &[data-control-type="Bottom"] {
1970
2600
  transform: unset;
1971
2601
  position: static;
@@ -1974,15 +2604,18 @@ $minWidth: 70px;
1974
2604
  gap: 12px;
1975
2605
  margin-top: 10px;
1976
2606
  }
1977
-
1978
2607
  .left-button {
1979
2608
  padding: 10px;
1980
2609
  border-radius: 50%;
1981
2610
  border: none;
1982
- width: var(--_ctm-mob-dn-pn-as-aw-se,
1983
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
1984
- height: var(--_ctm-mob-dn-pn-as-aw-se,
1985
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
2611
+ width: var(
2612
+ --_ctm-mob-dn-pn-as-aw-se,
2613
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
2614
+ );
2615
+ height: var(
2616
+ --_ctm-mob-dn-pn-as-aw-se,
2617
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
2618
+ );
1986
2619
 
1987
2620
  display: flex;
1988
2621
  align-items: center;
@@ -1990,7 +2623,6 @@ $minWidth: 70px;
1990
2623
  cursor: pointer;
1991
2624
  outline: none;
1992
2625
  margin-left: 12px;
1993
-
1994
2626
  &:disabled {
1995
2627
  & svg {
1996
2628
  path {
@@ -1999,14 +2631,17 @@ $minWidth: 70px;
1999
2631
  }
2000
2632
  }
2001
2633
  }
2002
-
2003
2634
  .right-button {
2004
2635
  border-radius: 50%;
2005
2636
  border: none;
2006
- width: var(--_ctm-mob-dn-pn-as-aw-se,
2007
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
2008
- height: var(--_ctm-mob-dn-pn-as-aw-se,
2009
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
2637
+ width: var(
2638
+ --_ctm-mob-dn-pn-as-aw-se,
2639
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
2640
+ );
2641
+ height: var(
2642
+ --_ctm-mob-dn-pn-as-aw-se,
2643
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
2644
+ );
2010
2645
 
2011
2646
  display: flex;
2012
2647
  align-items: center;
@@ -2024,19 +2659,28 @@ $minWidth: 70px;
2024
2659
  }
2025
2660
  }
2026
2661
  }
2027
-
2028
2662
  .icon {
2029
2663
  display: flex;
2030
-
2031
2664
  svg {
2032
- width: calc(var(--_ctm-mob-dn-pn-as-aw-se,
2033
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
2034
- height: calc(var(--_ctm-mob-dn-pn-as-aw-se,
2035
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
2036
-
2665
+ width: calc(
2666
+ var(
2667
+ --_ctm-mob-dn-pn-as-aw-se,
2668
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
2669
+ ) *
2670
+ 0.5
2671
+ );
2672
+ height: calc(
2673
+ var(
2674
+ --_ctm-mob-dn-pn-as-aw-se,
2675
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
2676
+ ) *
2677
+ 0.5
2678
+ );
2037
2679
  path {
2038
- stroke: var(--_ctm-mob-dn-pn-as-aw-cr,
2039
- var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr)));
2680
+ stroke: var(
2681
+ --_ctm-mob-dn-pn-as-aw-cr,
2682
+ var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr))
2683
+ );
2040
2684
  }
2041
2685
  }
2042
2686
  }
@@ -2045,11 +2689,9 @@ $minWidth: 70px;
2045
2689
  &[data-thumbnail-placement="top"] {
2046
2690
  flex-direction: column-reverse;
2047
2691
  }
2048
-
2049
2692
  &[data-thumbnail-placement="bottom"] {
2050
2693
  flex-direction: column;
2051
2694
  }
2052
-
2053
2695
  &[data-thumbnail-placement="left"] {
2054
2696
  flex-direction: row-reverse;
2055
2697
 
@@ -2064,10 +2706,8 @@ $minWidth: 70px;
2064
2706
  }
2065
2707
  }
2066
2708
  }
2067
-
2068
2709
  &[data-thumbnail-placement="right"] {
2069
2710
  flex-direction: row;
2070
-
2071
2711
  .embla__thumbs {
2072
2712
  width: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
2073
2713
 
@@ -2079,18 +2719,15 @@ $minWidth: 70px;
2079
2719
  }
2080
2720
  }
2081
2721
  }
2082
-
2083
2722
  &[data-control-type="Side"] {
2084
2723
  display: flex;
2085
2724
  align-self: center;
2086
2725
  flex-direction: row;
2087
-
2088
2726
  .left-button:disabled,
2089
2727
  .right-button:disabled {
2090
2728
  display: none;
2091
2729
  }
2092
2730
  }
2093
-
2094
2731
  .embla__dots {
2095
2732
  display: flex;
2096
2733
  flex-wrap: wrap;
@@ -2107,7 +2744,6 @@ $minWidth: 70px;
2107
2744
  transform: translateX(-50%);
2108
2745
  width: 75%;
2109
2746
  }
2110
-
2111
2747
  .embla__dot {
2112
2748
  -webkit-tap-highlight-color: rgba(var(--text-high-contrast-rgb-value), 0.5);
2113
2749
  -webkit-appearance: none;
@@ -2129,7 +2765,6 @@ $minWidth: 70px;
2129
2765
  justify-content: center;
2130
2766
  border-radius: 50%;
2131
2767
  }
2132
-
2133
2768
  .embla__dot:after {
2134
2769
  // box-shadow: inset 0 0 0 0.2rem var(--detail-medium-contrast);
2135
2770
  width: var(--_ctm-dn-pn-ds-dt-se, var(--_tst-dn-pn-ds-dt-se));
@@ -2139,12 +2774,10 @@ $minWidth: 70px;
2139
2774
  align-items: center;
2140
2775
  content: "";
2141
2776
  }
2142
-
2143
2777
  .embla__dot--selected:after {
2144
2778
  box-shadow: inset 0 0 0 1px var(--text-body);
2145
2779
  background-color: var(--_ctm-dn-pn-ds-ct-dt-cr, var(--_tst-dn-pn-ds-ct-dt-cr));
2146
2780
  }
2147
-
2148
2781
  &[data-slider-control="Pagination Line"] {
2149
2782
  .embla__dot {
2150
2783
  width: var(--_ctm-dn-pn-le-le-wh, var(--_ctm-dn-pn-le-le-wh));
@@ -2153,7 +2786,6 @@ $minWidth: 70px;
2153
2786
 
2154
2787
  border-radius: 6px;
2155
2788
  }
2156
-
2157
2789
  .embla__dot--selected:after {
2158
2790
  box-shadow: inset 0 0 0 1px var(--text-body);
2159
2791
  border-radius: 6px;
@@ -2185,7 +2817,6 @@ $minWidth: 70px;
2185
2817
 
2186
2818
  overflow: hidden;
2187
2819
  }
2188
-
2189
2820
  .embla__thumbs__container {
2190
2821
  display: flex;
2191
2822
  flex-direction: row;
@@ -2199,7 +2830,6 @@ $minWidth: 70px;
2199
2830
  min-width: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
2200
2831
  max-width: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
2201
2832
  height: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
2202
-
2203
2833
  & img {
2204
2834
  width: 100%;
2205
2835
  height: 100%;
@@ -2221,15 +2851,15 @@ $minWidth: 70px;
2221
2851
  .pagination:hover {
2222
2852
  --_sf-bd-cr: var(--_ctm-dn-pn-hr-se-bd-cr, var(--_tst-dn-pn-hr-se-bd-cr));
2223
2853
  }
2224
-
2225
2854
  .load__more__button__container {
2226
2855
  display: flex;
2227
2856
  width: 100%;
2228
2857
  margin-top: 10px;
2229
-
2230
2858
  &:hover {
2231
- --_sf-hr-bn-at: var(--_ctm-mob-dn-ld-me-bn-hr-se-bn-at,
2232
- var(--_ctm-tab-dn-ld-me-bn-hr-se-bn-at, var(--_ctm-dn-ld-me-bn-hr-se-bn-at)));
2859
+ --_sf-hr-bn-at: var(
2860
+ --_ctm-mob-dn-ld-me-bn-hr-se-bn-at,
2861
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-bn-at, var(--_ctm-dn-ld-me-bn-hr-se-bn-at))
2862
+ );
2233
2863
  }
2234
2864
 
2235
2865
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-bn-at));
@@ -2250,67 +2880,80 @@ $minWidth: 70px;
2250
2880
  --_sf-hr-ls: var(--_ctm-dn-pn-hr-se-lr-sg, var(--_tst-dn-pn-hr-se-lr-sg));
2251
2881
  --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
2252
2882
  }
2253
-
2254
2883
  &[data-widget-shadow="false"] {
2255
2884
  .table__wrapper {
2256
2885
  --_show-shadow: none;
2257
2886
  }
2258
2887
  }
2259
-
2260
2888
  &[data-widget-border="true"] {
2261
2889
  .table__wrapper {
2262
- border-color: var(--_ctm-mob-dn-te-wt-br-cr,
2263
- var(--_ctm-tab-dn-te-wt-br-cr, var(--_ctm-dn-te-wt-br-cr)));
2264
- border-style: var(--_ctm-mob-dn-te-wt-br-se,
2265
- var(--_ctm-tab-dn-te-wt-br-se, var(--_ctm-dn-te-wt-br-se)));
2266
- border-width: var(--_ctm-mob-dn-te-wt-br-wh,
2267
- var(--_ctm-tab-dn-te-wt-br-wh, var(--_ctm-dn-te-wt-br-wh)));
2890
+ border-color: var(
2891
+ --_ctm-mob-dn-te-wt-br-cr,
2892
+ var(--_ctm-tab-dn-te-wt-br-cr, var(--_ctm-dn-te-wt-br-cr))
2893
+ );
2894
+ border-style: var(
2895
+ --_ctm-mob-dn-te-wt-br-se,
2896
+ var(--_ctm-tab-dn-te-wt-br-se, var(--_ctm-dn-te-wt-br-se))
2897
+ );
2898
+ border-width: var(
2899
+ --_ctm-mob-dn-te-wt-br-wh,
2900
+ var(--_ctm-tab-dn-te-wt-br-wh, var(--_ctm-dn-te-wt-br-wh))
2901
+ );
2268
2902
  }
2269
2903
  }
2270
-
2271
2904
  &[data-table-shadow="false"] {
2272
2905
  .table__container {
2273
2906
  --_show-table-shadow: none;
2274
2907
  }
2275
2908
  }
2276
-
2277
2909
  &[data-alternative-row-colors="true"] {
2278
2910
  tbody .tbody__row__divider:nth-child(odd) {
2279
2911
  background-color: prepareMediaVariable(--_ctm-dn-rw-ae-cr-bd-cr);
2280
2912
  }
2281
2913
  }
2282
-
2283
2914
  &[data-table-border="true"] {
2284
2915
  .table__container {
2285
- border-color: var(--_ctm-mob-dn-te-br-cr,
2286
- var(--_ctm-tab-dn-te-br-cr, var(--_ctm-dn-te-br-cr)));
2287
- border-style: var(--_ctm-mob-dn-te-br-se,
2288
- var(--_ctm-tab-dn-te-br-se, var(--_ctm-dn-te-br-se)));
2289
- border-width: var(--_ctm-mob-dn-te-br-wh,
2290
- var(--_ctm-tab-dn-te-br-wh, var(--_ctm-dn-te-br-wh)));
2916
+ border-color: var(
2917
+ --_ctm-mob-dn-te-br-cr,
2918
+ var(--_ctm-tab-dn-te-br-cr, var(--_ctm-dn-te-br-cr))
2919
+ );
2920
+ border-style: var(
2921
+ --_ctm-mob-dn-te-br-se,
2922
+ var(--_ctm-tab-dn-te-br-se, var(--_ctm-dn-te-br-se))
2923
+ );
2924
+ border-width: var(
2925
+ --_ctm-mob-dn-te-br-wh,
2926
+ var(--_ctm-tab-dn-te-br-wh, var(--_ctm-dn-te-br-wh))
2927
+ );
2291
2928
  }
2292
2929
  }
2293
2930
 
2294
2931
  &[data-header-divider="true"] {
2295
2932
  thead tr th {
2296
- border-bottom: 1px solid var(--_ctm-mob-dn-rw-ad-hr-ds-hr-dr,
2297
- var(--_ctm-tab-dn-rw-ad-hr-ds-hr-dr, var(--_ctm-dn-rw-ad-hr-ds-hr-dr)));
2933
+ border-bottom: 1px solid
2934
+ var(
2935
+ --_ctm-mob-dn-rw-ad-hr-ds-hr-dr,
2936
+ var(--_ctm-tab-dn-rw-ad-hr-ds-hr-dr, var(--_ctm-dn-rw-ad-hr-ds-hr-dr))
2937
+ );
2298
2938
  }
2299
2939
  }
2300
-
2301
2940
  &[data-row-divider="true"] {
2302
2941
  tbody tr {
2303
- border-bottom: 1px solid var(--_ctm-mob-dn-rw-ad-hr-ds-rw-dr,
2304
- var(--_ctm-tab-dn-rw-ad-hr-ds-rw-dr, var(--_ctm-dn-rw-ad-hr-ds-rw-dr)));
2942
+ border-bottom: 1px solid
2943
+ var(
2944
+ --_ctm-mob-dn-rw-ad-hr-ds-rw-dr,
2945
+ var(--_ctm-tab-dn-rw-ad-hr-ds-rw-dr, var(--_ctm-dn-rw-ad-hr-ds-rw-dr))
2946
+ );
2305
2947
  }
2306
2948
  }
2307
-
2308
2949
  &[data-column-divider="true"] {
2309
-
2310
2950
  tbody tr td,
2311
2951
  thead tr th {
2312
- border-right: 1px solid var(--_ctm-mob-dn-rw-ad-hr-ds-cn-dr,
2313
- var(--_ctm-tab-dn-rw-ad-hr-ds-cn-dr, var(--_ctm-dn-rw-ad-hr-ds-cn-dr)));
2952
+ border-right: 1px solid
2953
+ var(
2954
+ --_ctm-mob-dn-rw-ad-hr-ds-cn-dr,
2955
+ var(--_ctm-tab-dn-rw-ad-hr-ds-cn-dr, var(--_ctm-dn-rw-ad-hr-ds-cn-dr))
2956
+ );
2314
2957
  }
2315
2958
 
2316
2959
  tbody tr td:last-child,
@@ -2318,16 +2961,19 @@ $minWidth: 70px;
2318
2961
  border-right: none;
2319
2962
  }
2320
2963
  }
2321
-
2322
2964
  &[data-show-more-rows="onScroll"] {
2323
2965
  .table__container {
2324
2966
  overflow-y: scroll;
2325
- height: var(--_ctm-mob-lt-mx-dy-se-te-ht,
2326
- var(--_ctm-tab-lt-mx-dy-se-te-ht, var(--_ctm-lt-mx-dy-se-te-ht))) !important;
2967
+ height: var(
2968
+ --_ctm-mob-lt-mx-dy-se-te-ht,
2969
+ var(--_ctm-tab-lt-mx-dy-se-te-ht, var(--_ctm-lt-mx-dy-se-te-ht))
2970
+ ) !important;
2327
2971
 
2328
2972
  &::-webkit-scrollbar {
2329
- width: var(--_ctm-mob-dn-sl-br-sl-br-wh,
2330
- var(--_ctm-tab-dn-sl-br-sl-br-wh, var(--_ctm-dn-sl-br-sl-br-wh)));
2973
+ width: var(
2974
+ --_ctm-mob-dn-sl-br-sl-br-wh,
2975
+ var(--_ctm-tab-dn-sl-br-sl-br-wh, var(--_ctm-dn-sl-br-sl-br-wh))
2976
+ );
2331
2977
  }
2332
2978
 
2333
2979
  &::-webkit-scrollbar-track {
@@ -2335,8 +2981,10 @@ $minWidth: 70px;
2335
2981
  }
2336
2982
 
2337
2983
  &::-webkit-scrollbar-thumb {
2338
- background-color: var(--_ctm-mob-dn-sl-br-sl-br-cr,
2339
- var(--_ctm-tab-dn-sl-br-sl-br-cr, var(--_ctm-dn-sl-br-sl-br-cr)));
2984
+ background-color: var(
2985
+ --_ctm-mob-dn-sl-br-sl-br-cr,
2986
+ var(--_ctm-tab-dn-sl-br-sl-br-cr, var(--_ctm-dn-sl-br-sl-br-cr))
2987
+ );
2340
2988
  }
2341
2989
 
2342
2990
  // // Scrollbar thumb when hovered
@@ -2360,33 +3008,61 @@ $minWidth: 70px;
2360
3008
  flex: 1 1 auto;
2361
3009
  min-width: 0;
2362
3010
  overflow-x: auto;
2363
- padding: var(--_ctm-mob-lt-mx-dy-se-pg,
2364
- var(--_ctm-tab-lt-mx-dy-se-pg, var(--_ctm-lt-mx-dy-se-pg, var(--_tst-lt-mx-dy-se-pg))));
2365
-
2366
- background-color: var(--_ctm-mob-dn-te-wt-bd-cr,
2367
- var(--_ctm-tab-dn-te-wt-bd-cr, var(--_ctm-dn-te-wt-bd-cr, var(--_tst-dn-te-wt-bd-cr))));
2368
-
2369
- border-radius: var(--_ctm-mob-dn-te-wt-br-rs,
2370
- var(--_ctm-tab-dn-te-wt-br-rs, var(--_ctm-dn-te-wt-br-rs, var(--_tst-dn-te-wt-br-rs))));
2371
-
2372
- box-shadow: var(--_show-shadow,
2373
- var(--_ctm-mob-dn-te-wt-sw-ae,
2374
- var(--_ctm-tab-dn-te-wt-sw-ae, var(--_ctm-dn-te-wt-sw-ae))) var(--_ctm-mob-dn-te-wt-sw-br,
2375
- var(--_ctm-tab-dn-te-wt-sw-br, var(--_ctm-dn-te-wt-sw-br))) var(--_ctm-mob-dn-te-wt-sw-sd,
2376
- var(--_ctm-tab-dn-te-wt-sw-sd, var(--_ctm-dn-te-wt-sw-sd))) var(--_ctm-mob-dn-te-wt-sw-cr,
2377
- var(--_ctm-tab-dn-te-wt-sw-cr, var(--_ctm-dn-te-wt-sw-cr))));
3011
+ padding: var(
3012
+ --_ctm-mob-lt-mx-dy-se-pg,
3013
+ var(--_ctm-tab-lt-mx-dy-se-pg, var(--_ctm-lt-mx-dy-se-pg, var(--_tst-lt-mx-dy-se-pg)))
3014
+ );
3015
+
3016
+ background-color: var(
3017
+ --_ctm-mob-dn-te-wt-bd-cr,
3018
+ var(--_ctm-tab-dn-te-wt-bd-cr, var(--_ctm-dn-te-wt-bd-cr, var(--_tst-dn-te-wt-bd-cr)))
3019
+ );
3020
+
3021
+ border-radius: var(
3022
+ --_ctm-mob-dn-te-wt-br-rs,
3023
+ var(--_ctm-tab-dn-te-wt-br-rs, var(--_ctm-dn-te-wt-br-rs, var(--_tst-dn-te-wt-br-rs)))
3024
+ );
3025
+
3026
+ box-shadow: var(
3027
+ --_show-shadow,
3028
+ var(
3029
+ --_ctm-mob-dn-te-wt-sw-ae,
3030
+ var(--_ctm-tab-dn-te-wt-sw-ae, var(--_ctm-dn-te-wt-sw-ae))
3031
+ )
3032
+ var(
3033
+ --_ctm-mob-dn-te-wt-sw-br,
3034
+ var(--_ctm-tab-dn-te-wt-sw-br, var(--_ctm-dn-te-wt-sw-br))
3035
+ )
3036
+ var(
3037
+ --_ctm-mob-dn-te-wt-sw-sd,
3038
+ var(--_ctm-tab-dn-te-wt-sw-sd, var(--_ctm-dn-te-wt-sw-sd))
3039
+ )
3040
+ var(
3041
+ --_ctm-mob-dn-te-wt-sw-cr,
3042
+ var(--_ctm-tab-dn-te-wt-sw-cr, var(--_ctm-dn-te-wt-sw-cr))
3043
+ )
3044
+ );
2378
3045
 
2379
3046
  width: 100%;
2380
3047
 
2381
3048
  .table__container {
2382
- background-color: var(--_ctm-mob-dn-te-bd-cr,
2383
- var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr)));
3049
+ background-color: var(
3050
+ --_ctm-mob-dn-te-bd-cr,
3051
+ var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
3052
+ );
2384
3053
 
2385
- border-radius: var(--_ctm-mob-dn-te-br-rs,
2386
- var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs)));
3054
+ border-radius: var(
3055
+ --_ctm-mob-dn-te-br-rs,
3056
+ var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs))
3057
+ );
2387
3058
 
2388
- box-shadow: var(--_show-table-shadow,
2389
- var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae))) var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br))) var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd))) var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr))));
3059
+ box-shadow: var(
3060
+ --_show-table-shadow,
3061
+ var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae)))
3062
+ var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br)))
3063
+ var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd)))
3064
+ var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr)))
3065
+ );
2390
3066
  }
2391
3067
 
2392
3068
  h3 {
@@ -2394,126 +3070,206 @@ $minWidth: 70px;
2394
3070
  width: 100%;
2395
3071
  margin-bottom: 10px;
2396
3072
  }
2397
-
2398
3073
  table {
2399
3074
  border-collapse: collapse;
2400
3075
  // border: none;
2401
3076
  width: 100%;
2402
3077
  // height: 100%;
2403
- text-align: var(--_ctm-mob-lt-mx-dy-se-ct-at,
2404
- var(--_ctm-tab-lt-mx-dy-se-ct-at, var(--_ctm-lt-mx-dy-se-ct-at)));
3078
+ text-align: var(
3079
+ --_ctm-mob-lt-mx-dy-se-ct-at,
3080
+ var(--_ctm-tab-lt-mx-dy-se-ct-at, var(--_ctm-lt-mx-dy-se-ct-at))
3081
+ );
2405
3082
  width: max-content;
2406
3083
  min-width: 100%;
2407
3084
  table-layout: auto;
2408
-
2409
3085
  th,
2410
3086
  td {
2411
3087
  border: none;
2412
3088
  }
2413
-
2414
3089
  thead {
2415
- background-color: var(--_ctm-mob-dn-te-hr-bd-cr,
2416
- var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr)));
3090
+ background-color: var(
3091
+ --_ctm-mob-dn-te-hr-bd-cr,
3092
+ var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))
3093
+ );
2417
3094
 
2418
3095
  .thead__row__divider {
2419
- height: var(--_ctm-mob-lt-mx-dy-se-hr-ht,
2420
- var(--_ctm-tab-lt-mx-dy-se-hr-ht, var(--_ctm-lt-mx-dy-se-hr-ht)));
3096
+ height: var(
3097
+ --_ctm-mob-lt-mx-dy-se-hr-ht,
3098
+ var(--_ctm-tab-lt-mx-dy-se-hr-ht, var(--_ctm-lt-mx-dy-se-hr-ht))
3099
+ );
2421
3100
 
2422
3101
  .th__col__divider {
2423
- padding: var(--_ctm-mob-lt-mx-dy-se-hr-cl-pg,
2424
- var(--_ctm-tab-lt-mx-dy-se-hr-cl-pg, var(--_ctm-lt-mx-dy-se-hr-cl-pg)));
2425
-
2426
- color: var(--_ctm-mob-dn-hr-tt-cr,
2427
- var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr)));
2428
-
2429
- font-family: var(--_ctm-mob-dn-hr-tt-ft-fy,
2430
- var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy)));
2431
- text-transform: var(--_ctm-mob-dn-hr-tt-tt-tm,
2432
- var(--_ctm-tab-dn-hr-tt-tt-tm, var(--_ctm-dn-hr-tt-tt-tm)));
2433
- word-wrap: var(--_ctm-mob-dn-hr-tt-wd-wp,
2434
- var(--_ctm-tab-dn-hr-tt-wd-wp, var(--_ctm-dn-hr-tt-wd-wp)));
2435
- word-break: var(--_ctm-mob-dn-hr-tt-wd-bk,
2436
- var(--_ctm-tab-dn-hr-tt-wd-bk, var(--_ctm-dn-hr-tt-wd-bk)));
2437
-
2438
- font-size: var(--_ctm-mob-dn-hr-tt-ft-se,
2439
- var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se)));
2440
-
2441
- font-weight: var(--_ctm-mob-dn-hr-tt-ft-wt,
2442
- var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt)));
2443
-
2444
- text-decoration: var(--_ctm-mob-dn-hr-tt-ue,
2445
- var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue)));
2446
-
2447
- font-style: var(--_ctm-mob-dn-hr-tt-ft-se-ic,
2448
- var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic)));
2449
-
2450
- text-align: var(--_ctm-mob-dn-hr-tt-tt-an,
2451
- var(--_ctm-tab-dn-hr-tt-tt-an, var(--_ctm-dn-hr-tt-tt-an)));
2452
-
2453
- letter-spacing: var(--_ctm-mob-dn-hr-tt-lr-sg,
2454
- var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg)));
2455
-
2456
- line-height: var(--_ctm-mob-dn-hr-tt-le-ht,
2457
- var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht)));
3102
+ padding: var(
3103
+ --_ctm-mob-lt-mx-dy-se-hr-cl-pg,
3104
+ var(--_ctm-tab-lt-mx-dy-se-hr-cl-pg, var(--_ctm-lt-mx-dy-se-hr-cl-pg))
3105
+ );
3106
+
3107
+ color: var(
3108
+ --_ctm-mob-dn-hr-tt-cr,
3109
+ var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr))
3110
+ );
3111
+
3112
+ font-family: var(
3113
+ --_ctm-mob-dn-hr-tt-ft-fy,
3114
+ var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
3115
+ );
3116
+ text-transform: var(
3117
+ --_ctm-mob-dn-hr-tt-tt-tm,
3118
+ var(--_ctm-tab-dn-hr-tt-tt-tm, var(--_ctm-dn-hr-tt-tt-tm))
3119
+ );
3120
+ word-wrap: var(
3121
+ --_ctm-mob-dn-hr-tt-wd-wp,
3122
+ var(--_ctm-tab-dn-hr-tt-wd-wp, var(--_ctm-dn-hr-tt-wd-wp))
3123
+ );
3124
+ word-break: var(
3125
+ --_ctm-mob-dn-hr-tt-wd-bk,
3126
+ var(--_ctm-tab-dn-hr-tt-wd-bk, var(--_ctm-dn-hr-tt-wd-bk))
3127
+ );
3128
+
3129
+ font-size: var(
3130
+ --_ctm-mob-dn-hr-tt-ft-se,
3131
+ var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se))
3132
+ );
3133
+
3134
+ font-weight: var(
3135
+ --_ctm-mob-dn-hr-tt-ft-wt,
3136
+ var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt))
3137
+ );
3138
+
3139
+ text-decoration: var(
3140
+ --_ctm-mob-dn-hr-tt-ue,
3141
+ var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue))
3142
+ );
3143
+
3144
+ font-style: var(
3145
+ --_ctm-mob-dn-hr-tt-ft-se-ic,
3146
+ var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic))
3147
+ );
3148
+
3149
+ text-align: var(
3150
+ --_ctm-mob-dn-hr-tt-tt-an,
3151
+ var(--_ctm-tab-dn-hr-tt-tt-an, var(--_ctm-dn-hr-tt-tt-an))
3152
+ );
3153
+
3154
+ letter-spacing: var(
3155
+ --_ctm-mob-dn-hr-tt-lr-sg,
3156
+ var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg))
3157
+ );
3158
+
3159
+ line-height: var(
3160
+ --_ctm-mob-dn-hr-tt-le-ht,
3161
+ var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht))
3162
+ );
2458
3163
  }
2459
3164
  }
2460
3165
  }
2461
-
2462
3166
  tbody {
2463
3167
  .tbody__row__divider {
2464
- background-color: var(--_ctm-mob-dn-te-rw-bd-cr,
2465
- var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr)));
3168
+ background-color: var(
3169
+ --_ctm-mob-dn-te-rw-bd-cr,
3170
+ var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
3171
+ );
2466
3172
 
2467
- height: var(--_ctm-mob-lt-mx-dy-se-rw-ht,
2468
- var(--_ctm-tab-lt-mx-dy-se-rw-ht, var(--_ctm-lt-mx-dy-se-rw-ht)));
3173
+ height: var(
3174
+ --_ctm-mob-lt-mx-dy-se-rw-ht,
3175
+ var(--_ctm-tab-lt-mx-dy-se-rw-ht, var(--_ctm-lt-mx-dy-se-rw-ht))
3176
+ );
2469
3177
 
2470
3178
  .td__col__divider {
2471
- padding: var(--_ctm-mob-lt-mx-dy-se-rw-cl-pg,
2472
- var(--_ctm-tab-lt-mx-dy-se-rw-cl-pg, var(--_ctm-lt-mx-dy-se-rw-cl-pg)));
2473
-
2474
- color: var(--_sf-hr-fc,
2475
- var(--_ctm-mob-dn-rw-tt-cr,
2476
- var(--_ctm-tab-dn-rw-tt-cr, var(--_ctm-dn-rw-tt-cr))));
2477
-
2478
- font-family: var(--_sf-hr-ff,
2479
- var(--_ctm-mob-dn-rw-tt-ft-fy,
2480
- var(--_ctm-tab-dn-rw-tt-ft-fy, var(--_ctm-dn-rw-tt-ft-fy))));
2481
- text-transform: var(--_sf-hr-tt-tm,
2482
- var(--_ctm-mob-dn-rw-tt-tt-tm,
2483
- var(--_ctm-tab-dn-rw-tt-tt-tm, var(--_ctm-dn-rw-tt-tt-tm))));
2484
- word-wrap: var(--_sf-hr-wd-wp,
2485
- var(--_ctm-mob-dn-rw-tt-wd-wp,
2486
- var(--_ctm-tab-dn-rw-tt-wd-wp, var(--_ctm-dn-rw-tt-wd-wp))));
2487
- word-break: var(--_sf-hr-wd-bk,
2488
- var(--_ctm-mob-dn-rw-tt-wd-bk,
2489
- var(--_ctm-tab-dn-rw-tt-wd-bk, var(--_ctm-dn-rw-tt-wd-bk))));
2490
-
2491
- font-size: var(--_sf-hr-fs,
2492
- var(--_ctm-mob-dn-rw-tt-ft-se,
2493
- var(--_ctm-tab-dn-rw-tt-ft-se, var(--_ctm-dn-rw-tt-ft-se))));
2494
-
2495
- text-decoration: var(--_ctm-mob-dn-rw-tt-ue,
2496
- var(--_ctm-tab-dn-rw-tt-ue, var(--_ctm-dn-rw-tt-ue)));
2497
-
2498
- font-weight: var(--_sf-hr-fw,
2499
- var(--_ctm-mob-dn-rw-tt-ft-wt,
2500
- var(--_ctm-tab-dn-rw-tt-ft-wt, var(--_ctm-dn-rw-tt-ft-wt))));
2501
-
2502
- font-style: var(--_sf-hr-ft,
2503
- var(--_ctm-mob-dn-rw-tt-ft-se-ic,
2504
- var(--_ctm-tab-dn-rw-tt-ft-se-ic, var(--_ctm-dn-rw-tt-ft-se-ic))));
2505
-
2506
- text-align: var(--_sf-hr-ta,
2507
- var(--_ctm-mob-dn-rw-tt-tt-an,
2508
- var(--_ctm-tab-dn-rw-tt-tt-an, var(--_ctm-dn-rw-tt-tt-an))));
2509
-
2510
- letter-spacing: var(--_sf-hr-ls,
2511
- var(--_ctm-mob-dn-rw-tt-lr-sg,
2512
- var(--_ctm-tab-dn-rw-tt-lr-sg, var(--_ctm-dn-rw-tt-lr-sg))));
2513
-
2514
- line-height: var(--_sf-hr-lh,
2515
- var(--_ctm-mob-dn-rw-tt-le-ht,
2516
- var(--_ctm-tab-dn-rw-tt-le-ht, var(--_ctm-dn-rw-tt-le-ht))));
3179
+ padding: var(
3180
+ --_ctm-mob-lt-mx-dy-se-rw-cl-pg,
3181
+ var(--_ctm-tab-lt-mx-dy-se-rw-cl-pg, var(--_ctm-lt-mx-dy-se-rw-cl-pg))
3182
+ );
3183
+
3184
+ color: var(
3185
+ --_sf-hr-fc,
3186
+ var(
3187
+ --_ctm-mob-dn-rw-tt-cr,
3188
+ var(--_ctm-tab-dn-rw-tt-cr, var(--_ctm-dn-rw-tt-cr))
3189
+ )
3190
+ );
3191
+
3192
+ font-family: var(
3193
+ --_sf-hr-ff,
3194
+ var(
3195
+ --_ctm-mob-dn-rw-tt-ft-fy,
3196
+ var(--_ctm-tab-dn-rw-tt-ft-fy, var(--_ctm-dn-rw-tt-ft-fy))
3197
+ )
3198
+ );
3199
+ text-transform: var(
3200
+ --_sf-hr-tt-tm,
3201
+ var(
3202
+ --_ctm-mob-dn-rw-tt-tt-tm,
3203
+ var(--_ctm-tab-dn-rw-tt-tt-tm, var(--_ctm-dn-rw-tt-tt-tm))
3204
+ )
3205
+ );
3206
+ word-wrap: var(
3207
+ --_sf-hr-wd-wp,
3208
+ var(
3209
+ --_ctm-mob-dn-rw-tt-wd-wp,
3210
+ var(--_ctm-tab-dn-rw-tt-wd-wp, var(--_ctm-dn-rw-tt-wd-wp))
3211
+ )
3212
+ );
3213
+ word-break: var(
3214
+ --_sf-hr-wd-bk,
3215
+ var(
3216
+ --_ctm-mob-dn-rw-tt-wd-bk,
3217
+ var(--_ctm-tab-dn-rw-tt-wd-bk, var(--_ctm-dn-rw-tt-wd-bk))
3218
+ )
3219
+ );
3220
+
3221
+ font-size: var(
3222
+ --_sf-hr-fs,
3223
+ var(
3224
+ --_ctm-mob-dn-rw-tt-ft-se,
3225
+ var(--_ctm-tab-dn-rw-tt-ft-se, var(--_ctm-dn-rw-tt-ft-se))
3226
+ )
3227
+ );
3228
+
3229
+ text-decoration: var(
3230
+ --_ctm-mob-dn-rw-tt-ue,
3231
+ var(--_ctm-tab-dn-rw-tt-ue, var(--_ctm-dn-rw-tt-ue))
3232
+ );
3233
+
3234
+ font-weight: var(
3235
+ --_sf-hr-fw,
3236
+ var(
3237
+ --_ctm-mob-dn-rw-tt-ft-wt,
3238
+ var(--_ctm-tab-dn-rw-tt-ft-wt, var(--_ctm-dn-rw-tt-ft-wt))
3239
+ )
3240
+ );
3241
+
3242
+ font-style: var(
3243
+ --_sf-hr-ft,
3244
+ var(
3245
+ --_ctm-mob-dn-rw-tt-ft-se-ic,
3246
+ var(--_ctm-tab-dn-rw-tt-ft-se-ic, var(--_ctm-dn-rw-tt-ft-se-ic))
3247
+ )
3248
+ );
3249
+
3250
+ text-align: var(
3251
+ --_sf-hr-ta,
3252
+ var(
3253
+ --_ctm-mob-dn-rw-tt-tt-an,
3254
+ var(--_ctm-tab-dn-rw-tt-tt-an, var(--_ctm-dn-rw-tt-tt-an))
3255
+ )
3256
+ );
3257
+
3258
+ letter-spacing: var(
3259
+ --_sf-hr-ls,
3260
+ var(
3261
+ --_ctm-mob-dn-rw-tt-lr-sg,
3262
+ var(--_ctm-tab-dn-rw-tt-lr-sg, var(--_ctm-dn-rw-tt-lr-sg))
3263
+ )
3264
+ );
3265
+
3266
+ line-height: var(
3267
+ --_sf-hr-lh,
3268
+ var(
3269
+ --_ctm-mob-dn-rw-tt-le-ht,
3270
+ var(--_ctm-tab-dn-rw-tt-le-ht, var(--_ctm-dn-rw-tt-le-ht))
3271
+ )
3272
+ );
2517
3273
  }
2518
3274
  }
2519
3275
  }
@@ -2522,13 +3278,18 @@ $minWidth: 70px;
2522
3278
  .pagination {
2523
3279
  display: var(--_d-flex);
2524
3280
  align-items: var(--_align-center);
2525
- justify-content: var(--_ctm-mob-lt-mx-dy-se-pn-at,
2526
- var(--_ctm-tab-lt-mx-dy-se-pn-at, var(--_ctm-lt-mx-dy-se-pn-at)));
3281
+ justify-content: var(
3282
+ --_ctm-mob-lt-mx-dy-se-pn-at,
3283
+ var(--_ctm-tab-lt-mx-dy-se-pn-at, var(--_ctm-lt-mx-dy-se-pn-at))
3284
+ );
2527
3285
  margin-top: 10px;
2528
- background-color: var(--_sf-bd-cr,
2529
- var(--_ctm-mob-dn-pn-dt-se-bd-cr,
2530
- var(--_ctm-tab-dn-pn-dt-se-bd-cr, var(--_ctm-dn-pn-dt-se-bd-cr))));
2531
-
3286
+ background-color: var(
3287
+ --_sf-bd-cr,
3288
+ var(
3289
+ --_ctm-mob-dn-pn-dt-se-bd-cr,
3290
+ var(--_ctm-tab-dn-pn-dt-se-bd-cr, var(--_ctm-dn-pn-dt-se-bd-cr))
3291
+ )
3292
+ );
2532
3293
  &.pagination__center {
2533
3294
  justify-content: var(justify-center);
2534
3295
  }
@@ -2537,21 +3298,18 @@ $minWidth: 70px;
2537
3298
  svg {
2538
3299
  width: var(--_width-18);
2539
3300
  height: var(--_height-18);
2540
-
2541
3301
  path {
2542
3302
  stroke: var(--_gray-500);
2543
3303
  // stroke: var(--_ctm-dn-pn-in-c1, var(--_tst-dn-pn-in-c1));
2544
- // Overrides the stroke-width presentation attribute baked into the icon markup.
2545
- stroke-width: prepareMediaVariable(--_ctm-dn-pn-se-wh, 1.25);
3304
+ // Overrides the stroke-width presentation attribute baked into the icon markup.
3305
+ stroke-width: prepareMediaVariable(--_ctm-dn-pn-se-wh, 1.25);
2546
3306
  }
2547
3307
  }
2548
3308
  }
2549
-
2550
3309
  span {
2551
3310
  float: left;
2552
3311
  padding: var(--_pd-8) var(--_pd-16);
2553
3312
  text-decoration: none;
2554
-
2555
3313
  span {
2556
3314
  // color: var(--_sf-hr-fc, var(--_ctm-dn-pn-bn-cr, var(--_tst-dn-pn-bn-cr)));
2557
3315
  // font-size: var(--_sf-hr-fs, var(--_ctm-dn-pn-ft-se, var(--_tst-dn-pn-ft-se)));
@@ -2563,7 +3321,6 @@ $minWidth: 70px;
2563
3321
  // letter-spacing: var(--_sf-hr-ls, var(--_ctm-dn-pn-lr-sg, var(--_tst-dn-pn-lr-sg)));
2564
3322
  // line-height: var(--_sf-hr-lh, var(--_ctm-dn-pn-le-ht, var(--_tst-dn-pn-le-ht)));
2565
3323
  }
2566
-
2567
3324
  &.active:hover {
2568
3325
  &hover {
2569
3326
  --_sf-hr-fc: var(--_ctm-dn-pn-hr-se-cr, var(--_tst-dn-pn-hr-se-cr));
@@ -2579,159 +3336,261 @@ $minWidth: 70px;
2579
3336
  --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
2580
3337
  }
2581
3338
  }
2582
-
2583
3339
  &.active {
2584
- color: var(--_sf-hr-fc,
2585
- var(--_ctm-mob-dn-pn-dt-se-cr,
2586
- var(--_ctm-tab-dn-pn-dt-se-cr, var(--_ctm-dn-pn-dt-se-cr))));
2587
-
2588
- font-family: var(--_sf-hr-ff,
2589
- var(--_ctm-mob-dn-pn-dt-se-ft-fy,
2590
- var(--_ctm-tab-dn-pn-dt-se-ft-fy, var(--_ctm-dn-pn-dt-se-ft-fy))));
2591
- text-transform: var(--_sf-hr-tt-tm,
2592
- var(--_ctm-mob-dn-pn-dt-se-tt-tm,
2593
- var(--_ctm-tab-dn-pn-dt-se-tt-tm, var(--_ctm-dn-pn-dt-se-tt-tm))));
2594
- word-wrap: var(--_sf-hr-wd-wp,
2595
- var(--_ctm-mob-dn-pn-dt-se-wd-wp,
2596
- var(--_ctm-tab-dn-pn-dt-se-wd-wp, var(--_ctm-dn-pn-dt-se-wd-wp))));
2597
- word-break: var(--_sf-hr-wd-bk,
2598
- var(--_ctm-mob-dn-pn-dt-se-wd-bk,
2599
- var(--_ctm-tab-dn-pn-dt-se-wd-bk, var(--_ctm-dn-pn-dt-se-wd-bk))));
2600
-
2601
- font-size: var(--_sf-hr-fs,
2602
- var(--_ctm-mob-dn-pn-dt-se-ft-se,
2603
- var(--_ctm-tab-dn-pn-dt-se-ft-se, var(--_ctm-dn-pn-dt-se-ft-se))));
2604
-
2605
- text-decoration: var(--_sf-hr-td,
2606
- var(--_ctm-mob-dn-pn-dt-se-ue,
2607
- var(--_ctm-tab-dn-pn-dt-se-ue, var(--_ctm-dn-pn-dt-se-ue))));
2608
-
2609
- font-weight: var(--_sf-hr-fw,
2610
- var(--_ctm-mob-dn-pn-dt-se-ft-wt,
2611
- var(--_ctm-tab-dn-pn-dt-se-ft-wt, var(--_ctm-dn-pn-dt-se-ft-wt))));
2612
-
2613
- font-style: var(--_sf-hr-ft,
2614
- var(--_ctm-mob-dn-pn-dt-se-ft-se-ic,
2615
- var(--_ctm-tab-dn-pn-dt-se-ft-se-ic, var(--_ctm-dn-pn-dt-se-ft-se-ic))));
2616
-
2617
- text-align: var(--_sf-hr-ta,
2618
- var(--_ctm-mob-dn-pn-dt-se-tt-an,
2619
- var(--_ctm-tab-dn-pn-dt-se-tt-an, var(--_ctm-dn-pn-dt-se-tt-an))));
2620
-
2621
- letter-spacing: var(--_sf-hr-ls,
2622
- var(--_ctm-mob-dn-pn-dt-se-lr-sg,
2623
- var(--_ctm-tab-dn-pn-dt-se-lr-sg, var(--_ctm-dn-pn-dt-se-lr-sg))));
2624
-
2625
- line-height: var(--_sf-hr-lh,
2626
- var(--_ctm-mob-dn-pn-dt-se-le-ht,
2627
- var(--_ctm-tab-dn-pn-dt-se-le-ht, var(--_ctm-dn-pn-dt-se-le-ht))));
3340
+ color: var(
3341
+ --_sf-hr-fc,
3342
+ var(
3343
+ --_ctm-mob-dn-pn-dt-se-cr,
3344
+ var(--_ctm-tab-dn-pn-dt-se-cr, var(--_ctm-dn-pn-dt-se-cr))
3345
+ )
3346
+ );
3347
+
3348
+ font-family: var(
3349
+ --_sf-hr-ff,
3350
+ var(
3351
+ --_ctm-mob-dn-pn-dt-se-ft-fy,
3352
+ var(--_ctm-tab-dn-pn-dt-se-ft-fy, var(--_ctm-dn-pn-dt-se-ft-fy))
3353
+ )
3354
+ );
3355
+ text-transform: var(
3356
+ --_sf-hr-tt-tm,
3357
+ var(
3358
+ --_ctm-mob-dn-pn-dt-se-tt-tm,
3359
+ var(--_ctm-tab-dn-pn-dt-se-tt-tm, var(--_ctm-dn-pn-dt-se-tt-tm))
3360
+ )
3361
+ );
3362
+ word-wrap: var(
3363
+ --_sf-hr-wd-wp,
3364
+ var(
3365
+ --_ctm-mob-dn-pn-dt-se-wd-wp,
3366
+ var(--_ctm-tab-dn-pn-dt-se-wd-wp, var(--_ctm-dn-pn-dt-se-wd-wp))
3367
+ )
3368
+ );
3369
+ word-break: var(
3370
+ --_sf-hr-wd-bk,
3371
+ var(
3372
+ --_ctm-mob-dn-pn-dt-se-wd-bk,
3373
+ var(--_ctm-tab-dn-pn-dt-se-wd-bk, var(--_ctm-dn-pn-dt-se-wd-bk))
3374
+ )
3375
+ );
3376
+
3377
+ font-size: var(
3378
+ --_sf-hr-fs,
3379
+ var(
3380
+ --_ctm-mob-dn-pn-dt-se-ft-se,
3381
+ var(--_ctm-tab-dn-pn-dt-se-ft-se, var(--_ctm-dn-pn-dt-se-ft-se))
3382
+ )
3383
+ );
3384
+
3385
+ text-decoration: var(
3386
+ --_sf-hr-td,
3387
+ var(
3388
+ --_ctm-mob-dn-pn-dt-se-ue,
3389
+ var(--_ctm-tab-dn-pn-dt-se-ue, var(--_ctm-dn-pn-dt-se-ue))
3390
+ )
3391
+ );
3392
+
3393
+ font-weight: var(
3394
+ --_sf-hr-fw,
3395
+ var(
3396
+ --_ctm-mob-dn-pn-dt-se-ft-wt,
3397
+ var(--_ctm-tab-dn-pn-dt-se-ft-wt, var(--_ctm-dn-pn-dt-se-ft-wt))
3398
+ )
3399
+ );
3400
+
3401
+ font-style: var(
3402
+ --_sf-hr-ft,
3403
+ var(
3404
+ --_ctm-mob-dn-pn-dt-se-ft-se-ic,
3405
+ var(--_ctm-tab-dn-pn-dt-se-ft-se-ic, var(--_ctm-dn-pn-dt-se-ft-se-ic))
3406
+ )
3407
+ );
3408
+
3409
+ text-align: var(
3410
+ --_sf-hr-ta,
3411
+ var(
3412
+ --_ctm-mob-dn-pn-dt-se-tt-an,
3413
+ var(--_ctm-tab-dn-pn-dt-se-tt-an, var(--_ctm-dn-pn-dt-se-tt-an))
3414
+ )
3415
+ );
3416
+
3417
+ letter-spacing: var(
3418
+ --_sf-hr-ls,
3419
+ var(
3420
+ --_ctm-mob-dn-pn-dt-se-lr-sg,
3421
+ var(--_ctm-tab-dn-pn-dt-se-lr-sg, var(--_ctm-dn-pn-dt-se-lr-sg))
3422
+ )
3423
+ );
3424
+
3425
+ line-height: var(
3426
+ --_sf-hr-lh,
3427
+ var(
3428
+ --_ctm-mob-dn-pn-dt-se-le-ht,
3429
+ var(--_ctm-tab-dn-pn-dt-se-le-ht, var(--_ctm-dn-pn-dt-se-le-ht))
3430
+ )
3431
+ );
2628
3432
  }
2629
3433
  }
2630
-
2631
3434
  .pagination__arrows {
2632
- color: var(--_sf-hr-fc,
2633
- var(--_ctm-mob-dn-pn-in-c1, var(--_ctm-tab-dn-pn-in-c1, var(--_ctm-dn-pn-in-c1))));
2634
-
2635
- font-size: var(--_sf-hr-fs,
2636
- var(--_ctm-mob-dn-pn-in-se, var(--_ctm-tab-dn-pn-in-se, var(--_ctm-dn-pn-in-se))));
3435
+ color: var(
3436
+ --_sf-hr-fc,
3437
+ var(--_ctm-mob-dn-pn-in-c1, var(--_ctm-tab-dn-pn-in-c1, var(--_ctm-dn-pn-in-c1)))
3438
+ );
3439
+
3440
+ font-size: var(
3441
+ --_sf-hr-fs,
3442
+ var(--_ctm-mob-dn-pn-in-se, var(--_ctm-tab-dn-pn-in-se, var(--_ctm-dn-pn-in-se)))
3443
+ );
2637
3444
  }
2638
3445
  }
2639
3446
  }
2640
-
2641
3447
  .btn__with__text[data-btn-name="loadMore"] {
2642
3448
  &[data-show-shadow="false"] {
2643
3449
  --_show-shadow: none;
2644
3450
  }
2645
-
2646
3451
  &[data-icon-position="left"] {
2647
3452
  --_sf-fd-bn: row;
2648
3453
  }
2649
-
2650
3454
  &[data-icon-position="right"] {
2651
3455
  --_sf-fd-bn: row-reverse;
2652
3456
  }
2653
-
2654
3457
  &[data-icon-position="center"] {
2655
3458
  --_sf-fd-bn: row;
2656
3459
  }
2657
3460
 
2658
3461
  &:hover {
2659
- --_sf-hr-bd-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-bd-cr,
2660
- var(--_ctm-tab-dn-ld-me-bn-hr-se-bd-cr, var(--_ctm-dn-ld-me-bn-hr-se-bd-cr)));
2661
- --_sf-hr-br-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-cr,
2662
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-cr, var(--_ctm-dn-ld-me-bn-hr-se-br-cr)));
2663
- --_sf-hr-br-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-se,
2664
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-se, var(--_ctm-dn-ld-me-bn-hr-se-br-se)));
2665
- --_sf-hr-br-wh: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-wh,
2666
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-wh, var(--_ctm-dn-ld-me-bn-hr-se-br-wh)));
2667
- --_sf-hr-br-rs: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-rs,
2668
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-rs, var(--_ctm-dn-ld-me-bn-hr-se-br-rs)));
2669
- --_sf-hr-at: var(--_ctm-mob-dn-ld-me-bn-hr-se-at,
2670
- var(--_ctm-tab-dn-ld-me-bn-hr-se-at, var(--_ctm-dn-ld-me-bn-hr-se-at)));
2671
- --_sf-hr-gp: var(--_ctm-mob-dn-ld-me-bn-hr-se-gp,
2672
- var(--_ctm-tab-dn-ld-me-bn-hr-se-gp, var(--_ctm-dn-ld-me-bn-hr-se-gp)));
3462
+ --_sf-hr-bd-cr: var(
3463
+ --_ctm-mob-dn-ld-me-bn-hr-se-bd-cr,
3464
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-bd-cr, var(--_ctm-dn-ld-me-bn-hr-se-bd-cr))
3465
+ );
3466
+ --_sf-hr-br-cr: var(
3467
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-cr,
3468
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-cr, var(--_ctm-dn-ld-me-bn-hr-se-br-cr))
3469
+ );
3470
+ --_sf-hr-br-se: var(
3471
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-se,
3472
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-se, var(--_ctm-dn-ld-me-bn-hr-se-br-se))
3473
+ );
3474
+ --_sf-hr-br-wh: var(
3475
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-wh,
3476
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-wh, var(--_ctm-dn-ld-me-bn-hr-se-br-wh))
3477
+ );
3478
+ --_sf-hr-br-rs: var(
3479
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-rs,
3480
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-rs, var(--_ctm-dn-ld-me-bn-hr-se-br-rs))
3481
+ );
3482
+ --_sf-hr-at: var(
3483
+ --_ctm-mob-dn-ld-me-bn-hr-se-at,
3484
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-at, var(--_ctm-dn-ld-me-bn-hr-se-at))
3485
+ );
3486
+ --_sf-hr-gp: var(
3487
+ --_ctm-mob-dn-ld-me-bn-hr-se-gp,
3488
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-gp, var(--_ctm-dn-ld-me-bn-hr-se-gp))
3489
+ );
2673
3490
 
2674
3491
  // for shadow
2675
- --_sf-hr-sw-ae: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-ae,
2676
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-ae, var(--_ctm-dn-ld-me-bn-hr-se-sw-ae)));
2677
- --_sf-hr-sw-br: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-br,
2678
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-br, var(--_ctm-dn-ld-me-bn-hr-se-sw-br)));
2679
- --_sf-hr-sw-hr: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-hr,
2680
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-hr, var(--_ctm-dn-ld-me-bn-hr-se-sw-hr)));
2681
- --_sf-hr-sw-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-cr,
2682
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-cr, var(--_ctm-dn-ld-me-bn-hr-se-sw-cr)));
3492
+ --_sf-hr-sw-ae: var(
3493
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-ae,
3494
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-ae, var(--_ctm-dn-ld-me-bn-hr-se-sw-ae))
3495
+ );
3496
+ --_sf-hr-sw-br: var(
3497
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-br,
3498
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-br, var(--_ctm-dn-ld-me-bn-hr-se-sw-br))
3499
+ );
3500
+ --_sf-hr-sw-hr: var(
3501
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-hr,
3502
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-hr, var(--_ctm-dn-ld-me-bn-hr-se-sw-hr))
3503
+ );
3504
+ --_sf-hr-sw-cr: var(
3505
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-cr,
3506
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-cr, var(--_ctm-dn-ld-me-bn-hr-se-sw-cr))
3507
+ );
2683
3508
 
2684
3509
  // for font
2685
3510
 
2686
- --_sf-hr-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-cr,
2687
- var(--_ctm-tab-dn-ld-me-bn-hr-se-cr, var(--_ctm-dn-ld-me-bn-hr-se-cr)));
2688
- --_sf-hr-ft-fy: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-fy,
2689
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-fy, var(--_ctm-dn-ld-me-bn-hr-se-ft-fy)));
2690
- --_sf-hr-tt-tm: var(--_ctm-mob-dn-ld-me-bn-hr-se-tt-tm,
2691
- var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-tm, var(--_ctm-dn-ld-me-bn-hr-se-tt-tm)));
2692
- --_sf-hr-wd-wp: var(--_ctm-mob-dn-ld-me-bn-hr-se-wd-wp,
2693
- var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-wp, var(--_ctm-dn-ld-me-bn-hr-se-wd-wp)));
2694
- --_sf-hr-wd-bk: var(--_ctm-mob-dn-ld-me-bn-hr-se-wd-bk,
2695
- var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-bk, var(--_ctm-dn-ld-me-bn-hr-se-wd-bk)));
2696
- --_sf-hr-ft-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-se,
2697
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se, var(--_ctm-dn-ld-me-bn-hr-se-ft-se)));
2698
- --_sf-hr-ft-wt: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-wt,
2699
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-wt, var(--_ctm-dn-ld-me-bn-hr-se-ft-wt)));
2700
- --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-se-ic,
2701
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se-ic, var(--_ctm-dn-ld-me-bn-hr-se-ft-se-ic)));
2702
- --_sf-hr-tt-an: var(--_ctm-mob-dn-ld-me-bn-hr-se-tt-an,
2703
- var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-an, var(--_ctm-dn-ld-me-bn-hr-se-tt-an)));
2704
- --_sf-hr-lr-sg: var(--_ctm-mob-dn-ld-me-bn-hr-se-lr-sg,
2705
- var(--_ctm-tab-dn-ld-me-bn-hr-se-lr-sg, var(--_ctm-dn-ld-me-bn-hr-se-lr-sg)));
2706
- --_sf-hr-le-ht: var(--_ctm-mob-dn-ld-me-bn-hr-se-le-ht,
2707
- var(--_ctm-tab-dn-ld-me-bn-hr-se-le-ht, var(--_ctm-dn-ld-me-bn-hr-se-le-ht)));
2708
-
2709
- --_sf-hr-in-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-in-se,
2710
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se)));
2711
- --_sf-hr-in-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-in-se,
2712
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se)));
2713
- --_sf-hr-in-c1: var(--_ctm-mob-dn-ld-me-bn-hr-se-in-c1,
2714
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-c1, var(--_ctm-dn-ld-me-bn-hr-se-in-c1)));
2715
- --_sf-hr-ue: var(--_ctm-mob-dn-ld-me-bn-hr-se-ue,
2716
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ue, var(--_ctm-dn-ld-me-bn-hr-se-ue)));
3511
+ --_sf-hr-cr: var(
3512
+ --_ctm-mob-dn-ld-me-bn-hr-se-cr,
3513
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-cr, var(--_ctm-dn-ld-me-bn-hr-se-cr))
3514
+ );
3515
+ --_sf-hr-ft-fy: var(
3516
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-fy,
3517
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-fy, var(--_ctm-dn-ld-me-bn-hr-se-ft-fy))
3518
+ );
3519
+ --_sf-hr-tt-tm: var(
3520
+ --_ctm-mob-dn-ld-me-bn-hr-se-tt-tm,
3521
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-tm, var(--_ctm-dn-ld-me-bn-hr-se-tt-tm))
3522
+ );
3523
+ --_sf-hr-wd-wp: var(
3524
+ --_ctm-mob-dn-ld-me-bn-hr-se-wd-wp,
3525
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-wp, var(--_ctm-dn-ld-me-bn-hr-se-wd-wp))
3526
+ );
3527
+ --_sf-hr-wd-bk: var(
3528
+ --_ctm-mob-dn-ld-me-bn-hr-se-wd-bk,
3529
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-bk, var(--_ctm-dn-ld-me-bn-hr-se-wd-bk))
3530
+ );
3531
+ --_sf-hr-ft-se: var(
3532
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-se,
3533
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se, var(--_ctm-dn-ld-me-bn-hr-se-ft-se))
3534
+ );
3535
+ --_sf-hr-ft-wt: var(
3536
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-wt,
3537
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-wt, var(--_ctm-dn-ld-me-bn-hr-se-ft-wt))
3538
+ );
3539
+ --_sf-hr-ft-se-ic: var(
3540
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-se-ic,
3541
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se-ic, var(--_ctm-dn-ld-me-bn-hr-se-ft-se-ic))
3542
+ );
3543
+ --_sf-hr-tt-an: var(
3544
+ --_ctm-mob-dn-ld-me-bn-hr-se-tt-an,
3545
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-an, var(--_ctm-dn-ld-me-bn-hr-se-tt-an))
3546
+ );
3547
+ --_sf-hr-lr-sg: var(
3548
+ --_ctm-mob-dn-ld-me-bn-hr-se-lr-sg,
3549
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-lr-sg, var(--_ctm-dn-ld-me-bn-hr-se-lr-sg))
3550
+ );
3551
+ --_sf-hr-le-ht: var(
3552
+ --_ctm-mob-dn-ld-me-bn-hr-se-le-ht,
3553
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-le-ht, var(--_ctm-dn-ld-me-bn-hr-se-le-ht))
3554
+ );
3555
+
3556
+ --_sf-hr-in-se: var(
3557
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
3558
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
3559
+ );
3560
+ --_sf-hr-in-se: var(
3561
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
3562
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
3563
+ );
3564
+ --_sf-hr-in-c1: var(
3565
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-c1,
3566
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-c1, var(--_ctm-dn-ld-me-bn-hr-se-in-c1))
3567
+ );
3568
+ --_sf-hr-ue: var(
3569
+ --_ctm-mob-dn-ld-me-bn-hr-se-ue,
3570
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ue, var(--_ctm-dn-ld-me-bn-hr-se-ue))
3571
+ );
2717
3572
 
2718
3573
  // for pading and width
2719
- --_sf-hr-pg: var(--_ctm-mob-dn-ld-me-bn-hr-pg,
2720
- var(--_ctm-tab-dn-ld-me-bn-hr-pg, var(--_ctm-dn-ld-me-bn-hr-pg)));
2721
- --_sf-hr-wh: var(--_ctm-mob-dn-ld-me-bn-hr-wh,
2722
- var(--_ctm-tab-dn-ld-me-bn-hr-wh, var(--_ctm-dn-ld-me-bn-hr-wh)));
3574
+ --_sf-hr-pg: var(
3575
+ --_ctm-mob-dn-ld-me-bn-hr-pg,
3576
+ var(--_ctm-tab-dn-ld-me-bn-hr-pg, var(--_ctm-dn-ld-me-bn-hr-pg))
3577
+ );
3578
+ --_sf-hr-wh: var(
3579
+ --_ctm-mob-dn-ld-me-bn-hr-wh,
3580
+ var(--_ctm-tab-dn-ld-me-bn-hr-wh, var(--_ctm-dn-ld-me-bn-hr-wh))
3581
+ );
2723
3582
 
2724
3583
  &[data-hover-show-shadow="false"] {
2725
3584
  --_hover-show-shadow: none;
2726
3585
  }
2727
-
2728
3586
  &[data-hover-show-icon="false"] {
2729
3587
  --_hover-show-icon: none;
2730
3588
  }
2731
3589
  }
2732
-
2733
- background-color: var(--_sf-hr-bd-cr,
2734
- prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-bd-cr));
3590
+ background-color: var(
3591
+ --_sf-hr-bd-cr,
3592
+ prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-bd-cr)
3593
+ );
2735
3594
 
2736
3595
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-pg));
2737
3596
  width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-wh));
@@ -2744,7 +3603,10 @@ $minWidth: 70px;
2744
3603
 
2745
3604
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-rs));
2746
3605
 
2747
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-cr));
3606
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-ae))
3607
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-br))
3608
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-sd))
3609
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-cr));
2748
3610
 
2749
3611
  &[data-show-border="true"] {
2750
3612
  border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-cr));
@@ -2763,7 +3625,6 @@ $minWidth: 70px;
2763
3625
  text-transform: var(--_sf-hr-tt-tm, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-tt-tm));
2764
3626
  word-wrap: var(--_sf-hr-wd-wp, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-wd-wp));
2765
3627
  word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-wd-bk));
2766
-
2767
3628
  &.flex__overflow {
2768
3629
  white-space: normal;
2769
3630
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -2773,13 +3634,17 @@ $minWidth: 70px;
2773
3634
 
2774
3635
  font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-wt));
2775
3636
 
2776
- font-style: var(--_sf-hr-ft-se-ic,
2777
- prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se-ic));
3637
+ font-style: var(
3638
+ --_sf-hr-ft-se-ic,
3639
+ prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se-ic)
3640
+ );
2778
3641
 
2779
3642
  text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-tt-an));
2780
3643
 
2781
- letter-spacing: var(--_sf-hr-lr-sg,
2782
- prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-lr-sg));
3644
+ letter-spacing: var(
3645
+ --_sf-hr-lr-sg,
3646
+ prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-lr-sg)
3647
+ );
2783
3648
 
2784
3649
  line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-le-ht));
2785
3650
 
@@ -2788,7 +3653,6 @@ $minWidth: 70px;
2788
3653
 
2789
3654
  .icon {
2790
3655
  display: var(--_hover-show-icon, var(--_show-icon, flex));
2791
-
2792
3656
  svg {
2793
3657
  width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
2794
3658
  height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
@@ -2800,7 +3664,6 @@ $minWidth: 70px;
2800
3664
  }
2801
3665
  }
2802
3666
  }
2803
-
2804
3667
  [data-element-style="Text"] {
2805
3668
  display: inline-block;
2806
3669
  width: 100%;
@@ -2831,19 +3694,34 @@ $minWidth: 70px;
2831
3694
  width: var(--_ctm-mob-dn-it-wh, var(--_ctm-tab-dn-it-wh, var(--_ctm-dn-it-wh)));
2832
3695
  // height: 40px;
2833
3696
 
2834
- background-color: var(--_ctm-mob-dn-it-wh,
2835
- var(--_ctm-tab-dn-it-bd-cr, var(--_ctm-dn-it-bd-cr)));
2836
- box-shadow: var(--_ctm-mob-dn-it-sw-ae,
2837
- var(--_ctm-tab-dn-it-sw-ae, var(--_ctm-dn-it-sw-ae))) var(--_ctm-mob-dn-it-sw-br, var(--_ctm-tab-dn-it-sw-br, var(--_ctm-dn-it-sw-br))) var(--_ctm-mob-dn-it-sw-sd, var(--_ctm-tab-dn-it-sw-sd, var(--_ctm-dn-it-sw-sd))) var(--_ctm-mob-dn-it-sw-cr, var(--_ctm-tab-dn-it-sw-cr, var(--_ctm-dn-it-sw-cr)));
2838
- border-radius: var(--_ctm-mob-dn-it-br-rs,
2839
- var(--_ctm-tab-dn-it-br-rs, var(--_ctm-dn-it-br-rs)));
2840
-
2841
- border-color: var(--_ctm-mob-dn-it-br-cr,
2842
- var(--_ctm-tab-dn-it-br-cr, var(--_ctm-dn-it-br-cr)));
2843
- border-style: var(--_ctm-mob-dn-it-br-se,
2844
- var(--_ctm-tab-dn-it-br-se, var(--_ctm-dn-it-br-se)));
2845
- border-width: var(--_ctm-mob-dn-it-br-wh,
2846
- var(--_ctm-tab-dn-it-br-wh, var(--_ctm-dn-it-br-wh)));
3697
+ background-color: var(
3698
+ --_ctm-mob-dn-it-wh,
3699
+ var(--_ctm-tab-dn-it-bd-cr, var(--_ctm-dn-it-bd-cr))
3700
+ );
3701
+ box-shadow: var(
3702
+ --_ctm-mob-dn-it-sw-ae,
3703
+ var(--_ctm-tab-dn-it-sw-ae, var(--_ctm-dn-it-sw-ae))
3704
+ )
3705
+ var(--_ctm-mob-dn-it-sw-br, var(--_ctm-tab-dn-it-sw-br, var(--_ctm-dn-it-sw-br)))
3706
+ var(--_ctm-mob-dn-it-sw-sd, var(--_ctm-tab-dn-it-sw-sd, var(--_ctm-dn-it-sw-sd)))
3707
+ var(--_ctm-mob-dn-it-sw-cr, var(--_ctm-tab-dn-it-sw-cr, var(--_ctm-dn-it-sw-cr)));
3708
+ border-radius: var(
3709
+ --_ctm-mob-dn-it-br-rs,
3710
+ var(--_ctm-tab-dn-it-br-rs, var(--_ctm-dn-it-br-rs))
3711
+ );
3712
+
3713
+ border-color: var(
3714
+ --_ctm-mob-dn-it-br-cr,
3715
+ var(--_ctm-tab-dn-it-br-cr, var(--_ctm-dn-it-br-cr))
3716
+ );
3717
+ border-style: var(
3718
+ --_ctm-mob-dn-it-br-se,
3719
+ var(--_ctm-tab-dn-it-br-se, var(--_ctm-dn-it-br-se))
3720
+ );
3721
+ border-width: var(
3722
+ --_ctm-mob-dn-it-br-wh,
3723
+ var(--_ctm-tab-dn-it-br-wh, var(--_ctm-dn-it-br-wh))
3724
+ );
2847
3725
 
2848
3726
  padding: prepareMediaVariable(--_ctm-dn-it-pg);
2849
3727
  // flex-grow: 1;
@@ -2851,31 +3729,52 @@ $minWidth: 70px;
2851
3729
 
2852
3730
  &::placeholder {
2853
3731
  color: var(--_ctm-mob-dn-pr-tt-cr, var(--_ctm-tab-dn-pr-tt-cr, var(--_ctm-dn-pr-tt-cr)));
2854
- font-family: var(--_ctm-mob-dn-pr-tt-ft-fy,
2855
- var(--_ctm-tab-dn-pr-tt-ft-fy, var(--_ctm-dn-pr-tt-ft-fy)));
2856
- text-transform: var(--_ctm-mob-dn-pr-tt-tt-tm,
2857
- var(--_ctm-tab-dn-pr-tt-tt-tm, var(--_ctm-dn-pr-tt-tt-tm)));
2858
- word-wrap: var(--_ctm-mob-dn-pr-tt-wd-wp,
2859
- var(--_ctm-tab-dn-pr-tt-wd-wp, var(--_ctm-dn-pr-tt-wd-wp)));
2860
- word-break: var(--_ctm-mob-dn-pr-tt-wd-bk,
2861
- var(--_ctm-tab-dn-pr-tt-wd-bk, var(--_ctm-dn-pr-tt-wd-bk)));
2862
- font-size: var(--_ctm-mob-dn-pr-tt-ft-se,
2863
- var(--_ctm-tab-dn-pr-tt-ft-se, var(--_ctm-dn-pr-tt-ft-se)));
2864
- font-weight: var(--_ctm-mob-dn-pr-tt-ft-wt,
2865
- var(--_ctm-tab-dn-pr-tt-ft-wt, var(--_ctm-dn-pr-tt-ft-wt)));
2866
- font-style: var(--_ctm-mob-dn-pr-tt-ft-se-ic,
2867
- var(--_ctm-tab-dn-pr-tt-ft-se-ic, var(--_ctm-dn-pr-tt-ft-se-ic)));
2868
- text-align: var(--_ctm-mob-dn-pr-tt-tt-an,
2869
- var(--_ctm-tab-dn-pr-tt-tt-an, var(--_ctm-dn-pr-tt-tt-an)));
2870
- letter-spacing: var(--_ctm-mob-dn-pr-tt-lr-sg,
2871
- var(--_ctm-tab-dn-pr-tt-lr-sg, var(--_ctm-dn-pr-tt-lr-sg)));
2872
- line-height: var(--_ctm-mob-dn-pr-tt-le-ht,
2873
- var(--_ctm-tab-dn-pr-tt-le-ht, var(--_ctm-dn-pr-tt-le-ht)));
2874
- text-decoration: var(--_ctm-mob-dn-pr-tt-ue,
2875
- var(--_ctm-tab-dn-pr-tt-ue, var(--_ctm-dn-pr-tt-ue)));
3732
+ font-family: var(
3733
+ --_ctm-mob-dn-pr-tt-ft-fy,
3734
+ var(--_ctm-tab-dn-pr-tt-ft-fy, var(--_ctm-dn-pr-tt-ft-fy))
3735
+ );
3736
+ text-transform: var(
3737
+ --_ctm-mob-dn-pr-tt-tt-tm,
3738
+ var(--_ctm-tab-dn-pr-tt-tt-tm, var(--_ctm-dn-pr-tt-tt-tm))
3739
+ );
3740
+ word-wrap: var(
3741
+ --_ctm-mob-dn-pr-tt-wd-wp,
3742
+ var(--_ctm-tab-dn-pr-tt-wd-wp, var(--_ctm-dn-pr-tt-wd-wp))
3743
+ );
3744
+ word-break: var(
3745
+ --_ctm-mob-dn-pr-tt-wd-bk,
3746
+ var(--_ctm-tab-dn-pr-tt-wd-bk, var(--_ctm-dn-pr-tt-wd-bk))
3747
+ );
3748
+ font-size: var(
3749
+ --_ctm-mob-dn-pr-tt-ft-se,
3750
+ var(--_ctm-tab-dn-pr-tt-ft-se, var(--_ctm-dn-pr-tt-ft-se))
3751
+ );
3752
+ font-weight: var(
3753
+ --_ctm-mob-dn-pr-tt-ft-wt,
3754
+ var(--_ctm-tab-dn-pr-tt-ft-wt, var(--_ctm-dn-pr-tt-ft-wt))
3755
+ );
3756
+ font-style: var(
3757
+ --_ctm-mob-dn-pr-tt-ft-se-ic,
3758
+ var(--_ctm-tab-dn-pr-tt-ft-se-ic, var(--_ctm-dn-pr-tt-ft-se-ic))
3759
+ );
3760
+ text-align: var(
3761
+ --_ctm-mob-dn-pr-tt-tt-an,
3762
+ var(--_ctm-tab-dn-pr-tt-tt-an, var(--_ctm-dn-pr-tt-tt-an))
3763
+ );
3764
+ letter-spacing: var(
3765
+ --_ctm-mob-dn-pr-tt-lr-sg,
3766
+ var(--_ctm-tab-dn-pr-tt-lr-sg, var(--_ctm-dn-pr-tt-lr-sg))
3767
+ );
3768
+ line-height: var(
3769
+ --_ctm-mob-dn-pr-tt-le-ht,
3770
+ var(--_ctm-tab-dn-pr-tt-le-ht, var(--_ctm-dn-pr-tt-le-ht))
3771
+ );
3772
+ text-decoration: var(
3773
+ --_ctm-mob-dn-pr-tt-ue,
3774
+ var(--_ctm-tab-dn-pr-tt-ue, var(--_ctm-dn-pr-tt-ue))
3775
+ );
2876
3776
  }
2877
3777
  }
2878
-
2879
3778
  .cross-line {
2880
3779
  position: absolute;
2881
3780
  inset: 0;
@@ -2900,4 +3799,4 @@ $minWidth: 70px;
2900
3799
  }
2901
3800
  }
2902
3801
  }
2903
- }
3802
+ }