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

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 (124) hide show
  1. package/dist/add-existing-form.scss +13 -5
  2. package/dist/add-order.scss +126 -236
  3. package/dist/add-products-tab-details.scss +1048 -2097
  4. package/dist/add-products-tab.scss +666 -1204
  5. package/dist/allocation-header-quota-details.scss +189 -407
  6. package/dist/allocationDetails.scss +1661 -2143
  7. package/dist/allocations-quota-details.scss +159 -323
  8. package/dist/allocations.scss +475 -793
  9. package/dist/amount-estimator.scss +405 -743
  10. package/dist/badge.scss +43 -18
  11. package/dist/brand-basic-elements.scss +76 -124
  12. package/dist/brand.scss +28 -55
  13. package/dist/breadcrumbs.scss +356 -718
  14. package/dist/builder.js +1 -1
  15. package/dist/bulk-variant-picker.scss +1128 -2027
  16. package/dist/bundle.scss +841 -1477
  17. package/dist/bundleDetails.scss +3774 -5072
  18. package/dist/button.scss +79 -103
  19. package/dist/buy-for-tab-container.scss +77 -106
  20. package/dist/buyForHeaders.scss +1722 -2976
  21. package/dist/cart-details.scss +481 -1012
  22. package/dist/cart-summary.scss +557 -1149
  23. package/dist/cart-wrapper.scss +37 -79
  24. package/dist/cart.scss +117 -225
  25. package/dist/cartAttributes.scss +416 -735
  26. package/dist/category-groups-element.scss +127 -108
  27. package/dist/category-groups-product-grid.scss +120 -147
  28. package/dist/category-groups-product-image.scss +1162 -1457
  29. package/dist/category-groups-product-options.scss +613 -680
  30. package/dist/category-groups-product-price.scss +1966 -3244
  31. package/dist/category-groups-quota-details.scss +210 -464
  32. package/dist/category.scss +26 -50
  33. package/dist/checkout.scss +24 -16
  34. package/dist/confirm-modal.scss +22 -2
  35. package/dist/container.scss +32 -54
  36. package/dist/countdown.scss +255 -443
  37. package/dist/coupon.scss +351 -710
  38. package/dist/default-dropdown.scss +12 -1
  39. package/dist/embroider-template-1-v2.scss +123 -172
  40. package/dist/embroider-template-1.scss +68 -104
  41. package/dist/embroidery.scss +30 -31
  42. package/dist/employee-bulk-order.scss +418 -142
  43. package/dist/faq.scss +228 -408
  44. package/dist/filter-results.scss +125 -265
  45. package/dist/filters.scss +900 -1797
  46. package/dist/gallery-slider-temp.scss +432 -750
  47. package/dist/global-styles.scss +218 -198
  48. package/dist/grid.scss +25 -33
  49. package/dist/hotspot.scss +68 -115
  50. package/dist/image-temp.scss +21 -20
  51. package/dist/item-stock.scss +9 -16
  52. package/dist/kitDetails.scss +2719 -4299
  53. package/dist/kits.scss +24 -19
  54. package/dist/language-selector.scss +211 -361
  55. package/dist/last-x-orders.scss +95 -174
  56. package/dist/layouter-item.scss +75 -103
  57. package/dist/layouter-pro-item.scss +89 -95
  58. package/dist/layouter-pro.scss +87 -92
  59. package/dist/layouter.scss +383 -445
  60. package/dist/light-box-v2.scss +89 -104
  61. package/dist/login.scss +287 -566
  62. package/dist/map.scss +221 -368
  63. package/dist/marchandiserSets.scss +95 -104
  64. package/dist/mega-menu-container.scss +96 -109
  65. package/dist/mega-menu.scss +624 -731
  66. package/dist/menu-item.scss +2 -2
  67. package/dist/menu-v2.scss +507 -619
  68. package/dist/multi-select-dropdown.scss +27 -3
  69. package/dist/my-templates.scss +38 -9
  70. package/dist/option-bar.scss +215 -375
  71. package/dist/order-status.scss +646 -1117
  72. package/dist/overflow-module.scss +6 -7
  73. package/dist/past-orders.scss +118 -149
  74. package/dist/payment-methods.scss +46 -30
  75. package/dist/pickup-locations.scss +558 -1118
  76. package/dist/position-module.scss +20 -17
  77. package/dist/prefix-list.scss +21 -10
  78. package/dist/product-actions.scss +1750 -2055
  79. package/dist/product-basic-elements.scss +108 -169
  80. package/dist/product-highlights.scss +107 -152
  81. package/dist/product-image-bundles.scss +337 -642
  82. package/dist/product-inventory.scss +673 -1357
  83. package/dist/product-labels.scss +84 -105
  84. package/dist/product-options.scss +1117 -1274
  85. package/dist/product-price.scss +1283 -2561
  86. package/dist/product-promotions.scss +1388 -2830
  87. package/dist/product-sizechart.scss +516 -905
  88. package/dist/product.scss +28 -61
  89. package/dist/productDetails.scss +19 -39
  90. package/dist/profile.scss +207 -447
  91. package/dist/quantity-selector.scss +837 -1074
  92. package/dist/quick-inventory-check.scss +95 -174
  93. package/dist/quick-links.scss +55 -133
  94. package/dist/quick-order-pad.scss +218 -271
  95. package/dist/quota-details.scss +152 -282
  96. package/dist/quotes.scss +89 -122
  97. package/dist/repeater-embla-controls.scss +35 -15
  98. package/dist/repeater-grid-toggle.scss +156 -166
  99. package/dist/repeater-item.scss +41 -64
  100. package/dist/repeater.scss +671 -814
  101. package/dist/request-for-quotes.scss +66 -16
  102. package/dist/responsive-behaviour.scss +3 -1
  103. package/dist/rfqs.scss +118 -181
  104. package/dist/scroll.scss +93 -172
  105. package/dist/search.scss +179 -326
  106. package/dist/section.scss +27 -51
  107. package/dist/shipping-payments.scss +198 -58
  108. package/dist/simple-list.scss +74 -164
  109. package/dist/social.scss +80 -145
  110. package/dist/sort.scss +11 -19
  111. package/dist/stack.scss +23 -34
  112. package/dist/static-global.scss +44 -26
  113. package/dist/stockStatus.scss +11 -19
  114. package/dist/store-locations.scss +577 -1105
  115. package/dist/tab-container.scss +81 -108
  116. package/dist/table-common.scss +217 -408
  117. package/dist/table.scss +271 -502
  118. package/dist/text-temp.scss +8 -7
  119. package/dist/theme-classes.scss +17 -13
  120. package/dist/uom-selector.scss +489 -949
  121. package/dist/user-elements.scss +529 -837
  122. package/dist/variant-picker.scss +1281 -2555
  123. package/dist/volume-pricing.scss +541 -1037
  124. package/package.json +1 -1
@@ -12,13 +12,15 @@ $minWidth: 70px;
12
12
 
13
13
  min-width: #{$minWidth} !important;
14
14
 
15
- & > .wrapper {
15
+ &>.wrapper {
16
16
  width: 100%;
17
17
  // height: 100%;
18
18
  }
19
+
19
20
  &[data-show-shadow="false"] {
20
21
  --_show-shadow: none;
21
22
  }
23
+
22
24
  .text-element {
23
25
  color: #333;
24
26
 
@@ -28,53 +30,32 @@ $minWidth: 70px;
28
30
  line-height: 18px;
29
31
  margin-bottom: 6px;
30
32
  }
33
+
31
34
  .option__title {
32
35
  margin-bottom: 4px;
33
36
  color: var(--_ctm-mob-dn-on-te-cr, var(--_ctm-tab-dn-on-te-cr, var(--_ctm-dn-on-te-cr)));
34
- font-family: var(
35
- --_ctm-mob-dn-on-te-ft-fy,
36
- var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))
37
- );
38
- text-transform: var(
39
- --_ctm-mob-dn-on-te-tt-tm,
40
- var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm))
41
- );
42
- word-wrap: var(
43
- --_ctm-mob-dn-on-te-wd-wp,
44
- var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp))
45
- );
46
- word-break: var(
47
- --_ctm-mob-dn-on-te-wd-bk,
48
- var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk))
49
- );
50
- font-size: var(
51
- --_ctm-mob-dn-on-te-ft-se,
52
- var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se))
53
- );
54
- font-weight: var(
55
- --_ctm-mob-dn-on-te-ft-wt,
56
- var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt))
57
- );
58
- font-style: var(
59
- --_ctm-mob-dn-on-te-ft-se-ic,
60
- var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic))
61
- );
62
- text-align: var(
63
- --_ctm-mob-dn-on-te-tt-an,
64
- var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an))
65
- );
66
- letter-spacing: var(
67
- --_ctm-mob-dn-on-te-lr-sg,
68
- var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg))
69
- );
70
- line-height: var(
71
- --_ctm-mob-dn-on-te-le-ht,
72
- var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht))
73
- );
74
- text-decoration: var(
75
- --_ctm-mob-dn-on-te-ue,
76
- var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue))
77
- );
37
+ font-family: var(--_ctm-mob-dn-on-te-ft-fy,
38
+ var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy)));
39
+ text-transform: var(--_ctm-mob-dn-on-te-tt-tm,
40
+ var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm)));
41
+ word-wrap: var(--_ctm-mob-dn-on-te-wd-wp,
42
+ var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp)));
43
+ word-break: var(--_ctm-mob-dn-on-te-wd-bk,
44
+ var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk)));
45
+ font-size: var(--_ctm-mob-dn-on-te-ft-se,
46
+ var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se)));
47
+ font-weight: var(--_ctm-mob-dn-on-te-ft-wt,
48
+ var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt)));
49
+ font-style: var(--_ctm-mob-dn-on-te-ft-se-ic,
50
+ var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic)));
51
+ text-align: var(--_ctm-mob-dn-on-te-tt-an,
52
+ var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an)));
53
+ letter-spacing: var(--_ctm-mob-dn-on-te-lr-sg,
54
+ var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg)));
55
+ line-height: var(--_ctm-mob-dn-on-te-le-ht,
56
+ var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht)));
57
+ text-decoration: var(--_ctm-mob-dn-on-te-ue,
58
+ var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue)));
78
59
  }
79
60
 
80
61
  .is__combination_avail {
@@ -82,44 +63,31 @@ $minWidth: 70px;
82
63
  font-size: 14px;
83
64
  font-weight: 600;
84
65
  }
66
+
85
67
  .variant__container {
86
68
  display: flex;
87
69
  flex-direction: column;
88
70
  gap: var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)));
89
71
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
90
72
  white-space: nowrap;
91
- background-color: var(
92
- --_ctm-mob-dn-wt-se-bd-cr,
93
- var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
94
- );
95
-
96
- border-color: var(
97
- --_ctm-mob-dn-wt-se-br-cr,
98
- var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
99
- );
100
-
101
- border-style: var(
102
- --_ctm-mob-dn-wt-se-br-se,
103
- var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
104
- );
105
-
106
- border-width: var(
107
- --_ctm-mob-dn-wt-se-br-wh,
108
- var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
109
- );
110
-
111
- border-radius: var(
112
- --_ctm-mob-dn-wt-se-br-rs,
113
- var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
114
- );
115
-
116
- box-shadow: var(
117
- --_show-shadow,
118
- var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
119
- var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
120
- var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
121
- var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
122
- );
73
+ background-color: var(--_ctm-mob-dn-wt-se-bd-cr,
74
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr)));
75
+
76
+ border-color: var(--_ctm-mob-dn-wt-se-br-cr,
77
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr)));
78
+
79
+ border-style: var(--_ctm-mob-dn-wt-se-br-se,
80
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se)));
81
+
82
+ border-width: var(--_ctm-mob-dn-wt-se-br-wh,
83
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh)));
84
+
85
+ border-radius: var(--_ctm-mob-dn-wt-se-br-rs,
86
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs)));
87
+
88
+ box-shadow: var(--_show-shadow,
89
+ 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))));
90
+
123
91
  &[data-show-divider="true"] {
124
92
  .standard_wrapper {
125
93
  &:not(:last-child)::after {
@@ -134,27 +102,20 @@ $minWidth: 70px;
134
102
  // );
135
103
  content: "";
136
104
  position: relative;
137
- background-color: var(
138
- --_ctm-mob-dn-wt-se-dr-cr,
139
- var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr, #e4e7ec))
140
- );
141
- height: var(
142
- --_ctm-mob-dn-wt-se-dr-wh,
143
- var(--_ctm-tab-dn-wt-se-dr-wh, var(--_ctm-dn-wt-se-dr-wh, 1px))
144
- );
105
+ background-color: var(--_ctm-mob-dn-wt-se-dr-cr,
106
+ var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr, #e4e7ec)));
107
+ height: var(--_ctm-mob-dn-wt-se-dr-wh,
108
+ var(--_ctm-tab-dn-wt-se-dr-wh, var(--_ctm-dn-wt-se-dr-wh, 1px)));
145
109
  width: 100%;
146
110
  display: flex;
147
- top: calc(
148
- calc(
149
- var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px
150
- ) /
151
- 2
152
- );
111
+ top: calc(calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px) / 2);
153
112
  }
154
113
  }
155
114
  }
115
+
156
116
  .variant__option {
157
117
  width: 100%;
118
+
158
119
  .variant__list {
159
120
  display: flex;
160
121
  gap: 12px;
@@ -162,16 +123,15 @@ $minWidth: 70px;
162
123
  }
163
124
 
164
125
  .standard_wrapper {
126
+
165
127
  // Select Colors
166
128
  .select__colors {
167
129
  font-size: 16px;
168
130
  color: var(--_gray-500);
169
131
  display: flex;
170
132
  flex-direction: column;
171
- gap: var(
172
- --_ctm-mob-lt-on-te-ve-sg,
173
- var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
174
- );
133
+ gap: var(--_ctm-mob-lt-on-te-ve-sg,
134
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg)));
175
135
  // padding: var(
176
136
  // --_ctm-mob-lt-sh-te-dy-se-im-pg,
177
137
  // var(--_ctm-tab-lt-sh-te-dy-se-im-pg, var(--_ctm-lt-sh-te-dy-se-im-pg))
@@ -181,107 +141,62 @@ $minWidth: 70px;
181
141
  display: flex;
182
142
  flex-direction: row;
183
143
  align-items: center;
184
- gap: var(
185
- --_ctm-mob-lt-sh-te-dy-se-im-sg,
186
- var(--_ctm-tab-lt-sh-te-dy-se-im-sg, var(--_ctm-lt-sh-te-dy-se-im-sg))
187
- );
144
+ gap: var(--_ctm-mob-lt-sh-te-dy-se-im-sg,
145
+ var(--_ctm-tab-lt-sh-te-dy-se-im-sg, var(--_ctm-lt-sh-te-dy-se-im-sg)));
188
146
 
189
147
  &[data-swatch-dispaly="Vertically"] {
190
148
  flex-direction: column;
191
149
  }
150
+
192
151
  &[data-swatch-overflow="Scroll"] {
193
152
  flex-wrap: nowrap;
194
153
  overflow-x: auto;
195
154
  }
155
+
196
156
  &[data-swatch-overflow="Wrap"] {
197
157
  flex-wrap: wrap;
198
158
  }
199
159
 
200
160
  .show_more_button {
201
- background-color: var(
202
- --_ctm-mob-dn-sw-me-is-bn-bd-cr,
203
- var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr))
204
- );
205
- font-family: var(
206
- --_ctm-mob-dn-sw-me-is-bn-ft-fy,
207
- var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy))
208
- );
209
- text-transform: var(
210
- --_ctm-mob-dn-sw-me-is-bn-tt-tm,
211
- var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm))
212
- );
213
- word-wrap: var(
214
- --_ctm-mob-dn-sw-me-is-bn-wd-wp,
215
- var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp))
216
- );
217
- word-break: var(
218
- --_ctm-mob-dn-sw-me-is-bn-wd-bk,
219
- var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk))
220
- );
221
- border-color: var(
222
- --_ctm-mob-dn-sw-me-is-bn-br-cr,
223
- var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr))
224
- );
225
- border-radius: var(
226
- --_ctm-mob-dn-sw-me-is-bn-br-rs,
227
- var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs))
228
- );
229
- border-style: var(
230
- --_ctm-mob-dn-sw-me-is-bn-br-se,
231
- var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se))
232
- );
233
- border-width: var(
234
- --_ctm-mob-dn-sw-me-is-bn-br-wh,
235
- var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh))
236
- );
237
- font-size: var(
238
- --_ctm-mob-dn-sw-me-is-bn-ft-se,
239
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se))
240
- );
241
- font-style: var(
242
- --_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
243
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic))
244
- );
245
- font-weight: var(
246
- --_ctm-mob-dn-sw-me-is-bn-ft-wt,
247
- var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt))
248
- );
249
- line-height: var(
250
- --_ctm-mob-dn-sw-me-is-bn-le-ht,
251
- var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht))
252
- );
253
- letter-spacing: var(
254
- --_ctm-mob-dn-sw-me-is-bn-lr-sg,
255
- var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg))
256
- );
257
- box-shadow: var(
258
- --_ctm-mob-dn-sw-me-is-bn-sw-ae,
259
- var(--_ctm-tab-dn-sw-me-is-bn-sw-ae, var(--_ctm-dn-sw-me-is-bn-sw-ae))
260
- )
261
- var(
262
- --_ctm-mob-dn-sw-me-is-bn-sw-br,
263
- var(--_ctm-tab-dn-sw-me-is-bn-sw-br, var(--_ctm-dn-sw-me-is-bn-sw-br))
264
- )
265
- var(
266
- --_ctm-mob-dn-sw-me-is-bn-sw-sd,
267
- var(--_ctm-tab-dn-sw-me-is-bn-sw-sd, var(--_ctm-dn-sw-me-is-bn-sw-sd))
268
- )
269
- var(
270
- --_ctm-mob-dn-sw-me-is-bn-sw-cr,
271
- var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr))
272
- );
273
- text-align: var(
274
- --_ctm-mob-dn-sw-me-is-bn-tt-an,
275
- var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an))
276
- );
277
- color: var(
278
- --_ctm-mob-dn-sw-me-is-bn-tt-cr,
279
- var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr))
280
- );
281
- text-decoration: var(
282
- --_ctm-mob-dn-sw-me-is-bn-ue,
283
- var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue))
284
- );
161
+ background-color: var(--_ctm-mob-dn-sw-me-is-bn-bd-cr,
162
+ var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr)));
163
+ font-family: var(--_ctm-mob-dn-sw-me-is-bn-ft-fy,
164
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy)));
165
+ text-transform: var(--_ctm-mob-dn-sw-me-is-bn-tt-tm,
166
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm)));
167
+ word-wrap: var(--_ctm-mob-dn-sw-me-is-bn-wd-wp,
168
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp)));
169
+ word-break: var(--_ctm-mob-dn-sw-me-is-bn-wd-bk,
170
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk)));
171
+ border-color: var(--_ctm-mob-dn-sw-me-is-bn-br-cr,
172
+ var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr)));
173
+ border-radius: var(--_ctm-mob-dn-sw-me-is-bn-br-rs,
174
+ var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs)));
175
+ border-style: var(--_ctm-mob-dn-sw-me-is-bn-br-se,
176
+ var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se)));
177
+ border-width: var(--_ctm-mob-dn-sw-me-is-bn-br-wh,
178
+ var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh)));
179
+ font-size: var(--_ctm-mob-dn-sw-me-is-bn-ft-se,
180
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se)));
181
+ font-style: var(--_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
182
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic)));
183
+ font-weight: var(--_ctm-mob-dn-sw-me-is-bn-ft-wt,
184
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt)));
185
+ line-height: var(--_ctm-mob-dn-sw-me-is-bn-le-ht,
186
+ var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht)));
187
+ letter-spacing: var(--_ctm-mob-dn-sw-me-is-bn-lr-sg,
188
+ var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg)));
189
+ box-shadow: var(--_ctm-mob-dn-sw-me-is-bn-sw-ae,
190
+ 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,
191
+ 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,
192
+ 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,
193
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr)));
194
+ text-align: var(--_ctm-mob-dn-sw-me-is-bn-tt-an,
195
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an)));
196
+ color: var(--_ctm-mob-dn-sw-me-is-bn-tt-cr,
197
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr)));
198
+ text-decoration: var(--_ctm-mob-dn-sw-me-is-bn-ue,
199
+ var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue)));
285
200
  }
286
201
 
287
202
  .select__group__item {
@@ -292,51 +207,40 @@ $minWidth: 70px;
292
207
  width: prepareMediaVariable(--_ctm-lt-sh-te-dy-se-im-se);
293
208
  padding: prepareMediaVariable(--_ctm-lt-sh-te-dy-se-im-pg);
294
209
 
295
- border-color: var(
296
- --_sf-hr-br-cr,
297
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr)
298
- );
299
-
300
- background-color: var(
301
- --_sf-hr-bd-cr,
302
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr)
303
- );
304
-
305
- border-style: var(
306
- --_sf-hr-br-se,
307
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se)
308
- );
309
-
310
- border-width: var(
311
- --_sf-hr-br-wh,
312
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh)
313
- );
314
- border-radius: var(
315
- --_sf-hr-br-rs,
316
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs)
317
- );
318
-
319
- box-shadow: var(
320
- --_sf-hr-sw-ae,
321
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae)
322
- )
323
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-br))
324
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd))
325
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr));
210
+ border-color: var(--_sf-hr-br-cr,
211
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr));
212
+
213
+ background-color: var(--_sf-hr-bd-cr,
214
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr));
215
+
216
+ border-style: var(--_sf-hr-br-se,
217
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se));
218
+
219
+ border-width: var(--_sf-hr-br-wh,
220
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh));
221
+ border-radius: var(--_sf-hr-br-rs,
222
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs));
223
+
224
+ box-shadow: var(--_sf-hr-sw-ae,
225
+ 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));
326
226
 
327
227
  cursor: pointer;
328
228
  overflow: hidden;
229
+
329
230
  .product-select-image {
330
231
  object-fit: cover;
331
232
  width: 100%;
332
233
  height: 100%;
333
234
  }
235
+
334
236
  &[data-background-shape="circle"] {
335
237
  border-radius: 50%;
336
238
  }
239
+
337
240
  &[data-background-shape="square"] {
338
241
  border-radius: 5px;
339
242
  }
243
+
340
244
  &[data-background-shape="capsule"] {
341
245
  --toggle-height: var(--_ctm-lt-sh-te-dy-se-im-se);
342
246
  --toggle-width: calc(var(--_ctm-lt-sh-te-dy-se-im-se) * 1.5);
@@ -344,17 +248,23 @@ $minWidth: 70px;
344
248
  width: var(--toggle-width);
345
249
  height: var(--toggle-height);
346
250
 
347
- border-radius: var(--toggle-height); /* Full pill shape */
251
+ border-radius: var(--toggle-height);
252
+ /* Full pill shape */
348
253
  box-sizing: border-box;
349
254
  }
255
+
350
256
  &[data-swatch-shape="circle"] {
257
+
351
258
  & div,
352
259
  .product-select-image {
353
260
  border-radius: 50%;
354
261
  }
262
+
355
263
  // border-radius: 50%;
356
264
  }
265
+
357
266
  &[data-swatch-shape="capsule"] {
267
+
358
268
  & div,
359
269
  .product-select-image {
360
270
  // border-radius: 50%;
@@ -362,41 +272,31 @@ $minWidth: 70px;
362
272
  height: 100%;
363
273
  border-radius: inherit;
364
274
  }
275
+
365
276
  // border-radius: 50%;
366
277
  }
367
278
 
368
279
  &[data-selected="true"] {
369
- border-color: var(
370
- --_sf-sd-br-cr,
371
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-cr)
372
- );
373
-
374
- background-color: var(
375
- --_sf-sd-bd-cr,
376
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr)
377
- );
378
- border-style: var(
379
- --_sf-sd-br-se,
380
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-se)
381
- );
382
- border-width: var(
383
- --_sf-sd-br-wh,
384
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-wh)
385
- );
386
- box-shadow: var(
387
- --_sf-sd-sw-ae,
388
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae)
389
- )
390
- var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-br))
391
- var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd))
392
- var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr));
280
+ border-color: var(--_sf-sd-br-cr,
281
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-cr));
282
+
283
+ background-color: var(--_sf-sd-bd-cr,
284
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr));
285
+ border-style: var(--_sf-sd-br-se,
286
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-se));
287
+ border-width: var(--_sf-sd-br-wh,
288
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-sd-se-br-wh));
289
+ box-shadow: var(--_sf-sd-sw-ae,
290
+ 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));
393
291
 
394
292
  &[data-background-shape-selected="circle"] {
395
293
  border-radius: 50%;
396
294
  }
295
+
397
296
  &[data-background-shape-selected="square"] {
398
297
  border-radius: 5px;
399
298
  }
299
+
400
300
  &[data-background-shape-selected="capsule"] {
401
301
  border-radius: 80%;
402
302
  // width: calc(
@@ -404,73 +304,64 @@ $minWidth: 70px;
404
304
  // 8px
405
305
  // );
406
306
  }
307
+
407
308
  &[data-swatch-shape-selected="circle"] {
309
+
408
310
  & div,
409
311
  .product-select-image {
410
312
  border-radius: 50%;
411
313
  }
412
314
  }
315
+
413
316
  &[data-swatch-shape-selected="capsule"] {
317
+
414
318
  & div,
415
319
  .product-select-image {
416
320
  border-radius: 50%;
417
321
  }
418
322
  }
323
+
419
324
  &[data-swatch-shape-selected="square"] {
325
+
420
326
  & div,
421
327
  .product-select-image {
422
328
  border-radius: 5px;
423
329
  }
424
330
  }
425
331
  }
332
+
426
333
  &:hover {
427
- --_sf-hr-bd-cr: var(
428
- --_ctm-mob-dn-sh-on-ve-se-hr-se-bd-cr,
429
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-bd-cr))
430
- );
431
- --_sf-hr-br-cr: var(
432
- --_ctm-mob-dn-sh-on-ve-se-hr-se-br-cr,
433
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-br-cr))
434
- );
435
- --_sf-hr-br-se: var(
436
- --_ctm-mob-dn-sh-on-ve-se-hr-se-br-se,
437
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-se, var(--_ctm-dn-sh-on-ve-se-hr-se-br-se))
438
- );
439
- --_sf-hr-br-wh: var(
440
- --_ctm-mob-dn-sh-on-ve-se-hr-se-br-wh,
441
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-wh, var(--_ctm-dn-sh-on-ve-se-hr-se-br-wh))
442
- );
443
- --_sf-hr-br-bs: var(
444
- --_ctm-mob-dn-sh-on-ve-se-hr-se-br-rs,
445
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-rs, var(--_ctm-dn-sh-on-ve-se-hr-se-br-rs))
446
- );
334
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-bd-cr,
335
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-bd-cr)));
336
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-cr,
337
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-br-cr)));
338
+ --_sf-hr-br-se: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-se,
339
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-se, var(--_ctm-dn-sh-on-ve-se-hr-se-br-se)));
340
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-wh,
341
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-wh, var(--_ctm-dn-sh-on-ve-se-hr-se-br-wh)));
342
+ --_sf-hr-br-bs: var(--_ctm-mob-dn-sh-on-ve-se-hr-se-br-rs,
343
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-br-rs, var(--_ctm-dn-sh-on-ve-se-hr-se-br-rs)));
447
344
 
448
345
  // new
