@sc-360-v2/storefront-cms-library 0.5.58 → 0.5.60

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