449
- --_sf-hr-sw-ae: var(
450
- --_ctm-mob-dn-on-ve-se-hr-se-sw-ae,
451
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-ae))
452
- );
453
- --_sf-hr-sw-br: var(
454
- --_ctm-mob-dn-on-ve-se-hr-se-sw-br,
455
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-br, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-br))
456
- );
457
- --_sf-hr-sw-hr: var(
458
- --_ctm-mob-dn-on-ve-se-hr-se-sw-hr,
459
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-hr))
460
- );
461
- --_sf-hr-sw-cr: var(
462
- --_ctm-mob-dn-on-ve-se-hr-se-sw-cr,
463
- var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-cr))
464
- );
346
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-ae,
347
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-ae)));
348
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-br,
349
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-br, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-br)));
350
+ --_sf-hr-sw-hr: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-hr,
351
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-hr)));
352
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-on-ve-se-hr-se-sw-cr,
353
+ var(--_ctm-tab-dn-sh-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-hr-se-sw-cr)));
465
354
  }
466
355
 
467
356
  &:hover {
468
357
  &[data-background-shape-hover="circle"] {
469
358
  border-radius: 50%;
470
359
  }
360
+
471
361
  &[data-background-shape-hover="square"] {
472
362
  border-radius: 5px;
473
363
  }
364
+
474
365
  &[data-background-shape-hover="capsule"] {
475
366
  border-radius: 80%;
476
367
  // width: calc(
@@ -481,20 +372,27 @@ $minWidth: 70px;
481
372
  // 8px
482
373
  // );
483
374
  }
375
+
484
376
  &[data-swatch-shape-hover="circle"] {
377
+
485
378
  & div,
486
379
  .product-select-image {
487
380
  border-radius: 50%;
488
381
  }
382
+
489
383
  // border-radius: 50%;
490
384
  }
385
+
491
386
  &[data-swatch-shape-hover="capsule"] {
387
+
492
388
  & div,
493
389
  .product-select-image {
494
390
  border-radius: 50%;
495
391
  }
496
392
  }
393
+
497
394
  &[data-swatch-shape-hover="square"] {
395
+
498
396
  & div,
499
397
  .product-select-image {
500
398
  border-radius: 5px;
@@ -503,83 +401,52 @@ $minWidth: 70px;
503
401
  }
504
402
 
505
403
  &[data-selected="true"] {
506
- --_sf-sd-bd-cr: var(
507
- --_ctm-mob-dn-sh-on-ve-se-sd-se-bd-cr,
508
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr))
509
- );
510
- --_sf-sd-br-cr: var(
511
- --_ctm-mob-dn-sh-on-ve-se-sd-se-br-cr,
512
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-br-cr))
513
- );
514
- --_sf-sd-br-se: var(
515
- --_ctm-mob-dn-sh-on-ve-se-sd-se-br-se,
516
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-se, var(--_ctm-dn-sh-on-ve-se-sd-se-br-se))
517
- );
518
- --_sf-sd-br-wh: var(
519
- --_ctm-mob-dn-sh-on-ve-se-sd-se-br-wh,
520
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-wh, var(--_ctm-dn-sh-on-ve-se-sd-se-br-wh))
521
- );
522
- --_sf-sd-br-bs: var(
523
- --_ctm-mob-dn-sh-on-ve-se-sd-se-br-rs,
524
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-rs, var(--_ctm-dn-sh-on-ve-se-sd-se-br-rs))
525
- );
404
+ --_sf-sd-bd-cr: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-bd-cr,
405
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-bd-cr)));
406
+ --_sf-sd-br-cr: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-cr,
407
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-br-cr)));
408
+ --_sf-sd-br-se: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-se,
409
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-se, var(--_ctm-dn-sh-on-ve-se-sd-se-br-se)));
410
+ --_sf-sd-br-wh: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-wh,
411
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-wh, var(--_ctm-dn-sh-on-ve-se-sd-se-br-wh)));
412
+ --_sf-sd-br-bs: var(--_ctm-mob-dn-sh-on-ve-se-sd-se-br-rs,
413
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-br-rs, var(--_ctm-dn-sh-on-ve-se-sd-se-br-rs)));
526
414
 
527
415
  // new
528
- --_sf-sd-sw-ae: var(
529
- --_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
530
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae))
531
- );
532
- --_sf-sd-sw-br: var(
533
- --_ctm-mob-dn-on-ve-se-sd-se-sw-br,
534
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-br, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-br))
535
- );
536
- --_sf-sd-sw-sd: var(
537
- --_ctm-mob-dn-on-ve-se-sd-se-sw-sd,
538
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-sd, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd))
539
- );
540
- --_sf-sd-sw-cr: var(
541
- --_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
542
- var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr))
543
- );
544
-
545
- border-color: var(
546
- --_sf-sd-br-cr,
547
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr)
548
- );
549
-
550
- background-color: var(
551
- --_sf-sd-bd-cr,
552
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr)
553
- );
554
-
555
- border-style: var(
556
- --_sf-sd-br-se,
557
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se)
558
- );
559
-
560
- border-width: var(
561
- --_sf-sd-br-wh,
562
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh)
563
- );
564
- border-radius: var(
565
- --_sf-sd-br-rs,
566
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs)
567
- );
568
-
569
- box-shadow: var(
570
- --_sf-sd-sw-ae,
571
- prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-ae)
572
- )
573
- var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-br))
574
- var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-sd))
575
- var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-sw-cr));
416
+ --_sf-sd-sw-ae: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
417
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-ae)));
418
+ --_sf-sd-sw-br: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-br,
419
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-br, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-br)));
420
+ --_sf-sd-sw-sd: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-sd,
421
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-sd, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-sd)));
422
+ --_sf-sd-sw-cr: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
423
+ var(--_ctm-tab-dn-sh-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-sh-on-ve-se-sd-se-sw-cr)));
424
+
425
+ border-color: var(--_sf-sd-br-cr,
426
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-cr));
427
+
428
+ background-color: var(--_sf-sd-bd-cr,
429
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-bd-cr));
430
+
431
+ border-style: var(--_sf-sd-br-se,
432
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-se));
433
+
434
+ border-width: var(--_sf-sd-br-wh,
435
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-wh));
436
+ border-radius: var(--_sf-sd-br-rs,
437
+ prepareMediaVariable(--_ctm-dn-sh-on-ve-se-dt-se-br-rs));
438
+
439
+ box-shadow: var(--_sf-sd-sw-ae,
440
+ 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));
576
441
 
577
442
  &[data-background-shape-selected="circle"] {
578
443
  border-radius: 50%;
579
444
  }
445
+
580
446
  &[data-background-shape-selected="square"] {
581
447
  border-radius: 5px;
582
448
  }
449
+
583
450
  &[data-background-shape-selected="capsule"] {
584
451
  --toggle-height: var(--_ctm-lt-sh-te-dy-se-im-se);
585
452
  --toggle-width: calc(var(--_ctm-lt-sh-te-dy-se-im-se) * 1.5);
@@ -587,16 +454,21 @@ $minWidth: 70px;
587
454
  width: var(--toggle-width);
588
455
  height: var(--toggle-height);
589
456
 
590
- border-radius: var(--toggle-height); /* Full pill shape */
457
+ border-radius: var(--toggle-height);
458
+ /* Full pill shape */
591
459
  box-sizing: border-box;
592
460
  }
461
+
593
462
  &[data-swatch-shape-selected="circle"] {
463
+
594
464
  & div,
595
465
  .product-select-image {
596
466
  border-radius: 50%;
597
467
  }
598
468
  }
469
+
599
470
  &[data-swatch-shape-selected="capsule"] {
471
+
600
472
  & div,
601
473
  .product-select-image {
602
474
  // border-radius: 50%;
@@ -605,7 +477,9 @@ $minWidth: 70px;
605
477
  border-radius: inherit;
606
478
  }
607
479
  }
480
+
608
481
  &[data-swatch-shape-selected="square"] {
482
+
609
483
  & div,
610
484
  .product-select-image {
611
485
  border-radius: 5px;
@@ -666,6 +540,7 @@ $minWidth: 70px;
666
540
  clip-path: polygon(100% 0, 100% 1px, 0 100%, 0 96%);
667
541
  pointer-events: none;
668
542
  }
543
+
669
544
  .product-select-image {
670
545
  width: 100%;
671
546
  height: 100%;
@@ -674,6 +549,7 @@ $minWidth: 70px;
674
549
  }
675
550
  }
676
551
  }
552
+
677
553
  // Grouped Option Picker
678
554
  .grouped__option__picker {
679
555
  display: flex;
@@ -681,6 +557,7 @@ $minWidth: 70px;
681
557
  // Positioning context for the group-description popover, which is
682
558
  // rendered here (not inside the scrolling tabs) so it isn't clipped.
683
559
  position: relative;
560
+
684
561
  // While a description popover is open, lift the whole picker above the
685
562
  // option blocks that follow it (e.g. the size selector); otherwise the
686
563
  // popover's own z-index can't beat content owned by a later sibling.
@@ -689,70 +566,36 @@ $minWidth: 70px;
689
566
  }
690
567
 
691
568
  .grouped__group__image {
692
- width: var(
693
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-wh,
694
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-wh, var(--_ctm-dn-on-ve-gp-gp-hr-ie-wh, 24px))
695
- );
696
- height: var(
697
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-ht,
698
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-ht, var(--_ctm-dn-on-ve-gp-gp-hr-ie-ht, 24px))
699
- );
700
- padding: var(
701
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-pg,
702
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-pg, var(--_ctm-dn-on-ve-gp-gp-hr-ie-pg, 0))
703
- );
704
- object-fit: var(
705
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-ob-ft,
706
- var(
707
- --_ctm-tab-dn-on-ve-gp-gp-hr-ie-ob-ft,
708
- var(--_ctm-dn-on-ve-gp-gp-hr-ie-ob-ft, cover)
709
- )
710
- );
711
- object-position: var(
712
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-ob-pn,
713
- var(
714
- --_ctm-tab-dn-on-ve-gp-gp-hr-ie-ob-pn,
715
- var(--_ctm-dn-on-ve-gp-gp-hr-ie-ob-pn, center)
716
- )
717
- );
718
- background-color: var(
719
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-bd-cr,
720
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-bd-cr, var(--_ctm-dn-on-ve-gp-gp-hr-ie-bd-cr))
721
- );
722
- border-color: var(
723
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-cr,
724
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-cr, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-cr))
725
- );
726
- border-style: var(
727
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-se,
728
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-se, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-se))
729
- );
730
- border-width: var(
731
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-wh,
732
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-wh, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-wh))
733
- );
734
- border-radius: var(
735
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-rs,
736
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-rs, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-rs))
737
- );
738
- box-shadow: var(
739
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-ae,
740
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-ae, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-ae))
741
- )
742
- var(
743
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-br,
744
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-br, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-br))
745
- )
746
- var(
747
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-sd,
748
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-sd, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-sd))
749
- )
750
- var(
751
- --_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-cr,
752
- var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-cr, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-cr))
753
- );
569
+ width: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-wh,
570
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-wh, var(--_ctm-dn-on-ve-gp-gp-hr-ie-wh, 24px)));
571
+ height: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-ht,
572
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-ht, var(--_ctm-dn-on-ve-gp-gp-hr-ie-ht, 24px)));
573
+ padding: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-pg,
574
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-pg, var(--_ctm-dn-on-ve-gp-gp-hr-ie-pg, 0)));
575
+ object-fit: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-ob-ft,
576
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-ob-ft,
577
+ var(--_ctm-dn-on-ve-gp-gp-hr-ie-ob-ft, cover)));
578
+ object-position: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-ob-pn,
579
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-ob-pn,
580
+ var(--_ctm-dn-on-ve-gp-gp-hr-ie-ob-pn, center)));
581
+ background-color: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-bd-cr,
582
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-bd-cr, var(--_ctm-dn-on-ve-gp-gp-hr-ie-bd-cr)));
583
+ border-color: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-cr,
584
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-cr, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-cr)));
585
+ border-style: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-se,
586
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-se, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-se)));
587
+ border-width: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-wh,
588
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-wh, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-wh)));
589
+ border-radius: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-br-rs,
590
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-br-rs, var(--_ctm-dn-on-ve-gp-gp-hr-ie-br-rs)));
591
+ box-shadow: var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-ae,
592
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-ae, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-ae))) var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-br,
593
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-br, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-br))) var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-sd,
594
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-sd, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-sd))) var(--_ctm-mob-dn-on-ve-gp-gp-hr-ie-sw-cr,
595
+ var(--_ctm-tab-dn-on-ve-gp-gp-hr-ie-sw-cr, var(--_ctm-dn-on-ve-gp-gp-hr-ie-sw-cr)));
754
596
  flex-shrink: 0;
755
597
  }
598
+
756
599
  // Card view: every group renders as its own detailsCard inside an
757
600
  // Embla carousel instead of one active group behind a tab strip. The
758
601
  // cards reuse the `.grouped__content` (detailsCard) styles via the
@@ -762,10 +605,12 @@ $minWidth: 70px;
762
605
  width: 100%;
763
606
  min-width: 0;
764
607
  }
608
+
765
609
  .grouped__card {
766
610
  height: 100%;
767
611
  box-sizing: border-box;
768
612
  }
613
+
769
614
  // Embla lays the cards out in a grid whose column count comes from
770
615
  // `itemsPerSlide` (set inline by the carousel as --_ctm-lt-is-pr-se),
771
616
  // so "Items Per Slide" controls how many cards show per slide. The
@@ -778,10 +623,8 @@ $minWidth: 70px;
778
623
  flex-direction: row;
779
624
  align-items: center;
780
625
  // gap: 8px;
781
- gap: var(
782
- --_ctm-mob-dn-on-ve-gp-wt-ct-gp,
783
- var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp))
784
- );
626
+ gap: var(--_ctm-mob-dn-on-ve-gp-wt-ct-gp,
627
+ var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp)));
785
628
 
786
629
  .embla__viewport {
787
630
  flex: 1;
@@ -803,57 +646,19 @@ $minWidth: 70px;
803
646
  // Column width subtracts the gaps so `itemsPerSlide` cards plus
804
647
  // the gaps between them add up to exactly 100% of the viewport;
805
648
  // otherwise the last visible card overflows and gets clipped.
806
- grid-template-columns: repeat(
807
- var(
808
- --_ctm-mob-lt-is-pr-se,
809
- var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))
810
- ),
811
- calc(
812
- (
813
- 100% -
814
- (
815
- var(
816
- --_ctm-mob-lt-is-pr-se,
817
- var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))
818
- ) -
819
- 1
820
- ) *
821
- var(
822
- --_ctm-mob-dn-on-ve-gp-wt-ct-gp,
823
- var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp))
824
- )
825
- ) /
826
- var(
827
- --_ctm-mob-lt-is-pr-se,
828
- var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))
829
- )
830
- )
831
- );
649
+ grid-template-columns: repeat(var(--_ctm-mob-lt-is-pr-se,
650
+ var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))),
651
+ calc((100% - (var(--_ctm-mob-lt-is-pr-se,
652
+ var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))) - 1) * var(--_ctm-mob-dn-on-ve-gp-wt-ct-gp,
653
+ var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp)))) / var(--_ctm-mob-lt-is-pr-se,
654
+ var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1)))));
832
655
  grid-auto-flow: column;
833
- grid-auto-columns: calc(
834
- (
835
- 100% -
836
- (
837
- var(
838
- --_ctm-mob-lt-is-pr-se,
839
- var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))
840
- ) -
841
- 1
842
- ) *
843
- var(
844
- --_ctm-mob-dn-on-ve-gp-wt-ct-gp,
845
- var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp))
846
- )
847
- ) /
848
- var(
849
- --_ctm-mob-lt-is-pr-se,
850
- var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))
851
- )
852
- );
853
- gap: var(
854
- --_ctm-mob-dn-on-ve-gp-wt-ct-gp,
855
- var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp))
856
- );
656
+ grid-auto-columns: calc((100% - (var(--_ctm-mob-lt-is-pr-se,
657
+ var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))) - 1) * var(--_ctm-mob-dn-on-ve-gp-wt-ct-gp,
658
+ var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp)))) / var(--_ctm-mob-lt-is-pr-se,
659
+ var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se, 1))));
660
+ gap: var(--_ctm-mob-dn-on-ve-gp-wt-ct-gp,
661
+ var(--_ctm-tab-dn-on-ve-gp-wt-ct-gp, var(--_ctm-dn-on-ve-gp-wt-ct-gp)));
857
662
  }
858
663
 
859
664
  .embla__slide {
@@ -869,134 +674,64 @@ $minWidth: 70px;
869
674
  justify-content: center;
870
675
  flex-shrink: 0;
871
676
  cursor: pointer;
872
- padding: var(
873
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-pg,
874
- var(
875
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-pg,
876
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-pg, 6px)
877
- )
878
- );
879
- color: var(
880
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-c1,
881
- var(
882
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-c1,
883
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-c1, #002a4e)
884
- )
885
- );
886
- background-color: var(
887
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-bd-cr,
888
- var(
889
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-bd-cr,
890
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-bd-cr, #fff)
891
- )
892
- );
893
- border-color: var(
894
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-cr,
895
- var(
896
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-cr,
897
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-cr, #d0d5dd)
898
- )
899
- );
900
- border-style: var(
901
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-se,
902
- var(
903
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-se,
904
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-se, solid)
905
- )
906
- );
907
- border-width: var(
908
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-wh,
909
- var(
910
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-wh,
911
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-wh, 1px)
912
- )
913
- );
914
- border-radius: var(
915
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-rs,
916
- var(
917
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-rs,
918
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-rs, 50%)
919
- )
920
- );
921
- box-shadow: var(
922
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-ae,
923
- var(
924
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-ae,
925
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-ae, 0px)
926
- )
927
- )
928
- var(
929
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-br,
930
- var(
931
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-br,
932
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-br, 0px)
933
- )
934
- )
935
- var(
936
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-sd,
937
- var(
938
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-sd,
939
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-sd, 0px)
940
- )
941
- )
942
- var(
943
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-cr,
944
- var(
945
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-cr,
946
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-cr, transparent)
947
- )
948
- );
677
+ padding: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-pg,
678
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-pg,
679
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-pg, 6px)));
680
+ color: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-c1,
681
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-c1,
682
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-c1, #002a4e)));
683
+ background-color: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-bd-cr,
684
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-bd-cr,
685
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-bd-cr, #fff)));
686
+ border-color: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-cr,
687
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-cr,
688
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-cr, #d0d5dd)));
689
+ border-style: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-se,
690
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-se,
691
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-se, solid)));
692
+ border-width: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-wh,
693
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-wh,
694
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-wh, 1px)));
695
+ border-radius: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-br-rs,
696
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-br-rs,
697
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-br-rs, 50%)));
698
+ box-shadow: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-ae,
699
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-ae,
700
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-ae, 0px))) var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-br,
701
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-br,
702
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-br, 0px))) var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-sd,
703
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-sd,
704
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-sd, 0px))) var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-sw-cr,
705
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-sw-cr,
706
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-sw-cr, transparent)));
949
707
 
950
708
  svg {
951
- width: var(
952
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-se,
953
- var(
954
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-se,
955
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-se, 16px)
956
- )
957
- );
958
- height: var(
959
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-se,
960
- var(
961
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-se,
962
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-se, 16px)
963
- )
964
- );
709
+ width: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-se,
710
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-se,
711
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-se, 16px)));
712
+ height: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-se,
713
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-se,
714
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-se, 16px)));
715
+
965
716
  path {
966
- stroke: var(
967
- --_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-c1,
968
- var(
969
- --_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-c1,
970
- var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-c1, #002a4e)
971
- )
972
- );
717
+ stroke: var(--_ctm-mob-dn-on-ve-gp-sr-aw-dt-se-in-c1,
718
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-dt-se-in-c1,
719
+ var(--_ctm-dn-on-ve-gp-sr-aw-dt-se-in-c1, #002a4e)));
973
720
  // Overrides the stroke-width presentation attribute baked into the icon markup.
974
721
  stroke-width: prepareMediaVariable(--_ctm-dn-on-ve-gp-sr-aw-dt-se-se-wh, 1.25);
975
722
  }
976
723
  }
977
724
 
978
725
  &:hover {
979
- color: var(
980
- --_ctm-mob-dn-on-ve-gp-sr-aw-hr-se-in-c1,
981
- var(
982
- --_ctm-tab-dn-on-ve-gp-sr-aw-hr-se-in-c1,
983
- var(--_ctm-dn-on-ve-gp-sr-aw-hr-se-in-c1)
984
- )
985
- );
986
- background-color: var(
987
- --_ctm-mob-dn-on-ve-gp-sr-aw-hr-se-bd-cr,
988
- var(
989
- --_ctm-tab-dn-on-ve-gp-sr-aw-hr-se-bd-cr,
990
- var(--_ctm-dn-on-ve-gp-sr-aw-hr-se-bd-cr)
991
- )
992
- );
993
- border-color: var(
994
- --_ctm-mob-dn-on-ve-gp-sr-aw-hr-se-br-cr,
995
- var(
996
- --_ctm-tab-dn-on-ve-gp-sr-aw-hr-se-br-cr,
997
- var(--_ctm-dn-on-ve-gp-sr-aw-hr-se-br-cr)
998
- )
999
- );
726
+ color: var(--_ctm-mob-dn-on-ve-gp-sr-aw-hr-se-in-c1,
727
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-hr-se-in-c1,
728
+ var(--_ctm-dn-on-ve-gp-sr-aw-hr-se-in-c1)));
729
+ background-color: var(--_ctm-mob-dn-on-ve-gp-sr-aw-hr-se-bd-cr,
730
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-hr-se-bd-cr,
731
+ var(--_ctm-dn-on-ve-gp-sr-aw-hr-se-bd-cr)));
732
+ border-color: var(--_ctm-mob-dn-on-ve-gp-sr-aw-hr-se-br-cr,
733
+ var(--_ctm-tab-dn-on-ve-gp-sr-aw-hr-se-br-cr,
734
+ var(--_ctm-dn-on-ve-gp-sr-aw-hr-se-br-cr)));
1000
735
  }
1001
736
 
1002
737
  &:disabled {
@@ -1006,50 +741,26 @@ $minWidth: 70px;
1006
741
  }
1007
742
  }
1008
743
  }
1009
- padding: var(
1010
- --_ctm-mob-dn-on-ve-gp-wt-pg,
1011
- var(--_ctm-tab-dn-on-ve-gp-wt-pg, var(--_ctm-dn-on-ve-gp-wt-pg))
1012
- );
1013
- gap: var(
1014
- --_ctm-mob-dn-on-ve-gp-wt-im-gp,
1015
- var(--_ctm-tab-dn-on-ve-gp-wt-im-gp, var(--_ctm-dn-on-ve-gp-wt-im-gp))
1016
- );
1017
- background-color: var(
1018
- --_ctm-mob-dn-on-ve-gp-wt-bd-cr,
1019
- var(--_ctm-tab-dn-on-ve-gp-wt-bd-cr, var(--_ctm-dn-on-ve-gp-wt-bd-cr))
1020
- );
1021
- border-color: var(
1022
- --_ctm-mob-dn-on-ve-gp-wt-br-cr,
1023
- var(--_ctm-tab-dn-on-ve-gp-wt-br-cr, var(--_ctm-dn-on-ve-gp-wt-br-cr))
1024
- );
1025
- border-style: var(
1026
- --_ctm-mob-dn-on-ve-gp-wt-br-se,
1027
- var(--_ctm-tab-dn-on-ve-gp-wt-br-se, var(--_ctm-dn-on-ve-gp-wt-br-se))
1028
- );
1029
- border-width: var(
1030
- --_ctm-mob-dn-on-ve-gp-wt-br-wh,
1031
- var(--_ctm-tab-dn-on-ve-gp-wt-br-wh, var(--_ctm-dn-on-ve-gp-wt-br-wh))
1032
- );
1033
- border-radius: var(
1034
- --_ctm-mob-dn-on-ve-gp-wt-br-rs,
1035
- var(--_ctm-tab-dn-on-ve-gp-wt-br-rs, var(--_ctm-dn-on-ve-gp-wt-br-rs))
1036
- );
1037
- box-shadow: var(
1038
- --_ctm-mob-dn-on-ve-gp-wt-sw-ae,
1039
- var(--_ctm-tab-dn-on-ve-gp-wt-sw-ae, var(--_ctm-dn-on-ve-gp-wt-sw-ae))
1040
- )
1041
- var(
1042
- --_ctm-mob-dn-on-ve-gp-wt-sw-br,
1043
- var(--_ctm-tab-dn-on-ve-gp-wt-sw-br, var(--_ctm-dn-on-ve-gp-wt-sw-br))
1044
- )
1045
- var(
1046
- --_ctm-mob-dn-on-ve-gp-wt-sw-sd,
1047
- var(--_ctm-tab-dn-on-ve-gp-wt-sw-sd, var(--_ctm-dn-on-ve-gp-wt-sw-sd))
1048
- )
1049
- var(
1050
- --_ctm-mob-dn-on-ve-gp-wt-sw-cr,
1051
- var(--_ctm-tab-dn-on-ve-gp-wt-sw-cr, var(--_ctm-dn-on-ve-gp-wt-sw-cr))
1052
- );
744
+
745
+ padding: var(--_ctm-mob-dn-on-ve-gp-wt-pg,
746
+ var(--_ctm-tab-dn-on-ve-gp-wt-pg, var(--_ctm-dn-on-ve-gp-wt-pg)));
747
+ gap: var(--_ctm-mob-dn-on-ve-gp-wt-im-gp,
748
+ var(--_ctm-tab-dn-on-ve-gp-wt-im-gp, var(--_ctm-dn-on-ve-gp-wt-im-gp)));
749
+ background-color: var(--_ctm-mob-dn-on-ve-gp-wt-bd-cr,
750
+ var(--_ctm-tab-dn-on-ve-gp-wt-bd-cr, var(--_ctm-dn-on-ve-gp-wt-bd-cr)));
751
+ border-color: var(--_ctm-mob-dn-on-ve-gp-wt-br-cr,
752
+ var(--_ctm-tab-dn-on-ve-gp-wt-br-cr, var(--_ctm-dn-on-ve-gp-wt-br-cr)));
753
+ border-style: var(--_ctm-mob-dn-on-ve-gp-wt-br-se,
754
+ var(--_ctm-tab-dn-on-ve-gp-wt-br-se, var(--_ctm-dn-on-ve-gp-wt-br-se)));
755
+ border-width: var(--_ctm-mob-dn-on-ve-gp-wt-br-wh,
756
+ var(--_ctm-tab-dn-on-ve-gp-wt-br-wh, var(--_ctm-dn-on-ve-gp-wt-br-wh)));
757
+ border-radius: var(--_ctm-mob-dn-on-ve-gp-wt-br-rs,
758
+ var(--_ctm-tab-dn-on-ve-gp-wt-br-rs, var(--_ctm-dn-on-ve-gp-wt-br-rs)));
759
+ box-shadow: var(--_ctm-mob-dn-on-ve-gp-wt-sw-ae,
760
+ var(--_ctm-tab-dn-on-ve-gp-wt-sw-ae, var(--_ctm-dn-on-ve-gp-wt-sw-ae))) var(--_ctm-mob-dn-on-ve-gp-wt-sw-br,
761
+ var(--_ctm-tab-dn-on-ve-gp-wt-sw-br, var(--_ctm-dn-on-ve-gp-wt-sw-br))) var(--_ctm-mob-dn-on-ve-gp-wt-sw-sd,
762
+ var(--_ctm-tab-dn-on-ve-gp-wt-sw-sd, var(--_ctm-dn-on-ve-gp-wt-sw-sd))) var(--_ctm-mob-dn-on-ve-gp-wt-sw-cr,
763
+ var(--_ctm-tab-dn-on-ve-gp-wt-sw-cr, var(--_ctm-dn-on-ve-gp-wt-sw-cr)));
1053
764
 
1054
765
  .grouped__tabs {
1055
766
  display: flex;
@@ -1058,46 +769,23 @@ $minWidth: 70px;
1058
769
  overflow-x: auto;
1059
770
  overflow-y: hidden;
1060
771
  padding-bottom: 3px;
1061
- padding: var(
1062
- --_ctm-mob-dn-on-ve-gp-gs-cr-pg,
1063
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-pg, var(--_ctm-dn-on-ve-gp-gs-cr-pg))
1064
- );
1065
- gap: var(
1066
- --_ctm-mob-dn-on-ve-gp-gs-cr-im-gp,
1067
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-im-gp, var(--_ctm-dn-on-ve-gp-gs-cr-im-gp))
1068
- );
1069
- border-color: var(
1070
- --_ctm-mob-dn-on-ve-gp-gs-cr-br-cr,
1071
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-cr, var(--_ctm-dn-on-ve-gp-gs-cr-br-cr))
1072
- );
1073
- border-style: var(
1074
- --_ctm-mob-dn-on-ve-gp-gs-cr-br-se,
1075
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-se, var(--_ctm-dn-on-ve-gp-gs-cr-br-se))
1076
- );
1077
- border-width: var(
1078
- --_ctm-mob-dn-on-ve-gp-gs-cr-br-wh,
1079
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-wh, var(--_ctm-dn-on-ve-gp-gs-cr-br-wh))
1080
- );
1081
- border-radius: var(
1082
- --_ctm-mob-dn-on-ve-gp-gs-cr-br-rs,
1083
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-rs, var(--_ctm-dn-on-ve-gp-gs-cr-br-rs))
1084
- );
1085
- box-shadow: var(
1086
- --_ctm-mob-dn-on-ve-gp-gs-cr-sw-ae,
1087
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-ae, var(--_ctm-dn-on-ve-gp-gs-cr-sw-ae))
1088
- )
1089
- var(
1090
- --_ctm-mob-dn-on-ve-gp-gs-cr-sw-br,
1091
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-br, var(--_ctm-dn-on-ve-gp-gs-cr-sw-br))
1092
- )
1093
- var(
1094
- --_ctm-mob-dn-on-ve-gp-gs-cr-sw-sd,
1095
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-sd, var(--_ctm-dn-on-ve-gp-gs-cr-sw-sd))
1096
- )
1097
- var(
1098
- --_ctm-mob-dn-on-ve-gp-gs-cr-sw-cr,
1099
- var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-cr, var(--_ctm-dn-on-ve-gp-gs-cr-sw-cr))
1100
- );
772
+ padding: var(--_ctm-mob-dn-on-ve-gp-gs-cr-pg,
773
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-pg, var(--_ctm-dn-on-ve-gp-gs-cr-pg)));
774
+ gap: var(--_ctm-mob-dn-on-ve-gp-gs-cr-im-gp,
775
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-im-gp, var(--_ctm-dn-on-ve-gp-gs-cr-im-gp)));
776
+ border-color: var(--_ctm-mob-dn-on-ve-gp-gs-cr-br-cr,
777
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-cr, var(--_ctm-dn-on-ve-gp-gs-cr-br-cr)));
778
+ border-style: var(--_ctm-mob-dn-on-ve-gp-gs-cr-br-se,
779
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-se, var(--_ctm-dn-on-ve-gp-gs-cr-br-se)));
780
+ border-width: var(--_ctm-mob-dn-on-ve-gp-gs-cr-br-wh,
781
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-wh, var(--_ctm-dn-on-ve-gp-gs-cr-br-wh)));
782
+ border-radius: var(--_ctm-mob-dn-on-ve-gp-gs-cr-br-rs,
783
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-br-rs, var(--_ctm-dn-on-ve-gp-gs-cr-br-rs)));
784
+ box-shadow: var(--_ctm-mob-dn-on-ve-gp-gs-cr-sw-ae,
785
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-ae, var(--_ctm-dn-on-ve-gp-gs-cr-sw-ae))) var(--_ctm-mob-dn-on-ve-gp-gs-cr-sw-br,
786
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-br, var(--_ctm-dn-on-ve-gp-gs-cr-sw-br))) var(--_ctm-mob-dn-on-ve-gp-gs-cr-sw-sd,
787
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-sd, var(--_ctm-dn-on-ve-gp-gs-cr-sw-sd))) var(--_ctm-mob-dn-on-ve-gp-gs-cr-sw-cr,
788
+ var(--_ctm-tab-dn-on-ve-gp-gs-cr-sw-cr, var(--_ctm-dn-on-ve-gp-gs-cr-sw-cr)));
1101
789
  // This scroll container would clip the description popover, so the
1102
790
  // popover uses `position: fixed` (PopoverComponent `floating` prop)
1103
791
  // to escape it while staying in this subtree for CSS-var inheritance.
@@ -1105,227 +793,102 @@ $minWidth: 70px;
1105
793
  .grouped__tab {
1106
794
  display: flex;
1107
795
  align-items: center;
1108
- gap: var(
1109
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-im-gp,
1110
- var(
1111
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-im-gp,
1112
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-im-gp, 6px)
1113
- )
1114
- );
1115
- padding: var(
1116
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-pg,
1117
- var(
1118
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-pg,
1119
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-pg, 8px 12px)
1120
- )
1121
- );
796
+ gap: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-im-gp,
797
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-im-gp,
798
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-im-gp, 6px)));
799
+ padding: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-pg,
800
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-pg,
801
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-pg, 8px 12px)));
1122
802
  cursor: pointer;
1123
803
  margin-bottom: -1px;
1124
804
  white-space: nowrap;
1125
805
  flex-shrink: 0;
1126
806
 
1127
807
  // Stateful properties — read --_sf-tb-* which hover/active override
1128
- border-style: var(
1129
- --_sf-tb-br-se,
1130
- var(
1131
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-se,
1132
- var(
1133
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-se,
1134
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-se, solid)
1135
- )
1136
- )
1137
- );
1138
- border-width: var(
1139
- --_sf-tb-br-wh,
1140
- var(
1141
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-wh,
1142
- var(
1143
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-wh,
1144
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-wh, 0 0 2px 0)
1145
- )
1146
- )
1147
- );
1148
- border-color: var(
1149
- --_sf-tb-br-cr,
1150
- var(
1151
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-cr,
1152
- var(
1153
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-cr,
1154
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-cr, transparent)
1155
- )
1156
- )
1157
- );
1158
- background-color: var(
1159
- --_sf-tb-bd-cr,
1160
- var(
1161
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-bd-cr,
1162
- var(
1163
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-bd-cr,
1164
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-bd-cr)
1165
- )
1166
- )
1167
- );
1168
- border-radius: var(
1169
- --_sf-tb-br-rs,
1170
- var(
1171
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-rs,
1172
- var(
1173
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-rs,
1174
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-rs)
1175
- )
1176
- )
1177
- );
1178
- box-shadow: var(
1179
- --_sf-tb-sw-ae,
1180
- var(
1181
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-ae,
1182
- var(
1183
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-ae,
1184
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-ae)
1185
- )
1186
- )
1187
- )
1188
- var(
1189
- --_sf-tb-sw-br,
1190
- var(
1191
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-br,
1192
- var(
1193
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-br,
1194
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-br)
1195
- )
1196
- )
1197
- )
1198
- var(
1199
- --_sf-tb-sw-sd,
1200
- var(
1201
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-sd,
1202
- var(
1203
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-sd,
1204
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-sd)
1205
- )
1206
- )
1207
- )
1208
- var(
1209
- --_sf-tb-sw-cr,
1210
- var(
1211
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-cr,
1212
- var(
1213
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-cr,
1214
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-cr)
1215
- )
1216
- )
1217
- );
808
+ border-style: var(--_sf-tb-br-se,
809
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-se,
810
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-se,
811
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-se, solid))));
812
+ border-width: var(--_sf-tb-br-wh,
813
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-wh,
814
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-wh,
815
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-wh, 0 0 2px 0))));
816
+ border-color: var(--_sf-tb-br-cr,
817
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-cr,
818
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-cr,
819
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-cr, transparent))));
820
+ background-color: var(--_sf-tb-bd-cr,
821
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-bd-cr,
822
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-bd-cr,
823
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-bd-cr))));
824
+ border-radius: var(--_sf-tb-br-rs,
825
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-br-rs,
826
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-br-rs,
827
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-br-rs))));
828
+ box-shadow: var(--_sf-tb-sw-ae,
829
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-ae,
830
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-ae,
831
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-ae)))) var(--_sf-tb-sw-br,
832
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-br,
833
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-br,
834
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-br)))) var(--_sf-tb-sw-sd,
835
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-sd,
836
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-sd,
837
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-sd)))) var(--_sf-tb-sw-cr,
838
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-sw-cr,
839
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-sw-cr,
840
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-sw-cr))));
1218
841
 
1219
842
  &:hover {
1220
- --_sf-tb-br-cr: var(
1221
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-cr,
1222
- var(
1223
- --_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-cr,
1224
- var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-cr)
1225
- )
1226
- );
1227
- --_sf-tb-br-se: var(
1228
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-se,
1229
- var(
1230
- --_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-se,
1231
- var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-se)
1232
- )
1233
- );
1234
- --_sf-tb-br-wh: var(
1235
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-wh,
1236
- var(
1237
- --_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-wh,
1238
- var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-wh)
1239
- )
1240
- );
1241
- --_sf-tb-bd-cr: var(
1242
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-bd-cr,
1243
- var(
1244
- --_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-bd-cr,
1245
- var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-bd-cr)
1246
- )
1247
- );
1248
- --_sf-tb-br-rs: var(
1249
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-rs,
1250
- var(
1251
- --_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-rs,
1252
- var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-rs)
1253
- )
1254
- );
1255
- --_sf-tb-cr: var(
1256
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-cr,
1257
- var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-cr, var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-cr))
1258
- );
1259
- --_sf-tb-ft-se: var(
1260
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-ft-se,
1261
- var(
1262
- --_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-ft-se,
1263
- var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-ft-se)
1264
- )
1265
- );
1266
- --_sf-tb-ft-wt: var(
1267
- --_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-ft-wt,
1268
- var(
1269
- --_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-ft-wt,
1270
- var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-ft-wt)
1271
- )
1272
- );
843
+ --_sf-tb-br-cr: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-cr,
844
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-cr,
845
+ var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-cr)));
846
+ --_sf-tb-br-se: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-se,
847
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-se,
848
+ var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-se)));
849
+ --_sf-tb-br-wh: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-wh,
850
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-wh,
851
+ var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-wh)));
852
+ --_sf-tb-bd-cr: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-bd-cr,
853
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-bd-cr,
854
+ var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-bd-cr)));
855
+ --_sf-tb-br-rs: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-br-rs,
856
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-br-rs,
857
+ var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-br-rs)));
858
+ --_sf-tb-cr: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-cr,
859
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-cr, var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-cr)));
860
+ --_sf-tb-ft-se: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-ft-se,
861
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-ft-se,
862
+ var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-ft-se)));
863
+ --_sf-tb-ft-wt: var(--_ctm-mob-dn-on-ve-gp-gp-tb-hr-se-ft-wt,
864
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-hr-se-ft-wt,
865
+ var(--_ctm-dn-on-ve-gp-gp-tb-hr-se-ft-wt)));
1273
866
  }
1274
867
 
1275
868
  &.active {
1276
- --_sf-tb-br-cr: var(
1277
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-cr,
1278
- var(
1279
- --_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-cr,
1280
- var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-cr)
1281
- )
1282
- );
1283
- --_sf-tb-br-se: var(
1284
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-se,
1285
- var(
1286
- --_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-se,
1287
- var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-se)
1288
- )
1289
- );
1290
- --_sf-tb-br-wh: var(
1291
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-wh,
1292
- var(
1293
- --_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-wh,
1294
- var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-wh)
1295
- )
1296
- );
1297
- --_sf-tb-bd-cr: var(
1298
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-bd-cr,
1299
- var(
1300
- --_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-bd-cr,
1301
- var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-bd-cr)
1302
- )
1303
- );
1304
- --_sf-tb-br-rs: var(
1305
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-rs,
1306
- var(
1307
- --_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-rs,
1308
- var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-rs)
1309
- )
1310
- );
1311
- --_sf-tb-cr: var(
1312
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-cr,
1313
- var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-cr, var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-cr))
1314
- );
1315
- --_sf-tb-ft-se: var(
1316
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-ft-se,
1317
- var(
1318
- --_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-ft-se,
1319
- var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-ft-se)
1320
- )
1321
- );
1322
- --_sf-tb-ft-wt: var(
1323
- --_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-ft-wt,
1324
- var(
1325
- --_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-ft-wt,
1326
- var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-ft-wt, 700)
1327
- )
1328
- );
869
+ --_sf-tb-br-cr: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-cr,
870
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-cr,
871
+ var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-cr)));
872
+ --_sf-tb-br-se: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-se,
873
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-se,
874
+ var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-se)));
875
+ --_sf-tb-br-wh: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-wh,
876
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-wh,
877
+ var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-wh)));
878
+ --_sf-tb-bd-cr: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-bd-cr,
879
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-bd-cr,
880
+ var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-bd-cr)));
881
+ --_sf-tb-br-rs: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-br-rs,
882
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-br-rs,
883
+ var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-br-rs)));
884
+ --_sf-tb-cr: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-cr,
885
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-cr, var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-cr)));
886
+ --_sf-tb-ft-se: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-ft-se,
887
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-ft-se,
888
+ var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-ft-se)));
889
+ --_sf-tb-ft-wt: var(--_ctm-mob-dn-on-ve-gp-gp-tb-sd-se-ft-wt,
890
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-sd-se-ft-wt,
891
+ var(--_ctm-dn-on-ve-gp-gp-tb-sd-se-ft-wt, 700)));
1329
892
  }
1330
893
 
1331
894
  .grouped__tab__dots {
@@ -1341,64 +904,30 @@ $minWidth: 70px;
1341
904
  }
1342
905
 
1343
906
  .grouped__tab__name {
1344
- font-size: var(
1345
- --_sf-tb-ft-se,
1346
- var(
1347
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-ft-se,
1348
- var(
1349
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-ft-se,
1350
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-ft-se, 13px)
1351
- )
1352
- )
1353
- );
1354
- font-weight: var(
1355
- --_sf-tb-ft-wt,
1356
- var(
1357
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-ft-wt,
1358
- var(
1359
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-ft-wt,
1360
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-ft-wt, 500)
1361
- )
1362
- )
1363
- );
1364
- color: var(
1365
- --_sf-tb-cr,
1366
- var(
1367
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-cr,
1368
- var(
1369
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-cr,
1370
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-cr, #1a1a2e)
1371
- )
1372
- )
1373
- );
1374
- font-family: var(
1375
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-ft-fy,
1376
- var(
1377
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-ft-fy,
1378
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-ft-fy)
1379
- )
1380
- );
1381
- text-transform: var(
1382
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-tt-tm,
1383
- var(
1384
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-tt-tm,
1385
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-tt-tm)
1386
- )
1387
- );
1388
- word-wrap: var(
1389
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-wd-wp,
1390
- var(
1391
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-wd-wp,
1392
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-wd-wp)
1393
- )
1394
- );
1395
- word-break: var(
1396
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-wd-bk,
1397
- var(
1398
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-wd-bk,
1399
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-wd-bk)
1400
- )
1401
- );
907
+ font-size: var(--_sf-tb-ft-se,
908
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-ft-se,
909
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-ft-se,
910
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-ft-se, 13px))));
911
+ font-weight: var(--_sf-tb-ft-wt,
912
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-ft-wt,
913
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-ft-wt,
914
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-ft-wt, 500))));
915
+ color: var(--_sf-tb-cr,
916
+ var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-cr,
917
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-cr,
918
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-cr, #1a1a2e))));
919
+ font-family: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-ft-fy,
920
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-ft-fy,
921
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-ft-fy)));
922
+ text-transform: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-tt-tm,
923
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-tt-tm,
924
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-tt-tm)));
925
+ word-wrap: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-wd-wp,
926
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-wd-wp,
927
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-wd-wp)));
928
+ word-break: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-wd-bk,
929
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-wd-bk,
930
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-wd-bk)));
1402
931
  }
1403
932
 
1404
933
  .grouped__tab__info-trigger {
@@ -1410,29 +939,17 @@ $minWidth: 70px;
1410
939
  display: inline-flex;
1411
940
  align-items: center;
1412
941
  justify-content: center;
1413
- color: var(
1414
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-in-c1,
1415
- var(
1416
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-in-c1,
1417
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-in-c1, #6b7280)
1418
- )
1419
- );
942
+ color: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-in-c1,
943
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-in-c1,
944
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-in-c1, #6b7280)));
1420
945
 
1421
946
  svg {
1422
- width: var(
1423
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-in-se,
1424
- var(
1425
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-in-se,
1426
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-in-se, 16px)
1427
- )
1428
- );
1429
- height: var(
1430
- --_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-in-se,
1431
- var(
1432
- --_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-in-se,
1433
- var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-in-se, 16px)
1434
- )
1435
- );
947
+ width: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-in-se,
948
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-in-se,
949
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-in-se, 16px)));
950
+ height: var(--_ctm-mob-dn-on-ve-gp-gp-tb-dt-se-in-se,
951
+ var(--_ctm-tab-dn-on-ve-gp-gp-tb-dt-se-in-se,
952
+ var(--_ctm-dn-on-ve-gp-gp-tb-dt-se-in-se, 16px)));
1436
953
  }
1437
954
  }
1438
955
  }
@@ -1442,292 +959,130 @@ $minWidth: 70px;
1442
959
  .grouped__content {
1443
960
  display: flex;
1444
961
  flex-direction: column;
1445
- gap: var(
1446
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-im-gp,
1447
- var(
1448
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-im-gp,
1449
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-im-gp, 8px)
1450
- )
1451
- );
1452
- padding: var(
1453
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-pg,
1454
- var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-pg, var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-pg))
1455
- );
962
+ gap: var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-im-gp,
963
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-im-gp,
964
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-im-gp, 8px)));
965
+ padding: var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-pg,
966
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-pg, var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-pg)));
1456
967
 
1457
968
  // Stateful properties — read --_sf-cd-* which hover/active override
1458
- background-color: var(
1459
- --_sf-cd-bd-cr,
1460
- var(
1461
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-bd-cr,
1462
- var(
1463
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-bd-cr,
1464
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-bd-cr)
1465
- )
1466
- )
1467
- );
1468
- border-color: var(
1469
- --_sf-cd-br-cr,
1470
- var(
1471
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-cr,
1472
- var(
1473
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-cr,
1474
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-cr)
1475
- )
1476
- )
1477
- );
1478
- border-style: var(
1479
- --_sf-cd-br-se,
1480
- var(
1481
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-se,
1482
- var(
1483
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-se,
1484
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-se)
1485
- )
1486
- )
1487
- );
1488
- border-width: var(
1489
- --_sf-cd-br-wh,
1490
- var(
1491
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-wh,
1492
- var(
1493
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-wh,
1494
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-wh)
1495
- )
1496
- )
1497
- );
1498
- border-radius: var(
1499
- --_sf-cd-br-rs,
1500
- var(
1501
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-rs,
1502
- var(
1503
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-rs,
1504
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-rs)
1505
- )
1506
- )
1507
- );
1508
- box-shadow: var(
1509
- --_sf-cd-sw-ae,
1510
- var(
1511
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-ae,
1512
- var(
1513
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-ae,
1514
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-ae)
1515
- )
1516
- )
1517
- )
1518
- var(
1519
- --_sf-cd-sw-br,
1520
- var(
1521
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-br,
1522
- var(
1523
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-br,
1524
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-br)
1525
- )
1526
- )
1527
- )
1528
- var(
1529
- --_sf-cd-sw-sd,
1530
- var(
1531
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-sd,
1532
- var(
1533
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-sd,
1534
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-sd)
1535
- )
1536
- )
1537
- )
1538
- var(
1539
- --_sf-cd-sw-cr,
1540
- var(
1541
- --_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-cr,
1542
- var(
1543
- --_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-cr,
1544
- var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-cr)
1545
- )
1546
- )
1547
- );
969
+ background-color: var(--_sf-cd-bd-cr,
970
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-bd-cr,
971
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-bd-cr,
972
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-bd-cr))));
973
+ border-color: var(--_sf-cd-br-cr,
974
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-cr,
975
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-cr,
976
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-cr))));
977
+ border-style: var(--_sf-cd-br-se,
978
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-se,
979
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-se,
980
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-se))));
981
+ border-width: var(--_sf-cd-br-wh,
982
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-wh,
983
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-wh,
984
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-wh))));
985
+ border-radius: var(--_sf-cd-br-rs,
986
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-br-rs,
987
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-br-rs,
988
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-br-rs))));
989
+ box-shadow: var(--_sf-cd-sw-ae,
990
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-ae,
991
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-ae,
992
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-ae)))) var(--_sf-cd-sw-br,
993
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-br,
994
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-br,
995
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-br)))) var(--_sf-cd-sw-sd,
996
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-sd,
997
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-sd,
998
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-sd)))) var(--_sf-cd-sw-cr,
999
+ var(--_ctm-mob-dn-on-ve-gp-ds-cd-dt-se-sw-cr,
1000
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-dt-se-sw-cr,
1001
+ var(--_ctm-dn-on-ve-gp-ds-cd-dt-se-sw-cr))));
1548
1002
 
1549
1003
  &:hover {
1550
- --_sf-cd-bd-cr: var(
1551
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-bd-cr,
1552
- var(
1553
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-bd-cr,
1554
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-bd-cr)
1555
- )
1556
- );
1557
- --_sf-cd-br-cr: var(
1558
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-cr,
1559
- var(
1560
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-cr,
1561
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-cr)
1562
- )
1563
- );
1564
- --_sf-cd-br-se: var(
1565
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-se,
1566
- var(
1567
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-se,
1568
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-se)
1569
- )
1570
- );
1571
- --_sf-cd-br-wh: var(
1572
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-wh,
1573
- var(
1574
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-wh,
1575
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-wh)
1576
- )
1577
- );
1578
- --_sf-cd-br-rs: var(
1579
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-rs,
1580
- var(
1581
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-rs,
1582
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-rs)
1583
- )
1584
- );
1585
- --_sf-cd-sw-ae: var(
1586
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-ae,
1587
- var(
1588
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-ae,
1589
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-ae)
1590
- )
1591
- );
1592
- --_sf-cd-sw-br: var(
1593
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-br,
1594
- var(
1595
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-br,
1596
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-br)
1597
- )
1598
- );
1599
- --_sf-cd-sw-sd: var(
1600
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-sd,
1601
- var(
1602
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-sd,
1603
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-sd)
1604
- )
1605
- );
1606
- --_sf-cd-sw-cr: var(
1607
- --_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-cr,
1608
- var(
1609
- --_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-cr,
1610
- var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-cr)
1611
- )
1612
- );
1004
+ --_sf-cd-bd-cr: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-bd-cr,
1005
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-bd-cr,
1006
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-bd-cr)));
1007
+ --_sf-cd-br-cr: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-cr,
1008
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-cr,
1009
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-cr)));
1010
+ --_sf-cd-br-se: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-se,
1011
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-se,
1012
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-se)));
1013
+ --_sf-cd-br-wh: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-wh,
1014
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-wh,
1015
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-wh)));
1016
+ --_sf-cd-br-rs: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-br-rs,
1017
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-br-rs,
1018
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-br-rs)));
1019
+ --_sf-cd-sw-ae: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-ae,
1020
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-ae,
1021
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-ae)));
1022
+ --_sf-cd-sw-br: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-br,
1023
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-br,
1024
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-br)));
1025
+ --_sf-cd-sw-sd: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-sd,
1026
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-sd,
1027
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-sd)));
1028
+ --_sf-cd-sw-cr: var(--_ctm-mob-dn-on-ve-gp-ds-cd-hr-se-sw-cr,
1029
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-hr-se-sw-cr,
1030
+ var(--_ctm-dn-on-ve-gp-ds-cd-hr-se-sw-cr)));
1613
1031
  }
1614
1032
 
1615
1033
  &.active {
1616
- --_sf-cd-bd-cr: var(
1617
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-bd-cr,
1618
- var(
1619
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-bd-cr,
1620
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-bd-cr)
1621
- )
1622
- );
1623
- --_sf-cd-br-cr: var(
1624
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-cr,
1625
- var(
1626
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-cr,
1627
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-cr)
1628
- )
1629
- );
1630
- --_sf-cd-br-se: var(
1631
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-se,
1632
- var(
1633
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-se,
1634
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-se)
1635
- )
1636
- );
1637
- --_sf-cd-br-wh: var(
1638
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-wh,
1639
- var(
1640
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-wh,
1641
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-wh)
1642
- )
1643
- );
1644
- --_sf-cd-br-rs: var(
1645
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-rs,
1646
- var(
1647
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-rs,
1648
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-rs)
1649
- )
1650
- );
1651
- --_sf-cd-sw-ae: var(
1652
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-ae,
1653
- var(
1654
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-ae,
1655
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-ae)
1656
- )
1657
- );
1658
- --_sf-cd-sw-br: var(
1659
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-br,
1660
- var(
1661
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-br,
1662
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-br)
1663
- )
1664
- );
1665
- --_sf-cd-sw-sd: var(
1666
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-sd,
1667
- var(
1668
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-sd,
1669
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-sd)
1670
- )
1671
- );
1672
- --_sf-cd-sw-cr: var(
1673
- --_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-cr,
1674
- var(
1675
- --_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-cr,
1676
- var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-cr)
1677
- )
1678
- );
1034
+ --_sf-cd-bd-cr: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-bd-cr,
1035
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-bd-cr,
1036
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-bd-cr)));
1037
+ --_sf-cd-br-cr: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-cr,
1038
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-cr,
1039
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-cr)));
1040
+ --_sf-cd-br-se: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-se,
1041
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-se,
1042
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-se)));
1043
+ --_sf-cd-br-wh: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-wh,
1044
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-wh,
1045
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-wh)));
1046
+ --_sf-cd-br-rs: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-br-rs,
1047
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-br-rs,
1048
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-br-rs)));
1049
+ --_sf-cd-sw-ae: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-ae,
1050
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-ae,
1051
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-ae)));
1052
+ --_sf-cd-sw-br: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-br,
1053
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-br,
1054
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-br)));
1055
+ --_sf-cd-sw-sd: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-sd,
1056
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-sd,
1057
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-sd)));
1058
+ --_sf-cd-sw-cr: var(--_ctm-mob-dn-on-ve-gp-ds-cd-sd-se-sw-cr,
1059
+ var(--_ctm-tab-dn-on-ve-gp-ds-cd-sd-se-sw-cr,
1060
+ var(--_ctm-dn-on-ve-gp-ds-cd-sd-se-sw-cr)));
1679
1061
  }
1680
1062
 
1681
1063
  .grouped__group__header {
1682
1064
  display: flex;
1683
1065
  align-items: center;
1684
- gap: var(
1685
- --_ctm-mob-dn-on-ve-gp-rn-im-gp,
1686
- var(--_ctm-tab-dn-on-ve-gp-rn-im-gp, var(--_ctm-dn-on-ve-gp-rn-im-gp, 8px))
1687
- );
1688
- background-color: var(
1689
- --_ctm-mob-dn-on-ve-gp-rn-bd-cr,
1690
- var(--_ctm-tab-dn-on-ve-gp-rn-bd-cr, var(--_ctm-dn-on-ve-gp-rn-bd-cr, #f3f4f6))
1691
- );
1692
- padding: var(
1693
- --_ctm-mob-dn-on-ve-gp-rn-pg,
1694
- var(--_ctm-tab-dn-on-ve-gp-rn-pg, var(--_ctm-dn-on-ve-gp-rn-pg, 8px 12px))
1695
- );
1696
- border-color: var(
1697
- --_ctm-mob-dn-on-ve-gp-rn-br-cr,
1698
- var(--_ctm-tab-dn-on-ve-gp-rn-br-cr, var(--_ctm-dn-on-ve-gp-rn-br-cr))
1699
- );
1700
- border-style: var(
1701
- --_ctm-mob-dn-on-ve-gp-rn-br-se,
1702
- var(--_ctm-tab-dn-on-ve-gp-rn-br-se, var(--_ctm-dn-on-ve-gp-rn-br-se))
1703
- );
1704
- border-width: var(
1705
- --_ctm-mob-dn-on-ve-gp-rn-br-wh,
1706
- var(--_ctm-tab-dn-on-ve-gp-rn-br-wh, var(--_ctm-dn-on-ve-gp-rn-br-wh))
1707
- );
1708
- border-radius: var(
1709
- --_ctm-mob-dn-on-ve-gp-rn-br-rs,
1710
- var(--_ctm-tab-dn-on-ve-gp-rn-br-rs, var(--_ctm-dn-on-ve-gp-rn-br-rs))
1711
- );
1712
- box-shadow: var(
1713
- --_ctm-mob-dn-on-ve-gp-rn-sw-ae,
1714
- var(--_ctm-tab-dn-on-ve-gp-rn-sw-ae, var(--_ctm-dn-on-ve-gp-rn-sw-ae, 0px))
1715
- )
1716
- var(
1717
- --_ctm-mob-dn-on-ve-gp-rn-sw-br,
1718
- var(--_ctm-tab-dn-on-ve-gp-rn-sw-br, var(--_ctm-dn-on-ve-gp-rn-sw-br, 0px))
1719
- )
1720
- var(
1721
- --_ctm-mob-dn-on-ve-gp-rn-sw-sd,
1722
- var(--_ctm-tab-dn-on-ve-gp-rn-sw-sd, var(--_ctm-dn-on-ve-gp-rn-sw-sd, 0px))
1723
- )
1724
- var(
1725
- --_ctm-mob-dn-on-ve-gp-rn-sw-cr,
1726
- var(
1727
- --_ctm-tab-dn-on-ve-gp-rn-sw-cr,
1728
- var(--_ctm-dn-on-ve-gp-rn-sw-cr, transparent)
1729
- )
1730
- );
1066
+ gap: var(--_ctm-mob-dn-on-ve-gp-rn-im-gp,
1067
+ var(--_ctm-tab-dn-on-ve-gp-rn-im-gp, var(--_ctm-dn-on-ve-gp-rn-im-gp, 8px)));
1068
+ background-color: var(--_ctm-mob-dn-on-ve-gp-rn-bd-cr,
1069
+ var(--_ctm-tab-dn-on-ve-gp-rn-bd-cr, var(--_ctm-dn-on-ve-gp-rn-bd-cr, #f3f4f6)));
1070
+ padding: var(--_ctm-mob-dn-on-ve-gp-rn-pg,
1071
+ var(--_ctm-tab-dn-on-ve-gp-rn-pg, var(--_ctm-dn-on-ve-gp-rn-pg, 8px 12px)));
1072
+ border-color: var(--_ctm-mob-dn-on-ve-gp-rn-br-cr,
1073
+ var(--_ctm-tab-dn-on-ve-gp-rn-br-cr, var(--_ctm-dn-on-ve-gp-rn-br-cr)));
1074
+ border-style: var(--_ctm-mob-dn-on-ve-gp-rn-br-se,
1075
+ var(--_ctm-tab-dn-on-ve-gp-rn-br-se, var(--_ctm-dn-on-ve-gp-rn-br-se)));
1076
+ border-width: var(--_ctm-mob-dn-on-ve-gp-rn-br-wh,
1077
+ var(--_ctm-tab-dn-on-ve-gp-rn-br-wh, var(--_ctm-dn-on-ve-gp-rn-br-wh)));
1078
+ border-radius: var(--_ctm-mob-dn-on-ve-gp-rn-br-rs,
1079
+ var(--_ctm-tab-dn-on-ve-gp-rn-br-rs, var(--_ctm-dn-on-ve-gp-rn-br-rs)));
1080
+ box-shadow: var(--_ctm-mob-dn-on-ve-gp-rn-sw-ae,
1081
+ var(--_ctm-tab-dn-on-ve-gp-rn-sw-ae, var(--_ctm-dn-on-ve-gp-rn-sw-ae, 0px))) var(--_ctm-mob-dn-on-ve-gp-rn-sw-br,
1082
+ var(--_ctm-tab-dn-on-ve-gp-rn-sw-br, var(--_ctm-dn-on-ve-gp-rn-sw-br, 0px))) var(--_ctm-mob-dn-on-ve-gp-rn-sw-sd,
1083
+ var(--_ctm-tab-dn-on-ve-gp-rn-sw-sd, var(--_ctm-dn-on-ve-gp-rn-sw-sd, 0px))) var(--_ctm-mob-dn-on-ve-gp-rn-sw-cr,
1084
+ var(--_ctm-tab-dn-on-ve-gp-rn-sw-cr,
1085
+ var(--_ctm-dn-on-ve-gp-rn-sw-cr, transparent)));
1731
1086
 
1732
1087
  .grouped__header__dots {
1733
1088
  display: flex;
@@ -1742,34 +1097,20 @@ $minWidth: 70px;
1742
1097
  }
1743
1098
 
1744
1099
  span {
1745
- font-size: var(
1746
- --_ctm-mob-dn-on-ve-gp-rn-ft-se,
1747
- var(--_ctm-tab-dn-on-ve-gp-rn-ft-se, var(--_ctm-dn-on-ve-gp-rn-ft-se, 13px))
1748
- );
1749
- font-weight: var(
1750
- --_ctm-mob-dn-on-ve-gp-rn-ft-wt,
1751
- var(--_ctm-tab-dn-on-ve-gp-rn-ft-wt, var(--_ctm-dn-on-ve-gp-rn-ft-wt, 700))
1752
- );
1753
- color: var(
1754
- --_ctm-mob-dn-on-ve-gp-rn-cr,
1755
- var(--_ctm-tab-dn-on-ve-gp-rn-cr, var(--_ctm-dn-on-ve-gp-rn-cr, #1a1a2e))
1756
- );
1757
- font-family: var(
1758
- --_ctm-mob-dn-on-ve-gp-rn-ft-fy,
1759
- var(--_ctm-tab-dn-on-ve-gp-rn-ft-fy, var(--_ctm-dn-on-ve-gp-rn-ft-fy))
1760
- );
1761
- text-transform: var(
1762
- --_ctm-mob-dn-on-ve-gp-rn-tt-tm,
1763
- var(--_ctm-tab-dn-on-ve-gp-rn-tt-tm, var(--_ctm-dn-on-ve-gp-rn-tt-tm))
1764
- );
1765
- word-wrap: var(
1766
- --_ctm-mob-dn-on-ve-gp-rn-wd-wp,
1767
- var(--_ctm-tab-dn-on-ve-gp-rn-wd-wp, var(--_ctm-dn-on-ve-gp-rn-wd-wp))
1768
- );
1769
- word-break: var(
1770
- --_ctm-mob-dn-on-ve-gp-rn-wd-bk,
1771
- var(--_ctm-tab-dn-on-ve-gp-rn-wd-bk, var(--_ctm-dn-on-ve-gp-rn-wd-bk))
1772
- );
1100
+ font-size: var(--_ctm-mob-dn-on-ve-gp-rn-ft-se,
1101
+ var(--_ctm-tab-dn-on-ve-gp-rn-ft-se, var(--_ctm-dn-on-ve-gp-rn-ft-se, 13px)));
1102
+ font-weight: var(--_ctm-mob-dn-on-ve-gp-rn-ft-wt,
1103
+ var(--_ctm-tab-dn-on-ve-gp-rn-ft-wt, var(--_ctm-dn-on-ve-gp-rn-ft-wt, 700)));
1104
+ color: var(--_ctm-mob-dn-on-ve-gp-rn-cr,
1105
+ var(--_ctm-tab-dn-on-ve-gp-rn-cr, var(--_ctm-dn-on-ve-gp-rn-cr, #1a1a2e)));
1106
+ font-family: var(--_ctm-mob-dn-on-ve-gp-rn-ft-fy,
1107
+ var(--_ctm-tab-dn-on-ve-gp-rn-ft-fy, var(--_ctm-dn-on-ve-gp-rn-ft-fy)));
1108
+ text-transform: var(--_ctm-mob-dn-on-ve-gp-rn-tt-tm,
1109
+ var(--_ctm-tab-dn-on-ve-gp-rn-tt-tm, var(--_ctm-dn-on-ve-gp-rn-tt-tm)));
1110
+ word-wrap: var(--_ctm-mob-dn-on-ve-gp-rn-wd-wp,
1111
+ var(--_ctm-tab-dn-on-ve-gp-rn-wd-wp, var(--_ctm-dn-on-ve-gp-rn-wd-wp)));
1112
+ word-break: var(--_ctm-mob-dn-on-ve-gp-rn-wd-bk,
1113
+ var(--_ctm-tab-dn-on-ve-gp-rn-wd-bk, var(--_ctm-dn-on-ve-gp-rn-wd-bk)));
1773
1114
  }
1774
1115
  }
1775
1116
 
@@ -1782,53 +1123,26 @@ $minWidth: 70px;
1782
1123
  .grouped__selected__indicator {
1783
1124
  display: flex;
1784
1125
  align-items: center;
1785
- gap: var(
1786
- --_ctm-mob-dn-on-ve-gp-sd-ve-im-gp,
1787
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-im-gp, var(--_ctm-dn-on-ve-gp-sd-ve-im-gp, 8px))
1788
- );
1789
- padding: var(
1790
- --_ctm-mob-dn-on-ve-gp-sd-ve-pg,
1791
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-pg, var(--_ctm-dn-on-ve-gp-sd-ve-pg, 10px 12px))
1792
- );
1793
- background-color: var(
1794
- --_ctm-mob-dn-on-ve-gp-sd-ve-bd-cr,
1795
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-bd-cr, var(--_ctm-dn-on-ve-gp-sd-ve-bd-cr))
1796
- );
1797
- border-color: var(
1798
- --_ctm-mob-dn-on-ve-gp-sd-ve-br-cr,
1799
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-cr, var(--_ctm-dn-on-ve-gp-sd-ve-br-cr))
1800
- );
1801
- border-style: var(
1802
- --_ctm-mob-dn-on-ve-gp-sd-ve-br-se,
1803
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-se, var(--_ctm-dn-on-ve-gp-sd-ve-br-se))
1804
- );
1805
- border-width: var(
1806
- --_ctm-mob-dn-on-ve-gp-sd-ve-br-wh,
1807
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-wh, var(--_ctm-dn-on-ve-gp-sd-ve-br-wh))
1808
- );
1809
- border-radius: var(
1810
- --_ctm-mob-dn-on-ve-gp-sd-ve-br-rs,
1811
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-rs, var(--_ctm-dn-on-ve-gp-sd-ve-br-rs))
1812
- );
1813
- box-shadow: var(
1814
- --_ctm-mob-dn-on-ve-gp-sd-ve-sw-ae,
1815
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-sw-ae, var(--_ctm-dn-on-ve-gp-sd-ve-sw-ae, 0px))
1816
- )
1817
- var(
1818
- --_ctm-mob-dn-on-ve-gp-sd-ve-sw-br,
1819
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-sw-br, var(--_ctm-dn-on-ve-gp-sd-ve-sw-br, 0px))
1820
- )
1821
- var(
1822
- --_ctm-mob-dn-on-ve-gp-sd-ve-sw-sd,
1823
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-sw-sd, var(--_ctm-dn-on-ve-gp-sd-ve-sw-sd, 0px))
1824
- )
1825
- var(
1826
- --_ctm-mob-dn-on-ve-gp-sd-ve-sw-cr,
1827
- var(
1828
- --_ctm-tab-dn-on-ve-gp-sd-ve-sw-cr,
1829
- var(--_ctm-dn-on-ve-gp-sd-ve-sw-cr, transparent)
1830
- )
1831
- );
1126
+ gap: var(--_ctm-mob-dn-on-ve-gp-sd-ve-im-gp,
1127
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-im-gp, var(--_ctm-dn-on-ve-gp-sd-ve-im-gp, 8px)));
1128
+ padding: var(--_ctm-mob-dn-on-ve-gp-sd-ve-pg,
1129
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-pg, var(--_ctm-dn-on-ve-gp-sd-ve-pg, 10px 12px)));
1130
+ background-color: var(--_ctm-mob-dn-on-ve-gp-sd-ve-bd-cr,
1131
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-bd-cr, var(--_ctm-dn-on-ve-gp-sd-ve-bd-cr)));
1132
+ border-color: var(--_ctm-mob-dn-on-ve-gp-sd-ve-br-cr,
1133
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-cr, var(--_ctm-dn-on-ve-gp-sd-ve-br-cr)));
1134
+ border-style: var(--_ctm-mob-dn-on-ve-gp-sd-ve-br-se,
1135
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-se, var(--_ctm-dn-on-ve-gp-sd-ve-br-se)));
1136
+ border-width: var(--_ctm-mob-dn-on-ve-gp-sd-ve-br-wh,
1137
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-wh, var(--_ctm-dn-on-ve-gp-sd-ve-br-wh)));
1138
+ border-radius: var(--_ctm-mob-dn-on-ve-gp-sd-ve-br-rs,
1139
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-br-rs, var(--_ctm-dn-on-ve-gp-sd-ve-br-rs)));
1140
+ box-shadow: var(--_ctm-mob-dn-on-ve-gp-sd-ve-sw-ae,
1141
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-sw-ae, var(--_ctm-dn-on-ve-gp-sd-ve-sw-ae, 0px))) var(--_ctm-mob-dn-on-ve-gp-sd-ve-sw-br,
1142
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-sw-br, var(--_ctm-dn-on-ve-gp-sd-ve-sw-br, 0px))) var(--_ctm-mob-dn-on-ve-gp-sd-ve-sw-sd,
1143
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-sw-sd, var(--_ctm-dn-on-ve-gp-sd-ve-sw-sd, 0px))) var(--_ctm-mob-dn-on-ve-gp-sd-ve-sw-cr,
1144
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-sw-cr,
1145
+ var(--_ctm-dn-on-ve-gp-sd-ve-sw-cr, transparent)));
1832
1146
 
1833
1147
  .grouped__indicator__dot {
1834
1148
  width: 30px;
@@ -1854,112 +1168,60 @@ $minWidth: 70px;
1854
1168
 
1855
1169
  // "Selected:" label — driven by the Label (p1 / `-dc`) typography set.
1856
1170
  .grouped__indicator__value {
1857
- color: var(
1858
- --_ctm-mob-dn-on-ve-gp-sd-ve-cr-dc,
1859
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-cr-dc, var(--_ctm-dn-on-ve-gp-sd-ve-cr-dc, #333))
1860
- );
1861
- font-family: var(
1862
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-fy-dc,
1863
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-fy-dc, var(--_ctm-dn-on-ve-gp-sd-ve-ft-fy-dc))
1864
- );
1865
- text-transform: var(
1866
- --_ctm-mob-dn-on-ve-gp-sd-ve-tt-tm-dc,
1867
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-tm-dc, var(--_ctm-dn-on-ve-gp-sd-ve-tt-tm-dc))
1868
- );
1869
- word-wrap: var(
1870
- --_ctm-mob-dn-on-ve-gp-sd-ve-wd-wp-dc,
1871
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-wp-dc, var(--_ctm-dn-on-ve-gp-sd-ve-wd-wp-dc))
1872
- );
1873
- word-break: var(
1874
- --_ctm-mob-dn-on-ve-gp-sd-ve-wd-bk-dc,
1875
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-bk-dc, var(--_ctm-dn-on-ve-gp-sd-ve-wd-bk-dc))
1876
- );
1877
- font-size: var(
1878
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-se-dc,
1879
- var(
1880
- --_ctm-tab-dn-on-ve-gp-sd-ve-ft-se-dc,
1881
- var(--_ctm-dn-on-ve-gp-sd-ve-ft-se-dc, 14px)
1882
- )
1883
- );
1884
- font-weight: var(
1885
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-wt-dc,
1886
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-wt-dc, var(--_ctm-dn-on-ve-gp-sd-ve-ft-wt-dc))
1887
- );
1888
- font-style: var(
1889
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-se-ic-dc,
1890
- var(
1891
- --_ctm-tab-dn-on-ve-gp-sd-ve-ft-se-ic-dc,
1892
- var(--_ctm-dn-on-ve-gp-sd-ve-ft-se-ic-dc)
1893
- )
1894
- );
1895
- text-align: var(
1896
- --_ctm-mob-dn-on-ve-gp-sd-ve-tt-an-dc,
1897
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-an-dc, var(--_ctm-dn-on-ve-gp-sd-ve-tt-an-dc))
1898
- );
1899
- letter-spacing: var(
1900
- --_ctm-mob-dn-on-ve-gp-sd-ve-lr-sg-dc,
1901
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-lr-sg-dc, var(--_ctm-dn-on-ve-gp-sd-ve-lr-sg-dc))
1902
- );
1903
- line-height: var(
1904
- --_ctm-mob-dn-on-ve-gp-sd-ve-le-ht-dc,
1905
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-le-ht-dc, var(--_ctm-dn-on-ve-gp-sd-ve-le-ht-dc))
1906
- );
1907
- text-decoration: var(
1908
- --_ctm-mob-dn-on-ve-gp-sd-ve-ue-dc,
1909
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ue-dc, var(--_ctm-dn-on-ve-gp-sd-ve-ue-dc))
1910
- );
1171
+ color: var(--_ctm-mob-dn-on-ve-gp-sd-ve-cr-dc,
1172
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-cr-dc, var(--_ctm-dn-on-ve-gp-sd-ve-cr-dc, #333)));
1173
+ font-family: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-fy-dc,
1174
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-fy-dc, var(--_ctm-dn-on-ve-gp-sd-ve-ft-fy-dc)));
1175
+ text-transform: var(--_ctm-mob-dn-on-ve-gp-sd-ve-tt-tm-dc,
1176
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-tm-dc, var(--_ctm-dn-on-ve-gp-sd-ve-tt-tm-dc)));
1177
+ word-wrap: var(--_ctm-mob-dn-on-ve-gp-sd-ve-wd-wp-dc,
1178
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-wp-dc, var(--_ctm-dn-on-ve-gp-sd-ve-wd-wp-dc)));
1179
+ word-break: var(--_ctm-mob-dn-on-ve-gp-sd-ve-wd-bk-dc,
1180
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-bk-dc, var(--_ctm-dn-on-ve-gp-sd-ve-wd-bk-dc)));
1181
+ font-size: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-se-dc,
1182
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-se-dc,
1183
+ var(--_ctm-dn-on-ve-gp-sd-ve-ft-se-dc, 14px)));
1184
+ font-weight: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-wt-dc,
1185
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-wt-dc, var(--_ctm-dn-on-ve-gp-sd-ve-ft-wt-dc)));
1186
+ font-style: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-se-ic-dc,
1187
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-se-ic-dc,
1188
+ var(--_ctm-dn-on-ve-gp-sd-ve-ft-se-ic-dc)));
1189
+ text-align: var(--_ctm-mob-dn-on-ve-gp-sd-ve-tt-an-dc,
1190
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-an-dc, var(--_ctm-dn-on-ve-gp-sd-ve-tt-an-dc)));
1191
+ letter-spacing: var(--_ctm-mob-dn-on-ve-gp-sd-ve-lr-sg-dc,
1192
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-lr-sg-dc, var(--_ctm-dn-on-ve-gp-sd-ve-lr-sg-dc)));
1193
+ line-height: var(--_ctm-mob-dn-on-ve-gp-sd-ve-le-ht-dc,
1194
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-le-ht-dc, var(--_ctm-dn-on-ve-gp-sd-ve-le-ht-dc)));
1195
+ text-decoration: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ue-dc,
1196
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ue-dc, var(--_ctm-dn-on-ve-gp-sd-ve-ue-dc)));
1911
1197
  }
1912
1198
 
1913
1199
  // Selected value name — driven by the Value (h3) typography set.
1914
1200
  .grouped__indicator__label {
1915
- color: var(
1916
- --_ctm-mob-dn-on-ve-gp-sd-ve-cr,
1917
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-cr, var(--_ctm-dn-on-ve-gp-sd-ve-cr, #1a1a2e))
1918
- );
1919
- font-family: var(
1920
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-fy,
1921
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-fy, var(--_ctm-dn-on-ve-gp-sd-ve-ft-fy))
1922
- );
1923
- text-transform: var(
1924
- --_ctm-mob-dn-on-ve-gp-sd-ve-tt-tm,
1925
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-tm, var(--_ctm-dn-on-ve-gp-sd-ve-tt-tm))
1926
- );
1927
- word-wrap: var(
1928
- --_ctm-mob-dn-on-ve-gp-sd-ve-wd-wp,
1929
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-wp, var(--_ctm-dn-on-ve-gp-sd-ve-wd-wp))
1930
- );
1931
- word-break: var(
1932
- --_ctm-mob-dn-on-ve-gp-sd-ve-wd-bk,
1933
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-bk, var(--_ctm-dn-on-ve-gp-sd-ve-wd-bk))
1934
- );
1935
- font-size: var(
1936
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-se,
1937
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-se, var(--_ctm-dn-on-ve-gp-sd-ve-ft-se, 14px))
1938
- );
1939
- font-weight: var(
1940
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-wt,
1941
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-wt, var(--_ctm-dn-on-ve-gp-sd-ve-ft-wt, 700))
1942
- );
1943
- font-style: var(
1944
- --_ctm-mob-dn-on-ve-gp-sd-ve-ft-se-ic,
1945
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-se-ic, var(--_ctm-dn-on-ve-gp-sd-ve-ft-se-ic))
1946
- );
1947
- text-align: var(
1948
- --_ctm-mob-dn-on-ve-gp-sd-ve-tt-an,
1949
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-an, var(--_ctm-dn-on-ve-gp-sd-ve-tt-an))
1950
- );
1951
- letter-spacing: var(
1952
- --_ctm-mob-dn-on-ve-gp-sd-ve-lr-sg,
1953
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-lr-sg, var(--_ctm-dn-on-ve-gp-sd-ve-lr-sg))
1954
- );
1955
- line-height: var(
1956
- --_ctm-mob-dn-on-ve-gp-sd-ve-le-ht,
1957
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-le-ht, var(--_ctm-dn-on-ve-gp-sd-ve-le-ht))
1958
- );
1959
- text-decoration: var(
1960
- --_ctm-mob-dn-on-ve-gp-sd-ve-ue,
1961
- var(--_ctm-tab-dn-on-ve-gp-sd-ve-ue, var(--_ctm-dn-on-ve-gp-sd-ve-ue))
1962
- );
1201
+ color: var(--_ctm-mob-dn-on-ve-gp-sd-ve-cr,
1202
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-cr, var(--_ctm-dn-on-ve-gp-sd-ve-cr, #1a1a2e)));
1203
+ font-family: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-fy,
1204
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-fy, var(--_ctm-dn-on-ve-gp-sd-ve-ft-fy)));
1205
+ text-transform: var(--_ctm-mob-dn-on-ve-gp-sd-ve-tt-tm,
1206
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-tm, var(--_ctm-dn-on-ve-gp-sd-ve-tt-tm)));
1207
+ word-wrap: var(--_ctm-mob-dn-on-ve-gp-sd-ve-wd-wp,
1208
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-wp, var(--_ctm-dn-on-ve-gp-sd-ve-wd-wp)));
1209
+ word-break: var(--_ctm-mob-dn-on-ve-gp-sd-ve-wd-bk,
1210
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-wd-bk, var(--_ctm-dn-on-ve-gp-sd-ve-wd-bk)));
1211
+ font-size: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-se,
1212
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-se, var(--_ctm-dn-on-ve-gp-sd-ve-ft-se, 14px)));
1213
+ font-weight: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-wt,
1214
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-wt, var(--_ctm-dn-on-ve-gp-sd-ve-ft-wt, 700)));
1215
+ font-style: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ft-se-ic,
1216
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ft-se-ic, var(--_ctm-dn-on-ve-gp-sd-ve-ft-se-ic)));
1217
+ text-align: var(--_ctm-mob-dn-on-ve-gp-sd-ve-tt-an,
1218
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-tt-an, var(--_ctm-dn-on-ve-gp-sd-ve-tt-an)));
1219
+ letter-spacing: var(--_ctm-mob-dn-on-ve-gp-sd-ve-lr-sg,
1220
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-lr-sg, var(--_ctm-dn-on-ve-gp-sd-ve-lr-sg)));
1221
+ line-height: var(--_ctm-mob-dn-on-ve-gp-sd-ve-le-ht,
1222
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-le-ht, var(--_ctm-dn-on-ve-gp-sd-ve-le-ht)));
1223
+ text-decoration: var(--_ctm-mob-dn-on-ve-gp-sd-ve-ue,
1224
+ var(--_ctm-tab-dn-on-ve-gp-sd-ve-ue, var(--_ctm-dn-on-ve-gp-sd-ve-ue)));
1963
1225
  }
1964
1226
  }
1965
1227
 
@@ -1973,53 +1235,26 @@ $minWidth: 70px;
1973
1235
  display: flex;
1974
1236
  flex-direction: column;
1975
1237
  transform: translateX(-50%);
1976
- gap: var(
1977
- --_ctm-mob-dn-on-ve-gp-pr-se-im-gp,
1978
- var(--_ctm-tab-dn-on-ve-gp-pr-se-im-gp, var(--_ctm-dn-on-ve-gp-pr-se-im-gp, 4px))
1979
- );
1980
- background-color: var(
1981
- --_ctm-mob-dn-on-ve-gp-pr-se-bd-cr,
1982
- var(--_ctm-tab-dn-on-ve-gp-pr-se-bd-cr, var(--_ctm-dn-on-ve-gp-pr-se-bd-cr, #fff))
1983
- );
1984
- border-color: var(
1985
- --_ctm-mob-dn-on-ve-gp-pr-se-br-cr,
1986
- var(--_ctm-tab-dn-on-ve-gp-pr-se-br-cr, var(--_ctm-dn-on-ve-gp-pr-se-br-cr, #e5e7eb))
1987
- );
1988
- border-style: var(
1989
- --_ctm-mob-dn-on-ve-gp-pr-se-br-se,
1990
- var(--_ctm-tab-dn-on-ve-gp-pr-se-br-se, var(--_ctm-dn-on-ve-gp-pr-se-br-se, solid))
1991
- );
1992
- border-width: var(
1993
- --_ctm-mob-dn-on-ve-gp-pr-se-br-wh,
1994
- var(--_ctm-tab-dn-on-ve-gp-pr-se-br-wh, var(--_ctm-dn-on-ve-gp-pr-se-br-wh, 1px))
1995
- );
1996
- border-radius: var(
1997
- --_ctm-mob-dn-on-ve-gp-pr-se-br-rs,
1998
- var(--_ctm-tab-dn-on-ve-gp-pr-se-br-rs, var(--_ctm-dn-on-ve-gp-pr-se-br-rs, 4px))
1999
- );
2000
- padding: var(
2001
- --_ctm-mob-dn-on-ve-gp-pr-se-pg,
2002
- var(--_ctm-tab-dn-on-ve-gp-pr-se-pg, var(--_ctm-dn-on-ve-gp-pr-se-pg, 8px))
2003
- );
2004
- box-shadow: var(
2005
- --_ctm-mob-dn-on-ve-gp-pr-se-sw-ae,
2006
- var(--_ctm-tab-dn-on-ve-gp-pr-se-sw-ae, var(--_ctm-dn-on-ve-gp-pr-se-sw-ae, 0px))
2007
- )
2008
- var(
2009
- --_ctm-mob-dn-on-ve-gp-pr-se-sw-br,
2010
- var(--_ctm-tab-dn-on-ve-gp-pr-se-sw-br, var(--_ctm-dn-on-ve-gp-pr-se-sw-br, 4px))
2011
- )
2012
- var(
2013
- --_ctm-mob-dn-on-ve-gp-pr-se-sw-sd,
2014
- var(--_ctm-tab-dn-on-ve-gp-pr-se-sw-sd, var(--_ctm-dn-on-ve-gp-pr-se-sw-sd, 12px))
2015
- )
2016
- var(
2017
- --_ctm-mob-dn-on-ve-gp-pr-se-sw-cr,
2018
- var(
2019
- --_ctm-tab-dn-on-ve-gp-pr-se-sw-cr,
2020
- var(--_ctm-dn-on-ve-gp-pr-se-sw-cr, rgba(0, 0, 0, 0.15))
2021
- )
2022
- );
1238
+ gap: var(--_ctm-mob-dn-on-ve-gp-pr-se-im-gp,
1239
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-im-gp, var(--_ctm-dn-on-ve-gp-pr-se-im-gp, 4px)));
1240
+ background-color: var(--_ctm-mob-dn-on-ve-gp-pr-se-bd-cr,
1241
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-bd-cr, var(--_ctm-dn-on-ve-gp-pr-se-bd-cr, #fff)));
1242
+ border-color: var(--_ctm-mob-dn-on-ve-gp-pr-se-br-cr,
1243
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-br-cr, var(--_ctm-dn-on-ve-gp-pr-se-br-cr, #e5e7eb)));
1244
+ border-style: var(--_ctm-mob-dn-on-ve-gp-pr-se-br-se,
1245
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-br-se, var(--_ctm-dn-on-ve-gp-pr-se-br-se, solid)));
1246
+ border-width: var(--_ctm-mob-dn-on-ve-gp-pr-se-br-wh,
1247
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-br-wh, var(--_ctm-dn-on-ve-gp-pr-se-br-wh, 1px)));
1248
+ border-radius: var(--_ctm-mob-dn-on-ve-gp-pr-se-br-rs,
1249
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-br-rs, var(--_ctm-dn-on-ve-gp-pr-se-br-rs, 4px)));
1250
+ padding: var(--_ctm-mob-dn-on-ve-gp-pr-se-pg,
1251
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-pg, var(--_ctm-dn-on-ve-gp-pr-se-pg, 8px)));
1252
+ box-shadow: var(--_ctm-mob-dn-on-ve-gp-pr-se-sw-ae,
1253
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-sw-ae, var(--_ctm-dn-on-ve-gp-pr-se-sw-ae, 0px))) var(--_ctm-mob-dn-on-ve-gp-pr-se-sw-br,
1254
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-sw-br, var(--_ctm-dn-on-ve-gp-pr-se-sw-br, 4px))) var(--_ctm-mob-dn-on-ve-gp-pr-se-sw-sd,
1255
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-sw-sd, var(--_ctm-dn-on-ve-gp-pr-se-sw-sd, 12px))) var(--_ctm-mob-dn-on-ve-gp-pr-se-sw-cr,
1256
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-sw-cr,
1257
+ var(--_ctm-dn-on-ve-gp-pr-se-sw-cr, rgba(0, 0, 0, 0.15))));
2023
1258
 
2024
1259
  .popover-arrow {
2025
1260
  position: absolute;
@@ -2027,19 +1262,12 @@ $minWidth: 70px;
2027
1262
  left: 50%;
2028
1263
  width: 10px;
2029
1264
  height: 10px;
2030
- background-color: var(
2031
- --_ctm-mob-dn-on-ve-gp-pr-se-bd-cr,
2032
- var(--_ctm-tab-dn-on-ve-gp-pr-se-bd-cr, var(--_ctm-dn-on-ve-gp-pr-se-bd-cr, #fff))
2033
- );
1265
+ background-color: var(--_ctm-mob-dn-on-ve-gp-pr-se-bd-cr,
1266
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-bd-cr, var(--_ctm-dn-on-ve-gp-pr-se-bd-cr, #fff)));
2034
1267
  transform: translateX(-50%) rotate(45deg);
2035
- box-shadow: -1px -1px 0px
2036
- var(
2037
- --_ctm-mob-dn-on-ve-gp-pr-se-br-cr,
2038
- var(
2039
- --_ctm-tab-dn-on-ve-gp-pr-se-br-cr,
2040
- var(--_ctm-dn-on-ve-gp-pr-se-br-cr, #e5e7eb)
2041
- )
2042
- );
1268
+ box-shadow: -1px -1px 0px var(--_ctm-mob-dn-on-ve-gp-pr-se-br-cr,
1269
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-br-cr,
1270
+ var(--_ctm-dn-on-ve-gp-pr-se-br-cr, #e5e7eb)));
2043
1271
  }
2044
1272
 
2045
1273
  .popover_item {
@@ -2050,30 +1278,18 @@ $minWidth: 70px;
2050
1278
  white-space: normal;
2051
1279
  overflow-wrap: break-word;
2052
1280
  word-break: break-word;
2053
- color: var(
2054
- --_ctm-mob-dn-on-ve-gp-pr-se-cr,
2055
- var(--_ctm-tab-dn-on-ve-gp-pr-se-cr, var(--_ctm-dn-on-ve-gp-pr-se-cr, #1a1a2e))
2056
- );
2057
- font-size: var(
2058
- --_ctm-mob-dn-on-ve-gp-pr-se-ft-se,
2059
- var(--_ctm-tab-dn-on-ve-gp-pr-se-ft-se, var(--_ctm-dn-on-ve-gp-pr-se-ft-se, 12px))
2060
- );
2061
- font-weight: var(
2062
- --_ctm-mob-dn-on-ve-gp-pr-se-ft-wt,
2063
- var(--_ctm-tab-dn-on-ve-gp-pr-se-ft-wt, var(--_ctm-dn-on-ve-gp-pr-se-ft-wt, 400))
2064
- );
2065
- font-family: var(
2066
- --_ctm-mob-dn-on-ve-gp-pr-se-ft-fy,
2067
- var(--_ctm-tab-dn-on-ve-gp-pr-se-ft-fy, var(--_ctm-dn-on-ve-gp-pr-se-ft-fy))
2068
- );
2069
- text-transform: var(
2070
- --_ctm-mob-dn-on-ve-gp-pr-se-tt-tm,
2071
- var(--_ctm-tab-dn-on-ve-gp-pr-se-tt-tm, var(--_ctm-dn-on-ve-gp-pr-se-tt-tm))
2072
- );
2073
- word-wrap: var(
2074
- --_ctm-mob-dn-on-ve-gp-pr-se-wd-wp,
2075
- var(--_ctm-tab-dn-on-ve-gp-pr-se-wd-wp, var(--_ctm-dn-on-ve-gp-pr-se-wd-wp))
2076
- );
1281
+ color: var(--_ctm-mob-dn-on-ve-gp-pr-se-cr,
1282
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-cr, var(--_ctm-dn-on-ve-gp-pr-se-cr, #1a1a2e)));
1283
+ font-size: var(--_ctm-mob-dn-on-ve-gp-pr-se-ft-se,
1284
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-ft-se, var(--_ctm-dn-on-ve-gp-pr-se-ft-se, 12px)));
1285
+ font-weight: var(--_ctm-mob-dn-on-ve-gp-pr-se-ft-wt,
1286
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-ft-wt, var(--_ctm-dn-on-ve-gp-pr-se-ft-wt, 400)));
1287
+ font-family: var(--_ctm-mob-dn-on-ve-gp-pr-se-ft-fy,
1288
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-ft-fy, var(--_ctm-dn-on-ve-gp-pr-se-ft-fy)));
1289
+ text-transform: var(--_ctm-mob-dn-on-ve-gp-pr-se-tt-tm,
1290
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-tt-tm, var(--_ctm-dn-on-ve-gp-pr-se-tt-tm)));
1291
+ word-wrap: var(--_ctm-mob-dn-on-ve-gp-pr-se-wd-wp,
1292
+ var(--_ctm-tab-dn-on-ve-gp-pr-se-wd-wp, var(--_ctm-dn-on-ve-gp-pr-se-wd-wp)));
2077
1293
  }
2078
1294
  }
2079
1295
  }
@@ -2084,10 +1300,8 @@ $minWidth: 70px;
2084
1300
  color: var(--_gray-500);
2085
1301
  display: flex;
2086
1302
  flex-direction: column;
2087
- gap: var(
2088
- --_ctm-mob-lt-on-te-ve-sg,
2089
- var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
2090
- );
1303
+ gap: var(--_ctm-mob-lt-on-te-ve-sg,
1304
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg)));
2091
1305
 
2092
1306
  // padding: var(
2093
1307
  // --_ctm-mob-lt-se-st-dy-se-im-pg,
@@ -2100,119 +1314,72 @@ $minWidth: 70px;
2100
1314
  flex-wrap: wrap;
2101
1315
  margin-bottom: 10px;
2102
1316
  flex-direction: row;
2103
- gap: var(
2104
- --_ctm-mob-lt-se-st-dy-se-im-sg,
2105
- var(--_ctm-tab-lt-se-st-dy-se-im-sg, var(--_ctm-lt-se-st-dy-se-im-sg))
2106
- );
1317
+ gap: var(--_ctm-mob-lt-se-st-dy-se-im-sg,
1318
+ var(--_ctm-tab-lt-se-st-dy-se-im-sg, var(--_ctm-lt-se-st-dy-se-im-sg)));
2107
1319
 
2108
1320
  &[data-single-dispaly="Vertically"] {
2109
1321
  flex-direction: column;
2110
1322
  }
1323
+
2111
1324
  &[data-single-overflow="Scroll"] {
2112
1325
  overflow-x: auto;
2113
1326
  overflow-y: hidden;
2114
1327
  flex-wrap: nowrap;
2115
1328
  }
1329
+
2116
1330
  &[data-swatch-overflow="Scroll"] {
2117
1331
  overflow-x: auto;
2118
1332
  flex-wrap: nowrap;
2119
1333
  overflow-y: hidden;
2120
1334
  }
1335
+
2121
1336
  .show_more_button {
2122
- background-color: var(
2123
- --_ctm-mob-dn-sw-me-is-bn-bd-cr,
2124
- var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr))
2125
- );
2126
- font-family: var(
2127
- --_ctm-mob-dn-sw-me-is-bn-ft-fy,
2128
- var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy))
2129
- );
2130
- text-transform: var(
2131
- --_ctm-mob-dn-sw-me-is-bn-tt-tm,
2132
- var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm))
2133
- );
2134
- word-wrap: var(
2135
- --_ctm-mob-dn-sw-me-is-bn-wd-wp,
2136
- var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp))
2137
- );
2138
- word-break: var(
2139
- --_ctm-mob-dn-sw-me-is-bn-wd-bk,
2140
- var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk))
2141
- );
2142
- border-color: var(
2143
- --_ctm-mob-dn-sw-me-is-bn-br-cr,
2144
- var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr))
2145
- );
2146
- border-radius: var(
2147
- --_ctm-mob-dn-sw-me-is-bn-br-rs,
2148
- var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs))
2149
- );
2150
- border-style: var(
2151
- --_ctm-mob-dn-sw-me-is-bn-br-se,
2152
- var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se))
2153
- );
2154
- border-width: var(
2155
- --_ctm-mob-dn-sw-me-is-bn-br-wh,
2156
- var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh))
2157
- );
2158
- font-size: var(
2159
- --_ctm-mob-dn-sw-me-is-bn-ft-se,
2160
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se))
2161
- );
2162
- font-style: var(
2163
- --_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
2164
- var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic))
2165
- );
2166
- font-weight: var(
2167
- --_ctm-mob-dn-sw-me-is-bn-ft-wt,
2168
- var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt))
2169
- );
2170
- line-height: var(
2171
- --_ctm-mob-dn-sw-me-is-bn-le-ht,
2172
- var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht))
2173
- );
2174
- letter-spacing: var(
2175
- --_ctm-mob-dn-sw-me-is-bn-lr-sg,
2176
- var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg))
2177
- );
2178
- box-shadow: var(
2179
- --_ctm-mob-dn-sw-me-is-bn-sw-ae,
2180
- var(--_ctm-tab-dn-sw-me-is-bn-sw-ae, var(--_ctm-dn-sw-me-is-bn-sw-ae))
2181
- )
2182
- var(
2183
- --_ctm-mob-dn-sw-me-is-bn-sw-br,
2184
- var(--_ctm-tab-dn-sw-me-is-bn-sw-br, var(--_ctm-dn-sw-me-is-bn-sw-br))
2185
- )
2186
- var(
2187
- --_ctm-mob-dn-sw-me-is-bn-sw-sd,
2188
- var(--_ctm-tab-dn-sw-me-is-bn-sw-sd, var(--_ctm-dn-sw-me-is-bn-sw-sd))
2189
- )
2190
- var(
2191
- --_ctm-mob-dn-sw-me-is-bn-sw-cr,
2192
- var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr))
2193
- );
2194
- text-align: var(
2195
- --_ctm-mob-dn-sw-me-is-bn-tt-an,
2196
- var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an))
2197
- );
2198
- color: var(
2199
- --_ctm-mob-dn-sw-me-is-bn-tt-cr,
2200
- var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr))
2201
- );
2202
- text-decoration: var(
2203
- --_ctm-mob-dn-sw-me-is-bn-ue,
2204
- var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue))
2205
- );
1337
+ background-color: var(--_ctm-mob-dn-sw-me-is-bn-bd-cr,
1338
+ var(--_ctm-tab-dn-sw-me-is-bn-bd-cr, var(--_ctm-dn-sw-me-is-bn-bd-cr)));
1339
+ font-family: var(--_ctm-mob-dn-sw-me-is-bn-ft-fy,
1340
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-fy, var(--_ctm-dn-sw-me-is-bn-ft-fy)));
1341
+ text-transform: var(--_ctm-mob-dn-sw-me-is-bn-tt-tm,
1342
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-tm, var(--_ctm-dn-sw-me-is-bn-tt-tm)));
1343
+ word-wrap: var(--_ctm-mob-dn-sw-me-is-bn-wd-wp,
1344
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-wp, var(--_ctm-dn-sw-me-is-bn-wd-wp)));
1345
+ word-break: var(--_ctm-mob-dn-sw-me-is-bn-wd-bk,
1346
+ var(--_ctm-tab-dn-sw-me-is-bn-wd-bk, var(--_ctm-dn-sw-me-is-bn-wd-bk)));
1347
+ border-color: var(--_ctm-mob-dn-sw-me-is-bn-br-cr,
1348
+ var(--_ctm-tab-dn-sw-me-is-bn-br-cr, var(--_ctm-dn-sw-me-is-bn-br-cr)));
1349
+ border-radius: var(--_ctm-mob-dn-sw-me-is-bn-br-rs,
1350
+ var(--_ctm-tab-dn-sw-me-is-bn-br-rs, var(--_ctm-dn-sw-me-is-bn-br-rs)));
1351
+ border-style: var(--_ctm-mob-dn-sw-me-is-bn-br-se,
1352
+ var(--_ctm-tab-dn-sw-me-is-bn-br-se, var(--_ctm-dn-sw-me-is-bn-br-se)));
1353
+ border-width: var(--_ctm-mob-dn-sw-me-is-bn-br-wh,
1354
+ var(--_ctm-tab-dn-sw-me-is-bn-br-wh, var(--_ctm-dn-sw-me-is-bn-br-wh)));
1355
+ font-size: var(--_ctm-mob-dn-sw-me-is-bn-ft-se,
1356
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se, var(--_ctm-dn-sw-me-is-bn-ft-se)));
1357
+ font-style: var(--_ctm-mob-dn-sw-me-is-bn-ft-se-ic,
1358
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-se-ic, var(--_ctm-dn-sw-me-is-bn-ft-se-ic)));
1359
+ font-weight: var(--_ctm-mob-dn-sw-me-is-bn-ft-wt,
1360
+ var(--_ctm-tab-dn-sw-me-is-bn-ft-wt, var(--_ctm-dn-sw-me-is-bn-ft-wt)));
1361
+ line-height: var(--_ctm-mob-dn-sw-me-is-bn-le-ht,
1362
+ var(--_ctm-tab-dn-sw-me-is-bn-le-ht, var(--_ctm-dn-sw-me-is-bn-le-ht)));
1363
+ letter-spacing: var(--_ctm-mob-dn-sw-me-is-bn-lr-sg,
1364
+ var(--_ctm-tab-dn-sw-me-is-bn-lr-sg, var(--_ctm-dn-sw-me-is-bn-lr-sg)));
1365
+ box-shadow: var(--_ctm-mob-dn-sw-me-is-bn-sw-ae,
1366
+ 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,
1367
+ 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,
1368
+ 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,
1369
+ var(--_ctm-tab-dn-sw-me-is-bn-sw-cr, var(--_ctm-dn-sw-me-is-bn-sw-cr)));
1370
+ text-align: var(--_ctm-mob-dn-sw-me-is-bn-tt-an,
1371
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-an, var(--_ctm-dn-sw-me-is-bn-tt-an)));
1372
+ color: var(--_ctm-mob-dn-sw-me-is-bn-tt-cr,
1373
+ var(--_ctm-tab-dn-sw-me-is-bn-tt-cr, var(--_ctm-dn-sw-me-is-bn-tt-cr)));
1374
+ text-decoration: var(--_ctm-mob-dn-sw-me-is-bn-ue,
1375
+ var(--_ctm-tab-dn-sw-me-is-bn-ue, var(--_ctm-dn-sw-me-is-bn-ue)));
2206
1376
  }
1377
+
2207
1378
  &[data-single-dispaly="Grid"] {
2208
1379
  display: grid;
2209
- grid-template-columns: repeat(
2210
- var(
2211
- --_ctm-mob-lt-se-st-dy-se-is-pr-rw,
2212
- var(--_ctm-tab-lt-se-st-dy-se-is-pr-rw, var(--_ctm-lt-se-st-dy-se-is-pr-rw))
2213
- ),
2214
- minmax(auto, 1fr)
2215
- );
1380
+ grid-template-columns: repeat(var(--_ctm-mob-lt-se-st-dy-se-is-pr-rw,
1381
+ var(--_ctm-tab-lt-se-st-dy-se-is-pr-rw, var(--_ctm-lt-se-st-dy-se-is-pr-rw))),
1382
+ minmax(auto, 1fr));
2216
1383
  }
2217
1384
 
2218
1385
  .select__group__item {
@@ -2230,194 +1397,117 @@ $minWidth: 70px;
2230
1397
  min-width: 20px;
2231
1398
  min-height: 20px;
2232
1399
  box-sizing: content-box;
2233
- border-radius: var(
2234
- --_ctm-mob-dn-se-on-ve-se-dt-se-br-rs,
2235
- var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-rs, var(--_ctm-dn-se-on-ve-se-dt-se-br-rs))
2236
- );
2237
-
2238
- border-color: var(
2239
- --_sf-hr-br-cr,
2240
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr)
2241
- );
2242
-
2243
- background-color: var(
2244
- --_sf-hr-bd-cr,
2245
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr)
2246
- );
2247
- border-style: var(
2248
- --_sf-hr-br-se,
2249
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se)
2250
- );
2251
- border-width: var(
2252
- --_sf-hr-br-wh,
2253
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh)
2254
- );
2255
-
2256
- box-shadow: var(
2257
- --_sf-hr-sw-ae,
2258
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-ae)
2259
- )
2260
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-br))
2261
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-sd))
2262
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-cr));
1400
+ border-radius: var(--_ctm-mob-dn-se-on-ve-se-dt-se-br-rs,
1401
+ var(--_ctm-tab-dn-se-on-ve-se-dt-se-br-rs, var(--_ctm-dn-se-on-ve-se-dt-se-br-rs)));
1402
+
1403
+ border-color: var(--_sf-hr-br-cr,
1404
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr));
1405
+
1406
+ background-color: var(--_sf-hr-bd-cr,
1407
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr));
1408
+ border-style: var(--_sf-hr-br-se,
1409
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se));
1410
+ border-width: var(--_sf-hr-br-wh,
1411
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh));
1412
+
1413
+ box-shadow: var(--_sf-hr-sw-ae,
1414
+ 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));
2263
1415
 
2264
1416
  // font is pending
2265
1417
 
2266
1418
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-cr));
2267
- font-family: var(
2268
- --_sf-hr-ft-fy,
2269
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)
2270
- );
2271
- text-transform: var(
2272
- --_sf-hr-tt-tm,
2273
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm)
2274
- );
2275
- word-wrap: var(
2276
- --_sf-hr-wd-wp,
2277
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp)
2278
- );
2279
- word-break: var(
2280
- --_sf-hr-wd-bk,
2281
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk)
2282
- );
1419
+ font-family: var(--_sf-hr-ft-fy,
1420
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy));
1421
+ text-transform: var(--_sf-hr-tt-tm,
1422
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm));
1423
+ word-wrap: var(--_sf-hr-wd-wp,
1424
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp));
1425
+ word-break: var(--_sf-hr-wd-bk,
1426
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk));
1427
+
2283
1428
  &.flex__overflow {
2284
1429
  white-space: normal;
2285
1430
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2286
1431
  }
2287
- font-size: var(
2288
- --_sf-hr-ft-se,
2289
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se)
2290
- );
2291
- font-weight: var(
2292
- --_sf-hr-ft-wt,
2293
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt)
2294
- );
2295
- font-style: var(
2296
- --_sf-hr-ft-se-ic,
2297
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic)
2298
- );
2299
- text-align: var(
2300
- --_sf-hr-tt-an,
2301
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an)
2302
- );
2303
- letter-spacing: var(
2304
- --_sf-hr-lr-sg,
2305
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg)
2306
- );
2307
- line-height: var(
2308
- --_sf-hr-le-ht,
2309
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht)
2310
- );
2311
- text-decoration: var(
2312
- --_sf-hr-ue,
2313
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue)
2314
- );
1432
+
1433
+ font-size: var(--_sf-hr-ft-se,
1434
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se));
1435
+ font-weight: var(--_sf-hr-ft-wt,
1436
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt));
1437
+ font-style: var(--_sf-hr-ft-se-ic,
1438
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic));
1439
+ text-align: var(--_sf-hr-tt-an,
1440
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an));
1441
+ letter-spacing: var(--_sf-hr-lr-sg,
1442
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg));
1443
+ line-height: var(--_sf-hr-le-ht,
1444
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht));
1445
+ text-decoration: var(--_sf-hr-ue,
1446
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue));
2315
1447
 
2316
1448
  &[data-background-shape="circle"] {
2317
1449
  border-radius: 50%;
2318
1450
  }
1451
+
2319
1452
  // &[data-background-shape="square"] {
2320
1453
  // border-radius: 5px;
2321
1454
  // }
2322
1455
  &[data-background-shape="capsule"] {
2323
- border-radius: 40px; /* Full pill shape */
1456
+ border-radius: 40px;
1457
+ /* Full pill shape */
2324
1458
  box-sizing: border-box;
2325
1459
  }
2326
1460
 
2327
1461
  &:hover {
2328
- --_sf-hr-bd-cr: var(
2329
- --_ctm-mob-dn-se-on-ve-se-hr-se-bd-cr,
2330
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-se-on-ve-se-hr-se-bd-cr))
2331
- );
2332
- --_sf-hr-br-cr: var(
2333
- --_ctm-mob-dn-se-on-ve-se-hr-se-br-cr,
2334
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-cr, var(--_ctm-dn-se-on-ve-se-hr-se-br-cr))
2335
- );
2336
- --_sf-hr-br-se: var(
2337
- --_ctm-mob-dn-se-on-ve-se-hr-se-br-se,
2338
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-se, var(--_ctm-dn-se-on-ve-se-hr-se-br-se))
2339
- );
2340
- --_sf-hr-br-wh: var(
2341
- --_ctm-mob-dn-se-on-ve-se-hr-se-br-wh,
2342
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-wh, var(--_ctm-dn-se-on-ve-se-hr-se-br-wh))
2343
- );
2344
- --_sf-hr-br-bs: var(
2345
- --_ctm-mob-dn-se-on-ve-se-hr-se-br-rs,
2346
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-rs, var(--_ctm-dn-se-on-ve-se-hr-se-br-rs))
2347
- );
1462
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-bd-cr,
1463
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-bd-cr, var(--_ctm-dn-se-on-ve-se-hr-se-bd-cr)));
1464
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-cr,
1465
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-cr, var(--_ctm-dn-se-on-ve-se-hr-se-br-cr)));
1466
+ --_sf-hr-br-se: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-se,
1467
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-se, var(--_ctm-dn-se-on-ve-se-hr-se-br-se)));
1468
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-wh,
1469
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-wh, var(--_ctm-dn-se-on-ve-se-hr-se-br-wh)));
1470
+ --_sf-hr-br-bs: var(--_ctm-mob-dn-se-on-ve-se-hr-se-br-rs,
1471
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-br-rs, var(--_ctm-dn-se-on-ve-se-hr-se-br-rs)));
2348
1472
 
2349
1473
  // new
2350
- --_sf-hr-sw-ae: var(
2351
- --_ctm-mob-dn-se-on-ve-se-hr-se-sw-ae,
2352
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-se-on-ve-se-hr-se-sw-ae))
2353
- );
2354
- --_sf-hr-sw-br: var(
2355
- --_ctm-mob-dn-se-on-ve-se-hr-se-sw-br,
2356
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-br, var(--_ctm-dn-se-on-ve-se-hr-se-sw-br))
2357
- );
2358
- --_sf-hr-sw-hr: var(
2359
- --_ctm-mob-dn-se-on-ve-se-hr-se-sw-hr,
2360
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-hr))
2361
- );
2362
- --_sf-hr-sw-cr: var(
2363
- --_ctm-mob-dn-se-on-ve-se-hr-se-sw-cr,
2364
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-cr))
2365
- );
1474
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-ae,
1475
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-ae, var(--_ctm-dn-se-on-ve-se-hr-se-sw-ae)));
1476
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-br,
1477
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-br, var(--_ctm-dn-se-on-ve-se-hr-se-sw-br)));
1478
+ --_sf-hr-sw-hr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-hr,
1479
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-hr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-hr)));
1480
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-sw-cr,
1481
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-sw-cr, var(--_ctm-dn-se-on-ve-se-hr-se-sw-cr)));
2366
1482
 
2367
1483
  // for font
2368
1484
 
2369
- --_sf-hr-cr: var(
2370
- --_ctm-mob-dn-se-on-ve-se-hr-se-cr,
2371
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-cr, var(--_ctm-dn-se-on-ve-se-hr-se-cr))
2372
- );
2373
- --_sf-hr-ft-fy: var(
2374
- --_ctm-mob-dn-se-on-ve-se-hr-se-ft-fy,
2375
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-fy, var(--_ctm-dn-se-on-ve-se-hr-se-ft-fy))
2376
- );
2377
- --_sf-hr-tt-tm: var(
2378
- --_ctm-mob-dn-se-on-ve-se-hr-se-tt-tm,
2379
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-tm, var(--_ctm-dn-se-on-ve-se-hr-se-tt-tm))
2380
- );
2381
- --_sf-hr-wd-wp: var(
2382
- --_ctm-mob-dn-se-on-ve-se-hr-se-wd-wp,
2383
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-wp, var(--_ctm-dn-se-on-ve-se-hr-se-wd-wp))
2384
- );
2385
- --_sf-hr-wd-bk: var(
2386
- --_ctm-mob-dn-se-on-ve-se-hr-se-wd-bk,
2387
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-bk, var(--_ctm-dn-se-on-ve-se-hr-se-wd-bk))
2388
- );
2389
- --_sf-hr-ft-se: var(
2390
- --_ctm-mob-dn-se-on-ve-se-hr-se-ft-se,
2391
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-se, var(--_ctm-dn-se-on-ve-se-hr-se-ft-se))
2392
- );
2393
- --_sf-hr-ft-wt: var(
2394
- --_ctm-mob-dn-se-on-ve-se-hr-se-ft-wt,
2395
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-wt, var(--_ctm-dn-se-on-ve-se-hr-se-ft-wt))
2396
- );
2397
- --_sf-hr-ft-se-ic: var(
2398
- --_ctm-mob-dn-se-on-ve-se-hr-se-ft-se-ic,
2399
- var(
2400
- --_ctm-tab-dn-se-on-ve-se-hr-se-ft-se-ic,
2401
- var(--_ctm-dn-se-on-ve-se-hr-se-ft-se-ic)
2402
- )
2403
- );
2404
- --_sf-hr-tt-an: var(
2405
- --_ctm-mob-dn-se-on-ve-se-hr-se-tt-an,
2406
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-an, var(--_ctm-dn-se-on-ve-se-hr-se-tt-an))
2407
- );
2408
- --_sf-hr-lr-sg: var(
2409
- --_ctm-mob-dn-se-on-ve-se-hr-se-lr-sg,
2410
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-lr-sg, var(--_ctm-dn-se-on-ve-se-hr-se-lr-sg))
2411
- );
2412
- --_sf-hr-le-ht: var(
2413
- --_ctm-mob-dn-se-on-ve-se-hr-se-le-ht,
2414
- var(--_ctm-tab-dn-se-on-ve-se-hr-se-le-ht, var(--_ctm-dn-se-on-ve-se-hr-se-le-ht))
2415
- );
2416
-
2417
- --_sf-hr-ue: var(
2418
- --_ctm-mob-dn-on-ve-se-hr-se-ue,
2419
- var(--_ctm-tab-dn-on-ve-se-hr-se-ue, var(--_ctm-dn-on-ve-se-hr-se-ue))
2420
- );
1485
+ --_sf-hr-cr: var(--_ctm-mob-dn-se-on-ve-se-hr-se-cr,
1486
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-cr, var(--_ctm-dn-se-on-ve-se-hr-se-cr)));
1487
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-fy,
1488
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-fy, var(--_ctm-dn-se-on-ve-se-hr-se-ft-fy)));
1489
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-se-on-ve-se-hr-se-tt-tm,
1490
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-tm, var(--_ctm-dn-se-on-ve-se-hr-se-tt-tm)));
1491
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-se-on-ve-se-hr-se-wd-wp,
1492
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-wp, var(--_ctm-dn-se-on-ve-se-hr-se-wd-wp)));
1493
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-se-on-ve-se-hr-se-wd-bk,
1494
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-wd-bk, var(--_ctm-dn-se-on-ve-se-hr-se-wd-bk)));
1495
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-se,
1496
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-se, var(--_ctm-dn-se-on-ve-se-hr-se-ft-se)));
1497
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-wt,
1498
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-wt, var(--_ctm-dn-se-on-ve-se-hr-se-ft-wt)));
1499
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-se-on-ve-se-hr-se-ft-se-ic,
1500
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-ft-se-ic,
1501
+ var(--_ctm-dn-se-on-ve-se-hr-se-ft-se-ic)));
1502
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-se-on-ve-se-hr-se-tt-an,
1503
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-tt-an, var(--_ctm-dn-se-on-ve-se-hr-se-tt-an)));
1504
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-se-on-ve-se-hr-se-lr-sg,
1505
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-lr-sg, var(--_ctm-dn-se-on-ve-se-hr-se-lr-sg)));
1506
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-se-on-ve-se-hr-se-le-ht,
1507
+ var(--_ctm-tab-dn-se-on-ve-se-hr-se-le-ht, var(--_ctm-dn-se-on-ve-se-hr-se-le-ht)));
1508
+
1509
+ --_sf-hr-ue: var(--_ctm-mob-dn-on-ve-se-hr-se-ue,
1510
+ var(--_ctm-tab-dn-on-ve-se-hr-se-ue, var(--_ctm-dn-on-ve-se-hr-se-ue)));
2421
1511
  }
2422
1512
 
2423
1513
  &.child {
@@ -2425,179 +1515,102 @@ $minWidth: 70px;
2425
1515
  border-radius: 0;
2426
1516
  border-bottom: 2px solid var(--_gray-200);
2427
1517
  }
1518
+
2428
1519
  &[data-selected="true"] {
2429
- --_sf-sd-bd-cr: var(
2430
- --_ctm-mob-dn-se-on-ve-se-sd-se-bd-cr,
2431
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-se-on-ve-se-sd-se-bd-cr))
2432
- );
2433
- --_sf-sd-br-cr: var(
2434
- --_ctm-mob-dn-se-on-ve-se-sd-se-br-cr,
2435
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-cr, var(--_ctm-dn-se-on-ve-se-sd-se-br-cr))
2436
- );
2437
- --_sf-sd-br-se: var(
2438
- --_ctm-mob-dn-se-on-ve-se-sd-se-br-se,
2439
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-se, var(--_ctm-dn-se-on-ve-se-sd-se-br-se))
2440
- );
2441
- --_sf-sd-br-wh: var(
2442
- --_ctm-mob-dn-se-on-ve-se-sd-se-br-wh,
2443
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-wh, var(--_ctm-dn-se-on-ve-se-sd-se-br-wh))
2444
- );
2445
- --_sf-sd-br-bs: var(
2446
- --_ctm-mob-dn-se-on-ve-se-sd-se-br-rs,
2447
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-rs, var(--_ctm-dn-se-on-ve-se-sd-se-br-rs))
2448
- );
1520
+ --_sf-sd-bd-cr: var(--_ctm-mob-dn-se-on-ve-se-sd-se-bd-cr,
1521
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-bd-cr, var(--_ctm-dn-se-on-ve-se-sd-se-bd-cr)));
1522
+ --_sf-sd-br-cr: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-cr,
1523
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-cr, var(--_ctm-dn-se-on-ve-se-sd-se-br-cr)));
1524
+ --_sf-sd-br-se: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-se,
1525
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-se, var(--_ctm-dn-se-on-ve-se-sd-se-br-se)));
1526
+ --_sf-sd-br-wh: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-wh,
1527
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-wh, var(--_ctm-dn-se-on-ve-se-sd-se-br-wh)));
1528
+ --_sf-sd-br-bs: var(--_ctm-mob-dn-se-on-ve-se-sd-se-br-rs,
1529
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-br-rs, var(--_ctm-dn-se-on-ve-se-sd-se-br-rs)));
2449
1530
 
2450
1531
  // new
2451
- --_sf-sd-sw-ae: var(
2452
- --_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
2453
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-se-on-ve-se-sd-se-sw-ae))
2454
- );
2455
- --_sf-sd-sw-br: var(
2456
- --_ctm-mob-dn-on-ve-se-sd-se-sw-br,
2457
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-br, var(--_ctm-dn-se-on-ve-se-sd-se-sw-br))
2458
- );
2459
- --_sf-sd-sw-hr: var(
2460
- --_ctm-mob-dn-on-ve-se-sd-se-sw-hr,
2461
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-hr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-hr))
2462
- );
2463
- --_sf-sd-sw-cr: var(
2464
- --_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
2465
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-cr))
2466
- );
1532
+ --_sf-sd-sw-ae: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-ae,
1533
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-ae, var(--_ctm-dn-se-on-ve-se-sd-se-sw-ae)));
1534
+ --_sf-sd-sw-br: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-br,
1535
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-br, var(--_ctm-dn-se-on-ve-se-sd-se-sw-br)));
1536
+ --_sf-sd-sw-hr: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-hr,
1537
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-hr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-hr)));
1538
+ --_sf-sd-sw-cr: var(--_ctm-mob-dn-on-ve-se-sd-se-sw-cr,
1539
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-sw-cr, var(--_ctm-dn-se-on-ve-se-sd-se-sw-cr)));
2467
1540
 
2468
1541
  // for font
2469
1542
 
2470
- --_sf-sd-cr: var(
2471
- --_ctm-mob-dn-se-on-ve-se-sd-se-cr,
2472
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-cr, var(--_ctm-dn-se-on-ve-se-sd-se-cr))
2473
- );
2474
- --_sf-sd-ft-fy: var(
2475
- --_ctm-mob-dn-se-on-ve-se-sd-se-ft-fy,
2476
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-fy, var(--_ctm-dn-se-on-ve-se-sd-se-ft-fy))
2477
- );
2478
- --_sf-sd-tt-tm: var(
2479
- --_ctm-mob-dn-se-on-ve-se-sd-se-tt-tm,
2480
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-tm, var(--_ctm-dn-se-on-ve-se-sd-se-tt-tm))
2481
- );
2482
- --_sf-sd-wd-wp: var(
2483
- --_ctm-mob-dn-se-on-ve-se-sd-se-wd-wp,
2484
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-wp, var(--_ctm-dn-se-on-ve-se-sd-se-wd-wp))
2485
- );
2486
- --_sf-sd-wd-bk: var(
2487
- --_ctm-mob-dn-se-on-ve-se-sd-se-wd-bk,
2488
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-bk, var(--_ctm-dn-se-on-ve-se-sd-se-wd-bk))
2489
- );
2490
- --_sf-sd-ft-se: var(
2491
- --_ctm-mob-dn-se-on-ve-se-sd-se-ft-se,
2492
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-se, var(--_ctm-dn-se-on-ve-se-sd-se-ft-se))
2493
- );
2494
- --_sf-sd-ft-wt: var(
2495
- --_ctm-mob-dn-se-on-ve-se-sd-se-ft-wt,
2496
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-wt, var(--_ctm-dn-se-on-ve-se-sd-se-ft-wt))
2497
- );
2498
- --_sf-sd-ft-se-ic: var(
2499
- --_ctm-mob-dn-se-on-ve-se-sd-se-ft-se-ic,
2500
- var(
2501
- --_ctm-tab-dn-se-on-ve-se-sd-se-ft-se-ic,
2502
- var(--_ctm-dn-se-on-ve-se-sd-se-ft-se-ic)
2503
- )
2504
- );
2505
- --_sf-sd-tt-an: var(
2506
- --_ctm-mob-dn-se-on-ve-se-sd-se-tt-an,
2507
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-an, var(--_ctm-dn-se-on-ve-se-sd-se-tt-an))
2508
- );
2509
- --_sf-sd-lr-sg: var(
2510
- --_ctm-mob-dn-se-on-ve-se-sd-se-lr-sg,
2511
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-lr-sg, var(--_ctm-dn-se-on-ve-se-sd-se-lr-sg))
2512
- );
2513
- --_sf-sd-le-ht: var(
2514
- --_ctm-mob-dn-se-on-ve-se-sd-se-le-ht,
2515
- var(--_ctm-tab-dn-se-on-ve-se-sd-se-le-ht, var(--_ctm-dn-se-on-ve-se-sd-se-le-ht))
2516
- );
2517
-
2518
- --_sf-sd-ue: var(
2519
- --_ctm-mob-dn-on-ve-se-sd-se-ue,
2520
- var(--_ctm-tab-dn-on-ve-se-sd-se-ue, var(--_ctm-dn-on-ve-se-sd-se-ue))
2521
- );
2522
-
2523
- border-color: var(
2524
- --_sf-sd-br-cr,
2525
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr)
2526
- );
2527
-
2528
- background-color: var(
2529
- --_sf-sd-bd-cr,
2530
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr)
2531
- );
2532
- border-style: var(
2533
- --_sf-sd-br-se,
2534
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se)
2535
- );
2536
- border-width: var(
2537
- --_sf-sd-br-wh,
2538
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh)
2539
- );
2540
-
2541
- box-shadow: var(
2542
- --_sf-sd-sw-ae,
2543
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-ae)
2544
- )
2545
- var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-br))
2546
- var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-sd))
2547
- var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-sw-cr));
1543
+ --_sf-sd-cr: var(--_ctm-mob-dn-se-on-ve-se-sd-se-cr,
1544
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-cr, var(--_ctm-dn-se-on-ve-se-sd-se-cr)));
1545
+ --_sf-sd-ft-fy: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-fy,
1546
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-fy, var(--_ctm-dn-se-on-ve-se-sd-se-ft-fy)));
1547
+ --_sf-sd-tt-tm: var(--_ctm-mob-dn-se-on-ve-se-sd-se-tt-tm,
1548
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-tm, var(--_ctm-dn-se-on-ve-se-sd-se-tt-tm)));
1549
+ --_sf-sd-wd-wp: var(--_ctm-mob-dn-se-on-ve-se-sd-se-wd-wp,
1550
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-wp, var(--_ctm-dn-se-on-ve-se-sd-se-wd-wp)));
1551
+ --_sf-sd-wd-bk: var(--_ctm-mob-dn-se-on-ve-se-sd-se-wd-bk,
1552
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-wd-bk, var(--_ctm-dn-se-on-ve-se-sd-se-wd-bk)));
1553
+ --_sf-sd-ft-se: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-se,
1554
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-se, var(--_ctm-dn-se-on-ve-se-sd-se-ft-se)));
1555
+ --_sf-sd-ft-wt: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-wt,
1556
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-wt, var(--_ctm-dn-se-on-ve-se-sd-se-ft-wt)));
1557
+ --_sf-sd-ft-se-ic: var(--_ctm-mob-dn-se-on-ve-se-sd-se-ft-se-ic,
1558
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-ft-se-ic,
1559
+ var(--_ctm-dn-se-on-ve-se-sd-se-ft-se-ic)));
1560
+ --_sf-sd-tt-an: var(--_ctm-mob-dn-se-on-ve-se-sd-se-tt-an,
1561
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-tt-an, var(--_ctm-dn-se-on-ve-se-sd-se-tt-an)));
1562
+ --_sf-sd-lr-sg: var(--_ctm-mob-dn-se-on-ve-se-sd-se-lr-sg,
1563
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-lr-sg, var(--_ctm-dn-se-on-ve-se-sd-se-lr-sg)));
1564
+ --_sf-sd-le-ht: var(--_ctm-mob-dn-se-on-ve-se-sd-se-le-ht,
1565
+ var(--_ctm-tab-dn-se-on-ve-se-sd-se-le-ht, var(--_ctm-dn-se-on-ve-se-sd-se-le-ht)));
1566
+
1567
+ --_sf-sd-ue: var(--_ctm-mob-dn-on-ve-se-sd-se-ue,
1568
+ var(--_ctm-tab-dn-on-ve-se-sd-se-ue, var(--_ctm-dn-on-ve-se-sd-se-ue)));
1569
+
1570
+ border-color: var(--_sf-sd-br-cr,
1571
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-cr));
1572
+
1573
+ background-color: var(--_sf-sd-bd-cr,
1574
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-bd-cr));
1575
+ border-style: var(--_sf-sd-br-se,
1576
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-se));
1577
+ border-width: var(--_sf-sd-br-wh,
1578
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-br-wh));
1579
+
1580
+ box-shadow: var(--_sf-sd-sw-ae,
1581
+ 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));
2548
1582
  // font is pending
2549
1583
 
2550
1584
  color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-cr));
2551
- font-family: var(
2552
- --_sf-sd-ft-fy,
2553
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy)
2554
- );
2555
- text-transform: var(
2556
- --_sf-sd-tt-tm,
2557
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm)
2558
- );
2559
- word-wrap: var(
2560
- --_sf-sd-wd-wp,
2561
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp)
2562
- );
2563
- word-break: var(
2564
- --_sf-sd-wd-bk,
2565
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk)
2566
- );
2567
- font-size: var(
2568
- --_sf-sd-ft-se,
2569
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se)
2570
- );
2571
- font-weight: var(
2572
- --_sf-sd-ft-wt,
2573
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt)
2574
- );
2575
- font-style: var(
2576
- --_sf-sd-ft-se-ic,
2577
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic)
2578
- );
2579
- text-align: var(
2580
- --_sf-sd-tt-an,
2581
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an)
2582
- );
2583
- letter-spacing: var(
2584
- --_sf-sd-lr-sg,
2585
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg)
2586
- );
2587
- line-height: var(
2588
- --_sf-sd-le-ht,
2589
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht-dc)
2590
- );
2591
- text-decoration: var(
2592
- --_sf-sd-ue,
2593
- prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue)
2594
- );
1585
+ font-family: var(--_sf-sd-ft-fy,
1586
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-fy));
1587
+ text-transform: var(--_sf-sd-tt-tm,
1588
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-tm));
1589
+ word-wrap: var(--_sf-sd-wd-wp,
1590
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-wp));
1591
+ word-break: var(--_sf-sd-wd-bk,
1592
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-wd-bk));
1593
+ font-size: var(--_sf-sd-ft-se,
1594
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se));
1595
+ font-weight: var(--_sf-sd-ft-wt,
1596
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-wt));
1597
+ font-style: var(--_sf-sd-ft-se-ic,
1598
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ft-se-ic));
1599
+ text-align: var(--_sf-sd-tt-an,
1600
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-tt-an));
1601
+ letter-spacing: var(--_sf-sd-lr-sg,
1602
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-lr-sg));
1603
+ line-height: var(--_sf-sd-le-ht,
1604
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-le-ht-dc));
1605
+ text-decoration: var(--_sf-sd-ue,
1606
+ prepareMediaVariable(--_ctm-dn-se-on-ve-se-dt-se-ue));
2595
1607
  }
2596
1608
 
2597
1609
  &.selected__child {
2598
1610
  border: 0px;
2599
1611
  border-bottom: 2px solid var(--_primary-400);
2600
1612
  }
1613
+
2601
1614
  // &.disabled {
2602
1615
  // cursor: not-allowed;
2603
1616
  // opacity: 0.4;
@@ -2650,6 +1663,7 @@ $minWidth: 70px;
2650
1663
  }
2651
1664
  }
2652
1665
  }
1666
+
2653
1667
  // &[data-show-divider="true"] {
2654
1668
  // &:not(:last-child)::after {
2655
1669
  // content: "";
@@ -2669,234 +1683,127 @@ $minWidth: 70px;
2669
1683
 
2670
1684
  .title {
2671
1685
  color: var(--_ctm-mob-dn-on-te-cr, var(--_ctm-tab-dn-on-te-cr, var(--_ctm-dn-on-te-cr)));
2672
- font-family: var(
2673
- --_ctm-mob-dn-on-te-ft-fy,
2674
- var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy))
2675
- );
2676
- text-transform: var(
2677
- --_ctm-mob-dn-on-te-tt-tm,
2678
- var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm))
2679
- );
2680
- word-wrap: var(
2681
- --_ctm-mob-dn-on-te-wd-wp,
2682
- var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp))
2683
- );
2684
- word-break: var(
2685
- --_ctm-mob-dn-on-te-wd-bk,
2686
- var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk))
2687
- );
2688
- font-size: var(
2689
- --_ctm-mob-dn-on-te-ft-se,
2690
- var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se))
2691
- );
2692
- font-weight: var(
2693
- --_ctm-mob-dn-on-te-ft-wt,
2694
- var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt))
2695
- );
2696
- font-style: var(
2697
- --_ctm-mob-dn-on-te-ft-se-ic,
2698
- var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic))
2699
- );
2700
- text-align: var(
2701
- --_ctm-mob-dn-on-te-tt-an,
2702
- var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an))
2703
- );
2704
- letter-spacing: var(
2705
- --_ctm-mob-dn-on-te-lr-sg,
2706
- var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg))
2707
- );
2708
- line-height: var(
2709
- --_ctm-mob-dn-on-te-le-ht,
2710
- var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht))
2711
- );
2712
- text-decoration: var(
2713
- --_ctm-mob-dn-on-te-ue,
2714
- var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue))
2715
- );
1686
+ font-family: var(--_ctm-mob-dn-on-te-ft-fy,
1687
+ var(--_ctm-tab-dn-on-te-ft-fy, var(--_ctm-dn-on-te-ft-fy)));
1688
+ text-transform: var(--_ctm-mob-dn-on-te-tt-tm,
1689
+ var(--_ctm-tab-dn-on-te-tt-tm, var(--_ctm-dn-on-te-tt-tm)));
1690
+ word-wrap: var(--_ctm-mob-dn-on-te-wd-wp,
1691
+ var(--_ctm-tab-dn-on-te-wd-wp, var(--_ctm-dn-on-te-wd-wp)));
1692
+ word-break: var(--_ctm-mob-dn-on-te-wd-bk,
1693
+ var(--_ctm-tab-dn-on-te-wd-bk, var(--_ctm-dn-on-te-wd-bk)));
1694
+ font-size: var(--_ctm-mob-dn-on-te-ft-se,
1695
+ var(--_ctm-tab-dn-on-te-ft-se, var(--_ctm-dn-on-te-ft-se)));
1696
+ font-weight: var(--_ctm-mob-dn-on-te-ft-wt,
1697
+ var(--_ctm-tab-dn-on-te-ft-wt, var(--_ctm-dn-on-te-ft-wt)));
1698
+ font-style: var(--_ctm-mob-dn-on-te-ft-se-ic,
1699
+ var(--_ctm-tab-dn-on-te-ft-se-ic, var(--_ctm-dn-on-te-ft-se-ic)));
1700
+ text-align: var(--_ctm-mob-dn-on-te-tt-an,
1701
+ var(--_ctm-tab-dn-on-te-tt-an, var(--_ctm-dn-on-te-tt-an)));
1702
+ letter-spacing: var(--_ctm-mob-dn-on-te-lr-sg,
1703
+ var(--_ctm-tab-dn-on-te-lr-sg, var(--_ctm-dn-on-te-lr-sg)));
1704
+ line-height: var(--_ctm-mob-dn-on-te-le-ht,
1705
+ var(--_ctm-tab-dn-on-te-le-ht, var(--_ctm-dn-on-te-le-ht)));
1706
+ text-decoration: var(--_ctm-mob-dn-on-te-ue,
1707
+ var(--_ctm-tab-dn-on-te-ue, var(--_ctm-dn-on-te-ue)));
2716
1708
  }
2717
1709
  }
1710
+
2718
1711
  //Dropdown
2719
1712
  .language__conatiner {
2720
1713
  display: flex;
2721
1714
 
2722
1715
  // Option hover state custom properties (no inherit fallback — must be guaranteed-invalid when unset)
2723
1716
  .option:hover {
2724
- --_sf-hr-bd-cr: var(
2725
- --_ctm-mob-dn-dn-se-im-se-hr-se-bd-cr,
2726
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-bd-cr, var(--_ctm-dn-dn-se-im-se-hr-se-bd-cr))
2727
- );
2728
- --_sf-hr-br-cr: var(
2729
- --_ctm-mob-dn-dn-se-im-se-hr-se-br-cr,
2730
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-cr, var(--_ctm-dn-dn-se-im-se-hr-se-br-cr))
2731
- );
2732
- --_sf-hr-br-se: var(
2733
- --_ctm-mob-dn-dn-se-im-se-hr-se-br-se,
2734
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-se, var(--_ctm-dn-dn-se-im-se-hr-se-br-se))
2735
- );
2736
- --_sf-hr-br-wh: var(
2737
- --_ctm-mob-dn-dn-se-im-se-hr-se-br-wh,
2738
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-wh, var(--_ctm-dn-dn-se-im-se-hr-se-br-wh))
2739
- );
2740
- --_sf-hr-br-rs: var(
2741
- --_ctm-mob-dn-dn-se-im-se-hr-se-br-rs,
2742
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-rs, var(--_ctm-dn-dn-se-im-se-hr-se-br-rs))
2743
- );
2744
- --_sf-hr-sw-ae: var(
2745
- --_ctm-mob-dn-dn-se-im-se-hr-se-sw-ae,
2746
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-ae, var(--_ctm-dn-dn-se-im-se-hr-se-sw-ae))
2747
- );
2748
- --_sf-hr-sw-br: var(
2749
- --_ctm-mob-dn-dn-se-im-se-hr-se-sw-br,
2750
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-br, var(--_ctm-dn-dn-se-im-se-hr-se-sw-br))
2751
- );
2752
- --_sf-hr-sw-sd: var(
2753
- --_ctm-mob-dn-dn-se-im-se-hr-se-sw-sd,
2754
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-sd, var(--_ctm-dn-dn-se-im-se-hr-se-sw-sd))
2755
- );
2756
- --_sf-hr-sw-cr: var(
2757
- --_ctm-mob-dn-dn-se-im-se-hr-se-sw-cr,
2758
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-cr, var(--_ctm-dn-dn-se-im-se-hr-se-sw-cr))
2759
- );
2760
- --_sf-hr-cr: var(
2761
- --_ctm-mob-dn-dn-se-im-se-hr-se-cr,
2762
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-cr, var(--_ctm-dn-dn-se-im-se-hr-se-cr))
2763
- );
2764
- --_sf-hr-ft-fy: var(
2765
- --_ctm-mob-dn-dn-se-im-se-hr-se-ft-fy,
2766
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-fy, var(--_ctm-dn-dn-se-im-se-hr-se-ft-fy))
2767
- );
2768
- --_sf-hr-tt-tm: var(
2769
- --_ctm-mob-dn-dn-se-im-se-hr-se-tt-tm,
2770
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-tm, var(--_ctm-dn-dn-se-im-se-hr-se-tt-tm))
2771
- );
2772
- --_sf-hr-wd-wp: var(
2773
- --_ctm-mob-dn-dn-se-im-se-hr-se-wd-wp,
2774
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-wp, var(--_ctm-dn-dn-se-im-se-hr-se-wd-wp))
2775
- );
2776
- --_sf-hr-wd-bk: var(
2777
- --_ctm-mob-dn-dn-se-im-se-hr-se-wd-bk,
2778
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-bk, var(--_ctm-dn-dn-se-im-se-hr-se-wd-bk))
2779
- );
2780
- --_sf-hr-ft-se: var(
2781
- --_ctm-mob-dn-dn-se-im-se-hr-se-ft-se,
2782
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-se, var(--_ctm-dn-dn-se-im-se-hr-se-ft-se))
2783
- );
2784
- --_sf-hr-ft-wt: var(
2785
- --_ctm-mob-dn-dn-se-im-se-hr-se-ft-wt,
2786
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-wt, var(--_ctm-dn-dn-se-im-se-hr-se-ft-wt))
2787
- );
2788
- --_sf-hr-ft-se-ic: var(
2789
- --_ctm-mob-dn-dn-se-im-se-hr-se-ft-se-ic,
2790
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-se-ic, var(--_ctm-dn-dn-se-im-se-hr-se-ft-se-ic))
2791
- );
2792
- --_sf-hr-tt-an: var(
2793
- --_ctm-mob-dn-dn-se-im-se-hr-se-tt-an,
2794
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-an, var(--_ctm-dn-dn-se-im-se-hr-se-tt-an))
2795
- );
2796
- --_sf-hr-lr-sg: var(
2797
- --_ctm-mob-dn-dn-se-im-se-hr-se-lr-sg,
2798
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-lr-sg, var(--_ctm-dn-dn-se-im-se-hr-se-lr-sg))
2799
- );
2800
- --_sf-hr-le-ht: var(
2801
- --_ctm-mob-dn-dn-se-im-se-hr-se-le-ht,
2802
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-le-ht, var(--_ctm-dn-dn-se-im-se-hr-se-le-ht))
2803
- );
2804
- --_sf-hr-ue: var(
2805
- --_ctm-mob-dn-dn-se-im-se-hr-se-ue,
2806
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-ue, var(--_ctm-dn-dn-se-im-se-hr-se-ue))
2807
- );
2808
- --_sf-hr-pg: var(
2809
- --_ctm-mob-dn-dn-se-im-se-hr-se-pg,
2810
- var(--_ctm-tab-dn-dn-se-im-se-hr-se-pg, var(--_ctm-dn-dn-se-im-se-hr-se-pg))
2811
- );
1717
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-bd-cr,
1718
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-bd-cr, var(--_ctm-dn-dn-se-im-se-hr-se-bd-cr)));
1719
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-cr,
1720
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-cr, var(--_ctm-dn-dn-se-im-se-hr-se-br-cr)));
1721
+ --_sf-hr-br-se: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-se,
1722
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-se, var(--_ctm-dn-dn-se-im-se-hr-se-br-se)));
1723
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-wh,
1724
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-wh, var(--_ctm-dn-dn-se-im-se-hr-se-br-wh)));
1725
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-dn-se-im-se-hr-se-br-rs,
1726
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-br-rs, var(--_ctm-dn-dn-se-im-se-hr-se-br-rs)));
1727
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-ae,
1728
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-ae, var(--_ctm-dn-dn-se-im-se-hr-se-sw-ae)));
1729
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-br,
1730
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-br, var(--_ctm-dn-dn-se-im-se-hr-se-sw-br)));
1731
+ --_sf-hr-sw-sd: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-sd,
1732
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-sd, var(--_ctm-dn-dn-se-im-se-hr-se-sw-sd)));
1733
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-sw-cr,
1734
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-sw-cr, var(--_ctm-dn-dn-se-im-se-hr-se-sw-cr)));
1735
+ --_sf-hr-cr: var(--_ctm-mob-dn-dn-se-im-se-hr-se-cr,
1736
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-cr, var(--_ctm-dn-dn-se-im-se-hr-se-cr)));
1737
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-fy,
1738
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-fy, var(--_ctm-dn-dn-se-im-se-hr-se-ft-fy)));
1739
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-dn-se-im-se-hr-se-tt-tm,
1740
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-tm, var(--_ctm-dn-dn-se-im-se-hr-se-tt-tm)));
1741
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-dn-se-im-se-hr-se-wd-wp,
1742
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-wp, var(--_ctm-dn-dn-se-im-se-hr-se-wd-wp)));
1743
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-dn-se-im-se-hr-se-wd-bk,
1744
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-wd-bk, var(--_ctm-dn-dn-se-im-se-hr-se-wd-bk)));
1745
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-se,
1746
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-se, var(--_ctm-dn-dn-se-im-se-hr-se-ft-se)));
1747
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-wt,
1748
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-wt, var(--_ctm-dn-dn-se-im-se-hr-se-ft-wt)));
1749
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ft-se-ic,
1750
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ft-se-ic, var(--_ctm-dn-dn-se-im-se-hr-se-ft-se-ic)));
1751
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-dn-se-im-se-hr-se-tt-an,
1752
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-tt-an, var(--_ctm-dn-dn-se-im-se-hr-se-tt-an)));
1753
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-dn-se-im-se-hr-se-lr-sg,
1754
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-lr-sg, var(--_ctm-dn-dn-se-im-se-hr-se-lr-sg)));
1755
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-dn-se-im-se-hr-se-le-ht,
1756
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-le-ht, var(--_ctm-dn-dn-se-im-se-hr-se-le-ht)));
1757
+ --_sf-hr-ue: var(--_ctm-mob-dn-dn-se-im-se-hr-se-ue,
1758
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-ue, var(--_ctm-dn-dn-se-im-se-hr-se-ue)));
1759
+ --_sf-hr-pg: var(--_ctm-mob-dn-dn-se-im-se-hr-se-pg,
1760
+ var(--_ctm-tab-dn-dn-se-im-se-hr-se-pg, var(--_ctm-dn-dn-se-im-se-hr-se-pg)));
2812
1761
  }
2813
1762
 
2814
1763
  // Option selected state custom properties (no inherit fallback — must be guaranteed-invalid when unset)
2815
1764
  .option[data-selected="true"] {
2816
- --_sf-sd-bd-cr: var(
2817
- --_ctm-mob-dn-dn-se-im-se-sd-se-bd-cr,
2818
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-bd-cr, var(--_ctm-dn-dn-se-im-se-sd-se-bd-cr))
2819
- );
2820
- --_sf-sd-br-cr: var(
2821
- --_ctm-mob-dn-dn-se-im-se-sd-se-br-cr,
2822
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-cr, var(--_ctm-dn-dn-se-im-se-sd-se-br-cr))
2823
- );
2824
- --_sf-sd-br-se: var(
2825
- --_ctm-mob-dn-dn-se-im-se-sd-se-br-se,
2826
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-se, var(--_ctm-dn-dn-se-im-se-sd-se-br-se))
2827
- );
2828
- --_sf-sd-br-wh: var(
2829
- --_ctm-mob-dn-dn-se-im-se-sd-se-br-wh,
2830
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-wh, var(--_ctm-dn-dn-se-im-se-sd-se-br-wh))
2831
- );
2832
- --_sf-sd-sw-ae: var(
2833
- --_ctm-mob-dn-dn-se-im-se-sd-se-sw-ae,
2834
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-ae, var(--_ctm-dn-dn-se-im-se-sd-se-sw-ae))
2835
- );
2836
- --_sf-sd-sw-br: var(
2837
- --_ctm-mob-dn-dn-se-im-se-sd-se-sw-br,
2838
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-br, var(--_ctm-dn-dn-se-im-se-sd-se-sw-br))
2839
- );
2840
- --_sf-sd-sw-sd: var(
2841
- --_ctm-mob-dn-dn-se-im-se-sd-se-sw-sd,
2842
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-sd, var(--_ctm-dn-dn-se-im-se-sd-se-sw-sd))
2843
- );
2844
- --_sf-sd-sw-cr: var(
2845
- --_ctm-mob-dn-dn-se-im-se-sd-se-sw-cr,
2846
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-cr, var(--_ctm-dn-dn-se-im-se-sd-se-sw-cr))
2847
- );
2848
- --_sf-sd-cr: var(
2849
- --_ctm-mob-dn-dn-se-im-se-sd-se-cr,
2850
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-cr, var(--_ctm-dn-dn-se-im-se-sd-se-cr))
2851
- );
2852
- --_sf-sd-ft-fy: var(
2853
- --_ctm-mob-dn-dn-se-im-se-sd-se-ft-fy,
2854
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-fy, var(--_ctm-dn-dn-se-im-se-sd-se-ft-fy))
2855
- );
2856
- --_sf-sd-tt-tm: var(
2857
- --_ctm-mob-dn-dn-se-im-se-sd-se-tt-tm,
2858
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-tm, var(--_ctm-dn-dn-se-im-se-sd-se-tt-tm))
2859
- );
2860
- --_sf-sd-wd-wp: var(
2861
- --_ctm-mob-dn-dn-se-im-se-sd-se-wd-wp,
2862
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-wp, var(--_ctm-dn-dn-se-im-se-sd-se-wd-wp))
2863
- );
2864
- --_sf-sd-wd-bk: var(
2865
- --_ctm-mob-dn-dn-se-im-se-sd-se-wd-bk,
2866
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-bk, var(--_ctm-dn-dn-se-im-se-sd-se-wd-bk))
2867
- );
2868
- --_sf-sd-ft-se: var(
2869
- --_ctm-mob-dn-dn-se-im-se-sd-se-ft-se,
2870
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-se, var(--_ctm-dn-dn-se-im-se-sd-se-ft-se))
2871
- );
2872
- --_sf-sd-ft-wt: var(
2873
- --_ctm-mob-dn-dn-se-im-se-sd-se-ft-wt,
2874
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-wt, var(--_ctm-dn-dn-se-im-se-sd-se-ft-wt))
2875
- );
2876
- --_sf-sd-ft-se-ic: var(
2877
- --_ctm-mob-dn-dn-se-im-se-sd-se-ft-se-ic,
2878
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-se-ic, var(--_ctm-dn-dn-se-im-se-sd-se-ft-se-ic))
2879
- );
2880
- --_sf-sd-tt-an: var(
2881
- --_ctm-mob-dn-dn-se-im-se-sd-se-tt-an,
2882
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-an, var(--_ctm-dn-dn-se-im-se-sd-se-tt-an))
2883
- );
2884
- --_sf-sd-lr-sg: var(
2885
- --_ctm-mob-dn-dn-se-im-se-sd-se-lr-sg,
2886
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-lr-sg, var(--_ctm-dn-dn-se-im-se-sd-se-lr-sg))
2887
- );
2888
- --_sf-sd-le-ht: var(
2889
- --_ctm-mob-dn-dn-se-im-se-sd-se-le-ht,
2890
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-le-ht, var(--_ctm-dn-dn-se-im-se-sd-se-le-ht))
2891
- );
2892
- --_sf-sd-ue: var(
2893
- --_ctm-mob-dn-dn-se-im-se-sd-se-ue,
2894
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-ue, var(--_ctm-dn-dn-se-im-se-sd-se-ue))
2895
- );
2896
- --_sf-sd-pg: var(
2897
- --_ctm-mob-dn-dn-se-im-se-sd-se-pg,
2898
- var(--_ctm-tab-dn-dn-se-im-se-sd-se-pg, var(--_ctm-dn-dn-se-im-se-sd-se-pg))
2899
- );
1765
+ --_sf-sd-bd-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-bd-cr,
1766
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-bd-cr, var(--_ctm-dn-dn-se-im-se-sd-se-bd-cr)));
1767
+ --_sf-sd-br-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-br-cr,
1768
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-cr, var(--_ctm-dn-dn-se-im-se-sd-se-br-cr)));
1769
+ --_sf-sd-br-se: var(--_ctm-mob-dn-dn-se-im-se-sd-se-br-se,
1770
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-se, var(--_ctm-dn-dn-se-im-se-sd-se-br-se)));
1771
+ --_sf-sd-br-wh: var(--_ctm-mob-dn-dn-se-im-se-sd-se-br-wh,
1772
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-br-wh, var(--_ctm-dn-dn-se-im-se-sd-se-br-wh)));
1773
+ --_sf-sd-sw-ae: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-ae,
1774
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-ae, var(--_ctm-dn-dn-se-im-se-sd-se-sw-ae)));
1775
+ --_sf-sd-sw-br: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-br,
1776
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-br, var(--_ctm-dn-dn-se-im-se-sd-se-sw-br)));
1777
+ --_sf-sd-sw-sd: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-sd,
1778
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-sd, var(--_ctm-dn-dn-se-im-se-sd-se-sw-sd)));
1779
+ --_sf-sd-sw-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-sw-cr,
1780
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-sw-cr, var(--_ctm-dn-dn-se-im-se-sd-se-sw-cr)));
1781
+ --_sf-sd-cr: var(--_ctm-mob-dn-dn-se-im-se-sd-se-cr,
1782
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-cr, var(--_ctm-dn-dn-se-im-se-sd-se-cr)));
1783
+ --_sf-sd-ft-fy: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-fy,
1784
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-fy, var(--_ctm-dn-dn-se-im-se-sd-se-ft-fy)));
1785
+ --_sf-sd-tt-tm: var(--_ctm-mob-dn-dn-se-im-se-sd-se-tt-tm,
1786
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-tm, var(--_ctm-dn-dn-se-im-se-sd-se-tt-tm)));
1787
+ --_sf-sd-wd-wp: var(--_ctm-mob-dn-dn-se-im-se-sd-se-wd-wp,
1788
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-wp, var(--_ctm-dn-dn-se-im-se-sd-se-wd-wp)));
1789
+ --_sf-sd-wd-bk: var(--_ctm-mob-dn-dn-se-im-se-sd-se-wd-bk,
1790
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-wd-bk, var(--_ctm-dn-dn-se-im-se-sd-se-wd-bk)));
1791
+ --_sf-sd-ft-se: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-se,
1792
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-se, var(--_ctm-dn-dn-se-im-se-sd-se-ft-se)));
1793
+ --_sf-sd-ft-wt: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-wt,
1794
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-wt, var(--_ctm-dn-dn-se-im-se-sd-se-ft-wt)));
1795
+ --_sf-sd-ft-se-ic: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ft-se-ic,
1796
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ft-se-ic, var(--_ctm-dn-dn-se-im-se-sd-se-ft-se-ic)));
1797
+ --_sf-sd-tt-an: var(--_ctm-mob-dn-dn-se-im-se-sd-se-tt-an,
1798
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-tt-an, var(--_ctm-dn-dn-se-im-se-sd-se-tt-an)));
1799
+ --_sf-sd-lr-sg: var(--_ctm-mob-dn-dn-se-im-se-sd-se-lr-sg,
1800
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-lr-sg, var(--_ctm-dn-dn-se-im-se-sd-se-lr-sg)));
1801
+ --_sf-sd-le-ht: var(--_ctm-mob-dn-dn-se-im-se-sd-se-le-ht,
1802
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-le-ht, var(--_ctm-dn-dn-se-im-se-sd-se-le-ht)));
1803
+ --_sf-sd-ue: var(--_ctm-mob-dn-dn-se-im-se-sd-se-ue,
1804
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-ue, var(--_ctm-dn-dn-se-im-se-sd-se-ue)));
1805
+ --_sf-sd-pg: var(--_ctm-mob-dn-dn-se-im-se-sd-se-pg,
1806
+ var(--_ctm-tab-dn-dn-se-im-se-sd-se-pg, var(--_ctm-dn-dn-se-im-se-sd-se-pg)));
2900
1807
  }
2901
1808
 
2902
1809
  // Placeholder text
@@ -2954,10 +1861,7 @@ $minWidth: 70px;
2954
1861
  border-radius: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-br-rs);
2955
1862
 
2956
1863
  // Widget style — shadow
2957
- box-shadow: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-ae)
2958
- prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-br)
2959
- prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-sd)
2960
- prepareMediaVariable(--_ctm-dn-dn-se-wt-se-sw-cr);
1864
+ 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);
2961
1865
 
2962
1866
  // Widget style — font
2963
1867
  color: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-cr);
@@ -2965,10 +1869,12 @@ $minWidth: 70px;
2965
1869
  text-transform: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-tt-tm);
2966
1870
  word-wrap: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-wd-wp);
2967
1871
  word-break: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-wd-bk);
1872
+
2968
1873
  &.flex__overflow {
2969
1874
  white-space: normal;
2970
1875
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2971
1876
  }
1877
+
2972
1878
  font-size: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-ft-se);
2973
1879
  font-weight: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-ft-wt);
2974
1880
  font-style: prepareMediaVariable(--_ctm-dn-dn-se-wt-se-ft-se-ic);
@@ -2989,14 +1895,18 @@ $minWidth: 70px;
2989
1895
  .est__dropdown__icon {
2990
1896
  transition: transform 0.4s ease-in-out;
2991
1897
  display: flex;
1898
+
2992
1899
  &.rotate__180 {
2993
1900
  transform: rotate(180deg);
2994
1901
  }
1902
+
2995
1903
  &.rotate__0 {
2996
1904
  transform: rotate(0deg);
2997
1905
  }
1906
+
2998
1907
  width: 16px;
2999
1908
  height: 16px;
1909
+
3000
1910
  svg {
3001
1911
  width: 100%;
3002
1912
  height: 100%;
@@ -3021,10 +1931,7 @@ $minWidth: 70px;
3021
1931
  border-color: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-br-cr);
3022
1932
  padding: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-pg);
3023
1933
  gap: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-im-gp);
3024
- box-shadow: prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-ae)
3025
- prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-br)
3026
- prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-sd)
3027
- prepareMediaVariable(--_ctm-dn-dn-se-wt-dn-sw-cr);
1934
+ 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);
3028
1935
 
3029
1936
  &.top {
3030
1937
  bottom: 100%;
@@ -3057,103 +1964,56 @@ $minWidth: 70px;
3057
1964
  box-sizing: border-box;
3058
1965
 
3059
1966
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-pg));
3060
- border-color: var(
3061
- --_sf-hr-br-cr,
3062
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-cr)
3063
- );
3064
- background-color: var(
3065
- --_sf-hr-bd-cr,
3066
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr)
3067
- );
3068
- border-style: var(
3069
- --_sf-hr-br-se,
3070
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-se)
3071
- );
3072
- border-radius: var(
3073
- --_sf-hr-br-rs,
3074
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs)
3075
- );
3076
- border-width: var(
3077
- --_sf-hr-br-wh,
3078
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-wh)
3079
- );
3080
-
3081
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-ae))
3082
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-br))
3083
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-sd))
3084
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-cr));
1967
+ border-color: var(--_sf-hr-br-cr,
1968
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-cr));
1969
+ background-color: var(--_sf-hr-bd-cr,
1970
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr));
1971
+ border-style: var(--_sf-hr-br-se,
1972
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-se));
1973
+ border-radius: var(--_sf-hr-br-rs,
1974
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs));
1975
+ border-width: var(--_sf-hr-br-wh,
1976
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-wh));
1977
+
1978
+ 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));
3085
1979
 
3086
1980
  &[data-selected="true"] {
3087
- border-color: var(
3088
- --_sf-sd-br-cr,
3089
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-cr)
3090
- );
3091
- background-color: var(
3092
- --_sf-sd-bd-cr,
3093
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr)
3094
- );
3095
- border-style: var(
3096
- --_sf-sd-br-se,
3097
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-se)
3098
- );
3099
- border-width: var(
3100
- --_sf-sd-br-wh,
3101
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-wh)
3102
- );
3103
- border-radius: var(
3104
- --_sf-sd-br-rs,
3105
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs)
3106
- );
3107
- box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-ae))
3108
- var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-br))
3109
- var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-sd))
3110
- var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-sw-cr));
1981
+ border-color: var(--_sf-sd-br-cr,
1982
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-cr));
1983
+ background-color: var(--_sf-sd-bd-cr,
1984
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-bd-cr));
1985
+ border-style: var(--_sf-sd-br-se,
1986
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-se));
1987
+ border-width: var(--_sf-sd-br-wh,
1988
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-wh));
1989
+ border-radius: var(--_sf-sd-br-rs,
1990
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-br-rs));
1991
+ 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));
1992
+
3111
1993
  .language__name {
3112
1994
  color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-cr));
3113
- font-family: var(
3114
- --_sf-sd-ft-fy,
3115
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-fy)
3116
- );
3117
- text-transform: var(
3118
- --_sf-sd-tt-tm,
3119
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-tm)
3120
- );
3121
- word-wrap: var(
3122
- --_sf-sd-wd-wp,
3123
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-wp)
3124
- );
3125
- word-break: var(
3126
- --_sf-sd-wd-bk,
3127
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-bk)
3128
- );
3129
- font-size: var(
3130
- --_sf-sd-ft-se,
3131
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se)
3132
- );
3133
- font-weight: var(
3134
- --_sf-sd-ft-wt,
3135
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-wt)
3136
- );
3137
- font-style: var(
3138
- --_sf-sd-ft-se-ic,
3139
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic)
3140
- );
3141
- text-align: var(
3142
- --_sf-sd-tt-an,
3143
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-an)
3144
- );
3145
- letter-spacing: var(
3146
- --_sf-sd-lr-sg,
3147
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg)
3148
- );
3149
- line-height: var(
3150
- --_sf-sd-le-ht,
3151
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-le-ht)
3152
- );
3153
- text-decoration: var(
3154
- --_sf-sd-ue,
3155
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ue)
3156
- );
1995
+ font-family: var(--_sf-sd-ft-fy,
1996
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-fy));
1997
+ text-transform: var(--_sf-sd-tt-tm,
1998
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-tm));
1999
+ word-wrap: var(--_sf-sd-wd-wp,
2000
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-wp));
2001
+ word-break: var(--_sf-sd-wd-bk,
2002
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-bk));
2003
+ font-size: var(--_sf-sd-ft-se,
2004
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se));
2005
+ font-weight: var(--_sf-sd-ft-wt,
2006
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-wt));
2007
+ font-style: var(--_sf-sd-ft-se-ic,
2008
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic));
2009
+ text-align: var(--_sf-sd-tt-an,
2010
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-an));
2011
+ letter-spacing: var(--_sf-sd-lr-sg,
2012
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg));
2013
+ line-height: var(--_sf-sd-le-ht,
2014
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-le-ht));
2015
+ text-decoration: var(--_sf-sd-ue,
2016
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ue));
3157
2017
  @include restrictToLinesShow(1);
3158
2018
  }
3159
2019
  }
@@ -3164,6 +2024,7 @@ $minWidth: 70px;
3164
2024
  display: flex;
3165
2025
  align-items: center;
3166
2026
  position: relative;
2027
+
3167
2028
  .language__name {
3168
2029
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-cr));
3169
2030
  @include restrictToLinesShow(1);
@@ -3178,15 +2039,11 @@ $minWidth: 70px;
3178
2039
  word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-wd-bk));
3179
2040
  font-size: var(--_sf-hr-ft-se, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se));
3180
2041
  font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-wt));
3181
- font-style: var(
3182
- --_sf-hr-ft-se-ic,
3183
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic)
3184
- );
2042
+ font-style: var(--_sf-hr-ft-se-ic,
2043
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ft-se-ic));
3185
2044
  text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-tt-an));
3186
- letter-spacing: var(
3187
- --_sf-hr-lr-sg,
3188
- prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg)
3189
- );
2045
+ letter-spacing: var(--_sf-hr-lr-sg,
2046
+ prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-lr-sg));
3190
2047
  line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-le-ht));
3191
2048
  text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dn-se-im-se-dt-se-ue));
3192
2049
  white-space: nowrap;
@@ -3208,6 +2065,7 @@ $minWidth: 70px;
3208
2065
 
3209
2066
  .dropdown_wrapper {
3210
2067
  position: relative;
2068
+
3211
2069
  &[data-show-divider="true"] {
3212
2070
  &:not(:last-child)::after {
3213
2071
  content: "";
@@ -3216,36 +2074,25 @@ $minWidth: 70px;
3216
2074
  height: 1px;
3217
2075
  width: 100%;
3218
2076
  display: flex;
3219
- top: calc(
3220
- calc(
3221
- var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px
3222
- ) /
3223
- 2
3224
- );
2077
+ top: calc(calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) + 10px) / 2);
3225
2078
  }
3226
2079
  }
3227
2080
  }
3228
2081
  }
2082
+
3229
2083
  // Quantity Fields
3230
2084
  .field__group {
3231
2085
  // display: flex;
3232
2086
  // flex-wrap: wrap;
3233
2087
  // gap: 8px;
3234
2088
  display: grid;
3235
- grid-template-columns: repeat(
3236
- auto-fit,
3237
- minmax(
3238
- var(
3239
- --_ctm-mob-var-lt-mn-cn-wh,
3240
- var(--_ctm-tab-var-lt-mn-cn-wh, var(--_ctm-var-lt-mn-cn-wh))
3241
- ),
3242
- var(--_ctm-mob-var-lt-mn-cn-wh)
3243
- )
3244
- );
3245
- gap: var(
3246
- --_ctm-mob-lt-gd-os-dy-se-tb-rw-sg,
3247
- var(--_ctm-tab-lt-gd-os-dy-se-tb-rw-sg, var(--_ctm-lt-gd-os-dy-se-tb-rw-sg))
3248
- );
2089
+ grid-template-columns: repeat(auto-fit,
2090
+ minmax(var(--_ctm-mob-var-lt-mn-cn-wh,
2091
+ var(--_ctm-tab-var-lt-mn-cn-wh, var(--_ctm-var-lt-mn-cn-wh))),
2092
+ var(--_ctm-mob-var-lt-mn-cn-wh)));
2093
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-tb-rw-sg,
2094
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-rw-sg, var(--_ctm-lt-gd-os-dy-se-tb-rw-sg)));
2095
+
3249
2096
  .field__group__item {
3250
2097
  font-size: 16px;
3251
2098
  display: flex;
@@ -3253,6 +2100,7 @@ $minWidth: 70px;
3253
2100
  align-items: center;
3254
2101
  justify-content: center;
3255
2102
  gap: 8px;
2103
+
3256
2104
  input[type="number"] {
3257
2105
  // width: 70px !important;
3258
2106
  width: 100%;
@@ -3261,10 +2109,12 @@ $minWidth: 70px;
3261
2109
  border-radius: 4px;
3262
2110
  text-align: center;
3263
2111
  height: 40px;
2112
+
3264
2113
  &:focus-within {
3265
2114
  border: 1px solid var(--_primary-200);
3266
2115
  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
3267
2116
  }
2117
+
3268
2118
  &:disabled {
3269
2119
  cursor: not-allowed;
3270
2120
  opacity: 0.4;
@@ -3272,18 +2122,15 @@ $minWidth: 70px;
3272
2122
  }
3273
2123
  }
3274
2124
  }
2125
+
3275
2126
  // Enter quantity styles
3276
2127
  .quantiy__details {
3277
2128
  display: flex;
3278
2129
  flex-direction: column;
3279
- gap: var(
3280
- --_ctm-mob-lt-gd-os-dy-se-gp-sg,
3281
- var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg))
3282
- );
3283
- padding: var(
3284
- --_ctm-mob-lt-gd-os-dy-se-gp-pg,
3285
- var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg))
3286
- );
2130
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-sg,
2131
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg)));
2132
+ padding: var(--_ctm-mob-lt-gd-os-dy-se-gp-pg,
2133
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg)));
3287
2134
 
3288
2135
  .title {
3289
2136
  display: flex;
@@ -3291,35 +2138,36 @@ $minWidth: 70px;
3291
2138
  align-items: center;
3292
2139
  font-weight: 600;
3293
2140
  font-size: 18px;
3294
- & > button {
2141
+
2142
+ &>button {
3295
2143
  border-bottom: 1px solid var(--_gray-400);
3296
2144
  color: var(--_gray-600);
3297
2145
  font-size: 14px;
3298
2146
  }
3299
2147
  }
2148
+
3300
2149
  .fit__details {
3301
2150
  display: flex;
3302
2151
  flex-direction: column;
3303
2152
  gap: 12px;
2153
+
3304
2154
  .fit__desc {
3305
2155
  display: flex;
3306
2156
  flex-direction: column;
3307
- gap: var(
3308
- --_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
3309
- var(
3310
- --_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
3311
- var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)
3312
- )
3313
- );
2157
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
2158
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
2159
+ var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)));
3314
2160
 
3315
2161
  font-size: 16px;
3316
2162
  color: var(--_gray-900);
2163
+
3317
2164
  .each__price {
3318
2165
  font-weight: 600;
3319
2166
  }
3320
2167
  }
3321
2168
  }
3322
2169
  }
2170
+
3323
2171
  .grouped_items {
3324
2172
  display: flex;
3325
2173
  flex-direction: column;
@@ -3336,35 +2184,25 @@ $minWidth: 70px;
3336
2184
 
3337
2185
  .tab {
3338
2186
  &:first-child {
3339
- margin-bottom: var(
3340
- --_ctm-mob-lt-on-te-ve-sg,
3341
- var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg))
3342
- );
2187
+ margin-bottom: var(--_ctm-mob-lt-on-te-ve-sg,
2188
+ var(--_ctm-tab-lt-on-te-ve-sg, var(--_ctm-lt-on-te-ve-sg)));
3343
2189
  }
3344
2190
  }
3345
2191
 
3346
2192
  .tab__content {
3347
2193
  display: flex;
3348
2194
  flex-direction: column;
3349
- padding: var(
3350
- --_ctm-mob-lt-gd-os-dy-se-gp-pg,
3351
- var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg))
3352
- );
2195
+ padding: var(--_ctm-mob-lt-gd-os-dy-se-gp-pg,
2196
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-pg, var(--_ctm-lt-gd-os-dy-se-gp-pg)));
3353
2197
 
3354
2198
  .field__group {
3355
- gap: var(
3356
- --_ctm-mob-lt-gd-os-dy-se-gp-sg,
3357
- var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg))
3358
- );
2199
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-sg,
2200
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-sg, var(--_ctm-lt-gd-os-dy-se-gp-sg)));
3359
2201
 
3360
2202
  .field__group__item {
3361
- gap: var(
3362
- --_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
3363
- var(
3364
- --_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
3365
- var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)
3366
- )
3367
- );
2203
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-gp-hr-ad-on-sg,
2204
+ var(--_ctm-tab-lt-gd-os-dy-se-gp-hr-ad-on-sg,
2205
+ var(--_ctm-lt-gd-os-dy-se-gp-hr-ad-on-sg)));
3368
2206
  }
3369
2207
  }
3370
2208
  }
@@ -3372,7 +2210,7 @@ $minWidth: 70px;
3372
2210
  }
3373
2211
 
3374
2212
  &[data-show-divider="true"] {
3375
- & > div {
2213
+ &>div {
3376
2214
  &:not(:last-child)::after {
3377
2215
  content: "";
3378
2216
  position: relative;
@@ -3380,9 +2218,7 @@ $minWidth: 70px;
3380
2218
  height: 1px;
3381
2219
  width: 100%;
3382
2220
  display: flex;
3383
- top: calc(
3384
- var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2
3385
- );
2221
+ top: calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2);
3386
2222
  }
3387
2223
  }
3388
2224
 
@@ -3394,17 +2230,17 @@ $minWidth: 70px;
3394
2230
  height: 1px;
3395
2231
  width: 100%;
3396
2232
  display: flex;
3397
- top: calc(
3398
- var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2
3399
- );
2233
+ top: calc(var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg))) / 2);
3400
2234
  }
3401
2235
  }
3402
2236
  }
3403
2237
  }
2238
+
3404
2239
  // tabs
3405
2240
  .tabs__container {
3406
2241
  display: flex;
3407
2242
  position: relative;
2243
+
3408
2244
  .tab {
3409
2245
  flex: 1;
3410
2246
  padding-block: 20px;
@@ -3412,10 +2248,12 @@ $minWidth: 70px;
3412
2248
  text-align: center;
3413
2249
  cursor: pointer;
3414
2250
  position: relative;
2251
+
3415
2252
  &.tab__active {
3416
2253
  font-weight: bold;
3417
2254
  }
3418
2255
  }
2256
+
3419
2257
  .tab__active-indicator {
3420
2258
  position: absolute;
3421
2259
  bottom: 0;
@@ -3433,35 +2271,24 @@ $minWidth: 70px;
3433
2271
  .tab__accordion {
3434
2272
  display: flex;
3435
2273
  flex-direction: column;
3436
- padding: var(
3437
- --_ctm-mob-lt-gd-os-dy-se-cr-pg,
3438
- var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg))
3439
- );
2274
+ padding: var(--_ctm-mob-lt-gd-os-dy-se-cr-pg,
2275
+ var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg)));
3440
2276
 
3441
2277
  .tab__container {
3442
2278
  display: flex;
3443
2279
  flex-direction: column;
3444
- gap: var(
3445
- --_ctm-mob-lt-gd-os-dy-se-an-sg,
3446
- var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg))
3447
- );
2280
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-an-sg,
2281
+ var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg)));
3448
2282
 
3449
2283
  .tab_acc_wrapper {
3450
2284
  display: flex;
3451
2285
  flex-direction: column;
3452
- gap: var(
3453
- --_ctm-mob-lt-gd-os-dy-se-an-ad-cr-sg,
3454
- var(--_ctm-tab-lt-gd-os-dy-se-an-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-an-ad-cr-sg))
3455
- );
3456
-
3457
- padding: var(
3458
- --_ctm-mob-lt-gd-os-dy-se-an-vl-pg,
3459
- var(--_ctm-tab-lt-gd-os-dy-se-an-vl-pg, var(--_ctm-lt-gd-os-dy-se-an-vl-pg))
3460
- )
3461
- var(
3462
- --_ctm-mob-lt-gd-os-dy-se-an-hl-pg,
3463
- var(--_ctm-tab-lt-gd-os-dy-se-an-hl-pg, var(--_ctm-lt-gd-os-dy-se-an-hl-pg))
3464
- );
2286
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-an-ad-cr-sg,
2287
+ var(--_ctm-tab-lt-gd-os-dy-se-an-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-an-ad-cr-sg)));
2288
+
2289
+ padding: var(--_ctm-mob-lt-gd-os-dy-se-an-vl-pg,
2290
+ 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,
2291
+ var(--_ctm-tab-lt-gd-os-dy-se-an-hl-pg, var(--_ctm-lt-gd-os-dy-se-an-hl-pg)));
3465
2292
 
3466
2293
  .tab {
3467
2294
  display: flex;
@@ -3469,10 +2296,12 @@ $minWidth: 70px;
3469
2296
  position: relative;
3470
2297
  cursor: pointer;
3471
2298
  flex-direction: row;
2299
+
3472
2300
  &[data-expand-icon="Left"] {
3473
2301
  flex-direction: row-reverse;
3474
2302
  justify-content: flex-end;
3475
2303
  }
2304
+
3476
2305
  &[data-item-dividers="true"] {
3477
2306
  &::after {
3478
2307
  content: "";
@@ -3483,21 +2312,26 @@ $minWidth: 70px;
3483
2312
  border-bottom: 1px solid var(--_gray-200);
3484
2313
  }
3485
2314
  }
2315
+
3486
2316
  span {
3487
2317
  padding-block: 12px;
3488
2318
  display: inline-block;
3489
2319
  }
2320
+
3490
2321
  .active {
3491
2322
  border-bottom: 2px solid var(--_primary-400);
3492
2323
  }
2324
+
3493
2325
  &.inactive {
3494
2326
  height: 0px;
3495
2327
  }
3496
2328
  }
2329
+
3497
2330
  .tab__content {
3498
2331
  &.d-none {
3499
2332
  display: none;
3500
2333
  }
2334
+
3501
2335
  &.d-block {
3502
2336
  display: block;
3503
2337
  }
@@ -3517,13 +2351,8 @@ $minWidth: 70px;
3517
2351
  height: 1px;
3518
2352
  width: 100%;
3519
2353
  display: flex;
3520
- top: calc(
3521
- var(
3522
- --_ctm-mob-lt-gd-os-dy-se-an-sg,
3523
- var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg))
3524
- ) /
3525
- 2
3526
- );
2354
+ top: calc(var(--_ctm-mob-lt-gd-os-dy-se-an-sg,
2355
+ var(--_ctm-tab-lt-gd-os-dy-se-an-sg, var(--_ctm-lt-gd-os-dy-se-an-sg))) / 2);
3527
2356
  }
3528
2357
  }
3529
2358
  }
@@ -3554,205 +2383,115 @@ $minWidth: 70px;
3554
2383
  }
3555
2384
  }
3556
2385
  }
2386
+
3557
2387
  &.tabs__hr {
3558
2388
  .tabs {
3559
2389
  flex-direction: column;
3560
- gap: var(
3561
- --_ctm-mob-lt-gd-os-dy-se-tb-ad-cr-sg,
3562
- var(--_ctm-tab-lt-gd-os-dy-se-tb-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-tb-ad-cr-sg))
3563
- );
2390
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-tb-ad-cr-sg,
2391
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-ad-cr-sg, var(--_ctm-lt-gd-os-dy-se-tb-ad-cr-sg)));
3564
2392
 
3565
2393
  .tabs__container {
3566
2394
  width: 100%;
3567
2395
  }
3568
2396
  }
3569
2397
  }
2398
+
3570
2399
  .tabs {
3571
2400
  display: flex;
3572
- gap: var(
3573
- --_ctm-mob-lt-tb-im-se-dt-se-tb-ad-cr-sg,
3574
- 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))
3575
- );
2401
+ gap: var(--_ctm-mob-lt-tb-im-se-dt-se-tb-ad-cr-sg,
2402
+ 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)));
3576
2403
 
3577
2404
  .tabs__container {
3578
2405
  display: flex;
3579
- gap: var(
3580
- --_ctm-mob-lt-gd-os-dy-se-tb-sg,
3581
- var(--_ctm-tab-lt-gd-os-dy-se-tb-sg, var(--_ctm-lt-gd-os-dy-se-tb-sg))
3582
- );
2406
+ gap: var(--_ctm-mob-lt-gd-os-dy-se-tb-sg,
2407
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-sg, var(--_ctm-lt-gd-os-dy-se-tb-sg)));
3583
2408
 
3584
2409
  .tab {
3585
2410
  display: flex;
3586
2411
  justify-content: var(--_tab-aliginment);
3587
- padding: var(
3588
- --_ctm-mob-lt-gd-os-dy-se-tb-vl-pg,
3589
- var(--_ctm-tab-lt-gd-os-dy-se-tb-vl-pg, var(--_ctm-lt-gd-os-dy-se-tb-vl-pg))
3590
- )
3591
- var(
3592
- --_ctm-mob-lt-gd-os-dy-se-tb-hl-pg,
3593
- var(--_ctm-tab-lt-gd-os-dy-se-tb-hl-pg, var(--_ctm-lt-gd-os-dy-se-tb-hl-pg))
3594
- );
3595
- background-color: var(
3596
- --_ctm-mob-lt-dn-tb-im-se-dt-se-bd-cr,
3597
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-bd-cr, var(--_ctm-dn-tb-im-se-dt-se-bd-cr))
3598
- );
3599
- border-color: var(
3600
- --_show-border-im-se,
3601
- var(
3602
- --_ctm-mob-lt-dn-tb-im-se-dt-se-br-cr,
3603
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-cr, var(--_ctm-dn-tb-im-se-dt-se-br-cr))
3604
- )
3605
- );
3606
- border-style: var(
3607
- --_show-border-im-se,
3608
- var(
3609
- --_ctm-mob-lt-dn-tb-im-se-dt-se-br-se,
3610
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-se, var(--_ctm-dn-tb-im-se-dt-se-br-se))
3611
- )
3612
- );
3613
- border-width: var(
3614
- --_show-border-im-se,
3615
- var(
3616
- --_ctm-mob-lt-dn-tb-im-se-dt-se-br-wh,
3617
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-wh, var(--_ctm-dn-tb-im-se-dt-se-br-wh))
3618
- )
3619
- );
3620
- border-radius: var(
3621
- --_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
3622
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs, var(--_ctm-dn-tb-im-se-dt-se-br-rs))
3623
- );
3624
- box-shadow: var(
3625
- --_show-shadow-im-se,
3626
- var(
3627
- --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-ae,
3628
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-ae)
3629
- ),
3630
- var(
3631
- --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-br,
3632
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-br)
3633
- ),
3634
- var(
3635
- --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-sd,
3636
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-sd)
3637
- ),
3638
- var(
3639
- --_ctm-mob-lt-dn-tb-im-se-dt-se-sw-cr,
3640
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-cr)
3641
- )
3642
- );
3643
- border-radius: var(
3644
- --_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
3645
- var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs)
3646
- );
2412
+ padding: var(--_ctm-mob-lt-gd-os-dy-se-tb-vl-pg,
2413
+ 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,
2414
+ var(--_ctm-tab-lt-gd-os-dy-se-tb-hl-pg, var(--_ctm-lt-gd-os-dy-se-tb-hl-pg)));
2415
+ background-color: var(--_ctm-mob-lt-dn-tb-im-se-dt-se-bd-cr,
2416
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-bd-cr, var(--_ctm-dn-tb-im-se-dt-se-bd-cr)));
2417
+ border-color: var(--_show-border-im-se,
2418
+ var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-cr,
2419
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-cr, var(--_ctm-dn-tb-im-se-dt-se-br-cr))));
2420
+ border-style: var(--_show-border-im-se,
2421
+ var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-se,
2422
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-se, var(--_ctm-dn-tb-im-se-dt-se-br-se))));
2423
+ border-width: var(--_show-border-im-se,
2424
+ var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-wh,
2425
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-wh, var(--_ctm-dn-tb-im-se-dt-se-br-wh))));
2426
+ border-radius: var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
2427
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs, var(--_ctm-dn-tb-im-se-dt-se-br-rs)));
2428
+ box-shadow: var(--_show-shadow-im-se,
2429
+ var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-ae,
2430
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-ae)),
2431
+ var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-br,
2432
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-br)),
2433
+ var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-sd,
2434
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-sd)),
2435
+ var(--_ctm-mob-lt-dn-tb-im-se-dt-se-sw-cr,
2436
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-sw-cr)));
2437
+ border-radius: var(--_ctm-mob-lt-dn-tb-im-se-dt-se-br-rs,
2438
+ var(--_ctm-tab-lt-dn-tb-im-se-dt-se-br-rs));
3647
2439
 
3648
2440
  &:hover {
3649
- background-color: var(
3650
- --_ctm-mob-lt-dn-tb-im-se-hr-se-bd-cr,
3651
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-bd-cr, var(--_ctm-dn-tb-im-se-hr-se-bd-cr))
3652
- );
3653
- border-color: var(
3654
- --_show-border-im-se,
3655
- var(
3656
- --_ctm-mob-lt-dn-tb-im-se-hr-se-br-cr,
3657
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-cr, var(--_ctm-dn-tb-im-se-hr-se-br-cr))
3658
- )
3659
- );
3660
- border-style: var(
3661
- --_show-border-im-se,
3662
- var(
3663
- --_ctm-mob-lt-dn-tb-im-se-hr-se-br-se,
3664
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-se, var(--_ctm-dn-tb-im-se-hr-se-br-se))
3665
- )
3666
- );
3667
- border-width: var(
3668
- --_show-border-im-se,
3669
- var(
3670
- --_ctm-mob-lt-dn-tb-im-se-hr-se-br-wh,
3671
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-wh, var(--_ctm-dn-tb-im-se-hr-se-br-wh))
3672
- )
3673
- );
3674
- border-radius: var(
3675
- --_ctm-mob-lt-dn-tb-im-se-hr-se-br-rs,
3676
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-rs, var(--_ctm-dn-tb-im-se-hr-se-br-rs))
3677
- );
3678
- box-shadow: var(
3679
- --_show-shadow-im-se,
3680
- var(
3681
- --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-ae,
3682
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-ae)
3683
- ),
3684
- var(
3685
- --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-br,
3686
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-br)
3687
- ),
3688
- var(
3689
- --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-sd,
3690
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-sd)
3691
- ),
3692
- var(
3693
- --_ctm-mob-lt-dn-tb-im-se-hr-se-sw-cr,
3694
- var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-cr)
3695
- )
3696
- );
2441
+ background-color: var(--_ctm-mob-lt-dn-tb-im-se-hr-se-bd-cr,
2442
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-bd-cr, var(--_ctm-dn-tb-im-se-hr-se-bd-cr)));
2443
+ border-color: var(--_show-border-im-se,
2444
+ var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-cr,
2445
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-cr, var(--_ctm-dn-tb-im-se-hr-se-br-cr))));
2446
+ border-style: var(--_show-border-im-se,
2447
+ var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-se,
2448
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-se, var(--_ctm-dn-tb-im-se-hr-se-br-se))));
2449
+ border-width: var(--_show-border-im-se,
2450
+ var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-wh,
2451
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-wh, var(--_ctm-dn-tb-im-se-hr-se-br-wh))));
2452
+ border-radius: var(--_ctm-mob-lt-dn-tb-im-se-hr-se-br-rs,
2453
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-br-rs, var(--_ctm-dn-tb-im-se-hr-se-br-rs)));
2454
+ box-shadow: var(--_show-shadow-im-se,
2455
+ var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-ae,
2456
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-ae)),
2457
+ var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-br,
2458
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-br)),
2459
+ var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-sd,
2460
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-sd)),
2461
+ var(--_ctm-mob-lt-dn-tb-im-se-hr-se-sw-cr,
2462
+ var(--_ctm-tab-lt-dn-tb-im-se-hr-se-sw-cr)));
3697
2463
  }
3698
2464
 
3699
2465
  &.active {
3700
- background-color: var(
3701
- --_ctm-mob-lt-dn-tb-im-se-sd-se-bd-cr,
3702
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-bd-cr, var(--_ctm-dn-tb-im-se-sd-se-bd-cr))
3703
- );
3704
- border-color: var(
3705
- --_show-border-im-se,
3706
- var(
3707
- --_ctm-mob-lt-dn-tb-im-se-sd-se-br-cr,
3708
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-cr, var(--_ctm-dn-tb-im-se-sd-se-br-cr))
3709
- )
3710
- );
3711
- border-style: var(
3712
- --_show-border-im-se,
3713
- var(
3714
- --_ctm-mob-lt-dn-tb-im-se-sd-se-br-se,
3715
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-se, var(--_ctm-dn-tb-im-se-sd-se-br-se))
3716
- )
3717
- );
3718
- border-width: var(
3719
- --_show-border-im-se,
3720
- var(
3721
- --_ctm-mob-lt-dn-tb-im-se-sd-se-br-wh,
3722
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-wh, var(--_ctm-dn-tb-im-se-sd-se-br-wh))
3723
- )
3724
- );
3725
- border-radius: var(
3726
- --_ctm-mob-lt-dn-tb-im-se-sd-se-br-rs,
3727
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-rs, var(--_ctm-dn-tb-im-se-sd-se-br-rs))
3728
- );
3729
- box-shadow: var(
3730
- --_show-shadow-im-se,
3731
- var(
3732
- --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-ae,
3733
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-ae)
3734
- ),
3735
- var(
3736
- --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-br,
3737
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-br)
3738
- ),
3739
- var(
3740
- --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-sd,
3741
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-sd)
3742
- ),
3743
- var(
3744
- --_ctm-mob-lt-dn-tb-im-se-sd-se-sw-cr,
3745
- var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-cr)
3746
- )
3747
- );
2466
+ background-color: var(--_ctm-mob-lt-dn-tb-im-se-sd-se-bd-cr,
2467
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-bd-cr, var(--_ctm-dn-tb-im-se-sd-se-bd-cr)));
2468
+ border-color: var(--_show-border-im-se,
2469
+ var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-cr,
2470
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-cr, var(--_ctm-dn-tb-im-se-sd-se-br-cr))));
2471
+ border-style: var(--_show-border-im-se,
2472
+ var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-se,
2473
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-se, var(--_ctm-dn-tb-im-se-sd-se-br-se))));
2474
+ border-width: var(--_show-border-im-se,
2475
+ var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-wh,
2476
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-wh, var(--_ctm-dn-tb-im-se-sd-se-br-wh))));
2477
+ border-radius: var(--_ctm-mob-lt-dn-tb-im-se-sd-se-br-rs,
2478
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-br-rs, var(--_ctm-dn-tb-im-se-sd-se-br-rs)));
2479
+ box-shadow: var(--_show-shadow-im-se,
2480
+ var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-ae,
2481
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-ae)),
2482
+ var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-br,
2483
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-br)),
2484
+ var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-sd,
2485
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-sd)),
2486
+ var(--_ctm-mob-lt-dn-tb-im-se-sd-se-sw-cr,
2487
+ var(--_ctm-tab-lt-dn-tb-im-se-sd-se-sw-cr)));
3748
2488
  }
3749
2489
  }
3750
2490
  }
2491
+
3751
2492
  .tab__content {
3752
- padding: var(
3753
- --_ctm-mob-lt-gd-os-dy-se-cr-pg,
3754
- var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg))
3755
- );
2493
+ padding: var(--_ctm-mob-lt-gd-os-dy-se-cr-pg,
2494
+ var(--_ctm-tab-lt-gd-os-dy-se-cr-pg, var(--_ctm-lt-gd-os-dy-se-cr-pg)));
3756
2495
  }
3757
2496
  }
3758
2497
  }
@@ -3791,37 +2530,18 @@ $minWidth: 70px;
3791
2530
  gap: var(--_ctm-mob-lt-sh-im-sg, var(--_ctm-tab-lt-sh-im-sg, var(--_ctm-lt-sh-im-sg)));
3792
2531
 
3793
2532
  &[data-control-type="Bottom"][data-slider-control="Arrows"] {
3794
- height: calc(
3795
- 100% - calc(
3796
- var(
3797
- --_ctm-mob-dn-pn-as-aw-se,
3798
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
3799
- ) +
3800
- 8px
3801
- )
3802
- );
2533
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-as-aw-se,
2534
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) + 8px));
3803
2535
  }
2536
+
3804
2537
  &[data-control-type="Bottom"][data-slider-control="Pagination Line"] {
3805
- height: calc(
3806
- 100% - calc(
3807
- var(
3808
- --_ctm-mob-dn-pn-le-le-ht,
3809
- var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))
3810
- ) +
3811
- 20px
3812
- )
3813
- );
2538
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-le-le-ht,
2539
+ var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))) + 20px));
3814
2540
  }
2541
+
3815
2542
  &[data-control-type="Bottom"][data-slider-control="Dots"] {
3816
- height: calc(
3817
- 100% - calc(
3818
- var(
3819
- --_ctm-mob-dn-pn-ds-dt-se,
3820
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
3821
- ) +
3822
- 20px
3823
- )
3824
- );
2543
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-ds-dt-se,
2544
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))) + 20px));
3825
2545
  }
3826
2546
 
3827
2547
  .embla__slide {
@@ -3839,20 +2559,25 @@ $minWidth: 70px;
3839
2559
  width: 100%;
3840
2560
  justify-content: space-between;
3841
2561
  transform: translate(-50%, -50%);
2562
+
3842
2563
  // padding-left: 20px;
3843
2564
  &[data-control-type="Side"] {
2565
+
3844
2566
  .left-button,
3845
2567
  .right-button {
3846
2568
  background-color: transparent;
3847
2569
  }
3848
2570
  }
2571
+
3849
2572
  &[data-background-shape="Round"] {
2573
+
3850
2574
  .left-button,
3851
2575
  .right-button {
3852
2576
  background-color: #f2f5f5;
3853
2577
  box-sizing: 0 4px 8px rgba(0, 0, 0, 0.1);
3854
2578
  }
3855
2579
  }
2580
+
3856
2581
  &[data-control-type="Bottom-Overflow"] {
3857
2582
  transform: translateX(-50%);
3858
2583
  width: 100%;
@@ -3861,6 +2586,7 @@ $minWidth: 70px;
3861
2586
  top: unset;
3862
2587
  bottom: 6px;
3863
2588
  }
2589
+
3864
2590
  &[data-control-type="Bottom"] {
3865
2591
  transform: unset;
3866
2592
  position: static;
@@ -3869,18 +2595,15 @@ $minWidth: 70px;
3869
2595
  gap: 12px;
3870
2596
  margin-top: 10px;
3871
2597
  }
2598
+
3872
2599
  .left-button {
3873
2600
  padding: 10px;
3874
2601
  border-radius: 50%;
3875
2602
  border: none;
3876
- width: var(
3877
- --_ctm-mob-dn-pn-as-aw-se,
3878
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
3879
- );
3880
- height: var(
3881
- --_ctm-mob-dn-pn-as-aw-se,
3882
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
3883
- );
2603
+ width: var(--_ctm-mob-dn-pn-as-aw-se,
2604
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
2605
+ height: var(--_ctm-mob-dn-pn-as-aw-se,
2606
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
3884
2607
 
3885
2608
  display: flex;
3886
2609
  align-items: center;
@@ -3888,6 +2611,7 @@ $minWidth: 70px;
3888
2611
  cursor: pointer;
3889
2612
  outline: none;
3890
2613
  margin-left: 12px;
2614
+
3891
2615
  &:disabled {
3892
2616
  & svg {
3893
2617
  path {
@@ -3896,17 +2620,14 @@ $minWidth: 70px;
3896
2620
  }
3897
2621
  }
3898
2622
  }
2623
+
3899
2624
  .right-button {
3900
2625
  border-radius: 50%;
3901
2626
  border: none;
3902
- width: var(
3903
- --_ctm-mob-dn-pn-as-aw-se,
3904
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
3905
- );
3906
- height: var(
3907
- --_ctm-mob-dn-pn-as-aw-se,
3908
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
3909
- );
2627
+ width: var(--_ctm-mob-dn-pn-as-aw-se,
2628
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
2629
+ height: var(--_ctm-mob-dn-pn-as-aw-se,
2630
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
3910
2631
 
3911
2632
  display: flex;
3912
2633
  align-items: center;
@@ -3924,28 +2645,19 @@ $minWidth: 70px;
3924
2645
  }
3925
2646
  }
3926
2647
  }
2648
+
3927
2649
  .icon {
3928
2650
  display: flex;
2651
+
3929
2652
  svg {
3930
- width: calc(
3931
- var(
3932
- --_ctm-mob-dn-pn-as-aw-se,
3933
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
3934
- ) *
3935
- 0.5
3936
- );
3937
- height: calc(
3938
- var(
3939
- --_ctm-mob-dn-pn-as-aw-se,
3940
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
3941
- ) *
3942
- 0.5
3943
- );
2653
+ width: calc(var(--_ctm-mob-dn-pn-as-aw-se,
2654
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
2655
+ height: calc(var(--_ctm-mob-dn-pn-as-aw-se,
2656
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
2657
+
3944
2658
  path {
3945
- stroke: var(
3946
- --_ctm-mob-dn-pn-as-aw-cr,
3947
- var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr))
3948
- );
2659
+ stroke: var(--_ctm-mob-dn-pn-as-aw-cr,
2660
+ var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr)));
3949
2661
  }
3950
2662
  }
3951
2663
  }
@@ -3954,9 +2666,11 @@ $minWidth: 70px;
3954
2666
  &[data-thumbnail-placement="top"] {
3955
2667
  flex-direction: column-reverse;
3956
2668
  }
2669
+
3957
2670
  &[data-thumbnail-placement="bottom"] {
3958
2671
  flex-direction: column;
3959
2672
  }
2673
+
3960
2674
  &[data-thumbnail-placement="left"] {
3961
2675
  flex-direction: row-reverse;
3962
2676
 
@@ -3971,8 +2685,10 @@ $minWidth: 70px;
3971
2685
  }
3972
2686
  }
3973
2687
  }
2688
+
3974
2689
  &[data-thumbnail-placement="right"] {
3975
2690
  flex-direction: row;
2691
+
3976
2692
  .embla__thumbs {
3977
2693
  width: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
3978
2694
 
@@ -3984,15 +2700,18 @@ $minWidth: 70px;
3984
2700
  }
3985
2701
  }
3986
2702
  }
2703
+
3987
2704
  &[data-control-type="Side"] {
3988
2705
  display: flex;
3989
2706
  align-self: center;
3990
2707
  flex-direction: row;
2708
+
3991
2709
  .left-button:disabled,
3992
2710
  .right-button:disabled {
3993
2711
  display: none;
3994
2712
  }
3995
2713
  }
2714
+
3996
2715
  .embla__dots {
3997
2716
  display: flex;
3998
2717
  flex-wrap: wrap;
@@ -4009,6 +2728,7 @@ $minWidth: 70px;
4009
2728
  transform: translateX(-50%);
4010
2729
  width: 75%;
4011
2730
  }
2731
+
4012
2732
  .embla__dot {
4013
2733
  -webkit-tap-highlight-color: rgba(var(--text-high-contrast-rgb-value), 0.5);
4014
2734
  -webkit-appearance: none;
@@ -4030,6 +2750,7 @@ $minWidth: 70px;
4030
2750
  justify-content: center;
4031
2751
  border-radius: 50%;
4032
2752
  }
2753
+
4033
2754
  .embla__dot:after {
4034
2755
  // box-shadow: inset 0 0 0 0.2rem var(--detail-medium-contrast);
4035
2756
  width: var(--_ctm-dn-pn-ds-dt-se, var(--_tst-dn-pn-ds-dt-se));
@@ -4039,10 +2760,12 @@ $minWidth: 70px;
4039
2760
  align-items: center;
4040
2761
  content: "";
4041
2762
  }
2763
+
4042
2764
  .embla__dot--selected:after {
4043
2765
  box-shadow: inset 0 0 0 1px var(--text-body);
4044
2766
  background-color: var(--_ctm-dn-pn-ds-ct-dt-cr, var(--_tst-dn-pn-ds-ct-dt-cr));
4045
2767
  }
2768
+
4046
2769
  &[data-slider-control="Pagination Line"] {
4047
2770
  .embla__dot {
4048
2771
  width: var(--_ctm-dn-pn-le-le-wh, var(--_ctm-dn-pn-le-le-wh));
@@ -4051,6 +2774,7 @@ $minWidth: 70px;
4051
2774
 
4052
2775
  border-radius: 6px;
4053
2776
  }
2777
+
4054
2778
  .embla__dot--selected:after {
4055
2779
  box-shadow: inset 0 0 0 1px var(--text-body);
4056
2780
  border-radius: 6px;
@@ -4082,6 +2806,7 @@ $minWidth: 70px;
4082
2806
 
4083
2807
  overflow: hidden;
4084
2808
  }
2809
+
4085
2810
  .embla__thumbs__container {
4086
2811
  display: flex;
4087
2812
  flex-direction: row;
@@ -4095,6 +2820,7 @@ $minWidth: 70px;
4095
2820
  min-width: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
4096
2821
  max-width: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
4097
2822
  height: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
2823
+
4098
2824
  & img {
4099
2825
  width: 100%;
4100
2826
  height: 100%;
@@ -4105,4 +2831,4 @@ $minWidth: 70px;
4105
2831
  }
4106
2832
  }
4107
2833
  }
4108
- }
2834
+ }